From 337dab08b623aa0f7cb9ecb112f40a3b1eaab8bb Mon Sep 17 00:00:00 2001 From: Jon Bergli Heier Date: Wed, 24 Aug 2011 18:49:29 +0200 Subject: Moved browser code to the Browser class. --- static/audio.js | 3 + static/index.html | 6 +- static/player.js | 205 ++++++++++++++++++++++++++++-------------------------- 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 @@
- +
- +
Browse directory - Add all + Add all 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('&', '&'); -} + 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('/'); } -- cgit v1.2.3