player.js

   1 'use strict';
   2 var TYPES = {
   3         "FLAC": "audio/x-flac",
   4         "Vorbis": "audio/ogg",
   5         "AAC": "audio/aac",
   6         "MP3": "audio/mpeg"
   7 };
   8
   9 var audio, details, start, prev, data;
  10 var hash_to_id = {}, inhibit_handle_hash = false;
  11 var hist = []
  12
  13 function load_song (id) {
  14         audio.style.display = "inline";
  15         var song = data[id];
  16         var old_sources = document.getElementsByTagName("source");
  17         while(old_sources.length)
  18                 old_sources[0].parentNode.removeChild(old_sources[0]);
  19
  20         for (var i = 0 ; i < song.formats.length ; i++){
  21                 var source = document.createElement("source");
  22                 var type = TYPES[song.formats[i].format];
  23                 source.setAttribute("type", type);
  24                 source.setAttribute("src", song.formats[i].file);
  25                 audio.appendChild(source);
  26         }
  27
  28         details.innerHTML = "Now playing: " + song.artist + " - " + song.title;
  29         inhibit_handle_hash = true;
  30         location.hash = song.hash;
  31         inhibit_handle_hash = false;
  32         audio.load();
  33 }
  34
  35 function play_random () {
  36         start.innerHTML = "Next";
  37         var id = Math.floor(Math.random() * data.length);
  38         hist.push(id);
  39         if(hist.length > 1)
  40                 prev.disabled = false;
  41         load_song(id);
  42         audio.play();
  43 }
  44
  45 function play_random_after_error () {
  46         hist.pop(); /* Purge offending song from history */
  47         play_random();
  48 }
  49
  50 function play_prev () {
  51         hist.pop();
  52         var song = hist[hist.length - 1];
  53         console.log("Will now play: " + song)
  54         if(hist.length <= 1)
  55                 prev.disabled = true;
  56         load_song(song);
  57         audio.play();
  58 }
  59
  60 function handle_hash(first_run){
  61         if(!hash_to_id.hasOwnProperty(location.hash) || inhibit_handle_hash)
  62                 return;
  63         var id = hash_to_id[location.hash]
  64         if(first_run === true)
  65                 hist.push(id)
  66         load_song(id);
  67         start.innerHTML = "Next";
  68         audio.play();
  69 }
  70
  71 window.onload = function () {
  72         var container = document.getElementById("player");
  73         container.innerHTML = '<div id="details"></div> <button id="prev_player">Previous</button><button id="start_player">Play a random song</button> (or click a song title)<br><audio id="audio" controls></audio>';
  74         audio = document.getElementById("audio");
  75         details = document.getElementById("details");
  76         start = document.getElementById("start_player");
  77         prev  = document.getElementById("prev_player")
  78         prev.disabled = true;
  79
  80         data = [];
  81         var trs = document.querySelectorAll("tbody tr");
  82         for (var i = 0 ; i < trs.length ; i++) {
  83                 var tr = trs[i];
  84                 var song = {
  85                         "artist": tr.getElementsByClassName("artist")[0].textContent,
  86                         "title": tr.getElementsByClassName("title")[0].textContent,
  87                         "hash": tr.getElementsByTagName("a")[0].dataset.hash,
  88                         "formats": []
  89                 };
  90                 var formats = tr.getElementsByClassName("formats")[0].getElementsByTagName("a");
  91                 for (var j = 0 ; j < formats.length ; j++) {
  92                         var format = formats[j];
  93                         song.formats.push({
  94                                 "format": format.textContent,
  95                                 "file": format.getAttribute("href")
  96                         });
  97                 }
  98                 data.push(song);
  99                 hash_to_id[song.hash] = i;
 100         }
 101
 102         audio.style.display = "none";
 103         audio.addEventListener('ended', play_random);
 104         audio.addEventListener('error', play_random_after_error);
 105         start.addEventListener('click', play_random);
 106         prev.addEventListener('click', play_prev);
 107         window.onhashchange = handle_hash;
 108         handle_hash(true);
 109 };