Merge pull request #1 from jellyfin/master

.eslintrc.yml

@@ -1,27 +1,71 @@
 env:
-  es6: true
+  es6: false
   browser: true
   amd: true
 
+globals:
+  # New browser globals
+  DataView: readonly
+  MediaMetadata: readonly
+  Promise: readonly
+  # Deprecated browser globals
+  DocumentTouch: readonly
+  # Tizen globals
+  tizen: readonly
+  webapis: readonly
+  # WebOS globals
+  webOS: readonly
+  # Dependency globals
+  $: readonly
+  jQuery: readonly
+  queryString: readonly
+  requirejs: readonly
+  # Jellyfin globals
+  ApiClient: writable
+  AppInfo: writable
+  chrome: writable
+  ConnectionManager: writable
+  DlnaProfilePage: writable
+  Dashboard: writable
+  DashboardPage: writable
+  Emby: readonly
+  Events: writable
+  getParameterByName: writable
+  getWindowLocationSearch: writable
+  Globalize: writable
+  Hls: writable
+  humaneDate: writable
+  humaneElapsed: writable
+  LibraryMenu: writable
+  LinkParser: writable
+  LiveTvHelpers: writable
+  MetadataEditor: writable
+  pageClassOn: writable
+  pageIdOn: writable
+  PlaylistViewer: writable
+  UserParentalControlPage: writable
+  Windows: readonly
+
+extends:
+  - eslint:recommended
+
 rules:
   block-spacing: ["error"]
   brace-style: ["error"]
   comma-dangle: ["error", "never"]
   comma-spacing: ["error"]
-  eol-last: ["off"]
+  eol-last: ["error"]
   indent: ["error", 4, { "SwitchCase": 1 }]
   keyword-spacing: ["error"]
-  line-comment-position: ["off"]
   max-statements-per-line: ["error"]
-  no-empty: ["error"]
-  no-extra-semi: ["error"]
   no-floating-decimal: ["error"]
   no-multi-spaces: ["error"]
   no-multiple-empty-lines: ["error", { "max": 1 }]
   no-trailing-spaces: ["error"]
-  no-void: ["off"]
   one-var: ["error", "never"]
-  padding-line-between-statements: ["off"]
-  semi: ["off"]
+  semi: ["warn"]
   space-before-blocks: ["error"]
-  yoda: ["off"]
+  # TODO: Fix warnings and remove these rules
+  no-redeclare: ["warn"]
+  no-unused-vars: ["warn"]
+  no-useless-escape: ["warn"]

package.json

@@ -31,11 +31,10 @@
     "jellyfin-noto": "https://github.com/jellyfin/jellyfin-noto",
     "jquery": "^3.4.1",
     "jstree": "^3.3.7",
-    "libass-wasm": "^2.1.1",
+    "libass-wasm": "https://github.com/jellyfin/JavascriptSubtitlesOctopus",
     "libjass": "^0.11.0",
     "material-design-icons-iconfont": "^5.0.1",
     "native-promise-only": "^0.8.0-a",
-    "requirejs": "^2.3.5",
     "resize-observer-polyfill": "^1.5.1",
     "shaka-player": "^2.5.9",
     "sortablejs": "^1.10.2",

src/assets/css/fonts.css

@@ -29,7 +29,7 @@ h3 {
 }
 
 .layout-tv {
-    font-size: 2.5vh;
+    font-size: 130%;
 }
 
 .layout-mobile {

src/assets/css/librarybrowser.css

@@ -439,10 +439,42 @@
     background-size: cover;
     background-repeat: no-repeat;
     background-position: center;
+    background-attachment: fixed;
     height: 50vh;
     position: relative;
 }
 
+.layout-desktop .itemBackdrop::after,
+.layout-tv .itemBackdrop::after {
+    content: "";
+    width: 100%;
+    height: 100%;
+    background: rgba(0, 0, 0, 0.65);
+    display: block;
+}
+
+.layout-desktop .noBackdrop .itemBackdrop,
+.layout-tv .noBackdrop .itemBackdrop {
+    display: none;
+}
+
+.detailPageContent {
+    display: flex;
+    flex-direction: column;
+    padding-left: 2%;
+    padding-right: 2%;
+}
+
+.layout-desktop .noBackdrop .detailPageContent,
+.layout-tv .noBackdrop .detailPageContent {
+    margin-top: 2.5em;
+}
+
+.layout-desktop .noBackdrop .detailImageContainer img,
+.layout-tv .noBackdrop .detailImageContainer img {
+    margin-top: 0;
+}
+
 .personBackdrop {
     background-size: contain;
 }
@@ -509,8 +541,6 @@
     display: flex;
     align-items: center;
     align-content: center;
-    position: sticky;
-    top: 3.85em;
     z-index: 2;
 }
 
@@ -520,13 +550,21 @@
     top: 0;
 }
 
-.layout-tv .detailPagePrimaryContainer {
+.layout-tv #itemDetailPage:not(.noBackdrop) .detailPagePrimaryContainer,
+.layout-desktop #itemDetailPage:not(.noBackdrop) .detailPagePrimaryContainer {
     position: relative;
     top: 0;
+    padding-left: 32.45vw;
 }
 
