2.3.2 added breadcrumb

index.html

@@ -22,6 +22,7 @@
     <script src="js/plugins/jquery.linkify-1.0-min.js" type="text/javascript"></script>
     <script src="js/plugins/jquery.periodic.js" type="text/javascript"></script>
     <script src="js/plugins/jquery.scrollTo-1.4.2-min.js" type="text/javascript"></script>
+    <script src="js/plugins/jquery.mousewheel.min.js" type="text/javascript"></script>
     <script src="js/jplayer/jquery.jplayer.min.js" type="text/javascript"></script>
     <script src="js/fancybox/jquery.fancybox.pack.js" type="text/javascript"></script>
     <script src="js/libs/api.js" type="text/javascript"></script>
@@ -92,6 +93,7 @@
                     </div>
                 <div id="BottomContainer"><ul id="BottomIndex"></ul></div>
                 </div>
+                <div id="BreadCrumbContainer"><div id="BreadCrumb"><img src="images/home_gl_12x12.png" /><div id="BreadCrumbs" class="floatleft"></div></div></div>
                 <table id="AlbumContainer" class="simplelist songlist noselect" cellspacing="1">
                 <thead></thead>
                 <tbody></tbody>
@@ -294,6 +296,9 @@
                         <span class="changes">- </span>
                     </li>
                     -->
+                    <li class="log"><span class="version">11/26/2012 - 2.3.2</span>
+                        <span class="changes">- Basic Breadcrumb navigation implemented</span>
+                    </li>
                     <li class="log"><span class="version">11/1/2012 - 2.3.1</span>
                         <span class="changes">- Autopilot & Auto Playlists will use the currently selected Music Folder</span>
                         <span class="changes">- Volume slider, mute button added</span>

js/app.js

@@ -9,7 +9,7 @@ var password;
 var passwordenc;
 var server;
 var smwidth;
