From 39eddeb20557101945fbe326c8e0b80ffa50977e Mon Sep 17 00:00:00 2001
From: dkanada <dkanada@users.noreply.github.com>
Date: Wed, 7 Oct 2020 21:12:14 +0900
Subject: [PATCH] run eslint to fix most var instances

---
 src/bundle.js                                 |   2 +-
 src/components/appFooter/appFooter.js         |   2 +-
 src/components/apphost.js                     |   2 +-
 .../displaySettings/displaySettings.js        |   2 +-
 src/components/filtermenu/filtermenu.js       |  56 ++++----
 src/components/focusManager.js                | 128 +++++++++---------
 src/components/groupedcards.js                |  20 +--
 src/components/htmlMediaHelper.js             |  46 +++----
 .../imageOptionsEditor/imageOptionsEditor.js  |   2 +-
 src/components/imageeditor/imageeditor.js     |   4 +-
 src/components/images/imageLoader.js          |  24 ++--
 src/components/listview/listview.js           |   4 +-
 .../metadataEditor/metadataEditor.js          |   4 +-
 src/components/nowPlayingBar/nowPlayingBar.js |   2 +-
 src/components/packageManager.js              |  24 ++--
 src/components/playback/brightnessosd.js      |  24 ++--
 src/components/playback/nowplayinghelper.js   |  10 +-
 .../playback/playbackorientation.js           |  10 +-
 .../playback/playerSelectionMenu.js           |  44 +++---
 src/components/playback/playersettingsmenu.js |  56 ++++----
 src/components/playback/volumeosd.js          |  24 ++--
 src/components/playerstats/playerstats.js     |   2 +-
 src/components/playmenu.js                    |   8 +-
 src/components/pluginManager.js               |  14 +-
 src/components/qualityOptions.js              |  34 ++---
 src/components/require/requirecss.js          |  14 +-
 src/components/require/requiretext.js         |   4 +-
 src/components/serviceworker/notifications.js |  10 +-
 src/components/syncPlay/groupSelectionMenu.js |   8 +-
 src/components/syncPlay/syncPlayManager.js    |  12 +-
 src/components/tabbedview/tabbedview.js       |  18 +--
 src/controllers/dashboard/logs.js             |  12 +-
 .../dashboard/plugins/repositories/index.js   |  10 +-
 src/controllers/edititemmetadata.js           |   2 +-
 src/controllers/movies/moviesrecommended.js   |   2 +-
 src/controllers/music/musicrecommended.js     |   6 +-
 src/controllers/session/login/index.js        |   2 +-
 .../emby-progressring/emby-progressring.js    |   4 +-
 src/elements/emby-slider/emby-slider.js       |   2 +-
 src/legacy/focusPreventScroll.js              |  10 +-
 src/libraries/navdrawer/navdrawer.js          |  76 +++++------
 src/libraries/scroller.js                     |  96 ++++++-------
 src/plugins/comicsPlayer/plugin.js            |   2 +-
 src/plugins/photoPlayer/plugin.js             |   6 +-
 src/scripts/autocast.js                       |   2 +-
 src/scripts/browserDeviceProfile.js           |  72 +++++-----
 src/scripts/editorsidebar.js                  |  72 +++++-----
 src/scripts/gamepadtokey.js                   | 110 +++++++--------
 src/scripts/imagehelper.js                    |   2 +-
 src/scripts/libraryBrowser.js                 |  46 +++----
 src/scripts/multiDownload.js                  |  10 +-
 src/scripts/playlistedit.js                   |   4 +-
 src/scripts/routes.js                         |   2 +-
 src/scripts/site.js                           |  54 ++++----
 src/scripts/themeManager.js                   |  10 +-
 55 files changed, 614 insertions(+), 614 deletions(-)

diff --git a/src/bundle.js b/src/bundle.js
index 25810f58ee..3d1d600a9f 100644
--- a/src/bundle.js
+++ b/src/bundle.js
@@ -177,7 +177,7 @@ _define('appStorage', function () {
 });
 
 // libarchive.js
-var libarchive = require('libarchive.js');
+const libarchive = require('libarchive.js');
 _define('libarchive', function () {
     return libarchive;
 });
diff --git a/src/components/appFooter/appFooter.js b/src/components/appFooter/appFooter.js
index c60aa1a27c..260aea8280 100644
--- a/src/components/appFooter/appFooter.js
+++ b/src/components/appFooter/appFooter.js
@@ -27,7 +27,7 @@ class appFooter {
         };
     }
     destroy() {
-        var self = this;
+        const self = this;
 
         self.element = null;
     }
diff --git a/src/components/apphost.js b/src/components/apphost.js
index 33ca5a0b79..875c7907e6 100644
--- a/src/components/apphost.js
+++ b/src/components/apphost.js
@@ -78,7 +78,7 @@ function getDeviceId() {
 }
 
 function getDeviceName() {
-    var deviceName;
+    let deviceName;
     if (browser.tizen) {
         deviceName = 'Samsung Smart TV';
     } else if (browser.web0s) {
diff --git a/src/components/displaySettings/displaySettings.js b/src/components/displaySettings/displaySettings.js
index 9def27dc8a..efaab16b3f 100644
--- a/src/components/displaySettings/displaySettings.js
+++ b/src/components/displaySettings/displaySettings.js
@@ -23,7 +23,7 @@ import 'emby-button';
             }).join('');
 
             // get default theme
