2.0.5

index.html

@@ -34,6 +34,7 @@
 
 <div id="container">
     <div id="messages"></div>    
+    <a href="#" id="logo" target="_blank"></a>
     <div id="nav">
         <ul class="tabs">
         <li><a href="#tabLibrary" class="first" title="Library"><img src="images/headphones_gd_16x14.png" /></a></li>
@@ -180,20 +181,32 @@
                 </div>
                 <div class="subsection floatleft">
                     <div class="checkboxes">
+                        <fieldset>
+                        <legend>Notifications [Beta]</legend>
+                        <div class="inputwrap"><input type="checkbox" id="Notification_Song" name="Notification_Song" value="1" title="Enable Notifications When Tracks Change"/></div>
+                        <label for="Notification_Song">Song Change</label>
+                        <div class="clear"></div>
+                        <div class="inputwrap"><input type="checkbox" id="Notification_NowPlaying" name="Notification_NowPlaying" value="1" title="Enable Notifications When Other Users Play Songs"/></div>
+                        <label for="Notification_Song">Now Playing</label>
+                        </fieldset>
+                        <div class="clear"></div>
+                        <fieldset>
+                        <legend>Display</legend>
                         <div class="inputwrap"><input type="checkbox" id="HideAZ" name="HideAZ" value="1" title="Hide A-Z at Bottom of Artists"/></div>
                         <label for="HideAZ">Hide A-Z</label>
                         <div class="clear"></div>
-                        <div class="inputwrap"><input type="checkbox" id="EnableNotifications" name="EnableNotifications" value="1" title="Enable Notifications When Tracks Change"/></div>
-                        <label for="EnableNotifications">Desktop Notifications <small>[Beta]</small></label>
-                        <div class="clear"></div>
                         <div class="inputwrap"><input type="checkbox" id="ScrollTitle" name="ScrollTitle" value="1" title="Scroll the Title Once"/></div>
                         <label for="ScrollTitle">Scroll Title</label>
+                        </fieldset>
                         <div class="clear"></div>
+                        <fieldset>
+                        <legend>Advanced</legend>
                         <div class="inputwrap"><input type="checkbox" id="Debug" name="Debug" value="1" title="Enable Debug Mode (Events will be logged to the Javascript Console)"/></div>
                         <label for="Debug">Debug Mode</label>
                         <div class="clear"></div>
                         <div class="inputwrap"><input type="checkbox" id="ForceFlash" name="ForceFlash" value="1" title="Force Flash (Option doesn't work with Chrome App)"/></div>
                         <label for="ForceFlash">Force Flash</label>
+                        </fieldset>
                     </div>
                 </div>
                 <div id="donate" class="subsection floatleft">
@@ -216,6 +229,11 @@
                         <span class="changes"></span>
                     </li>
                     -->
+                    <li class="log"><span class="version">7/20/2012 - 2.0.5</span>
+                        <span class="changes">Fixed Mp3 only folder issue</span>
+                        <span class="changes">Launch server URL from the Subsonic icon!</span>
+                        <span class="changes">Added "Now Playing" notification option</span>
+                    </li>
                     <li class="log"><span class="version">7/15/2012 - 2.0.4</span>
                         <span class="changes">Minor bug fix</span>
                     </li>

js/app.js

@@ -28,8 +28,8 @@ if (u && p && s) {
         $.cookie('username', u, { expires: 365 });
         username = u;
     }