-var currentVersion = '2.3.1';
+var currentVersion = '2.3.2';
 
 function getCookie(value) {
     if ($.cookie(value)) {
@@ -44,11 +44,12 @@ function setCookie(key, value) {
     */
 }
 
-// Set auth cookies if specified in URL on launch
+// Get URL Querystring Parameters
 var u = getParameterByName('u'); 
 var p = getParameterByName('p');
 var s = getParameterByName('s');
 if (u && p && s) {
+    // Auto configuration from Querystring params
     if (!getCookie('username')) {
         setCookie('username', u);
         username = u;

js/libs/api.js

@@ -197,6 +197,7 @@ function loadAutoPlaylists(refresh) {
             genresArr.push('Random');
         }
         $.each(genresArr, function (i, genre) {
+            genre = genre.trim();
             var html = "";
             html += '<li class=\"item\" data-genre=\"' + genre + '\">';
             html += '<span>' + genre + '</span>';
@@ -237,9 +238,13 @@ function getAlbums(id, action, appendto) {
                 var rowcolor;
                 var header;
                 $.each(children, function (i, child) {
+                    var isVideo = false;
                     if (child.isDir == true) { isDir = true; }
-                    var html = generateRowHTML(child, appendto);
+                    if (child.isVideo == true) { isVideo = true; }
-                    $(html).appendTo(appendto).hide().fadeIn('fast');
+                    if (!isVideo) {
+                        var html = generateRowHTML(child, appendto);
+                        $(html).appendTo(appendto).hide().fadeIn('fast');
+                    }
                 });
                 toggleAlbumListNextPrev('#status_Library', false, '', '');
                 if (appendto == '#CurrentPlaylistContainer') {
@@ -303,6 +308,7 @@ function getAlbumListBy(id, offset) {
                         }
                         $(albumhtml).appendTo("#AlbumContainer tbody").hide().fadeIn('fast');
                     });
+                    $('#BreadCrumbs').empty();
                     $('#songActions a.button').addClass('disabled');
                     toggleAlbumListNextPrev('#status_Library', true, id, offset);
                 } else {
@@ -333,26 +339,27 @@ function toggleAlbumListNextPrev(el, on, type, offset) {
 }
 function getRandomSongList(action, appendto, genre, folder) {
     if (debug) { console.log('action:' + action + ', appendto:' + appendto + ', genre:' + genre + ', folder:' + folder); }
-    var size, gstring;
+    var size;
-    gstring = '';
     if (getCookie('AutoPlaylistSize')) {
         size = getCookie('AutoPlaylistSize');
     } else {
         size = 25;
     }
+    var genreParams = '';
     if (genre != '' && genre != 'Random') {
-        gstring = '&genre=' + genre;
+        genreParams = '&genre=' + genre;
     }
+    folderParams = '';
     if (typeof folder == 'number' && folder == 0 && folder != 'all') {
-        gstring = '&musicFolderId=' + folder;
+        folderParams = '&musicFolderId=' + folder;
     } else if (folder != '' && folder != 'all') {
-        gstring = '&musicFolderId=' + folder;
+        folderParams = '&musicFolderId=' + folder;
     }
     if (genre == 'Starred') {
         getStarred(action, appendto, 'song');
     } else {
     $.ajax({
-        url: baseURL + '/getRandomSongs.view?u=' + username + '&p=' + password + '&v=' + apiVersion + '&c=' + applicationName + '&f=json&size=' + size + gstring,
+        url: baseURL + '/getRandomSongs.view?u=' + username + '&p=' + password + '&v=' + apiVersion + '&c=' + applicationName + '&f=json&size=' + size + genreParams + folderParams,
         method: 'GET',
         dataType: 'json',
         timeout: 10000,
@@ -396,6 +403,7 @@ function getRandomSongList(action, appendto, genre, folder) {
                     autoPlay();
                 }
             } else {
+                updateStatus('#status_Playlists', '');
                 $(appendto).empty();
             }
         }
@@ -750,6 +758,7 @@ function getPlaylist(id, action, appendto) {
             } else {
                 if (appendto === '#TrackContainer tbody') {
                     $(appendto).empty();
+                    updateStatus('#status_Playlists', '');
                 }
             }
         }

js/libs/player.js

@@ -61,11 +61,11 @@ function getSongData(el, songid, albumid, position, loadonly) {
                 }
             }
 
-            playSong(el, songid, albumid, title, artist, album, coverart, rating, starred, contenttype, suffix, specs, loadonly);
+            playSong(el, songid, albumid, title, artist, album, coverart, rating, starred, contenttype, suffix, specs, position, loadonly);
         }
     });
 }
-function playSong(el, songid, albumid, title, artist, album, coverart, rating, starred, contenttype, suffix, specs, loadonly) {
+function playSong(el, songid, albumid, title, artist, album, coverart, rating, starred, contenttype, suffix, specs, position, loadonly) {
             var volume = 1;
             if (getCookie('Volume')) {
                 volume = parseFloat(getCookie('Volume'));
@@ -134,6 +134,7 @@ function playSong(el, songid, albumid, title, artist, album, coverart, rating, s
                     if (!loadonly) {
                         $(this).jPlayer("play");
                     } else {
+                        $('#' + songid).addClass('playing');
                         $(this).jPlayer("pause", position);
                     }
 		        },

js/libs/utils.js

@@ -253,7 +253,7 @@ function showNotification(pic, title, text, type, bind) {
         notifications.push(popup);
         setTimeout(function (notWin) {
             notWin.cancel();
-        }, 10000, popup);
+        }, 20000, popup);
         popup.show();
     } else {
         console.log("showNotification: No Permission");

js/plugins/jquery.mousewheel.min.js

@@ -0,0 +1,12 @@
+/*! Copyright (c) 2011 Brandon Aaron (http://brandonaaron.net)
+ * Licensed under the MIT License (LICENSE.txt).
+ *
+ * Thanks to: http://adomas.org/javascript-mouse-wheel/ for some pointers.
+ * Thanks to: Mathias Bank(http://www.mathias-bank.de) for a scope bug fix.
+ * Thanks to: Seamus Leahy for adding deltaX and deltaY
+ *
+ * Version: 3.0.6
+ * 
+ * Requires: 1.2.2+
+ */
+(function(a){function d(b){var c=b||window.event,d=[].slice.call(arguments,1),e=0,f=!0,g=0,h=0;return b=a.event.fix(c),b.type="mousewheel",c.wheelDelta&&(e=c.wheelDelta/120),c.detail&&(e=-c.detail/3),h=e,c.axis!==undefined&&c.axis===c.HORIZONTAL_AXIS&&(h=0,g=-1*e),c.wheelDeltaY!==undefined&&(h=c.wheelDeltaY/120),c.wheelDeltaX!==undefined&&(g=-1*c.wheelDeltaX/120),d.unshift(b,e,g,h),(a.event.dispatch||a.event.handle).apply(this,d)}var b=["DOMMouseScroll","mousewheel"];if(a.event.fixHooks)for(var c=b.length;c;)a.event.fixHooks[b[--c]]=a.event.mouseHooks;a.event.special.mousewheel={setup:function(){if(this.addEventListener)for(var a=b.length;a;)this.addEventListener(b[--a],d,!1);else this.onmousewheel=d},teardown:function(){if(this.removeEventListener)for(var a=b.length;a;)this.removeEventListener(b[--a],d,!1);else this.onmousewheel=null}},a.fn.extend({mousewheel:function(a){return a?this.bind("mousewheel",a):this.trigger("mousewheel")},unmousewheel:function(a){return this.unbind("mousewheel",a)}})})(jQuery)

js/ui-load.js

@@ -17,6 +17,7 @@
             $(el).hide();
         }
     });
+    // Saved Position
     if (getCookie('CurrentSong')) {
         var currentSong = JSON.parse(getCookie("CurrentSong"));
         getSongData(null, currentSong.songid, currentSong.albumid, currentSong.position, true);
@@ -55,7 +56,7 @@ function resizeContent() {
         }
     }
     var tabwidth = $('.tabcontent').width();
-    $('#AlbumContainer, #TrackContainer, #PodcastContainer').css({ 'width': (tabwidth - smwidth - 45) + 'px' });
+    $('#BreadCrumbContainer, #AlbumContainer, #TrackContainer, #PodcastContainer').css({ 'width': (tabwidth - smwidth - 45) + 'px' });
     $('#CurrentPlaylistContainer, #VideosContainer').css({ 'width': (tabwidth - 30) + 'px' });
     $('#player').css({ 'width': tabwidth + 'px' });
 }
