From 2c69dfeff59debcaaa42bf4cf5c7564fde6cf31d Mon Sep 17 00:00:00 2001 From: BeritJanssen Date: Mon, 6 May 2024 17:03:11 +0200 Subject: [PATCH 1/4] fix: do not call onNext() from within map --- frontend/src/components/Preload/Preload.jsx | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/frontend/src/components/Preload/Preload.jsx b/frontend/src/components/Preload/Preload.jsx index baa3b8c54..6669dc37f 100644 --- a/frontend/src/components/Preload/Preload.jsx +++ b/frontend/src/components/Preload/Preload.jsx @@ -34,13 +34,11 @@ const Preload = ({ sections, playMethod, duration, preloadMessage, pageTitle, on } if (playMethod === 'BUFFER') { - // Use Web-audio and preload sections in buffers sections.map((section, index) => { // skip Preload if the section has already been loaded in the previous action if (webAudio.checkSectionLoaded(section)) { - onNext(); - return undefined; + return true; } // Clear buffers if this is the first section if (index === 0) { @@ -57,6 +55,7 @@ const Preload = ({ sections, playMethod, duration, preloadMessage, pageTitle, on } }); }) + onNext(); } else { if (playMethod === 'EXTERNAL') { webAudio.closeWebAudio(); From 3fea439b9f1196fd5f77e5adf7588cf9826432e6 Mon Sep 17 00:00:00 2001 From: BeritJanssen Date: Tue, 7 May 2024 08:53:27 +0200 Subject: [PATCH 2/4] fix: do not call onNext from preloadResources function --- frontend/src/components/Preload/Preload.jsx | 13 ++++++++----- 1 file changed, 8 insertions(+), 5 deletions(-) diff --git a/frontend/src/components/Preload/Preload.jsx b/frontend/src/components/Preload/Preload.jsx index 6669dc37f..689107591 100644 --- a/frontend/src/components/Preload/Preload.jsx +++ b/frontend/src/components/Preload/Preload.jsx @@ -35,10 +35,15 @@ const Preload = ({ sections, playMethod, duration, preloadMessage, pageTitle, on if (playMethod === 'BUFFER') { // Use Web-audio and preload sections in buffers - sections.map((section, index) => { + sections.forEach((section, index) => { // skip Preload if the section has already been loaded in the previous action if (webAudio.checkSectionLoaded(section)) { - return true; + if (index === (sections.length - 1)) { + if (timePassed) { + setAudioAvailable(true); + } + } + return; } // Clear buffers if this is the first section if (index === 0) { @@ -46,16 +51,14 @@ const Preload = ({ sections, playMethod, duration, preloadMessage, pageTitle, on } // Load sections in buffer - return webAudio.loadBuffer(section.id, section.url, () => { + webAudio.loadBuffer(section.id, section.url, () => { if (index === (sections.length - 1)) { if (timePassed) { setAudioAvailable(true); - onNext(); } } }); }) - onNext(); } else { if (playMethod === 'EXTERNAL') { webAudio.closeWebAudio(); From 139771d8f0c99551e39a5877785b7d8af04c3fad Mon Sep 17 00:00:00 2001 From: BeritJanssen Date: Tue, 7 May 2024 10:28:07 +0200 Subject: [PATCH 3/4] code quality: remove timePassed condition --- frontend/src/components/Preload/Preload.jsx | 29 +++++++-------------- 1 file changed, 10 insertions(+), 19 deletions(-) diff --git a/frontend/src/components/Preload/Preload.jsx b/frontend/src/components/Preload/Preload.jsx index 689107591..ace85f153 100644 --- a/frontend/src/components/Preload/Preload.jsx +++ b/frontend/src/components/Preload/Preload.jsx @@ -9,13 +9,11 @@ import * as webAudio from "../../util/webAudio"; // Preload is an experiment screen that continues after a given time or after an audio file has been preloaded const Preload = ({ sections, playMethod, duration, preloadMessage, pageTitle, onNext }) => { - const [timePassed, setTimePassed] = useState(false); const [audioAvailable, setAudioAvailable] = useState(false); const [overtime, setOvertime] = useState(false); const [loaderDuration, setLoaderDuration] = useState(duration); const onTimePassed = () => { - setTimePassed(true) setLoaderDuration(0); setOvertime(true); if (audioAvailable) { @@ -39,23 +37,15 @@ const Preload = ({ sections, playMethod, duration, preloadMessage, pageTitle, on // skip Preload if the section has already been loaded in the previous action if (webAudio.checkSectionLoaded(section)) { if (index === (sections.length - 1)) { - if (timePassed) { - setAudioAvailable(true); - } + setAudioAvailable(true); } return; } - // Clear buffers if this is the first section - if (index === 0) { - webAudio.clearBuffers(); - } // Load sections in buffer - webAudio.loadBuffer(section.id, section.url, () => { + return webAudio.loadBuffer(section.id, section.url, () => { if (index === (sections.length - 1)) { - if (timePassed) { - setAudioAvailable(true); - } + setAudioAvailable(true); } }); }) @@ -65,17 +55,18 @@ const Preload = ({ sections, playMethod, duration, preloadMessage, pageTitle, on } // Load audio until available // Return remove listener - return audio.loadUntilAvailable(sections[0].url, () => { - setAudioAvailable(true); - if (timePassed) { - onNext(); + return audio.loadUntilAvailable(section.url, () => { + if (index === (sections.length - 1)) { + setAudioAvailable(true); } }); } } - preloadResources(); - }, [sections, playMethod, onNext, timePassed]); + preloadResources(); + // on destroy, clean up buffers + return webAudio.clearBuffers(); + }, [sections, playMethod, onNext]); return ( Date: Tue, 7 May 2024 11:49:18 +0200 Subject: [PATCH 4/4] fix: loop over all sections also for non-buffer loading --- frontend/src/components/Preload/Preload.jsx | 14 ++++++++------ 1 file changed, 8 insertions(+), 6 deletions(-) diff --git a/frontend/src/components/Preload/Preload.jsx b/frontend/src/components/Preload/Preload.jsx index ace85f153..5241469f9 100644 --- a/frontend/src/components/Preload/Preload.jsx +++ b/frontend/src/components/Preload/Preload.jsx @@ -54,12 +54,14 @@ const Preload = ({ sections, playMethod, duration, preloadMessage, pageTitle, on webAudio.closeWebAudio(); } // Load audio until available - // Return remove listener - return audio.loadUntilAvailable(section.url, () => { - if (index === (sections.length - 1)) { - setAudioAvailable(true); - } - }); + // Return remove listener + sections.forEach((section, index) => { + return audio.loadUntilAvailable(section.url, () => { + if (index === (sections.length - 1)) { + setAudioAvailable(true); + } + }); + }) } }