diff --git a/.eslintrc.js b/.eslintrc.js index ff12e198c..a4e972c83 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -44,6 +44,7 @@ module.exports = { 'no-unused-vars': ['error', { 'vars': 'all', 'args': 'none', 'ignoreRestSiblings': true }], 'one-var': ['error', 'never'], 'padded-blocks': ['error', 'never'], + //'prefer-const': ['error', {'destructuring': 'all'}], 'quotes': ['error', 'single', { 'avoidEscape': true, 'allowTemplateLiterals': false }], 'semi': ['error'], 'space-before-blocks': ['error'], diff --git a/package.json b/package.json index 34252280c..8014caa22 100644 --- a/package.json +++ b/package.json @@ -95,6 +95,7 @@ "src/components/alert.js", "src/components/alphaPicker/alphaPicker.js", "src/components/appFooter/appFooter.js", + "src/components/apphost.js", "src/components/autoFocuser.js", "src/components/backdrop/backdrop.js", "src/components/cardbuilder/cardBuilder.js", @@ -162,6 +163,7 @@ "src/components/recordingcreator/seriesrecordingeditor.js", "src/components/recordingcreator/recordinghelper.js", "src/components/refreshdialog/refreshdialog.js", + "src/components/qualityOptions.js", "src/components/remotecontrol/remotecontrol.js", "src/components/sanatizefilename.js", "src/components/scrollManager.js", diff --git a/src/bundle.js b/src/bundle.js index ae2a59f0d..5a7ffed07 100644 --- a/src/bundle.js +++ b/src/bundle.js @@ -2,159 +2,159 @@ * require.js module definitions bundled by webpack */ // Use define from require.js not webpack's define -var _define = window.define; +const _define = window.define; // fetch -var fetch = require('whatwg-fetch'); +const fetch = require('whatwg-fetch'); _define('fetch', function() { return fetch; }); // Blurhash -var blurhash = require('blurhash'); +const blurhash = require('blurhash'); _define('blurhash', function() { return blurhash; }); // query-string -var query = require('query-string'); +const query = require('query-string'); _define('queryString', function() { return query; }); // flvjs -var flvjs = require('flv.js/dist/flv').default; +const flvjs = require('flv.js/dist/flv').default; _define('flvjs', function() { return flvjs; }); // jstree -var jstree = require('jstree'); +const jstree = require('jstree'); require('jstree/dist/themes/default/style.css'); _define('jstree', function() { return jstree; }); // jquery -var jquery = require('jquery'); +const jquery = require('jquery'); _define('jQuery', function() { return jquery; }); // hlsjs -var hlsjs = require('hls.js'); +const hlsjs = require('hls.js'); _define('hlsjs', function() { return hlsjs; }); // howler -var howler = require('howler'); +const howler = require('howler'); _define('howler', function() { return howler; }); // resize-observer-polyfill -var resize = require('resize-observer-polyfill').default; +const resize = require('resize-observer-polyfill').default; _define('resize-observer-polyfill', function() { return resize; }); // swiper -var swiper = require('swiper/js/swiper'); +const swiper = require('swiper/js/swiper'); require('swiper/css/swiper.min.css'); _define('swiper', function() { return swiper; }); // sortable -var sortable = require('sortablejs').default; +const sortable = require('sortablejs').default; _define('sortable', function() { return sortable; }); // webcomponents -var webcomponents = require('webcomponents.js/webcomponents-lite'); +const webcomponents = require('webcomponents.js/webcomponents-lite'); _define('webcomponents', function() { return webcomponents; }); // libass-wasm -var libassWasm = require('libass-wasm'); +const libassWasm = require('libass-wasm'); _define('JavascriptSubtitlesOctopus', function() { return libassWasm; }); // material-icons -var materialIcons = require('material-design-icons-iconfont/dist/material-design-icons.css'); +const materialIcons = require('material-design-icons-iconfont/dist/material-design-icons.css'); _define('material-icons', function() { return materialIcons; }); // noto font -var noto = require('jellyfin-noto'); +const noto = require('jellyfin-noto'); _define('jellyfin-noto', function () { return noto; }); -var epubjs = require('epubjs'); +const epubjs = require('epubjs'); _define('epubjs', function () { return epubjs; }); // page.js -var page = require('page'); +const page = require('page'); _define('page', function() { return page; }); // core-js -var polyfill = require('@babel/polyfill/dist/polyfill'); +const polyfill = require('@babel/polyfill/dist/polyfill'); _define('polyfill', function () { return polyfill; }); // domtokenlist-shim -var classlist = require('classlist.js'); +const classlist = require('classlist.js'); _define('classlist-polyfill', function () { return classlist; }); // Date-FNS -var dateFns = require('date-fns'); +const dateFns = require('date-fns'); _define('date-fns', function () { return dateFns; }); -var dateFnsLocale = require('date-fns/locale'); +const dateFnsLocale = require('date-fns/locale'); _define('date-fns/locale', function () { return dateFnsLocale; }); -var fast_text_encoding = require('fast-text-encoding'); +const fast_text_encoding = require('fast-text-encoding'); _define('fast-text-encoding', function () { return fast_text_encoding; }); // intersection-observer -var intersection_observer = require('intersection-observer'); +const intersection_observer = require('intersection-observer'); _define('intersection-observer', function () { return intersection_observer; }); // screenfull -var screenfull = require('screenfull'); +const screenfull = require('screenfull'); _define('screenfull', function () { return screenfull; }); // headroom.js -var headroom = require('headroom.js/dist/headroom'); +const headroom = require('headroom.js/dist/headroom'); _define('headroom', function () { return headroom; }); // apiclient -var apiclient = require('jellyfin-apiclient'); +const apiclient = require('jellyfin-apiclient'); _define('apiclient', function () { return apiclient.ApiClient; diff --git a/src/components/actionSheet/actionSheet.js b/src/components/actionSheet/actionSheet.js index 937cd2afe..be84cf0a0 100644 --- a/src/components/actionSheet/actionSheet.js +++ b/src/components/actionSheet/actionSheet.js @@ -9,14 +9,14 @@ import 'scrollStyles'; import 'listViewStyle'; function getOffsets(elems) { - let results = []; + const results = []; if (!document) { return results; } for (const elem of elems) { - let box = elem.getBoundingClientRect(); + const box = elem.getBoundingClientRect(); results.push({ top: box.top, @@ -34,7 +34,7 @@ function getPosition(options, dlg) { const windowHeight = windowSize.innerHeight; const windowWidth = windowSize.innerWidth; - let pos = getOffsets([options.positionTo])[0]; + const pos = getOffsets([options.positionTo])[0]; if (options.positionY !== 'top') { pos.top += (pos.height || 0) / 2; @@ -82,7 +82,7 @@ export function show(options) { // positionTo // showCancel // title - let dialogOptions = { + const dialogOptions = { removeOnClose: true, enableHistory: options.enableHistory, scrollY: false @@ -103,7 +103,7 @@ export function show(options) { dialogOptions.autoFocus = false; } - let dlg = dialogHelper.createDialog(dialogOptions); + const dlg = dialogHelper.createDialog(dialogOptions); if (isFullscreen) { dlg.classList.add('actionsheet-fullscreen'); @@ -129,7 +129,7 @@ export function show(options) { } let renderIcon = false; - let icons = []; + const icons = []; let itemIcon; for (const item of options.items) { itemIcon = item.icon || (item.selected ? 'check' : null); @@ -241,7 +241,7 @@ export function show(options) { centerFocus(dlg.querySelector('.actionSheetScroller'), false, true); } - let btnCloseActionSheet = dlg.querySelector('.btnCloseActionSheet'); + const btnCloseActionSheet = dlg.querySelector('.btnCloseActionSheet'); if (btnCloseActionSheet) { btnCloseActionSheet.addEventListener('click', function () { dialogHelper.close(dlg); diff --git a/src/components/appRouter.js b/src/components/appRouter.js index e7b697daf..e6bd86336 100644 --- a/src/components/appRouter.js +++ b/src/components/appRouter.js @@ -1,6 +1,7 @@ define(['loading', 'globalize', 'events', 'viewManager', 'skinManager', 'backdrop', 'browser', 'page', 'appSettings', 'apphost', 'connectionManager'], function (loading, globalize, events, viewManager, skinManager, backdrop, browser, page, appSettings, appHost, connectionManager) { 'use strict'; + appHost = appHost.default || appHost; viewManager = viewManager.default || viewManager; browser = browser.default || browser; loading = loading.default || loading; diff --git a/src/components/apphost.js b/src/components/apphost.js index 3ed590b54..c3e934282 100644 --- a/src/components/apphost.js +++ b/src/components/apphost.js @@ -1,447 +1,412 @@ -define(['appSettings', 'browser', 'events', 'htmlMediaHelper', 'webSettings', 'globalize'], function (appSettings, browser, events, htmlMediaHelper, webSettings, globalize) { - 'use strict'; +import appSettings from 'appSettings'; +import browser from 'browser'; +import events from 'events'; +import * as htmlMediaHelper from 'htmlMediaHelper'; +import * as webSettings from 'webSettings'; +import globalize from 'globalize'; - browser = browser.default || browser; +function getBaseProfileOptions(item) { + const disableHlsVideoAudioCodecs = []; - function getBaseProfileOptions(item) { - var disableHlsVideoAudioCodecs = []; + if (item && htmlMediaHelper.enableHlsJsPlayer(item.RunTimeTicks, item.MediaType)) { + if (browser.edge) { + disableHlsVideoAudioCodecs.push('mp3'); + } - if (item && htmlMediaHelper.enableHlsJsPlayer(item.RunTimeTicks, item.MediaType)) { - if (browser.edge) { - disableHlsVideoAudioCodecs.push('mp3'); + disableHlsVideoAudioCodecs.push('ac3'); + disableHlsVideoAudioCodecs.push('eac3'); + disableHlsVideoAudioCodecs.push('opus'); + } + + return { + enableMkvProgressive: false, + disableHlsVideoAudioCodecs: disableHlsVideoAudioCodecs + }; +} + +function getDeviceProfile(item, options = {}) { + return new Promise(function (resolve) { + import('browserdeviceprofile').then(({default: profileBuilder}) => { + let profile; + + if (window.NativeShell) { + profile = window.NativeShell.AppHost.getDeviceProfile(profileBuilder); + } else { + const builderOpts = getBaseProfileOptions(item); + builderOpts.enableSsaRender = (item && !options.isRetry && appSettings.get('subtitleburnin') !== 'allcomplexformats'); + profile = profileBuilder(builderOpts); } - disableHlsVideoAudioCodecs.push('ac3'); - disableHlsVideoAudioCodecs.push('eac3'); - disableHlsVideoAudioCodecs.push('opus'); - } - - return { - enableMkvProgressive: false, - disableHlsVideoAudioCodecs: disableHlsVideoAudioCodecs - }; - } - - function getDeviceProfileForWindowsUwp(item) { - return new Promise(function (resolve, reject) { - require(['browserdeviceprofile', 'environments/windows-uwp/mediacaps'], function (profileBuilder, uwpMediaCaps) { - var profileOptions = getBaseProfileOptions(item); - profileOptions.supportsDts = uwpMediaCaps.supportsDTS(); - profileOptions.supportsTrueHd = uwpMediaCaps.supportsDolby(); - profileOptions.audioChannels = uwpMediaCaps.getAudioChannels(); - resolve(profileBuilder(profileOptions)); - }); + resolve(profile); }); + }); +} + +function escapeRegExp(str) { + return str.replace(/([.*+?^=!:${}()|[\]/\\])/g, '\\$1'); +} + +function replaceAll(originalString, strReplace, strWith) { + const strReplace2 = escapeRegExp(strReplace); + const reg = new RegExp(strReplace2, 'ig'); + return originalString.replace(reg, strWith); +} + +function generateDeviceId() { + const keys = []; + + if (keys.push(navigator.userAgent), keys.push(new Date().getTime()), self.btoa) { + const result = replaceAll(btoa(keys.join('|')), '=', '1'); + return Promise.resolve(result); } - function getDeviceProfile(item, options) { - options = options || {}; + return Promise.resolve(new Date().getTime()); +} - if (self.Windows) { - return getDeviceProfileForWindowsUwp(item); - } +function getDeviceId() { + const key = '_deviceId2'; + const deviceId = appSettings.get(key); - return new Promise(function (resolve) { - require(['browserdeviceprofile'], function (profileBuilder) { - var profile; - - if (window.NativeShell) { - profile = window.NativeShell.AppHost.getDeviceProfile(profileBuilder); - } else { - var builderOpts = getBaseProfileOptions(item); - builderOpts.enableSsaRender = (item && !options.isRetry && appSettings.get('subtitleburnin') !== 'allcomplexformats'); - profile = profileBuilder(builderOpts); - } - - resolve(profile); - }); - }); + if (deviceId) { + return Promise.resolve(deviceId); } - function escapeRegExp(str) { - return str.replace(/([.*+?^=!:${}()|\[\]\/\\])/g, '\\$1'); + return generateDeviceId().then(function (deviceId) { + appSettings.set(key, deviceId); + return deviceId; + }); +} + +function getDeviceName() { + var deviceName; + if (browser.tizen) { + deviceName = 'Samsung Smart TV'; + } else if (browser.web0s) { + deviceName = 'LG Smart TV'; + } else if (browser.operaTv) { + deviceName = 'Opera TV'; + } else if (browser.xboxOne) { + deviceName = 'Xbox One'; + } else if (browser.ps4) { + deviceName = 'Sony PS4'; + } else if (browser.chrome) { + deviceName = 'Chrome'; + } else if (browser.edgeChromium) { + deviceName = 'Edge Chromium'; + } else if (browser.edge) { + deviceName = 'Edge'; + } else if (browser.firefox) { + deviceName = 'Firefox'; + } else if (browser.opera) { + deviceName = 'Opera'; + } else if (browser.safari) { + deviceName = 'Safari'; + } else { + deviceName = 'Web Browser'; } - function replaceAll(originalString, strReplace, strWith) { - var strReplace2 = escapeRegExp(strReplace); - var reg = new RegExp(strReplace2, 'ig'); - return originalString.replace(reg, strWith); + if (browser.ipad) { + deviceName += ' iPad'; + } else if (browser.iphone) { + deviceName += ' iPhone'; + } else if (browser.android) { + deviceName += ' Android'; } - function generateDeviceId() { - var keys = []; + return deviceName; +} - if (keys.push(navigator.userAgent), keys.push(new Date().getTime()), self.btoa) { - var result = replaceAll(btoa(keys.join('|')), '=', '1'); - return Promise.resolve(result); - } - - return Promise.resolve(new Date().getTime()); +function supportsVoiceInput() { + if (!browser.tv) { + return window.SpeechRecognition || window.webkitSpeechRecognition || window.mozSpeechRecognition || window.oSpeechRecognition || window.msSpeechRecognition; } - function getDeviceId() { - var key = '_deviceId2'; - var deviceId = appSettings.get(key); - - if (deviceId) { - return Promise.resolve(deviceId); - } - - return generateDeviceId().then(function (deviceId) { - appSettings.set(key, deviceId); - return deviceId; - }); - } - - function getDeviceName() { - var deviceName; - if (browser.tizen) { - deviceName = 'Samsung Smart TV'; - } else if (browser.web0s) { - deviceName = 'LG Smart TV'; - } else if (browser.operaTv) { - deviceName = 'Opera TV'; - } else if (browser.xboxOne) { - deviceName = 'Xbox One'; - } else if (browser.ps4) { - deviceName = 'Sony PS4'; - } else if (browser.chrome) { - deviceName = 'Chrome'; - } else if (browser.edgeChromium) { - deviceName = 'Edge Chromium'; - } else if (browser.edge) { - deviceName = 'Edge'; - } else if (browser.firefox) { - deviceName = 'Firefox'; - } else if (browser.opera) { - deviceName = 'Opera'; - } else if (browser.safari) { - deviceName = 'Safari'; - } else { - deviceName = 'Web Browser'; - } - - if (browser.ipad) { - deviceName += ' iPad'; - } else if (browser.iphone) { - deviceName += ' iPhone'; - } else if (browser.android) { - deviceName += ' Android'; - } - - return deviceName; - } - - function supportsVoiceInput() { - if (!browser.tv) { - return window.SpeechRecognition || window.webkitSpeechRecognition || window.mozSpeechRecognition || window.oSpeechRecognition || window.msSpeechRecognition; - } + return false; +} +function supportsFullscreen() { + if (browser.tv) { return false; } - function supportsFullscreen() { - if (browser.tv) { - return false; - } + const element = document.documentElement; + return (element.requestFullscreen || element.mozRequestFullScreen || element.webkitRequestFullscreen || element.msRequestFullscreen) || document.createElement('video').webkitEnterFullscreen; +} - var element = document.documentElement; - return (element.requestFullscreen || element.mozRequestFullScreen || element.webkitRequestFullscreen || element.msRequestFullscreen) || document.createElement('video').webkitEnterFullscreen; - } - - function getSyncProfile() { - return new Promise(function (resolve) { - require(['browserdeviceprofile', 'appSettings'], function (profileBuilder, appSettings) { - var profile; - - if (window.NativeShell) { - profile = window.NativeShell.AppHost.getSyncProfile(profileBuilder, appSettings); - } else { - profile = profileBuilder(); - profile.MaxStaticMusicBitrate = appSettings.maxStaticMusicBitrate(); - } - - resolve(profile); - }); - }); - } - - function getDefaultLayout() { - return 'desktop'; - } - - function supportsHtmlMediaAutoplay() { - if (browser.edgeUwp || browser.tizen || browser.web0s || browser.orsay || browser.operaTv || browser.ps4 || browser.xboxOne) { - return true; - } - - if (browser.mobile) { - return false; - } +function getDefaultLayout() { + return 'desktop'; +} +function supportsHtmlMediaAutoplay() { + if (browser.edgeUwp || browser.tizen || browser.web0s || browser.orsay || browser.operaTv || browser.ps4 || browser.xboxOne) { return true; } - function supportsCue() { - try { - var video = document.createElement('video'); - var style = document.createElement('style'); - - style.textContent = 'video::cue {background: inherit}'; - document.body.appendChild(style); - document.body.appendChild(video); - - var cue = window.getComputedStyle(video, '::cue').background; - document.body.removeChild(style); - document.body.removeChild(video); - - return !!cue.length; - } catch (err) { - console.error('error detecting cue support: ' + err); - return false; - } + if (browser.mobile) { + return false; } - function onAppVisible() { - if (isHidden) { - isHidden = false; - console.debug('triggering app resume event'); - events.trigger(appHost, 'resume'); - } + return true; +} + +function supportsCue() { + try { + const video = document.createElement('video'); + const style = document.createElement('style'); + + style.textContent = 'video::cue {background: inherit}'; + document.body.appendChild(style); + document.body.appendChild(video); + + const cue = window.getComputedStyle(video, '::cue').background; + document.body.removeChild(style); + document.body.removeChild(video); + + return !!cue.length; + } catch (err) { + console.error('error detecting cue support: ' + err); + return false; + } +} + +function onAppVisible() { + if (isHidden) { + isHidden = false; + console.debug('triggering app resume event'); + events.trigger(appHost, 'resume'); + } +} + +function onAppHidden() { + if (!isHidden) { + isHidden = true; + console.debug('app is hidden'); + } +} + +const supportedFeatures = function () { + const features = []; + + if (navigator.share) { + features.push('sharing'); } - function onAppHidden() { - if (!isHidden) { - isHidden = true; - console.debug('app is hidden'); - } + if (!browser.edgeUwp && !browser.tv && !browser.xboxOne && !browser.ps4) { + features.push('filedownload'); } - var supportedFeatures = function () { - var features = []; + if (browser.operaTv || browser.tizen || browser.orsay || browser.web0s) { + features.push('exit'); + } else { + features.push('exitmenu'); + features.push('plugins'); + } - if (navigator.share) { - features.push('sharing'); - } + if (!browser.operaTv && !browser.tizen && !browser.orsay && !browser.web0s && !browser.ps4) { + features.push('externallinks'); + features.push('externalpremium'); + } - if (!browser.edgeUwp && !browser.tv && !browser.xboxOne && !browser.ps4) { - features.push('filedownload'); - } + if (!browser.operaTv) { + features.push('externallinkdisplay'); + } - if (browser.operaTv || browser.tizen || browser.orsay || browser.web0s) { - features.push('exit'); + if (supportsVoiceInput()) { + features.push('voiceinput'); + } + + if (supportsHtmlMediaAutoplay()) { + features.push('htmlaudioautoplay'); + features.push('htmlvideoautoplay'); + } + + if (browser.edgeUwp) { + features.push('sync'); + } + + if (supportsFullscreen()) { + features.push('fullscreenchange'); + } + + if (browser.tv || browser.xboxOne || browser.ps4 || browser.mobile) { + features.push('physicalvolumecontrol'); + } + + if (!browser.tv && !browser.xboxOne && !browser.ps4) { + features.push('remotecontrol'); + } + + if (!browser.operaTv && !browser.tizen && !browser.orsay && !browser.web0s && !browser.edgeUwp) { + features.push('remotevideo'); + } + + features.push('displaylanguage'); + features.push('otherapppromotions'); + features.push('displaymode'); + features.push('targetblank'); + features.push('screensaver'); + + webSettings.getMultiServer().then(enabled => { + if (enabled) features.push('multiserver'); + }); + + if (!browser.orsay && (browser.firefox || browser.ps4 || browser.edge || supportsCue())) { + features.push('subtitleappearancesettings'); + } + + if (!browser.orsay) { + features.push('subtitleburnsettings'); + } + + if (!browser.tv && !browser.ps4 && !browser.xboxOne) { + features.push('fileinput'); + } + + if (browser.chrome || browser.edgeChromium) { + features.push('chromecast'); + } + + return features; +}(); + +/** + * Do exit according to platform + */ +function doExit() { + try { + if (window.NativeShell) { + window.NativeShell.AppHost.exit(); + } else if (browser.tizen) { + tizen.application.getCurrentApplication().exit(); + } else if (browser.web0s) { + webOS.platformBack(); } else { - features.push('exitmenu'); - features.push('plugins'); + window.close(); } + } catch (err) { + console.error('error closing application: ' + err); + } +} - if (!browser.operaTv && !browser.tizen && !browser.orsay && !browser.web0s && !browser.ps4) { - features.push('externallinks'); - features.push('externalpremium'); - } +let exitPromise; - if (!browser.operaTv) { - features.push('externallinkdisplay'); - } - - if (supportsVoiceInput()) { - features.push('voiceinput'); - } - - if (supportsHtmlMediaAutoplay()) { - features.push('htmlaudioautoplay'); - features.push('htmlvideoautoplay'); - } - - if (browser.edgeUwp) { - features.push('sync'); - } - - if (supportsFullscreen()) { - features.push('fullscreenchange'); - } - - if (browser.tv || browser.xboxOne || browser.ps4 || browser.mobile) { - features.push('physicalvolumecontrol'); - } - - if (!browser.tv && !browser.xboxOne && !browser.ps4) { - features.push('remotecontrol'); - } - - if (!browser.operaTv && !browser.tizen && !browser.orsay && !browser.web0s && !browser.edgeUwp) { - features.push('remotevideo'); - } - - features.push('displaylanguage'); - features.push('otherapppromotions'); - features.push('displaymode'); - features.push('targetblank'); - features.push('screensaver'); - - webSettings.getMultiServer().then(enabled => { - if (enabled) features.push('multiserver'); - }); - - if (!browser.orsay && (browser.firefox || browser.ps4 || browser.edge || supportsCue())) { - features.push('subtitleappearancesettings'); - } - - if (!browser.orsay) { - features.push('subtitleburnsettings'); - } - - if (!browser.tv && !browser.ps4 && !browser.xboxOne) { - features.push('fileinput'); - } - - if (browser.chrome || browser.edgeChromium) { - features.push('chromecast'); - } - - return features; - }(); - - /** - * Do exit according to platform - */ - function doExit() { - try { - if (window.NativeShell) { - window.NativeShell.AppHost.exit(); - } else if (browser.tizen) { - tizen.application.getCurrentApplication().exit(); - } else if (browser.web0s) { - webOS.platformBack(); - } else { - window.close(); - } - } catch (err) { - console.error('error closing application: ' + err); - } +/** + * Ask user for exit + */ +function askForExit() { + if (exitPromise) { + return; } - var exitPromise; - - /** - * Ask user for exit - */ - function askForExit() { - if (exitPromise) { - return; - } - - require(['actionsheet'], function (actionsheet) { - exitPromise = actionsheet.show({ - title: globalize.translate('MessageConfirmAppExit'), - items: [ - {id: 'yes', name: globalize.translate('Yes')}, - {id: 'no', name: globalize.translate('No')} - ] - }).then(function (value) { - if (value === 'yes') { - doExit(); - } - }).finally(function () { - exitPromise = null; - }); - }); - } - - var deviceId; - var deviceName; - var appName = 'Jellyfin Web'; - var appVersion = '10.7.0'; - - var appHost = { - getWindowState: function () { - return document.windowState || 'Normal'; - }, - setWindowState: function (state) { - alert('setWindowState is not supported and should not be called'); - }, - exit: function () { - if (!!window.appMode && browser.tizen) { - askForExit(); - } else { + import('actionsheet').then(({default: actionsheet}) => { + exitPromise = actionsheet.show({ + title: globalize.translate('MessageConfirmAppExit'), + items: [ + {id: 'yes', name: globalize.translate('Yes')}, + {id: 'no', name: globalize.translate('No')} + ] + }).then(function (value) { + if (value === 'yes') { doExit(); } - }, - supports: function (command) { - if (window.NativeShell) { - return window.NativeShell.AppHost.supports(command); - } + }).finally(function () { + exitPromise = null; + }); + }); +} - return supportedFeatures.indexOf(command.toLowerCase()) !== -1; - }, - preferVisualCards: browser.android || browser.chrome, - getSyncProfile: getSyncProfile, - getDefaultLayout: function () { - if (window.NativeShell) { - return window.NativeShell.AppHost.getDefaultLayout(); - } +let deviceId; +let deviceName; +const appName = 'Jellyfin Web'; +const appVersion = '10.7.0'; - return getDefaultLayout(); - }, - getDeviceProfile: getDeviceProfile, - init: function () { - if (window.NativeShell) { - return window.NativeShell.AppHost.init(); - } - - deviceName = getDeviceName(); - getDeviceId().then(function (id) { - deviceId = id; - }); - }, - deviceName: function () { - return window.NativeShell ? window.NativeShell.AppHost.deviceName() : deviceName; - }, - deviceId: function () { - return window.NativeShell ? window.NativeShell.AppHost.deviceId() : deviceId; - }, - appName: function () { - return window.NativeShell ? window.NativeShell.AppHost.appName() : appName; - }, - appVersion: function () { - return window.NativeShell ? window.NativeShell.AppHost.appVersion() : appVersion; - }, - getPushTokenInfo: function () { - return {}; - }, - setUserScalable: function (scalable) { - if (!browser.tv) { - var att = scalable ? 'width=device-width, initial-scale=1, minimum-scale=1, user-scalable=yes' : 'width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no'; - document.querySelector('meta[name=viewport]').setAttribute('content', att); - } - } - }; - - var isHidden = false; - var hidden; - var visibilityChange; - - if (typeof document.hidden !== 'undefined') { /* eslint-disable-line compat/compat */ - hidden = 'hidden'; - visibilityChange = 'visibilitychange'; - } else if (typeof document.webkitHidden !== 'undefined') { - hidden = 'webkitHidden'; - visibilityChange = 'webkitvisibilitychange'; - } - - document.addEventListener(visibilityChange, function () { - /* eslint-disable-next-line compat/compat */ - if (document[hidden]) { - onAppHidden(); +const appHost = { + getWindowState: function () { + return document.windowState || 'Normal'; + }, + setWindowState: function () { + alert('setWindowState is not supported and should not be called'); + }, + exit: function () { + if (!!window.appMode && browser.tizen) { + askForExit(); } else { - onAppVisible(); + doExit(); + } + }, + supports: function (command) { + if (window.NativeShell) { + return window.NativeShell.AppHost.supports(command); } - }, false); - if (self.addEventListener) { - self.addEventListener('focus', onAppVisible); - self.addEventListener('blur', onAppHidden); + return supportedFeatures.indexOf(command.toLowerCase()) !== -1; + }, + preferVisualCards: browser.android || browser.chrome, + getDefaultLayout: function () { + if (window.NativeShell) { + return window.NativeShell.AppHost.getDefaultLayout(); + } + + return getDefaultLayout(); + }, + getDeviceProfile: getDeviceProfile, + init: function () { + if (window.NativeShell) { + return window.NativeShell.AppHost.init(); + } + + deviceName = getDeviceName(); + getDeviceId().then(function (id) { + deviceId = id; + }); + }, + deviceName: function () { + return window.NativeShell ? window.NativeShell.AppHost.deviceName() : deviceName; + }, + deviceId: function () { + return window.NativeShell ? window.NativeShell.AppHost.deviceId() : deviceId; + }, + appName: function () { + return window.NativeShell ? window.NativeShell.AppHost.appName() : appName; + }, + appVersion: function () { + return window.NativeShell ? window.NativeShell.AppHost.appVersion() : appVersion; + }, + getPushTokenInfo: function () { + return {}; + }, + setUserScalable: function (scalable) { + if (!browser.tv) { + const att = scalable ? 'width=device-width, initial-scale=1, minimum-scale=1, user-scalable=yes' : 'width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no'; + document.querySelector('meta[name=viewport]').setAttribute('content', att); + } } +}; - return appHost; -}); +let isHidden = false; +let hidden; +let visibilityChange; + +if (typeof document.hidden !== 'undefined') { /* eslint-disable-line compat/compat */ + hidden = 'hidden'; + visibilityChange = 'visibilitychange'; +} else if (typeof document.webkitHidden !== 'undefined') { + hidden = 'webkitHidden'; + visibilityChange = 'webkitvisibilitychange'; +} + +document.addEventListener(visibilityChange, function () { + /* eslint-disable-next-line compat/compat */ + if (document[hidden]) { + onAppHidden(); + } else { + onAppVisible(); + } +}, false); + +if (self.addEventListener) { + self.addEventListener('focus', onAppVisible); + self.addEventListener('blur', onAppHidden); +} + +export default appHost; diff --git a/src/components/cardbuilder/cardBuilder.js b/src/components/cardbuilder/cardBuilder.js index 4a37331ef..e64436590 100644 --- a/src/components/cardbuilder/cardBuilder.js +++ b/src/components/cardbuilder/cardBuilder.js @@ -362,12 +362,12 @@ import 'programStyles'; let hasOpenRow; let hasOpenSection; - let sectionTitleTagName = options.sectionTitleTagName || 'div'; + const sectionTitleTagName = options.sectionTitleTagName || 'div'; let apiClient; let lastServerId; for (const [i, item] of items.entries()) { - let serverId = item.ServerId || options.serverId; + const serverId = item.ServerId || options.serverId; if (serverId !== lastServerId) { lastServerId = serverId; @@ -621,7 +621,7 @@ import 'programStyles'; }); } - let blurHashes = options.imageBlurhashes || item.ImageBlurHashes || {}; + const blurHashes = options.imageBlurhashes || item.ImageBlurHashes || {}; return { imgUrl: imgUrl, @@ -656,7 +656,7 @@ import 'programStyles'; for (let i = 0; i < character.length; i++) { sum += parseInt(character.charAt(i)); } - let index = String(sum).substr(-1); + const index = String(sum).substr(-1); return (index % numRandomColors) + 1; } else { @@ -682,7 +682,7 @@ import 'programStyles'; for (let i = 0; i < lines.length; i++) { let currentCssClass = cssClass; - let text = lines[i]; + const text = lines[i]; if (valid > 0 && isOuterFooter) { currentCssClass += ' cardText-secondary'; @@ -707,7 +707,7 @@ import 'programStyles'; } if (forceLines) { - let linesLength = maxLines || Math.min(lines.length, maxLines || lines.length); + const linesLength = maxLines || Math.min(lines.length, maxLines || lines.length); while (valid < linesLength) { html += "
 
"; @@ -1036,7 +1036,7 @@ import 'programStyles'; * @returns {string} HTML markup for the item count indicator. */ function getItemCountsHtml(options, item) { - let counts = []; + const counts = []; let childText; if (item.Type === 'Playlist') { @@ -1318,7 +1318,7 @@ import 'programStyles'; let cardBoxClose = ''; let cardScalableClose = ''; - let cardContentClass = 'cardContent'; + const cardContentClass = 'cardContent'; let blurhashAttrib = ''; if (blurhash && blurhash.length > 0) { @@ -1337,7 +1337,7 @@ import 'programStyles'; cardImageContainerClose = ''; } - let cardScalableClass = 'cardScalable'; + const cardScalableClass = 'cardScalable'; cardImageContainerOpen = '
' + cardImageContainerOpen; cardBoxClose = '
'; @@ -1681,7 +1681,7 @@ import 'programStyles'; const cells = itemsContainer.querySelectorAll('.card[data-id="' + programId + '"]'); for (let i = 0, length = cells.length; i < length; i++) { - let cell = cells[i]; + const cell = cells[i]; const icon = cell.querySelector('.timerIndicator'); if (!icon) { const indicatorsElem = ensureIndicators(cell); @@ -1700,8 +1700,8 @@ import 'programStyles'; const cells = itemsContainer.querySelectorAll('.card[data-timerid="' + timerId + '"]'); for (let i = 0; i < cells.length; i++) { - let cell = cells[i]; - let icon = cell.querySelector('.timerIndicator'); + const cell = cells[i]; + const icon = cell.querySelector('.timerIndicator'); if (icon) { icon.parentNode.removeChild(icon); } @@ -1718,8 +1718,8 @@ import 'programStyles'; const cells = itemsContainer.querySelectorAll('.card[data-seriestimerid="' + cancelledTimerId + '"]'); for (let i = 0; i < cells.length; i++) { - let cell = cells[i]; - let icon = cell.querySelector('.timerIndicator'); + const cell = cells[i]; + const icon = cell.querySelector('.timerIndicator'); if (icon) { icon.parentNode.removeChild(icon); } diff --git a/src/components/dialogHelper/dialogHelper.js b/src/components/dialogHelper/dialogHelper.js index 77643791a..a6f664149 100644 --- a/src/components/dialogHelper/dialogHelper.js +++ b/src/components/dialogHelper/dialogHelper.js @@ -391,11 +391,8 @@ import 'scrollStyles'; dlg.setAttribute('data-autofocus', 'true'); } - let defaultEntryAnimation; - let defaultExitAnimation; - - defaultEntryAnimation = 'scaleup'; - defaultExitAnimation = 'scaledown'; + const defaultEntryAnimation = 'scaleup'; + const defaultExitAnimation = 'scaledown'; const entryAnimation = options.entryAnimation || defaultEntryAnimation; const exitAnimation = options.exitAnimation || defaultExitAnimation; diff --git a/src/components/images/imageLoader.js b/src/components/images/imageLoader.js index 0effcc7a5..39dc6c262 100644 --- a/src/components/images/imageLoader.js +++ b/src/components/images/imageLoader.js @@ -17,8 +17,8 @@ import 'css!./style'; // Although the default values recommended by Blurhash developers is 32x32, a size of 18x18 seems to be the sweet spot for us, // improving the performance and reducing the memory usage, while retaining almost full blur quality. // Lower values had more visible pixelation - let width = 18; - let height = 18; + const width = 18; + const height = 18; let pixels; try { pixels = blurhash.decode(blurhashstr, width, height); @@ -27,11 +27,11 @@ import 'css!./style'; target.classList.add('non-blurhashable'); return; } - let canvas = document.createElement('canvas'); + const canvas = document.createElement('canvas'); canvas.width = width; canvas.height = height; - let ctx = canvas.getContext('2d'); - let imgData = ctx.createImageData(width, height); + const ctx = canvas.getContext('2d'); + const imgData = ctx.createImageData(width, height); imgData.data.set(pixels); ctx.putImageData(imgData, 0, 0); @@ -55,7 +55,7 @@ import 'css!./style'; if (!entry) { throw new Error('entry cannot be null'); } - let target = entry.target; + const target = entry.target; var source = undefined; if (target) { @@ -78,7 +78,7 @@ import 'css!./style'; throw new TypeError('url cannot be undefined'); } - let preloaderImg = new Image(); + const preloaderImg = new Image(); preloaderImg.src = url; elem.classList.add('lazy-hidden'); diff --git a/src/components/indicators/indicators.js b/src/components/indicators/indicators.js index 604f480f1..bbd672ef7 100644 --- a/src/components/indicators/indicators.js +++ b/src/components/indicators/indicators.js @@ -82,7 +82,7 @@ export function enablePlayedIndicator(item) { export function getPlayedIndicatorHtml(item) { if (enablePlayedIndicator(item)) { - let userData = item.UserData || {}; + const userData = item.UserData || {}; if (userData.UnplayedItemCount) { return '
' + userData.UnplayedItemCount + '
'; } diff --git a/src/components/itemContextMenu.js b/src/components/itemContextMenu.js index 173383d06..c1cac11d8 100644 --- a/src/components/itemContextMenu.js +++ b/src/components/itemContextMenu.js @@ -16,7 +16,7 @@ import actionsheet from 'actionsheet'; const canPlay = playbackManager.canPlay(item); const restrictOptions = (browser.operaTv || browser.web0s) && !user.Policy.IsAdministrator; - let commands = []; + const commands = []; if (canPlay && item.MediaType !== 'Photo') { if (options.play !== false) { @@ -367,7 +367,7 @@ import actionsheet from 'actionsheet'; case 'copy-stream': { const downloadHref = apiClient.getItemDownloadUrl(itemId); const textAreaCopy = function () { - let textArea = document.createElement('textarea'); + const textArea = document.createElement('textarea'); textArea.value = downloadHref; document.body.appendChild(textArea); textArea.focus(); diff --git a/src/components/metadataEditor/metadataEditor.js b/src/components/metadataEditor/metadataEditor.js index 162da8984..82b3c66f5 100644 --- a/src/components/metadataEditor/metadataEditor.js +++ b/src/components/metadataEditor/metadataEditor.js @@ -906,7 +906,7 @@ import 'flexStyles'; } function populatePeople(context, people) { - let lastType = ''; + const lastType = ''; let html = ''; const elem = context.querySelector('#peopleList'); diff --git a/src/components/nowPlayingBar/nowPlayingBar.js b/src/components/nowPlayingBar/nowPlayingBar.js index d411dcc62..7aa8c623b 100644 --- a/src/components/nowPlayingBar/nowPlayingBar.js +++ b/src/components/nowPlayingBar/nowPlayingBar.js @@ -500,20 +500,20 @@ import 'emby-ratingbutton'; const textLines = nowPlayingItem ? nowPlayingHelper.getNowPlayingNames(nowPlayingItem) : []; nowPlayingTextElement.innerHTML = ''; if (textLines) { - let itemText = document.createElement('div'); - let secondaryText = document.createElement('div'); + const itemText = document.createElement('div'); + const secondaryText = document.createElement('div'); secondaryText.classList.add('nowPlayingBarSecondaryText'); if (textLines.length > 1) { textLines[1].secondary = true; if (textLines[1].text) { - let text = document.createElement('a'); + const text = document.createElement('a'); text.innerHTML = textLines[1].text; secondaryText.appendChild(text); } } if (textLines[0].text) { - let text = document.createElement('a'); + const text = document.createElement('a'); text.innerHTML = textLines[0].text; itemText.appendChild(text); } @@ -555,10 +555,10 @@ import 'emby-ratingbutton'; if (!layoutManager.mobile) { let contextButton = nowPlayingBarElement.querySelector('.btnToggleContextMenu'); // We remove the previous event listener by replacing the item in each update event - let contextButtonClone = contextButton.cloneNode(true); + const contextButtonClone = contextButton.cloneNode(true); contextButton.parentNode.replaceChild(contextButtonClone, contextButton); contextButton = nowPlayingBarElement.querySelector('.btnToggleContextMenu'); - let options = { + const options = { play: false, queue: false, clearQueue: true, @@ -600,10 +600,10 @@ import 'emby-ratingbutton'; return; } - let shuffleMode = playbackManager.getQueueShuffleMode(); - let context = nowPlayingBarElement; + const shuffleMode = playbackManager.getQueueShuffleMode(); + const context = nowPlayingBarElement; const cssClass = 'buttonActive'; - let toggleShuffleButton = context.querySelector('.btnShuffleQueue'); + const toggleShuffleButton = context.querySelector('.btnShuffleQueue'); switch (shuffleMode) { case 'Shuffle': toggleShuffleButton.classList.add(cssClass); diff --git a/src/components/playback/mediasession.js b/src/components/playback/mediasession.js index 0f275c88f..5c7ddf45d 100644 --- a/src/components/playback/mediasession.js +++ b/src/components/playback/mediasession.js @@ -127,7 +127,7 @@ import connectionManager from 'connectionManager'; artwork: getImageUrls(item) }); } else { - let itemImageUrl = seriesImageUrl(item, { maxHeight: 3000 }) || imageUrl(item, { maxHeight: 3000 }); + const itemImageUrl = seriesImageUrl(item, { maxHeight: 3000 }) || imageUrl(item, { maxHeight: 3000 }); window.NativeShell.updateMediaSession({ action: eventName, @@ -244,10 +244,10 @@ import connectionManager from 'connectionManager'; /* eslint-disable-next-line compat/compat */ navigator.mediaSession.setActionHandler('seekto', function (object) { - let item = playbackManager.getPlayerState(currentPlayer).NowPlayingItem; + const item = playbackManager.getPlayerState(currentPlayer).NowPlayingItem; // Convert to ms - let duration = parseInt(item.RunTimeTicks ? (item.RunTimeTicks / 10000) : 0); - let wantedTime = object.seekTime * 1000; + const duration = parseInt(item.RunTimeTicks ? (item.RunTimeTicks / 10000) : 0); + const wantedTime = object.seekTime * 1000; playbackManager.seekPercent(wantedTime / duration * 100, currentPlayer); }); } diff --git a/src/components/playback/playbackmanager.js b/src/components/playback/playbackmanager.js index 437127be1..8502b551a 100644 --- a/src/components/playback/playbackmanager.js +++ b/src/components/playback/playbackmanager.js @@ -8,7 +8,7 @@ import * as userSettings from 'userSettings'; import globalize from 'globalize'; import connectionManager from 'connectionManager'; import loading from 'loading'; -import apphost from 'apphost'; +import appHost from 'apphost'; import screenfull from 'screenfull'; function enableLocalPlaylistManagement(player) { @@ -322,7 +322,7 @@ function getAudioStreamUrl(item, transcodingProfile, directPlayContainers, maxBi PlaySessionId: startingPlaySession, StartTimeTicks: startPosition || 0, EnableRedirection: true, - EnableRemoteMedia: apphost.supports('remoteaudio') + EnableRemoteMedia: appHost.supports('remoteaudio') }); } @@ -606,7 +606,7 @@ function supportsDirectPlay(apiClient, item, mediaSource) { const isFolderRip = mediaSource.VideoType === 'BluRay' || mediaSource.VideoType === 'Dvd' || mediaSource.VideoType === 'HdDvd'; if (mediaSource.SupportsDirectPlay || isFolderRip) { - if (mediaSource.IsRemote && !apphost.supports('remotevideo')) { + if (mediaSource.IsRemote && !appHost.supports('remotevideo')) { return Promise.resolve(false); } @@ -3156,7 +3156,7 @@ class PlaybackManager { return streamInfo ? streamInfo.playbackStartTimeTicks : null; }; - if (apphost.supports('remotecontrol')) { + if (appHost.supports('remotecontrol')) { import('serverNotifications').then(({ default: serverNotifications }) => { events.on(serverNotifications, 'ServerShuttingDown', self.setDefaultPlayerActive.bind(self)); events.on(serverNotifications, 'ServerRestarting', self.setDefaultPlayerActive.bind(self)); @@ -3520,7 +3520,7 @@ class PlaybackManager { 'PlayTrailers' ]; - if (apphost.supports('fullscreenchange')) { + if (appHost.supports('fullscreenchange')) { list.push('ToggleFullscreen'); } diff --git a/src/components/qualityOptions.js b/src/components/qualityOptions.js index 10a5df39b..63d9557c7 100644 --- a/src/components/qualityOptions.js +++ b/src/components/qualityOptions.js @@ -1,160 +1,158 @@ -define(['globalize'], function (globalize) { - 'use strict'; +import globalize from 'globalize'; - function getVideoQualityOptions(options) { - var maxStreamingBitrate = options.currentMaxBitrate; - var videoWidth = options.videoWidth; - var videoHeight = options.videoHeight; +export function getVideoQualityOptions(options) { + var maxStreamingBitrate = options.currentMaxBitrate; + var videoWidth = options.videoWidth; + var videoHeight = options.videoHeight; - // If the aspect ratio is less than 16/9 (1.77), set the width as if it were pillarboxed. - // 4:3 1440x1080 -> 1920x1080 - if (videoWidth / videoHeight < 16 / 9) { - videoWidth = videoHeight * (16 / 9); - } - - var maxAllowedWidth = videoWidth || 4096; - - var qualityOptions = []; - - if (maxAllowedWidth >= 3800) { - qualityOptions.push({ name: '4K - 120 Mbps', maxHeight: 2160, bitrate: 120000000 }); - qualityOptions.push({ name: '4K - 100 Mbps', maxHeight: 2160, bitrate: 100000000 }); - qualityOptions.push({ name: '4K - 80 Mbps', maxHeight: 2160, bitrate: 80000000 }); - } - - // Some 1080- videos are reported as 1912? - if (maxAllowedWidth >= 1900) { - qualityOptions.push({ name: '1080p - 60 Mbps', maxHeight: 1080, bitrate: 60000000 }); - qualityOptions.push({ name: '1080p - 50 Mbps', maxHeight: 1080, bitrate: 50000000 }); - qualityOptions.push({ name: '1080p - 40 Mbps', maxHeight: 1080, bitrate: 40000000 }); - qualityOptions.push({ name: '1080p - 30 Mbps', maxHeight: 1080, bitrate: 30000000 }); - qualityOptions.push({ name: '1080p - 25 Mbps', maxHeight: 1080, bitrate: 25000000 }); - qualityOptions.push({ name: '1080p - 20 Mbps', maxHeight: 1080, bitrate: 20000000 }); - qualityOptions.push({ name: '1080p - 15 Mbps', maxHeight: 1080, bitrate: 15000000 }); - qualityOptions.push({ name: '1080p - 10 Mbps', maxHeight: 1080, bitrate: 10000001 }); - qualityOptions.push({ name: '1080p - 8 Mbps', maxHeight: 1080, bitrate: 8000001 }); - qualityOptions.push({ name: '1080p - 6 Mbps', maxHeight: 1080, bitrate: 6000001 }); - qualityOptions.push({ name: '1080p - 5 Mbps', maxHeight: 1080, bitrate: 5000001 }); - qualityOptions.push({ name: '1080p - 4 Mbps', maxHeight: 1080, bitrate: 4000002 }); - } else if (maxAllowedWidth >= 1260) { - qualityOptions.push({ name: '720p - 10 Mbps', maxHeight: 720, bitrate: 10000000 }); - qualityOptions.push({ name: '720p - 8 Mbps', maxHeight: 720, bitrate: 8000000 }); - qualityOptions.push({ name: '720p - 6 Mbps', maxHeight: 720, bitrate: 6000000 }); - qualityOptions.push({ name: '720p - 5 Mbps', maxHeight: 720, bitrate: 5000000 }); - } else if (maxAllowedWidth >= 620) { - qualityOptions.push({ name: '480p - 4 Mbps', maxHeight: 480, bitrate: 4000001 }); - qualityOptions.push({ name: '480p - 3 Mbps', maxHeight: 480, bitrate: 3000001 }); - qualityOptions.push({ name: '480p - 2.5 Mbps', maxHeight: 480, bitrate: 2500000 }); - qualityOptions.push({ name: '480p - 2 Mbps', maxHeight: 480, bitrate: 2000001 }); - qualityOptions.push({ name: '480p - 1.5 Mbps', maxHeight: 480, bitrate: 1500001 }); - } - - if (maxAllowedWidth >= 1260) { - qualityOptions.push({ name: '720p - 4 Mbps', maxHeight: 720, bitrate: 4000000 }); - qualityOptions.push({ name: '720p - 3 Mbps', maxHeight: 720, bitrate: 3000000 }); - qualityOptions.push({ name: '720p - 2 Mbps', maxHeight: 720, bitrate: 2000000 }); - - // The extra 1 is because they're keyed off the bitrate value - qualityOptions.push({ name: '720p - 1.5 Mbps', maxHeight: 720, bitrate: 1500000 }); - qualityOptions.push({ name: '720p - 1 Mbps', maxHeight: 720, bitrate: 1000001 }); - } - - qualityOptions.push({ name: '480p - 1 Mbps', maxHeight: 480, bitrate: 1000000 }); - qualityOptions.push({ name: '480p - 720 kbps', maxHeight: 480, bitrate: 720000 }); - qualityOptions.push({ name: '480p - 420 kbps', maxHeight: 480, bitrate: 420000 }); - qualityOptions.push({ name: '360p', maxHeight: 360, bitrate: 400000 }); - qualityOptions.push({ name: '240p', maxHeight: 240, bitrate: 320000 }); - qualityOptions.push({ name: '144p', maxHeight: 144, bitrate: 192000 }); - - var autoQualityOption = { - name: globalize.translate('Auto'), - bitrate: 0, - selected: options.isAutomaticBitrateEnabled - }; - - if (options.enableAuto) { - qualityOptions.push(autoQualityOption); - } - - if (maxStreamingBitrate) { - var selectedIndex = -1; - for (var i = 0, length = qualityOptions.length; i < length; i++) { - var option = qualityOptions[i]; - - if (selectedIndex === -1 && option.bitrate <= maxStreamingBitrate) { - selectedIndex = i; - } - } - - if (selectedIndex === -1) { - selectedIndex = qualityOptions.length - 1; - } - - var currentQualityOption = qualityOptions[selectedIndex]; - - if (!options.isAutomaticBitrateEnabled) { - currentQualityOption.selected = true; - } else { - autoQualityOption.autoText = currentQualityOption.name; - } - } - - return qualityOptions; + // If the aspect ratio is less than 16/9 (1.77), set the width as if it were pillarboxed. + // 4:3 1440x1080 -> 1920x1080 + if (videoWidth / videoHeight < 16 / 9) { + videoWidth = videoHeight * (16 / 9); } - function getAudioQualityOptions(options) { - var maxStreamingBitrate = options.currentMaxBitrate; + var maxAllowedWidth = videoWidth || 4096; - var qualityOptions = []; + var qualityOptions = []; - qualityOptions.push({ name: '2 Mbps', bitrate: 2000000 }); - qualityOptions.push({ name: '1.5 Mbps', bitrate: 1500000 }); - qualityOptions.push({ name: '1 Mbps', bitrate: 1000000 }); - qualityOptions.push({ name: '320 kbps', bitrate: 320000 }); - qualityOptions.push({ name: '256 kbps', bitrate: 256000 }); - qualityOptions.push({ name: '192 kbps', bitrate: 192000 }); - qualityOptions.push({ name: '128 kbps', bitrate: 128000 }); - qualityOptions.push({ name: '96 kbps', bitrate: 96000 }); - qualityOptions.push({ name: '64 kbps', bitrate: 64000 }); - - var autoQualityOption = { - name: globalize.translate('Auto'), - bitrate: 0, - selected: options.isAutomaticBitrateEnabled - }; - - if (options.enableAuto) { - qualityOptions.push(autoQualityOption); - } - - if (maxStreamingBitrate) { - var selectedIndex = -1; - for (var i = 0, length = qualityOptions.length; i < length; i++) { - var option = qualityOptions[i]; - - if (selectedIndex === -1 && option.bitrate <= maxStreamingBitrate) { - selectedIndex = i; - } - } - - if (selectedIndex === -1) { - selectedIndex = qualityOptions.length - 1; - } - - var currentQualityOption = qualityOptions[selectedIndex]; - - if (!options.isAutomaticBitrateEnabled) { - currentQualityOption.selected = true; - } else { - autoQualityOption.autoText = currentQualityOption.name; - } - } - - return qualityOptions; + if (maxAllowedWidth >= 3800) { + qualityOptions.push({ name: '4K - 120 Mbps', maxHeight: 2160, bitrate: 120000000 }); + qualityOptions.push({ name: '4K - 100 Mbps', maxHeight: 2160, bitrate: 100000000 }); + qualityOptions.push({ name: '4K - 80 Mbps', maxHeight: 2160, bitrate: 80000000 }); } - return { - getVideoQualityOptions: getVideoQualityOptions, - getAudioQualityOptions: getAudioQualityOptions + // Some 1080- videos are reported as 1912? + if (maxAllowedWidth >= 1900) { + qualityOptions.push({ name: '1080p - 60 Mbps', maxHeight: 1080, bitrate: 60000000 }); + qualityOptions.push({ name: '1080p - 50 Mbps', maxHeight: 1080, bitrate: 50000000 }); + qualityOptions.push({ name: '1080p - 40 Mbps', maxHeight: 1080, bitrate: 40000000 }); + qualityOptions.push({ name: '1080p - 30 Mbps', maxHeight: 1080, bitrate: 30000000 }); + qualityOptions.push({ name: '1080p - 25 Mbps', maxHeight: 1080, bitrate: 25000000 }); + qualityOptions.push({ name: '1080p - 20 Mbps', maxHeight: 1080, bitrate: 20000000 }); + qualityOptions.push({ name: '1080p - 15 Mbps', maxHeight: 1080, bitrate: 15000000 }); + qualityOptions.push({ name: '1080p - 10 Mbps', maxHeight: 1080, bitrate: 10000001 }); + qualityOptions.push({ name: '1080p - 8 Mbps', maxHeight: 1080, bitrate: 8000001 }); + qualityOptions.push({ name: '1080p - 6 Mbps', maxHeight: 1080, bitrate: 6000001 }); + qualityOptions.push({ name: '1080p - 5 Mbps', maxHeight: 1080, bitrate: 5000001 }); + qualityOptions.push({ name: '1080p - 4 Mbps', maxHeight: 1080, bitrate: 4000002 }); + } else if (maxAllowedWidth >= 1260) { + qualityOptions.push({ name: '720p - 10 Mbps', maxHeight: 720, bitrate: 10000000 }); + qualityOptions.push({ name: '720p - 8 Mbps', maxHeight: 720, bitrate: 8000000 }); + qualityOptions.push({ name: '720p - 6 Mbps', maxHeight: 720, bitrate: 6000000 }); + qualityOptions.push({ name: '720p - 5 Mbps', maxHeight: 720, bitrate: 5000000 }); + } else if (maxAllowedWidth >= 620) { + qualityOptions.push({ name: '480p - 4 Mbps', maxHeight: 480, bitrate: 4000001 }); + qualityOptions.push({ name: '480p - 3 Mbps', maxHeight: 480, bitrate: 3000001 }); + qualityOptions.push({ name: '480p - 2.5 Mbps', maxHeight: 480, bitrate: 2500000 }); + qualityOptions.push({ name: '480p - 2 Mbps', maxHeight: 480, bitrate: 2000001 }); + qualityOptions.push({ name: '480p - 1.5 Mbps', maxHeight: 480, bitrate: 1500001 }); + } + + if (maxAllowedWidth >= 1260) { + qualityOptions.push({ name: '720p - 4 Mbps', maxHeight: 720, bitrate: 4000000 }); + qualityOptions.push({ name: '720p - 3 Mbps', maxHeight: 720, bitrate: 3000000 }); + qualityOptions.push({ name: '720p - 2 Mbps', maxHeight: 720, bitrate: 2000000 }); + + // The extra 1 is because they're keyed off the bitrate value + qualityOptions.push({ name: '720p - 1.5 Mbps', maxHeight: 720, bitrate: 1500000 }); + qualityOptions.push({ name: '720p - 1 Mbps', maxHeight: 720, bitrate: 1000001 }); + } + + qualityOptions.push({ name: '480p - 1 Mbps', maxHeight: 480, bitrate: 1000000 }); + qualityOptions.push({ name: '480p - 720 kbps', maxHeight: 480, bitrate: 720000 }); + qualityOptions.push({ name: '480p - 420 kbps', maxHeight: 480, bitrate: 420000 }); + qualityOptions.push({ name: '360p', maxHeight: 360, bitrate: 400000 }); + qualityOptions.push({ name: '240p', maxHeight: 240, bitrate: 320000 }); + qualityOptions.push({ name: '144p', maxHeight: 144, bitrate: 192000 }); + + var autoQualityOption = { + name: globalize.translate('Auto'), + bitrate: 0, + selected: options.isAutomaticBitrateEnabled }; -}); + + if (options.enableAuto) { + qualityOptions.push(autoQualityOption); + } + + if (maxStreamingBitrate) { + var selectedIndex = -1; + for (var i = 0, length = qualityOptions.length; i < length; i++) { + var option = qualityOptions[i]; + + if (selectedIndex === -1 && option.bitrate <= maxStreamingBitrate) { + selectedIndex = i; + } + } + + if (selectedIndex === -1) { + selectedIndex = qualityOptions.length - 1; + } + + var currentQualityOption = qualityOptions[selectedIndex]; + + if (!options.isAutomaticBitrateEnabled) { + currentQualityOption.selected = true; + } else { + autoQualityOption.autoText = currentQualityOption.name; + } + } + + return qualityOptions; +} + +export function getAudioQualityOptions(options) { + var maxStreamingBitrate = options.currentMaxBitrate; + + var qualityOptions = []; + + qualityOptions.push({ name: '2 Mbps', bitrate: 2000000 }); + qualityOptions.push({ name: '1.5 Mbps', bitrate: 1500000 }); + qualityOptions.push({ name: '1 Mbps', bitrate: 1000000 }); + qualityOptions.push({ name: '320 kbps', bitrate: 320000 }); + qualityOptions.push({ name: '256 kbps', bitrate: 256000 }); + qualityOptions.push({ name: '192 kbps', bitrate: 192000 }); + qualityOptions.push({ name: '128 kbps', bitrate: 128000 }); + qualityOptions.push({ name: '96 kbps', bitrate: 96000 }); + qualityOptions.push({ name: '64 kbps', bitrate: 64000 }); + + var autoQualityOption = { + name: globalize.translate('Auto'), + bitrate: 0, + selected: options.isAutomaticBitrateEnabled + }; + + if (options.enableAuto) { + qualityOptions.push(autoQualityOption); + } + + if (maxStreamingBitrate) { + var selectedIndex = -1; + for (var i = 0, length = qualityOptions.length; i < length; i++) { + var option = qualityOptions[i]; + + if (selectedIndex === -1 && option.bitrate <= maxStreamingBitrate) { + selectedIndex = i; + } + } + + if (selectedIndex === -1) { + selectedIndex = qualityOptions.length - 1; + } + + var currentQualityOption = qualityOptions[selectedIndex]; + + if (!options.isAutomaticBitrateEnabled) { + currentQualityOption.selected = true; + } else { + autoQualityOption.autoText = currentQualityOption.name; + } + } + + return qualityOptions; +} + +export default { + getVideoQualityOptions, + getAudioQualityOptions +}; diff --git a/src/components/scrollManager.js b/src/components/scrollManager.js index 4ee31a627..549cb9445 100644 --- a/src/components/scrollManager.js +++ b/src/components/scrollManager.js @@ -251,7 +251,7 @@ import layoutManager from 'layoutManager'; * @return {ScrollerData} Scroller data. */ function getScrollerData(scroller, vertical) { - let data = {}; + const data = {}; if (!vertical) { data.scrollPos = scroller.scrollLeft; diff --git a/src/components/subtitlesettings/subtitleappearancehelper.js b/src/components/subtitlesettings/subtitleappearancehelper.js index 904c018bf..1834cafa1 100644 --- a/src/components/subtitlesettings/subtitleappearancehelper.js +++ b/src/components/subtitlesettings/subtitleappearancehelper.js @@ -4,7 +4,7 @@ */ function getTextStyles(settings, preview) { - let list = []; + const list = []; switch (settings.textSize || '') { case 'smaller': @@ -130,14 +130,14 @@ export function getStyles(settings, preview) { function applyStyleList(styles, elem) { for (let i = 0, length = styles.length; i < length; i++) { - let style = styles[i]; + const style = styles[i]; elem.style[style.name] = style.value; } } export function applyStyles(elements, appearanceSettings) { - let styles = getStyles(appearanceSettings, !!elements.preview); + const styles = getStyles(appearanceSettings, !!elements.preview); if (elements.text) { applyStyleList(styles.text, elements.text); diff --git a/src/components/subtitlesettings/subtitlesettings.js b/src/components/subtitlesettings/subtitlesettings.js index 12e230b1e..46760be4c 100644 --- a/src/components/subtitlesettings/subtitlesettings.js +++ b/src/components/subtitlesettings/subtitlesettings.js @@ -23,7 +23,7 @@ import 'css!./subtitlesettings'; */ function getSubtitleAppearanceObject(context) { - let appearanceSettings = {}; + const appearanceSettings = {}; appearanceSettings.textSize = context.querySelector('#selectTextSize').value; appearanceSettings.dropShadow = context.querySelector('#selectDropShadow').value; @@ -41,7 +41,7 @@ function loadForm(context, user, userSettings, appearanceSettings, apiClient) { context.querySelector('.fldBurnIn').classList.remove('hide'); } - let selectSubtitleLanguage = context.querySelector('#selectSubtitleLanguage'); + const selectSubtitleLanguage = context.querySelector('#selectSubtitleLanguage'); settingsHelper.populateLanguages(selectSubtitleLanguage, allCultures); @@ -101,9 +101,9 @@ function save(instance, context, userId, userSettings, apiClient, enableSaveConf } function onSubtitleModeChange(e) { - let view = dom.parentWithClass(e.target, 'subtitlesettings'); + const view = dom.parentWithClass(e.target, 'subtitlesettings'); - let subtitlesHelp = view.querySelectorAll('.subtitlesHelp'); + const subtitlesHelp = view.querySelectorAll('.subtitlesHelp'); for (let i = 0, length = subtitlesHelp.length; i < length; i++) { subtitlesHelp[i].classList.add('hide'); } @@ -111,11 +111,11 @@ function onSubtitleModeChange(e) { } function onAppearanceFieldChange(e) { - let view = dom.parentWithClass(e.target, 'subtitlesettings'); + const view = dom.parentWithClass(e.target, 'subtitlesettings'); - let appearanceSettings = getSubtitleAppearanceObject(view); + const appearanceSettings = getSubtitleAppearanceObject(view); - let elements = { + const elements = { window: view.querySelector('.subtitleappearance-preview-window'), text: view.querySelector('.subtitleappearance-preview-text'), preview: true @@ -226,20 +226,20 @@ export class SubtitleSettings { } loadData() { - let self = this; - let context = self.options.element; + const self = this; + const context = self.options.element; loading.show(); - let userId = self.options.userId; - let apiClient = connectionManager.getApiClient(self.options.serverId); - let userSettings = self.options.userSettings; + const userId = self.options.userId; + const apiClient = connectionManager.getApiClient(self.options.serverId); + const userSettings = self.options.userSettings; apiClient.getUser(userId).then(function (user) { userSettings.setUserInfo(userId, apiClient).then(function () { self.dataLoaded = true; - let appearanceSettings = userSettings.getSubtitleAppearanceSettings(self.options.appearanceKey); + const appearanceSettings = userSettings.getSubtitleAppearanceSettings(self.options.appearanceKey); loadForm(context, user, userSettings, appearanceSettings, apiClient); }); @@ -256,12 +256,12 @@ export class SubtitleSettings { onSubmit(e) { const self = this; - let apiClient = connectionManager.getApiClient(self.options.serverId); - let userId = self.options.userId; - let userSettings = self.options.userSettings; + const apiClient = connectionManager.getApiClient(self.options.serverId); + const userId = self.options.userId; + const userSettings = self.options.userSettings; userSettings.setUserInfo(userId, apiClient).then(function () { - let enableSaveConfirmation = self.options.enableSaveConfirmation; + const enableSaveConfirmation = self.options.enableSaveConfirmation; save(self, self.options.element, userId, userSettings, apiClient, enableSaveConfirmation); }); diff --git a/src/controllers/dashboard/dashboard.js b/src/controllers/dashboard/dashboard.js index 61fc34538..a36aa3ce6 100644 --- a/src/controllers/dashboard/dashboard.js +++ b/src/controllers/dashboard/dashboard.js @@ -24,7 +24,7 @@ import 'emby-itemscontainer'; function showPlaybackInfo(btn, session) { import('alert').then(({default: alert}) => { let title; - let text = []; + const text = []; const displayPlayMethod = playMethodHelper.getDisplayPlayMethod(session); if (displayPlayMethod === 'DirectStream') { diff --git a/src/controllers/dashboard/devices/devices.js b/src/controllers/dashboard/devices/devices.js index 93ae62c43..bc9dd1976 100644 --- a/src/controllers/dashboard/devices/devices.js +++ b/src/controllers/dashboard/devices/devices.js @@ -38,7 +38,7 @@ import 'cardStyle'; } function showDeviceMenu(view, btn, deviceId) { - let menuItems = []; + const menuItems = []; if (canEdit) { menuItems.push({ diff --git a/src/controllers/dashboard/dlna/profile.js b/src/controllers/dashboard/dlna/profile.js index e8b2d9481..478b5ca87 100644 --- a/src/controllers/dashboard/dlna/profile.js +++ b/src/controllers/dashboard/dlna/profile.js @@ -315,7 +315,7 @@ import 'listViewStyle'; let currentType; for (let i = 0, length = profiles.length; i < length; i++) { - let profile = profiles[i]; + const profile = profiles[i]; if (profile.Type !== currentType) { html += '
  • ' + profile.Type + '
    • '; @@ -401,7 +401,7 @@ import 'listViewStyle'; let currentType; for (let i = 0, length = profiles.length; i < length; i++) { - let profile = profiles[i]; + const profile = profiles[i]; if (profile.Type !== currentType) { html += '
  • ' + profile.Type + '
    • '; @@ -472,7 +472,7 @@ import 'listViewStyle'; let currentType; for (let i = 0, length = profiles.length; i < length; i++) { - let profile = profiles[i]; + const profile = profiles[i]; const type = profile.Type.replace('VideoAudio', 'Video Audio'); if (type !== currentType) { diff --git a/src/controllers/dashboard/dlna/profiles.js b/src/controllers/dashboard/dlna/profiles.js index 7fd3bdb52..f1d57eef3 100644 --- a/src/controllers/dashboard/dlna/profiles.js +++ b/src/controllers/dashboard/dlna/profiles.js @@ -36,7 +36,7 @@ import 'emby-button'; } for (let i = 0, length = profiles.length; i < length; i++) { - let profile = profiles[i]; + const profile = profiles[i]; html += '
    '; html += ''; html += '
    '; diff --git a/src/controllers/dashboard/plugins/add/index.js b/src/controllers/dashboard/plugins/add/index.js index 44c46ce11..5cc1dd321 100644 --- a/src/controllers/dashboard/plugins/add/index.js +++ b/src/controllers/dashboard/plugins/add/index.js @@ -8,7 +8,7 @@ function populateHistory(packageInfo, page) { const length = Math.min(packageInfo.versions.length, 10); for (let i = 0; i < length; i++) { - let version = packageInfo.versions[i]; + const version = packageInfo.versions[i]; html += '

    ' + version.version + '

    '; html += '
    ' + version.changelog + '
    '; } diff --git a/src/controllers/dashboard/plugins/repositories/index.js b/src/controllers/dashboard/plugins/repositories/index.js index 2fefb0a9e..c4c088537 100644 --- a/src/controllers/dashboard/plugins/repositories/index.js +++ b/src/controllers/dashboard/plugins/repositories/index.js @@ -105,7 +105,7 @@ export default function(view, params) { }); view.querySelector('.btnNewRepository').addEventListener('click', () => { - let dialog = dialogHelper.createDialog({ + const dialog = dialogHelper.createDialog({ scrollY: false, size: 'large', modal: false, diff --git a/src/controllers/dashboard/scheduledtasks/scheduledtask.js b/src/controllers/dashboard/scheduledtasks/scheduledtask.js index 7944eb8a6..0bf0fc5c3 100644 --- a/src/controllers/dashboard/scheduledtasks/scheduledtask.js +++ b/src/controllers/dashboard/scheduledtasks/scheduledtask.js @@ -33,7 +33,7 @@ import 'emby-select'; const ScheduledTaskPage = { refreshScheduledTask: function (view) { loading.show(); - let id = getParameterByName('id'); + const id = getParameterByName('id'); ApiClient.getScheduledTask(id).then(function (task) { ScheduledTaskPage.loadScheduledTask(view, task); }); @@ -143,7 +143,7 @@ import 'emby-select'; }, deleteTrigger: function (view, index) { loading.show(); - let id = getParameterByName('id'); + const id = getParameterByName('id'); ApiClient.getScheduledTask(id).then(function (task) { task.Triggers.remove(index); ApiClient.updateScheduledTaskTriggers(task.Id, task.Triggers).then(function () { @@ -211,7 +211,7 @@ import 'emby-select'; export default function (view, params) { function onSubmit(e) { loading.show(); - let id = getParameterByName('id'); + const id = getParameterByName('id'); ApiClient.getScheduledTask(id).then(function (task) { task.Triggers.push(ScheduledTaskPage.getTriggerToAdd(view)); ApiClient.updateScheduledTaskTriggers(task.Id, task.Triggers).then(function () { diff --git a/src/controllers/dashboard/scheduledtasks/scheduledtasks.js b/src/controllers/dashboard/scheduledtasks/scheduledtasks.js index af96f34c1..81a34d4fa 100644 --- a/src/controllers/dashboard/scheduledtasks/scheduledtasks.js +++ b/src/controllers/dashboard/scheduledtasks/scheduledtasks.js @@ -103,7 +103,7 @@ import 'emby-button'; } function setTaskButtonIcon(button, icon) { - let inner = button.querySelector('.material-icons'); + const inner = button.querySelector('.material-icons'); inner.classList.remove('stop', 'play_arrow'); inner.classList.add(icon); } @@ -160,7 +160,7 @@ import 'emby-button'; $('.divScheduledTasks', view).on('click', '.btnStartTask', function() { const button = this; - let id = button.getAttribute('data-taskid'); + const id = button.getAttribute('data-taskid'); ApiClient.startScheduledTask(id).then(function() { updateTaskButton(button, 'Running'); reloadList(view); @@ -169,7 +169,7 @@ import 'emby-button'; $('.divScheduledTasks', view).on('click', '.btnStopTask', function() { const button = this; - let id = button.getAttribute('data-taskid'); + const id = button.getAttribute('data-taskid'); ApiClient.stopScheduledTask(id).then(function() { updateTaskButton(button, ''); reloadList(view); diff --git a/src/controllers/itemDetails/index.js b/src/controllers/itemDetails/index.js index b2cdc6323..b3c6a15dc 100644 --- a/src/controllers/itemDetails/index.js +++ b/src/controllers/itemDetails/index.js @@ -374,7 +374,7 @@ import 'emby-select'; } function getArtistLinksHtml(artists, serverId, context) { - let html = []; + const html = []; for (const artist of artists) { const href = appRouter.getRouteUrl(artist, { diff --git a/src/controllers/livetvstatus.js b/src/controllers/livetvstatus.js index f37760808..7555b04b9 100644 --- a/src/controllers/livetvstatus.js +++ b/src/controllers/livetvstatus.js @@ -15,12 +15,10 @@ import 'emby-button'; const enableFocusTransform = !browser.slow && !browser.edge; function getDeviceHtml(device) { - let padderClass; + const padderClass = 'cardPadder-backdrop'; + let cssClass = 'card scalableCard backdropCard backdropCard-scalable'; + const cardBoxCssClass = 'cardBox visualCardBox'; let html = ''; - let cssClass = 'card scalableCard'; - let cardBoxCssClass = 'cardBox visualCardBox'; - cssClass += ' backdropCard backdropCard-scalable'; - padderClass = 'cardPadder-backdrop'; // TODO move card creation code to Card component diff --git a/src/controllers/music/musicrecommended.js b/src/controllers/music/musicrecommended.js index f1ac9833e..94031cd2c 100644 --- a/src/controllers/music/musicrecommended.js +++ b/src/controllers/music/musicrecommended.js @@ -104,7 +104,6 @@ import 'flexStyles'; } var itemsContainer = elem.querySelector('.itemsContainer'); - itemsContainer.innerHTML = cardBuilder.getCardsHtml({ items: result.Items, showUnplayedIndicator: false, diff --git a/src/controllers/playback/video/index.js b/src/controllers/playback/video/index.js index a8bd0e01f..73540cd63 100644 --- a/src/controllers/playback/video/index.js +++ b/src/controllers/playback/video/index.js @@ -172,9 +172,7 @@ import 'css!assets/css/videoosd'; } setTitle(displayItem, parentName); - let titleElement; - const osdTitle = view.querySelector('.osdTitle'); - titleElement = osdTitle; + const titleElement = view.querySelector('.osdTitle'); let displayName = itemHelper.getDisplayName(displayItem, { includeParentInfo: displayItem.Type !== 'Program', includeIndexNumber: displayItem.Type !== 'Program' @@ -1619,7 +1617,7 @@ import 'css!assets/css/videoosd'; const item = currentItem; if (item && item.Chapters && item.Chapters.length && item.Chapters[0].ImageTag) { - let html = getChapterBubbleHtml(connectionManager.getApiClient(item.ServerId), item, item.Chapters, ticks); + const html = getChapterBubbleHtml(connectionManager.getApiClient(item.ServerId), item, item.Chapters, ticks); if (html) { return html; diff --git a/src/elements/emby-checkbox/emby-checkbox.js b/src/elements/emby-checkbox/emby-checkbox.js index d3f24d6f8..84961848c 100644 --- a/src/elements/emby-checkbox/emby-checkbox.js +++ b/src/elements/emby-checkbox/emby-checkbox.js @@ -5,7 +5,7 @@ import 'webcomponents'; /* eslint-disable indent */ - let EmbyCheckboxPrototype = Object.create(HTMLInputElement.prototype); + const EmbyCheckboxPrototype = Object.create(HTMLInputElement.prototype); function onKeyDown(e) { // Don't submit form on enter @@ -26,7 +26,7 @@ import 'webcomponents'; const enableRefreshHack = browser.tizen || browser.orsay || browser.operaTv || browser.web0s ? true : false; function forceRefresh(loading) { - let elem = this.parentNode; + const elem = this.parentNode; elem.style.webkitAnimationName = 'repaintChrome'; elem.style.webkitAnimationDelay = (loading === true ? '500ms' : ''); diff --git a/src/elements/emby-itemrefreshindicator/emby-itemrefreshindicator.js b/src/elements/emby-itemrefreshindicator/emby-itemrefreshindicator.js index 67eacf3db..51f3fc5be 100644 --- a/src/elements/emby-itemrefreshindicator/emby-itemrefreshindicator.js +++ b/src/elements/emby-itemrefreshindicator/emby-itemrefreshindicator.js @@ -40,7 +40,7 @@ import 'webcomponents'; } } - let EmbyItemRefreshIndicatorPrototype = Object.create(EmbyProgressRing); + const EmbyItemRefreshIndicatorPrototype = Object.create(EmbyProgressRing); EmbyItemRefreshIndicatorPrototype.createdCallback = function () { // base method diff --git a/src/elements/emby-itemscontainer/emby-itemscontainer.js b/src/elements/emby-itemscontainer/emby-itemscontainer.js index 691552c07..ef30d1e66 100644 --- a/src/elements/emby-itemscontainer/emby-itemscontainer.js +++ b/src/elements/emby-itemscontainer/emby-itemscontainer.js @@ -18,7 +18,7 @@ import 'webcomponents'; function onClick(e) { const itemsContainer = this; - let multiSelect = itemsContainer.multiSelect; + const multiSelect = itemsContainer.multiSelect; if (multiSelect) { if (multiSelect.onContainerClick.call(itemsContainer, e) === false) { @@ -164,7 +164,7 @@ import 'webcomponents'; } function getEventsToMonitor(itemsContainer) { - let monitor = itemsContainer.getAttribute('data-monitor'); + const monitor = itemsContainer.getAttribute('data-monitor'); if (monitor) { return monitor.split(','); } @@ -356,7 +356,7 @@ import 'webcomponents'; ItemsContainerPrototype.resume = function (options) { this.paused = false; - let refreshIntervalEndTime = this.refreshIntervalEndTime; + const refreshIntervalEndTime = this.refreshIntervalEndTime; if (refreshIntervalEndTime) { const remainingMs = refreshIntervalEndTime - new Date().getTime(); if (remainingMs > 0 && !this.needsRefresh) { @@ -395,7 +395,7 @@ import 'webcomponents'; return; } - let timeout = this.refreshTimeout; + const timeout = this.refreshTimeout; if (timeout) { clearTimeout(timeout); } @@ -434,7 +434,7 @@ import 'webcomponents'; function onDataFetched(result) { const items = result.Items || result; - let parentContainer = this.parentContainer; + const parentContainer = this.parentContainer; if (parentContainer) { if (items.length) { parentContainer.classList.remove('hide'); diff --git a/src/elements/emby-playstatebutton/emby-playstatebutton.js b/src/elements/emby-playstatebutton/emby-playstatebutton.js index 7b5c34409..322b7b372 100644 --- a/src/elements/emby-playstatebutton/emby-playstatebutton.js +++ b/src/elements/emby-playstatebutton/emby-playstatebutton.js @@ -75,7 +75,7 @@ import EmbyButtonPrototype from 'emby-button'; button.title = globalize.translate('Played'); } - let text = button.querySelector('.button-text'); + const text = button.querySelector('.button-text'); if (text) { text.innerHTML = button.title; } diff --git a/src/elements/emby-progressbar/emby-progressbar.js b/src/elements/emby-progressbar/emby-progressbar.js index 54fcb1999..e232bbcde 100644 --- a/src/elements/emby-progressbar/emby-progressbar.js +++ b/src/elements/emby-progressbar/emby-progressbar.js @@ -1,6 +1,6 @@ /* eslint-disable indent */ - let ProgressBarPrototype = Object.create(HTMLDivElement.prototype); + const ProgressBarPrototype = Object.create(HTMLDivElement.prototype); function onAutoTimeProgress() { const start = parseInt(this.getAttribute('data-starttime')); diff --git a/src/elements/emby-progressring/emby-progressring.js b/src/elements/emby-progressring/emby-progressring.js index 10db8b9a2..929b80a57 100644 --- a/src/elements/emby-progressring/emby-progressring.js +++ b/src/elements/emby-progressring/emby-progressring.js @@ -3,7 +3,7 @@ import 'webcomponents'; /* eslint-disable indent */ - let EmbyProgressRing = Object.create(HTMLDivElement.prototype); + const EmbyProgressRing = Object.create(HTMLDivElement.prototype); EmbyProgressRing.createdCallback = function () { this.classList.add('progressring'); @@ -79,7 +79,7 @@ import 'webcomponents'; }; EmbyProgressRing.detachedCallback = function () { - let observer = this.observer; + const observer = this.observer; if (observer) { // later, you can stop observing diff --git a/src/elements/emby-radio/emby-radio.js b/src/elements/emby-radio/emby-radio.js index b31d43644..6fd252908 100644 --- a/src/elements/emby-radio/emby-radio.js +++ b/src/elements/emby-radio/emby-radio.js @@ -4,7 +4,7 @@ import 'webcomponents'; /* eslint-disable indent */ - let EmbyRadioPrototype = Object.create(HTMLInputElement.prototype); + const EmbyRadioPrototype = Object.create(HTMLInputElement.prototype); function onKeyDown(e) { // Don't submit form on enter @@ -35,7 +35,7 @@ import 'webcomponents'; this.classList.add('mdl-radio__button'); - let labelElement = this.parentNode; + const labelElement = this.parentNode; labelElement.classList.add('mdl-radio'); labelElement.classList.add('mdl-js-radio'); labelElement.classList.add('mdl-js-ripple-effect'); @@ -43,7 +43,7 @@ import 'webcomponents'; labelElement.classList.add('show-focus'); } - let labelTextElement = labelElement.querySelector('span'); + const labelTextElement = labelElement.querySelector('span'); labelTextElement.classList.add('radioButtonLabel'); labelTextElement.classList.add('mdl-radio__label'); diff --git a/src/elements/emby-scrollbuttons/emby-scrollbuttons.js b/src/elements/emby-scrollbuttons/emby-scrollbuttons.js index fcff58739..f7665c061 100644 --- a/src/elements/emby-scrollbuttons/emby-scrollbuttons.js +++ b/src/elements/emby-scrollbuttons/emby-scrollbuttons.js @@ -118,7 +118,7 @@ const EmbyScrollButtonsPrototype = Object.create(HTMLDivElement.prototype); } function onScrollButtonClick(e) { - let scroller = this.parentNode.nextSibling; + const scroller = this.parentNode.nextSibling; const direction = this.getAttribute('data-direction'); const scrollSize = getScrollSize(scroller); @@ -161,7 +161,7 @@ const EmbyScrollButtonsPrototype = Object.create(HTMLDivElement.prototype); const parent = this.scroller; this.scroller = null; - let scrollHandler = this.scrollHandler; + const scrollHandler = this.scrollHandler; if (parent && scrollHandler) { parent.removeScrollEventListener(scrollHandler, { capture: false, diff --git a/src/elements/emby-scroller/emby-scroller.js b/src/elements/emby-scroller/emby-scroller.js index fb903d839..d7133e317 100644 --- a/src/elements/emby-scroller/emby-scroller.js +++ b/src/elements/emby-scroller/emby-scroller.js @@ -9,7 +9,7 @@ import 'css!./emby-scroller'; /* eslint-disable indent */ - let ScrollerPrototype = Object.create(HTMLDivElement.prototype); + const ScrollerPrototype = Object.create(HTMLDivElement.prototype); ScrollerPrototype.createdCallback = function () { this.classList.add('emby-scroller'); diff --git a/src/elements/emby-slider/emby-slider.js b/src/elements/emby-slider/emby-slider.js index b39e24f5e..40d2e69bb 100644 --- a/src/elements/emby-slider/emby-slider.js +++ b/src/elements/emby-slider/emby-slider.js @@ -8,7 +8,7 @@ import 'emby-input'; /* eslint-disable indent */ - let EmbySliderPrototype = Object.create(HTMLInputElement.prototype); + const EmbySliderPrototype = Object.create(HTMLInputElement.prototype); let supportsValueSetOverride = false; @@ -94,7 +94,7 @@ import 'emby-input'; // Keep only one per slider frame request cancelAnimationFrame(range.updateValuesFrame); range.updateValuesFrame = requestAnimationFrame(function () { - let backgroundLower = range.backgroundLower; + const backgroundLower = range.backgroundLower; if (backgroundLower) { let fraction = (value - range.min) / (range.max - range.min); diff --git a/src/elements/emby-tabs/emby-tabs.js b/src/elements/emby-tabs/emby-tabs.js index 320a14e2c..db7ad56f5 100644 --- a/src/elements/emby-tabs/emby-tabs.js +++ b/src/elements/emby-tabs/emby-tabs.js @@ -8,7 +8,7 @@ import 'scrollStyles'; /* eslint-disable indent */ - let EmbyTabs = Object.create(HTMLDivElement.prototype); + const EmbyTabs = Object.create(HTMLDivElement.prototype); const buttonClass = 'emby-tab-button'; const activeButtonClass = buttonClass + '-active'; @@ -21,7 +21,7 @@ import 'scrollStyles'; } function removeActivePanelClass(tabs, index) { - let tabPanel = getTabPanel(tabs, index); + const tabPanel = getTabPanel(tabs, index); if (tabPanel) { tabPanel.classList.remove('is-active'); } @@ -52,7 +52,7 @@ import 'scrollStyles'; removeActivePanelClass(tabs, previousIndex); } - let newPanel = getTabPanel(tabs, index); + const newPanel = getTabPanel(tabs, index); if (newPanel) { // animate new panel ? @@ -225,7 +225,7 @@ import 'scrollStyles'; } })); - let currentTabButton = tabButtons[current]; + const currentTabButton = tabButtons[current]; setActiveTabButton(tabs, tabButtons[selected], currentTabButton, false); if (current !== selected && currentTabButton) { diff --git a/src/plugins/bookPlayer/plugin.js b/src/plugins/bookPlayer/plugin.js index c167046cb..415bd7b95 100644 --- a/src/plugins/bookPlayer/plugin.js +++ b/src/plugins/bookPlayer/plugin.js @@ -27,16 +27,16 @@ export class BookPlayer { this._loaded = false; loading.show(); - let elem = this.createMediaElement(); + const elem = this.createMediaElement(); return this.setCurrentSrc(elem, options); } stop() { this.unbindEvents(); - let elem = this._mediaElement; - let tocElement = this._tocElement; - let rendition = this._rendition; + const elem = this._mediaElement; + const tocElement = this._tocElement; + const rendition = this._rendition; if (elem) { dialogHelper.close(elem); @@ -93,11 +93,11 @@ export class BookPlayer { } onWindowKeyUp(e) { - let key = keyboardnavigation.getKeyName(e); + const key = keyboardnavigation.getKeyName(e); // TODO: depending on the event this can be the document or the rendition itself - let rendition = this._rendition || this; - let book = rendition.book; + const rendition = this._rendition || this; + const book = rendition.book; if (this._loaded === false) return; switch (key) { @@ -125,8 +125,8 @@ export class BookPlayer { onTouchStart(e) { // TODO: depending on the event this can be the document or the rendition itself - let rendition = this._rendition || this; - let book = rendition.book; + const rendition = this._rendition || this; + const book = rendition.book; // check that the event is from the book or the document if (!book || this._loaded === false) return; @@ -134,7 +134,8 @@ export class BookPlayer { // epubjs stores pages off the screen or something for preloading // get the modulus of the touch event to account for the increased width if (!e.touches || e.touches.length === 0) return; - let touch = e.touches[0].clientX % dom.getWindowSize().innerWidth; + + const touch = e.touches[0].clientX % dom.getWindowSize().innerWidth; if (touch < dom.getWindowSize().innerWidth / 2) { book.package.metadata.direction === 'rtl' ? rendition.next() : rendition.prev(); } else { @@ -147,7 +148,7 @@ export class BookPlayer { } bindMediaElementEvents() { - let elem = this._mediaElement; + const elem = this._mediaElement; elem.addEventListener('close', this.onDialogClosed, {once: true}); elem.querySelector('.btnBookplayerExit').addEventListener('click', this.onDialogClosed, {once: true}); @@ -166,7 +167,7 @@ export class BookPlayer { } unbindMediaElementEvents() { - let elem = this._mediaElement; + const elem = this._mediaElement; elem.removeEventListener('close', this.onDialogClosed); elem.querySelector('.btnBookplayerExit').removeEventListener('click', this.onDialogClosed); @@ -231,7 +232,7 @@ export class BookPlayer { } setCurrentSrc(elem, options) { - let item = options.items[0]; + const item = options.items[0]; this._currentItem = item; this.streamInfo = { started: true, @@ -241,25 +242,25 @@ export class BookPlayer { } }; - let serverId = item.ServerId; - let apiClient = connectionManager.getApiClient(serverId); + const serverId = item.ServerId; + const apiClient = connectionManager.getApiClient(serverId); return new Promise((resolve, reject) => { import('epubjs').then(({default: epubjs}) => { - let downloadHref = apiClient.getItemDownloadUrl(item.Id); - let book = epubjs(downloadHref, {openAs: 'epub'}); - let rendition = book.renderTo(elem, {width: '100%', height: '97%'}); + const downloadHref = apiClient.getItemDownloadUrl(item.Id); + const book = epubjs(downloadHref, {openAs: 'epub'}); + const rendition = book.renderTo(elem, {width: '100%', height: '97%'}); this._currentSrc = downloadHref; this._rendition = rendition; - let cancellationToken = { + const cancellationToken = { shouldCancel: false }; this._cancellationToken = cancellationToken; return rendition.display().then(() => { - let epubElem = document.querySelector('.epub-container'); + const epubElem = document.querySelector('.epub-container'); epubElem.style.display = 'none'; this.bindEvents(); diff --git a/src/plugins/bookPlayer/tableOfContents.js b/src/plugins/bookPlayer/tableOfContents.js index 23e288aff..a1c5d8f22 100644 --- a/src/plugins/bookPlayer/tableOfContents.js +++ b/src/plugins/bookPlayer/tableOfContents.js @@ -11,7 +11,7 @@ export default class TableOfContents { } destroy() { - let elem = this._elem; + const elem = this._elem; if (elem) { this.unbindEvents(); dialogHelper.close(elem); @@ -21,14 +21,14 @@ export default class TableOfContents { } bindEvents() { - let elem = this._elem; + const elem = this._elem; elem.addEventListener('close', this.onDialogClosed, {once: true}); elem.querySelector('.btnBookplayerTocClose').addEventListener('click', this.onDialogClosed, {once: true}); } unbindEvents() { - let elem = this._elem; + const elem = this._elem; elem.removeEventListener('close', this.onDialogClosed); elem.querySelector('.btnBookplayerTocClose').removeEventListener('click', this.onDialogClosed); @@ -39,10 +39,10 @@ export default class TableOfContents { } replaceLinks(contents, f) { - let links = contents.querySelectorAll('a[href]'); + const links = contents.querySelectorAll('a[href]'); links.forEach((link) => { - let href = link.getAttribute('href'); + const href = link.getAttribute('href'); link.onclick = () => { f(href); @@ -52,9 +52,9 @@ export default class TableOfContents { } createMediaElement() { - let rendition = this._rendition; + const rendition = this._rendition; - let elem = dialogHelper.createDialog({ + const elem = dialogHelper.createDialog({ size: 'small', autoFocus: false, removeOnClose: true @@ -69,7 +69,7 @@ export default class TableOfContents { rendition.book.navigation.forEach((chapter) => { tocHtml += '
  • '; // Remove '../' from href - let link = chapter.href.startsWith('../') ? chapter.href.substr(3) : chapter.href; + const link = chapter.href.startsWith('../') ? chapter.href.substr(3) : chapter.href; tocHtml += `${chapter.label}`; tocHtml += '
    • '; }); @@ -78,7 +78,7 @@ export default class TableOfContents { elem.innerHTML = tocHtml; this.replaceLinks(elem, (href) => { - let relative = rendition.book.path.relative(href); + const relative = rendition.book.path.relative(href); rendition.display(relative); this.destroy(); }); diff --git a/src/plugins/experimentalWarnings/plugin.js b/src/plugins/experimentalWarnings/plugin.js index c39612d45..76b45fad4 100644 --- a/src/plugins/experimentalWarnings/plugin.js +++ b/src/plugins/experimentalWarnings/plugin.js @@ -1,6 +1,8 @@ define(['connectionManager', 'globalize', 'userSettings', 'apphost'], function (connectionManager, globalize, userSettings, appHost) { 'use strict'; + appHost = appHost.default || appHost; + // TODO: Replace with date-fns // https://stackoverflow.com/questions/6117814/get-week-of-year-in-javascript-like-in-php function getWeek(date) { diff --git a/src/plugins/htmlVideoPlayer/plugin.js b/src/plugins/htmlVideoPlayer/plugin.js index 525372ac8..ba497729b 100644 --- a/src/plugins/htmlVideoPlayer/plugin.js +++ b/src/plugins/htmlVideoPlayer/plugin.js @@ -105,7 +105,7 @@ function tryRemoveElement(elem) { } function hidePrePlaybackPage() { - let animatedPage = document.querySelector('.page:not(.hide)'); + const animatedPage = document.querySelector('.page:not(.hide)'); animatedPage.classList.add('hide'); // At this point, we must hide the scrollbar placeholder, so it's not being displayed while the item is being loaded document.body.classList.remove('force-scroll'); @@ -1299,7 +1299,7 @@ function tryRemoveElement(elem) { } let html = ''; - let cssClass = 'htmlvideoplayer'; + const cssClass = 'htmlvideoplayer'; // Can't autoplay in these browsers so we need to use the full controls, at least until playback starts if (!appHost.supports('htmlvideoautoplay')) { diff --git a/src/scripts/apploader.js b/src/scripts/apploader.js index 183b765d1..e98c82e69 100644 --- a/src/scripts/apploader.js +++ b/src/scripts/apploader.js @@ -1,12 +1,10 @@ (function() { - 'use strict'; - function injectScriptElement(src, onload) { if (!src) { return; } - var script = document.createElement('script'); + const script = document.createElement('script'); if (self.dashboardVersion) { src += `?v=${self.dashboardVersion}`; } diff --git a/src/scripts/datetime.js b/src/scripts/datetime.js index dcac41089..c6baa28ed 100644 --- a/src/scripts/datetime.js +++ b/src/scripts/datetime.js @@ -24,7 +24,7 @@ import globalize from 'globalize'; // parse strings, leading zeros into proper ints const a = [1, 2, 3, 4, 5, 6, 10, 11]; - for (let i in a) { + for (const i in a) { d[a[i]] = parseInt(d[a[i]], 10); } d[7] = parseFloat(d[7]); diff --git a/src/scripts/deleteHelper.js b/src/scripts/deleteHelper.js index e10a1568c..44876c75b 100644 --- a/src/scripts/deleteHelper.js +++ b/src/scripts/deleteHelper.js @@ -15,7 +15,7 @@ export function deleteItem(options) { const item = options.item; const parentId = item.SeasonId || item.SeriesId || item.ParentId; - let apiClient = connectionManager.getApiClient(item.ServerId); + const apiClient = connectionManager.getApiClient(item.ServerId); return confirm({ @@ -34,7 +34,7 @@ export function deleteItem(options) { } } }, function (err) { - let result = function () { + const result = function () { return Promise.reject(err); }; diff --git a/src/scripts/gamepadtokey.js b/src/scripts/gamepadtokey.js index 870429ee0..28103bb2d 100644 --- a/src/scripts/gamepadtokey.js +++ b/src/scripts/gamepadtokey.js @@ -22,6 +22,8 @@ require(['apphost'], function (appHost) { 'use strict'; + appHost = appHost.default || appHost; + var _GAMEPAD_A_BUTTON_INDEX = 0; var _GAMEPAD_B_BUTTON_INDEX = 1; var _GAMEPAD_DPAD_UP_BUTTON_INDEX = 12; diff --git a/src/scripts/globalize.js b/src/scripts/globalize.js index 4af1ea6cb..d237fdcce 100644 --- a/src/scripts/globalize.js +++ b/src/scripts/globalize.js @@ -63,11 +63,11 @@ import events from 'events'; } function ensureTranslations(culture) { - for (let i in allTranslations) { + for (const i in allTranslations) { ensureTranslation(allTranslations[i], culture); } if (culture !== fallbackCulture) { - for (let i in allTranslations) { + for (const i in allTranslations) { ensureTranslation(allTranslations[i], fallbackCulture); } } diff --git a/src/scripts/inputManager.js b/src/scripts/inputManager.js index 3432c9e35..077af39bf 100644 --- a/src/scripts/inputManager.js +++ b/src/scripts/inputManager.js @@ -39,7 +39,7 @@ import appHost from 'apphost'; dom.removeEventListener(scope, 'command', fn, {}); } - let commandTimes = {}; + const commandTimes = {}; function checkCommandTime(command) { const last = commandTimes[command] || 0; diff --git a/src/scripts/site.js b/src/scripts/site.js index d01e2042e..8c990077f 100644 --- a/src/scripts/site.js +++ b/src/scripts/site.js @@ -271,17 +271,16 @@ function initClient() { } function createConnectionManager() { - return require(['connectionManagerFactory', 'apphost', 'credentialprovider', 'events', 'userSettings'], function (ConnectionManager, apphost, credentialProvider, events, userSettings) { + return require(['connectionManagerFactory', 'apphost', 'credentialprovider', 'events', 'userSettings'], function (ConnectionManager, appHost, credentialProvider, events, userSettings) { + appHost = appHost.default || appHost; + var credentialProviderInstance = new credentialProvider(); - var promises = [apphost.getSyncProfile(), apphost.init()]; + var promises = [appHost.init()]; return Promise.all(promises).then(function (responses) { - var deviceProfile = responses[0]; - var capabilities = Dashboard.capabilities(apphost); + var capabilities = Dashboard.capabilities(appHost); - capabilities.DeviceProfile = deviceProfile; - - var connectionManager = new ConnectionManager(credentialProviderInstance, apphost.appName(), apphost.appVersion(), apphost.deviceName(), apphost.deviceId(), capabilities); + var connectionManager = new ConnectionManager(credentialProviderInstance, appHost.appName(), appHost.appVersion(), appHost.deviceName(), appHost.deviceId(), capabilities); defineConnectionManager(connectionManager); bindConnectionManagerEvents(connectionManager, events, userSettings); @@ -292,7 +291,7 @@ function initClient() { return require(['apiclient'], function (apiClientFactory) { console.debug('creating ApiClient singleton'); - var apiClient = new apiClientFactory(Dashboard.serverAddress(), apphost.appName(), apphost.appVersion(), apphost.deviceName(), apphost.deviceId()); + var apiClient = new apiClientFactory(Dashboard.serverAddress(), appHost.appName(), appHost.appVersion(), appHost.deviceName(), appHost.deviceId()); apiClient.enableAutomaticNetworking = false; apiClient.manualAddressOnly = true; @@ -351,6 +350,7 @@ function initClient() { function getLayoutManager(layoutManager, appHost) { layoutManager = layoutManager.default || layoutManager; + appHost = appHost.default || appHost; if (appHost.getDefaultLayout) { layoutManager.defaultLayout = appHost.getDefaultLayout(); } @@ -470,6 +470,8 @@ function initClient() { } require(['apphost', 'css!assets/css/librarybrowser'], function (appHost) { + appHost = appHost.default || appHost; + loadPlugins(appHost, browser).then(function () { onAppReady(browser); }); @@ -518,6 +520,8 @@ function initClient() { // ensure that appHost is loaded in this point require(['apphost', 'appRouter'], function (appHost, appRouter) { + appHost = appHost.default || appHost; + window.Emby = {}; console.debug('onAppReady: loading dependencies');