ctucx.git: webmusic-nginx

nginx xslt-based index files optimized for music, inspired by https://git.ztn.sh/zotan/webmusic

commit d1c43ca7044dcbb35733edb773a254f7829435de
parent fd0af3fa27d02f0b6084188864491a7aa41850db
Author: Leah (ctucx) <leah@ctu.cx>
Date: Sun, 7 Mar 2021 15:47:48 +0100

webmusic.js: bind to audioplayer-events just once
1 file changed, 27 insertions(+), 26 deletions(-)
M
webmusic.js
|
53
+++++++++++++++++++++++++++--------------------------
diff --git a/webmusic.js b/webmusic.js
@@ -63,6 +63,32 @@ const initState = () => {
 	document.getElementById("repeatButton").addEventListener("click", toggleRepeat)
 	document.getElementById("continuousButton").addEventListener("click", toggleContinue)
 
+	audioPlayer.addEventListener("canplay", function () {
+		audioPlayer.play();
+	});
+
+	audioPlayer.addEventListener("play", function () {
+		setPlayerState("playing");
+	});
+
+	audioPlayer.addEventListener("pause", function () {
+		setPlayerState("paused");
+	});
+
+	audioPlayer.addEventListener("error", function () {
+		setPlayerState("error loading track");
+	});
+
+	audioPlayer.addEventListener("ended", function () {
+		console.log("end track: " + index);
+		setPlayerState("idle");
+		nextTrack();
+	});
+
+	audioPlayer.addEventListener("timeupdate", function () {
+		updatePlayerState();
+	});
+
 	dirElements.forEach(function(element){
 		element.id = id++;
 	});

@@ -116,6 +142,7 @@ const updateButtonState = () => {
 
 
 const playSong = (id) => {
+	console.log("track id:" +id)
 	let element = document.getElementById(id);
 
 	if (element === null) return;

@@ -131,36 +158,10 @@ const playSong = (id) => {
 	audioPlayer.src = element.href;
 
 	setPlayerState("loading");
-	audioPlayer.load();
 
 	audioPlayer.loop = repeat;
 	
 	element.classList.add("playing");
-
-	audioPlayer.addEventListener("canplay", function () {
-		audioPlayer.play();
-	});
-
-	audioPlayer.addEventListener("play", function () {
-		setPlayerState("playing");
-	});
-
-	audioPlayer.addEventListener("pause", function () {
-		setPlayerState("paused");
-	});
-
-	audioPlayer.addEventListener("error", function () {
-		setPlayerState("error loading track");
-	});
-
-	audioPlayer.addEventListener("ended", function () {
-		setPlayerState("idle");
-		nextTrack();
-	});
-
-	audioPlayer.addEventListener("timeupdate", function () {
-		updatePlayerState();
-	});
 }
 
 const togglePlayback = () => {