From: Marius Gavrilescu <marius@ieval.ro>
Date: Thu, 2 Apr 2015 11:29:29 +0000 (+0300)
Subject: Click song titles to play certain songs
X-Git-Tag: 0.005~4
X-Git-Url: http://git.ieval.ro/?a=commitdiff_plain;h=2e6185c6246c2e2f6fb213befc518abc33e1ee78;p=app-musicexpo.git

Click song titles to play certain songs
---

diff --git a/player.js b/player.js
index b91435e..c81e8fa 100644
--- a/player.js
+++ b/player.js
@@ -10,7 +10,7 @@ var audio, details, start, data;
 
 function load_song (id) {
 	audio.style.display = "inline";
-	var song = data.files[id];
+	var song = data[id];
 	var old_sources = document.getElementsByTagName("source");
 	while(old_sources.length)
 		old_sources[0].parentNode.removeChild(old_sources[0]);
@@ -19,7 +19,7 @@ function load_song (id) {
 		var source = document.createElement("source");
 		var type = TYPES[song.formats[i].format];
 		source.setAttribute("type", type);
-		source.setAttribute("src", data.prefix + song.formats[i].file);
+		source.setAttribute("src", song.formats[i].file);
 		audio.appendChild(source);
 	}
 
@@ -29,19 +29,46 @@ function load_song (id) {
 
 function play_random () {
 	start.innerHTML = "Next";
-	var id = Math.floor(Math.random() * data.files.length);
+	var id = Math.floor(Math.random() * data.length);
 	load_song(id);
 	audio.play();
 }
 
+function make_onclick_handler (id){
+	return function () {
+		load_song(id);
+		start.innerHTML = "Next";
+		audio.play();
+	}
+}
+
 window.onload = function () {
 	var container = document.getElementById("player");
-	container.innerHTML = '<div id="details"></div> <button id="start_player">Start player</button><br><audio id="audio" controls></audio>';
+	container.innerHTML = '<div id="details"></div> <button id="start_player">Play a random song</button> (or click a song title)<br><audio id="audio" controls></audio>';
 	audio = document.getElementById("audio");
 	details = document.getElementById("details");
 	start = document.getElementById("start_player");
 
-	data = JSON.parse(document.getElementById("json").textContent);
+	data = [];
+	var trs = document.querySelectorAll("tbody tr");
+	for (var i = 0 ; i < trs.length ; i++) {
+		var tr = trs[i];
+		var song = {
+			"artist": tr.getElementsByClassName("artist")[0].textContent,
+			"title": tr.getElementsByClassName("title")[0].textContent,
+			"formats": []
+		};
+		var formats = tr.getElementsByClassName("formats")[0].getElementsByTagName("a");
+		for (var j = 0 ; j < formats.length ; j++) {
+			var format = formats[j];
+			song.formats.push({
+				"format": format.textContent,
+				"file": format.getAttribute("href")
+			});
+		}
+		data.push(song);
+		tr.getElementsByClassName("title")[0].onclick = make_onclick_handler(i);
+	}
 
 	audio.style.display = "none";
 	audio.addEventListener('ended', play_random);