new screenshots

webclient/css/ws.css

@@ -1,8 +1,11 @@
-/*
- *
+/*****
+ * Mopidy Webclient CSS 
+ * (c)
  */
 
-/* Responsive stuff */
+/****************************
+ *  Responsive stuff 
+ ****************************/
 
 @media all and (min-width: 35.1em) {
     .pl-breakpoint.ui-grid-a .ui-block-a {
@@ -48,17 +51,20 @@
 @media all and (max-width: 35em) {
     .pl-breakpoint .ui-block-a, .pl-breakpoint .ui-block-b {
         width: 100%;
-        float: none;
+        float:inherit;
     }
-    .header-breakpoint .ui-block-a, .header-breakpoint .ui-block-b, .header-breakpoint .ui-block-c {
+    .header-breakpoint .ui-block-a {
+        float:inherit;
         width: 100%;
-        float: none;
     }
     .header-breakpoint .ui-block-c, .header-breakpoint .ui-block-b {
         display: none;
+        width: 0;
     }
 }
-/* Volume Slider */
+/************************
+ *  Volume Slider 
+ ***********************/
 #mutebt {
     float: left;
     margin-left: 8px;
@@ -69,7 +75,9 @@
     display: inline;
 }
 
-/* Track Slider */
+/***********************
+ *  Track Slider 
+ ***********************/
 
 #trackslider {
     display: inline;
@@ -94,7 +102,9 @@
     margin-top: 12px;
 }
 
-/* Controls */
+/***********************************
+ * Controls 
+ * *********************************/
 #controldiv {
     height: 30px;
     width: 210px;
@@ -103,7 +113,7 @@
 }
 
 #controldiv img {
-    margin-left: 15px;
+    margin-left: 20px;
     float: left;
 }
 
@@ -187,7 +197,7 @@ body {
 }
 
 .currenttrack {
-    background-image: url('../img/icons/play_alt_16x16.png');
+    background-image: url('../images/icons/play_alt_16x16.png');
     background-repeat: no-repeat;
     background-color: #fff;
     background-position: 4px center;

webclient/js/controls.js

@@ -132,22 +132,20 @@ function doRepeat() {
 function doSeekPos(value) {
     var val = $("#trackslider").val();
     newposition = Math.round(val);
-    pauseTimer();
     clearTimeout(seekTimer);
     if (!initgui) {
+        pauseTimer();
         //set timer to not trigger it too much
-        seekTimer = setTimeout(triggerPos, 100);
+        mopidy.playback.pause();
+        seekTimer = setTimeout(triggerPos, 250);
     }
 }
 
 function triggerPos() {
     console.log(newposition);
     if (mopidy) {
-        mopidy.playback.pause();
         mopidy.playback.seek(newposition);
-    }
-    if (play) {
-        resumeTimer();
+        mopidy.playback.resume();
     }
 }
 

webclient/js/functionsvars.js

@@ -106,7 +106,7 @@ function playlisttotable(pl, table, uri) {
          */
         popupData[pl[i].uri] = pl[i];
 
-        child = '<li id="' + pl[i].uri + '"><a href="#" onclick="return popupTracks(\'' + uri + '\',\'' + pl[i].uri + '\');">';
+        child = '<li id="' + pl[i].uri + '"><a href="#" onclick="return popupTracks(event, \'' + uri + '\',\'' + pl[i].uri + '\');">';
         child += '<h1>' + pl[i].name + "</h1>";
         child += '<p>';
         child += '<span style="float: right;">' + timeFromSeconds(pl[i].length / 1000) + '</span>';
@@ -142,7 +142,7 @@ function albumtrackstotable(pl, table, uri) {
     var child = '';
     for (var i = 0; i < pl.length; i++) {
         popupData[pl[i].uri] = pl[i];
-        child = '<li><a href="#" onclick="return popupTracks(\'' + uri + '\',\'' + pl[i].uri + '\');">';
+        child = '<li><a href="#" onclick="return popupTracks(event, \'' + uri + '\',\'' + pl[i].uri + '\');">';
         child += '<p style="float:right; display: inline;">' + timeFromSeconds(pl[i].length / 1000) + 
             '</p><h1>' + pl[i].name + '</h1></a></li>';
         tmp += child;

webclient/js/gui.js

@@ -94,7 +94,8 @@ function setSongInfo(data) {
  * @param {Object} listuri
  * @param {Object} trackuri
  */
-function popupTracks (listuri, trackuri) {
+function popupTracks (e, listuri, trackuri) {
+    if (!e) var e = window.event;
     //console.log('list: ' + listuri + ', track: ' + trackuri);
     $('#popupTrackName').html(popupData[trackuri].name);
     $('#popupAlbumName').html(popupData[trackuri].album.name);
@@ -131,7 +132,7 @@ function popupTracks (listuri, trackuri) {
 
     $('#popupTracksLv').listview('refresh');
 
-    $('#popupTracks').data("list", listuri).data("track", trackuri).popup( "open", { x: event.pageX, y: event.pageY } );
+    $('#popupTracks').data("list", listuri).data("track", trackuri).popup("open", { x: e.pageX, y: e.pageY } );
     return false;
 }
 

webclient/js/library.js

@@ -39,13 +39,18 @@ function processSearchResults(resultArr) {
     $(SEARCH_TRACK_TABLE).empty();
     $(SEARCH_ARTIST_TABLE).empty();
     $(SEARCH_ALBUM_TABLE).empty();
-    $("#searchresults").show();
     //get the right result
     var results = resultArr[1];
     var tracks = (results.tracks) ? results.tracks : '';
     customTracklists['trackresultscache'] = tracks;
     var artists = (results.artists) ? results.artists : '';
     var albums = (results.albums) ? results.albums : '';
+    if ((tracks == '') && (artists == '') && (albums == '') ) {
+        alert('No results');
+        showLoading(false);
+        return false;
+    }
+    $("#searchresults").show();
     var child = '';
     for (var i = 0; i < artists.length; i++) {
         child += '<li class="resultrow';
@@ -76,8 +81,7 @@ function processSearchResults(resultArr) {
 
     $('#expandsearch').show();
     playlisttotable(results.tracks, SEARCH_TRACK_TABLE, 'trackresultscache');
-            showLoading(false);
-//    $('#allresultloader').hide();
+    showLoading(false);
 }
 
 function toggleSearch() {
@@ -98,13 +102,13 @@ function getCurrentPlaylist() {
     mopidy.tracklist.getTracks().then(processCurrentPlaylist, console.error);
 }
 
+/********************************************************
+ * Show tracks of playlist
+ ********************************************************/
 function showTracklist(uri) {
-    /********************************************************
-     * Show tracks of playlist
-     ********************************************************/
     $(PLAYLIST_TABLE).empty();
     $('#playlisttablediv').show();
-//    $('#playlistloader').show();
+    //    $('#playlistloader').show();
     showLoading(true);
 
     var pl = getPlaylistFromUri(uri);
@@ -131,7 +135,7 @@ function showArtist(nwuri) {
     var pl = getTracksFromUri(nwuri);
     $('#h_artistname').html('');
     showLoading(true);
-//    $('#artistsloader').show();
+    //    $('#artistsloader').show();
     mopidy.library.lookup(nwuri).then(processArtistResults, console.error);
     switchContent('artists', nwuri);
     return false;
@@ -152,7 +156,7 @@ function showAlbum(uri) {
         $('#h_albumname').html('');
         $('#h_albumartist').html('');
         showLoading(true);
-//        $('#albumsloader').show();
+        //        $('#albumsloader').show();
         mopidy.library.lookup(uri).then(processAlbumResults, console.error);
     }
     //show