Merge branch 'master' into migrate-to-ES6-46

.editorconfig

@@ -8,5 +8,5 @@ trim_trailing_whitespace = true
 insert_final_newline = true
 end_of_line = lf
 
-[json]
+[*.json]
 indent_size = 2

.eslintrc.js

@@ -1,6 +1,7 @@
 module.exports = {
     root: true,
     plugins: [
+        '@babel',
         'promise',
         'import',
         'eslint-comments'
@@ -28,7 +29,7 @@ module.exports = {
     ],
     rules: {
         'block-spacing': ['error'],
-        'brace-style': ['error', "1tbs", { "allowSingleLine": true }],
+        'brace-style': ['error', '1tbs', { 'allowSingleLine': true }],
         'comma-dangle': ['error', 'never'],
         'comma-spacing': ['error'],
         'eol-last': ['error'],
@@ -40,20 +41,21 @@ module.exports = {
         'no-multiple-empty-lines': ['error', { 'max': 1 }],
         'no-trailing-spaces': ['error'],
         'no-unused-expressions': ['error', { 'allowShortCircuit': true, 'allowTernary': true, 'allowTaggedTemplates': true }],
-        "no-unused-vars": ["error", { "vars": "all", "args": "none", "ignoreRestSiblings": true }],
+        'no-unused-vars': ['error', { 'vars': 'all', 'args': 'none', 'ignoreRestSiblings': true }],
         'one-var': ['error', 'never'],
         'padded-blocks': ['error', 'never'],
         'quotes': ['error', 'single', { 'avoidEscape': true, 'allowTemplateLiterals': false }],
         'semi': ['error'],
         'space-before-blocks': ['error'],
-        'space-infix-ops': 'error'
+        'space-infix-ops': 'error',
+        'yoda': 'error'
     },
     overrides: [
         {
             files: [
                 './src/**/*.js'
             ],
-            parser: 'babel-eslint',
+            parser: '@babel/eslint-parser',
             env: {
                 node: false,
                 amd: true,

CONTRIBUTORS.md

@@ -35,7 +35,9 @@
  - [Thibault Nocchi](https://github.com/ThibaultNocchi)
  - [MrTimscampi](https://github.com/MrTimscampi)
  - [Sarab Singh](https://github.com/sarab97)
+ - [GuilhermeHideki](https://github.com/GuilhermeHideki)
  - [Andrei Oanca](https://github.com/OancaAndrei)
+ - [Cromefire_](https://github.com/cromefire)
 
 # Emby Contributors
 

package.json

@@ -5,21 +5,22 @@
   "repository": "https://github.com/jellyfin/jellyfin-web",
   "license": "GPL-2.0-or-later",
   "devDependencies": {
-    "@babel/core": "^7.10.5",
+    "@babel/core": "^7.11.0",
+    "@babel/eslint-parser": "^7.11.0",
+    "@babel/eslint-plugin": "^7.11.0",
     "@babel/plugin-proposal-class-properties": "^7.10.1",
     "@babel/plugin-proposal-private-methods": "^7.10.1",
     "@babel/plugin-transform-modules-amd": "^7.10.5",
     "@babel/polyfill": "^7.8.7",
-    "@babel/preset-env": "^7.10.3",
+    "@babel/preset-env": "^7.11.0",
-    "autoprefixer": "^9.8.5",
+    "autoprefixer": "^9.8.6",
-    "babel-eslint": "^11.0.0-beta.2",
     "babel-loader": "^8.0.6",
     "browser-sync": "^2.26.12",
     "copy-webpack-plugin": "^5.1.1",
-    "css-loader": "^4.0.0",
+    "css-loader": "^4.2.0",
     "cssnano": "^4.1.10",
     "del": "^5.1.0",
-    "eslint": "^6.8.0",
+    "eslint": "^7.6.0",
     "eslint-plugin-compat": "^3.5.1",
     "eslint-plugin-eslint-comments": "^3.2.0",
     "eslint-plugin-import": "^2.21.2",
@@ -37,7 +38,7 @@
     "gulp-postcss": "^8.0.0",
     "gulp-sass": "^4.0.2",
     "gulp-sourcemaps": "^2.6.5",
-    "gulp-terser": "^1.2.1",
+    "gulp-terser": "^1.3.0",
     "html-webpack-plugin": "^4.3.0",
     "lazypipe": "^1.0.2",
     "node-sass": "^4.13.1",
@@ -48,7 +49,7 @@
     "stylelint-config-rational-order": "^0.1.2",
     "stylelint-no-browser-hacks": "^1.2.1",
     "stylelint-order": "^4.1.0",
-    "webpack": "^4.44.0",
+    "webpack": "^4.44.1",
     "webpack-merge": "^4.2.2",
     "webpack-stream": "^5.2.1"
   },
@@ -62,7 +63,7 @@
     "fast-text-encoding": "^1.0.3",
     "flv.js": "^1.5.0",
     "headroom.js": "^0.11.0",
-    "hls.js": "^0.14.6",
+    "hls.js": "^0.14.7",
     "howler": "^2.2.0",
     "intersection-observer": "^0.11.0",
     "jellyfin-apiclient": "^1.4.1",
@@ -106,6 +107,7 @@
           "src/components/dialogHelper/dialogHelper.js",
           "src/components/directorybrowser/directorybrowser.js",
           "src/components/displaySettings/displaySettings.js",
+          "src/components/favoriteitems.js",
           "src/components/fetchhelper.js",
           "src/components/filterdialog/filterdialog.js",
           "src/components/groupedcards.js",
@@ -119,11 +121,13 @@
           "src/components/imageUploader/imageUploader.js",
           "src/components/indicators/indicators.js",
           "src/components/itemContextMenu.js",
+          "src/components/itemHelper.js",
           "src/components/itemidentifier/itemidentifier.js",
           "src/components/itemMediaInfo/itemMediaInfo.js",
           "src/components/lazyLoader/lazyLoaderIntersectionObserver.js",
           "src/components/libraryoptionseditor/libraryoptionseditor.js",
           "src/components/listview/listview.js",
+          "src/components/loading/loading.js",
           "src/components/maintabsmanager.js",
           "src/components/mediainfo/mediainfo.js",
           "src/components/mediaLibraryCreator/mediaLibraryCreator.js",
@@ -136,9 +140,11 @@
           "src/components/playback/mediasession.js",
           "src/components/playback/nowplayinghelper.js",
           "src/components/playback/playbackorientation.js",
+          "src/components/playback/playbackmanager.js",
           "src/components/playback/playerSelectionMenu.js",
           "src/components/playback/playersettingsmenu.js",
           "src/components/playback/playmethodhelper.js",
+          "src/components/playback/playqueuemanager.js",
           "src/components/playback/remotecontrolautoplay.js",
           "src/components/playback/volumeosd.js",
           "src/components/playbackSettings/playbackSettings.js",
@@ -146,8 +152,10 @@
           "src/components/playlisteditor/playlisteditor.js",
           "src/components/playmenu.js",
           "src/components/prompt/prompt.js",
+          "src/components/refreshdialog/refreshdialog.js",
           "src/components/sanatizefilename.js",
           "src/components/scrollManager.js",
+          "src/plugins/htmlVideoPlayer/plugin.js",
           "src/components/search/searchfields.js",
           "src/components/search/searchresults.js",
           "src/components/settingshelper.js",
@@ -159,6 +167,9 @@
           "src/components/syncPlay/syncPlayManager.js",
           "src/components/syncPlay/timeSyncManager.js",
           "src/components/tabbedview/tabbedview.js",
+          "src/components/toast/toast.js",
+          "src/components/upnextdialog/upnextdialog.js",
+          "src/components/viewContainer.js",
           "src/controllers/session/addServer/index.js",
           "src/controllers/session/forgotPassword/index.js",
           "src/controllers/session/redeemPassword/index.js",
@@ -175,10 +186,18 @@
           "src/controllers/dashboard/general.js",
           "src/controllers/dashboard/librarydisplay.js",
           "src/controllers/dashboard/logs.js",
+          "src/controllers/music/musicalbums.js",
+          "src/controllers/music/musicartists.js",
+          "src/controllers/music/musicgenres.js",
+          "src/controllers/music/musicplaylists.js",
+          "src/controllers/music/musicrecommended.js",
+          "src/controllers/music/songs.js",
           "src/controllers/dashboard/mediaLibrary.js",
           "src/controllers/dashboard/metadataImages.js",
           "src/controllers/dashboard/metadatanfo.js",
           "src/controllers/dashboard/networking.js",
+          "src/controllers/dashboard/notifications/notification.js",
+          "src/controllers/dashboard/notifications/notifications.js",
           "src/controllers/dashboard/playback.js",
           "src/controllers/dashboard/plugins/repositories/index.js",
           "src/controllers/dashboard/scheduledtasks/scheduledtask.js",
@@ -192,9 +211,19 @@
           "src/controllers/dashboard/users/userpasswordpage.js",
           "src/controllers/dashboard/users/userprofilespage.js",
           "src/controllers/home.js",
+          "src/controllers/edititemmetadata.js",
+          "src/controllers/favorites.js",
+          "src/controllers/hometab.js",
+          "src/controllers/playback/nowplaying.js",
+          "src/controllers/playback/videoosd.js",
+          "src/controllers/itemDetails/index.js",
           "src/controllers/playback/queue/index.js",
           "src/controllers/playback/video/index.js",
           "src/controllers/searchpage.js",
+          "src/controllers/livetvtuner.js",
+          "src/controllers/livetvstatus.js",
+          "src/controllers/livetvguideprovider.js",
+          "src/controllers/livetvsettings.js",
           "src/controllers/shows/episodes.js",
           "src/controllers/shows/tvgenres.js",
           "src/controllers/shows/tvlatest.js",
@@ -208,7 +237,6 @@
           "src/controllers/user/playback/index.js",
           "src/controllers/user/profile/index.js",
           "src/controllers/user/subtitles/index.js",
-          "src/controllers/user/subtitles/index.js",
           "src/controllers/wizard/finish/index.js",
           "src/controllers/wizard/remote/index.js",
           "src/controllers/wizard/settings/index.js",
@@ -241,6 +269,7 @@
           "src/plugins/youtubePlayer/plugin.js",
           "src/scripts/alphanumericshortcuts.js",
           "src/scripts/autoBackdrops.js",
+          "src/scripts/browser.js",
           "src/scripts/datetime.js",
           "src/scripts/deleteHelper.js",
           "src/scripts/dfnshelper.js",
@@ -251,11 +280,15 @@
           "src/scripts/globalize.js",
           "src/scripts/imagehelper.js",
           "src/scripts/inputManager.js",
+          "src/scripts/autoThemes.js",
+          "src/scripts/themeManager.js",
           "src/scripts/keyboardNavigation.js",
           "src/scripts/libraryMenu.js",
           "src/scripts/libraryBrowser.js",
+          "src/scripts/mouseManager.js",
           "src/scripts/multiDownload.js",
           "src/scripts/playlists.js",
+          "src/scripts/routes.js",
           "src/scripts/settings/appSettings.js",
           "src/scripts/settings/userSettings.js",
           "src/scripts/settings/webSettings.js",

scripts/duplicates.py

@@ -0,0 +1,33 @@
+import sys
+import os
+import json
+
+# load every string in the source language
+# print all duplicate values to a file
+
+cwd = os.getcwd()
+source = cwd + '/../src/strings/en-us.json'
+
+reverse = {}
+duplicates = {}
+
+with open(source) as en:
+    strings = json.load(en)
+    for key, value in strings.items():
+        if value not in reverse:
+            reverse[value] = [key]
+        else:
+            reverse[value].append(key)
+
+for key, value in reverse.items():
+    if len(value) > 1:
+        duplicates[key] = value
+
+print('LENGTH: ' + str(len(duplicates)))
+with open('duplicates.txt', 'w') as out:
+    for item in duplicates:
+      out.write(json.dumps(item) + ': ')
+      out.write(json.dumps(duplicates[item]) + '\n')
+    out.close()
+
+print('DONE')

scripts/remove.py

@@ -11,7 +11,7 @@ langlst = os.listdir(langdir)
 
 keys = []
 
-with open('scout.txt', 'r') as f:
+with open('unused.txt', 'r') as f:
     for line in f:
         keys.append(line.strip('\n'))
 

src/assets/css/librarybrowser.css

@@ -646,7 +646,7 @@
 .layout-desktop .detailRibbon,
 .layout-tv .detailRibbon {
     margin-top: -7.2em;
-    height: 7.18em;
+    height: 7.2em;
 }
 
 .layout-desktop .noBackdrop .detailRibbon,

src/components/accessSchedule/accessSchedule.js

@@ -49,7 +49,7 @@ import 'formDialogStyle';
         };
 
         if (parseFloat(updatedSchedule.StartHour) >= parseFloat(updatedSchedule.EndHour)) {
-            return void alert(globalize.translate('ErrorMessageStartHourGreaterThanEnd'));
+            return void alert(globalize.translate('ErrorStartHourGreaterThanEnd'));
         }
 
         context.submitted = true;

src/components/activitylog.js

@@ -16,7 +16,7 @@ import 'listViewStyle';
         let color = '#00a4dc';
         let icon = 'notifications';
 
-        if ('Error' == entry.Severity || 'Fatal' == entry.Severity || 'Warn' == entry.Severity) {
+        if (entry.Severity == 'Error' || entry.Severity == 'Fatal' || entry.Severity == 'Warn') {
             color = '#cc0000';
             icon = 'notification_important';
         }
@@ -60,13 +60,13 @@ import 'listViewStyle';
     }
 
     function reloadData(instance, elem, apiClient, startIndex, limit) {
-        if (null == startIndex) {
+        if (startIndex == null) {
             startIndex = parseInt(elem.getAttribute('data-activitystartindex') || '0');
         }
 
         limit = limit || parseInt(elem.getAttribute('data-activitylimit') || '7');
         const minDate = new Date();
-        const hasUserId = 'false' !== elem.getAttribute('data-useractivity');
+        const hasUserId = elem.getAttribute('data-useractivity') !== 'false';
 
         // TODO: Use date-fns
         if (hasUserId) {

src/components/appRouter.js

@@ -1,6 +1,9 @@
 define(['loading', 'globalize', 'events', 'viewManager', 'skinManager', 'backdrop', 'browser', 'page', 'appSettings', 'apphost', 'connectionManager'], function (loading, globalize, events, viewManager, skinManager, backdrop, browser, page, appSettings, appHost, connectionManager) {
     'use strict';
 
+    browser = browser.default || browser;
+    loading = loading.default || loading;
+
     var appRouter = {
         showLocalLogin: function (serverId, manualLogin) {
             var pageName = manualLogin ? 'manuallogin' : 'login';
@@ -34,7 +37,7 @@ define(['loading', 'globalize', 'events', 'viewManager', 'skinManager', 'backdro
         switch (result.State) {
             case 'SignedIn':
                 loading.hide();
-                skinManager.loadUserSkin();
+                Emby.Page.goHome();
                 break;
             case 'ServerSignIn':
                 result.ApiClient.getPublicUsers().then(function (users) {
@@ -147,7 +150,6 @@ define(['loading', 'globalize', 'events', 'viewManager', 'skinManager', 'backdro
             if (typeof route.path === 'string') {
                 loadContentUrl(ctx, next, route, currentRequest);
             } else {
-                // ? TODO
                 next();
             }
         };
@@ -231,8 +233,7 @@ define(['loading', 'globalize', 'events', 'viewManager', 'skinManager', 'backdro
                 max /= 8;
                 max *= 1000000;
                 max *= 0.7;
-                max = parseInt(max);
+                return parseInt(max, 10);
-                return max;
             }
         }
         /* eslint-enable compat/compat */
@@ -286,12 +287,9 @@ define(['loading', 'globalize', 'events', 'viewManager', 'skinManager', 'backdro
 
         connectionManager.connect({
             enableAutoLogin: appSettings.enableAutoLogin()
-
         }).then(function (result) {
             firstConnectionResult = result;
-
             options = options || {};
-
             page({
                 click: options.click !== false,
                 hashbang: options.hashbang !== false
@@ -343,7 +341,7 @@ define(['loading', 'globalize', 'events', 'viewManager', 'skinManager', 'backdro
 
             if (route.isDefaultRoute) {
                 console.debug('appRouter - loading skin home page');
-                loadUserSkinWithOptions(ctx);
+                Emby.Page.goHome();
                 return;
             } else if (route.roles) {
                 validateRoles(apiClient, route.roles).then(function () {
@@ -357,15 +355,6 @@ define(['loading', 'globalize', 'events', 'viewManager', 'skinManager', 'backdro
         callback();
     }
 
-    function loadUserSkinWithOptions(ctx) {
-        require(['queryString'], function (queryString) {
-            var params = queryString.parse(ctx.querystring);
-            skinManager.loadUserSkin({
-                start: params.start
-            });
-        });
-    }
-
     function validateRoles(apiClient, roles) {
         return Promise.all(roles.split(',').map(function (role) {
             return validateRole(apiClient, role);

src/components/apphost.js

@@ -1,6 +1,8 @@
 define(['appSettings', 'browser', 'events', 'htmlMediaHelper', 'webSettings', 'globalize'], function (appSettings, browser, events, htmlMediaHelper, webSettings, globalize) {
     'use strict';
 
+    browser = browser.default || browser;
+
     function getBaseProfileOptions(item) {
         var disableHlsVideoAudioCodecs = [];
 
@@ -47,7 +49,7 @@ define(['appSettings', 'browser', 'events', 'htmlMediaHelper', 'webSettings', 'g
                     profile = window.NativeShell.AppHost.getDeviceProfile(profileBuilder);
                 } else {
                     var builderOpts = getBaseProfileOptions(item);
-                    builderOpts.enableSsaRender = (item && !options.isRetry && 'allcomplexformats' !== appSettings.get('subtitleburnin'));
+                    builderOpts.enableSsaRender = (item && !options.isRetry && appSettings.get('subtitleburnin') !== 'allcomplexformats');
                     profile = profileBuilder(builderOpts);
                 }
 
@@ -277,7 +279,7 @@ define(['appSettings', 'browser', 'events', 'htmlMediaHelper', 'webSettings', 'g
         features.push('targetblank');
         features.push('screensaver');
 
-        webSettings.enableMultiServer().then(enabled => {
+        webSettings.getMultiServer().then(enabled => {
             if (enabled) features.push('multiserver');
         });
 
@@ -370,7 +372,7 @@ define(['appSettings', 'browser', 'events', 'htmlMediaHelper', 'webSettings', 'g
                 return window.NativeShell.AppHost.supports(command);
             }
 
-            return -1 !== supportedFeatures.indexOf(command.toLowerCase());
+            return supportedFeatures.indexOf(command.toLowerCase()) !== -1;
         },
         preferVisualCards: browser.android || browser.chrome,
         getSyncProfile: getSyncProfile,
@@ -407,13 +409,6 @@ define(['appSettings', 'browser', 'events', 'htmlMediaHelper', 'webSettings', 'g
         getPushTokenInfo: function () {
             return {};
         },
-        setThemeColor: function (color) {
-            var metaThemeColor = document.querySelector('meta[name=theme-color]');
-
-            if (metaThemeColor) {
-                metaThemeColor.setAttribute('content', color);
-            }
-        },
         setUserScalable: function (scalable) {
             if (!browser.tv) {
                 var att = scalable ? 'width=device-width, initial-scale=1, minimum-scale=1, user-scalable=yes' : 'width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no';

src/components/cardbuilder/cardBuilder.js

@@ -277,7 +277,7 @@ import 'programStyles';
          */
         function getImageWidth(shape, screenWidth, isOrientationLandscape) {
             const imagesPerRow = getPostersPerRow(shape, screenWidth, isOrientationLandscape);
-            return Math.round(screenWidth / imagesPerRow) * 2;
+            return Math.round(screenWidth / imagesPerRow);
         }
 
         /**

src/components/cardbuilder/chaptercardbuilder.js

@@ -73,7 +73,7 @@ import browser from 'browser';
         if (ImageTag) {
             return apiClient.getScaledImageUrl(Id, {
 
-                maxWidth: maxWidth * 2,
+                maxWidth: maxWidth,
                 tag: ImageTag,
                 type: 'Chapter',
                 index
@@ -104,9 +104,7 @@ import browser from 'browser';
         const cardBoxCssClass = 'cardBox';
         const cardScalableClass = 'cardScalable';
 
-        const html = `<button type="button" class="${className}"${dataAttributes}><div class="${cardBoxCssClass}"><div class="${cardScalableClass}"><div class="cardPadder-${shape}"></div>${cardImageContainer}</div><div class="innerCardFooter">${nameHtml}</div></div></div></button>`;
+        return `<button type="button" class="${className}"${dataAttributes}><div class="${cardBoxCssClass}"><div class="${cardScalableClass}"><div class="cardPadder-${shape}"></div>${cardImageContainer}</div><div class="innerCardFooter">${nameHtml}</div></div></div></button>`;
-
-        return html;
     }
 
     export function buildChapterCards(item, chapters, options) {

src/components/displaySettings/displaySettings.js

@@ -1,6 +1,5 @@
 import browser from 'browser';
 import layoutManager from 'layoutManager';
-import appSettings from 'appSettings';
 import pluginManager from 'pluginManager';
 import appHost from 'apphost';
 import focusManager from 'focusManager';
@@ -16,17 +15,22 @@ import 'emby-button';
 
 /* eslint-disable indent */
 
-    function fillThemes(select, isDashboard) {
+    function fillThemes(context, userSettings) {
-        select.innerHTML = skinManager.getThemes().map(t => {
+        const select = context.querySelector('#selectTheme');
-            let value = t.id;
-            if (t.isDefault && !isDashboard) {
-                value = '';
-            } else if (t.isDefaultServerDashboard && isDashboard) {
-                value = '';
-            }
 
-            return `<option value="${value}">${t.name}</option>`;
+        skinManager.getThemes().then(themes => {
+            select.innerHTML = themes.map(t => {
+                return `<option value="${t.id}">${t.name}</option>`;
             }).join('');
+
+            // get default theme
+            var defaultTheme = themes.find(theme => {
+                return theme.default;
+            });
+
+            // set the current theme
+            select.value = userSettings.theme() || defaultTheme.id;
+        });
     }
 
     function loadScreensavers(context, userSettings) {
@@ -46,6 +50,7 @@ import 'emby-button';
         selectScreensaver.innerHTML = options.map(o => {
             return `<option value="${o.value}">${o.name}</option>`;
         }).join('');
+
         selectScreensaver.value = userSettings.screensaver();
 
         if (!selectScreensaver.value) {
@@ -54,57 +59,6 @@ import 'emby-button';
         }
     }
 
-    function loadSoundEffects(context, userSettings) {
-        const selectSoundEffects = context.querySelector('.selectSoundEffects');
-        const options = pluginManager.ofType('soundeffects').map(plugin => {
-            return {
-                name: plugin.name,
-                value: plugin.id
-            };
-        });
-
-        options.unshift({
-            name: globalize.translate('None'),
-            value: 'none'
-        });
-
-        selectSoundEffects.innerHTML = options.map(o => {
-            return `<option value="${o.value}">${o.name}</option>`;
-        }).join('');
-        selectSoundEffects.value = userSettings.soundEffects();
-
-        if (!selectSoundEffects.value) {
-            // TODO: set the default instead of none
-            selectSoundEffects.value = 'none';
-        }
-    }
-
-    function loadSkins(context, userSettings) {
-        const selectSkin = context.querySelector('.selectSkin');
-
-        const options = pluginManager.ofType('skin').map(plugin => {
-            return {
-                name: plugin.name,
-                value: plugin.id
-            };
-        });
-
-        selectSkin.innerHTML = options.map(o => {
-            return `<option value="${o.value}">${o.name}</option>`;
-        }).join('');
-        selectSkin.value = userSettings.skin();
-
-        if (!selectSkin.value && options.length) {
-            selectSkin.value = options[0].value;
-        }
-
-        if (options.length > 1 && appHost.supports('skins')) {
-            context.querySelector('.selectSkinContainer').classList.remove('hide');
-        } else {
-            context.querySelector('.selectSkinContainer').classList.add('hide');
-        }
-    }
-
     function showOrHideMissingEpisodesField(context) {
         if (browser.tizen || browser.web0s) {
             context.querySelector('.fldDisplayMissingEpisodes').classList.add('hide');
@@ -115,12 +69,6 @@ import 'emby-button';
     }
 
     function loadForm(context, user, userSettings) {
-        if (user.Policy.IsAdministrator) {
-            context.querySelector('.selectDashboardThemeContainer').classList.remove('hide');
-        } else {
-            context.querySelector('.selectDashboardThemeContainer').classList.add('hide');
-        }
-
         if (appHost.supports('displaylanguage')) {
             context.querySelector('.languageSection').classList.remove('hide');
         } else {
@@ -139,18 +87,6 @@ import 'emby-button';
             context.querySelector('.learnHowToContributeContainer').classList.add('hide');
         }
 
-        if (appHost.supports('runatstartup')) {
-            context.querySelector('.fldAutorun').classList.remove('hide');
-        } else {
-            context.querySelector('.fldAutorun').classList.add('hide');
-        }
-
-        if (appHost.supports('soundeffects')) {
-            context.querySelector('.fldSoundEffects').classList.remove('hide');
-        } else {
-            context.querySelector('.fldSoundEffects').classList.add('hide');
-        }
-
         if (appHost.supports('screensaver')) {
             context.querySelector('.selectScreensaverContainer').classList.remove('hide');
         } else {
@@ -173,16 +109,8 @@ import 'emby-button';
             context.querySelector('.fldThemeVideo').classList.add('hide');
         }
 
-        context.querySelector('.chkRunAtStartup').checked = appSettings.runAtStartup();
+        fillThemes(context, userSettings);
-
-        const selectTheme = context.querySelector('#selectTheme');
-        const selectDashboardTheme = context.querySelector('#selectDashboardTheme');
-
-        fillThemes(selectTheme);
-        fillThemes(selectDashboardTheme, true);
         loadScreensavers(context, userSettings);
-        loadSoundEffects(context, userSettings);
-        loadSkins(context, userSettings);
 
         context.querySelector('.chkDisplayMissingEpisodes').checked = user.Configuration.DisplayMissingEpisodes || false;
 
@@ -198,9 +126,6 @@ import 'emby-button';
 
         context.querySelector('#txtLibraryPageSize').value = userSettings.libraryPageSize();
 
-        selectDashboardTheme.value = userSettings.dashboardTheme() || '';
-        selectTheme.value = userSettings.theme() || '';
-
         context.querySelector('.selectLayout').value = layoutManager.getSavedLayout() || '';
 
         showOrHideMissingEpisodesField(context);
@@ -209,8 +134,6 @@ import 'emby-button';
     }
 
     function saveUser(context, user, userSettingsInstance, apiClient) {
-        appSettings.runAtStartup(context.querySelector('.chkRunAtStartup').checked);
-
         user.Configuration.DisplayMissingEpisodes = context.querySelector('.chkDisplayMissingEpisodes').checked;
 
         if (appHost.supports('displaylanguage')) {
@@ -221,15 +144,11 @@ import 'emby-button';
 
         userSettingsInstance.enableThemeSongs(context.querySelector('#chkThemeSong').checked);
         userSettingsInstance.enableThemeVideos(context.querySelector('#chkThemeVideo').checked);
-        userSettingsInstance.dashboardTheme(context.querySelector('#selectDashboardTheme').value);
         userSettingsInstance.theme(context.querySelector('#selectTheme').value);
-        userSettingsInstance.soundEffects(context.querySelector('.selectSoundEffects').value);
         userSettingsInstance.screensaver(context.querySelector('.selectScreensaver').value);
 
         userSettingsInstance.libraryPageSize(context.querySelector('#txtLibraryPageSize').value);
 
-        userSettingsInstance.skin(context.querySelector('.selectSkin').value);
-
         userSettingsInstance.enableFastFadein(context.querySelector('#chkFadein').checked);
         userSettingsInstance.enableBlurhash(context.querySelector('#chkBlurhash').checked);
         userSettingsInstance.enableBackdrops(context.querySelector('#chkBackdrops').checked);

src/components/displaySettings/displaySettings.template.html

@@ -1,5 +1,4 @@
 <form style="margin: 0 auto;">
-
     <h2 class="sectionTitle">
         ${Display}
     </h2>
@@ -123,26 +122,14 @@
         <div class="fieldDescription">${LabelPleaseRestart}</div>
     </div>
 
-    <div class="selectContainer hide selectSkinContainer">
-        <select is="emby-select" class="selectSkin" label="${LabelSkin}"></select>
-    </div>
-
     <div class="selectContainer">
         <select id="selectTheme" is="emby-select" label="${LabelTheme}"></select>
     </div>
 
-    <div class="selectContainer selectDashboardThemeContainer hide">
-        <select id="selectDashboardTheme" is="emby-select" label="${LabelDashboardTheme}"></select>
-    </div>
-
     <div class="selectContainer hide selectScreensaverContainer">
         <select is="emby-select" class="selectScreensaver" label="${LabelScreensaver}"></select>
     </div>
 
-    <div class="selectContainer fldSoundEffects hide">
-        <select is="emby-select" class="selectSoundEffects" label="${LabelSoundEffects}"></select>
-    </div>
-
     <div class="inputContainer inputContainer-withDescription">
         <input is="emby-input" type="number" id="txtLibraryPageSize" pattern="[0-9]*" required="required" min="0" max="1000" step="1" label="${LabelLibraryPageSize}" />
         <div class="fieldDescription">${LabelLibraryPageSizeHelp}</div>
@@ -159,9 +146,9 @@
     <div class="checkboxContainer checkboxContainer-withDescription">
         <label>
             <input type="checkbox" is="emby-checkbox" id="chkBlurhash" />
-            <span>${EnableBlurhash}</span>
+            <span>${EnableBlurHash}</span>
         </label>
-        <div class="fieldDescription checkboxFieldDescription">${EnableBlurhashHelp}</div>
+        <div class="fieldDescription checkboxFieldDescription">${EnableBlurHashHelp}</div>
     </div>
 
     <div class="checkboxContainer checkboxContainer-withDescription">
@@ -196,13 +183,6 @@
         <div class="fieldDescription checkboxFieldDescription">${EnableThemeVideosHelp}</div>
     </div>
 
-    <div class="checkboxContainer hide fldAutorun">
-        <label>
-            <input type="checkbox" is="emby-checkbox" class="chkRunAtStartup" />
-            <span>${RunAtStartup}</span>
-        </label>
-    </div>
-
     <div class="checkboxContainer checkboxContainer-withDescription fldDisplayMissingEpisodes hide">
         <label>
             <input type="checkbox" is="emby-checkbox" class="chkDisplayMissingEpisodes" />

src/components/favoriteitems.js

@@ -1,5 +1,14 @@
-define(['loading', 'libraryBrowser', 'cardBuilder', 'dom', 'apphost', 'imageLoader', 'globalize', 'layoutManager', 'scrollStyles', 'emby-itemscontainer'], function (loading, libraryBrowser, cardBuilder, dom, appHost, imageLoader, globalize, layoutManager) {
+import loading from 'loading';
-    'use strict';
+import cardBuilder from 'cardBuilder';
+import dom from 'dom';
+import appHost from 'apphost';
+import imageLoader from 'imageLoader';
+import globalize from 'globalize';
+import layoutManager from 'layoutManager';
+import 'scrollStyles';
+import 'emby-itemscontainer';
+
+/* eslint-disable indent */
 
     function enableScrollX() {
         return !layoutManager.desktop;
@@ -94,8 +103,8 @@ define(['loading', 'libraryBrowser', 'cardBuilder', 'dom', 'apphost', 'imageLoad
     }
 
     function loadSection(elem, userId, topParentId, section, isSingleSection) {
-        var screenWidth = dom.getWindowSize().innerWidth;
+        const screenWidth = dom.getWindowSize().innerWidth;
-        var options = {
+        const options = {
             SortBy: 'SortName',
             SortOrder: 'Ascending',
             Filters: 'IsFavorite',
@@ -118,9 +127,9 @@ define(['loading', 'libraryBrowser', 'cardBuilder', 'dom', 'apphost', 'imageLoad
             }
         }
 
-        var promise;
+        let promise;
 
-        if ('MusicArtist' === section.types) {
+        if (section.types === 'MusicArtist') {
             promise = ApiClient.getArtists(userId, options);
         } else {
             options.IncludeItemTypes = section.types;
@@ -128,7 +137,7 @@ define(['loading', 'libraryBrowser', 'cardBuilder', 'dom', 'apphost', 'imageLoad
         }
 
         return promise.then(function (result) {
-            var html = '';
+            let html = '';
 
             if (result.Items.length) {
                 if (html += '<div class="sectionTitleContainer sectionTitleContainer-cards padded-left">', !layoutManager.tv && options.Limit && result.Items.length >= options.Limit) {
@@ -144,7 +153,7 @@ define(['loading', 'libraryBrowser', 'cardBuilder', 'dom', 'apphost', 'imageLoad
 
                 html += '</div>';
                 if (enableScrollX()) {
-                    var scrollXClass = 'scrollX hiddenScrollX';
+                    let scrollXClass = 'scrollX hiddenScrollX';
                     if (layoutManager.tv) {
                         scrollXClass += ' smoothScrollX';
                     }
@@ -154,13 +163,13 @@ define(['loading', 'libraryBrowser', 'cardBuilder', 'dom', 'apphost', 'imageLoad
                     html += '<div is="emby-itemscontainer" class="itemsContainer vertical-wrap padded-left padded-right">';
                 }
 
-                var cardLayout = appHost.preferVisualCards && section.autoCardLayout && section.showTitle;
+                let cardLayout = appHost.preferVisualCards && section.autoCardLayout && section.showTitle;
                 cardLayout = false;
                 html += cardBuilder.getCardsHtml(result.Items, {
                     preferThumb: section.preferThumb,
                     shape: section.shape,
                     centerText: section.centerText && !cardLayout,
-                    overlayText: false !== section.overlayText,
+                    overlayText: section.overlayText !== false,
                     showTitle: section.showTitle,
                     showParentTitle: section.showParentTitle,
                     scalable: true,
@@ -179,10 +188,10 @@ define(['loading', 'libraryBrowser', 'cardBuilder', 'dom', 'apphost', 'imageLoad
         });
     }
 
-    function loadSections(page, userId, topParentId, types) {
+    export function loadSections(page, userId, topParentId, types) {
         loading.show();
-        var sections = getSections();
+        let sections = getSections();
-        var sectionid = getParameterByName('sectionid');
+        const sectionid = getParameterByName('sectionid');
 
         if (sectionid) {
             sections = sections.filter(function (s) {
@@ -192,30 +201,28 @@ define(['loading', 'libraryBrowser', 'cardBuilder', 'dom', 'apphost', 'imageLoad
 
         if (types) {
             sections = sections.filter(function (s) {
-                return -1 !== types.indexOf(s.id);
+                return types.indexOf(s.id) !== -1;
             });
         }
 
-        var i;
+        let elem = page.querySelector('.favoriteSections');
-        var length;
-        var elem = page.querySelector('.favoriteSections');
 
         if (!elem.innerHTML) {
-            var html = '';
+            let html = '';
 
-            for (i = 0, length = sections.length; i < length; i++) {
+            for (let i = 0, length = sections.length; i < length; i++) {
                 html += '<div class="verticalSection section' + sections[i].id + '"></div>';
             }
 
             elem.innerHTML = html;
         }
 
-        var promises = [];
+        const promises = [];
 
-        for (i = 0, length = sections.length; i < length; i++) {
+        for (let i = 0, length = sections.length; i < length; i++) {
-            var section = sections[i];
+            const section = sections[i];
             elem = page.querySelector('.section' + section.id);
-            promises.push(loadSection(elem, userId, topParentId, section, 1 === sections.length));
+            promises.push(loadSection(elem, userId, topParentId, section, sections.length === 1));
         }
 
         Promise.all(promises).then(function () {
@@ -223,7 +230,8 @@ define(['loading', 'libraryBrowser', 'cardBuilder', 'dom', 'apphost', 'imageLoad
         });
     }
 
-    return {
+export default {
     render: loadSections
 };
-});
+
+/* eslint-enable indent */

src/components/groupedcards.js

@@ -21,7 +21,7 @@ import connectionManager from 'connectionManager';
 
         if (!actionableParent || actionableParent.classList.contains('cardContent')) {
             apiClient.getJSON(apiClient.getUrl('Users/' + userId + '/Items/Latest', options)).then(function (items) {
-                if (1 === items.length) {
+                if (items.length === 1) {
                     return void appRouter.showItem(items[0]);
                 }
 

src/components/guide/guide.js

@@ -1,6 +1,10 @@
 define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager', 'scrollHelper', 'serverNotifications', 'loading', 'datetime', 'focusManager', 'playbackManager', 'userSettings', 'imageLoader', 'events', 'layoutManager', 'itemShortcuts', 'dom', 'css!./guide.css', 'programStyles', 'material-icons', 'scrollStyles', 'emby-programcell', 'emby-button', 'paper-icon-button-light', 'emby-tabs', 'emby-scroller', 'flexStyles', 'webcomponents'], function (require, inputManager, browser, globalize, connectionManager, scrollHelper, serverNotifications, loading, datetime, focusManager, playbackManager, userSettings, imageLoader, events, layoutManager, itemShortcuts, dom) {
     'use strict';
 
+    playbackManager = playbackManager.default || playbackManager;
+    browser = browser.default || browser;
+    loading = loading.default || loading;
+
     function showViewSettings(instance) {
         require(['guide-settings-dialog'], function (guideSettingsDialog) {
             guideSettingsDialog.show(instance.categoryOptions).then(function () {

src/components/imageOptionsEditor/imageOptionsEditor.js

@@ -16,7 +16,7 @@ import 'emby-input';
         return {
             Type: type,
             MinWidth: 0,
-            Limit: 'Primary' === type ? 1 : 0
+            Limit: type === 'Primary' ? 1 : 0
         };
     }
 

src/components/imageeditor/imageeditor.js

@@ -59,8 +59,8 @@ import 'css!./imageeditor';
         currentItem = item;
 
         apiClient.getRemoteImageProviders(getBaseRemoteOptions()).then(function (providers) {
-            const btnBrowseAllImages = page.querySelectorAll('.btnBrowseAllImages');
+            var btnBrowseAllImages = page.querySelectorAll('.btnBrowseAllImages');
-            for (let i = 0, length = btnBrowseAllImages.length; i < length; i++) {
+            for (var i = 0, length = btnBrowseAllImages.length; i < length; i++) {
                 if (providers.length) {
                     btnBrowseAllImages[i].classList.remove('hide');
                 } else {
@@ -217,7 +217,7 @@ import 'css!./imageeditor';
             reload(context, null, focusContext);
         }, function () {
             import('alert').then(({default: alert}) => {
-                alert(globalize.translate('DefaultErrorMessage'));
+                alert(globalize.translate('ErrorDefault'));
             });
         });
     }

src/components/images/imageLoader.js

@@ -205,7 +205,7 @@ import 'css!./style';
 
 /* eslint-enable indent */
 export default {
-    serLazyImage: setLazyImage,
+    setLazyImage: setLazyImage,
     fillImages: fillImages,
     fillImage: fillImage,
     lazyImage: lazyImage,

src/components/itemHelper.js

@@ -1,7 +1,7 @@
-define(['apphost', 'globalize'], function (appHost, globalize) {
+import appHost from 'apphost';
-    'use strict';
+import globalize from 'globalize';
 
-    function getDisplayName(item, options = {}) {
+export function getDisplayName(item, options = {}) {
     if (!item) {
         throw new Error('null item passed into getDisplayName');
     }
@@ -10,7 +10,7 @@ define(['apphost', 'globalize'], function (appHost, globalize) {
         item = item.ProgramInfo || item;
     }
 
-        var name = ((item.Type === 'Program' || item.Type === 'Recording') && (item.IsSeries || item.EpisodeTitle) ? item.EpisodeTitle : item.Name) || '';
+    let name = ((item.Type === 'Program' || item.Type === 'Recording') && (item.IsSeries || item.EpisodeTitle) ? item.EpisodeTitle : item.Name) || '';
 
     if (item.Type === 'TvChannel') {
         if (item.ChannelNumber) {
@@ -21,10 +21,10 @@ define(['apphost', 'globalize'], function (appHost, globalize) {
     if (item.Type === 'Episode' && item.ParentIndexNumber === 0) {
         name = globalize.translate('ValueSpecialEpisodeName', name);
     } else if ((item.Type === 'Episode' || item.Type === 'Program') && item.IndexNumber != null && item.ParentIndexNumber != null && options.includeIndexNumber !== false) {
-            var displayIndexNumber = item.IndexNumber;
+        let displayIndexNumber = item.IndexNumber;
 
-            var number = displayIndexNumber;
+        let number = displayIndexNumber;
-            var nameSeparator = ' - ';
+        let nameSeparator = ' - ';
 
         if (options.includeParentInfo !== false) {
             number = 'S' + item.ParentIndexNumber + ':E' + number;
@@ -45,8 +45,8 @@ define(['apphost', 'globalize'], function (appHost, globalize) {
     return name;
 }
 
-    function supportsAddingToCollection(item) {
+export function supportsAddingToCollection(item) {
-        var invalidTypes = ['Genre', 'MusicGenre', 'Studio', 'UserView', 'CollectionFolder', 'Audio', 'Program', 'Timer', 'SeriesTimer'];
+    const invalidTypes = ['Genre', 'MusicGenre', 'Studio', 'UserView', 'CollectionFolder', 'Audio', 'Program', 'Timer', 'SeriesTimer'];
 
     if (item.Type === 'Recording') {
         if (item.Status !== 'Completed') {
@@ -57,7 +57,7 @@ define(['apphost', 'globalize'], function (appHost, globalize) {
     return !item.CollectionType && invalidTypes.indexOf(item.Type) === -1 && item.MediaType !== 'Photo' && !isLocalItem(item);
 }
 
-    function supportsAddingToPlaylist(item) {
+export function supportsAddingToPlaylist(item) {
     if (item.Type === 'Program') {
         return false;
     }
@@ -90,8 +90,8 @@ define(['apphost', 'globalize'], function (appHost, globalize) {
     return item.MediaType || item.IsFolder || item.Type === 'Genre' || item.Type === 'MusicGenre' || item.Type === 'MusicArtist';
 }
 
-    function canEdit(user, item) {
+export function canEdit(user, item) {
-        var itemType = item.Type;
+    const itemType = item.Type;
 
     if (itemType === 'UserRootFolder' || itemType === 'UserView') {
         return false;
@@ -122,7 +122,7 @@ define(['apphost', 'globalize'], function (appHost, globalize) {
     return user.Policy.IsAdministrator;
 }
 
-    function isLocalItem(item) {
+export function isLocalItem(item) {
     if (item && item.Id && item.Id.indexOf('local') === 0) {
         return true;
     }
@@ -130,14 +130,8 @@ define(['apphost', 'globalize'], function (appHost, globalize) {
     return false;
 }
 
-    return {
+export function canIdentify (user, item) {
-        getDisplayName: getDisplayName,
+    const itemType = item.Type;
-        supportsAddingToCollection: supportsAddingToCollection,
-        supportsAddingToPlaylist: supportsAddingToPlaylist,
-        isLocalItem: isLocalItem,
-
-        canIdentify: function (user, item) {
-            var itemType = item.Type;
 
     if (itemType === 'Movie' ||
         itemType === 'Trailer' ||
@@ -156,12 +150,10 @@ define(['apphost', 'globalize'], function (appHost, globalize) {
     }
 
     return false;
-        },
+}
 
-        canEdit: canEdit,
+export function canEditImages (user, item) {
-
+    const itemType = item.Type;
-        canEditImages: function (user, item) {
-            var itemType = item.Type;
 
     if (item.MediaType === 'Photo') {
         return false;
@@ -182,9 +174,9 @@ define(['apphost', 'globalize'], function (appHost, globalize) {
     }
 
     return itemType !== 'Timer' && itemType !== 'SeriesTimer' && canEdit(user, item) && !isLocalItem(item);
-        },
+}
 
-        canSync: function (user, item) {
+export function canSync (user, item) {
     if (user && !user.Policy.EnableContentDownloading) {
         return false;
     }
@@ -194,9 +186,9 @@ define(['apphost', 'globalize'], function (appHost, globalize) {
     }
 
     return item.SupportsSync;
-        },
+}
 
-        canShare: function (item, user) {
+export function canShare (item, user) {
     if (item.Type === 'Program') {
         return false;
     }
@@ -218,13 +210,13 @@ define(['apphost', 'globalize'], function (appHost, globalize) {
         return false;
     }
     return user.Policy.EnablePublicSharing && appHost.supports('sharing');
-        },
+}
 
-        enableDateAddedDisplay: function (item) {
+export function enableDateAddedDisplay (item) {
     return !item.IsFolder && item.MediaType && item.Type !== 'Program' && item.Type !== 'TvChannel' && item.Type !== 'Trailer';
-        },
+}
 
-        canMarkPlayed: function (item) {
+export function canMarkPlayed (item) {
     if (item.Type === 'Program') {
         return false;
     }
@@ -251,9 +243,9 @@ define(['apphost', 'globalize'], function (appHost, globalize) {
     }
 
     return false;
-        },
+}
 
-        canRate: function (item) {
+export function canRate (item) {
     if (item.Type === 'Program'
         || item.Type === 'Timer'
         || item.Type === 'SeriesTimer'
@@ -265,9 +257,9 @@ define(['apphost', 'globalize'], function (appHost, globalize) {
     }
 
     return true;
-        },
+}
 
-        canConvert: function (item, user) {
+export function canConvert (item, user) {
     if (!user.Policy.EnableMediaConversion) {
         return false;
     }
@@ -276,17 +268,17 @@ define(['apphost', 'globalize'], function (appHost, globalize) {
         return false;
     }
 
-            var mediaType = item.MediaType;
+    const mediaType = item.MediaType;
     if (mediaType === 'Book' || mediaType === 'Photo' || mediaType === 'Audio') {
         return false;
     }
 
-            var collectionType = item.CollectionType;
+    const collectionType = item.CollectionType;
     if (collectionType === 'livetv') {
         return false;
     }
 
-            var type = item.Type;
+    const type = item.Type;
     if (type === 'Channel' || type === 'Person' || type === 'Year' || type === 'Program' || type === 'Timer' || type === 'SeriesTimer') {
         return false;
     }
@@ -300,11 +292,11 @@ define(['apphost', 'globalize'], function (appHost, globalize) {
     }
 
     return true;
-        },
+}
 
-        canRefreshMetadata: function (item, user) {
+export function canRefreshMetadata (item, user) {
     if (user.Policy.IsAdministrator) {
-                var collectionType = item.CollectionType;
+        const collectionType = item.CollectionType;
         if (collectionType === 'livetv') {
             return false;
         }
@@ -317,9 +309,9 @@ define(['apphost', 'globalize'], function (appHost, globalize) {
     }
 
     return false;
-        },
+}
 
-        supportsMediaSourceSelection: function (item) {
+export function supportsMediaSourceSelection (item) {
     if (item.MediaType !== 'Video') {
         return false;
     }
@@ -338,5 +330,21 @@ define(['apphost', 'globalize'], function (appHost, globalize) {
 
     return true;
 }
+
+export default {
+    getDisplayName: getDisplayName,
+    supportsAddingToCollection: supportsAddingToCollection,
+    supportsAddingToPlaylist: supportsAddingToPlaylist,
+    isLocalItem: isLocalItem,
+    canIdentify: canIdentify,
+    canEdit: canEdit,
+    canEditImages: canEditImages,
+    canSync: canSync,
+    canShare: canShare,
+    enableDateAddedDisplay: enableDateAddedDisplay,
+    canMarkPlayed: canMarkPlayed,
+    canRate: canRate,
+    canConvert: canConvert,
+    canRefreshMetadata: canRefreshMetadata,
+    supportsMediaSourceSelection: supportsMediaSourceSelection
 };
-});

src/components/itemsrefresher.js

@@ -1,6 +1,8 @@
 define(['playbackManager', 'serverNotifications', 'events'], function (playbackManager, serverNotifications, events) {
     'use strict';
 
+    playbackManager = playbackManager.default || playbackManager;
+
     function onUserDataChanged(e, apiClient, userData) {
         var instance = this;
 

src/components/layoutManager.js

@@ -1,6 +1,8 @@
 define(['browser', 'appSettings', 'events'], function (browser, appSettings, events) {
     'use strict';
 
+    browser = browser.default || browser;
+
     function setLayout(instance, layout, selectedLayout) {
         if (layout === selectedLayout) {
             instance[layout] = true;

src/components/libraryoptionseditor/libraryoptionseditor.js

@@ -219,7 +219,7 @@ import 'emby-input';
         html += '<div class="flex align-items-center" style="margin:1.5em 0 .5em;">';
         html += '<h3 class="checkboxListLabel" style="margin:0;">' + globalize.translate('HeaderTypeImageFetchers', availableTypeOptions.Type) + '</h3>';
         const supportedImageTypes = availableTypeOptions.SupportedImageTypes || [];
-        if (supportedImageTypes.length > 1 || 1 === supportedImageTypes.length && 'Primary' !== supportedImageTypes[0]) {
+        if (supportedImageTypes.length > 1 || supportedImageTypes.length === 1 && supportedImageTypes[0] !== 'Primary') {
             html += '<button is="emby-button" class="raised btnImageOptionsForType" type="button" style="margin-left:1.5em;font-size:90%;"><span>' + globalize.translate('HeaderFetcherSettings') + '</span></button>';
         }
         html += '</div>';
@@ -362,7 +362,7 @@ import 'emby-input';
             TypeOptions: []
         };
         currentAvailableOptions = null;
-        const isNewLibrary = null === libraryOptions;
+        const isNewLibrary = libraryOptions === null;
         isNewLibrary && parent.classList.add('newlibrary');
         const response = await fetch('components/libraryoptionseditor/libraryoptionseditor.template.html');
         const template = await response.text();
@@ -578,7 +578,7 @@ import 'emby-input';
         parent.querySelector('#chkSkipIfAudioTrackPresent').checked = options.SkipSubtitlesIfAudioTrackMatches;
         parent.querySelector('#chkRequirePerfectMatch').checked = options.RequirePerfectSubtitleMatch;
         Array.prototype.forEach.call(parent.querySelectorAll('.chkMetadataSaver'), elem => {
-            elem.checked = options.MetadataSavers ? options.MetadataSavers.includes(elem.getAttribute('data-pluginname')) : 'true' === elem.getAttribute('data-defaultenabled');
+            elem.checked = options.MetadataSavers ? options.MetadataSavers.includes(elem.getAttribute('data-pluginname')) : elem.getAttribute('data-defaultenabled') === 'true';
         });
         Array.prototype.forEach.call(parent.querySelectorAll('.chkSubtitleLanguage'), elem => {
             elem.checked = !!options.SubtitleDownloadLanguages && options.SubtitleDownloadLanguages.includes(elem.getAttribute('data-lang'));

src/components/listview/listview.js

@@ -81,7 +81,7 @@ import 'emby-playstatebutton';
         let itemId;
 
         const options = {
-            maxWidth: width * 2,
+            maxWidth: width,
             type: 'Primary'
         };
 
@@ -108,7 +108,7 @@ import 'emby-playstatebutton';
     function getChannelImageUrl(item, width) {
         const apiClient = connectionManager.getApiClient(item.ServerId);
         const options = {
-            maxWidth: width * 2,
+            maxWidth: width,
             type: 'Primary'
         };
 

src/components/loading/loading.js

@@ -1,17 +1,15 @@
-define(['css!./loading'], function () {
+import 'css!./loading';
-    'use strict';
 
-    var loadingElem;
+let loadingElem;
-    var layer1;
+let layer1;
-    var layer2;
+let layer2;
-    var layer3;
+let layer3;
-    var layer4;
+let layer4;
-    var circleLefts;
+let circleLefts;
-    var circleRights;
+let circleRights;
 
-    return {
+export function show() {
-        show: function () {
+    let elem = loadingElem;
-            var elem = loadingElem;
 
     if (!elem) {
         elem = document.createElement('div');
@@ -40,19 +38,17 @@ define(['css!./loading'], function () {
     layer3.classList.add('mdl-spinner__layer-3-active');
     layer4.classList.add('mdl-spinner__layer-4-active');
 
-            var i;
+    for (let i = 0, length = circleLefts.length; i < length; i++) {
-            var length;
-
-            for (i = 0, length = circleLefts.length; i < length; i++) {
         circleLefts[i].classList.add('mdl-spinner__circleLeft-active');
     }
 
-            for (i = 0, length = circleRights.length; i < length; i++) {
+    for (let i = 0, length = circleRights.length; i < length; i++) {
         circleRights[i].classList.add('mdl-spinner__circleRight-active');
     }
-        },
+}
-        hide: function () {
+
-            var elem = loadingElem;
+export function hide() {
+    const elem = loadingElem;
 
     if (elem) {
         elem.classList.remove('mdlSpinnerActive');
@@ -62,17 +58,17 @@ define(['css!./loading'], function () {
         elem.classList.remove('mdl-spinner__layer-3-active');
         elem.classList.remove('mdl-spinner__layer-4-active');
 
-                var i;
+        for (let i = 0, length = circleLefts.length; i < length; i++) {
-                var length;
-
-                for (i = 0, length = circleLefts.length; i < length; i++) {
             circleLefts[i].classList.remove('mdl-spinner__circleLeft-active');
         }
 
-                for (i = 0, length = circleRights.length; i < length; i++) {
+        for (let i = 0, length = circleRights.length; i < length; i++) {
             circleRights[i].classList.remove('mdl-spinner__circleRight-active');
         }
     }
 }
+
+export default {
+    show: show,
+    hide: hide
 };
-});

src/components/mediaLibraryEditor/mediaLibraryEditor.js

@@ -85,7 +85,7 @@ import 'flexStyles';
                     refreshLibraryFromServer(dom.parentWithClass(button, 'dlg-libraryeditor'));
                 }, () => {
                     import('toast').then(({default: toast}) => {
-                        toast(globalize.translate('DefaultErrorMessage'));
+                        toast(globalize.translate('ErrorDefault'));
                     });
                 });
             });
@@ -98,8 +98,8 @@ import 'flexStyles';
         if (listItem) {
             const index = parseInt(listItem.getAttribute('data-index'));
             const pathInfos = (currentOptions.library.LibraryOptions || {}).PathInfos || [];
-            const pathInfo = null == index ? {} : pathInfos[index] || {};
+            const pathInfo = index == null ? {} : pathInfos[index] || {};
-            const originalPath = pathInfo.Path || (null == index ? null : currentOptions.library.Locations[index]);
+            const originalPath = pathInfo.Path || (index == null ? null : currentOptions.library.Locations[index]);
             const btnRemovePath = dom.parentWithClass(e.target, 'btnRemovePath');
 
             if (btnRemovePath) {
@@ -171,7 +171,7 @@ import 'flexStyles';
             const picker = new directoryBrowser();
             picker.show({
                 enableNetworkSharePath: true,
-                pathReadOnly: null != originalPath,
+                pathReadOnly: originalPath != null,
                 path: originalPath,
                 networkSharePath: networkPath,
                 callback: function (path, networkSharePath) {

src/components/notifications/notifications.js

@@ -1,6 +1,8 @@
 define(['serverNotifications', 'playbackManager', 'events', 'globalize', 'require'], function (serverNotifications, playbackManager, events, globalize, require) {
     'use strict';
 
+    playbackManager = playbackManager.default || playbackManager;
+
     function onOneDocumentClick() {
         document.removeEventListener('click', onOneDocumentClick);
         document.removeEventListener('keydown', onOneDocumentClick);

src/components/playback/playqueuemanager.js

@@ -1,7 +1,6 @@
-define([], function () {
+/*eslint prefer-const: "error"*/
-    'use strict';
 
-    var currentId = 0;
+let currentId = 0;
 function addUniquePlaylistItemId(item) {
     if (!item.PlaylistItemId) {
         item.PlaylistItemId = 'playlistItem' + currentId;
@@ -10,7 +9,7 @@ define([], function () {
 }
 
 function findPlaylistIndex(playlistItemId, list) {
-        for (var i = 0, length = list.length; i < length; i++) {
+    for (let i = 0, length = list.length; i < length; i++) {
         if (list[i].PlaylistItemId === playlistItemId) {
             return i;
         }
@@ -19,38 +18,39 @@ define([], function () {
     return -1;
 }
 
-    function PlayQueueManager() {
+class PlayQueueManager {
+    constructor() {
         this._sortedPlaylist = [];
         this._playlist = [];
         this._repeatMode = 'RepeatNone';
         this._shuffleMode = 'Sorted';
     }
 
-    PlayQueueManager.prototype.getPlaylist = function () {
+    getPlaylist() {
         return this._playlist.slice(0);
-    };
+    }
 
-    PlayQueueManager.prototype.setPlaylist = function (items) {
+    setPlaylist(items) {
         items = items.slice(0);
 
-        for (var i = 0, length = items.length; i < length; i++) {
+        for (let i = 0, length = items.length; i < length; i++) {
             addUniquePlaylistItemId(items[i]);
         }
 
         this._currentPlaylistItemId = null;
         this._playlist = items;
         this._repeatMode = 'RepeatNone';
-    };
+    }
 
-    PlayQueueManager.prototype.queue = function (items) {
+    queue(items) {
-        for (var i = 0, length = items.length; i < length; i++) {
+        for (let i = 0, length = items.length; i < length; i++) {
             addUniquePlaylistItemId(items[i]);
 
             this._playlist.push(items[i]);
         }
-    };
+    }
 
-    PlayQueueManager.prototype.shufflePlaylist = function () {
+    shufflePlaylist() {
         this._sortedPlaylist = [];
         for (const item of this._playlist) {
             this._sortedPlaylist.push(item);
@@ -65,42 +65,31 @@ define([], function () {
         }
         this._playlist.unshift(currentPlaylistItem);
         this._shuffleMode = 'Shuffle';
-    };
+    }
 
-    PlayQueueManager.prototype.sortShuffledPlaylist = function () {
+    sortShuffledPlaylist() {
         this._playlist = [];
-        for (let item of this._sortedPlaylist) {
+        for (const item of this._sortedPlaylist) {
             this._playlist.push(item);
         }
         this._sortedPlaylist = [];
         this._shuffleMode = 'Sorted';
-    };
+    }
 
-    PlayQueueManager.prototype.clearPlaylist = function (clearCurrentItem = false) {
+    clearPlaylist(clearCurrentItem = false) {
         const currentPlaylistItem = this._playlist.splice(this.getCurrentPlaylistIndex(), 1)[0];
         this._playlist = [];
         if (!clearCurrentItem) {
             this._playlist.push(currentPlaylistItem);
         }
-    };
-
-    function arrayInsertAt(destArray, pos, arrayToInsert) {
-        var args = [];
-        args.push(pos); // where to insert
-        args.push(0); // nothing to remove
-        args = args.concat(arrayToInsert); // add on array to insert
-        destArray.splice.apply(destArray, args); // splice it in
     }
 
-    PlayQueueManager.prototype.queueNext = function (items) {
+    queueNext(items) {
-        var i;
+        for (let i = 0, length = items.length; i < length; i++) {
-        var length;
-
-        for (i = 0, length = items.length; i < length; i++) {
             addUniquePlaylistItemId(items[i]);
         }
 
-        var currentIndex = this.getCurrentPlaylistIndex();
+        let currentIndex = this.getCurrentPlaylistIndex();
 
         if (currentIndex === -1) {
             currentIndex = this._playlist.length;
@@ -109,43 +98,43 @@ define([], function () {
         }
 
         arrayInsertAt(this._playlist, currentIndex, items);
-    };
+    }
 
-    PlayQueueManager.prototype.getCurrentPlaylistIndex = function () {
+    getCurrentPlaylistIndex() {
         return findPlaylistIndex(this.getCurrentPlaylistItemId(), this._playlist);
-    };
+    }
 
-    PlayQueueManager.prototype.getCurrentItem = function () {
+    getCurrentItem() {
-        var index = findPlaylistIndex(this.getCurrentPlaylistItemId(), this._playlist);
+        const index = findPlaylistIndex(this.getCurrentPlaylistItemId(), this._playlist);
 
         return index === -1 ? null : this._playlist[index];
-    };
+    }
 
-    PlayQueueManager.prototype.getCurrentPlaylistItemId = function () {
+    getCurrentPlaylistItemId() {
         return this._currentPlaylistItemId;
-    };
+    }
 
-    PlayQueueManager.prototype.setPlaylistState = function (playlistItemId, playlistIndex) {
+    setPlaylistState(playlistItemId, playlistIndex) {
         this._currentPlaylistItemId = playlistItemId;
-    };
+    }
 
-    PlayQueueManager.prototype.setPlaylistIndex = function (playlistIndex) {
+    setPlaylistIndex(playlistIndex) {
         if (playlistIndex < 0) {
             this.setPlaylistState(null);
         } else {
             this.setPlaylistState(this._playlist[playlistIndex].PlaylistItemId);
         }
-    };
+    }
 
-    PlayQueueManager.prototype.removeFromPlaylist = function (playlistItemIds) {
+    removeFromPlaylist(playlistItemIds) {
         if (this._playlist.length <= playlistItemIds.length) {
             return {
                 result: 'empty'
             };
         }
 
-        var currentPlaylistItemId = this.getCurrentPlaylistItemId();
+        const currentPlaylistItemId = this.getCurrentPlaylistItemId();
-        var isCurrentIndex = playlistItemIds.indexOf(currentPlaylistItemId) !== -1;
+        const isCurrentIndex = playlistItemIds.indexOf(currentPlaylistItemId) !== -1;
 
         this._sortedPlaylist = this._sortedPlaylist.filter(function (item) {
             return !playlistItemIds.includes(item.PlaylistItemId);
@@ -159,17 +148,13 @@ define([], function () {
             result: 'removed',
             isCurrentIndex: isCurrentIndex
         };
-    };
-
-    function moveInArray(array, from, to) {
-        array.splice(to, 0, array.splice(from, 1)[0]);
     }
 
-    PlayQueueManager.prototype.movePlaylistItem = function (playlistItemId, newIndex) {
+    movePlaylistItem(playlistItemId, newIndex) {
-        var playlist = this.getPlaylist();
+        const playlist = this.getPlaylist();
 
-        var oldIndex;
+        let oldIndex;
-        for (var i = 0, length = playlist.length; i < length; i++) {
+        for (let i = 0, length = playlist.length; i < length; i++) {
             if (playlist[i].PlaylistItemId === playlistItemId) {
                 oldIndex = i;
                 break;
@@ -195,30 +180,30 @@ define([], function () {
             playlistItemId: playlistItemId,
             newIndex: newIndex
         };
-    };
+    }
 
-    PlayQueueManager.prototype.reset = function () {
+    reset() {
         this._sortedPlaylist = [];
         this._playlist = [];
         this._currentPlaylistItemId = null;
         this._repeatMode = 'RepeatNone';
         this._shuffleMode = 'Sorted';
-    };
+    }
 
-    PlayQueueManager.prototype.setRepeatMode = function (value) {
+    setRepeatMode(value) {
         const repeatModes = ['RepeatOne', 'RepeatAll', 'RepeatNone'];
         if (repeatModes.includes(value)) {
             this._repeatMode = value;
         } else {
             throw new TypeError('invalid value provided for setRepeatMode');
         }
-    };
+    }
 
-    PlayQueueManager.prototype.getRepeatMode = function () {
+    getRepeatMode() {
         return this._repeatMode;
-    };
+    }
 
-    PlayQueueManager.prototype.setShuffleMode = function (value) {
+    setShuffleMode(value) {
         switch (value) {
             case 'Shuffle':
                 this.shufflePlaylist();
@@ -229,9 +214,9 @@ define([], function () {
             default:
                 throw new TypeError('invalid value provided to setShuffleMode');
         }
-    };
+    }
 
-    PlayQueueManager.prototype.toggleShuffleMode = function () {
+    toggleShuffleMode() {
         switch (this._shuffleMode) {
             case 'Shuffle':
                 this.setShuffleMode('Sorted');
@@ -242,16 +227,16 @@ define([], function () {
             default:
                 throw new TypeError('current value for shufflequeue is invalid');
         }
-    };
+    }
 
-    PlayQueueManager.prototype.getShuffleMode = function () {
+    getShuffleMode() {
         return this._shuffleMode;
-    };
+    }
 
-    PlayQueueManager.prototype.getNextItemInfo = function () {
+    getNextItemInfo() {
-        var newIndex;
+        let newIndex;
-        var playlist = this.getPlaylist();
+        const playlist = this.getPlaylist();
-        var playlistLength = playlist.length;
+        const playlistLength = playlist.length;
 
         switch (this.getRepeatMode()) {
             case 'RepeatOne':
@@ -272,7 +257,7 @@ define([], function () {
             return null;
         }
 
-        var item = playlist[newIndex];
+        const item = playlist[newIndex];
 
         if (!item) {
             return null;
@@ -282,7 +267,19 @@ define([], function () {
             item: item,
             index: newIndex
         };
-    };
+    }
+}
 
-    return PlayQueueManager;
+function arrayInsertAt(destArray, pos, arrayToInsert) {
-});
+    let args = [];
+    args.push(pos); // where to insert
+    args.push(0); // nothing to remove
+    args = args.concat(arrayToInsert); // add on array to insert
+    destArray.splice.apply(destArray, args); // splice it in
+}
+
+function moveInArray(array, from, to) {
+    array.splice(to, 0, array.splice(from, 1)[0]);
+}
+
+export default PlayQueueManager;

src/components/playbackSettings/playbackSettings.template.html

@@ -85,7 +85,7 @@
         <div class="selectContainer">
             <select is="emby-select" class="selectChromecastVersion" label="${LabelChromecastVersion}">
                 <option value="stable">${LabelStable}</option>
-                <option value="nightly">${LabelNightly}</option>
+                <option value="unstable">${LabelUnstable}</option>
             </select>
         </div>
 

src/components/recordingcreator/recordingcreator.js

@@ -104,7 +104,7 @@ define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'c
                 var apiClient = connectionManager.getApiClient(serverId);
 
                 apiClient.getLiveTvProgram(programId, apiClient.getCurrentUserId()).then(function (item) {
-                    playbackManager.play({
+                    playbackManager.default.play({
                         ids: [item.ChannelId],
                         serverId: serverId
                     });

src/components/recordingcreator/recordingeditor.js

@@ -1,6 +1,8 @@
 define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'connectionManager', 'require', 'loading', 'scrollHelper', 'imageLoader', 'scrollStyles', 'emby-button', 'emby-collapse', 'emby-input', 'paper-icon-button-light', 'css!./../formdialog', 'css!./recordingcreator', 'material-icons', 'flexStyles'], function (dialogHelper, globalize, layoutManager, mediaInfo, appHost, connectionManager, require, loading, scrollHelper, imageLoader) {
     'use strict';
 
+    loading = loading.default || loading;
+
     var currentDialog;
     var recordingDeleted = false;
     var currentItemId;

src/components/recordingcreator/recordingfields.js

@@ -1,6 +1,8 @@
 define(['globalize', 'connectionManager', 'serverNotifications', 'require', 'loading', 'apphost', 'dom', 'recordingHelper', 'events', 'paper-icon-button-light', 'emby-button', 'css!./recordingfields', 'flexStyles'], function (globalize, connectionManager, serverNotifications, require, loading, appHost, dom, recordingHelper, events) {
     'use strict';
 
+    loading = loading.default || loading;
+
     function loadData(parent, program, apiClient) {
         if (program.IsSeries) {
             parent.querySelector('.recordSeriesContainer').classList.remove('hide');

src/components/recordingcreator/recordinghelper.js

@@ -1,6 +1,8 @@
 define(['globalize', 'loading', 'connectionManager'], function (globalize, loading, connectionManager) {
     'use strict';
 
+    loading = loading.default || loading;
+
     function changeRecordingToSeries(apiClient, timerId, programId, confirmTimerCancellation) {
         loading.show();
 

src/components/recordingcreator/seriesrecordingeditor.js

@@ -1,6 +1,8 @@
 define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'connectionManager', 'require', 'loading', 'scrollHelper', 'imageLoader', 'datetime', 'scrollStyles', 'emby-button', 'emby-checkbox', 'emby-input', 'emby-select', 'paper-icon-button-light', 'css!./../formdialog', 'css!./recordingcreator', 'material-icons', 'flexStyles'], function (dialogHelper, globalize, layoutManager, mediaInfo, appHost, connectionManager, require, loading, scrollHelper, imageLoader, datetime) {
     'use strict';
 
+    loading = loading.default || loading;
+
     var currentDialog;
     var recordingUpdated = false;
     var recordingDeleted = false;

src/components/refreshdialog/refreshdialog.js

@@ -1,8 +1,21 @@
-define(['dom', 'shell', 'dialogHelper', 'loading', 'layoutManager', 'connectionManager', 'appRouter', 'globalize', 'emby-input', 'emby-checkbox', 'paper-icon-button-light', 'emby-select', 'material-icons', 'css!./../formdialog', 'emby-button'], function (dom, shell, dialogHelper, loading, layoutManager, connectionManager, appRouter, globalize) {
+import dom from 'dom';
-    'use strict';
+import dialogHelper from 'dialogHelper';
+import loading from 'loading';
+import layoutManager from 'layoutManager';
+import connectionManager from 'connectionManager';
+import globalize from 'globalize';
+import 'emby-input';
+import 'emby-checkbox';
+import 'paper-icon-button-light';
+import 'emby-select';
+import 'material-icons';
+import 'css!./../formdialog';
+import 'emby-button';
+
+/*eslint prefer-const: "error"*/
 
 function getEditorHtml() {
-        var html = '';
+    let html = '';
 
     html += '<div class="formDialogContent smoothScrollY" style="padding-top:2em;">';
     html += '<div class="dialogContentInner dialog-content-centered">';
@@ -40,8 +53,8 @@ define(['dom', 'shell', 'dialogHelper', 'loading', 'layoutManager', 'connectionM
 }
 
 function centerFocus(elem, horiz, on) {
-        require(['scrollHelper'], function (scrollHelper) {
+    import('scrollHelper').then(({default: scrollHelper}) => {
-            var fn = on ? 'on' : 'off';
+        const fn = on ? 'on' : 'off';
         scrollHelper.centerFocus[fn](elem, horiz);
     });
 }
@@ -49,16 +62,16 @@ define(['dom', 'shell', 'dialogHelper', 'loading', 'layoutManager', 'connectionM
 function onSubmit(e) {
     loading.show();
 
-        var instance = this;
+    const instance = this;
-        var dlg = dom.parentWithClass(e.target, 'dialog');
+    const dlg = dom.parentWithClass(e.target, 'dialog');
-        var options = instance.options;
+    const options = instance.options;
 
-        var apiClient = connectionManager.getApiClient(options.serverId);
+    const apiClient = connectionManager.getApiClient(options.serverId);
 
-        var replaceAllMetadata = dlg.querySelector('#selectMetadataRefreshMode').value === 'all';
+    const replaceAllMetadata = dlg.querySelector('#selectMetadataRefreshMode').value === 'all';
 
-        var mode = dlg.querySelector('#selectMetadataRefreshMode').value === 'scan' ? 'Default' : 'FullRefresh';
+    const mode = dlg.querySelector('#selectMetadataRefreshMode').value === 'scan' ? 'Default' : 'FullRefresh';
-        var replaceAllImages = mode === 'FullRefresh' && dlg.querySelector('.chkReplaceImages').checked;
+    const replaceAllImages = mode === 'FullRefresh' && dlg.querySelector('.chkReplaceImages').checked;
 
     options.itemIds.forEach(function (itemId) {
         apiClient.refreshItem(itemId, {
@@ -73,7 +86,7 @@ define(['dom', 'shell', 'dialogHelper', 'loading', 'layoutManager', 'connectionM
 
     dialogHelper.close(dlg);
 
-        require(['toast'], function (toast) {
+    import('toast').then(({default: toast}) => {
         toast(globalize.translate('RefreshQueued'));
     });
 
@@ -83,12 +96,13 @@ define(['dom', 'shell', 'dialogHelper', 'loading', 'layoutManager', 'connectionM
     return false;
 }
 
-    function RefreshDialog(options) {
+class RefreshDialog {
+    constructor(options) {
         this.options = options;
     }
 
-    RefreshDialog.prototype.show = function () {
+    show() {
-        var dialogOptions = {
+        const dialogOptions = {
             removeOnClose: true,
             scrollY: false
         };
@@ -99,12 +113,12 @@ define(['dom', 'shell', 'dialogHelper', 'loading', 'layoutManager', 'connectionM
             dialogOptions.size = 'small';
         }
 
-        var dlg = dialogHelper.createDialog(dialogOptions);
+        const dlg = dialogHelper.createDialog(dialogOptions);
 
         dlg.classList.add('formDialog');
 
-        var html = '';
+        let html = '';
-        var title = globalize.translate('RefreshMetadata');
+        const title = globalize.translate('RefreshMetadata');
 
         html += '<div class="formDialogHeader">';
         html += '<button is="paper-icon-button-light" class="btnCancel autoSize" tabindex="-1"><span class="material-icons arrow_back"></span></button>';
@@ -150,7 +164,7 @@ define(['dom', 'shell', 'dialogHelper', 'loading', 'layoutManager', 'connectionM
             dlg.addEventListener('close', resolve);
             dialogHelper.open(dlg);
         });
-    };
+    }
+}
 
-    return RefreshDialog;
+export default RefreshDialog;
-});

src/components/remotecontrol/remotecontrol.js

@@ -1,5 +1,8 @@
 define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageLoader', 'playbackManager', 'nowPlayingHelper', 'events', 'connectionManager', 'apphost', 'globalize', 'layoutManager', 'userSettings', 'cardBuilder', 'itemContextMenu', 'cardStyle', 'emby-itemscontainer', 'css!./remotecontrol.css', 'emby-ratingbutton'], function (browser, datetime, backdrop, libraryBrowser, listView, imageLoader, playbackManager, nowPlayingHelper, events, connectionManager, appHost, globalize, layoutManager, userSettings, cardBuilder, itemContextMenu) {
     'use strict';
+
+    playbackManager = playbackManager.default || playbackManager;
+
     var showMuteButton = true;
     var showVolumeSlider = true;
 
@@ -48,7 +51,7 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
         menuItems.unshift({
             id: -1,
             name: globalize.translate('ButtonOff'),
-            selected: null == currentIndex
+            selected: currentIndex == null
         });
 
         require(['actionsheet'], function (actionsheet) {
@@ -69,18 +72,18 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
     }
 
     function seriesImageUrl(item, options) {
-        if ('Episode' !== item.Type) {
+        if (item.Type !== 'Episode') {
             return null;
         }
 
         options = options || {};
         options.type = options.type || 'Primary';
-        if ('Primary' === options.type && item.SeriesPrimaryImageTag) {
+        if (options.type === 'Primary' && item.SeriesPrimaryImageTag) {
             options.tag = item.SeriesPrimaryImageTag;
             return connectionManager.getApiClient(item.ServerId).getScaledImageUrl(item.SeriesId, options);
         }
 
-        if ('Thumb' === options.type) {
+        if (options.type === 'Thumb') {
             if (item.SeriesThumbImageTag) {
                 options.tag = item.SeriesThumbImageTag;
                 return connectionManager.getApiClient(item.ServerId).getScaledImageUrl(item.SeriesId, options);
@@ -119,9 +122,9 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
             var nowPlayingServerId = (item.ServerId || serverId);
             if (item.Type == 'Audio' || item.MediaStreams[0].Type == 'Audio') {
                 var songName = item.Name;
-                if (item.Album != null && item.Artists != null) {
                 var artistsSeries = '';
-                    var albumName = item.Album;
+                var albumName = '';
+                if (item.Artists != null) {
                     if (item.ArtistItems != null) {
                         for (const artist of item.ArtistItems) {
                             let artistName = artist.Name;
@@ -142,9 +145,12 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
                             }
                         }
                     }
-                    context.querySelector('.nowPlayingArtist').innerHTML = artistsSeries;
-                    context.querySelector('.nowPlayingAlbum').innerHTML = '<a class="button-link emby-button" is="emby-linkbutton" href="details?id=' + item.AlbumId + `&serverId=${nowPlayingServerId}">${albumName}</a>`;
                 }
+                if (item.Album != null) {
+                    albumName = '<a class="button-link emby-button" is="emby-linkbutton" href="details?id=' + item.AlbumId + `&serverId=${nowPlayingServerId}">` + item.Album + '</a>';
+                }
+                context.querySelector('.nowPlayingAlbum').innerHTML = albumName;
+                context.querySelector('.nowPlayingArtist').innerHTML = artistsSeries;
                 context.querySelector('.nowPlayingSongName').innerHTML = songName;
             } else if (item.Type == 'Episode') {
                 if (item.SeasonName != null) {
@@ -171,9 +177,9 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
             }
 
             var url = item ? seriesImageUrl(item, {
-                maxHeight: 300 * 2
+                maxHeight: 300
             }) || imageUrl(item, {
-                maxHeight: 300 * 2
+                maxHeight: 300
             }) : null;
 
             let contextButton = context.querySelector('.btnToggleContextMenu');
@@ -210,7 +216,7 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
                 backdrop.setBackdrops([item]);
                 apiClient.getItem(apiClient.getCurrentUserId(), item.Id).then(function (fullItem) {
                     var userData = fullItem.UserData || {};
-                    var likes = null == userData.Likes ? '' : userData.Likes;
+                    var likes = userData.Likes == null ? '' : userData.Likes;
                     context.querySelector('.nowPlayingPageUserDataButtonsTitle').innerHTML = '<button is="emby-ratingbutton" type="button" class="listItemButton paper-icon-button-light" data-id="' + fullItem.Id + '" data-serverid="' + fullItem.ServerId + '" data-itemtype="' + fullItem.Type + '" data-likes="' + likes + '" data-isfavorite="' + userData.IsFavorite + '"><span class="material-icons favorite"></span></button>';
                     context.querySelector('.nowPlayingPageUserDataButtons').innerHTML = '<button is="emby-ratingbutton" type="button" class="listItemButton paper-icon-button-light" data-id="' + fullItem.Id + '" data-serverid="' + fullItem.ServerId + '" data-itemtype="' + fullItem.Type + '" data-likes="' + likes + '" data-isfavorite="' + userData.IsFavorite + '"><span class="material-icons favorite"></span></button>';
                 });
@@ -251,7 +257,7 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
         var all = context.querySelectorAll('.btnCommand');
 
         for (var i = 0, length = all.length; i < length; i++) {
-            var enableButton = -1 !== commands.indexOf(all[i].getAttribute('data-command'));
+            var enableButton = commands.indexOf(all[i].getAttribute('data-command')) !== -1;
             all[i].disabled = !enableButton;
         }
     }
@@ -278,7 +284,7 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
             currentPlayerSupportedCommands = supportedCommands;
             var playState = state.PlayState || {};
             var isSupportedCommands = supportedCommands.includes('DisplayMessage') || supportedCommands.includes('SendString') || supportedCommands.includes('Select');
-            buttonVisible(context.querySelector('.btnToggleFullscreen'), item && 'Video' == item.MediaType && supportedCommands.includes('ToggleFullscreen'));
+            buttonVisible(context.querySelector('.btnToggleFullscreen'), item && item.MediaType == 'Video' && supportedCommands.includes('ToggleFullscreen'));
             updateAudioTracksDisplay(player, context);
             updateSubtitleTracksDisplay(player, context);
 
@@ -306,15 +312,15 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
                 context.querySelector('.remoteControlSection').classList.add('hide');
             }
 
-            buttonVisible(context.querySelector('.btnStop'), null != item);
+            buttonVisible(context.querySelector('.btnStop'), item != null);
-            buttonVisible(context.querySelector('.btnNextTrack'), null != item);
+            buttonVisible(context.querySelector('.btnNextTrack'), item != null);
-            buttonVisible(context.querySelector('.btnPreviousTrack'), null != item);
+            buttonVisible(context.querySelector('.btnPreviousTrack'), item != null);
             if (layoutManager.mobile) {
                 buttonVisible(context.querySelector('.btnRewind'), false);
                 buttonVisible(context.querySelector('.btnFastForward'), false);
             } else {
-                buttonVisible(context.querySelector('.btnRewind'), null != item);
+                buttonVisible(context.querySelector('.btnRewind'), item != null);
-                buttonVisible(context.querySelector('.btnFastForward'), null != item);
+                buttonVisible(context.querySelector('.btnFastForward'), item != null);
             }
             var positionSlider = context.querySelector('.nowPlayingPositionSlider');
 
@@ -325,15 +331,15 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
 
             if (positionSlider && !positionSlider.dragging) {
                 positionSlider.disabled = !playState.CanSeek;
-                var isProgressClear = state.MediaSource && null == state.MediaSource.RunTimeTicks;
+                var isProgressClear = state.MediaSource && state.MediaSource.RunTimeTicks == null;
                 positionSlider.setIsClear(isProgressClear);
             }
 
-            updatePlayPauseState(playState.IsPaused, null != item);
+            updatePlayPauseState(playState.IsPaused, item != null);
             updateTimeDisplay(playState.PositionTicks, item ? item.RunTimeTicks : null);
             updatePlayerVolumeState(context, playState.IsMuted, playState.VolumeLevel);
 
-            if (item && 'Video' == item.MediaType) {
+            if (item && item.MediaType == 'Video') {
                 context.classList.remove('hideVideoButtons');
             } else {
                 context.classList.add('hideVideoButtons');
@@ -346,12 +352,12 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
 
         function updateAudioTracksDisplay(player, context) {
             var supportedCommands = currentPlayerSupportedCommands;
-            buttonVisible(context.querySelector('.btnAudioTracks'), playbackManager.audioTracks(player).length > 1 && -1 != supportedCommands.indexOf('SetAudioStreamIndex'));
+            buttonVisible(context.querySelector('.btnAudioTracks'), playbackManager.audioTracks(player).length > 1 && supportedCommands.indexOf('SetAudioStreamIndex') != -1);
         }
 
         function updateSubtitleTracksDisplay(player, context) {
             var supportedCommands = currentPlayerSupportedCommands;
-            buttonVisible(context.querySelector('.btnSubtitles'), playbackManager.subtitleTracks(player).length && -1 != supportedCommands.indexOf('SetSubtitleStreamIndex'));
+            buttonVisible(context.querySelector('.btnSubtitles'), playbackManager.subtitleTracks(player).length && supportedCommands.indexOf('SetSubtitleStreamIndex') != -1);
         }
 
         function updateRepeatModeDisplay(repeatMode) {
@@ -383,11 +389,11 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
             var view = context;
             var supportedCommands = currentPlayerSupportedCommands;
 
-            if (-1 === supportedCommands.indexOf('Mute')) {
+            if (supportedCommands.indexOf('Mute') === -1) {
                 showMuteButton = false;
             }
 
-            if (-1 === supportedCommands.indexOf('SetVolume')) {
+            if (supportedCommands.indexOf('SetVolume') === -1) {
                 showVolumeSlider = false;
             }
 
@@ -452,8 +458,8 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
                 }
             }
 
-            context.querySelector('.positionTime').innerHTML = null == positionTicks ? '--:--' : datetime.getDisplayRunningTime(positionTicks);
+            context.querySelector('.positionTime').innerHTML = positionTicks == null ? '--:--' : datetime.getDisplayRunningTime(positionTicks);
-            context.querySelector('.runtime').innerHTML = null != runtimeTicks ? datetime.getDisplayRunningTime(runtimeTicks) : '--:--';
+            context.querySelector('.runtime').innerHTML = runtimeTicks != null ? datetime.getDisplayRunningTime(runtimeTicks) : '--:--';
         }
 
         function getPlaylistItems(player) {

src/components/skinManager.js

@@ -1,184 +0,0 @@
-define(['apphost', 'userSettings', 'browser', 'events', 'backdrop', 'globalize', 'require', 'appSettings'], function (appHost, userSettings, browser, events, backdrop, globalize, require, appSettings) {
-    'use strict';
-
-    var themeStyleElement;
-    var currentThemeId;
-
-    function unloadTheme() {
-        var elem = themeStyleElement;
-        if (elem) {
-            elem.parentNode.removeChild(elem);
-            themeStyleElement = null;
-            currentThemeId = null;
-        }
-    }
-
-    function loadUserSkin(options) {
-        options = options || {};
-        if (options.start) {
-            Emby.Page.invokeShortcut(options.start);
-        } else {
-            Emby.Page.goHome();
-        }
-    }
-
-    function getThemes() {
-        return [{
-            name: 'Apple TV',
-            id: 'appletv'
-        }, {
-            name: 'Blue Radiance',
-            id: 'blueradiance'
-        }, {
-            name: 'Dark',
-            id: 'dark',
-            isDefault: true,
-            isDefaultServerDashboard: true
-        }, {
-            name: 'Light',
-            id: 'light'
-        }, {
-            name: 'Purple Haze',
-            id: 'purplehaze'
-        }, {
-            name: 'Windows Media Center',
-            id: 'wmc'
-        }];
-    }
-
-    var skinManager = {
-        getThemes: getThemes,
-        loadUserSkin: loadUserSkin
-    };
-
-    function getThemeStylesheetInfo(id, isDefaultProperty) {
-        var themes = skinManager.getThemes();
-        var defaultTheme;
-        var selectedTheme;
-
-        for (var i = 0, length = themes.length; i < length; i++) {
-            var theme = themes[i];
-            if (theme[isDefaultProperty]) {
-                defaultTheme = theme;
-            }
-            if (id === theme.id) {
-                selectedTheme = theme;
-            }
-        }
-
-        selectedTheme = selectedTheme || defaultTheme;
-        return {
-            stylesheetPath: require.toUrl('themes/' + selectedTheme.id + '/theme.css'),
-            themeId: selectedTheme.id
-        };
-    }
-
-    var themeResources = {};
-    var lastSound = 0;
-    var currentSound;
-
-    function loadThemeResources(id) {
-        lastSound = 0;
-        if (currentSound) {
-            currentSound.stop();
-            currentSound = null;
-        }
-
-        backdrop.clearBackdrop();
-    }
-
-    function onThemeLoaded() {
-        document.documentElement.classList.remove('preload');
-        try {
-            var color = getComputedStyle(document.querySelector('.skinHeader')).getPropertyValue('background-color');
-            if (color) {
-                appHost.setThemeColor(color);
-            }
-        } catch (err) {
-            console.error('error setting theme color: ' + err);
-        }
-    }
-
-    skinManager.setTheme = function (id, context) {
-        return new Promise(function (resolve, reject) {
-            if (currentThemeId && currentThemeId === id) {
-                resolve();
-                return;
-            }
-
-            var isDefaultProperty = context === 'serverdashboard' ? 'isDefaultServerDashboard' : 'isDefault';
-            var info = getThemeStylesheetInfo(id, isDefaultProperty);
-            if (currentThemeId && currentThemeId === info.themeId) {
-                resolve();
-                return;
-            }
-
-            var linkUrl = info.stylesheetPath;
-            unloadTheme();
-
-            var link = document.createElement('link');
-            link.setAttribute('rel', 'stylesheet');
-            link.setAttribute('type', 'text/css');
-            link.onload = function () {
-                onThemeLoaded();
-                resolve();
-            };
-
-            link.setAttribute('href', linkUrl);
-            document.head.appendChild(link);
-            themeStyleElement = link;
-            currentThemeId = info.themeId;
-            loadThemeResources(info.themeId);
-
-            onViewBeforeShow({});
-        });
-    };
-
-    function onViewBeforeShow(e) {
-        if (e.detail && e.detail.type === 'video-osd') {
-            // This removes the space that the scrollbar takes while playing a video
-            document.body.classList.remove('force-scroll');
-            return;
-        }
-
-        if (themeResources.backdrop) {
-            backdrop.setBackdrop(themeResources.backdrop);
-        }
-
-        if (!browser.mobile && userSettings.enableThemeSongs()) {
-            if (lastSound === 0) {
-                if (themeResources.themeSong) {
-                    playSound(themeResources.themeSong);
-                }
-            } else if ((new Date().getTime() - lastSound) > 30000) {
-                if (themeResources.effect) {
-                    playSound(themeResources.effect);
-                }
-            }
-        }
-        // This keeps the scrollbar always present in all pages, so we avoid clipping while switching between pages
-        // that need the scrollbar and pages that don't.
-        document.body.classList.add('force-scroll');
-    }
-
-    document.addEventListener('viewshow', onViewBeforeShow);
-
-    function playSound(path, volume) {
-        lastSound = new Date().getTime();
-        require(['howler'], function (howler) {
-            /* globals Howl */
-            try {
-                var sound = new Howl({
-                    src: [path],
-                    volume: volume || 0.1
-                });
-                sound.play();
-                currentSound = sound;
-            } catch (err) {
-                console.error('error playing sound: ' + err);
-            }
-        });
-    }
-
-    return skinManager;
-});

src/components/slideshow/slideshow.js

@@ -5,6 +5,8 @@
 define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'focusManager', 'browser', 'apphost', 'dom', 'css!./style', 'material-icons', 'paper-icon-button-light'], function (dialogHelper, inputManager, connectionManager, layoutManager, focusManager, browser, appHost, dom) {
     'use strict';
 
+    browser = browser.default || browser;
+
     /**
      * Name of transition event.
      */

src/components/subtitleeditor/subtitleeditor.js

@@ -1,6 +1,8 @@
 define(['dialogHelper', 'require', 'layoutManager', 'globalize', 'userSettings', 'connectionManager', 'loading', 'focusManager', 'dom', 'apphost', 'emby-select', 'listViewStyle', 'paper-icon-button-light', 'css!./../formdialog', 'material-icons', 'css!./subtitleeditor', 'emby-button', 'flexStyles'], function (dialogHelper, require, layoutManager, globalize, userSettings, connectionManager, loading, focusManager, dom, appHost) {
     'use strict';
 
+    loading = loading.default || loading;
+
     var currentItem;
     var hasChanges;
 

src/components/subtitlesync/subtitlesync.js

@@ -1,6 +1,8 @@
 define(['playbackManager', 'layoutManager', 'text!./subtitlesync.template.html', 'css!./subtitlesync'], function (playbackManager, layoutManager, template, css) {
     'use strict';
 
+    playbackManager = playbackManager.default || playbackManager;
+
     var player;
     var subtitleSyncSlider;
     var subtitleSyncTextField;

src/components/themeMediaPlayer.js

@@ -1,6 +1,8 @@
 define(['playbackManager', 'userSettings', 'connectionManager'], function (playbackManager, userSettings, connectionManager) {
     'use strict';
 
+    playbackManager = playbackManager.default || playbackManager;
+
     var currentOwnerId;
     var currentThemeIds = [];
 

src/components/toast/toast.js

@@ -1,5 +1,4 @@
-define(['css!./toast'], function () {
+import 'css!./toast';
-    'use strict';
 
 function remove(elem) {
     setTimeout(function () {
@@ -14,14 +13,14 @@ define(['css!./toast'], function () {
     }, 3300);
 }
 
-    return function (options) {
+export default function (options) {
     if (typeof options === 'string') {
         options = {
             text: options
         };
     }
 
-        var elem = document.createElement('div');
+    const elem = document.createElement('div');
     elem.classList.add('toast');
     elem.innerHTML = options.text;
 
@@ -32,5 +31,4 @@ define(['css!./toast'], function () {
 
         animateRemove(elem);
     }, 300);
-    };
+}
-});

src/components/tunerPicker.js

@@ -1,6 +1,9 @@
 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';
 
+    browser = browser.default || browser;
+    loading = loading.default || loading;
+
     var enableFocusTransform = !browser.slow && !browser.edge;
 
     function getEditorHtml() {

src/components/tvproviders/schedulesdirect.js

@@ -1,6 +1,8 @@
 define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'listViewStyle', 'emby-input', 'emby-select', 'emby-button', 'flexStyles'], function ($, loading, globalize) {
     'use strict';
 
+    loading = loading.default || loading;
+
     return function (page, providerId, options) {
         function reload() {
             loading.show();
@@ -42,7 +44,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'listViewStyle', 'emb
                 for (var region in result) {
                     var countries = result[region];
 
-                    if (countries.length && 'ZZZ' !== region) {
+                    if (countries.length && region !== 'ZZZ') {
                         for (i = 0, length = countries.length; i < length; i++) {
                             countryList.push({
                                 name: countries[i].fullName,
@@ -237,7 +239,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'listViewStyle', 'emb
                 var device = devices[i];
                 html += '<div class="listItem">';
                 var enabledTuners = providerInfo.EnabledTuners || [];
-                var isChecked = providerInfo.EnableAllTuners || -1 !== enabledTuners.indexOf(device.Id);
+                var isChecked = providerInfo.EnableAllTuners || enabledTuners.indexOf(device.Id) !== -1;
                 var checkedAttribute = isChecked ? ' checked' : '';
                 html += '<label class="checkboxContainer listItemCheckboxContainer"><input type="checkbox" is="emby-checkbox" data-id="' + device.Id + '" class="chkTuner" ' + checkedAttribute + '/><span></span></label>';
                 html += '<div class="listItemBody two-line">';

src/components/tvproviders/xmltv.js

@@ -1,6 +1,8 @@
 define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'emby-input', 'listViewStyle', 'paper-icon-button-light'], function ($, loading, globalize) {
     'use strict';
 
+    loading = loading.default || loading;
+
     return function (page, providerId, options) {
         function getListingProvider(config, id) {
             if (config && id) {
@@ -84,7 +86,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'emby-input', 'listVi
                 }).then(function (result) {
                     loading.hide();
 
-                    if (false !== options.showConfirmation) {
+                    if (options.showConfirmation !== false) {
                         Dashboard.processServerConfigurationUpdateResult();
                     }
 
@@ -118,7 +120,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'emby-input', 'listVi
                 var device = devices[i];
                 html += '<div class="listItem">';
                 var enabledTuners = providerInfo.EnabledTuners || [];
-                var isChecked = providerInfo.EnableAllTuners || -1 !== enabledTuners.indexOf(device.Id);
+                var isChecked = providerInfo.EnableAllTuners || enabledTuners.indexOf(device.Id) !== -1;
                 var checkedAttribute = isChecked ? ' checked' : '';
                 html += '<label class="listItemCheckboxContainer"><input type="checkbox" is="emby-checkbox" class="chkTuner" data-id="' + device.Id + '" ' + checkedAttribute + '><span></span></label>';
                 html += '<div class="listItemBody two-line">';

src/components/upnextdialog/upnextdialog.js

@@ -1,7 +1,19 @@
-define(['dom', 'playbackManager', 'connectionManager', 'events', 'mediaInfo', 'layoutManager', 'focusManager', 'globalize', 'itemHelper', 'css!./upnextdialog', 'emby-button', 'flexStyles'], function (dom, playbackManager, connectionManager, events, mediaInfo, layoutManager, focusManager, globalize, itemHelper) {
+import dom from 'dom';
-    'use strict';
+import playbackManager from 'playbackManager';
+import connectionManager from 'connectionManager';
+import events from 'events';
+import mediaInfo from 'mediaInfo';
+import layoutManager from 'layoutManager';
+import focusManager from 'focusManager';
+import globalize from 'globalize';
+import itemHelper from 'itemHelper';
+import 'css!./upnextdialog';
+import 'emby-button';
+import 'flexStyles';
 
-    var transitionEndEventName = dom.whichTransitionEvent();
+/* eslint-disable indent */
+
+    const transitionEndEventName = dom.whichTransitionEvent();
 
     function seriesImageUrl(item, options) {
         if (item.Type !== 'Episode') {
@@ -56,7 +68,7 @@ define(['dom', 'playbackManager', 'connectionManager', 'events', 'mediaInfo', 'l
 
     function setPoster(osdPoster, item, secondaryItem) {
         if (item) {
-            var imgUrl = seriesImageUrl(item, { type: 'Primary' }) ||
+            let imgUrl = seriesImageUrl(item, { type: 'Primary' }) ||
                 seriesImageUrl(item, { type: 'Thumb' }) ||
                 imageUrl(item, { type: 'Primary' });
 
@@ -76,7 +88,7 @@ define(['dom', 'playbackManager', 'connectionManager', 'events', 'mediaInfo', 'l
     }
 
     function getHtml() {
-        var html = '';
+        let html = '';
 
         html += '<div class="upNextDialog-poster">';
         html += '</div>';
@@ -112,17 +124,17 @@ define(['dom', 'playbackManager', 'connectionManager', 'events', 'mediaInfo', 'l
     }
 
     function setNextVideoText() {
-        var instance = this;
+        const instance = this;
 
-        var elem = instance.options.parent;
+        const elem = instance.options.parent;
 
-        var secondsRemaining = Math.max(Math.round(getTimeRemainingMs(instance) / 1000), 0);
+        const secondsRemaining = Math.max(Math.round(getTimeRemainingMs(instance) / 1000), 0);
 
         console.debug('up next seconds remaining: ' + secondsRemaining);
 
-        var timeText = '<span class="upNextDialog-countdownText">' + globalize.translate('HeaderSecondsValue', secondsRemaining) + '</span>';
+        const timeText = '<span class="upNextDialog-countdownText">' + globalize.translate('HeaderSecondsValue', secondsRemaining) + '</span>';
 
-        var nextVideoText = instance.itemType === 'Episode' ?
+        const nextVideoText = instance.itemType === 'Episode' ?
             globalize.translate('HeaderNextEpisodePlayingInValue', timeText) :
             globalize.translate('HeaderNextVideoPlayingInValue', timeText);
 
@@ -130,9 +142,9 @@ define(['dom', 'playbackManager', 'connectionManager', 'events', 'mediaInfo', 'l
     }
 
     function fillItem(item) {
-        var instance = this;
+        const instance = this;
 
-        var elem = instance.options.parent;
+        const elem = instance.options.parent;
 
         setPoster(elem.querySelector('.upNextDialog-poster'), item);
 
@@ -141,7 +153,7 @@ define(['dom', 'playbackManager', 'connectionManager', 'events', 'mediaInfo', 'l
         elem.querySelector('.upNextDialog-mediainfo').innerHTML = mediaInfo.getPrimaryMediaInfoHtml(item, {
         });
 
-        var title = itemHelper.getDisplayName(item);
+        let title = itemHelper.getDisplayName(item);
         if (item.SeriesName) {
             title = item.SeriesName + ' - ' + title;
         }
@@ -161,10 +173,10 @@ define(['dom', 'playbackManager', 'connectionManager', 'events', 'mediaInfo', 'l
     }
 
     function onStartNowClick() {
-        var options = this.options;
+        const options = this.options;
 
         if (options) {
-            var player = options.player;
+            const player = options.player;
 
             this.hide();
 
@@ -186,7 +198,7 @@ define(['dom', 'playbackManager', 'connectionManager', 'events', 'mediaInfo', 'l
     }
 
     function clearHideAnimationEventListeners(instance, elem) {
-        var fn = instance._onHideAnimationComplete;
+        const fn = instance._onHideAnimationComplete;
 
         if (fn) {
             dom.removeEventListener(elem, transitionEndEventName, fn, {
@@ -196,8 +208,8 @@ define(['dom', 'playbackManager', 'connectionManager', 'events', 'mediaInfo', 'l
     }
 
     function onHideAnimationComplete(e) {
-        var instance = this;
+        const instance = this;
-        var elem = e.target;
+        const elem = e.target;
 
         elem.classList.add('hide');
 
@@ -206,14 +218,14 @@ define(['dom', 'playbackManager', 'connectionManager', 'events', 'mediaInfo', 'l
     }
 
     function hideComingUpNext() {
-        var instance = this;
+        const instance = this;
         clearCountdownTextTimeout(this);
 
         if (!instance.options) {
             return;
         }
 
-        var elem = instance.options.parent;
+        const elem = instance.options.parent;
 
         if (!elem) {
             return;
@@ -230,7 +242,7 @@ define(['dom', 'playbackManager', 'connectionManager', 'events', 'mediaInfo', 'l
 
         elem.classList.add('upNextDialog-hidden');
 
-        var fn = onHideAnimationComplete.bind(instance);
+        const fn = onHideAnimationComplete.bind(instance);
         instance._onHideAnimationComplete = fn;
 
         dom.addEventListener(elem, transitionEndEventName, fn, {
@@ -239,12 +251,12 @@ define(['dom', 'playbackManager', 'connectionManager', 'events', 'mediaInfo', 'l
     }
 
     function getTimeRemainingMs(instance) {
-        var options = instance.options;
+        const options = instance.options;
         if (options) {
-            var runtimeTicks = playbackManager.duration(options.player);
+            const runtimeTicks = playbackManager.duration(options.player);
 
             if (runtimeTicks) {
-                var timeRemainingTicks = runtimeTicks - playbackManager.currentTime(options.player);
+                const timeRemainingTicks = runtimeTicks - playbackManager.currentTime(options.player);
 
                 return Math.round(timeRemainingTicks / 10000);
             }
@@ -254,7 +266,7 @@ define(['dom', 'playbackManager', 'connectionManager', 'events', 'mediaInfo', 'l
     }
 
     function startComingUpNextHideTimer(instance) {
-        var timeRemainingMs = getTimeRemainingMs(instance);
+        const timeRemainingMs = getTimeRemainingMs(instance);
 
         if (timeRemainingMs <= 0) {
             return;
@@ -266,14 +278,14 @@ define(['dom', 'playbackManager', 'connectionManager', 'events', 'mediaInfo', 'l
         instance._countdownTextTimeout = setInterval(setNextVideoText.bind(instance), 400);
     }
 
-    function UpNextDialog(options) {
+class UpNextDialog {
+    constructor(options) {
         this.options = options;
 
         init(this, options);
     }
-
+    show() {
-    UpNextDialog.prototype.show = function () {
+        const elem = this.options.parent;
-        var elem = this.options.parent;
 
         clearHideAnimationEventListeners(this, elem);
 
@@ -291,18 +303,18 @@ define(['dom', 'playbackManager', 'connectionManager', 'events', 'mediaInfo', 'l
         }
 
         startComingUpNextHideTimer(this);
-    };
+    }
-
+    hide() {
-    UpNextDialog.prototype.hide = function () {
         hideComingUpNext.call(this);
-    };
+    }
-
+    destroy() {
-    UpNextDialog.prototype.destroy = function () {
         hideComingUpNext.call(this);
 
         this.options = null;
         this.itemType = null;
-    };
+    }
+}
 
-    return UpNextDialog;
+export default UpNextDialog;
-});
+
+/* eslint-enable indent */

src/components/viewContainer.js

@@ -1,20 +1,20 @@
-define(['browser', 'dom', 'layoutManager', 'css!components/viewManager/viewContainer'], function (browser, dom, layoutManager) {
+import 'css!components/viewManager/viewContainer';
-    'use strict';
+/* eslint-disable indent */
 
     function setControllerClass(view, options) {
         if (options.controllerFactory) {
             return Promise.resolve();
         }
 
-        var controllerUrl = view.getAttribute('data-controller');
+        let controllerUrl = view.getAttribute('data-controller');
 
         if (controllerUrl) {
-            if (0 === controllerUrl.indexOf('__plugin/')) {
+            if (controllerUrl.indexOf('__plugin/') === 0) {
                 controllerUrl = controllerUrl.substring('__plugin/'.length);
             }
 
             controllerUrl = Dashboard.getConfigurationResourceUrl(controllerUrl);
-            return getRequirePromise([controllerUrl]).then(function (ControllerFactory) {
+            return import(controllerUrl).then((ControllerFactory) => {
                 options.controllerFactory = ControllerFactory;
             });
         }
@@ -22,38 +22,30 @@ define(['browser', 'dom', 'layoutManager', 'css!components/viewManager/viewConta
         return Promise.resolve();
     }
 
-    function getRequirePromise(deps) {
+    export function loadView(options) {
-        return new Promise(function (resolve, reject) {
-            require(deps, resolve);
-        });
-    }
-
-    function loadView(options) {
         if (!options.cancel) {
-            var selected = selectedPageIndex;
+            const selected = selectedPageIndex;
-            var previousAnimatable = -1 === selected ? null : allPages[selected];
+            const previousAnimatable = selected === -1 ? null : allPages[selected];
-            var pageIndex = selected + 1;
+            let pageIndex = selected + 1;
 
             if (pageIndex >= pageContainerCount) {
                 pageIndex = 0;
             }
 
-            var isPluginpage = -1 !== options.url.toLowerCase().indexOf('/configurationpage');
+            const isPluginpage = options.url.toLowerCase().indexOf('/configurationpage') !== -1;
-            var newViewInfo = normalizeNewView(options, isPluginpage);
+            const newViewInfo = normalizeNewView(options, isPluginpage);
-            var newView = newViewInfo.elem;
+            const newView = newViewInfo.elem;
-            var modulesToLoad = [];
 
-            return new Promise(function (resolve) {
+            return new Promise((resolve) => {
-                require(modulesToLoad, function () {
+                const currentPage = allPages[pageIndex];
-                    var currentPage = allPages[pageIndex];
 
                 if (currentPage) {
                     triggerDestroy(currentPage);
                 }
 
-                    var view = newView;
+                let view = newView;
 
-                    if ('string' == typeof view) {
+                if (typeof view == 'string') {
                     view = document.createElement('div');
                     view.innerHTML = newView;
                 }
@@ -62,8 +54,8 @@ define(['browser', 'dom', 'layoutManager', 'css!components/viewManager/viewConta
 
                 if (currentPage) {
                     if (newViewInfo.hasScript && window.$) {
-                            view = $(view).appendTo(mainAnimatedPages)[0];
                         mainAnimatedPages.removeChild(currentPage);
+                        view = $(view).appendTo(mainAnimatedPages)[0];
                     } else {
                         mainAnimatedPages.replaceChild(view, currentPage);
                     }
@@ -79,7 +71,7 @@ define(['browser', 'dom', 'layoutManager', 'css!components/viewManager/viewConta
                     view.setAttribute('data-type', options.type);
                 }
 
-                    var properties = [];
+                const properties = [];
 
                 if (options.fullscreen) {
                     properties.push('fullscreen');
@@ -90,7 +82,7 @@ define(['browser', 'dom', 'layoutManager', 'css!components/viewManager/viewConta
                 }
 
                 allPages[pageIndex] = view;
-                    setControllerClass(view, options).then(function () {
+                setControllerClass(view, options).then(() => {
                     if (onBeforeChange) {
                         onBeforeChange(view, false, options);
                     }
@@ -111,7 +103,6 @@ define(['browser', 'dom', 'layoutManager', 'css!components/viewManager/viewConta
                     resolve(view);
                 });
             });
-            });
         }
     }
 
@@ -125,33 +116,33 @@ define(['browser', 'dom', 'layoutManager', 'css!components/viewManager/viewConta
             html = replaceAll(html, '<\/script>--\x3e', '<\/script>');
         }
 
-        var wrapper = document.createElement('div');
+        const wrapper = document.createElement('div');
         wrapper.innerHTML = html;
         return wrapper.querySelector('div[data-role="page"]');
     }
 
     function normalizeNewView(options, isPluginpage) {
-        var viewHtml = options.view;
+        const viewHtml = options.view;
 
-        if (-1 === viewHtml.indexOf('data-role="page"')) {
+        if (viewHtml.indexOf('data-role="page"') === -1) {
             return viewHtml;
         }
 
-        var hasScript = -1 !== viewHtml.indexOf('<script');
+        let hasScript = viewHtml.indexOf('<script') !== -1;
-        var elem = parseHtml(viewHtml, hasScript);
+        const elem = parseHtml(viewHtml, hasScript);
 
         if (hasScript) {
-            hasScript = null != elem.querySelector('script');
+            hasScript = elem.querySelector('script') != null;
         }
 
-        var hasjQuery = false;
+        let hasjQuery = false;
-        var hasjQuerySelect = false;
+        let hasjQuerySelect = false;
-        var hasjQueryChecked = false;
+        let hasjQueryChecked = false;
 
         if (isPluginpage) {
-            hasjQuery = -1 != viewHtml.indexOf('jQuery') || -1 != viewHtml.indexOf('$(') || -1 != viewHtml.indexOf('$.');
+            hasjQuery = viewHtml.indexOf('jQuery') != -1 || viewHtml.indexOf('$(') != -1 || viewHtml.indexOf('$.') != -1;
-            hasjQueryChecked = -1 != viewHtml.indexOf('.checked(');
+            hasjQueryChecked = viewHtml.indexOf('.checked(') != -1;
-            hasjQuerySelect = -1 != viewHtml.indexOf('.selectmenu(');
+            hasjQuerySelect = viewHtml.indexOf('.selectmenu(') != -1;
         }
 
         return {
@@ -164,7 +155,7 @@ define(['browser', 'dom', 'layoutManager', 'css!components/viewManager/viewConta
     }
 
     function beforeAnimate(allPages, newPageIndex, oldPageIndex) {
-        for (var index = 0, length = allPages.length; index < length; index++) {
+        for (let index = 0, length = allPages.length; index < length; index++) {
             if (newPageIndex !== index && oldPageIndex !== index) {
                 allPages[index].classList.add('hide');
             }
@@ -172,33 +163,33 @@ define(['browser', 'dom', 'layoutManager', 'css!components/viewManager/viewConta
     }
 
     function afterAnimate(allPages, newPageIndex) {
-        for (var index = 0, length = allPages.length; index < length; index++) {
+        for (let index = 0, length = allPages.length; index < length; index++) {
             if (newPageIndex !== index) {
                 allPages[index].classList.add('hide');
             }
         }
     }
 
-    function setOnBeforeChange(fn) {
+    export function setOnBeforeChange(fn) {
         onBeforeChange = fn;
     }
 
-    function tryRestoreView(options) {
+    export function tryRestoreView(options) {
-        var url = options.url;
+        const url = options.url;
-        var index = currentUrls.indexOf(url);
+        const index = currentUrls.indexOf(url);
 
-        if (-1 !== index) {
+        if (index !== -1) {
-            var animatable = allPages[index];
+            const animatable = allPages[index];
-            var view = animatable;
+            const view = animatable;
 
             if (view) {
                 if (options.cancel) {
                     return;
                 }
 
-                var selected = selectedPageIndex;
+                const selected = selectedPageIndex;
-                var previousAnimatable = -1 === selected ? null : allPages[selected];
+                const previousAnimatable = selected === -1 ? null : allPages[selected];
-                return setControllerClass(view, options).then(function () {
+                return setControllerClass(view, options).then(() => {
                     if (onBeforeChange) {
                         onBeforeChange(view, true, options);
                     }
@@ -228,25 +219,28 @@ define(['browser', 'dom', 'layoutManager', 'css!components/viewManager/viewConta
         view.dispatchEvent(new CustomEvent('viewdestroy', {}));
     }
 
-    function reset() {
+    export function reset() {
         allPages = [];
         currentUrls = [];
         mainAnimatedPages.innerHTML = '';
         selectedPageIndex = -1;
     }
 
-    var onBeforeChange;
+    let onBeforeChange;
-    var mainAnimatedPages = document.querySelector('.mainAnimatedPages');
+    const mainAnimatedPages = document.querySelector('.mainAnimatedPages');
-    var allPages = [];
+    let allPages = [];
-    var currentUrls = [];
+    let currentUrls = [];
-    var pageContainerCount = 3;
+    const pageContainerCount = 3;
-    var selectedPageIndex = -1;
+    let selectedPageIndex = -1;
     reset();
     mainAnimatedPages.classList.remove('hide');
-    return {
+
+/* eslint-enable indent */
+
+export default {
     loadView: loadView,
     tryRestoreView: tryRestoreView,
     reset: reset,
     setOnBeforeChange: setOnBeforeChange
 };
-});
+

src/config.template.json

@@ -1,3 +1,38 @@
 {
-    "multiserver": false
+    "multiserver": false,
+    "themes": [
+        {
+            "name": "Apple TV",
+            "id": "appletv"
+        }, {
+            "name": "Blue Radiance",
+            "id": "blueradiance"
+        }, {
+            "name": "Dark",
+            "id": "dark",
+            "default": true
+        }, {
+            "name": "Light",
+            "id": "light"
+        }, {
+            "name": "Purple Haze",
+            "id": "purplehaze"
+        }, {
+            "name": "WMC",
+            "id": "wmc"
+        }
+    ],
+    "plugins": [
+        "plugins/playAccessValidation/plugin",
+        "plugins/experimentalWarnings/plugin",
+        "plugins/htmlAudioPlayer/plugin",
+        "plugins/htmlVideoPlayer/plugin",
+        "plugins/photoPlayer/plugin",
+        "plugins/bookPlayer/plugin",
+        "plugins/youtubePlayer/plugin",
+        "plugins/backdropScreensaver/plugin",
+        "plugins/logoScreensaver/plugin",
+        "plugins/sessionPlayer/plugin",
+        "plugins/chromecastPlayer/plugin"
+    ]
 }

src/controllers/dashboard/dashboard.js

@@ -313,7 +313,7 @@ import 'emby-itemscontainer';
                 btnCssClass = session.TranscodingInfo && session.TranscodingInfo.TranscodeReasons && session.TranscodingInfo.TranscodeReasons.length ? '' : ' hide';
                 html += '<button is="paper-icon-button-light" class="sessionCardButton btnSessionInfo paper-icon-button-light ' + btnCssClass + '" title="' + globalize.translate('ViewPlaybackInfo') + '"><span class="material-icons info"></span></button>';
 
-                btnCssClass = session.ServerId && -1 !== session.SupportedCommands.indexOf('DisplayMessage') && session.DeviceId !== connectionManager.deviceId() ? '' : ' hide';
+                btnCssClass = session.ServerId && session.SupportedCommands.indexOf('DisplayMessage') !== -1 && session.DeviceId !== connectionManager.deviceId() ? '' : ' hide';
                 html += '<button is="paper-icon-button-light" class="sessionCardButton btnSessionSendMessage paper-icon-button-light ' + btnCssClass + '" title="' + globalize.translate('SendMessage') + '"><span class="material-icons message"></span></button>';
                 html += '</div>';
 
@@ -346,7 +346,7 @@ import 'emby-itemscontainer';
     function renderRunningTasks(view, tasks) {
         let html = '';
         tasks = tasks.filter(function (task) {
-            if ('Idle' != task.State) {
+            if (task.State != 'Idle') {
                 return !task.IsHidden;
             }
 
@@ -551,7 +551,7 @@ import 'emby-itemscontainer';
                 row.classList.remove('playingSession');
             }
 
-            if (session.ServerId && -1 !== session.SupportedCommands.indexOf('DisplayMessage') && session.DeviceId !== connectionManager.deviceId()) {
+            if (session.ServerId && session.SupportedCommands.indexOf('DisplayMessage') !== -1 && session.DeviceId !== connectionManager.deviceId()) {
                 row.querySelector('.btnSessionSendMessage').classList.remove('hide');
             } else {
                 row.querySelector('.btnSessionSendMessage').classList.add('hide');

src/controllers/dashboard/dlna/profile.js

@@ -29,7 +29,7 @@ import 'listViewStyle';
     function renderProfile(page, profile, users) {
         $('#txtName', page).val(profile.Name);
         $('.chkMediaType', page).each(function () {
-            this.checked = -1 != (profile.SupportedMediaTypes || '').split(',').indexOf(this.getAttribute('data-value'));
+            this.checked = (profile.SupportedMediaTypes || '').split(',').indexOf(this.getAttribute('data-value')) != -1;
         });
         $('#chkEnableAlbumArtInDidl', page).prop('checked', profile.EnableAlbumArtInDidl);
         $('#chkEnableSingleImageLimit', page).prop('checked', profile.EnableSingleAlbumArtLimit);
@@ -111,7 +111,7 @@ import 'listViewStyle';
     }
 
     function editIdentificationHeader(page, header) {
-        isSubProfileNew = null == header;
+        isSubProfileNew = header == null;
         header = header || {};
         currentSubProfile = header;
         const popup = $('#identificationHeaderPopup', page);
@@ -156,7 +156,7 @@ import 'listViewStyle';
     }
 
     function editXmlDocumentAttribute(page, attribute) {
-        isSubProfileNew = null == attribute;
+        isSubProfileNew = attribute == null;
         attribute = attribute || {};
         currentSubProfile = attribute;
         const popup = $('#xmlAttributePopup', page);
@@ -204,7 +204,7 @@ import 'listViewStyle';
     }
 
     function editSubtitleProfile(page, profile) {
-        isSubProfileNew = null == profile;
+        isSubProfileNew = profile == null;
         profile = profile || {};
         currentSubProfile = profile;
         const popup = $('#subtitleProfilePopup', page);
@@ -266,11 +266,11 @@ import 'listViewStyle';
             html += '<a is="emby-linkbutton" href="#" class="lnkEditSubProfile" data-profileindex="' + index + '">';
             html += '<p>' + globalize.translate('ValueContainer', profile.Container || allText) + '</p>';
 
-            if ('Video' == profile.Type) {
+            if (profile.Type == 'Video') {
                 html += '<p>' + globalize.translate('ValueVideoCodec', profile.VideoCodec || allText) + '</p>';
                 html += '<p>' + globalize.translate('ValueAudioCodec', profile.AudioCodec || allText) + '</p>';
             } else {
-                if ('Audio' == profile.Type) {
+                if (profile.Type == 'Audio') {
                     html += '<p>' + globalize.translate('ValueCodec', profile.AudioCodec || allText) + '</p>';
                 }
             }
@@ -298,7 +298,7 @@ import 'listViewStyle';
     }
 
     function editDirectPlayProfile(page, directPlayProfile) {
-        isSubProfileNew = null == directPlayProfile;
+        isSubProfileNew = directPlayProfile == null;
         directPlayProfile = directPlayProfile || {};
         currentSubProfile = directPlayProfile;
         const popup = $('#popupEditDirectPlayProfile', page);
@@ -327,11 +327,11 @@ import 'listViewStyle';
             html += '<p>Protocol: ' + (profile.Protocol || 'Http') + '</p>';
             html += '<p>' + globalize.translate('ValueContainer', profile.Container || allText) + '</p>';
 
-            if ('Video' == profile.Type) {
+            if (profile.Type == 'Video') {
                 html += '<p>' + globalize.translate('ValueVideoCodec', profile.VideoCodec || allText) + '</p>';
                 html += '<p>' + globalize.translate('ValueAudioCodec', profile.AudioCodec || allText) + '</p>';
             } else {
-                if ('Audio' == profile.Type) {
+                if (profile.Type == 'Audio') {
                     html += '<p>' + globalize.translate('ValueCodec', profile.AudioCodec || allText) + '</p>';
                 }
             }
@@ -354,7 +354,7 @@ import 'listViewStyle';
     }
 
     function editTranscodingProfile(page, transcodingProfile) {
-        isSubProfileNew = null == transcodingProfile;
+        isSubProfileNew = transcodingProfile == null;
         transcodingProfile = transcodingProfile || {};
         currentSubProfile = transcodingProfile;
         const popup = $('#transcodingProfilePopup', page);
@@ -365,7 +365,7 @@ import 'listViewStyle';
         $('#selectTranscodingProtocol', popup).val(transcodingProfile.Protocol || 'Http');
         $('#chkEnableMpegtsM2TsMode', popup).prop('checked', transcodingProfile.EnableMpegtsM2TsMode || false);
         $('#chkEstimateContentLength', popup).prop('checked', transcodingProfile.EstimateContentLength || false);
-        $('#chkReportByteRangeRequests', popup).prop('checked', 'Bytes' == transcodingProfile.TranscodeSeekInfo);
+        $('#chkReportByteRangeRequests', popup).prop('checked', transcodingProfile.TranscodeSeekInfo == 'Bytes');
         $('.radioTabButton:first', popup).trigger('click');
         openPopup(popup[0]);
     }
@@ -443,7 +443,7 @@ import 'listViewStyle';
     }
 
     function editContainerProfile(page, containerProfile) {
-        isSubProfileNew = null == containerProfile;
+        isSubProfileNew = containerProfile == null;
         containerProfile = containerProfile || {};
         currentSubProfile = containerProfile;
         const popup = $('#containerProfilePopup', page);
@@ -515,7 +515,7 @@ import 'listViewStyle';
     }
 
     function editCodecProfile(page, codecProfile) {
-        isSubProfileNew = null == codecProfile;
+        isSubProfileNew = codecProfile == null;
         codecProfile = codecProfile || {};
         currentSubProfile = codecProfile;
         const popup = $('#codecProfilePopup', page);
@@ -555,11 +555,11 @@ import 'listViewStyle';
             html += '<a is="emby-linkbutton" href="#" class="lnkEditSubProfile" data-profileindex="' + i + '">';
             html += '<p>' + globalize.translate('ValueContainer', profile.Container || allText) + '</p>';
 
-            if ('Video' == profile.Type) {
+            if (profile.Type == 'Video') {
                 html += '<p>' + globalize.translate('ValueVideoCodec', profile.VideoCodec || allText) + '</p>';
                 html += '<p>' + globalize.translate('ValueAudioCodec', profile.AudioCodec || allText) + '</p>';
             } else {
-                if ('Audio' == profile.Type) {
+                if (profile.Type == 'Audio') {
                     html += '<p>' + globalize.translate('ValueCodec', profile.AudioCodec || allText) + '</p>';
                 }
             }
@@ -595,7 +595,7 @@ import 'listViewStyle';
     }
 
     function editResponseProfile(page, responseProfile) {
-        isSubProfileNew = null == responseProfile;
+        isSubProfileNew = responseProfile == null;
         responseProfile = responseProfile || {};
         currentSubProfile = responseProfile;
         const popup = $('#responseProfilePopup', page);
@@ -703,26 +703,26 @@ import 'listViewStyle';
         $('.radioTabButton', page).on('click', function () {
             $(this).siblings().removeClass('ui-btn-active');
             $(this).addClass('ui-btn-active');
-            const value = 'A' == this.tagName ? this.getAttribute('data-value') : this.value;
+            const value = this.tagName == 'A' ? this.getAttribute('data-value') : this.value;
             const elem = $('.' + value, page);
             elem.siblings('.tabContent').hide();
             elem.show();
         });
         $('#selectDirectPlayProfileType', page).on('change', function () {
-            if ('Video' == this.value) {
+            if (this.value == 'Video') {
                 $('#fldDirectPlayVideoCodec', page).show();
             } else {
                 $('#fldDirectPlayVideoCodec', page).hide();
             }
 
-            if ('Photo' == this.value) {
+            if (this.value == 'Photo') {
                 $('#fldDirectPlayAudioCodec', page).hide();
             } else {
                 $('#fldDirectPlayAudioCodec', page).show();
             }
         });
         $('#selectTranscodingProfileType', page).on('change', function () {
-            if ('Video' == this.value) {
+            if (this.value == 'Video') {
                 $('#fldTranscodingVideoCodec', page).show();
                 $('#fldTranscodingProtocol', page).show();
                 $('#fldEnableMpegtsM2TsMode', page).show();
@@ -732,7 +732,7 @@ import 'listViewStyle';
                 $('#fldEnableMpegtsM2TsMode', page).hide();
             }
 
-            if ('Photo' == this.value) {
+            if (this.value == 'Photo') {
                 $('#fldTranscodingAudioCodec', page).hide();
                 $('#fldEstimateContentLength', page).hide();
                 $('#fldReportByteRangeRequests', page).hide();
@@ -743,13 +743,13 @@ import 'listViewStyle';
             }
         });
         $('#selectResponseProfileType', page).on('change', function () {
-            if ('Video' == this.value) {
+            if (this.value == 'Video') {
                 $('#fldResponseProfileVideoCodec', page).show();
             } else {
                 $('#fldResponseProfileVideoCodec', page).hide();
             }
 
-            if ('Photo' == this.value) {
+            if (this.value == 'Photo') {
                 $('#fldResponseProfileAudioCodec', page).hide();
             } else {
                 $('#fldResponseProfileAudioCodec', page).show();

src/controllers/dashboard/dlna/profiles.js

@@ -18,13 +18,13 @@ import 'emby-button';
 
     function renderUserProfiles(page, profiles) {
         renderProfiles(page, page.querySelector('.customProfiles'), profiles.filter(function (p) {
-            return 'User' == p.Type;
+            return p.Type == 'User';
         }));
     }
 
     function renderSystemProfiles(page, profiles) {
         renderProfiles(page, page.querySelector('.systemProfiles'), profiles.filter(function (p) {
-            return 'System' == p.Type;
+            return p.Type == 'System';
         }));
     }
 
@@ -45,7 +45,7 @@ import 'emby-button';
             html += '</a>';
             html += '</div>';
 
-            if ('User' == profile.Type) {
+            if (profile.Type == 'User') {
                 html += '<button type="button" is="paper-icon-button-light" class="btnDeleteProfile" data-profileid="' + profile.Id + '" title="' + globalize.translate('ButtonDelete') + '"><span class="material-icons delete"></span></button>';
             }
 

src/controllers/dashboard/encodingsettings.js

@@ -8,7 +8,7 @@ import libraryMenu from 'libraryMenu';
 
     function loadPage(page, config, systemInfo) {
         Array.prototype.forEach.call(page.querySelectorAll('.chkDecodeCodec'), function (c) {
-            c.checked = -1 !== (config.HardwareDecodingCodecs || []).indexOf(c.getAttribute('data-codec'));
+            c.checked = (config.HardwareDecodingCodecs || []).indexOf(c.getAttribute('data-codec')) !== -1;
         });
         page.querySelector('#chkDecodingColorDepth10Hevc').checked = config.EnableDecodingColorDepth10Hevc;
         page.querySelector('#chkDecodingColorDepth10Vp9').checked = config.EnableDecodingColorDepth10Vp9;
@@ -81,7 +81,7 @@ import libraryMenu from 'libraryMenu';
                     updateEncoder(form);
                 }, function () {
                     import('alert').then(({default: alert}) => {
-                        alert(globalize.translate('DefaultErrorMessage'));
+                        alert(globalize.translate('ErrorDefault'));
                     });
 
                     Dashboard.processServerConfigurationUpdateResult();
@@ -107,7 +107,7 @@ import libraryMenu from 'libraryMenu';
         value = value || '';
         let any;
         Array.prototype.forEach.call(context.querySelectorAll('.chkDecodeCodec'), function (c) {
-            if (-1 === c.getAttribute('data-types').split(',').indexOf(value)) {
+            if (c.getAttribute('data-types').split(',').indexOf(value) === -1) {
                 dom.parentWithTag(c, 'LABEL').classList.add('hide');
             } else {
                 dom.parentWithTag(c, 'LABEL').classList.remove('hide');
@@ -138,7 +138,7 @@ import libraryMenu from 'libraryMenu';
     $(document).on('pageinit', '#encodingSettingsPage', function () {
         const page = this;
         page.querySelector('#selectVideoDecoder').addEventListener('change', function () {
-            if ('vaapi' == this.value) {
+            if (this.value == 'vaapi') {
                 page.querySelector('.fldVaapiDevice').classList.remove('hide');
                 page.querySelector('#txtVaapiDevice').setAttribute('required', 'required');
             } else {

src/controllers/dashboard/general.js

@@ -52,7 +52,7 @@ import 'emby-button';
                 });
             }, function () {
                 import('alert').then(({default: alert}) => {
-                    alert(globalize.translate('DefaultErrorMessage'));
+                    alert(globalize.translate('ErrorDefault'));
                 });
 
                 Dashboard.processServerConfigurationUpdateResult();

src/controllers/dashboard/librarydisplay.js

@@ -48,7 +48,7 @@ import 'emby-button';
                 ApiClient.updateServerConfiguration(config).then(Dashboard.processServerConfigurationUpdateResult);
             });
             ApiClient.getNamedConfiguration('metadata').then(function(config) {
-                config.UseFileCreationTimeForDateAdded = '1' === $('#selectDateAdded', form).val();
+                config.UseFileCreationTimeForDateAdded = $('#selectDateAdded', form).val() === '1';
                 ApiClient.updateNamedConfiguration('metadata', config);
             });
 
@@ -61,7 +61,7 @@ import 'emby-button';
             libraryMenu.setTabs('librarysetup', 1, getTabs);
             loadData();
             ApiClient.getSystemInfo().then(function(info) {
-                if ('Windows' === info.OperatingSystem) {
+                if (info.OperatingSystem === 'Windows') {
                     view.querySelector('.fldSaveMetadataHidden').classList.remove('hide');
                 } else {
                     view.querySelector('.fldSaveMetadataHidden').classList.add('hide');

src/controllers/dashboard/mediaLibrary.js

@@ -156,7 +156,7 @@ import 'emby-itemrefreshindicator';
     }
 
     function shouldRefreshLibraryAfterChanges(page) {
-        return 'mediaLibraryPage' === page.id;
+        return page.id === 'mediaLibraryPage';
     }
 
     function reloadVirtualFolders(page, virtualFolders) {
@@ -286,7 +286,7 @@ import 'emby-itemrefreshindicator';
 
         if (hasCardImageContainer) {
             html += '<div class="cardIndicators backdropCardIndicators">';
-            html += '<div is="emby-itemrefreshindicator"' + (virtualFolder.RefreshProgress || virtualFolder.RefreshStatus && 'Idle' !== virtualFolder.RefreshStatus ? '' : ' class="hide"') + ' data-progress="' + (virtualFolder.RefreshProgress || 0) + '" data-status="' + virtualFolder.RefreshStatus + '"></div>';
+            html += '<div is="emby-itemrefreshindicator"' + (virtualFolder.RefreshProgress || virtualFolder.RefreshStatus && virtualFolder.RefreshStatus !== 'Idle' ? '' : ' class="hide"') + ' data-progress="' + (virtualFolder.RefreshProgress || 0) + '" data-status="' + virtualFolder.RefreshStatus + '"></div>';
             html += '</div>';
             html += '</div>';
         }

src/controllers/dashboard/networking.js

@@ -30,7 +30,7 @@ import 'emby-select';
                     }).filter(function (s) {
                         return s.length > 0;
                     });
-                    config.IsRemoteIPFilterBlacklist = 'blacklist' === form.querySelector('#selectExternalAddressFilterMode').value;
+                    config.IsRemoteIPFilterBlacklist = form.querySelector('#selectExternalAddressFilterMode').value === 'blacklist';
                     config.PublicPort = form.querySelector('#txtPublicPort').value;
                     config.PublicHttpsPort = form.querySelector('#txtPublicHttpsPort').value;
                     config.HttpServerPortNumber = form.querySelector('#txtPortNumber').value;
@@ -110,7 +110,7 @@ import 'emby-select';
             page.querySelector('#txtLanNetworks').value = (config.LocalNetworkSubnets || []).join(', ');
             page.querySelector('#txtExternalAddressFilter').value = (config.RemoteIPFilter || []).join(', ');
             page.querySelector('#selectExternalAddressFilterMode').value = config.IsRemoteIPFilterBlacklist ? 'blacklist' : 'whitelist';
-            page.querySelector('#chkRemoteAccess').checked = null == config.EnableRemoteAccess || config.EnableRemoteAccess;
+            page.querySelector('#chkRemoteAccess').checked = config.EnableRemoteAccess == null || config.EnableRemoteAccess;
             page.querySelector('#txtHttpsPort').value = config.HttpsPortNumber;
             page.querySelector('#chkEnableHttps').checked = config.EnableHttps;
             page.querySelector('#chkRequireHttps').checked = config.RequireHttps;

src/controllers/dashboard/notifications/notification/index.js

@@ -1,11 +1,11 @@
-define(['jQuery', 'emby-checkbox'], function ($) {
+import $ from 'jQuery';
-    'use strict';
+import 'emby-checkbox';
 
 function fillItems(elem, items, cssClass, idPrefix, currentList, isEnabledList) {
-        var html = '<div class="checkboxList paperList" style="padding: .5em 1em;">';
+    let html = '<div class="checkboxList paperList" style="padding: .5em 1em;">';
     html += items.map(function (u) {
-            var isChecked = isEnabledList ? currentList.indexOf(u.Id) != -1 : currentList.indexOf(u.Id) == -1;
+        const isChecked = isEnabledList ? currentList.indexOf(u.Id) != -1 : currentList.indexOf(u.Id) == -1;
-            var checkedHtml = isChecked ? ' checked="checked"' : '';
+        const checkedHtml = isChecked ? ' checked="checked"' : '';
         return '<label><input is="emby-checkbox" class="' + cssClass + '" type="checkbox" data-itemid="' + u.Id + '"' + checkedHtml + '/><span>' + u.Name + '</span></label>';
     }).join('');
     html += '</div>';
@@ -13,20 +13,20 @@ define(['jQuery', 'emby-checkbox'], function ($) {
 }
 
 function reload(page) {
-        var type = getParameterByName('type');
+    const type = getParameterByName('type');
-        var promise1 = ApiClient.getUsers();
+    const promise1 = ApiClient.getUsers();
-        var promise2 = ApiClient.getNamedConfiguration(notificationsConfigurationKey);
+    const promise2 = ApiClient.getNamedConfiguration(notificationsConfigurationKey);
-        var promise3 = ApiClient.getJSON(ApiClient.getUrl('Notifications/Types'));
+    const promise3 = ApiClient.getJSON(ApiClient.getUrl('Notifications/Types'));
-        var promise4 = ApiClient.getJSON(ApiClient.getUrl('Notifications/Services'));
+    const promise4 = ApiClient.getJSON(ApiClient.getUrl('Notifications/Services'));
     Promise.all([promise1, promise2, promise3, promise4]).then(function (responses) {
-            var users = responses[0];
+        const users = responses[0];
-            var notificationOptions = responses[1];
+        const notificationOptions = responses[1];
-            var types = responses[2];
+        const types = responses[2];
-            var services = responses[3];
+        const services = responses[3];
-            var notificationConfig = notificationOptions.Options.filter(function (n) {
+        let notificationConfig = notificationOptions.Options.filter(function (n) {
             return n.Type == type;
         })[0];
-            var typeInfo = types.filter(function (n) {
+        const typeInfo = types.filter(function (n) {
             return n.Type == type;
         })[0] || {};
 
@@ -56,13 +56,13 @@ define(['jQuery', 'emby-checkbox'], function ($) {
 }
 
 function save(page) {
-        var type = getParameterByName('type');
+    const type = getParameterByName('type');
-        var promise1 = ApiClient.getNamedConfiguration(notificationsConfigurationKey);
+    const promise1 = ApiClient.getNamedConfiguration(notificationsConfigurationKey);
     // TODO: Check if this promise is really needed, as it's unused.
-        var promise2 = ApiClient.getJSON(ApiClient.getUrl('Notifications/Types'));
+    const promise2 = ApiClient.getJSON(ApiClient.getUrl('Notifications/Types'));
     Promise.all([promise1, promise2]).then(function (responses) {
-            var notificationOptions = responses[0];
+        const notificationOptions = responses[0];
-            var notificationConfig = notificationOptions.Options.filter(function (n) {
+        let notificationConfig = notificationOptions.Options.filter(function (n) {
             return n.Type == type;
         })[0];
 
@@ -102,11 +102,11 @@ define(['jQuery', 'emby-checkbox'], function ($) {
     return false;
 }
 
-    var notificationsConfigurationKey = 'notifications';
+const notificationsConfigurationKey = 'notifications';
 $(document).on('pageinit', '#notificationSettingPage', function () {
-        var page = this;
+    const page = this;
     $('#selectUsers', page).on('change', function () {
-            if ('Custom' == this.value) {
+        if (this.value == 'Custom') {
             $('.selectCustomUsers', page).show();
         } else {
             $('.selectCustomUsers', page).hide();
@@ -116,4 +116,3 @@ define(['jQuery', 'emby-checkbox'], function ($) {
 }).on('pageshow', '#notificationSettingPage', function () {
     reload(this);
 });
-});

src/controllers/dashboard/notifications/notifications/index.js

@@ -1,14 +1,16 @@
-define(['loading', 'libraryMenu', 'globalize', 'listViewStyle', 'emby-button'], function(loading, libraryMenu, globalize) {
+import loading from 'loading';
-    'use strict';
+import globalize from 'globalize';
+import 'listViewStyle';
+import 'emby-button';
 
 function reload(page) {
     loading.show();
     ApiClient.getJSON(ApiClient.getUrl('Notifications/Types')).then(function (list) {
-            var html = '';
+        let html = '';
-            var lastCategory = '';
+        let lastCategory = '';
-            var showHelp = true;
+        let showHelp = true;
         html += list.map(function (notification) {
-                var itemHtml = '';
+            let itemHtml = '';
             if (notification.Category !== lastCategory) {
                 lastCategory = notification.Category;
                 if (lastCategory) {
@@ -52,9 +54,8 @@ define(['loading', 'libraryMenu', 'globalize', 'listViewStyle', 'emby-button'],
     });
 }
 
-    return function(view, params) {
+export default function (view, params) {
     view.addEventListener('viewshow', function () {
         reload(view);
     });
-    };
+}
-});

src/controllers/dashboard/plugins/add/index.js

@@ -1,6 +1,8 @@
 define(['jQuery', 'loading', 'libraryMenu', 'globalize', 'connectionManager', 'emby-button'], function ($, loading, libraryMenu, globalize, connectionManager) {
     'use strict';
 
+    loading = loading.default || loading;
+
     function populateHistory(packageInfo, page) {
         var html = '';
         var length = Math.min(packageInfo.versions.length, 10);
@@ -79,7 +81,7 @@ define(['jQuery', 'loading', 'libraryMenu', 'globalize', 'connectionManager', 'e
             page.querySelector('#btnInstall').disabled = true;
             ApiClient.installPlugin(name, guid, version).then(function () {
                 loading.hide();
-                alertText(globalize.translate('PluginInstalledMessage'));
+                alertText(globalize.translate('MessagePluginInstalled'));
             });
         };
 

src/controllers/dashboard/plugins/available/index.js

@@ -2,6 +2,7 @@ define(['loading', 'libraryMenu', 'globalize', 'cardStyle', 'emby-button', 'emby
     'use strict';
 
     libraryMenu = libraryMenu.default || libraryMenu;
+    loading = loading.default || loading;
 
     function reloadList(page) {
         loading.show();
@@ -19,13 +20,13 @@ define(['loading', 'libraryMenu', 'globalize', 'cardStyle', 'emby-button', 'emby
 
     function getHeaderText(category) {
         category = category.replace(' ', '');
-        if ('Channel' === category) {
+        if (category === 'Channel') {
             category = 'Channels';
-        } else if ('Theme' === category) {
+        } else if (category === 'Theme') {
             category = 'Themes';
-        } else if ('LiveTV' === category) {
+        } else if (category === 'LiveTV') {
             category = 'HeaderLiveTV';
-        } else if ('ScreenSaver' === category) {
+        } else if (category === 'ScreenSaver') {
             category = 'HeaderScreenSavers';
         }
 

src/controllers/dashboard/plugins/installed/index.js

@@ -2,16 +2,17 @@ define(['loading', 'libraryMenu', 'dom', 'globalize', 'cardStyle', 'emby-button'
     'use strict';
 
     libraryMenu = libraryMenu.default || libraryMenu;
+    loading = loading.default || loading;
 
     function deletePlugin(page, uniqueid, name) {
         var msg = globalize.translate('UninstallPluginConfirmation', name);
 
         require(['confirm'], function (confirm) {
             confirm.default({
-                title: globalize.translate('UninstallPluginHeader'),
+                title: globalize.translate('HeaderUninstallPlugin'),
                 text: msg,
                 primary: 'delete',
-                confirmText: globalize.translate('UninstallPluginHeader')
+                confirmText: globalize.translate('HeaderUninstallPlugin')
             }).then(function () {
                 loading.show();
                 ApiClient.uninstallPlugin(uniqueid).then(function () {
@@ -23,7 +24,7 @@ define(['loading', 'libraryMenu', 'dom', 'globalize', 'cardStyle', 'emby-button'
 
     function showNoConfigurationMessage() {
         Dashboard.alert({
-            message: globalize.translate('NoPluginConfigurationMessage')
+            message: globalize.translate('MessageNoPluginConfiguration')
         });
     }
 
@@ -97,7 +98,7 @@ define(['loading', 'libraryMenu', 'dom', 'globalize', 'cardStyle', 'emby-button'
             html += '<div class="centerMessage">';
             html += '<h1>' + globalize.translate('MessageNoPluginsInstalled') + '</h1>';
             html += '<p><a is="emby-linkbutton" class="button-link" href="availableplugins.html">';
-            html += globalize.translate('BrowsePluginCatalogMessage');
+            html += globalize.translate('MessageBrowsePluginCatalog');
             html += '</a></p>';
             html += '</div>';
         }

src/controllers/dashboard/scheduledtasks/scheduledtask.js

@@ -84,16 +84,16 @@ import 'emby-select';
         },
         // TODO: Replace this mess with date-fns and remove datetime completely
         getTriggerFriendlyName: function (trigger) {
-            if ('DailyTrigger' == trigger.Type) {
+            if (trigger.Type == 'DailyTrigger') {
                 return globalize.translate('DailyAt', ScheduledTaskPage.getDisplayTime(trigger.TimeOfDayTicks));
             }
 
-            if ('WeeklyTrigger' == trigger.Type) {
+            if (trigger.Type == 'WeeklyTrigger') {
                 // TODO: The day of week isn't localised as well
                 return globalize.translate('WeeklyAt', trigger.DayOfWeek, ScheduledTaskPage.getDisplayTime(trigger.TimeOfDayTicks));
             }
 
-            if ('SystemEventTrigger' == trigger.Type && 'WakeFromSleep' == trigger.SystemEvent) {
+            if (trigger.Type == 'SystemEventTrigger' && trigger.SystemEvent == 'WakeFromSleep') {
                 return globalize.translate('OnWakeFromSleep');
             }
 

src/controllers/dashboard/users/useredit.js

@@ -14,13 +14,13 @@ import globalize from 'globalize';
             let html = '';
 
             for (const folder of mediaFolders) {
-                isChecked = user.Policy.EnableContentDeletion || -1 != user.Policy.EnableContentDeletionFromFolders.indexOf(folder.Id);
+                isChecked = user.Policy.EnableContentDeletion || user.Policy.EnableContentDeletionFromFolders.indexOf(folder.Id) != -1;
                 checkedAttribute = isChecked ? ' checked="checked"' : '';
                 html += '<label><input type="checkbox" is="emby-checkbox" class="chkFolder" data-id="' + folder.Id + '" ' + checkedAttribute + '><span>' + folder.Name + '</span></label>';
             }
 
             for (const folder of channelsResult.Items) {
-                isChecked = user.Policy.EnableContentDeletion || -1 != user.Policy.EnableContentDeletionFromFolders.indexOf(folder.Id);
+                isChecked = user.Policy.EnableContentDeletion || user.Policy.EnableContentDeletionFromFolders.indexOf(folder.Id) != -1;
                 checkedAttribute = isChecked ? ' checked="checked"' : '';
                 html += '<label><input type="checkbox" is="emby-checkbox" class="chkFolder" data-id="' + folder.Id + '" ' + checkedAttribute + '><span>' + folder.Name + '</span></label>';
             }
@@ -96,7 +96,7 @@ import globalize from 'globalize';
         $('#chkEnableVideoPlaybackTranscoding', page).prop('checked', user.Policy.EnableVideoPlaybackTranscoding);
         $('#chkEnableVideoPlaybackRemuxing', page).prop('checked', user.Policy.EnablePlaybackRemuxing);
         $('#chkForceRemoteSourceTranscoding', page).prop('checked', user.Policy.ForceRemoteSourceTranscoding);
-        $('#chkRemoteAccess', page).prop('checked', null == user.Policy.EnableRemoteAccess || user.Policy.EnableRemoteAccess);
+        $('#chkRemoteAccess', page).prop('checked', user.Policy.EnableRemoteAccess == null || user.Policy.EnableRemoteAccess);
         $('#chkEnableSyncTranscoding', page).prop('checked', user.Policy.EnableSyncTranscoding);
         $('#chkEnableConversion', page).prop('checked', user.Policy.EnableMediaConversion || false);
         $('#chkEnableSharing', page).prop('checked', user.Policy.EnablePublicSharing);

src/controllers/dashboard/users/userlibraryaccess.js

@@ -18,7 +18,7 @@ import globalize from 'globalize';
 
         for (let i = 0, length = mediaFolders.length; i < length; i++) {
             const folder = mediaFolders[i];
-            const isChecked = user.Policy.EnableAllFolders || -1 != user.Policy.EnabledFolders.indexOf(folder.Id);
+            const isChecked = user.Policy.EnableAllFolders || user.Policy.EnabledFolders.indexOf(folder.Id) != -1;
             const checkedAttribute = isChecked ? ' checked="checked"' : '';
             html += '<label><input type="checkbox" is="emby-checkbox" class="chkFolder" data-id="' + folder.Id + '" ' + checkedAttribute + '><span>' + folder.Name + '</span></label>';
         }
@@ -37,7 +37,7 @@ import globalize from 'globalize';
 
         for (let i = 0, length = channels.length; i < length; i++) {
             const folder = channels[i];
-            const isChecked = user.Policy.EnableAllChannels || -1 != user.Policy.EnabledChannels.indexOf(folder.Id);
+            const isChecked = user.Policy.EnableAllChannels || user.Policy.EnabledChannels.indexOf(folder.Id) != -1;
             const checkedAttribute = isChecked ? ' checked="checked"' : '';
             html += '<label><input type="checkbox" is="emby-checkbox" class="chkChannel" data-id="' + folder.Id + '" ' + checkedAttribute + '><span>' + folder.Name + '</span></label>';
         }
@@ -61,7 +61,7 @@ import globalize from 'globalize';
 
         for (let i = 0, length = devices.length; i < length; i++) {
             const device = devices[i];
-            const checkedAttribute = user.Policy.EnableAllDevices || -1 != user.Policy.EnabledDevices.indexOf(device.Id) ? ' checked="checked"' : '';
+            const checkedAttribute = user.Policy.EnableAllDevices || user.Policy.EnabledDevices.indexOf(device.Id) != -1 ? ' checked="checked"' : '';
             html += '<label><input type="checkbox" is="emby-checkbox" class="chkDevice" data-id="' + device.Id + '" ' + checkedAttribute + '><span>' + device.Name + ' - ' + device.AppName + '</span></label>';
         }
 

src/controllers/dashboard/users/usernew.js

@@ -89,7 +89,7 @@ import 'emby-checkbox';
             });
         }, function (response) {
             import('toast').then(({default: toast}) => {
-                toast(globalize.translate('DefaultErrorMessage'));
+                toast(globalize.translate('ErrorDefault'));
             });
 
             loading.hide();

src/controllers/dashboard/users/userparentalcontrol.js

@@ -67,7 +67,7 @@ import 'paper-icon-button-light';
 
         for (let i = 0, length = items.length; i < length; i++) {
             const item = items[i];
-            const checkedAttribute = -1 != user.Policy.BlockUnratedItems.indexOf(item.value) ? ' checked="checked"' : '';
+            const checkedAttribute = user.Policy.BlockUnratedItems.indexOf(item.value) != -1 ? ' checked="checked"' : '';
             html += '<label><input type="checkbox" is="emby-checkbox" class="chkUnratedItem" data-itemtype="' + item.value + '" type="checkbox"' + checkedAttribute + '><span>' + item.name + '</span></label>';
         }
 
@@ -201,7 +201,7 @@ import 'paper-icon-button-light';
             }).then(function (updatedSchedule) {
                 const schedules = getSchedulesFromPage(page);
 
-                if (-1 == index) {
+                if (index == -1) {
                     index = schedules.length;
                 }
 
@@ -234,7 +234,7 @@ import 'paper-icon-button-light';
             }).then(function (value) {
                 const tags = getBlockedTagsFromPage(page);
 
-                if (-1 == tags.indexOf(value)) {
+                if (tags.indexOf(value) == -1) {
                     tags.push(value);
                     loadBlockedTags(page, tags);
                 }

src/controllers/dashboard/users/userpasswordpage.js

@@ -14,7 +14,7 @@ import 'emby-button';
                 let showPasswordSection = true;
                 let showLocalAccessSection = false;
 
-                if ('Guest' == user.ConnectLinkType) {
+                if (user.ConnectLinkType == 'Guest') {
                     page.querySelector('.localAccessSection').classList.add('hide');
                     showPasswordSection = false;
                 } else if (user.HasConfiguredPassword) {
@@ -145,14 +145,14 @@ import 'emby-button';
         function resetPassword() {
             const msg = globalize.translate('PasswordResetConfirmation');
             import('confirm').then(({default: confirm}) => {
-                confirm(msg, globalize.translate('PasswordResetHeader')).then(function () {
+                confirm(msg, globalize.translate('HeaderResetPassword')).then(function () {
                     const userId = params.userId;
                     loading.show();
                     ApiClient.resetUserPassword(userId).then(function () {
                         loading.hide();
                         Dashboard.alert({
                             message: globalize.translate('PasswordResetComplete'),
-                            title: globalize.translate('PasswordResetHeader')
+                            title: globalize.translate('HeaderResetPassword')
                         });
                         loadUser(view, params);
                     });

src/controllers/dashboard/users/userprofilespage.js

@@ -129,7 +129,7 @@ import 'flexStyles';
         html += '</div>';
         html += '<div class="cardText cardText-secondary">';
         const lastSeen = getLastSeenText(user.LastActivityDate);
-        html += '' != lastSeen ? lastSeen : '&nbsp;';
+        html += lastSeen != '' ? lastSeen : '&nbsp;';
         html += '</div>';
         html += '</div>';
         html += '</div>';

src/controllers/edititemmetadata.js

@@ -1,11 +1,11 @@
-define(['loading', 'scripts/editorsidebar'], function (loading) {
+import loading from 'loading';
-    'use strict';
+import 'scripts/editorsidebar';
 
 function reload(context, itemId) {
     loading.show();
 
     if (itemId) {
-            require(['metadataEditor'], function ({default: metadataEditor}) {
+        import('metadataEditor').then(({ default: metadataEditor }) => {
             metadataEditor.embed(context.querySelector('.editPageInnerContent'), itemId, ApiClient.serverInfo().Id);
         });
     } else {
@@ -14,7 +14,7 @@ define(['loading', 'scripts/editorsidebar'], function (loading) {
     }
 }
 
-    return function (view, params) {
+export default function (view, params) {
     view.addEventListener('viewshow', function () {
         reload(this, MetadataEditor.getCurrentItemId());
     });
@@ -27,5 +27,4 @@ define(['loading', 'scripts/editorsidebar'], function (loading) {
             reload(view, data.id);
         }
     });
-    };
+}
-});

src/controllers/favorites.js

@@ -1,5 +1,15 @@
-define(['appRouter', 'cardBuilder', 'dom', 'globalize', 'connectionManager', 'apphost', 'layoutManager', 'focusManager', 'emby-itemscontainer', 'emby-scroller'], function (appRouter, cardBuilder, dom, globalize, connectionManager, appHost, layoutManager, focusManager) {
+import appRouter from 'appRouter';
-    'use strict';
+import cardBuilder from 'cardBuilder';
+import dom from 'dom';
+import globalize from 'globalize';
+import connectionManager from 'connectionManager';
+import appHost from 'apphost';
+import layoutManager from 'layoutManager';
+import focusManager from 'focusManager';
+import 'emby-itemscontainer';
+import 'emby-scroller';
+
+/* eslint-disable indent */
 
     function enableScrollX() {
         return true;
@@ -133,8 +143,8 @@ define(['appRouter', 'cardBuilder', 'dom', 'globalize', 'connectionManager', 'ap
 
     function getFetchDataFn(section) {
         return function () {
-            var apiClient = this.apiClient;
+            const apiClient = this.apiClient;
-            var options = {
+            const options = {
                 SortBy: (section.types, 'SeriesName,SortName'),
                 SortOrder: 'Ascending',
                 Filters: 'IsFavorite',
@@ -145,13 +155,13 @@ define(['appRouter', 'cardBuilder', 'dom', 'globalize', 'connectionManager', 'ap
                 EnableTotalRecordCount: false
             };
             options.Limit = 20;
-            var userId = apiClient.getCurrentUserId();
+            const userId = apiClient.getCurrentUserId();
 
-            if ('MusicArtist' === section.types) {
+            if (section.types === 'MusicArtist') {
                 return apiClient.getArtists(userId, options);
             }
 
-            if ('Person' === section.types) {
+            if (section.types === 'Person') {
                 return apiClient.getPeople(userId, options);
             }
 
@@ -170,16 +180,16 @@ define(['appRouter', 'cardBuilder', 'dom', 'globalize', 'connectionManager', 'ap
 
     function getItemsHtmlFn(section) {
         return function (items) {
-            var cardLayout = appHost.preferVisualCards && section.autoCardLayout && section.showTitle;
+            let cardLayout = appHost.preferVisualCards && section.autoCardLayout && section.showTitle;
             cardLayout = false;
-            var serverId = this.apiClient.serverId();
+            const serverId = this.apiClient.serverId();
-            var leadingButtons = layoutManager.tv ? [{
+            const leadingButtons = layoutManager.tv ? [{
                 name: globalize.translate('All'),
                 id: 'more',
                 icon: 'favorite',
                 routeUrl: getRouteUrl(section, serverId)
             }] : null;
-            var lines = 0;
+            let lines = 0;
 
             if (section.showTitle) {
                 lines++;
@@ -198,7 +208,7 @@ define(['appRouter', 'cardBuilder', 'dom', 'globalize', 'connectionManager', 'ap
                 preferThumb: section.preferThumb,
                 shape: section.shape,
                 centerText: section.centerText && !cardLayout,
-                overlayText: false !== section.overlayText,
+                overlayText: section.overlayText !== false,
                 showTitle: section.showTitle,
                 showYear: section.showYear,
                 showParentTitle: section.showParentTitle,
@@ -215,23 +225,12 @@ define(['appRouter', 'cardBuilder', 'dom', 'globalize', 'connectionManager', 'ap
         };
     }
 
-    function FavoritesTab(view, params) {
-        this.view = view;
-        this.params = params;
-        this.apiClient = connectionManager.currentApiClient();
-        this.sectionsContainer = view.querySelector('.sections');
-        createSections(this, this.sectionsContainer, this.apiClient);
-    }
-
     function createSections(instance, elem, apiClient) {
-        var i;
+        const sections = getSections();
-        var length;
+        let html = '';
-        var sections = getSections();
-        var html = '';
 
-        for (i = 0, length = sections.length; i < length; i++) {
+        for (const section of sections) {
-            var section = sections[i];
+            let sectionClass = 'verticalSection';
-            var sectionClass = 'verticalSection';
 
             if (!section.showTitle) {
                 sectionClass += ' verticalSection-extrabottompadding';
@@ -257,23 +256,32 @@ define(['appRouter', 'cardBuilder', 'dom', 'globalize', 'connectionManager', 'ap
         }
 
         elem.innerHTML = html;
-        var elems = elem.querySelectorAll('.itemsContainer');
+        const elems = elem.querySelectorAll('.itemsContainer');
 
-        for (i = 0, length = elems.length; i < length; i++) {
+        for (let i = 0, length = elems.length; i < length; i++) {
-            var itemsContainer = elems[i];
+            const itemsContainer = elems[i];
             itemsContainer.fetchData = getFetchDataFn(sections[i]).bind(instance);
             itemsContainer.getItemsHtml = getItemsHtmlFn(sections[i]).bind(instance);
             itemsContainer.parentContainer = dom.parentWithClass(itemsContainer, 'verticalSection');
         }
     }
 
-    FavoritesTab.prototype.onResume = function (options) {
+class FavoritesTab {
-        var promises = (this.apiClient, []);
+    constructor(view, params) {
-        var view = this.view;
+        this.view = view;
-        var elems = this.sectionsContainer.querySelectorAll('.itemsContainer');
+        this.params = params;
+        this.apiClient = connectionManager.currentApiClient();
+        this.sectionsContainer = view.querySelector('.sections');
+        createSections(this, this.sectionsContainer, this.apiClient);
+    }
 
-        for (var i = 0, length = elems.length; i < length; i++) {
+    onResume(options) {
-            promises.push(elems[i].resume(options));
+        const promises = (this.apiClient, []);
+        const view = this.view;
+        const elems = this.sectionsContainer.querySelectorAll('.itemsContainer');
+
+        for (const elem of elems) {
+            promises.push(elem.resume(options));
         }
 
         Promise.all(promises).then(function () {
@@ -281,30 +289,32 @@ define(['appRouter', 'cardBuilder', 'dom', 'globalize', 'connectionManager', 'ap
                 focusManager.autoFocus(view);
             }
         });
-    };
-
-    FavoritesTab.prototype.onPause = function () {
-        var elems = this.sectionsContainer.querySelectorAll('.itemsContainer');
-
-        for (var i = 0, length = elems.length; i < length; i++) {
-            elems[i].pause();
     }
-    };
 
-    FavoritesTab.prototype.destroy = function () {
+    onPause() {
+        const elems = this.sectionsContainer.querySelectorAll('.itemsContainer');
+
+        for (const elem of elems) {
+            elem.pause();
+        }
+    }
+
+    destroy() {
         this.view = null;
         this.params = null;
         this.apiClient = null;
-        var elems = this.sectionsContainer.querySelectorAll('.itemsContainer');
+        const elems = this.sectionsContainer.querySelectorAll('.itemsContainer');
 
-        for (var i = 0, length = elems.length; i < length; i++) {
+        for (const elem of elems) {
-            elems[i].fetchData = null;
+            elem.fetchData = null;
-            elems[i].getItemsHtml = null;
+            elem.getItemsHtml = null;
-            elems[i].parentContainer = null;
+            elem.parentContainer = null;
         }
 
         this.sectionsContainer = null;
-    };
+    }
+}
 
-    return FavoritesTab;
+export default FavoritesTab;
-});
+
+/* eslint-enable indent */

src/controllers/home.js

@@ -36,7 +36,7 @@ class HomeView extends TabbedView {
     }
 
     getTabController(index) {
-        if (null == index) {
+        if (index == null) {
             throw new Error('index cannot be null');
         }
 
@@ -56,7 +56,7 @@ class HomeView extends TabbedView {
             let controller = instance.tabControllers[index];
 
             if (!controller) {
-                controller = new controllerFactory(instance.view.querySelector(".tabContent[data-index='" + index + "']"), instance.params);
+                controller = new controllerFactory.default(instance.view.querySelector(".tabContent[data-index='" + index + "']"), instance.params);
                 instance.tabControllers[index] = controller;
             }
 

src/controllers/hometab.js

@@ -1,13 +1,66 @@
-define(['userSettings', 'loading', 'connectionManager', 'apphost', 'layoutManager', 'focusManager', 'homeSections', 'emby-itemscontainer'], function (userSettings, loading, connectionManager, appHost, layoutManager, focusManager, homeSections) {
+import * as userSettings from 'userSettings';
-    'use strict';
+import loading from 'loading';
+import connectionManager from 'connectionManager';
+import focusManager from 'focusManager';
+import homeSections from 'homeSections';
+import 'emby-itemscontainer';
 
-    function HomeTab(view, params) {
+class HomeTab {
+    constructor(view, params) {
         this.view = view;
         this.params = params;
         this.apiClient = connectionManager.currentApiClient();
         this.sectionsContainer = view.querySelector('.sections');
         view.querySelector('.sections').addEventListener('settingschange', onHomeScreenSettingsChanged.bind(this));
     }
+    onResume(options) {
+        if (this.sectionsRendered) {
+            const sectionsContainer = this.sectionsContainer;
+
+            if (sectionsContainer) {
+                return homeSections.resume(sectionsContainer, options);
+            }
+
+            return Promise.resolve();
+        }
+
+        loading.show();
+        const view = this.view;
+        const apiClient = this.apiClient;
+        this.destroyHomeSections();
+        this.sectionsRendered = true;
+        return apiClient.getCurrentUser().then(function (user) {
+            return homeSections.loadSections(view.querySelector('.sections'), apiClient, user, userSettings).then(function () {
+                if (options.autoFocus) {
+                    focusManager.autoFocus(view);
+                }
+
+                loading.hide();
+            });
+        });
+    }
+    onPause() {
+        const sectionsContainer = this.sectionsContainer;
+
+        if (sectionsContainer) {
+            homeSections.pause(sectionsContainer);
+        }
+    }
+    destroy() {
+        this.view = null;
+        this.params = null;
+        this.apiClient = null;
+        this.destroyHomeSections();
+        this.sectionsContainer = null;
+    }
+    destroyHomeSections() {
+        const sectionsContainer = this.sectionsContainer;
+
+        if (sectionsContainer) {
+            homeSections.destroySections(sectionsContainer);
+        }
+    }
+}
 
 function onHomeScreenSettingsChanged() {
     this.sectionsRendered = false;
@@ -19,56 +72,4 @@ define(['userSettings', 'loading', 'connectionManager', 'apphost', 'layoutManage
     }
 }
 
-    HomeTab.prototype.onResume = function (options) {
+export default HomeTab;
-        if (this.sectionsRendered) {
-            var sectionsContainer = this.sectionsContainer;
-
-            if (sectionsContainer) {
-                return homeSections.resume(sectionsContainer, options);
-            }
-
-            return Promise.resolve();
-        }
-
-        loading.show();
-        var view = this.view;
-        var apiClient = this.apiClient;
-        this.destroyHomeSections();
-        this.sectionsRendered = true;
-        return apiClient.getCurrentUser().then(function (user) {
-            return homeSections.loadSections(view.querySelector('.sections'), apiClient, user, userSettings).then(function () {
-                if (options.autoFocus) {
-                    focusManager.autoFocus(view);
-                }
-
-                loading.hide();
-            });
-        });
-    };
-
-    HomeTab.prototype.onPause = function () {
-        var sectionsContainer = this.sectionsContainer;
-
-        if (sectionsContainer) {
-            homeSections.pause(sectionsContainer);
-        }
-    };
-
-    HomeTab.prototype.destroy = function () {
-        this.view = null;
-        this.params = null;
-        this.apiClient = null;
-        this.destroyHomeSections();
-        this.sectionsContainer = null;
-    };
-
-    HomeTab.prototype.destroyHomeSections = function () {
-        var sectionsContainer = this.sectionsContainer;
-
-        if (sectionsContainer) {
-            homeSections.destroySections(sectionsContainer);
-        }
-    };
-
-    return HomeTab;
-});

src/controllers/list.js

@@ -1,6 +1,9 @@
 define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager', 'cardBuilder', 'loading', 'connectionManager', 'alphaNumericShortcuts', 'scroller', 'playbackManager', 'alphaPicker', 'emby-itemscontainer', 'emby-scroller'], function (globalize, listView, layoutManager, userSettings, focusManager, cardBuilder, loading, connectionManager, AlphaNumericShortcuts, scroller, playbackManager, AlphaPicker) {
     'use strict';
 
+    playbackManager = playbackManager.default || playbackManager;
+    loading = loading.default || loading;
+
     function getInitialLiveTvQuery(instance, params) {
         var query = {
             UserId: connectionManager.getApiClient(params.serverId).getCurrentUserId(),
@@ -9,7 +12,7 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager'
             Limit: 300
         };
 
-        if ('Recordings' === params.type) {
+        if (params.type === 'Recordings') {
             query.IsInProgress = false;
         } else {
             query.HasAired = false;
@@ -19,39 +22,39 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager'
             query.GenreIds = params.genreId;
         }
 
-        if ('true' === params.IsMovie) {
+        if (params.IsMovie === 'true') {
             query.IsMovie = true;
-        } else if ('false' === params.IsMovie) {
+        } else if (params.IsMovie === 'false') {
             query.IsMovie = false;
         }
 
-        if ('true' === params.IsSeries) {
+        if (params.IsSeries === 'true') {
             query.IsSeries = true;
-        } else if ('false' === params.IsSeries) {
+        } else if (params.IsSeries === 'false') {
             query.IsSeries = false;
         }
 
-        if ('true' === params.IsNews) {
+        if (params.IsNews === 'true') {
             query.IsNews = true;
-        } else if ('false' === params.IsNews) {
+        } else if (params.IsNews === 'false') {
             query.IsNews = false;
         }
 
-        if ('true' === params.IsSports) {
+        if (params.IsSports === 'true') {
             query.IsSports = true;
-        } else if ('false' === params.IsSports) {
+        } else if (params.IsSports === 'false') {
             query.IsSports = false;
         }
 
-        if ('true' === params.IsKids) {
+        if (params.IsKids === 'true') {
             query.IsKids = true;
-        } else if ('false' === params.IsKids) {
+        } else if (params.IsKids === 'false') {
             query.IsKids = false;
         }
 
-        if ('true' === params.IsAiring) {
+        if (params.IsAiring === 'true') {
             query.IsAiring = true;
-        } else if ('false' === params.IsAiring) {
+        } else if (params.IsAiring === 'false') {
             query.IsAiring = false;
         }
 
@@ -181,13 +184,13 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager'
             var btnSortIcon = instance.btnSortIcon;
 
             if (btnSortIcon) {
-                setSortButtonIcon(btnSortIcon, 'Descending' === values.sortOrder ? 'arrow_downward' : 'arrow_upward');
+                setSortButtonIcon(btnSortIcon, values.sortOrder === 'Descending' ? 'arrow_downward' : 'arrow_upward');
             }
         }
     }
 
     function updateItemsContainerForViewType(instance) {
-        if ('list' === instance.getViewSettings().imageType) {
+        if (instance.getViewSettings().imageType === 'list') {
             instance.itemsContainer.classList.remove('vertical-wrap');
             instance.itemsContainer.classList.add('vertical-list');
         } else {
@@ -203,11 +206,11 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager'
             if (alphaPicker) {
                 var values = instance.getSortValues();
 
-                if (null == numItems) {
+                if (numItems == null) {
                     numItems = 100;
                 }
 
-                if ('SortName' === values.sortBy && 'Ascending' === values.sortOrder && numItems > 40) {
+                if (values.sortBy === 'SortName' && values.sortOrder === 'Ascending' && numItems > 40) {
                     alphaPicker.classList.remove('hide');
                     instance.itemsContainer.parentNode.classList.add('padded-right-withalphapicker');
                 } else {
@@ -222,19 +225,19 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager'
         var apiClient = connectionManager.getApiClient(params.serverId);
 
         instance.queryRecursive = false;
-        if ('Recordings' === params.type) {
+        if (params.type === 'Recordings') {
             return apiClient.getLiveTvRecordings(getInitialLiveTvQuery(instance, params));
         }
 
-        if ('Programs' === params.type) {
+        if (params.type === 'Programs') {
-            if ('true' === params.IsAiring) {
+            if (params.IsAiring === 'true') {
                 return apiClient.getLiveTvRecommendedPrograms(getInitialLiveTvQuery(instance, params));
             }
 
             return apiClient.getLiveTvPrograms(getInitialLiveTvQuery(instance, params));
         }
 
-        if ('nextup' === params.type) {
+        if (params.type === 'nextup') {
             return apiClient.getNextUpEpisodes(modifyQueryWithFilters(instance, {
                 Limit: limit,
                 Fields: 'PrimaryImageAspectRatio,SeriesInfo,DateCreated,BasicSyncInfo',
@@ -250,9 +253,9 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager'
             instance.queryRecursive = true;
             var method = 'getItems';
 
-            if ('MusicArtist' === params.type) {
+            if (params.type === 'MusicArtist') {
                 method = 'getArtists';
-            } else if ('Person' === params.type) {
+            } else if (params.type === 'Person') {
                 method = 'getPeople';
             }
 
@@ -261,15 +264,15 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager'
                 Limit: limit,
                 Fields: 'PrimaryImageAspectRatio,SortName',
                 ImageTypeLimit: 1,
-                IncludeItemTypes: 'MusicArtist' === params.type || 'Person' === params.type ? null : params.type,
+                IncludeItemTypes: params.type === 'MusicArtist' || params.type === 'Person' ? null : params.type,
                 Recursive: true,
-                IsFavorite: 'true' === params.IsFavorite || null,
+                IsFavorite: params.IsFavorite === 'true' || null,
                 ArtistIds: params.artistId || null,
                 SortBy: sortBy
             }));
         }
 
-        if ('Genre' === item.Type || 'MusicGenre' === item.Type || 'Studio' === item.Type || 'Person' === item.Type) {
+        if (item.Type === 'Genre' || item.Type === 'MusicGenre' || item.Type === 'Studio' || item.Type === 'Person') {
             instance.queryRecursive = true;
             var query = {
                 StartIndex: startIndex,
@@ -280,25 +283,25 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager'
                 SortBy: sortBy
             };
 
-            if ('Studio' === item.Type) {
+            if (item.Type === 'Studio') {
                 query.StudioIds = item.Id;
-            } else if ('Genre' === item.Type || 'MusicGenre' === item.Type) {
+            } else if (item.Type === 'Genre' || item.Type === 'MusicGenre') {
                 query.GenreIds = item.Id;
-            } else if ('Person' === item.Type) {
+            } else if (item.Type === 'Person') {
                 query.PersonIds = item.Id;
             }
 
-            if ('MusicGenre' === item.Type) {
+            if (item.Type === 'MusicGenre') {
                 query.IncludeItemTypes = 'MusicAlbum';
-            } else if ('GameGenre' === item.Type) {
+            } else if (item.Type === 'GameGenre') {
                 query.IncludeItemTypes = 'Game';
-            } else if ('movies' === item.CollectionType) {
+            } else if (item.CollectionType === 'movies') {
                 query.IncludeItemTypes = 'Movie';
-            } else if ('tvshows' === item.CollectionType) {
+            } else if (item.CollectionType === 'tvshows') {
                 query.IncludeItemTypes = 'Series';
-            } else if ('Genre' === item.Type) {
+            } else if (item.Type === 'Genre') {
                 query.IncludeItemTypes = 'Movie,Series,Video';
-            } else if ('Person' === item.Type) {
+            } else if (item.Type === 'Person') {
                 query.IncludeItemTypes = params.type;
             }
 
@@ -316,7 +319,7 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager'
     }
 
     function getItem(params) {
-        if ('Recordings' === params.type || 'Programs' === params.type || 'nextup' === params.type) {
+        if (params.type === 'Recordings' || params.type === 'Programs' || params.type === 'nextup') {
             return Promise.resolve(null);
         }
 
@@ -412,7 +415,7 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager'
     function ItemsView(view, params) {
         function fetchData() {
             return getItems(self, params, self.currentItem).then(function (result) {
-                if (null == self.totalItemCount) {
+                if (self.totalItemCount == null) {
                     self.totalItemCount = result.Items ? result.Items.length : result.length;
                 }
 
@@ -424,7 +427,7 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager'
         function getItemsHtml(items) {
             var settings = self.getViewSettings();
 
-            if ('list' === settings.imageType) {
+            if (settings.imageType === 'list') {
                 return listView.getListViewHtml({
                     items: items
                 });
@@ -438,24 +441,24 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager'
             var item = self.currentItem;
             var lines = settings.showTitle ? 2 : 0;
 
-            if ('banner' === settings.imageType) {
+            if (settings.imageType === 'banner') {
                 shape = 'banner';
-            } else if ('disc' === settings.imageType) {
+            } else if (settings.imageType === 'disc') {
                 shape = 'square';
                 preferDisc = true;
-            } else if ('logo' === settings.imageType) {
+            } else if (settings.imageType === 'logo') {
                 shape = 'backdrop';
                 preferLogo = true;
-            } else if ('thumb' === settings.imageType) {
+            } else if (settings.imageType === 'thumb') {
                 shape = 'backdrop';
                 preferThumb = true;
-            } else if ('nextup' === params.type) {
+            } else if (params.type === 'nextup') {
                 shape = 'backdrop';
-                preferThumb = 'thumb' === settings.imageType;
+                preferThumb = settings.imageType === 'thumb';
-            } else if ('Programs' === params.type || 'Recordings' === params.type) {
+            } else if (params.type === 'Programs' || params.type === 'Recordings') {
-                shape = 'true' === params.IsMovie ? 'portrait' : 'autoVertical';
+                shape = params.IsMovie === 'true' ? 'portrait' : 'autoVertical';
-                preferThumb = 'true' !== params.IsMovie ? 'auto' : false;
+                preferThumb = params.IsMovie !== 'true' ? 'auto' : false;
-                defaultShape = 'true' === params.IsMovie ? 'portrait' : 'backdrop';
+                defaultShape = params.IsMovie === 'true' ? 'portrait' : 'backdrop';
             } else {
                 shape = 'autoVertical';
             }
@@ -473,46 +476,46 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager'
                 overlayMoreButton: true,
                 overlayText: !settings.showTitle,
                 defaultShape: defaultShape,
-                action: 'Audio' === params.type ? 'playallfromhere' : null
+                action: params.type === 'Audio' ? 'playallfromhere' : null
             };
 
-            if ('nextup' === params.type) {
+            if (params.type === 'nextup') {
                 posterOptions.showParentTitle = settings.showTitle;
-            } else if ('Person' === params.type) {
+            } else if (params.type === 'Person') {
                 posterOptions.showYear = false;
                 posterOptions.showParentTitle = false;
                 lines = 1;
-            } else if ('Audio' === params.type) {
+            } else if (params.type === 'Audio') {
                 posterOptions.showParentTitle = settings.showTitle;
-            } else if ('MusicAlbum' === params.type) {
+            } else if (params.type === 'MusicAlbum') {
                 posterOptions.showParentTitle = settings.showTitle;
-            } else if ('Episode' === params.type) {
+            } else if (params.type === 'Episode') {
                 posterOptions.showParentTitle = settings.showTitle;
-            } else if ('MusicArtist' === params.type) {
+            } else if (params.type === 'MusicArtist') {
                 posterOptions.showYear = false;
                 lines = 1;
-            } else if ('Programs' === params.type) {
+            } else if (params.type === 'Programs') {
                 lines = settings.showTitle ? 1 : 0;
-                var showParentTitle = settings.showTitle && 'true' !== params.IsMovie;
+                var showParentTitle = settings.showTitle && params.IsMovie !== 'true';
 
                 if (showParentTitle) {
                     lines++;
                 }
 
-                var showAirTime = settings.showTitle && 'Recordings' !== params.type;
+                var showAirTime = settings.showTitle && params.type !== 'Recordings';
 
                 if (showAirTime) {
                     lines++;
                 }
 
-                var showYear = settings.showTitle && 'true' === params.IsMovie && 'Recordings' === params.type;
+                var showYear = settings.showTitle && params.IsMovie === 'true' && params.type === 'Recordings';
 
                 if (showYear) {
                     lines++;
                 }
 
                 posterOptions = Object.assign(posterOptions, {
-                    inheritThumb: 'Recordings' === params.type,
+                    inheritThumb: params.type === 'Recordings',
                     context: 'livetv',
                     showParentTitle: showParentTitle,
                     showAirTime: showAirTime,
@@ -529,7 +532,7 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager'
             posterOptions.lines = lines;
             posterOptions.items = items;
 
-            if (item && 'folders' === item.CollectionType) {
+            if (item && item.CollectionType === 'folders') {
                 posterOptions.context = 'folders';
             }
 
@@ -561,7 +564,7 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager'
         function setTitle(item) {
             Emby.Page.setTitle(getTitle(item) || '');
 
-            if (item && 'playlists' === item.CollectionType) {
+            if (item && item.CollectionType === 'playlists') {
                 hideOrShowAll(view.querySelectorAll('.btnNewItem'), false);
             } else {
                 hideOrShowAll(view.querySelectorAll('.btnNewItem'), true);
@@ -569,43 +572,43 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager'
         }
 
         function getTitle(item) {
-            if ('Recordings' === params.type) {
+            if (params.type === 'Recordings') {
                 return globalize.translate('Recordings');
             }
 
-            if ('Programs' === params.type) {
+            if (params.type === 'Programs') {
-                if ('true' === params.IsMovie) {
+                if (params.IsMovie === 'true') {
                     return globalize.translate('Movies');
                 }
 
-                if ('true' === params.IsSports) {
+                if (params.IsSports === 'true') {
                     return globalize.translate('Sports');
                 }
 
-                if ('true' === params.IsKids) {
+                if (params.IsKids === 'true') {
                     return globalize.translate('HeaderForKids');
                 }
 
-                if ('true' === params.IsAiring) {
+                if (params.IsAiring === 'true') {
                     return globalize.translate('HeaderOnNow');
                 }
 
-                if ('true' === params.IsSeries) {
+                if (params.IsSeries === 'true') {
                     return globalize.translate('Shows');
                 }
 
-                if ('true' === params.IsNews) {
+                if (params.IsNews === 'true') {
                     return globalize.translate('News');
                 }
 
                 return globalize.translate('Programs');
             }
 
-            if ('nextup' === params.type) {
+            if (params.type === 'nextup') {
                 return globalize.translate('NextUp');
             }
 
-            if ('favoritemovies' === params.type) {
+            if (params.type === 'favoritemovies') {
                 return globalize.translate('FavoriteMovies');
             }
 
@@ -613,35 +616,35 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager'
                 return item.Name;
             }
 
-            if ('Movie' === params.type) {
+            if (params.type === 'Movie') {
                 return globalize.translate('Movies');
             }
 
-            if ('Series' === params.type) {
+            if (params.type === 'Series') {
                 return globalize.translate('Shows');
             }
 
-            if ('Season' === params.type) {
+            if (params.type === 'Season') {
                 return globalize.translate('Seasons');
             }
 
-            if ('Episode' === params.type) {
+            if (params.type === 'Episode') {
                 return globalize.translate('Episodes');
             }
 
-            if ('MusicArtist' === params.type) {
+            if (params.type === 'MusicArtist') {
                 return globalize.translate('Artists');
             }
 
-            if ('MusicAlbum' === params.type) {
+            if (params.type === 'MusicAlbum') {
                 return globalize.translate('Albums');
             }
 
-            if ('Audio' === params.type) {
+            if (params.type === 'Audio') {
                 return globalize.translate('Songs');
             }
 
-            if ('Video' === params.type) {
+            if (params.type === 'Video') {
                 return globalize.translate('Videos');
             }
 
@@ -700,11 +703,11 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager'
 
         if (params.parentId) {
             this.itemsContainer.setAttribute('data-parentid', params.parentId);
-        } else if ('nextup' === params.type) {
+        } else if (params.type === 'nextup') {
             this.itemsContainer.setAttribute('data-monitor', 'videoplayback');
-        } else if ('favoritemovies' === params.type) {
+        } else if (params.type === 'favoritemovies') {
             this.itemsContainer.setAttribute('data-monitor', 'markfavorite');
-        } else if ('Programs' === params.type) {
+        } else if (params.type === 'Programs') {
             this.itemsContainer.setAttribute('data-refreshinterval', '300000');
         }
 
@@ -737,7 +740,7 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager'
             var sortButton = sortButtons[i];
             sortButton.addEventListener('click', showSortMenu.bind(this));
 
-            if ('nextup' !== params.type) {
+            if (params.type !== 'nextup') {
                 sortButton.classList.remove('hide');
             }
         }
@@ -772,19 +775,19 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager'
                     }
                 });
 
-                if (!isRestored && item && 'PhotoAlbum' !== item.Type) {
+                if (!isRestored && item && item.Type !== 'PhotoAlbum') {
                     initAlphaPicker();
                 }
 
                 var itemType = item ? item.Type : null;
 
-                if ('MusicGenre' === itemType || 'Programs' !== params.type && 'Channel' !== itemType) {
+                if (itemType === 'MusicGenre' || params.type !== 'Programs' && itemType !== 'Channel') {
                     hideOrShowAll(view.querySelectorAll('.btnPlay'), false);
                 } else {
                     hideOrShowAll(view.querySelectorAll('.btnPlay'), true);
                 }
 
-                if ('MusicGenre' === itemType || 'Programs' !== params.type && 'nextup' !== params.type && 'Channel' !== itemType) {
+                if (itemType === 'MusicGenre' || params.type !== 'Programs' && params.type !== 'nextup' && itemType !== 'Channel') {
                     hideOrShowAll(view.querySelectorAll('.btnShuffle'), false);
                 } else {
                     hideOrShowAll(view.querySelectorAll('.btnShuffle'), true);
@@ -845,14 +848,14 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager'
     ItemsView.prototype.getFilters = function () {
         var basekey = this.getSettingsKey();
         return {
-            IsPlayed: 'true' === userSettings.getFilter(basekey + '-filter-IsPlayed'),
+            IsPlayed: userSettings.getFilter(basekey + '-filter-IsPlayed') === 'true',
-            IsUnplayed: 'true' === userSettings.getFilter(basekey + '-filter-IsUnplayed'),
+            IsUnplayed: userSettings.getFilter(basekey + '-filter-IsUnplayed') === 'true',
-            IsFavorite: 'true' === userSettings.getFilter(basekey + '-filter-IsFavorite'),
+            IsFavorite: userSettings.getFilter(basekey + '-filter-IsFavorite') === 'true',
-            IsResumable: 'true' === userSettings.getFilter(basekey + '-filter-IsResumable'),
+            IsResumable: userSettings.getFilter(basekey + '-filter-IsResumable') === 'true',
-            Is4K: 'true' === userSettings.getFilter(basekey + '-filter-Is4K'),
+            Is4K: userSettings.getFilter(basekey + '-filter-Is4K') === 'true',
-            IsHD: 'true' === userSettings.getFilter(basekey + '-filter-IsHD'),
+            IsHD: userSettings.getFilter(basekey + '-filter-IsHD') === 'true',
-            IsSD: 'true' === userSettings.getFilter(basekey + '-filter-IsSD'),
+            IsSD: userSettings.getFilter(basekey + '-filter-IsSD') === 'true',
-            Is3D: 'true' === userSettings.getFilter(basekey + '-filter-Is3D'),
+            Is3D: userSettings.getFilter(basekey + '-filter-Is3D') === 'true',
             VideoTypes: userSettings.getFilter(basekey + '-filter-VideoTypes'),
             SeriesStatus: userSettings.getFilter(basekey + '-filter-SeriesStatus'),
             HasSubtitles: userSettings.getFilter(basekey + '-filter-HasSubtitles'),
@@ -868,7 +871,7 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager'
         var basekey = this.getSettingsKey();
         return {
             sortBy: userSettings.getFilter(basekey + '-sortby') || this.getDefaultSortBy(),
-            sortOrder: 'Descending' === userSettings.getFilter(basekey + '-sortorder') ? 'Descending' : 'Ascending'
+            sortOrder: userSettings.getFilter(basekey + '-sortorder') === 'Descending' ? 'Descending' : 'Ascending'
         };
     };
 
@@ -887,7 +890,7 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager'
         var sortBy = [];
         var params = this.params;
 
-        if ('Programs' === params.type) {
+        if (params.type === 'Programs') {
             sortBy.push({
                 name: globalize.translate('AirDate'),
                 value: 'StartDate,SortName'
@@ -912,7 +915,7 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager'
             sortBy.push(option);
         }
 
-        if ('Programs' !== params.type) {
+        if (params.type !== 'Programs') {
             sortBy.push({
                 name: globalize.translate('DateAdded'),
                 value: 'DateCreated,SortName'
@@ -955,7 +958,7 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager'
     };
 
     ItemsView.prototype.getNameSortOption = function (params) {
-        if ('Episode' === params.type) {
+        if (params.type === 'Episode') {
             return {
                 name: globalize.translate('Name'),
                 value: 'SeriesName,SortName'
@@ -969,7 +972,7 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager'
     };
 
     ItemsView.prototype.getPlayCountSortOption = function () {
-        if ('Programs' === this.params.type) {
+        if (this.params.type === 'Programs') {
             return null;
         }
 
@@ -980,7 +983,7 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager'
     };
 
     ItemsView.prototype.getDatePlayedSortOption = function () {
-        if ('Programs' === this.params.type) {
+        if (this.params.type === 'Programs') {
             return null;
         }
 
@@ -991,7 +994,7 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager'
     };
 
     ItemsView.prototype.getCriticRatingSortOption = function () {
-        if ('Programs' === this.params.type) {
+        if (this.params.type === 'Programs') {
             return null;
         }
 
@@ -1012,8 +1015,8 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager'
         var filters = [];
         var params = this.params;
 
-        if (!('nextup' === params.type)) {
+        if (!(params.type === 'nextup')) {
-            if ('Programs' === params.type) {
+            if (params.type === 'Programs') {
                 filters.push('Genres');
             } else {
                 filters.push('IsUnplayed');
@@ -1081,7 +1084,7 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager'
         var item = (this.params, this.currentItem);
         var fields = ['showTitle'];
 
-        if (!item || 'PhotoAlbum' !== item.Type && 'ChannelFolderItem' !== item.Type) {
+        if (!item || item.Type !== 'PhotoAlbum' && item.Type !== 'ChannelFolderItem') {
             fields.push('imageType');
         }
 
@@ -1095,25 +1098,25 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager'
         var item = this.currentItem;
         var showTitle = userSettings.get(basekey + '-showTitle');
 
-        if ('true' === showTitle) {
+        if (showTitle === 'true') {
             showTitle = true;
-        } else if ('false' === showTitle) {
+        } else if (showTitle === 'false') {
             showTitle = false;
-        } else if ('Programs' === params.type || 'Recordings' === params.type || 'Person' === params.type || 'nextup' === params.type || 'Audio' === params.type || 'MusicAlbum' === params.type || 'MusicArtist' === params.type) {
+        } else if (params.type === 'Programs' || params.type === 'Recordings' || params.type === 'Person' || params.type === 'nextup' || params.type === 'Audio' || params.type === 'MusicAlbum' || params.type === 'MusicArtist') {
             showTitle = true;
-        } else if (item && 'PhotoAlbum' !== item.Type) {
+        } else if (item && item.Type !== 'PhotoAlbum') {
             showTitle = true;
         }
 
         var imageType = userSettings.get(basekey + '-imageType');
 
-        if (!imageType && 'nextup' === params.type) {
+        if (!imageType && params.type === 'nextup') {
             imageType = 'thumb';
         }
 
         return {
             showTitle: showTitle,
-            showYear: 'false' !== userSettings.get(basekey + '-showYear'),
+            showYear: userSettings.get(basekey + '-showYear') !== 'false',
             imageType: imageType || 'primary',
             viewType: userSettings.get(basekey + '-viewType') || 'images'
         };
@@ -1122,11 +1125,11 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager'
     ItemsView.prototype.getItemTypes = function () {
         var params = this.params;
 
-        if ('nextup' === params.type) {
+        if (params.type === 'nextup') {
             return ['Episode'];
         }
 
-        if ('Programs' === params.type) {
+        if (params.type === 'Programs') {
             return ['Program'];
         }
 

src/controllers/livetv/livetvchannels.js

@@ -1,6 +1,7 @@
 define(['cardBuilder', 'imageLoader', 'libraryBrowser', 'loading', 'events', 'userSettings', 'emby-itemscontainer'], function (cardBuilder, imageLoader, libraryBrowser, loading, events, userSettings) {
     'use strict';
 
+    loading = loading.default || loading;
     libraryBrowser = libraryBrowser.default || libraryBrowser;
 
     return function (view, params, tabContent) {

src/controllers/livetv/livetvrecordings.js

@@ -1,6 +1,8 @@
 define(['layoutManager', 'loading', 'cardBuilder', 'apphost', 'imageLoader', 'scripts/livetvcomponents', 'listViewStyle', 'emby-itemscontainer'], function (layoutManager, loading, cardBuilder, appHost, imageLoader) {
     'use strict';
 
+    loading = loading.default || loading;
+
     function renderRecordings(elem, recordings, cardOptions, scrollX) {
         if (!elem) {
             return;

src/controllers/livetv/livetvschedule.js

@@ -1,6 +1,8 @@
 define(['layoutManager', 'cardBuilder', 'apphost', 'imageLoader', 'loading', 'scripts/livetvcomponents', 'emby-button', 'emby-itemscontainer'], function (layoutManager, cardBuilder, appHost, imageLoader, loading) {
     'use strict';
 
+    loading = loading.default || loading;
+
     function enableScrollX() {
         return !layoutManager.desktop;
     }

src/controllers/livetv/livetvseriestimers.js

@@ -1,6 +1,8 @@
 define(['datetime', 'cardBuilder', 'imageLoader', 'apphost', 'loading', 'paper-icon-button-light', 'emby-button'], function (datetime, cardBuilder, imageLoader, appHost, loading) {
     'use strict';
 
+    loading = loading.default || loading;
+
     function renderTimers(context, timers) {
         var html = '';
         html += cardBuilder.getCardsHtml({

src/controllers/livetv/livetvsuggested.js

@@ -1,6 +1,8 @@
 define(['layoutManager', 'userSettings', 'inputManager', 'loading', 'globalize', 'libraryBrowser', 'mainTabsManager', 'cardBuilder', 'apphost', 'imageLoader', 'scrollStyles', 'emby-itemscontainer', 'emby-tabs', 'emby-button'], function (layoutManager, userSettings, inputManager, loading, globalize, libraryBrowser, mainTabsManager, cardBuilder, appHost, imageLoader) {
     'use strict';
 
+    loading = loading.default || loading;
+
     function enableScrollX() {
         return !layoutManager.desktop;
     }
@@ -142,9 +144,9 @@ define(['layoutManager', 'userSettings', 'inputManager', 'loading', 'globalize',
             coverImage: true,
             overlayText: false,
             lazy: true,
-            overlayPlayButton: 'play' === overlayButton,
+            overlayPlayButton: overlayButton === 'play',
-            overlayMoreButton: 'more' === overlayButton,
+            overlayMoreButton: overlayButton === 'more',
-            overlayInfoButton: 'info' === overlayButton,
+            overlayInfoButton: overlayButton === 'info',
             allowBottomPadding: !enableScrollX(),
             showAirTime: true,
             showAirDateTime: true
@@ -261,7 +263,7 @@ define(['layoutManager', 'userSettings', 'inputManager', 'loading', 'globalize',
             require(depends, function (controllerFactory) {
                 var tabContent;
 
-                if (0 == index) {
+                if (index == 0) {
                     tabContent = view.querySelector(".pageTabContent[data-index='" + index + "']");
                     self.tabContent = tabContent;
                 }
@@ -271,9 +273,9 @@ define(['layoutManager', 'userSettings', 'inputManager', 'loading', 'globalize',
                 if (!controller) {
                     tabContent = view.querySelector(".pageTabContent[data-index='" + index + "']");
 
-                    if (0 === index) {
+                    if (index === 0) {
                         controller = self;
-                    } else if (6 === index) {
+                    } else if (index === 6) {
                         controller = new controllerFactory(view, tabContent, {
                             collectionType: 'livetv'
                         });
@@ -305,8 +307,8 @@ define(['layoutManager', 'userSettings', 'inputManager', 'loading', 'globalize',
             getTabController(page, index, function (controller) {
                 initialTabIndex = null;
 
-                if (-1 == renderedTabs.indexOf(index)) {
+                if (renderedTabs.indexOf(index) == -1) {
-                    if (1 === index) {
+                    if (index === 1) {
                         renderedTabs.push(index);
                     }
 

src/controllers/livetvguideprovider.js

@@ -1,22 +1,23 @@
-define(['events', 'loading', 'globalize'], function (events, loading, globalize) {
+import events from 'events';
-    'use strict';
+import loading from 'loading';
+import globalize from 'globalize';
 
 function onListingsSubmitted() {
     Dashboard.navigate('livetvstatus.html');
 }
 
 function init(page, type, providerId) {
-        var url = 'components/tvproviders/' + type + '.js';
+    const url = 'components/tvproviders/' + type + '.js';
 
-        require([url], function (factory) {
+    import(url).then(({default: factory}) => {
-            var instance = new factory(page, providerId, {});
+        const instance = new factory(page, providerId, {});
         events.on(instance, 'submitted', onListingsSubmitted);
         instance.init();
     });
 }
 
 function loadTemplate(page, type, providerId) {
-        require(['text!./components/tvproviders/' + type + '.template.html'], function (html) {
+    import('text!./../components/tvproviders/' + type + '.template.html').then(({default: html}) => {
         page.querySelector('.providerTemplate').innerHTML = globalize.translateHtml(html);
         init(page, type, providerId);
     });
@@ -24,7 +25,6 @@ define(['events', 'loading', 'globalize'], function (events, loading, globalize)
 
 pageIdOn('pageshow', 'liveTvGuideProviderPage', function () {
     loading.show();
-        var providerId = getParameterByName('id');
+    const providerId = getParameterByName('id');
     loadTemplate(this, getParameterByName('type'), providerId);
 });
-});

src/controllers/livetvsettings.js

@@ -1,5 +1,7 @@
-define(['jQuery', 'loading', 'globalize', 'emby-button'], function ($, loading, globalize) {
+import $ from 'jQuery';
-    'use strict';
+import loading from 'loading';
+import globalize from 'globalize';
+import 'emby-button';
 
 function loadPage(page, config) {
     $('.liveTvSettingsForm', page).show();
@@ -17,13 +19,13 @@ define(['jQuery', 'loading', 'globalize', 'emby-button'], function ($, loading,
 
 function onSubmit() {
     loading.show();
-        var form = this;
+    const form = this;
     ApiClient.getNamedConfiguration('livetv').then(function (config) {
         config.GuideDays = $('#selectGuideDays', form).val() || null;
-            var recordingPath = form.querySelector('#txtRecordingPath').value || null;
+        const recordingPath = form.querySelector('#txtRecordingPath').value || null;
-            var movieRecordingPath = form.querySelector('#txtMovieRecordingPath').value || null;
+        const movieRecordingPath = form.querySelector('#txtMovieRecordingPath').value || null;
-            var seriesRecordingPath = form.querySelector('#txtSeriesRecordingPath').value || null;
+        const seriesRecordingPath = form.querySelector('#txtSeriesRecordingPath').value || null;
-            var recordingPathChanged = recordingPath != config.RecordingPath || movieRecordingPath != config.MovieRecordingPath || seriesRecordingPath != config.SeriesRecordingPath;
+        const recordingPathChanged = recordingPath != config.RecordingPath || movieRecordingPath != config.MovieRecordingPath || seriesRecordingPath != config.SeriesRecordingPath;
         config.RecordingPath = recordingPath;
         config.MovieRecordingPath = movieRecordingPath;
         config.SeriesRecordingPath = seriesRecordingPath;
@@ -41,25 +43,26 @@ define(['jQuery', 'loading', 'globalize', 'emby-button'], function ($, loading,
 }
 
 function showSaveMessage(recordingPathChanged) {
-        var msg = '';
+    let msg = '';
 
     if (recordingPathChanged) {
-            msg += globalize.translate('RecordingPathChangeMessage');
+        msg += globalize.translate('MessageChangeRecordingPath');
     }
 
     if (msg) {
-            require(['alert'], function (alert) {
+        import('alert').then(({default: alert}) => {
             alert(msg);
         });
     }
 }
 
+export default function () {
     $(document).on('pageinit', '#liveTvSettingsPage', function () {
-        var page = this;
+        const page = this;
         $('.liveTvSettingsForm').off('submit', onSubmit).on('submit', onSubmit);
         $('#btnSelectRecordingPath', page).on('click.selectDirectory', function () {
-            require(['directorybrowser'], function (directoryBrowser) {
+            import('directorybrowser').then(({default: directoryBrowser}) => {
-                var picker = new directoryBrowser.default();
+                const picker = new directoryBrowser();
                 picker.show({
                     callback: function (path) {
                         if (path) {
@@ -73,8 +76,8 @@ define(['jQuery', 'loading', 'globalize', 'emby-button'], function ($, loading,
             });
         });
         $('#btnSelectMovieRecordingPath', page).on('click.selectDirectory', function () {
-            require(['directorybrowser'], function (directoryBrowser) {
+            import('directorybrowser').then(({default: directoryBrowser}) => {
-                var picker = new directoryBrowser.default();
+                const picker = new directoryBrowser();
                 picker.show({
                     callback: function (path) {
                         if (path) {
@@ -88,8 +91,8 @@ define(['jQuery', 'loading', 'globalize', 'emby-button'], function ($, loading,
             });
         });
         $('#btnSelectSeriesRecordingPath', page).on('click.selectDirectory', function () {
-            require(['directorybrowser'], function (directoryBrowser) {
+            import('directorybrowser').then(({default: directoryBrowser}) => {
-                var picker = new directoryBrowser.default();
+                const picker = new directoryBrowser();
                 picker.show({
                     callback: function (path) {
                         if (path) {
@@ -103,8 +106,8 @@ define(['jQuery', 'loading', 'globalize', 'emby-button'], function ($, loading,
             });
         });
         $('#btnSelectPostProcessorPath', page).on('click.selectDirectory', function () {
-            require(['directorybrowser'], function (directoryBrowser) {
+            import('directorybrowser').then(({default: directoryBrowser}) => {
-                var picker = new directoryBrowser.default();
+                const picker = new directoryBrowser();
                 picker.show({
                     includeFiles: true,
                     callback: function (path) {
@@ -119,9 +122,9 @@ define(['jQuery', 'loading', 'globalize', 'emby-button'], function ($, loading,
         });
     }).on('pageshow', '#liveTvSettingsPage', function () {
         loading.show();
-        var page = this;
+        const page = this;
         ApiClient.getNamedConfiguration('livetv').then(function (config) {
             loadPage(page, config);
         });
     });
-});
+}

src/controllers/livetvstatus.js

@@ -1,13 +1,24 @@
-define(['jQuery', 'globalize', 'scripts/taskbutton', 'dom', 'libraryMenu', 'layoutManager', 'loading', 'browser', 'listViewStyle', 'flexStyles', 'emby-itemscontainer', 'cardStyle', 'material-icons', 'emby-button'], function ($, globalize, taskButton, dom, libraryMenu, layoutManager, loading, browser) {
+import $ from 'jQuery';
-    'use strict';
+import globalize from 'globalize';
+import taskButton from 'scripts/taskbutton';
+import dom from 'dom';
+import layoutManager from 'layoutManager';
+import loading from 'loading';
+import browser from 'browser';
+import 'listViewStyle';
+import 'flexStyles';
+import 'emby-itemscontainer';
+import 'cardStyle';
+import 'material-icons';
+import 'emby-button';
 
-    var enableFocusTransform = !browser.slow && !browser.edge;
+const enableFocusTransform = !browser.slow && !browser.edge;
 
 function getDeviceHtml(device) {
-        var padderClass;
+    let padderClass;
-        var html = '';
+    let html = '';
-        var cssClass = 'card scalableCard';
+    let cssClass = 'card scalableCard';
-        var cardBoxCssClass = 'cardBox visualCardBox';
+    let cardBoxCssClass = 'cardBox visualCardBox';
     cssClass += ' backdropCard backdropCard-scalable';
     padderClass = 'cardPadder-backdrop';
 
@@ -41,15 +52,14 @@ define(['jQuery', 'globalize', 'scripts/taskbutton', 'dom', 'libraryMenu', 'layo
 }
 
 function renderDevices(page, devices) {
-        var html = devices.map(getDeviceHtml).join('');
+    page.querySelector('.devicesList').innerHTML = devices.map(getDeviceHtml).join('');
-        page.querySelector('.devicesList').innerHTML = html;
 }
 
 function deleteDevice(page, id) {
-        var message = globalize.translate('MessageConfirmDeleteTunerDevice');
+    const message = globalize.translate('MessageConfirmDeleteTunerDevice');
 
-        require(['confirm'], function (confirm) {
+    import('confirm').then(({default: confirm}) => {
-            confirm.default(message, globalize.translate('HeaderDeleteDevice')).then(function () {
+        confirm(message, globalize.translate('HeaderDeleteDevice')).then(function () {
             loading.show();
             ApiClient.ajax({
                 type: 'DELETE',
@@ -93,13 +103,13 @@ define(['jQuery', 'globalize', 'scripts/taskbutton', 'dom', 'libraryMenu', 'layo
 }
 
 function renderProviders(page, providers) {
-        var html = '';
+    let html = '';
 
     if (providers.length) {
         html += '<div class="paperList">';
 
-            for (var i = 0, length = providers.length; i < length; i++) {
+        for (let i = 0, length = providers.length; i < length; i++) {
-                var provider = providers[i];
+            const provider = providers[i];
             html += '<div class="listItem">';
             html += '<span class="listItemIcon material-icons dvr"></span>';
             html += '<div class="listItemBody two-line">';
@@ -119,15 +129,15 @@ define(['jQuery', 'globalize', 'scripts/taskbutton', 'dom', 'libraryMenu', 'layo
         html += '</div>';
     }
 
-        var elem = $('.providerList', page).html(html);
+    const elem = $('.providerList', page).html(html);
     $('.btnOptions', elem).on('click', function () {
-            var id = this.getAttribute('data-id');
+        const id = this.getAttribute('data-id');
         showProviderOptions(page, id, this);
     });
 }
 
 function showProviderOptions(page, providerId, button) {
-        var items = [];
+    const items = [];
     items.push({
         name: globalize.translate('ButtonDelete'),
         id: 'delete'
@@ -137,7 +147,7 @@ define(['jQuery', 'globalize', 'scripts/taskbutton', 'dom', 'libraryMenu', 'layo
         id: 'map'
     });
 
-        require(['actionsheet'], function (actionsheet) {
+    import('actionsheet').then(({default: actionsheet}) => {
         actionsheet.show({
             items: items,
             positionTo: button
@@ -155,8 +165,8 @@ define(['jQuery', 'globalize', 'scripts/taskbutton', 'dom', 'libraryMenu', 'layo
 }
 
 function mapChannels(page, providerId) {
-        require(['components/channelMapper/channelMapper'], function (channelMapper) {
+    import('components/channelMapper/channelMapper').then(({default: channelMapper}) => {
-            new channelMapper.default({
+        new channelMapper({
             serverId: ApiClient.serverInfo().Id,
             providerId: providerId
         }).show();
@@ -164,10 +174,10 @@ define(['jQuery', 'globalize', 'scripts/taskbutton', 'dom', 'libraryMenu', 'layo
 }
 
 function deleteProvider(page, id) {
-        var message = globalize.translate('MessageConfirmDeleteGuideProvider');
+    const message = globalize.translate('MessageConfirmDeleteGuideProvider');
 
-        require(['confirm'], function (confirm) {
+    import('confirm').then(({default: confirm}) => {
-            confirm.default(message, globalize.translate('HeaderDeleteProvider')).then(function () {
+        confirm(message, globalize.translate('HeaderDeleteProvider')).then(function () {
             loading.show();
             ApiClient.ajax({
                 type: 'DELETE',
@@ -219,7 +229,7 @@ define(['jQuery', 'globalize', 'scripts/taskbutton', 'dom', 'libraryMenu', 'layo
 }
 
 function addProvider(button) {
-        var menuItems = [];
+    const menuItems = [];
     menuItems.push({
         name: 'Schedules Direct',
         id: 'SchedulesDirect'
@@ -229,7 +239,7 @@ define(['jQuery', 'globalize', 'scripts/taskbutton', 'dom', 'libraryMenu', 'layo
         id: 'xmltv'
     });
 
-        require(['actionsheet'], function (actionsheet) {
+    import('actionsheet').then(({default: actionsheet}) => {
         actionsheet.show({
             items: menuItems,
             positionTo: button,
@@ -245,7 +255,7 @@ define(['jQuery', 'globalize', 'scripts/taskbutton', 'dom', 'libraryMenu', 'layo
 }
 
 function showDeviceMenu(button, tunerDeviceId) {
-        var items = [];
+    const items = [];
     items.push({
         name: globalize.translate('ButtonDelete'),
         id: 'delete'
@@ -255,7 +265,7 @@ define(['jQuery', 'globalize', 'scripts/taskbutton', 'dom', 'libraryMenu', 'layo
         id: 'edit'
     });
 
-        require(['actionsheet'], function (actionsheet) {
+    import('actionsheet').then(({default: actionsheet}) => {
         actionsheet.show({
             items: items,
             positionTo: button
@@ -273,11 +283,11 @@ define(['jQuery', 'globalize', 'scripts/taskbutton', 'dom', 'libraryMenu', 'layo
 }
 
 function onDevicesListClick(e) {
-        var card = dom.parentWithClass(e.target, 'card');
+    const card = dom.parentWithClass(e.target, 'card');
 
     if (card) {
-            var id = card.getAttribute('data-id');
+        const id = card.getAttribute('data-id');
-            var btnCardOptions = dom.parentWithClass(e.target, 'btnCardOptions');
+        const btnCardOptions = dom.parentWithClass(e.target, 'btnCardOptions');
 
         if (btnCardOptions) {
             showDeviceMenu(btnCardOptions, id);
@@ -287,8 +297,9 @@ define(['jQuery', 'globalize', 'scripts/taskbutton', 'dom', 'libraryMenu', 'layo
     }
 }
 
+export default function () {
     $(document).on('pageinit', '#liveTvStatusPage', function () {
-        var page = this;
+        const page = this;
         $('.btnAddDevice', page).on('click', function () {
             addDevice(this);
         });
@@ -301,21 +312,21 @@ define(['jQuery', 'globalize', 'scripts/taskbutton', 'dom', 'libraryMenu', 'layo
         });
         page.querySelector('.devicesList').addEventListener('click', onDevicesListClick);
     }).on('pageshow', '#liveTvStatusPage', function () {
-        var page = this;
+        const page = this;
         reload(page);
-        taskButton.default({
+        taskButton({
             mode: 'on',
             progressElem: page.querySelector('.refreshGuideProgress'),
             taskKey: 'RefreshGuide',
             button: page.querySelector('.btnRefresh')
         });
     }).on('pagehide', '#liveTvStatusPage', function () {
-        var page = this;
+        const page = this;
-        taskButton.default({
+        taskButton({
             mode: 'off',
             progressElem: page.querySelector('.refreshGuideProgress'),
             taskKey: 'RefreshGuide',
             button: page.querySelector('.btnRefresh')
         });
     });
-});
+}

src/controllers/livetvtuner.js

@@ -1,5 +1,10 @@
-define(['globalize', 'loading', 'libraryMenu', 'dom', 'emby-input', 'emby-button', 'emby-checkbox', 'emby-select'], function (globalize, loading, libraryMenu, dom) {
+import globalize from 'globalize';
-    'use strict';
+import loading from 'loading';
+import dom from 'dom';
+import 'emby-input';
+import 'emby-button';
+import 'emby-checkbox';
+import 'emby-select';
 
 function isM3uVariant(type) {
     return ['nextpvr'].indexOf(type || '') !== -1;
@@ -7,8 +12,8 @@ define(['globalize', 'loading', 'libraryMenu', 'dom', 'emby-input', 'emby-button
 
 function fillTypes(view, currentId) {
     return ApiClient.getJSON(ApiClient.getUrl('LiveTv/TunerHosts/Types')).then(function (types) {
-            var selectType = view.querySelector('.selectType');
+        const selectType = view.querySelector('.selectType');
-            var html = '';
+        let html = '';
         html += types.map(function (tuner) {
             return '<option value="' + tuner.Id + '">' + tuner.Name + '</option>';
         }).join('');
@@ -16,7 +21,7 @@ define(['globalize', 'loading', 'libraryMenu', 'dom', 'emby-input', 'emby-button
         html += globalize.translate('TabOther');
         html += '</option>';
         selectType.innerHTML = html;
-            selectType.disabled = null != currentId;
+        selectType.disabled = currentId != null;
         selectType.value = '';
         onTypeChange.call(selectType);
     });
@@ -29,7 +34,7 @@ define(['globalize', 'loading', 'libraryMenu', 'dom', 'emby-input', 'emby-button
 
     if (providerId) {
         ApiClient.getNamedConfiguration('livetv').then(function (config) {
-                var info = config.TunerHosts.filter(function (i) {
+            const info = config.TunerHosts.filter(function (i) {
                 return i.Id === providerId;
             })[0];
             fillTunerHostInfo(view, info);
@@ -38,8 +43,8 @@ define(['globalize', 'loading', 'libraryMenu', 'dom', 'emby-input', 'emby-button
 }
 
 function fillTunerHostInfo(view, info) {
-        var selectType = view.querySelector('.selectType');
+    const selectType = view.querySelector('.selectType');
-        var type = info.Type || '';
+    let type = info.Type || '';
 
     if (info.Source && isM3uVariant(info.Source)) {
         type = info.Source;
@@ -59,7 +64,7 @@ define(['globalize', 'loading', 'libraryMenu', 'dom', 'emby-input', 'emby-button
 
 function submitForm(page) {
     loading.show();
-        var info = {
+    const info = {
         Type: page.querySelector('.selectType').value,
         Url: page.querySelector('.txtDevicePath').value || null,
         UserAgent: page.querySelector('.txtUserAgent').value || null,
@@ -76,10 +81,8 @@ define(['globalize', 'loading', 'libraryMenu', 'dom', 'emby-input', 'emby-button
         info.Type = 'm3u';
     }
 
-        var id = getParameterByName('id');
+    if (getParameterByName('id')) {
-
+        info.Id = getParameterByName('id');
-        if (id) {
-            info.Id = id;
     }
 
     ApiClient.ajax({
@@ -98,14 +101,8 @@ define(['globalize', 'loading', 'libraryMenu', 'dom', 'emby-input', 'emby-button
     });
 }
 
-    function getRequirePromise(deps) {
-        return new Promise(function (resolve, reject) {
-            require(deps, resolve);
-        });
-    }
-
 function getDetectedDevice() {
-        return getRequirePromise(['tunerPicker']).then(function (tunerPicker) {
+    return import('tunerPicker').then(({default: tunerPicker}) => {
         return new tunerPicker().show({
             serverId: ApiClient.serverId()
         });
@@ -113,19 +110,19 @@ define(['globalize', 'loading', 'libraryMenu', 'dom', 'emby-input', 'emby-button
 }
 
 function onTypeChange() {
-        var value = this.value;
+    const value = this.value;
-        var view = dom.parentWithClass(this, 'page');
+    const view = dom.parentWithClass(this, 'page');
-        var mayIncludeUnsupportedDrmChannels = 'hdhomerun' === value;
+    const mayIncludeUnsupportedDrmChannels = value === 'hdhomerun';
-        var supportsTranscoding = 'hdhomerun' === value;
+    const supportsTranscoding = value === 'hdhomerun';
-        var supportsFavorites = 'hdhomerun' === value;
+    const supportsFavorites = value === 'hdhomerun';
-        var supportsTunerIpAddress = 'hdhomerun' === value;
+    const supportsTunerIpAddress = value === 'hdhomerun';
-        var supportsTunerFileOrUrl = 'm3u' === value;
+    const supportsTunerFileOrUrl = value === 'm3u';
-        var supportsStreamLooping = 'm3u' === value;
+    const supportsStreamLooping = value === 'm3u';
-        var supportsTunerCount = 'm3u' === value;
+    const supportsTunerCount = value === 'm3u';
-        var supportsUserAgent = 'm3u' === value;
+    const supportsUserAgent = value === 'm3u';
-        var suppportsSubmit = 'other' !== value;
+    const suppportsSubmit = value !== 'other';
-        var supportsSelectablePath = supportsTunerFileOrUrl;
+    const supportsSelectablePath = supportsTunerFileOrUrl;
-        var txtDevicePath = view.querySelector('.txtDevicePath');
+    const txtDevicePath = view.querySelector('.txtDevicePath');
 
     if (supportsTunerIpAddress) {
         txtDevicePath.label(globalize.translate('LabelTunerIpAddress'));
@@ -190,13 +187,13 @@ define(['globalize', 'loading', 'libraryMenu', 'dom', 'emby-input', 'emby-button
     }
 }
 
-    return function (view, params) {
+export default function (view, params) {
     if (!params.id) {
         view.querySelector('.btnDetect').classList.remove('hide');
     }
 
     view.addEventListener('viewshow', function () {
-            var currentId = params.id;
+        const currentId = params.id;
         fillTypes(view, currentId).then(function () {
             reload(view, currentId);
         });
@@ -214,8 +211,8 @@ define(['globalize', 'loading', 'libraryMenu', 'dom', 'emby-input', 'emby-button
         });
     });
     view.querySelector('.btnSelectPath').addEventListener('click', function () {
-            require(['directorybrowser'], function (directoryBrowser) {
+        import('directorybrowser').then(({default: directorybrowser}) => {
-                var picker = new directoryBrowser.default();
+            const picker = new directorybrowser();
             picker.show({
                 includeFiles: true,
                 callback: function (path) {
@@ -228,5 +225,4 @@ define(['globalize', 'loading', 'libraryMenu', 'dom', 'emby-input', 'emby-button
             });
         });
     });
-    };
+}
-});

src/controllers/movies/moviecollections.js

@@ -1,6 +1,7 @@
 define(['loading', 'events', 'libraryBrowser', 'imageLoader', 'listView', 'cardBuilder', 'userSettings', 'globalize', 'emby-itemscontainer'], function (loading, events, libraryBrowser, imageLoader, listView, cardBuilder, userSettings, globalize) {
     'use strict';
 
+    loading = loading.default || loading;
     libraryBrowser = libraryBrowser.default || libraryBrowser;
 
     return function (view, params, tabContent) {
@@ -50,7 +51,7 @@ define(['loading', 'events', 'libraryBrowser', 'imageLoader', 'listView', 'cardB
             var viewStyle = self.getCurrentViewStyle();
             var itemsContainer = tabContent.querySelector('.itemsContainer');
 
-            if ('List' == viewStyle) {
+            if (viewStyle == 'List') {
                 itemsContainer.classList.add('vertical-list');
                 itemsContainer.classList.remove('vertical-wrap');
             } else {

src/controllers/movies/moviegenres.js

@@ -1,6 +1,7 @@
 define(['layoutManager', 'loading', 'libraryBrowser', 'cardBuilder', 'lazyLoader', 'apphost', 'globalize', 'appRouter', 'dom', 'emby-button'], function (layoutManager, loading, libraryBrowser, cardBuilder, lazyLoader, appHost, globalize, appRouter, dom) {
     'use strict';
 
+    loading = loading.default || loading;
     libraryBrowser = libraryBrowser.default || libraryBrowser;
 
     return function (view, params, tabContent) {
@@ -56,13 +57,13 @@ define(['layoutManager', 'loading', 'libraryBrowser', 'cardBuilder', 'lazyLoader
             var elem = entry.target;
             var id = elem.getAttribute('data-id');
             var viewStyle = self.getCurrentViewStyle();
-            var limit = 'Thumb' == viewStyle || 'ThumbCard' == viewStyle ? 5 : 9;
+            var limit = viewStyle == 'Thumb' || viewStyle == 'ThumbCard' ? 5 : 9;
 
             if (enableScrollX()) {
                 limit = 10;
             }
 
-            var enableImageTypes = 'Thumb' == viewStyle || 'ThumbCard' == viewStyle ? 'Primary,Backdrop,Thumb' : 'Primary';
+            var enableImageTypes = viewStyle == 'Thumb' || viewStyle == 'ThumbCard' ? 'Primary,Backdrop,Thumb' : 'Primary';
             var query = {
                 SortBy: 'SortName',
                 SortOrder: 'Ascending',

src/controllers/movies/movies.js

@@ -1,6 +1,7 @@
 define(['loading', 'layoutManager', 'userSettings', 'events', 'libraryBrowser', 'alphaPicker', 'listView', 'cardBuilder', 'globalize', 'emby-itemscontainer'], function (loading, layoutManager, userSettings, events, libraryBrowser, AlphaPicker, listView, cardBuilder, globalize) {
     'use strict';
 
+    loading = loading.default || loading;
     libraryBrowser = libraryBrowser.default || libraryBrowser;
 
     return function (view, params, tabContent, options) {

src/controllers/movies/moviesrecommended.js

@@ -2,6 +2,7 @@ define(['events', 'layoutManager', 'inputManager', 'userSettings', 'libraryMenu'
     'use strict';
 
     libraryMenu = libraryMenu.default || libraryMenu;
+    playbackManager = playbackManager.default || playbackManager;
 
     function enableScrollX() {
         return !layoutManager.desktop;

src/controllers/movies/movietrailers.js

@@ -1,6 +1,7 @@
 define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', 'alphaPicker', 'listView', 'cardBuilder', 'userSettings', 'globalize', 'emby-itemscontainer'], function (layoutManager, loading, events, libraryBrowser, imageLoader, AlphaPicker, listView, cardBuilder, userSettings, globalize) {
     'use strict';
 
+    loading = loading.default || loading;
     libraryBrowser = libraryBrowser.default || libraryBrowser;
 
     return function (view, params, tabContent) {

src/controllers/music/musicalbums.js

@@ -1,9 +1,18 @@
-define(['layoutManager', 'playbackManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', 'alphaPicker', 'listView', 'cardBuilder', 'userSettings', 'globalize', 'emby-itemscontainer'], function (layoutManager, playbackManager, loading, events, libraryBrowser, imageLoader, AlphaPicker, listView, cardBuilder, userSettings, globalize) {
+import playbackManager from 'playbackManager';
-    'use strict';
+import loading from 'loading';
+import events from 'events';
+import libraryBrowser from 'libraryBrowser';
+import imageLoader from 'imageLoader';
+import AlphaPicker from 'alphaPicker';
+import listView from 'listView';
+import cardBuilder from 'cardBuilder';
+import * as userSettings from 'userSettings';
+import globalize from 'globalize';
+import 'emby-itemscontainer';
 
-    libraryBrowser = libraryBrowser.default || libraryBrowser;
+/* eslint-disable indent */
 
-    return function (view, params, tabContent) {
+    export default function (view, params, tabContent) {
         function playAll() {
             ApiClient.getItem(ApiClient.getCurrentUserId(), params.topParentId).then(function (item) {
                 playbackManager.play({
@@ -20,7 +29,7 @@ define(['layoutManager', 'playbackManager', 'loading', 'events', 'libraryBrowser
         }
 
         function getPageData() {
-            var key = getSavedQueryKey();
+            const key = getSavedQueryKey();
 
             if (!pageData) {
                 pageData = {
@@ -61,10 +70,10 @@ define(['layoutManager', 'playbackManager', 'loading', 'events', 'libraryBrowser
         }
 
         function onViewStyleChange() {
-            var viewStyle = self.getCurrentViewStyle();
+            const viewStyle = self.getCurrentViewStyle();
-            var itemsContainer = tabContent.querySelector('.itemsContainer');
+            const itemsContainer = tabContent.querySelector('.itemsContainer');
 
-            if ('List' == viewStyle) {
+            if (viewStyle == 'List') {
                 itemsContainer.classList.add('vertical-list');
                 itemsContainer.classList.remove('vertical-wrap');
             } else {
@@ -78,7 +87,7 @@ define(['layoutManager', 'playbackManager', 'loading', 'events', 'libraryBrowser
         function reloadItems(page) {
             loading.show();
             isLoading = true;
-            var query = getQuery();
+            const query = getQuery();
             ApiClient.getItems(ApiClient.getCurrentUserId(), query).then(function (result) {
                 function onNextPageClick() {
                     if (isLoading) {
@@ -104,8 +113,8 @@ define(['layoutManager', 'playbackManager', 'loading', 'events', 'libraryBrowser
 
                 window.scrollTo(0, 0);
                 updateFilterControls(page);
-                var html;
+                let html;
-                var pagingHtml = libraryBrowser.getQueryPagingHtml({
+                const pagingHtml = libraryBrowser.getQueryPagingHtml({
                     startIndex: query.StartIndex,
                     limit: query.Limit,
                     totalRecordCount: result.TotalRecordCount,
@@ -115,7 +124,7 @@ define(['layoutManager', 'playbackManager', 'loading', 'events', 'libraryBrowser
                     sortButton: false,
                     filterButton: false
                 });
-                var viewStyle = self.getCurrentViewStyle();
+                const viewStyle = self.getCurrentViewStyle();
                 if (viewStyle == 'List') {
                     html = listView.getListViewHtml({
                         items: result.Items,
@@ -146,50 +155,48 @@ define(['layoutManager', 'playbackManager', 'loading', 'events', 'libraryBrowser
                         overlayPlayButton: true
                     });
                 }
-                var i;
+                let elems = tabContent.querySelectorAll('.paging');
-                var length;
-                var elems = tabContent.querySelectorAll('.paging');
 
-                for (i = 0, length = elems.length; i < length; i++) {
+                for (let i = 0, length = elems.length; i < length; i++) {
                     elems[i].innerHTML = pagingHtml;
                 }
 
                 elems = tabContent.querySelectorAll('.btnNextPage');
-                for (i = 0, length = elems.length; i < length; i++) {
+                for (let i = 0, length = elems.length; i < length; i++) {
                     elems[i].addEventListener('click', onNextPageClick);
                 }
 
                 elems = tabContent.querySelectorAll('.btnPreviousPage');
-                for (i = 0, length = elems.length; i < length; i++) {
+                for (let i = 0, length = elems.length; i < length; i++) {
                     elems[i].addEventListener('click', onPreviousPageClick);
                 }
 
-                var itemsContainer = tabContent.querySelector('.itemsContainer');
+                const itemsContainer = tabContent.querySelector('.itemsContainer');
                 itemsContainer.innerHTML = html;
                 imageLoader.lazyChildren(itemsContainer);
                 libraryBrowser.saveQueryValues(getSavedQueryKey(), query);
                 loading.hide();
                 isLoading = false;
 
-                require(['autoFocuser'], function (autoFocuser) {
+                import('autoFocuser').then(({default: autoFocuser}) => {
                     autoFocuser.autoFocus(tabContent);
                 });
             });
         }
 
         function updateFilterControls(tabContent) {
-            var query = getQuery();
+            const query = getQuery();
             self.alphaPicker.value(query.NameStartsWithOrGreater);
         }
 
-        var savedQueryKey;
+        let savedQueryKey;
-        var pageData;
+        let pageData;
-        var self = this;
+        const self = this;
-        var isLoading = false;
+        let isLoading = false;
 
         self.showFilterMenu = function () {
-            require(['components/filterdialog/filterdialog'], function ({default: filterDialogFactory}) {
+            import('components/filterdialog/filterdialog').then(({default: filterDialogFactory}) => {
-                var filterDialog = new filterDialogFactory({
+                const filterDialog = new filterDialogFactory({
                     query: getQuery(),
                     mode: 'albums',
                     serverId: ApiClient.serverId()
@@ -207,17 +214,17 @@ define(['layoutManager', 'playbackManager', 'loading', 'events', 'libraryBrowser
         };
 
         function initPage(tabContent) {
-            var alphaPickerElement = tabContent.querySelector('.alphaPicker');
+            const alphaPickerElement = tabContent.querySelector('.alphaPicker');
-            var itemsContainer = tabContent.querySelector('.itemsContainer');
+            const itemsContainer = tabContent.querySelector('.itemsContainer');
 
             alphaPickerElement.addEventListener('alphavaluechanged', function (e) {
-                var newValue = e.detail.value;
+                const newValue = e.detail.value;
-                var query = getQuery();
+                const query = getQuery();
                 query.NameStartsWithOrGreater = newValue;
                 query.StartIndex = 0;
                 reloadItems(tabContent);
             });
-            self.alphaPicker = new AlphaPicker.default({
+            self.alphaPicker = new AlphaPicker({
                 element: alphaPickerElement,
                 valueChangeEvent: 'click'
             });
@@ -261,12 +268,12 @@ define(['layoutManager', 'playbackManager', 'loading', 'events', 'libraryBrowser
                     button: e.target
                 });
             });
-            var btnSelectView = tabContent.querySelector('.btnSelectView');
+            const btnSelectView = tabContent.querySelector('.btnSelectView');
             btnSelectView.addEventListener('click', function (e) {
                 libraryBrowser.showLayoutMenu(e.target, self.getCurrentViewStyle(), 'List,Poster,PosterCard'.split(','));
             });
             btnSelectView.addEventListener('layoutchange', function (e) {
-                var viewStyle = e.detail.viewStyle;
+                const viewStyle = e.detail.viewStyle;
                 getPageData().view = viewStyle;
                 libraryBrowser.saveViewSetting(getSavedQueryKey(), viewStyle);
                 getQuery().StartIndex = 0;
@@ -286,5 +293,6 @@ define(['layoutManager', 'playbackManager', 'loading', 'events', 'libraryBrowser
         };
 
         self.destroy = function () {};
-    };
+    }
-});
+
+/* eslint-enable indent */

src/controllers/music/musicartists.js

@@ -1,15 +1,22 @@
-define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', 'alphaPicker', 'listView', 'cardBuilder', 'apphost', 'userSettings', 'emby-itemscontainer'], function (layoutManager, loading, events, libraryBrowser, imageLoader, AlphaPicker, listView, cardBuilder, appHost, userSettings) {
+import loading from 'loading';
-    'use strict';
+import events from 'events';
+import libraryBrowser from 'libraryBrowser';
+import imageLoader from 'imageLoader';
+import AlphaPicker from 'alphaPicker';
+import listView from 'listView';
+import cardBuilder from 'cardBuilder';
+import * as userSettings from 'userSettings';
+import 'emby-itemscontainer';
 
-    libraryBrowser = libraryBrowser.default || libraryBrowser;
+/* eslint-disable indent */
 
-    return function (view, params, tabContent) {
+    export default function (view, params, tabContent) {
         function getPageData(context) {
-            var key = getSavedQueryKey(context);
+            const key = getSavedQueryKey(context);
-            var pageData = data[key];
+            let pageData = data[key];
 
             if (!pageData) {
-                var queryValues = {
+                const queryValues = {
                     SortBy: 'SortName',
                     SortOrder: 'Ascending',
                     Recursive: true,
@@ -47,10 +54,10 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
         }
 
         function onViewStyleChange() {
-            var viewStyle = self.getCurrentViewStyle();
+            const viewStyle = self.getCurrentViewStyle();
-            var itemsContainer = tabContent.querySelector('.itemsContainer');
+            const itemsContainer = tabContent.querySelector('.itemsContainer');
 
-            if ('List' == viewStyle) {
+            if (viewStyle == 'List') {
                 itemsContainer.classList.add('vertical-list');
                 itemsContainer.classList.remove('vertical-wrap');
             } else {
@@ -64,8 +71,8 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
         function reloadItems(page) {
             loading.show();
             isLoading = true;
-            var query = getQuery(page);
+            const query = getQuery(page);
-            var promise = self.mode == 'albumartists' ?
+            const promise = self.mode == 'albumartists' ?
                 ApiClient.getAlbumArtists(ApiClient.getCurrentUserId(), query) :
                 ApiClient.getArtists(ApiClient.getCurrentUserId(), query);
             promise.then(function (result) {
@@ -93,8 +100,8 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
 
                 window.scrollTo(0, 0);
                 updateFilterControls(page);
-                var html;
+                let html;
-                var pagingHtml = libraryBrowser.getQueryPagingHtml({
+                const pagingHtml = libraryBrowser.getQueryPagingHtml({
                     startIndex: query.StartIndex,
                     limit: query.Limit,
                     totalRecordCount: result.TotalRecordCount,
@@ -104,7 +111,7 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
                     sortButton: false,
                     filterButton: false
                 });
-                var viewStyle = self.getCurrentViewStyle();
+                const viewStyle = self.getCurrentViewStyle();
                 if (viewStyle == 'List') {
                     html = listView.getListViewHtml({
                         items: result.Items,
@@ -131,49 +138,47 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
                         overlayPlayButton: true
                     });
                 }
-                var i;
+                let elems = tabContent.querySelectorAll('.paging');
-                var length;
-                var elems = tabContent.querySelectorAll('.paging');
 
-                for (i = 0, length = elems.length; i < length; i++) {
+                for (let i = 0, length = elems.length; i < length; i++) {
                     elems[i].innerHTML = pagingHtml;
                 }
 
                 elems = tabContent.querySelectorAll('.btnNextPage');
-                for (i = 0, length = elems.length; i < length; i++) {
+                for (let i = 0, length = elems.length; i < length; i++) {
                     elems[i].addEventListener('click', onNextPageClick);
                 }
 
                 elems = tabContent.querySelectorAll('.btnPreviousPage');
-                for (i = 0, length = elems.length; i < length; i++) {
+                for (let i = 0, length = elems.length; i < length; i++) {
                     elems[i].addEventListener('click', onPreviousPageClick);
                 }
 
-                var itemsContainer = tabContent.querySelector('.itemsContainer');
+                const itemsContainer = tabContent.querySelector('.itemsContainer');
                 itemsContainer.innerHTML = html;
                 imageLoader.lazyChildren(itemsContainer);
                 libraryBrowser.saveQueryValues(getSavedQueryKey(page), query);
                 loading.hide();
                 isLoading = false;
 
-                require(['autoFocuser'], function (autoFocuser) {
+                import('autoFocuser').then(({default: autoFocuser}) => {
                     autoFocuser.autoFocus(tabContent);
                 });
             });
         }
 
         function updateFilterControls(tabContent) {
-            var query = getQuery(tabContent);
+            const query = getQuery(tabContent);
             self.alphaPicker.value(query.NameStartsWithOrGreater);
         }
 
-        var self = this;
+        const self = this;
-        var data = {};
+        const data = {};
-        var isLoading = false;
+        let isLoading = false;
 
         self.showFilterMenu = function () {
-            require(['components/filterdialog/filterdialog'], function ({default: filterDialogFactory}) {
+            import('components/filterdialog/filterdialog').then(({default: filterDialogFactory}) => {
-                var filterDialog = new filterDialogFactory({
+                const filterDialog = new filterDialogFactory({
                     query: getQuery(tabContent),
                     mode: self.mode,
                     serverId: ApiClient.serverId()
@@ -191,17 +196,17 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
         };
 
         function initPage(tabContent) {
-            var alphaPickerElement = tabContent.querySelector('.alphaPicker');
+            const alphaPickerElement = tabContent.querySelector('.alphaPicker');
-            var itemsContainer = tabContent.querySelector('.itemsContainer');
+            const itemsContainer = tabContent.querySelector('.itemsContainer');
 
             alphaPickerElement.addEventListener('alphavaluechanged', function (e) {
-                var newValue = e.detail.value;
+                const newValue = e.detail.value;
-                var query = getQuery(tabContent);
+                const query = getQuery(tabContent);
                 query.NameStartsWithOrGreater = newValue;
                 query.StartIndex = 0;
                 reloadItems(tabContent);
             });
-            self.alphaPicker = new AlphaPicker.default({
+            self.alphaPicker = new AlphaPicker({
                 element: alphaPickerElement,
                 valueChangeEvent: 'click'
             });
@@ -213,12 +218,12 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
             tabContent.querySelector('.btnFilter').addEventListener('click', function () {
                 self.showFilterMenu();
             });
-            var btnSelectView = tabContent.querySelector('.btnSelectView');
+            const btnSelectView = tabContent.querySelector('.btnSelectView');
             btnSelectView.addEventListener('click', function (e) {
                 libraryBrowser.showLayoutMenu(e.target, self.getCurrentViewStyle(), 'List,Poster,PosterCard'.split(','));
             });
             btnSelectView.addEventListener('layoutchange', function (e) {
-                var viewStyle = e.detail.viewStyle;
+                const viewStyle = e.detail.viewStyle;
                 getPageData(tabContent).view = viewStyle;
                 libraryBrowser.saveViewSetting(getSavedQueryKey(tabContent), viewStyle);
                 getQuery(tabContent).StartIndex = 0;
@@ -236,5 +241,6 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
         };
 
         self.destroy = function () {};
-    };
+    }
-});
+
+/* eslint-enable indent */

src/controllers/music/musicgenres.js

@@ -1,12 +1,14 @@
-define(['libraryBrowser', 'cardBuilder', 'apphost', 'imageLoader', 'loading'], function (libraryBrowser, cardBuilder, appHost, imageLoader, loading) {
+import libraryBrowser from 'libraryBrowser';
-    'use strict';
+import cardBuilder from 'cardBuilder';
+import imageLoader from 'imageLoader';
+import loading from 'loading';
 
-    libraryBrowser = libraryBrowser.default || libraryBrowser;
+/* eslint-disable indent */
 
-    return function (view, params, tabContent) {
+    export default function (view, params, tabContent) {
         function getPageData() {
-            var key = getSavedQueryKey();
+            const key = getSavedQueryKey();
-            var pageData = data[key];
+            let pageData = data[key];
 
             if (!pageData) {
                 pageData = data[key] = {
@@ -36,15 +38,15 @@ define(['libraryBrowser', 'cardBuilder', 'apphost', 'imageLoader', 'loading'], f
 
         function getPromise() {
             loading.show();
-            var query = getQuery();
+            const query = getQuery();
             return ApiClient.getGenres(ApiClient.getCurrentUserId(), query);
         }
 
         function reloadItems(context, promise) {
-            var query = getQuery();
+            const query = getQuery();
             promise.then(function (result) {
-                var html = '';
+                let html = '';
-                var viewStyle = self.getCurrentViewStyle();
+                const viewStyle = self.getCurrentViewStyle();
 
                 if (viewStyle == 'Thumb') {
                     html = cardBuilder.getCardsHtml({
@@ -84,13 +86,13 @@ define(['libraryBrowser', 'cardBuilder', 'apphost', 'imageLoader', 'loading'], f
                     });
                 }
 
-                var elem = context.querySelector('#items');
+                const elem = context.querySelector('#items');
                 elem.innerHTML = html;
                 imageLoader.lazyChildren(elem);
                 libraryBrowser.saveQueryValues(getSavedQueryKey(), query);
                 loading.hide();
 
-                require(['autoFocuser'], function (autoFocuser) {
+                import('autoFocuser').then(({default: autoFocuser}) => {
                     autoFocuser.autoFocus(context);
                 });
             });
@@ -101,8 +103,8 @@ define(['libraryBrowser', 'cardBuilder', 'apphost', 'imageLoader', 'loading'], f
             self.renderTab();
         }
 
-        var self = this;
+        const self = this;
-        var data = {};
+        const data = {};
 
         self.getViewStyles = function () {
             return 'Poster,PosterCard,Thumb,ThumbCard'.split(',');
@@ -119,7 +121,7 @@ define(['libraryBrowser', 'cardBuilder', 'apphost', 'imageLoader', 'loading'], f
         };
 
         self.enableViewSelection = true;
-        var promise;
+        let promise;
 
         self.preRender = function () {
             promise = getPromise();
@@ -128,5 +130,6 @@ define(['libraryBrowser', 'cardBuilder', 'apphost', 'imageLoader', 'loading'], f
         self.renderTab = function () {
             reloadItems(tabContent, promise);
         };
-    };
+    }
-});
+
+/* eslint-enable indent */

src/controllers/music/musicplaylists.js

@@ -1,12 +1,14 @@
-define(['libraryBrowser', 'cardBuilder', 'apphost', 'imageLoader', 'loading'], function (libraryBrowser, cardBuilder, appHost, imageLoader, loading) {
+import libraryBrowser from 'libraryBrowser';
-    'use strict';
+import cardBuilder from 'cardBuilder';
+import imageLoader from 'imageLoader';
+import loading from 'loading';
 
-    libraryBrowser = libraryBrowser.default || libraryBrowser;
+/* eslint-disable indent */
 
-    return function (view, params, tabContent) {
+    export default function (view, params, tabContent) {
         function getPageData() {
-            var key = getSavedQueryKey();
+            const key = getSavedQueryKey();
-            var pageData = data[key];
+            let pageData = data[key];
 
             if (!pageData) {
                 pageData = data[key] = {
@@ -37,14 +39,14 @@ define(['libraryBrowser', 'cardBuilder', 'apphost', 'imageLoader', 'loading'], f
 
         function getPromise() {
             loading.show();
-            var query = getQuery();
+            const query = getQuery();
             return ApiClient.getItems(ApiClient.getCurrentUserId(), query);
         }
 
         function reloadItems(context, promise) {
-            var query = getQuery();
+            const query = getQuery();
             promise.then(function (result) {
-                var html = '';
+                let html = '';
                 html = cardBuilder.getCardsHtml({
                     items: result.Items,
                     shape: 'square',
@@ -55,26 +57,26 @@ define(['libraryBrowser', 'cardBuilder', 'apphost', 'imageLoader', 'loading'], f
                     allowBottomPadding: true,
                     cardLayout: false
                 });
-                var elem = context.querySelector('#items');
+                const elem = context.querySelector('#items');
                 elem.innerHTML = html;
                 imageLoader.lazyChildren(elem);
                 libraryBrowser.saveQueryValues(getSavedQueryKey(), query);
                 loading.hide();
 
-                require(['autoFocuser'], function (autoFocuser) {
+                import('autoFocuser').then(({default: autoFocuser}) => {
                     autoFocuser.autoFocus(context);
                 });
             });
         }
 
-        var self = this;
+        const self = this;
-        var data = {};
+        const data = {};
 
         self.getCurrentViewStyle = function () {
             return getPageData().view;
         };
 
-        var promise;
+        let promise;
 
         self.preRender = function () {
             promise = getPromise();
@@ -83,5 +85,6 @@ define(['libraryBrowser', 'cardBuilder', 'apphost', 'imageLoader', 'loading'], f
         self.renderTab = function () {
             reloadItems(tabContent, promise);
         };
-    };
+    }
-});
+
+/* eslint-enable indent */

src/controllers/music/musicrecommended.js

@@ -1,10 +1,26 @@
-define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', 'cardBuilder', 'dom', 'apphost', 'imageLoader', 'libraryMenu', 'playbackManager', 'mainTabsManager', 'globalize', 'scrollStyles', 'emby-itemscontainer', 'emby-tabs', 'emby-button', 'flexStyles'], function (browser, layoutManager, userSettings, inputManager, loading, cardBuilder, dom, appHost, imageLoader, libraryMenu, playbackManager, mainTabsManager, globalize) {
+import browser from 'browser';
-    'use strict';
+import layoutManager from 'layoutManager';
+import * as userSettings from 'userSettings';
+import inputManager from 'inputManager';
+import loading from 'loading';
+import cardBuilder from 'cardBuilder';
+import dom from 'dom';
+import imageLoader from 'imageLoader';
+import libraryMenu from 'libraryMenu';
+import * as mainTabsManager from 'mainTabsManager';
+import globalize from 'globalize';
+import 'scrollStyles';
+import 'emby-itemscontainer';
+import 'emby-tabs';
+import 'emby-button';
+import 'flexStyles';
+
+/* eslint-disable indent */
 
     libraryMenu = LibraryMenu.default || libraryMenu;
 
     function itemsPerRow() {
-        var screenWidth = dom.getWindowSize().innerWidth;
+        const screenWidth = dom.getWindowSize().innerWidth;
 
         if (screenWidth >= 1920) {
             return 9;
@@ -31,8 +47,8 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
 
     function loadLatest(page, parentId) {
         loading.show();
-        var userId = ApiClient.getCurrentUserId();
+        const userId = ApiClient.getCurrentUserId();
-        var options = {
+        const options = {
             IncludeItemTypes: 'Audio',
             Limit: enableScrollX() ? 3 * itemsPerRow() : 2 * itemsPerRow(),
             Fields: 'PrimaryImageAspectRatio,BasicSyncInfo',
@@ -43,7 +59,6 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
         };
         ApiClient.getJSON(ApiClient.getUrl('Users/' + userId + '/Items/Latest', options)).then(function (items) {
             var elem = page.querySelector('#recentlyAddedSongs');
-
             elem.innerHTML = cardBuilder.getCardsHtml({
                 items: items,
                 showUnplayedIndicator: false,
@@ -61,14 +76,14 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
             imageLoader.lazyChildren(elem);
             loading.hide();
 
-            require(['autoFocuser'], function (autoFocuser) {
+            import('autoFocuser').then(({default: autoFocuser}) => {
                 autoFocuser.autoFocus(page);
             });
         });
     }
 
     function loadRecentlyPlayed(page, parentId) {
-        var options = {
+        const options = {
             SortBy: 'DatePlayed',
             SortOrder: 'Descending',
             IncludeItemTypes: 'Audio',
@@ -82,7 +97,7 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
             EnableTotalRecordCount: false
         };
         ApiClient.getItems(ApiClient.getCurrentUserId(), options).then(function (result) {
-            var elem = page.querySelector('#recentlyPlayed');
+            const elem = page.querySelector('#recentlyPlayed');
 
             if (result.Items.length) {
                 elem.classList.remove('hide');
@@ -91,6 +106,7 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
             }
 
             var itemsContainer = elem.querySelector('.itemsContainer');
+
             itemsContainer.innerHTML = cardBuilder.getCardsHtml({
                 items: result.Items,
                 showUnplayedIndicator: false,
@@ -110,7 +126,7 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
     }
 
     function loadFrequentlyPlayed(page, parentId) {
-        var options = {
+        const options = {
             SortBy: 'PlayCount',
             SortOrder: 'Descending',
             IncludeItemTypes: 'Audio',
@@ -124,7 +140,7 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
             EnableTotalRecordCount: false
         };
         ApiClient.getItems(ApiClient.getCurrentUserId(), options).then(function (result) {
-            var elem = page.querySelector('#topPlayed');
+            const elem = page.querySelector('#topPlayed');
 
             if (result.Items.length) {
                 elem.classList.remove('hide');
@@ -157,7 +173,7 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
         loadRecentlyPlayed(tabContent, parentId);
         loadFrequentlyPlayed(tabContent, parentId);
 
-        require(['components/favoriteitems'], function (favoriteItems) {
+        import('components/favoriteitems').then(({default: favoriteItems}) => {
             favoriteItems.render(tabContent, ApiClient.getCurrentUserId(), parentId, ['favoriteArtists', 'favoriteAlbums', 'favoriteSongs']);
         });
     }
@@ -208,10 +224,10 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
         }
     }
 
-    return function (view, params) {
+    export default function (view, params) {
         function reload() {
             loading.show();
-            var tabContent = view.querySelector(".pageTabContent[data-index='0']");
+            const tabContent = view.querySelector(".pageTabContent[data-index='0']");
             loadSuggestionsTab(view, tabContent, params.topParentId);
         }
 
@@ -254,46 +270,48 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
         }
 
         function getTabController(page, index, callback) {
-            var depends = [];
+            let depends;
 
             switch (index) {
                 case 0:
+                    depends = 'controllers/music/musicrecommended';
                     break;
 
                 case 1:
-                    depends.push('controllers/music/musicalbums');
+                    depends = 'controllers/music/musicalbums';
                     break;
 
                 case 2:
                 case 3:
-                    depends.push('controllers/music/musicartists');
+                    depends = 'controllers/music/musicartists';
                     break;
 
                 case 4:
-                    depends.push('controllers/music/musicplaylists');
+                    depends = 'controllers/music/musicplaylists';
                     break;
 
                 case 5:
-                    depends.push('controllers/music/songs');
+                    depends = 'controllers/music/songs';
                     break;
 
                 case 6:
-                    depends.push('controllers/music/musicgenres');
+                    depends = 'controllers/music/musicgenres';
                     break;
 
                 case 7:
-                    depends.push('scripts/searchtab');
+                    depends = 'scripts/searchtab';
+                    break;
             }
 
-            require(depends, function (controllerFactory) {
+            import(depends).then(({default: controllerFactory}) => {
-                var tabContent;
+                let tabContent;
 
-                if (0 == index) {
+                if (index == 0) {
                     tabContent = view.querySelector(".pageTabContent[data-index='" + index + "']");
                     self.tabContent = tabContent;
                 }
 
-                var controller = tabControllers[index];
+                let controller = tabControllers[index];
 
                 if (!controller) {
                     tabContent = view.querySelector(".pageTabContent[data-index='" + index + "']");
@@ -355,10 +373,10 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
         var currentTabIndex = parseInt(params.tab || getDefaultTabIndex(params.topParentId));
 
         self.initTab = function () {
-            var tabContent = view.querySelector(".pageTabContent[data-index='0']");
+            const tabContent = view.querySelector(".pageTabContent[data-index='0']");
-            var containers = tabContent.querySelectorAll('.itemsContainer');
+            const containers = tabContent.querySelectorAll('.itemsContainer');
 
-            for (var i = 0, length = containers.length; i < length; i++) {
+            for (let i = 0, length = containers.length; i < length; i++) {
                 setScrollClasses(containers[i], enableScrollX());
             }
         };
@@ -367,12 +385,12 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
             reload();
         };
 
-        var tabControllers = [];
+        const tabControllers = [];
-        var renderedTabs = [];
+        const renderedTabs = [];
         view.addEventListener('viewshow', function (e) {
             initTabs();
             if (!view.getAttribute('data-title')) {
-                var parentId = params.topParentId;
+                const parentId = params.topParentId;
 
                 if (parentId) {
                     ApiClient.getItem(ApiClient.getCurrentUserId(), parentId).then(function (item) {
@@ -397,5 +415,6 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
                 }
             });
         });
-    };
+    }
-});
+
+/* eslint-enable indent */

src/controllers/music/songs.js

@@ -1,12 +1,18 @@
-define(['events', 'libraryBrowser', 'imageLoader', 'listView', 'loading', 'userSettings', 'globalize', 'emby-itemscontainer'], function (events, libraryBrowser, imageLoader, listView, loading, userSettings, globalize) {
+import events from 'events';
-    'use strict';
+import libraryBrowser from 'libraryBrowser';
+import imageLoader from 'imageLoader';
+import listView from 'listView';
+import loading from 'loading';
+import * as userSettings from 'userSettings';
+import globalize from 'globalize';
+import 'emby-itemscontainer';
 
-    libraryBrowser = libraryBrowser.default || libraryBrowser;
+/* eslint-disable indent */
 
-    return function (view, params, tabContent) {
+    export default function (view, params, tabContent) {
         function getPageData(context) {
-            var key = getSavedQueryKey(context);
+            const key = getSavedQueryKey(context);
-            var pageData = data[key];
+            let pageData = data[key];
 
             if (!pageData) {
                 pageData = data[key] = {
@@ -48,7 +54,7 @@ define(['events', 'libraryBrowser', 'imageLoader', 'listView', 'loading', 'userS
         function reloadItems(page) {
             loading.show();
             isLoading = true;
-            var query = getQuery(page);
+            const query = getQuery(page);
             ApiClient.getItems(Dashboard.getCurrentUserId(), query).then(function (result) {
                 function onNextPageClick() {
                     if (isLoading) {
@@ -73,9 +79,7 @@ define(['events', 'libraryBrowser', 'imageLoader', 'listView', 'loading', 'userS
                 }
 
                 window.scrollTo(0, 0);
-                var i;
+                const pagingHtml = libraryBrowser.getQueryPagingHtml({
-                var length;
-                var pagingHtml = libraryBrowser.getQueryPagingHtml({
                     startIndex: query.StartIndex,
                     limit: query.Limit,
                     totalRecordCount: result.TotalRecordCount,
@@ -85,49 +89,49 @@ define(['events', 'libraryBrowser', 'imageLoader', 'listView', 'loading', 'userS
                     sortButton: false,
                     filterButton: false
                 });
-                var html = listView.getListViewHtml({
+                const html = listView.getListViewHtml({
                     items: result.Items,
                     action: 'playallfromhere',
                     smallIcon: true,
                     artist: true,
                     addToListButton: true
                 });
-                var elems = tabContent.querySelectorAll('.paging');
+                let elems = tabContent.querySelectorAll('.paging');
 
-                for (i = 0, length = elems.length; i < length; i++) {
+                for (let i = 0, length = elems.length; i < length; i++) {
                     elems[i].innerHTML = pagingHtml;
                 }
 
                 elems = tabContent.querySelectorAll('.btnNextPage');
-                for (i = 0, length = elems.length; i < length; i++) {
+                for (let i = 0, length = elems.length; i < length; i++) {
                     elems[i].addEventListener('click', onNextPageClick);
                 }
 
                 elems = tabContent.querySelectorAll('.btnPreviousPage');
-                for (i = 0, length = elems.length; i < length; i++) {
+                for (let i = 0, length = elems.length; i < length; i++) {
                     elems[i].addEventListener('click', onPreviousPageClick);
                 }
 
-                var itemsContainer = tabContent.querySelector('.itemsContainer');
+                const itemsContainer = tabContent.querySelector('.itemsContainer');
                 itemsContainer.innerHTML = html;
                 imageLoader.lazyChildren(itemsContainer);
                 libraryBrowser.saveQueryValues(getSavedQueryKey(page), query);
                 loading.hide();
                 isLoading = false;
 
-                require(['autoFocuser'], function (autoFocuser) {
+                import('autoFocuser').then(({default: autoFocuser}) => {
                     autoFocuser.autoFocus(page);
                 });
             });
         }
 
-        var self = this;
+        const self = this;
-        var data = {};
+        const data = {};
-        var isLoading = false;
+        let isLoading = false;
 
         self.showFilterMenu = function () {
-            require(['components/filterdialog/filterdialog'], function ({default: filterDialogFactory}) {
+            import('components/filterdialog/filterdialog').then(({default: filterDialogFactory}) => {
-                var filterDialog = new filterDialogFactory({
+                const filterDialog = new filterDialogFactory({
                     query: getQuery(tabContent),
                     mode: 'songs',
                     serverId: ApiClient.serverId()
@@ -195,5 +199,6 @@ define(['events', 'libraryBrowser', 'imageLoader', 'listView', 'loading', 'userS
         };
 
         self.destroy = function () {};
-    };
+    }
-});
+
+/* eslint-enable indent */

src/controllers/playback/video/index.html

@@ -28,7 +28,7 @@
                     <span class="xlargePaperIconButton material-icons fiber_manual_record"></span>
                 </button>
 
-                <button is="paper-icon-button-light" class="btnPreviousTrack autoSize hide">
+                <button is="paper-icon-button-light" class="btnPreviousTrack autoSize hide" title="${PreviousTrack}">
                     <span class="xlargePaperIconButton material-icons skip_previous"></span>
                 </button>
 
@@ -44,7 +44,7 @@
                     <span class="xlargePaperIconButton material-icons fast_forward"></span>
                 </button>
 
-                <button is="paper-icon-button-light" class="btnNextTrack autoSize hide">
+                <button is="paper-icon-button-light" class="btnNextTrack autoSize hide" title="${NextTrack}">
                     <span class="xlargePaperIconButton material-icons skip_next"></span>
                 </button>