Commits

Jesus Galan Lopez committed b28595b

bring index.html back to the root directory

  • Participants
  • Parent commits ecc5fde

Comments (0)

Files changed (2)

+<!doctype html>
+<html>
+<head>
+<title>It's supposed to be loud!</title>
+<script src="http://www.google.com/jsapi" type="text/javascript"></script>
+<script type="text/javascript">
+var root = "/f/";
+var path = [];
+var cache = {};
+var ntab = 0;
+var shuffle = false;
+var repeat = false;
+var $last;
+var $next;
+
+function init() {
+	$('audio').bind('ended', function(ev) {
+		var $current = $('li.current');
+	 	if ($current.hasClass('error')) $current.removeClass('error');
+		next();
+	});
+	$('audio').bind('play', function(ev) {
+	    	var $current = $('li.current');
+		var $display = $('#display #current');
+		var name = $current.data('file').Name;
+		var title = $current.attr('title');
+		document.title = name;
+		$current.removeClass('stopped');
+		$display.text(name).attr('title', title).removeClass('stopped').click(player.pause);
+	});
+	$('audio').bind('pause', function(ev) {
+	    	var $current = $('li.current');
+		var $display = $('#display #current');
+		document.title = '('+$display.text()+')';
+		$current.addClass('stopped');
+		$display.addClass('stopped');
+	});
+	$('audio').bind('error', function(ev) {
+		if($('audio').attr('src') == '')
+			return;
+		var el = $('li.current');
+		next();
+		if(el.hasClass('error')) {
+			el.remove();
+		} else {
+			el.addClass('error');
+			el.attr('title', 'Error playing '+el.data('file').Path+'/'+el.data('file').Name);
+		}
+	});
+	$('#prev').click(prev);
+	$('#current').click(toggle);
+	$('#next').click(next);
+	$('#refresh').click(refresh);
+	$('#addfiles').click(addAllFiles);
+	$('#addall').click(addAll);
+	$('#gotocurrent').click(scrollToCurrent);
+	$('#shuffle').click(toggleShuffle);
+	$('#repeat').click(toggleRepeat);
+	$('#clean').click(clean);
+	var $p = $('#songs');
+	$p.sortable({
+		tolerance: 'pointer',
+		axis: 'y',
+		update:  function (event, ui) {
+			setNext();
+		}
+	});
+	$('ul').disableSelection();
+	toggleRepeat();
+	loadFiles();
+}
+function loadFiles()  {
+	var $p = $('#parents').empty();
+	var $c = $('#cwd').empty();
+	if(path.length > 0) {
+		$('<a href="javascript:"></a>').html('&nbsp;/').click(function() {
+			path = [];
+			loadFiles();
+		}).appendTo($p);
+	}
+	for (i in path) {
+		if(i == path.length - 1) {
+			$c.text(path[i]).attr('title', path[i]);
+			continue;
+		}
+		$('<a href="javascript:"></a>').text(path[i]+"/").click( (function(ps) {
+			return function() {
+				path = ps;
+				loadFiles();
+			}
+		})(path.slice(0, Number(i) + 1))).appendTo($p);
+	}
+	$c.append('/');
+	var url = root+path.join('/');
+	if (typeof cache[url] != "undefined") {
+		populate(cache[url]);
+		return;
+	}
+	$.ajax({
+		url: url,
+		dataType: "json",
+		success: function(data) {
+			sort(data);
+			cache[url] = data;
+			populate(data)
+		}
+	});
+}
+function populate(files) {
+	var $files = $('#files').empty();
+	function add(i, f) {
+		if (f.Name[0] == '.' || f.Name[0] == ':') return;
+		var dir = f.IsDir;
+		var cl = dir ? "dir" : "file";
+		f.Path = path.join('/');
+		var $li = $('<li></li>').text(f.Name).attr('title', f.Name).data('file', f)
+			.attr('href', '#').addClass(cl).appendTo($files)
+			.click(dir?clickDir:clickFile);
+		if(dir) {
+			var $a = $('<a href="javascript:"></a>').attr('title', 'Add all')
+				.text('+').click(function(e) {
+					e.target = $li;
+					addRecursively(e);
+				}).prependTo($li);
+			$a.prependTo($li);
+		};
+	}
+	$files.append(up());
+	$.each(files, add);
+	$('#browser').scrollTop(0);
+}
+function up() {
+	if (path.length == 0)
+		return '';
+	var parent = path.slice(0, path.length-1).join('/')+'/'
+	return $('<li>..</li>').attr('title', parent).click(function() {
+		path.pop();
+		loadFiles();
+	});
+}
+function clickDir(e) {
+	if(e.button == 1) {
+		addRecursively(e);
+    	setNext();
+		return false;
+	}
+	path.push($(e.target).data('file').Name);
+	loadFiles();
+	return false;
+}
+function clickFile(e) {
+	if(e.button == 1) {
+		addAllFiles();
+		return false;
+	}
+	addToPlaylist($(e.target).data('file'));
+	setNext();
+	return false;
+}
+function refresh() {
+	cache = {};
+	loadFiles();
+}
+function addAllFiles() {
+	$('#files .file').each(function(i, e) {
+		addToPlaylist($(e).data('file'));
+	});
+}
+function addAll() {
+	$('#files li').each(function(i, e) {
+		if ($(e).hasClass('dir')) {
+			e.target = e;
+			addRecursively(e);
+		} else if ($(e).hasClass('file'))
+			addToPlaylist($(e).data('file'));
+	});
+}
+function addRecursively(e) {
+	var dir = $(e.target).data('file');
+	var files = dirFiles(dir);
+	var p = path.join('/') + '/' + dir.Name;
+	function add(i, f, path) {
+		if (f.Name[0] == '.' || f.Name[0] == ':') return;
+		f.Path = path;
+		if(f.IsDir) {
+			files = dirFiles(f);
+			var p = f.Path + '/' + f.Name;
+			$.each(files, function(i,f) {add(i,f, p)});
+		} else
+			addToPlaylist(f);
+	}
+	$.each(files, function(i,f) {add(i,f, p)});
+}
+function scrollToCurrent() {
+	$('#playlist .list').scrollTop($("li.current").position().top);
+}
+function toggleShuffle() {
+	shuffle = !shuffle;
+	if(shuffle)
+		$('#shuffle').removeClass('inactive').addClass('active');
+	else
+		$('#shuffle').removeClass('active').addClass('inactive');
+	setNext();
+}
+function toggleRepeat() {
+	repeat = !repeat;
+	if(repeat)
+		$('#repeat').removeClass('inactive').addClass('active');
+	else
+		$('#repeat').removeClass('active').addClass('inactive');
+	setNext();
+}
+function clean() {
+	$('audio').attr('src', '')
+	$('#display #current').text('');
+	$('#songs li').remove();
+	setNext();
+}
+function addToPlaylist(f) {
+	var $ul = $('#songs');
+	var playnow = ($ul.find('li').length == 0);
+	var path = f.Path+'/'+f.Name;
+	$('#help').remove();
+	var $li = $('<li></li>').text(f.Name).attr('title', path).data('file', f)
+		.appendTo($ul)
+		.attr('href', path)
+		.click(function(e) { if (e.button == 1){ next(); return;}; play(e.target); return false; });
+	var $a = $('<a href="javascript:"></a>').attr('title', 'Delete')
+		.text('-').click(function(e) {
+			if ($li.hasClass('current')) next();
+			$li.remove();
+			setNext();
+		}).prependTo($li);
+	$a.prependTo($li);
+	if (playnow) $li.click();
+}
+function setNext() {
+	if(shuffle) {
+		$songs = $('#songs li');
+		length = $songs.length;
+		$next = $songs.eq(Math.floor(Math.random() * length));
+	} else {
+		$next = $('li.current').next();
+		if($next.length == 0 && repeat) {
+			$next = $('#songs li').first();
+		}
+	}
+	if($next.length > 0) {
+		$('#next').attr('title', $next.attr('title'));
+		return;
+	}
+	if ($('#songs').find('li').length == 0) {
+		$last = '';
+		$('#prev').attr('title', '');
+	}
+	$('#next').attr('title', '');
+}
+function sort(files) {
+	files.sort(function(a, b) {
+		a = a.Name.toLowerCase();
+		b = b.Name.toLowerCase();
+		if (a > b) return 1;
+		if (a < b) return -1;
+		return 0;
+	});
+}
+function dirFiles(dir) {
+	var files = [];
+	var url = root + dir.Path + '/' + dir.Name;
+	if (typeof cache[url] != "undefined") {
+		files = cache[url];
+		return;
+	}
+	$.ajax({
+		url: url,
+		dataType: "json",
+		async: false,
+		success: function(data) {
+			cache[url] = data;
+			files = data;
+		}
+	});
+	return files;
+}
+function play(el) {
+	var name = $(el).data('file').Name;
+	var path = $(el).data('file').Path;
+	var url = root+path+'/'+name;
+	$('#songs li').removeClass('current').attr('name', '');
+	$(el).addClass('current');
+	$('audio').attr('src', url);
+	setNext();
+}
+function toggle() {
+	var player = $('audio').get()[0];
+	if(player.paused) {
+		player.play();
+		return;
+	}
+	player.pause();
+}
+function prev() {
+	if ($last.length == 0)
+		return;
+	var $next = $last;
+	$last = $('li.current')
+	play($next);
+}
+function next() {
+	var $current = $('li.current');
+	$last = $current;
+	if($last.length > 0)
+		$('#prev').attr('title', $last.attr('title'));
+	else
+		$('#prev').attr('title', '');
+	if ($next.length) {
+		play($next);
+		return;
+	}
+	$current.removeClass('current');
+	var player = $('audio').attr('src', '')[0];
+	$('#display #current').text('');
+	setNext();
+}
+google.load("jquery", "1");
+google.load("jqueryui", "1");
+google.setOnLoadCallback(init);
+</script>
+
+<style>
+html, body {
+	position: absolute;
+	width: 100%; height: 100%;
+	min-width: 40em;
+	margin: 0;
+	font-family: sans-serif;
+	font-size: 1.2em;
+}
+
+#playing {
+	position: absolute;
+	top: 0; left: 0;
+	width: 100%; height: 4.5em;
+	background: black;
+	line-height: 4.5em; 
+}
+#player {
+	width: 30%; height: 3em;
+}
+#display {
+	position: absolute;
+	top:0; left:30%;
+	overflow: hidden;
+	width: 70%; height: 4em;
+}
+#current {
+	float:left;
+	max-width:80%;
+	overflow-x: hidden; white-space: nowrap;text-overflow: ellipsis;
+	font-size: 1.6em; font-weight: bold;
+	cursor: pointer;
+	color: white;
+}
+#current.stopped {
+	color: #999;
+}
+.button {
+	float:left;
+	width: 10%;
+	cursor: pointer;
+	text-align: center; font-size: 3em;
+}
+#display:hover .button {
+	color: #666;
+}
+#display:hover .button:hover {
+	color: white;
+}
+#longernext {
+	position: absolute;
+	top: 0;
+	width: 100%; height: 100%;
+}
+
+#lists {
+	position: absolute;
+	top: 4.95em; left: 0; right: 0; bottom: 0;
+	font-size: 0.9em;
+}
+.listctrl {
+	position: absolute;
+	top: 0em;
+	width: 100%; height: 1.5em;
+	padding: 0; margin: 0;
+	line-height: 1.5em;
+	text-align: right;
+	font-size: 0.9em;
+	background: whitesmoke;
+	border-bottom: solid 1px #ccc;
+	color: #666;
+}
+.listctrl a:hover {
+	border-bottom: solid 1px black;
+	color: black;
+}
+.listctrl .mainop {
+	position: absolute;
+	left: 0; right: 20ex;
+	text-align: right;
+}
+.listctrl .listop {
+	display: inline-block;
+	left: 0;
+	width: 10ex; height: 100%;
+	text-align: center;
+}
+.listctrl .inactive {
+	text-decoration: line-through;
+}
+.listctrl .active, .listctrl a.active:hover {
+	color: blue;
+}
+.list {
+	position: absolute;
+	top: 1.4em; left: 0; bottom: 0;
+	width: 100%;
+	overflow-y: auto;
+}
+.list li:hover {
+	background: #ebeff9;
+}
+#filelist {
+	position: absolute;
+	bottom: 0;
+	width: 40%; height: 100%;
+}
+#path {
+	position: absolute;
+	width:100%; height: 3.2em;
+	background: #ebeff9;
+}
+#parents {
+	float: right;
+	min-width: 98%; min-height: 1em;
+	margin-right: 1%; padding: 0.3ex;
+	overflow-x: hidden; white-space: nowrap;
+	font-size: 0.8em;
+	color: blue;
+}
+#parents a:hover {
+	text-decoration: underline;
+}
+#parents a:first-child {
+	padding-left: 1.5em;
+}
+#cwd {
+	width: 96%;
+	padding: 0 2%; margin: 0;
+	overflow-x: hidden; white-space: nowrap;text-overflow: ellipsis;
+	font-size: 1.2em; font-weight: bold;
+}
+#filelist div.listctrl {
+	top: 3.2em;
+	border-top: solid 1px #ccc;
+}
+#browser.list {
+	top: 4.33em;
+	color: blue;
+}
+#files li.dir {
+	text-decoration: underline;
+}
+#files a, #songs a {
+	display: inline-block;
+	position: relative;
+	left: -0.5em;
+	width: 1em;
+	text-align: center;
+	font-weight: bold;
+}
+li.file {
+	padding-left: 1.5em;
+}
+li.dir a {
+	color: #ccc;
+}
+li.dir:hover a {
+	color: inherit;
+}
+li.dir a:hover {
+	background: blue;
+	color: white;
+}
+#playlist {
+	position: absolute;
+	top: 0; left: 40%; right: 0; bottom: 0;
+	border-left: solid 1px #ccc;
+}
+#playlist .listctrl .mainop {
+	right: 30ex;
+}
+#songs li {
+	font-size: 1.15em;
+	border: solid 1px transparent;
+}
+#songs li:hover {
+	background: whitesmoke;
+	border: solid 1px #ccc;
+}
+#songs .current {
+	font-weight: bold;
+	color: blue;
+}
+#songs .current.stopped {
+	color: black;
+}
+#songs .error, #songs .error:hover {
+	text-decoration: line-through;
+}
+#songs li a {
+	color: #ccc;
+}
+#songs li:hover a {
+	color: inherit;
+}
+#songs li a:hover {
+	background: black;
+	color: white;
+}
+#credits {
+	position: fixed;
+	top: 0.2ex;
+	right: 0.4ex;
+	font-size: 0.5em; font-weight: bold;
+	color: #ccc;
+}
+#help {
+	margin: 1em;
+}
+#help a {
+	text-decoration: underline;;
+	color: blue;
+}
+ul {
+	position: relative;
+	padding: 0.5ex; padding-left: 1ex; margin: 0;
+	list-style-type: none;
+}
+li {
+	cursor: pointer;
+	padding-left: 0.5em;
+	overflow-x: hidden; white-space: nowrap;text-overflow: ellipsis;
+}
+a {
+	text-decoration: none;
+	color: inherit;
+}
+</style>
+</head>
+<body>
+
+<div id="playing">
+  <audio id="player" controls autoplay autobuffer>
+    <p>What? Your browser doesn't support &lt;audio&gt;?! Lame.</p>
+  </audio>
+  <div id="display">
+    <div id="prev" class="button">&lt;</div>
+    <div id="current">Lemmy</div>
+    <div id="next" class="button">&gt;<div id="longernext"></div></div>
+  </div>
+</div>
+
+<div id="lists">
+  <div id="filelist">
+    <div id="path">
+      <div id="parents"></div>
+      <div id="cwd"></div>
+    </div>
+    <div class="listctrl">
+      <a id="refresh" class="mainop" href="#"><div class="listop" href="#">Refresh</div></a>
+      <a id="addfiles" class="listop" href="#">Add files</a><!--
+      --><a id="addall" class="listop" href="#">Add all</a>
+    </div>
+    <div id="browser" class="list">
+      <ul id="files"></ul>
+    </div>
+  </div>
+  <div id="playlist">
+    <div class="listctrl">
+      <a id="gotocurrent" class="mainop" href="#"><div class="listop" href="#">Current</div></a>
+      <a id="shuffle" class="listop inactive" href="#">Shuffle</a><!--
+      --><a id="repeat" class="listop inactive" href="#">Repeat</a><!--
+      --><a id="clean" class="listop" href="#">Clean</a>
+    </div>
+    <div class="list">
+      <div id="help">
+<a href="http://en.wikipedia.org/wiki/Lemmy">Lemmy</a> plays music.
+<h2>Help</h2>
+<h3>Browser window</h3>
+<p>B1 opens directories and add files to the playlist. B2 on a directory adds its contents to
+the playlist recursively (like <em>Add all</em> and the plus symbol at the left of the directory name).
+B2 on a file adds all the individual files in the current directory to the playlist (<em>Add files</em>).
+</p>
+<h3>Playing</h3>
+<p>A click on the song title pauses / continues the reproduction of that file. The <em>&lt;</em>
+and <em>&gt;</em> symbols are used to play the last played song or the next one.</p>
+<h3>Playlist</h3>
+<p>B1 selects a file and plays it, B2 will play the next file (like the <em>&gt;</em> symbol in
+the player controls). Files can be deleted using the minus symbols at the left of the names.</p>
+<p>If <em>Shuffle</em> is selected files are played in random order. If <em>Repeat</em>
+is selected, they are played continuously, restarting the playlist once it is finished.</p>
+<h2>Source</h2>
+<p>Lemmy is free software:</p>
+<a href="http://bitbucket.org/yiyus/lemmy">http://bitbucket.org/yiyus/lemmy</a>
+<p>Originally based on <a href="https://github.com/nf/goplayer">GoPlayer</a> by Andrew Gerrand.</p>
+<hr>
+<h6>JGL(<a href="http://yiyus.info">yy</a>). 2012</h6>
+     </div>
+      <ul id="songs"></ul>
+    </div>
+  </div>
+</div>
+
+<div id="credits"><a href="http://bitbucket.org/yiyus/lemmy">Lemmy</a></div>
+
+</body>
+</html>

