Don't preload jokes, add cancelled nut jokes

index.html

@@ -75,66 +75,29 @@
 		height="100%"
 	/>
 
-	<audio class="random-joke" preload="auto">
-		<source type="audio/mp3" src="aud/nut-joke-01.mp3">
-		<source type="audio/ogg" src="aud/nut-joke-01.ogg">
-	</audio>
-
-	<audio class="random-joke" preload="auto">
-		<source type="audio/mp3" src="aud/nut-joke-02.mp3">
-		<source type="audio/ogg" src="aud/nut-joke-02.ogg">
-	</audio>
-
-	<audio class="random-joke" preload="auto">
-		<source type="audio/mp3" src="aud/nut-joke-03.mp3">
-		<source type="audio/ogg" src="aud/nut-joke-03.ogg">
-	</audio>
-
-	<audio class="random-joke" preload="auto">
-		<source type="audio/mp3" src="aud/nut-joke-04.mp3">
-		<source type="audio/ogg" src="aud/nut-joke-04.ogg">
-	</audio>
-
-	<audio class="random-joke" preload="auto">
-		<source type="audio/mp3" src="aud/nut-joke-05.mp3">
-		<source type="audio/ogg" src="aud/nut-joke-05.ogg">
-	</audio>
-
-	<audio class="random-joke" preload="auto">
-		<source type="audio/mp3" src="aud/nut-joke-06.mp3">
-		<source type="audio/ogg" src="aud/nut-joke-06.ogg">
-	</audio>
-
-	<audio class="random-joke" preload="auto">
-		<source type="audio/mp3" src="aud/nut-joke-07.mp3">
-		<source type="audio/ogg" src="aud/nut-joke-07.ogg">
-	</audio>
-
-	<audio class="random-joke" preload="auto">
-		<source type="audio/mp3" src="aud/nut-joke-08.mp3">
-		<source type="audio/ogg" src="aud/nut-joke-08.ogg">
-	</audio>
-
-	<audio class="random-joke" preload="auto">
-		<source type="audio/mp3" src="aud/nut-joke-09.mp3">
-		<source type="audio/ogg" src="aud/nut-joke-09.ogg">
-	</audio>
-
-	<audio class="random-joke" preload="auto">
-		<source type="audio/mp3" src="aud/nut-joke-10.mp3">
-		<source type="audio/ogg" src="aud/nut-joke-10.ogg">
+	<audio id="nutaud" preload="auto">
+		<source id="nutsource-mp3" type="audio/mp3" src="aud/nut-joke-01.mp3">
+		<source id="nutsource-ogg" type="audio/ogg" src="aud/nut-joke-01.ogg">
 	</audio>
 </div>
 
 <script type="application/javascript" async>
+	const totalJokes = 16
+
+	function leftPad(num, size) {
+		let s = num + "";
+		while (s.length < size) s = "0" + s;
+		return s;
+	}
+
 	document.getElementById('nutimg').addEventListener('click', function () {
-		const list = Array.from(document.querySelectorAll('.random-joke') ?? []);
-		list.forEach(aud => {
-			aud.pause();
-			aud.currentTime = 0;
-		});
-		const selected = list[Math.floor(Math.random() * list.length)];
-		selected.play();
+		const jokeNum = Math.floor(Math.random() * totalJokes) + 2;
+		document.getElementById('nutaud').pause();
+		document.getElementById('nutaud').currentTime = 0;
+		document.getElementById('nutsource-mp3').src = `aud/nut-joke-${leftPad(jokeNum, 2)}.mp3`;
+		document.getElementById('nutsource-ogg').src = `aud/nut-joke-${leftPad(jokeNum, 2)}.ogg`;
+		document.getElementById('nutaud').load();
+		document.getElementById('nutaud').play();
 	});
 </script>