-.detailSticky {
-    background-color: #101010;
+.layout-desktop .detailSticky,
+.layout-tv .detailSticky {
+    margin-top: -7.2em;
+}
+
+.layout-desktop .noBackdrop .detailSticky,
+.layout-tv .noBackdrop .detailSticky {
+    margin-top: 0;
 }
 
 .infoWrapper {
@@ -548,23 +586,17 @@
     margin: 1.25em 0;
 }
 
-.detailPageContent {
-    display: flex;
-    flex-direction: column;
-    padding-left: 2%;
-    padding-right: 2%;
-}
-
 .detailImageContainer {
-    position: sticky;
-    top: 25%;
+    position: relative;
+    margin-top: -25vh;
     float: left;
-    width: 22.786458333333332vw;
+    width: 25vw;
+    z-index: 3;
 }
 
-.layout-mobile .detailImageContainer,
-.layout-tv .detailImageContainer {
-    position: relative;
+.layout-desktop .noBackdrop .detailImageContainer,
+.layout-tv .noBackdrop .detailImageContainer {
+    margin-top: 0;
 }
 
 .detailPagePrimaryContent {
@@ -572,15 +604,19 @@
 }
 
 .detailLogo {
-    width: 25em;
-    height: 9.375em;
+    width: 67.25vw;
+    height: 14.5vh;
     position: absolute;
-    top: 14.5%;
-    right: 10.5%;
+    top: 15vh;
+    right: 0;
     -webkit-background-size: contain;
     background-size: contain;
 }
 
+.noBackdrop .detailLogo {
+    display: none;
+}
+
 @media all and (max-width: 87.5em) {
     .detailLogo {
         right: 5%;
@@ -607,8 +643,8 @@
 
 .itemDetailImage {
     width: 100% !important;
-    box-shadow: 0 0.0725em 0.29em 0 rgba(0, 0, 0, 0.37);
-    -webkit-box-shadow: 0 0.0725em 0.29em 0 rgba(0, 0, 0, 0.37);
+    -webkit-box-shadow: 0 0.1em 0.5em 0 rgba(0, 0, 0, 0.75);
+    box-shadow: 0 0.1em 0.5em 0 rgba(0, 0, 0, 0.75);
 }
 
 div.itemDetailGalleryLink.defaultCardBackground {
@@ -635,6 +671,16 @@ div.itemDetailGalleryLink.defaultCardBackground {
         position: relative;
     }
 
+    .layout-desktop .detailPageWrapperContainer,
+    .layout-tv .detailPageWrapperContainer {
+        margin-top: 7.2em;
+    }
+
+    .layout-tv #itemDetailPage:not(.noBackdrop) .detailPagePrimaryContainer,
+    .layout-desktop #itemDetailPage:not(.noBackdrop) .detailPagePrimaryContainer {
+        padding-left: 3.3%;
+    }
+
     .btnPlaySimple {
         display: none !important;
     }
@@ -849,6 +895,11 @@ div.itemDetailGalleryLink.defaultCardBackground {
     border-collapse: collapse;
 }
 
+.layout-desktop .noBackdrop .detailPageWrapperContainer,
+.layout-tv .noBackdrop .detailPageWrapperContainer {
+    margin-top: 3.8em;
+}
+
 .mediaInfoStream {
     margin: 0 3em 0 0;
     display: inline-block;

src/bundle.js

@@ -47,12 +47,6 @@ _define("howler", function() {
     return howler;
 });
 
-// native-promise-only
-var nativePromise = require("native-promise-only");
-_define("native-promise-only", function() {
-    return nativePromise;
-});
-
 // resize-observer-polyfill
 var resize = require("resize-observer-polyfill").default;
 _define("resize-observer-polyfill", function() {

src/components/alphanumericshortcuts/alphanumericshortcuts.js

@@ -10,7 +10,7 @@ define(['dom', 'focusManager'], function (dom, focusManager) {
         if (e.ctrlKey) {
             return;
         }
-        if (!!e.shiftKey) {
+        if (e.shiftKey) {
             return;
         }
         if (e.altKey) {

src/components/alphapicker/alphapicker.js

@@ -241,7 +241,7 @@ define(['focusManager', 'layoutManager', 'dom', 'css!./style.css', 'paper-icon-b
                     try {
                         btn = element.querySelector('.alphaPickerButton[data-value=\'' + value + '\']');
                     } catch (err) {
-                        console.log('Error in querySelector: ' + err);
+                        console.error('error in querySelector: ' + err);
                     }
 
                     if (btn && btn !== selected) {

src/components/appRouter.js

@@ -14,6 +14,9 @@ define(['loading', 'globalize', 'events', 'viewManager', 'layoutManager', 'skinM
         },
         showSettings: function () {
             show('/settings/settings.html');
+        },
+        showNowPlaying: function () {
+            show("/nowplaying.html");
         }
     };
 
@@ -387,13 +390,13 @@ define(['loading', 'globalize', 'events', 'viewManager', 'layoutManager', 'skinM
         var apiClient = connectionManager.currentApiClient();
         var pathname = ctx.pathname.toLowerCase();
 
-        console.log('appRouter - processing path request ' + pathname);
+        console.debug('appRouter - processing path request ' + pathname);
 
         var isCurrentRouteStartup = currentRouteInfo ? currentRouteInfo.route.startup : true;
         var shouldExitApp = ctx.isBack && route.isDefaultRoute && isCurrentRouteStartup;
 
         if (!shouldExitApp && (!apiClient || !apiClient.isLoggedIn()) && !route.anonymous) {
-            console.log('appRouter - route does not allow anonymous access, redirecting to login');
+            console.debug('appRouter - route does not allow anonymous access, redirecting to login');
             beginConnectionWizard();
             return;
         }
@@ -408,10 +411,10 @@ define(['loading', 'globalize', 'events', 'viewManager', 'layoutManager', 'skinM
 
         if (apiClient && apiClient.isLoggedIn()) {
 
-            console.log('appRouter - user is authenticated');
+            console.debug('appRouter - user is authenticated');
 
             if (route.isDefaultRoute) {
-                console.log('appRouter - loading skin home page');
+                console.debug('appRouter - loading skin home page');
                 loadUserSkinWithOptions(ctx);
                 return;
             } else if (route.roles) {
@@ -425,7 +428,7 @@ define(['loading', 'globalize', 'events', 'viewManager', 'layoutManager', 'skinM
             }
         }
 
-        console.log('appRouter - proceeding to ' + pathname);
+        console.debug('appRouter - proceeding to ' + pathname);
         callback();
     }
 
@@ -672,7 +675,7 @@ define(['loading', 'globalize', 'events', 'viewManager', 'layoutManager', 'skinM
             baseRoute = baseRoute.substring(0, baseRoute.length - 1);
         }
 
-        console.log('Setting page base to ' + baseRoute);
+        console.debug('setting page base to ' + baseRoute);
         page.base(baseRoute);
     }
 

src/components/apphost.js

@@ -186,7 +186,7 @@ define(["appSettings", "browser", "events", "htmlMediaHelper"], function (appSet
 
             return !!cue.length;
         } catch (err) {
-            console.log("error detecting cue support: " + err);
+            console.error("error detecting cue support: " + err);
             return false;
         }
     }
@@ -194,7 +194,7 @@ define(["appSettings", "browser", "events", "htmlMediaHelper"], function (appSet
     function onAppVisible() {
         if (isHidden) {
             isHidden = false;
-            console.log("triggering app resume event");
+            console.debug("triggering app resume event");
             events.trigger(appHost, "resume");
         }
     }
@@ -202,7 +202,7 @@ define(["appSettings", "browser", "events", "htmlMediaHelper"], function (appSet
     function onAppHidden() {
         if (!isHidden) {
             isHidden = true;
-            console.log("app is hidden");
+            console.debug("app is hidden");
         }
     }
 
@@ -314,7 +314,7 @@ define(["appSettings", "browser", "events", "htmlMediaHelper"], function (appSet
                 window.close();
             }
         } catch (err) {
-            console.log("error closing application: " + err);
+            console.error("error closing application: " + err);
         }
     }
 
@@ -324,7 +324,7 @@ define(["appSettings", "browser", "events", "htmlMediaHelper"], function (appSet
       * Ask user for exit
       */
     function askForExit() {
-        if (!!exitPromise) {
+        if (exitPromise) {
             return;
         }
 
@@ -374,7 +374,7 @@ define(["appSettings", "browser", "events", "htmlMediaHelper"], function (appSet
             return -1 !== supportedFeatures.indexOf(command.toLowerCase());
         },
         preferVisualCards: browser.android || browser.chrome,
-        moreIcon: browser.android ? "dots-vert" : "dots-horiz",
+        moreIcon: browser.android ? "more_vert" : "more_horiz",
         getSyncProfile: getSyncProfile,
         getDefaultLayout: function () {
             if (window.NativeShell) {

src/components/autoFocuser.js

@@ -25,7 +25,7 @@ define(["focusManager", "layoutManager"], function (focusManager, layoutManager)
             activeElement = e.target;
         });
 
-        console.log("AutoFocuser enabled");
+        console.debug("AutoFocuser enabled");
     }
 
     /**

src/components/cardbuilder/card.css

@@ -429,6 +429,12 @@ button::-moz-focus-inner {
     font-size: 1.66956521739130434em !important;
 }
 
+.cardOverlayButtonIcon.material-icons {
+    /* material-icons override display, so we need to
+       make a better matching selector to set it to flex */
+    display: flex;
+}
+
 .cardOverlayButton-centered {
     bottom: initial;
     right: initial;
@@ -784,7 +790,7 @@ button::-moz-focus-inner {
     opacity: 0;
     transition: 0.2s;
     background: transparent;
-    padding: 0.5em;
+    padding: 0.25em;
 }
 
 .cardOverlayButtonIcon-hover {

src/components/cardbuilder/cardBuilder.js

@@ -140,7 +140,6 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusMana
                         }
                         return 100 / 72;
                     }
-                    break;
                 case 'overflowPortrait':
 
                     if (layoutManager.tv) {
@@ -166,7 +165,6 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusMana
                         }
                         return 100 / 42;
                     }
-                    break;
                 case 'overflowSquare':
                     if (layoutManager.tv) {
                         return 100 / 15.5;
@@ -191,7 +189,6 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusMana
                         }
                         return 100 / 42;
                     }
-                    break;
                 case 'overflowBackdrop':
                     if (layoutManager.tv) {
                         return 100 / 23.3;
@@ -216,7 +213,6 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusMana
                         }
                         return 100 / 72;
                     }
-                    break;
                 default:
                     return 4;
             }
@@ -342,7 +338,7 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusMana
                             try {
                                 newIndexValue = datetime.toLocaleDateString(datetime.parseISO8601Date(item.PremiereDate), { weekday: 'long', month: 'long', day: 'numeric' });
                             } catch (err) {
-                                console.log('error parsing timestamp for premiere date');
+                                console.error('error parsing timestamp for premiere date');
                             }
                         }
                     } else if (options.indexBy === 'ProductionYear') {
@@ -738,7 +734,7 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusMana
                         airTimeText += ' - ' + datetime.getDisplayTime(date);
                     }
                 } catch (e) {
-                    console.log("Error parsing date: " + item.StartDate);
+                    console.error("error parsing date: " + item.StartDate);
                 }
             }
 
@@ -870,9 +866,10 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusMana
 
                     if (item.PremiereDate) {
                         try {
-
-                            lines.push(getPremiereDateText(item));
-
+                            lines.push(datetime.toLocaleDateString(
+                                datetime.parseISO8601Date(item.PremiereDate),
+                                { weekday: 'long', month: 'long', day: 'numeric' }
+                            ));
                         } catch (err) {
                             lines.push('');
 
@@ -1383,7 +1380,7 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusMana
             }
 
             if (item.Type === 'CollectionFolder' || item.CollectionType) {
-                var refreshClass = item.RefreshProgress || (item.RefreshStatus && virtualFolder.item !== 'Idle') ? '' : ' class="hide"';
+                var refreshClass = item.RefreshProgress ? '' : ' class="hide"';
                 indicatorsHtml += '<div is="emby-itemrefreshindicator"' + refreshClass + ' data-progress="' + (item.RefreshProgress || 0) + '" data-status="' + item.RefreshStatus + '"></div>';
                 requireRefreshIndicator();
             }
@@ -1497,13 +1494,13 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusMana
                 case 'Person':
                     return '<i class="cardImageIcon material-icons">person</i>';
                 case 'Movie':
-                    return '<i class="cardImageIcon material-icons">movie</i>'
+                    return '<i class="cardImageIcon material-icons">movie</i>';
                 case 'Series':
-                    return '<i class="cardImageIcon material-icons">tv</i>'
+                    return '<i class="cardImageIcon material-icons">tv</i>';
                 case 'Book':
-                    return '<i class="cardImageIcon material-icons">book</i>'
+                    return '<i class="cardImageIcon material-icons">book</i>';
                 case 'Folder':
-                    return '<i class="cardImageIcon material-icons">folder</i>'
+                    return '<i class="cardImageIcon material-icons">folder</i>';
             }
 
             if (options && options.defaultCardImageIcon) {

src/components/cardbuilder/chaptercardbuilder.js

@@ -90,7 +90,7 @@ define(['datetime', 'imageLoader', 'connectionManager', 'layoutManager', 'browse
         var cardImageContainer = imgUrl ? ('<div class="' + cardImageContainerClass + ' lazy" data-src="' + imgUrl + '">') : ('<div class="' + cardImageContainerClass + '">');
 
         if (!imgUrl) {
-            cardImageContainer += '<i class="material-icons cardImageIcon">local_movies</i>';
+            cardImageContainer += '<i class="material-icons cardImageIcon local_movies"></i>';
         }
 
         var nameHtml = '';

src/components/channelmapper/channelmapper.js

@@ -84,7 +84,7 @@ define(["dialogHelper", "loading", "connectionManager", "globalize", "actionshee
 
             html += "</div>";
             html += "</div>";
-            html += '<button class="btnMap autoSize" is="paper-icon-button-light" type="button" data-id="' + channel.Id + '" data-providerid="' + channel.ProviderChannelId + '"><i class="material-icons">mode_edit</i></button>';
+            html += '<button class="btnMap autoSize" is="paper-icon-button-light" type="button" data-id="' + channel.Id + '" data-providerid="' + channel.ProviderChannelId + '"><i class="material-icons mode_edit"></i></button>';
             return html += "</div>";
         }
 

src/components/chromecast/chromecasthelpers.js

@@ -131,8 +131,9 @@ define(['events'], function (events) {
                 var links = [];
                 var match;
 
+                // eslint-disable-next-line no-cond-assign
                 while (match = linkRegExp.exec(text)) {
-                    // console.log(matches);
+                    console.debug(match);
                     var txt = match[0];
                     var pos = match.index;
                     var len = txt.length;
@@ -189,7 +190,7 @@ define(['events'], function (events) {
                 return apiClient.getPublicSystemInfo().then(function (info) {
                     var localAddress = info.LocalAddress
                     if (!localAddress) {
-                        console.log("No valid local address returned, defaulting to external one")
+                        console.debug("No valid local address returned, defaulting to external one")
                         localAddress = serverAddress;
                     }
                     addToCache(serverAddress, localAddress);

src/components/chromecast/chromecastplayer.js

@@ -105,7 +105,7 @@ define(['appSettings', 'userSettings', 'playbackManager', 'connectionManager', '
             this.sessionListener.bind(this),
             this.receiverListener.bind(this));
 
-        console.log('chromecast.initialize');
+        console.debug('chromecast.initialize');
         chrome.cast.initialize(apiConfig, this.onInitSuccess.bind(this), this.errorHandler);
     };
 
@@ -114,14 +114,14 @@ define(['appSettings', 'userSettings', 'playbackManager', 'connectionManager', '
      */
     CastPlayer.prototype.onInitSuccess = function () {
         this.isInitialized = true;
-        console.log("chromecast init success");
+        console.debug("chromecast init success");
     };
 
     /**
      * Generic error callback function
      */
     CastPlayer.prototype.onError = function () {
-        console.log("chromecast error");
+        console.debug("chromecast error");
     };
 
     /**
@@ -177,10 +177,10 @@ define(['appSettings', 'userSettings', 'playbackManager', 'connectionManager', '
      */
     CastPlayer.prototype.receiverListener = function (e) {
         if (e === 'available') {
-            console.log("chromecast receiver found");
+            console.debug("chromecast receiver found");
             this.hasReceivers = true;
         } else {
-            console.log("chromecast receiver list empty");
+            console.debug("chromecast receiver list empty");
             this.hasReceivers = false;
         }
     };
@@ -190,7 +190,7 @@ define(['appSettings', 'userSettings', 'playbackManager', 'connectionManager', '
      */
     CastPlayer.prototype.sessionUpdateListener = function (isAlive) {
         if (isAlive) {
-            console.log('sessionUpdateListener: already alive');
+            console.debug('sessionUpdateListener: already alive');
         } else {
             this.session = null;
             this.deviceState = DEVICE_STATE.IDLE;
@@ -198,7 +198,7 @@ define(['appSettings', 'userSettings', 'playbackManager', 'connectionManager', '
             document.removeEventListener("volumeupbutton", onVolumeUpKeyDown, false);
             document.removeEventListener("volumedownbutton", onVolumeDownKeyDown, false);
 
-            console.log('sessionUpdateListener: setting currentMediaSession to null');
+            console.debug('sessionUpdateListener: setting currentMediaSession to null');
             this.currentMediaSession = null;
 
             sendConnectionResult(false);
@@ -211,7 +211,7 @@ define(['appSettings', 'userSettings', 'playbackManager', 'connectionManager', '
      * session request in opt_sessionRequest.
      */
     CastPlayer.prototype.launchApp = function () {
-        console.log("chromecast launching app...");
+        console.debug("chromecast launching app...");
         chrome.cast.requestSession(this.onRequestSessionSuccess.bind(this), this.onLaunchError.bind(this));
     };
 
@@ -220,7 +220,7 @@ define(['appSettings', 'userSettings', 'playbackManager', 'connectionManager', '
      * @param {Object} e A chrome.cast.Session object
      */
     CastPlayer.prototype.onRequestSessionSuccess = function (e) {
-        console.log("chromecast session success: " + e.sessionId);
+        console.debug("chromecast session success: " + e.sessionId);
         this.onSessionConnected(e);
     };
 
@@ -262,7 +262,7 @@ define(['appSettings', 'userSettings', 'playbackManager', 'connectionManager', '
      * Callback function for launch error
      */
     CastPlayer.prototype.onLaunchError = function () {
-        console.log("chromecast launch error");
+        console.debug("chromecast launch error");
         this.deviceState = DEVICE_STATE.ERROR;
         sendConnectionResult(false);
     };
@@ -280,7 +280,7 @@ define(['appSettings', 'userSettings', 'playbackManager', 'connectionManager', '
      * Callback function for stop app success
      */
     CastPlayer.prototype.onStopAppSuccess = function (message) {
-        console.log(message);
+        console.debug(message);
 
         this.deviceState = DEVICE_STATE.IDLE;
         this.castPlayerState = PLAYER_STATE.IDLE;
@@ -296,7 +296,7 @@ define(['appSettings', 'userSettings', 'playbackManager', 'connectionManager', '
      */
     CastPlayer.prototype.loadMedia = function (options, command) {
         if (!this.session) {
-            console.log("no session");
+            console.debug("no session");
             return Promise.reject();
         }
 
@@ -377,7 +377,7 @@ define(['appSettings', 'userSettings', 'playbackManager', 'connectionManager', '
     };
 
     CastPlayer.prototype.onPlayCommandSuccess = function () {
-        //console.log('Message was sent to receiver ok.');
+        console.debug('Message was sent to receiver ok.');
     };
 
     /**
@@ -386,7 +386,7 @@ define(['appSettings', 'userSettings', 'playbackManager', 'connectionManager', '
      */
     CastPlayer.prototype.onMediaDiscovered = function (how, mediaSession) {
 
-        //console.log("chromecast new media session ID:" + mediaSession.mediaSessionId + ' (' + how + ')');
+        console.debug("chromecast new media session ID:" + mediaSession.mediaSessionId + ' (' + how + ')');
         this.currentMediaSession = mediaSession;
 
         if (how === 'loadMedia') {
@@ -405,7 +405,7 @@ define(['appSettings', 'userSettings', 'playbackManager', 'connectionManager', '
      * @param {!Boolean} e true/false
      */
     CastPlayer.prototype.onMediaStatusUpdate = function (e) {
-        //console.log("chromecast updating media: " + e);
+        console.debug("chromecast updating media: " + e);
         if (e === false) {
             this.castPlayerState = PLAYER_STATE.IDLE;
         }
@@ -417,7 +417,7 @@ define(['appSettings', 'userSettings', 'playbackManager', 'connectionManager', '
      */
     CastPlayer.prototype.setReceiverVolume = function (mute, vol) {
         if (!this.currentMediaSession) {
-            //console.log('this.currentMediaSession is null');
+            console.debug('this.currentMediaSession is null');
             return;
         }
 
@@ -443,7 +443,7 @@ define(['appSettings', 'userSettings', 'playbackManager', 'connectionManager', '
      * Callback function for media command success
      */
     CastPlayer.prototype.mediaCommandSuccessCallback = function (info, e) {
-        //console.log(info);
+        console.debug(info);
     };
 
     function normalizeImages(state) {
@@ -493,7 +493,7 @@ define(['appSettings', 'userSettings', 'playbackManager', 'connectionManager', '
 
         events.on(instance._castPlayer, eventName, function (e, data) {
 
-            //console.log('cc: ' + eventName);
+            console.debug('cc: ' + eventName);
             var state = instance.getPlayerStateInternal(data);
 
             events.trigger(instance, eventName, [state]);
@@ -520,14 +520,14 @@ define(['appSettings', 'userSettings', 'playbackManager', 'connectionManager', '
                 playbackManager.setActivePlayer(PlayerName, instance.getCurrentTargetInfo());
             }
 
-            console.log('cc: connect');
+            console.debug('cc: connect');
             // Reset this so that statechange will fire
             instance.lastPlayerData = null;
         });
 
         events.on(instance._castPlayer, "playbackstart", function (e, data) {
 
-            console.log('cc: playbackstart');
+            console.debug('cc: playbackstart');
 
             instance._castPlayer.initializeCastPlayer();
 
@@ -537,7 +537,7 @@ define(['appSettings', 'userSettings', 'playbackManager', 'connectionManager', '
 
         events.on(instance._castPlayer, "playbackstop", function (e, data) {
 
-            console.log('cc: playbackstop');
+            console.debug('cc: playbackstop');
             var state = instance.getPlayerStateInternal(data);
 
             events.trigger(instance, "playbackstop", [state]);
@@ -555,7 +555,7 @@ define(['appSettings', 'userSettings', 'playbackManager', 'connectionManager', '
 
         events.on(instance._castPlayer, "playbackprogress", function (e, data) {
 
-            //console.log('cc: positionchange');
+            console.debug('cc: positionchange');
             var state = instance.getPlayerStateInternal(data);
 
             events.trigger(instance, "timeupdate", [state]);
@@ -569,7 +569,7 @@ define(['appSettings', 'userSettings', 'playbackManager', 'connectionManager', '
 
         events.on(instance._castPlayer, "playstatechange", function (e, data) {
 
-            //console.log('cc: playstatechange');
+            console.debug('cc: playstatechange');
             var state = instance.getPlayerStateInternal(data);
 
             events.trigger(instance, "pause", [state]);
@@ -664,7 +664,7 @@ define(['appSettings', 'userSettings', 'playbackManager', 'connectionManager', '
 
         normalizeImages(data);
 
-        //console.log(JSON.stringify(data));
+        console.debug(JSON.stringify(data));
 
         if (triggerStateChange) {
             events.trigger(this, "statechange", [data]);

src/components/dialogHelper/dialogHelper.js

@@ -32,7 +32,7 @@ define(['appRouter', 'focusManager', 'browser', 'layoutManager', 'inputManager',
             try {
                 parentNode.removeChild(elem);
             } catch (err) {
-                console.log('Error removing dialog element: ' + err);
+                console.error('error removing dialog element: ' + err);
             }
         }
     }

src/components/directorybrowser/directorybrowser.js

@@ -76,7 +76,7 @@ define(['loading', 'dialogHelper', 'dom', 'listViewStyle', 'emby-input', 'paper-
         html += name;
         html += "</div>";
         html += "</div>";
-        html += '<i class="material-icons" style="font-size:inherit;">arrow_forward</i>';
+        html += '<i class="material-icons arrow_forward" style="font-size:inherit;"></i>';
         html += "</div>";
         return html;
     }

src/components/dom.js

@@ -63,13 +63,14 @@ define([], function () {
     var supportsCaptureOption = false;
     try {
         var opts = Object.defineProperty({}, 'capture', {
+            // eslint-disable-next-line getter-return
             get: function () {
                 supportsCaptureOption = true;
             }
         });
         window.addEventListener("test", null, opts);
     } catch (e) {
-        console.log('error checking capture support');
+        console.debug('error checking capture support');
     }
 
     function addEventListenerWithOptions(target, type, handler, options) {

src/components/emby-itemscontainer/emby-itemscontainer.js

@@ -467,7 +467,7 @@ define(['itemShortcuts', 'inputManager', 'connectionManager', 'playbackManager',
                     focusManager.focus(newElement);
                     return;
                 } catch (err) {
-                    console.log(err);
+                    console.error(err);
                 }
             }
         }

src/components/fetchhelper.js

@@ -51,7 +51,7 @@ define([], function () {
 
     function fetchWithTimeout(url, options, timeoutMs) {
 
-        console.log('fetchWithTimeout: timeoutMs: ' + timeoutMs + ', url: ' + url);
+        console.debug('fetchWithTimeout: timeoutMs: ' + timeoutMs + ', url: ' + url);
 
         return new Promise(function (resolve, reject) {
 
@@ -63,14 +63,14 @@ define([], function () {
             fetch(url, options).then(function (response) {
                 clearTimeout(timeout);
 
-                console.log('fetchWithTimeout: succeeded connecting to url: ' + url);
+                console.debug('fetchWithTimeout: succeeded connecting to url: ' + url);
 
                 resolve(response);
             }, function (error) {
 
                 clearTimeout(timeout);
 
-                console.log('fetchWithTimeout: timed out connecting to url: ' + url);
+                console.debug('fetchWithTimeout: timed out connecting to url: ' + url);
 
                 reject();
             });
@@ -93,21 +93,17 @@ define([], function () {
     }
 
     function ajax(request) {
-
         if (!request) {
             throw new Error("Request cannot be null");
         }
 
         request.headers = request.headers || {};
 
-        console.log('requesting url: ' + request.url);
+        console.debug('requesting url: ' + request.url);
 
         return getFetchPromise(request).then(function (response) {
-
-            console.log('response status: ' + response.status + ', url: ' + request.url);
-
+            console.debug('response status: ' + response.status + ', url: ' + request.url);
             if (response.status < 400) {
-
                 if (request.dataType === 'json' || request.headers.accept === 'application/json') {
                     return response.json();
                 } else if (request.dataType === 'text' || (response.headers.get('Content-Type') || '').toLowerCase().indexOf('text/') === 0) {
@@ -118,10 +114,8 @@ define([], function () {
             } else {
                 return Promise.reject(response);
             }
-
         }, function (err) {
-
-            console.log('request failed to url: ' + request.url);
+            console.error('request failed to url: ' + request.url);
             throw err;
         });
     }

src/components/focusManager.js

@@ -43,7 +43,7 @@ define(['dom', 'scrollManager'], function (dom, scrollManager) {
                 preventScroll: scrollManager.isEnabled()
             });
         } catch (err) {
-            console.log('Error in focusManager.autoFocus: ' + err);
+            console.error('Error in focusManager.autoFocus: ' + err);
         }
     }
 

src/components/guide/guide-settings.js

@@ -89,20 +89,6 @@ define(['dialogHelper', 'globalize', 'userSettings', 'layoutManager', 'connectio
         }
     }
 
-    function onSortByChange() {
-        var newValue = this.value;
-        if (this.checked) {
-            var changed = options.query.SortBy !== newValue;
-
-            options.query.SortBy = newValue.replace('_', ',');
-            options.query.StartIndex = 0;
-
-            if (options.callback && changed) {
-                options.callback();
-            }
-        }
-    }
-
     function showEditor(options) {
 
         return new Promise(function (resolve, reject) {

src/components/guide/guide.js

@@ -29,7 +29,6 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
         var offset = newPct - left;
         var pctOfWidth = (offset / width) * 100;
 
-        //console.log(pctOfWidth);
         var guideProgramName = cell.guideProgramName;
         if (!guideProgramName) {
             guideProgramName = cell.querySelector('.guideProgramName');
@@ -396,7 +395,7 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
                 try {
                     program.StartDateLocal = datetime.parseISO8601Date(program.StartDate, { toLocal: true });
                 } catch (err) {
-                    console.log('error parsing timestamp for start date');
+                    console.error('error parsing timestamp for start date');
                 }
             }
 
@@ -404,7 +403,7 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
                 try {
                     program.EndDateLocal = datetime.parseISO8601Date(program.EndDate, { toLocal: true });
                 } catch (err) {
-                    console.log('error parsing timestamp for end date');
+                    console.error('error parsing timestamp for end date');
                 }
             }
 

src/components/guide/tvguide.template.html

@@ -33,6 +33,6 @@
         <i class="material-icons arrow_back"></i>
     </button>
     <button is="paper-icon-button-light" type="button" class="btnNextPage">
-        <i class="material-icons">arrow_forward</i>
+        <i class="material-icons arrow_forward"></i>
     </button>
 </div>

src/components/homesections/homesections.js

@@ -77,7 +77,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la
 
                 var createNowLink = elem.querySelector("#button-createLibrary")
                 if (createNowLink) {
-                    createNowLink.addEventListener("click", () => {
+                    createNowLink.addEventListener("click", function () {
                         Dashboard.navigate("library.html");
                     });
                 }
@@ -290,7 +290,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la
         html += '</div>';
 
         if (enableScrollX()) {
-            html += '<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-mousewheel="false" data-centerfocus="true">';
+            html += '<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-centerfocus="true">';
             html += '<div is="emby-itemscontainer" class="itemsContainer scrollSlider focuscontainer-x">';
         } else {
             html += '<div is="emby-itemscontainer" class="itemsContainer focuscontainer-x padded-left padded-right vertical-wrap">';
@@ -343,7 +343,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la
         if (userViews.length) {
             html += '<h2 class="sectionTitle sectionTitle-cards padded-left">' + globalize.translate('HeaderMyMedia') + '</h2>';
             if (enableScrollX()) {
-                html += '<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-mousewheel="false" data-centerfocus="true">';
+                html += '<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-centerfocus="true">';
                 html += '<div is="emby-itemscontainer" class="itemsContainer scrollSlider focuscontainer-x">';
             } else {
                 html += '<div is="emby-itemscontainer" class="itemsContainer padded-left padded-right focuscontainer-x vertical-wrap">';
@@ -423,7 +423,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la
 
         html += '<h2 class="sectionTitle sectionTitle-cards padded-left">' + globalize.translate('HeaderContinueWatching') + '</h2>';
         if (enableScrollX()) {
-            html += '<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-mousewheel="false" data-centerfocus="true">';
+            html += '<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-centerfocus="true">';
             html += '<div is="emby-itemscontainer" class="itemsContainer scrollSlider focuscontainer-x" data-monitor="videoplayback,markplayed">';
         } else {
             html += '<div is="emby-itemscontainer" class="itemsContainer padded-left padded-right vertical-wrap focuscontainer-x" data-monitor="videoplayback,markplayed">';
@@ -496,7 +496,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la
 
         html += '<h2 class="sectionTitle sectionTitle-cards padded-left">' + globalize.translate('HeaderContinueWatching') + '</h2>';
         if (enableScrollX()) {
-            html += '<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-mousewheel="false" data-centerfocus="true">';
+            html += '<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-centerfocus="true">';
             html += '<div is="emby-itemscontainer" class="itemsContainer scrollSlider focuscontainer-x" data-monitor="audioplayback,markplayed">';
         } else {
             html += '<div is="emby-itemscontainer" class="itemsContainer padded-left padded-right vertical-wrap focuscontainer-x" data-monitor="audioplayback,markplayed">';
@@ -582,7 +582,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la
                 html += '</div>';
 
                 if (enableScrollX()) {
-                    html += '<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-mousewheel="false" data-centerfocus="true" data-scrollbuttons="false">';
+                    html += '<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-centerfocus="true" data-scrollbuttons="false">';
                     html += '<div class="padded-top padded-bottom scrollSlider focuscontainer-x">';
                 } else {
                     html += '<div class="padded-top padded-bottom focuscontainer-x">';
@@ -639,7 +639,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la
                 html += '</div>';
 
                 if (enableScrollX()) {
-                    html += '<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-mousewheel="false" data-centerfocus="true">';
+                    html += '<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-centerfocus="true">';
                     html += '<div is="emby-itemscontainer" class="itemsContainer scrollSlider focuscontainer-x">'
                 } else {
                     html += '<div is="emby-itemscontainer" class="itemsContainer padded-left padded-right vertical-wrap focuscontainer-x">';
@@ -713,7 +713,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la
         html += '</div>';
 
         if (enableScrollX()) {
-            html += '<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-mousewheel="false" data-centerfocus="true">';
+            html += '<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-centerfocus="true">';
             html += '<div is="emby-itemscontainer" class="itemsContainer scrollSlider focuscontainer-x" data-monitor="videoplayback,markplayed">'
         } else {
             html += '<div is="emby-itemscontainer" class="itemsContainer padded-left padded-right vertical-wrap focuscontainer-x" data-monitor="videoplayback,markplayed">';
@@ -785,7 +785,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la
         html += '</div>';
 
         if (enableScrollX()) {
-            html += '<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-mousewheel="false" data-centerfocus="true">';
+            html += '<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-centerfocus="true">';
             html += '<div is="emby-itemscontainer" class="itemsContainer scrollSlider focuscontainer-x">'
         } else {
             html += '<div is="emby-itemscontainer" class="itemsContainer padded-left padded-right vertical-wrap focuscontainer-x">';

src/components/htmlMediaHelper.js

@@ -114,12 +114,12 @@ define(['appSettings', 'browser', 'events'], function (appSettings, browser, eve
 
         if (!recoverDecodingErrorDate || (now - recoverDecodingErrorDate) > 3000) {
             recoverDecodingErrorDate = now;
-            console.log('try to recover media Error ...');
+            console.debug('try to recover media Error ...');
             hlsPlayer.recoverMediaError();
         } else {
             if (!recoverSwapAudioCodecDate || (now - recoverSwapAudioCodecDate) > 3000) {
                 recoverSwapAudioCodecDate = now;
-                console.log('try to swap Audio Codec and recover media Error ...');
+                console.debug('try to swap Audio Codec and recover media Error ...');
                 hlsPlayer.swapAudioCodec();
                 hlsPlayer.recoverMediaError();
             } else {
@@ -233,7 +233,7 @@ define(['appSettings', 'browser', 'events'], function (appSettings, browser, eve
                 return Promise.resolve();
             }
         } catch (err) {
-            console.log('error calling video.play: ' + err);
+            console.error('error calling video.play: ' + err);
             return Promise.reject();
         }
     }
@@ -245,7 +245,7 @@ define(['appSettings', 'browser', 'events'], function (appSettings, browser, eve
             try {
                 player.unload();
             } catch (err) {
-                console.log(err);
+                console.error(err);
             }
 
             instance._castPlayer = null;
@@ -258,7 +258,7 @@ define(['appSettings', 'browser', 'events'], function (appSettings, browser, eve
             try {
                 player.destroy();
             } catch (err) {
-                console.log(err);
+                console.error(err);
             }
 
             instance._shakaPlayer = null;
@@ -271,7 +271,7 @@ define(['appSettings', 'browser', 'events'], function (appSettings, browser, eve
             try {
                 player.destroy();
             } catch (err) {
-                console.log(err);
+                console.error(err);
             }
 
             instance._hlsPlayer = null;
@@ -286,7 +286,7 @@ define(['appSettings', 'browser', 'events'], function (appSettings, browser, eve
                 player.detachMediaElement();
                 player.destroy();
             } catch (err) {
-                console.log(err);
+                console.error(err);
             }
 
             instance._flvPlayer = null;
@@ -307,14 +307,14 @@ define(['appSettings', 'browser', 'events'], function (appSettings, browser, eve
 
         hls.on(Hls.Events.ERROR, function (event, data) {
 
-            console.log('HLS Error: Type: ' + data.type + ' Details: ' + (data.details || '') + ' Fatal: ' + (data.fatal || false));
+            console.error('HLS Error: Type: ' + data.type + ' Details: ' + (data.details || '') + ' Fatal: ' + (data.fatal || false));
 
             switch (data.type) {
                 case Hls.ErrorTypes.NETWORK_ERROR:
                     // try to recover network error
                     if (data.response && data.response.code && data.response.code >= 400) {
 
-                        console.log('hls.js response error code: ' + data.response.code);
+                        console.debug('hls.js response error code: ' + data.response.code);
 
                         // Trigger failure differently depending on whether this is prior to start of playback, or after
                         hls.destroy();
@@ -343,7 +343,7 @@ define(['appSettings', 'browser', 'events'], function (appSettings, browser, eve
 
                             // This could be a CORS error related to access control response headers
 
-                            console.log('hls.js response error code: ' + data.response.code);
+                            console.debug('hls.js response error code: ' + data.response.code);
 
                             // Trigger failure differently depending on whether this is prior to start of playback, or after
                             hls.destroy();
@@ -355,20 +355,20 @@ define(['appSettings', 'browser', 'events'], function (appSettings, browser, eve
                                 onErrorInternal(instance, 'network');
                             }
                         } else {
-                            console.log("fatal network error encountered, try to recover");
+                            console.debug("fatal network error encountered, try to recover");
                             hls.startLoad();
                         }
 
                         break;
                     case Hls.ErrorTypes.MEDIA_ERROR:
-                        console.log("fatal media error encountered, try to recover");
+                        console.debug("fatal media error encountered, try to recover");
                         var currentReject = reject;
                         reject = null;
                         handleHlsJsMediaError(instance, currentReject);
                         break;
                     default:
 
-                        console.log('Cannot recover from hls error - destroy and trigger error');
+                        console.debug('Cannot recover from hls error - destroy and trigger error');
                         // cannot recover
                         // Trigger failure differently depending on whether this is prior to start of playback, or after
                         hls.destroy();

src/components/htmlaudioplayer/plugin.js

@@ -16,7 +16,7 @@ define(['events', 'browser', 'require', 'apphost', 'appSettings', 'htmlMediaHelp
         // Need to record the starting volume on each pass rather than querying elem.volume
         // This is due to iOS safari not allowing volume changes and always returning the system volume value
         var newVolume = Math.max(0, startingVolume - 0.15);
-        console.log('fading volume to ' + newVolume);
+        console.debug('fading volume to ' + newVolume);
         elem.volume = newVolume;
 
         if (newVolume <= 0) {
@@ -113,7 +113,7 @@ define(['events', 'browser', 'require', 'apphost', 'appSettings', 'htmlMediaHelp
             bindEvents(elem);
 
             var val = options.url;
-            console.log('playing url: ' + val);
+            console.debug('playing url: ' + val);
 
             // Convert to seconds
             var seconds = (options.playerStartPositionTicks || 0) / 10000000;
@@ -298,7 +298,7 @@ define(['events', 'browser', 'require', 'apphost', 'appSettings', 'htmlMediaHelp
 
             var errorCode = this.error ? (this.error.code || 0) : 0;
             var errorMessage = this.error ? (this.error.message || '') : '';
-            console.log('Media element error: ' + errorCode.toString() + ' ' + errorMessage);
+            console.error('media element error: ' + errorCode.toString() + ' ' + errorMessage);
 
             var type;
 

src/components/htmlvideoplayer/plugin.js

@@ -1,5 +1,6 @@
 define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackManager', 'appRouter', 'appSettings', 'connectionManager', 'htmlMediaHelper', 'itemHelper', 'fullscreenManager', 'globalize'], function (browser, require, events, appHost, loading, dom, playbackManager, appRouter, appSettings, connectionManager, htmlMediaHelper, itemHelper, fullscreenManager, globalize) {
     "use strict";
+    /* globals cast */
 
     var mediaManager;
 
@@ -11,7 +12,7 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
             try {
                 parentNode.removeChild(elem);
             } catch (err) {
-                console.log('Error removing dialog element: ' + err);
+                console.error('error removing dialog element: ' + err);
             }
         }
     }
@@ -242,7 +243,7 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
 
                 loading.show();
 
-                console.log('prefetching hls playlist: ' + hlsPlaylistUrl);
+                console.debug('prefetching hls playlist: ' + hlsPlaylistUrl);
 
                 return connectionManager.getApiClient(item.ServerId).ajax({
 
@@ -251,7 +252,7 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
 
                 }).then(function () {
 
-                    console.log('completed prefetching hls playlist: ' + hlsPlaylistUrl);
+                    console.debug('completed prefetching hls playlist: ' + hlsPlaylistUrl);
 
                     loading.hide();
                     streamInfo.url = hlsPlaylistUrl;
@@ -260,7 +261,7 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
 
                 }, function () {
 
-                    console.log('error prefetching hls playlist: ' + hlsPlaylistUrl);
+                    console.error('error prefetching hls playlist: ' + hlsPlaylistUrl);
 
                     loading.hide();
                     return Promise.resolve();
@@ -357,6 +358,7 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
             return new Promise(function (resolve, reject) {
 
                 require(['shaka'], function () {
+                    /* globals shaka */
 
                     var player = new shaka.Player(elem);
 
@@ -408,7 +410,7 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
             lrd.media.streamType = cast.receiver.media.StreamType.OTHER;
             lrd.media.customData = options;
 
-            console.log('loading media url into mediaManager');
+            console.debug('loading media url into media manager');
 
             try {
                 mediaManager.load(lrd);
@@ -418,7 +420,7 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
                 return Promise.resolve();
             } catch (err) {
 
-                console.log('mediaManager error: ' + err);
+                console.debug('media manager error: ' + err);
                 return Promise.reject();
             }
         }
@@ -460,11 +462,11 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
                 protocol = cast.player.api.CreateSmoothStreamingProtocol(host);
             }
 
-            console.log('loading playback url: ' + url);
-            console.log('contentType: ' + contentType);
+            console.debug('loading playback url: ' + url);
+            console.debug('content type: ' + contentType);
 
             host.onError = function (errorCode) {
-                console.log("Fatal Error - " + errorCode);
+                console.error("fatal Error - " + errorCode);
             };
 
             mediaElement.autoplay = false;
@@ -499,7 +501,7 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
             elem.removeEventListener('error', onError);
 
             var val = options.url;
-            console.log('playing url: ' + val);
+            console.debug('playing url: ' + val);
 
             // Convert to seconds
             var seconds = (options.playerStartPositionTicks || 0) / 10000000;
@@ -608,7 +610,7 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
                 } else if (currentTrackEvents) {
                     setTrackEventsSubtitleOffset(currentTrackEvents, offsetValue);
                 } else {
-                    console.log("No available track, cannot apply offset: ", offsetValue);
+                    console.debug("No available track, cannot apply offset: ", offsetValue);
                 }
             }
         };
@@ -727,22 +729,18 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
             // https://msdn.microsoft.com/en-us/library/hh772507(v=vs.85).aspx
 
             var elemAudioTracks = elem.audioTracks || [];
-            console.log('found ' + elemAudioTracks.length + ' audio tracks');
+            console.debug('found ' + elemAudioTracks.length + ' audio tracks');
 
             for (i = 0, length = elemAudioTracks.length; i < length; i++) {
 
                 if (audioIndex === i) {
-                    console.log('setting audio track ' + i + ' to enabled');
+                    console.debug('setting audio track ' + i + ' to enabled');
                     elemAudioTracks[i].enabled = true;
                 } else {
-                    console.log('setting audio track ' + i + ' to disabled');
+                    console.debug('setting audio track ' + i + ' to disabled');
                     elemAudioTracks[i].enabled = false;
                 }
             }
-
-            setTimeout(function () {
-                elem.currentTime = elem.currentTime;
-            }, 100);
         };
 
         self.stop = function (destroyPlayer) {
@@ -911,7 +909,7 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
         function onError() {
             var errorCode = this.error ? (this.error.code || 0) : 0;
             var errorMessage = this.error ? (this.error.message || '') : '';
-            console.log('Media element error: ' + errorCode.toString() + ' ' + errorMessage);
+            console.error('media element error: ' + errorCode.toString() + ' ' + errorMessage);
 
             var type;
 
@@ -1058,8 +1056,9 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
                     return i.DeliveryUrl;
                 }),
                 workerUrl: appRouter.baseUrl() + "/libraries/subtitles-octopus-worker.js",
+                legacyWorkerUrl: appRouter.baseUrl() + "/libraries/subtitles-octopus-worker-legacy.js",
                 onError: function() {
-                    htmlMediaHelper.onErrorInternal(self, 'mediadecodeerror')
+                    htmlMediaHelper.onErrorInternal(self, 'mediadecodeerror');
                 }
             };
             require(['JavascriptSubtitlesOctopus'], function(SubtitlesOctopus) {
@@ -1115,9 +1114,10 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
 
         function renderSsaAss(videoElement, track, item) {
             if (supportsCanvas() && supportsWebWorkers()) {
+                console.debug('rendering subtitles with SubtitlesOctopus');
                 renderWithSubtitlesOctopus(videoElement, track, item);
             } else {
-                console.log('rendering subtitles with libjass');
+                console.debug('rendering subtitles with libjass');
                 renderWithLibjass(videoElement, track, item);
             }
         }
@@ -1137,7 +1137,7 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
                 var videoElement = self._mediaElement;
                 var width = videoElement.offsetWidth;
                 var height = videoElement.offsetHeight;
-                console.log('videoElement resized: ' + width + 'x' + height);
+                console.debug('videoElement resized: ' + width + 'x' + height);
                 renderer.resize(width, height, 0, 0);
             }
         }
@@ -1254,7 +1254,7 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
                         trackElement.removeCue(trackElement.cues[0]);
                     }
                 } catch (e) {
-                    console.log('Error removing cue from textTrack');
+                    console.error('error removing cue from textTrack');
                 }
 
                 trackElement.mode = 'disabled';
@@ -1268,7 +1268,7 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
             fetchSubtitles(track, item).then(function (data) {
 
                 // show in ui
-                console.log('downloaded ' + data.TrackEvents.length + ' track events');
+                console.debug('downloaded ' + data.TrackEvents.length + ' track events');
                 // add some cues to show the text
                 // in safari, the cues need to be added before setting the track mode to showing
                 data.TrackEvents.forEach(function (trackEvent) {
@@ -1294,7 +1294,7 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
                 try {
                     clock.seek(timeMs / 1000);
                 } catch (err) {
-                    console.log('Error in libjass: ' + err);
+                    console.error('error in libjass: ' + err);
                 }
                 return;
             }
@@ -1327,7 +1327,7 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
 
         function setCurrentTrackElement(streamIndex) {
 
-            console.log('Setting new text track index to: ' + streamIndex);
+            console.debug('setting new text track index to: ' + streamIndex);
 
             var mediaStreamTextTracks = getMediaStreamTextTracks(self._currentPlayOptions.mediaSource);
 
@@ -1348,38 +1348,6 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
             }
         }
 
-        function updateTextStreamUrls(startPositionTicks) {
-
-            if (!supportsTextTracks()) {
-                return;
-            }
-
-            var allTracks = self._mediaElement.textTracks; // get list of tracks
-            var i;
-            var track;
-
-            for (i = 0; i < allTracks.length; i++) {
-
-                track = allTracks[i];
-
-                // This throws an error in IE, but is fine in chrome
-                // In IE it's not necessary anyway because changing the src seems to be enough
-                try {
-                    while (track.cues.length) {
-                        track.removeCue(track.cues[0]);
-                    }
-                } catch (e) {
-                    console.log('Error removing cue from textTrack');
-                }
-            }
-
-            var tracks = self._mediaElement.querySelectorAll('track');
-            for (i = 0; i < tracks.length; i++) {
-                track = tracks[i];
-                track.src = replaceQueryString(track.src, 'startPositionTicks', startPositionTicks);
-            }
-        }
-
         function createMediaElement(options) {
 
             if (browser.tv || browser.iOS || browser.mobile) {
@@ -1590,7 +1558,7 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
     };
 
     function onPictureInPictureError(err) {
-        console.log('Picture in picture error: ' + err.toString());
+        console.error('Picture in picture error: ' + err.toString());
     }
 
     HtmlVideoPlayer.prototype.setPictureInPictureEnabled = function (isEnabled) {
@@ -1651,9 +1619,13 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
         if (document.AirPlayEnabled) {
             if (video) {
                 if (isEnabled) {
-                    video.requestAirPlay().catch(onAirPlayError);
+                    video.requestAirPlay().catch(function(err) {
+                        console.error("Error requesting AirPlay", err)
+                    });
                 } else {
-                    document.exitAirPLay().catch(onAirPlayError);
+                    document.exitAirPLay().catch(function(err) {
+                        console.error("Error exiting AirPlay", err)
+                    });
                 }
             }
         } else {

src/components/humanedate.js

@@ -25,6 +25,7 @@ define(["datetime"], function (datetime) {
         if (seconds < 0) {
             seconds = Math.abs(seconds);
         }
+        // eslint-disable-next-line no-cond-assign
         for (; format = time_formats[i++];) {
             if (seconds < format[0]) {
                 if (2 == format.length) {

src/components/imagedownloader/imagedownloader.js

@@ -117,7 +117,7 @@ define(['loading', 'apphost', 'dialogHelper', 'connectionManager', 'imageLoader'
             html += '<div data-role="controlgroup" data-type="horizontal" style="display:inline-block;">';
 
             html += '<button is="paper-icon-button-light" title="' + globalize.translate('Previous') + '" class="btnPreviousPage autoSize" ' + (startIndex ? '' : 'disabled') + '><i class="material-icons arrow_back"></i></button>';
-            html += '<button is="paper-icon-button-light" title="' + globalize.translate('Next') + '" class="btnNextPage autoSize" ' + (startIndex + limit >= totalRecordCount ? 'disabled' : '') + '><i class="material-icons">arrow_forward</i></button>';
+            html += '<button is="paper-icon-button-light" title="' + globalize.translate('Next') + '" class="btnNextPage autoSize" ' + (startIndex + limit >= totalRecordCount ? 'disabled' : '') + '><i class="material-icons arrow_forward"></i></button>';
             html += '</div>';
         }
 
@@ -277,7 +277,7 @@ define(['loading', 'apphost', 'dialogHelper', 'connectionManager', 'imageLoader'
         if (enableFooterButtons) {
             html += '<div class="cardText cardTextCentered">';
 
-            html += '<button is="paper-icon-button-light" class="btnDownloadRemoteImage autoSize" raised" title="' + globalize.translate('Download') + '"><i class="material-icons">cloud_download</i></button>';
+            html += '<button is="paper-icon-button-light" class="btnDownloadRemoteImage autoSize" raised" title="' + globalize.translate('Download') + '"><i class="material-icons cloud_download"></i></button>';
             html += '</div>';
         }
 

src/components/imageuploader/imageuploader.js

@@ -47,7 +47,7 @@ define(['dialogHelper', 'connectionManager', 'dom', 'loading', 'scrollHelper', '
         };
         reader.onabort = function () {
             loading.hide();
-            console.log('File read cancelled');
+            console.debug('File read cancelled');
         };
 
         // Closure to capture the file information.

src/components/indicators/indicators.js

@@ -62,7 +62,7 @@ define(['datetime', 'itemHelper', 'css!./indicators.css', 'material-icons'], fun
                 startDate = datetime.parseISO8601Date(item.StartDate).getTime();
                 endDate = datetime.parseISO8601Date(item.EndDate).getTime();
             } catch (err) {
-                console.log(err);
+                console.error(err);
             }
 
             var now = new Date().getTime();
@@ -174,7 +174,7 @@ define(['datetime', 'itemHelper', 'css!./indicators.css', 'material-icons'], fun
                         return '<div class="unairedIndicator">Unaired</div>';
                     }
                 } catch (err) {
-                    console.log(err);
+                    console.error(err);
                 }
             }
             return '<div class="missingIndicator">Missing</div>';

src/components/input/gamepadtokey.js

@@ -251,114 +251,150 @@ require(['apphost'], function (appHost) {
         }
     }
 
+    var inputLoopTimer;
     function runInputLoop() {
         // Get the latest gamepad state.
-        var gamepads;
-        if (navigator.getGamepads) {
-            gamepads = navigator.getGamepads();
-        } else if (navigator.webkitGetGamepads) {
-            gamepads = navigator.webkitGetGamepads();
-        }
-        gamepads = gamepads || [];
-        var i;
-        var j;
-        var len;
-        for (i = 0, len = gamepads.length; i < len; i++) {
+        var gamepads = navigator.getGamepads();
+        for (var i = 0, len = gamepads.length; i < len; i++) {
             var gamepad = gamepads[i];
-            if (gamepad) {
-                // Iterate through the axes
-                var axes = gamepad.axes;
-                var leftStickX = axes[0];
-                var leftStickY = axes[1];
-                if (leftStickX > _THUMB_STICK_THRESHOLD) { // Right
-                    _ButtonPressedState.setleftThumbstickRight(true);
-                } else if (leftStickX < -_THUMB_STICK_THRESHOLD) { // Left
-                    _ButtonPressedState.setleftThumbstickLeft(true);
-                } else if (leftStickY < -_THUMB_STICK_THRESHOLD) { // Up
-                    _ButtonPressedState.setleftThumbstickUp(true);
-                } else if (leftStickY > _THUMB_STICK_THRESHOLD) { // Down
-                    _ButtonPressedState.setleftThumbstickDown(true);
-                } else {
-                    _ButtonPressedState.setleftThumbstickLeft(false);
-                    _ButtonPressedState.setleftThumbstickRight(false);
-                    _ButtonPressedState.setleftThumbstickUp(false);
-                    _ButtonPressedState.setleftThumbstickDown(false);
-                }
-                // Iterate through the buttons to see if Left thumbstick, DPad, A and B are pressed.
-                var buttons = gamepad.buttons;
-                for (j = 0, len = buttons.length; j < len; j++) {
-                    if (ProcessedButtons.indexOf(j) !== -1) {
-
-                        if (buttons[j].pressed) {
-                            switch (j) {
-                                case _GAMEPAD_DPAD_UP_BUTTON_INDEX:
-                                    _ButtonPressedState.setdPadUp(true);
-                                    break;
-                                case _GAMEPAD_DPAD_DOWN_BUTTON_INDEX:
-                                    _ButtonPressedState.setdPadDown(true);
-                                    break;
-                                case _GAMEPAD_DPAD_LEFT_BUTTON_INDEX:
-                                    _ButtonPressedState.setdPadLeft(true);
-                                    break;
-                                case _GAMEPAD_DPAD_RIGHT_BUTTON_INDEX:
-                                    _ButtonPressedState.setdPadRight(true);
-                                    break;
-                                case _GAMEPAD_A_BUTTON_INDEX:
-                                    _ButtonPressedState.setgamepadA(true);
-                                    break;
-                                case _GAMEPAD_B_BUTTON_INDEX:
-                                    _ButtonPressedState.setgamepadB(true);
-                                    break;
-                                default:
-                                    // No-op
-                                    break;
-                            }
-                        } else {
-                            switch (j) {
-                                case _GAMEPAD_DPAD_UP_BUTTON_INDEX:
-                                    if (_ButtonPressedState.getdPadUp()) {
-                                        _ButtonPressedState.setdPadUp(false);
-                                    }
-                                    break;
-                                case _GAMEPAD_DPAD_DOWN_BUTTON_INDEX:
-                                    if (_ButtonPressedState.getdPadDown()) {
-                                        _ButtonPressedState.setdPadDown(false);
-                                    }
-                                    break;
-                                case _GAMEPAD_DPAD_LEFT_BUTTON_INDEX:
-                                    if (_ButtonPressedState.getdPadLeft()) {
-                                        _ButtonPressedState.setdPadLeft(false);
-                                    }
-                                    break;
-                                case _GAMEPAD_DPAD_RIGHT_BUTTON_INDEX:
-                                    if (_ButtonPressedState.getdPadRight()) {
-                                        _ButtonPressedState.setdPadRight(false);
-                                    }
-                                    break;
-                                case _GAMEPAD_A_BUTTON_INDEX:
-                                    if (_ButtonPressedState.getgamepadA()) {
-                                        _ButtonPressedState.setgamepadA(false);
-                                    }
-                                    break;
-                                case _GAMEPAD_B_BUTTON_INDEX:
-                                    if (_ButtonPressedState.getgamepadB()) {
-                                        _ButtonPressedState.setgamepadB(false);
-                                    }
-                                    break;
-                                default:
-                                    // No-op
-                                    break;
-                            }
+            if (!gamepad) {
+                continue;
+            }
+            // Iterate through the axes
+            var axes = gamepad.axes;
+            var leftStickX = axes[0];
+            var leftStickY = axes[1];
+            if (leftStickX > _THUMB_STICK_THRESHOLD) { // Right
+                _ButtonPressedState.setleftThumbstickRight(true);
+            } else if (leftStickX < -_THUMB_STICK_THRESHOLD) { // Left
+                _ButtonPressedState.setleftThumbstickLeft(true);
+            } else if (leftStickY < -_THUMB_STICK_THRESHOLD) { // Up
+                _ButtonPressedState.setleftThumbstickUp(true);
+            } else if (leftStickY > _THUMB_STICK_THRESHOLD) { // Down
+                _ButtonPressedState.setleftThumbstickDown(true);
+            } else {
+                _ButtonPressedState.setleftThumbstickLeft(false);
+                _ButtonPressedState.setleftThumbstickRight(false);
+                _ButtonPressedState.setleftThumbstickUp(false);
+                _ButtonPressedState.setleftThumbstickDown(false);
+            }
+            // Iterate through the buttons to see if Left thumbstick, DPad, A and B are pressed.
+            var buttons = gamepad.buttons;
+            for (var j = 0, len = buttons.length; j < len; j++) {
+                if (ProcessedButtons.indexOf(j) !== -1) {
+                    if (buttons[j].pressed) {
+                        switch (j) {
+                            case _GAMEPAD_DPAD_UP_BUTTON_INDEX:
+                                _ButtonPressedState.setdPadUp(true);
+                                break;
+                            case _GAMEPAD_DPAD_DOWN_BUTTON_INDEX:
+                                _ButtonPressedState.setdPadDown(true);
+                                break;
+                            case _GAMEPAD_DPAD_LEFT_BUTTON_INDEX:
+                                _ButtonPressedState.setdPadLeft(true);
+                                break;
+                            case _GAMEPAD_DPAD_RIGHT_BUTTON_INDEX:
+                                _ButtonPressedState.setdPadRight(true);
+                                break;
+                            case _GAMEPAD_A_BUTTON_INDEX:
+                                _ButtonPressedState.setgamepadA(true);
+                                break;
+                            case _GAMEPAD_B_BUTTON_INDEX:
+                                _ButtonPressedState.setgamepadB(true);
+                                break;
+                            default:
+                                // No-op
+                                break;
+                        }
+                    } else {
+                        switch (j) {
+                            case _GAMEPAD_DPAD_UP_BUTTON_INDEX:
+                                if (_ButtonPressedState.getdPadUp()) {
+                                    _ButtonPressedState.setdPadUp(false);
+                                }
+                                break;
+                            case _GAMEPAD_DPAD_DOWN_BUTTON_INDEX:
+                                if (_ButtonPressedState.getdPadDown()) {
+                                    _ButtonPressedState.setdPadDown(false);
+                                }
+                                break;
+                            case _GAMEPAD_DPAD_LEFT_BUTTON_INDEX:
+                                if (_ButtonPressedState.getdPadLeft()) {
+                                    _ButtonPressedState.setdPadLeft(false);
+                                }
+                                break;
+                            case _GAMEPAD_DPAD_RIGHT_BUTTON_INDEX:
+                                if (_ButtonPressedState.getdPadRight()) {
+                                    _ButtonPressedState.setdPadRight(false);
+                                }
+                                break;
+                            case _GAMEPAD_A_BUTTON_INDEX:
+                                if (_ButtonPressedState.getgamepadA()) {
+                                    _ButtonPressedState.setgamepadA(false);
+                                }
+                                break;
+                            case _GAMEPAD_B_BUTTON_INDEX:
+                                if (_ButtonPressedState.getgamepadB()) {
+                                    _ButtonPressedState.setgamepadB(false);
+                                }
+                                break;
+                            default:
+                                // No-op
+                                break;
                         }
                     }
                 }
             }
         }
         // Schedule the next one
-        requestAnimationFrame(runInputLoop);
+        inputLoopTimer = requestAnimationFrame(runInputLoop);
     }
 
-    runInputLoop();
+    function startInputLoop() {
+        if (!inputLoopTimer) {
+            runInputLoop();
+        }
+    }
+
+    function stopInputLoop() {
+        cancelAnimationFrame(inputLoopTimer);
+        inputLoopTimer = undefined;
+    }
+
+    function isGamepadConnected() {
+        var gamepads = navigator.getGamepads();
+        for (var i = 0, len = gamepads.length; i < len; i++) {
+            var gamepad = gamepads[i];
+            if (gamepad && gamepad.connected) {
+                return true;
+            }
+        }
+        return false;
+    }
+
+    function onFocusOrGamepadAttach(e) {
+        if (isGamepadConnected() && document.hasFocus()) {
+            console.log("Gamepad connected! Starting input loop");
+            startInputLoop();
+        }
+    }
+
+    function onFocusOrGamepadDetach(e) {
+        if (!isGamepadConnected() || !document.hasFocus()) {
+            console.log("Gamepad disconnected! No other gamepads are connected, stopping input loop");
+            stopInputLoop();
+        } else {
+            console.log("Gamepad disconnected! There are gamepads still connected.");
+        }
+    }
+
+    // Event listeners for any change in gamepads' state.
+    window.addEventListener("gamepaddisconnected", onFocusOrGamepadDetach);
+    window.addEventListener("gamepadconnected", onFocusOrGamepadAttach);
+    window.addEventListener("blur", onFocusOrGamepadDetach);
+    window.addEventListener("focus", onFocusOrGamepadAttach);
+
+    onFocusOrGamepadAttach();
 
     // The gamepadInputEmulation is a string property that exists in JavaScript UWAs and in WebViews in UWAs.
     // It won't exist in Win8.1 style apps or browsers.

src/components/input/keyboardnavigation.js

@@ -1,8 +1,6 @@
 define(["inputManager", "layoutManager"], function (inputManager, layoutManager) {
     "use strict";
 
-    console.log("keyboardnavigation");
-
     /**
      * Key name mapping.
      */
@@ -45,7 +43,7 @@ define(["inputManager", "layoutManager"], function (inputManager, layoutManager)
     try {
         hasFieldKey = "key" in new KeyboardEvent("keydown");
     } catch (e) {
-        console.log("error checking 'key' field");
+        console.error("error checking 'key' field");
     }
 
     if (!hasFieldKey) {
@@ -142,12 +140,23 @@ define(["inputManager", "layoutManager"], function (inputManager, layoutManager)
             }
 
             if (capture) {
-                console.log("Disabling default event handling");
+                console.debug("disabling default event handling");
                 e.preventDefault();
             }
         });
     }
 
+    // Gamepad initialisation. No script is required if no gamepads are present at init time, saving a bit of resources.
+    // Whenever the gamepad is connected, we hand all the control of the gamepad to gamepadtokey.js by removing the event handler
+    function attachGamepadScript(e) {
+        console.log("Gamepad connected! Attaching gamepadtokey.js script");
+        window.removeEventListener("gamepadconnected", attachGamepadScript);
+        require(["components/input/gamepadtokey"]);
+    }
+
+    // No need to check for gamepads manually at load time, the eventhandler will be fired for that
+    window.addEventListener("gamepadconnected", attachGamepadScript);
+
     return {
         enable: enable,
         getKeyName: getKeyName,

src/components/libraryoptionseditor/libraryoptionseditor.js

@@ -58,7 +58,7 @@ define(["globalize", "dom", "emby-checkbox", "emby-select", "emby-input"], funct
         for (var i = 0; i < plugins.length; i++) {
             var plugin = plugins[i];
             html += '<div class="listItem localReaderOption sortableOption" data-pluginname="' + plugin.Name + '">';
-            html += '<i class="listItemIcon material-icons">live_tv</i>';
+            html += '<i class="listItemIcon material-icons live_tv"></i>';
             html += '<div class="listItemBody">';
             html += '<h3 class="listItemBodyText">';
             html += plugin.Name;
@@ -463,7 +463,7 @@ define(["globalize", "dom", "emby-checkbox", "emby-select", "emby-input"], funct
 
             if (!typeOptions) {
                 typeOptions = {
-                    Type: type
+                    Type: originalTypeOption.Type
                 };
                 options.TypeOptions.push(typeOptions);
             }

src/components/listview/listview.js

@@ -269,7 +269,6 @@ define(['itemHelper', 'mediaInfo', 'indicators', 'connectionManager', 'layoutMan
 
             if (options.image !== false) {
                 var imgUrl = options.imageSource === 'channel' ? getChannelImageUrl(item, downloadWidth) : getImageUrl(item, downloadWidth);
-                console.log(imgUrl);
                 var imageClass = isLargeStyle ? 'listItemImage listItemImage-large' : 'listItemImage';
 
                 if (isLargeStyle && layoutManager.tv) {

src/components/mediainfo/mediainfo.js

@@ -57,7 +57,7 @@ define(['datetime', 'globalize', 'appRouter', 'itemHelper', 'indicators', 'mater
 
                 miscInfo.push(text);
             } catch (e) {
-                console.log("Error parsing date: " + item.StartDate);
+                console.error("error parsing date: " + item.StartDate);
             }
         }
 
@@ -143,7 +143,7 @@ define(['datetime', 'globalize', 'appRouter', 'itemHelper', 'indicators', 'mater
                     text = datetime.toLocaleDateString(date);
                     miscInfo.push(text);
                 } catch (e) {
-                    console.log("Error parsing date: " + item.PremiereDate);
+                    console.error("error parsing date: " + item.PremiereDate);
                 }
             }
         }
@@ -176,7 +176,7 @@ define(['datetime', 'globalize', 'appRouter', 'itemHelper', 'indicators', 'mater
                     miscInfo.push(text);
                 }
             } catch (e) {
-                console.log("Error parsing date: " + item.StartDate);
+                console.error("error parsing date: " + item.StartDate);
             }
         }
 
@@ -200,7 +200,7 @@ define(['datetime', 'globalize', 'appRouter', 'itemHelper', 'indicators', 'mater
                         }
 
                     } catch (e) {
-                        console.log("Error parsing date: " + item.EndDate);
+                        console.error("error parsing date: " + item.EndDate);
                     }
                 }
 
@@ -248,7 +248,7 @@ define(['datetime', 'globalize', 'appRouter', 'itemHelper', 'indicators', 'mater
                     text = globalize.translate('OriginalAirDateValue', datetime.toLocaleDateString(date));
                     miscInfo.push(text);
                 } catch (e) {
-                    console.log("Error parsing date: " + item.PremiereDate);
+                    console.error("error parsing date: " + item.PremiereDate);
                 }
             } else if (item.ProductionYear) {
                 miscInfo.push(item.ProductionYear);
@@ -267,7 +267,7 @@ define(['datetime', 'globalize', 'appRouter', 'itemHelper', 'indicators', 'mater
                         text = datetime.parseISO8601Date(item.PremiereDate).getFullYear();
                         miscInfo.push(text);
                     } catch (e) {
-                        console.log("Error parsing date: " + item.PremiereDate);
+                        console.error("error parsing date: " + item.PremiereDate);
                     }
                 }
             }

src/components/metadataeditor/metadataeditor.js

@@ -477,7 +477,7 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi
             html += '</div>';
 
             if (formatString) {
-                html += '<button type="button" is="paper-icon-button-light" class="btnOpenExternalId align-self-flex-end" data-fieldid="' + id + '"><i class="material-icons">open_in_browser</i></button>';
+                html += '<button type="button" is="paper-icon-button-light" class="btnOpenExternalId align-self-flex-end" data-fieldid="' + id + '"><i class="material-icons open_in_browser"></i></button>';
             }
             html += '</div>';
 
@@ -917,7 +917,7 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi
         for (var i = 0; i < items.length; i++) {
             html += '<div class="listItem">';
 
-            html += '<i class="material-icons listItemIcon" style="background-color:#333;">live_tv</i>';
+            html += '<i class="material-icons listItemIcon live_tv" style="background-color:#333;"></i>';
 
             html += '<div class="listItemBody">';
 

src/components/nowplayingbar/nowplayingbar.js

@@ -54,7 +54,7 @@ define(['require', 'datetime', 'itemHelper', 'events', 'browser', 'imageLoader',
 
         html += '<div class="nowPlayingBarRight">';
 
-        html += '<button is="paper-icon-button-light" class="muteButton mediaButton"><i class="material-icons volume_up"></i></button>';
+        html += '<button is="paper-icon-button-light" class="muteButton mediaButton"><i class="material-icons"></i></button>';
 
         html += '<div class="sliderContainer nowPlayingBarVolumeSliderContainer hide" style="width:9em;vertical-align:middle;display:inline-flex;">';
         html += '<input type="range" is="emby-slider" pin step="1" min="0" max="100" value="0" class="slider-medium-thumb nowPlayingBarVolumeSlider"/>';
@@ -591,8 +591,7 @@ define(['require', 'datetime', 'itemHelper', 'events', 'browser', 'imageLoader',
     }
 
     function onPlaybackStart(e, state) {
-
-        //console.log('nowplaying event: ' + e.type);
+        console.debug('nowplaying event: ' + e.type);
 
         var player = this;
 
@@ -637,7 +636,7 @@ define(['require', 'datetime', 'itemHelper', 'events', 'browser', 'imageLoader',
 
     function onPlaybackStopped(e, state) {
 
-        //console.log('nowplaying event: ' + e.type);
+        console.debug('nowplaying event: ' + e.type);
         var player = this;
 
         if (player.isLocalPlayer) {
@@ -663,7 +662,7 @@ define(['require', 'datetime', 'itemHelper', 'events', 'browser', 'imageLoader',
 
     function onStateChanged(event, state) {
 
-        //console.log('nowplaying event: ' + e.type);
+        console.debug('nowplaying event: ' + event.type);
         var player = this;
 
         if (!state.NowPlayingItem || layoutManager.tv) {

src/components/playback/playbackmanager.js

@@ -57,7 +57,7 @@ define(['events', 'datetime', 'appSettings', 'itemHelper', 'pluginManager', 'pla
             addPlaylistToPlaybackReport(playbackManagerInstance, info, player, serverId);
         }
 
-        //console.log(method + '-' + JSON.stringify(info));
+        console.debug(method + '-' + JSON.stringify(info));
         var apiClient = connectionManager.getApiClient(serverId);
         apiClient[method](info);
     }
@@ -1024,7 +1024,7 @@ define(['events', 'datetime', 'appSettings', 'itemHelper', 'pluginManager', 'pla
             currentTargetInfo = targetInfo;
 
             if (targetInfo) {
-                console.log('Active player: ' + JSON.stringify(targetInfo));
+                console.debug('Active player: ' + JSON.stringify(targetInfo));
             }
 
             if (player && player.isLocalPlayer) {
@@ -2828,7 +2828,7 @@ define(['events', 'datetime', 'appSettings', 'itemHelper', 'pluginManager', 'pla
 
             if (newItemInfo) {
 
-                console.log('playing next track');
+                console.debug('playing next track');
 
                 var newItemPlayOptions = newItemInfo.item.playOptions || getDefaultPlayOptions();
 
@@ -3118,7 +3118,7 @@ define(['events', 'datetime', 'appSettings', 'itemHelper', 'pluginManager', 'pla
             // medianotsupported
             var errorType = error.type;
 
-            console.log('playbackmanager playback error type: ' + (errorType || ''));
+            console.debug('playbackmanager playback error type: ' + (errorType || ''));
 
             var streamInfo = error.streamInfo || getPlayerData(player).streamInfo;
 
@@ -3401,7 +3401,7 @@ define(['events', 'datetime', 'appSettings', 'itemHelper', 'pluginManager', 'pla
 
         function getLiveStreamMediaInfo(player, streamInfo, mediaSource, liveStreamId, serverId) {
 
-            console.log('getLiveStreamMediaInfo');
+            console.debug('getLiveStreamMediaInfo');
 
             streamInfo.lastMediaInfoQuery = new Date().getTime();
 
@@ -3961,7 +3961,7 @@ define(['events', 'datetime', 'appSettings', 'itemHelper', 'pluginManager', 'pla
     };
 
     PlaybackManager.prototype.sendCommand = function (cmd, player) {
-        console.log('MediaController received command: ' + cmd.Name);
+        console.debug('MediaController received command: ' + cmd.Name);
         switch (cmd.Name) {
             case 'SetRepeatMode':
                 this.setRepeatMode(cmd.Arguments.RepeatMode, player);

src/components/playback/playbackorientation.js

@@ -9,7 +9,7 @@ define(['playbackManager', 'layoutManager', 'events'], function (playbackManager
 
     function onOrientationChangeError(err) {
         orientationLocked = false;
-        console.log('error locking orientation: ' + err);
+        console.error('error locking orientation: ' + err);
     }
 
     events.on(playbackManager, 'playbackstart', function (e, player, state) {
@@ -46,7 +46,7 @@ define(['playbackManager', 'layoutManager', 'events'], function (playbackManager
                 try {
                     unlockOrientation();
                 } catch (err) {
-                    console.log('error unlocking orientation: ' + err);
+                    console.error('error unlocking orientation: ' + err);
                 }
                 orientationLocked = false;
             }

src/components/playback/remotecontrolautoplay.js

@@ -32,12 +32,12 @@ define(['events', 'playbackManager'], function (events, playbackManager) {
         }
 
         if (!oldPlayer.isLocalPlayer) {
-            console.log('Skipping remote control autoplay because oldPlayer is not a local player');
+            console.debug('Skipping remote control autoplay because oldPlayer is not a local player');
             return;
         }
 
         if (newPlayer.isLocalPlayer) {
-            console.log('Skipping remote control autoplay because newPlayer is a local player');
+            console.debug('Skipping remote control autoplay because newPlayer is a local player');
             return;
         }
 

src/components/playback/volumeosd.js

@@ -11,7 +11,7 @@ define(['events', 'playbackManager', 'dom', 'browser', 'css!./iconosd', 'materia
     function getOsdElementHtml() {
         var html = '';
 
-        html += '<i class="material-icons iconOsdIcon volume_up"></i>';
+        html += '<i class="material-icons iconOsdIcon"></i>';
 
         html += '<div class="iconOsdProgressOuter"><div class="iconOsdProgressInner"></div></div>';
 

src/components/pluginManager.js

@@ -27,7 +27,7 @@ define(['events'], function (events) {
 
     PluginManager.prototype.loadPlugin = function (url) {
 
-        console.log('Loading plugin: ' + url);
+        console.debug('Loading plugin: ' + url);
         var instance = this;
 
         return new Promise(function (resolve, reject) {

src/components/polyfills/focusPreventScroll.js

@@ -12,6 +12,7 @@ if (HTMLElement.prototype.nativeFocus === undefined) {
             }, true);
 
             var opts = Object.defineProperty({}, "preventScroll", {
+                // eslint-disable-next-line getter-return
                 get: function () {
                     supportsPreventScrollOption = true;
                 }
@@ -19,7 +20,7 @@ if (HTMLElement.prototype.nativeFocus === undefined) {
 
             focusElem.focus(opts);
         } catch (e) {
-            console.log("error checking preventScroll support");
+            console.error("error checking preventScroll support");
         }
 
         if (!supportsPreventScrollOption) {

src/components/polyfills/objectassign.js

@@ -11,6 +11,7 @@ if (typeof Object.assign != 'function') {
                 var source = arguments[index];
                 if (source !== undefined && source !== null) {
                     for (var nextKey in source) {
+                        // eslint-disable-next-line no-prototype-builtins
                         if (source.hasOwnProperty(nextKey)) {
                             output[nextKey] = source[nextKey];
                         }

src/components/remotecontrol/remotecontrol.js

@@ -1,4 +1,4 @@
-define(["browser", "datetime", "backdrop", "libraryBrowser", "listView", "imageLoader", "playbackManager", "nowPlayingHelper", "events", "connectionManager", "apphost", "globalize", "cardStyle", "emby-itemscontainer", "css!./remotecontrol.css", "emby-ratingbutton"], function (browser, datetime, backdrop, libraryBrowser, listView, imageLoader, playbackManager, nowPlayingHelper, events, connectionManager, appHost, globalize) {
+define(["browser", "datetime", "backdrop", "libraryBrowser", "listView", "imageLoader", "playbackManager", "nowPlayingHelper", "events", "connectionManager", "apphost", "globalize", "layoutManager", "userSettings", "cardStyle", "emby-itemscontainer", "css!./remotecontrol.css", "emby-ratingbutton"], function (browser, datetime, backdrop, libraryBrowser, listView, imageLoader, playbackManager, nowPlayingHelper, events, connectionManager, appHost, globalize, layoutManager, userSettings) {
     "use strict";
 
     function showAudioMenu(context, player, button, item) {
@@ -127,7 +127,7 @@ define(["browser", "datetime", "backdrop", "libraryBrowser", "listView", "imageL
             maxHeight: 300
         }) : null;
 
-        console.log("updateNowPlayingInfo");
+        console.debug("updateNowPlayingInfo");
         setImageUrl(context, url);
         if (item) {
             backdrop.setBackdrops([item]);
@@ -228,6 +228,11 @@ define(["browser", "datetime", "backdrop", "libraryBrowser", "listView", "imageL
             buttonVisible(context.querySelector(".btnFastForward"), null != item);
             var positionSlider = context.querySelector(".nowPlayingPositionSlider");
 
+            if (positionSlider && item && item.RunTimeTicks) {
+                positionSlider.setKeyboardSteps(userSettings.skipBackLength() * 1000000 / item.RunTimeTicks,
+                    userSettings.skipForwardLength() * 1000000 / item.RunTimeTicks);
+            }
+
             if (positionSlider && !positionSlider.dragging) {
                 positionSlider.disabled = !playState.CanSeek;
                 var isProgressClear = state.MediaSource && null == state.MediaSource.RunTimeTicks;
@@ -266,7 +271,7 @@ define(["browser", "datetime", "backdrop", "libraryBrowser", "listView", "imageL
                 toggleRepeatButton.innerHTML = "<i class='material-icons'>repeat</i>";
                 toggleRepeatButton.classList.add("repeatButton-active");
             } else if ("RepeatOne" == repeatMode) {
-                toggleRepeatButton.innerHTML = "<i class='material-icons'>repeat_one</i>";
+                toggleRepeatButton.innerHTML = "<i class='material-icons repeat_one'></i>";
                 toggleRepeatButton.classList.add("repeatButton-active");
             } else {
                 toggleRepeatButton.innerHTML = "<i class='material-icons'>repeat</i>";
@@ -392,7 +397,7 @@ define(["browser", "datetime", "backdrop", "libraryBrowser", "listView", "imageL
         }
 
         function onPlaybackStart(e, state) {
-            console.log("remotecontrol event: " + e.type);
+            console.debug("remotecontrol event: " + e.type);
             var player = this;
             onStateChanged.call(player, e, state);
         }
@@ -420,7 +425,7 @@ define(["browser", "datetime", "backdrop", "libraryBrowser", "listView", "imageL
         }
 
         function onPlaybackStopped(e, state) {
-            console.log("remotecontrol event: " + e.type);
+            console.debug("remotecontrol event: " + e.type);
             var player = this;
 
             if (!state.NextMediaType) {
@@ -693,6 +698,12 @@ define(["browser", "datetime", "backdrop", "libraryBrowser", "listView", "imageL
             context.querySelector(".sendMessageForm").addEventListener("submit", onMessageSubmit);
             context.querySelector(".typeTextForm").addEventListener("submit", onSendStringSubmit);
             events.on(playbackManager, "playerchange", onPlayerChange);
+
+            if (layoutManager.tv) {
+                var positionSlider = context.querySelector(".nowPlayingPositionSlider");
+                positionSlider.classList.add("focusable");
+                positionSlider.enableKeyboardDragging();
+            }
         }
 
         function onDialogClosed(e) {

src/components/sanitizefilename.js

@@ -4,6 +4,7 @@ define([], function () {
     'use strict';
 
     var illegalRe = /[\/\?<>\\:\*\|":]/g;
+    // eslint-disable-next-line no-control-regex
     var controlRe = /[\x00-\x1f\x80-\x9f]/g;
     var reservedRe = /^\.+$/;
     var windowsReservedRe = /^(con|prn|aux|nul|com[0-9]|lpt[0-9])(\..*)?$/i;

src/components/screensavermanager.js

@@ -53,7 +53,7 @@ define(["events", "playbackManager", "pluginManager", "inputManager", "connectio
                 throw new Error("An existing screensaver is already active.");
             }
 
-            console.log("Showing screensaver " + screensaver.name);
+            console.debug("Showing screensaver " + screensaver.name);
 
             screensaver.show();
             activeScreenSaver = screensaver;
@@ -71,7 +71,7 @@ define(["events", "playbackManager", "pluginManager", "inputManager", "connectio
 
         function hide() {
             if (activeScreenSaver) {
-                console.log("Hiding screensaver");
+                console.debug("Hiding screensaver");
                 activeScreenSaver.hide();
                 activeScreenSaver = null;
             }

src/components/scrollManager.js

@@ -33,6 +33,7 @@ define(["dom", "browser", "layoutManager"], function (dom, browser, layoutManage
         var elem = document.createElement("div");
 
         var opts = Object.defineProperty({}, "behavior", {
+            // eslint-disable-next-line getter-return
             get: function () {
                 supportsScrollToOptions = true;
             }
@@ -40,7 +41,7 @@ define(["dom", "browser", "layoutManager"], function (dom, browser, layoutManage
 
         elem.scrollTo(opts);
     } catch (e) {
-        console.log("error checking ScrollToOptions support");
+        console.error("error checking ScrollToOptions support");
     }
 
     /**

src/components/scroller.js

@@ -392,7 +392,7 @@ define(['browser', 'layoutManager', 'dom', 'focusManager', 'ResizeObserver', 'sc
             var currentStart = self._pos.cur;
             var currentEnd = currentStart + frameSize;
 
-            //console.log('offset:' + offset + ' currentStart:' + currentStart + ' currentEnd:' + currentEnd);
+            console.debug('offset:' + offset + ' currentStart:' + currentStart + ' currentEnd:' + currentEnd);
             var isVisible = offset >= currentStart && (offset + size) <= currentEnd;
 
             return {
@@ -574,8 +574,9 @@ define(['browser', 'layoutManager', 'dom', 'focusManager', 'ResizeObserver', 'sc
 		 * @return {Int}
 		 */
         function normalizeWheelDelta(event) {
-            // wheelDelta needed only for IE8-
-            scrolling.curDelta = ((o.horizontal ? event.deltaY || event.deltaX : event.deltaY) || -event.wheelDelta);
+            // JELLYFIN MOD: Only use deltaX for horizontal scroll and remove IE8 support
+            scrolling.curDelta = o.horizontal ? event.deltaX : event.deltaY;
+            // END JELLYFIN MOD
 
             if (transform) {
                 scrolling.curDelta /= event.deltaMode === 1 ? 3 : 100;

src/components/search/searchresults.template.html

@@ -11,7 +11,7 @@
 <div class="hide verticalSection movieResults">
     <h2 class="sectionTitle sectionTitle-cards focuscontainer-x padded-left padded-right">${Movies}</h2>
 
-    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" data-mousewheel="false" class="padded-top-focusscale padded-bottom-focusscale">
+    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" class="padded-top-focusscale padded-bottom-focusscale">
         <div is="emby-itemscontainer" class="focuscontainer-x itemsContainer scrollSlider"></div>
     </div>
 </div>
@@ -19,7 +19,7 @@
 <div class="hide verticalSection seriesResults">
     <h2 class="sectionTitle sectionTitle-cards focuscontainer-x padded-left padded-right">${Shows}</h2>
 
-    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" data-mousewheel="false" class="padded-top-focusscale padded-bottom-focusscale">
+    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" class="padded-top-focusscale padded-bottom-focusscale">
         <div is="emby-itemscontainer" class="focuscontainer-x itemsContainer scrollSlider"></div>
     </div>
 </div>
@@ -27,7 +27,7 @@
 <div class="hide verticalSection episodeResults">
     <h2 class="sectionTitle sectionTitle-cards focuscontainer-x padded-left padded-right">${Episodes}</h2>
 
-    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" data-mousewheel="false" class="padded-top-focusscale padded-bottom-focusscale">
+    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" class="padded-top-focusscale padded-bottom-focusscale">
         <div is="emby-itemscontainer" class="focuscontainer-x itemsContainer scrollSlider"></div>
     </div>
 </div>
@@ -35,7 +35,7 @@
 <div class="hide verticalSection sportsResults">
     <h2 class="sectionTitle sectionTitle-cards focuscontainer-x padded-left padded-right">${Sports}</h2>
 
-    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" data-mousewheel="false" class="padded-top-focusscale padded-bottom-focusscale">
+    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" class="padded-top-focusscale padded-bottom-focusscale">
         <div is="emby-itemscontainer" class="focuscontainer-x itemsContainer scrollSlider"></div>
     </div>
 </div>
@@ -43,7 +43,7 @@
 <div class="hide verticalSection kidsResults">
     <h2 class="sectionTitle sectionTitle-cards focuscontainer-x padded-left padded-right">${Kids}</h2>
 
-    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" data-mousewheel="false" class="padded-top-focusscale padded-bottom-focusscale">
+    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" class="padded-top-focusscale padded-bottom-focusscale">
         <div is="emby-itemscontainer" class="focuscontainer-x itemsContainer scrollSlider"></div>
     </div>
 </div>
@@ -51,7 +51,7 @@
 <div class="hide verticalSection newsResults">
     <h2 class="sectionTitle sectionTitle-cards focuscontainer-x padded-left padded-right">${News}</h2>
 
-    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" data-mousewheel="false" class="padded-top-focusscale padded-bottom-focusscale">
+    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" class="padded-top-focusscale padded-bottom-focusscale">
         <div is="emby-itemscontainer" class="focuscontainer-x itemsContainer scrollSlider"></div>
     </div>
 </div>
@@ -59,7 +59,7 @@
 <div class="hide verticalSection programResults">
     <h2 class="sectionTitle sectionTitle-cards focuscontainer-x padded-left padded-right">${Programs}</h2>
 
-    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" data-mousewheel="false" class="padded-top-focusscale padded-bottom-focusscale">
+    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" class="padded-top-focusscale padded-bottom-focusscale">
         <div is="emby-itemscontainer" class="focuscontainer-x itemsContainer scrollSlider"></div>
     </div>
 </div>
@@ -67,7 +67,7 @@
 <div class="hide verticalSection videoResults">
     <h2 class="sectionTitle sectionTitle-cards focuscontainer-x padded-left padded-right">${Videos}</h2>
 
-    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" data-mousewheel="false" class="padded-top-focusscale padded-bottom-focusscale">
+    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" class="padded-top-focusscale padded-bottom-focusscale">
         <div is="emby-itemscontainer" class="focuscontainer-x itemsContainer scrollSlider"></div>
     </div>
 </div>
@@ -75,7 +75,7 @@
 <div class="hide verticalSection playlistResults">
     <h2 class="sectionTitle sectionTitle-cards focuscontainer-x padded-left padded-right">${Playlists}</h2>
 
-    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" data-mousewheel="false" class="padded-top-focusscale padded-bottom-focusscale">
+    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" class="padded-top-focusscale padded-bottom-focusscale">
         <div is="emby-itemscontainer" class="focuscontainer-x itemsContainer scrollSlider"></div>
     </div>
 </div>
@@ -83,7 +83,7 @@
 <div class="hide verticalSection artistResults">
     <h2 class="sectionTitle sectionTitle-cards focuscontainer-x padded-left padded-right">${Artists}</h2>
 
-    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" data-mousewheel="false" class="padded-top-focusscale padded-bottom-focusscale">
+    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" class="padded-top-focusscale padded-bottom-focusscale">
         <div is="emby-itemscontainer" class="focuscontainer-x itemsContainer scrollSlider"></div>
     </div>
 </div>
@@ -91,7 +91,7 @@
 <div class="hide verticalSection albumResults">
     <h2 class="sectionTitle sectionTitle-cards focuscontainer-x padded-left padded-right">${Albums}</h2>
 
-    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" data-mousewheel="false" class="padded-top-focusscale padded-bottom-focusscale">
+    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" class="padded-top-focusscale padded-bottom-focusscale">
         <div is="emby-itemscontainer" class="focuscontainer-x itemsContainer scrollSlider"></div>
     </div>
 </div>
@@ -99,7 +99,7 @@
 <div class="hide verticalSection songResults">
     <h2 class="sectionTitle sectionTitle-cards focuscontainer-x padded-left padded-right">${Songs}</h2>
 
-    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" data-mousewheel="false" class="padded-top-focusscale padded-bottom-focusscale">
+    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" class="padded-top-focusscale padded-bottom-focusscale">
         <div is="emby-itemscontainer" class="focuscontainer-x itemsContainer scrollSlider"></div>
     </div>
 </div>
@@ -107,7 +107,7 @@
 <div class="hide verticalSection photoAlbumResults">
     <h2 class="sectionTitle sectionTitle-cards focuscontainer-x padded-left padded-right">${HeaderPhotoAlbums}</h2>
 
-    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" data-mousewheel="false" class="padded-top-focusscale padded-bottom-focusscale">
+    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" class="padded-top-focusscale padded-bottom-focusscale">
         <div is="emby-itemscontainer" class="focuscontainer-x itemsContainer scrollSlider"></div>
     </div>
 </div>
@@ -115,7 +115,7 @@
 <div class="hide verticalSection photoResults">
     <h2 class="sectionTitle sectionTitle-cards focuscontainer-x padded-left padded-right">${Photos}</h2>
 
-    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" data-mousewheel="false" class="padded-top-focusscale padded-bottom-focusscale">
+    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" class="padded-top-focusscale padded-bottom-focusscale">
         <div is="emby-itemscontainer" class="focuscontainer-x itemsContainer scrollSlider"></div>
     </div>
 </div>
@@ -123,7 +123,7 @@
 <div class="hide verticalSection audioBookResults">
     <h2 class="sectionTitle sectionTitle-cards focuscontainer-x padded-left padded-right">${HeaderAudioBooks}</h2>
 
-    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" data-mousewheel="false" class="padded-top-focusscale padded-bottom-focusscale">
+    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" class="padded-top-focusscale padded-bottom-focusscale">
         <div is="emby-itemscontainer" class="focuscontainer-x itemsContainer scrollSlider"></div>
     </div>
 </div>
@@ -131,7 +131,7 @@
 <div class="hide verticalSection bookResults">
     <h2 class="sectionTitle sectionTitle-cards focuscontainer-x padded-left padded-right">${Books}</h2>
 
-    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" data-mousewheel="false" class="padded-top-focusscale padded-bottom-focusscale">
+    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" class="padded-top-focusscale padded-bottom-focusscale">
         <div is="emby-itemscontainer" class="focuscontainer-x itemsContainer scrollSlider"></div>
     </div>
 </div>
@@ -139,7 +139,7 @@
 <div class="hide verticalSection peopleResults">
     <h2 class="sectionTitle sectionTitle-cards focuscontainer-x padded-left padded-right">${People}</h2>
 
-    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" data-mousewheel="false" class="padded-top-focusscale padded-bottom-focusscale">
+    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" class="padded-top-focusscale padded-bottom-focusscale">
         <div is="emby-itemscontainer" class="focuscontainer-x itemsContainer scrollSlider"></div>
     </div>
 </div>

src/components/serverNotifications.js

@@ -33,7 +33,7 @@ define(['connectionManager', 'playbackManager', 'events', 'inputManager', 'focus
     }
 
     function processGeneralCommand(cmd, apiClient) {
-        console.log('Received command: ' + cmd.Name);
+        console.debug('Received command: ' + cmd.Name);
         switch (cmd.Name) {
             case 'Select':
                 inputManager.trigger('select');
@@ -133,7 +133,7 @@ define(['connectionManager', 'playbackManager', 'events', 'inputManager', 'focus
                 focusManager.sendText(cmd.Arguments.String);
                 break;
             default:
-                console.log('processGeneralCommand does not recognize: ' + cmd.Name);
+                console.debug('processGeneralCommand does not recognize: ' + cmd.Name);
                 break;
         }
 
@@ -191,36 +191,14 @@ define(['connectionManager', 'playbackManager', 'events', 'inputManager', 'focus
             events.trigger(serverNotifications, msg.MessageType, [apiClient, msg.Data]);
         }
     }
-
     function bindEvents(apiClient) {
         events.off(apiClient, "message", onMessageReceived);
         events.on(apiClient, "message", onMessageReceived);
     }
 
-    function enableNativeGamepadKeyMapping() {
-        if (window.navigator && "string" == typeof window.navigator.gamepadInputEmulation) {
-            window.navigator.gamepadInputEmulation = "keyboard";
-            return true;
-        }
-
-        return false;
-    }
-
-    function isGamepadSupported() {
-        return "ongamepadconnected" in window || navigator.getGamepads || navigator.webkitGetGamepads;
-    }
-
     connectionManager.getApiClients().forEach(bindEvents);
-
     events.on(connectionManager, 'apiclientcreated', function (e, newApiClient) {
         bindEvents(newApiClient);
     });
-
-    if (!enableNativeGamepadKeyMapping() && isGamepadSupported()) {
-        require(["components/serverNotifications/gamepadtokey"]);
-    }
-
-    require(["components/serverNotifications/mouseManager"]);
-
     return serverNotifications;
 });

src/components/serviceworker/notifications.js

@@ -1,3 +1,4 @@
+/* eslint-env serviceworker */
 (function () {
     'use strict';
 

src/components/skinManager.js

@@ -96,7 +96,7 @@ define(['apphost', 'userSettings', 'browser', 'events', 'pluginManager', 'backdr
                 appHost.setThemeColor(color);
             }
         } catch (err) {
-            console.log('Error setting theme color: ' + err);
+            console.error('error setting theme color: ' + err);
         }
     }
 
@@ -162,6 +162,7 @@ define(['apphost', 'userSettings', 'browser', 'events', 'pluginManager', 'backdr
     function playSound(path, volume) {
         lastSound = new Date().getTime();
         require(['howler'], function (howler) {
+            /* globals Howl */
             try {
                 var sound = new Howl({
                     src: [path],
@@ -170,7 +171,7 @@ define(['apphost', 'userSettings', 'browser', 'events', 'pluginManager', 'backdr
                 sound.play();
                 currentSound = sound;
             } catch (err) {
-                console.log('Error playing sound: ' + err);
+                console.error('error playing sound: ' + err);
             }
         });
     }

src/components/slideshow/slideshow.js

@@ -78,7 +78,7 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
         try {
             appHost.setUserScalable(scalable);
         } catch (err) {
-            console.log('error in appHost.setUserScalable: ' + err);
+            console.error('error in appHost.setUserScalable: ' + err);
         }
     }
 
@@ -198,6 +198,20 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
             }
         }
 
+        function onAutoplayStart() {
+            var btnSlideshowPause = dlg.querySelector('.btnSlideshowPause i');
+            if (btnSlideshowPause) {
+                btnSlideshowPause.innerHTML = "pause";
+            }
+        }
+
+        function onAutoplayStop() {
+            var btnSlideshowPause = dlg.querySelector('.btnSlideshowPause i');
+            if (btnSlideshowPause) {
+                btnSlideshowPause.innerHTML = "";
+            }
+        }
+
         function loadSwiper(dlg) {
 
             if (currentOptions.slides) {
@@ -225,6 +239,9 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
                     speed: 240
                 });
 
+                swiperInstance.on('autoplayStart', onAutoplayStart);
+                swiperInstance.on('autoplayStop', onAutoplayStop);
+
                 if (layoutManager.mobile) {
                     pause();
                 } else {
@@ -336,23 +353,15 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
         }
 
         function play() {
-
-            var btnSlideshowPause = dlg.querySelector('.btnSlideshowPause i');
-            if (btnSlideshowPause) {
-                btnSlideshowPause.innerHTML = "pause";
+            if (swiperInstance.autoplay) {
+                swiperInstance.autoplay.start();
             }
-
-            swiperInstance.startAutoplay();
         }
 
         function pause() {
-
-            var btnSlideshowPause = dlg.querySelector('.btnSlideshowPause i');
-            if (btnSlideshowPause) {
-                btnSlideshowPause.innerHTML = "";
+            if (swiperInstance.autoplay) {
+                swiperInstance.autoplay.stop();
             }
-
-            swiperInstance.stopAutoplay();
         }
 
         function playPause() {

src/components/subtitlesync/subtitlesync.js

@@ -130,7 +130,7 @@ define(['playbackManager', 'text!./subtitlesync.template.html', 'css!./subtitles
     SubtitleSync.prototype.toggle = function(action) {
 
         if (player && playbackManager.supportSubtitleOffset(player)) {
-
+            /* eslint-disable no-fallthrough */
             switch (action) {
                 case undefined:
                     // if showing subtitle sync is enabled
@@ -157,7 +157,7 @@ define(['playbackManager', 'text!./subtitlesync.template.html', 'css!./subtitles
                     subtitleSyncContainer.classList.add("hide");
                     break;
             }
-
+            /* eslint-enable no-fallthrough */
         }
     }
 

src/components/tunerpicker.js

@@ -1,4 +1,4 @@
-define(["dialogHelper", "dom", "layoutManager", "connectionManager", "globalize", "loading", "browser", "material-icons", "formDialogStyle", "emby-button", "emby-itemscontainer", "cardStyle"], function (dialogHelper, dom, layoutManager, connectionManager, globalize, loading, browser) {
+define(["dialogHelper", "dom", "layoutManager", "connectionManager", "globalize", "loading", "browser", "focusManager", "scrollHelper", "material-icons", "formDialogStyle", "emby-button", "emby-itemscontainer", "cardStyle"], function (dialogHelper, dom, layoutManager, connectionManager, globalize, loading, browser, focusManager, scrollHelper) {
     "use strict";
 
     var enableFocusTransform = !browser.slow && !browser.edge;
@@ -152,14 +152,14 @@ define(["dialogHelper", "dom", "layoutManager", "connectionManager", "globalize"
             });
 
             if (layoutManager.tv) {
-                centerFocus(dlg.querySelector(".formDialogContent"), false, true);
+                scrollHelper.centerFocus.on(dlg.querySelector(".formDialogContent"), false);
             }
 
             var apiClient = connectionManager.getApiClient(options.serverId);
             discoverDevices(dlg, apiClient);
 
             if (layoutManager.tv) {
-                centerFocus(dlg.querySelector(".formDialogContent"), false, false);
+                scrollHelper.centerFocus.off(dlg.querySelector(".formDialogContent"), false);
             }
 
             return dialogHelper.open(dlg).then(function () {

src/components/upnextdialog/upnextdialog.js

@@ -131,7 +131,7 @@ define(['dom', 'playbackManager', 'connectionManager', 'events', 'mediaInfo', 'l
 
         var secondsRemaining = Math.max(Math.round(getTimeRemainingMs(instance) / 1000), 0);
 
-        console.log('up next seconds remaining: ' + secondsRemaining);
+        console.debug('up next seconds remaining: ' + secondsRemaining);
 
         var timeText = '<span class="upNextDialog-countdownText">' + globalize.translate('HeaderSecondsValue', secondsRemaining) + '</span>';
 

src/components/youtubeplayer/plugin.js

@@ -1,5 +1,6 @@
 define(['require', 'events', 'browser', 'appRouter', 'loading'], function (require, events, browser, appRouter, loading) {
     "use strict";
+    /* globals YT */
 
     function zoomIn(elem, iterations) {
         var keyframes = [

src/controllers/dashboard/dashboard.js

@@ -741,21 +741,15 @@ define(["datetime", "events", "itemHelper", "serverNotifications", "dom", "globa
     };
     return function (view, params) {
         function onRestartRequired(evt, apiClient) {
-            if (apiClient.serverId() === serverId) {
-                renderHasPendingRestart(view, apiClient, true);
-            }
+            console.debug('onRestartRequired not implemented', evt, apiClient);
         }
 
         function onServerShuttingDown(evt, apiClient) {
-            if (apiClient.serverId() === serverId) {
-                renderHasPendingRestart(view, apiClient, true);
-            }
+            console.debug('onServerShuttingDown not implemented', evt, apiClient);
         }
 
         function onServerRestarting(evt, apiClient) {
-            if (apiClient.serverId() === serverId) {
-                renderHasPendingRestart(view, apiClient, true);
-            }
+            console.debug('onServerRestarting not implemented', evt, apiClient);
         }
 
         function onPackageInstalling(evt, apiClient) {

src/controllers/dashboard/general.js

@@ -56,6 +56,12 @@ define(["jQuery", "loading", "fnchecked", "emby-checkbox", "emby-textarea", "emb
                         }
                     });
                 });
+            }, function () {
+                require(["alert"], function (alert) {
+                    alert(Globalize.translate("DefaultErrorMessage"));
+                });
+
+                Dashboard.processServerConfigurationUpdateResult();
             });
         });
         return false;

src/controllers/dashboard/notifications/notifications.js

@@ -31,14 +31,14 @@ define(["loading", "libraryMenu", "globalize", "listViewStyle", "emby-button"],
                 }
                 itemHtml += '<a class="listItem listItem-border" is="emby-linkbutton" data-ripple="false" href="notificationsetting.html?type=' + notification.Type + '">';
                 if (notification.Enabled) {
-                    itemHtml += '<i class="listItemIcon material-icons">notifications_active</i>';
+                    itemHtml += '<i class="listItemIcon material-icons notifications_active"></i>';
                 } else {
-                    itemHtml += '<i class="listItemIcon material-icons" style="background-color:#999;">notifications_off</i>';
+                    itemHtml += '<i class="listItemIcon material-icons notifications_off" style="background-color:#999;"></i>';
                 }
                 itemHtml += '<div class="listItemBody">';
                 itemHtml += '<div class="listItemBodyText">' + notification.Name + "</div>";
                 itemHtml += "</div>";
-                itemHtml += '<button type="button" is="paper-icon-button-light"><i class="material-icons">mode_edit</i></button>';
+                itemHtml += '<button type="button" is="paper-icon-button-light"><i class="material-icons mode_edit"></i></button>';
                 itemHtml += "</a>";
                 return itemHtml;
             }).join("");

src/controllers/dashboard/plugins/add.js

@@ -122,7 +122,7 @@ define(["jQuery", "loading", "libraryMenu", "globalize", "connectionManager", "e
                 confirm(msg, globalize.translate("HeaderConfirmPluginInstallation")).then(function () {
                     alertCallback();
                 }, function () {
-                    console.log('plugin not installed');
+                    console.debug('plugin not installed');
                 });
             });
         } else {

src/controllers/devices.js

@@ -80,7 +80,7 @@ define(["loading", "dom", "libraryMenu", "globalize", "scripts/imagehelper", "hu
                 deviceHtml += '<div class="cardImage" style="background-image:url(\'' + iconUrl + "');background-size: auto 64%;background-position:center center;\">";
                 deviceHtml += "</div>";
             } else {
-                deviceHtml += '<i class="cardImageIcon material-icons">tablet_android</i>';
+                deviceHtml += '<i class="cardImageIcon material-icons tablet_android"></i>';
             }
 
             deviceHtml += "</a>";

src/controllers/dlnaprofiles.js

@@ -32,7 +32,7 @@ define(["jQuery", "globalize", "loading", "libraryMenu", "listViewStyle", "emby-
         for (var i = 0, length = profiles.length; i < length; i++) {
             var profile = profiles[i];
             html += '<div class="listItem listItem-border">';
-            html += '<i class="listItemIcon material-icons">live_tv</i>';
+            html += '<i class="listItemIcon material-icons live_tv"></i>';
             html += '<div class="listItemBody two-line">';
             html += "<a is='emby-linkbutton' style='padding:0;margin:0;' data-ripple='false' class='clearLink' href='dlnaprofile.html?id=" + profile.Id + "'>";
             html += "<div>" + profile.Name + "</div>";

src/controllers/encodingsettings.js

@@ -15,6 +15,7 @@ define(["jQuery", "loading", "globalize", "dom", "libraryMenu"], function ($, lo
         page.querySelector("#selectEncoderPreset").value = config.EncoderPreset || "";
         page.querySelector("#txtH264Crf").value = config.H264Crf || "";
         page.querySelector("#chkEnableSubtitleExtraction").checked = config.EnableSubtitleExtraction || false;
+        page.querySelector("#chkEnableThrottling").checked = config.EnableThrottling || false;
         page.querySelector("#selectVideoDecoder").dispatchEvent(new CustomEvent("change", {
             bubbles: true
         }));
@@ -58,6 +59,7 @@ define(["jQuery", "loading", "globalize", "dom", "libraryMenu"], function ($, lo
                 config.EncoderPreset = form.querySelector("#selectEncoderPreset").value;
                 config.H264Crf = parseInt(form.querySelector("#txtH264Crf").value || "0");
                 config.EnableSubtitleExtraction = form.querySelector("#chkEnableSubtitleExtraction").checked;
+                config.EnableThrottling = form.querySelector("#chkEnableThrottling").checked;
                 config.HardwareDecodingCodecs = Array.prototype.map.call(Array.prototype.filter.call(form.querySelectorAll(".chkDecodeCodec"), function (c) {
                     return c.checked;
                 }), function (c) {
@@ -66,6 +68,12 @@ define(["jQuery", "loading", "globalize", "dom", "libraryMenu"], function ($, lo
                 config.EnableHardwareEncoding = form.querySelector("#chkHardwareEncoding").checked;
                 ApiClient.updateNamedConfiguration("encoding", config).then(function () {
                     updateEncoder(form);
+                }, function () {
+                    require(["alert"], function (alert) {
+                        alert(globalize.translate("DefaultErrorMessage"));
+                    });
+
+                    Dashboard.processServerConfigurationUpdateResult();
                 });
             });
         };

src/controllers/favorites.js

@@ -253,7 +253,7 @@ define(["appRouter", "cardBuilder", "dom", "globalize", "connectionManager", "ap
             }
 
             html += "</div>";
-            html += '<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-mousewheel="false" data-centerfocus="true"><div is="emby-itemscontainer" class="itemsContainer scrollSlider focuscontainer-x" data-monitor="markfavorite"></div></div>';
+            html += '<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-centerfocus="true"><div is="emby-itemscontainer" class="itemsContainer scrollSlider focuscontainer-x" data-monitor="markfavorite"></div></div>';
             html += "</div>";
         }
 

src/controllers/itemdetailpage.js

@@ -1,4 +1,4 @@
-define(["loading", "appRouter", "layoutManager", "connectionManager", "cardBuilder", "datetime", "mediaInfo", "backdrop", "listView", "itemContextMenu", "itemHelper", "dom", "indicators", "apphost", "imageLoader", "libraryMenu", "globalize", "browser", "events", "scrollHelper", "playbackManager", "libraryBrowser", "scrollStyles", "emby-itemscontainer", "emby-checkbox", "emby-button", "emby-playstatebutton", "emby-ratingbutton", "emby-scroller", "emby-select"], function (loading, appRouter, layoutManager, connectionManager, cardBuilder, datetime, mediaInfo, backdrop, listView, itemContextMenu, itemHelper, dom, indicators, appHost, imageLoader, libraryMenu, globalize, browser, events, scrollHelper, playbackManager, libraryBrowser) {
+define(["loading", "appRouter", "layoutManager", "connectionManager", "userSettings", "cardBuilder", "datetime", "mediaInfo", "backdrop", "listView", "itemContextMenu", "itemHelper", "dom", "indicators", "imageLoader", "libraryMenu", "globalize", "browser", "events", "playbackManager", "scrollStyles", "emby-itemscontainer", "emby-checkbox", "emby-button", "emby-playstatebutton", "emby-ratingbutton", "emby-scroller", "emby-select"], function (loading, appRouter, layoutManager, connectionManager, userSettings, cardBuilder, datetime, mediaInfo, backdrop, listView, itemContextMenu, itemHelper, dom, indicators, imageLoader, libraryMenu, globalize, browser, events, playbackManager) {
     "use strict";
 
     function getPromise(apiClient, params) {
@@ -60,8 +60,7 @@ define(["loading", "appRouter", "layoutManager", "connectionManager", "cardBuild
         return options;
     }
 
-    function getProgramScheduleHtml(items, options) {
-        options = options || {};
+    function getProgramScheduleHtml(items) {
         var html = "";
         html += '<div is="emby-itemscontainer" class="itemsContainer vertical-list" data-contextmenu="false">';
         html += listView.getListViewHtml({
@@ -445,7 +444,7 @@ define(["loading", "appRouter", "layoutManager", "connectionManager", "cardBuild
         }
     }
 
-    function renderBackdrop(page, item, apiClient) {
+    function renderBackdrop(item) {
         if (dom.getWindowSize().innerWidth >= 1000) {
             backdrop.setBackdrops([item]);
         } else {
@@ -455,7 +454,6 @@ define(["loading", "appRouter", "layoutManager", "connectionManager", "cardBuild
 
     function renderDetailPageBackdrop(page, item, apiClient) {
         var imgUrl;
-        var screenWidth = screen.availWidth;
         var hasbackdrop = false;
         var itemBackdropElement = page.querySelector("#itemBackdrop");
         var usePrimaryImage = item.MediaType === "Video" && item.Type !== "Movie" && item.Type !== "Trailer" ||
@@ -464,13 +462,17 @@ define(["loading", "appRouter", "layoutManager", "connectionManager", "cardBuild
             item.Type === "MusicArtist" ||
             item.Type === "Person";
 
+        if (!layoutManager.mobile && !userSettings.enableBackdrops()) {
+            return false;
+        }
+
         if ("Program" === item.Type && item.ImageTags && item.ImageTags.Thumb) {
             imgUrl = apiClient.getScaledImageUrl(item.Id, {
                 type: "Thumb",
                 index: 0,
                 tag: item.ImageTags.Thumb
             });
-            itemBackdropElement.classList.remove("noBackdrop");
+            page.classList.remove("noBackdrop");
             imageLoader.lazyImage(itemBackdropElement, imgUrl, false);
             hasbackdrop = true;
         } else if (usePrimaryImage && item.ImageTags && item.ImageTags.Primary) {
@@ -479,7 +481,7 @@ define(["loading", "appRouter", "layoutManager", "connectionManager", "cardBuild
                 index: 0,
                 tag: item.ImageTags.Primary
             });
-            itemBackdropElement.classList.remove("noBackdrop");
+            page.classList.remove("noBackdrop");
             imageLoader.lazyImage(itemBackdropElement, imgUrl, false);
             hasbackdrop = true;
         } else if (item.BackdropImageTags && item.BackdropImageTags.length) {
@@ -488,7 +490,7 @@ define(["loading", "appRouter", "layoutManager", "connectionManager", "cardBuild
                 index: 0,
                 tag: item.BackdropImageTags[0]
             });
-            itemBackdropElement.classList.remove("noBackdrop");
+            page.classList.remove("noBackdrop");
             imageLoader.lazyImage(itemBackdropElement, imgUrl, false);
             hasbackdrop = true;
         } else if (item.ParentBackdropItemId && item.ParentBackdropImageTags && item.ParentBackdropImageTags.length) {
@@ -497,7 +499,7 @@ define(["loading", "appRouter", "layoutManager", "connectionManager", "cardBuild
                 index: 0,
                 tag: item.ParentBackdropImageTags[0]
             });
-            itemBackdropElement.classList.remove("noBackdrop");
+            page.classList.remove("noBackdrop");
             imageLoader.lazyImage(itemBackdropElement, imgUrl, false);
             hasbackdrop = true;
         } else if (item.ImageTags && item.ImageTags.Thumb) {
@@ -506,15 +508,16 @@ define(["loading", "appRouter", "layoutManager", "connectionManager", "cardBuild
                 index: 0,
                 tag: item.ImageTags.Thumb
             });
-            itemBackdropElement.classList.remove("noBackdrop");
+            page.classList.remove("noBackdrop");
             imageLoader.lazyImage(itemBackdropElement, imgUrl, false);
             hasbackdrop = true;
         } else {
-            itemBackdropElement.classList.add("noBackdrop");
             itemBackdropElement.style.backgroundImage = "";
         }
 
         if ("Person" === item.Type) {
+            // FIXME: This hides the backdrop on all persons to fix a margin issue. Ideally, a proper fix should be made.
+            page.classList.add('noBackdrop');
             itemBackdropElement.classList.add("personBackdrop");
         } else {
             itemBackdropElement.classList.remove("personBackdrop");
@@ -526,6 +529,7 @@ define(["loading", "appRouter", "layoutManager", "connectionManager", "cardBuild
     function reloadFromItem(instance, page, params, item, user) {
         var context = params.context;
         page.querySelector(".detailPagePrimaryContainer").classList.add("detailSticky");
+
         renderName(item, page.querySelector(".nameContainer"), false, context);
         var apiClient = connectionManager.getApiClient(item.ServerId);
         renderSeriesTimerEditor(page, item, apiClient, user);
@@ -536,7 +540,7 @@ define(["loading", "appRouter", "layoutManager", "connectionManager", "cardBuild
         setInitialCollapsibleState(page, item, apiClient, context, user);
         renderDetails(page, item, apiClient, context);
         renderTrackSelections(page, instance, item);
-        renderBackdrop(page, item, apiClient);
+        renderBackdrop(item);
         renderDetailPageBackdrop(page, item, apiClient);
         var canPlay = reloadPlayButtons(page, item);
 
@@ -647,7 +651,7 @@ define(["loading", "appRouter", "layoutManager", "connectionManager", "cardBuild
     function setTitle(item, apiClient) {
         var url = logoImageUrl(item, apiClient, {});
 
-        if (url = null) {
+        if (url != null) {
             var pageTitle = document.querySelector(".pageTitle");
             pageTitle.style.backgroundImage = "url('" + url + "')";
             pageTitle.classList.add("pageTitleWithLogo");
@@ -663,7 +667,9 @@ define(["loading", "appRouter", "layoutManager", "connectionManager", "cardBuild
         });
         var detailLogo = page.querySelector(".detailLogo");
 
-        if (url) {
+        if (!layoutManager.mobile && !userSettings.enableBackdrops()) {
+            detailLogo.classList.add("hide");
+        } else if (url) {
             detailLogo.classList.remove("hide");
             detailLogo.classList.add("lazy");
             detailLogo.setAttribute("data-src", url);
@@ -817,7 +823,7 @@ define(["loading", "appRouter", "layoutManager", "connectionManager", "cardBuild
         if (editable) {
             html += "</a>";
         } else if (!editable && url === undefined) {
-            html += "</div>"
+            html += "</div>";
         }
 
         var progressHtml = item.IsFolder || !item.UserData ? "" : indicators.getProgressBarHtml(item);
@@ -873,7 +879,7 @@ define(["loading", "appRouter", "layoutManager", "connectionManager", "cardBuild
         elem.querySelector(".detailImageProgressContainer").innerHTML = indicators.getProgressBarHtml(item);
     }
 
-    function refreshImage(page, item, user) {
+    function refreshImage(page, item) {
         refreshDetailImageUserData(page.querySelector(".detailImageContainer"), item);
     }
 
@@ -922,10 +928,10 @@ define(["loading", "appRouter", "layoutManager", "connectionManager", "cardBuild
 
         if ("Playlist" == item.Type) {
             page.querySelector("#childrenCollapsible").classList.remove("hide");
-            renderPlaylistItems(page, item, user);
+            renderPlaylistItems(page, item);
         } else if ("Studio" == item.Type || "Person" == item.Type || "Genre" == item.Type || "MusicGenre" == item.Type || "MusicArtist" == item.Type) {
             page.querySelector("#childrenCollapsible").classList.remove("hide");
-            renderItemsByName(page, item, user);
+            renderItemsByName(page, item);
         } else if (item.IsFolder) {
             if ("BoxSet" == item.Type) {
                 page.querySelector("#childrenCollapsible").classList.add("hide");
@@ -937,7 +943,7 @@ define(["loading", "appRouter", "layoutManager", "connectionManager", "cardBuild
         }
 
         if ("Series" == item.Type) {
-            renderSeriesSchedule(page, item, user);
+            renderSeriesSchedule(page, item);
             renderNextUp(page, item, user);
         } else {
             page.querySelector(".nextUpSection").classList.add("hide");
@@ -952,7 +958,7 @@ define(["loading", "appRouter", "layoutManager", "connectionManager", "cardBuild
             page.querySelector("#specialsCollapsible").classList.add("hide");
         }
 
-        renderCast(page, item, context, enableScrollX() ? null : 12);
+        renderCast(page, item);
 
         if (item.PartCount && item.PartCount > 1) {
             page.querySelector("#additionalPartsCollapsible").classList.remove("hide");
@@ -988,7 +994,7 @@ define(["loading", "appRouter", "layoutManager", "connectionManager", "cardBuild
         }
     }
 
-    function renderGenres(page, item, apiClient, context, isStatic) {
+    function renderGenres(page, item, context) {
         context = context || inferContext(item);
         var type;
         var genres = item.GenreItems || [];
@@ -1022,7 +1028,7 @@ define(["loading", "appRouter", "layoutManager", "connectionManager", "cardBuild
         }
     }
 
-    function renderDirector(page, item, apiClient, context, isStatic) {
+    function renderDirector(page, item, context) {
         var directors = (item.People || []).filter(function (p) {
             return "Director" === p.Type;
         });
@@ -1050,8 +1056,8 @@ define(["loading", "appRouter", "layoutManager", "connectionManager", "cardBuild
         renderSimilarItems(page, item, context);
         renderMoreFromSeason(page, item, apiClient);
         renderMoreFromArtist(page, item, apiClient);
-        renderDirector(page, item, apiClient, context, isStatic);
-        renderGenres(page, item, apiClient, context, isStatic);
+        renderDirector(page, item, context);
+        renderGenres(page, item, context);
         renderChannelGuide(page, apiClient, item);
         var taglineElement = page.querySelector(".tagline");
 
@@ -1125,14 +1131,6 @@ define(["loading", "appRouter", "layoutManager", "connectionManager", "cardBuild
         return scrollX ? "overflowSquare" : "square";
     }
 
-    function getThumbShape(scrollX) {
-        if (null == scrollX) {
-            scrollX = enableScrollX();
-        }
-
-        return scrollX ? "overflowBackdrop" : "backdrop";
-    }
-
     function renderMoreFromSeason(view, item, apiClient) {
         var section = view.querySelector(".moreFromSeasonSection");
 
@@ -1508,13 +1506,13 @@ define(["loading", "appRouter", "layoutManager", "connectionManager", "cardBuild
         }
     }
 
-    function renderItemsByName(page, item, user) {
+    function renderItemsByName(page, item) {
         require("scripts/itembynamedetailpage".split(","), function () {
             window.ItemsByName.renderItems(page, item);
         });
     }
 
-    function renderPlaylistItems(page, item, user) {
+    function renderPlaylistItems(page, item) {
         require("scripts/playlistedit".split(","), function () {
             PlaylistViewer.render(page, item);
         });
@@ -1594,7 +1592,7 @@ define(["loading", "appRouter", "layoutManager", "connectionManager", "cardBuild
         }
     }
 
-    function renderSeriesSchedule(page, item, user) {
+    function renderSeriesSchedule(page, item) {
         var apiClient = connectionManager.getApiClient(item.ServerId);
         apiClient.getLiveTvPrograms({
             UserId: apiClient.getCurrentUserId(),
@@ -1661,7 +1659,7 @@ define(["loading", "appRouter", "layoutManager", "connectionManager", "cardBuild
     function canPlaySomeItemInCollection(items) {
         var i = 0;
 
-        for (length = items.length; i < length; i++) {
+        for (var length = items.length; i < length; i++) {
             if (playbackManager.canPlay(items[i])) {
                 return true;
             }
@@ -1844,7 +1842,7 @@ define(["loading", "appRouter", "layoutManager", "connectionManager", "cardBuild
         });
     }
 
-    function renderCast(page, item, context, limit, isStatic) {
+    function renderCast(page, item) {
         var people = (item.People || []).filter(function (p) {
             return "Director" !== p.Type;
         });
@@ -1934,7 +1932,7 @@ define(["loading", "appRouter", "layoutManager", "connectionManager", "cardBuild
             playbackManager.play(playOptions);
         }
 
-        function playTrailer(page) {
+        function playTrailer() {
             playbackManager.playTrailers(currentItem);
         }
 
@@ -1991,11 +1989,7 @@ define(["loading", "appRouter", "layoutManager", "connectionManager", "cardBuild
         }
 
         function onPlayTrailerClick() {
-            playTrailer(view);
-        }
-
-        function onDownloadChange() {
-            reload(self, view, params);
+            playTrailer();
         }
 
         function onDownloadClick() {
@@ -2050,9 +2044,7 @@ define(["loading", "appRouter", "layoutManager", "connectionManager", "cardBuild
                 if (userData) {
                     currentItem.UserData = userData;
                     reloadPlayButtons(view, currentItem);
-                    apiClient.getCurrentUser().then(function (user) {
-                        refreshImage(view, currentItem, user);
-                    });
+                    refreshImage(view, currentItem);
                 }
             }
         }
@@ -2083,11 +2075,9 @@ define(["loading", "appRouter", "layoutManager", "connectionManager", "cardBuild
         });
         view.addEventListener("click", function (e) {
             if (dom.parentWithClass(e.target, "moreScenes")) {
-                apiClient.getCurrentUser().then(function (user) {
-                    renderScenes(view, currentItem);
-                });
+                renderScenes(view, currentItem);
             } else if (dom.parentWithClass(e.target, "morePeople")) {
-                renderCast(view, currentItem, params.context);
+                renderCast(view, currentItem);
             } else if (dom.parentWithClass(e.target, "moreSpecials")) {
                 apiClient.getCurrentUser().then(function (user) {
                     renderSpecials(view, currentItem, user);

src/controllers/movies/moviesrecommended.js

@@ -203,7 +203,7 @@ define(["events", "layoutManager", "inputManager", "userSettings", "libraryMenu"
     function loadSuggestionsTab(view, params, tabContent) {
         var parentId = params.topParentId;
         var userId = ApiClient.getCurrentUserId();
-        console.log("loadSuggestionsTab");
+        console.debug("loadSuggestionsTab");
         loadResume(tabContent, userId, parentId);
         loadLatest(tabContent, userId, parentId);
         loadSuggestions(tabContent, userId, parentId);

src/controllers/music/musicrecommended.js

@@ -155,7 +155,7 @@ define(["browser", "layoutManager", "userSettings", "inputManager", "loading", "
     }
 
     function loadSuggestionsTab(page, tabContent, parentId) {
-        console.log("loadSuggestionsTab");
+        console.debug("loadSuggestionsTab");
         loadLatest(tabContent, parentId);
         loadRecentlyPlayed(tabContent, parentId);
         loadFrequentlyPlayed(tabContent, parentId);

src/controllers/playback/videoosd.js

@@ -575,7 +575,7 @@ define(["playbackManager", "dom", "inputManager", "datetime", "itemHelper", "med
         }
 
         function onPlaybackStart(e, state) {
-            console.log("nowplaying event: " + e.type);
+            console.debug("nowplaying event: " + e.type);
             var player = this;
             onStateChanged.call(player, e, state);
             resetUpNextDialog();
@@ -594,7 +594,7 @@ define(["playbackManager", "dom", "inputManager", "datetime", "itemHelper", "med
         function onPlaybackStopped(e, state) {
             currentRuntimeTicks = null;
             resetUpNextDialog();
-            console.log("nowplaying event: " + e.type);
+            console.debug("nowplaying event: " + e.type);
 
             if ("Video" !== state.NextMediaType) {
                 view.removeEventListener("viewbeforehide", onViewHideStopPlayback);
@@ -725,14 +725,14 @@ define(["playbackManager", "dom", "inputManager", "datetime", "itemHelper", "med
                         var endDate = datetime.parseISO8601Date(program.EndDate);
 
                         if (new Date().getTime() >= endDate.getTime()) {
-                            console.log("program info needs to be refreshed");
+                            console.debug("program info needs to be refreshed");
                             var state = playbackManager.getPlayerState(player);
                             onStateChanged.call(player, {
                                 type: "init"
                             }, state);
                         }
                     } catch (e) {
-                        console.log("Error parsing date: " + program.EndDate);
+                        console.error("error parsing date: " + program.EndDate);
                     }
                 }
             }
@@ -1218,7 +1218,7 @@ define(["playbackManager", "dom", "inputManager", "datetime", "itemHelper", "med
             return null;
         }
 
-        let playPauseClickTimeout;
+        var playPauseClickTimeout;
         function onViewHideStopPlayback() {
             if (playbackManager.isPlayingVideo()) {
                 require(['shell'], function (shell) {
@@ -1388,7 +1388,7 @@ define(["playbackManager", "dom", "inputManager", "datetime", "itemHelper", "med
                             clearTimeout(playPauseClickTimeout);
                             playPauseClickTimeout = 0;
                         } else {
-                            playPauseClickTimeout = setTimeout(() => {
+                            playPauseClickTimeout = setTimeout(function() {
                                 playbackManager.playPause(currentPlayer);
                                 showOsd();
                                 playPauseClickTimeout = 0;

src/controllers/shows/tvupcoming.js

@@ -58,7 +58,7 @@ define(["layoutManager", "loading", "datetime", "libraryBrowser", "cardBuilder",
                         day: "numeric"
                     });
                 } catch (err) {
-                    console.log('error parsing timestamp for upcoming tv shows');
+                    console.error('error parsing timestamp for upcoming tv shows');
                 }
             }
 

src/controllers/streamingsettings.js

@@ -13,6 +13,7 @@ define(["jQuery", "libraryMenu", "loading"], function ($, libraryMenu, loading)
             config.RemoteClientBitrateLimit = parseInt(1e6 * parseFloat($("#txtRemoteClientBitrateLimit", form).val() || "0"));
             ApiClient.updateServerConfiguration(config).then(Dashboard.processServerConfigurationUpdateResult);
         });
+
         return false;
     }
 
@@ -30,24 +31,6 @@ define(["jQuery", "libraryMenu", "loading"], function ($, libraryMenu, loading)
     }
 
     $(document).on("pageinit", "#streamingSettingsPage", function () {
-        var page = this;
-        $("#btnSelectTranscodingTempPath", page).on("click.selectDirectory", function () {
-            require(["directorybrowser"], function (directoryBrowser) {
-                var picker = new directoryBrowser();
-                picker.show({
-                    callback: function (path) {
-                        if (path) {
-                            $("#txtTranscodingTempPath", page).val(path);
-                        }
-
-                        picker.close();
-                    },
-                    validateWriteable: true,
-                    header: Globalize.translate("HeaderSelectTranscodingPath"),
-                    instruction: Globalize.translate("HeaderSelectTranscodingPathHelp")
-                });
-            });
-        });
         $(".streamingSettingsForm").off("submit", onSubmit).on("submit", onSubmit);
     }).on("pageshow", "#streamingSettingsPage", function () {
         loading.show();

src/controllers/wizard/user.js

@@ -10,7 +10,7 @@ define(["loading", "globalize", "dashboardcss", "emby-input", "emby-button", "em
     }
 
     function onUpdateUserComplete(result) {
-        console.log(result);
+        console.debug("user update complete: " + result);
         loading.hide();
         nextWizardPage();
     }

src/elements/emby-checkbox/emby-checkbox.css

@@ -68,7 +68,8 @@
     color: #fff;
 }
 
-.checkboxIcon-checked {
+.checkboxIcon-checked,
+.emby-checkbox-label .checkboxIcon-checked {
     display: none;
 }
 

src/encodingsettings.html

@@ -144,6 +144,14 @@
                     <div class="fieldDescription checkboxFieldDescription">${AllowOnTheFlySubtitleExtractionHelp}</div>
                 </div>
 
+                <div class="checkboxContainer checkboxContainer-withDescription">
+                    <label>
+                        <input is="emby-checkbox" type="checkbox" id="chkEnableThrottling" />
+                        <span>${AllowFfmpegThrottling}</span>
+                    </label>
+                    <div class="fieldDescription checkboxFieldDescription">${AllowFfmpegThrottlingHelp}</div>
+                </div>
+
                 <div>
                     <button is="emby-button" type="submit" class="raised button-submit block">
                         <span>${ButtonSave}</span>

src/itemdetails.html

@@ -1,5 +1,5 @@
-<div id="itemDetailPage" data-role="page" class="page libraryPage itemDetailPage noSecondaryNavPage selfBackdropPage" data-backbutton="true">
-    <div id="itemBackdrop" class="itemBackdrop noBackdrop">
+<div id="itemDetailPage" data-role="page" class="page libraryPage itemDetailPage noSecondaryNavPage selfBackdropPage noBackdrop" data-backbutton="true">
+    <div id="itemBackdrop" class="itemBackdrop">
         <button is="emby-button" type="button" class="btnPlay detailFloatingButton hide fab autoSize" title="${ButtonPlay}" data-mode="resume">
             <i class="material-icons play_arrow"></i>
         </button>
@@ -31,7 +31,7 @@
 
                 <button is="emby-button" type="button" class="button-flat btnDownload hide detailButton">
                     <div class="detailButton-content">
-                        <i class="material-icons detailButton-icon">&#xe884;</i>
+                        <i class="material-icons detailButton-icon get_app"></i>
                         <div class="detailButton-text">${ButtonDownload}</div>
                     </div>
                 </button>
@@ -94,7 +94,7 @@
 
                 <button is="emby-button" type="button" class="button-flat btnSplitVersions hide detailButton">
                     <div class="detailButton-content">
-                        <i class="material-icons detailButton-icon">call_split</i>
+                        <i class="material-icons detailButton-icon call_split"></i>
                         <div class="detailButton-text">${ButtonSplit}</div>
                     </div>
                 </button>
@@ -182,21 +182,21 @@
 
                 <div class="verticalSection itemVerticalSection moreFromSeasonSection hide">
                     <h2 class="sectionTitle sectionTitle-cards padded-left padded-right"></h2>
-                    <div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-mousewheel="false" data-centerfocus="true">
+                    <div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-centerfocus="true">
                         <div is="emby-itemscontainer" class="scrollSlider focuscontainer-x itemsContainer"></div>
                     </div>
                 </div>
 
                 <div class="verticalSection itemVerticalSection moreFromArtistSection hide">
                     <h2 class="sectionTitle sectionTitle-cards padded-left padded-right"></h2>
-                    <div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-mousewheel="false" data-centerfocus="true">
+                    <div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-centerfocus="true">
                         <div is="emby-itemscontainer" class="scrollSlider focuscontainer-x itemsContainer"></div>
                     </div>
                 </div>
 
                 <div id="castCollapsible" class="verticalSection detailVerticalSection hide">
                     <h2 id="peopleHeader" class="sectionTitle sectionTitle-cards padded-left padded-right">${HeaderCastCrew}</h2>
-                    <div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-mousewheel="false" data-centerfocus="true">
+                    <div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-centerfocus="true">
                         <div id="castContent" is="emby-itemscontainer" class="scrollSlider focuscontainer-x itemsContainer"></div>
                     </div>
                 </div>
@@ -218,14 +218,14 @@
 
                 <div id="scenesCollapsible" class="verticalSection itemVerticalSection verticalSection-extrabottompadding hide">
                     <h2 class="sectionTitle sectionTitle-cards padded-left padded-right">${HeaderScenes}</h2>
-                    <div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-mousewheel="false" data-centerfocus="true">
+                    <div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-centerfocus="true">
                         <div id="scenesContent" is="emby-itemscontainer" class="scrollSlider focuscontainer-x itemsContainer"></div>
                     </div>
                 </div>
 
                 <div id="similarCollapsible" class="verticalSection itemVerticalSection verticalSection-extrabottompadding hide">
                     <h2 class="sectionTitle sectionTitle-cards padded-left padded-right">${HeaderMoreLikeThis}</h2>
-                    <div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-mousewheel="false" data-centerfocus="true">
+                    <div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-centerfocus="true">
                         <div is="emby-itemscontainer" class="scrollSlider focuscontainer-x itemsContainer similarContent"></div>
                     </div>
                 </div>

src/libraries/apiclient/apiclientcore.js

@@ -59,8 +59,23 @@ define(["events", "appStorage"], function(events, appStorage) {
     }
 
     function ApiClient(serverAddress, appName, appVersion, deviceName, deviceId, devicePixelRatio) {
-        if (!serverAddress) throw new Error("Must supply a serverAddress");
-        console.log("ApiClient serverAddress: " + serverAddress), console.log("ApiClient appName: " + appName), console.log("ApiClient appVersion: " + appVersion), console.log("ApiClient deviceName: " + deviceName), console.log("ApiClient deviceId: " + deviceId), this._serverInfo = {}, this._serverAddress = serverAddress, this._deviceId = deviceId, this._deviceName = deviceName, this._appName = appName, this._appVersion = appVersion, this._devicePixelRatio = devicePixelRatio
+        if (!serverAddress) {
+            throw new Error("Must supply a serverAddress");
+        }
+
+        console.debug("ApiClient serverAddress: " + serverAddress);
+        console.debug("ApiClient appName: " + appName);
+        console.debug("ApiClient appVersion: " + appVersion);
+        console.debug("ApiClient deviceName: " + deviceName);
+        console.debug("ApiClient deviceId: " + deviceId);
+
+        this._serverInfo = {};
+        this._serverAddress = serverAddress;
+        this._deviceId = deviceId;
+        this._deviceName = deviceName;
+        this._appName = appName;
+        this._appVersion = appVersion;
+        this._devicePixelRatio = devicePixelRatio;
     }
 
     function setSavedEndpointInfo(instance, info) {
@@ -68,13 +83,14 @@ define(["events", "appStorage"], function(events, appStorage) {
     }
 
     function getTryConnectPromise(instance, url, state, resolve, reject) {
-        console.log("getTryConnectPromise " + url), fetchWithTimeout(instance.getUrl("system/info/public", null, url), {
+        console.debug("getTryConnectPromise " + url);
+        fetchWithTimeout(instance.getUrl("system/info/public", null, url), {
             method: "GET",
             accept: "application/json"
         }, 15e3).then(function() {
-            state.resolved || (state.resolved = !0, console.log("Reconnect succeeded to " + url), instance.serverAddress(url), resolve())
+            state.resolved || (state.resolved = !0, console.debug("Reconnect succeeded to " + url), instance.serverAddress(url), resolve())
         }, function() {
-            state.resolved || (console.log("Reconnect failed to " + url), ++state.rejects >= state.numAddresses && reject())
+            state.resolved || (console.error("Reconnect failed to " + url), ++state.rejects >= state.numAddresses && reject())
         })
     }
 
@@ -91,7 +107,7 @@ define(["events", "appStorage"], function(events, appStorage) {
         }), addressesStrings.push(addresses[addresses.length - 1].url)), serverInfo.RemoteAddress && -1 === addressesStrings.indexOf(serverInfo.RemoteAddress) && (addresses.push({
             url: serverInfo.RemoteAddress,
             timeout: 200
-        }), addressesStrings.push(addresses[addresses.length - 1].url)), console.log("tryReconnect: " + addressesStrings.join("|")), new Promise(function(resolve, reject) {
+        }), addressesStrings.push(addresses[addresses.length - 1].url)), console.debug("tryReconnect: " + addressesStrings.join("|")), new Promise(function(resolve, reject) {
             var state = {};
             state.numAddresses = addresses.length, state.rejects = 0, addresses.map(function(url) {
                 setTimeout(function() {
@@ -103,7 +119,7 @@ define(["events", "appStorage"], function(events, appStorage) {
 
     function tryReconnect(instance, retryCount) {
         return retryCount = retryCount || 0, retryCount >= 20 ? Promise.reject() : tryReconnectInternal(instance).catch(function(err) {
-            return console.log("error in tryReconnectInternal: " + (err || "")), new Promise(function(resolve, reject) {
+            return console.error("error in tryReconnectInternal: " + (err || "")), new Promise(function(resolve, reject) {
                 setTimeout(function() {
                     tryReconnect(instance, retryCount + 1).then(resolve, reject)
                 }, 500)
@@ -139,7 +155,7 @@ define(["events", "appStorage"], function(events, appStorage) {
 
     function onWebSocketOpen() {
         var instance = this;
-        console.log("web socket connection opened"), events.trigger(instance, "websocketopen")
+        console.debug("web socket connection opened"), events.trigger(instance, "websocketopen")
     }
 
     function onWebSocketError() {
@@ -149,7 +165,12 @@ define(["events", "appStorage"], function(events, appStorage) {
 
     function setSocketOnClose(apiClient, socket) {
         socket.onclose = function() {
-            console.log("web socket closed"), apiClient._webSocket === socket && (console.log("nulling out web socket"), apiClient._webSocket = null), setTimeout(function() {
+            console.debug("web socket closed");
+            if (apiClient._webSocket === socket) {
+                console.debug("nulling out web socket");
+                apiClient._webSocket = null;
+            }
+            setTimeout(function() {
                 events.trigger(apiClient, "websocketclose")
             }, 0)
         }
@@ -244,24 +265,24 @@ define(["events", "appStorage"], function(events, appStorage) {
         var lowered = url.toLowerCase();
         return "/" !== name.charAt(0) && (url += "/"), url += name, params && (params = paramsToString(params)) && (url += "?" + params), url
     }, ApiClient.prototype.fetchWithFailover = function(request, enableReconnection) {
-        console.log("Requesting " + request.url), request.timeout = 3e4;
+        console.debug("Requesting " + request.url), request.timeout = 3e4;
         var instance = this;
         return getFetchPromise(request).then(function(response) {
             return instance.lastFetch = (new Date).getTime(), response.status < 400 ? "json" === request.dataType || "application/json" === request.headers.accept ? response.json() : "text" === request.dataType || 0 === (response.headers.get("Content-Type") || "").toLowerCase().indexOf("text/") ? response.text() : response : (onFetchFail(instance, request.url, response), Promise.reject(response))
         }, function(error) {
-            if (error ? console.log("Request failed to " + request.url + " " + (error.status || "") + " " + error.toString()) : console.log("Request timed out to " + request.url), error && error.status || !enableReconnection) throw console.log("Reporting request failure"), onFetchFail(instance, request.url, {}), error;
-            console.log("Attempting reconnection");
+            if (error ? console.error("Request failed to " + request.url + " " + (error.status || "") + " " + error.toString()) : console.error("Request timed out to " + request.url), error && error.status || !enableReconnection) throw console.error("Reporting request failure"), onFetchFail(instance, request.url, {}), error;
+            console.debug("Attempting reconnection");
             var previousServerAddress = instance.serverAddress();
             return tryReconnect(instance).then(function() {
-                return console.log("Reconnect succeesed"), request.url = request.url.replace(previousServerAddress, instance.serverAddress()), instance.fetchWithFailover(request, !1)
+                return console.debug("Reconnect succeesed"), request.url = request.url.replace(previousServerAddress, instance.serverAddress()), instance.fetchWithFailover(request, !1)
             }, function(innerError) {
-                throw console.log("Reconnect failed"), onFetchFail(instance, request.url, {}), innerError
+                throw console.error("Reconnect failed"), onFetchFail(instance, request.url, {}), innerError
             })
         })
     }, ApiClient.prototype.fetch = function(request, includeAuthorization) {
         if (!request) throw new Error("Request cannot be null");
         if (request.headers = request.headers || {}, !1 !== includeAuthorization && this.setRequestHeaders(request.headers), !1 === this.enableAutomaticNetworking || "GET" !== request.type) {
-            console.log("Requesting url without automatic networking: " + request.url);
+            console.debug("Requesting url without automatic networking: " + request.url);
             var instance = this;
             return getFetchPromise(request).then(function(response) {
                 return instance.lastFetch = (new Date).getTime(), response.status < 400 ? "json" === request.dataType || "application/json" === request.headers.accept ? response.json() : "text" === request.dataType || 0 === (response.headers.get("Content-Type") || "").toLowerCase().indexOf("text/") ? response.text() : response : (onFetchFail(instance, request.url, response), Promise.reject(response))
@@ -340,7 +361,7 @@ define(["events", "appStorage"], function(events, appStorage) {
         if (!this.isWebSocketOpenOrConnecting() && this.isWebSocketSupported()) try {
             this.openWebSocket()
         } catch (err) {
-            console.log("Error opening web socket: " + err)
+            console.error("error opening web socket: " + err)
         }
     };
     var messageIdsReceived = {};
@@ -348,14 +369,14 @@ define(["events", "appStorage"], function(events, appStorage) {
         var accessToken = this.accessToken();
         if (!accessToken) throw new Error("Cannot open web socket without access token.");
         var url = this.getUrl("socket");
-        url = replaceAll(url, "emby/socket", "embywebsocket"), url = replaceAll(url, "https:", "wss:"), url = replaceAll(url, "http:", "ws:"), url += "?api_key=" + accessToken, url += "&deviceId=" + this.deviceId(), console.log("opening web socket with url: " + url);
+        url = replaceAll(url, "emby/socket", "embywebsocket"), url = replaceAll(url, "https:", "wss:"), url = replaceAll(url, "http:", "ws:"), url += "?api_key=" + accessToken, url += "&deviceId=" + this.deviceId(), console.debug("opening web socket with url: " + url);
         var webSocket = new WebSocket(url);
         webSocket.onmessage = onWebSocketMessage.bind(this), webSocket.onopen = onWebSocketOpen.bind(this), webSocket.onerror = onWebSocketError.bind(this), setSocketOnClose(this, webSocket), this._webSocket = webSocket
     }, ApiClient.prototype.closeWebSocket = function() {
         var socket = this._webSocket;
         socket && socket.readyState === WebSocket.OPEN && socket.close()
     }, ApiClient.prototype.sendWebSocketMessage = function(name, data) {
-        console.log("Sending web socket message: " + name);
+        console.debug("Sending web socket message: " + name);
         var msg = {
             MessageType: name
         };
@@ -387,7 +408,7 @@ define(["events", "appStorage"], function(events, appStorage) {
     }, ApiClient.prototype.updateServerInfo = function(server, serverUrl) {
         if (null == server) throw new Error("server cannot be null");
         if (this.serverInfo(server), !serverUrl) throw new Error("serverUrl cannot be null. serverInfo: " + JSON.stringify(server));
-        console.log("Setting server address to " + serverUrl), this.serverAddress(serverUrl)
+        console.debug("Setting server address to " + serverUrl), this.serverAddress(serverUrl)
     }, ApiClient.prototype.isWebSocketSupported = function() {
         try {
             return null != WebSocket

src/libraries/apiclient/appStorage.js

@@ -2,7 +2,7 @@ define([], function() {
     "use strict";
 
     function onCachePutFail(e) {
-        console.log(e);
+        console.error("cannot put to a cache: " + e);
     }
 
     function updateCache(instance) {
@@ -45,7 +45,7 @@ define([], function() {
                 self.caches.open("embydata").then(onCacheOpened.bind(this));
             }
         } catch (err) {
-            console.log("Error opening cache: " + err);
+            console.error("error opening cache: " + err);
         }
     }
 

src/libraries/apiclient/connectionmanager.js

@@ -95,18 +95,18 @@ define(["events", "apiclient", "appStorage"], function (events, apiClientFactory
     }
 
     function fetchWithTimeout(url, options, timeoutMs) {
-        console.log("fetchWithTimeout: timeoutMs: " + timeoutMs + ", url: " + url);
+        console.debug("fetchWithTimeout: timeoutMs: " + timeoutMs + ", url: " + url);
         return new Promise(function (resolve, reject) {
             var timeout = setTimeout(reject, timeoutMs);
             options = options || {};
             options.credentials = "same-origin";
             fetch(url, options).then(function (response) {
                 clearTimeout(timeout);
-                console.log("fetchWithTimeout: succeeded connecting to url: " + url);
+                console.debug("fetchWithTimeout: succeeded connecting to url: " + url);
                 resolve(response);
             }, function (error) {
                 clearTimeout(timeout);
-                console.log("fetchWithTimeout: timed out connecting to url: " + url);
+                console.error("fetchWithTimeout: timed out connecting to url: " + url);
                 reject();
             });
         });
@@ -118,9 +118,9 @@ define(["events", "apiclient", "appStorage"], function (events, apiClientFactory
         }
 
         request.headers = request.headers || {};
-        console.log("ConnectionManager requesting url: " + request.url);
+        console.debug("ConnectionManager requesting url: " + request.url);
         return getFetchPromise(request).then(function (response) {
-            console.log("ConnectionManager response status: " + response.status + ", url: " + request.url);
+            console.debug("ConnectionManager response status: " + response.status + ", url: " + request.url);
 
             if (response.status < 400) {
                 if ("json" === request.dataType || "application/json" === request.headers.accept) {
@@ -132,7 +132,7 @@ define(["events", "apiclient", "appStorage"], function (events, apiClientFactory
 
             return Promise.reject(response);
         }, function (err) {
-            console.log("ConnectionManager request failed to url: " + request.url);
+            console.error("ConnectionManager request failed to url: " + request.url);
             throw err;
         });
     }
@@ -227,7 +227,7 @@ define(["events", "apiclient", "appStorage"], function (events, apiClientFactory
             apiClient.enableAutomaticBitrateDetection = options.enableAutomaticBitrateDetection;
 
             if (false !== options.enableWebSocket) {
-                console.log("calling apiClient.ensureWebSocket");
+                console.debug("calling apiClient.ensureWebSocket");
                 apiClient.ensureWebSocket();
             }
         }
@@ -333,7 +333,7 @@ define(["events", "apiclient", "appStorage"], function (events, apiClientFactory
         }
 
         function getTryConnectPromise(url, connectionMode, state, resolve, reject) {
-            console.log("getTryConnectPromise " + url);
+            console.debug("getTryConnectPromise " + url);
             ajax({
                 url: getEmbyServerUrl(url, "system/info/public"),
                 timeout: defaultTimeout,
@@ -342,7 +342,7 @@ define(["events", "apiclient", "appStorage"], function (events, apiClientFactory
             }).then(function (result) {
                 if (!state.resolved) {
                     state.resolved = true;
-                    console.log("Reconnect succeeded to " + url);
+                    console.debug("Reconnect succeeded to " + url);
                     resolve({
                         url: url,
                         connectionMode: connectionMode,
@@ -351,7 +351,7 @@ define(["events", "apiclient", "appStorage"], function (events, apiClientFactory
                 }
             }, function () {
                 if (!state.resolved) {
-                    console.log("Reconnect failed to " + url);
+                    console.error("Reconnect failed to " + url);
 
                     if (++state.rejects >= state.numAddresses) {
                         reject();
@@ -391,7 +391,7 @@ define(["events", "apiclient", "appStorage"], function (events, apiClientFactory
                 addressesStrings.push(addresses[addresses.length - 1].url);
             }
 
-            console.log("tryReconnect: " + addressesStrings.join("|"));
+            console.debug("tryReconnect: " + addressesStrings.join("|"));
             return new Promise(function (resolve, reject) {
                 var state = {};
                 state.numAddresses = addresses.length;
@@ -458,7 +458,7 @@ define(["events", "apiclient", "appStorage"], function (events, apiClientFactory
             }
         }
 
-        console.log("Begin ConnectionManager constructor");
+        console.debug("Begin ConnectionManager constructor");
         var self = this;
         this._apiClients = [];
         self._minServerVersion = "3.2.33";
@@ -530,7 +530,7 @@ define(["events", "apiclient", "appStorage"], function (events, apiClientFactory
         };
 
         self.clearData = function () {
-            console.log("connection manager clearing data");
+            console.debug("connection manager clearing data");
             var credentials = credentialProvider.credentials();
             credentials.Servers = [];
             credentialProvider.credentials(credentials);
@@ -550,7 +550,7 @@ define(["events", "apiclient", "appStorage"], function (events, apiClientFactory
                 events.trigger(self, "apiclientcreated", [apiClient]);
             }
 
-            console.log("returning instance from getOrAddApiClient");
+            console.debug("returning instance from getOrAddApiClient");
             return apiClient;
         };
 
@@ -592,7 +592,7 @@ define(["events", "apiclient", "appStorage"], function (events, apiClientFactory
         };
 
         self.logout = function () {
-            console.log("begin connectionManager loguot");
+            console.debug("begin connectionManager loguot");
             var promises = [];
 
             for (var i = 0, length = self._apiClients.length; i < length; i++) {
@@ -628,7 +628,7 @@ define(["events", "apiclient", "appStorage"], function (events, apiClientFactory
         };
 
         self.getAvailableServers = function () {
-            console.log("Begin getAvailableServers");
+            console.debug("begin getAvailableServers");
             var credentials = credentialProvider.credentials();
             return Promise.all([findServers()]).then(function (responses) {
                 var foundServers = responses[0];
@@ -644,7 +644,7 @@ define(["events", "apiclient", "appStorage"], function (events, apiClientFactory
         };
 
         self.connectToServers = function (servers, options) {
-            console.log("Begin connectToServers, with " + servers.length + " servers");
+            console.debug("begin connectToServers, with " + servers.length + " servers");
             var firstServer = servers.length ? servers[0] : null;
 
             if (firstServer) {
@@ -653,7 +653,7 @@ define(["events", "apiclient", "appStorage"], function (events, apiClientFactory
                         result.State = "ServerSelection";
                     }
 
-                    console.log("resolving connectToServers with result.State: " + result.State);
+                    console.debug("resolving connectToServers with result.State: " + result.State);
                     return result;
                 });
             }
@@ -665,7 +665,7 @@ define(["events", "apiclient", "appStorage"], function (events, apiClientFactory
         };
 
         self.connectToServer = function (server, options) {
-            console.log("begin connectToServer");
+            console.debug("begin connectToServer");
             return new Promise(function (resolve, reject) {
                 options = options || {};
                 tryReconnect(server).then(function (result) {
@@ -674,14 +674,14 @@ define(["events", "apiclient", "appStorage"], function (events, apiClientFactory
                     result = result.data;
 
                     if (1 === compareVersions(self.minServerVersion(), result.Version)) {
-                        console.log("minServerVersion requirement not met. Server version: " + result.Version);
+                        console.debug("minServerVersion requirement not met. Server version: " + result.Version);
                         resolve({
                             State: "ServerUpdateNeeded",
                             Servers: [server]
                         });
                     } else {
                         if (server.Id && result.Id !== server.Id) {
-                            console.log("http request succeeded, but found a different server Id than what was expected");
+                            console.debug("http request succeeded, but found a different server Id than what was expected");
                             resolveFailure(self, resolve);
                         } else {
                             onSuccessfulConnection(server, result, connectionMode, serverUrl, options, resolve);
@@ -695,7 +695,7 @@ define(["events", "apiclient", "appStorage"], function (events, apiClientFactory
 
         self.connectToAddress = function (address, options) {
             function onFail() {
-                console.log("connectToAddress " + address + " failed");
+                console.error("connectToAddress " + address + " failed");
                 return Promise.resolve({
                     State: "Unavailable",
                 });
@@ -741,7 +741,7 @@ define(["events", "apiclient", "appStorage"], function (events, apiClientFactory
     };
 
     ConnectionManager.prototype.connect = function (options) {
-        console.log("Begin connect");
+        console.debug("begin connect");
         var instance = this;
         return instance.getAvailableServers().then(function (servers) {
             return instance.connectToServers(servers, options);

src/libraries/apiclient/credentialprovider.js

@@ -4,7 +4,7 @@ define(["events", "appStorage"], function(events, appStorage) {
     function ensure(instance, data) {
         if (!instance._credentials) {
             var json = appStorage.getItem(instance.key) || "{}";
-            console.log("credentials initialized with: " + json), instance._credentials = JSON.parse(json), instance._credentials.Servers = instance._credentials.Servers || []
+            console.debug("credentials initialized with: " + json), instance._credentials = JSON.parse(json), instance._credentials.Servers = instance._credentials.Servers || []
         }
     }
 

src/libraries/apiclient/localassetmanager.js

@@ -2,7 +2,7 @@ define(["filerepository", "itemrepository", "useractionrepository", "transferman
     "use strict";
 
     function getLocalItem(serverId, itemId) {
-        return console.log("[lcoalassetmanager] Begin getLocalItem"), itemrepository.get(serverId, itemId)
+        return console.debug("localassetmanager: begin getLocalItem"), itemrepository.get(serverId, itemId)
     }
 
     function recordUserAction(action) {
@@ -25,7 +25,7 @@ define(["filerepository", "itemrepository", "useractionrepository", "transferman
     }
 
     function getServerItems(serverId) {
-        return console.log("[localassetmanager] Begin getServerItems"), itemrepository.getAll(serverId)
+        return console.debug("localassetmanager: begin getServerItems"), itemrepository.getAll(serverId)
     }
 
     function getItemsFromIds(serverId, ids) {

src/libraries/apiclient/sync/localsync.js

@@ -3,7 +3,7 @@ define(["connectionManager"], function(connectionManager) {
     var isSyncing;
     return {
         sync: function(options) {
-            return console.log("localSync.sync starting..."), isSyncing ? Promise.resolve() : (isSyncing = !0, new Promise(function(resolve, reject) {
+            return console.debug("localSync.sync starting..."), isSyncing ? Promise.resolve() : (isSyncing = !0, new Promise(function(resolve, reject) {
                 require(["multiserversync", "appSettings"], function(MultiServerSync, appSettings) {
                     options = options || {}, options.cameraUploadServers = appSettings.cameraUploadServers(), (new MultiServerSync).sync(connectionManager, options).then(function() {
                         isSyncing = null, resolve()

src/libraries/apiclient/sync/mediasync.js

@@ -2,9 +2,9 @@ define(["localassetmanager"], function(localassetmanager) {
     "use strict";
 
     function processDownloadStatus(apiClient, serverInfo, options) {
-        return console.log("[mediasync] Begin processDownloadStatus"), localassetmanager.resyncTransfers().then(function() {
+        return console.debug("mediasync: begin processDownloadStatus"), localassetmanager.resyncTransfers().then(function() {
             return localassetmanager.getServerItems(serverInfo.Id).then(function(items) {
-                console.log("[mediasync] Begin processDownloadStatus getServerItems completed");
+                console.debug("mediasync: begin processDownloadStatus getServerItems completed");
                 var p = Promise.resolve(),
                     cnt = 0;
                 return items.filter(function(item) {
@@ -14,7 +14,9 @@ define(["localassetmanager"], function(localassetmanager) {
                         return reportTransfer(apiClient, item)
                     }), cnt++
                 }), p.then(function() {
-                    return console.log("[mediasync] Exit processDownloadStatus. Items reported: " + cnt.toString()), Promise.resolve()
+                    console.debug("mediasync: exit processDownloadStatus");
+                    console.debug("items reported: " + cnt.toString());
+                    return Promise.resolve();
                 })
             })
         })
@@ -23,39 +25,39 @@ define(["localassetmanager"], function(localassetmanager) {
     function reportTransfer(apiClient, item) {
         return localassetmanager.getItemFileSize(item.LocalPath).then(function(size) {
             return size > 0 ? apiClient.reportSyncJobItemTransferred(item.SyncJobItemId).then(function() {
-                return item.SyncStatus = "synced", console.log("[mediasync] reportSyncJobItemTransferred called for " + item.LocalPath), localassetmanager.addOrUpdateLocalItem(item)
+                return item.SyncStatus = "synced", console.debug("mediasync: reportSyncJobItemTransferred called for " + item.LocalPath), localassetmanager.addOrUpdateLocalItem(item)
             }, function(error) {
-                return console.error("[mediasync] Mediasync error on reportSyncJobItemTransferred", error), item.SyncStatus = "error", localassetmanager.addOrUpdateLocalItem(item)
+                return console.error("mediasync: mediasync error on reportSyncJobItemTransferred", error), item.SyncStatus = "error", localassetmanager.addOrUpdateLocalItem(item)
             }) : localassetmanager.isDownloadFileInQueue(item.LocalPath).then(function(result) {
-                return result ? Promise.resolve() : (console.log("[mediasync] reportTransfer: Size is 0 and download no longer in queue. Deleting item."), localassetmanager.removeLocalItem(item).then(function() {
-                    return console.log("[mediasync] reportTransfer: Item deleted."), Promise.resolve()
+                return result ? Promise.resolve() : (console.debug("mediasync: reportTransfer: Size is 0 and download no longer in queue. Deleting item."), localassetmanager.removeLocalItem(item).then(function() {
+                    return console.debug("mediasync: reportTransfer: Item deleted."), Promise.resolve()
                 }, function(err2) {
-                    return console.log("[mediasync] reportTransfer: Failed to delete item.", err2), Promise.resolve()
+                    return console.debug("mediasync: reportTransfer: Failed to delete item.", err2), Promise.resolve()
                 }))
             })
         }, function(error) {
-            return console.error("[mediasync] reportTransfer: error on getItemFileSize. Deleting item.", error), localassetmanager.removeLocalItem(item).then(function() {
-                return console.log("[mediasync] reportTransfer: Item deleted."), Promise.resolve()
+            return console.error("mediasync: reportTransfer: error on getItemFileSize. Deleting item.", error), localassetmanager.removeLocalItem(item).then(function() {
+                return console.debug("mediasync: reportTransfer: Item deleted."), Promise.resolve()
             }, function(err2) {
-                return console.log("[mediasync] reportTransfer: Failed to delete item.", err2), Promise.resolve()
+                return console.error("mediasync: reportTransfer: Failed to delete item.", err2), Promise.resolve()
             })
         })
     }
 
     function reportOfflineActions(apiClient, serverInfo) {
-        return console.log("[mediasync] Begin reportOfflineActions"), localassetmanager.getUserActions(serverInfo.Id).then(function(actions) {
+        return console.debug("mediasync: begin reportOfflineActions"), localassetmanager.getUserActions(serverInfo.Id).then(function(actions) {
             return actions.length ? apiClient.reportOfflineActions(actions).then(function() {
                 return localassetmanager.deleteUserActions(actions).then(function() {
-                    return console.log("[mediasync] Exit reportOfflineActions (actions reported and deleted.)"), Promise.resolve()
+                    return console.debug("mediasync: exit reportOfflineActions (actions reported and deleted.)"), Promise.resolve()
                 })
             }, function(err) {
-                return console.error("[mediasync] error on apiClient.reportOfflineActions: " + err.toString()), localassetmanager.deleteUserActions(actions)
-            }) : (console.log("[mediasync] Exit reportOfflineActions (no actions)"), Promise.resolve())
+                return console.error("mediasync: error on apiClient.reportOfflineActions: " + err.toString()), localassetmanager.deleteUserActions(actions)
+            }) : (console.debug("mediasync: exit reportOfflineActions (no actions)"), Promise.resolve())
         })
     }
 
     function syncData(apiClient, serverInfo) {
-        return console.log("[mediasync] Begin syncData"), localassetmanager.getServerItems(serverInfo.Id).then(function(items) {
+        return console.debug("mediasync: begin syncData"), localassetmanager.getServerItems(serverInfo.Id).then(function(items) {
             var completedItems = items.filter(function(item) {
                     return item && ("synced" === item.SyncStatus || "error" === item.SyncStatus)
                 }),
@@ -67,16 +69,16 @@ define(["localassetmanager"], function(localassetmanager) {
                 };
             return apiClient.syncData(request).then(function(result) {
                 return afterSyncData(apiClient, serverInfo, result).then(function() {
-                    return console.log("[mediasync] Exit syncData"), Promise.resolve()
+                    return console.debug("mediasync: exit syncData"), Promise.resolve()
                 }, function(err) {
-                    return console.error("[mediasync] Error in syncData: " + err.toString()), Promise.resolve()
+                    return console.error("mediasync: error in syncData: " + err.toString()), Promise.resolve()
                 })
             })
         })
     }
 
     function afterSyncData(apiClient, serverInfo, syncDataResult) {
-        console.log("[mediasync] Begin afterSyncData");
+        console.debug("mediasync: begin afterSyncData");
         var p = Promise.resolve();
         return syncDataResult.ItemIdsToRemove && syncDataResult.ItemIdsToRemove.length > 0 && syncDataResult.ItemIdsToRemove.forEach(function(itemId) {
             p = p.then(function() {
@@ -85,25 +87,25 @@ define(["localassetmanager"], function(localassetmanager) {
         }), p = p.then(function() {
             return removeObsoleteContainerItems(serverInfo.Id)
         }), p.then(function() {
-            return console.log("[mediasync] Exit afterSyncData"), Promise.resolve()
+            return console.debug("mediasync: exit afterSyncData"), Promise.resolve()
         })
     }
 
     function removeObsoleteContainerItems(serverId) {
-        return console.log("[mediasync] Begin removeObsoleteContainerItems"), localassetmanager.removeObsoleteContainerItems(serverId)
+        return console.debug("mediasync: begin removeObsoleteContainerItems"), localassetmanager.removeObsoleteContainerItems(serverId)
     }
 
     function removeLocalItem(itemId, serverId) {
-        return console.log("[mediasync] Begin removeLocalItem"), localassetmanager.getLocalItem(serverId, itemId).then(function(item) {
+        return console.debug("mediasync: begin removeLocalItem"), localassetmanager.getLocalItem(serverId, itemId).then(function(item) {
             return item ? localassetmanager.removeLocalItem(item) : Promise.resolve()
         }, function(err2) {
-            return console.error("[mediasync] removeLocalItem: Failed: ", err2), Promise.resolve()
+            return console.error("mediasync: removeLocalItem: Failed: ", err2), Promise.resolve()
         })
     }
 
     function getNewMedia(apiClient, downloadCount) {
-        return console.log("[mediasync] Begin getNewMedia"), apiClient.getReadySyncItems(apiClient.deviceId()).then(function(jobItems) {
-            console.log("[mediasync] getReadySyncItems returned " + jobItems.length + " items");
+        return console.debug("mediasync: begin getNewMedia"), apiClient.getReadySyncItems(apiClient.deviceId()).then(function(jobItems) {
+            console.debug("mediasync: getReadySyncItems returned " + jobItems.length + " items");
             var p = Promise.resolve(),
                 currentCount = downloadCount;
             return jobItems.forEach(function(jobItem) {
@@ -111,15 +113,15 @@ define(["localassetmanager"], function(localassetmanager) {
                     return getNewItem(jobItem, apiClient)
                 }))
             }), p.then(function() {
-                return console.log("[mediasync] Exit getNewMedia"), Promise.resolve()
+                return console.debug("mediasync: exit getNewMedia"), Promise.resolve()
             })
         }, function(err) {
-            return console.error("[mediasync] getReadySyncItems: Failed: ", err), Promise.resolve()
+            return console.error("mediasync: getReadySyncItems: Failed: ", err), Promise.resolve()
         })
     }
 
     function afterMediaDownloaded(apiClient, jobItem, localItem) {
-        return console.log("[mediasync] Begin afterMediaDownloaded"), getImages(apiClient, jobItem, localItem).then(function() {
+        return console.debug("mediasync: begin afterMediaDownloaded"), getImages(apiClient, jobItem, localItem).then(function() {
             var libraryItem = jobItem.Item;
             return downloadParentItems(apiClient, jobItem, libraryItem).then(function() {
                 return getSubtitles(apiClient, jobItem, localItem)
@@ -128,21 +130,21 @@ define(["localassetmanager"], function(localassetmanager) {
     }
 
     function createLocalItem(libraryItem, jobItem) {
-        console.log("[localassetmanager] Begin createLocalItem");
+        console.debug("localassetmanager: begin createLocalItem");
         var item = {
             Item: libraryItem,
             ItemId: libraryItem.Id,
             ServerId: libraryItem.ServerId,
             Id: libraryItem.Id
         };
-        return jobItem && (item.SyncJobItemId = jobItem.SyncJobItemId), console.log("[localassetmanager] End createLocalItem"), item
+        return jobItem && (item.SyncJobItemId = jobItem.SyncJobItemId), console.debug("localassetmanager: end createLocalItem"), item
     }
 
     function getNewItem(jobItem, apiClient) {
-        console.log("[mediasync] Begin getNewItem");
+        console.debug("mediasync: begin getNewItem");
         var libraryItem = jobItem.Item;
         return localassetmanager.getLocalItem(libraryItem.ServerId, libraryItem.Id).then(function(existingItem) {
-            if (existingItem && ("queued" === existingItem.SyncStatus || "transferring" === existingItem.SyncStatus || "synced" === existingItem.SyncStatus) && (console.log("[mediasync] getNewItem: getLocalItem found existing item"), localassetmanager.enableBackgroundCompletion())) return Promise.resolve();
+            if (existingItem && ("queued" === existingItem.SyncStatus || "transferring" === existingItem.SyncStatus || "synced" === existingItem.SyncStatus) && (console.debug("mediasync: getNewItem: getLocalItem found existing item"), localassetmanager.enableBackgroundCompletion())) return Promise.resolve();
             libraryItem.CanDelete = !1, libraryItem.CanDownload = !1, libraryItem.SupportsSync = !1, libraryItem.People = [], libraryItem.Chapters = [], libraryItem.Studios = [], libraryItem.SpecialFeatureCount = null, libraryItem.LocalTrailerCount = null, libraryItem.RemoteTrailers = [];
             var localItem = createLocalItem(libraryItem, jobItem);
             return localItem.SyncStatus = "queued", downloadMedia(apiClient, jobItem, localItem)
@@ -169,7 +171,7 @@ define(["localassetmanager"], function(localassetmanager) {
             return localassetmanager.addOrUpdateLocalItem(localItem).then(function() {
                 return Promise.resolve(localItem)
             }, function(err) {
-                return console.error("[mediasync] downloadItem failed: " + err.toString()), Promise.resolve(null)
+                return console.error("mediasync: downloadItem failed: " + err.toString()), Promise.resolve(null)
             })
         })
     }
@@ -183,12 +185,12 @@ define(["localassetmanager"], function(localassetmanager) {
     }
 
     function downloadMedia(apiClient, jobItem, localItem) {
-        console.log("[mediasync] downloadMedia: start.");
+        console.debug("mediasync: downloadMedia: start.");
         var url = apiClient.getUrl("Sync/JobItems/" + jobItem.SyncJobItemId + "/File", {
             api_key: apiClient.accessToken()
         });
         return ensureLocalPathParts(localItem, jobItem), localassetmanager.downloadFile(url, localItem).then(function(result) {
-            console.log("[mediasync] downloadMedia-downloadFile returned path: " + result.path);
+            console.debug("mediasync: downloadMedia-downloadFile returned path: " + result.path);
             var localPath = result.path,
                 libraryItem = localItem.Item;
             if (localPath && libraryItem.MediaSources)
@@ -200,18 +202,18 @@ define(["localassetmanager"], function(localassetmanager) {
                 return afterMediaDownloaded(apiClient, jobItem, localItem).then(function() {
                     return result.isComplete ? (localItem.SyncStatus = "synced", reportTransfer(apiClient, localItem)) : Promise.resolve()
                 }, function(err) {
-                    return console.log("[mediasync] downloadMedia: afterMediaDownloaded failed: " + err), Promise.reject(err)
+                    return console.debug("mediasync: downloadMedia: afterMediaDownloaded failed: " + err), Promise.reject(err)
                 })
             }, function(err) {
-                return console.log("[mediasync] downloadMedia: addOrUpdateLocalItem failed: " + err), Promise.reject(err)
+                return console.debug("mediasync: downloadMedia: addOrUpdateLocalItem failed: " + err), Promise.reject(err)
             })
         }, function(err) {
-            return console.log("[mediasync] downloadMedia: localassetmanager.downloadFile failed: " + err), Promise.reject(err)
+            return console.debug("mediasync: downloadMedia: localassetmanager.downloadFile failed: " + err), Promise.reject(err)
         })
     }
 
     function getImages(apiClient, jobItem, localItem) {
-        console.log("[mediasync] Begin getImages");
+        console.debug("mediasync: begin getImages");
         var p = Promise.resolve(),
             libraryItem = localItem.Item,
             serverId = libraryItem.ServerId,
@@ -249,15 +251,15 @@ define(["localassetmanager"], function(localassetmanager) {
         })), libraryItem.ParentPrimaryImageItemId && libraryItem.ParentPrimaryImageTag && (p = p.then(function() {
             return downloadImage(localItem, apiClient, serverId, libraryItem.ParentPrimaryImageItemId, libraryItem.ParentPrimaryImageTag, "Primary")
         })), p.then(function() {
-            return console.log("[mediasync] Finished getImages"), localassetmanager.addOrUpdateLocalItem(localItem)
+            return console.debug("mediasync: finished getImages"), localassetmanager.addOrUpdateLocalItem(localItem)
         }, function(err) {
-            return console.log("[mediasync] Error getImages: " + err.toString()), Promise.resolve()
+            return console.error("mediasync: error getImages: " + err.toString()), Promise.resolve()
         })
     }
 
     function downloadImage(localItem, apiClient, serverId, itemId, imageTag, imageType, index) {
         return index = index || 0, localassetmanager.hasImage(serverId, itemId, imageType, index).then(function(hasImage) {
-            if (hasImage) return console.log("[mediasync] downloadImage - skip existing: " + itemId + " " + imageType + "_" + index.toString()), Promise.resolve();
+            if (hasImage) return console.debug("mediasync: downloadImage - skip existing: " + itemId + " " + imageType + "_" + index.toString()), Promise.resolve();
             var maxWidth = 400;
             "backdrop" === imageType && (maxWidth = null);
             var imageUrl = apiClient.getScaledImageUrl(itemId, {
@@ -266,18 +268,18 @@ define(["localassetmanager"], function(localassetmanager) {
                 maxWidth: maxWidth,
                 api_key: apiClient.accessToken()
             });
-            return console.log("[mediasync] downloadImage " + itemId + " " + imageType + "_" + index.toString()), localassetmanager.downloadImage(localItem, imageUrl, serverId, itemId, imageType, index).then(function(result) {
+            return console.debug("mediasync: downloadImage " + itemId + " " + imageType + "_" + index.toString()), localassetmanager.downloadImage(localItem, imageUrl, serverId, itemId, imageType, index).then(function(result) {
                 return Promise.resolve(result)
             }, function(err) {
-                return console.log("[mediasync] Error downloadImage: " + err.toString()), Promise.resolve()
+                return console.error("mediasync: error downloadImage: " + err.toString()), Promise.resolve()
             })
         }, function(err) {
-            return console.log("[mediasync] Error downloadImage: " + err.toString()), Promise.resolve()
+            return console.error("mediasync: error downloadImage: " + err.toString()), Promise.resolve()
         })
     }
 
     function getSubtitles(apiClient, jobItem, localItem) {
-        if (console.log("[mediasync] Begin getSubtitles"), !jobItem.Item.MediaSources.length) return console.log("[mediasync] Cannot download subtitles because video has no media source info."), Promise.resolve();
+        if (console.debug("mediasync: begin getSubtitles"), !jobItem.Item.MediaSources.length) return console.debug("mediasync: cannot download subtitles because video has no media source info."), Promise.resolve();
         var files = jobItem.AdditionalFiles.filter(function(f) {
                 return "Subtitles" === f.Type
             }),
@@ -288,16 +290,16 @@ define(["localassetmanager"], function(localassetmanager) {
                 return getItemSubtitle(file, apiClient, jobItem, localItem, mediaSource)
             })
         }), p.then(function() {
-            return console.log("[mediasync] Exit getSubtitles"), Promise.resolve()
+            return console.debug("mediasync: exit getSubtitles"), Promise.resolve()
         })
     }
 
     function getItemSubtitle(file, apiClient, jobItem, localItem, mediaSource) {
-        console.log("[mediasync] Begin getItemSubtitle");
+        console.debug("mediasync: begin getItemSubtitle");
         var subtitleStream = mediaSource.MediaStreams.filter(function(m) {
             return "Subtitle" === m.Type && m.Index === file.Index
         })[0];
-        if (!subtitleStream) return console.log("[mediasync] Cannot download subtitles because matching stream info was not found."), Promise.resolve();
+        if (!subtitleStream) return console.debug("mediasync: cannot download subtitles because matching stream info was not found."), Promise.resolve();
         var url = apiClient.getUrl("Sync/JobItems/" + jobItem.SyncJobItemId + "/AdditionalFiles", {
                 Name: file.Name,
                 api_key: apiClient.accessToken()
@@ -311,7 +313,7 @@ define(["localassetmanager"], function(localassetmanager) {
     }
 
     function checkLocalFileExistence(apiClient, serverInfo, options) {
-        return options.checkFileExistence ? (console.log("[mediasync] Begin checkLocalFileExistence"), localassetmanager.getServerItems(serverInfo.Id).then(function(items) {
+        return options.checkFileExistence ? (console.debug("mediasync: begin checkLocalFileExistence"), localassetmanager.getServerItems(serverInfo.Id).then(function(items) {
             var completedItems = items.filter(function(item) {
                     return item && ("synced" === item.SyncStatus || "error" === item.SyncStatus)
                 }),
@@ -332,13 +334,13 @@ define(["localassetmanager"], function(localassetmanager) {
     return function() {
         var self = this;
         "string" == typeof webWorkerBaseUrl && -1 !== webWorkerBaseUrl.indexOf("ms-appx://") ? self.sync = function(apiClient, serverInfo, options) {
-            return console.log("[mediasync]************************************* Start sync"), checkLocalFileExistence(apiClient, serverInfo, options).then(function() {
+            return console.debug("mediasync: start sync"), checkLocalFileExistence(apiClient, serverInfo, options).then(function() {
                 return processDownloadStatus(apiClient, serverInfo, options).then(function() {
                     return localassetmanager.getDownloadItemCount().then(function(downloadCount) {
                         return !0 === options.syncCheckProgressOnly && downloadCount > 2 ? Promise.resolve() : reportOfflineActions(apiClient, serverInfo).then(function() {
                             return getNewMedia(apiClient, downloadCount).then(function() {
                                 return syncData(apiClient, serverInfo).then(function() {
-                                    return console.log("[mediasync]************************************* Exit sync"), Promise.resolve()
+                                    return console.debug("mediasync: Exit sync"), Promise.resolve()
                                 })
                             })
                         })
@@ -348,7 +350,7 @@ define(["localassetmanager"], function(localassetmanager) {
                 console.error(err.toString())
             })
         } : self.sync = function(apiClient, serverInfo, options) {
-            return console.log("[mediasync]************************************* Start sync"), checkLocalFileExistence(apiClient, serverInfo, options).then(function() {
+            return console.debug("mediasync: Start sync"), checkLocalFileExistence(apiClient, serverInfo, options).then(function() {
                 return syncData(apiClient, serverInfo).then(function() {
                     return processDownloadStatus(apiClient, serverInfo, options).then(function() {
                         return localassetmanager.getDownloadItemCount().then(function(downloadCount) {

src/libraries/apiclient/sync/multiserversync.js

@@ -3,18 +3,18 @@ define(["serversync"], function(ServerSync) {
 
     function syncNext(connectionManager, servers, index, options, resolve, reject) {
         var length = servers.length;
-        if (index >= length) return console.log("MultiServerSync.sync complete"), void resolve();
+        if (index >= length) return console.debug("MultiServerSync.sync complete"), void resolve();
         var server = servers[index];
-        console.log("Creating ServerSync to server: " + server.Id), (new ServerSync).sync(connectionManager, server, options).then(function() {
-            console.log("ServerSync succeeded to server: " + server.Id), syncNext(connectionManager, servers, index + 1, options, resolve, reject)
+        console.debug("Creating ServerSync to server: " + server.Id), (new ServerSync).sync(connectionManager, server, options).then(function() {
+            console.debug("ServerSync succeeded to server: " + server.Id), syncNext(connectionManager, servers, index + 1, options, resolve, reject)
         }, function(err) {
-            console.log("ServerSync failed to server: " + server.Id + ". " + err), syncNext(connectionManager, servers, index + 1, options, resolve, reject)
+            console.error("ServerSync failed to server: " + server.Id + ". " + err), syncNext(connectionManager, servers, index + 1, options, resolve, reject)
         })
     }
 
     function MultiServerSync() {}
     return MultiServerSync.prototype.sync = function(connectionManager, options) {
-        return console.log("MultiServerSync.sync starting..."), new Promise(function(resolve, reject) {
+        return console.debug("MultiServerSync.sync starting..."), new Promise(function(resolve, reject) {
             var servers = connectionManager.getSavedServers();
             syncNext(connectionManager, servers, 0, options, resolve, reject)
         })

src/libraries/apiclient/sync/serversync.js

@@ -2,11 +2,11 @@ define([], function() {
     "use strict";
 
     function performSync(connectionManager, server, options) {
-        console.log("ServerSync.performSync to server: " + server.Id), options = options || {};
+        console.debug("ServerSync.performSync to server: " + server.Id), options = options || {};
         var cameraUploadServers = options.cameraUploadServers || [];
-        console.log("ServerSync cameraUploadServers: " + JSON.stringify(cameraUploadServers));
+        console.debug("ServerSync cameraUploadServers: " + JSON.stringify(cameraUploadServers));
         var uploadPhotos = -1 !== cameraUploadServers.indexOf(server.Id);
-        return console.log("ServerSync uploadPhotos: " + uploadPhotos), (uploadPhotos ? uploadContent(connectionManager, server, options) : Promise.resolve()).then(function() {
+        return console.debug("ServerSync uploadPhotos: " + uploadPhotos), (uploadPhotos ? uploadContent(connectionManager, server, options) : Promise.resolve()).then(function() {
             return syncMedia(connectionManager, server, options)
         })
     }
@@ -26,7 +26,7 @@ define([], function() {
 
     function ServerSync() {}
     return ServerSync.prototype.sync = function(connectionManager, server, options) {
-        if (!server.AccessToken && !server.ExchangeToken) return console.log("Skipping sync to server " + server.Id + " because there is no saved authentication information."), Promise.resolve();
+        if (!server.AccessToken && !server.ExchangeToken) return console.debug("Skipping sync to server " + server.Id + " because there is no saved authentication information."), Promise.resolve();
         var connectionOptions = {
             updateDateLastAccessed: !1,
             enableWebSocket: !1,
@@ -34,9 +34,9 @@ define([], function() {
             enableAutomaticBitrateDetection: !1
         };
         return connectionManager.connectToServer(server, connectionOptions).then(function(result) {
-            return "SignedIn" === result.State ? performSync(connectionManager, server, options) : (console.log("Unable to connect to server id: " + server.Id), Promise.reject())
+            return "SignedIn" === result.State ? performSync(connectionManager, server, options) : (console.error("Unable to connect to server id: " + server.Id), Promise.reject())
         }, function(err) {
-            throw console.log("Unable to connect to server id: " + server.Id), err
+            throw console.error("Unable to connect to server id: " + server.Id), err
         })
     }, ServerSync
 });

src/mypreferencesmenu.html

@@ -32,7 +32,7 @@
 
                 <a is="emby-linkbutton" data-ripple="false" href="#" style="display:block;padding:0;margin:0;" class="lnkPlaybackPreferences listItem-border">
                     <div class="listItem">
-                        <i class="material-icons listItemIcon listItemIcon-transparent">play_circle_filled</i>
+                        <i class="material-icons listItemIcon listItemIcon-transparent play_circle_filled"></i>
                         <div class="listItemBody">
                             <div class="listItemBodyText">${TitlePlayback}</div>
                         </div>
@@ -60,7 +60,7 @@
                 </a>
                 <a is="emby-linkbutton" href="edititemmetadata.html" style="display:block;padding:0;margin:0;" class="listItem-border">
                     <div class="listItem">
-                        <i class="material-icons listItemIcon listItemIcon-transparent">mode_edit</i>
+                        <i class="material-icons listItemIcon listItemIcon-transparent mode_edit"></i>
                         <div class="listItemBody">
                             <div class="listItemBodyText">${Metadata}</div>
                         </div>
@@ -79,7 +79,7 @@
                 </a>
                 <a is="emby-linkbutton" data-ripple="false" href="#" style="display:block;padding:0;margin:0;" class="btnLogout listItem-border">
                     <div class="listItem">
-                        <i class="material-icons listItemIcon listItemIcon-transparent">exit_to_app</i>
+                        <i class="material-icons listItemIcon listItemIcon-transparent exit_to_app"></i>
                         <div class="listItemBody">
                             <div class="listItemBodyText">${ButtonSignOut}</div>
                         </div>

src/nowplaying.html

@@ -12,7 +12,7 @@
                     <input type="range" is="emby-slider" pin step="1" min="0" max="100" value="0" class="nowPlayingPositionSlider" data-slider-keep-progress="true" />
                 </div>
 
-                <div class="nowPlayingInfoButtons">
+                <div class="nowPlayingInfoButtons focuscontainer-x">
                     <button is="paper-icon-button-light" class="btnPreviousTrack btnPlayStateCommand autoSize" title="${ButtonPreviousTrack}">
                         <i class="material-icons skip_previous"></i>
                     </button>
@@ -63,7 +63,7 @@
                         </button>
 
                         <button is="paper-icon-button-light" class="buttonMute autoSize" title="${Mute}">
-                            <i class="xlargePaperIconButton material-icons volume_up"></i>
+                            <i class="xlargePaperIconButton material-icons"></i>
                         </button>
                         <div class="sliderContainer nowPlayingVolumeSliderContainer">
                             <input is="emby-slider" type="range" step="1" min="0" max="100" value="0" class="nowPlayingVolumeSlider" />
@@ -87,10 +87,10 @@
                                 <i class="material-icons keyboard_arrow_left"></i>
                             </button>
                             <button is="paper-icon-button-light" class="btnOk btnCommand autoSize button-submit" title="${ButtonOk}" data-command="Select">
-                                <i class="material-icons">keyboard_return</i>
+                                <i class="material-icons keyboard_return"></i>
                             </button>
                             <button is="paper-icon-button-light" class="btnArrowRight btnCommand autoSize button-submit" title="${ButtonArrowRight}" data-command="MoveRight">
-                                <i class="material-icons">keyboard_arrow_right</i>
+                                <i class="material-icons keyboard_arrow_right"></i>
                             </button>
                         </div>
                         <br />

src/scripts/apploader.js

@@ -19,11 +19,23 @@
         document.head.appendChild(script);
     }
 
-    injectScriptElement(
-        self.Promise ? "./libraries/alameda.js" : "./libraries/require.js",
-        function() {
-            // onload of require library
-            injectScriptElement("./scripts/site.js");
-        }
-    );
+    function loadSite() {
+        injectScriptElement(
+            "./libraries/alameda.js",
+            function() {
+                // onload of require library
+                injectScriptElement("./scripts/site.js");
+            }
+        );
+    }
+
+    if (!self.Promise) {
+        // Load Promise polyfill if they are not natively supported
+        injectScriptElement(
+            "./libraries/npo.js",
+            loadSite
+        );
+    } else {
+        loadSite();
+    }
 })();

src/scripts/autobackdrops.js

@@ -10,7 +10,7 @@ define(["backdrop", "userSettings", "libraryMenu"], function (backdrop, userSett
         var data = cache[key];
 
         if (data) {
-            console.log("Found backdrop id list in cache. Key: " + key);
+            console.debug("Found backdrop id list in cache. Key: " + key);
             data = JSON.parse(data);
             return Promise.resolve(data);
         }

src/scripts/browserdeviceprofile.js

@@ -92,7 +92,7 @@ define(['browser'], function (browser) {
             return true;
         }
 
-        if (!!videoTestElement.canPlayType) {
+        if (videoTestElement.canPlayType) {
             return videoTestElement.canPlayType('application/x-mpegurl; codecs="avc1.42E01E, ac-3"').replace(/no/, '') ||
                 videoTestElement.canPlayType('application/vnd.apple.mpegURL; codecs="avc1.42E01E, ac-3"').replace(/no/, '');
         }
@@ -302,9 +302,9 @@ define(['browser'], function (browser) {
             try {
                 var isTizenUhd = webapis.productinfo.isUdPanelSupported();
                 isTizenFhd = !isTizenUhd;
-                console.log("isTizenFhd = " + isTizenFhd);
+                console.debug("isTizenFhd = " + isTizenFhd);
             } catch (error) {
-                console.log("isUdPanelSupported() error code = " + error.code);
+                console.error("isUdPanelSupported() error code = " + error.code);
             }
         }
 
@@ -761,7 +761,7 @@ define(['browser'], function (browser) {
             videoTestElement.canPlayType('video/mp4; codecs="avc1.6e0033"').replace(/no/, '')) {
 
             // These tests are passing in safari, but playback is failing
-            if (!browser.safari && !browser.iOS && !browser.web0s && !browser.edge) {
+            if (!browser.safari && !browser.iOS && !browser.web0s && !browser.edge && !browser.mobile) {
                 h264Profiles += '|high 10';
             }
         }

src/scripts/editorsidebar.js

@@ -49,7 +49,7 @@ define(["datetime", "jQuery", "material-icons"], function (datetime, $) {
         } else if (item.MediaType === "Audio") {
             htmlName += '<i class="material-icons metadataSidebarIcon">audiotrack</i>';
         } else if (item.Type === "TvChannel") {
-            htmlName += '<i class="material-icons metadataSidebarIcon">live_tv</i>';
+            htmlName += '<i class="material-icons metadataSidebarIcon live_tv"></i>';
         } else if (item.MediaType === "Photo") {
             htmlName += '<i class="material-icons metadataSidebarIcon">photo</i>';
         } else if (item.MediaType === "Book") {

src/scripts/globalize.js

@@ -38,7 +38,7 @@ define(['connectionManager', 'userSettings', 'events'], function (connectionMana
         try {
             culture = userSettings.language();
         } catch (err) {
-            console.log('no language set in user settings');
+            console.error('no language set in user settings');
         }
         culture = culture || getDefaultLanguage();
 
@@ -48,7 +48,7 @@ define(['connectionManager', 'userSettings', 'events'], function (connectionMana
         try {
             dateTimeCulture = userSettings.dateTimeLocale();
         } catch (err) {
-            console.log('no date format set in user settings');
+            console.error('no date format set in user settings');
         }
 
         if (dateTimeCulture) {

src/scripts/librarybrowser.js

@@ -92,7 +92,7 @@ define(["userSettings"], function (userSettings) {
 
                 if (showControls) {
                     html += '<button is="paper-icon-button-light" class="btnPreviousPage autoSize" ' + (startIndex ? "" : "disabled") + '><i class="material-icons arrow_back"></i></button>';
-                    html += '<button is="paper-icon-button-light" class="btnNextPage autoSize" ' + (startIndex + limit >= totalRecordCount ? "disabled" : "") + '><i class="material-icons">arrow_forward</i></button>';
+                    html += '<button is="paper-icon-button-light" class="btnNextPage autoSize" ' + (startIndex + limit >= totalRecordCount ? "disabled" : "") + '><i class="material-icons arrow_forward"></i></button>';
                 }
 
                 if (options.addLayoutButton) {

src/scripts/librarymenu.js

@@ -12,6 +12,7 @@ define(["dom", "layoutManager", "inputManager", "connectionManager", "events", "
         html += "</div>";
         html += '<div class="headerRight">';
         html += '<span class="headerSelectedPlayer"></span>';
+        html += '<button is="paper-icon-button-light" class="headerAudioPlayerButton audioPlayerButton headerButton headerButtonRight hide"><i class="material-icons music_note"></i></button>';
         html += '<button is="paper-icon-button-light" class="headerCastButton castButton headerButton headerButtonRight hide"><i class="material-icons">cast</i></button>';
         html += '<button type="button" is="paper-icon-button-light" class="headerButton headerButtonRight headerSearchButton hide"><i class="material-icons">search</i></button>';
         html += '<button is="paper-icon-button-light" class="headerButton headerButtonRight headerUserButton hide"><i class="material-icons">person</i></button>';
@@ -27,6 +28,7 @@ define(["dom", "layoutManager", "inputManager", "connectionManager", "events", "
         headerHomeButton = skinHeader.querySelector(".headerHomeButton");
         headerUserButton = skinHeader.querySelector(".headerUserButton");
         headerCastButton = skinHeader.querySelector(".headerCastButton");
+        headerAudioPlayerButton = skinHeader.querySelector(".headerAudioPlayerButton");
         headerSearchButton = skinHeader.querySelector(".headerSearchButton");
 
         lazyLoadViewMenuBarImages();
@@ -116,6 +118,10 @@ define(["dom", "layoutManager", "inputManager", "connectionManager", "events", "
         Dashboard.navigate("home.html");
     }
 
+    function showAudioPlayer() {
+        return appRouter.showNowPlaying();
+    }
+
     function bindMenuEvents() {
         mainDrawerButton = document.querySelector(".mainDrawerButton");
 
@@ -140,9 +146,27 @@ define(["dom", "layoutManager", "inputManager", "connectionManager", "events", "
             headerCastButton.addEventListener("click", onCastButtonClicked);
         }
 
+        headerAudioPlayerButton.addEventListener("click", showAudioPlayer);
+
         if (layoutManager.mobile) {
             initHeadRoom(skinHeader);
         }
+        events.on(playbackManager, 'playbackstart', onPlaybackStart);
+        events.on(playbackManager, 'playbackstop', onPlaybackStop);
+    }
+
+    function onPlaybackStart(e) {
+        if (playbackManager.isPlayingAudio() && layoutManager.tv) {
+            headerAudioPlayerButton.classList.remove("hide");
+        } else {
+            headerAudioPlayerButton.classList.add("hide");
+        }
+    }
+
+    function onPlaybackStop(e, stopInfo) {
+        if (stopInfo.nextMediaType != 'Audio') {
+            headerAudioPlayerButton.classList.add("hide");
+        }
     }
 
     function onCastButtonClicked() {
@@ -205,7 +229,7 @@ define(["dom", "layoutManager", "inputManager", "connectionManager", "events", "
             html += globalize.translate("HeaderAdmin");
             html += "</h3>";
             html += '<a is="emby-linkbutton" class="navMenuOption lnkMediaFolder lnkManageServer" data-itemid="dashboard" href="dashboard.html"><i class="material-icons navMenuOptionIcon">dashboard</i><span class="navMenuOptionText">' + globalize.translate("TabDashboard") + "</span></a>";
-            html += '<a is="emby-linkbutton" class="navMenuOption lnkMediaFolder editorViewMenu" data-itemid="editor" href="edititemmetadata.html"><i class="material-icons navMenuOptionIcon">mode_edit</i><span class="navMenuOptionText">' + globalize.translate("Metadata") + "</span></a>";
+            html += '<a is="emby-linkbutton" class="navMenuOption lnkMediaFolder editorViewMenu" data-itemid="editor" href="edititemmetadata.html"><i class="material-icons navMenuOptionIcon mode_edit"></i><span class="navMenuOptionText">' + globalize.translate("Metadata") + "</span></a>";
             html += "</div>";
         }
 
@@ -219,7 +243,7 @@ define(["dom", "layoutManager", "inputManager", "connectionManager", "events", "
                 html += '<a is="emby-linkbutton" class="navMenuOption lnkMediaFolder" data-itemid="selectserver" href="selectserver.html?showuser=1"><i class="material-icons navMenuOptionIcon">wifi</i><span class="navMenuOptionText">' + globalize.translate("ButtonSelectServer") + "</span></a>";
             }
 
-            html += '<a is="emby-linkbutton" class="navMenuOption lnkMediaFolder btnLogout" data-itemid="logout" href="#"><i class="material-icons navMenuOptionIcon">exit_to_app</i><span class="navMenuOptionText">' + globalize.translate("ButtonSignOut") + "</span></a>";
+            html += '<a is="emby-linkbutton" class="navMenuOption lnkMediaFolder btnLogout" data-itemid="logout" href="#"><i class="material-icons navMenuOptionIcon exit_to_app"></i><span class="navMenuOptionText">' + globalize.translate("ButtonSignOut") + "</span></a>";
             html += "</div>";
         }
 
@@ -763,6 +787,7 @@ define(["dom", "layoutManager", "inputManager", "connectionManager", "events", "
     var currentUser;
     var headerCastButton;
     var headerSearchButton;
+    var headerAudioPlayerButton;
     var enableLibraryNavDrawer = !layoutManager.tv;
     var skinHeader = document.querySelector(".skinHeader");
     var requiresUserRefresh = true;

src/scripts/livetvcomponents.js

@@ -34,7 +34,7 @@ define(["layoutManager", "datetime", "cardBuilder", "apphost"], function (layout
                         day: "numeric"
                     });
                 } catch (err) {
-                    console.log("Error parsing premiereDate:" + item.StartDate + "; error: " + err);
+                    console.error("error parsing premiereDate:" + item.StartDate + "; error: " + err);
                 }
             }
 

src/scripts/routes.js

@@ -16,12 +16,12 @@ define([
 
     function defineRoute(newRoute) {
         var path = newRoute.path;
-        console.log("defining route: " + path);
+        console.debug("defining route: " + path);
         newRoute.dictionary = "core";
         Emby.Page.addRoute(path, newRoute);
     }
 
-    console.log("defining core routes");
+    console.debug("defining core routes");
 
     defineRoute({
         path: "/addplugin.html",