File web/index.html

-<!doctype html>
-<html>
-<head>
-<title>It's supposed to be loud!</title>
-<script src="http://www.google.com/jsapi" type="text/javascript"></script>
-<script type="text/javascript">
-var root = "/f/";
-var path = [];
-var cache = {};
-var ntab = 0;
-var shuffle = false;
-var repeat = false;
-var $last;
-var $next;
-
-function init() {
-	$('audio').bind('ended', function(ev) {
-		var $current = $('li.current');
-	 	if ($current.hasClass('error')) $current.removeClass('error');
-		next();
-	});
-	$('audio').bind('play', function(ev) {
-	    	var $current = $('li.current');
-		var $display = $('#display #current');
-		var name = $current.data('file').Name;
-		var title = $current.attr('title');
-		document.title = name;
-		$current.removeClass('stopped');
-		$display.text(name).attr('title', title).removeClass('stopped').click(player.pause);
-	});
-	$('audio').bind('pause', function(ev) {
-	    	var $current = $('li.current');
-		var $display = $('#display #current');
-		document.title = '('+$display.text()+')';
-		$current.addClass('stopped');
-		$display.addClass('stopped');
-	});
-	$('audio').bind('error', function(ev) {
-		if($('audio').attr('src') == '')
-			return;
-		var el = $('li.current');
-		next();
-		if(el.hasClass('error')) {
-			el.remove();
-		} else {
-			el.addClass('error');
-			el.attr('title', 'Error playing '+el.data('file').Path+'/'+el.data('file').Name);
-		}
-	});
-	$('#prev').click(prev);
-	$('#current').click(toggle);
-	$('#next').click(next);
-	$('#refresh').click(refresh);
-	$('#addfiles').click(addAllFiles);
-	$('#addall').click(addAll);
-	$('#gotocurrent').click(scrollToCurrent);
-	$('#shuffle').click(toggleShuffle);
-	$('#repeat').click(toggleRepeat);
-	$('#clean').click(clean);
-	var $p = $('#songs');
-	$p.sortable({
-		tolerance: 'pointer',
-		axis: 'y',
-		update:  function (event, ui) {
-			setNext();
-		}
-	});
-	$('ul').disableSelection();
-	toggleRepeat();
-	loadFiles();
-}
-function loadFiles()  {
-	var $p = $('#parents').empty();
-	var $c = $('#cwd').empty();
-	if(path.length > 0) {
-		$('<a href="javascript:"></a>').html('&nbsp;/').click(function() {
-			path = [];
-			loadFiles();
-		}).appendTo($p);
-	}
-	for (i in path) {
-		if(i == path.length - 1) {
-			$c.text(path[i]).attr('title', path[i]);
-			continue;
-		}
-		$('<a href="javascript:"></a>').text(path[i]+"/").click( (function(ps) {
-			return function() {
-				path = ps;
-				loadFiles();
-			}
-		})(path.slice(0, Number(i) + 1))).appendTo($p);
-	}
-	$c.append('/');
-	var url = root+path.join('/');
-	if (typeof cache[url] != "undefined") {
-		populate(cache[url]);
-		return;
-	}
-	$.ajax({
-		url: url,
-		dataType: "json",
-		success: function(data) {
-			sort(data);
-			cache[url] = data;
-			populate(data)
-		}
-	});
-}
-function populate(files) {
-	var $files = $('#files').empty();
-	function add(i, f) {
-		if (f.Name[0] == '.' || f.Name[0] == ':') return;
-		var dir = f.IsDir;
-		var cl = dir ? "dir" : "file";
-		f.Path = path.join('/');
-		var $li = $('<li></li>').text(f.Name).attr('title', f.Name).data('file', f)
-			.attr('href', '#').addClass(cl).appendTo($files)
-			.click(dir?clickDir:clickFile);
-		if(dir) {
-			var $a = $('<a href="javascript:"></a>').attr('title', 'Add all')
-				.text('+').click(function(e) {
-					e.target = $li;
-					addRecursively(e);
-				}).prependTo($li);
-			$a.prependTo($li);
-		};
-	}
-	$files.append(up());
-	$.each(files, add);
-	$('#browser').scrollTop(0);
-}
-function up() {
-	if (path.length == 0)
-		return '';
-	var parent = path.slice(0, path.length-1).join('/')+'/'
-	return $('<li>..</li>').attr('title', parent).click(function() {
-		path.pop();
-		loadFiles();
-	});
-}
-function clickDir(e) {
-	if(e.button == 1) {
-		addRecursively(e);
-    	setNext();
-		return false;
-	}
-	path.push($(e.target).data('file').Name);
-	loadFiles();
-	return false;
-}
-function clickFile(e) {
-	if(e.button == 1) {
-		addAllFiles();
-		return false;
-	}
-	addToPlaylist($(e.target).data('file'));
-	setNext();
-	return false;
-}
-function refresh() {
-	cache = {};
-	loadFiles();
-}
-function addAllFiles() {
-	$('#files .file').each(function(i, e) {
-		addToPlaylist($(e).data('file'));
-	});
-}
-function addAll() {
-	$('#files li').each(function(i, e) {
-		if ($(e).hasClass('dir')) {
-			e.target = e;
-			addRecursively(e);
-		} else if ($(e).hasClass('file'))
-			addToPlaylist($(e).data('file'));
-	});
-}
-function addRecursively(e) {
-	var dir = $(e.target).data('file');
-	var files = dirFiles(dir);
-	var p = path.join('/') + '/' + dir.Name;
-	function add(i, f, path) {
-		if (f.Name[0] == '.' || f.Name[0] == ':') return;
-		f.Path = path;
-		if(f.IsDir) {
-			files = dirFiles(f);
-			var p = f.Path + '/' + f.Name;
-			$.each(files, function(i,f) {add(i,f, p)});
-		} else
-			addToPlaylist(f);
-	}
-	$.each(files, function(i,f) {add(i,f, p)});
-}
-function scrollToCurrent() {
-	$('#playlist .list').scrollTop($("li.current").position().top);
-}
-function toggleShuffle() {
-	shuffle = !shuffle;
-	if(shuffle)
-		$('#shuffle').removeClass('inactive').addClass('active');
-	else
-		$('#shuffle').removeClass('active').addClass('inactive');
-	setNext();
-}
-function toggleRepeat() {
-	repeat = !repeat;
-	if(repeat)
-		$('#repeat').removeClass('inactive').addClass('active');
-	else
-		$('#repeat').removeClass('active').addClass('inactive');
-	setNext();
-}
-function clean() {
-	$('audio').attr('src', '')
-	$('#display #current').text('');
-	$('#songs li').remove();
-	setNext();
-}
-function addToPlaylist(f) {
-	var $ul = $('#songs');
-	var playnow = ($ul.find('li').length == 0);
-	var path = f.Path+'/'+f.Name;
-	$('#help').remove();
-	var $li = $('<li></li>').text(f.Name).attr('title', path).data('file', f)
-		.appendTo($ul)
-		.attr('href', path)
-		.click(function(e) { if (e.button == 1){ next(); return;}; play(e.target); return false; });
-	var $a = $('<a href="javascript:"></a>').attr('title', 'Delete')
-		.text('-').click(function(e) {
-			if ($li.hasClass('current')) next();
-			$li.remove();
-			setNext();
-		}).prependTo($li);
-	$a.prependTo($li);
-	if (playnow) $li.click();
-}
-function setNext() {
-	if(shuffle) {
-		$songs = $('#songs li');
-		length = $songs.length;
-		$next = $songs.eq(Math.floor(Math.random() * length));
-	} else {
-		$next = $('li.current').next();
-		if($next.length == 0 && repeat) {
-			$next = $('#songs li').first();
-		}
-	}
-	if($next.length > 0) {
-		$('#next').attr('title', $next.attr('title'));
-		return;
-	}
-	if ($('#songs').find('li').length == 0) {
-		$last = '';
-		$('#prev').attr('title', '');
-	}
-	$('#next').attr('title', '');
-}
-function sort(files) {
-	files.sort(function(a, b) {
-		a = a.Name.toLowerCase();
-		b = b.Name.toLowerCase();
-		if (a > b) return 1;
-		if (a < b) return -1;
-		return 0;
-	});
-}
-function dirFiles(dir) {
-	var files = [];
-	var url = root + dir.Path + '/' + dir.Name;
-	if (typeof cache[url] != "undefined") {
-		files = cache[url];
-		return;
-	}
-	$.ajax({
-		url: url,
-		dataType: "json",
-		async: false,
-		success: function(data) {
-			cache[url] = data;
-			files = data;
-		}
-	});
-	return files;
-}
-function play(el) {
-	var name = $(el).data('file').Name;
-	var path = $(el).data('file').Path;
-	var url = root+path+'/'+name;
-	$('#songs li').removeClass('current').attr('name', '');
-	$(el).addClass('current');
-	$('audio').attr('src', url);
-	setNext();
-}
-function toggle() {
-	var player = $('audio').get()[0];
-	if(player.paused) {
-		player.play();
-		return;
-	}
-	player.pause();
-}
-function prev() {
-	if ($last.length == 0)
-		return;
-	var $next = $last;
-	$last = $('li.current')
-	play($next);
-}
-function next() {
-	var $current = $('li.current');
-	$last = $current;
-	if($last.length > 0)
-		$('#prev').attr('title', $last.attr('title'));
-	else
-		$('#prev').attr('title', '');
-	if ($next.length) {
-		play($next);
-		return;
-	}
-	$current.removeClass('current');
-	var player = $('audio').attr('src', '')[0];
-	$('#display #current').text('');
-	setNext();
-}
-google.load("jquery", "1");
-google.load("jqueryui", "1");
-google.setOnLoadCallback(init);
-</script>
-
-<style>
-html, body {
-	position: absolute;
-	width: 100%; height: 100%;
-	min-width: 40em;
-	margin: 0;
-	font-family: sans-serif;
-	font-size: 1.2em;
-}
-
-#playing {
-	position: absolute;
-	top: 0; left: 0;
-	width: 100%; height: 4.5em;
-	background: black;
-	line-height: 4.5em; 
-}
-#player {
-	width: 30%; height: 3em;
-}
-#display {
-	position: absolute;
-	top:0; left:30%;
-	overflow: hidden;
-	width: 70%; height: 4em;
-}
-#current {
-	float:left;
-	max-width:80%;
-	overflow-x: hidden; white-space: nowrap;text-overflow: ellipsis;
-	font-size: 1.6em; font-weight: bold;
-	cursor: pointer;
-	color: white;
-}
-#current.stopped {
-	color: #999;
-}
-.button {
-	float:left;
-	width: 10%;
-	cursor: pointer;
-	text-align: center; font-size: 3em;
-}
-#display:hover .button {
-	color: #666;
-}
-#display:hover .button:hover {
-	color: white;
-}
-#longernext {
-	position: absolute;
-	top: 0;
-	width: 100%; height: 100%;
-}
-
-#lists {
-	position: absolute;
-	top: 4.95em; left: 0; right: 0; bottom: 0;
-	font-size: 0.9em;
-}
-.listctrl {
-	position: absolute;
-	top: 0em;
-	width: 100%; height: 1.5em;
-	padding: 0; margin: 0;
-	line-height: 1.5em;
-	text-align: right;
-	font-size: 0.9em;
-	background: whitesmoke;
-	border-bottom: solid 1px #ccc;
-	color: #666;
-}
-.listctrl a:hover {
-	border-bottom: solid 1px black;
-	color: black;
-}
-.listctrl .mainop {
-	position: absolute;
-	left: 0; right: 20ex;
-	text-align: right;
-}
-.listctrl .listop {
-	display: inline-block;
-	left: 0;
-	width: 10ex; height: 100%;
-	text-align: center;
-}
-.listctrl .inactive {
-	text-decoration: line-through;
-}
-.listctrl .active, .listctrl a.active:hover {
-	color: blue;
-}
-.list {
-	position: absolute;
-	top: 1.4em; left: 0; bottom: 0;
-	width: 100%;
-	overflow-y: auto;
-}
-.list li:hover {
-	background: #ebeff9;
-}
-#filelist {
-	position: absolute;
-	bottom: 0;
-	width: 40%; height: 100%;
-}
-#path {
-	position: absolute;
-	width:100%; height: 3.2em;
-	background: #ebeff9;
-}
-#parents {
-	float: right;
-	min-width: 98%; min-height: 1em;
-	margin-right: 1%; padding: 0.3ex;
-	overflow-x: hidden; white-space: nowrap;
-	font-size: 0.8em;
-	color: blue;
-}
-#parents a:hover {
-	text-decoration: underline;
-}
-#parents a:first-child {
-	padding-left: 1.5em;
-}
-#cwd {
-	width: 96%;
-	padding: 0 2%; margin: 0;
-	overflow-x: hidden; white-space: nowrap;text-overflow: ellipsis;
-	font-size: 1.2em; font-weight: bold;
-}
-#filelist div.listctrl {
-	top: 3.2em;
-	border-top: solid 1px #ccc;
-}
-#browser.list {
-	top: 4.33em;
-	color: blue;
-}
-#files li.dir {
-	text-decoration: underline;
-}
-#files a, #songs a {
-	display: inline-block;
-	position: relative;
-	left: -0.5em;
-	width: 1em;
-	text-align: center;
-	font-weight: bold;
-}
-li.file {
-	padding-left: 1.5em;
-}
-li.dir a {
-	color: #ccc;
-}
-li.dir:hover a {
-	color: inherit;
-}
-li.dir a:hover {
-	background: blue;
-	color: white;
-}
-#playlist {
-	position: absolute;
-	top: 0; left: 40%; right: 0; bottom: 0;
-	border-left: solid 1px #ccc;
-}
-#playlist .listctrl .mainop {
-	right: 30ex;
-}
-#songs li {
-	font-size: 1.15em;
-	border: solid 1px transparent;
-}
-#songs li:hover {
-	background: whitesmoke;
-	border: solid 1px #ccc;
-}
-#songs .current {
-	font-weight: bold;
-	color: blue;
-}
-#songs .current.stopped {
-	color: black;
-}
-#songs .error, #songs .error:hover {
-	text-decoration: line-through;
-}
-#songs li a {
-	color: #ccc;
-}
-#songs li:hover a {
-	color: inherit;
-}
-#songs li a:hover {
-	background: black;
-	color: white;
-}
-#credits {
-	position: fixed;
-	top: 0.2ex;
-	right: 0.4ex;
-	font-size: 0.5em; font-weight: bold;
-	color: #ccc;
-}
-#help {
-	margin: 1em;
-}
-#help a {
-	text-decoration: underline;;
-	color: blue;
-}
-ul {
-	position: relative;
-	padding: 0.5ex; padding-left: 1ex; margin: 0;
-	list-style-type: none;
-}
-li {
-	cursor: pointer;
-	padding-left: 0.5em;
-	overflow-x: hidden; white-space: nowrap;text-overflow: ellipsis;
-}
-a {
-	text-decoration: none;
-	color: inherit;
-}
-</style>
-</head>
-<body>
-
-<div id="playing">
-  <audio id="player" controls autoplay autobuffer>
-    <p>What? Your browser doesn't support &lt;audio&gt;?! Lame.</p>
-  </audio>
-  <div id="display">
-    <div id="prev" class="button">&lt;</div>
-    <div id="current">Lemmy</div>
-    <div id="next" class="button">&gt;<div id="longernext"></div></div>
-  </div>
-</div>
-
-<div id="lists">
-  <div id="filelist">
-    <div id="path">
-      <div id="parents"></div>
-      <div id="cwd"></div>
-    </div>
-    <div class="listctrl">
-      <a id="refresh" class="mainop" href="#"><div class="listop" href="#">Refresh</div></a>
-      <a id="addfiles" class="listop" href="#">Add files</a><!--
-      --><a id="addall" class="listop" href="#">Add all</a>
-    </div>
-    <div id="browser" class="list">
-      <ul id="files"></ul>
-    </div>
-  </div>
-  <div id="playlist">
-    <div class="listctrl">
-      <a id="gotocurrent" class="mainop" href="#"><div class="listop" href="#">Current</div></a>
-      <a id="shuffle" class="listop inactive" href="#">Shuffle</a><!--
-      --><a id="repeat" class="listop inactive" href="#">Repeat</a><!--
-      --><a id="clean" class="listop" href="#">Clean</a>
-    </div>
-    <div class="list">
-      <div id="help">
-<a href="http://en.wikipedia.org/wiki/Lemmy">Lemmy</a> plays music.
-<h2>Help</h2>
-<h3>Browser window</h3>
-<p>B1 opens directories and add files to the playlist. B2 on a directory adds its contents to
-the playlist recursively (like <em>Add all</em> and the plus symbol at the left of the directory name).
-B2 on a file adds all the individual files in the current directory to the playlist (<em>Add files</em>).
-</p>
-<h3>Playing</h3>
-<p>A click on the song title pauses / continues the reproduction of that file. The <em>&lt;</em>
-and <em>&gt;</em> symbols are used to play the last played song or the next one.</p>
-<h3>Playlist</h3>
-<p>B1 selects a file and plays it, B2 will play the next file (like the <em>&gt;</em> symbol in
-the player controls). Files can be deleted using the minus symbols at the left of the names.</p>
-<p>If <em>Shuffle</em> is selected files are played in random order. If <em>Repeat</em>
-is selected, they are played continuously, restarting the playlist once it is finished.</p>
-<h2>Source</h2>
-<p>Lemmy is free software:</p>
-<a href="http://bitbucket.org/yiyus/lemmy">http://bitbucket.org/yiyus/lemmy</a>
-<p>Originally based on <a href="https://github.com/nf/goplayer">GoPlayer</a> by Andrew Gerrand.</p>
-<hr>
-<h6>JGL(<a href="http://yiyus.info">yy</a>). 2012</h6>
-     </div>
-      <ul id="songs"></ul>
-    </div>
-  </div>
-</div>
-
-<div id="credits"><a href="http://bitbucket.org/yiyus/lemmy">Lemmy</a></div>
-
-</body>
-</html>