diff --git a/package.json b/package.json index e013bdc917..22fd43308a 100644 --- a/package.json +++ b/package.json @@ -166,6 +166,7 @@ "src/components/syncPlay/playbackPermissionManager.js", "src/components/syncPlay/syncPlayManager.js", "src/components/syncPlay/timeSyncManager.js", + "src/components/viewContainer.js", "src/controllers/session/addServer/index.js", "src/controllers/session/forgotPassword/index.js", "src/controllers/session/redeemPassword/index.js", @@ -269,8 +270,10 @@ "src/scripts/inputManager.js", "src/scripts/keyboardNavigation.js", "src/scripts/libraryBrowser.js", + "src/scripts/mouseManager.js", "src/scripts/multiDownload.js", "src/scripts/playlists.js", + "src/scripts/routes.js", "src/scripts/settings/appSettings.js", "src/scripts/settings/userSettings.js", "src/scripts/settings/webSettings.js", diff --git a/src/components/images/imageLoader.js b/src/components/images/imageLoader.js index c9d3e6fdb2..0effcc7a57 100644 --- a/src/components/images/imageLoader.js +++ b/src/components/images/imageLoader.js @@ -205,7 +205,7 @@ import 'css!./style'; /* eslint-enable indent */ export default { - serLazyImage: setLazyImage, + setLazyImage: setLazyImage, fillImages: fillImages, fillImage: fillImage, lazyImage: lazyImage, diff --git a/src/components/viewContainer.js b/src/components/viewContainer.js index d1b0df6fbb..4e11ebc7ba 100644 --- a/src/components/viewContainer.js +++ b/src/components/viewContainer.js @@ -1,12 +1,12 @@ -define(['browser', 'dom', 'layoutManager', 'css!components/viewManager/viewContainer'], function (browser, dom, layoutManager) { - 'use strict'; +import 'css!components/viewManager/viewContainer'; +/* eslint-disable indent */ function setControllerClass(view, options) { if (options.controllerFactory) { return Promise.resolve(); } - var controllerUrl = view.getAttribute('data-controller'); + let controllerUrl = view.getAttribute('data-controller'); if (controllerUrl) { if (controllerUrl.indexOf('__plugin/') === 0) { @@ -14,7 +14,7 @@ define(['browser', 'dom', 'layoutManager', 'css!components/viewManager/viewConta } controllerUrl = Dashboard.getConfigurationResourceUrl(controllerUrl); - return getRequirePromise([controllerUrl]).then(function (ControllerFactory) { + return import(controllerUrl).then((ControllerFactory) => { options.controllerFactory = ControllerFactory; }); } @@ -22,94 +22,85 @@ define(['browser', 'dom', 'layoutManager', 'css!components/viewManager/viewConta return Promise.resolve(); } - function getRequirePromise(deps) { - return new Promise(function (resolve, reject) { - require(deps, resolve); - }); - } - - function loadView(options) { + export function loadView(options) { if (!options.cancel) { - var selected = selectedPageIndex; - var previousAnimatable = selected === -1 ? null : allPages[selected]; - var pageIndex = selected + 1; + const selected = selectedPageIndex; + const previousAnimatable = selected === -1 ? null : allPages[selected]; + let pageIndex = selected + 1; if (pageIndex >= pageContainerCount) { pageIndex = 0; } - var isPluginpage = options.url.toLowerCase().indexOf('/configurationpage') !== -1; - var newViewInfo = normalizeNewView(options, isPluginpage); - var newView = newViewInfo.elem; - var modulesToLoad = []; + const isPluginpage = options.url.toLowerCase().indexOf('/configurationpage') !== -1; + const newViewInfo = normalizeNewView(options, isPluginpage); + const newView = newViewInfo.elem; - return new Promise(function (resolve) { - require(modulesToLoad, function () { - var currentPage = allPages[pageIndex]; + return new Promise((resolve) => { + const currentPage = allPages[pageIndex]; - if (currentPage) { - triggerDestroy(currentPage); - } + if (currentPage) { + triggerDestroy(currentPage); + } - var view = newView; + let view = newView; - if (typeof view == 'string') { - view = document.createElement('div'); - view.innerHTML = newView; - } + if (typeof view == 'string') { + view = document.createElement('div'); + view.innerHTML = newView; + } - view.classList.add('mainAnimatedPage'); + view.classList.add('mainAnimatedPage'); - if (currentPage) { - if (newViewInfo.hasScript && window.$) { - view = $(view).appendTo(mainAnimatedPages)[0]; - mainAnimatedPages.removeChild(currentPage); - } else { - mainAnimatedPages.replaceChild(view, currentPage); - } + if (currentPage) { + if (newViewInfo.hasScript && window.$) { + view = $(view).appendTo(mainAnimatedPages)[0]; + mainAnimatedPages.removeChild(currentPage); } else { - if (newViewInfo.hasScript && window.$) { - view = $(view).appendTo(mainAnimatedPages)[0]; - } else { - mainAnimatedPages.appendChild(view); - } + mainAnimatedPages.replaceChild(view, currentPage); + } + } else { + if (newViewInfo.hasScript && window.$) { + view = $(view).appendTo(mainAnimatedPages)[0]; + } else { + mainAnimatedPages.appendChild(view); + } + } + + if (options.type) { + view.setAttribute('data-type', options.type); + } + + const properties = []; + + if (options.fullscreen) { + properties.push('fullscreen'); + } + + if (properties.length) { + view.setAttribute('data-properties', properties.join(',')); + } + + allPages[pageIndex] = view; + setControllerClass(view, options).then(() => { + if (onBeforeChange) { + onBeforeChange(view, false, options); } - if (options.type) { - view.setAttribute('data-type', options.type); + beforeAnimate(allPages, pageIndex, selected); + selectedPageIndex = pageIndex; + currentUrls[pageIndex] = options.url; + + if (!options.cancel && previousAnimatable) { + afterAnimate(allPages, pageIndex); } - var properties = []; - - if (options.fullscreen) { - properties.push('fullscreen'); + if (window.$) { + $.mobile = $.mobile || {}; + $.mobile.activePage = view; } - if (properties.length) { - view.setAttribute('data-properties', properties.join(',')); - } - - allPages[pageIndex] = view; - setControllerClass(view, options).then(function () { - if (onBeforeChange) { - onBeforeChange(view, false, options); - } - - beforeAnimate(allPages, pageIndex, selected); - selectedPageIndex = pageIndex; - currentUrls[pageIndex] = options.url; - - if (!options.cancel && previousAnimatable) { - afterAnimate(allPages, pageIndex); - } - - if (window.$) { - $.mobile = $.mobile || {}; - $.mobile.activePage = view; - } - - resolve(view); - }); + resolve(view); }); }); } @@ -125,28 +116,28 @@ define(['browser', 'dom', 'layoutManager', 'css!components/viewManager/viewConta html = replaceAll(html, '<\/script>--\x3e', '<\/script>'); } - var wrapper = document.createElement('div'); + const wrapper = document.createElement('div'); wrapper.innerHTML = html; return wrapper.querySelector('div[data-role="page"]'); } function normalizeNewView(options, isPluginpage) { - var viewHtml = options.view; + const viewHtml = options.view; if (viewHtml.indexOf('data-role="page"') === -1) { return viewHtml; } - var hasScript = viewHtml.indexOf(' { if (onBeforeChange) { onBeforeChange(view, true, options); } @@ -228,25 +219,28 @@ define(['browser', 'dom', 'layoutManager', 'css!components/viewManager/viewConta view.dispatchEvent(new CustomEvent('viewdestroy', {})); } - function reset() { + export function reset() { allPages = []; currentUrls = []; mainAnimatedPages.innerHTML = ''; selectedPageIndex = -1; } - var onBeforeChange; - var mainAnimatedPages = document.querySelector('.mainAnimatedPages'); - var allPages = []; - var currentUrls = []; - var pageContainerCount = 3; - var selectedPageIndex = -1; + let onBeforeChange; + const mainAnimatedPages = document.querySelector('.mainAnimatedPages'); + let allPages = []; + let currentUrls = []; + const pageContainerCount = 3; + let selectedPageIndex = -1; reset(); mainAnimatedPages.classList.remove('hide'); - return { - loadView: loadView, - tryRestoreView: tryRestoreView, - reset: reset, - setOnBeforeChange: setOnBeforeChange - }; -}); + +/* eslint-enable indent */ + +export default { + loadView: loadView, + tryRestoreView: tryRestoreView, + reset: reset, + setOnBeforeChange: setOnBeforeChange +}; + diff --git a/src/scripts/mouseManager.js b/src/scripts/mouseManager.js index 45ac36fe36..40253fb91c 100644 --- a/src/scripts/mouseManager.js +++ b/src/scripts/mouseManager.js @@ -1,12 +1,15 @@ -define(['inputManager', 'focusManager', 'browser', 'layoutManager', 'events', 'dom'], function (inputManager, focusManager, browser, layoutManager, events, dom) { - 'use strict'; +import inputManager from 'inputManager'; +import focusManager from 'focusManager'; +import browser from 'browser'; +import layoutManager from 'layoutManager'; +import events from 'events'; +import dom from 'dom'; +/* eslint-disable indent */ - browser = browser.default || browser; + const self = {}; - var self = {}; - - var lastMouseInputTime = new Date().getTime(); - var isMouseIdle; + let lastMouseInputTime = new Date().getTime(); + let isMouseIdle; function mouseIdleTime() { return new Date().getTime() - lastMouseInputTime; @@ -17,14 +20,14 @@ define(['inputManager', 'focusManager', 'browser', 'layoutManager', 'events', 'd } function removeIdleClasses() { - var classList = document.body.classList; + const classList = document.body.classList; classList.remove('mouseIdle'); classList.remove('mouseIdle-tv'); } function addIdleClasses() { - var classList = document.body.classList; + const classList = document.body.classList; classList.add('mouseIdle'); @@ -33,7 +36,7 @@ define(['inputManager', 'focusManager', 'browser', 'layoutManager', 'events', 'd } } - function showCursor() { + export function showCursor() { if (isMouseIdle) { isMouseIdle = false; removeIdleClasses(); @@ -41,7 +44,7 @@ define(['inputManager', 'focusManager', 'browser', 'layoutManager', 'events', 'd } } - function hideCursor() { + export function hideCursor() { if (!isMouseIdle) { isMouseIdle = true; addIdleClasses(); @@ -49,17 +52,17 @@ define(['inputManager', 'focusManager', 'browser', 'layoutManager', 'events', 'd } } - var lastPointerMoveData; + let lastPointerMoveData; function onPointerMove(e) { - var eventX = e.screenX; - var eventY = e.screenY; + const eventX = e.screenX; + const eventY = e.screenY; // if coord don't exist how could it move if (typeof eventX === 'undefined' && typeof eventY === 'undefined') { return; } - var obj = lastPointerMoveData; + const obj = lastPointerMoveData; if (!obj) { lastPointerMoveData = { x: eventX, @@ -83,11 +86,11 @@ define(['inputManager', 'focusManager', 'browser', 'layoutManager', 'events', 'd } function onPointerEnter(e) { - var pointerType = e.pointerType || (layoutManager.mobile ? 'touch' : 'mouse'); + const pointerType = e.pointerType || (layoutManager.mobile ? 'touch' : 'mouse'); if (pointerType === 'mouse') { if (!isMouseIdle) { - var parent = focusManager.focusableParent(e.target); + const parent = focusManager.focusableParent(e.target); if (parent) { focusManager.focus(parent); } @@ -117,7 +120,7 @@ define(['inputManager', 'focusManager', 'browser', 'layoutManager', 'events', 'd } } - var mouseInterval; + let mouseInterval; function startMouseInterval() { if (!mouseInterval) { mouseInterval = setInterval(onMouseInterval, 5000); @@ -125,7 +128,7 @@ define(['inputManager', 'focusManager', 'browser', 'layoutManager', 'events', 'd } function stopMouseInterval() { - var interval = mouseInterval; + const interval = mouseInterval; if (interval) { clearInterval(interval); @@ -169,8 +172,10 @@ define(['inputManager', 'focusManager', 'browser', 'layoutManager', 'events', 'd events.on(layoutManager, 'modechange', initMouse); - self.hideCursor = hideCursor; - self.showCursor = showCursor; +/* eslint-enable indent */ + +export default { + hideCursor, + showCursor +}; - return self; -}); diff --git a/src/scripts/routes.js b/src/scripts/routes.js index 1d735e3018..4094a2552f 100644 --- a/src/scripts/routes.js +++ b/src/scripts/routes.js @@ -1,18 +1,21 @@ -define([ - 'jQuery', - 'emby-button', - 'emby-input', - 'scripts/livetvcomponents', - 'paper-icon-button-light', - 'emby-itemscontainer', - 'emby-collapse', - 'emby-select', - 'livetvcss', - 'emby-checkbox', - 'emby-slider', - 'listViewStyle', - 'dashboardcss', - 'detailtablecss'], function () { +import 'emby-button'; +import 'emby-input'; +import 'scripts/livetvcomponents'; +import 'paper-icon-button-light'; +import 'emby-itemscontainer'; +import 'emby-collapse'; +import 'emby-select'; +import 'livetvcss'; +import 'emby-checkbox'; +import 'emby-slider'; +import 'listViewStyle'; +import 'dashboardcss'; +import 'detailtablecss'; + +/* eslint-disable indent */ + + console.groupCollapsed('defining core routes'); + function defineRoute(newRoute) { var path = newRoute.alias ? newRoute.alias : newRoute.path; console.debug('defining route: ' + path); @@ -20,8 +23,6 @@ define([ Emby.Page.addRoute(path, newRoute); } - console.debug('defining core routes'); - defineRoute({ alias: '/addserver.html', path: '/controllers/session/addServer/index.html', @@ -30,6 +31,7 @@ define([ startup: true, controller: 'session/addServer/index' }); + defineRoute({ alias: '/selectserver.html', path: '/controllers/session/selectServer/index.html', @@ -39,6 +41,7 @@ define([ controller: 'session/selectServer/index', type: 'selectserver' }); + defineRoute({ alias: '/login.html', path: '/controllers/session/login/index.html', @@ -48,6 +51,7 @@ define([ controller: 'session/login/index', type: 'login' }); + defineRoute({ alias: '/forgotpassword.html', path: '/controllers/session/forgotPassword/index.html', @@ -55,6 +59,7 @@ define([ startup: true, controller: 'session/forgotPassword/index' }); + defineRoute({ alias: '/forgotpasswordpin.html', path: '/controllers/session/redeemPassword/index.html', @@ -68,42 +73,41 @@ define([ alias: '/mypreferencesmenu.html', path: '/controllers/user/menu/index.html', autoFocus: false, - transition: 'fade', controller: 'user/menu/index' }); + defineRoute({ alias: '/myprofile.html', path: '/controllers/user/profile/index.html', autoFocus: false, - transition: 'fade', controller: 'user/profile/index' }); + defineRoute({ alias: '/mypreferencesdisplay.html', path: '/controllers/user/display/index.html', autoFocus: false, - transition: 'fade', controller: 'user/display/index' }); + defineRoute({ alias: '/mypreferenceshome.html', path: '/controllers/user/home/index.html', autoFocus: false, - transition: 'fade', controller: 'user/home/index' }); + defineRoute({ alias: '/mypreferencesplayback.html', path: '/controllers/user/playback/index.html', autoFocus: false, - transition: 'fade', controller: 'user/playback/index' }); + defineRoute({ alias: '/mypreferencessubtitles.html', path: '/controllers/user/subtitles/index.html', autoFocus: false, - transition: 'fade', controller: 'user/subtitles/index' }); @@ -113,42 +117,49 @@ define([ roles: 'admin', controller: 'dashboard/dashboard' }); + defineRoute({ path: '/dashboardgeneral.html', controller: 'dashboard/general', autoFocus: false, roles: 'admin' }); + defineRoute({ path: '/networking.html', autoFocus: false, roles: 'admin', controller: 'dashboard/networking' }); + defineRoute({ path: '/devices.html', autoFocus: false, roles: 'admin', controller: 'dashboard/devices/devices' }); + defineRoute({ path: '/device.html', autoFocus: false, roles: 'admin', controller: 'dashboard/devices/device' }); + defineRoute({ path: '/dlnaprofile.html', autoFocus: false, roles: 'admin', controller: 'dashboard/dlna/profile' }); + defineRoute({ path: '/dlnaprofiles.html', autoFocus: false, roles: 'admin', controller: 'dashboard/dlna/profiles' }); + defineRoute({ alias: '/addplugin.html', path: '/controllers/dashboard/plugins/add/index.html', @@ -156,52 +167,61 @@ define([ roles: 'admin', controller: 'dashboard/plugins/add/index' }); + defineRoute({ path: '/library.html', autoFocus: false, roles: 'admin', controller: 'dashboard/mediaLibrary' }); + defineRoute({ path: '/librarydisplay.html', autoFocus: false, roles: 'admin', controller: 'dashboard/librarydisplay' }); + defineRoute({ path: '/dlnasettings.html', autoFocus: false, roles: 'admin', controller: 'dashboard/dlna/settings' }); + defineRoute({ path: '/edititemmetadata.html', controller: 'edititemmetadata', autoFocus: false }); + defineRoute({ path: '/encodingsettings.html', autoFocus: false, roles: 'admin', controller: 'dashboard/encodingsettings' }); + defineRoute({ path: '/log.html', roles: 'admin', controller: 'dashboard/logs' }); + defineRoute({ path: '/metadataimages.html', autoFocus: false, roles: 'admin', controller: 'dashboard/metadataImages' }); + defineRoute({ path: '/metadatanfo.html', autoFocus: false, roles: 'admin', controller: 'dashboard/metadatanfo' }); + defineRoute({ alias: '/notificationsetting.html', path: '/controllers/dashboard/notifications/notification/index.html', @@ -209,6 +229,7 @@ define([ roles: 'admin', controller: 'dashboard/notifications/notification/index' }); + defineRoute({ alias: '/notificationsettings.html', path: '/controllers/dashboard/notifications/notifications/index.html', @@ -216,12 +237,14 @@ define([ autoFocus: false, roles: 'admin' }); + defineRoute({ path: '/playbackconfiguration.html', autoFocus: false, roles: 'admin', controller: 'dashboard/playback' }); + defineRoute({ alias: '/availableplugins.html', path: '/controllers/dashboard/plugins/available/index.html', @@ -229,6 +252,7 @@ define([ roles: 'admin', controller: 'dashboard/plugins/available/index' }); + defineRoute({ alias: '/repositories.html', path: '/controllers/dashboard/plugins/repositories/index.html', @@ -241,67 +265,72 @@ define([ path: '/home.html', autoFocus: false, controller: 'home', - transition: 'fade', type: 'home' }); + defineRoute({ path: '/search.html', controller: 'searchpage' }); + defineRoute({ path: '/list.html', autoFocus: false, - controller: 'list', - transition: 'fade' + controller: 'list' }); + defineRoute({ alias: '/details', path: '/controllers/itemDetails/index.html', controller: 'itemDetails/index', - autoFocus: false, - transition: 'fade' + autoFocus: false }); + defineRoute({ path: '/livetv.html', controller: 'livetv/livetvsuggested', - autoFocus: false, - transition: 'fade' + autoFocus: false }); + defineRoute({ path: '/livetvguideprovider.html', autoFocus: false, roles: 'admin', controller: 'livetvguideprovider' }); + defineRoute({ path: '/livetvsettings.html', autoFocus: false, controller: 'livetvsettings' }); + defineRoute({ path: '/livetvstatus.html', autoFocus: false, roles: 'admin', controller: 'livetvstatus' }); + defineRoute({ path: '/livetvtuner.html', autoFocus: false, roles: 'admin', controller: 'livetvtuner' }); + defineRoute({ path: '/movies.html', autoFocus: false, - controller: 'movies/moviesrecommended', - transition: 'fade' + controller: 'movies/moviesrecommended' }); + defineRoute({ path: '/music.html', controller: 'music/musicrecommended', - autoFocus: false, - transition: 'fade' + autoFocus: false }); + defineRoute({ alias: '/installedplugins.html', path: '/controllers/dashboard/plugins/installed/index.html', @@ -309,41 +338,46 @@ define([ roles: 'admin', controller: 'dashboard/plugins/installed/index' }); + defineRoute({ path: '/scheduledtask.html', autoFocus: false, roles: 'admin', controller: 'dashboard/scheduledtasks/scheduledtask' }); + defineRoute({ path: '/scheduledtasks.html', autoFocus: false, roles: 'admin', controller: 'dashboard/scheduledtasks/scheduledtasks' }); + defineRoute({ path: '/serveractivity.html', autoFocus: false, roles: 'admin', controller: 'dashboard/serveractivity' }); + defineRoute({ path: '/apikeys.html', autoFocus: false, roles: 'admin', controller: 'dashboard/apikeys' }); + defineRoute({ path: '/streamingsettings.html', autoFocus: false, roles: 'admin', controller: 'dashboard/streaming' }); + defineRoute({ path: '/tv.html', autoFocus: false, - controller: 'shows/tvrecommended', - transition: 'fade' + controller: 'shows/tvrecommended' }); defineRoute({ @@ -352,29 +386,34 @@ define([ roles: 'admin', controller: 'dashboard/users/useredit' }); + defineRoute({ path: '/userlibraryaccess.html', autoFocus: false, roles: 'admin', controller: 'dashboard/users/userlibraryaccess' }); + defineRoute({ path: '/usernew.html', autoFocus: false, roles: 'admin', controller: 'dashboard/users/usernew' }); + defineRoute({ path: '/userparentalcontrol.html', autoFocus: false, roles: 'admin', controller: 'dashboard/users/userparentalcontrol' }); + defineRoute({ path: '/userpassword.html', autoFocus: false, controller: 'dashboard/users/userpasswordpage' }); + defineRoute({ path: '/userprofiles.html', autoFocus: false, @@ -389,6 +428,7 @@ define([ anonymous: true, controller: 'wizard/remote/index' }); + defineRoute({ alias: '/wizardfinish.html', path: '/controllers/wizard/finish/index.html', @@ -396,12 +436,14 @@ define([ anonymous: true, controller: 'wizard/finish/index' }); + defineRoute({ path: '/wizardlibrary.html', autoFocus: false, anonymous: true, controller: 'dashboard/mediaLibrary' }); + defineRoute({ alias: '/wizardsettings.html', path: '/controllers/wizard/settings/index.html', @@ -409,6 +451,7 @@ define([ anonymous: true, controller: 'wizard/settings/index' }); + defineRoute({ alias: '/wizardstart.html', path: '/controllers/wizard/start/index.html', @@ -416,6 +459,7 @@ define([ anonymous: true, controller: 'wizard/start/index' }); + defineRoute({ alias: '/wizarduser.html', path: '/controllers/wizard/user/index.html', @@ -427,7 +471,6 @@ define([ defineRoute({ alias: '/video', path: '/controllers/playback/video/index.html', - transition: 'fade', controller: 'playback/video/index', autoFocus: false, type: 'video-osd', @@ -435,16 +478,17 @@ define([ fullscreen: true, enableMediaControl: false }); + defineRoute({ alias: '/queue', path: '/controllers/playback/queue/index.html', controller: 'playback/queue/index', autoFocus: false, - transition: 'fade', fullscreen: true, supportsThemeMedia: true, enableMediaControl: false }); + defineRoute({ path: '/configurationpage', autoFocus: false, @@ -458,9 +502,13 @@ define([ isDefaultRoute: true, autoFocus: false }); + defineRoute({ path: '/index.html', autoFocus: false, isDefaultRoute: true }); -}); + + console.groupEnd('defining core routes'); + +/* eslint-enable indent */