diff options
| -rwxr-xr-x | app.py | 9 | ||||
| -rw-r--r-- | db.py | 7 | ||||
| -rw-r--r-- | static/icons/control_pause_blue.png | bin | 0 -> 721 bytes | |||
| -rw-r--r-- | static/icons/control_play_blue.png | bin | 0 -> 717 bytes | |||
| -rw-r--r-- | static/index.html | 8 | ||||
| -rw-r--r-- | static/init.js | 63 |
6 files changed, 72 insertions, 15 deletions
@@ -5,12 +5,13 @@ from config import config class JSONApplication(object): def list(self, environ, start_response, path): - root = os.path.join(config.get('music_root'), '/'.join(path[1:])) - if root[-1] == '/': - root = root[:-1] + root_id = int(path[1]) if len(path[1]) else 0 session = db.Session() try: - directory = db.Directory.get(session, root) + if root_id > 0: + directory = db.Directory.get_by_id(session, root_id) + else: + directory = db.Directory.get(session, config.get('music_root')) directories = directory.children tracks = directory.tracks contents = json.dumps([x.dict() for x in directories] + @@ -38,11 +38,18 @@ class Directory(Base): session.commit() return directory + @staticmethod + def get_by_id(session, id): + return session.query(Directory).filter(Directory.id == id).one() + def get_relpath(self): return os.path.relpath(self.path, config.get('music_root')) def dict(self): + # FIXME: Recursively returns all parents, this is not very efficient. return { + 'id': self.id, + 'parent': self.parent.dict() if self.parent else None, 'type': 'dir', 'name': self.get_relpath(), 'metadata': {}, diff --git a/static/icons/control_pause_blue.png b/static/icons/control_pause_blue.png Binary files differnew file mode 100644 index 0000000..ec61099 --- /dev/null +++ b/static/icons/control_pause_blue.png diff --git a/static/icons/control_play_blue.png b/static/icons/control_play_blue.png Binary files differnew file mode 100644 index 0000000..f8c8ec6 --- /dev/null +++ b/static/icons/control_play_blue.png diff --git a/static/index.html b/static/index.html index 47f7e70..6adf3eb 100644 --- a/static/index.html +++ b/static/index.html @@ -9,10 +9,14 @@ </head> <body> <div id="content"> - <ul id="directory-list"> - </ul> <span id="status"> </span> + <div id="control"> + <a href="javascript:play()"><img src="/static/icons/control_play_blue.png" alt="Play" /></a> + <a href="javascript:pause()"><img src="/static/icons/control_pause_blue.png" alt="Play" /></a> + </div> + <ul id="directory-list"> + </ul> </div> </body> </html> diff --git a/static/init.js b/static/init.js index 6ec2725..fc8e800 100644 --- a/static/init.js +++ b/static/init.js @@ -1,20 +1,51 @@ soundManager.useHTML5Audio = true; soundManager.preferFlash = false; -$(document).ready(function() { - $.get('/json/list', function(data) { +var sound = null; + +function play() { + if(sound) + sound.play(); +} + +function pause() { + if(sound) + sound.togglePause(); +} + +function load_directory(dir_id, dir_item) { + $.get('/json/list/' + dir_id, function(data) { var dir_list = $('#directory-list'); - $.each(data, function(i, item) { + dir_list.html(''); + if(dir_item && dir_item.parent) { dir_list.append($('<li></li>') - .text(item.name) - .addClass(item.type) - .click(function() { + .addClass('dir') + .append($('<a></a>') + .attr('href', '#') + .text('..') + .click(function() { + load_directory(dir_item.parent.id, dir_item.parent); + return false; + }) + ) + ); + } + $.each(data, function(i, item) { + var a = $('<a></a>').attr('href', '#').text(item.name); + if(item.type == "track") { + a.click(function() { console.log(item); - var sound = soundManager.createSound({ + if(sound) { + sound.destruct(); + } + sound = soundManager.createSound({ id: 'audio', url: '/track/' + item.id, + whileloading: function() { + $('#status').text('Loading... ' + this.bytesLoaded); + }, whileplaying: function() { - var seconds = (sound.position / 1000).toFixed(0); + var seconds = (this.position / 1000).toFixed(0); var minutes = Math.floor(seconds / 60).toFixed(0); seconds %= 60; if(seconds < 10) @@ -24,8 +55,22 @@ $(document).ready(function() { } }); sound.play(); - }) + return false; + }); + } else if(item.type == "dir") { + a.click(function() { + load_directory(item.id, item); + return false; + }); + } + dir_list.append($('<li></li>') + .addClass(item.type) + .append(a) ); }); }); +} + +$(document).ready(function() { + load_directory(0); }); |
