diff --git a/package.json b/package.json
index edda337f2c..f2ae59522b 100644
--- a/package.json
+++ b/package.json
@@ -122,6 +122,7 @@
           "src/components/lazyLoader/lazyLoaderIntersectionObserver.js",
           "src/components/libraryoptionseditor/libraryoptionseditor.js",
           "src/components/listview/listview.js",
+          "src/components/loading/loading.js",
           "src/components/maintabsmanager.js",
           "src/components/mediainfo/mediainfo.js",
           "src/components/mediaLibraryCreator/mediaLibraryCreator.js",
diff --git a/src/components/appRouter.js b/src/components/appRouter.js
index 138d58e5c0..e4c53fbbb8 100644
--- a/src/components/appRouter.js
+++ b/src/components/appRouter.js
@@ -22,7 +22,7 @@ define(['loading', 'globalize', 'events', 'viewManager', 'skinManager', 'backdro
 
     function beginConnectionWizard() {
         backdrop.clearBackdrop();
-        loading.show();
+        loading.default.show();
         connectionManager.connect({
             enableAutoLogin: appSettings.enableAutoLogin()
         }).then(function (result) {
@@ -33,7 +33,7 @@ define(['loading', 'globalize', 'events', 'viewManager', 'skinManager', 'backdro
     function handleConnectionResult(result) {
         switch (result.State) {
             case 'SignedIn':
-                loading.hide();
+                loading.default.hide();
                 skinManager.loadUserSkin();
                 break;
             case 'ServerSignIn':
@@ -277,7 +277,7 @@ define(['loading', 'globalize', 'events', 'viewManager', 'skinManager', 'backdro
 
     var firstConnectionResult;
     function start(options) {
-        loading.show();
+        loading.default.show();
 
         initApiClients();
 
@@ -297,7 +297,7 @@ define(['loading', 'globalize', 'events', 'viewManager', 'skinManager', 'backdro
                 hashbang: options.hashbang !== false
             });
         }).catch().then(function() {
-            loading.hide();
+            loading.default.hide();
         });
     }
 
@@ -512,7 +512,7 @@ define(['loading', 'globalize', 'events', 'viewManager', 'skinManager', 'backdro
         if (currentRouteInfo && currentRouteInfo.path === path) {
             // can't use this with home right now due to the back menu
             if (currentRouteInfo.route.type !== 'home') {
-                loading.hide();
+                loading.default.hide();
                 return Promise.resolve();
             }
         }
diff --git a/src/components/guide/guide.js b/src/components/guide/guide.js
index bd3ad89aaa..abc7d81fee 100644
--- a/src/components/guide/guide.js
+++ b/src/components/guide/guide.js
@@ -1,6 +1,8 @@
 define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager', 'scrollHelper', 'serverNotifications', 'loading', 'datetime', 'focusManager', 'playbackManager', 'userSettings', 'imageLoader', 'events', 'layoutManager', 'itemShortcuts', 'dom', 'css!./guide.css', 'programStyles', 'material-icons', 'scrollStyles', 'emby-programcell', 'emby-button', 'paper-icon-button-light', 'emby-tabs', 'emby-scroller', 'flexStyles', 'webcomponents'], function (require, inputManager, browser, globalize, connectionManager, scrollHelper, serverNotifications, loading, datetime, focusManager, playbackManager, userSettings, imageLoader, events, layoutManager, itemShortcuts, dom) {
     'use strict';
 
+    loading = loading.default || loading;
+
     function showViewSettings(instance) {
         require(['guide-settings-dialog'], function (guideSettingsDialog) {
             guideSettingsDialog.show(instance.categoryOptions).then(function () {
diff --git a/src/components/imageDownloader/imageDownloader.js b/src/components/imageDownloader/imageDownloader.js
index 8c278a62b6..d615b912fd 100644
--- a/src/components/imageDownloader/imageDownloader.js
+++ b/src/components/imageDownloader/imageDownloader.js
@@ -1,6 +1,8 @@
 define(['dom', 'loading', 'apphost', 'dialogHelper', 'connectionManager', 'imageLoader', 'browser', 'layoutManager', 'scrollHelper', 'globalize', 'require', 'emby-checkbox', 'paper-icon-button-light', 'emby-button', 'formDialogStyle', 'cardStyle'], function (dom, loading, appHost, dialogHelper, connectionManager, imageLoader, browser, layoutManager, scrollHelper, globalize, require) {
     'use strict';
 
+    loading = loading.default || loading;
+
     var enableFocusTransform = !browser.slow && !browser.edge;
 
     var currentItemId;
diff --git a/src/components/imageeditor/imageeditor.js b/src/components/imageeditor/imageeditor.js
index 125a2dc062..9a7b563d0f 100644
--- a/src/components/imageeditor/imageeditor.js
+++ b/src/components/imageeditor/imageeditor.js
@@ -1,6 +1,8 @@
 define(['dialogHelper', 'connectionManager', 'loading', 'dom', 'layoutManager', 'focusManager', 'globalize', 'scrollHelper', 'imageLoader', 'require', 'browser', 'apphost', 'cardStyle', 'formDialogStyle', 'emby-button', 'paper-icon-button-light', 'css!./imageeditor'], function (dialogHelper, connectionManager, loading, dom, layoutManager, focusManager, globalize, scrollHelper, imageLoader, require, browser, appHost) {
     'use strict';
 
+    loading = loading.default || loading;
+
     var enableFocusTransform = !browser.slow && !browser.edge;
 
     var currentItem;
diff --git a/src/components/loading/loading.js b/src/components/loading/loading.js
index 9f86ba452f..08271d4635 100644
--- a/src/components/loading/loading.js
+++ b/src/components/loading/loading.js
@@ -1,78 +1,74 @@
-define(['css!./loading'], function () {
-    'use strict';
+import 'css!./loading';
 
-    var loadingElem;
-    var layer1;
-    var layer2;
-    var layer3;
-    var layer4;
-    var circleLefts;
-    var circleRights;
+let loadingElem;
+let layer1;
+let layer2;
+let layer3;
+let layer4;
+let circleLefts;
+let circleRights;
 
-    return {
-        show: function () {
-            var elem = loadingElem;
+function show() {
+    let elem = loadingElem;
 
-            if (!elem) {
-                elem = document.createElement('div');
-                loadingElem = elem;
+    if (!elem) {
+        elem = document.createElement('div');
+        loadingElem = elem;
 
-                elem.classList.add('docspinner');
-                elem.classList.add('mdl-spinner');
+        elem.classList.add('docspinner');
+        elem.classList.add('mdl-spinner');
 
-                elem.innerHTML = '<div class="mdl-spinner__layer mdl-spinner__layer-1"><div class="mdl-spinner__circle-clipper mdl-spinner__left"><div class="mdl-spinner__circle mdl-spinner__circleLeft"></div></div><div class="mdl-spinner__circle-clipper mdl-spinner__right"><div class="mdl-spinner__circle mdl-spinner__circleRight"></div></div></div><div class="mdl-spinner__layer mdl-spinner__layer-2"><div class="mdl-spinner__circle-clipper mdl-spinner__left"><div class="mdl-spinner__circle mdl-spinner__circleLeft"></div></div><div class="mdl-spinner__circle-clipper mdl-spinner__right"><div class="mdl-spinner__circle mdl-spinner__circleRight"></div></div></div><div class="mdl-spinner__layer mdl-spinner__layer-3"><div class="mdl-spinner__circle-clipper mdl-spinner__left"><div class="mdl-spinner__circle mdl-spinner__circleLeft"></div></div><div class="mdl-spinner__circle-clipper mdl-spinner__right"><div class="mdl-spinner__circle mdl-spinner__circleRight"></div></div></div><div class="mdl-spinner__layer mdl-spinner__layer-4"><div class="mdl-spinner__circle-clipper mdl-spinner__left"><div class="mdl-spinner__circle mdl-spinner__circleLeft"></div></div><div class="mdl-spinner__circle-clipper mdl-spinner__right"><div class="mdl-spinner__circle mdl-spinner__circleRight"></div></div></div>';
+        elem.innerHTML = '<div class="mdl-spinner__layer mdl-spinner__layer-1"><div class="mdl-spinner__circle-clipper mdl-spinner__left"><div class="mdl-spinner__circle mdl-spinner__circleLeft"></div></div><div class="mdl-spinner__circle-clipper mdl-spinner__right"><div class="mdl-spinner__circle mdl-spinner__circleRight"></div></div></div><div class="mdl-spinner__layer mdl-spinner__layer-2"><div class="mdl-spinner__circle-clipper mdl-spinner__left"><div class="mdl-spinner__circle mdl-spinner__circleLeft"></div></div><div class="mdl-spinner__circle-clipper mdl-spinner__right"><div class="mdl-spinner__circle mdl-spinner__circleRight"></div></div></div><div class="mdl-spinner__layer mdl-spinner__layer-3"><div class="mdl-spinner__circle-clipper mdl-spinner__left"><div class="mdl-spinner__circle mdl-spinner__circleLeft"></div></div><div class="mdl-spinner__circle-clipper mdl-spinner__right"><div class="mdl-spinner__circle mdl-spinner__circleRight"></div></div></div><div class="mdl-spinner__layer mdl-spinner__layer-4"><div class="mdl-spinner__circle-clipper mdl-spinner__left"><div class="mdl-spinner__circle mdl-spinner__circleLeft"></div></div><div class="mdl-spinner__circle-clipper mdl-spinner__right"><div class="mdl-spinner__circle mdl-spinner__circleRight"></div></div></div>';
 
-                document.body.appendChild(elem);
+        document.body.appendChild(elem);
 
-                layer1 = elem.querySelector('.mdl-spinner__layer-1');
-                layer2 = elem.querySelector('.mdl-spinner__layer-2');
-                layer3 = elem.querySelector('.mdl-spinner__layer-3');
-                layer4 = elem.querySelector('.mdl-spinner__layer-4');
+        layer1 = elem.querySelector('.mdl-spinner__layer-1');
+        layer2 = elem.querySelector('.mdl-spinner__layer-2');
+        layer3 = elem.querySelector('.mdl-spinner__layer-3');
+        layer4 = elem.querySelector('.mdl-spinner__layer-4');
 
-                circleLefts = elem.querySelectorAll('.mdl-spinner__circleLeft');
-                circleRights = elem.querySelectorAll('.mdl-spinner__circleRight');
-            }
+        circleLefts = elem.querySelectorAll('.mdl-spinner__circleLeft');
+        circleRights = elem.querySelectorAll('.mdl-spinner__circleRight');
+    }
 
-            elem.classList.add('mdlSpinnerActive');
+    elem.classList.add('mdlSpinnerActive');
 
-            layer1.classList.add('mdl-spinner__layer-1-active');
-            layer2.classList.add('mdl-spinner__layer-2-active');
-            layer3.classList.add('mdl-spinner__layer-3-active');
-            layer4.classList.add('mdl-spinner__layer-4-active');
+    layer1.classList.add('mdl-spinner__layer-1-active');
+    layer2.classList.add('mdl-spinner__layer-2-active');
+    layer3.classList.add('mdl-spinner__layer-3-active');
+    layer4.classList.add('mdl-spinner__layer-4-active');
 
-            var i;
-            var length;
+    for (let i = 0, length = circleLefts.length; i < length; i++) {
+        circleLefts[i].classList.add('mdl-spinner__circleLeft-active');
+    }
 
-            for (i = 0, length = circleLefts.length; i < length; i++) {
-                circleLefts[i].classList.add('mdl-spinner__circleLeft-active');
-            }
+    for (let i = 0, length = circleRights.length; i < length; i++) {
+        circleRights[i].classList.add('mdl-spinner__circleRight-active');
+    }
+}
 
-            for (i = 0, length = circleRights.length; i < length; i++) {
-                circleRights[i].classList.add('mdl-spinner__circleRight-active');
-            }
-        },
-        hide: function () {
-            var elem = loadingElem;
+function hide() {
+    const elem = loadingElem;
 
-            if (elem) {
-                elem.classList.remove('mdlSpinnerActive');
+    if (elem) {
+        elem.classList.remove('mdlSpinnerActive');
 
-                elem.classList.remove('mdl-spinner__layer-1-active');
-                elem.classList.remove('mdl-spinner__layer-2-active');
-                elem.classList.remove('mdl-spinner__layer-3-active');
-                elem.classList.remove('mdl-spinner__layer-4-active');
+        elem.classList.remove('mdl-spinner__layer-1-active');
+        elem.classList.remove('mdl-spinner__layer-2-active');
+        elem.classList.remove('mdl-spinner__layer-3-active');
+        elem.classList.remove('mdl-spinner__layer-4-active');
 
-                var i;
-                var length;
-
-                for (i = 0, length = circleLefts.length; i < length; i++) {
-                    circleLefts[i].classList.remove('mdl-spinner__circleLeft-active');
-                }
-
-                for (i = 0, length = circleRights.length; i < length; i++) {
-                    circleRights[i].classList.remove('mdl-spinner__circleRight-active');
-                }
-            }
+        for (let i = 0, length = circleLefts.length; i < length; i++) {
+            circleLefts[i].classList.remove('mdl-spinner__circleLeft-active');
         }
-    };
-});
+
+        for (let i = 0, length = circleRights.length; i < length; i++) {
+            circleRights[i].classList.remove('mdl-spinner__circleRight-active');
+        }
+    }
+}
+
+export default {
+    show: show,
+    hide: hide
+};
diff --git a/src/components/playback/playbackmanager.js b/src/components/playback/playbackmanager.js
index 829cd38f2c..85d5954d18 100644
--- a/src/components/playback/playbackmanager.js
+++ b/src/components/playback/playbackmanager.js
@@ -1,6 +1,8 @@
 define(['events', 'datetime', 'appSettings', 'itemHelper', 'pluginManager', 'playQueueManager', 'userSettings', 'globalize', 'connectionManager', 'loading', 'apphost', 'screenfull'], function (events, datetime, appSettings, itemHelper, pluginManager, PlayQueueManager, userSettings, globalize, connectionManager, loading, apphost, screenfull) {
     'use strict';
 
+    loading = loading.default || loading;
+
     function enableLocalPlaylistManagement(player) {
         if (player.getPlaylist) {
             return false;
diff --git a/src/components/recordingcreator/recordingeditor.js b/src/components/recordingcreator/recordingeditor.js
index 3797cde370..2086129a9e 100644
--- a/src/components/recordingcreator/recordingeditor.js
+++ b/src/components/recordingcreator/recordingeditor.js
@@ -1,6 +1,8 @@
 define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'connectionManager', 'require', 'loading', 'scrollHelper', 'imageLoader', 'scrollStyles', 'emby-button', 'emby-collapse', 'emby-input', 'paper-icon-button-light', 'css!./../formdialog', 'css!./recordingcreator', 'material-icons', 'flexStyles'], function (dialogHelper, globalize, layoutManager, mediaInfo, appHost, connectionManager, require, loading, scrollHelper, imageLoader) {
     'use strict';
 
+    loading = loading.default || loading;
+
     var currentDialog;
     var recordingDeleted = false;
     var currentItemId;
diff --git a/src/components/recordingcreator/recordingfields.js b/src/components/recordingcreator/recordingfields.js
index 2534eafe6a..e3739f1cfe 100644
--- a/src/components/recordingcreator/recordingfields.js
+++ b/src/components/recordingcreator/recordingfields.js
@@ -1,6 +1,8 @@
 define(['globalize', 'connectionManager', 'serverNotifications', 'require', 'loading', 'apphost', 'dom', 'recordingHelper', 'events', 'paper-icon-button-light', 'emby-button', 'css!./recordingfields', 'flexStyles'], function (globalize, connectionManager, serverNotifications, require, loading, appHost, dom, recordingHelper, events) {
     'use strict';
 
+    loading = loading.default || loading;
+
     function loadData(parent, program, apiClient) {
         if (program.IsSeries) {
             parent.querySelector('.recordSeriesContainer').classList.remove('hide');
diff --git a/src/components/recordingcreator/recordinghelper.js b/src/components/recordingcreator/recordinghelper.js
index 4a0bdd9b01..5d72394282 100644
--- a/src/components/recordingcreator/recordinghelper.js
+++ b/src/components/recordingcreator/recordinghelper.js
@@ -1,6 +1,8 @@
 define(['globalize', 'loading', 'connectionManager'], function (globalize, loading, connectionManager) {
     'use strict';
 
+    loading = loading.default || loading;
+
     function changeRecordingToSeries(apiClient, timerId, programId, confirmTimerCancellation) {
         loading.show();
 
diff --git a/src/components/recordingcreator/seriesrecordingeditor.js b/src/components/recordingcreator/seriesrecordingeditor.js
index ea20c7267d..b115e273e6 100644
--- a/src/components/recordingcreator/seriesrecordingeditor.js
+++ b/src/components/recordingcreator/seriesrecordingeditor.js
@@ -1,6 +1,8 @@
 define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'connectionManager', 'require', 'loading', 'scrollHelper', 'imageLoader', 'datetime', 'scrollStyles', 'emby-button', 'emby-checkbox', 'emby-input', 'emby-select', 'paper-icon-button-light', 'css!./../formdialog', 'css!./recordingcreator', 'material-icons', 'flexStyles'], function (dialogHelper, globalize, layoutManager, mediaInfo, appHost, connectionManager, require, loading, scrollHelper, imageLoader, datetime) {
     'use strict';
 
+    loading = loading.default || loading;
+
     var currentDialog;
     var recordingUpdated = false;
     var recordingDeleted = false;
diff --git a/src/components/refreshdialog/refreshdialog.js b/src/components/refreshdialog/refreshdialog.js
index 40e1183502..57b2ee3189 100644
--- a/src/components/refreshdialog/refreshdialog.js
+++ b/src/components/refreshdialog/refreshdialog.js
@@ -1,6 +1,8 @@
 define(['dom', 'shell', 'dialogHelper', 'loading', 'layoutManager', 'connectionManager', 'appRouter', 'globalize', 'emby-input', 'emby-checkbox', 'paper-icon-button-light', 'emby-select', 'material-icons', 'css!./../formdialog', 'emby-button'], function (dom, shell, dialogHelper, loading, layoutManager, connectionManager, appRouter, globalize) {
     'use strict';
 
+    loading = loading.default || loading;
+
     function getEditorHtml() {
         var html = '';
 
diff --git a/src/components/subtitleeditor/subtitleeditor.js b/src/components/subtitleeditor/subtitleeditor.js
index 37f767524e..7df24b5da8 100644
--- a/src/components/subtitleeditor/subtitleeditor.js
+++ b/src/components/subtitleeditor/subtitleeditor.js
@@ -1,6 +1,8 @@
 define(['dialogHelper', 'require', 'layoutManager', 'globalize', 'userSettings', 'connectionManager', 'loading', 'focusManager', 'dom', 'apphost', 'emby-select', 'listViewStyle', 'paper-icon-button-light', 'css!./../formdialog', 'material-icons', 'css!./subtitleeditor', 'emby-button', 'flexStyles'], function (dialogHelper, require, layoutManager, globalize, userSettings, connectionManager, loading, focusManager, dom, appHost) {
     'use strict';
 
+    loading = loading.default || loading;
+
     var currentItem;
     var hasChanges;
 
diff --git a/src/components/tunerPicker.js b/src/components/tunerPicker.js
index e7c92851a4..de5c4cf186 100644
--- a/src/components/tunerPicker.js
+++ b/src/components/tunerPicker.js
@@ -1,6 +1,8 @@
 define(['dialogHelper', 'dom', 'layoutManager', 'connectionManager', 'globalize', 'loading', 'browser', 'focusManager', 'scrollHelper', 'material-icons', 'formDialogStyle', 'emby-button', 'emby-itemscontainer', 'cardStyle'], function (dialogHelper, dom, layoutManager, connectionManager, globalize, loading, browser, focusManager, scrollHelper) {
     'use strict';
 
+    loading = loading.default || loading;
+
     var enableFocusTransform = !browser.slow && !browser.edge;
 
     function getEditorHtml() {
diff --git a/src/components/tvproviders/schedulesdirect.js b/src/components/tvproviders/schedulesdirect.js
index be1cdf575b..e9bb6c4080 100644
--- a/src/components/tvproviders/schedulesdirect.js
+++ b/src/components/tvproviders/schedulesdirect.js
@@ -1,6 +1,8 @@
 define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'listViewStyle', 'emby-input', 'emby-select', 'emby-button', 'flexStyles'], function ($, loading, globalize) {
     'use strict';
 
+    loading = loading.default || loading;
+
     return function (page, providerId, options) {
         function reload() {
             loading.show();
diff --git a/src/components/tvproviders/xmltv.js b/src/components/tvproviders/xmltv.js
index 054c5b640d..339451e1ab 100644
--- a/src/components/tvproviders/xmltv.js
+++ b/src/components/tvproviders/xmltv.js
@@ -1,6 +1,8 @@
 define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'emby-input', 'listViewStyle', 'paper-icon-button-light'], function ($, loading, globalize) {
     'use strict';
 
+    loading = loading.default || loading;
+
     return function (page, providerId, options) {
         function getListingProvider(config, id) {
             if (config && id) {
diff --git a/src/controllers/dashboard/notifications/notifications/index.js b/src/controllers/dashboard/notifications/notifications/index.js
index 4e049bc106..c2cf9d83c3 100644
--- a/src/controllers/dashboard/notifications/notifications/index.js
+++ b/src/controllers/dashboard/notifications/notifications/index.js
@@ -1,6 +1,8 @@
 define(['loading', 'libraryMenu', 'globalize', 'listViewStyle', 'emby-button'], function(loading, libraryMenu, globalize) {
     'use strict';
 
+    loading = loading.default || loading;
+
     function reload(page) {
         loading.show();
         ApiClient.getJSON(ApiClient.getUrl('Notifications/Types')).then(function(list) {
diff --git a/src/controllers/dashboard/plugins/add/index.js b/src/controllers/dashboard/plugins/add/index.js
index a3c450dd79..c20b7832cd 100644
--- a/src/controllers/dashboard/plugins/add/index.js
+++ b/src/controllers/dashboard/plugins/add/index.js
@@ -1,6 +1,8 @@
 define(['jQuery', 'loading', 'libraryMenu', 'globalize', 'connectionManager', 'emby-button'], function ($, loading, libraryMenu, globalize, connectionManager) {
     'use strict';
 
+    loading = loading.default || loading;
+
     function populateHistory(packageInfo, page) {
         var html = '';
         var length = Math.min(packageInfo.versions.length, 10);
diff --git a/src/controllers/dashboard/plugins/available/index.js b/src/controllers/dashboard/plugins/available/index.js
index 1f202d6ff6..c4f18b6de9 100644
--- a/src/controllers/dashboard/plugins/available/index.js
+++ b/src/controllers/dashboard/plugins/available/index.js
@@ -1,6 +1,8 @@
 define(['loading', 'libraryMenu', 'globalize', 'cardStyle', 'emby-button', 'emby-checkbox', 'emby-select'], function (loading, libraryMenu, globalize) {
     'use strict';
 
+    loading = loading.default || loading;
+
     function reloadList(page) {
         loading.show();
         var promise1 = ApiClient.getAvailablePlugins();
diff --git a/src/controllers/dashboard/plugins/installed/index.js b/src/controllers/dashboard/plugins/installed/index.js
index d28a04cb2b..3131386b2b 100644
--- a/src/controllers/dashboard/plugins/installed/index.js
+++ b/src/controllers/dashboard/plugins/installed/index.js
@@ -1,6 +1,8 @@
 define(['loading', 'libraryMenu', 'dom', 'globalize', 'cardStyle', 'emby-button'], function (loading, libraryMenu, dom, globalize) {
     'use strict';
 
+    loading = loading.default || loading;
+
     function deletePlugin(page, uniqueid, name) {
         var msg = globalize.translate('UninstallPluginConfirmation', name);
 
diff --git a/src/controllers/edititemmetadata.js b/src/controllers/edititemmetadata.js
index 1a3647a758..b0f1f4a142 100644
--- a/src/controllers/edititemmetadata.js
+++ b/src/controllers/edititemmetadata.js
@@ -1,6 +1,8 @@
 define(['loading', 'scripts/editorsidebar'], function (loading) {
     'use strict';
 
+    loading = loading.default || loading;
+
     function reload(context, itemId) {
         loading.show();
 
diff --git a/src/controllers/hometab.js b/src/controllers/hometab.js
index 8e2a1f92e7..97034d4505 100644
--- a/src/controllers/hometab.js
+++ b/src/controllers/hometab.js
@@ -1,6 +1,8 @@
 define(['userSettings', 'loading', 'connectionManager', 'apphost', 'layoutManager', 'focusManager', 'homeSections', 'emby-itemscontainer'], function (userSettings, loading, connectionManager, appHost, layoutManager, focusManager, homeSections) {
     'use strict';
 
+    loading = loading.default || loading;
+
     function HomeTab(view, params) {
         this.view = view;
         this.params = params;
diff --git a/src/controllers/itemDetails/index.js b/src/controllers/itemDetails/index.js
index 29aa8ad1e1..02dc66d35a 100644
--- a/src/controllers/itemDetails/index.js
+++ b/src/controllers/itemDetails/index.js
@@ -1,6 +1,8 @@
 define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSettings', 'cardBuilder', 'datetime', 'mediaInfo', 'backdrop', 'listView', 'itemContextMenu', 'itemHelper', 'dom', 'indicators', 'imageLoader', 'libraryMenu', 'globalize', 'browser', 'events', 'playbackManager', 'scrollStyles', 'emby-itemscontainer', 'emby-checkbox', 'emby-button', 'emby-playstatebutton', 'emby-ratingbutton', 'emby-scroller', 'emby-select'], function (loading, appRouter, layoutManager, connectionManager, userSettings, cardBuilder, datetime, mediaInfo, backdrop, listView, itemContextMenu, itemHelper, dom, indicators, imageLoader, libraryMenu, globalize, browser, events, playbackManager) {
     'use strict';
 
+    loading = loading.default || loading;
+
     function getPromise(apiClient, params) {
         var id = params.id;
 
diff --git a/src/controllers/list.js b/src/controllers/list.js
index e550b535f4..2a26f81a39 100644
--- a/src/controllers/list.js
+++ b/src/controllers/list.js
@@ -1,6 +1,8 @@
 define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager', 'cardBuilder', 'loading', 'connectionManager', 'alphaNumericShortcuts', 'scroller', 'playbackManager', 'alphaPicker', 'emby-itemscontainer', 'emby-scroller'], function (globalize, listView, layoutManager, userSettings, focusManager, cardBuilder, loading, connectionManager, AlphaNumericShortcuts, scroller, playbackManager, AlphaPicker) {
     'use strict';
 
+    loading = loading.default || loading;
+
     function getInitialLiveTvQuery(instance, params) {
         var query = {
             UserId: connectionManager.getApiClient(params.serverId).getCurrentUserId(),
diff --git a/src/controllers/livetv/livetvchannels.js b/src/controllers/livetv/livetvchannels.js
index 62906d9d21..c0061c1f52 100644
--- a/src/controllers/livetv/livetvchannels.js
+++ b/src/controllers/livetv/livetvchannels.js
@@ -1,6 +1,8 @@
 define(['cardBuilder', 'imageLoader', 'libraryBrowser', 'loading', 'events', 'userSettings', 'emby-itemscontainer'], function (cardBuilder, imageLoader, libraryBrowser, loading, events, userSettings) {
     'use strict';
 
+    loading = loading.default || loading;
+
     return function (view, params, tabContent) {
         function getPageData() {
             if (!pageData) {
diff --git a/src/controllers/livetv/livetvrecordings.js b/src/controllers/livetv/livetvrecordings.js
index d832ca1339..b0259bc89b 100644
--- a/src/controllers/livetv/livetvrecordings.js
+++ b/src/controllers/livetv/livetvrecordings.js
@@ -1,6 +1,8 @@
 define(['layoutManager', 'loading', 'cardBuilder', 'apphost', 'imageLoader', 'scripts/livetvcomponents', 'listViewStyle', 'emby-itemscontainer'], function (layoutManager, loading, cardBuilder, appHost, imageLoader) {
     'use strict';
 
+    loading = loading.default || loading;
+
     function renderRecordings(elem, recordings, cardOptions, scrollX) {
         if (!elem) {
             return;
diff --git a/src/controllers/livetv/livetvschedule.js b/src/controllers/livetv/livetvschedule.js
index 2f451e50fb..4427bef5d1 100644
--- a/src/controllers/livetv/livetvschedule.js
+++ b/src/controllers/livetv/livetvschedule.js
@@ -1,6 +1,8 @@
 define(['layoutManager', 'cardBuilder', 'apphost', 'imageLoader', 'loading', 'scripts/livetvcomponents', 'emby-button', 'emby-itemscontainer'], function (layoutManager, cardBuilder, appHost, imageLoader, loading) {
     'use strict';
 
+    loading = loading.default || loading;
+
     function enableScrollX() {
         return !layoutManager.desktop;
     }
diff --git a/src/controllers/livetv/livetvseriestimers.js b/src/controllers/livetv/livetvseriestimers.js
index c5d0da60d7..62f36a1006 100644
--- a/src/controllers/livetv/livetvseriestimers.js
+++ b/src/controllers/livetv/livetvseriestimers.js
@@ -1,6 +1,8 @@
 define(['datetime', 'cardBuilder', 'imageLoader', 'apphost', 'loading', 'paper-icon-button-light', 'emby-button'], function (datetime, cardBuilder, imageLoader, appHost, loading) {
     'use strict';
 
+    loading = loading.default || loading;
+
     function renderTimers(context, timers) {
         var html = '';
         html += cardBuilder.getCardsHtml({
diff --git a/src/controllers/livetv/livetvsuggested.js b/src/controllers/livetv/livetvsuggested.js
index 036eee9fc6..5f0d4d5657 100644
--- a/src/controllers/livetv/livetvsuggested.js
+++ b/src/controllers/livetv/livetvsuggested.js
@@ -1,6 +1,8 @@
 define(['layoutManager', 'userSettings', 'inputManager', 'loading', 'globalize', 'libraryBrowser', 'mainTabsManager', 'cardBuilder', 'apphost', 'imageLoader', 'scrollStyles', 'emby-itemscontainer', 'emby-tabs', 'emby-button'], function (layoutManager, userSettings, inputManager, loading, globalize, libraryBrowser, mainTabsManager, cardBuilder, appHost, imageLoader) {
     'use strict';
 
+    loading = loading.default || loading;
+
     function enableScrollX() {
         return !layoutManager.desktop;
     }
diff --git a/src/controllers/livetvguideprovider.js b/src/controllers/livetvguideprovider.js
index 8f8b9f91c7..3ec04fd2af 100644
--- a/src/controllers/livetvguideprovider.js
+++ b/src/controllers/livetvguideprovider.js
@@ -1,6 +1,8 @@
 define(['events', 'loading', 'globalize'], function (events, loading, globalize) {
     'use strict';
 
+    loading = loading.default || loading;
+
     function onListingsSubmitted() {
         Dashboard.navigate('livetvstatus.html');
     }
diff --git a/src/controllers/livetvsettings.js b/src/controllers/livetvsettings.js
index 715eb06214..33034295b5 100644
--- a/src/controllers/livetvsettings.js
+++ b/src/controllers/livetvsettings.js
@@ -1,6 +1,8 @@
 define(['jQuery', 'loading', 'globalize', 'emby-button'], function ($, loading, globalize) {
     'use strict';
 
+    loading = loading.default || loading;
+
     function loadPage(page, config) {
         $('.liveTvSettingsForm', page).show();
         $('.noLiveTvServices', page).hide();
diff --git a/src/controllers/livetvstatus.js b/src/controllers/livetvstatus.js
index 84ea006fd9..216594160f 100644
--- a/src/controllers/livetvstatus.js
+++ b/src/controllers/livetvstatus.js
@@ -1,6 +1,8 @@
 define(['jQuery', 'globalize', 'scripts/taskbutton', 'dom', 'libraryMenu', 'layoutManager', 'loading', 'browser', 'listViewStyle', 'flexStyles', 'emby-itemscontainer', 'cardStyle', 'material-icons', 'emby-button'], function ($, globalize, taskButton, dom, libraryMenu, layoutManager, loading, browser) {
     'use strict';
 
+    loading = loading.default || loading;
+
     var enableFocusTransform = !browser.slow && !browser.edge;
 
     function getDeviceHtml(device) {
diff --git a/src/controllers/livetvtuner.js b/src/controllers/livetvtuner.js
index 92f705c02f..7f5b70483d 100644
--- a/src/controllers/livetvtuner.js
+++ b/src/controllers/livetvtuner.js
@@ -1,6 +1,8 @@
 define(['globalize', 'loading', 'libraryMenu', 'dom', 'emby-input', 'emby-button', 'emby-checkbox', 'emby-select'], function (globalize, loading, libraryMenu, dom) {
     'use strict';
 
+    loading = loading.default || loading;
+
     function isM3uVariant(type) {
         return ['nextpvr'].indexOf(type || '') !== -1;
     }
diff --git a/src/controllers/movies/moviecollections.js b/src/controllers/movies/moviecollections.js
index 65abca46e0..f69b53b77e 100644
--- a/src/controllers/movies/moviecollections.js
+++ b/src/controllers/movies/moviecollections.js
@@ -1,6 +1,8 @@
 define(['loading', 'events', 'libraryBrowser', 'imageLoader', 'listView', 'cardBuilder', 'userSettings', 'globalize', 'emby-itemscontainer'], function (loading, events, libraryBrowser, imageLoader, listView, cardBuilder, userSettings, globalize) {
     'use strict';
 
+    loading = loading.default || loading;
+
     return function (view, params, tabContent) {
         function getPageData(context) {
             var key = getSavedQueryKey(context);
diff --git a/src/controllers/movies/moviegenres.js b/src/controllers/movies/moviegenres.js
index 43f73bfa76..93370a8ce5 100644
--- a/src/controllers/movies/moviegenres.js
+++ b/src/controllers/movies/moviegenres.js
@@ -1,6 +1,8 @@
 define(['layoutManager', 'loading', 'libraryBrowser', 'cardBuilder', 'lazyLoader', 'apphost', 'globalize', 'appRouter', 'dom', 'emby-button'], function (layoutManager, loading, libraryBrowser, cardBuilder, lazyLoader, appHost, globalize, appRouter, dom) {
     'use strict';
 
+    loading = loading.default || loading;
+
     return function (view, params, tabContent) {
         function getPageData() {
             var key = getSavedQueryKey();
diff --git a/src/controllers/movies/movies.js b/src/controllers/movies/movies.js
index 82b162e2ad..5bc582ad29 100644
--- a/src/controllers/movies/movies.js
+++ b/src/controllers/movies/movies.js
@@ -1,6 +1,8 @@
 define(['loading', 'layoutManager', 'userSettings', 'events', 'libraryBrowser', 'alphaPicker', 'listView', 'cardBuilder', 'globalize', 'emby-itemscontainer'], function (loading, layoutManager, userSettings, events, libraryBrowser, AlphaPicker, listView, cardBuilder, globalize) {
     'use strict';
 
+    loading = loading.default || loading;
+
     return function (view, params, tabContent, options) {
         function onViewStyleChange() {
             if (self.getCurrentViewStyle() == 'List') {
diff --git a/src/controllers/movies/movietrailers.js b/src/controllers/movies/movietrailers.js
index a9db0abf49..51ed03ce81 100644
--- a/src/controllers/movies/movietrailers.js
+++ b/src/controllers/movies/movietrailers.js
@@ -1,6 +1,8 @@
 define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', 'alphaPicker', 'listView', 'cardBuilder', 'userSettings', 'globalize', 'emby-itemscontainer'], function (layoutManager, loading, events, libraryBrowser, imageLoader, AlphaPicker, listView, cardBuilder, userSettings, globalize) {
     'use strict';
 
+    loading = loading.default || loading;
+
     return function (view, params, tabContent) {
         function getPageData(context) {
             var key = getSavedQueryKey(context);
diff --git a/src/controllers/music/musicalbums.js b/src/controllers/music/musicalbums.js
index 3630e0b9f9..81dc3d8bb0 100644
--- a/src/controllers/music/musicalbums.js
+++ b/src/controllers/music/musicalbums.js
@@ -1,6 +1,8 @@
 define(['layoutManager', 'playbackManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', 'alphaPicker', 'listView', 'cardBuilder', 'userSettings', 'globalize', 'emby-itemscontainer'], function (layoutManager, playbackManager, loading, events, libraryBrowser, imageLoader, AlphaPicker, listView, cardBuilder, userSettings, globalize) {
     'use strict';
 
+    loading = loading.default || loading;
+
     return function (view, params, tabContent) {
         function playAll() {
             ApiClient.getItem(ApiClient.getCurrentUserId(), params.topParentId).then(function (item) {
diff --git a/src/controllers/music/musicartists.js b/src/controllers/music/musicartists.js
index c9a0b06b77..ab73c30db3 100644
--- a/src/controllers/music/musicartists.js
+++ b/src/controllers/music/musicartists.js
@@ -1,6 +1,8 @@
 define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', 'alphaPicker', 'listView', 'cardBuilder', 'apphost', 'userSettings', 'emby-itemscontainer'], function (layoutManager, loading, events, libraryBrowser, imageLoader, AlphaPicker, listView, cardBuilder, appHost, userSettings) {
     'use strict';
 
+    loading = loading.default || loading;
+
     return function (view, params, tabContent) {
         function getPageData(context) {
             var key = getSavedQueryKey(context);
diff --git a/src/controllers/music/musicgenres.js b/src/controllers/music/musicgenres.js
index 82f2eba574..39ca5a44bf 100644
--- a/src/controllers/music/musicgenres.js
+++ b/src/controllers/music/musicgenres.js
@@ -1,6 +1,8 @@
 define(['libraryBrowser', 'cardBuilder', 'apphost', 'imageLoader', 'loading'], function (libraryBrowser, cardBuilder, appHost, imageLoader, loading) {
     'use strict';
 
+    loading = loading.default || loading;
+
     return function (view, params, tabContent) {
         function getPageData() {
             var key = getSavedQueryKey();
diff --git a/src/controllers/music/musicplaylists.js b/src/controllers/music/musicplaylists.js
index f508489216..464d418229 100644
--- a/src/controllers/music/musicplaylists.js
+++ b/src/controllers/music/musicplaylists.js
@@ -1,6 +1,8 @@
 define(['libraryBrowser', 'cardBuilder', 'apphost', 'imageLoader', 'loading'], function (libraryBrowser, cardBuilder, appHost, imageLoader, loading) {
     'use strict';
 
+    loading = loading.default || loading;
+
     return function (view, params, tabContent) {
         function getPageData() {
             var key = getSavedQueryKey();
diff --git a/src/controllers/music/musicrecommended.js b/src/controllers/music/musicrecommended.js
index 0eecef0bfb..f1809623d4 100644
--- a/src/controllers/music/musicrecommended.js
+++ b/src/controllers/music/musicrecommended.js
@@ -1,6 +1,8 @@
 define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', 'cardBuilder', 'dom', 'apphost', 'imageLoader', 'libraryMenu', 'playbackManager', 'mainTabsManager', 'globalize', 'scrollStyles', 'emby-itemscontainer', 'emby-tabs', 'emby-button', 'flexStyles'], function (browser, layoutManager, userSettings, inputManager, loading, cardBuilder, dom, appHost, imageLoader, libraryMenu, playbackManager, mainTabsManager, globalize) {
     'use strict';
 
+    loading = loading.default || loading;
+
     function itemsPerRow() {
         var screenWidth = dom.getWindowSize().innerWidth;
 
diff --git a/src/controllers/music/songs.js b/src/controllers/music/songs.js
index aa63ec51fe..e82b81a5c7 100644
--- a/src/controllers/music/songs.js
+++ b/src/controllers/music/songs.js
@@ -1,6 +1,8 @@
 define(['events', 'libraryBrowser', 'imageLoader', 'listView', 'loading', 'userSettings', 'globalize', 'emby-itemscontainer'], function (events, libraryBrowser, imageLoader, listView, loading, userSettings, globalize) {
     'use strict';
 
+    loading = loading.default || loading;
+
     return function (view, params, tabContent) {
         function getPageData(context) {
             var key = getSavedQueryKey(context);
diff --git a/src/plugins/htmlVideoPlayer/plugin.js b/src/plugins/htmlVideoPlayer/plugin.js
index b3b2402c26..9e91723449 100644
--- a/src/plugins/htmlVideoPlayer/plugin.js
+++ b/src/plugins/htmlVideoPlayer/plugin.js
@@ -2,6 +2,8 @@
 define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackManager', 'appRouter', 'appSettings', 'connectionManager', 'htmlMediaHelper', 'itemHelper', 'screenfull', 'globalize'], function (browser, require, events, appHost, loading, dom, playbackManager, appRouter, appSettings, connectionManager, htmlMediaHelper, itemHelper, screenfull, globalize) {
     'use strict';
 
+    loading = loading.default || loading;
+
     function tryRemoveElement(elem) {
         var parentNode = elem.parentNode;
         if (parentNode) {
diff --git a/src/scripts/site.js b/src/scripts/site.js
index 2beb45959a..c53ed7e713 100644
--- a/src/scripts/site.js
+++ b/src/scripts/site.js
@@ -880,7 +880,7 @@ function initClient() {
                     });
                 }
             }
-
+            console.log(appRouter)
             appRouter.showLocalLogin = function (serverId, manualLogin) {
                 Dashboard.navigate('login.html?serverid=' + serverId);
             };