From 8b5772f996c48e031fbb259697f986d95380a8a8 Mon Sep 17 00:00:00 2001 From: vitorsemeano Date: Sun, 18 Oct 2020 20:00:39 +0100 Subject: [PATCH] optimization imports from site.js --- src/components/appRouter.js | 8 +- src/components/pluginManager.js | 1 + src/components/remotecontrol/remotecontrol.js | 3 +- src/components/tabbedview/tabbedview.js | 3 +- src/controllers/home.js | 3 +- src/controllers/itemDetails/index.js | 4 +- src/controllers/list.js | 3 +- src/controllers/playback/video/index.js | 9 +- src/scripts/clientUtils.js | 7 +- src/scripts/routes.js | 3 +- src/scripts/site.js | 425 ++++++++---------- 11 files changed, 223 insertions(+), 246 deletions(-) diff --git a/src/components/appRouter.js b/src/components/appRouter.js index 3215cbde3..b20b91f60 100644 --- a/src/components/appRouter.js +++ b/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; diff --git a/src/components/pluginManager.js b/src/components/pluginManager.js index 9be985dd8..5fef19cce 100644 --- a/src/components/pluginManager.js +++ b/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 diff --git a/src/components/remotecontrol/remotecontrol.js b/src/components/remotecontrol/remotecontrol.js index 04fd60894..9b49acb42 100644 --- a/src/components/remotecontrol/remotecontrol.js +++ b/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(); } } diff --git a/src/components/tabbedview/tabbedview.js b/src/components/tabbedview/tabbedview.js index 655ca1ace..efc9fb37c 100644 --- a/src/components/tabbedview/tabbedview.js +++ b/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(''); } } diff --git a/src/controllers/home.js b/src/controllers/home.js index ed447cac8..4ebaa62ad 100644 --- a/src/controllers/home.js +++ b/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() { diff --git a/src/controllers/itemDetails/index.js b/src/controllers/itemDetails/index.js index ba0101d6c..48447a7b4 100644 --- a/src/controllers/itemDetails/index.js +++ b/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 { diff --git a/src/controllers/list.js b/src/controllers/list.js index 086ddb2a5..22e8f0762 100644 --- a/src/controllers/list.js +++ b/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); diff --git a/src/controllers/playback/video/index.js b/src/controllers/playback/video/index.js index 263d6349e..ca5867613 100644 --- a/src/controllers/playback/video/index.js +++ b/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 { diff --git a/src/scripts/clientUtils.js b/src/scripts/clientUtils.js index 93633fd4b..970694392 100644 --- a/src/scripts/clientUtils.js +++ b/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 () {}); } diff --git a/src/scripts/routes.js b/src/scripts/routes.js index f5933ccd3..e31843466 100644 --- a/src/scripts/routes.js +++ b/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({ diff --git a/src/scripts/site.js b/src/scripts/site.js index 963b5e57a..abaece67e 100644 --- a/src/scripts/site.js +++ b/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 init() { - ServerConnections.initApiClient(); - - console.debug('initAfterDependencies promises resolved'); - - Promise.all([ - import('./globalize'), - import('./browser') - ]) - .then(([globalize, browser]) => { - window.Globalize = globalize; - 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(); +function loadCoreDictionary() { + 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 + }); } -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');