diff --git a/lib/js/neompc.js b/lib/js/neompc.js
index 5043469..e19b757 100644
--- a/lib/js/neompc.js
+++ b/lib/js/neompc.js
@@ -82,6 +82,7 @@ function update_progress(song_position, song_length) {
function hide_volume() {
$('#volume_container').hide();
$('#volume_button').css('visibility', 'visible');
+ $('#volume_button').blur();
}
function show_volume() {
@@ -113,6 +114,9 @@ $(document).ready(function(){
start: function() {
this.rel = '1';
vol_int = setInterval('ajax_control(\'volume\', new_volume);', 250);
+ if (typeof(hide_vol) != 'undefined') {
+ clearTimeout(hide_vol);
+ }
},
drag: function() {
new_volume = pos_to_volume(parseInt($('#volume_slider').css((vol_orientation == 'h' ? 'left' : 'top'))));
@@ -121,7 +125,7 @@ $(document).ready(function(){
stop: function() {
clearInterval(vol_int);
ajax_control('volume', new_volume);
- setTimeout('hide_volume(); $(\'#volume_slider\').attr(\'rel\', \'\');', 1000);
+ hide_vol = setTimeout('hide_volume(); $(\'#volume_slider\').attr(\'rel\', \'\');', 2000);
}
});
diff --git a/templates/default/browse.html b/templates/default/browse.html
index 528d11c..ecb8d68 100644
--- a/templates/default/browse.html
+++ b/templates/default/browse.html
@@ -9,9 +9,11 @@
-
-
- {:foreach from=$browselist item=browselist_item:}
- {:include file="default/browselist_item.html":}
- {:/foreach:}
-
+
+
+
+ {:foreach from=$browselist item=browselist_item:}
+ {:include file="default/browselist_item.html":}
+ {:/foreach:}
+
+
diff --git a/templates/default/images/del.png b/templates/default/images/del.png
index 8fb4a9a..a8e26ff 100644
Binary files a/templates/default/images/del.png and b/templates/default/images/del.png differ
diff --git a/templates/default/playlist.html b/templates/default/playlist.html
index 1845ee2..977bc20 100644
--- a/templates/default/playlist.html
+++ b/templates/default/playlist.html
@@ -1,12 +1,14 @@
- {:if $playlist:}
+
+
+ {:if $playlist:}
-
- {:foreach from=$playlist item=playlist_item:}
- {:include file="default/playlist_item.html":}
- {:/foreach:}
-
- {:else:}
-
(Empty playlist)
- {:/if:}
-
+
+ {:foreach from=$playlist item=playlist_item:}
+ {:include file="default/playlist_item.html":}
+ {:/foreach:}
+
+ {:else:}
+
(Empty playlist)
+ {:/if:}
+
diff --git a/templates/default/playlist_item.html b/templates/default/playlist_item.html
index d5eb2fd..f28444a 100644
--- a/templates/default/playlist_item.html
+++ b/templates/default/playlist_item.html
@@ -1 +1,22 @@
- {:if $playlist_item.Pos == $playing:}{:else:}{:/if:}

{:$playlist_item.Pos+1|string_format:"%02d":}. {:if $playlist_item.Title:}{:$playlist_item.Title:}{:if $playlist_item.Artist && $show_extra_track_info:}
{:$playlist_item.Artist:} {:if $playlist_item.Album:}({:$playlist_item.Album:}){:/if:}{:/if:}{:else:}{:$playlist_item.file_name:}{:/if:}
+ {:if $playlist_item.Pos == $playing:}
+
+ {:else:}
+
+ {:/if:}
+
+
+ {:$playlist_item.Pos+1|string_format:"%02d":}
+ {:if $playlist_item.Title:}
+ {:$playlist_item.Title:}
+ {:if $playlist_item.Artist && $show_extra_track_info:}
+
+ {:$playlist_item.Artist:}
+ {:if $playlist_item.Album:}
+
+ {:/if:}
+ {:/if:}
+ {:else:}
+ {:$playlist_item.file_name:}
+ {:/if:}
+
+
diff --git a/templates/default/styles.css b/templates/default/styles.css
index 6ceed1f..8acfab5 100644
--- a/templates/default/styles.css
+++ b/templates/default/styles.css
@@ -7,14 +7,14 @@ img {
}
a {
text-decoration: none;
- color: #fff;
+ color: #333;
}
body {
- background: #333 url(templates/{:$template:}/images/menu_shadow.png) center 29px repeat-x;
+ background: #333 url(templates/{:$template:}/images/menu_shadow.png) center 29px repeat-x fixed;
color: #fff;
- font: 13px helvetica,verdana,sans-serif;
+ font: 14px helvetica,verdana,sans-serif;
text-align: center;
- margin: 45px 0px 0px 0px;
+ margin: 30px 0px 0px 0px;
}
p {
margin-bottom: 5px;
@@ -65,29 +65,58 @@ p {
width: 106px;
text-shadow: 0 0 12px rgba(150, 210, 255, 0.9);
}
-#page {
+#page {
padding: 0px;
clear: left;
+}
+#list {
+ background-color: #ddd;
+ color: #333;
}
-#page ul {
+#list ul {
list-style-type: none;
- width: 280px;
+ max-width: 320px;
text-align: left;
margin-left: auto;
margin-right: auto;
}
-#page ul.list {
+#list ul.list {
margin-top: 10px;
}
-#page ul li {
- padding: 0px 1px 1px 0px;
- border-top: 1px solid #666;
+#list ul li {
+ padding: 3px 10px 3px 10px;
+ border-top: 1px solid white;
+ border-bottom: 1px solid #aaa;
+}
+#list li .pos {
+ float: left;
+ padding-right: 10px;
+ padding-top: 3px;
+ font-size: 22px;
+ color: #666;
+ text-shadow: 1px 1px 2px rgba(255, 255, 255, 1);
+ font-weight: bold;
+}
+li .play {
+ display: block;
+}
+li .remove {
+ float: right;
+ padding: 5px 0px 3px;
+ display: block;
+}
+li.playing {
+ background: #ccc;
+ border-bottom: 1px solid #999;
+}
+li .title {
+ font-weight: bold;
}
#song_display {
position: relative;
width: 280px;
height: 217px;
- margin: 0px auto 5px;
+ margin: 45px auto 5px;
/* height: 55px; */
text-align: left;
font-size: 14px;
@@ -265,9 +294,6 @@ img.button {
margin-left: 3px;
border: 0px none !important;
}
-li.playing {
- background: #444;
-}
#progress {
background: #222 url(templates/{:$template:}/images/progress_back.png) center center repeat-x;
border: 1px solid #666;