@@ -70,6 +71,6 @@ function resizeSMSection(x) {
         $('#BottomContainer').css({ 'width': (newsmwidth - 23) + 'px' });
         setCookie('defaultsmwidth', newwidth);
         var ulwidth = newsmwidth + 6;
-        $('#AlbumContainer, #TrackContainer, #PodcastContainer').css({ 'margin-left': (ulwidth + 15) + 'px' });
+        $('#BreadCrumbContainer, #AlbumContainer, #TrackContainer, #PodcastContainer').css({ 'margin-left': (ulwidth + 15) + 'px' });
     }
 }

js/ui-ready.js

@@ -117,7 +117,7 @@
     // Keyboard shortcuts
     $(document).keydown(function (e) {
         var source = e.target.id;
-        if (source != 'Search' && source != 'ChatMsg') {
+        if (source != 'Search' && source != 'ChatMsg' && source != 'AutoPlaylists') {
             var unicode = e.charCode ? e.charCode : e.keyCode;
             // a-z
             if (unicode >= 65 && unicode <= 90 && $('#tabLibrary').is(':visible')) {
@@ -149,8 +149,7 @@
         }
     });
 
-    // Main Click Events
+    // Library Click Event
-    // Albums Click Event
     $('#MusicFolders').live('change', function () {
         var folder = $(this).val();
         if (folder != 'all') {
@@ -165,6 +164,7 @@
         $('#ArtistContainer li').removeClass('selected');
         $(this).addClass('selected');
         getAlbums($(this).attr("id"), '', '#AlbumContainer tbody');
+        $('#BreadCrumbs').html('<a href=\"\" artistid=\"' + $(this).attr("id") + '\">' + $(this).find('span').text() + '</a>');
     });
     $('#BottomIndex li a').live('click', function () {
         var el = 'a[name = "index_' + $(this).text() + '"]';
@@ -177,6 +177,27 @@
         $(this).addClass('selected');
         getAlbumListBy($(this).attr("id"));
     });
+    $('#BreadCrumbs a').live('click', function () {
+        var artistid = $(this).attr('artistid');
+        var albumid = $(this).attr('albumid');
+        if (typeof artistid != 'undefined') {
+            getAlbums(artistid, '', '#AlbumContainer tbody');
+        } else if (typeof albumid != 'undefined') {
+            getAlbums(albumid, '', '#AlbumContainer tbody');
+        }
+        return false;
+    });
+    $('tr.album').live('click', function (e) {
+        var albumid = $(this).attr('childid');
+        var album = $(this).find('td.album').text();
+        var artistid = $(this).attr('parentid');
+        var artist = $(this).find('td.artist').text();
+        getAlbums(albumid, '', '#AlbumContainer tbody');
+        var html = '<a href=\"\" artistid=\"' + artistid + '\">' + artist + '</a>';
+        html += ' ><a href=\"\" albumid=\"' + albumid + '\">' + album + '</a>';
+        $('#BreadCrumbs').html(html);
+        return false;
+    });
     $('tr.album a.play').live('click', function (e) {
         var albumid = $(this).parent().parent().attr('childid');
         var artistid = $(this).parent().parent().attr('parentid');
@@ -210,19 +231,6 @@
         $(this).addClass('rate');
         return false;
     });
-    $('tr.album').live('click', function (e) {
-        var albumid = $(this).attr('childid');
-        var artistid = $(this).attr('parentid');
-        getAlbums(albumid, '', '#AlbumContainer tbody');
-        return false;
-    });
-
-    $('tr.album').live('click', function (e) {
-        var albumid = $(this).attr('childid');
-        var artistid = $(this).attr('parentid');
-        getAlbums(albumid, '', '#AlbumContainer tbody');
-        return false;
-    });
 
     // Track - Click Events
     // Multiple Select
@@ -520,8 +528,33 @@
             loadTabContent('#tabQueue');
         }
     });
