Ignore calls to locationHashChanged untill page has finished loading.

Fixes #230.

README.rst

@@ -130,6 +130,7 @@ v2.4.0 (UNRELEASED)
 - The last scroll position is now always saved when navigating between pages or browsing the library.
   (Fixes: `#73 <https://github.com/pimusicbox/mopidy-musicbox-webclient/issues/73>`_, `#93 <https://github.com/pimusicbox/mopidy-musicbox-webclient/issues/93>`_).
 - Playlists will now list tracks even if they are no longer available in the library. (Fixes: `#226 <https://github.com/pimusicbox/mopidy-musicbox-webclient/issues/226>`_).
+- Refreshing album or artist info pages no longer raises an exception. (Fixes: `#230 <https://github.com/pimusicbox/mopidy-musicbox-webclient/issues/230>`_).
 
 v2.3.0 (2016-05-15)
 -------------------

mopidy_musicbox_webclient/static/index.html

@@ -140,10 +140,10 @@
                 <a href="#" onclick="return controls.playTracks(ADD_ALL_BOTTOM, mopidy);">Add All to Bottom of Queue</a>
             </li>
             <li class="popupAlbumLi">
-                <a href="#" onclick="showAlbumPopup('#popupTracks')">Show Album <span class="popupAlbumName"></span></a>
+                <a href="#" onclick="showAlbumPopup('#popupTracks', mopidy)">Show Album <span class="popupAlbumName"></span></a>
             </li>
             <li class="popupArtistsLi">
-                <a href="#" onclick="showArtist()" class="popupArtistHref">Show Artist <span class="popupArtistName"></span>
+                <a href="#" onclick="library.showArtist(null, mopidy)" class="popupArtistHref">Show Artist <span class="popupArtistName"></span>
                 </a>
             </li>
             <div data-role="collapsible" data-icon="false" data-inset="false" class="popupArtistsDiv">
@@ -170,10 +170,10 @@
                 <a href="#" onclick="return controls.removeTrack('', mopidy);">Remove from Queue</a>
             </li>
             <li class="popupAlbumLi">
-                <a href="#" onclick="showAlbumPopup('#popupQueue')">Show Album <span class="popupAlbumName"></span></a>
+                <a href="#" onclick="showAlbumPopup('#popupQueue', mopidy)">Show Album <span class="popupAlbumName"></span></a>
             </li>
             <li class="popupArtistsLi">
-                <a href="#" onclick="showArtist()" class="popupArtistHref">Show Artist <span class="popupArtistName"></span>
+                <a href="#" onclick="library.showArtist(null, mopidy)" class="popupArtistHref">Show Artist <span class="popupArtistName"></span>
                 </a>
             </li>
             <div data-role="collapsible" data-icon="false" data-inset="false" class="popupArtistsDiv">

mopidy_musicbox_webclient/static/js/functionsvars.js