-    if (!$.cookie('password')) {
+    if (!$.cookie('passwordenc')) {
-        $.cookie('password', p, { expires: 365 });
+        $.cookie('passwordenc', p, { expires: 365 });
         password = p;
     }
     if (!$.cookie('Server')) {

js/libs/api.js

@@ -32,35 +32,52 @@ function loadArtists(id, refresh) {
                     }
                     // There is a bug in the API that doesn't return a JSON array for one artist
                     var indexes = [];
-                    if (data["subsonic-response"].indexes.index.length > 0) {
+                    if (data["subsonic-response"].indexes.index !== undefined) {
-                        indexes = data["subsonic-response"].indexes.index;
+                        if (data["subsonic-response"].indexes.index.length > 0) {
-                    } else {
+                            indexes = data["subsonic-response"].indexes.index;
-                        indexes[0] = data["subsonic-response"].indexes.index;
-                    }
-
-                    $.each(indexes, function (i, index) {
-                        indexname = index.name;
-                        $('<li class=\"index\" id=\"index_' + indexname + '\" title=\"Scroll to Top\"><a name=\"index_' + indexname + '\">' + indexname + '</a><span class=\"floatright\">&uarr;</span></li>').appendTo("#ArtistContainer");
-                        indexlist += '<li><a href=\"#' + indexname + '\">' + indexname + '</a></li>';
-                        var artists = [];
-                        if (index.artist.length > 0) {
-                            artists = index.artist;
                         } else {
-                            artists[0] = index.artist;
+                            indexes[0] = data["subsonic-response"].indexes.index;
                         }
-                        $.each(artists, function (i, artist) {
+
-                            if (artist.name !== undefined) {
+                        $.each(indexes, function (i, index) {
-                                var html = "";
+                            indexname = index.name;
-                                html += '<li id=\"' + artist.id + '\" class=\"item\">';
+                            $('<li class=\"index\" id=\"index_' + indexname + '\" title=\"Scroll to Top\"><a name=\"index_' + indexname + '\">' + indexname + '</a><span class=\"floatright\">&uarr;</span></li>').appendTo("#ArtistContainer");
-                                html += '<span>' + artist.name + '</span>';
+                            indexlist += '<li><a href=\"#' + indexname + '\">' + indexname + '</a></li>';
-                                html += '</li>';
+                            var artists = [];
-                                $(html).appendTo("#ArtistContainer");
+                            if (index.artist.length > 0) {
+                                artists = index.artist;
+                            } else {
+                                artists[0] = index.artist;
                             }
+                            $.each(artists, function (i, artist) {
+                                if (artist.name !== undefined) {
+                                    var html = "";
+                                    html += '<li id=\"' + artist.id + '\" class=\"item\">';
+                                    html += '<span>' + artist.name + '</span>';
+                                    html += '</li>';
+                                    $(html).appendTo("#ArtistContainer");
+                                }
+                            });
                         });
-                    });
+                        //$(indexlist).appendTo("#IndexList");
-                    //$(indexlist).appendTo("#IndexList");
+                        $("#BottomIndex").empty();
-                    $("#BottomIndex").empty();
+                        $(indexlist).appendTo("#BottomIndex");
-                    $(indexlist).appendTo("#BottomIndex");
+                    } 
+                    if (data["subsonic-response"].indexes.child !== undefined) {
+                            if (data["subsonic-response"].indexes.child.length > 0) {
+                                indexes = data["subsonic-response"].indexes.child;
+                            } else {
+                                indexes[0] = data["subsonic-response"].indexes.child;
+                            }
+                            var appendto = '#AlbumRows';
+                            $(appendto).empty();
+                            $.each(indexes, function (i, child) {
+                                var html = generateRowHTML(child, appendto);
+                                $(html).appendTo(appendto);
+                                header = generateSongHeaderHTML();
+                                $('#songactions').show();
+                            });
+                    }
                 } else {
                     var error = data["subsonic-response"].status;
                     var errorcode = data["subsonic-response"].error.code;
@@ -128,26 +145,12 @@ function getAlbums(id, action, appendto) {
                     children[0] = data["subsonic-response"].directory.child;
                 }
 
-                var rowcolor;
-                var albumhtml;
                 var isDir;
                 var header;
                 $.each(children, function (i, child) {
-                    if (i % 2 === 0) {
+                    if (child.isDir === true) { isDir = true; }
-                        rowcolor = 'even';
+                    var html = generateRowHTML(child, appendto);
-                    } else {
+                    $(html).appendTo(appendto);
-                        rowcolor = 'odd';
-                    }
-                    isDir = child.isDir;
-                    if (isDir === true) {
-                        albumhtml = generateAlbumHTML(rowcolor, child.id, child.parent, child.coverArt, child.title, child.artist, child.userRating);
-                    } else {
-                        var track;
-                        if (child.track === undefined) { track = "&nbsp;"; } else { track = child.track; }
-                        var time = secondsToTime(child.duration);
-                        albumhtml = generateSongHTML(rowcolor, child.id, child.parent, track, child.title, child.artist, child.album, child.coverArt, child.userRating, time['m'], time['s']);
-                    }
-                    $(albumhtml).appendTo(appendto);
                 });
                 if (appendto === '#CurrentPlaylistContainer') {
                     updateMessage(children.length + ' Song(s) Added');
@@ -167,6 +170,28 @@ function getAlbums(id, action, appendto) {
         }
     });
 }
+function generateRowHTML(child, appendto) {
+    var rowcolor;
+    var albumhtml;
+    var isDir;
+    var i;
+    if (i % 2 === 0) {
+        rowcolor = 'even';
+    } else {
+        rowcolor = 'odd';
+    }
+    isDir = child.isDir;
+    if (isDir === true) {
+        albumhtml = generateAlbumHTML(rowcolor, child.id, child.parent, child.coverArt, child.title, child.artist, child.userRating);
+    } else {
+        var track;
+        if (child.track === undefined) { track = "&nbsp;"; } else { track = child.track; }
+        var time = secondsToTime(child.duration);
+        albumhtml = generateSongHTML(rowcolor, child.id, child.parent, track, child.title, child.artist, child.album, child.coverArt, child.userRating, time['m'], time['s']);
+    }
+    return albumhtml;
+    //$(albumhtml).appendTo(appendto);
+}
 function getAlbumListBy(id) {
     var size;
     if ($.cookie('AutoAlbumSize') === null) {
@@ -268,9 +293,9 @@ function getRandomSongList(action, appendto) {
     });
 }
 var updaterNowPlaying;
-var updaterNowPlayingData;
+var updaterNowPlayingIdList = [];
-function updateNowPlaying() {
+function updateNowPlaying(showPopup) {
-    updaterNowPlaying = $.periodic({ period: 4000, decay: 1.5, max_period: 1800000 }, function () {
+    updaterNowPlaying = $.periodic({ period: 4000, decay: 1.5, max_period: 30000 }, function () {
         $.ajax({
             periodic: this,
             url: baseURL + '/getNowPlaying.view?u=' + username + '&p=' + password + '&v=' + version + '&c=' + applicationName + '&f=jsonp',
@@ -285,9 +310,9 @@ function updateNowPlaying() {
                     chathtml += '<span class=\"user\">Nothing :(</span></br>';
                     chathtml += '</div>';
                     $(chathtml).appendTo("#NowPlayingList");
-                } else if (updaterNowPlayingData === $.param(data)) {
-                    this.periodic.increment();
                 } else {
+                    this.periodic.increment();
+                    if (debug) { console.log('NowPlaying Delay: ' + this.periodic.cur_period); }
                     $("#NowPlayingList").empty();
                     var msgs = [];
                     if (data["subsonic-response"].nowPlaying.entry.length > 0) {
@@ -295,19 +320,31 @@ function updateNowPlaying() {
                     } else {
                         msgs[0] = data["subsonic-response"].nowPlaying.entry;
                     }
-                    this.periodic.reset();
                     var sorted = msgs.sort(function (a, b) {
                         return a.minutesAgo - b.minutesAgo;
                     });
                     $.each(sorted, function (i, msg) {
-                        var chathtml = '<div class=\"msg\">';
+                        if (!showPopup) {
-                        chathtml += '<span class=\"user\">' + msg.username + '</span></br>';
+                            var chathtml = '<div class=\"msg\">';
-                        chathtml += '<span class=\"artist\">' + msg.artist + '</span> - ';
+                            chathtml += '<span class=\"user\">' + msg.username + '</span></br>';
-                        chathtml += '<span class=\"title\">' + msg.title + '</span>';
+                            chathtml += '<span class=\"artist\">' + msg.artist + '</span> - <span class=\"title\">' + msg.title + '</span>';
-                        chathtml += '</div>';
+                            chathtml += '</div>';
-                        $(chathtml).appendTo("#NowPlayingList");
+                            $(chathtml).appendTo("#NowPlayingList");
+                        }
+                        var coverartSrc;
+                        if (msg.coverArt === undefined) {
+                            coverartSrc = 'images/albumdefault_50.jpg';
+                        } else {
+                            coverartSrc = baseURL + '/getCoverArt.view?v=' + version + '&c=' + applicationName + '&f=jsonp&size=50&id=' + msg.coverArt;
+                        }
+                        if ($.cookie('Notification_NowPlaying')) {
+                            var sid = msg.username + '-' + msg.id;
+                            if (jQuery.inArray(sid, updaterNowPlayingIdList) === -1 && username != msg.username) {
+                                showNotification(coverartSrc, toHTML.un(msg.username + ':' + msg.playerName), toHTML.un(msg.artist + ' - ' + msg.title), 'text');
+                                updaterNowPlayingIdList.push(sid);
+                            }
+                        }
                     });
-                    updaterNowPlayingData = $.param(data);
                 }
             }
         });

js/libs/chat.js

@@ -10,6 +10,7 @@ function updateChatMessages() {
             timeout: 10000,
             success: function (data) {
                 if (data["subsonic-response"].chatMessages.chatMessage === undefined) {
+                    if (debug) { console.log('ChatMessages Delay: ' + this.periodic.cur_period); }
                     this.periodic.increment();
                 } else {
                     var msgs = [];

js/libs/player.js

@@ -121,8 +121,8 @@ function playSong(el, songid, albumid) {
             scrobbleSong(false);
             scrobbled = false;
 
-            if ($.cookie('EnableNotifications')) {
+            if ($.cookie('Notification_Song')) {
-                showNotification(coverartSrc, toHTML.un(title), toHTML.un(artist + ' - ' + album));
+                showNotification(coverartSrc, toHTML.un(title), toHTML.un(artist + ' - ' + album), 'text');
             }
             if ($.cookie('ScrollTitle')) {
                 scrollTitle(toHTML.un(artist) + ' - ' + toHTML.un(title));

js/libs/utils.js

@@ -161,10 +161,15 @@ function hasNotificationPermission() {
     return !!(window.webkitNotifications) && (window.webkitNotifications.checkPermission() == 0);
 }
 var notifications = new Array();
-function showNotification(pic, title, text) {
+function showNotification(pic, title, text, type) {
     if (hasNotificationPermission()) {
-        closeAllNotifications()
+        //closeAllNotifications()
-        var popup = window.webkitNotifications.createNotification(pic, title, text);
+        var popup;
+        if (type == 'text') {
+            popup = window.webkitNotifications.createNotification(pic, title, text);
+        } else if (type == 'html') {
+            popup = window.webkitNotifications.createHTMLNotification(text);
+        } 
         notifications.push(popup);
         setTimeout(function (notWin) {
         notWin.cancel();

js/ui-load.js

@@ -3,7 +3,7 @@
         var width = $.cookie('defaultsmwidth');
         resizeSMSection(width);
     }
-    if ($.cookie('sidebar') && $.cookie('username') && $.cookie('password')) {
+    if ($.cookie('sidebar') && $.cookie('username') && $.cookie('passwordenc')) {
         $('#SideBar').show();
         updateChatMessages();
         updateNowPlaying();

js/ui-ready.js

@@ -1,7 +1,7 @@
 $(document).ready(function () {
     //User config staff
     $('#Username').val($.cookie('username'));
-    $('#Password').val($.cookie('password'));
+    //$('#Password').val($.cookie('passwordenc'));
     $('#AutoAlbumSize').val($.cookie('AutoAlbumSize'));
     $('#AutoPlaylistSize').val($.cookie('AutoPlaylistSize'));
     $('#Server').val($.cookie('Server'));
@@ -13,10 +13,15 @@
     } else {
         $('#HideAZ').attr('checked', false);
     }
-    if ($.cookie('EnableNotifications')) {
+    if ($.cookie('Notification_Song')) {
-        $('#EnableNotifications').attr('checked', true);
+        $('#Notification_Song').attr('checked', true);
     } else {
-        $('#EnableNotifications').attr('checked', false);
+        $('#Notification_Song').attr('checked', false);
+    }
+    if ($.cookie('Notification_NowPlaying')) {
+        $('#Notification_NowPlaying').attr('checked', true);
+    } else {
+        $('#Notification_NowPlaying').attr('checked', false);
     }
     if ($.cookie('ScrollTitle')) {
         $('#ScrollTitle').attr('checked', true);
@@ -36,14 +41,14 @@
     }
 
     // Tabs
-    $(".tabcontent").hide(); //Hide all content
+    $('.tabcontent').hide(); //Hide all content
     if (!$.cookie('username') && !$.cookie('passwordenc') && !$.cookie('Server')) {
         $('ul.tabs li a').each(function () {
             if ($(this).attr("href") == '#tabPreferences') {
                 $(this).addClass("active"); //Add "active" class to selected tab
             }
         });
-        $("#tabPreferences").show(); //Show first tab content
+        $('#tabPreferences').show(); //Show first tab content
         loadTabContent('#tabPreferences');
     } else {
         if (window.location.hash) {
@@ -61,6 +66,11 @@
             var firstTab = $("ul.tabs li:first a").attr("href");
             loadTabContent(firstTab);
         }
+        $('a#logo').attr("href", $.cookie('Server'));
+        $('a#logo').attr("title", 'Launch Subsonic');
+        if ($.cookie('Notification_NowPlaying')) {
+            updateNowPlaying(true);
+        }
     }
 
     // Tabs - Click Event
@@ -313,7 +323,12 @@
         return false;
     });
     $('#action_RefreshArtists').click(function () {
-        loadArtists("", true);
+        //loadArtists("", true);
+        if ($.cookie('MusicFolders')) {
+            loadArtists($.cookie('MusicFolders'), true);
+        } else {
+            loadArtists();
+        }
         return false;
     });
     $('#action_IncreaseWidth').click(function () {
@@ -506,7 +521,7 @@
             $.cookie('sidebar', true, { expires: 365 });
             $('#SideBar').show();
             updateChatMessages();
-            updateNowPlaying();
+            updateNowPlaying(false);
         }
         resizeContent();
         return false;
@@ -553,14 +568,24 @@
             $('#BottomContainer').show();
         }
     });
-    $('#EnableNotifications').live('click', function () {
+    $('#Notification_Song').live('click', function () {
-        if ($('#EnableNotifications').is(':checked')) {
+        if ($('#Notification_Song').is(':checked')) {
             requestPermissionIfRequired();
             if (hasNotificationPermission()) {
-                $.cookie('EnableNotifications', '1', { expires: 365 });
+                $.cookie('Notification_Song', '1', { expires: 365 });
             }
         } else {
-            $.cookie('EnableNotifications', null);
+            $.cookie('Notification_Song', null);
+        }
+    });
+    $('#Notification_NowPlaying').live('click', function () {
+        if ($('#Notification_NowPlaying').is(':checked')) {
+            requestPermissionIfRequired();
+            if (hasNotificationPermission()) {
+                $.cookie('Notification_NowPlaying', '1', { expires: 365 });
+            }
+        } else {
+            $.cookie('Notification_NowPlaying', null);
         }
     });
     $('#ScrollTitle').live('click', function () {
@@ -628,4 +653,4 @@
         }
     }).disableSelection();
 
-});          // End document.ready
+});           // End document.ready

style/Style.css

@@ -44,13 +44,23 @@ h3.title
 #nav 
 {
     height: 127px;
-    padding: 44px 0 0 0;
-    background: url('../images/subsonic-36.png') no-repeat 6px 4px;
     position: absolute;
-    top: 0px;
+    top: 44px;
     left: 0px;
     z-index: 99;
 }
+a#logo
+{
+    position: absolute;
+    width: 54px;
+    height: 36px;
+    background: url('../images/subsonic_36.png') no-repeat 6px 4px;   
+    cursor:hand; 
+}
+a#logo:hover
+{
+    background: url('../images/subsonic_dn_36.png') no-repeat 6px 4px;    
+}
 #nav ul 
 {
 	list-style-type: none;
@@ -1136,4 +1146,13 @@ label
 {
     float: left;
     margin: 5px 5px 0 5px;
+}
+fieldset
+{
+    border: 1px solid #EEE;
+    margin-bottom: 5px;
+}
+legend
+{
+    font-size: 12px;
 }