Fix BSB audio player not advancing past first chapter
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
+19
-20
@@ -896,6 +896,10 @@ const App = () => {
|
|||||||
const [audioNarrator, setAudioNarrator] = useState('souer');
|
const [audioNarrator, setAudioNarrator] = useState('souer');
|
||||||
const [audioState, setAudioState] = useState({ status: 'idle', chapter: 0, total: 0 });
|
const [audioState, setAudioState] = useState({ status: 'idle', chapter: 0, total: 0 });
|
||||||
const audioRef = useRef(null);
|
const audioRef = useRef(null);
|
||||||
|
const audioBookRef = useRef(audioBook);
|
||||||
|
const audioNarratorRef = useRef(audioNarrator);
|
||||||
|
audioBookRef.current = audioBook;
|
||||||
|
audioNarratorRef.current = audioNarrator;
|
||||||
|
|
||||||
const playAudioChapter = async (abbrev, chapterNum, narrator) => {
|
const playAudioChapter = async (abbrev, chapterNum, narrator) => {
|
||||||
const res = await fetch(`https://bible.helloao.org/api/BSB/${abbrev}/${chapterNum}.json`);
|
const res = await fetch(`https://bible.helloao.org/api/BSB/${abbrev}/${chapterNum}.json`);
|
||||||
@@ -904,7 +908,21 @@ const App = () => {
|
|||||||
const total = data.book?.numberOfChapters ?? chapterNum;
|
const total = data.book?.numberOfChapters ?? chapterNum;
|
||||||
const url = data.thisChapterAudioLinks?.[narrator];
|
const url = data.thisChapterAudioLinks?.[narrator];
|
||||||
if (!url) throw new Error('Audio not available for this narrator');
|
if (!url) throw new Error('Audio not available for this narrator');
|
||||||
if (!audioRef.current) audioRef.current = new Audio();
|
if (!audioRef.current) {
|
||||||
|
audioRef.current = new Audio();
|
||||||
|
audioRef.current.addEventListener('ended', () => {
|
||||||
|
setAudioState((prev) => {
|
||||||
|
const nextChapter = prev.chapter + 1;
|
||||||
|
if (nextChapter > prev.total) {
|
||||||
|
return { status: 'idle', chapter: 0, total: 0 };
|
||||||
|
}
|
||||||
|
playAudioChapter(audioBookRef.current, nextChapter, audioNarratorRef.current).catch(() =>
|
||||||
|
setAudioState({ status: 'error', chapter: 0, total: 0 }),
|
||||||
|
);
|
||||||
|
return prev;
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
const audioEl = audioRef.current;
|
const audioEl = audioRef.current;
|
||||||
audioEl.src = url;
|
audioEl.src = url;
|
||||||
await audioEl.play();
|
await audioEl.play();
|
||||||
@@ -938,25 +956,6 @@ const App = () => {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
const audioEl = audioRef.current;
|
|
||||||
if (!audioEl) return undefined;
|
|
||||||
const handleEnded = () => {
|
|
||||||
setAudioState((prev) => {
|
|
||||||
const nextChapter = prev.chapter + 1;
|
|
||||||
if (nextChapter > prev.total) {
|
|
||||||
return { status: 'idle', chapter: 0, total: 0 };
|
|
||||||
}
|
|
||||||
playAudioChapter(audioBook, nextChapter, audioNarrator).catch(() =>
|
|
||||||
setAudioState({ status: 'error', chapter: 0, total: 0 }),
|
|
||||||
);
|
|
||||||
return prev;
|
|
||||||
});
|
|
||||||
};
|
|
||||||
audioEl.addEventListener('ended', handleEnded);
|
|
||||||
return () => audioEl.removeEventListener('ended', handleEnded);
|
|
||||||
}, [audioBook, audioNarrator]);
|
|
||||||
|
|
||||||
useEffect(() => () => {
|
useEffect(() => () => {
|
||||||
if (audioRef.current) {
|
if (audioRef.current) {
|
||||||
audioRef.current.pause();
|
audioRef.current.pause();
|
||||||
|
|||||||
Reference in New Issue
Block a user