Merge pull request #1003 from Amsterdam-Music-Lab/fix/prefetch-bug

fix: do not call onNext() from within map
Amsterdam-Music-Lab · May 7, 2024 · 7fb5a5b · 7fb5a5b
2 parents 8e41da2 + aa30a98
commit 7fb5a5b
Showing 1 changed file with 18 additions and 23 deletions.
diff --git 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) {
@@ -34,26 +32,20 @@ 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)) {
-                        onNext();
-                        return undefined;
-                    }
-                    // Clear buffers if this is the first section
-                    if (index === 0) {
-                        webAudio.clearBuffers();
+                        if (index === (sections.length - 1)) {                            
+                            setAudioAvailable(true);                       
+                        }
+                        return;
                     }
 
                     // Load sections in buffer                
                     return webAudio.loadBuffer(section.id, section.url, () => {                    
                         if (index === (sections.length - 1)) {                            
-                            if (timePassed) {
-                                setAudioAvailable(true);
-                                onNext();
-                            }                        
+                            setAudioAvailable(true);                  
                         }                                        
                     });
                 })
@@ -62,18 +54,21 @@ const Preload = ({ sections, playMethod, duration, preloadMessage, pageTitle, on
                     webAudio.closeWebAudio();        
                 }
                 // Load audio until available
-                // Return remove listener   
-                return audio.loadUntilAvailable(sections[0].url, () => {
-                    setAudioAvailable(true);
-                    if (timePassed) {
-                        onNext();
-                    }
-                });            
+                // Return remove listener
+                sections.forEach((section, index) => {
+                    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 (
         <ListenFeedback