update photo resolving

dashboard-ui/css/mediaplayer.css

@@ -1,18 +1,23 @@
 /* Now playing bar */
 .nowPlayingBar {
-    padding: 6px 0 14px 0;
+    padding: 16px 0 16px 0;
     border-top: 2px solid green;
     text-align: center;
 }
 
-.nowPlayingBarImage {
-    vertical-align: bottom;
-}
-
 .mediaButton {
     vertical-align: top;
 }
 
+.nowPlayingBar .mediaButton {
+    vertical-align: middle;
+    font-size: 30px;
+    color: #e8e8e8!important;
+    margin: 0 10px;
+    min-width: 30px;
+    text-align: center;
+}
+
 #mediaElement {
     display: inline-block;
     position: relative;
@@ -23,12 +28,14 @@
     font-weight: normal;
     position: relative;
     top: -7px;
-    margin: 0 10px 0 3px;
+    margin: 0 30px 0 3px;
     max-width: 200px;
     overflow: hidden;
     white-space: nowrap;
     text-overflow: ellipsis;
+    vertical-align: middle;
     text-align: left;
+    font-size: 15px;
 }
 
 .nowPlayingDoubleText {
@@ -37,10 +44,11 @@
 
 .nowPlayingImage {
     display: inline-block;
+    vertical-align: middle;
 }
 
     .nowPlayingImage img {
-        height: 40px;
+        height: 50px;
         margin-right: .5em;
         vertical-align: bottom;
     }
@@ -59,7 +67,8 @@
 }
 
 .nowPlayingBar .currentTime {
-    top: -15px;
+    top: inherit;
+    vertical-align: middle;
 }
 
 .mediaSlider {
@@ -78,7 +87,8 @@
 }
 
 .nowPlayingBar .sliderContainer {
-    margin-top: 14px;
+    margin-top: 10px;
+    vertical-align: middle;
 }
 
 .volumeSliderContainer {
@@ -131,7 +141,7 @@ input[type="range"]::-ms-fill-upper {
         margin-bottom: 0;
     }
 
-        .nowPlayingBar .mediaButton:not(#playButton):not(#pauseButton):not(.remoteControlButton) {
+        .nowPlayingBar .mediaButton:not(.playButton):not(.pauseButton):not(.remoteControlButton) {
             display: none;
         }
 
@@ -139,7 +149,7 @@ input[type="range"]::-ms-fill-upper {
         float: right;
     }
 
-    .nowPlayingBar #playButton, .nowPlayingBar #pauseButton {
+    .nowPlayingBar .playButton, .nowPlayingBar .pauseButton {
         float: right;
     }
 

dashboard-ui/css/site.css

@@ -597,7 +597,7 @@ h1 .imageLink {
     z-index: 1097;
     color: #fff;
     border: 0 !important;
-    background-color: #111;
+    background-color: #1a1a1a;
 }
 
 .footerNotification {

dashboard-ui/scripts/dashboardpage.js

@@ -591,7 +591,7 @@
 
         var clientLowered = connection.Client.toLowerCase();
 
-        if (clientLowered == "dashboard") {
+        if (clientLowered == "dashboard" || clientLowered == "emby web client") {
 
             var device = connection.DeviceName.toLowerCase();
 
@@ -613,7 +613,7 @@
                 imgUrl = 'css/images/clients/html5.png';
             }
 
-            return "<img src='" + imgUrl + "' alt='Dashboard' />";
+            return "<img src='" + imgUrl + "' alt='Emby Web Client' />";
         }
         if (clientLowered == "mb-classic") {
 

dashboard-ui/scripts/nowplayingbar.js

@@ -23,16 +23,20 @@
         html += '<div class="nowPlayingBar" style="display:none;">';
         html += '<div style="display:inline-block;width:12px;"></div>';
 
-        html += '<a class="mediaButton remoteControlButton" title="' + Globalize.translate('ButtonRemoteControl') + '" href="nowplaying.html" data-transition="slideup" data-role="button" data-icon="remote" data-iconpos="notext" data-inline="true">' + Globalize.translate('ButtonRemoteControl') + '</a>';
+        html += '<div class="nowPlayingImage"></div>';
+        html += '<div class="nowPlayingText"></div>';
 
-        html += '<a id="playlistButton" class="mediaButton playlistButton" href="nowplaying.html?tab=Playlist" data-transition="slideup" data-role="button" data-icon="bullets" data-iconpos="notext" data-inline="true" title="' + Globalize.translate('ButtonPlaylist') + '">' + Globalize.translate('ButtonPlaylist') + '</a>';
+        html += '<a class="mediaButton remoteControlButton imageButton" href="nowplaying.html" data-transition="slideup" title="' + Globalize.translate('ButtonRemoteControl') + '"><i class="fa fa-tablet"></i></a>';
-        html += '<button id="previousTrackButton" class="mediaButton previousTrackButton" title="' + Globalize.translate('ButtonPreviousTrack') + '" type="button" data-icon="previous-track" data-iconpos="notext" data-inline="true">' + Globalize.translate('ButtonPreviousTrack') + '</button>';
+        html += '<a class="mediaButton playlistButton imageButton" href="nowplaying.html?tab=Playlist" data-transition="slideup" title="' + Globalize.translate('ButtonPlaylist') + '"><i class="fa fa-list"></i></a>';
 
-        html += '<button id="playButton" class="mediaButton unpauseButton" title="' + Globalize.translate('ButtonPlay') + '" type="button" data-icon="play" data-iconpos="notext" data-inline="true">' + Globalize.translate('ButtonPlay') + '</button>';
+        html += '<button class="mediaButton previousTrackButton imageButton" title="' + Globalize.translate('ButtonPreviousTrack') + '" type="button" data-role="none"><i class="fa fa-step-backward"></i></button>';
-        html += '<button id="pauseButton" class="mediaButton pauseButton" title="' + Globalize.translate('ButtonPause') + '" type="button" data-icon="pause" data-iconpos="notext" data-inline="true">' + Globalize.translate('ButtonPause') + '</button>';
 
-        html += '<button id="stopButton" class="mediaButton stopButton" title="' + Globalize.translate('ButtonStop') + '" type="button" data-icon="stop" data-iconpos="notext" data-inline="true">' + Globalize.translate('ButtonStop') + '</button>';
+        html += '<button class="mediaButton unpauseButton imageButton" title="' + Globalize.translate('ButtonPlay') + '" type="button" data-role="none"><i class="fa fa-play"></i></button>';
-        html += '<button id="nextTrackButton" class="mediaButton nextTrackButton" title="' + Globalize.translate('ButtonNextTrack') + '" type="button" data-icon="next-track" data-iconpos="notext" data-inline="true">' + Globalize.translate('ButtonNextTrack') + '</button>';
+        html += '<button class="mediaButton pauseButton imageButton" title="' + Globalize.translate('ButtonPause') + '" type="button" data-role="none"><i class="fa fa-pause"></i></button>';
+
+        html += '<button class="mediaButton stopButton imageButton" title="' + Globalize.translate('ButtonStop') + '" type="button" data-role="none"><i class="fa fa-stop"></i></button>';
+
+        html += '<button class="mediaButton nextTrackButton imageButton" title="' + Globalize.translate('ButtonNextTrack') + '" type="button" data-role="none"><i class="fa fa-step-forward"></i></button>';
 
         html += '<div id="mediaElement"></div>';
 
@@ -41,11 +45,8 @@
         html += '</div>';
 
         html += '<div class="currentTime"></div>';
-        html += '<div class="nowPlayingImage"></div>';
+        html += '<button class="mediaButton muteButton imageButton" title="' + Globalize.translate('ButtonMute') + '" type="button" data-role="none"><i class="fa fa-volume-up"></i></button>';
-        html += '<div class="nowPlayingText"></div>';
+        html += '<button class="mediaButton unmuteButton imageButton" title="' + Globalize.translate('ButtonUnmute') + '" type="button" data-role="none"><i class="fa fa-volume-off"></i></button>';
-
-        html += '<button id="muteButton" class="mediaButton muteButton" title="' + Globalize.translate('ButtonMute') + '" type="button" data-icon="audio" data-iconpos="notext" data-inline="true">' + Globalize.translate('ButtonMute') + '</button>';
-        html += '<button id="unmuteButton" class="mediaButton unmuteButton" title="' + Globalize.translate('ButtonUnmute') + '" type="button" data-icon="volume-off" data-iconpos="notext" data-inline="true">' + Globalize.translate('ButtonUnmute') + '</button>';
 
         html += '<div class="volumeSliderContainer sliderContainer">';
         html += '<input type="range" class="mediaSlider volumeSlider slider" step=".05" min="0" max="100" value="0" style="display:none;" data-mini="true" data-theme="a" data-highlight="true" />';
@@ -298,6 +299,7 @@
         nowPlayingTextElement.html(nameHtml);
 
         var url;
+        var imgHeight = 50;
 
         var nowPlayingItem = state.NowPlayingItem;
 
@@ -305,7 +307,7 @@
 
             url = ApiClient.getScaledImageUrl(nowPlayingItem.PrimaryImageItemId, {
                 type: "Primary",
-                height: 40,
+                height: imgHeight,
                 tag: nowPlayingItem.PrimaryImageTag
             });
         }
@@ -313,7 +315,7 @@
 
             url = ApiClient.getScaledImageUrl(nowPlayingItem.BackdropItemId, {
                 type: "Backdrop",
-                height: 40,
+                height: imgHeight,
                 tag: nowPlayingItem.BackdropImageTag,
                 index: 0
             });
@@ -322,7 +324,7 @@
 
             url = ApiClient.getScaledImageUrl(nowPlayingItem.ThumbImageItemId, {
                 type: "Thumb",
-                height: 40,
+                height: imgHeight,
                 tag: nowPlayingItem.ThumbImageTag
             });
         }

dashboard-ui/scripts/site.js

@@ -42,6 +42,11 @@ var Dashboard = {
         $.mobile.panel.prototype.options.classes.panel = "largePanel ui-panel";
     },
 
+    isRunningInCordova: function () {
+        var isCordovaApp = !!window.cordova;
+        return isCordovaApp;
+    },
+
     onRequestFail: function (e, data) {
 
         if (data.status == 401) {
@@ -230,28 +235,6 @@ var Dashboard = {
         }, 3000);
     },
 
-    alert: function (options) {
-
-        if (typeof options == "string") {
-
-            var message = options;
-
-            $.mobile.loading('show', {
-                text: message,
-                textonly: true,
-                textVisible: true
-            });
-
-            setTimeout(function () {
-                $.mobile.loading('hide');
-            }, 3000);
-
-            return;
-        }
-
-        Dashboard.confirmInternal(options.message, options.title || Globalize.translate('HeaderAlert'), false, options.callback);
-    },
-
     updateSystemInfo: function (info) {
 
         Dashboard.lastSystemInfo = info;
@@ -470,6 +453,53 @@ var Dashboard = {
         Dashboard.alert(Globalize.translate('MessageSettingsSaved'));
     },
 
+    alert: function (options) {
+
+        if (typeof options == "string") {
+
+            var message = options;
+
+            $.mobile.loading('show', {
+                text: message,
+                textonly: true,
+                textVisible: true
+            });
+
+            setTimeout(function () {
+                $.mobile.loading('hide');
+            }, 3000);
+
+            return;
+        }
+
+        if (Dashboard.isRunningInCordova()) {
+
+            navigator.notification.alert(options.message, options.callback || function () { }, options.title || Globalize.translate('HeaderAlert'));
+
+        } else {
+            Dashboard.confirmInternal(options.message, options.title || Globalize.translate('HeaderAlert'), false, options.callback);
+        }
+    },
+
+    confirm: function (message, title, callback) {
+
+        if (Dashboard.isRunningInCordova()) {
+
+            navigator.notification.alert(options.message, options.callback || function () { }, options.title || Globalize.translate('HeaderAlert'));
+
+            var buttonLabels = [Globalize.translate('ButtonOk'), Globalize.translate('ButtonCancel')];
+
+            navigator.notification.confirm(options.message, function (index) {
+
+                options.callback(index == 1);
+
+            }, options.title || Globalize.translate('HeaderAlert'), buttonLabels.join(','));
+
+        } else {
+            Dashboard.confirmInternal(message, title, true, callback);
+        }
+    },
+
     confirmInternal: function (message, title, showCancel, callback) {
 
         $('.confirmFlyout').popup("close").remove();
@@ -508,10 +538,6 @@ var Dashboard = {
         });
     },
 
-    confirm: function (message, title, callback) {
-        Dashboard.confirmInternal(message, title, true, callback);
-    },
-
     refreshSystemInfoFromServer: function () {
 
         if (Dashboard.getAccessToken()) {
@@ -1339,10 +1365,24 @@ var Dashboard = {
             .on('serveraddresschanged.dashboard', Dashboard.onApiClientServerAddressChanged);
     }
 
-    var appName = "Dashboard";
     var appVersion = window.dashboardVersion;
-    var deviceName = generateDeviceName();
+    var appName;
-    var deviceId = MediaBrowser.generateDeviceId();
+    var deviceName;
+    var deviceId;
+
+    if (Dashboard.isRunningInCordova()) {
+
+        appName = "Emby Mobile";
+        deviceName = device.model;
+        deviceId = device.uuid;
+
+    } else {
+
+        appName = "Emby Web Client";
+        deviceName = generateDeviceName();
+        deviceId = MediaBrowser.generateDeviceId();
+    }
+
     var credentialProvider = new MediaBrowser.CredentialProvider();
 
     var capabilities = Dashboard.capabilities();
@@ -1530,8 +1570,17 @@ var Dashboard = {
         }
     }
 
+    if (Dashboard.isRunningInCordova()) {
+
+        document.addEventListener("deviceready", function () {
+
             $(onReady);
 
+        }, false);
+
+    } else {
+        $(onReady);
+    }
 })();
 
 Dashboard.jQueryMobileInit();