optimization imports from site.js

src/components/appRouter.js

@@ -272,7 +272,7 @@ class AppRouter {
         switch (result.State) {
             case 'SignedIn':
                 loading.hide();
-                Emby.Page.goHome();
+                this.goHome();
                 break;
             case 'ServerSignIn':
                 result.ApiClient.getPublicUsers().then((users) => {
@@ -535,7 +535,7 @@ class AppRouter {
 
             if (route.isDefaultRoute) {
                 console.debug('appRouter - loading skin home page');
-                Emby.Page.goHome();
+                this.goHome();
                 return;
             } else if (route.roles) {
                 this.validateRoles(apiClient, route.roles).then(() => {
@@ -836,3 +836,7 @@ class AppRouter {
 }
 
 export const appRouter = new AppRouter();
+
+window.Emby = window.Emby || {};
+
+window.Emby.Page = appRouter;

src/components/pluginManager.js

@@ -1,5 +1,6 @@
 import { Events } from 'jellyfin-apiclient';
 import globalize from '../scripts/globalize';
+
 /* eslint-disable indent */
 
     // TODO: replace with each plugin version

src/components/remotecontrol/remotecontrol.js

@@ -17,6 +17,7 @@ import './remotecontrol.css';
 import '../../elements/emby-ratingbutton/emby-ratingbutton';
 import ServerConnections from '../ServerConnections';
 import toast from '../toast/toast';
+import { appRouter } from "../appRouter";
 
 /*eslint prefer-const: "error"*/
 
@@ -599,7 +600,7 @@ export default function () {
 
         if (!state.NextMediaType) {
             updatePlayerState(player, dlg, {});
-            Emby.Page.back();
+            appRouter.back();
         }
     }
 

src/components/tabbedview/tabbedview.js

@@ -2,6 +2,7 @@ import backdrop from '../backdrop/backdrop';
 import * as mainTabsManager from '../maintabsmanager';
 import layoutManager from '../layoutManager';
 import '../../elements/emby-tabs/emby-tabs';
+import { appRouter } from '../appRouter';
 
 function onViewDestroy(e) {
     const tabControllers = this.tabControllers;
@@ -109,7 +110,7 @@ class TabbedView {
         }
     }
     setTitle() {
-        Emby.Page.setTitle('');
+        appRouter.setTitle('');
     }
 }
 

src/controllers/home.js

@@ -3,6 +3,7 @@ import globalize from '../scripts/globalize';
 import '../elements/emby-tabs/emby-tabs';
 import '../elements/emby-button/emby-button';
 import '../elements/emby-scroller/emby-scroller';
+import { appRouter } from '../components/appRouter';
 
 class HomeView extends TabbedView {
     constructor(view, params) {
@@ -10,7 +11,7 @@ class HomeView extends TabbedView {
     }
 
     setTitle() {
-        Emby.Page.setTitle(null);
+        appRouter.setTitle(null);
     }
 
     onPause() {

src/controllers/itemDetails/index.js

@@ -568,7 +568,7 @@ function renderDetailPageBackdrop(page, item, apiClient) {
 function reloadFromItem(instance, page, params, item, user) {
     const apiClient = ServerConnections.getApiClient(item.ServerId);
 
-    Emby.Page.setTitle('');
+    appRouter.setTitle('');
 
     // Start rendering the artwork first
     renderImage(page, item);
@@ -2046,7 +2046,7 @@ export default function (view, params) {
 
         if (e.detail.isRestored) {
             if (currentItem) {
-                Emby.Page.setTitle('');
+                appRouter.setTitle('');
                 renderTrackSelections(page, self, currentItem, true);
             }
         } else {

src/controllers/list.js

@@ -11,6 +11,7 @@ import AlphaPicker from '../components/alphaPicker/alphaPicker';
 import '../elements/emby-itemscontainer/emby-itemscontainer';
 import '../elements/emby-scroller/emby-scroller';
 import ServerConnections from '../components/ServerConnections';
+import { appRouter } from '../components/appRouter';
 
 /* eslint-disable indent */
 
@@ -573,7 +574,7 @@ class ItemsView {
         }
 
         function setTitle(item) {
-            Emby.Page.setTitle(getTitle(item) || '');
+            appRouter.setTitle(getTitle(item) || '');
 
             if (item && item.CollectionType === 'playlists') {
                 hideOrShowAll(view.querySelectorAll('.btnNewItem'), false);

src/controllers/playback/video/index.js

@@ -20,6 +20,7 @@ import '../../../assets/css/videoosd.css';
 import ServerConnections from '../../../components/ServerConnections';
 import shell from '../../../scripts/shell';
 import SubtitleSync from '../../../components/subtitlesync/subtitlesync';
+import { appRouter } from '../../../components/appRouter';
 
 /* eslint-disable indent */
 
@@ -193,7 +194,7 @@ import SubtitleSync from '../../../components/subtitlesync/subtitlesync';
             currentItem = item;
             if (!item) {
                 updateRecordingButton(null);
-                Emby.Page.setTitle('');
+                appRouter.setTitle('');
                 nowPlayingVolumeSlider.disabled = true;
                 nowPlayingPositionSlider.disabled = true;
                 btnFastForward.disabled = true;
@@ -241,7 +242,7 @@ import SubtitleSync from '../../../components/subtitlesync/subtitlesync';
                 itemName = parentName || '';
             }
 
-            Emby.Page.setTitle(itemName);
+            appRouter.setTitle(itemName);
 
             const documentTitle = parentName || (item ? item.Name : null);
 
@@ -513,7 +514,7 @@ import SubtitleSync from '../../../components/subtitlesync/subtitlesync';
 
             if (state.NextMediaType !== 'Video') {
                 view.removeEventListener('viewbeforehide', onViewHideStopPlayback);
-                Emby.Page.back();
+                appRouter.back();
             }
         }
 
@@ -1292,7 +1293,7 @@ import SubtitleSync from '../../../components/subtitlesync/subtitlesync';
 
         view.addEventListener('viewbeforeshow', function (e) {
             headerElement.classList.add('osdHeader');
-            Emby.Page.setTransparency('full');
+            appRouter.setTransparency('full');
         });
         view.addEventListener('viewshow', function (e) {
             try {

src/scripts/clientUtils.js

@@ -5,6 +5,7 @@ import loading from '../components/loading/loading';
 import { appRouter } from '../components/appRouter';
 import baseAlert from '../components/alert';
 import baseConfirm from '../components/confirm/confirm';
+import globalize from '../scripts/globalize';
 
 export function getCurrentUser() {
     return window.ApiClient.getCurrentUser(false);
@@ -88,12 +89,12 @@ export function navigate(url, preserveQueryString) {
 
 export function processPluginConfigurationUpdateResult() {
     loading.hide();
-    toast(Globalize.translate('MessageSettingsSaved'));
+    toast(globalize.translate('MessageSettingsSaved'));
 }
 
 export function processServerConfigurationUpdateResult(result) {
     loading.hide();
-    toast.default(Globalize.translate('MessageSettingsSaved'));
+    toast.default(globalize.translate('MessageSettingsSaved'));
 }
 
 export function processErrorResponse(response) {
@@ -118,7 +119,7 @@ export function alert(options) {
         });
     } else {
         baseAlert.default({
-            title: options.title || Globalize.translate('HeaderAlert'),
+            title: options.title || globalize.translate('HeaderAlert'),
             text: options.message
         }).then(options.callback || function () {});
     }

src/scripts/routes.js

@@ -11,6 +11,7 @@ import '../assets/css/livetv.css';
 import '../components/listview/listview.css';
 import '../assets/css/dashboard.css';
 import '../assets/css/detailtable.css';
+import { appRouter } from '../components/appRouter';
 
 /* eslint-disable indent */
 
@@ -20,7 +21,7 @@ import '../assets/css/detailtable.css';
         const path = newRoute.alias ? newRoute.alias : newRoute.path;
         console.debug('defining route: ' + path);
         newRoute.dictionary = 'core';
-        Emby.Page.addRoute(path, newRoute);
+        appRouter.addRoute(path, newRoute);
     }
 
     defineRoute({

src/scripts/site.js

@@ -11,6 +11,16 @@ import '../assets/css/site.css';
 import AppInfo from '../components/AppInfo';
 import { Events } from 'jellyfin-apiclient';
 import ServerConnections from '../components/ServerConnections';
+import globalize from './globalize';
+import browser from './browser';
+import keyboardNavigation from './keyboardNavigation';
+import './mouseManager';
+import autoFocuser from '../components/autoFocuser';
+import { appHost } from '../components/apphost';
+import { getPlugins } from './settings/webSettings';
+import { pluginManager } from '../components/pluginManager';
+import packageManager from '../components/packageManager';
+import { appRouter } from '../components/appRouter';
 
 // TODO: Move this elsewhere
 window.getWindowLocationSearch = function(win) {
@@ -69,238 +79,193 @@ if (self.appMode === 'cordova' || self.appMode === 'android' || self.appMode ===
 
 Object.freeze(AppInfo);
 
-function initClient() {
+function loadCoreDictionary() {
-    function init() {
+    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', 'ja', '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'];
-        ServerConnections.initApiClient();
+    const translations = languages.map(function (language) {
-
+        return {
-        console.debug('initAfterDependencies promises resolved');
+            lang: language,
-
+            path: language + '.json'
-        Promise.all([
+        };
-            import('./globalize'),
+    });
-            import('./browser')
+    globalize.defaultModule('core');
-        ])
+    return globalize.loadStrings({
-            .then(([globalize, browser]) => {
+        name: 'core',
-                window.Globalize = globalize;
+        translations: translations
-                loadCoreDictionary(globalize).then(function () {
+    });
-                    onGlobalizeInit(browser, globalize);
-                });
-            });
-        import('./keyboardNavigation')
-            .then((keyboardnavigation) => {
-                keyboardnavigation.enable();
-            });
-        import('./mouseManager');
-        import('../components/autoFocuser').then((autoFocuser) => {
-            autoFocuser.enable();
-        });
-        Promise.all([
-            import('./globalize'),
-            import('jellyfin-apiclient')
-        ])
-            .then(([ globalize, { ConnectionManager } ]) => {
-                Events.on(ConnectionManager, 'localusersignedin', globalize.updateCurrentCulture);
-            });
-    }
-
-    function loadCoreDictionary(globalize) {
-        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', 'ja', '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: language + '.json'
-            };
-        });
-        globalize.defaultModule('core');
-        return globalize.loadStrings({
-            name: 'core',
-            translations: translations
-        });
-    }
-
-    function onGlobalizeInit(browser, globalize) {
-        if (window.appMode === 'android') {
-            if (window.location.href.toString().toLowerCase().indexOf('start=backgroundsync') !== -1) {
-                return onAppReady(browser);
-            }
-        }
-
-        document.title = globalize.translateHtml(document.title, 'core');
-
-        if (browser.tv && !browser.android) {
-            console.debug('using system fonts with explicit sizes');
-            import('../assets/css/fonts.sized.css');
-        } else {
-            console.debug('using default fonts');
-            import('../assets/css/fonts.css');
-        }
-
-        import('../assets/css/librarybrowser.css');
-        import('../components/apphost')
-            .then(({ appHost }) => {
-                loadPlugins(appHost, browser).then(function () {
-                    onAppReady(browser);
-                });
-            });
-    }
-
-    function loadPlugins(appHost, browser, shell) {
-        console.groupCollapsed('loading installed plugins');
-        return new Promise(function (resolve, reject) {
-            Promise.all([
-                import('./settings/webSettings'),
-                import('../components/pluginManager')
-            ])
-                .then(([webSettings, { pluginManager: pluginManager }]) => {
-                    console.dir(pluginManager);
-                    webSettings.getPlugins().then(function (list) {
-                        // these two plugins are dependent on features
-                        if (!appHost.supports('remotecontrol')) {
-                            list.splice(list.indexOf('sessionPlayer'), 1);
-
-                            if (!browser.chrome && !browser.opera) {
-                                list.splice(list.indexOf('chromecastPlayer', 1));
-                            }
-                        }
-
-                        // add any native plugins
-                        if (window.NativeShell) {
-                            list = list.concat(window.NativeShell.getPlugins());
-                        }
-
-                        Promise.all(list.map((plugin) => {
-                            return pluginManager.loadPlugin(import(/* webpackChunkName: "[request]" */ `../plugins/${plugin}`));
-                        }))
-                            .then(function (pluginPromises) {
-                                console.debug('finished loading plugins');
-                            })
-                            .catch(() => reject)
-                            .finally(() => {
-                                console.groupEnd('loading installed plugins');
-                                import('../components/packageManager')
-                                    .then(({ default: packageManager }) => {
-                                        packageManager.init().then(resolve, reject);
-                                    });
-                            })
-                        ;
-                    });
-                });
-        });
-    }
-
-    function onAppReady(browser) {
-        console.debug('begin onAppReady');
-
-        // ensure that appHost is loaded in this point
-        Promise.all([
-            import('../components/apphost'),
-            import('../components/appRouter')
-        ])
-            .then(([{ appHost }, { appRouter }]) => {
-                window.Emby = {};
-
-                console.debug('onAppReady: loading dependencies');
-                if (browser.iOS) {
-                    import('../assets/css/ios.css');
-                }
-
-                window.Emby.Page = appRouter;
-
-                Promise.all([
-                    import('../elements/emby-button/emby-button'),
-                    import('./autoThemes'),
-                    import('./libraryMenu'),
-                    import('./routes')
-                ])
-                    .then(() => {
-                        Emby.Page.start({
-                            click: false,
-                            hashbang: true
-                        });
-
-                        import('../components/themeMediaPlayer');
-                        import('./autoBackdrops');
-
-                        if (!browser.tv && !browser.xboxOne && !browser.ps4) {
-                            import('../components/nowPlayingBar/nowPlayingBar');
-                        }
-
-                        if (appHost.supports('remotecontrol')) {
-                            import('../components/playback/playerSelectionMenu');
-                            import('../components/playback/remotecontrolautoplay');
-                        }
-
-                        import('../libraries/screensavermanager');
-
-                        if (!appHost.supports('physicalvolumecontrol') || browser.touch) {
-                            import('../components/playback/volumeosd');
-                        }
-
-                        /* eslint-disable-next-line compat/compat */
-                        if (navigator.mediaSession || window.NativeShell) {
-                            import('../components/playback/mediasession');
-                        }
-
-                        import('./serverNotifications');
-
-                        if (!browser.tv && !browser.xboxOne) {
-                            import('../components/playback/playbackorientation');
-                            registerServiceWorker();
-
-                            if (window.Notification) {
-                                import('../components/notifications/notifications');
-                            }
-                        }
-
-                        import('../components/playback/playerSelectionMenu');
-
-                        const apiClient = ServerConnections.currentApiClient();
-                        if (apiClient) {
-                            fetch(apiClient.getUrl('Branding/Css'))
-                                .then(function(response) {
-                                    if (!response.ok) {
-                                        throw new Error(response.status + ' ' + response.statusText);
-                                    }
-                                    return response.text();
-                                })
-                                .then(function(css) {
-                                    let style = document.querySelector('#cssBranding');
-                                    if (!style) {
-                                        // Inject the branding css as a dom element in body so it will take
-                                        // precedence over other stylesheets
-                                        style = document.createElement('style');
-                                        style.id = 'cssBranding';
-                                        document.body.appendChild(style);
-                                    }
-                                    style.textContent = css;
-                                })
-                                .catch(function(err) {
-                                    console.warn('Error applying custom css', err);
-                                });
-                        }
-                    });
-            });
-    }
-
-    function registerServiceWorker() {
-        /* eslint-disable compat/compat */
-        if (navigator.serviceWorker && window.appMode !== 'cordova' && window.appMode !== 'android') {
-            try {
-                navigator.serviceWorker.register('serviceworker.js');
-            } catch (err) {
-                console.error('error registering serviceWorker: ' + err);
-            }
-        } else {
-            console.warn('serviceWorker unsupported');
-        }
-        /* eslint-enable compat/compat */
-    }
-
-    //var localApiClient;
-
-    init();
 }
 
-initClient();
+function init() {
+    ServerConnections.initApiClient();
+
+    console.debug('initAfterDependencies promises resolved');
+
+    loadCoreDictionary().then(function () {
+        onGlobalizeInit();
+    });
+
+    keyboardNavigation.enable();
+    autoFocuser.enable();
+
+    Events.on(ServerConnections, 'localusersignedin', globalize.updateCurrentCulture);
+}
+
+function onGlobalizeInit() {
+    if (window.appMode === 'android') {
+        if (window.location.href.toString().toLowerCase().indexOf('start=backgroundsync') !== -1) {
+            return onAppReady(browser);
+        }
+    }
+
+    document.title = globalize.translateHtml(document.title, 'core');
+
+    if (browser.tv && !browser.android) {
+        console.debug('using system fonts with explicit sizes');
+        import('../assets/css/fonts.sized.css');
+    } else {
+        console.debug('using default fonts');
+        import('../assets/css/fonts.css');
+    }
+
+    import('../assets/css/librarybrowser.css');
+
+    loadPlugins(appHost, browser).then(function () {
+        onAppReady(browser);
+    });
+}
+
+function loadPlugins(appHost, browser, shell) {
+    console.groupCollapsed('loading installed plugins');
+    console.dir(pluginManager);
+    return getPlugins().then(function (list) {
+        // these two plugins are dependent on features
+        if (!appHost.supports('remotecontrol')) {
+            list.splice(list.indexOf('sessionPlayer'), 1);
+
+            if (!browser.chrome && !browser.opera) {
+                list.splice(list.indexOf('chromecastPlayer', 1));
+            }
+        }
+
+        // add any native plugins
+        if (window.NativeShell) {
+            list = list.concat(window.NativeShell.getPlugins());
+        }
+
+        Promise.all(list.map((plugin) => {
+            return pluginManager.loadPlugin(import(/* webpackChunkName: "[request]" */ `../plugins/${plugin}`));
+        }))
+            .then(function (pluginPromises) {
+                console.debug('finished loading plugins');
+            })
+            .catch(() => console.debug('failed loading plugins')
+            )
+            .finally(() => {
+                console.groupEnd('loading installed plugins');
+                packageManager.init();
+            })
+        ;
+    });
+}
+
+function onAppReady(browser) {
+    console.debug('begin onAppReady');
+
+    console.debug('onAppReady: loading dependencies');
+
+    if (browser.iOS) {
+        import('../assets/css/ios.css');
+    }
+
+    Promise.all([
+        import('../elements/emby-button/emby-button'),
+        import('./autoThemes'),
+        import('./libraryMenu'),
+        import('./routes')
+    ])
+        .then(() => {
+            appRouter.start({
+                click: false,
+                hashbang: true
+            });
+
+            import('../components/themeMediaPlayer');
+            import('./autoBackdrops');
+
+            if (!browser.tv && !browser.xboxOne && !browser.ps4) {
+                import('../components/nowPlayingBar/nowPlayingBar');
+            }
+
+            if (appHost.supports('remotecontrol')) {
+                import('../components/playback/playerSelectionMenu');
+                import('../components/playback/remotecontrolautoplay');
+            }
+
+            import('../libraries/screensavermanager');
+
+            if (!appHost.supports('physicalvolumecontrol') || browser.touch) {
+                import('../components/playback/volumeosd');
+            }
+
+            /* eslint-disable-next-line compat/compat */
+            if (navigator.mediaSession || window.NativeShell) {
+                import('../components/playback/mediasession');
+            }
+
+            import('./serverNotifications');
+
+            if (!browser.tv && !browser.xboxOne) {
+                import('../components/playback/playbackorientation');
+                registerServiceWorker();
+
+                if (window.Notification) {
+                    import('../components/notifications/notifications');
+                }
+            }
+
+            import('../components/playback/playerSelectionMenu');
+
+            const apiClient = ServerConnections.currentApiClient();
+            if (apiClient) {
+                fetch(apiClient.getUrl('Branding/Css'))
+                    .then(function(response) {
+                        if (!response.ok) {
+                            throw new Error(response.status + ' ' + response.statusText);
+                        }
+                        return response.text();
+                    })
+                    .then(function(css) {
+                        let style = document.querySelector('#cssBranding');
+                        if (!style) {
+                            // Inject the branding css as a dom element in body so it will take
+                            // precedence over other stylesheets
+                            style = document.createElement('style');
+                            style.id = 'cssBranding';
+                            document.body.appendChild(style);
+                        }
+                        style.textContent = css;
+                    })
+                    .catch(function(err) {
+                        console.warn('Error applying custom css', err);
+                    });
+            }
+        });
+}
+
+function registerServiceWorker() {
+    /* eslint-disable compat/compat */
+    if (navigator.serviceWorker && window.appMode !== 'cordova' && window.appMode !== 'android') {
+        try {
+            navigator.serviceWorker.register('serviceworker.js');
+        } catch (err) {
+            console.error('error registering serviceWorker: ' + err);
+        }
+    } else {
+        console.warn('serviceWorker unsupported');
+    }
+    /* eslint-enable compat/compat */
+}
+
+init();
 
 pageClassOn('viewshow', 'standalonePage', function () {
     document.querySelector('.skinHeader').classList.add('noHeaderRight');