1 files changed, 43 insertions, 32 deletions
diff --git a/tape-deck.js b/tape-deck.js
index c5b8db7..a682234 100644
--- a/tape-deck.js
+++ b/tape-deck.js
@@ -1,44 +1,55 @@
 const urlParams = new URLSearchParams(window.location.search);
 const currentSide = urlParams.get("side");
-const sfx = new Audio("audio/tape-start.mp3");
 const tape = new Audio(`audio/2019-mix-side-${currentSide}.ogg`);
-let display = document.getElementById("notes");
-let currentTrackIndex = 0;
-
-fetch(`side${currentSide}.json`)
-    .then(response => response.json())
-    .then((trackData) => {
-        const startTimes = trackData.map( t => t.start );
 
-        sfx.play();
+const sfx = new Audio("audio/tape-start.mp3");
+sfx.onended = (event) => {
+    tape.play();
+}
 
-        sfx.onended = (event) => {
-            tape.controls = true;
-            tape.play();
-        }
+let display = document.getElementById("notes");
+let currentTrackIndex = 0;
+let hasStarted = false;
+
+function play() {
+    fetch(`side${currentSide}.json`)
+        .then(response => response.json())
+        .then((trackData) => {
+            if (!hasStarted) {
+                sfx.play();
+                hasStarted = true;
+
+                tape.addEventListener("timeupdate", (event) => {
+                    const time = tape.currentTime;
+                    const currentTrack = getTrack(time, currentTrackIndex, trackData);
+                    display.textContent = currentTrack.title;
+                });
+            } else {
+                tape.play();
+            }
+        });
+}
 
-        function isLastTrack() {
-            return currentTrackIndex + 1 === startTimes.length;
-        }
+function pause() {
+    tape.pause();
+}
 
-        function getTrack(time) {
-            const nextIndex = currentTrackIndex + 1
+function isLastTrack(current, tracks) {
+    return current + 1 === tracks.length;
+}
 
-            if (isLastTrack()) {
-                return trackData[trackData.length - 1];
-            } else {
-                if (time >= startTimes[nextIndex]) {
-                    currentTrackIndex = nextIndex;
-                }
+function getTrack(time, currentTrackIndex, trackData) {
+    const nextIndex = currentTrackIndex + 1
+    const startTimes = trackData.map( t => t.start );
 
-                return trackData[currentTrackIndex];
-            }
+    if (isLastTrack(currentTrackIndex, startTimes)) {
+        return trackData[trackData.length - 1];
+    } else {
+        if (time >= startTimes[nextIndex]) {
+            currentTrackIndex = nextIndex;
         }
 
+        return trackData[currentTrackIndex];
+    }
+}
 
-        tape.addEventListener("timeupdate", (event) => {
-            const time = tape.currentTime;
-            const currentTrack = getTrack(time, trackData);
-            display.textContent = currentTrack.title;
-        });
-    });