+    $('#songdetails').bind('mousewheel', function (event, delta, deltaX, deltaY) {
+        var dir = delta > 0 ? 'Up' : 'Down';
+        var vel = Math.abs(delta);
+        var v = getCookie('Volume') ? parseFloat(getCookie('Volume')) : 1;
+        if (deltaY > 0) {
+            var newVolume = v + .2;
+            if (newVolume <= 1) {
+                $("#playdesk").jPlayer({
+                    volume: newVolume
+                });
+                setCookie('Volume', newVolume);
+            }
+        } else {
+            var newVolume = v - .2;
+            if (newVolume > 0) {
+                $("#playdesk").jPlayer({
+                    volume: newVolume
+                });
+                setCookie('Volume', newVolume);
+            }
+        }
+        if (debug) { console.log(dir + ' velocity: ' + vel + ' x: ' + deltaX + ' y: ' + deltaY); }
+        return false;
+    });
     $('#songdetails').mouseover(function () {
         $(this).addClass('hover');
+
         /*
         var total = $("#CurrentPlaylistContainer tr.song").size();
         if (total > 0) {
@@ -1001,5 +1034,5 @@
     $("#TrackContainer tbody").sortable({
         helper: fixHelper
     }).disableSelection();
-});                                                                                                                                                       // End document.ready
+});                                                                                                                                                                    // End document.ready
 

manifest.json

@@ -2,7 +2,7 @@
 	"manifest_version": 2,
 	"name": "MiniSub",
 	"description": "MiniSub - HTML5 Mini Player for Subsonic",
-	"version": "2.3.1",
+	"version": "2.3.2",
 	"app": {
 		"launch": {
 			"local_path": "index.html"

style/Dark.css

@@ -213,6 +213,15 @@ ul.simplelist li.selected
 {
     background: #3A3A3A;
 }
+#BreadCrumb 
+{
+    color: #D6D469;
+    background: #222222;  
+}
+#BreadCrumb a
+{
+    color: #D6D469;
+}
 #BottomContainer
 {
     border-top: 1px solid #F2F2F2;
@@ -239,6 +248,10 @@ table.songlist tr.album
 {
     border-bottom: 1px solid #232323;
 }
+table.songlist tr.album td
+{
+    color: #f2f2f2;
+}
 table.songlist tr.album td.albumart img
 {
     border: 1px solid #232323;
@@ -250,13 +263,17 @@ table.songlist tr.row:hover
 {
     background: #1d1d1d;
 }
+table.songlist tr.row td
+{
+    color: #f2f2f2;
+}
 table.songlist tr.row td.album img
 {
     border: 1px solid #232323;
 }
 table.songlist tr.row td.album a
 {
-    color: #f2f2f2;
+    color: #D6D469;
 }
 table.songlist tr.row td.album a:hover
 {

style/Style.css

@@ -200,7 +200,7 @@ a#logo:hover
     overflow: auto;
     background: #fff;
     border: 1px solid #cbcbcb;
-    margin-top: 5px;
+    margin-top: 4px;
 }
 .padder
 {
@@ -262,7 +262,7 @@ a#logo:hover
     text-align: center;
     position: absolute;
     z-index: 99;
-    bottom: 86px;
+    bottom: 87px;
     right: 4px;
     background: #f2f2f2;
     padding: 2px 10px;
@@ -293,6 +293,7 @@ a#logo:hover
     display: block;
 }
 
+
 /* Library Style */
 ul.simplelist
 {
@@ -376,7 +377,42 @@ ul.mainlist li.item a.add:hover
 {
     background: url('../images/plus_8x8.png') no-repeat 6px center #DEECFB;
 }
-#AlbumContainer, #TrackContainer, #PodcastContainer
+#BreadCrumbContainer
+{
+    margin: 5px 5px 0 221px;
+    font-size: 12px;
+    height: 22px;
+}
+#BreadCrumb 
+{
+    float: left;
+    margin: 0;
+    padding: 2px 8px;
+    color: #AEAEA7;
+    background: #f6f6f6;  
+    border-radius: .4em;  
+}
+#BreadCrumb img
+{
+    padding: 2px 0px 2px 0;
+    float: left;
+}
+#BreadCrumb a
+{
+    margin: 0 2px 0 6px;
+    text-decoration: none;
+    color: #829FC0;
+}
+#BreadCrumb a:hover
+{
+  text-decoration: underline;
+}
+
+#AlbumContainer
+{
+    margin: 0 5px 5px 221px;
+}
+#TrackContainer, #PodcastContainer
 {
     margin: 5px 5px 5px 221px;
 }
@@ -397,15 +433,6 @@ ul.mainlist li.item a.add:hover
 {
     background: url('../images/minus_8x2.png') no-repeat 6px center #DEECFB;
 }
-#BreadCrumb a
-{
-    color: #4B95E5;
-    font-size: 12px;
-}
-#BreadCrumb a:hover
-{
-    text-decoration: underline;
-}
 table.songlist
 {
     margin: 5px;