-            var defaultTheme = themes.find(theme => {
+            const defaultTheme = themes.find(theme => {
                 return theme.default;
             });
 
diff --git a/src/components/filtermenu/filtermenu.js b/src/components/filtermenu/filtermenu.js
index be12b04edd..7cef08303d 100644
--- a/src/components/filtermenu/filtermenu.js
+++ b/src/components/filtermenu/filtermenu.js
@@ -19,7 +19,7 @@ function onSubmit(e) {
     return false;
 }
 function renderOptions(context, selector, cssClass, items, isCheckedFn) {
-    var elem = context.querySelector(selector);
+    const elem = context.querySelector(selector);
 
     if (items.length) {
         elem.classList.remove('hide');
@@ -27,12 +27,12 @@ function renderOptions(context, selector, cssClass, items, isCheckedFn) {
         elem.classList.add('hide');
     }
 
-    var html = '';
+    let html = '';
 
     html += items.map(function (filter) {
-        var itemHtml = '';
+        let itemHtml = '';
 
-        var checkedHtml = isCheckedFn(filter) ? ' checked' : '';
+        const checkedHtml = isCheckedFn(filter) ? ' checked' : '';
         itemHtml += '<label>';
         itemHtml += '<input is="emby-checkbox" type="checkbox"' + checkedHtml + ' data-filter="' + filter.Id + '" class="' + cssClass + '"/>';
         itemHtml += '<span>' + filter.Name + '</span>';
@@ -47,21 +47,21 @@ function renderOptions(context, selector, cssClass, items, isCheckedFn) {
 function renderDynamicFilters(context, result, options) {
     renderOptions(context, '.genreFilters', 'chkGenreFilter', result.Genres, function (i) {
         // Switching from | to ,
-        var delimeter = (options.settings.GenreIds || '').indexOf('|') === -1 ? ',' : '|';
+        const delimeter = (options.settings.GenreIds || '').indexOf('|') === -1 ? ',' : '|';
         return (delimeter + (options.settings.GenreIds || '') + delimeter).indexOf(delimeter + i.Id + delimeter) !== -1;
     });
 }
 
 function setBasicFilter(context, key, elem) {
-    var value = elem.checked;
+    let value = elem.checked;
     value = value ? value : null;
     userSettings.setFilter(key, value);
 }
 function moveCheckboxFocus(elem, offset) {
-    var parent = dom.parentWithClass(elem, 'checkboxList-verticalwrap');
-    var elems = focusManager.getFocusableElements(parent);
+    const parent = dom.parentWithClass(elem, 'checkboxList-verticalwrap');
+    const elems = focusManager.getFocusableElements(parent);
 
-    var index = -1;
+    let index = -1;
     for (let i = 0, length = elems.length; i < length; i++) {
         if (elems[i] === elem) {
             index = i;
@@ -74,14 +74,14 @@ function moveCheckboxFocus(elem, offset) {
     index = Math.min(elems.length - 1, index);
     index = Math.max(0, index);
 
-    var newElem = elems[index];
+    const newElem = elems[index];
     if (newElem) {
         focusManager.focus(newElem);
     }
 }
 function centerFocus(elem, horiz, on) {
     import('scrollHelper').then(({ default: scrollHelper }) => {
-        var fn = on ? 'on' : 'off';
+        const fn = on ? 'on' : 'off';
         scrollHelper.centerFocus[fn](elem, horiz);
     });
 }
@@ -100,7 +100,7 @@ function onInputCommand(e) {
     }
 }
 function saveValues(context, settings, settingsKey) {
-    var elems = context.querySelectorAll('.simpleFilter');
+    let elems = context.querySelectorAll('.simpleFilter');
     for (let i = 0, length = elems.length; i < length; i++) {
         if (elems[i].tagName === 'INPUT') {
             setBasicFilter(context, settingsKey + '-filter-' + elems[i].getAttribute('data-settingname'), elems[i]);
@@ -110,7 +110,7 @@ function saveValues(context, settings, settingsKey) {
     }
 
     // Video type
-    var videoTypes = [];
+    const videoTypes = [];
     elems = context.querySelectorAll('.chkVideoTypeFilter');
 
     for (let i = 0, length = elems.length; i < length; i++) {
@@ -121,7 +121,7 @@ function saveValues(context, settings, settingsKey) {
     userSettings.setFilter(settingsKey + '-filter-VideoTypes', videoTypes.join(','));
 
     // Series status
-    var seriesStatuses = [];
+    const seriesStatuses = [];
     elems = context.querySelectorAll('.chkSeriesStatus');
 
     for (let i = 0, length = elems.length; i < length; i++) {
@@ -131,7 +131,7 @@ function saveValues(context, settings, settingsKey) {
     }
 
     // Genres
-    var genres = [];
+    const genres = [];
     elems = context.querySelectorAll('.chkGenreFilter');
 
     for (let i = 0, length = elems.length; i < length; i++) {
@@ -142,7 +142,7 @@ function saveValues(context, settings, settingsKey) {
     userSettings.setFilter(settingsKey + '-filter-GenreIds', genres.join(','));
 }
 function bindCheckboxInput(context, on) {
-    var elems = context.querySelectorAll('.checkboxList-verticalwrap');
+    const elems = context.querySelectorAll('.checkboxList-verticalwrap');
     for (let i = 0, length = elems.length; i < length; i++) {
         if (on) {
             inputManager.on(elems[i], onInputCommand);
@@ -154,9 +154,9 @@ function bindCheckboxInput(context, on) {
 function initEditor(context, settings) {
     context.querySelector('form').addEventListener('submit', onSubmit);
 
-    var elems = context.querySelectorAll('.simpleFilter');
-    var i;
-    var length;
+    let elems = context.querySelectorAll('.simpleFilter');
+    let i;
+    let length;
 
     for (i = 0, length = elems.length; i < length; i++) {
         if (elems[i].tagName === 'INPUT') {
@@ -166,14 +166,14 @@ function initEditor(context, settings) {
         }
     }
 
-    var videoTypes = settings.VideoTypes ? settings.VideoTypes.split(',') : [];
+    const videoTypes = settings.VideoTypes ? settings.VideoTypes.split(',') : [];
     elems = context.querySelectorAll('.chkVideoTypeFilter');
 
     for (i = 0, length = elems.length; i < length; i++) {
         elems[i].checked = videoTypes.indexOf(elems[i].getAttribute('data-filter')) !== -1;
     }
 
-    var seriesStatuses = settings.SeriesStatus ? settings.SeriesStatus.split(',') : [];
+    const seriesStatuses = settings.SeriesStatus ? settings.SeriesStatus.split(',') : [];
     elems = context.querySelectorAll('.chkSeriesStatus');
 
     for (i = 0, length = elems.length; i < length; i++) {
@@ -193,9 +193,9 @@ function initEditor(context, settings) {
     }
 }
 function loadDynamicFilters(context, options) {
-    var apiClient = window.connectionManager.getApiClient(options.serverId);
+    const apiClient = window.connectionManager.getApiClient(options.serverId);
 
-    var filterMenuOptions = Object.assign(options.filterMenuOptions, {
+    const filterMenuOptions = Object.assign(options.filterMenuOptions, {
 
         UserId: apiClient.getCurrentUserId(),
         ParentId: options.parentId,
@@ -210,7 +210,7 @@ class FilterMenu {
     show(options) {
         return new Promise( (resolve, reject) => {
             import('text!./filtermenu.template.html').then(({ default: template }) => {
-                var dialogOptions = {
+                const dialogOptions = {
                     removeOnClose: true,
                     scrollY: false
                 };
@@ -220,11 +220,11 @@ class FilterMenu {
                     dialogOptions.size = 'small';
                 }
 
-                var dlg = dialogHelper.createDialog(dialogOptions);
+                const dlg = dialogHelper.createDialog(dialogOptions);
 
                 dlg.classList.add('formDialog');
 
-                var html = '';
+                let html = '';
 
                 html += '<div class="formDialogHeader">';
                 html += '<button is="paper-icon-button-light" class="btnCancel hide-mouse-idle-tv" tabindex="-1"><span class="material-icons arrow_back"></span></button>';
@@ -236,7 +236,7 @@ class FilterMenu {
 
                 dlg.innerHTML = globalize.translateHtml(html, 'core');
 
-                var settingElements = dlg.querySelectorAll('.viewSetting');
+                const settingElements = dlg.querySelectorAll('.viewSetting');
                 for (let i = 0, length = settingElements.length; i < length; i++) {
                     if (options.visibleSettings.indexOf(settingElements[i].getAttribute('data-settingname')) === -1) {
                         settingElements[i].classList.add('hide');
@@ -257,7 +257,7 @@ class FilterMenu {
                     centerFocus(dlg.querySelector('.formDialogContent'), false, true);
                 }
 
-                var submitted;
+                let submitted;
 
                 dlg.querySelector('form').addEventListener('change', function () {
                     submitted = true;
diff --git a/src/components/focusManager.js b/src/components/focusManager.js
index a9ec377cce..90ff8b0703 100644
--- a/src/components/focusManager.js
+++ b/src/components/focusManager.js
@@ -3,7 +3,7 @@
 import dom from 'dom';
 import scrollManager from 'scrollManager';
 
-    var scopes = [];
+    const scopes = [];
     function pushScope(elem) {
         scopes.push(elem);
     }
@@ -15,7 +15,7 @@ import scrollManager from 'scrollManager';
     }
 
     function autoFocus(view, defaultToFirst, findAutoFocusElement) {
-        var element;
+        let element;
         if (findAutoFocusElement !== false) {
             element = view.querySelector('*[autofocus]');
             if (element) {
@@ -46,9 +46,9 @@ import scrollManager from 'scrollManager';
         }
     }
 
-    var focusableTagNames = ['INPUT', 'TEXTAREA', 'SELECT', 'BUTTON', 'A'];
-    var focusableContainerTagNames = ['BODY', 'DIALOG'];
-    var focusableQuery = focusableTagNames.map(function (t) {
+    const focusableTagNames = ['INPUT', 'TEXTAREA', 'SELECT', 'BUTTON', 'A'];
+    const focusableContainerTagNames = ['BODY', 'DIALOG'];
+    const focusableQuery = focusableTagNames.map(function (t) {
         if (t === 'INPUT') {
             t += ':not([type="range"]):not([type="file"])';
         }
@@ -69,7 +69,7 @@ import scrollManager from 'scrollManager';
 
     function normalizeFocusable(elem, originalElement) {
         if (elem) {
-            var tagName = elem.tagName;
+            const tagName = elem.tagName;
             if (!tagName || tagName === 'HTML' || tagName === 'BODY') {
                 elem = originalElement;
             }
@@ -79,10 +79,10 @@ import scrollManager from 'scrollManager';
     }
 
     function focusableParent(elem) {
-        var originalElement = elem;
+        const originalElement = elem;
 
         while (!isFocusable(elem)) {
-            var parent = elem.parentNode;
+            const parent = elem.parentNode;
 
             if (!parent) {
                 return normalizeFocusable(elem, originalElement);
@@ -115,7 +115,7 @@ import scrollManager from 'scrollManager';
         }
 
         if (elem.tagName === 'INPUT') {
-            var type = elem.type;
+            const type = elem.type;
             if (type === 'range') {
                 return false;
             }
@@ -132,11 +132,11 @@ import scrollManager from 'scrollManager';
     }
 
     function getFocusableElements(parent, limit, excludeClass) {
-        var elems = (parent || getDefaultScope()).querySelectorAll(focusableQuery);
-        var focusableElements = [];
+        const elems = (parent || getDefaultScope()).querySelectorAll(focusableQuery);
+        const focusableElements = [];
 
-        for (var i = 0, length = elems.length; i < length; i++) {
-            var elem = elems[i];
+        for (let i = 0, length = elems.length; i < length; i++) {
+            const elem = elems[i];
 
             if (excludeClass && elem.classList.contains(excludeClass)) {
                 continue;
@@ -159,7 +159,7 @@ import scrollManager from 'scrollManager';
             return true;
         }
 
-        var classList = elem.classList;
+        const classList = elem.classList;
 
         if (classList.contains('focuscontainer')) {
             return true;
@@ -208,7 +208,7 @@ import scrollManager from 'scrollManager';
     }
 
     function getOffset(elem) {
-        var box;
+        let box;
 
         // Support: BlackBerry 5, iOS 3 (original iPhone)
         // If we don't have gBCR, just use 0,0 rather than error
@@ -225,7 +225,7 @@ import scrollManager from 'scrollManager';
 
         if (box.right === null) {
             // Create a new object because some browsers will throw an error when trying to set data onto the Rect object
-            var newBox = {
+            const newBox = {
                 top: box.top,
                 left: box.left,
                 width: box.width,
@@ -255,27 +255,27 @@ import scrollManager from 'scrollManager';
             return;
         }
 
-        var focusableContainer = dom.parentWithClass(activeElement, 'focusable');
+        const focusableContainer = dom.parentWithClass(activeElement, 'focusable');
 
-        var rect = getOffset(activeElement);
+        const rect = getOffset(activeElement);
 
         // Get elements and work out x/y points
-        var point1x = parseFloat(rect.left) || 0;
-        var point1y = parseFloat(rect.top) || 0;
-        var point2x = parseFloat(point1x + rect.width - 1) || point1x;
-        var point2y = parseFloat(point1y + rect.height - 1) || point1y;
+        const point1x = parseFloat(rect.left) || 0;
+        const point1y = parseFloat(rect.top) || 0;
+        const point2x = parseFloat(point1x + rect.width - 1) || point1x;
+        const point2y = parseFloat(point1y + rect.height - 1) || point1y;
 
-        var sourceMidX = rect.left + (rect.width / 2);
-        var sourceMidY = rect.top + (rect.height / 2);
+        const sourceMidX = rect.left + (rect.width / 2);
+        const sourceMidY = rect.top + (rect.height / 2);
 
-        var focusable = focusableElements || container.querySelectorAll(focusableQuery);
+        const focusable = focusableElements || container.querySelectorAll(focusableQuery);
 
-        var maxDistance = Infinity;
-        var minDistance = maxDistance;
-        var nearestElement;
+        const maxDistance = Infinity;
+        let minDistance = maxDistance;
+        let nearestElement;
 
-        for (var i = 0, length = focusable.length; i < length; i++) {
-            var curr = focusable[i];
+        for (let i = 0, length = focusable.length; i < length; i++) {
+            const curr = focusable[i];
 
             if (curr === activeElement) {
                 continue;
@@ -285,7 +285,7 @@ import scrollManager from 'scrollManager';
                 continue;
             }
 
-            var elementRect = getOffset(curr);
+            const elementRect = getOffset(curr);
 
             // not currently visible
             if (!elementRect.width && !elementRect.height) {
@@ -333,16 +333,16 @@ import scrollManager from 'scrollManager';
                     break;
             }
 
-            var x = elementRect.left;
-            var y = elementRect.top;
-            var x2 = x + elementRect.width - 1;
-            var y2 = y + elementRect.height - 1;
+            const x = elementRect.left;
+            const y = elementRect.top;
+            const x2 = x + elementRect.width - 1;
+            const y2 = y + elementRect.height - 1;
 
-            var intersectX = intersects(point1x, point2x, x, x2);
-            var intersectY = intersects(point1y, point2y, y, y2);
+            const intersectX = intersects(point1x, point2x, x, x2);
+            const intersectY = intersects(point1y, point2y, y, y2);
 
-            var midX = elementRect.left + (elementRect.width / 2);
-            var midY = elementRect.top + (elementRect.height / 2);
+            const midX = elementRect.left + (elementRect.width / 2);
+            const midY = elementRect.top + (elementRect.height / 2);
 
             var distX;
             var distY;
@@ -372,7 +372,7 @@ import scrollManager from 'scrollManager';
                     break;
             }
 
-            var dist = Math.sqrt(distX * distX + distY * distY);
+            const dist = Math.sqrt(distX * distX + distY * distY);
 
             if (dist < minDistance) {
                 nearestElement = curr;
@@ -383,7 +383,7 @@ import scrollManager from 'scrollManager';
         if (nearestElement) {
             // See if there's a focusable container, and if so, send the focus command to that
             if (activeElement) {
-                var nearestElementFocusableParent = dom.parentWithClass(nearestElement, 'focusable');
+                const nearestElementFocusableParent = dom.parentWithClass(nearestElement, 'focusable');
                 if (nearestElementFocusableParent && nearestElementFocusableParent !== nearestElement) {
                     if (focusableContainer !== nearestElementFocusableParent) {
                         nearestElement = nearestElementFocusableParent;
@@ -403,16 +403,16 @@ import scrollManager from 'scrollManager';
     }
 
     function sendText(text) {
-        var elem = document.activeElement;
+        const elem = document.activeElement;
 
         elem.value = text;
     }
 
     function focusFirst(container, focusableSelector) {
-        var elems = container.querySelectorAll(focusableSelector);
+        const elems = container.querySelectorAll(focusableSelector);
 
-        for (var i = 0, length = elems.length; i < length; i++) {
-            var elem = elems[i];
+        for (let i = 0, length = elems.length; i < length; i++) {
+            const elem = elems[i];
 
             if (isCurrentlyFocusableInternal(elem)) {
                 focus(elem);
@@ -422,10 +422,10 @@ import scrollManager from 'scrollManager';
     }
 
     function focusLast(container, focusableSelector) {
-        var elems = [].slice.call(container.querySelectorAll(focusableSelector), 0).reverse();
+        const elems = [].slice.call(container.querySelectorAll(focusableSelector), 0).reverse();
 
-        for (var i = 0, length = elems.length; i < length; i++) {
-            var elem = elems[i];
+        for (let i = 0, length = elems.length; i < length; i++) {
+            const elem = elems[i];
 
             if (isCurrentlyFocusableInternal(elem)) {
                 focus(elem);
@@ -435,11 +435,11 @@ import scrollManager from 'scrollManager';
     }
 
     function moveFocus(sourceElement, container, focusableSelector, offset) {
-        var elems = container.querySelectorAll(focusableSelector);
-        var list = [];
-        var i;
-        var length;
-        var elem;
+        const elems = container.querySelectorAll(focusableSelector);
+        const list = [];
+        let i;
+        let length;
+        let elem;
 
         for (i = 0, length = elems.length; i < length; i++) {
             elem = elems[i];
@@ -449,7 +449,7 @@ import scrollManager from 'scrollManager';
             }
         }
 
-        var currentIndex = -1;
+        let currentIndex = -1;
 
         for (i = 0, length = list.length; i < length; i++) {
             elem = list[i];
@@ -464,11 +464,11 @@ import scrollManager from 'scrollManager';
             return;
         }
 
-        var newIndex = currentIndex + offset;
+        let newIndex = currentIndex + offset;
         newIndex = Math.max(0, newIndex);
         newIndex = Math.min(newIndex, list.length - 1);
 
-        var newElem = list[newIndex];
+        const newElem = list[newIndex];
         if (newElem) {
             focus(newElem);
         }
@@ -482,23 +482,23 @@ export default {
     focusableParent: focusableParent,
     getFocusableElements: getFocusableElements,
     moveLeft: function (sourceElement, options) {
-        var container = options ? options.container : null;
-        var focusableElements = options ? options.focusableElements : null;
+        const container = options ? options.container : null;
+        const focusableElements = options ? options.focusableElements : null;
         nav(sourceElement, 0, container, focusableElements);
     },
     moveRight: function (sourceElement, options) {
-        var container = options ? options.container : null;
-        var focusableElements = options ? options.focusableElements : null;
+        const container = options ? options.container : null;
+        const focusableElements = options ? options.focusableElements : null;
         nav(sourceElement, 1, container, focusableElements);
     },
     moveUp: function (sourceElement, options) {
-        var container = options ? options.container : null;
-        var focusableElements = options ? options.focusableElements : null;
+        const container = options ? options.container : null;
+        const focusableElements = options ? options.focusableElements : null;
         nav(sourceElement, 2, container, focusableElements);
     },
     moveDown: function (sourceElement, options) {
-        var container = options ? options.container : null;
-        var focusableElements = options ? options.focusableElements : null;
+        const container = options ? options.container : null;
+        const focusableElements = options ? options.focusableElements : null;
         nav(sourceElement, 3, container, focusableElements);
     },
     sendText: sendText,
diff --git a/src/components/groupedcards.js b/src/components/groupedcards.js
index 38d08d129b..947b3b8569 100644
--- a/src/components/groupedcards.js
+++ b/src/components/groupedcards.js
@@ -4,19 +4,19 @@ import dom from 'dom';
 import appRouter from 'appRouter';
 
     function onGroupedCardClick(e, card) {
-        var itemId = card.getAttribute('data-id');
-        var serverId = card.getAttribute('data-serverid');
-        var apiClient = window.connectionManager.getApiClient(serverId);
-        var userId = apiClient.getCurrentUserId();
-        var playedIndicator = card.querySelector('.playedIndicator');
-        var playedIndicatorHtml = playedIndicator ? playedIndicator.innerHTML : null;
-        var options = {
+        const itemId = card.getAttribute('data-id');
+        const serverId = card.getAttribute('data-serverid');
+        const apiClient = window.connectionManager.getApiClient(serverId);
+        const userId = apiClient.getCurrentUserId();
+        const playedIndicator = card.querySelector('.playedIndicator');
+        const playedIndicatorHtml = playedIndicator ? playedIndicator.innerHTML : null;
+        const options = {
             Limit: parseInt(playedIndicatorHtml || '10'),
             Fields: 'PrimaryImageAspectRatio,DateCreated',
             ParentId: itemId,
             GroupItems: false
         };
-        var actionableParent = dom.parentWithTag(e.target, ['A', 'BUTTON', 'INPUT']);
+        const actionableParent = dom.parentWithTag(e.target, ['A', 'BUTTON', 'INPUT']);
 
         if (!actionableParent || actionableParent.classList.contains('cardContent')) {
             apiClient.getJSON(apiClient.getUrl('Users/' + userId + '/Items/Latest', options)).then(function (items) {
@@ -24,7 +24,7 @@ import appRouter from 'appRouter';
                     return void appRouter.showItem(items[0]);
                 }
 
-                var url = 'details?id=' + itemId + '&serverId=' + serverId;
+                const url = 'details?id=' + itemId + '&serverId=' + serverId;
                 Dashboard.navigate(url);
             });
             e.stopPropagation();
@@ -34,7 +34,7 @@ import appRouter from 'appRouter';
     }
 
     export default function onItemsContainerClick(e) {
-        var groupedCard = dom.parentWithClass(e.target, 'groupedCard');
+        const groupedCard = dom.parentWithClass(e.target, 'groupedCard');
 
         if (groupedCard) {
             onGroupedCardClick(e, groupedCard);
diff --git a/src/components/htmlMediaHelper.js b/src/components/htmlMediaHelper.js
index 4095502aae..31fc4c29c8 100644
--- a/src/components/htmlMediaHelper.js
+++ b/src/components/htmlMediaHelper.js
@@ -23,7 +23,7 @@ import events from 'events';
     }
 
     function canPlayNativeHls() {
-        var media = document.createElement('video');
+        const media = document.createElement('video');
 
         if (media.canPlayType('application/x-mpegURL').replace(/no/, '') ||
             media.canPlayType('application/vnd.apple.mpegURL').replace(/no/, '')) {
@@ -71,16 +71,16 @@ import events from 'events';
         return true;
     }
 
-    var recoverDecodingErrorDate;
-    var recoverSwapAudioCodecDate;
+    let recoverDecodingErrorDate;
+    let recoverSwapAudioCodecDate;
     export function handleHlsJsMediaError(instance, reject) {
-        var hlsPlayer = instance._hlsPlayer;
+        const hlsPlayer = instance._hlsPlayer;
 
         if (!hlsPlayer) {
             return;
         }
 
-        var now = Date.now();
+        let now = Date.now();
 
         if (window.performance && window.performance.now) {
             now = performance.now(); // eslint-disable-line compat/compat
@@ -136,7 +136,7 @@ import events from 'events';
     }
 
     export function seekOnPlaybackStart(instance, element, ticks, onMediaReady) {
-        var seconds = (ticks || 0) / 10000000;
+        const seconds = (ticks || 0) / 10000000;
 
         if (seconds) {
             // Appending #t=xxx to the query string doesn't seem to work with HLS
@@ -148,7 +148,7 @@ import events from 'events';
                 if (onMediaReady) onMediaReady();
             } else {
                 // update video player position when media is ready to be sought
-                var events = ['durationchange', 'loadeddata', 'play', 'loadedmetadata'];
+                const events = ['durationchange', 'loadeddata', 'play', 'loadedmetadata'];
                 var onMediaChange = function(e) {
                     if (element.currentTime === 0 && element.duration >= seconds) {
                         // seek only when video position is exactly zero,
@@ -173,10 +173,10 @@ import events from 'events';
     export function applySrc(elem, src, options) {
         if (window.Windows && options.mediaSource && options.mediaSource.IsLocal) {
             return Windows.Storage.StorageFile.getFileFromPathAsync(options.url).then(function (file) {
-                var playlist = new Windows.Media.Playback.MediaPlaybackList();
+                const playlist = new Windows.Media.Playback.MediaPlaybackList();
 
-                var source1 = Windows.Media.Core.MediaSource.createFromStorageFile(file);
-                var startTime = (options.playerStartPositionTicks || 0) / 10000;
+                const source1 = Windows.Media.Core.MediaSource.createFromStorageFile(file);
+                const startTime = (options.playerStartPositionTicks || 0) / 10000;
                 playlist.items.append(new Windows.Media.Playback.MediaPlaybackItem(source1, startTime));
                 elem.src = URL.createObjectURL(playlist, { oneTimeOnly: true });
                 return Promise.resolve();
@@ -194,11 +194,11 @@ import events from 'events';
 
     export function playWithPromise(elem, onErrorFn) {
         try {
-            var promise = elem.play();
+            const promise = elem.play();
             if (promise && promise.then) {
                 // Chrome now returns a promise
                 return promise.catch(function (e) {
-                    var errorName = (e.name || '').toLowerCase();
+                    const errorName = (e.name || '').toLowerCase();
                     // safari uses aborterror
                     if (errorName === 'notallowederror' ||
                         errorName === 'aborterror') {
@@ -219,7 +219,7 @@ import events from 'events';
     }
 
     export function destroyCastPlayer(instance) {
-        var player = instance._castPlayer;
+        const player = instance._castPlayer;
         if (player) {
             try {
                 player.unload();
@@ -232,7 +232,7 @@ import events from 'events';
     }
 
     export function destroyHlsPlayer(instance) {
-        var player = instance._hlsPlayer;
+        const player = instance._hlsPlayer;
         if (player) {
             try {
                 player.destroy();
@@ -245,7 +245,7 @@ import events from 'events';
     }
 
     export function destroyFlvPlayer(instance) {
-        var player = instance._flvPlayer;
+        const player = instance._flvPlayer;
         if (player) {
             try {
                 player.unload();
@@ -356,7 +356,7 @@ import events from 'events';
         destroyFlvPlayer(instance);
         destroyCastPlayer(instance);
 
-        var stopInfo = {
+        const stopInfo = {
             src: instance._currentSrc
         };
 
@@ -368,20 +368,20 @@ import events from 'events';
     }
 
     export function getBufferedRanges(instance, elem) {
-        var ranges = [];
-        var seekable = elem.buffered || [];
+        const ranges = [];
+        const seekable = elem.buffered || [];
 
-        var offset;
-        var currentPlayOptions = instance._currentPlayOptions;
+        let offset;
+        const currentPlayOptions = instance._currentPlayOptions;
         if (currentPlayOptions) {
             offset = currentPlayOptions.transcodingOffsetTicks;
         }
 
         offset = offset || 0;
 
-        for (var i = 0, length = seekable.length; i < length; i++) {
-            var start = seekable.start(i);
-            var end = seekable.end(i);
+        for (let i = 0, length = seekable.length; i < length; i++) {
+            let start = seekable.start(i);
+            let end = seekable.end(i);
 
             if (!isValidDuration(start)) {
                 start = 0;
diff --git a/src/components/imageOptionsEditor/imageOptionsEditor.js b/src/components/imageOptionsEditor/imageOptionsEditor.js
index 41fe9b4c94..d112dd65cc 100644
--- a/src/components/imageOptionsEditor/imageOptionsEditor.js
+++ b/src/components/imageOptionsEditor/imageOptionsEditor.js
@@ -93,7 +93,7 @@ import 'emby-input';
         const response = await fetch('components/imageOptionsEditor/imageOptionsEditor.template.html');
         const template = await response.text();
 
-        var dlg = dialogHelper.createDialog({
+        const dlg = dialogHelper.createDialog({
             size: 'small',
             removeOnClose: true,
             scrollY: false
diff --git a/src/components/imageeditor/imageeditor.js b/src/components/imageeditor/imageeditor.js
index a21fb76270..e5b59cfb22 100644
--- a/src/components/imageeditor/imageeditor.js
+++ b/src/components/imageeditor/imageeditor.js
@@ -58,8 +58,8 @@ import 'css!./imageeditor';
         currentItem = item;
 
         apiClient.getRemoteImageProviders(getBaseRemoteOptions()).then(function (providers) {
-            var btnBrowseAllImages = page.querySelectorAll('.btnBrowseAllImages');
-            for (var i = 0, length = btnBrowseAllImages.length; i < length; i++) {
+            const btnBrowseAllImages = page.querySelectorAll('.btnBrowseAllImages');
+            for (let i = 0, length = btnBrowseAllImages.length; i < length; i++) {
                 if (providers.length) {
                     btnBrowseAllImages[i].classList.remove('hide');
                 } else {
diff --git a/src/components/images/imageLoader.js b/src/components/images/imageLoader.js
index b0ffecd64f..9dc708098d 100644
--- a/src/components/images/imageLoader.js
+++ b/src/components/images/imageLoader.js
@@ -56,7 +56,7 @@ import 'css!./style';
             throw new Error('entry cannot be null');
         }
         const target = entry.target;
-        var source = undefined;
+        let source = undefined;
 
         if (target) {
             source = target.getAttribute('data-src');
@@ -106,7 +106,7 @@ import 'css!./style';
     }
 
     function emptyImageElement(elem) {
-        var url;
+        let url;
 
         if (elem.tagName !== 'IMG') {
             url = elem.style.backgroundImage.slice(4, -1).replace(/"/g, '');
@@ -137,10 +137,10 @@ import 'css!./style';
     }
 
     export function getPrimaryImageAspectRatio(items) {
-        var values = [];
+        const values = [];
 
-        for (var i = 0, length = items.length; i < length; i++) {
-            var ratio = items[i].PrimaryImageAspectRatio || 0;
+        for (let i = 0, length = items.length; i < length; i++) {
+            const ratio = items[i].PrimaryImageAspectRatio || 0;
 
             if (!ratio) {
                 continue;
@@ -158,9 +158,9 @@ import 'css!./style';
             return a - b;
         });
 
-        var half = Math.floor(values.length / 2);
+        const half = Math.floor(values.length / 2);
 
-        var result;
+        let result;
 
         if (values.length % 2) {
             result = values[half];
@@ -169,13 +169,13 @@ import 'css!./style';
         }
 
         // If really close to 2:3 (poster image), just return 2:3
-        var aspect2x3 = 2 / 3;
+        const aspect2x3 = 2 / 3;
         if (Math.abs(aspect2x3 - result) <= 0.15) {
             return aspect2x3;
         }
 
         // If really close to 16:9 (episode image), just return 16:9
-        var aspect16x9 = 16 / 9;
+        const aspect16x9 = 16 / 9;
         if (Math.abs(aspect16x9 - result) <= 0.2) {
             return aspect16x9;
         }
@@ -186,7 +186,7 @@ import 'css!./style';
         }
 
         // If really close to 4:3 (poster image), just return 2:3
-        var aspect4x3 = 4 / 3;
+        const aspect4x3 = 4 / 3;
         if (Math.abs(aspect4x3 - result) <= 0.15) {
             return aspect4x3;
         }
@@ -195,8 +195,8 @@ import 'css!./style';
     }
 
     export function fillImages(elems) {
-        for (var i = 0, length = elems.length; i < length; i++) {
-            var elem = elems[0];
+        for (let i = 0, length = elems.length; i < length; i++) {
+            const elem = elems[0];
             fillImage(elem);
         }
     }
diff --git a/src/components/listview/listview.js b/src/components/listview/listview.js
index 7837003250..e0fbc2fd2e 100644
--- a/src/components/listview/listview.js
+++ b/src/components/listview/listview.js
@@ -256,8 +256,8 @@ import 'emby-playstatebutton';
             }
 
             if (options.image !== false) {
-                var imgUrl = options.imageSource === 'channel' ? getChannelImageUrl(item, downloadWidth) : getImageUrl(item, downloadWidth);
-                var imageClass = isLargeStyle ? 'listItemImage listItemImage-large' : 'listItemImage';
+                const imgUrl = options.imageSource === 'channel' ? getChannelImageUrl(item, downloadWidth) : getImageUrl(item, downloadWidth);
+                let imageClass = isLargeStyle ? 'listItemImage listItemImage-large' : 'listItemImage';
 
                 if (isLargeStyle && layoutManager.tv) {
                     imageClass += ' listItemImage-large-tv';
diff --git a/src/components/metadataEditor/metadataEditor.js b/src/components/metadataEditor/metadataEditor.js
index e2ff2a6b56..b768e77c4f 100644
--- a/src/components/metadataEditor/metadataEditor.js
+++ b/src/components/metadataEditor/metadataEditor.js
@@ -239,7 +239,7 @@ import 'flexStyles';
     }
 
     function afterDeleted(context, item) {
-        var parentId = item.ParentId || item.SeasonId || item.SeriesId;
+        const parentId = item.ParentId || item.SeasonId || item.SeriesId;
 
         if (parentId) {
             reload(context, parentId, item.ServerId);
@@ -252,7 +252,7 @@ import 'flexStyles';
 
     function showMoreMenu(context, button, user) {
         import('itemContextMenu').then(({default: itemContextMenu}) => {
-            var item = currentItem;
+            const item = currentItem;
 
             itemContextMenu.show({
                 item: item,
diff --git a/src/components/nowPlayingBar/nowPlayingBar.js b/src/components/nowPlayingBar/nowPlayingBar.js
index d9521c4c9e..6218197700 100644
--- a/src/components/nowPlayingBar/nowPlayingBar.js
+++ b/src/components/nowPlayingBar/nowPlayingBar.js
@@ -582,7 +582,7 @@ import 'emby-ratingbutton';
 
     function onPlaybackStart(e, state) {
         console.debug('nowplaying event: ' + e.type);
-        var player = this;
+        const player = this;
         onStateChanged.call(player, e, state);
     }
 
diff --git a/src/components/packageManager.js b/src/components/packageManager.js
index 2a15a14f34..c4b4701e9d 100644
--- a/src/components/packageManager.js
+++ b/src/components/packageManager.js
@@ -8,7 +8,7 @@ import pluginManager from 'pluginManager';
 
         init() {
             console.groupCollapsed('loading packages');
-            var manifestUrls = JSON.parse(appSettings.get(this.#settingsKey) || '[]');
+            const manifestUrls = JSON.parse(appSettings.get(this.#settingsKey) || '[]');
 
             return Promise.all(manifestUrls.map((url) => {
                 return this.loadPackage(url);
@@ -30,7 +30,7 @@ import pluginManager from 'pluginManager';
 
         install(url) {
             return this.loadPackage(url, true).then((pkg) => {
-                var manifestUrls = JSON.parse(appSettings.get(this.#settingsKey) || '[]');
+                const manifestUrls = JSON.parse(appSettings.get(this.#settingsKey) || '[]');
 
                 if (!manifestUrls.includes(url)) {
                     manifestUrls.push(url);
@@ -42,7 +42,7 @@ import pluginManager from 'pluginManager';
         }
 
         uninstall(name) {
-            var pkg = this.#packagesList.filter((p) => {
+            const pkg = this.#packagesList.filter((p) => {
                 return p.name === name;
             })[0];
 
@@ -58,12 +58,12 @@ import pluginManager from 'pluginManager';
         }
 
         mapPath(pkg, pluginUrl) {
-            var urlLower = pluginUrl.toLowerCase();
+            const urlLower = pluginUrl.toLowerCase();
             if (urlLower.startsWith('http:') || urlLower.startsWith('https:') || urlLower.startsWith('file:')) {
                 return pluginUrl;
             }
 
-            var packageUrl = pkg.url;
+            let packageUrl = pkg.url;
             packageUrl = packageUrl.substring(0, packageUrl.lastIndexOf('/'));
 
             packageUrl += '/';
@@ -81,7 +81,7 @@ import pluginManager from 'pluginManager';
         }
 
         removeUrl(url) {
-            var manifestUrls = JSON.parse(appSettings.get(this.#settingsKey) || '[]');
+            let manifestUrls = JSON.parse(appSettings.get(this.#settingsKey) || '[]');
 
             manifestUrls = manifestUrls.filter((i) => {
                 return i !== url;
@@ -92,14 +92,14 @@ import pluginManager from 'pluginManager';
 
         loadPackage(url, throwError = false) {
             return new Promise((resolve, reject) => {
-                var xhr = new XMLHttpRequest();
-                var originalUrl = url;
+                const xhr = new XMLHttpRequest();
+                const originalUrl = url;
                 url += url.indexOf('?') === -1 ? '?' : '&';
                 url += 't=' + new Date().getTime();
 
                 xhr.open('GET', url, true);
 
-                var onError = () => {
+                const onError = () => {
                     if (throwError === true) {
                         reject();
                     } else {
@@ -110,16 +110,16 @@ import pluginManager from 'pluginManager';
 
                 xhr.onload = () => {
                     if (this.status < 400) {
-                        var pkg = JSON.parse(this.response);
+                        const pkg = JSON.parse(this.response);
                         pkg.url = originalUrl;
 
                         this.addPackage(pkg);
 
-                        var plugins = pkg.plugins || [];
+                        const plugins = pkg.plugins || [];
                         if (pkg.plugin) {
                             plugins.push(pkg.plugin);
                         }
-                        var promises = plugins.map((pluginUrl) => {
+                        const promises = plugins.map((pluginUrl) => {
                             return pluginManager.loadPlugin(this.mapPath(pkg, pluginUrl));
                         });
                         Promise.all(promises).then(resolve, resolve);
diff --git a/src/components/playback/brightnessosd.js b/src/components/playback/brightnessosd.js
index 9d5db62fe0..78c40d10c1 100644
--- a/src/components/playback/brightnessosd.js
+++ b/src/components/playback/brightnessosd.js
@@ -5,15 +5,15 @@ import browser from 'browser';
 import 'css!./iconosd';
 import 'material-icons';
 
-var currentPlayer;
-var osdElement;
-var iconElement;
-var progressElement;
+let currentPlayer;
+let osdElement;
+let iconElement;
+let progressElement;
 
-var enableAnimation;
+let enableAnimation;
 
 function getOsdElementHtml() {
-    var html = '';
+    let html = '';
 
     html += '<span class="material-icons iconOsdIcon brightness_high"></span>';
 
@@ -23,7 +23,7 @@ function getOsdElementHtml() {
 }
 
 function ensureOsdElement() {
-    var elem = osdElement;
+    let elem = osdElement;
     if (!elem) {
         enableAnimation = browser.supportsCssAnimation();
 
@@ -46,11 +46,11 @@ function onHideComplete() {
     this.classList.add('hide');
 }
 
-var hideTimeout;
+let hideTimeout;
 function showOsd() {
     clearHideTimeout();
 
-    var elem = osdElement;
+    const elem = osdElement;
 
     dom.removeEventListener(elem, dom.whichTransitionEvent(), onHideComplete, {
         once: true
@@ -78,7 +78,7 @@ function clearHideTimeout() {
 function hideOsd() {
     clearHideTimeout();
 
-    var elem = osdElement;
+    const elem = osdElement;
     if (elem) {
         if (enableAnimation) {
             // trigger reflow
@@ -118,7 +118,7 @@ function updateElementsFromPlayer(brightness) {
 }
 
 function releaseCurrentPlayer() {
-    var player = currentPlayer;
+    const player = currentPlayer;
 
     if (player) {
         events.off(player, 'brightnesschange', onBrightnessChanged);
@@ -128,7 +128,7 @@ function releaseCurrentPlayer() {
 }
 
 function onBrightnessChanged(e) {
-    var player = this;
+    const player = this;
 
     ensureOsdElement();
 
diff --git a/src/components/playback/nowplayinghelper.js b/src/components/playback/nowplayinghelper.js
index d7f9d04865..a2b72ca84f 100644
--- a/src/components/playback/nowplayinghelper.js
+++ b/src/components/playback/nowplayinghelper.js
@@ -1,7 +1,7 @@
 export function getNowPlayingNames(nowPlayingItem, includeNonNameInfo) {
-    var topItem = nowPlayingItem;
-    var bottomItem = null;
-    var topText = nowPlayingItem.Name;
+    let topItem = nowPlayingItem;
+    let bottomItem = null;
+    let topText = nowPlayingItem.Name;
 
     if (nowPlayingItem.AlbumId && nowPlayingItem.MediaType === 'Audio') {
         topItem = {
@@ -21,7 +21,7 @@ export function getNowPlayingNames(nowPlayingItem, includeNonNameInfo) {
         }
     }
 
-    var bottomText = '';
+    let bottomText = '';
 
     if (nowPlayingItem.ArtistItems && nowPlayingItem.ArtistItems.length) {
         bottomItem = {
@@ -56,7 +56,7 @@ export function getNowPlayingNames(nowPlayingItem, includeNonNameInfo) {
         bottomText = nowPlayingItem.ProductionYear;
     }
 
-    var list = [];
+    const list = [];
 
     list.push({
         text: topText,
diff --git a/src/components/playback/playbackorientation.js b/src/components/playback/playbackorientation.js
index b73377bade..f585f25ae1 100644
--- a/src/components/playback/playbackorientation.js
+++ b/src/components/playback/playbackorientation.js
@@ -2,7 +2,7 @@ import playbackManager from 'playbackManager';
 import layoutManager from 'layoutManager';
 import events from 'events';
 
-var orientationLocked;
+let orientationLocked;
 
 function onOrientationChangeSuccess() {
     orientationLocked = true;
@@ -14,15 +14,15 @@ function onOrientationChangeError(err) {
 }
 
 events.on(playbackManager, 'playbackstart', function (e, player, state) {
-    var isLocalVideo = player.isLocalPlayer && !player.isExternalPlayer && playbackManager.isPlayingVideo(player);
+    const isLocalVideo = player.isLocalPlayer && !player.isExternalPlayer && playbackManager.isPlayingVideo(player);
 
     if (isLocalVideo && layoutManager.mobile) {
         /* eslint-disable-next-line compat/compat */
-        var lockOrientation = window.screen.lockOrientation || window.screen.mozLockOrientation || window.screen.msLockOrientation || (window.screen.orientation && window.screen.orientation.lock);
+        const lockOrientation = window.screen.lockOrientation || window.screen.mozLockOrientation || window.screen.msLockOrientation || (window.screen.orientation && window.screen.orientation.lock);
 
         if (lockOrientation) {
             try {
-                var promise = lockOrientation('landscape');
+                const promise = lockOrientation('landscape');
                 if (promise.then) {
                     promise.then(onOrientationChangeSuccess, onOrientationChangeError);
                 } else {
@@ -39,7 +39,7 @@ events.on(playbackManager, 'playbackstart', function (e, player, state) {
 events.on(playbackManager, 'playbackstop', function (e, playbackStopInfo) {
     if (orientationLocked && !playbackStopInfo.nextMediaType) {
         /* eslint-disable-next-line compat/compat */
-        var unlockOrientation = window.screen.unlockOrientation || window.screen.mozUnlockOrientation || window.screen.msUnlockOrientation || (window.screen.orientation && window.screen.orientation.unlock);
+        const unlockOrientation = window.screen.unlockOrientation || window.screen.mozUnlockOrientation || window.screen.msUnlockOrientation || (window.screen.orientation && window.screen.orientation.unlock);
 
         if (unlockOrientation) {
             try {
diff --git a/src/components/playback/playerSelectionMenu.js b/src/components/playback/playerSelectionMenu.js
index 0afa56faf4..38ff399a9e 100644
--- a/src/components/playback/playerSelectionMenu.js
+++ b/src/components/playback/playerSelectionMenu.js
@@ -9,7 +9,7 @@ import appHost from 'apphost';
 import * as autocast from 'autocast';
 
 function mirrorItem(info, player) {
-    var item = info.item;
+    const item = info.item;
 
     playbackManager.displayContent({
 
@@ -22,7 +22,7 @@ function mirrorItem(info, player) {
 
 function mirrorIfEnabled(info) {
     if (info && playbackManager.enableDisplayMirroring()) {
-        var getPlayerInfo = playbackManager.getPlayerInfo();
+        const getPlayerInfo = playbackManager.getPlayerInfo();
 
         if (getPlayerInfo) {
             if (!getPlayerInfo.isLocalPlayer && getPlayerInfo.supportedCommands.indexOf('DisplayContent') !== -1) {
@@ -45,7 +45,7 @@ function getTargetSecondaryText(target) {
 }
 
 function getIcon(target) {
-    var deviceType = target.deviceType;
+    let deviceType = target.deviceType;
 
     if (!deviceType && target.isLocalPlayer) {
         if (browser.tv) {
@@ -78,7 +78,7 @@ function getIcon(target) {
 }
 
 export function show(button) {
-    var currentPlayerInfo = playbackManager.getPlayerInfo();
+    const currentPlayerInfo = playbackManager.getPlayerInfo();
 
     if (currentPlayerInfo) {
         if (!currentPlayerInfo.isLocalPlayer) {
@@ -87,13 +87,13 @@ export function show(button) {
         }
     }
 
-    var currentPlayerId = currentPlayerInfo ? currentPlayerInfo.id : null;
+    const currentPlayerId = currentPlayerInfo ? currentPlayerInfo.id : null;
 
     loading.show();
 
     playbackManager.getTargets().then(function (targets) {
-        var menuItems = targets.map(function (t) {
-            var name = t.name;
+        const menuItems = targets.map(function (t) {
+            let name = t.name;
 
             if (t.appName && t.appName !== t.name) {
                 name += ' - ' + t.appName;
@@ -111,7 +111,7 @@ export function show(button) {
         import('actionsheet').then(({default: actionsheet}) => {
             loading.hide();
 
-            var menuOptions = {
+            const menuOptions = {
                 title: globalize.translate('HeaderPlayOn'),
                 items: menuItems,
                 positionTo: button,
@@ -127,7 +127,7 @@ export function show(button) {
             }
 
             actionsheet.show(menuOptions).then(function (id) {
-                var target = targets.filter(function (t) {
+                const target = targets.filter(function (t) {
                     return t.id === id;
                 })[0];
 
@@ -153,7 +153,7 @@ function showActivePlayerMenu(playerInfo) {
 function disconnectFromPlayer(currentDeviceName) {
     if (playbackManager.getSupportedCommands().indexOf('EndSession') !== -1) {
         import('dialog').then(({default: dialog}) => {
-            var menuItems = [];
+            const menuItems = [];
 
             menuItems.push({
                 name: globalize.translate('Yes'),
@@ -188,9 +188,9 @@ function disconnectFromPlayer(currentDeviceName) {
 }
 
 function showActivePlayerMenuInternal(dialogHelper, playerInfo) {
-    var html = '';
+    let html = '';
 
-    var dialogOptions = {
+    const dialogOptions = {
         removeOnClose: true
     };
 
@@ -199,11 +199,11 @@ function showActivePlayerMenuInternal(dialogHelper, playerInfo) {
     dialogOptions.exitAnimationDuration = 160;
     dialogOptions.autoFocus = false;
 
-    var dlg = dialogHelper.createDialog(dialogOptions);
+    const dlg = dialogHelper.createDialog(dialogOptions);
 
     dlg.classList.add('promptDialog');
 
-    var currentDeviceName = (playerInfo.deviceName || playerInfo.name);
+    const currentDeviceName = (playerInfo.deviceName || playerInfo.name);
 
     html += '<div class="promptDialogContent" style="padding:1.5em;">';
     html += '<h2 style="margin-top:.5em;">';
@@ -214,7 +214,7 @@ function showActivePlayerMenuInternal(dialogHelper, playerInfo) {
 
     if (playerInfo.supportedCommands.indexOf('DisplayContent') !== -1) {
         html += '<label class="checkboxContainer">';
-        var checkedHtml = playbackManager.enableDisplayMirroring() ? ' checked' : '';
+        const checkedHtml = playbackManager.enableDisplayMirroring() ? ' checked' : '';
         html += '<input type="checkbox" is="emby-checkbox" class="chkMirror"' + checkedHtml + '/>';
         html += '<span>' + globalize.translate('EnableDisplayMirroring') + '</span>';
         html += '</label>';
@@ -224,7 +224,7 @@ function showActivePlayerMenuInternal(dialogHelper, playerInfo) {
 
     if (autocast.supported()) {
         html += '<div><label class="checkboxContainer">';
-        var checkedHtmlAC = autocast.isEnabled() ? ' checked' : '';
+        const checkedHtmlAC = autocast.isEnabled() ? ' checked' : '';
         html += '<input type="checkbox" is="emby-checkbox" class="chkAutoCast"' + checkedHtmlAC + '/>';
         html += '<span>' + globalize.translate('EnableAutoCast') + '</span>';
         html += '</label></div>';
@@ -240,21 +240,21 @@ function showActivePlayerMenuInternal(dialogHelper, playerInfo) {
     html += '</div>';
     dlg.innerHTML = html;
 
-    var chkMirror = dlg.querySelector('.chkMirror');
+    const chkMirror = dlg.querySelector('.chkMirror');
 
     if (chkMirror) {
         chkMirror.addEventListener('change', onMirrorChange);
     }
 
-    var chkAutoCast = dlg.querySelector('.chkAutoCast');
+    const chkAutoCast = dlg.querySelector('.chkAutoCast');
 
     if (chkAutoCast) {
         chkAutoCast.addEventListener('change', onAutoCastChange);
     }
 
-    var destination = '';
+    let destination = '';
 
-    var btnRemoteControl = dlg.querySelector('.btnRemoteControl');
+    const btnRemoteControl = dlg.querySelector('.btnRemoteControl');
     if (btnRemoteControl) {
         btnRemoteControl.addEventListener('click', function () {
             destination = 'nowplaying';
@@ -289,8 +289,8 @@ function onAutoCastChange() {
 }
 
 document.addEventListener('viewshow', function (e) {
-    var state = e.detail.state || {};
-    var item = state.item;
+    const state = e.detail.state || {};
+    const item = state.item;
 
     if (item && item.ServerId) {
         mirrorIfEnabled({
diff --git a/src/components/playback/playersettingsmenu.js b/src/components/playback/playersettingsmenu.js
index 77f22b6b6c..40819f62ea 100644
--- a/src/components/playback/playersettingsmenu.js
+++ b/src/components/playback/playersettingsmenu.js
@@ -4,13 +4,13 @@ import globalize from 'globalize';
 import qualityoptions from 'qualityoptions';
 
 function showQualityMenu(player, btn) {
-    var videoStream = playbackManager.currentMediaSource(player).MediaStreams.filter(function (stream) {
+    const videoStream = playbackManager.currentMediaSource(player).MediaStreams.filter(function (stream) {
         return stream.Type === 'Video';
     })[0];
-    var videoWidth = videoStream ? videoStream.Width : null;
-    var videoHeight = videoStream ? videoStream.Height : null;
+    const videoWidth = videoStream ? videoStream.Width : null;
+    const videoHeight = videoStream ? videoStream.Height : null;
 
-    var options = qualityoptions.getVideoQualityOptions({
+    const options = qualityoptions.getVideoQualityOptions({
         currentMaxBitrate: playbackManager.getMaxStreamingBitrate(player),
         isAutomaticBitrateEnabled: playbackManager.enableAutomaticBitrateDetection(player),
         videoWidth: videoWidth,
@@ -18,8 +18,8 @@ function showQualityMenu(player, btn) {
         enableAuto: true
     });
 
-    var menuItems = options.map(function (o) {
-        var opt = {
+    const menuItems = options.map(function (o) {
+        const opt = {
             name: o.name,
             id: o.bitrate,
             asideText: o.secondaryText
@@ -32,7 +32,7 @@ function showQualityMenu(player, btn) {
         return opt;
     });
 
-    var selectedId = options.filter(function (o) {
+    let selectedId = options.filter(function (o) {
         return o.selected;
     });
 
@@ -42,7 +42,7 @@ function showQualityMenu(player, btn) {
         items: menuItems,
         positionTo: btn
     }).then(function (id) {
-        var bitrate = parseInt(id);
+        const bitrate = parseInt(id);
         if (bitrate !== selectedId) {
             playbackManager.setMaxStreamingBitrate({
                 enableAutomaticBitrateDetection: bitrate ? false : true,
@@ -53,8 +53,8 @@ function showQualityMenu(player, btn) {
 }
 
 function showRepeatModeMenu(player, btn) {
-    var menuItems = [];
-    var currentValue = playbackManager.getRepeatMode(player);
+    const menuItems = [];
+    const currentValue = playbackManager.getRepeatMode(player);
 
     menuItems.push({
         name: globalize.translate('RepeatAll'),
@@ -85,16 +85,16 @@ function showRepeatModeMenu(player, btn) {
 }
 
 function getQualitySecondaryText(player) {
-    var state = playbackManager.getPlayerState(player);
+    const state = playbackManager.getPlayerState(player);
 
-    var videoStream = playbackManager.currentMediaSource(player).MediaStreams.filter(function (stream) {
+    const videoStream = playbackManager.currentMediaSource(player).MediaStreams.filter(function (stream) {
         return stream.Type === 'Video';
     })[0];
 
-    var videoWidth = videoStream ? videoStream.Width : null;
-    var videoHeight = videoStream ? videoStream.Height : null;
+    const videoWidth = videoStream ? videoStream.Width : null;
+    const videoHeight = videoStream ? videoStream.Height : null;
 
-    var options = qualityoptions.getVideoQualityOptions({
+    const options = qualityoptions.getVideoQualityOptions({
         currentMaxBitrate: playbackManager.getMaxStreamingBitrate(player),
         isAutomaticBitrateEnabled: playbackManager.enableAutomaticBitrateDetection(player),
         videoWidth: videoWidth,
@@ -102,7 +102,7 @@ function getQualitySecondaryText(player) {
         enableAuto: true
     });
 
-    var selectedOption = options.filter(function (o) {
+    let selectedOption = options.filter(function (o) {
         return o.selected;
     });
 
@@ -111,7 +111,7 @@ function getQualitySecondaryText(player) {
     }
 
     selectedOption = selectedOption[0];
-    var text = selectedOption.name;
+    let text = selectedOption.name;
 
     if (selectedOption.autoText) {
         if (state.PlayState && state.PlayState.PlayMethod !== 'Transcode') {
@@ -126,8 +126,8 @@ function getQualitySecondaryText(player) {
 
 function showAspectRatioMenu(player, btn) {
     // each has a name and id
-    var currentId = playbackManager.getAspectRatio(player);
-    var menuItems = playbackManager.getSupportedAspectRatios(player).map(function (i) {
+    const currentId = playbackManager.getAspectRatio(player);
+    const menuItems = playbackManager.getSupportedAspectRatios(player).map(function (i) {
         return {
             id: i.id,
             name: i.name,
@@ -171,12 +171,12 @@ function showPlaybackRateMenu(player, btn) {
 }
 
 function showWithUser(options, player, user) {
-    var supportedCommands = playbackManager.getSupportedCommands(player);
+    const supportedCommands = playbackManager.getSupportedCommands(player);
 
-    var menuItems = [];
+    const menuItems = [];
     if (supportedCommands.indexOf('SetAspectRatio') !== -1) {
-        var currentAspectRatioId = playbackManager.getAspectRatio(player);
-        var currentAspectRatio = playbackManager.getSupportedAspectRatios(player).filter(function (i) {
+        const currentAspectRatioId = playbackManager.getAspectRatio(player);
+        const currentAspectRatio = playbackManager.getSupportedAspectRatios(player).filter(function (i) {
             return i.id === currentAspectRatioId;
         })[0];
 
@@ -199,7 +199,7 @@ function showWithUser(options, player, user) {
     }
 
     if (user && user.Policy.EnableVideoPlaybackTranscoding) {
-        var secondaryQualityText = getQualitySecondaryText(player);
+        const secondaryQualityText = getQualitySecondaryText(player);
 
         menuItems.push({
             name: globalize.translate('Quality'),
@@ -208,7 +208,7 @@ function showWithUser(options, player, user) {
         });
     }
 
-    var repeatMode = playbackManager.getRepeatMode(player);
+    const repeatMode = playbackManager.getRepeatMode(player);
 
     if (supportedCommands.indexOf('SetRepeatMode') !== -1 && playbackManager.currentMediaSource(player).RunTimeTicks) {
         menuItems.push({
@@ -243,14 +243,14 @@ function showWithUser(options, player, user) {
 }
 
 export function show(options) {
-    var player = options.player;
-    var currentItem = playbackManager.currentItem(player);
+    const player = options.player;
+    const currentItem = playbackManager.currentItem(player);
 
     if (!currentItem || !currentItem.ServerId) {
         return showWithUser(options, player, null);
     }
 
-    var apiClient = window.connectionManager.getApiClient(currentItem.ServerId);
+    const apiClient = window.connectionManager.getApiClient(currentItem.ServerId);
     return apiClient.getCurrentUser().then(function (user) {
         return showWithUser(options, player, user);
     });
diff --git a/src/components/playback/volumeosd.js b/src/components/playback/volumeosd.js
index 8a6f534b52..c35914b192 100644
--- a/src/components/playback/volumeosd.js
+++ b/src/components/playback/volumeosd.js
@@ -5,15 +5,15 @@ import browser from 'browser';
 import 'css!./iconosd';
 import 'material-icons';
 
-var currentPlayer;
-var osdElement;
-var iconElement;
-var progressElement;
+let currentPlayer;
+let osdElement;
+let iconElement;
+let progressElement;
 
-var enableAnimation;
+let enableAnimation;
 
 function getOsdElementHtml() {
-    var html = '';
+    let html = '';
 
     html += '<span class="material-icons iconOsdIcon volume_up"></span>';
 
@@ -23,7 +23,7 @@ function getOsdElementHtml() {
 }
 
 function ensureOsdElement() {
-    var elem = osdElement;
+    let elem = osdElement;
     if (!elem) {
         enableAnimation = browser.supportsCssAnimation();
 
@@ -46,11 +46,11 @@ function onHideComplete() {
     this.classList.add('hide');
 }
 
-var hideTimeout;
+let hideTimeout;
 function showOsd() {
     clearHideTimeout();
 
-    var elem = osdElement;
+    const elem = osdElement;
 
     dom.removeEventListener(elem, dom.whichTransitionEvent(), onHideComplete, {
         once: true
@@ -78,7 +78,7 @@ function clearHideTimeout() {
 function hideOsd() {
     clearHideTimeout();
 
-    var elem = osdElement;
+    const elem = osdElement;
     if (elem) {
         if (enableAnimation) {
             // trigger reflow
@@ -108,7 +108,7 @@ function updatePlayerVolumeState(isMuted, volume) {
 }
 
 function releaseCurrentPlayer() {
-    var player = currentPlayer;
+    const player = currentPlayer;
 
     if (player) {
         events.off(player, 'volumechange', onVolumeChanged);
@@ -118,7 +118,7 @@ function releaseCurrentPlayer() {
 }
 
 function onVolumeChanged(e) {
-    var player = this;
+    const player = this;
 
     ensureOsdElement();
 
diff --git a/src/components/playerstats/playerstats.js b/src/components/playerstats/playerstats.js
index 5345ed8bcc..e100dee594 100644
--- a/src/components/playerstats/playerstats.js
+++ b/src/components/playerstats/playerstats.js
@@ -413,7 +413,7 @@ import 'css!./playerstats';
                 name: 'Original Media Info'
             });
 
-            var apiClient = window.connectionManager.getApiClient(playbackManager.currentItem(player).ServerId);
+            const apiClient = window.connectionManager.getApiClient(playbackManager.currentItem(player).ServerId);
             if (syncPlayManager.isSyncPlayEnabled() && apiClient.isMinServerVersion('10.6.0')) {
                 categories.push({
                     stats: getSyncPlayStats(),
diff --git a/src/components/playmenu.js b/src/components/playmenu.js
index c537993ef6..57ee5ca6e3 100644
--- a/src/components/playmenu.js
+++ b/src/components/playmenu.js
@@ -4,11 +4,11 @@ import playbackManager from 'playbackManager';
 import globalize from 'globalize';
 
 export function show(options) {
-    var item = options.item;
+    const item = options.item;
 
-    var resumePositionTicks = item.UserData ? item.UserData.PlaybackPositionTicks : null;
+    const resumePositionTicks = item.UserData ? item.UserData.PlaybackPositionTicks : null;
 
-    var playableItemId = item.Type === 'Program' ? item.ChannelId : item.Id;
+    const playableItemId = item.Type === 'Program' ? item.ChannelId : item.Id;
 
     if (!resumePositionTicks || item.IsFolder) {
         playbackManager.play({
@@ -18,7 +18,7 @@ export function show(options) {
         return;
     }
 
-    var menuItems = [];
+    const menuItems = [];
 
     menuItems.push({
         name: globalize.translate('ResumeAt', datetime.getDisplayRunningTime(resumePositionTicks)),
diff --git a/src/components/pluginManager.js b/src/components/pluginManager.js
index 55a5c230ff..c07c77b736 100644
--- a/src/components/pluginManager.js
+++ b/src/components/pluginManager.js
@@ -3,7 +3,7 @@ import globalize from 'globalize';
 /* eslint-disable indent */
 
     // TODO: replace with each plugin version
-    var cacheParam = new Date().getTime();
+    const cacheParam = new Date().getTime();
 
     class PluginManager {
         pluginsList = [];
@@ -13,7 +13,7 @@ import globalize from 'globalize';
         }
 
         #loadStrings(plugin) {
-            var strings = plugin.getTranslations ? plugin.getTranslations() : [];
+            const strings = plugin.getTranslations ? plugin.getTranslations() : [];
             return globalize.loadStrings({
                 name: plugin.id || plugin.packageName,
                 strings: strings
@@ -56,10 +56,10 @@ import globalize from 'globalize';
 
                 return new Promise((resolve, reject) => {
                     require([pluginSpec], (pluginFactory) => {
-                        var plugin = pluginFactory.default ? new pluginFactory.default() : new pluginFactory();
+                        const plugin = pluginFactory.default ? new pluginFactory.default() : new pluginFactory();
 
                         // See if it's already installed
-                        var existing = this.pluginsList.filter(function (p) {
+                        const existing = this.pluginsList.filter(function (p) {
                             return p.id === plugin.id;
                         })[0];
 
@@ -69,10 +69,10 @@ import globalize from 'globalize';
 
                         plugin.installUrl = pluginSpec;
 
-                        var separatorIndex = Math.max(pluginSpec.lastIndexOf('/'), pluginSpec.lastIndexOf('\\'));
+                        const separatorIndex = Math.max(pluginSpec.lastIndexOf('/'), pluginSpec.lastIndexOf('\\'));
                         plugin.baseUrl = pluginSpec.substring(0, separatorIndex);
 
-                        var paths = {};
+                        const paths = {};
                         paths[plugin.id] = plugin.baseUrl;
 
                         requirejs.config({
@@ -135,7 +135,7 @@ import globalize from 'globalize';
                 })[0];
             }
 
-            var url = plugin.baseUrl + '/' + path;
+            let url = plugin.baseUrl + '/' + path;
 
             if (addCacheParam) {
                 url += url.includes('?') ? '&' : '?';
diff --git a/src/components/qualityOptions.js b/src/components/qualityOptions.js
index 63d9557c7b..93a8d5fe73 100644
--- a/src/components/qualityOptions.js
+++ b/src/components/qualityOptions.js
@@ -1,9 +1,9 @@
 import globalize from 'globalize';
 
 export function getVideoQualityOptions(options) {
-    var maxStreamingBitrate = options.currentMaxBitrate;
-    var videoWidth = options.videoWidth;
-    var videoHeight = options.videoHeight;
+    const maxStreamingBitrate = options.currentMaxBitrate;
+    let videoWidth = options.videoWidth;
+    const videoHeight = options.videoHeight;
 
     // If the aspect ratio is less than 16/9 (1.77), set the width as if it were pillarboxed.
     // 4:3 1440x1080 -> 1920x1080
@@ -11,9 +11,9 @@ export function getVideoQualityOptions(options) {
         videoWidth = videoHeight * (16 / 9);
     }
 
-    var maxAllowedWidth = videoWidth || 4096;
+    const maxAllowedWidth = videoWidth || 4096;
 
-    var qualityOptions = [];
+    const qualityOptions = [];
 
     if (maxAllowedWidth >= 3800) {
         qualityOptions.push({ name: '4K - 120 Mbps', maxHeight: 2160, bitrate: 120000000 });
@@ -65,7 +65,7 @@ export function getVideoQualityOptions(options) {
     qualityOptions.push({ name: '240p', maxHeight: 240, bitrate: 320000 });
     qualityOptions.push({ name: '144p', maxHeight: 144, bitrate: 192000 });
 
-    var autoQualityOption = {
+    const autoQualityOption = {
         name: globalize.translate('Auto'),
         bitrate: 0,
         selected: options.isAutomaticBitrateEnabled
@@ -76,9 +76,9 @@ export function getVideoQualityOptions(options) {
     }
 
     if (maxStreamingBitrate) {
-        var selectedIndex = -1;
-        for (var i = 0, length = qualityOptions.length; i < length; i++) {
-            var option = qualityOptions[i];
+        let selectedIndex = -1;
+        for (let i = 0, length = qualityOptions.length; i < length; i++) {
+            const option = qualityOptions[i];
 
             if (selectedIndex === -1 && option.bitrate <= maxStreamingBitrate) {
                 selectedIndex = i;
@@ -89,7 +89,7 @@ export function getVideoQualityOptions(options) {
             selectedIndex = qualityOptions.length - 1;
         }
 
-        var currentQualityOption = qualityOptions[selectedIndex];
+        const currentQualityOption = qualityOptions[selectedIndex];
 
         if (!options.isAutomaticBitrateEnabled) {
             currentQualityOption.selected = true;
@@ -102,9 +102,9 @@ export function getVideoQualityOptions(options) {
 }
 
 export function getAudioQualityOptions(options) {
-    var maxStreamingBitrate = options.currentMaxBitrate;
+    const maxStreamingBitrate = options.currentMaxBitrate;
 
-    var qualityOptions = [];
+    const qualityOptions = [];
 
     qualityOptions.push({ name: '2 Mbps', bitrate: 2000000 });
     qualityOptions.push({ name: '1.5 Mbps', bitrate: 1500000 });
@@ -116,7 +116,7 @@ export function getAudioQualityOptions(options) {
     qualityOptions.push({ name: '96 kbps', bitrate: 96000 });
     qualityOptions.push({ name: '64 kbps', bitrate: 64000 });
 
-    var autoQualityOption = {
+    const autoQualityOption = {
         name: globalize.translate('Auto'),
         bitrate: 0,
         selected: options.isAutomaticBitrateEnabled
@@ -127,9 +127,9 @@ export function getAudioQualityOptions(options) {
     }
 
     if (maxStreamingBitrate) {
-        var selectedIndex = -1;
-        for (var i = 0, length = qualityOptions.length; i < length; i++) {
-            var option = qualityOptions[i];
+        let selectedIndex = -1;
+        for (let i = 0, length = qualityOptions.length; i < length; i++) {
+            const option = qualityOptions[i];
 
             if (selectedIndex === -1 && option.bitrate <= maxStreamingBitrate) {
                 selectedIndex = i;
@@ -140,7 +140,7 @@ export function getAudioQualityOptions(options) {
             selectedIndex = qualityOptions.length - 1;
         }
 
-        var currentQualityOption = qualityOptions[selectedIndex];
+        const currentQualityOption = qualityOptions[selectedIndex];
 
         if (!options.isAutomaticBitrateEnabled) {
             currentQualityOption.selected = true;
diff --git a/src/components/require/requirecss.js b/src/components/require/requirecss.js
index 8aaa04d689..ca6910e319 100644
--- a/src/components/require/requirecss.js
+++ b/src/components/require/requirecss.js
@@ -1,7 +1,7 @@
 define(function () {
     'use strict';
 
-    var requireCss = {};
+    const requireCss = {};
 
     requireCss.normalize = function (name, normalize) {
         if (name.substr(name.length - 4, 4) === '.css') {
@@ -11,7 +11,7 @@ define(function () {
         return normalize(name);
     };
 
-    var importedCss = [];
+    let importedCss = [];
 
     function isLoaded(url) {
         return importedCss.indexOf(url) !== -1;
@@ -27,14 +27,14 @@ define(function () {
 
     requireCss.load = function (cssId, req, load, config) {
         // Somehow if the url starts with /css, require will get all screwed up since this extension is also called css
-        var srch = 'components/require/requirecss';
-        var index = cssId.indexOf(srch);
+        const srch = 'components/require/requirecss';
+        const index = cssId.indexOf(srch);
 
         if (index !== -1) {
             cssId = 'css' + cssId.substring(index + srch.length);
         }
 
-        var url = cssId + '.css';
+        let url = cssId + '.css';
 
         if (url.indexOf('://') === -1) {
             url = config.baseUrl + url;
@@ -43,13 +43,13 @@ define(function () {
         if (!isLoaded(url)) {
             importedCss.push(url);
 
-            var link = document.createElement('link');
+            const link = document.createElement('link');
 
             link.setAttribute('rel', 'stylesheet');
             link.setAttribute('type', 'text/css');
             link.onload = load;
 
-            var linkUrl = url;
+            let linkUrl = url;
 
             if (config.urlArgs) {
                 linkUrl += config.urlArgs(cssId, url);
diff --git a/src/components/require/requiretext.js b/src/components/require/requiretext.js
index 28ddeb21c8..12822a29e7 100644
--- a/src/components/require/requiretext.js
+++ b/src/components/require/requiretext.js
@@ -2,7 +2,7 @@ define(function () {
     'use strict';
 
     // hack to work around the server's auto-redirection feature
-    var addRedirectPrevention = window.dashboardVersion != null && window.Dashboard && !window.AppInfo.isNativeApp;
+    const addRedirectPrevention = window.dashboardVersion != null && window.Dashboard && !window.AppInfo.isNativeApp;
 
     return {
 
@@ -25,7 +25,7 @@ define(function () {
                 url += 'r=0';
             }
 
-            var xhr = new XMLHttpRequest();
+            const xhr = new XMLHttpRequest();
             xhr.open('GET', url, true);
 
             xhr.onload = function (e) {
diff --git a/src/components/serviceworker/notifications.js b/src/components/serviceworker/notifications.js
index 9b50553244..cc2ee65320 100644
--- a/src/components/serviceworker/notifications.js
+++ b/src/components/serviceworker/notifications.js
@@ -2,7 +2,7 @@
 (function () {
     'use strict';
 
-    var connectionManager;
+    let connectionManager;
 
     function getApiClient(serverId) {
         if (connectionManager) {
@@ -28,12 +28,12 @@
 
     /* eslint-disable-next-line no-restricted-globals -- self is valid in a serviceworker environment */
     self.addEventListener('notificationclick', function (event) {
-        var notification = event.notification;
+        const notification = event.notification;
         notification.close();
 
-        var data = notification.data;
-        var serverId = data.serverId;
-        var action = event.action;
+        const data = notification.data;
+        const serverId = data.serverId;
+        const action = event.action;
 
         if (!action) {
             clients.openWindow('/');
diff --git a/src/components/syncPlay/groupSelectionMenu.js b/src/components/syncPlay/groupSelectionMenu.js
index 655dc76010..b554817b8c 100644
--- a/src/components/syncPlay/groupSelectionMenu.js
+++ b/src/components/syncPlay/groupSelectionMenu.js
@@ -12,7 +12,7 @@ import playbackPermissionManager from 'playbackPermissionManager';
  * @returns {string} The player's id.
  */
 function getActivePlayerId () {
-    var info = playbackManager.getPlayerInfo();
+    const info = playbackManager.getPlayerInfo();
     return info ? info.id : null;
 }
 
@@ -38,7 +38,7 @@ function showNewJoinGroupSelection (button, user, apiClient) {
 
     apiClient.getSyncPlayGroups().then(function (response) {
         response.json().then(function (groups) {
-            var menuItems = groups.map(function (group) {
+            const menuItems = groups.map(function (group) {
                 return {
                     name: group.PlayingItemName,
                     icon: 'group',
@@ -72,7 +72,7 @@ function showNewJoinGroupSelection (button, user, apiClient) {
                 return;
             }
 
-            var menuOptions = {
+            const menuOptions = {
                 title: globalize.translate('HeaderSyncPlaySelectGroup'),
                 items: menuItems,
                 positionTo: button,
@@ -129,7 +129,7 @@ function showLeaveGroupSelection (button, user, apiClient) {
         secondaryText: globalize.translate('LabelSyncPlayLeaveGroupDescription')
     }];
 
-    var menuOptions = {
+    const menuOptions = {
         title: globalize.translate('HeaderSyncPlayEnabled'),
         items: menuItems,
         positionTo: button,
diff --git a/src/components/syncPlay/syncPlayManager.js b/src/components/syncPlay/syncPlayManager.js
index 3be3a3cedf..c72d20a111 100644
--- a/src/components/syncPlay/syncPlayManager.js
+++ b/src/components/syncPlay/syncPlayManager.js
@@ -40,7 +40,7 @@ function waitForEventOnce(emitter, eventType, timeout) {
  * @returns {string} The player's id.
  */
 function getActivePlayerId() {
-    var info = playbackManager.getPlayerInfo();
+    const info = playbackManager.getPlayerInfo();
     return info ? info.id : null;
 }
 
@@ -276,7 +276,7 @@ class SyncPlayManager {
      * Removes the bindings to the current player's events.
      */
     releaseCurrentPlayer () {
-        var player = this.currentPlayer;
+        const player = this.currentPlayer;
         if (player) {
             events.off(player, 'unpause', this._onPlayerUnpause);
             events.off(player, 'pause', this._onPlayerPause);
@@ -426,7 +426,7 @@ class SyncPlayManager {
             serverId: serverId
         }).then(() => {
             waitForEventOnce(this, 'playbackstart', WaitForEventDefaultTimeout).then(() => {
-                var sessionId = getActivePlayerId();
+                const sessionId = getActivePlayerId();
                 if (!sessionId) {
                     console.error('Missing sessionId!');
                     toast({
@@ -659,7 +659,7 @@ class SyncPlayManager {
      * Overrides PlaybackManager's unpause method.
      */
     playRequest (player) {
-        var apiClient = window.connectionManager.currentApiClient();
+        const apiClient = window.connectionManager.currentApiClient();
         apiClient.requestSyncPlayStart();
     }
 
@@ -667,7 +667,7 @@ class SyncPlayManager {
      * Overrides PlaybackManager's pause method.
      */
     pauseRequest (player) {
-        var apiClient = window.connectionManager.currentApiClient();
+        const apiClient = window.connectionManager.currentApiClient();
         apiClient.requestSyncPlayPause();
         // Pause locally as well, to give the user some little control
         playbackManager._localUnpause(player);
@@ -677,7 +677,7 @@ class SyncPlayManager {
      * Overrides PlaybackManager's seek method.
      */
     seekRequest (PositionTicks, player) {
-        var apiClient = window.connectionManager.currentApiClient();
+        const apiClient = window.connectionManager.currentApiClient();
         apiClient.requestSyncPlaySeek({
             PositionTicks: PositionTicks
         });
diff --git a/src/components/tabbedview/tabbedview.js b/src/components/tabbedview/tabbedview.js
index 710a0e3c40..4e7ccb6529 100644
--- a/src/components/tabbedview/tabbedview.js
+++ b/src/components/tabbedview/tabbedview.js
@@ -4,7 +4,7 @@ import layoutManager from 'layoutManager';
 import 'emby-tabs';
 
 function onViewDestroy(e) {
-    var tabControllers = this.tabControllers;
+    const tabControllers = this.tabControllers;
 
     if (tabControllers) {
         tabControllers.forEach(function (t) {
@@ -32,9 +32,9 @@ class TabbedView {
         this.view = view;
         this.params = params;
 
-        var self = this;
+        const self = this;
 
-        var currentTabIndex = parseInt(params.tab || this.getDefaultTabIndex(params.parentId));
+        let currentTabIndex = parseInt(params.tab || this.getDefaultTabIndex(params.parentId));
         this.initialTabIndex = currentTabIndex;
 
         function validateTabLoad(index) {
@@ -44,7 +44,7 @@ class TabbedView {
         function loadTab(index, previousIndex) {
             validateTabLoad(index).then(function () {
                 self.getTabController(index).then(function (controller) {
-                    var refresh = !controller.refreshed;
+                    const refresh = !controller.refreshed;
 
                     controller.onResume({
                         autoFocus: previousIndex == null && layoutManager.tv,
@@ -64,10 +64,10 @@ class TabbedView {
         }
 
         function onTabChange(e) {
-            var newIndex = parseInt(e.detail.selectedTabIndex);
-            var previousIndex = e.detail.previousIndex;
+            const newIndex = parseInt(e.detail.selectedTabIndex);
+            const previousIndex = e.detail.previousIndex;
 
-            var previousTabController = previousIndex == null ? null : self.tabControllers[previousIndex];
+            const previousTabController = previousIndex == null ? null : self.tabControllers[previousIndex];
             if (previousTabController && previousTabController.onPause) {
                 previousTabController.onPause();
             }
@@ -92,7 +92,7 @@ class TabbedView {
         this.setTitle();
         backdrop.clearBackdrop();
 
-        var currentTabController = this.currentTabController;
+        const currentTabController = this.currentTabController;
 
         if (!currentTabController) {
             mainTabsManager.selectedTabIndex(this.initialTabIndex);
@@ -102,7 +102,7 @@ class TabbedView {
     }
 
     onPause() {
-        var currentTabController = this.currentTabController;
+        const currentTabController = this.currentTabController;
 
         if (currentTabController && currentTabController.onPause) {
             currentTabController.onPause();
diff --git a/src/controllers/dashboard/logs.js b/src/controllers/dashboard/logs.js
index 7bf2785d50..e28c2ac12f 100644
--- a/src/controllers/dashboard/logs.js
+++ b/src/controllers/dashboard/logs.js
@@ -9,21 +9,21 @@ import 'flexStyles';
     export default function(view, params) {
         view.addEventListener('viewbeforeshow', function() {
             loading.show();
-            var apiClient = ApiClient;
+            const apiClient = ApiClient;
             apiClient.getJSON(apiClient.getUrl('System/Logs')).then(function(logs) {
-                var html = '';
+                let html = '';
                 html += '<div class="paperList">';
                 html += logs.map(function(log) {
-                    var logUrl = apiClient.getUrl('System/Logs/Log', {
+                    let logUrl = apiClient.getUrl('System/Logs/Log', {
                         name: log.Name
                     });
                     logUrl += '&api_key=' + apiClient.accessToken();
-                    var logHtml = '';
+                    let logHtml = '';
                     logHtml += '<a is="emby-linkbutton" href="' + logUrl + '" target="_blank" class="listItem listItem-border" style="color:inherit;">';
                     logHtml += '<div class="listItemBody two-line">';
                     logHtml += "<h3 class='listItemBodyText'>" + log.Name + '</h3>';
-                    var date = datetime.parseISO8601Date(log.DateModified, true);
-                    var text = datetime.toLocaleDateString(date);
+                    const date = datetime.parseISO8601Date(log.DateModified, true);
+                    let text = datetime.toLocaleDateString(date);
                     text += ' ' + datetime.getDisplayTime(date);
                     logHtml += '<div class="listItemBodyText secondary">' + text + '</div>';
                     logHtml += '</div>';
diff --git a/src/controllers/dashboard/plugins/repositories/index.js b/src/controllers/dashboard/plugins/repositories/index.js
index 8d1cbf3164..3abee6c90f 100644
--- a/src/controllers/dashboard/plugins/repositories/index.js
+++ b/src/controllers/dashboard/plugins/repositories/index.js
@@ -42,10 +42,10 @@ function saveList(page) {
 }
 
 function populateList(options) {
-    var html = '';
+    let html = '';
 
     html += '<div class="paperList">';
-    for (var i = 0; i < options.repositories.length; i++) {
+    for (let i = 0; i < options.repositories.length; i++) {
         html += getRepositoryHtml(options.repositories[i]);
     }
 
@@ -59,7 +59,7 @@ function populateList(options) {
 }
 
 function getRepositoryHtml(repository) {
-    var html = '';
+    let html = '';
 
     html += '<div class="listItem listItem-border">';
     html += `<a is="emby-linkbutton" style="margin:0;padding:0" class="clearLink listItemIconContainer" href="${repository.Url}">`;
@@ -93,9 +93,9 @@ export default function(view, params) {
         libraryMenu.setTabs('plugins', 2, getTabs);
         reloadList(this);
 
-        var save = this;
+        const save = this;
         $('#repositories', view).on('click', '.btnDelete', function() {
-            var button = this;
+            const button = this;
             repositories = repositories.filter(function (r) {
                 return r.Url !== button.id;
             });
diff --git a/src/controllers/edititemmetadata.js b/src/controllers/edititemmetadata.js
index 57c72dda28..dd51ba2581 100644
--- a/src/controllers/edititemmetadata.js
+++ b/src/controllers/edititemmetadata.js
@@ -20,7 +20,7 @@ export default function (view, params) {
     });
     MetadataEditor.setCurrentItemId(null);
     view.querySelector('.libraryTree').addEventListener('itemclicked', function (event) {
-        var data = event.detail;
+        const data = event.detail;
 
         if (data.id != MetadataEditor.getCurrentItemId()) {
             MetadataEditor.setCurrentItemId(data.id);
diff --git a/src/controllers/movies/moviesrecommended.js b/src/controllers/movies/moviesrecommended.js
index 4036128b51..a53fa65437 100644
--- a/src/controllers/movies/moviesrecommended.js
+++ b/src/controllers/movies/moviesrecommended.js
@@ -395,7 +395,7 @@ import 'emby-button';
         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) {
diff --git a/src/controllers/music/musicrecommended.js b/src/controllers/music/musicrecommended.js
index a93bfea4e3..580578e68d 100644
--- a/src/controllers/music/musicrecommended.js
+++ b/src/controllers/music/musicrecommended.js
@@ -56,7 +56,7 @@ import 'flexStyles';
             EnableTotalRecordCount: false
         };
         ApiClient.getJSON(ApiClient.getUrl('Users/' + userId + '/Items/Latest', options)).then(function (items) {
-            var elem = page.querySelector('#recentlyAddedSongs');
+            const elem = page.querySelector('#recentlyAddedSongs');
             elem.innerHTML = cardBuilder.getCardsHtml({
                 items: items,
                 showUnplayedIndicator: false,
@@ -103,7 +103,7 @@ import 'flexStyles';
                 elem.classList.add('hide');
             }
 
-            var itemsContainer = elem.querySelector('.itemsContainer');
+            const itemsContainer = elem.querySelector('.itemsContainer');
             itemsContainer.innerHTML = cardBuilder.getCardsHtml({
                 items: result.Items,
                 showUnplayedIndicator: false,
@@ -145,7 +145,7 @@ import 'flexStyles';
                 elem.classList.add('hide');
             }
 
-            var itemsContainer = elem.querySelector('.itemsContainer');
+            const itemsContainer = elem.querySelector('.itemsContainer');
             itemsContainer.innerHTML = cardBuilder.getCardsHtml({
                 items: result.Items,
                 showUnplayedIndicator: false,
diff --git a/src/controllers/session/login/index.js b/src/controllers/session/login/index.js
index 274d752e49..1592e6b112 100644
--- a/src/controllers/session/login/index.js
+++ b/src/controllers/session/login/index.js
@@ -16,7 +16,7 @@ import 'emby-checkbox';
     function authenticateUserByName(page, apiClient, username, password) {
         loading.show();
         apiClient.authenticateUserByName(username, password).then(function (result) {
-            var user = result.User;
+            const user = result.User;
             loading.hide();
 
             onLoginSuccessful(user.Id, result.AccessToken, apiClient);
diff --git a/src/elements/emby-progressring/emby-progressring.js b/src/elements/emby-progressring/emby-progressring.js
index 929b80a573..63b9f73f10 100644
--- a/src/elements/emby-progressring/emby-progressring.js
+++ b/src/elements/emby-progressring/emby-progressring.js
@@ -14,14 +14,14 @@ import 'webcomponents';
 
             if (window.MutationObserver) {
                 // create an observer instance
-                var observer = new MutationObserver(function (mutations) {
+                const observer = new MutationObserver(function (mutations) {
                     mutations.forEach(function (mutation) {
                         instance.setProgress(parseFloat(instance.getAttribute('data-progress') || '0'));
                     });
                 });
 
                 // configuration of the observer:
-                var config = { attributes: true, childList: false, characterData: false };
+                const config = { attributes: true, childList: false, characterData: false };
 
                 // pass in the target node, as well as the observer options
                 observer.observe(instance, config);
diff --git a/src/elements/emby-slider/emby-slider.js b/src/elements/emby-slider/emby-slider.js
index 40d2e69bbb..555394af0d 100644
--- a/src/elements/emby-slider/emby-slider.js
+++ b/src/elements/emby-slider/emby-slider.js
@@ -54,7 +54,7 @@ import 'emby-input';
 
         // Snap to step
         if (range.step !== 'any') {
-            var step = range.step || 1;
+            const step = range.step || 1;
             value = Math.round(value / step) * step;
         }
 
diff --git a/src/legacy/focusPreventScroll.js b/src/legacy/focusPreventScroll.js
index 93f53dca29..8f912207b5 100644
--- a/src/legacy/focusPreventScroll.js
+++ b/src/legacy/focusPreventScroll.js
@@ -2,16 +2,16 @@
 
 if (HTMLElement.prototype.nativeFocus === undefined) {
     (function () {
-        var supportsPreventScrollOption = false;
+        let supportsPreventScrollOption = false;
         try {
-            var focusElem = document.createElement('div');
+            const focusElem = document.createElement('div');
 
             focusElem.addEventListener('focus', function(event) {
                 event.preventDefault();
                 event.stopPropagation();
             }, true);
 
-            var opts = Object.defineProperty({}, 'preventScroll', {
+            const opts = Object.defineProperty({}, 'preventScroll', {
                 // eslint-disable-next-line getter-return
                 get: function () {
                     supportsPreventScrollOption = true;
@@ -27,8 +27,8 @@ if (HTMLElement.prototype.nativeFocus === undefined) {
             HTMLElement.prototype.nativeFocus = HTMLElement.prototype.focus;
 
             HTMLElement.prototype.focus = function(options) {
-                var scrollX = window.scrollX;
-                var scrollY = window.scrollY;
+                const scrollX = window.scrollX;
+                const scrollY = window.scrollY;
 
                 this.nativeFocus();
 
diff --git a/src/libraries/navdrawer/navdrawer.js b/src/libraries/navdrawer/navdrawer.js
index 965b68aee4..ab50ec5831 100644
--- a/src/libraries/navdrawer/navdrawer.js
+++ b/src/libraries/navdrawer/navdrawer.js
@@ -14,26 +14,26 @@ export default function (options) {
 
     function onMenuTouchStart(e) {
         options.target.classList.remove('transition');
-        var touches = getTouches(e);
-        var touch = touches[0] || {};
+        const touches = getTouches(e);
+        const touch = touches[0] || {};
         menuTouchStartX = touch.clientX;
         menuTouchStartY = touch.clientY;
         menuTouchStartTime = new Date().getTime();
     }
 
     function setVelocity(deltaX) {
-        var time = new Date().getTime() - (menuTouchStartTime || 0);
+        const time = new Date().getTime() - (menuTouchStartTime || 0);
         velocity = Math.abs(deltaX) / time;
     }
 
     function onMenuTouchMove(e) {
-        var isOpen = self.visible;
-        var touches = getTouches(e);
-        var touch = touches[0] || {};
-        var endX = touch.clientX || 0;
-        var endY = touch.clientY || 0;
-        var deltaX = endX - (menuTouchStartX || 0);
-        var deltaY = endY - (menuTouchStartY || 0);
+        const isOpen = self.visible;
+        const touches = getTouches(e);
+        const touch = touches[0] || {};
+        const endX = touch.clientX || 0;
+        const endY = touch.clientY || 0;
+        const deltaX = endX - (menuTouchStartX || 0);
+        const deltaY = endY - (menuTouchStartY || 0);
         setVelocity(deltaX);
 
         if (isOpen && dragMode !== 1 && deltaX > 0) {
@@ -58,12 +58,12 @@ export default function (options) {
         options.target.classList.add('transition');
         scrollContainer.removeEventListener('scroll', disableEvent);
         dragMode = 0;
-        var touches = getTouches(e);
-        var touch = touches[0] || {};
-        var endX = touch.clientX || 0;
-        var endY = touch.clientY || 0;
-        var deltaX = endX - (menuTouchStartX || 0);
-        var deltaY = endY - (menuTouchStartY || 0);
+        const touches = getTouches(e);
+        const touch = touches[0] || {};
+        const endX = touch.clientX || 0;
+        const endY = touch.clientY || 0;
+        const deltaX = endX - (menuTouchStartX || 0);
+        const deltaY = endY - (menuTouchStartY || 0);
         currentPos = deltaX;
         self.checkMenuState(deltaX, deltaY);
     }
@@ -105,20 +105,20 @@ export default function (options) {
     }
 
     function onBackgroundTouchStart(e) {
-        var touches = getTouches(e);
-        var touch = touches[0] || {};
+        const touches = getTouches(e);
+        const touch = touches[0] || {};
         backgroundTouchStartX = touch.clientX;
         backgroundTouchStartTime = new Date().getTime();
     }
 
     function onBackgroundTouchMove(e) {
-        var touches = getTouches(e);
-        var touch = touches[0] || {};
-        var endX = touch.clientX || 0;
+        const touches = getTouches(e);
+        const touch = touches[0] || {};
+        const endX = touch.clientX || 0;
 
         if (endX <= options.width && self.isVisible) {
             countStart++;
-            var deltaX = endX - (backgroundTouchStartX || 0);
+            const deltaX = endX - (backgroundTouchStartX || 0);
 
             if (countStart == 1) {
                 startPoint = deltaX;
@@ -127,7 +127,7 @@ export default function (options) {
                 dragMode = 1;
                 newPos = deltaX - startPoint + options.width;
                 self.changeMenuPos();
-                var time = new Date().getTime() - (backgroundTouchStartTime || 0);
+                const time = new Date().getTime() - (backgroundTouchStartTime || 0);
                 velocity = Math.abs(deltaX) / time;
             }
         }
@@ -137,25 +137,25 @@ export default function (options) {
     }
 
     function onBackgroundTouchEnd(e) {
-        var touches = getTouches(e);
-        var touch = touches[0] || {};
-        var endX = touch.clientX || 0;
-        var deltaX = endX - (backgroundTouchStartX || 0);
+        const touches = getTouches(e);
+        const touch = touches[0] || {};
+        const endX = touch.clientX || 0;
+        const deltaX = endX - (backgroundTouchStartX || 0);
         self.checkMenuState(deltaX);
         countStart = 0;
     }
 
     function onMaskTransitionEnd() {
-        var classList = mask.classList;
+        const classList = mask.classList;
 
         if (!classList.contains('backdrop')) {
             classList.add('hide');
         }
     }
 
-    var self;
-    var defaults;
-    var mask;
+    let self;
+    let defaults;
+    let mask;
     var newPos = 0;
     var currentPos = 0;
     var startPoint = 0;
@@ -166,7 +166,7 @@ export default function (options) {
     var scrollContainer = options.target.querySelector('.mainDrawer-scrollContainer');
     scrollContainer.classList.add('scrollY');
 
-    var TouchMenuLA = function () {
+    const TouchMenuLA = function () {
         self = this;
         defaults = {
             width: 260,
@@ -193,9 +193,9 @@ export default function (options) {
         }
     };
 
-    var menuTouchStartX;
-    var menuTouchStartY;
-    var menuTouchStartTime;
+    let menuTouchStartX;
+    let menuTouchStartY;
+    let menuTouchStartTime;
     var edgeContainer = document.querySelector('.mainDrawerHandle');
     var isPeeking = false;
 
@@ -261,8 +261,8 @@ export default function (options) {
         }
     };
 
-    var backgroundTouchStartX;
-    var backgroundTouchStartTime;
+    let backgroundTouchStartX;
+    let backgroundTouchStartTime;
 
     TouchMenuLA.prototype.showMask = function () {
         mask.classList.remove('hide');
@@ -280,7 +280,7 @@ export default function (options) {
         }
     };
 
-    var _edgeSwipeEnabled;
+    let _edgeSwipeEnabled;
 
     TouchMenuLA.prototype.setEdgeSwipeEnabled = function (enabled) {
         if (!options.disableEdgeSwipe) {
diff --git a/src/libraries/scroller.js b/src/libraries/scroller.js
index dbb3de16e3..de6469c743 100644
--- a/src/libraries/scroller.js
+++ b/src/libraries/scroller.js
@@ -56,14 +56,14 @@ function within(number, min, max) {
 }
 
 // Other global values
-var dragMouseEvents = ['mousemove', 'mouseup'];
-var dragTouchEvents = ['touchmove', 'touchend'];
-var wheelEvent = (document.implementation.hasFeature('Event.wheel', '3.0') ? 'wheel' : 'mousewheel');
-var interactiveElements = ['INPUT', 'SELECT', 'TEXTAREA'];
+const dragMouseEvents = ['mousemove', 'mouseup'];
+const dragTouchEvents = ['touchmove', 'touchend'];
+const wheelEvent = (document.implementation.hasFeature('Event.wheel', '3.0') ? 'wheel' : 'mousewheel');
+const interactiveElements = ['INPUT', 'SELECT', 'TEXTAREA'];
 
-var scrollerFactory = function (frame, options) {
+const scrollerFactory = function (frame, options) {
     // Extend options
-    var o = Object.assign({}, {
+    const o = Object.assign({}, {
         slidee: null, // Selector, DOM element, or jQuery object with DOM element representing SLIDEE.
         horizontal: false, // Switch to horizontal mode.
 
@@ -83,7 +83,7 @@ var scrollerFactory = function (frame, options) {
 
     }, options);
 
-    var isSmoothScrollSupported = 'scrollBehavior' in document.documentElement.style;
+    const isSmoothScrollSupported = 'scrollBehavior' in document.documentElement.style;
 
     // native scroll is a must with touch input
     // also use native scroll when scrolling vertically in desktop mode - excluding horizontal because the mouse wheel support is choppy at the moment
@@ -106,11 +106,11 @@ var scrollerFactory = function (frame, options) {
     }
 
     // Private variables
-    var self = this;
+    const self = this;
     self.options = o;
 
     // Frame
-    var slideeElement = o.slidee ? o.slidee : sibling(frame.firstChild)[0];
+    const slideeElement = o.slidee ? o.slidee : sibling(frame.firstChild)[0];
     self._pos = {
         start: 0,
         center: 0,
@@ -119,15 +119,15 @@ var scrollerFactory = function (frame, options) {
         dest: 0
     };
 
-    var transform = !options.enableNativeScroll;
+    const transform = !options.enableNativeScroll;
 
     // Miscellaneous
-    var scrollSource = frame;
-    var dragSourceElement = o.dragSource ? o.dragSource : frame;
-    var dragging = {
+    const scrollSource = frame;
+    const dragSourceElement = o.dragSource ? o.dragSource : frame;
+    const dragging = {
         released: 1
     };
-    var scrolling = {
+    const scrolling = {
         last: 0,
         delta: 0,
         resetTime: 200
@@ -139,10 +139,10 @@ var scrollerFactory = function (frame, options) {
     self.options = o;
     self.dragging = dragging;
 
-    var nativeScrollElement = frame;
+    const nativeScrollElement = frame;
 
     function sibling(n, elem) {
-        var matched = [];
+        const matched = [];
 
         for (; n; n = n.nextSibling) {
             if (n.nodeType === 1 && n !== elem) {
@@ -152,10 +152,10 @@ var scrollerFactory = function (frame, options) {
         return matched;
     }
 
-    var requiresReflow = true;
+    let requiresReflow = true;
 
-    var frameSize = 0;
-    var slideeSize = 0;
+    let frameSize = 0;
+    let slideeSize = 0;
     function ensureSizeInfo() {
         if (requiresReflow) {
             requiresReflow = false;
@@ -185,13 +185,13 @@ var scrollerFactory = function (frame, options) {
             ensureSizeInfo();
 
             // Fix possible overflowing
-            var pos = self._pos;
+            const pos = self._pos;
             self.slideTo(within(pos.dest, pos.start, pos.end));
         }
     }
 
     function initFrameResizeObserver() {
-        var observerOptions = {};
+        const observerOptions = {};
 
         self.frameResizeObserver = new ResizeObserver(onResize, observerOptions);
 
@@ -242,7 +242,7 @@ var scrollerFactory = function (frame, options) {
         }
     }
 
-    var lastAnimate;
+    let lastAnimate;
 
     /**
          * Animate to a position.
@@ -254,7 +254,7 @@ var scrollerFactory = function (frame, options) {
          */
     self.slideTo = function (newPos, immediate, fullItemPos) {
         ensureSizeInfo();
-        var pos = self._pos;
+        const pos = self._pos;
 
         if (layoutManager.tv) {
             newPos = within(newPos, pos.start);
@@ -268,10 +268,10 @@ var scrollerFactory = function (frame, options) {
         }
 
         // Update the animation object
-        var from = pos.cur;
+        const from = pos.cur;
         immediate = immediate || dragging.init || !o.speed;
 
-        var now = new Date().getTime();
+        const now = new Date().getTime();
 
         if (o.autoImmediate) {
             if (!immediate && (now - (lastAnimate || 0)) <= 50) {
@@ -291,7 +291,7 @@ var scrollerFactory = function (frame, options) {
     };
 
     function setStyleProperty(elem, name, value, speed, resetTransition) {
-        var style = elem.style;
+        const style = elem.style;
 
         if (resetTransition || browser.edge) {
             style.transition = 'none';
@@ -312,7 +312,7 @@ var scrollerFactory = function (frame, options) {
     }
 
     function renderAnimateWithTransform(fromPosition, toPosition, immediate) {
-        var speed = o.speed;
+        let speed = o.speed;
 
         if (immediate) {
             speed = o.immediateSpeed || 50;
@@ -346,18 +346,18 @@ var scrollerFactory = function (frame, options) {
      * @return {Object}
      */
     self.getPos = function (item) {
-        var scrollElement = transform ? slideeElement : nativeScrollElement;
-        var slideeOffset = getBoundingClientRect(scrollElement);
-        var itemOffset = getBoundingClientRect(item);
+        const scrollElement = transform ? slideeElement : nativeScrollElement;
+        const slideeOffset = getBoundingClientRect(scrollElement);
+        const itemOffset = getBoundingClientRect(item);
 
-        var offset = o.horizontal ? itemOffset.left - slideeOffset.left : itemOffset.top - slideeOffset.top;
+        let offset = o.horizontal ? itemOffset.left - slideeOffset.left : itemOffset.top - slideeOffset.top;
 
-        var size = o.horizontal ? itemOffset.width : itemOffset.height;
+        let size = o.horizontal ? itemOffset.width : itemOffset.height;
         if (!size && size !== 0) {
             size = item[o.horizontal ? 'offsetWidth' : 'offsetHeight'];
         }
 
-        var centerOffset = o.centerOffset || 0;
+        let centerOffset = o.centerOffset || 0;
 
         if (!transform) {
             centerOffset = 0;
@@ -370,11 +370,11 @@ var scrollerFactory = function (frame, options) {
 
         ensureSizeInfo();
 
-        var currentStart = self._pos.cur;
-        var currentEnd = currentStart + frameSize;
+        const currentStart = self._pos.cur;
+        const currentEnd = currentStart + frameSize;
 
         console.debug('offset:' + offset + ' currentStart:' + currentStart + ' currentEnd:' + currentEnd);
-        var isVisible = offset >= currentStart && (offset + size) <= currentEnd;
+        const isVisible = offset >= currentStart && (offset + size) <= currentEnd;
 
         return {
             start: offset,
@@ -388,12 +388,12 @@ var scrollerFactory = function (frame, options) {
     self.getCenterPosition = function (item) {
         ensureSizeInfo();
 
-        var pos = self.getPos(item);
+        const pos = self.getPos(item);
         return within(pos.center, pos.start, pos.end);
     };
 
     function dragInitSlidee(event) {
-        var isTouch = event.type === 'touchstart';
+        const isTouch = event.type === 'touchstart';
 
         // Ignore when already in progress, or interactive element in non-touch navivagion
         if (dragging.init || !isTouch && isInteractive(event.target)) {
@@ -417,7 +417,7 @@ var scrollerFactory = function (frame, options) {
         dragging.init = 0;
         dragging.source = event.target;
         dragging.touch = isTouch;
-        var pointer = isTouch ? event.touches[0] : event;
+        const pointer = isTouch ? event.touches[0] : event;
         dragging.initX = pointer.pageX;
         dragging.initY = pointer.pageY;
         dragging.initPos = self._pos.cur;
@@ -455,7 +455,7 @@ var scrollerFactory = function (frame, options) {
      */
     function dragHandler(event) {
         dragging.released = event.type === 'mouseup' || event.type === 'touchend';
-        var pointer = dragging.touch ? event[dragging.released ? 'changedTouches' : 'touches'][0] : event;
+        const pointer = dragging.touch ? event[dragging.released ? 'changedTouches' : 'touches'][0] : event;
         dragging.pathX = pointer.pageX - dragging.initX;
         dragging.pathY = pointer.pageY - dragging.initY;
         dragging.path = Math.sqrt(Math.pow(dragging.pathX, 2) + Math.pow(dragging.pathY, 2));
@@ -570,12 +570,12 @@ var scrollerFactory = function (frame, options) {
      */
     function scrollHandler(event) {
         ensureSizeInfo();
-        var pos = self._pos;
+        const pos = self._pos;
         // Ignore if there is no scrolling to be done
         if (!o.scrollBy || pos.start === pos.end) {
             return;
         }
-        var delta = normalizeWheelDelta(event);
+        let delta = normalizeWheelDelta(event);
 
         if (transform) {
             // Trap scrolling only when necessary and/or requested
@@ -635,13 +635,13 @@ var scrollerFactory = function (frame, options) {
         return self;
     };
 
-    var contentRect = {};
+    let contentRect = {};
 
     function onResize(entries) {
-        var entry = entries[0];
+        const entry = entries[0];
 
         if (entry) {
-            var newRect = entry.contentRect;
+            const newRect = entry.contentRect;
 
             // handle element being hidden
             if (newRect.width === 0 || newRect.height === 0) {
@@ -666,7 +666,7 @@ var scrollerFactory = function (frame, options) {
 
     function onFrameClick(e) {
         if (e.which === 1) {
-            var focusableParent = focusManager.focusableParent(e.target);
+            const focusableParent = focusManager.focusableParent(e.target);
             if (focusableParent && focusableParent !== document.activeElement) {
                 focusableParent.focus();
             }
@@ -838,7 +838,7 @@ scrollerFactory.prototype.to = function (location, item, immediate) {
     if (item === undefined) {
         this.slideTo(this._pos[location], immediate);
     } else {
-        var itemPos = this.getPos(item);
+        const itemPos = this.getPos(item);
 
         if (itemPos) {
             this.slideTo(itemPos[location], immediate, itemPos);
@@ -883,7 +883,7 @@ scrollerFactory.prototype.toCenter = function (item, immediate) {
 };
 
 scrollerFactory.create = function (frame, options) {
-    var instance = new scrollerFactory(frame, options);
+    const instance = new scrollerFactory(frame, options);
     return Promise.resolve(instance);
 };
 
diff --git a/src/plugins/comicsPlayer/plugin.js b/src/plugins/comicsPlayer/plugin.js
index 2928231391..8cdf3db5e6 100644
--- a/src/plugins/comicsPlayer/plugin.js
+++ b/src/plugins/comicsPlayer/plugin.js
@@ -103,7 +103,7 @@ export class ComicsPlayer {
             const downloadUrl = apiClient.getItemDownloadUrl(item.Id);
             const archiveSource = new ArchiveSource(downloadUrl);
 
-            var instance = this;
+            const instance = this;
             import('swiper').then(({default: Swiper}) => {
                 archiveSource.load().then(() => {
                     loading.hide();
diff --git a/src/plugins/photoPlayer/plugin.js b/src/plugins/photoPlayer/plugin.js
index a7a4ab3760..c40477778e 100644
--- a/src/plugins/photoPlayer/plugin.js
+++ b/src/plugins/photoPlayer/plugin.js
@@ -10,11 +10,11 @@ export default class PhotoPlayer {
     play(options) {
         return new Promise(function (resolve, reject) {
             import('slideshow').then(({default: slideshow}) => {
-                var index = options.startIndex || 0;
+                const index = options.startIndex || 0;
 
-                var apiClient = window.connectionManager.currentApiClient();
+                const apiClient = window.connectionManager.currentApiClient();
                 apiClient.getCurrentUser().then(function(result) {
-                    var newSlideShow = new slideshow({
+                    const newSlideShow = new slideshow({
                         showTitle: false,
                         cover: false,
                         items: options.items,
diff --git a/src/scripts/autocast.js b/src/scripts/autocast.js
index 84e07b32cd..8d90451268 100644
--- a/src/scripts/autocast.js
+++ b/src/scripts/autocast.js
@@ -32,7 +32,7 @@ function onOpen() {
     const playerId = localStorage.getItem('autocastPlayerId');
 
     playbackManager.getTargets().then(function (targets) {
-        for (var i = 0; i < targets.length; i++) {
+        for (let i = 0; i < targets.length; i++) {
             if (targets[i].id == playerId) {
                 playbackManager.trySetActivePlayer(targets[i].playerName, targets[i]);
                 break;
diff --git a/src/scripts/browserDeviceProfile.js b/src/scripts/browserDeviceProfile.js
index 9e4a410cea..03663b2884 100644
--- a/src/scripts/browserDeviceProfile.js
+++ b/src/scripts/browserDeviceProfile.js
@@ -23,7 +23,7 @@ define(['browser'], function (browser) {
         videoTestElement.canPlayType('video/mp4; codecs="hev1.1.0.L120"').replace(/no/, ''));
     }
 
-    var _supportsTextTracks;
+    let _supportsTextTracks;
     function supportsTextTracks() {
         if (browser.tizen) {
             return true;
@@ -37,7 +37,7 @@ define(['browser'], function (browser) {
         return _supportsTextTracks;
     }
 
-    var _canPlayHls;
+    let _canPlayHls;
     function canPlayHls() {
         if (_canPlayHls == null) {
             _canPlayHls = canPlayNativeHls() || canPlayHlsWithMSE();
@@ -51,7 +51,7 @@ define(['browser'], function (browser) {
             return true;
         }
 
-        var media = document.createElement('video');
+        const media = document.createElement('video');
         if (media.canPlayType('application/x-mpegURL').replace(/no/, '') ||
             media.canPlayType('application/vnd.apple.mpegURL').replace(/no/, '')) {
             return true;
@@ -107,7 +107,7 @@ define(['browser'], function (browser) {
     }
 
     function canPlayAudioFormat(format) {
-        var typeString;
+        let typeString;
 
         if (format === 'flac') {
             if (browser.tizen || browser.web0s || browser.edgeUwp) {
@@ -192,9 +192,9 @@ define(['browser'], function (browser) {
     }
 
     function getDirectPlayProfileForVideoContainer(container, videoAudioCodecs, videoTestElement, options) {
-        var supported = false;
-        var profileContainer = container;
-        var videoCodecs = [];
+        let supported = false;
+        let profileContainer = container;
+        const videoCodecs = [];
 
         switch (container) {
             case 'asf':
@@ -277,10 +277,10 @@ define(['browser'], function (browser) {
     }
 
     function getGlobalMaxVideoBitrate() {
-        var isTizenFhd = false;
+        let isTizenFhd = false;
         if (browser.tizen) {
             try {
-                var isTizenUhd = webapis.productinfo.isUdPanelSupported();
+                const isTizenUhd = webapis.productinfo.isUdPanelSupported();
                 isTizenFhd = !isTizenUhd;
                 console.debug('isTizenFhd = ' + isTizenFhd);
             } catch (error) {
@@ -297,19 +297,19 @@ define(['browser'], function (browser) {
     return function (options) {
         options = options || {};
 
-        var physicalAudioChannels = options.audioChannels || (browser.tv || browser.ps4 || browser.xboxOne ? 6 : 2);
+        const physicalAudioChannels = options.audioChannels || (browser.tv || browser.ps4 || browser.xboxOne ? 6 : 2);
 
-        var bitrateSetting = getMaxBitrate();
+        const bitrateSetting = getMaxBitrate();
 
-        var videoTestElement = document.createElement('video');
+        const videoTestElement = document.createElement('video');
 
-        var canPlayVp8 = videoTestElement.canPlayType('video/webm; codecs="vp8"').replace(/no/, '');
-        var canPlayVp9 = videoTestElement.canPlayType('video/webm; codecs="vp9"').replace(/no/, '');
-        var webmAudioCodecs = ['vorbis'];
+        const canPlayVp8 = videoTestElement.canPlayType('video/webm; codecs="vp8"').replace(/no/, '');
+        const canPlayVp9 = videoTestElement.canPlayType('video/webm; codecs="vp9"').replace(/no/, '');
+        const webmAudioCodecs = ['vorbis'];
 
-        var canPlayMkv = testCanPlayMkv(videoTestElement);
+        const canPlayMkv = testCanPlayMkv(videoTestElement);
 
-        var profile = {};
+        const profile = {};
 
         profile.MaxStreamingBitrate = bitrateSetting;
         profile.MaxStaticBitrate = 100000000;
@@ -317,18 +317,18 @@ define(['browser'], function (browser) {
 
         profile.DirectPlayProfiles = [];
 
-        var videoAudioCodecs = [];
-        var hlsVideoAudioCodecs = [];
+        let videoAudioCodecs = [];
+        let hlsVideoAudioCodecs = [];
 
-        var supportsMp3VideoAudio = videoTestElement.canPlayType('video/mp4; codecs="avc1.640029, mp4a.69"').replace(/no/, '')
+        const supportsMp3VideoAudio = videoTestElement.canPlayType('video/mp4; codecs="avc1.640029, mp4a.69"').replace(/no/, '')
                                     || videoTestElement.canPlayType('video/mp4; codecs="avc1.640029, mp4a.6B"').replace(/no/, '')
                                     || videoTestElement.canPlayType('video/mp4; codecs="avc1.640029, mp3"').replace(/no/, '');
 
         // Not sure how to test for this
-        var supportsMp2VideoAudio = browser.edgeUwp || browser.tizen || browser.web0s;
+        const supportsMp2VideoAudio = browser.edgeUwp || browser.tizen || browser.web0s;
 
         /* eslint-disable compat/compat */
-        var maxVideoWidth = browser.xboxOne ?
+        let maxVideoWidth = browser.xboxOne ?
             (window.screen ? window.screen.width : null) :
             null;
 
@@ -337,7 +337,7 @@ define(['browser'], function (browser) {
             maxVideoWidth = options.maxVideoWidth;
         }
 
-        var canPlayAacVideoAudio = videoTestElement.canPlayType('video/mp4; codecs="avc1.640029, mp4a.40.2"').replace(/no/, '');
+        const canPlayAacVideoAudio = videoTestElement.canPlayType('video/mp4; codecs="avc1.640029, mp4a.40.2"').replace(/no/, '');
 
         // Only put mp3 first if mkv support is there
         // Otherwise with HLS and mp3 audio we're seeing some browsers
@@ -345,7 +345,7 @@ define(['browser'], function (browser) {
         if (supportsAc3(videoTestElement)) {
             videoAudioCodecs.push('ac3');
 
-            var eAc3 = supportsEac3(videoTestElement);
+            const eAc3 = supportsEac3(videoTestElement);
             if (eAc3) {
                 videoAudioCodecs.push('eac3');
             }
@@ -394,7 +394,7 @@ define(['browser'], function (browser) {
             videoAudioCodecs.push('mp2');
         }
 
-        var supportsDts = browser.tizen || browser.web0s || options.supportsDts || videoTestElement.canPlayType('video/mp4; codecs="dts-"').replace(/no/, '') || videoTestElement.canPlayType('video/mp4; codecs="dts+"').replace(/no/, '');
+        let supportsDts = browser.tizen || browser.web0s || options.supportsDts || videoTestElement.canPlayType('video/mp4; codecs="dts-"').replace(/no/, '') || videoTestElement.canPlayType('video/mp4; codecs="dts+"').replace(/no/, '');
 
         // DTS audio not supported in 2018 models (Tizen 4.0)
         if (browser.tizenVersion >= 4) {
@@ -437,9 +437,9 @@ define(['browser'], function (browser) {
             return (options.disableHlsVideoAudioCodecs || []).indexOf(c) === -1;
         });
 
-        var mp4VideoCodecs = [];
-        var webmVideoCodecs = [];
-        var hlsVideoCodecs = [];
+        const mp4VideoCodecs = [];
+        const webmVideoCodecs = [];
+        const hlsVideoCodecs = [];
 
         if (canPlayH264(videoTestElement)) {
             mp4VideoCodecs.push('h264');
@@ -555,7 +555,7 @@ define(['browser'], function (browser) {
 
         profile.TranscodingProfiles = [];
 
-        var hlsBreakOnNonKeyFrames = browser.iOS || browser.osx || browser.edge || !canPlayNativeHls() ? true : false;
+        const hlsBreakOnNonKeyFrames = browser.iOS || browser.osx || browser.edge || !canPlayNativeHls() ? true : false;
 
         if (canPlayHls() && browser.enableHlsAudio !== false) {
             profile.TranscodingProfiles.push({
@@ -661,9 +661,9 @@ define(['browser'], function (browser) {
 
         profile.CodecProfiles = [];
 
-        var supportsSecondaryAudio = browser.tizen || videoTestElement.audioTracks;
+        const supportsSecondaryAudio = browser.tizen || videoTestElement.audioTracks;
 
-        var aacCodecProfileConditions = [];
+        const aacCodecProfileConditions = [];
 
         // Handle he-aac not supported
         if (!videoTestElement.canPlayType('video/mp4; codecs="avc1.640029, mp4a.40.5"').replace(/no/, '')) {
@@ -706,8 +706,8 @@ define(['browser'], function (browser) {
             });
         }
 
-        var maxH264Level = 42;
-        var h264Profiles = 'high|main|baseline|constrained baseline';
+        let maxH264Level = 42;
+        let h264Profiles = 'high|main|baseline|constrained baseline';
 
         if (browser.tizen || browser.web0s ||
             videoTestElement.canPlayType('video/mp4; codecs="avc1.640833"').replace(/no/, '')) {
@@ -766,9 +766,9 @@ define(['browser'], function (browser) {
             });
         }
 
-        var globalMaxVideoBitrate = (getGlobalMaxVideoBitrate() || '').toString();
+        const globalMaxVideoBitrate = (getGlobalMaxVideoBitrate() || '').toString();
 
-        var h264MaxVideoBitrate = globalMaxVideoBitrate;
+        const h264MaxVideoBitrate = globalMaxVideoBitrate;
 
         if (h264MaxVideoBitrate) {
             h264CodecProfileConditions.push({
@@ -806,7 +806,7 @@ define(['browser'], function (browser) {
             Conditions: h264CodecProfileConditions
         });
 
-        var globalVideoConditions = [];
+        const globalVideoConditions = [];
 
         if (globalMaxVideoBitrate) {
             globalVideoConditions.push({
diff --git a/src/scripts/editorsidebar.js b/src/scripts/editorsidebar.js
index b6a45ccf2c..7e8abbe2f9 100644
--- a/src/scripts/editorsidebar.js
+++ b/src/scripts/editorsidebar.js
@@ -5,8 +5,8 @@ import 'material-icons';
 /* eslint-disable indent */
 
     function getNode(item, folderState, selected) {
-        var htmlName = getNodeInnerHtml(item);
-        var node = {
+        const htmlName = getNodeInnerHtml(item);
+        const node = {
             id: item.Id,
             text: htmlName,
             state: {
@@ -37,14 +37,14 @@ import 'material-icons';
     }
 
     function getNodeInnerHtml(item) {
-        var name = item.Name;
+        let name = item.Name;
         if (item.Number) {
             name = item.Number + ' - ' + name;
         }
         if (item.IndexNumber != null && item.Type != 'Season') {
             name = item.IndexNumber + ' - ' + name;
         }
-        var htmlName = "<div class='editorNode'>";
+        let htmlName = "<div class='editorNode'>";
         if (item.IsFolder) {
             htmlName += '<span class="material-icons metadataSidebarIcon folder"></span>';
         } else if (item.MediaType === 'Video') {
@@ -70,7 +70,7 @@ import 'material-icons';
         ApiClient.getLiveTvChannels({
             limit: 0
         }).then(function (result) {
-            var nodes = [];
+            const nodes = [];
             nodes.push({
                 id: 'MediaFolders',
                 text: globalize.translate('HeaderMediaFolders'),
@@ -110,8 +110,8 @@ import 'material-icons';
             ServiceName: service,
             AddCurrentProgram: false
         }).then(function (result) {
-            var nodes = result.Items.map(function (i) {
-                var state = openItems.indexOf(i.Id) == -1 ? 'closed' : 'open';
+            const nodes = result.Items.map(function (i) {
+                const state = openItems.indexOf(i.Id) == -1 ? 'closed' : 'open';
                 return getNode(i, state, false);
             });
             callback(nodes);
@@ -120,12 +120,12 @@ import 'material-icons';
 
     function loadMediaFolders(page, scope, openItems, callback) {
         ApiClient.getJSON(ApiClient.getUrl('Library/MediaFolders')).then(function (result) {
-            var nodes = result.Items.map(function (n) {
-                var state = openItems.indexOf(n.Id) == -1 ? 'closed' : 'open';
+            const nodes = result.Items.map(function (n) {
+                const state = openItems.indexOf(n.Id) == -1 ? 'closed' : 'open';
                 return getNode(n, state, false);
             });
             callback.call(scope, nodes);
-            for (var i = 0, length = nodes.length; i < length; i++) {
+            for (let i = 0, length = nodes.length; i < length; i++) {
                 if (nodes[i].state.opened) {
                     nodesToLoad.push(nodes[i].id);
                 }
@@ -134,7 +134,7 @@ import 'material-icons';
     }
 
     function loadNode(page, scope, node, openItems, selectedId, currentUser, callback) {
-        var id = node.id;
+        const id = node.id;
         if (id == '#') {
             loadChildrenOfRootNode(page, scope, callback);
             return;
@@ -147,7 +147,7 @@ import 'material-icons';
             loadMediaFolders(page, scope, openItems, callback);
             return;
         }
-        var query = {
+        const query = {
             ParentId: id,
             Fields: 'Settings',
             IsVirtualUnaired: false,
@@ -156,17 +156,17 @@ import 'material-icons';
             EnableImages: false,
             EnableUserData: false
         };
-        var itemtype = node.li_attr.itemtype;
+        const itemtype = node.li_attr.itemtype;
         if (itemtype != 'Season' && itemtype != 'Series') {
             query.SortBy = 'SortName';
         }
         ApiClient.getItems(Dashboard.getCurrentUserId(), query).then(function (result) {
-            var nodes = result.Items.map(function (n) {
-                var state = openItems.indexOf(n.Id) == -1 ? 'closed' : 'open';
+            const nodes = result.Items.map(function (n) {
+                const state = openItems.indexOf(n.Id) == -1 ? 'closed' : 'open';
                 return getNode(n, state, n.Id == selectedId);
             });
             callback.call(scope, nodes);
-            for (var i = 0, length = nodes.length; i < length; i++) {
+            for (let i = 0, length = nodes.length; i < length; i++) {
                 if (nodes[i].state.opened) {
                     nodesToLoad.push(nodes[i].id);
                 }
@@ -175,7 +175,7 @@ import 'material-icons';
     }
 
     function scrollToNode(id) {
-        var elem = $('#' + id)[0];
+        const elem = $('#' + id)[0];
         if (elem) {
             elem.scrollIntoView();
         }
@@ -188,8 +188,8 @@ import 'material-icons';
     }
 
     function onNodeSelect(event, data) {
-        var node = data.node;
-        var eventData = {
+        const node = data.node;
+        const eventData = {
             id: node.id,
             itemType: node.li_attr.itemtype,
             serverItemType: node.li_attr.serveritemtype,
@@ -210,8 +210,8 @@ import 'material-icons';
     }
 
     function onNodeOpen(event, data) {
-        var page = $(this).parents('.page')[0];
-        var node = data.node;
+        const page = $(this).parents('.page')[0];
+        const node = data.node;
         if (node.children) {
             loadNodesToLoad(page, node);
         }
@@ -222,8 +222,8 @@ import 'material-icons';
     }
 
     function onNodeLoad(event, data) {
-        var page = $(this).parents('.page')[0];
-        var node = data.node;
+        const page = $(this).parents('.page')[0];
+        const node = data.node;
         if (node.children) {
             loadNodesToLoad(page, node);
         }
@@ -252,8 +252,8 @@ import 'material-icons';
     }
 
     function loadNodesToLoad(page, node) {
-        var children = node.children;
-        for (var i = 0, length = children.length; i < length; i++) {
+        const children = node.children;
+        for (let i = 0, length = children.length; i < length; i++) {
             var child = children[i];
             if (nodesToLoad.indexOf(child) != -1) {
                 nodesToLoad = nodesToLoad.filter(function (n) {
@@ -273,15 +273,15 @@ import 'material-icons';
     }
 
     function updateEditorNode(page, item) {
-        var elem = $('#' + item.Id + '>a', page)[0];
+        const elem = $('#' + item.Id + '>a', page)[0];
         if (elem == null) {
             return;
         }
         $('.editorNode', elem).remove();
         $(elem).append(getNodeInnerHtml(item));
         if (item.IsFolder) {
-            var tree = jQuery.jstree._reference('.libraryTree');
-            var currentNode = tree._get_node(null, false);
+            const tree = jQuery.jstree._reference('.libraryTree');
+            const currentNode = tree._get_node(null, false);
             tree.refresh(currentNode);
         }
     }
@@ -294,23 +294,23 @@ import 'material-icons';
         if (itemId) {
             return itemId;
         }
-        var url = window.location.hash || window.location.href;
+        const url = window.location.hash || window.location.href;
         return getParameterByName('id', url);
     }
     var nodesToLoad = [];
-    var selectedNodeId;
+    let selectedNodeId;
     $(document).on('itemsaved', '.metadataEditorPage', function (e, item) {
         updateEditorNode(this, item);
     }).on('pagebeforeshow', '.metadataEditorPage', function () {
         /* eslint-disable-next-line  @babel/no-unused-expressions */
         import('css!assets/css/metadataeditor.css');
     }).on('pagebeforeshow', '.metadataEditorPage', function () {
-        var page = this;
+        const page = this;
         Dashboard.getCurrentUser().then(function (user) {
-            var id = getCurrentItemId();
+            const id = getCurrentItemId();
             if (id) {
                 ApiClient.getAncestorItems(id, user.Id).then(function (ancestors) {
-                    var ids = ancestors.map(function (i) {
+                    const ids = ancestors.map(function (i) {
                         return i.Id;
                     });
                     initializeTree(page, user, ids, id);
@@ -320,13 +320,13 @@ import 'material-icons';
             }
         });
     }).on('pagebeforehide', '.metadataEditorPage', function () {
-        var page = this;
+        const page = this;
         $('.libraryTree', page).off('select_node.jstree', onNodeSelect).off('open_node.jstree', onNodeOpen).off('load_node.jstree', onNodeLoad);
     });
-    var itemId;
+    let itemId;
     window.MetadataEditor = {
         getItemPromise: function () {
-            var currentItemId = getCurrentItemId();
+            const currentItemId = getCurrentItemId();
             if (currentItemId) {
                 return ApiClient.getItem(Dashboard.getCurrentUserId(), currentItemId);
             }
diff --git a/src/scripts/gamepadtokey.js b/src/scripts/gamepadtokey.js
index b6f25f1eea..8451326974 100644
--- a/src/scripts/gamepadtokey.js
+++ b/src/scripts/gamepadtokey.js
@@ -22,47 +22,47 @@
 
 import appHost from 'apphost';
 
-var _GAMEPAD_A_BUTTON_INDEX = 0;
-var _GAMEPAD_B_BUTTON_INDEX = 1;
-var _GAMEPAD_DPAD_UP_BUTTON_INDEX = 12;
-var _GAMEPAD_DPAD_DOWN_BUTTON_INDEX = 13;
-var _GAMEPAD_DPAD_LEFT_BUTTON_INDEX = 14;
-var _GAMEPAD_DPAD_RIGHT_BUTTON_INDEX = 15;
-var _GAMEPAD_A_KEY = 'GamepadA';
-var _GAMEPAD_B_KEY = 'GamepadB';
-var _GAMEPAD_DPAD_UP_KEY = 'GamepadDPadUp';
-var _GAMEPAD_DPAD_DOWN_KEY = 'GamepadDPadDown';
-var _GAMEPAD_DPAD_LEFT_KEY = 'GamepadDPadLeft';
-var _GAMEPAD_DPAD_RIGHT_KEY = 'GamepadDPadRight';
-var _GAMEPAD_LEFT_THUMBSTICK_UP_KEY = 'GamepadLeftThumbStickUp';
-var _GAMEPAD_LEFT_THUMBSTICK_DOWN_KEY = 'GamepadLeftThumbStickDown';
-var _GAMEPAD_LEFT_THUMBSTICK_LEFT_KEY = 'GamepadLeftThumbStickLeft';
-var _GAMEPAD_LEFT_THUMBSTICK_RIGHT_KEY = 'GamepadLeftThumbStickRight';
-var _GAMEPAD_A_KEYCODE = 0;
-var _GAMEPAD_B_KEYCODE = 27;
-var _GAMEPAD_DPAD_UP_KEYCODE = 38;
-var _GAMEPAD_DPAD_DOWN_KEYCODE = 40;
-var _GAMEPAD_DPAD_LEFT_KEYCODE = 37;
-var _GAMEPAD_DPAD_RIGHT_KEYCODE = 39;
-var _GAMEPAD_LEFT_THUMBSTICK_UP_KEYCODE = 38;
-var _GAMEPAD_LEFT_THUMBSTICK_DOWN_KEYCODE = 40;
-var _GAMEPAD_LEFT_THUMBSTICK_LEFT_KEYCODE = 37;
-var _GAMEPAD_LEFT_THUMBSTICK_RIGHT_KEYCODE = 39;
-var _THUMB_STICK_THRESHOLD = 0.75;
+const _GAMEPAD_A_BUTTON_INDEX = 0;
+const _GAMEPAD_B_BUTTON_INDEX = 1;
+const _GAMEPAD_DPAD_UP_BUTTON_INDEX = 12;
+const _GAMEPAD_DPAD_DOWN_BUTTON_INDEX = 13;
+const _GAMEPAD_DPAD_LEFT_BUTTON_INDEX = 14;
+const _GAMEPAD_DPAD_RIGHT_BUTTON_INDEX = 15;
+const _GAMEPAD_A_KEY = 'GamepadA';
+const _GAMEPAD_B_KEY = 'GamepadB';
+const _GAMEPAD_DPAD_UP_KEY = 'GamepadDPadUp';
+const _GAMEPAD_DPAD_DOWN_KEY = 'GamepadDPadDown';
+const _GAMEPAD_DPAD_LEFT_KEY = 'GamepadDPadLeft';
+const _GAMEPAD_DPAD_RIGHT_KEY = 'GamepadDPadRight';
+const _GAMEPAD_LEFT_THUMBSTICK_UP_KEY = 'GamepadLeftThumbStickUp';
+const _GAMEPAD_LEFT_THUMBSTICK_DOWN_KEY = 'GamepadLeftThumbStickDown';
+const _GAMEPAD_LEFT_THUMBSTICK_LEFT_KEY = 'GamepadLeftThumbStickLeft';
+const _GAMEPAD_LEFT_THUMBSTICK_RIGHT_KEY = 'GamepadLeftThumbStickRight';
+const _GAMEPAD_A_KEYCODE = 0;
+const _GAMEPAD_B_KEYCODE = 27;
+const _GAMEPAD_DPAD_UP_KEYCODE = 38;
+const _GAMEPAD_DPAD_DOWN_KEYCODE = 40;
+const _GAMEPAD_DPAD_LEFT_KEYCODE = 37;
+const _GAMEPAD_DPAD_RIGHT_KEYCODE = 39;
+const _GAMEPAD_LEFT_THUMBSTICK_UP_KEYCODE = 38;
+const _GAMEPAD_LEFT_THUMBSTICK_DOWN_KEYCODE = 40;
+const _GAMEPAD_LEFT_THUMBSTICK_LEFT_KEYCODE = 37;
+const _GAMEPAD_LEFT_THUMBSTICK_RIGHT_KEYCODE = 39;
+const _THUMB_STICK_THRESHOLD = 0.75;
 
-var _leftThumbstickUpPressed = false;
-var _leftThumbstickDownPressed = false;
-var _leftThumbstickLeftPressed = false;
-var _leftThumbstickRightPressed = false;
-var _dPadUpPressed = false;
-var _dPadDownPressed = false;
-var _dPadLeftPressed = false;
-var _dPadRightPressed = false;
-var _gamepadAPressed = false;
-var _gamepadBPressed = false;
+let _leftThumbstickUpPressed = false;
+let _leftThumbstickDownPressed = false;
+let _leftThumbstickLeftPressed = false;
+let _leftThumbstickRightPressed = false;
+let _dPadUpPressed = false;
+let _dPadDownPressed = false;
+let _dPadLeftPressed = false;
+let _dPadRightPressed = false;
+let _gamepadAPressed = false;
+let _gamepadBPressed = false;
 
 // The set of buttons on the gamepad we listen for.
-var ProcessedButtons = [
+const ProcessedButtons = [
     _GAMEPAD_DPAD_UP_BUTTON_INDEX,
     _GAMEPAD_DPAD_DOWN_BUTTON_INDEX,
     _GAMEPAD_DPAD_LEFT_BUTTON_INDEX,
@@ -71,7 +71,7 @@ var ProcessedButtons = [
     _GAMEPAD_B_BUTTON_INDEX
 ];
 
-var _ButtonPressedState = {};
+const _ButtonPressedState = {};
 _ButtonPressedState.getgamepadA = function () {
     return _gamepadAPressed;
 };
@@ -162,11 +162,11 @@ _ButtonPressedState.setdPadRight = function (newPressedState) {
     _dPadRightPressed = newPressedState;
 };
 
-var times = {};
+const times = {};
 
 function throttle(key) {
-    var time = times[key] || 0;
-    var now = new Date().getTime();
+    const time = times[key] || 0;
+    const now = new Date().getTime();
 
     if ((now - time) >= 200) {
         //times[key] = now;
@@ -180,7 +180,7 @@ function resetThrottle(key) {
     times[key] = new Date().getTime();
 }
 
-var isElectron = navigator.userAgent.toLowerCase().indexOf('electron') !== -1;
+const isElectron = navigator.userAgent.toLowerCase().indexOf('electron') !== -1;
 function allowInput() {
     // This would be nice but always seems to return true with electron
     if (!isElectron && document.hidden) { /* eslint-disable-line compat/compat */
@@ -199,7 +199,7 @@ function raiseEvent(name, key, keyCode) {
         return;
     }
 
-    var event = document.createEvent('Event');
+    const event = document.createEvent('Event');
     event.initEvent(name, true, true);
     event.key = key;
     event.keyCode = keyCode;
@@ -218,7 +218,7 @@ function raiseKeyEvent(oldPressedState, newPressedState, key, keyCode, enableRep
     // No-op if oldPressedState === newPressedState
     if (newPressedState === true) {
         // button down
-        var fire = false;
+        let fire = false;
 
         // always fire if this is the initial down press
         if (oldPressedState === false) {
@@ -244,19 +244,19 @@ function raiseKeyEvent(oldPressedState, newPressedState, key, keyCode, enableRep
     }
 }
 
-var inputLoopTimer;
+let inputLoopTimer;
 function runInputLoop() {
     // Get the latest gamepad state.
-    var gamepads = navigator.getGamepads(); /* eslint-disable-line compat/compat */
+    const gamepads = navigator.getGamepads(); /* eslint-disable-line compat/compat */
     for (var i = 0, len = gamepads.length; i < len; i++) {
-        var gamepad = gamepads[i];
+        const gamepad = gamepads[i];
         if (!gamepad) {
             continue;
         }
         // Iterate through the axes
-        var axes = gamepad.axes;
-        var leftStickX = axes[0];
-        var leftStickY = axes[1];
+        const axes = gamepad.axes;
+        const leftStickX = axes[0];
+        const leftStickY = axes[1];
         if (leftStickX > _THUMB_STICK_THRESHOLD) { // Right
             _ButtonPressedState.setleftThumbstickRight(true);
         } else if (leftStickX < -_THUMB_STICK_THRESHOLD) { // Left
@@ -272,7 +272,7 @@ function runInputLoop() {
             _ButtonPressedState.setleftThumbstickDown(false);
         }
         // Iterate through the buttons to see if Left thumbstick, DPad, A and B are pressed.
-        var buttons = gamepad.buttons;
+        const buttons = gamepad.buttons;
         for (var j = 0, len = buttons.length; j < len; j++) {
             if (ProcessedButtons.indexOf(j) !== -1) {
                 if (buttons[j].pressed) {
@@ -355,9 +355,9 @@ function stopInputLoop() {
 }
 
 function isGamepadConnected() {
-    var gamepads = navigator.getGamepads(); /* eslint-disable-line compat/compat */
-    for (var i = 0, len = gamepads.length; i < len; i++) {
-        var gamepad = gamepads[i];
+    const gamepads = navigator.getGamepads(); /* eslint-disable-line compat/compat */
+    for (let i = 0, len = gamepads.length; i < len; i++) {
+        const gamepad = gamepads[i];
         if (gamepad && gamepad.connected) {
             return true;
         }
diff --git a/src/scripts/imagehelper.js b/src/scripts/imagehelper.js
index c79f721738..9b356f0350 100644
--- a/src/scripts/imagehelper.js
+++ b/src/scripts/imagehelper.js
@@ -2,7 +2,7 @@
 /* eslint-disable indent */
 
     export function getDeviceIcon(device) {
-        var baseUrl = 'assets/img/devices/';
+        const baseUrl = 'assets/img/devices/';
         switch (device.AppName || device.Client) {
             case 'Samsung Smart TV':
                 return baseUrl + 'samsung.svg';
diff --git a/src/scripts/libraryBrowser.js b/src/scripts/libraryBrowser.js
index 151cb7ff57..5c6db19258 100644
--- a/src/scripts/libraryBrowser.js
+++ b/src/scripts/libraryBrowser.js
@@ -6,7 +6,7 @@ export function getSavedQueryKey(modifier) {
 }
 
 export function loadSavedQueryValues(key, query) {
-    var values = userSettings.get(key);
+    let values = userSettings.get(key);
 
     if (values) {
         values = JSON.parse(values);
@@ -17,7 +17,7 @@ export function loadSavedQueryValues(key, query) {
 }
 
 export function saveQueryValues(key, query) {
-    var values = {};
+    const values = {};
 
     if (query.SortBy) {
         values.SortBy = query.SortBy;
@@ -39,7 +39,7 @@ export function getSavedView (key) {
 }
 
 export function showLayoutMenu (button, currentLayout, views) {
-    var dispatchEvent = true;
+    let dispatchEvent = true;
 
     if (!views) {
         dispatchEvent = false;
@@ -47,7 +47,7 @@ export function showLayoutMenu (button, currentLayout, views) {
         views = views ? views.split(',') : ['List', 'Poster', 'PosterCard', 'Thumb', 'ThumbCard'];
     }
 
-    var menuItems = views.map(function (v) {
+    const menuItems = views.map(function (v) {
         return {
             name: globalize.translate(v),
             id: v,
@@ -79,12 +79,12 @@ export function showLayoutMenu (button, currentLayout, views) {
 }
 
 export function getQueryPagingHtml (options) {
-    var startIndex = options.startIndex;
-    var limit = options.limit;
-    var totalRecordCount = options.totalRecordCount;
-    var html = '';
-    var recordsEnd = Math.min(startIndex + limit, totalRecordCount);
-    var showControls = limit < totalRecordCount;
+    const startIndex = options.startIndex;
+    const limit = options.limit;
+    const totalRecordCount = options.totalRecordCount;
+    let html = '';
+    const recordsEnd = Math.min(startIndex + limit, totalRecordCount);
+    const showControls = limit < totalRecordCount;
 
     if (html += '<div class="listPaging">', showControls) {
         html += '<span style="vertical-align:middle;">';
@@ -124,10 +124,10 @@ export function showSortMenu (options) {
         import('emby-radio')
     ]).then(([{default: dialogHelper}]) => {
         function onSortByChange() {
-            var newValue = this.value;
+            const newValue = this.value;
 
             if (this.checked) {
-                var changed = options.query.SortBy != newValue;
+                const changed = options.query.SortBy != newValue;
                 options.query.SortBy = newValue.replace('_', ',');
                 options.query.StartIndex = 0;
 
@@ -138,10 +138,10 @@ export function showSortMenu (options) {
         }
 
         function onSortOrderChange() {
-            var newValue = this.value;
+            const newValue = this.value;
 
             if (this.checked) {
-                var changed = options.query.SortOrder != newValue;
+                const changed = options.query.SortOrder != newValue;
                 options.query.SortOrder = newValue;
                 options.query.StartIndex = 0;
 
@@ -151,7 +151,7 @@ export function showSortMenu (options) {
             }
         }
 
-        var dlg = dialogHelper.createDialog({
+        const dlg = dialogHelper.createDialog({
             removeOnClose: true,
             modal: false,
             entryAnimationDuration: 160,
@@ -160,18 +160,18 @@ export function showSortMenu (options) {
         dlg.classList.add('ui-body-a');
         dlg.classList.add('background-theme-a');
         dlg.classList.add('formDialog');
-        var html = '';
+        let html = '';
         html += '<div style="margin:0;padding:1.25em 1.5em 1.5em;">';
         html += '<h2 style="margin:0 0 .5em;">';
         html += globalize.translate('HeaderSortBy');
         html += '</h2>';
-        var i;
-        var length;
-        var isChecked;
+        let i;
+        let length;
+        let isChecked;
         html += '<div>';
         for (i = 0, length = options.items.length; i < length; i++) {
-            var option = options.items[i];
-            var radioValue = option.id.replace(',', '_');
+            const option = options.items[i];
+            const radioValue = option.id.replace(',', '_');
             isChecked = (options.query.SortBy || '').replace(',', '_') == radioValue ? ' checked' : '';
             html += '<label class="radio-label-block"><input type="radio" is="emby-radio" name="SortBy" data-id="' + option.id + '" value="' + radioValue + '" class="menuSortBy" ' + isChecked + ' /><span>' + option.name + '</span></label>';
         }
@@ -189,13 +189,13 @@ export function showSortMenu (options) {
         html += '</div>';
         dlg.innerHTML = html;
         dialogHelper.open(dlg);
-        var sortBys = dlg.querySelectorAll('.menuSortBy');
+        const sortBys = dlg.querySelectorAll('.menuSortBy');
 
         for (i = 0, length = sortBys.length; i < length; i++) {
             sortBys[i].addEventListener('change', onSortByChange);
         }
 
-        var sortOrders = dlg.querySelectorAll('.menuSortOrder');
+        const sortOrders = dlg.querySelectorAll('.menuSortOrder');
 
         for (i = 0, length = sortOrders.length; i < length; i++) {
             sortOrders[i].addEventListener('change', onSortOrderChange);
diff --git a/src/scripts/multiDownload.js b/src/scripts/multiDownload.js
index d1c717af0e..270c474965 100644
--- a/src/scripts/multiDownload.js
+++ b/src/scripts/multiDownload.js
@@ -1,10 +1,10 @@
 import browser from 'browser';
 
 function fallback(urls) {
-    var i = 0;
+    let i = 0;
 
     (function createIframe() {
-        var frame = document.createElement('iframe');
+        const frame = document.createElement('iframe');
         frame.style.display = 'none';
         frame.src = urls[i++];
         document.documentElement.appendChild(frame);
@@ -28,14 +28,14 @@ function fallback(urls) {
 }
 
 function sameDomain(url) {
-    var a = document.createElement('a');
+    const a = document.createElement('a');
     a.href = url;
 
     return window.location.hostname === a.hostname && window.location.protocol === a.protocol;
 }
 
 function download(url) {
-    var a = document.createElement('a');
+    const a = document.createElement('a');
     a.download = '';
     a.href = url;
     // firefox doesn't support `a.click()`...
@@ -51,7 +51,7 @@ export default function (urls) {
         return fallback(urls);
     }
 
-    var delay = 0;
+    let delay = 0;
 
     urls.forEach(function (url) {
         // the download init has to be sequential for firefox if the urls are not on the same domain
diff --git a/src/scripts/playlistedit.js b/src/scripts/playlistedit.js
index 636a7ef056..a4b519e045 100644
--- a/src/scripts/playlistedit.js
+++ b/src/scripts/playlistedit.js
@@ -3,7 +3,7 @@ define(['listView'], function (listView) {
 
     function getFetchPlaylistItemsFn(itemId) {
         return function () {
-            var query = {
+            const query = {
                 Fields: 'PrimaryImageAspectRatio,UserData',
                 EnableImageTypes: 'Primary,Backdrop,Banner,Thumb',
                 UserId: ApiClient.getCurrentUserId()
@@ -28,7 +28,7 @@ define(['listView'], function (listView) {
     }
 
     function init(page, item) {
-        var elem = page.querySelector('#childrenContent .itemsContainer');
+        const elem = page.querySelector('#childrenContent .itemsContainer');
         elem.classList.add('vertical-list');
         elem.classList.remove('vertical-wrap');
         elem.enableDragReordering(true);
diff --git a/src/scripts/routes.js b/src/scripts/routes.js
index 8e2440b140..5651102655 100644
--- a/src/scripts/routes.js
+++ b/src/scripts/routes.js
@@ -17,7 +17,7 @@ import 'detailtablecss';
     console.groupCollapsed('defining core routes');
 
     function defineRoute(newRoute) {
-        var path = newRoute.alias ? newRoute.alias : newRoute.path;
+        const path = newRoute.alias ? newRoute.alias : newRoute.path;
         console.debug('defining route: ' + path);
         newRoute.dictionary = 'core';
         Emby.Page.addRoute(path, newRoute);
diff --git a/src/scripts/site.js b/src/scripts/site.js
index d386243138..0dbdcb4c61 100644
--- a/src/scripts/site.js
+++ b/src/scripts/site.js
@@ -1,10 +1,10 @@
 window.getWindowLocationSearch = function(win) {
     'use strict';
 
-    var search = (win || window).location.search;
+    let search = (win || window).location.search;
 
     if (!search) {
-        var index = window.location.href.indexOf('?');
+        const index = window.location.href.indexOf('?');
 
         if (index != -1) {
             search = window.location.href.substring(index);
@@ -18,9 +18,9 @@ window.getParameterByName = function(name, url) {
     'use strict';
 
     name = name.replace(/[\[]/, '\\[').replace(/[\]]/, '\\]');
-    var regexS = '[\\?&]' + name + '=([^&#]*)';
-    var regex = new RegExp(regexS, 'i');
-    var results = regex.exec(url || getWindowLocationSearch());
+    const regexS = '[\\?&]' + name + '=([^&#]*)';
+    const regex = new RegExp(regexS, 'i');
+    const results = regex.exec(url || getWindowLocationSearch());
 
     if (results == null) {
         return '';
@@ -33,7 +33,7 @@ window.pageClassOn = function(eventName, className, fn) {
     'use strict';
 
     document.addEventListener(eventName, function (event) {
-        var target = event.target;
+        const target = event.target;
 
         if (target.classList.contains(className)) {
             fn.call(target, event);
@@ -45,7 +45,7 @@ window.pageIdOn = function(eventName, id, fn) {
     'use strict';
 
     document.addEventListener(eventName, function (event) {
-        var target = event.target;
+        const target = event.target;
 
         if (target.id === id) {
             fn.call(target, event);
@@ -53,7 +53,7 @@ window.pageIdOn = function(eventName, id, fn) {
     });
 };
 
-var AppInfo = {};
+const AppInfo = {};
 
 function initClient() {
     function bindConnectionManagerEvents(connectionManager, events, userSettings) {
@@ -61,7 +61,7 @@ function initClient() {
 
         window.connectionManager.currentApiClient = function () {
             if (!localApiClient) {
-                var server = window.connectionManager.getLastUsedServer();
+                const server = window.connectionManager.getLastUsedServer();
 
                 if (server) {
                     localApiClient = window.connectionManager.getApiClient(server.Id);
@@ -86,11 +86,11 @@ function initClient() {
         return require(['connectionManagerFactory', 'apphost', 'credentialprovider', 'events', 'userSettings'], function (ConnectionManager, appHost, credentialProvider, events, userSettings) {
             appHost = appHost.default || appHost;
 
-            var credentialProviderInstance = new credentialProvider();
-            var promises = [appHost.init()];
+            const credentialProviderInstance = new credentialProvider();
+            const promises = [appHost.init()];
 
             return Promise.all(promises).then(function (responses) {
-                var capabilities = Dashboard.capabilities(appHost);
+                const capabilities = Dashboard.capabilities(appHost);
 
                 window.connectionManager = new ConnectionManager(credentialProviderInstance, appHost.appName(), appHost.appVersion(), appHost.deviceName(), appHost.deviceId(), capabilities);
 
@@ -102,7 +102,7 @@ function initClient() {
                     return require(['apiclient', 'clientUtils'], function (apiClientFactory, clientUtils) {
                         console.debug('creating ApiClient singleton');
 
-                        var apiClient = new apiClientFactory(Dashboard.serverAddress(), appHost.appName(), appHost.appVersion(), appHost.deviceName(), appHost.deviceId());
+                        const apiClient = new apiClientFactory(Dashboard.serverAddress(), appHost.appName(), appHost.appVersion(), appHost.deviceName(), appHost.deviceId());
 
                         apiClient.enableAutomaticNetworking = false;
                         apiClient.manualAddressOnly = true;
@@ -194,7 +194,7 @@ function initClient() {
 
         require(['clientUtils']);
 
-        var promises = [];
+        const promises = [];
         if (!window.fetch) {
             promises.push(require(['fetch']));
         }
@@ -226,8 +226,8 @@ function initClient() {
     }
 
     function loadCoreDictionary(globalize) {
-        var languages = ['ar', 'be-by', 'bg-bg', 'ca', 'cs', 'da', 'de', 'el', 'en-gb', 'en-us', 'es', 'es-ar', 'es-mx', 'fa', 'fi', 'fr', 'fr-ca', 'gsw', 'he', 'hi-in', 'hr', 'hu', 'id', 'it', 'kk', 'ko', 'lt-lt', 'ms', 'nb', 'nl', 'pl', 'pt-br', 'pt-pt', 'ro', 'ru', 'sk', 'sl-si', 'sv', 'tr', 'uk', 'vi', 'zh-cn', 'zh-hk', 'zh-tw'];
-        var translations = languages.map(function (language) {
+        const languages = ['ar', 'be-by', 'bg-bg', 'ca', 'cs', 'da', 'de', 'el', 'en-gb', 'en-us', 'es', 'es-ar', 'es-mx', 'fa', 'fi', 'fr', 'fr-ca', 'gsw', 'he', 'hi-in', 'hr', 'hu', 'id', 'it', 'kk', 'ko', 'lt-lt', 'ms', 'nb', 'nl', 'pl', 'pt-br', 'pt-pt', 'ro', 'ru', 'sk', 'sl-si', 'sv', 'tr', 'uk', 'vi', 'zh-cn', 'zh-hk', 'zh-tw'];
+        const translations = languages.map(function (language) {
             return {
                 lang: language,
                 path: 'strings/' + language + '.json'
@@ -367,7 +367,7 @@ function initClient() {
 
                 require(['playerSelectionMenu']);
 
-                var apiClient = window.connectionManager && window.connectionManager.currentApiClient();
+                const apiClient = window.connectionManager && window.connectionManager.currentApiClient();
                 if (apiClient) {
                     fetch(apiClient.getUrl('Branding/Css'))
                         .then(function(response) {
@@ -410,8 +410,8 @@ function initClient() {
     }
 
     function onWebComponentsReady() {
-        var componentsPath = getComponentsPath();
-        var scriptsPath = getScriptsPath();
+        const componentsPath = getComponentsPath();
+        const scriptsPath = getScriptsPath();
 
         define('filesystem', [scriptsPath + '/filesystem'], returnFirstDependency);
 
@@ -441,18 +441,18 @@ function initClient() {
         init();
     }
 
-    var promise;
-    var localApiClient;
+    let promise;
+    let localApiClient;
 
     function initRequireJs() {
-        var urlArgs = 'v=' + (window.dashboardVersion || new Date().getDate());
+        const urlArgs = 'v=' + (window.dashboardVersion || new Date().getDate());
 
-        var bowerPath = getBowerPath();
-        var componentsPath = getComponentsPath();
-        var elementsPath = getElementsPath();
-        var scriptsPath = getScriptsPath();
+        const bowerPath = getBowerPath();
+        const componentsPath = getComponentsPath();
+        const elementsPath = getElementsPath();
+        const scriptsPath = getScriptsPath();
 
-        var paths = {
+        const paths = {
             browserdeviceprofile: 'scripts/browserDeviceProfile',
             browser: 'scripts/browser',
             libraryBrowser: 'scripts/libraryBrowser',
diff --git a/src/scripts/themeManager.js b/src/scripts/themeManager.js
index 03ca621749..56d3362219 100644
--- a/src/scripts/themeManager.js
+++ b/src/scripts/themeManager.js
@@ -1,10 +1,10 @@
 import * as webSettings from 'webSettings';
 
-var themeStyleElement = document.querySelector('#cssTheme');
-var currentThemeId;
+let themeStyleElement = document.querySelector('#cssTheme');
+let currentThemeId;
 
 function unloadTheme() {
-    var elem = themeStyleElement;
+    const elem = themeStyleElement;
     if (elem) {
         elem.removeAttribute('href');
         currentThemeId = null;
@@ -17,7 +17,7 @@ function getThemes() {
 
 function getThemeStylesheetInfo(id) {
     return getThemes().then(themes => {
-        var theme = themes.find(theme => {
+        const theme = themes.find(theme => {
             return id ? theme.id === id : theme.default;
         });
 
@@ -41,7 +41,7 @@ function setTheme(id) {
                 return;
             }
 
-            var linkUrl = info.stylesheetPath;
+            const linkUrl = info.stylesheetPath;
             unloadTheme();
 
             let link = themeStyleElement;