@@ -305,7 +305,7 @@ function renderSongLiDivider (previousTrack, track, nextTrack, target) {
     if (!hasSameAlbum(previousTrack, track) && hasSameAlbum(track, nextTrack)) {
         // Large divider with album cover.
         html +=
-            '<li class="albumdivider"><a href="#" onclick="return library.showAlbum(\'' + track.album.uri + '\');">' +
+            '<li class="albumdivider"><a href="#" onclick="return library.showAlbum(\'' + track.album.uri + '\', mopidy);">' +
             '<img id="' + getjQueryID(target + '-cover', track.uri) + '" class="artistcover" width="30" height="30"/>' +
             '<h1>' + track.album.name + '</h1><p>' +
             renderSongLiTrackArtists(track) + '</p></a></li>'

mopidy_musicbox_webclient/static/js/gui.js

@@ -78,7 +78,7 @@ function setSongInfo (data) {
 
     if (data.track.artists) {
         for (var j = 0; j < data.track.artists.length; j++) {
-            artistshtml += '<a href="#" onclick="return library.showArtist(\'' + data.track.artists[j].uri + '\');">' + data.track.artists[j].name + '</a>'
+            artistshtml += '<a href="#" onclick="return library.showArtist(\'' + data.track.artists[j].uri + '\', mopidy);">' + data.track.artists[j].name + '</a>'
             artiststext += data.track.artists[j].name
             if (j !== data.track.artists.length - 1) {
                 artistshtml += ', '
@@ -88,7 +88,7 @@ function setSongInfo (data) {
         arttmp = artistshtml
     }
     if (data.track.album && data.track.album.name) {
-        $('#modalalbum').html('<a href="#" onclick="return library.showAlbum(\'' + data.track.album.uri + '\');">' + data.track.album.name + '</a>')
+        $('#modalalbum').html('<a href="#" onclick="return library.showAlbum(\'' + data.track.album.uri + '\', mopidy);">' + data.track.album.name + '</a>')
     } else {
         $('#modalalbum').html('')
     }
@@ -132,9 +132,9 @@ function popupTracks (e, listuri, trackuri, tlid) {
     $('.popupArtistsDiv').hide()
     if (popupData[trackuri].artists) {
         if (popupData[trackuri].artists.length === 1 && popupData[trackuri].artists[0].uri) {
-            child = '<a href="#" onclick="library.showArtist(\'' + popupData[trackuri].artists[0].uri + '\');">Show Artist</a>'
+            child = '<a href="#" onclick="library.showArtist(\'' + popupData[trackuri].artists[0].uri + '\', mopidy);">Show Artist</a>'
             $('.popupArtistName').html(popupData[trackuri].artists[0].name)
-            $('.popupArtistHref').attr('onclick', 'library.showArtist("' + popupData[trackuri].artists[0].uri + '");')
+            $('.popupArtistHref').attr('onclick', 'library.showArtist(\'' + popupData[trackuri].artists[0].uri + '\', mopidy);')
             $('.popupArtistsDiv').hide()
             $('.popupArtistsLi').show()
         } else {
@@ -142,7 +142,7 @@ function popupTracks (e, listuri, trackuri, tlid) {
             for (var j = 0; j < popupData[trackuri].artists.length; j++) {
                 if (popupData[trackuri].artists[j].uri) {
                     isValidArtistURI = true
-                    child += '<li><a href="#" onclick="library.showArtist(\'' + popupData[trackuri].artists[j].uri + '\');"><span class="popupArtistName">' + popupData[trackuri].artists[j].name + '</span></a></li>'
+                    child += '<li><a href="#" onclick="library.showArtist(\'' + popupData[trackuri].artists[j].uri + '\', mopidy);"><span class="popupArtistName">' + popupData[trackuri].artists[j].name + '</span></a></li>'
                 }
             }
             if (isValidArtistURI) {
@@ -186,7 +186,7 @@ function popupTracks (e, listuri, trackuri, tlid) {
 
 function showAlbumPopup (popupId) {
     uri = $(popupId).data('track')
-    library.showAlbum(popupData[uri].album.uri)
+    library.showAlbum(popupData[uri].album.uri, mopidy)
 }
 
 /** ********************
@@ -364,6 +364,13 @@ function updateStatusOfAll () {
 }
 
 function locationHashChanged () {
+    if (!mopidy) {
+        // Mopidy connection not yet established. User probably clicked 'Refresh' in their
+        // browser and the page is still loading. We can safely ignore this call as it will
+        // be invoked again later when the page has finished loading and $(document).ready()
+        // is triggered.
+        return false
+    }
     var hash = document.location.hash.split('?')
     // remove #
     var divid = hash[0].substr(1)
@@ -399,12 +406,12 @@ function locationHashChanged () {
             break
         case 'artists':
             if (uri !== '') {
-                library.showArtist(uri)
+                library.showArtist(uri, mopidy)
             }
             break
         case 'albums':
             if (uri !== '') {
-                library.showAlbum(uri)
+                library.showAlbum(uri, mopidy)
             }
             break
         default:  // Default footer

mopidy_musicbox_webclient/static/js/library.js

@@ -131,7 +131,7 @@
 
             // Artist results
             var child = ''
-            var template = '<li><a href="#" onclick="return library.showArtist(this.id)" id={id}><i class="{class}"></i> <strong>{name}</strong></a></li>'
+            var template = '<li><a href="#" onclick="return library.showArtist(\'this.id\', mopidy)" id={id}><i class="{class}"></i> <strong>{name}</strong></a></li>'
             var tokens
 
             for (i = 0; i < results.artists.length; i++) {
@@ -155,7 +155,7 @@
 
             // Album results
             child = ''
-            template = '<li><a href="#" onclick="return library.showAlbum(this.id)" id="{albumId}">'
+            template = '<li><a href="#" onclick="return library.showAlbum(\'this.id\', mopidy)" id="{albumId}">'
             template += '<h5 data-role="heading"><i class="{class}"></i> {albumName}</h5>'
             template += '<p data-role="desc">{artistName}</p>'
             template += '</a></li>'
@@ -269,7 +269,7 @@
             return false
         },
 
-        showArtist: function (nwuri) {
+        showArtist: function (nwuri, mopidy) {
             $('#popupQueue').popup('close')
             $('#popupTracks').popup('close')
             $('#controlsmodal').popup('close')
@@ -288,7 +288,7 @@
             return false
         },
 
-        showAlbum: function (uri) {
+        showAlbum: function (uri, mopidy) {
             $('#popupQueue').popup('close')
             $('#popupTracks').popup('close')
             $('#controlsmodal').popup('close')