summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--static/audio.js3
-rw-r--r--static/index.html6
-rw-r--r--static/player.js205
3 files changed, 111 insertions, 103 deletions
diff --git a/static/audio.js b/static/audio.js
index 6eaec56..b575fc1 100644
--- a/static/audio.js
+++ b/static/audio.js
@@ -3,6 +3,9 @@ function Audio() {
this.set_src = function(src) {
this.audio.setAttribute('src', src);
+
+ var audio_src_url = document.getElementById('audio-src-url');
+ audio_src_url.innerHTML = 'Playing: ' + src.replace('&', '&');
}
this.play = function() {
diff --git a/static/index.html b/static/index.html
index e2f2312..c1c747f 100644
--- a/static/index.html
+++ b/static/index.html
@@ -12,16 +12,16 @@
<div>
<input type="button" value="Close event source" onclick="source.close()" />
<input type="button" value="Open event source" onclick="event_open()" />
- <input type="button" value="Refresh directory" onclick="list(document.getElementById('current-dir').innerHTML.split(': ', 2)[1])" />
+ <input type="button" value="Refresh directory" onclick="browser.list(document.getElementById('current-dir').innerHTML.split(': ', 2)[1])" />
</div>
<div id="search-div">
- <input type="text" id="search-query" onkeypress="do_search(event)" />
+ <input type="text" id="search-query" onkeypress="browser.do_search(event)" />
</div>
<div id="current-dir"></div>
<div id="hpanel">
<span "browser-span">
<span class="list-header">Browse directory</span>
- <a href="#" onclick="add_directory(); return false" id="add-dir">Add all</a>
+ <a href="#" onclick="browser.add_directory(); return false" id="add-dir">Add all</a>
<ul id="song-links"></ul>
</span>
<span id="playlist-span">
diff --git a/static/player.js b/static/player.js
index eedb943..2c56f5b 100644
--- a/static/player.js
+++ b/static/player.js
@@ -71,7 +71,7 @@ function MusicListing(type, path, name, track, metadata, cached) {
a.onclick = function() {
if(type == 'dir') {
- list(path);
+ browser.list(path);
} else if(type == 'file') {
playlist.add(ml);
}
@@ -81,131 +81,132 @@ function MusicListing(type, path, name, track, metadata, cached) {
}
}
-function set_current(path) {
- document.getElementById('current-dir').innerHTML = 'Directory: ' + path;
-}
-
function log(s) {
logbox = document.getElementById('logbox');
logbox.value += s + '\n';
logbox.scrollTop = logbox.scrollHeight;
}
-function change_url(url) {
- audio.set_src(url);
+function Browser(songs, current, audio) {
+ this.songs = songs;
+ this.current = current;
+ this.audio = audio;
- var audio_src_url = document.getElementById('audio-src-url');
- audio_src_url.innerHTML = 'Playing: ' + url.replace('&', '&amp;');
-}
+ this.set_current = function(path) {
+ this.current.innerHTML = 'Directory: ' + path;
+ }
-function output_link(obj) {
- var a = obj.get_anchor();
+ this.output_link = function(obj) {
+ var a = obj.get_anchor();
- var li = document.createElement('li');
- li.appendChild(a);
+ var li = document.createElement('li');
+ li.appendChild(a);
- var song_links = document.getElementById('song-links');
- song_links.appendChild(li);
-}
+ this.songs.appendChild(li);
+ }
-function output_album(album) {
- var li = document.createElement('li');
- li.setAttribute('class', 'album');
- li.appendChild(document.createTextNode(album ? album : '(No album)'));
+ this.output_album = function(album) {
+ var li = document.createElement('li');
+ li.setAttribute('class', 'album');
+ li.appendChild(document.createTextNode(album ? album : '(No album)'));
- var song_links = document.getElementById('song-links');
- song_links.appendChild(li);
-}
+ var song_links = document.getElementById('song-links');
+ song_links.appendChild(li);
+ }
-function add_results(json) {
- var lastalbum = false;
- for(var i = 0; i < json.length; i++) {
- var type = json[i]["type"];
- var path = json[i]["name"];
- var track = json[i]["track"];
- var name = path.substring(path.lastIndexOf('/')+1);
- var cached = type == "file" ? json[i]["cached"] : false;
- var metadata = json[i]["metadata"];
-
- if(type == 'file' && metadata.album != lastalbum) {
- output_album(metadata.album);
- lastalbum = metadata.album;
- }
+ this.add_results = function(json) {
+ var lastalbum = false;
+ for(var i = 0; i < json.length; i++) {
+ var type = json[i]["type"];
+ var path = json[i]["name"];
+ var track = json[i]["track"];
+ var name = path.substring(path.lastIndexOf('/')+1);
+ var cached = type == "file" ? json[i]["cached"] : false;
+ var metadata = json[i]["metadata"];
- var l = new MusicListing(type, path, name, track, metadata, cached);
- output_link(l);
+ if(type == 'file' && metadata.album != lastalbum) {
+ this.output_album(metadata.album);
+ lastalbum = metadata.album;
+ }
+
+ var l = new MusicListing(type, path, name, track, metadata, cached);
+ this.output_link(l);
+ }
+ log('add_results: ' + lastalbum);
}
- log('add_results: ' + lastalbum);
-}
-function list(root) {
- log('listing ' + root);
- var xmlhttp = new XMLHttpRequest();
- xmlhttp.onreadystatechange = function() {
- if(xmlhttp.readyState == 4) {
- set_current(root);
- var json = JSON.parse(xmlhttp.responseText);
- document.getElementById('song-links').innerHTML = '';
- // add "up" link
- if(root.length > 1) {
- up = root.substr(0, root.lastIndexOf('/'));
- if(up.length == 0)
- up = '/';
- l = new MusicListing('dir', up, '..');
- output_link(l);
+ this.list = function(root) {
+ var b = this;
+
+ log('listing ' + root);
+ var xmlhttp = new XMLHttpRequest();
+ xmlhttp.onreadystatechange = function() {
+ if(xmlhttp.readyState == 4) {
+ b.set_current(root);
+ var json = JSON.parse(xmlhttp.responseText);
+ document.getElementById('song-links').innerHTML = '';
+ // add "up" link
+ if(root.length > 1) {
+ up = root.substr(0, root.lastIndexOf('/'));
+ if(up.length == 0)
+ up = '/';
+ l = new MusicListing('dir', up, '..');
+ b.output_link(l);
+ }
+ b.add_results(json);
}
- add_results(json);
}
+
+ path = '/list?directory=' + encodeURIComponent(root);
+ xmlhttp.open('GET', path);
+ xmlhttp.send();
}
- path = '/list?directory=' + encodeURIComponent(root);
- xmlhttp.open('GET', path);
- xmlhttp.send();
-}
+ this.do_search = function(e) {
+ var b = this;
+ if(e.keyCode != 13)
+ return;
-function do_search(e) {
- if(e.keyCode != 13)
- return;
-
- var xmlhttp = new XMLHttpRequest();
- xmlhttp.onreadystatechange = function() {
- if(xmlhttp.readyState == 4) {
- var json = JSON.parse(xmlhttp.responseText);
- document.getElementById('song-links').innerHTML = '';
- output_link(new MusicListing('dir', '/', 'Go to root directory'));
- add_results(json);
+ var xmlhttp = new XMLHttpRequest();
+ xmlhttp.onreadystatechange = function() {
+ if(xmlhttp.readyState == 4) {
+ var json = JSON.parse(xmlhttp.responseText);
+ document.getElementById('song-links').innerHTML = '';
+ b.output_link(new MusicListing('dir', '/', 'Go to root directory'));
+ b.add_results(json);
+ }
}
+
+ var query = document.getElementById('search-query').value;
+ var path = '/search?query=' + encodeURIComponent(query);
+ xmlhttp.open('GET', path);
+ xmlhttp.send();
}
- var query = document.getElementById('search-query').value;
- var path = '/search?query=' + encodeURIComponent(query);
- xmlhttp.open('GET', path);
- xmlhttp.send();
-}
+ this.add_directory = function() {
+ var songs = document.getElementById('song-links').getElementsByTagName('a');
+ for(var i = 0; i < songs.length; i++) {
+ var a = songs[i];
+ log(a);
+ var ml = a.ml;
+ log(ml);
+ if(ml.type && ml.type == 'file')
+ playlist.add(ml);
+ }
+ }
-function add_directory() {
- var songs = document.getElementById('song-links').getElementsByTagName('a');
- for(var i = 0; i < songs.length; i++) {
- var a = songs[i];
- log(a);
- var ml = a.ml;
- log(ml);
- if(ml.type && ml.type == 'file')
- playlist.add(ml);
+ this.get_a = function(path, track) {
+ var as = document.getElementById('song-links').getElementsByTagName('a');
+ for(var i = 0; i < as.length; i++) {
+ var a = as[i];
+ if(a.ml.path == path && (!track || track == a.ml.track))
+ return a;
+ }
}
}
var source = null;
-function get_a(path, track) {
- var as = document.getElementById('song-links').getElementsByTagName('a');
- for(var i = 0; i < as.length; i++) {
- var a = as[i];
- if(a.ml.path == path && (!track || track == a.ml.track))
- return a;
- }
-}
-
function event_handler(event) {
data = JSON.parse(event.data);
switch(data['type']) {
@@ -217,7 +218,7 @@ function event_handler(event) {
track = data['track'];
log('track: ' + track);
// update directory browser
- var a = get_a(data['path'], track);
+ var a = browser.get_a(data['path'], track);
if(a)
a.setAttribute('class', 'file file-' + data['type']);
// update song queue
@@ -237,7 +238,7 @@ function event_handler(event) {
break;
case 'play':
log('[play] ' + data['path']);
- change_url(data['path']);
+ browser.audio.set_src(data['path']);
audio.play();
break;
default:
@@ -258,8 +259,12 @@ function event_open() {
window.onload = function() {
event_open();
+ var song_links = document.getElementById('song-links');
+ var current = document.getElementById('current-dir');
+
audio = new Audio();
- playlist = new Playlist(document.getElementById('playlist'), audio);
+ browser = new Browser(song_links, current, audio);
+ playlist = new Playlist(document.getElementById('playlist'));
audio.audio.addEventListener('ended', function() { playlist.next(); });
- list('/');
+ browser.list('/');
}