Add: initial working tape-deck with 2019 mix Side A

author: Grant Shangreaux <shshoshin@protonmail.com> 2020-01-04 17:28:10 -0600
committer: Grant Shangreaux <shshoshin@protonmail.com> 2020-01-04 17:28:10 -0600
commit: f6086f86cbc23fc0db538feafdda9e020e1763c8 (patch)
tree: d4c08ac5439238e1515252843ab07196346b91b1
12 files changed, 172 insertions, 0 deletions
diff --git a/images/90s-tape.gif b/images/90s-tape.gif
new file mode 100644
index 0000000..c00fdaa
--- /dev/null
+++ b/images/90s-tape.gif
diff --git a/images/cool-deck.gif b/images/cool-deck.gif
new file mode 100644
index 0000000..a172194
--- /dev/null
+++ b/images/cool-deck.gif
diff --git a/images/grungy-deck.gif b/images/grungy-deck.gif
new file mode 100644
index 0000000..d296776
--- /dev/null
+++ b/images/grungy-deck.gif
diff --git a/images/narrow-window.gif b/images/narrow-window.gif
new file mode 100644
index 0000000..f8f04ed
--- /dev/null
+++ b/images/narrow-window.gif
diff --git a/images/side-a.jpeg b/images/side-a.jpeg
new file mode 100644
index 0000000..5c7106d
--- /dev/null
+++ b/images/side-a.jpeg
diff --git a/images/side-b.jpeg b/images/side-b.jpeg
new file mode 100644
index 0000000..8f34079
--- /dev/null
+++ b/images/side-b.jpeg
diff --git a/images/side-c.jpeg b/images/side-c.jpeg
new file mode 100644
index 0000000..5d7200a
--- /dev/null
+++ b/images/side-c.jpeg
diff --git a/images/tape-window.gif b/images/tape-window.gif
new file mode 100644
index 0000000..0a10e6c
--- /dev/null
+++ b/images/tape-window.gif
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..8236d1e
--- /dev/null
+++ b/index.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html lang=en>
+  <head>
+      <meta charset=UTF-8>
+        <title>Tapes</title>
+    </head>
+    <body>
+        <a href="tape-deck.html?side=A">
+            <img src="images/side-a.jpeg">
+        </a>
+        <a href="tape-deck.html?side=B">
+            <img src="images/side-b.jpeg">
+        </a>
+    </body>
+</html>
diff --git a/sideA.json b/sideA.json
new file mode 100644
index 0000000..15d0a78
--- /dev/null
+++ b/sideA.json
@@ -0,0 +1,100 @@
+[
+  {
+    "title": "Won't You Be My Neighbor",
+    "artist": "Mister Rogers",
+    "album": "",
+    "start": 0,
+    "link": ""
+  },
+  {
+    "title": "A Star For Kitty Opera (edit)",
+    "artist": "Mister Rogers",
+    "album": "",
+    "start": 86,
+    "link": ""
+  },
+  {
+    "title": "Kojamyk",
+    "artist": "Huun Huur Tu",
+    "album": "Altai Sayan Tandy-Uula",
+    "start": 398,
+    "link": ""
+  },
+  {
+    "title": "Kongurai",
+    "artist": "Huun Huur Tu",
+    "album": "Altai Sayan Tandy-Uula",
+    "start": 626,
+    "link": ""
+  },
+  {
+    "title": "Clouds",
+    "artist": "Hiroshi Yoshimura",
+    "album": "Music for Nine Post Cards",
+    "start": 948,
+    "link": ""
+  },
+  {
+    "title": "Maple Syrup Factory",
+    "artist": "Hiroshi Yoshimura",
+    "album": "Flora",
+    "start": 1299,
+    "link": ""
+  },
+  {
+    "title": "Signed Curtain",
+    "artist": "Matching Mole",
+    "album": "Little Red Record (1972)",
+    "start": 1597,
+    "link": ""
+  },
+  {
+    "title": "In the Mouth a Desert",
+    "artist": "Pavement",
+    "album": "Slanted and Enchanted (1992)",
+    "start": 1784,
+    "link": ""
+  },
+  {
+    "title": "Bull in the Heather",
+    "artist": "Sonic Youth",
+    "album": "Goo",
+    "start": 2009,
+    "link": ""
+  },
+  {
+    "title": "Work in This Universe",
+    "artist": "Fulflej",
+    "album": "Wack Ass Tuba Riff",
+    "start": 2191,
+    "link": ""
+  },
+  {
+    "title": "School (live)",
+    "artist": "Nirvana",
+    "album": "Muddy Banks of the Wishkah",
+    "start": 2437,
+    "link": ""
+  },
+  {
+    "title": "Inuit Drum Dancing",
+    "artist": "Gjoa Haven Drum Dance Festival",
+    "album": "",
+    "start": 2585,
+    "link": "https://youtu.be/RW0Q6d8MrqI"
+  },
+  {
+    "title": "Khoomei",
+    "artist": "Huun Huur Tu",
+    "album": "Live",
+    "start": 2840,
+    "link": ""
+  },
+  {
+    "title": "Taiga",
+    "artist": "Huun Huur Tu",
+    "album": "Live",
+    "start": 3071,
+    "link": ""
+  }
+]
+\ No newline at end of file
diff --git a/tape-deck.html b/tape-deck.html
new file mode 100644
index 0000000..3203fd4
--- /dev/null
+++ b/tape-deck.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang=en>
+    <head>
+        <meta charset=UTF-8>
+        <title>2019 Mix Side A - Winter</title>
+    </head>
+    <body>
+        <img src="images/cool-deck.gif">
+        <p id="notes"></p>
+        <script src="tape-deck.js"></script>
+    </body>
+</html>
diff --git a/tape-deck.js b/tape-deck.js
new file mode 100644
index 0000000..7d75abc
--- /dev/null
+++ b/tape-deck.js
@@ -0,0 +1,45 @@
+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}.mp3`);
+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();
+
+        sfx.onended = (event) => {
+            tape.controls = true;
+            tape.play();
+        }
+
+        function isLastTrack() {
+            return currentTrackIndex + 1 === startTimes.length;
+        }
+
+        function getTrack(time) {
+            const nextIndex = currentTrackIndex + 1
+
+            if (isLastTrack()) {
+                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;
+        });
+    });
+
author	Grant Shangreaux <shshoshin@protonmail.com>	2020-01-04 17:28:10 -0600
committer	Grant Shangreaux <shshoshin@protonmail.com>	2020-01-04 17:28:10 -0600
commit	f6086f86cbc23fc0db538feafdda9e020e1763c8 (patch)
tree	d4c08ac5439238e1515252843ab07196346b91b1