Beta Release v.002

Style.css

@@ -188,6 +188,13 @@ ul.songlist li.song span
     text-align: right;
     width: 30px;
 }
+ul.songlist li small
+{
+    color: #B6B6B6;
+    font-size: 10px;
+    margin: 1px 0 0;
+    float: right;
+}
 ul.songlist li.playing
 {
     background: url('images/play_6x8.png') 9px 7px no-repeat;
@@ -199,10 +206,7 @@ ul.songlist li.selected
     background-color: #4B95E5;
     border-bottom: 1px solid #73ABE7;
 }
-ul.songlist li small
+
-{
-    font-size: 10px;
-}
 .actions
 {
     margin: 5px;
@@ -262,6 +266,7 @@ div#submenu a:hover
 {
     margin: 0 8px;
     float: left;
+    width: 460px;
 }
 #songdetails ul
 {
@@ -275,7 +280,12 @@ div#submenu a:hover
 }
 #songdetails li span.label
 {
-    font-variant: small-caps;
+    color: #B6B6B6;
+    display: block;
+    float: left;
+    margin: 0 4px 0 0;
+    text-align: right;
+    width: 37px;
 }
 ul.preferences 
 {

index.html

@@ -63,18 +63,14 @@
             });
 
             // Keyboard shortcuts
-            $('#Artists').keydown(function (e) {
+            $(document).keydown(function (e) {
                 var unicode = e.charCode ? e.charCode : e.keyCode;
+                // right arrow
                 if (unicode >= 65 && unicode <= 90) {
                     var key = findKeyForCode(unicode);
                     var el = '#index_' + key.toUpperCase();
                     $('#Artists').stop().scrollTo(el);
-                }
+                } else if (unicode == 39) {
-            });
-            $(document).keydown(function (e) {
-                var unicode = e.charCode ? e.charCode : e.keyCode;
-                // right arrow
-                if (unicode == 39) {
                     var next = $('ul.songlist li.playing').next();
                     if (!next.length) next = $('ul.songlist li').first();
                     changeTrack(next);
@@ -113,7 +109,17 @@
                 lastChecked = this;
             });
 
-            // Action Menu - Click Events
+            // Main Click Events
+            // Load in a track on click
+            $('ul.songlist li.song').live('dblclick', function (e) {
+                e.preventDefault();
+                $(this).addClass('playing').siblings().removeClass('playing');
+                var songid = $(this).attr('childid');
+                var albumid = $(this).attr('parentid');
+                playSong(songid, albumid);
+            });
+
+            // Action Menu Click Events
             $('a#action_AddToPlaylist').click(function () {
                 var submenu = $('div#submenu');
                 if (submenu.is(":visible")) {

js/app.js

@@ -15,14 +15,6 @@ function loadTabContent(tab) {
                 $(this).addClass('selected');
                 getAlbums($(this).attr("id"));
             });
-            // Load in a track on click
-            $('#Albums li.song').live('dblclick', function (e) {
-                e.preventDefault();
-                $(this).addClass('playing').siblings().removeClass('playing');
-                var songid = $(this).attr('childid');
-                var albumid = $(this).attr('parentid');
-                playSong(songid, albumid);
-            });
             break;
         case '#tabPlaylists':
             loadPlaylists();
@@ -387,9 +379,11 @@ function getPlaylist(id) {
                     }
                     var track;
                     if (child.track === undefined) { track = " "; } else { track = child.track; }
+                    var time = secondsToTime(child.duration);
                     html = '<li class=\"song ' + rowcolor + '\" childid=\"' + child.id + '\" parentid=\"' + child.parent + '\">';
                     html += '<span class=\"track\">' + track + '</span> ';
                     html += child.title;
+                    html += ' <small>' + time['m'] + ':' + time['s'] + '</small>';
                     html += '</li>';
                     $(html).appendTo("#TrackContainer");
                 });