From 257ce4974ebee7c0977ae95cba4269805f6f8b77 Mon Sep 17 00:00:00 2001 From: Christoph Potas Date: Sun, 3 May 2020 20:30:35 +0200 Subject: [PATCH 001/244] ~ migrate subtitlesettings.js to es6 ~ migrate subtitleappearancehelper.js to es6 ~ replace duplicated "populateLanguages" function ( playbacksettings.js:18 ) ~ replace duplicated "onSubmit" function ( playbacksettings.js:266 ) - remove empty function getWindowStyles Signed-off-by: Christoph Potas --- package.json | 2 + .../subtitleappearancehelper.js | 242 ++++++------- .../subtitlesettings/subtitlesettings.js | 330 +++++++++--------- 3 files changed, 276 insertions(+), 298 deletions(-) diff --git a/package.json b/package.json index 53f3d225a8..fda29b810c 100644 --- a/package.json +++ b/package.json @@ -90,6 +90,8 @@ "test": [ "src/components/autoFocuser.js", "src/components/cardbuilder/cardBuilder.js", + "src/components/subtitlesettings/subtitlesettings.js", + "src/components/subtitlesettings/subtitleappearancehelper.js", "src/scripts/dom.js", "src/components/filedownloader.js", "src/scripts/filesystem.js", diff --git a/src/components/subtitlesettings/subtitleappearancehelper.js b/src/components/subtitlesettings/subtitleappearancehelper.js index fdc64f0dfa..7bf4737831 100644 --- a/src/components/subtitlesettings/subtitleappearancehelper.js +++ b/src/components/subtitlesettings/subtitleappearancehelper.js @@ -1,159 +1,149 @@ -define([], function () { - "use strict"; +function getTextStyles(settings, isCue) { - function getTextStyles(settings, isCue) { + let list = []; - var list = []; + if (isCue) { + switch (settings.textSize || '') { - if (isCue) { - switch (settings.textSize || '') { - - case 'smaller': - list.push({ name: 'font-size', value: '.5em' }); - break; - case 'small': - list.push({ name: 'font-size', value: '.7em' }); - break; - case 'large': - list.push({ name: 'font-size', value: '1.3em' }); - break; - case 'larger': - list.push({ name: 'font-size', value: '1.72em' }); - break; - case 'extralarge': - list.push({ name: 'font-size', value: '2em' }); - break; - default: - case 'medium': - break; - } - } else { - switch (settings.textSize || '') { - - case 'smaller': - list.push({ name: 'font-size', value: '.8em' }); - break; - case 'small': - list.push({ name: 'font-size', value: 'inherit' }); - break; - case 'larger': - list.push({ name: 'font-size', value: '2em' }); - break; - case 'extralarge': - list.push({ name: 'font-size', value: '2.2em' }); - break; - case 'large': - list.push({ name: 'font-size', value: '1.72em' }); - break; - default: - case 'medium': - list.push({ name: 'font-size', value: '1.36em' }); - break; - } - } - - switch (settings.dropShadow || '') { - - case 'raised': - list.push({ name: 'text-shadow', value: '-1px -1px white, 0px -1px white, -1px 0px white, 1px 1px black, 0px 1px black, 1px 0px black' }); + case 'smaller': + list.push({ name: 'font-size', value: '.5em' }); break; - case 'depressed': - list.push({ name: 'text-shadow', value: '1px 1px white, 0px 1px white, 1px 0px white, -1px -1px black, 0px -1px black, -1px 0px black' }); + case 'small': + list.push({ name: 'font-size', value: '.7em' }); break; - case 'uniform': - list.push({ name: 'text-shadow', value: '-1px 0px #000000, 0px 1px #000000, 1px 0px #000000, 0px -1px #000000' }); + case 'large': + list.push({ name: 'font-size', value: '1.3em' }); break; - case 'none': - list.push({ name: 'text-shadow', value: 'none' }); + case 'larger': + list.push({ name: 'font-size', value: '1.72em' }); + break; + case 'extralarge': + list.push({ name: 'font-size', value: '2em' }); break; default: - case 'dropshadow': - list.push({ name: 'text-shadow', value: '#000000 0px 0px 7px' }); + case 'medium': break; } + } else { + switch (settings.textSize || '') { - var background = settings.textBackground || 'transparent'; - if (background) { - list.push({ name: 'background-color', value: background }); - } - - var textColor = settings.textColor || '#ffffff'; - if (textColor) { - list.push({ name: 'color', value: textColor }); - } - - switch (settings.font || '') { - - case 'typewriter': - list.push({ name: 'font-family', value: '"Courier New",monospace' }); - list.push({ name: 'font-variant', value: 'none' }); + case 'smaller': + list.push({ name: 'font-size', value: '.8em' }); break; - case 'print': - list.push({ name: 'font-family', value: 'Georgia,Times New Roman,Arial,Helvetica,serif' }); - list.push({ name: 'font-variant', value: 'none' }); + case 'small': + list.push({ name: 'font-size', value: 'inherit' }); break; - case 'console': - list.push({ name: 'font-family', value: 'Consolas,Lucida Console,Menlo,Monaco,monospace' }); - list.push({ name: 'font-variant', value: 'none' }); + case 'larger': + list.push({ name: 'font-size', value: '2em' }); break; - case 'cursive': - list.push({ name: 'font-family', value: 'Lucida Handwriting,Brush Script MT,Segoe Script,cursive,Quintessential,system-ui,-apple-system,BlinkMacSystemFont,sans-serif' }); - list.push({ name: 'font-variant', value: 'none' }); + case 'extralarge': + list.push({ name: 'font-size', value: '2.2em' }); break; - case 'casual': - list.push({ name: 'font-family', value: 'Gabriola,Segoe Print,Comic Sans MS,Chalkboard,Short Stack,system-ui,-apple-system,BlinkMacSystemFont,sans-serif' }); - list.push({ name: 'font-variant', value: 'none' }); - break; - case 'smallcaps': - list.push({ name: 'font-family', value: 'Copperplate Gothic,Copperplate Gothic Bold,Copperplate,system-ui,-apple-system,BlinkMacSystemFont,sans-serif' }); - list.push({ name: 'font-variant', value: 'small-caps' }); + case 'large': + list.push({ name: 'font-size', value: '1.72em' }); break; default: - list.push({ name: 'font-family', value: 'inherit' }); - list.push({ name: 'font-variant', value: 'none' }); + case 'medium': + list.push({ name: 'font-size', value: '1.36em' }); break; } - - return list; } - function getWindowStyles(settings) { + switch (settings.dropShadow || '') { - return []; + case 'raised': + list.push({ name: 'text-shadow', value: '-1px -1px white, 0px -1px white, -1px 0px white, 1px 1px black, 0px 1px black, 1px 0px black' }); + break; + case 'depressed': + list.push({ name: 'text-shadow', value: '1px 1px white, 0px 1px white, 1px 0px white, -1px -1px black, 0px -1px black, -1px 0px black' }); + break; + case 'uniform': + list.push({ name: 'text-shadow', value: '-1px 0px #000000, 0px 1px #000000, 1px 0px #000000, 0px -1px #000000' }); + break; + case 'none': + list.push({ name: 'text-shadow', value: 'none' }); + break; + default: + case 'dropshadow': + list.push({ name: 'text-shadow', value: '#000000 0px 0px 7px' }); + break; } - function getStyles(settings, isCue) { - - return { - text: getTextStyles(settings, isCue), - window: getWindowStyles(settings) - }; + const background = settings.textBackground || 'transparent'; + if (background) { + list.push({ name: 'background-color', value: background }); } - function applyStyleList(styles, elem) { - - for (var i = 0, length = styles.length; i < length; i++) { - - var style = styles[i]; - - elem.style[style.name] = style.value; - } + const textColor = settings.textColor || '#ffffff'; + if (textColor) { + list.push({ name: 'color', value: textColor }); } - function applyStyles(elements, appearanceSettings) { + switch (settings.font || '') { - var styles = getStyles(appearanceSettings); - - if (elements.text) { - applyStyleList(styles.text, elements.text); - } - if (elements.window) { - applyStyleList(styles.window, elements.window); - } + case 'typewriter': + list.push({ name: 'font-family', value: '"Courier New",monospace' }); + list.push({ name: 'font-variant', value: 'none' }); + break; + case 'print': + list.push({ name: 'font-family', value: 'Georgia,Times New Roman,Arial,Helvetica,serif' }); + list.push({ name: 'font-variant', value: 'none' }); + break; + case 'console': + list.push({ name: 'font-family', value: 'Consolas,Lucida Console,Menlo,Monaco,monospace' }); + list.push({ name: 'font-variant', value: 'none' }); + break; + case 'cursive': + list.push({ name: 'font-family', value: 'Lucida Handwriting,Brush Script MT,Segoe Script,cursive,Quintessential,system-ui,-apple-system,BlinkMacSystemFont,sans-serif' }); + list.push({ name: 'font-variant', value: 'none' }); + break; + case 'casual': + list.push({ name: 'font-family', value: 'Gabriola,Segoe Print,Comic Sans MS,Chalkboard,Short Stack,system-ui,-apple-system,BlinkMacSystemFont,sans-serif' }); + list.push({ name: 'font-variant', value: 'none' }); + break; + case 'smallcaps': + list.push({ name: 'font-family', value: 'Copperplate Gothic,Copperplate Gothic Bold,Copperplate,system-ui,-apple-system,BlinkMacSystemFont,sans-serif' }); + list.push({ name: 'font-variant', value: 'small-caps' }); + break; + default: + list.push({ name: 'font-family', value: 'inherit' }); + list.push({ name: 'font-variant', value: 'none' }); + break; } + return list; +} + +export function getStyles(settings, isCue) { + return { - getStyles: getStyles, - applyStyles: applyStyles + text: getTextStyles(settings, isCue), + window: [] }; -}); +} + +function applyStyleList(styles, elem) { + + for (let i = 0, length = styles.length; i < length; i++) { + + let style = styles[i]; + + elem.style[style.name] = style.value; + } +} + +export function applyStyles(elements, appearanceSettings) { + + let styles = getStyles(appearanceSettings); + + if (elements.text) { + applyStyleList(styles.text, elements.text); + } + if (elements.window) { + applyStyleList(styles.window, elements.window); + } +} +export default { + getStyles: getStyles, + applyStyles: applyStyles +}; diff --git a/src/components/subtitlesettings/subtitlesettings.js b/src/components/subtitlesettings/subtitlesettings.js index 2c86929192..8f5038fd65 100644 --- a/src/components/subtitlesettings/subtitlesettings.js +++ b/src/components/subtitlesettings/subtitlesettings.js @@ -1,213 +1,199 @@ -define(['require', 'globalize', 'appSettings', 'apphost', 'focusManager', 'loading', 'connectionManager', 'subtitleAppearanceHelper', 'dom', 'events', 'listViewStyle', 'emby-select', 'emby-input', 'emby-checkbox', 'flexStyles'], function (require, globalize, appSettings, appHost, focusManager, loading, connectionManager, subtitleAppearanceHelper, dom, events) { - "use strict"; +import require from 'require'; +import globalize from 'globalize'; +import appHost from 'apphost'; +import appSettings from 'appSettings'; +import focusManager from 'focusManager'; +import loading from 'loading'; +import connectionManager from 'connectionmanager'; +import subtitleAppearanceHelper from 'subtitleappearancehelper'; +import playbacksettings from 'playbacksettings'; +import dom from 'dom'; +import events from 'events'; +import 'listViewStyle'; +import 'emby-select'; +import 'emby-input'; +import 'emby-checkbox'; +import 'flexStyles'; - function populateLanguages(select, languages) { - var html = ""; +function getSubtitleAppearanceObject(context) { + let appearanceSettings = {}; - html += ""; - for (var i = 0, length = languages.length; i < length; i++) { - var culture = languages[i]; - html += ""; + appearanceSettings.textSize = context.querySelector('#selectTextSize').value; + appearanceSettings.dropShadow = context.querySelector('#selectDropShadow').value; + appearanceSettings.font = context.querySelector('#selectFont').value; + appearanceSettings.textBackground = context.querySelector('#inputTextBackground').value; + appearanceSettings.textColor = context.querySelector('#inputTextColor').value; + + return appearanceSettings; +} + +function loadForm(context, user, userSettings, appearanceSettings, apiClient) { + + apiClient.getCultures().then(function (allCultures) { + + if (appHost.supports('subtitleburnsettings') && user.Policy.EnableVideoPlaybackTranscoding) { + context.querySelector('.fldBurnIn').classList.remove('hide'); } - select.innerHTML = html; - } + let selectSubtitleLanguage = context.querySelector( '#selectSubtitleLanguage' ); - function getSubtitleAppearanceObject(context) { - var appearanceSettings = {}; + playbacksettings.populateLanguages(selectSubtitleLanguage, allCultures); - appearanceSettings.textSize = context.querySelector('#selectTextSize').value; - appearanceSettings.dropShadow = context.querySelector('#selectDropShadow').value; - appearanceSettings.font = context.querySelector('#selectFont').value; - appearanceSettings.textBackground = context.querySelector('#inputTextBackground').value; - appearanceSettings.textColor = context.querySelector('#inputTextColor').value; + selectSubtitleLanguage.value = user.Configuration.SubtitleLanguagePreference || ""; + context.querySelector('#selectSubtitlePlaybackMode').value = user.Configuration.SubtitleMode || ""; - return appearanceSettings; - } + context.querySelector('#selectSubtitlePlaybackMode').dispatchEvent(new CustomEvent('change', {})); - function loadForm(context, user, userSettings, appearanceSettings, apiClient) { + context.querySelector('#selectTextSize').value = appearanceSettings.textSize || ''; + context.querySelector('#selectDropShadow').value = appearanceSettings.dropShadow || ''; + context.querySelector('#inputTextBackground').value = appearanceSettings.textBackground || 'transparent'; + context.querySelector('#inputTextColor').value = appearanceSettings.textColor || '#ffffff'; + context.querySelector('#selectFont').value = appearanceSettings.font || ''; - apiClient.getCultures().then(function (allCultures) { + context.querySelector('#selectSubtitleBurnIn').value = appSettings.get('subtitleburnin') || ''; - if (appHost.supports('subtitleburnsettings') && user.Policy.EnableVideoPlaybackTranscoding) { - context.querySelector('.fldBurnIn').classList.remove('hide'); - } + onAppearanceFieldChange({ + target: context.querySelector('#selectTextSize') + }); - var selectSubtitleLanguage = context.querySelector('#selectSubtitleLanguage'); + loading.hide(); + }); +} - populateLanguages(selectSubtitleLanguage, allCultures); +function saveUser(context, user, userSettingsInstance, appearanceKey, apiClient) { - selectSubtitleLanguage.value = user.Configuration.SubtitleLanguagePreference || ""; - context.querySelector('#selectSubtitlePlaybackMode').value = user.Configuration.SubtitleMode || ""; + let appearanceSettings = userSettingsInstance.getSubtitleAppearanceSettings( appearanceKey ); + appearanceSettings = Object.assign(appearanceSettings, getSubtitleAppearanceObject(context)); - context.querySelector('#selectSubtitlePlaybackMode').dispatchEvent(new CustomEvent('change', {})); + userSettingsInstance.setSubtitleAppearanceSettings(appearanceSettings, appearanceKey); - context.querySelector('#selectTextSize').value = appearanceSettings.textSize || ''; - context.querySelector('#selectDropShadow').value = appearanceSettings.dropShadow || ''; - context.querySelector('#inputTextBackground').value = appearanceSettings.textBackground || 'transparent'; - context.querySelector('#inputTextColor').value = appearanceSettings.textColor || '#ffffff'; - context.querySelector('#selectFont').value = appearanceSettings.font || ''; + user.Configuration.SubtitleLanguagePreference = context.querySelector('#selectSubtitleLanguage').value; + user.Configuration.SubtitleMode = context.querySelector('#selectSubtitlePlaybackMode').value; - context.querySelector('#selectSubtitleBurnIn').value = appSettings.get('subtitleburnin') || ''; + return apiClient.updateUserConfiguration(user.Id, user.Configuration); +} - onAppearanceFieldChange({ - target: context.querySelector('#selectTextSize') - }); +export function save(instance, context, userId, userSettings, apiClient, enableSaveConfirmation) { + + loading.show(); + + appSettings.set('subtitleburnin', context.querySelector('#selectSubtitleBurnIn').value); + + apiClient.getUser(userId).then(function (user) { + + saveUser(context, user, userSettings, instance.appearanceKey, apiClient).then(function () { loading.hide(); + if (enableSaveConfirmation) { + require(['toast'], function (toast) { + toast(globalize.translate('SettingsSaved')); + }); + } + + events.trigger(instance, 'saved'); + + }, function () { + loading.hide(); }); + }); +} + +function onSubtitleModeChange(e) { + + let view = dom.parentWithClass( e.target, 'subtitlesettings' ); + + let subtitlesHelp = view.querySelectorAll( '.subtitlesHelp' ); + for (let i = 0, length = subtitlesHelp.length; i < length; i++) { + subtitlesHelp[i].classList.add('hide'); } + view.querySelector('.subtitles' + this.value + 'Help').classList.remove('hide'); +} - function saveUser(context, user, userSettingsInstance, appearanceKey, apiClient) { +function onAppearanceFieldChange(e) { - var appearanceSettings = userSettingsInstance.getSubtitleAppearanceSettings(appearanceKey); - appearanceSettings = Object.assign(appearanceSettings, getSubtitleAppearanceObject(context)); + let view = dom.parentWithClass( e.target, 'subtitlesettings' ); - userSettingsInstance.setSubtitleAppearanceSettings(appearanceSettings, appearanceKey); + let appearanceSettings = getSubtitleAppearanceObject( view ); - user.Configuration.SubtitleLanguagePreference = context.querySelector('#selectSubtitleLanguage').value; - user.Configuration.SubtitleMode = context.querySelector('#selectSubtitlePlaybackMode').value; + let elements = { + window: view.querySelector( '.subtitleappearance-preview-window' ), + text: view.querySelector( '.subtitleappearance-preview-text' ) + }; - return apiClient.updateUserConfiguration(user.Id, user.Configuration); - } + subtitleAppearanceHelper.applyStyles(elements, appearanceSettings); +} - function save(instance, context, userId, userSettings, apiClient, enableSaveConfirmation) { +export function embed(options, self) { - loading.show(); + require(['text!./subtitlesettings.template.html'], function (template) { - appSettings.set('subtitleburnin', context.querySelector('#selectSubtitleBurnIn').value); + options.element.classList.add('subtitlesettings'); + options.element.innerHTML = globalize.translateDocument(template, 'core'); - apiClient.getUser(userId).then(function (user) { + options.element.querySelector('form').addEventListener('submit', playbacksettings.OnSubmit.bind(self)); - saveUser(context, user, userSettings, instance.appearanceKey, apiClient).then(function () { + options.element.querySelector('#selectSubtitlePlaybackMode').addEventListener('change', onSubtitleModeChange); + options.element.querySelector('#selectTextSize').addEventListener('change', onAppearanceFieldChange); + options.element.querySelector('#selectDropShadow').addEventListener('change', onAppearanceFieldChange); + options.element.querySelector('#selectFont').addEventListener('change', onAppearanceFieldChange); + options.element.querySelector('#inputTextColor').addEventListener('change', onAppearanceFieldChange); + options.element.querySelector('#inputTextBackground').addEventListener('change', onAppearanceFieldChange); - loading.hide(); - if (enableSaveConfirmation) { - require(['toast'], function (toast) { - toast(globalize.translate('SettingsSaved')); - }); - } + if (options.enableSaveButton) { + options.element.querySelector('.btnSave').classList.remove('hide'); + } - events.trigger(instance, 'saved'); + if (appHost.supports('subtitleappearancesettings')) { + options.element.querySelector('.subtitleAppearanceSection').classList.remove('hide'); + } - }, function () { - loading.hide(); - }); - }); - } + self.loadData(); - function onSubmit(e) { - var self = this; - var apiClient = connectionManager.getApiClient(self.options.serverId); - var userId = self.options.userId; - var userSettings = self.options.userSettings; + if (options.autoFocus) { + focusManager.autoFocus(options.element); + } + }); +} +export function SubtitleSettings(options) { + + this.options = options; + + embed(options, this); +} + +SubtitleSettings.prototype.loadData = function () { + + let self = this; + let context = self.options.element; + + loading.show(); + + let userId = self.options.userId; + let apiClient = connectionManager.getApiClient( self.options.serverId ); + let userSettings = self.options.userSettings; + + apiClient.getUser(userId).then(function (user) { userSettings.setUserInfo(userId, apiClient).then(function () { - var enableSaveConfirmation = self.options.enableSaveConfirmation; - save(self, self.options.element, userId, userSettings, apiClient, enableSaveConfirmation); + self.dataLoaded = true; + + let appearanceSettings = userSettings.getSubtitleAppearanceSettings( self.options.appearanceKey ); + + loadForm(context, user, userSettings, appearanceSettings, apiClient); }); + }); +}; - // Disable default form submission - if (e) { - e.preventDefault(); - } +SubtitleSettings.prototype.submit = function () { + playbacksettings.onSubmit.call(this); +}; - return false; - } +SubtitleSettings.prototype.destroy = function () { + this.options = null; +}; - function onSubtitleModeChange(e) { - - var view = dom.parentWithClass(e.target, 'subtitlesettings'); - - var subtitlesHelp = view.querySelectorAll('.subtitlesHelp'); - for (var i = 0, length = subtitlesHelp.length; i < length; i++) { - subtitlesHelp[i].classList.add('hide'); - } - view.querySelector('.subtitles' + this.value + 'Help').classList.remove('hide'); - } - - function onAppearanceFieldChange(e) { - - var view = dom.parentWithClass(e.target, 'subtitlesettings'); - - var appearanceSettings = getSubtitleAppearanceObject(view); - - var elements = { - window: view.querySelector('.subtitleappearance-preview-window'), - text: view.querySelector('.subtitleappearance-preview-text') - }; - - subtitleAppearanceHelper.applyStyles(elements, appearanceSettings); - } - - function embed(options, self) { - - require(['text!./subtitlesettings.template.html'], function (template) { - - options.element.classList.add('subtitlesettings'); - options.element.innerHTML = globalize.translateDocument(template, 'core'); - - options.element.querySelector('form').addEventListener('submit', onSubmit.bind(self)); - - options.element.querySelector('#selectSubtitlePlaybackMode').addEventListener('change', onSubtitleModeChange); - options.element.querySelector('#selectTextSize').addEventListener('change', onAppearanceFieldChange); - options.element.querySelector('#selectDropShadow').addEventListener('change', onAppearanceFieldChange); - options.element.querySelector('#selectFont').addEventListener('change', onAppearanceFieldChange); - options.element.querySelector('#inputTextColor').addEventListener('change', onAppearanceFieldChange); - options.element.querySelector('#inputTextBackground').addEventListener('change', onAppearanceFieldChange); - - if (options.enableSaveButton) { - options.element.querySelector('.btnSave').classList.remove('hide'); - } - - if (appHost.supports('subtitleappearancesettings')) { - options.element.querySelector('.subtitleAppearanceSection').classList.remove('hide'); - } - - self.loadData(); - - if (options.autoFocus) { - focusManager.autoFocus(options.element); - } - }); - } - - function SubtitleSettings(options) { - - this.options = options; - - embed(options, this); - } - - SubtitleSettings.prototype.loadData = function () { - - var self = this; - var context = self.options.element; - - loading.show(); - - var userId = self.options.userId; - var apiClient = connectionManager.getApiClient(self.options.serverId); - var userSettings = self.options.userSettings; - - apiClient.getUser(userId).then(function (user) { - userSettings.setUserInfo(userId, apiClient).then(function () { - self.dataLoaded = true; - - var appearanceSettings = userSettings.getSubtitleAppearanceSettings(self.options.appearanceKey); - - loadForm(context, user, userSettings, appearanceSettings, apiClient); - }); - }); - }; - - SubtitleSettings.prototype.submit = function () { - onSubmit.call(this); - }; - - SubtitleSettings.prototype.destroy = function () { - this.options = null; - }; - - return SubtitleSettings; -}); +export default { + save: save, + embed: embed, + SubtitleSettings: SubtitleSettings +}; From 6f0843cc6d30629c6e8f190558389785b9037e3a Mon Sep 17 00:00:00 2001 From: Christoph Potas Date: Mon, 4 May 2020 03:20:38 +0200 Subject: [PATCH 002/244] ~ convert subtitlesettings to class ~ use base import name instead of relative file path ~ fix "new" calling Signed-off-by: Christoph Potas --- package.json | 1 + src/components/settingshelper.js | 24 ++++ .../subtitleappearancehelper.js | 4 + .../subtitlesettings/subtitlesettings.js | 112 +++++++++++------- src/controllers/user/subtitles.js | 2 +- 5 files changed, 97 insertions(+), 46 deletions(-) create mode 100644 src/components/settingshelper.js diff --git a/package.json b/package.json index fda29b810c..c11b6db913 100644 --- a/package.json +++ b/package.json @@ -92,6 +92,7 @@ "src/components/cardbuilder/cardBuilder.js", "src/components/subtitlesettings/subtitlesettings.js", "src/components/subtitlesettings/subtitleappearancehelper.js", + "src/components/settingshelper.js", "src/scripts/dom.js", "src/components/filedownloader.js", "src/scripts/filesystem.js", diff --git a/src/components/settingshelper.js b/src/components/settingshelper.js new file mode 100644 index 0000000000..0c942ed040 --- /dev/null +++ b/src/components/settingshelper.js @@ -0,0 +1,24 @@ +import globalize from 'globalize'; +/** + * Helper for handling settings + * @module components/settingsHelper + */ +export function populateLanguages(select, languages) { + + let html = ""; + + html += ""; + + for (let i = 0, length = languages.length; i < length; i++) { + + const culture = languages[i]; + + html += ""; + } + + select.innerHTML = html; +} + +export default { + populateLanguages: populateLanguages +}; diff --git a/src/components/subtitlesettings/subtitleappearancehelper.js b/src/components/subtitlesettings/subtitleappearancehelper.js index 7bf4737831..d1c55e1aea 100644 --- a/src/components/subtitlesettings/subtitleappearancehelper.js +++ b/src/components/subtitlesettings/subtitleappearancehelper.js @@ -1,3 +1,7 @@ +/** + * Subtitle settings visual helper + * @module components/subtitleSettings/subtitleAppearanceHelper + */ function getTextStyles(settings, isCue) { let list = []; diff --git a/src/components/subtitlesettings/subtitlesettings.js b/src/components/subtitlesettings/subtitlesettings.js index 8f5038fd65..3e41da953f 100644 --- a/src/components/subtitlesettings/subtitlesettings.js +++ b/src/components/subtitlesettings/subtitlesettings.js @@ -4,9 +4,9 @@ import appHost from 'apphost'; import appSettings from 'appSettings'; import focusManager from 'focusManager'; import loading from 'loading'; -import connectionManager from 'connectionmanager'; -import subtitleAppearanceHelper from 'subtitleappearancehelper'; -import playbacksettings from 'playbacksettings'; +import connectionManager from 'connectionManager'; +import subtitleAppearanceHelper from 'subtitleAppearanceHelper'; +import settingsHelper from '../settingshelper'; import dom from 'dom'; import events from 'events'; import 'listViewStyle'; @@ -15,6 +15,11 @@ import 'emby-input'; import 'emby-checkbox'; import 'flexStyles'; +/** + * Subtitle settings + * @module components/subtitleSettings/subtitleSettings + */ + function getSubtitleAppearanceObject(context) { let appearanceSettings = {}; @@ -37,7 +42,7 @@ function loadForm(context, user, userSettings, appearanceSettings, apiClient) { let selectSubtitleLanguage = context.querySelector( '#selectSubtitleLanguage' ); - playbacksettings.populateLanguages(selectSubtitleLanguage, allCultures); + settingsHelper.populateLanguages(selectSubtitleLanguage, allCultures); selectSubtitleLanguage.value = user.Configuration.SubtitleLanguagePreference || ""; context.querySelector('#selectSubtitlePlaybackMode').value = user.Configuration.SubtitleMode || ""; @@ -73,7 +78,7 @@ function saveUser(context, user, userSettingsInstance, appearanceKey, apiClient) return apiClient.updateUserConfiguration(user.Id, user.Configuration); } -export function save(instance, context, userId, userSettings, apiClient, enableSaveConfirmation) { +function save(instance, context, userId, userSettings, apiClient, enableSaveConfirmation) { loading.show(); @@ -123,14 +128,14 @@ function onAppearanceFieldChange(e) { subtitleAppearanceHelper.applyStyles(elements, appearanceSettings); } -export function embed(options, self) { +function embed(options, self) { require(['text!./subtitlesettings.template.html'], function (template) { options.element.classList.add('subtitlesettings'); options.element.innerHTML = globalize.translateDocument(template, 'core'); - options.element.querySelector('form').addEventListener('submit', playbacksettings.OnSubmit.bind(self)); + options.element.querySelector('form').addEventListener('submit', self.onSubmit ); options.element.querySelector('#selectSubtitlePlaybackMode').addEventListener('change', onSubtitleModeChange); options.element.querySelector('#selectTextSize').addEventListener('change', onAppearanceFieldChange); @@ -155,45 +160,62 @@ export function embed(options, self) { }); } -export function SubtitleSettings(options) { +export class SubtitleSettings { - this.options = options; + constructor(options) { - embed(options, this); + this.options = options; + + embed(options, this); + } + + loadData() { + let self = this; + let context = self.options.element; + + loading.show(); + + let userId = self.options.userId; + let apiClient = connectionManager.getApiClient( self.options.serverId ); + let 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 ); + + loadForm(context, user, userSettings, appearanceSettings, apiClient); + }); + }); + } + + submit() { + this.onSubmit( null ); + } + + destroy() { + this.options = null; + } + + onSubmit( e ) { + const self = this; + let apiClient = connectionManager.getApiClient(self.options.serverId); + let userId = self.options.userId; + let userSettings = self.options.userSettings; + + userSettings.setUserInfo(userId, apiClient).then(function () { + + let enableSaveConfirmation = self.options.enableSaveConfirmation; + save(self, self.options.element, userId, userSettings, apiClient, enableSaveConfirmation); + }); + + // Disable default form submission + if (e) { + e.preventDefault(); + } + return false; + } } -SubtitleSettings.prototype.loadData = function () { - - let self = this; - let context = self.options.element; - - loading.show(); - - let userId = self.options.userId; - let apiClient = connectionManager.getApiClient( self.options.serverId ); - let 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 ); - - loadForm(context, user, userSettings, appearanceSettings, apiClient); - }); - }); -}; - -SubtitleSettings.prototype.submit = function () { - playbacksettings.onSubmit.call(this); -}; - -SubtitleSettings.prototype.destroy = function () { - this.options = null; -}; - -export default { - save: save, - embed: embed, - SubtitleSettings: SubtitleSettings -}; +export default SubtitleSettings; diff --git a/src/controllers/user/subtitles.js b/src/controllers/user/subtitles.js index e2b98dc2dd..f449b655c4 100644 --- a/src/controllers/user/subtitles.js +++ b/src/controllers/user/subtitles.js @@ -18,7 +18,7 @@ define(["subtitleSettings", "userSettings", "autoFocuser"], function (SubtitleSe if (subtitleSettingsInstance) { subtitleSettingsInstance.loadData(); } else { - subtitleSettingsInstance = new SubtitleSettings({ + subtitleSettingsInstance = new SubtitleSettings.default({ serverId: ApiClient.serverId(), userId: userId, element: view.querySelector(".settingsContainer"), From 658710e982db7a435d5396549d5712b955fb320b Mon Sep 17 00:00:00 2001 From: Christoph Potas Date: Sat, 9 May 2020 01:20:32 +0200 Subject: [PATCH 003/244] + added settingshelper to site defines ~ convert subtitles controller to es6 module + added support for class controller Signed-off-by: Christoph Potas --- .../subtitlesettings/subtitlesettings.js | 2 +- src/components/viewManager/viewManager.js | 4 + src/controllers/user/subtitles.js | 102 ++++++++++-------- src/scripts/site.js | 1 + 4 files changed, 64 insertions(+), 45 deletions(-) diff --git a/src/components/subtitlesettings/subtitlesettings.js b/src/components/subtitlesettings/subtitlesettings.js index 3e41da953f..e03c718fc4 100644 --- a/src/components/subtitlesettings/subtitlesettings.js +++ b/src/components/subtitlesettings/subtitlesettings.js @@ -6,7 +6,7 @@ import focusManager from 'focusManager'; import loading from 'loading'; import connectionManager from 'connectionManager'; import subtitleAppearanceHelper from 'subtitleAppearanceHelper'; -import settingsHelper from '../settingshelper'; +import settingsHelper from 'settingsHelper'; import dom from 'dom'; import events from 'events'; import 'listViewStyle'; diff --git a/src/components/viewManager/viewManager.js b/src/components/viewManager/viewManager.js index a8e514e06e..f39c4995fc 100644 --- a/src/components/viewManager/viewManager.js +++ b/src/components/viewManager/viewManager.js @@ -25,6 +25,10 @@ define(['viewContainer', 'focusManager', 'queryString', 'layoutManager'], functi // Use controller method var controller = new options.controllerFactory(newView, eventDetail.detail.params); + } else if (typeof options.controllerFactory === 'object') { + + // Use controller class + var controller = new options.controllerFactory.default(newView, eventDetail.detail.params); } if (!options.controllerFactory || dispatchPageEvents) { diff --git a/src/controllers/user/subtitles.js b/src/controllers/user/subtitles.js index f449b655c4..f1efe0c218 100644 --- a/src/controllers/user/subtitles.js +++ b/src/controllers/user/subtitles.js @@ -1,49 +1,63 @@ -define(["subtitleSettings", "userSettings", "autoFocuser"], function (SubtitleSettings, userSettings, autoFocuser) { - "use strict"; +import subtitleSettings from 'subtitleSettings'; +import * as userSettings from 'userSettings'; +import autoFocuser from 'autoFocuser'; - return function (view, params) { - function onBeforeUnload(e) { - if (hasChanges) { - e.returnValue = "You currently have unsaved changes. Are you sure you wish to leave?"; - } +export class SubtitleController { + constructor(view, params) { + this.userId = params.userId || ApiClient.getCurrentUserId(); + this.currentSettings = this.userId === ApiClient.getCurrentUserId() ? userSettings : new userSettings(); + this.hasChanges = false; + this.subtitleSettingsInstance = null; + this.view = view; + + view.addEventListener("viewshow", this.viewShow.bind(this)); + view.addEventListener("change", this.change.bind(this)); + view.addEventListener("viewbeforehide", this.viewBeforeHide.bind(this)); + view.addEventListener("viewdestroy", this.viewDestroy.bind(this)); + } + + viewShow() { + window.addEventListener("beforeunload", this.beforeUnload.bind(this)); + + if (this.subtitleSettingsInstance) { + this.subtitleSettingsInstance.loadData(); + } else { + this.subtitleSettingsInstance = new subtitleSettings({ + serverId: ApiClient.serverId(), + userId: this.userId, + element: this.view.querySelector(".settingsContainer"), + userSettings: this.currentSettings, + enableSaveButton: false, + enableSaveConfirmation: false, + autoFocus: autoFocuser.isEnabled() + }); } + } - var subtitleSettingsInstance; - var hasChanges; - var userId = params.userId || ApiClient.getCurrentUserId(); - var currentSettings = userId === ApiClient.getCurrentUserId() ? userSettings : new userSettings(); - view.addEventListener("viewshow", function () { - window.addEventListener("beforeunload", onBeforeUnload); + viewDestroy() { + if (this.subtitleSettingsInstance) { + this.subtitleSettingsInstance.destroy(); + this.subtitleSettingsInstance = null; + } + } - if (subtitleSettingsInstance) { - subtitleSettingsInstance.loadData(); - } else { - subtitleSettingsInstance = new SubtitleSettings.default({ - serverId: ApiClient.serverId(), - userId: userId, - element: view.querySelector(".settingsContainer"), - userSettings: currentSettings, - enableSaveButton: false, - enableSaveConfirmation: false, - autoFocus: autoFocuser.isEnabled() - }); - } - }); - view.addEventListener("change", function () { - hasChanges = true; - }); - view.addEventListener("viewbeforehide", function () { - hasChanges = false; + viewBeforeHide() { + this.hasChanges = false; - if (subtitleSettingsInstance) { - subtitleSettingsInstance.submit(); - } - }); - view.addEventListener("viewdestroy", function () { - if (subtitleSettingsInstance) { - subtitleSettingsInstance.destroy(); - subtitleSettingsInstance = null; - } - }); - }; -}); + if (this.subtitleSettingsInstance) { + this.subtitleSettingsInstance.submit(); + } + } + + change() { + this.hasChanges = true; + } + + beforeUnload(e) { + if (this.hasChanges) { + e.returnValue = "You currently have unsaved changes. Are you sure you wish to leave?"; + } + } +} + +export default SubtitleController; diff --git a/src/scripts/site.js b/src/scripts/site.js index 5ce093e628..37832af5cd 100644 --- a/src/scripts/site.js +++ b/src/scripts/site.js @@ -831,6 +831,7 @@ var AppInfo = {}; define("upNextDialog", [componentsPath + "/upnextdialog/upnextdialog"], returnFirstDependency); define("subtitleAppearanceHelper", [componentsPath + "/subtitlesettings/subtitleappearancehelper"], returnFirstDependency); define("subtitleSettings", [componentsPath + "/subtitlesettings/subtitlesettings"], returnFirstDependency); + define("settingsHelper", [componentsPath + "/settingshelper"], returnFirstDependency); define("displaySettings", [componentsPath + "/displaysettings/displaysettings"], returnFirstDependency); define("playbackSettings", [componentsPath + "/playbacksettings/playbacksettings"], returnFirstDependency); define("homescreenSettings", [componentsPath + "/homescreensettings/homescreensettings"], returnFirstDependency); From e5bf9bc074d59af7b5e76c734e0af1c6741add52 Mon Sep 17 00:00:00 2001 From: Christoph Potas Date: Sat, 9 May 2020 01:53:13 +0200 Subject: [PATCH 004/244] + add controller to es6 module list Signed-off-by: Christoph Potas --- package.json | 1 + 1 file changed, 1 insertion(+) diff --git a/package.json b/package.json index c11b6db913..4d3d3047bc 100644 --- a/package.json +++ b/package.json @@ -93,6 +93,7 @@ "src/components/subtitlesettings/subtitlesettings.js", "src/components/subtitlesettings/subtitleappearancehelper.js", "src/components/settingshelper.js", + "src/controllers/user/subtitles.js", "src/scripts/dom.js", "src/components/filedownloader.js", "src/scripts/filesystem.js", From 9469c208e19f34b97fda261ca58e7201c1359aed Mon Sep 17 00:00:00 2001 From: Christoph Potas Date: Sat, 9 May 2020 15:42:37 +0200 Subject: [PATCH 005/244] ~ switch all strings to single quotes to match ESLint requirements Signed-off-by: Christoph Potas --- src/components/settingshelper.js | 6 +++--- src/controllers/user/subtitles.js | 14 +++++++------- 2 files changed, 10 insertions(+), 10 deletions(-) diff --git a/src/components/settingshelper.js b/src/components/settingshelper.js index 0c942ed040..3bbff9d8ed 100644 --- a/src/components/settingshelper.js +++ b/src/components/settingshelper.js @@ -5,15 +5,15 @@ import globalize from 'globalize'; */ export function populateLanguages(select, languages) { - let html = ""; + let html = ''; - html += ""; + html += "'; for (let i = 0, length = languages.length; i < length; i++) { const culture = languages[i]; - html += ""; + html += "'; } select.innerHTML = html; diff --git a/src/controllers/user/subtitles.js b/src/controllers/user/subtitles.js index f1efe0c218..e88109cc6b 100644 --- a/src/controllers/user/subtitles.js +++ b/src/controllers/user/subtitles.js @@ -10,14 +10,14 @@ export class SubtitleController { this.subtitleSettingsInstance = null; this.view = view; - view.addEventListener("viewshow", this.viewShow.bind(this)); - view.addEventListener("change", this.change.bind(this)); - view.addEventListener("viewbeforehide", this.viewBeforeHide.bind(this)); - view.addEventListener("viewdestroy", this.viewDestroy.bind(this)); + view.addEventListener('viewshow', this.viewShow.bind(this)); + view.addEventListener('change', this.change.bind(this)); + view.addEventListener('viewbeforehide', this.viewBeforeHide.bind(this)); + view.addEventListener('viewdestroy', this.viewDestroy.bind(this)); } viewShow() { - window.addEventListener("beforeunload", this.beforeUnload.bind(this)); + window.addEventListener('beforeunload', this.beforeUnload.bind(this)); if (this.subtitleSettingsInstance) { this.subtitleSettingsInstance.loadData(); @@ -25,7 +25,7 @@ export class SubtitleController { this.subtitleSettingsInstance = new subtitleSettings({ serverId: ApiClient.serverId(), userId: this.userId, - element: this.view.querySelector(".settingsContainer"), + element: this.view.querySelector('.settingsContainer'), userSettings: this.currentSettings, enableSaveButton: false, enableSaveConfirmation: false, @@ -55,7 +55,7 @@ export class SubtitleController { beforeUnload(e) { if (this.hasChanges) { - e.returnValue = "You currently have unsaved changes. Are you sure you wish to leave?"; + e.returnValue = 'You currently have unsaved changes. Are you sure you wish to leave?'; } } } From 8b96577fba91f5535a7bde1f9727cc51581ce3a4 Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Tue, 9 Jun 2020 22:14:24 +0300 Subject: [PATCH 006/244] Migration shortcuts to ES6 modules --- package.json | 1 + src/components/shortcuts.js | 149 +++++++++++++++++++----------------- 2 files changed, 81 insertions(+), 69 deletions(-) diff --git a/package.json b/package.json index 785878d20b..b60e24ad10 100644 --- a/package.json +++ b/package.json @@ -104,6 +104,7 @@ "src/components/syncplay/playbackPermissionManager.js", "src/components/syncplay/syncPlayManager.js", "src/components/syncplay/timeSyncManager.js", + "src/components/shortcuts.js", "src/plugins/bookPlayer/plugin.js", "src/plugins/bookPlayer/tableOfContent.js", "src/plugins/photoPlayer/plugin.js", diff --git a/src/components/shortcuts.js b/src/components/shortcuts.js index ab606ab1d2..83a4dfc311 100644 --- a/src/components/shortcuts.js +++ b/src/components/shortcuts.js @@ -1,18 +1,30 @@ -define(['playbackManager', 'inputManager', 'connectionManager', 'appRouter', 'globalize', 'loading', 'dom', 'recordingHelper'], function (playbackManager, inputManager, connectionManager, appRouter, globalize, loading, dom, recordingHelper) { - 'use strict'; +/* eslint-disable indent */ + +/** + * Module shortcuts. + * @module components/shortcuts + */ + +import playbackManager from 'playbackManager'; +import inputManager from 'inputManager'; +import connectionManager from 'connectionManager'; +import appRouter from 'appRouter'; +import globalize from 'globalize'; +import dom from 'dom'; +import recordingHelper from 'recordingHelper'; function playAllFromHere(card, serverId, queue) { - var parent = card.parentNode; - var className = card.classList.length ? ('.' + card.classList[0]) : ''; - var cards = parent.querySelectorAll(className + '[data-id]'); + const parent = card.parentNode; + const className = card.classList.length ? (`.${card.classList[0]}`) : ''; + const cards = parent.querySelectorAll(`${className}[data-id]`); - var ids = []; + const ids = []; - var foundCard = false; - var startIndex; + let foundCard = false; + let startIndex; - for (var i = 0, length = cards.length; i < length; i++) { + for (let i = 0, length = cards.length; i < length; i++) { if (cards[i] === card) { foundCard = true; startIndex = i; @@ -22,12 +34,12 @@ define(['playbackManager', 'inputManager', 'connectionManager', 'appRouter', 'gl } } - var itemsContainer = dom.parentWithClass(card, 'itemsContainer'); + const itemsContainer = dom.parentWithClass(card, 'itemsContainer'); if (itemsContainer && itemsContainer.fetchData) { - var queryOptions = queue ? { StartIndex: startIndex } : {}; + const queryOptions = queue ? { StartIndex: startIndex } : {}; - return itemsContainer.fetchData(queryOptions).then(function (result) { + return itemsContainer.fetchData(queryOptions).then(result => { if (queue) { return playbackManager.queue({ @@ -64,7 +76,7 @@ define(['playbackManager', 'inputManager', 'connectionManager', 'appRouter', 'gl function showProgramDialog(item) { - require(['recordingCreator'], function (recordingCreator) { + import('recordingCreator').then((recordingCreator) => { recordingCreator.show(item.Id, item.ServerId); }); @@ -73,11 +85,11 @@ define(['playbackManager', 'inputManager', 'connectionManager', 'appRouter', 'gl function getItem(button) { button = dom.parentWithAttribute(button, 'data-id'); - var serverId = button.getAttribute('data-serverid'); - var id = button.getAttribute('data-id'); - var type = button.getAttribute('data-type'); + const serverId = button.getAttribute('data-serverid'); + const id = button.getAttribute('data-id'); + const type = button.getAttribute('data-type'); - var apiClient = connectionManager.getApiClient(serverId); + const apiClient = connectionManager.getApiClient(serverId); if (type === 'Timer') { return apiClient.getLiveTvTimer(id); @@ -99,19 +111,19 @@ define(['playbackManager', 'inputManager', 'connectionManager', 'appRouter', 'gl function showContextMenu(card, options) { - getItem(card).then(function (item) { + getItem(card).then(item => { - var playlistId = card.getAttribute('data-playlistid'); - var collectionId = card.getAttribute('data-collectionid'); + const playlistId = card.getAttribute('data-playlistid'); + const collectionId = card.getAttribute('data-collectionid'); if (playlistId) { - var elem = dom.parentWithAttribute(card, 'data-playlistitemid'); + const elem = dom.parentWithAttribute(card, 'data-playlistitemid'); item.PlaylistItemId = elem ? elem.getAttribute('data-playlistitemid') : null; } - require(['itemContextMenu'], function (itemContextMenu) { + import('itemContextMenu').then((itemContextMenu) => { - connectionManager.getApiClient(item.ServerId).getCurrentUser().then(function (user) { + connectionManager.getApiClient(item.ServerId).getCurrentUser().then(user => { itemContextMenu.show(Object.assign({ item: item, play: true, @@ -122,9 +134,7 @@ define(['playbackManager', 'inputManager', 'connectionManager', 'appRouter', 'gl collectionId: collectionId, user: user - }, options || {})).then(function (result) { - - var itemsContainer; + }, options || {})).then(result => { if (result.command === 'playallfromhere' || result.command === 'queueallfromhere') { executeAction(card, options.positionTo, result.command); @@ -157,9 +167,9 @@ define(['playbackManager', 'inputManager', 'connectionManager', 'appRouter', 'gl function showPlayMenu(card, target) { - var item = getItemInfoFromCard(card); + const item = getItemInfoFromCard(card); - require(['playMenu'], function (playMenu) { + import('playMenu').then((playMenu) => { playMenu.show({ @@ -170,7 +180,7 @@ define(['playbackManager', 'inputManager', 'connectionManager', 'appRouter', 'gl } function sendToast(text) { - require(['toast'], function (toast) { + import('toast').then((toast) => { toast(text); }); } @@ -179,19 +189,19 @@ define(['playbackManager', 'inputManager', 'connectionManager', 'appRouter', 'gl target = target || card; - var id = card.getAttribute('data-id'); + let id = card.getAttribute('data-id'); if (!id) { card = dom.parentWithAttribute(card, 'data-id'); id = card.getAttribute('data-id'); } - var item = getItemInfoFromCard(card); + const item = getItemInfoFromCard(card); - var serverId = item.ServerId; - var type = item.Type; + const serverId = item.ServerId; + const type = item.Type; - var playableItemId = type === 'Program' ? item.ChannelId : item.Id; + const playableItemId = type === 'Program' ? item.ChannelId : item.Id; if (item.MediaType === 'Photo' && action === 'link') { action = 'play'; @@ -213,7 +223,7 @@ define(['playbackManager', 'inputManager', 'connectionManager', 'appRouter', 'gl }); } else if (action === 'play' || action === 'resume') { - var startPositionTicks = parseInt(card.getAttribute('data-positionticks') || '0'); + const startPositionTicks = parseInt(card.getAttribute('data-positionticks') || '0'); playbackManager.play({ ids: [playableItemId], @@ -244,7 +254,7 @@ define(['playbackManager', 'inputManager', 'connectionManager', 'appRouter', 'gl onRecordCommand(serverId, id, type, card.getAttribute('data-timerid'), card.getAttribute('data-seriestimerid')); } else if (action === 'menu') { - var options = target.getAttribute('data-playoptions') === 'false' ? + const options = target.getAttribute('data-playoptions') === 'false' ? { shuffle: false, instantMix: false, @@ -261,7 +271,7 @@ define(['playbackManager', 'inputManager', 'connectionManager', 'appRouter', 'gl } else if (action === 'playmenu') { showPlayMenu(card, target); } else if (action === 'edit') { - getItem(target).then(function (item) { + getItem(target).then(item => { editItem(item, serverId); }); } else if (action === 'playtrailer') { @@ -270,9 +280,9 @@ define(['playbackManager', 'inputManager', 'connectionManager', 'appRouter', 'gl getItem(target).then(addToPlaylist); } else if (action === 'custom') { - var customAction = target.getAttribute('data-customaction'); + const customAction = target.getAttribute('data-customaction'); - card.dispatchEvent(new CustomEvent('action-' + customAction, { + card.dispatchEvent(new CustomEvent(`action-${customAction}`, { detail: { playlistItemId: card.getAttribute('data-playlistitemid') }, @@ -283,7 +293,7 @@ define(['playbackManager', 'inputManager', 'connectionManager', 'appRouter', 'gl } function addToPlaylist(item) { - require(['playlistEditor'], function (playlistEditor) { + import('playlistEditor').then((playlistEditor) => { new playlistEditor().show({ items: [item.Id], @@ -295,35 +305,35 @@ define(['playbackManager', 'inputManager', 'connectionManager', 'appRouter', 'gl function playTrailer(item) { - var apiClient = connectionManager.getApiClient(item.ServerId); + const apiClient = connectionManager.getApiClient(item.ServerId); - apiClient.getLocalTrailers(apiClient.getCurrentUserId(), item.Id).then(function (trailers) { + apiClient.getLocalTrailers(apiClient.getCurrentUserId(), item.Id).then(trailers => { playbackManager.play({ items: trailers }); }); } function editItem(item, serverId) { - var apiClient = connectionManager.getApiClient(serverId); + const apiClient = connectionManager.getApiClient(serverId); - return new Promise(function (resolve, reject) { + return new Promise((resolve, reject) => { - var serverId = apiClient.serverInfo().Id; + const serverId = apiClient.serverInfo().Id; if (item.Type === 'Timer') { if (item.ProgramId) { - require(['recordingCreator'], function (recordingCreator) { + import('recordingCreator').then((recordingCreator) => { recordingCreator.show(item.ProgramId, serverId).then(resolve, reject); }); } else { - require(['recordingEditor'], function (recordingEditor) { + import('recordingEditor').then((recordingEditor) => { recordingEditor.show(item.Id, serverId).then(resolve, reject); }); } } else { - require(['metadataEditor'], function (metadataEditor) { + import('metadataEditor').then((metadataEditor) => { metadataEditor.show(item.Id, serverId).then(resolve, reject); }); @@ -335,19 +345,19 @@ define(['playbackManager', 'inputManager', 'connectionManager', 'appRouter', 'gl if (type === 'Program' || timerId || seriesTimerId) { - var programId = type === 'Program' ? id : null; + const programId = type === 'Program' ? id : null; recordingHelper.toggleRecording(serverId, programId, timerId, seriesTimerId); } } - function onClick(e) { + export function onClick(e) { - var card = dom.parentWithClass(e.target, 'itemAction'); + const card = dom.parentWithClass(e.target, 'itemAction'); if (card) { - var actionElement = card; - var action = actionElement.getAttribute('data-action'); + let actionElement = card; + let action = actionElement.getAttribute('data-action'); if (!action) { actionElement = dom.parentWithAttribute(actionElement, 'data-action'); @@ -368,12 +378,12 @@ define(['playbackManager', 'inputManager', 'connectionManager', 'appRouter', 'gl function onCommand(e) { - var cmd = e.detail.command; + const cmd = e.detail.command; if (cmd === 'play' || cmd === 'resume' || cmd === 'record' || cmd === 'menu' || cmd === 'info') { - var target = e.target; - var card = dom.parentWithClass(target, 'itemAction') || dom.parentWithAttribute(target, 'data-id'); + const target = e.target; + const card = dom.parentWithClass(target, 'itemAction') || dom.parentWithAttribute(target, 'data-id'); if (card) { e.preventDefault(); @@ -383,7 +393,7 @@ define(['playbackManager', 'inputManager', 'connectionManager', 'appRouter', 'gl } } - function on(context, options) { + export function on(context, options) { options = options || {}; @@ -396,7 +406,7 @@ define(['playbackManager', 'inputManager', 'connectionManager', 'appRouter', 'gl } } - function off(context, options) { + export function off(context, options) { options = options || {}; context.removeEventListener('click', onClick); @@ -406,23 +416,24 @@ define(['playbackManager', 'inputManager', 'connectionManager', 'appRouter', 'gl } } - function getShortcutAttributesHtml(item, serverId) { + export function getShortcutAttributesHtml(item, serverId) { - var html = 'data-id="' + item.Id + '" data-serverid="' + (serverId || item.ServerId) + '" data-type="' + item.Type + '" data-mediatype="' + item.MediaType + '" data-channelid="' + item.ChannelId + '" data-isfolder="' + item.IsFolder + '"'; + let html = `data-id="${item.Id}" data-serverid="${serverId || item.ServerId}" data-type="${item.Type}" data-mediatype="${item.MediaType}" data-channelid="${item.ChannelId}" data-isfolder="${item.IsFolder}"`; - var collectionType = item.CollectionType; + const collectionType = item.CollectionType; if (collectionType) { - html += ' data-collectiontype="' + collectionType + '"'; + html += ` data-collectiontype="${collectionType}"`; } return html; } - return { - on: on, - off: off, - onClick: onClick, - getShortcutAttributesHtml: getShortcutAttributesHtml - }; +/* eslint-enable indent */ + +export default { + on: on, + off: off, + onClick: onClick, + getShortcutAttributesHtml: getShortcutAttributesHtml +}; -}); From eff468dc82b98e7c8bdf0db853ed1926c0783ed9 Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Tue, 9 Jun 2020 22:28:08 +0300 Subject: [PATCH 007/244] Migration imageOptionsEditor and libraryoptionseditor to es6 --- package.json | 2 + .../imageOptionsEditor/imageOptionsEditor.js | 66 ++-- .../libraryoptionseditor.js | 307 +++++++++--------- 3 files changed, 196 insertions(+), 179 deletions(-) diff --git a/package.json b/package.json index d9b2ed7616..fdeacda2f2 100644 --- a/package.json +++ b/package.json @@ -93,8 +93,10 @@ "src/components/actionSheet/actionSheet.js", "src/components/autoFocuser.js", "src/components/cardbuilder/cardBuilder.js", + "src/components/imageOptionsEditor/imageOptionsEditor.js", "src/components/images/imageLoader.js", "src/components/indicators/indicators.js", + "src/components/libraryoptionseditor/libraryoptionseditor.js", "src/components/lazyLoader/lazyLoaderIntersectionObserver.js", "src/components/playback/brightnessosd.js", "src/components/playback/mediasession.js", diff --git a/src/components/imageOptionsEditor/imageOptionsEditor.js b/src/components/imageOptionsEditor/imageOptionsEditor.js index 257921dfa2..5e4f88f158 100644 --- a/src/components/imageOptionsEditor/imageOptionsEditor.js +++ b/src/components/imageOptionsEditor/imageOptionsEditor.js @@ -1,5 +1,16 @@ -define(['globalize', 'dom', 'dialogHelper', 'emby-checkbox', 'emby-select', 'emby-input'], function (globalize, dom, dialogHelper) { - 'use strict'; +/* eslint-disable indent */ + +/** + * Module for image Options Editor. + * @module components/imageOptionsEditor/imageOptionsEditor + */ + +import globalize from 'globalize'; +import dom from 'dom'; +import dialogHelper from 'dialogHelper'; +import 'emby-checkbox'; +import 'emby-select'; +import 'emby-input'; function getDefaultImageConfig(itemType, type) { return { @@ -10,7 +21,7 @@ define(['globalize', 'dom', 'dialogHelper', 'emby-checkbox', 'emby-select', 'emb } function findImageOptions(imageOptions, type) { - return imageOptions.filter(function (i) { + return imageOptions.filter(i => { return i.Type == type; })[0]; } @@ -31,14 +42,14 @@ define(['globalize', 'dom', 'dialogHelper', 'emby-checkbox', 'emby-select', 'emb } function loadValues(context, itemType, options, availableOptions) { - var supportedImageTypes = availableOptions.SupportedImageTypes || []; - setVisibilityOfBackdrops(context.querySelector('.backdropFields'), -1 != supportedImageTypes.indexOf('Backdrop')); - setVisibilityOfBackdrops(context.querySelector('.screenshotFields'), -1 != supportedImageTypes.indexOf('Screenshot')); - Array.prototype.forEach.call(context.querySelectorAll('.imageType'), function (i) { - var imageType = i.getAttribute('data-imagetype'); - var container = dom.parentWithTag(i, 'LABEL'); + const supportedImageTypes = availableOptions.SupportedImageTypes || []; + setVisibilityOfBackdrops(context.querySelector('.backdropFields'), supportedImageTypes.includes('Backdrop')); + setVisibilityOfBackdrops(context.querySelector('.screenshotFields'), supportedImageTypes.includes('Screenshot')); + Array.prototype.forEach.call(context.querySelectorAll('.imageType'), i => { + const imageType = i.getAttribute('data-imagetype'); + const container = dom.parentWithTag(i, 'LABEL'); - if (-1 == supportedImageTypes.indexOf(imageType)) { + if (!supportedImageTypes.includes(imageType)) { container.classList.add('hide'); } else { container.classList.remove('hide'); @@ -50,16 +61,16 @@ define(['globalize', 'dom', 'dialogHelper', 'emby-checkbox', 'emby-select', 'emb i.checked = false; } }); - var backdropConfig = getImageConfig(options, availableOptions, 'Backdrop', itemType); + const backdropConfig = getImageConfig(options, availableOptions, 'Backdrop', itemType); context.querySelector('#txtMaxBackdrops').value = backdropConfig.Limit; context.querySelector('#txtMinBackdropDownloadWidth').value = backdropConfig.MinWidth; - var screenshotConfig = getImageConfig(options, availableOptions, 'Screenshot', itemType); + const screenshotConfig = getImageConfig(options, availableOptions, 'Screenshot', itemType); context.querySelector('#txtMaxScreenshots').value = screenshotConfig.Limit; context.querySelector('#txtMinScreenshotDownloadWidth').value = screenshotConfig.MinWidth; } function saveValues(context, options) { - options.ImageOptions = Array.prototype.map.call(context.querySelectorAll('.imageType:not(.hide)'), function (c) { + options.ImageOptions = Array.prototype.map.call(context.querySelectorAll('.imageType:not(.hide)'), c => { return { Type: c.getAttribute('data-imagetype'), Limit: c.checked ? 1 : 0, @@ -78,35 +89,32 @@ define(['globalize', 'dom', 'dialogHelper', 'emby-checkbox', 'emby-select', 'emb }); } - function editor() { - this.show = function (itemType, options, availableOptions) { - return new Promise(function (resolve, reject) { - var xhr = new XMLHttpRequest(); - xhr.open('GET', 'components/imageOptionsEditor/imageOptionsEditor.template.html', true); - - xhr.onload = function (e) { - var template = this.response; - var dlg = dialogHelper.createDialog({ +export class editor { + constructor() { + this.show = (itemType, options, availableOptions) => { + return new Promise((resolve) => { + //TODO: remove require + require(['text!./components/imageOptionsEditor/imageOptionsEditor.template.html'], template => { + const dlg = dialogHelper.createDialog({ size: 'small', removeOnClose: true, scrollY: false }); dlg.classList.add('formDialog'); dlg.innerHTML = globalize.translateDocument(template); - dlg.addEventListener('close', function () { + dlg.addEventListener('close', () => { saveValues(dlg, options); }); loadValues(dlg, itemType, options, availableOptions); dialogHelper.open(dlg).then(resolve, resolve); - dlg.querySelector('.btnCancel').addEventListener('click', function () { + dlg.querySelector('.btnCancel').addEventListener('click', () => { dialogHelper.close(dlg); }); - }; - - xhr.send(); + }); }); }; } +} - return editor; -}); +/* eslint-enable indent */ +export default editor; diff --git a/src/components/libraryoptionseditor/libraryoptionseditor.js b/src/components/libraryoptionseditor/libraryoptionseditor.js index 832a6ffc5e..f9a9d43276 100644 --- a/src/components/libraryoptionseditor/libraryoptionseditor.js +++ b/src/components/libraryoptionseditor/libraryoptionseditor.js @@ -1,63 +1,73 @@ -define(['globalize', 'dom', 'emby-checkbox', 'emby-select', 'emby-input'], function(globalize, dom) { - 'use strict'; +/* eslint-disable indent */ + +/** + * Module for library options editor. + * @module components/libraryoptionseditor/libraryoptionseditor + */ + +import globalize from 'globalize'; +import dom from 'dom'; +import 'emby-checkbox'; +import 'emby-select'; +import 'emby-input'; function populateLanguages(parent) { - return ApiClient.getCultures().then(function(languages) { + return ApiClient.getCultures().then(languages => { populateLanguagesIntoSelect(parent.querySelector('#selectLanguage'), languages); populateLanguagesIntoList(parent.querySelector('.subtitleDownloadLanguages'), languages); }); } function populateLanguagesIntoSelect(select, languages) { - var html = ''; + let html = ''; html += ""; - for (var i = 0; i < languages.length; i++) { - var culture = languages[i]; - html += "'; + for (let i = 0; i < languages.length; i++) { + const culture = languages[i]; + html += ``; } select.innerHTML = html; } function populateLanguagesIntoList(element, languages) { - var html = ''; - for (var i = 0; i < languages.length; i++) { - var culture = languages[i]; - html += ''; + let html = ''; + for (let i = 0; i < languages.length; i++) { + const culture = languages[i]; + html += ``; } element.innerHTML = html; } function populateCountries(select) { - return ApiClient.getCountries().then(function(allCountries) { - var html = ''; + return ApiClient.getCountries().then(allCountries => { + let html = ''; html += ""; - for (var i = 0; i < allCountries.length; i++) { - var culture = allCountries[i]; - html += "'; + for (let i = 0; i < allCountries.length; i++) { + const culture = allCountries[i]; + html += ``; } select.innerHTML = html; }); } function populateRefreshInterval(select) { - var html = ''; - html += "'; - html += [30, 60, 90].map(function(val) { - return "'; + let html = ''; + html += ``; + html += [30, 60, 90].map(val => { + return ``; }).join(''); select.innerHTML = html; } function renderMetadataReaders(page, plugins) { - var html = ''; - var elem = page.querySelector('.metadataReaders'); + let html = ''; + const elem = page.querySelector('.metadataReaders'); if (plugins.length < 1) return elem.innerHTML = '', elem.classList.add('hide'), !1; - html += '

' + globalize.translate('LabelMetadataReaders') + '

'; + html += `

${globalize.translate('LabelMetadataReaders')}

`; html += '
'; - for (var i = 0; i < plugins.length; i++) { - var plugin = plugins[i]; - html += '
'; + for (let i = 0; i < plugins.length; i++) { + const plugin = plugins[i]; + html += `
`; html += ''; html += '
'; html += '

'; @@ -65,14 +75,14 @@ define(['globalize', 'dom', 'emby-checkbox', 'emby-select', 'emby-input'], funct html += '

'; html += '
'; if (i > 0) { - html += ''; + html += ``; } else if (plugins.length > 1) { - html += ''; + html += ``; } html += '
'; } html += '
'; - html += '
' + globalize.translate('LabelMetadataReadersHelp') + '
'; + html += `
${globalize.translate('LabelMetadataReadersHelp')}
`; if (plugins.length < 2) { elem.classList.add('hide'); } else { @@ -83,25 +93,25 @@ define(['globalize', 'dom', 'emby-checkbox', 'emby-select', 'emby-input'], funct } function renderMetadataSavers(page, metadataSavers) { - var html = ''; - var elem = page.querySelector('.metadataSavers'); + let html = ''; + const elem = page.querySelector('.metadataSavers'); if (!metadataSavers.length) return elem.innerHTML = '', elem.classList.add('hide'), false; - html += '

' + globalize.translate('LabelMetadataSavers') + '

'; + html += `

${globalize.translate('LabelMetadataSavers')}

`; html += '
'; - for (var i = 0; i < metadataSavers.length; i++) { - var plugin = metadataSavers[i]; - html += ''; + for (let i = 0; i < metadataSavers.length; i++) { + const plugin = metadataSavers[i]; + html += ``; } html += '
'; - html += '
' + globalize.translate('LabelMetadataSaversHelp') + '
'; + html += `
${globalize.translate('LabelMetadataSaversHelp')}
`; elem.innerHTML = html; elem.classList.remove('hide'); return true; } function getMetadataFetchersForTypeHtml(availableTypeOptions, libraryOptionsForType) { - var html = ''; - var plugins = availableTypeOptions.MetadataFetchers; + let html = ''; + let plugins = availableTypeOptions.MetadataFetchers; plugins = getOrderedPlugins(plugins, libraryOptionsForType.MetadataFetcherOrder || []); if (!plugins.length) return html; @@ -112,8 +122,8 @@ define(['globalize', 'dom', 'emby-checkbox', 'emby-select', 'emby-input'], funct plugins.forEach((plugin, index) => { html += '
'; - var isChecked = libraryOptionsForType.MetadataFetchers ? -1 !== libraryOptionsForType.MetadataFetchers.indexOf(plugin.Name) : plugin.DefaultEnabled; - var checkedHtml = isChecked ? ' checked="checked"' : ''; + const isChecked = libraryOptionsForType.MetadataFetchers ? libraryOptionsForType.MetadataFetchers.includes(plugin.Name) : plugin.DefaultEnabled; + const checkedHtml = isChecked ? ' checked="checked"' : ''; html += ''; html += '
'; html += '

'; @@ -135,19 +145,19 @@ define(['globalize', 'dom', 'emby-checkbox', 'emby-select', 'emby-input'], funct } function getTypeOptions(allOptions, type) { - var allTypeOptions = allOptions.TypeOptions || []; - for (var i = 0; i < allTypeOptions.length; i++) { - var typeOptions = allTypeOptions[i]; + const allTypeOptions = allOptions.TypeOptions || []; + for (let i = 0; i < allTypeOptions.length; i++) { + const typeOptions = allTypeOptions[i]; if (typeOptions.Type === type) return typeOptions; } return null; } function renderMetadataFetchers(page, availableOptions, libraryOptions) { - var html = ''; - var elem = page.querySelector('.metadataFetchers'); - for (var i = 0; i < availableOptions.TypeOptions.length; i++) { - var availableTypeOptions = availableOptions.TypeOptions[i]; + let html = ''; + const elem = page.querySelector('.metadataFetchers'); + for (let i = 0; i < availableOptions.TypeOptions.length; i++) { + const availableTypeOptions = availableOptions.TypeOptions[i]; html += getMetadataFetchersForTypeHtml(availableTypeOptions, getTypeOptions(libraryOptions, availableTypeOptions.Type) || {}); } elem.innerHTML = html; @@ -166,41 +176,41 @@ define(['globalize', 'dom', 'emby-checkbox', 'emby-select', 'emby-input'], funct } function renderSubtitleFetchers(page, availableOptions, libraryOptions) { - var html = ''; - var elem = page.querySelector('.subtitleFetchers'); + let html = ''; + const elem = page.querySelector('.subtitleFetchers'); - var plugins = availableOptions.SubtitleFetchers; + let plugins = availableOptions.SubtitleFetchers; plugins = getOrderedPlugins(plugins, libraryOptions.SubtitleFetcherOrder || []); if (!plugins.length) return html; - html += '

' + globalize.translate('LabelSubtitleDownloaders') + '

'; + html += `

${globalize.translate('LabelSubtitleDownloaders')}

`; html += '
'; - for (var i = 0; i < plugins.length; i++) { - var plugin = plugins[i]; - html += '
'; - var isChecked = libraryOptions.DisabledSubtitleFetchers ? -1 === libraryOptions.DisabledSubtitleFetchers.indexOf(plugin.Name) : plugin.DefaultEnabled; - var checkedHtml = isChecked ? ' checked="checked"' : ''; - html += ''; + for (let i = 0; i < plugins.length; i++) { + const plugin = plugins[i]; + html += `
`; + const isChecked = libraryOptions.DisabledSubtitleFetchers ? !libraryOptions.DisabledSubtitleFetchers.includes(plugin.Name) : plugin.DefaultEnabled; + const checkedHtml = isChecked ? ' checked="checked"' : ''; + html += ``; html += '
'; html += '

'; html += plugin.Name; html += '

'; html += '
'; if (i > 0) { - html += ''; + html += ``; } else if (plugins.length > 1) { - html += ''; + html += ``; } html += '
'; } html += '
'; - html += '
' + globalize.translate('SubtitleDownloadersHelp') + '
'; + html += `
${globalize.translate('SubtitleDownloadersHelp')}
`; elem.innerHTML = html; } function getImageFetchersForTypeHtml(availableTypeOptions, libraryOptionsForType) { - var html = ''; - var plugins = availableTypeOptions.ImageFetchers; + let html = ''; + let plugins = availableTypeOptions.ImageFetchers; plugins = getOrderedPlugins(plugins, libraryOptionsForType.ImageFetcherOrder || []); if (!plugins.length) return html; @@ -208,17 +218,17 @@ define(['globalize', 'dom', 'emby-checkbox', 'emby-select', 'emby-input'], funct html += '
'; html += '
'; html += '

' + globalize.translate('HeaderTypeImageFetchers', availableTypeOptions.Type) + '

'; - var supportedImageTypes = availableTypeOptions.SupportedImageTypes || []; + const supportedImageTypes = availableTypeOptions.SupportedImageTypes || []; if (supportedImageTypes.length > 1 || 1 === supportedImageTypes.length && 'Primary' !== supportedImageTypes[0]) { html += ''; } html += '
'; html += '
'; - for (var i = 0; i < plugins.length; i++) { - var plugin = plugins[i]; + for (let i = 0; i < plugins.length; i++) { + const plugin = plugins[i]; html += '
'; - var isChecked = libraryOptionsForType.ImageFetchers ? -1 !== libraryOptionsForType.ImageFetchers.indexOf(plugin.Name) : plugin.DefaultEnabled; - var checkedHtml = isChecked ? ' checked="checked"' : ''; + const isChecked = libraryOptionsForType.ImageFetchers ? libraryOptionsForType.ImageFetchers.includes(plugin.Name) : plugin.DefaultEnabled; + const checkedHtml = isChecked ? ' checked="checked"' : ''; html += ''; html += '
'; html += '

'; @@ -239,10 +249,10 @@ define(['globalize', 'dom', 'emby-checkbox', 'emby-select', 'emby-input'], funct } function renderImageFetchers(page, availableOptions, libraryOptions) { - var html = ''; - var elem = page.querySelector('.imageFetchers'); - for (var i = 0; i < availableOptions.TypeOptions.length; i++) { - var availableTypeOptions = availableOptions.TypeOptions[i]; + let html = ''; + const elem = page.querySelector('.imageFetchers'); + for (let i = 0; i < availableOptions.TypeOptions.length; i++) { + const availableTypeOptions = availableOptions.TypeOptions[i]; html += getImageFetchersForTypeHtml(availableTypeOptions, getTypeOptions(libraryOptions, availableTypeOptions.Type) || {}); } elem.innerHTML = html; @@ -259,11 +269,11 @@ define(['globalize', 'dom', 'emby-checkbox', 'emby-select', 'emby-input'], funct } function populateMetadataSettings(parent, contentType, isNewLibrary) { - var isNewLibrary = parent.classList.contains('newlibrary'); + isNewLibrary = parent.classList.contains('newlibrary'); return ApiClient.getJSON(ApiClient.getUrl('Libraries/AvailableOptions', { LibraryContentType: contentType, IsNewLibrary: isNewLibrary - })).then(function(availableOptions) { + })).then(availableOptions => { currentAvailableOptions = availableOptions; parent.availableOptions = availableOptions; renderMetadataSavers(parent, availableOptions.MetadataSavers); @@ -272,14 +282,14 @@ define(['globalize', 'dom', 'emby-checkbox', 'emby-select', 'emby-input'], funct renderSubtitleFetchers(parent, availableOptions, {}); renderImageFetchers(parent, availableOptions, {}); availableOptions.SubtitleFetchers.length ? parent.querySelector('.subtitleDownloadSettings').classList.remove('hide') : parent.querySelector('.subtitleDownloadSettings').classList.add('hide'); - }).catch(function() { + }).catch(() => { return Promise.resolve(); }); } function adjustSortableListElement(elem) { - var btnSortable = elem.querySelector('.btnSortable'); - var inner = btnSortable.querySelector('.material-icons'); + const btnSortable = elem.querySelector('.btnSortable'); + const inner = btnSortable.querySelector('.material-icons'); if (elem.previousSibling) { btnSortable.title = globalize.translate('ButtonUp'); btnSortable.classList.add('btnSortableMoveUp'); @@ -296,22 +306,22 @@ define(['globalize', 'dom', 'emby-checkbox', 'emby-select', 'emby-input'], funct } function showImageOptionsForType(type) { - require(['imageoptionseditor'], function(ImageOptionsEditor) { - var typeOptions = getTypeOptions(currentLibraryOptions, type); + import('imageoptionseditor').then(({default: ImageOptionsEditor}) => { + let typeOptions = getTypeOptions(currentLibraryOptions, type); if (!typeOptions) { typeOptions = { Type: type }; currentLibraryOptions.TypeOptions.push(typeOptions); } - var availableOptions = getTypeOptions(currentAvailableOptions || {}, type); - var imageOptionsEditor = new ImageOptionsEditor(); + const availableOptions = getTypeOptions(currentAvailableOptions || {}, type); + const imageOptionsEditor = new ImageOptionsEditor(); imageOptionsEditor.show(type, typeOptions, availableOptions); }); } function onImageFetchersContainerClick(e) { - var btnImageOptionsForType = dom.parentWithClass(e.target, 'btnImageOptionsForType'); + const btnImageOptionsForType = dom.parentWithClass(e.target, 'btnImageOptionsForType'); if (btnImageOptionsForType) { return void showImageOptionsForType(dom.parentWithClass(btnImageOptionsForType, 'imageFetcher').getAttribute('data-type')); } @@ -319,18 +329,18 @@ define(['globalize', 'dom', 'emby-checkbox', 'emby-select', 'emby-input'], funct } function onSortableContainerClick(e) { - var btnSortable = dom.parentWithClass(e.target, 'btnSortable'); + const btnSortable = dom.parentWithClass(e.target, 'btnSortable'); if (btnSortable) { - var li = dom.parentWithClass(btnSortable, 'sortableOption'); - var list = dom.parentWithClass(li, 'paperList'); + const li = dom.parentWithClass(btnSortable, 'sortableOption'); + const list = dom.parentWithClass(li, 'paperList'); if (btnSortable.classList.contains('btnSortableMoveDown')) { - var next = li.nextSibling; + const next = li.nextSibling; if (next) { li.parentNode.removeChild(li); next.parentNode.insertBefore(li, next.nextSibling); } } else { - var prev = li.previousSibling; + const prev = li.previousSibling; if (prev) { li.parentNode.removeChild(li); prev.parentNode.insertBefore(li, prev); @@ -347,41 +357,38 @@ define(['globalize', 'dom', 'emby-checkbox', 'emby-select', 'emby-input'], funct parent.querySelector('.imageFetchers').addEventListener('click', onImageFetchersContainerClick); } - function embed(parent, contentType, libraryOptions) { + export function embed(parent, contentType, libraryOptions) { currentLibraryOptions = { TypeOptions: [] }; currentAvailableOptions = null; - var isNewLibrary = null === libraryOptions; + const isNewLibrary = null === libraryOptions; isNewLibrary && parent.classList.add('newlibrary'); - return new Promise(function(resolve, reject) { - var xhr = new XMLHttpRequest; - xhr.open('GET', 'components/libraryoptionseditor/libraryoptionseditor.template.html', true); - xhr.onload = function(e) { - var template = this.response; + return new Promise((resolve) => { + //TODO: remove require + require(['text!./components/libraryoptionseditor/libraryoptionseditor.template.html'], function (template) { parent.innerHTML = globalize.translateDocument(template); populateRefreshInterval(parent.querySelector('#selectAutoRefreshInterval')); - var promises = [populateLanguages(parent), populateCountries(parent.querySelector('#selectCountry'))]; - Promise.all(promises).then(function() { - return setContentType(parent, contentType).then(function() { + const promises = [populateLanguages(parent), populateCountries(parent.querySelector('#selectCountry'))]; + Promise.all(promises).then(() => { + return setContentType(parent, contentType).then(() => { libraryOptions && setLibraryOptions(parent, libraryOptions); bindEvents(parent); resolve(); }); }); - }; - xhr.send(); + }); }); } - function setAdvancedVisible(parent, visible) { - var elems = parent.querySelectorAll('.advanced'); - for (var i = 0; i < elems.length; i++) { + export function setAdvancedVisible(parent, visible) { + const elems = parent.querySelectorAll('.advanced'); + for (let i = 0; i < elems.length; i++) { visible ? elems[i].classList.remove('advancedHide') : elems[i].classList.add('advancedHide'); } } - function setContentType(parent, contentType) { + export function setContentType(parent, contentType) { if (contentType === 'homevideos' || contentType === 'photos') { parent.querySelector('.chkEnablePhotosContainer').classList.remove('hide'); } else { @@ -422,47 +429,47 @@ define(['globalize', 'dom', 'emby-checkbox', 'emby-select', 'emby-input'], funct } function setSubtitleFetchersIntoOptions(parent, options) { - options.DisabledSubtitleFetchers = Array.prototype.map.call(Array.prototype.filter.call(parent.querySelectorAll('.chkSubtitleFetcher'), function(elem) { + options.DisabledSubtitleFetchers = Array.prototype.map.call(Array.prototype.filter.call(parent.querySelectorAll('.chkSubtitleFetcher'), elem => { return !elem.checked; - }), function(elem) { + }), elem => { return elem.getAttribute('data-pluginname'); }); - options.SubtitleFetcherOrder = Array.prototype.map.call(parent.querySelectorAll('.subtitleFetcherItem'), function(elem) { + options.SubtitleFetcherOrder = Array.prototype.map.call(parent.querySelectorAll('.subtitleFetcherItem'), elem => { return elem.getAttribute('data-pluginname'); }); } function setMetadataFetchersIntoOptions(parent, options) { - var sections = parent.querySelectorAll('.metadataFetcher'); - for (var i = 0; i < sections.length; i++) { - var section = sections[i]; - var type = section.getAttribute('data-type'); - var typeOptions = getTypeOptions(options, type); + const sections = parent.querySelectorAll('.metadataFetcher'); + for (let i = 0; i < sections.length; i++) { + const section = sections[i]; + const type = section.getAttribute('data-type'); + let typeOptions = getTypeOptions(options, type); if (!typeOptions) { typeOptions = { Type: type }; options.TypeOptions.push(typeOptions); } - typeOptions.MetadataFetchers = Array.prototype.map.call(Array.prototype.filter.call(section.querySelectorAll('.chkMetadataFetcher'), function(elem) { + typeOptions.MetadataFetchers = Array.prototype.map.call(Array.prototype.filter.call(section.querySelectorAll('.chkMetadataFetcher'), elem => { return elem.checked; - }), function(elem) { + }), elem => { return elem.getAttribute('data-pluginname'); }); - typeOptions.MetadataFetcherOrder = Array.prototype.map.call(section.querySelectorAll('.metadataFetcherItem'), function(elem) { + typeOptions.MetadataFetcherOrder = Array.prototype.map.call(section.querySelectorAll('.metadataFetcherItem'), elem => { return elem.getAttribute('data-pluginname'); }); } } function setImageFetchersIntoOptions(parent, options) { - var sections = parent.querySelectorAll('.imageFetcher'); - for (var i = 0; i < sections.length; i++) { - var section = sections[i]; - var type = section.getAttribute('data-type'); - var typeOptions = getTypeOptions(options, type); + const sections = parent.querySelectorAll('.imageFetcher'); + for (let i = 0; i < sections.length; i++) { + const section = sections[i]; + const type = section.getAttribute('data-type'); + let typeOptions = getTypeOptions(options, type); if (!typeOptions) { typeOptions = { Type: type @@ -470,23 +477,23 @@ define(['globalize', 'dom', 'emby-checkbox', 'emby-select', 'emby-input'], funct options.TypeOptions.push(typeOptions); } - typeOptions.ImageFetchers = Array.prototype.map.call(Array.prototype.filter.call(section.querySelectorAll('.chkImageFetcher'), function(elem) { + typeOptions.ImageFetchers = Array.prototype.map.call(Array.prototype.filter.call(section.querySelectorAll('.chkImageFetcher'), elem => { return elem.checked; - }), function(elem) { + }), elem => { return elem.getAttribute('data-pluginname'); }); - typeOptions.ImageFetcherOrder = Array.prototype.map.call(section.querySelectorAll('.imageFetcherItem'), function(elem) { + typeOptions.ImageFetcherOrder = Array.prototype.map.call(section.querySelectorAll('.imageFetcherItem'), elem => { return elem.getAttribute('data-pluginname'); }); } } - function setImageOptionsIntoOptions(parent, options) { - var originalTypeOptions = (currentLibraryOptions || {}).TypeOptions || []; - for (var i = 0; i < originalTypeOptions.length; i++) { - var originalTypeOption = originalTypeOptions[i]; - var typeOptions = getTypeOptions(options, originalTypeOption.Type); + function setImageOptionsIntoOptions(options) { + const originalTypeOptions = (currentLibraryOptions || {}).TypeOptions || []; + for (let i = 0; i < originalTypeOptions.length; i++) { + const originalTypeOption = originalTypeOptions[i]; + let typeOptions = getTypeOptions(options, originalTypeOption.Type); if (!typeOptions) { typeOptions = { @@ -498,8 +505,8 @@ define(['globalize', 'dom', 'emby-checkbox', 'emby-select', 'emby-input'], funct } } - function getLibraryOptions(parent) { - var options = { + export function getLibraryOptions(parent) { + const options = { EnableArchiveMediaFiles: false, EnablePhotos: parent.querySelector('.chkEnablePhotos').checked, EnableRealtimeMonitor: parent.querySelector('.chkEnableRealtimeMonitor').checked, @@ -520,39 +527,39 @@ define(['globalize', 'dom', 'emby-checkbox', 'emby-select', 'emby-input'], funct SkipSubtitlesIfAudioTrackMatches: parent.querySelector('#chkSkipIfAudioTrackPresent').checked, SaveSubtitlesWithMedia: parent.querySelector('#chkSaveSubtitlesLocally').checked, RequirePerfectSubtitleMatch: parent.querySelector('#chkRequirePerfectMatch').checked, - MetadataSavers: Array.prototype.map.call(Array.prototype.filter.call(parent.querySelectorAll('.chkMetadataSaver'), function(elem) { + MetadataSavers: Array.prototype.map.call(Array.prototype.filter.call(parent.querySelectorAll('.chkMetadataSaver'), elem => { return elem.checked; - }), function(elem) { + }), elem => { return elem.getAttribute('data-pluginname'); }), TypeOptions: [] }; - options.LocalMetadataReaderOrder = Array.prototype.map.call(parent.querySelectorAll('.localReaderOption'), function(elem) { + options.LocalMetadataReaderOrder = Array.prototype.map.call(parent.querySelectorAll('.localReaderOption'), elem => { return elem.getAttribute('data-pluginname'); }); - options.SubtitleDownloadLanguages = Array.prototype.map.call(Array.prototype.filter.call(parent.querySelectorAll('.chkSubtitleLanguage'), function(elem) { + options.SubtitleDownloadLanguages = Array.prototype.map.call(Array.prototype.filter.call(parent.querySelectorAll('.chkSubtitleLanguage'), elem => { return elem.checked; - }), function(elem) { + }), elem => { return elem.getAttribute('data-lang'); }); setSubtitleFetchersIntoOptions(parent, options); setMetadataFetchersIntoOptions(parent, options); setImageFetchersIntoOptions(parent, options); - setImageOptionsIntoOptions(parent, options); + setImageOptionsIntoOptions(options); return options; } function getOrderedPlugins(plugins, configuredOrder) { plugins = plugins.slice(0); - plugins.sort(function(a, b) { + plugins.sort((a, b) => { return a = configuredOrder.indexOf(a.Name), b = configuredOrder.indexOf(b.Name), a < b ? -1 : a > b ? 1 : 0; }); return plugins; } - function setLibraryOptions(parent, options) { + export function setLibraryOptions(parent, options) { currentLibraryOptions = options; currentAvailableOptions = parent.availableOptions; parent.querySelector('#selectLanguage').value = options.PreferredMetadataLanguage || ''; @@ -573,11 +580,11 @@ define(['globalize', 'dom', 'emby-checkbox', 'emby-select', 'emby-input'], funct parent.querySelector('#chkSaveSubtitlesLocally').checked = options.SaveSubtitlesWithMedia; parent.querySelector('#chkSkipIfAudioTrackPresent').checked = options.SkipSubtitlesIfAudioTrackMatches; parent.querySelector('#chkRequirePerfectMatch').checked = options.RequirePerfectSubtitleMatch; - Array.prototype.forEach.call(parent.querySelectorAll('.chkMetadataSaver'), function(elem) { - elem.checked = options.MetadataSavers ? -1 !== options.MetadataSavers.indexOf(elem.getAttribute('data-pluginname')) : 'true' === elem.getAttribute('data-defaultenabled'); + Array.prototype.forEach.call(parent.querySelectorAll('.chkMetadataSaver'), elem => { + elem.checked = options.MetadataSavers ? options.MetadataSavers.includes(elem.getAttribute('data-pluginname')) : 'true' === elem.getAttribute('data-defaultenabled'); }); - Array.prototype.forEach.call(parent.querySelectorAll('.chkSubtitleLanguage'), function(elem) { - elem.checked = !!options.SubtitleDownloadLanguages && -1 !== options.SubtitleDownloadLanguages.indexOf(elem.getAttribute('data-lang')); + Array.prototype.forEach.call(parent.querySelectorAll('.chkSubtitleLanguage'), elem => { + elem.checked = !!options.SubtitleDownloadLanguages && options.SubtitleDownloadLanguages.includes(elem.getAttribute('data-lang')); }); renderMetadataReaders(parent, getOrderedPlugins(parent.availableOptions.MetadataReaders, options.LocalMetadataReaderOrder || [])); renderMetadataFetchers(parent, parent.availableOptions, options); @@ -585,14 +592,14 @@ define(['globalize', 'dom', 'emby-checkbox', 'emby-select', 'emby-input'], funct renderSubtitleFetchers(parent, parent.availableOptions, options); } - var currentLibraryOptions; - var currentAvailableOptions; + let currentLibraryOptions; + let currentAvailableOptions; - return { - embed: embed, - setContentType: setContentType, - getLibraryOptions: getLibraryOptions, - setLibraryOptions: setLibraryOptions, - setAdvancedVisible: setAdvancedVisible - }; -}); +/* eslint-enable indent */ +export default { + embed: embed, + setContentType: setContentType, + getLibraryOptions: getLibraryOptions, + setLibraryOptions: setLibraryOptions, + setAdvancedVisible: setAdvancedVisible +}; From bb5d37f3e7d6e954b50274edd83f0f849985c33e Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Tue, 9 Jun 2020 22:37:34 +0300 Subject: [PATCH 008/244] Migration mediaLibraryEditor and mediaLibraryCreator to es6 --- package.json | 2 + .../mediaLibraryCreator.js | 131 +++++++++-------- .../mediaLibraryEditor/mediaLibraryEditor.js | 137 ++++++++++-------- src/controllers/dashboard/mediaLibrary.js | 4 +- 4 files changed, 154 insertions(+), 120 deletions(-) diff --git a/package.json b/package.json index d9b2ed7616..117477a705 100644 --- a/package.json +++ b/package.json @@ -96,6 +96,8 @@ "src/components/images/imageLoader.js", "src/components/indicators/indicators.js", "src/components/lazyLoader/lazyLoaderIntersectionObserver.js", + "src/components/mediaLibraryCreator/mediaLibraryCreator.js", + "src/components/mediaLibraryEditor/mediaLibraryEditor.js", "src/components/playback/brightnessosd.js", "src/components/playback/mediasession.js", "src/components/playback/nowplayinghelper.js", diff --git a/src/components/mediaLibraryCreator/mediaLibraryCreator.js b/src/components/mediaLibraryCreator/mediaLibraryCreator.js index bbef6e1f07..c7011ba1d8 100644 --- a/src/components/mediaLibraryCreator/mediaLibraryCreator.js +++ b/src/components/mediaLibraryCreator/mediaLibraryCreator.js @@ -1,5 +1,24 @@ -define(['loading', 'dialogHelper', 'dom', 'jQuery', 'components/libraryoptionseditor/libraryoptionseditor', 'globalize', 'emby-toggle', 'emby-input', 'emby-select', 'paper-icon-button-light', 'listViewStyle', 'formDialogStyle', 'emby-button', 'flexStyles'], function (loading, dialogHelper, dom, $, libraryoptionseditor, globalize) { - 'use strict'; +/* eslint-disable indent */ + +/** + * Module for media library creator. + * @module components/mediaLibraryCreator/mediaLibraryCreator + */ + +import loading from 'loading'; +import dialogHelper from 'dialogHelper'; +import dom from 'dom'; +import $ from 'jQuery'; +import libraryoptionseditor from 'components/libraryoptionseditor/libraryoptionseditor'; +import globalize from 'globalize'; +import 'emby-toggle'; +import 'emby-input'; +import 'emby-select'; +import 'paper-icon-button-light'; +import 'listViewStyle'; +import 'formDialogStyle'; +import 'emby-button'; +import 'flexStyles'; function onAddLibrary() { if (isCreating) { @@ -7,7 +26,7 @@ define(['loading', 'dialogHelper', 'dom', 'jQuery', 'components/libraryoptionsed } if (pathInfos.length == 0) { - require(['alert'], function (alert) { + import('alert').then(({default: alert}) => { alert({ text: globalize.translate('PleaseAddAtLeastOneFolder'), type: 'error' @@ -19,23 +38,23 @@ define(['loading', 'dialogHelper', 'dom', 'jQuery', 'components/libraryoptionsed isCreating = true; loading.show(); - var dlg = dom.parentWithClass(this, 'dlg-librarycreator'); - var name = $('#txtValue', dlg).val(); - var type = $('#selectCollectionType', dlg).val(); + const dlg = dom.parentWithClass(this, 'dlg-librarycreator'); + const name = $('#txtValue', dlg).val(); + let type = $('#selectCollectionType', dlg).val(); if (type == 'mixed') { type = null; } - var libraryOptions = libraryoptionseditor.getLibraryOptions(dlg.querySelector('.libraryOptions')); + const libraryOptions = libraryoptionseditor.getLibraryOptions(dlg.querySelector('.libraryOptions')); libraryOptions.PathInfos = pathInfos; - ApiClient.addVirtualFolder(name, type, currentOptions.refresh, libraryOptions).then(function () { + ApiClient.addVirtualFolder(name, type, currentOptions.refresh, libraryOptions).then(() => { hasChanges = true; isCreating = false; loading.hide(); dialogHelper.close(dlg); - }, function () { - require(['toast'], function (toast) { + }, () => { + import('toast').then(({default: toast}) => { toast(globalize.translate('ErrorAddingMediaPathToVirtualFolder')); }); @@ -46,15 +65,15 @@ define(['loading', 'dialogHelper', 'dom', 'jQuery', 'components/libraryoptionsed } function getCollectionTypeOptionsHtml(collectionTypeOptions) { - return collectionTypeOptions.map(function (i) { - return ''; + return collectionTypeOptions.map(i => { + return ``; }).join(''); } function initEditor(page, collectionTypeOptions) { $('#selectCollectionType', page).html(getCollectionTypeOptionsHtml(collectionTypeOptions)).val('').on('change', function () { - var value = this.value; - var dlg = $(this).parents('.dialog')[0]; + const value = this.value; + const dlg = $(this).parents('.dialog')[0]; libraryoptionseditor.setContentType(dlg.querySelector('.libraryOptions'), value == 'mixed' ? '' : value); if (value) { @@ -64,12 +83,12 @@ define(['loading', 'dialogHelper', 'dom', 'jQuery', 'components/libraryoptionsed } if (value != 'mixed') { - var index = this.selectedIndex; + const index = this.selectedIndex; if (index != -1) { - var name = this.options[index].innerHTML.replace('*', '').replace('&', '&'); + const name = this.options[index].innerHTML.replace('*', '').replace('&', '&'); $('#txtValue', dlg).val(name); - var folderOption = collectionTypeOptions.filter(function (i) { + const folderOption = collectionTypeOptions.filter(i => { return i.value == value; })[0]; $('.collectionTypeFieldDescription', dlg).html(folderOption.message || ''); @@ -83,15 +102,15 @@ define(['loading', 'dialogHelper', 'dom', 'jQuery', 'components/libraryoptionsed } function onToggleAdvancedChange() { - var dlg = dom.parentWithClass(this, 'dlg-librarycreator'); + const dlg = dom.parentWithClass(this, 'dlg-librarycreator'); libraryoptionseditor.setAdvancedVisible(dlg.querySelector('.libraryOptions'), this.checked); } function onAddButtonClick() { - var page = dom.parentWithClass(this, 'dlg-librarycreator'); + const page = dom.parentWithClass(this, 'dlg-librarycreator'); - require(['directorybrowser'], function (directoryBrowser) { - var picker = new directoryBrowser(); + import('directorybrowser').then(({default: directoryBrowser}) => { + const picker = new directoryBrowser(); picker.show({ enableNetworkSharePath: true, callback: function (path, networkSharePath) { @@ -106,24 +125,24 @@ define(['loading', 'dialogHelper', 'dom', 'jQuery', 'components/libraryoptionsed } function getFolderHtml(pathInfo, index) { - var html = ''; + let html = ''; html += '
'; - html += '
'; - html += '
' + pathInfo.Path + '
'; + html += `
`; + html += `
${pathInfo.Path}
`; if (pathInfo.NetworkPath) { - html += '
' + pathInfo.NetworkPath + '
'; + html += `
${pathInfo.NetworkPath}
`; } html += '
'; - html += ''; + html += ``; html += '
'; return html; } function renderPaths(page) { - var foldersHtml = pathInfos.map(getFolderHtml).join(''); - var folderList = page.querySelector('.folderList'); + const foldersHtml = pathInfos.map(getFolderHtml).join(''); + const folderList = page.querySelector('.folderList'); folderList.innerHTML = foldersHtml; if (foldersHtml) { @@ -134,13 +153,13 @@ define(['loading', 'dialogHelper', 'dom', 'jQuery', 'components/libraryoptionsed } function addMediaLocation(page, path, networkSharePath) { - var pathLower = path.toLowerCase(); - var pathFilter = pathInfos.filter(function (p) { + const pathLower = path.toLowerCase(); + const pathFilter = pathInfos.filter(p => { return p.Path.toLowerCase() == pathLower; }); if (!pathFilter.length) { - var pathInfo = { + const pathInfo = { Path: path }; @@ -154,11 +173,11 @@ define(['loading', 'dialogHelper', 'dom', 'jQuery', 'components/libraryoptionsed } function onRemoveClick(e) { - var button = dom.parentWithClass(e.target, 'btnRemovePath'); - var index = parseInt(button.getAttribute('data-index')); - var location = pathInfos[index].Path; - var locationLower = location.toLowerCase(); - pathInfos = pathInfos.filter(function (p) { + const button = dom.parentWithClass(e.target, 'btnRemovePath'); + const index = parseInt(button.getAttribute('data-index')); + const location = pathInfos[index].Path; + const locationLower = location.toLowerCase(); + pathInfos = pathInfos.filter(p => { return p.Path.toLowerCase() != locationLower; }); renderPaths(dom.parentWithClass(button, 'dlg-librarycreator')); @@ -169,24 +188,22 @@ define(['loading', 'dialogHelper', 'dom', 'jQuery', 'components/libraryoptionsed } function initLibraryOptions(dlg) { - libraryoptionseditor.embed(dlg.querySelector('.libraryOptions')).then(function () { + libraryoptionseditor.embed(dlg.querySelector('.libraryOptions')).then(() => { $('#selectCollectionType', dlg).trigger('change'); onToggleAdvancedChange.call(dlg.querySelector('.chkAdvanced')); }); } - function editor() { - this.show = function (options) { - return new Promise(function (resolve, reject) { +export class editor { + constructor() { + this.show = options => { + return new Promise((resolve) => { currentOptions = options; currentResolve = resolve; hasChanges = false; - var xhr = new XMLHttpRequest(); - xhr.open('GET', 'components/mediaLibraryCreator/mediaLibraryCreator.template.html', true); - - xhr.onload = function (e) { - var template = this.response; - var dlg = dialogHelper.createDialog({ + // TODO: remove require + require(['text!./components/mediaLibraryCreator/mediaLibraryCreator.template.html'], template => { + const dlg = dialogHelper.createDialog({ size: 'small', modal: false, removeOnClose: true, @@ -200,23 +217,23 @@ define(['loading', 'dialogHelper', 'dom', 'jQuery', 'components/libraryoptionsed initEditor(dlg, options.collectionTypeOptions); dlg.addEventListener('close', onDialogClosed); dialogHelper.open(dlg); - dlg.querySelector('.btnCancel').addEventListener('click', function () { + dlg.querySelector('.btnCancel').addEventListener('click', () => { dialogHelper.close(dlg); }); pathInfos = []; renderPaths(dlg); initLibraryOptions(dlg); - }; - - xhr.send(); + }); }); }; } +} - var pathInfos = []; - var currentResolve; - var currentOptions; - var hasChanges = false; - var isCreating = false; - return editor; -}); + let pathInfos = []; + let currentResolve; + let currentOptions; + let hasChanges = false; + let isCreating = false; + +/* eslint-enable indent */ +export default editor; diff --git a/src/components/mediaLibraryEditor/mediaLibraryEditor.js b/src/components/mediaLibraryEditor/mediaLibraryEditor.js index 554cf4cc0f..5b533b2ac9 100644 --- a/src/components/mediaLibraryEditor/mediaLibraryEditor.js +++ b/src/components/mediaLibraryEditor/mediaLibraryEditor.js @@ -1,5 +1,22 @@ -define(['jQuery', 'loading', 'dialogHelper', 'dom', 'components/libraryoptionseditor/libraryoptionseditor', 'globalize', 'emby-button', 'listViewStyle', 'paper-icon-button-light', 'formDialogStyle', 'emby-toggle', 'flexStyles'], function (jQuery, loading, dialogHelper, dom, libraryoptionseditor, globalize) { - 'use strict'; +/* eslint-disable indent */ + +/** + * Module for media library editor. + * @module components/mediaLibraryEditor/mediaLibraryEditor + */ + +import jQuery from 'jQuery'; +import loading from 'loading'; +import dialogHelper from 'dialogHelper'; +import dom from 'dom'; +import libraryoptionseditor from 'components/libraryoptionseditor/libraryoptionseditor'; +import globalize from 'globalize'; +import 'emby-button'; +import 'listViewStyle'; +import 'paper-icon-button-light'; +import 'formDialogStyle'; +import 'emby-toggle'; +import 'flexStyles'; function onEditLibrary() { if (isCreating) { @@ -8,15 +25,15 @@ define(['jQuery', 'loading', 'dialogHelper', 'dom', 'components/libraryoptionsed isCreating = true; loading.show(); - var dlg = dom.parentWithClass(this, 'dlg-libraryeditor'); - var libraryOptions = libraryoptionseditor.getLibraryOptions(dlg.querySelector('.libraryOptions')); + const dlg = dom.parentWithClass(this, 'dlg-libraryeditor'); + let libraryOptions = libraryoptionseditor.getLibraryOptions(dlg.querySelector('.libraryOptions')); libraryOptions = Object.assign(currentOptions.library.LibraryOptions || {}, libraryOptions); - ApiClient.updateVirtualFolderOptions(currentOptions.library.ItemId, libraryOptions).then(function () { + ApiClient.updateVirtualFolderOptions(currentOptions.library.ItemId, libraryOptions).then(() => { hasChanges = true; isCreating = false; loading.hide(); dialogHelper.close(dlg); - }, function () { + }, () => { isCreating = false; loading.hide(); }); @@ -24,50 +41,50 @@ define(['jQuery', 'loading', 'dialogHelper', 'dom', 'components/libraryoptionsed } function addMediaLocation(page, path, networkSharePath) { - var virtualFolder = currentOptions.library; - var refreshAfterChange = currentOptions.refresh; - ApiClient.addMediaPath(virtualFolder.Name, path, networkSharePath, refreshAfterChange).then(function () { + const virtualFolder = currentOptions.library; + const refreshAfterChange = currentOptions.refresh; + ApiClient.addMediaPath(virtualFolder.Name, path, networkSharePath, refreshAfterChange).then(() => { hasChanges = true; refreshLibraryFromServer(page); - }, function () { - require(['toast'], function (toast) { + }, () => { + import('toast').then(({default: toast}) => { toast(globalize.translate('ErrorAddingMediaPathToVirtualFolder')); }); }); } function updateMediaLocation(page, path, networkSharePath) { - var virtualFolder = currentOptions.library; + const virtualFolder = currentOptions.library; ApiClient.updateMediaPath(virtualFolder.Name, { Path: path, NetworkPath: networkSharePath - }).then(function () { + }).then(() => { hasChanges = true; refreshLibraryFromServer(page); - }, function () { - require(['toast'], function (toast) { + }, () => { + import('toast').then(({default: toast}) => { toast(globalize.translate('ErrorAddingMediaPathToVirtualFolder')); }); }); } function onRemoveClick(btnRemovePath, location) { - var button = btnRemovePath; - var virtualFolder = currentOptions.library; + const button = btnRemovePath; + const virtualFolder = currentOptions.library; - require(['confirm'], function (confirm) { + import('confirm').then(({default: confirm}) => { confirm({ title: globalize.translate('HeaderRemoveMediaLocation'), text: globalize.translate('MessageConfirmRemoveMediaLocation'), confirmText: globalize.translate('ButtonDelete'), primary: 'delete' - }).then(function () { - var refreshAfterChange = currentOptions.refresh; - ApiClient.removeMediaPath(virtualFolder.Name, location, refreshAfterChange).then(function () { + }).then(() => { + const refreshAfterChange = currentOptions.refresh; + ApiClient.removeMediaPath(virtualFolder.Name, location, refreshAfterChange).then(() => { hasChanges = true; refreshLibraryFromServer(dom.parentWithClass(button, 'dlg-libraryeditor')); - }, function () { - require(['toast'], function (toast) { + }, () => { + import('toast').then(({default: toast}) => { toast(globalize.translate('DefaultErrorMessage')); }); }); @@ -76,14 +93,14 @@ define(['jQuery', 'loading', 'dialogHelper', 'dom', 'components/libraryoptionsed } function onListItemClick(e) { - var listItem = dom.parentWithClass(e.target, 'listItem'); + const listItem = dom.parentWithClass(e.target, 'listItem'); if (listItem) { - var index = parseInt(listItem.getAttribute('data-index')); - var pathInfos = (currentOptions.library.LibraryOptions || {}).PathInfos || []; - var pathInfo = null == index ? {} : pathInfos[index] || {}; - var originalPath = pathInfo.Path || (null == index ? null : currentOptions.library.Locations[index]); - var btnRemovePath = dom.parentWithClass(e.target, 'btnRemovePath'); + const index = parseInt(listItem.getAttribute('data-index')); + const pathInfos = (currentOptions.library.LibraryOptions || {}).PathInfos || []; + const pathInfo = null == index ? {} : pathInfos[index] || {}; + const originalPath = pathInfo.Path || (null == index ? null : currentOptions.library.Locations[index]); + const btnRemovePath = dom.parentWithClass(e.target, 'btnRemovePath'); if (btnRemovePath) { onRemoveClick(btnRemovePath, originalPath); @@ -95,26 +112,26 @@ define(['jQuery', 'loading', 'dialogHelper', 'dom', 'components/libraryoptionsed } function getFolderHtml(pathInfo, index) { - var html = ''; - html += '
'; - html += '
'; + let html = ''; + html += `
`; + html += `
`; html += '

'; html += pathInfo.Path; html += '

'; if (pathInfo.NetworkPath) { - html += '
' + pathInfo.NetworkPath + '
'; + html += `
${pathInfo.NetworkPath}
`; } html += '
'; - html += ''; + html += ``; html += '
'; return html; } function refreshLibraryFromServer(page) { - ApiClient.getVirtualFolders().then(function (result) { - var library = result.filter(function (f) { + ApiClient.getVirtualFolders().then(result => { + const library = result.filter(f => { return f.Name === currentOptions.library.Name; })[0]; @@ -126,10 +143,10 @@ define(['jQuery', 'loading', 'dialogHelper', 'dom', 'components/libraryoptionsed } function renderLibrary(page, options) { - var pathInfos = (options.library.LibraryOptions || {}).PathInfos || []; + let pathInfos = (options.library.LibraryOptions || {}).PathInfos || []; if (!pathInfos.length) { - pathInfos = options.library.Locations.map(function (p) { + pathInfos = options.library.Locations.map(p => { return { Path: p }; @@ -150,8 +167,8 @@ define(['jQuery', 'loading', 'dialogHelper', 'dom', 'components/libraryoptionsed } function showDirectoryBrowser(context, originalPath, networkPath) { - require(['directorybrowser'], function (directoryBrowser) { - var picker = new directoryBrowser(); + import('directorybrowser').then(({default: directoryBrowser}) => { + const picker = new directoryBrowser(); picker.show({ enableNetworkSharePath: true, pathReadOnly: null != originalPath, @@ -173,7 +190,7 @@ define(['jQuery', 'loading', 'dialogHelper', 'dom', 'components/libraryoptionsed } function onToggleAdvancedChange() { - var dlg = dom.parentWithClass(this, 'dlg-libraryeditor'); + const dlg = dom.parentWithClass(this, 'dlg-libraryeditor'); libraryoptionseditor.setAdvancedVisible(dlg.querySelector('.libraryOptions'), this.checked); } @@ -183,7 +200,7 @@ define(['jQuery', 'loading', 'dialogHelper', 'dom', 'components/libraryoptionsed dlg.querySelector('.folderList').addEventListener('click', onListItemClick); dlg.querySelector('.chkAdvanced').addEventListener('change', onToggleAdvancedChange); dlg.querySelector('.btnSubmit').addEventListener('click', onEditLibrary); - libraryoptionseditor.embed(dlg.querySelector('.libraryOptions'), options.library.CollectionType, options.library.LibraryOptions).then(function () { + libraryoptionseditor.embed(dlg.querySelector('.libraryOptions'), options.library.CollectionType, options.library.LibraryOptions).then(() => { onToggleAdvancedChange.call(dlg.querySelector('.chkAdvanced')); }); } @@ -192,18 +209,16 @@ define(['jQuery', 'loading', 'dialogHelper', 'dom', 'components/libraryoptionsed currentDeferred.resolveWith(null, [hasChanges]); } - function editor() { - this.show = function (options) { - var deferred = jQuery.Deferred(); +export class editor { + constructor() { + this.show = options => { + const deferred = jQuery.Deferred(); currentOptions = options; currentDeferred = deferred; hasChanges = false; - var xhr = new XMLHttpRequest(); - xhr.open('GET', 'components/mediaLibraryEditor/mediaLibraryEditor.template.html', true); - - xhr.onload = function (e) { - var template = this.response; - var dlg = dialogHelper.createDialog({ + // TODO: remove require + require(['text!./components/mediaLibraryEditor/mediaLibraryEditor.template.html'], template => { + const dlg = dialogHelper.createDialog({ size: 'small', modal: false, removeOnClose: true, @@ -218,20 +233,20 @@ define(['jQuery', 'loading', 'dialogHelper', 'dom', 'components/libraryoptionsed initEditor(dlg, options); dlg.addEventListener('close', onDialogClosed); dialogHelper.open(dlg); - dlg.querySelector('.btnCancel').addEventListener('click', function () { + dlg.querySelector('.btnCancel').addEventListener('click', () => { dialogHelper.close(dlg); }); refreshLibraryFromServer(dlg); - }; - - xhr.send(); + }); return deferred.promise(); }; } +} - var currentDeferred; - var currentOptions; - var hasChanges = false; - var isCreating = false; - return editor; -}); + let currentDeferred; + let currentOptions; + let hasChanges = false; + let isCreating = false; + + /* eslint-enable indent */ +export default editor; diff --git a/src/controllers/dashboard/mediaLibrary.js b/src/controllers/dashboard/mediaLibrary.js index 06eba37cbd..ed6aabc8fd 100644 --- a/src/controllers/dashboard/mediaLibrary.js +++ b/src/controllers/dashboard/mediaLibrary.js @@ -3,7 +3,7 @@ define(['jQuery', 'apphost', 'scripts/taskbutton', 'loading', 'libraryMenu', 'gl function addVirtualFolder(page) { require(['medialibrarycreator'], function (medialibrarycreator) { - new medialibrarycreator().show({ + new medialibrarycreator.default().show({ collectionTypeOptions: getCollectionTypeOptions().filter(function (f) { return !f.hidden; }), @@ -18,7 +18,7 @@ define(['jQuery', 'apphost', 'scripts/taskbutton', 'loading', 'libraryMenu', 'gl function editVirtualFolder(page, virtualFolder) { require(['medialibraryeditor'], function (medialibraryeditor) { - new medialibraryeditor().show({ + new medialibraryeditor.default().show({ refresh: shouldRefreshLibraryAfterChanges(page), library: virtualFolder }).then(function (hasChanges) { From 7296dbc28428690386e7f873a7feda70f46d63b1 Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Tue, 9 Jun 2020 22:40:39 +0300 Subject: [PATCH 009/244] Migration imageUploader, itemidentifier and itemMediaInfo to es6 --- package.json | 3 + src/components/imageUploader/imageUploader.js | 93 +++++--- src/components/itemMediaInfo/itemMediaInfo.js | 96 +++++--- .../itemidentifier/itemidentifier.js | 225 ++++++++++-------- 4 files changed, 241 insertions(+), 176 deletions(-) diff --git a/package.json b/package.json index d9b2ed7616..41bbc013ee 100644 --- a/package.json +++ b/package.json @@ -94,7 +94,10 @@ "src/components/autoFocuser.js", "src/components/cardbuilder/cardBuilder.js", "src/components/images/imageLoader.js", + "src/components/imageUploader/imageUploader.js", "src/components/indicators/indicators.js", + "src/components/itemidentifier/itemidentifier.js", + "src/components/itemMediaInfo/itemMediaInfo.js", "src/components/lazyLoader/lazyLoaderIntersectionObserver.js", "src/components/playback/brightnessosd.js", "src/components/playback/mediasession.js", diff --git a/src/components/imageUploader/imageUploader.js b/src/components/imageUploader/imageUploader.js index e078a9fa30..e2d2c60f1b 100644 --- a/src/components/imageUploader/imageUploader.js +++ b/src/components/imageUploader/imageUploader.js @@ -1,10 +1,26 @@ -define(['dialogHelper', 'connectionManager', 'dom', 'loading', 'scrollHelper', 'layoutManager', 'globalize', 'require', 'emby-button', 'emby-select', 'formDialogStyle', 'css!./style'], function (dialogHelper, connectionManager, dom, loading, scrollHelper, layoutManager, globalize, require) { - 'use strict'; +/* eslint-disable indent */ - var currentItemId; - var currentServerId; - var currentFile; - var hasChanges = false; +/** + * Module for imageUploader. + * @module components/imageUploader/imageUploader + */ + +import dialogHelper from 'dialogHelper'; +import connectionManager from 'connectionManager'; +import dom from 'dom'; +import loading from 'loading'; +import scrollHelper from 'scrollHelper'; +import layoutManager from 'layoutManager'; +import globalize from 'globalize'; +import 'emby-button'; +import 'emby-select'; +import 'formDialogStyle'; +import 'css!./style'; + + let currentItemId; + let currentServerId; + let currentFile; + let hasChanges = false; function onFileReaderError(evt) { @@ -12,14 +28,14 @@ define(['dialogHelper', 'connectionManager', 'dom', 'loading', 'scrollHelper', ' switch (evt.target.error.code) { case evt.target.error.NOT_FOUND_ERR: - require(['toast'], function (toast) { + import('toast').then(({default: toast}) => { toast(globalize.translate('MessageFileReadError')); }); break; case evt.target.error.ABORT_ERR: break; // noop default: - require(['toast'], function (toast) { + import('toast').then(({default: toast}) => { toast(globalize.translate('MessageFileReadError')); }); break; @@ -28,7 +44,7 @@ define(['dialogHelper', 'connectionManager', 'dom', 'loading', 'scrollHelper', ' function setFiles(page, files) { - var file = files[0]; + const file = files[0]; if (!file || !file.type.match('image.*')) { page.querySelector('#imageOutput').innerHTML = ''; @@ -39,23 +55,23 @@ define(['dialogHelper', 'connectionManager', 'dom', 'loading', 'scrollHelper', ' currentFile = file; - var reader = new FileReader(); + const reader = new FileReader(); reader.onerror = onFileReaderError; - reader.onloadstart = function () { + reader.onloadstart = () => { page.querySelector('#fldUpload').classList.add('hide'); }; - reader.onabort = function () { + reader.onabort = () => { loading.hide(); console.debug('File read cancelled'); }; // Closure to capture the file information. - reader.onload = (function (theFile) { - return function (e) { + reader.onload = (theFile => { + return e => { // Render thumbnail. - var html = [''].join(''); + const html = [''].join(''); page.querySelector('#imageOutput').innerHTML = html; page.querySelector('#fldUpload').classList.remove('hide'); @@ -68,14 +84,14 @@ define(['dialogHelper', 'connectionManager', 'dom', 'loading', 'scrollHelper', ' function onSubmit(e) { - var file = currentFile; + const file = currentFile; if (!file) { return false; } if (!file.type.startsWith('image/')) { - require(['toast'], function (toast) { + import('toast').then(({default: toast}) => { toast(globalize.translate('MessageImageFileTypeAllowed')); }); e.preventDefault(); @@ -84,18 +100,18 @@ define(['dialogHelper', 'connectionManager', 'dom', 'loading', 'scrollHelper', ' loading.show(); - var dlg = dom.parentWithClass(this, 'dialog'); + const dlg = dom.parentWithClass(this, 'dialog'); - var imageType = dlg.querySelector('#selectImageType').value; + const imageType = dlg.querySelector('#selectImageType').value; if (imageType === 'None') { - require(['toast'], function(toast) { + import('toast').then(({default: toast}) => { toast(globalize.translate('MessageImageTypeNotSelected')); }); e.preventDefault(); return false; } - connectionManager.getApiClient(currentServerId).uploadItemImage(currentItemId, imageType, file).then(function () { + connectionManager.getApiClient(currentServerId).uploadItemImage(currentItemId, imageType, file).then(() => { dlg.querySelector('#uploadImage').value = ''; @@ -116,21 +132,22 @@ define(['dialogHelper', 'connectionManager', 'dom', 'loading', 'scrollHelper', ' setFiles(page, this.files); }); - page.querySelector('.btnBrowse').addEventListener('click', function () { + page.querySelector('.btnBrowse').addEventListener('click', () => { page.querySelector('#uploadImage').click(); }); } - function showEditor(options, resolve, reject) { + function showEditor(options, resolve) { options = options || {}; - require(['text!./imageUploader.template.html'], function (template) { + // TODO: remove require + require(['text!./components/imageUploader/imageUploader.template.html'], template => { currentItemId = options.itemId; currentServerId = options.serverId; - var dialogOptions = { + const dialogOptions = { removeOnClose: true }; @@ -140,7 +157,7 @@ define(['dialogHelper', 'connectionManager', 'dom', 'loading', 'scrollHelper', ' dialogOptions.size = 'small'; } - var dlg = dialogHelper.createDialog(dialogOptions); + const dlg = dialogHelper.createDialog(dialogOptions); dlg.classList.add('formDialog'); @@ -151,7 +168,7 @@ define(['dialogHelper', 'connectionManager', 'dom', 'loading', 'scrollHelper', ' } // Has to be assigned a z-index after the call to .open() - dlg.addEventListener('close', function () { + dlg.addEventListener('close', () => { if (layoutManager.tv) { scrollHelper.centerFocus.off(dlg, false); @@ -167,22 +184,24 @@ define(['dialogHelper', 'connectionManager', 'dom', 'loading', 'scrollHelper', ' dlg.querySelector('#selectImageType').value = options.imageType || 'Primary'; - dlg.querySelector('.btnCancel').addEventListener('click', function () { + dlg.querySelector('.btnCancel').addEventListener('click', () => { dialogHelper.close(dlg); }); }); } - return { - show: function (options) { + export function show(options) { - return new Promise(function (resolve, reject) { + return new Promise((resolve, reject) => { - hasChanges = false; + hasChanges = false; - showEditor(options, resolve, reject); - }); - } - }; -}); + showEditor(options, resolve, reject); + }); + } + +/* eslint-enable indent */ +export default { + show: show +}; diff --git a/src/components/itemMediaInfo/itemMediaInfo.js b/src/components/itemMediaInfo/itemMediaInfo.js index 81c84b6a23..492b27e2cb 100644 --- a/src/components/itemMediaInfo/itemMediaInfo.js +++ b/src/components/itemMediaInfo/itemMediaInfo.js @@ -1,44 +1,61 @@ -define(['dialogHelper', 'require', 'layoutManager', 'globalize', 'userSettings', 'connectionManager', 'loading', 'focusManager', 'dom', 'apphost', 'emby-select', 'listViewStyle', 'paper-icon-button-light', 'css!./../formdialog', 'material-icons', 'emby-button', 'flexStyles'], function (dialogHelper, require, layoutManager, globalize, userSettings, connectionManager, loading, focusManager, dom, appHost) { - 'use strict'; +/* eslint-disable indent */ + +/** + * Module for display media info. + * @module components/itemMediaInfo/itemMediaInfo + */ + +import dialogHelper from 'dialogHelper'; +import layoutManager from 'layoutManager'; +import globalize from 'globalize'; +import connectionManager from 'connectionManager'; +import loading from 'loading'; +import 'emby-select'; +import 'listViewStyle'; +import 'paper-icon-button-light'; +import 'css!./../formdialog'; +import 'material-icons'; +import 'emby-button'; +import 'flexStyles'; function setMediaInfo(user, page, item) { - var html = item.MediaSources.map(function (version) { + let html = item.MediaSources.map(version => { return getMediaSourceHtml(user, item, version); }).join('
'); if (item.MediaSources.length > 1) { - html = '
' + html; + html = `
${html}`; } - var mediaInfoContent = page.querySelector('#mediaInfoContent'); + const mediaInfoContent = page.querySelector('#mediaInfoContent'); mediaInfoContent.innerHTML = html; } function getMediaSourceHtml(user, item, version) { - var html = ''; + let html = ''; if (version.Name) { - html += '

' + version.Name + '

'; + html += `

${version.Name}

`; } if (version.Container) { - html += createAttribute(globalize.translate('MediaInfoContainer'), version.Container) + '
'; + html += `${createAttribute(globalize.translate('MediaInfoContainer'), version.Container)}
`; } if (version.Formats && version.Formats.length) { - html += createAttribute(globalize.translate('MediaInfoFormat'), version.Formats.join(',')) + '
'; + html += `${createAttribute(globalize.translate('MediaInfoFormat'), version.Formats.join(','))}
`; } if (version.Path && user && user.Policy.IsAdministrator) { - html += createAttribute(globalize.translate('MediaInfoPath'), version.Path) + '
'; + html += `${createAttribute(globalize.translate('MediaInfoPath'), version.Path)}
`; } if (version.Size) { - var size = (version.Size / (1024 * 1024)).toFixed(0) + ' MB'; - html += createAttribute(globalize.translate('MediaInfoSize'), size) + '
'; + const size = `${(version.Size / (1024 * 1024)).toFixed(0)} MB`; + html += `${createAttribute(globalize.translate('MediaInfoSize'), size)}
`; } - for (var i = 0, length = version.MediaStreams.length; i < length; i++) { - var stream = version.MediaStreams[i]; + for (let i = 0, length = version.MediaStreams.length; i < length; i++) { + const stream = version.MediaStreams[i]; if (stream.Type === 'Data') { continue; } html += '
'; - var displayType = globalize.translate('MediaInfoStreamType' + stream.Type); - html += '

' + displayType + '

'; - var attributes = []; + const displayType = globalize.translate(`MediaInfoStreamType${stream.Type}`); + html += `

${displayType}

`; + const attributes = []; if (stream.DisplayTitle) { attributes.push(createAttribute('Title', stream.DisplayTitle)); } @@ -61,7 +78,7 @@ define(['dialogHelper', 'require', 'layoutManager', 'globalize', 'userSettings', attributes.push(createAttribute(globalize.translate('MediaInfoLevel'), stream.Level)); } if (stream.Width || stream.Height) { - attributes.push(createAttribute(globalize.translate('MediaInfoResolution'), stream.Width + 'x' + stream.Height)); + attributes.push(createAttribute(globalize.translate('MediaInfoResolution'), `${stream.Width}x${stream.Height}`)); } if (stream.AspectRatio && stream.Codec !== 'mjpeg') { attributes.push(createAttribute(globalize.translate('MediaInfoAspectRatio'), stream.AspectRatio)); @@ -79,16 +96,16 @@ define(['dialogHelper', 'require', 'layoutManager', 'globalize', 'userSettings', attributes.push(createAttribute(globalize.translate('MediaInfoLayout'), stream.ChannelLayout)); } if (stream.Channels) { - attributes.push(createAttribute(globalize.translate('MediaInfoChannels'), stream.Channels + ' ch')); + attributes.push(createAttribute(globalize.translate('MediaInfoChannels'), `${stream.Channels} ch`)); } if (stream.BitRate && stream.Codec !== 'mjpeg') { - attributes.push(createAttribute(globalize.translate('MediaInfoBitrate'), (parseInt(stream.BitRate / 1000)) + ' kbps')); + attributes.push(createAttribute(globalize.translate('MediaInfoBitrate'), `${parseInt(stream.BitRate / 1000)} kbps`)); } if (stream.SampleRate) { - attributes.push(createAttribute(globalize.translate('MediaInfoSampleRate'), stream.SampleRate + ' Hz')); + attributes.push(createAttribute(globalize.translate('MediaInfoSampleRate'), `${stream.SampleRate} Hz`)); } if (stream.BitDepth) { - attributes.push(createAttribute(globalize.translate('MediaInfoBitDepth'), stream.BitDepth + ' bit')); + attributes.push(createAttribute(globalize.translate('MediaInfoBitDepth'), `${stream.BitDepth} bit`)); } if (stream.PixelFormat) { attributes.push(createAttribute(globalize.translate('MediaInfoPixelFormat'), stream.PixelFormat)); @@ -116,13 +133,13 @@ define(['dialogHelper', 'require', 'layoutManager', 'globalize', 'userSettings', } function createAttribute(label, value) { - return '' + label + '' + value + ''; + return `${label}${value}`; } - function showMediaInfoMore(itemId, serverId, template) { - var apiClient = connectionManager.getApiClient(serverId); - return apiClient.getItem(apiClient.getCurrentUserId(), itemId).then(function (item) { - var dialogOptions = { + function loadMediaInfo(itemId, serverId, template) { + const apiClient = connectionManager.getApiClient(serverId); + return apiClient.getItem(apiClient.getCurrentUserId(), itemId).then(item => { + const dialogOptions = { size: 'small', removeOnClose: true, scrollY: false @@ -130,35 +147,36 @@ define(['dialogHelper', 'require', 'layoutManager', 'globalize', 'userSettings', if (layoutManager.tv) { dialogOptions.size = 'fullscreen'; } - var dlg = dialogHelper.createDialog(dialogOptions); + const dlg = dialogHelper.createDialog(dialogOptions); dlg.classList.add('formDialog'); - var html = ''; + let html = ''; html += globalize.translateDocument(template, 'core'); dlg.innerHTML = html; if (layoutManager.tv) { dlg.querySelector('.formDialogContent'); } dialogHelper.open(dlg); - dlg.querySelector('.btnCancel').addEventListener('click', function (e) { + dlg.querySelector('.btnCancel').addEventListener('click', () => { dialogHelper.close(dlg); }); - apiClient.getCurrentUser().then(function (user) { + apiClient.getCurrentUser().then(user => { setMediaInfo(user, dlg, item); }); loading.hide(); }); } - function showMediaInfo(itemId, serverId) { + export function show(itemId, serverId) { loading.show(); - return new Promise(function (resolve, reject) { - require(['text!./itemMediaInfo.template.html'], function (template) { - showMediaInfoMore(itemId, serverId, template).then(resolve, reject); + return new Promise((resolve, reject) => { + // TODO: remove require + require(['text!./components/itemMediaInfo/itemMediaInfo.template.html'], template => { + loadMediaInfo(itemId, serverId, template).then(resolve, reject); }); }); } - return { - show: showMediaInfo - }; -}); +/* eslint-enable indent */ +export default { + show: show +}; diff --git a/src/components/itemidentifier/itemidentifier.js b/src/components/itemidentifier/itemidentifier.js index b335d1dfd3..a1520928c2 100644 --- a/src/components/itemidentifier/itemidentifier.js +++ b/src/components/itemidentifier/itemidentifier.js @@ -1,15 +1,34 @@ -define(['dialogHelper', 'loading', 'connectionManager', 'require', 'globalize', 'scrollHelper', 'layoutManager', 'focusManager', 'browser', 'emby-input', 'emby-checkbox', 'paper-icon-button-light', 'css!./../formdialog', 'material-icons', 'cardStyle'], function (dialogHelper, loading, connectionManager, require, globalize, scrollHelper, layoutManager, focusManager, browser) { - 'use strict'; +/* eslint-disable indent */ - var enableFocusTransform = !browser.slow && !browser.edge; +/** + * Module for itemidentifier media item. + * @module components/itemidentifier/itemidentifier + */ - var currentItem; - var currentItemType; - var currentServerId; - var currentResolve; - var currentReject; - var hasChanges = false; - var currentSearchResult; +import dialogHelper from 'dialogHelper'; +import loading from 'loading'; +import connectionManager from 'connectionManager'; +import globalize from 'globalize'; +import scrollHelper from 'scrollHelper'; +import layoutManager from 'layoutManager'; +import focusManager from 'focusManager'; +import browser from 'browser'; +import 'emby-input'; +import 'emby-checkbox'; +import 'paper-icon-button-light'; +import 'css!./../formdialog'; +import 'material-icons'; +import 'cardStyle'; + + const enableFocusTransform = !browser.slow && !browser.edge; + + let currentItem; + let currentItemType; + let currentServerId; + let currentResolve; + let currentReject; + let hasChanges = false; + let currentSearchResult; function getApiClient() { return connectionManager.getApiClient(currentServerId); @@ -17,14 +36,14 @@ define(['dialogHelper', 'loading', 'connectionManager', 'require', 'globalize', function searchForIdentificationResults(page) { - var lookupInfo = { + let lookupInfo = { ProviderIds: {} }; - var i; - var length; - var identifyField = page.querySelectorAll('.identifyField'); - var value; + let i; + let length; + const identifyField = page.querySelectorAll('.identifyField'); + let value; for (i = 0, length = identifyField.length; i < length; i++) { value = identifyField[i].value; @@ -39,9 +58,9 @@ define(['dialogHelper', 'loading', 'connectionManager', 'require', 'globalize', } } - var hasId = false; + let hasId = false; - var txtLookupId = page.querySelectorAll('.txtLookupId'); + const txtLookupId = page.querySelectorAll('.txtLookupId'); for (i = 0, length = txtLookupId.length; i < length; i++) { value = txtLookupId[i].value; @@ -53,7 +72,7 @@ define(['dialogHelper', 'loading', 'connectionManager', 'require', 'globalize', } if (!hasId && !lookupInfo.Name) { - require(['toast'], function (toast) { + import('toast').then(({default: toast}) => { toast(globalize.translate('PleaseEnterNameOrId')); }); return; @@ -71,16 +90,16 @@ define(['dialogHelper', 'loading', 'connectionManager', 'require', 'globalize', loading.show(); - var apiClient = getApiClient(); + const apiClient = getApiClient(); apiClient.ajax({ type: 'POST', - url: apiClient.getUrl('Items/RemoteSearch/' + currentItemType), + url: apiClient.getUrl(`Items/RemoteSearch/${currentItemType}`), data: JSON.stringify(lookupInfo), contentType: 'application/json', dataType: 'json' - }).then(function (results) { + }).then(results => { loading.hide(); showIdentificationSearchResults(page, results); @@ -89,29 +108,29 @@ define(['dialogHelper', 'loading', 'connectionManager', 'require', 'globalize', function showIdentificationSearchResults(page, results) { - var identificationSearchResults = page.querySelector('.identificationSearchResults'); + const identificationSearchResults = page.querySelector('.identificationSearchResults'); page.querySelector('.popupIdentifyForm').classList.add('hide'); identificationSearchResults.classList.remove('hide'); page.querySelector('.identifyOptionsForm').classList.add('hide'); page.querySelector('.dialogContentInner').classList.remove('dialog-content-centered'); - var html = ''; - var i; - var length; + let html = ''; + let i; + let length; for (i = 0, length = results.length; i < length; i++) { - var result = results[i]; + const result = results[i]; html += getSearchResultHtml(result, i); } - var elem = page.querySelector('.identificationSearchResultList'); + const elem = page.querySelector('.identificationSearchResultList'); elem.innerHTML = html; function onSearchImageClick() { - var index = parseInt(this.getAttribute('data-index')); + const index = parseInt(this.getAttribute('data-index')); - var currentResult = results[index]; + const currentResult = results[index]; if (currentItem != null) { @@ -122,7 +141,7 @@ define(['dialogHelper', 'loading', 'connectionManager', 'require', 'globalize', } } - var searchImages = elem.querySelectorAll('.card'); + const searchImages = elem.querySelectorAll('.card'); for (i = 0, length = searchImages.length; i < length; i++) { searchImages[i].addEventListener('click', onSearchImageClick); @@ -143,7 +162,7 @@ define(['dialogHelper', 'loading', 'connectionManager', 'require', 'globalize', function showIdentifyOptions(page, identifyResult) { - var identifyOptionsForm = page.querySelector('.identifyOptionsForm'); + const identifyOptionsForm = page.querySelector('.identifyOptionsForm'); page.querySelector('.popupIdentifyForm').classList.add('hide'); page.querySelector('.identificationSearchResults').classList.add('hide'); @@ -153,19 +172,19 @@ define(['dialogHelper', 'loading', 'connectionManager', 'require', 'globalize', currentSearchResult = identifyResult; - var lines = []; + const lines = []; lines.push(identifyResult.Name); if (identifyResult.ProductionYear) { lines.push(identifyResult.ProductionYear); } - var resultHtml = lines.join('
'); + let resultHtml = lines.join('
'); if (identifyResult.ImageUrl) { - var displayUrl = getSearchImageDisplayUrl(identifyResult.ImageUrl, identifyResult.SearchProviderName); + const displayUrl = getSearchImageDisplayUrl(identifyResult.ImageUrl, identifyResult.SearchProviderName); - resultHtml = '
' + resultHtml + '
'; + resultHtml = `
${resultHtml}
`; } page.querySelector('.selectedSearchResult').innerHTML = resultHtml; @@ -177,10 +196,10 @@ define(['dialogHelper', 'loading', 'connectionManager', 'require', 'globalize', // TODO move card creation code to Card component - var html = ''; - var cssClass = 'card scalableCard'; - var cardBoxCssClass = 'cardBox'; - var padderClass; + let html = ''; + let cssClass = 'card scalableCard'; + let cardBoxCssClass = 'cardBox'; + let padderClass; if (currentItemType === 'Episode') { cssClass += ' backdropCard backdropCard-scalable'; @@ -203,30 +222,30 @@ define(['dialogHelper', 'loading', 'connectionManager', 'require', 'globalize', cardBoxCssClass += ' cardBox-bottompadded'; - html += ''; + html += ``; } return html; @@ -171,34 +186,34 @@ define(['itemHelper', 'mediaInfo', 'indicators', 'connectionManager', 'layoutMan return item.Id; } - function getListViewHtml(options) { + export function getListViewHtml(options) { - var items = options.items; + const items = options.items; - var groupTitle = ''; - var action = options.action || 'link'; + let groupTitle = ''; + const action = options.action || 'link'; - var isLargeStyle = options.imageSize === 'large'; - var enableOverview = options.enableOverview; + const isLargeStyle = options.imageSize === 'large'; + const enableOverview = options.enableOverview; - var clickEntireItem = layoutManager.tv ? true : false; - var outerTagName = clickEntireItem ? 'button' : 'div'; - var enableSideMediaInfo = options.enableSideMediaInfo != null ? options.enableSideMediaInfo : true; + const clickEntireItem = layoutManager.tv ? true : false; + const outerTagName = clickEntireItem ? 'button' : 'div'; + const enableSideMediaInfo = options.enableSideMediaInfo != null ? options.enableSideMediaInfo : true; - var outerHtml = ''; + let outerHtml = ''; - var enableContentWrapper = options.enableOverview && !layoutManager.tv; - var containerAlbumArtistIds = (options.containerAlbumArtists || []).map(getId); + const enableContentWrapper = options.enableOverview && !layoutManager.tv; + const containerAlbumArtistIds = (options.containerAlbumArtists || []).map(getId); - for (var i = 0, length = items.length; i < length; i++) { + for (let i = 0, length = items.length; i < length; i++) { - var item = items[i]; + const item = items[i]; - var html = ''; + let html = ''; if (options.showIndex) { - var itemGroupTitle = getIndex(item, options); + const itemGroupTitle = getIndex(item, options); if (itemGroupTitle !== groupTitle) { @@ -220,7 +235,7 @@ define(['itemHelper', 'mediaInfo', 'indicators', 'connectionManager', 'layoutMan } } - var cssClass = 'listItem'; + let cssClass = 'listItem'; if (options.border || (options.highlight !== false && !layoutManager.tv)) { cssClass += ' listItem-border'; @@ -234,28 +249,28 @@ define(['itemHelper', 'mediaInfo', 'indicators', 'connectionManager', 'layoutMan cssClass += ' listItem-focusscale'; } - var downloadWidth = 80; + let downloadWidth = 80; if (isLargeStyle) { cssClass += ' listItem-largeImage'; downloadWidth = 500; } - var playlistItemId = item.PlaylistItemId ? (' data-playlistitemid="' + item.PlaylistItemId + '"') : ''; + const playlistItemId = item.PlaylistItemId ? (` data-playlistitemid="${item.PlaylistItemId}"`) : ''; - var positionTicksData = item.UserData && item.UserData.PlaybackPositionTicks ? (' data-positionticks="' + item.UserData.PlaybackPositionTicks + '"') : ''; - var collectionIdData = options.collectionId ? (' data-collectionid="' + options.collectionId + '"') : ''; - var playlistIdData = options.playlistId ? (' data-playlistid="' + options.playlistId + '"') : ''; - var mediaTypeData = item.MediaType ? (' data-mediatype="' + item.MediaType + '"') : ''; - var collectionTypeData = item.CollectionType ? (' data-collectiontype="' + item.CollectionType + '"') : ''; - var channelIdData = item.ChannelId ? (' data-channelid="' + item.ChannelId + '"') : ''; + const positionTicksData = item.UserData && item.UserData.PlaybackPositionTicks ? (` data-positionticks="${item.UserData.PlaybackPositionTicks}"`) : ''; + const collectionIdData = options.collectionId ? (` data-collectionid="${options.collectionId}"`) : ''; + const playlistIdData = options.playlistId ? (` data-playlistid="${options.playlistId}"`) : ''; + const mediaTypeData = item.MediaType ? (` data-mediatype="${item.MediaType}"`) : ''; + const collectionTypeData = item.CollectionType ? (` data-collectiontype="${item.CollectionType}"`) : ''; + const channelIdData = item.ChannelId ? (` data-channelid="${item.ChannelId}"`) : ''; if (enableContentWrapper) { cssClass += ' listItem-withContentWrapper'; } - html += '<' + outerTagName + ' class="' + cssClass + '"' + playlistItemId + ' data-action="' + action + '" data-isfolder="' + item.IsFolder + '" data-id="' + item.Id + '" data-serverid="' + item.ServerId + '" data-type="' + item.Type + '"' + mediaTypeData + collectionTypeData + channelIdData + positionTicksData + collectionIdData + playlistIdData + '>'; + html += `<${outerTagName} class="${cssClass}"${playlistItemId} data-action="${action}" data-isfolder="${item.IsFolder}" data-id="${item.Id}" data-serverid="${item.ServerId}" data-type="${item.Type}"${mediaTypeData}${collectionTypeData}${channelIdData}${positionTicksData}${collectionIdData}${playlistIdData}>`; if (enableContentWrapper) { @@ -278,37 +293,37 @@ define(['itemHelper', 'mediaInfo', 'indicators', 'connectionManager', 'layoutMan imageClass += ' listItemImage-large-tv'; } - var playOnImageClick = options.imagePlayButton && !layoutManager.tv; + const playOnImageClick = options.imagePlayButton && !layoutManager.tv; if (!clickEntireItem) { imageClass += ' itemAction'; } - var imageAction = playOnImageClick ? 'resume' : action; + const imageAction = playOnImageClick ? 'resume' : action; let blurhashAttrib = ''; if (blurhash && blurhash.length > 0) { - blurhashAttrib = 'data-blurhash="' + blurhash + '"'; + blurhashAttrib = `data-blurhash="${blurhash}"`; } if (imgUrl) { - html += '
'; + html += `
`; } else { - html += '
'; + html += `
`; } - var indicatorsHtml = ''; + let indicatorsHtml = ''; indicatorsHtml += indicators.getPlayedIndicatorHtml(item); if (indicatorsHtml) { - html += '
' + indicatorsHtml + '
'; + html += `
${indicatorsHtml}
`; } if (playOnImageClick) { html += ''; } - var progressHtml = indicators.getProgressBarHtml(item, { + const progressHtml = indicators.getProgressBarHtml(item, { containerClass: 'listItemProgressBar' }); @@ -325,7 +340,7 @@ define(['itemHelper', 'mediaInfo', 'indicators', 'connectionManager', 'layoutMan html += '
'; } - var textlines = []; + const textlines = []; if (options.showProgramDateTime) { textlines.push(datetime.toLocaleString(datetime.parseISO8601Date(item.StartDate), { @@ -348,7 +363,7 @@ define(['itemHelper', 'mediaInfo', 'indicators', 'connectionManager', 'layoutMan } } - var parentTitle = null; + let parentTitle = null; if (options.showParentTitle) { if (item.Type === 'Episode') { @@ -358,12 +373,12 @@ define(['itemHelper', 'mediaInfo', 'indicators', 'connectionManager', 'layoutMan } } - var displayName = itemHelper.getDisplayName(item, { + let displayName = itemHelper.getDisplayName(item, { includeParentInfo: options.includeParentInfoInTitle }); if (options.showIndexNumber && item.IndexNumber != null) { - displayName = item.IndexNumber + '. ' + displayName; + displayName = `${item.IndexNumber}. ${displayName}`; } if (options.showParentTitle && options.parentTitleWithTitle) { @@ -394,14 +409,14 @@ define(['itemHelper', 'mediaInfo', 'indicators', 'connectionManager', 'layoutMan } } else { - var showArtist = options.artist === true; - var artistItems = item.ArtistItems; + let showArtist = options.artist === true; + const artistItems = item.ArtistItems; if (!showArtist && options.artist !== false) { if (!artistItems || !artistItems.length) { showArtist = true; - } else if (artistItems.length > 1 || containerAlbumArtistIds.indexOf(artistItems[0].Id) === -1) { + } else if (artistItems.length > 1 || !containerAlbumArtistIds.includes(artistItems[0].Id)) { showArtist = true; } } @@ -409,7 +424,7 @@ define(['itemHelper', 'mediaInfo', 'indicators', 'connectionManager', 'layoutMan if (showArtist) { if (artistItems && item.Type !== 'MusicAlbum') { - textlines.push(artistItems.map(function (a) { + textlines.push(artistItems.map(a => { return a.Name; }).join(', ')); } @@ -432,7 +447,7 @@ define(['itemHelper', 'mediaInfo', 'indicators', 'connectionManager', 'layoutMan cssClass += ' listItemBody-noleftpadding'; } - html += '
'; + html += `
`; const moreIcon = 'more_vert'; @@ -441,14 +456,16 @@ define(['itemHelper', 'mediaInfo', 'indicators', 'connectionManager', 'layoutMan if (options.mediaInfo !== false) { if (!enableSideMediaInfo) { - var mediaInfoClass = 'secondary listItemMediaInfo listItemBodyText'; + const mediaInfoClass = 'secondary listItemMediaInfo listItemBodyText'; - html += '
' + mediaInfo.getPrimaryMediaInfoHtml(item, { + html += `
`; + html += mediaInfo.getPrimaryMediaInfoHtml(item, { episodeTitle: false, originalAirDate: false, subtitles: false - }) + '
'; + }); + html += '
'; } } @@ -462,7 +479,8 @@ define(['itemHelper', 'mediaInfo', 'indicators', 'connectionManager', 'layoutMan if (options.mediaInfo !== false) { if (enableSideMediaInfo) { - html += '
' + mediaInfo.getPrimaryMediaInfoHtml(item, { + html += '
'; + html += mediaInfo.getPrimaryMediaInfoHtml(item, { year: false, container: false, @@ -470,7 +488,8 @@ define(['itemHelper', 'mediaInfo', 'indicators', 'connectionManager', 'layoutMan criticRating: false, endsAt: false - }) + '
'; + }); + html += '
'; } } @@ -487,7 +506,7 @@ define(['itemHelper', 'mediaInfo', 'indicators', 'connectionManager', 'layoutMan } if (options.moreButton !== false) { - html += ''; + html += ``; } if (options.infoButton) { @@ -500,15 +519,15 @@ define(['itemHelper', 'mediaInfo', 'indicators', 'connectionManager', 'layoutMan if (options.enableUserDataButtons !== false) { - var userData = item.UserData || {}; - var likes = userData.Likes == null ? '' : userData.Likes; + const userData = item.UserData || {}; + const likes = userData.Likes == null ? '' : userData.Likes; if (itemHelper.canMarkPlayed(item)) { - html += ''; + html += ``; } if (itemHelper.canRate(item)) { - html += ''; + html += ``; } } } @@ -524,7 +543,7 @@ define(['itemHelper', 'mediaInfo', 'indicators', 'connectionManager', 'layoutMan } } - html += ''; + html += ``; outerHtml += html; } @@ -532,7 +551,7 @@ define(['itemHelper', 'mediaInfo', 'indicators', 'connectionManager', 'layoutMan return outerHtml; } - return { - getListViewHtml: getListViewHtml - }; -}); +/* eslint-enable indent */ +export default { + getListViewHtml: getListViewHtml +}; From 9e123ad60b48294d47b46e88c2dda30018ddfb2f Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Tue, 9 Jun 2020 22:57:27 +0300 Subject: [PATCH 011/244] Migration channelMapper to ES6 modules --- package.json | 1 + src/components/channelMapper/channelMapper.js | 74 +++++++++++-------- src/controllers/livetvstatus.js | 4 +- 3 files changed, 45 insertions(+), 34 deletions(-) diff --git a/package.json b/package.json index fd84432e81..dafbb3625e 100644 --- a/package.json +++ b/package.json @@ -96,6 +96,7 @@ "src/components/cardbuilder/cardBuilder.js", "src/components/cardbuilder/chaptercardbuilder.js", "src/components/cardbuilder/peoplecardbuilder.js", + "src/components/channelMapper/channelMapper.js", "src/components/images/imageLoader.js", "src/components/indicators/indicators.js", "src/components/lazyLoader/lazyLoaderIntersectionObserver.js", diff --git a/src/components/channelMapper/channelMapper.js b/src/components/channelMapper/channelMapper.js index f2ad88e713..89d085c185 100644 --- a/src/components/channelMapper/channelMapper.js +++ b/src/components/channelMapper/channelMapper.js @@ -1,10 +1,21 @@ -define(['dom', 'dialogHelper', 'loading', 'connectionManager', 'globalize', 'actionsheet', 'emby-input', 'paper-icon-button-light', 'emby-button', 'listViewStyle', 'material-icons', 'formDialogStyle'], function (dom, dialogHelper, loading, connectionManager, globalize, actionsheet) { - 'use strict'; +import dom from 'dom'; +import dialogHelper from 'dialogHelper'; +import loading from 'loading'; +import connectionManager from 'connectionManager'; +import globalize from 'globalize'; +import actionsheet from 'actionsheet'; +import 'emby-input'; +import 'paper-icon-button-light'; +import 'emby-button'; +import 'listViewStyle'; +import 'material-icons'; +import 'formDialogStyle'; - return function (options) { +export default class channelMapper { + constructor(options) { function mapChannel(button, channelId, providerChannelId) { loading.show(); - var providerId = options.providerId; + const providerId = options.providerId; connectionManager.getApiClient(options.serverId).ajax({ type: 'POST', url: ApiClient.getUrl('LiveTv/ChannelMappings'), @@ -14,8 +25,8 @@ define(['dom', 'dialogHelper', 'loading', 'connectionManager', 'globalize', 'act providerChannelId: providerChannelId }, dataType: 'json' - }).then(function (mapping) { - var listItem = dom.parentWithClass(button, 'listItem'); + }).then(mapping => { + const listItem = dom.parentWithClass(button, 'listItem'); button.setAttribute('data-providerid', mapping.ProviderChannelId); listItem.querySelector('.secondary').innerHTML = getMappingSecondaryName(mapping, currentMappingOptions.ProviderName); loading.hide(); @@ -23,42 +34,42 @@ define(['dom', 'dialogHelper', 'loading', 'connectionManager', 'globalize', 'act } function onChannelsElementClick(e) { - var btnMap = dom.parentWithClass(e.target, 'btnMap'); + const btnMap = dom.parentWithClass(e.target, 'btnMap'); if (btnMap) { - var channelId = btnMap.getAttribute('data-id'); - var providerChannelId = btnMap.getAttribute('data-providerid'); - var menuItems = currentMappingOptions.ProviderChannels.map(function (m) { + const channelId = btnMap.getAttribute('data-id'); + const providerChannelId = btnMap.getAttribute('data-providerid'); + const menuItems = currentMappingOptions.ProviderChannels.map(m => { return { name: m.Name, id: m.Id, selected: m.Id.toLowerCase() === providerChannelId.toLowerCase() }; - }).sort(function (a, b) { + }).sort((a, b) => { return a.name.localeCompare(b.name); }); actionsheet.show({ positionTo: btnMap, items: menuItems - }).then(function (newChannelId) { + }).then(newChannelId => { mapChannel(btnMap, channelId, newChannelId); }); } } function getChannelMappingOptions(serverId, providerId) { - var apiClient = connectionManager.getApiClient(serverId); + const apiClient = connectionManager.getApiClient(serverId); return apiClient.getJSON(apiClient.getUrl('LiveTv/ChannelMappingOptions', { providerId: providerId })); } function getMappingSecondaryName(mapping, providerName) { - return (mapping.ProviderChannelName || '') + ' - ' + providerName; + return `${mapping.ProviderChannelName || ''} - ${providerName}`; } function getTunerChannelHtml(channel, providerName) { - var html = ''; + let html = ''; html += '
'; html += ''; html += '
'; @@ -73,16 +84,16 @@ define(['dom', 'dialogHelper', 'loading', 'connectionManager', 'globalize', 'act html += '
'; html += '
'; - html += ''; + html += ``; return html += '
'; } function getEditorHtml() { - var html = ''; + let html = ''; html += '
'; html += '
'; html += '
'; - html += '

' + globalize.translate('HeaderChannels') + '

'; + html += `

${globalize.translate('HeaderChannels')}

`; html += '
'; html += '
'; html += '
'; @@ -91,30 +102,29 @@ define(['dom', 'dialogHelper', 'loading', 'connectionManager', 'globalize', 'act } function initEditor(dlg, options) { - getChannelMappingOptions(options.serverId, options.providerId).then(function (result) { + getChannelMappingOptions(options.serverId, options.providerId).then(result => { currentMappingOptions = result; - var channelsElement = dlg.querySelector('.channels'); - channelsElement.innerHTML = result.TunerChannels.map(function (channel) { + const channelsElement = dlg.querySelector('.channels'); + channelsElement.innerHTML = result.TunerChannels.map(channel => { return getTunerChannelHtml(channel, result.ProviderName); }).join(''); channelsElement.addEventListener('click', onChannelsElementClick); }); } - var currentMappingOptions; - var self = this; + let currentMappingOptions; - self.show = function () { - var dialogOptions = { + this.show = () => { + const dialogOptions = { removeOnClose: true }; dialogOptions.size = 'small'; - var dlg = dialogHelper.createDialog(dialogOptions); + const dlg = dialogHelper.createDialog(dialogOptions); dlg.classList.add('formDialog'); dlg.classList.add('ui-body-a'); dlg.classList.add('background-theme-a'); - var html = ''; - var title = globalize.translate('MapChannels'); + let html = ''; + const title = globalize.translate('MapChannels'); html += '
'; html += ''; html += '

'; @@ -124,13 +134,13 @@ define(['dom', 'dialogHelper', 'loading', 'connectionManager', 'globalize', 'act html += getEditorHtml(); dlg.innerHTML = html; initEditor(dlg, options); - dlg.querySelector('.btnCancel').addEventListener('click', function () { + dlg.querySelector('.btnCancel').addEventListener('click', () => { dialogHelper.close(dlg); }); - return new Promise(function (resolve, reject) { + return new Promise(resolve => { dlg.addEventListener('close', resolve); dialogHelper.open(dlg); }); }; - }; -}); + } +} diff --git a/src/controllers/livetvstatus.js b/src/controllers/livetvstatus.js index 82d0b697db..c6daf53a4f 100644 --- a/src/controllers/livetvstatus.js +++ b/src/controllers/livetvstatus.js @@ -155,8 +155,8 @@ define(['jQuery', 'globalize', 'scripts/taskbutton', 'dom', 'libraryMenu', 'layo } function mapChannels(page, providerId) { - require(['components/channelMapper/channelMapper'], function (channelmapper) { - new channelmapper({ + require(['components/channelMapper/channelMapper'], function (channelMapper) { + new channelMapper.default({ serverId: ApiClient.serverInfo().Id, providerId: providerId }).show(); From 64125541fbc7d4240ab937c6571521fd0cd352cf Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Tue, 9 Jun 2020 23:03:23 +0300 Subject: [PATCH 012/244] Fix bug reporter by sonarqube --- src/components/imageUploader/imageUploader.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/imageUploader/imageUploader.js b/src/components/imageUploader/imageUploader.js index e2d2c60f1b..ca83222274 100644 --- a/src/components/imageUploader/imageUploader.js +++ b/src/components/imageUploader/imageUploader.js @@ -193,11 +193,11 @@ import 'css!./style'; export function show(options) { - return new Promise((resolve, reject) => { + return new Promise(resolve => { hasChanges = false; - showEditor(options, resolve, reject); + showEditor(options, resolve); }); } From 2d53cb5f8538543822abb356bb4faeafea0d11d9 Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Thu, 11 Jun 2020 21:52:00 +0300 Subject: [PATCH 013/244] replace require with Dynamic Imports --- src/components/mediaLibraryCreator/mediaLibraryCreator.js | 3 +-- src/components/mediaLibraryEditor/mediaLibraryEditor.js | 3 +-- 2 files changed, 2 insertions(+), 4 deletions(-) diff --git a/src/components/mediaLibraryCreator/mediaLibraryCreator.js b/src/components/mediaLibraryCreator/mediaLibraryCreator.js index c7011ba1d8..6940da1baf 100644 --- a/src/components/mediaLibraryCreator/mediaLibraryCreator.js +++ b/src/components/mediaLibraryCreator/mediaLibraryCreator.js @@ -201,8 +201,7 @@ export class editor { currentOptions = options; currentResolve = resolve; hasChanges = false; - // TODO: remove require - require(['text!./components/mediaLibraryCreator/mediaLibraryCreator.template.html'], template => { + import('text!./components/mediaLibraryCreator/mediaLibraryCreator.template.html').then(({default: template}) => { const dlg = dialogHelper.createDialog({ size: 'small', modal: false, diff --git a/src/components/mediaLibraryEditor/mediaLibraryEditor.js b/src/components/mediaLibraryEditor/mediaLibraryEditor.js index 5b533b2ac9..7996867b2e 100644 --- a/src/components/mediaLibraryEditor/mediaLibraryEditor.js +++ b/src/components/mediaLibraryEditor/mediaLibraryEditor.js @@ -216,8 +216,7 @@ export class editor { currentOptions = options; currentDeferred = deferred; hasChanges = false; - // TODO: remove require - require(['text!./components/mediaLibraryEditor/mediaLibraryEditor.template.html'], template => { + import('text!./components/mediaLibraryEditor/mediaLibraryEditor.template.html').then(({default: template}) => { const dlg = dialogHelper.createDialog({ size: 'small', modal: false, From cf1ca53f9c8ed65ab8f492ad2ba3fdf257bcf938 Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Thu, 11 Jun 2020 22:07:24 +0300 Subject: [PATCH 014/244] replace require with Dynamic Imports --- src/components/imageOptionsEditor/imageOptionsEditor.js | 3 +-- .../libraryoptionseditor/libraryoptionseditor.js | 7 +++---- 2 files changed, 4 insertions(+), 6 deletions(-) diff --git a/src/components/imageOptionsEditor/imageOptionsEditor.js b/src/components/imageOptionsEditor/imageOptionsEditor.js index 5e4f88f158..a1e7f71a9c 100644 --- a/src/components/imageOptionsEditor/imageOptionsEditor.js +++ b/src/components/imageOptionsEditor/imageOptionsEditor.js @@ -93,8 +93,7 @@ export class editor { constructor() { this.show = (itemType, options, availableOptions) => { return new Promise((resolve) => { - //TODO: remove require - require(['text!./components/imageOptionsEditor/imageOptionsEditor.template.html'], template => { + import('text!./components/imageOptionsEditor/imageOptionsEditor.template.html').then(({default: template}) => { const dlg = dialogHelper.createDialog({ size: 'small', removeOnClose: true, diff --git a/src/components/libraryoptionseditor/libraryoptionseditor.js b/src/components/libraryoptionseditor/libraryoptionseditor.js index f9a9d43276..6a5f4f6e9b 100644 --- a/src/components/libraryoptionseditor/libraryoptionseditor.js +++ b/src/components/libraryoptionseditor/libraryoptionseditor.js @@ -268,8 +268,8 @@ import 'emby-input'; return true; } - function populateMetadataSettings(parent, contentType, isNewLibrary) { - isNewLibrary = parent.classList.contains('newlibrary'); + function populateMetadataSettings(parent, contentType) { + const isNewLibrary = parent.classList.contains('newlibrary'); return ApiClient.getJSON(ApiClient.getUrl('Libraries/AvailableOptions', { LibraryContentType: contentType, IsNewLibrary: isNewLibrary @@ -365,8 +365,7 @@ import 'emby-input'; const isNewLibrary = null === libraryOptions; isNewLibrary && parent.classList.add('newlibrary'); return new Promise((resolve) => { - //TODO: remove require - require(['text!./components/libraryoptionseditor/libraryoptionseditor.template.html'], function (template) { + import('text!./libraryoptionseditor.template.html').then(({default: template}) => { parent.innerHTML = globalize.translateDocument(template); populateRefreshInterval(parent.querySelector('#selectAutoRefreshInterval')); const promises = [populateLanguages(parent), populateCountries(parent.querySelector('#selectCountry'))]; From b7d9dba32feccb6225f435326b7ff3c17329efa4 Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Thu, 11 Jun 2020 23:21:46 +0300 Subject: [PATCH 015/244] replace require with Dynamic Imports --- src/components/imageUploader/imageUploader.js | 3 +-- src/components/itemMediaInfo/itemMediaInfo.js | 3 +-- src/components/itemidentifier/itemidentifier.js | 7 +++---- 3 files changed, 5 insertions(+), 8 deletions(-) diff --git a/src/components/imageUploader/imageUploader.js b/src/components/imageUploader/imageUploader.js index ca83222274..fec5363886 100644 --- a/src/components/imageUploader/imageUploader.js +++ b/src/components/imageUploader/imageUploader.js @@ -141,8 +141,7 @@ import 'css!./style'; options = options || {}; - // TODO: remove require - require(['text!./components/imageUploader/imageUploader.template.html'], template => { + import('text!./imageUploader.template.html').then(({default: template}) => { currentItemId = options.itemId; currentServerId = options.serverId; diff --git a/src/components/itemMediaInfo/itemMediaInfo.js b/src/components/itemMediaInfo/itemMediaInfo.js index 492b27e2cb..dcfaf3864a 100644 --- a/src/components/itemMediaInfo/itemMediaInfo.js +++ b/src/components/itemMediaInfo/itemMediaInfo.js @@ -169,8 +169,7 @@ import 'flexStyles'; export function show(itemId, serverId) { loading.show(); return new Promise((resolve, reject) => { - // TODO: remove require - require(['text!./components/itemMediaInfo/itemMediaInfo.template.html'], template => { + import('text!./itemMediaInfo.template.html').then(({default: template}) => { loadMediaInfo(itemId, serverId, template).then(resolve, reject); }); }); diff --git a/src/components/itemidentifier/itemidentifier.js b/src/components/itemidentifier/itemidentifier.js index a1520928c2..10655b1279 100644 --- a/src/components/itemidentifier/itemidentifier.js +++ b/src/components/itemidentifier/itemidentifier.js @@ -357,8 +357,7 @@ import 'cardStyle'; loading.show(); - // TODO: remove require - require(['text!./components/itemidentifier/itemidentifier.template.html'], template => { + import('text!./itemidentifier.template.html').then(({default: template}) => { const apiClient = getApiClient(); @@ -441,13 +440,13 @@ import 'cardStyle'; } } + //TODO investigate where was used this? function showEditorFindNew(itemName, itemYear, itemType, resolveFunc) { currentItem = null; currentItemType = itemType; - // TODO: remove require - require(['text!./components/itemidentifier/itemidentifier.template.html'], template => { + import('text!./itemidentifier.template.html').then(({default: template}) => { const dialogOptions = { size: 'small', From 7b93106bc93fd776d78f1a626e3b905ed4afd420 Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Fri, 12 Jun 2020 01:09:35 +0300 Subject: [PATCH 016/244] Migration alphaPicker to ES6 modules --- package.json | 1 + src/components/alphaPicker/alphaPicker.js | 406 +++++++++++----------- src/components/search/searchfields.js | 2 +- src/components/tabbedview/itemstab.js | 2 +- src/controllers/list.js | 4 +- src/controllers/movies/movies.js | 4 +- src/controllers/movies/movietrailers.js | 4 +- src/controllers/music/musicalbums.js | 4 +- src/controllers/music/musicartists.js | 4 +- src/controllers/shows/tvshows.js | 4 +- 10 files changed, 224 insertions(+), 211 deletions(-) diff --git a/package.json b/package.json index 785878d20b..cf8b33ca6c 100644 --- a/package.json +++ b/package.json @@ -90,6 +90,7 @@ { "test": [ "src/components/actionSheet/actionSheet.js", + "src/components/alphaPicker/alphaPicker.js", "src/components/autoFocuser.js", "src/components/cardbuilder/cardBuilder.js", "src/components/images/imageLoader.js", diff --git a/src/components/alphaPicker/alphaPicker.js b/src/components/alphaPicker/alphaPicker.js index 79f74879e5..576e35cb42 100644 --- a/src/components/alphaPicker/alphaPicker.js +++ b/src/components/alphaPicker/alphaPicker.js @@ -1,11 +1,22 @@ -define(['focusManager', 'layoutManager', 'dom', 'css!./style.css', 'paper-icon-button-light', 'material-icons'], function (focusManager, layoutManager, dom) { - 'use strict'; +/* eslint-disable indent */ - var selectedButtonClass = 'alphaPickerButton-selected'; +/** + * Module alphaPicker. + * @module components/alphaPicker/alphaPicker + */ + +import focusManager from 'focusManager'; +import layoutManager from 'layoutManager'; +import dom from 'dom'; +import 'css!./style.css'; +import 'paper-icon-button-light'; +import 'material-icons'; + + const selectedButtonClass = 'alphaPickerButton-selected'; function focus() { - var scope = this; - var selected = scope.querySelector('.' + selectedButtonClass); + const scope = this; + const selected = scope.querySelector(`.${selectedButtonClass}`); if (selected) { focusManager.focus(selected); @@ -16,7 +27,7 @@ define(['focusManager', 'layoutManager', 'dom', 'css!./style.css', 'paper-icon-b function getAlphaPickerButtonClassName(vertical) { - var alphaPickerButtonClassName = 'alphaPickerButton'; + let alphaPickerButtonClassName = 'alphaPickerButton'; if (layoutManager.tv) { alphaPickerButtonClassName += ' alphaPickerButton-tv'; @@ -30,12 +41,12 @@ define(['focusManager', 'layoutManager', 'dom', 'css!./style.css', 'paper-icon-b } function getLetterButton(l, vertical) { - return ''; + return ``; } function mapLetters(letters, vertical) { - return letters.map(function (l) { + return letters.map(l => { return getLetterButton(l, vertical); }); } @@ -48,26 +59,26 @@ define(['focusManager', 'layoutManager', 'dom', 'css!./style.css', 'paper-icon-b element.classList.add('alphaPicker-tv'); } - var vertical = element.classList.contains('alphaPicker-vertical'); + const vertical = element.classList.contains('alphaPicker-vertical'); if (!vertical) { element.classList.add('focuscontainer-x'); } - var html = ''; - var letters; + let html = ''; + let letters; - var alphaPickerButtonClassName = getAlphaPickerButtonClassName(vertical); + const alphaPickerButtonClassName = getAlphaPickerButtonClassName(vertical); - var rowClassName = 'alphaPickerRow'; + let rowClassName = 'alphaPickerRow'; if (vertical) { rowClassName += ' alphaPickerRow-vertical'; } - html += '
'; + html += `
`; if (options.mode === 'keyboard') { - html += ''; + html += ``; } else { letters = ['#']; html += mapLetters(letters, vertical).join(''); @@ -77,11 +88,11 @@ define(['focusManager', 'layoutManager', 'dom', 'css!./style.css', 'paper-icon-b html += mapLetters(letters, vertical).join(''); if (options.mode === 'keyboard') { - html += ''; + html += ``; html += '
'; letters = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9']; - html += '
'; + html += `
`; html += '
'; html += mapLetters(letters, vertical).join(''); html += '
'; @@ -95,227 +106,228 @@ define(['focusManager', 'layoutManager', 'dom', 'css!./style.css', 'paper-icon-b element.focus = focus; } - function AlphaPicker(options) { + export class AlphaPicker { + constructor(options) { - var self = this; - this.options = options; + this.options = options; - var element = options.element; - var itemsContainer = options.itemsContainer; - var itemClass = options.itemClass; + const element = options.element; + const itemsContainer = options.itemsContainer; + const itemClass = options.itemClass; - var itemFocusValue; - var itemFocusTimeout; + let itemFocusValue; + let itemFocusTimeout; - function onItemFocusTimeout() { - itemFocusTimeout = null; - self.value(itemFocusValue); - } - - var alphaFocusedElement; - var alphaFocusTimeout; - - function onAlphaFocusTimeout() { - - alphaFocusTimeout = null; - - if (document.activeElement === alphaFocusedElement) { - var value = alphaFocusedElement.getAttribute('data-value'); - self.value(value, true); + function onItemFocusTimeout() { + itemFocusTimeout = null; + this.value(itemFocusValue); } - } - function onAlphaPickerInKeyboardModeClick(e) { + let alphaFocusedElement; + let alphaFocusTimeout; - var alphaPickerButton = dom.parentWithClass(e.target, 'alphaPickerButton'); + function onAlphaFocusTimeout() { - if (alphaPickerButton) { - var value = alphaPickerButton.getAttribute('data-value'); - - element.dispatchEvent(new CustomEvent('alphavalueclicked', { - cancelable: false, - detail: { - value: value - } - })); - } - } - - function onAlphaPickerClick(e) { - - var alphaPickerButton = dom.parentWithClass(e.target, 'alphaPickerButton'); - - if (alphaPickerButton) { - var value = alphaPickerButton.getAttribute('data-value'); - if ((this._currentValue || '').toUpperCase() === value.toUpperCase()) { - self.value(null, true); - } else { - self.value(value, true); - } - } - } - - function onAlphaPickerFocusIn(e) { - - if (alphaFocusTimeout) { - clearTimeout(alphaFocusTimeout); alphaFocusTimeout = null; + + if (document.activeElement === alphaFocusedElement) { + const value = alphaFocusedElement.getAttribute('data-value'); + this.value(value, true); + } } - var alphaPickerButton = dom.parentWithClass(e.target, 'alphaPickerButton'); + function onAlphaPickerInKeyboardModeClick(e) { - if (alphaPickerButton) { - alphaFocusedElement = alphaPickerButton; - alphaFocusTimeout = setTimeout(onAlphaFocusTimeout, 600); + const alphaPickerButton = dom.parentWithClass(e.target, 'alphaPickerButton'); + + if (alphaPickerButton) { + const value = alphaPickerButton.getAttribute('data-value'); + + element.dispatchEvent(new CustomEvent('alphavalueclicked', { + cancelable: false, + detail: { + value + } + })); + } } - } - function onItemsFocusIn(e) { + function onAlphaPickerClick(e) { - var item = dom.parentWithClass(e.target, itemClass); + const alphaPickerButton = dom.parentWithClass(e.target, 'alphaPickerButton'); - if (item) { - var prefix = item.getAttribute('data-prefix'); - if (prefix && prefix.length) { - - itemFocusValue = prefix[0]; - if (itemFocusTimeout) { - clearTimeout(itemFocusTimeout); + if (alphaPickerButton) { + const value = alphaPickerButton.getAttribute('data-value'); + if ((this._currentValue || '').toUpperCase() === value.toUpperCase()) { + this.value(null, true); + } else { + this.value(value, true); } - itemFocusTimeout = setTimeout(onItemFocusTimeout, 100); } } - } - self.enabled = function (enabled) { + function onAlphaPickerFocusIn(e) { - if (enabled) { - - if (itemsContainer) { - itemsContainer.addEventListener('focus', onItemsFocusIn, true); + if (alphaFocusTimeout) { + clearTimeout(alphaFocusTimeout); + alphaFocusTimeout = null; } - if (options.mode === 'keyboard') { - element.addEventListener('click', onAlphaPickerInKeyboardModeClick); - } + const alphaPickerButton = dom.parentWithClass(e.target, 'alphaPickerButton'); + + if (alphaPickerButton) { + alphaFocusedElement = alphaPickerButton; + alphaFocusTimeout = setTimeout(onAlphaFocusTimeout, 600); + } + } + + function onItemsFocusIn(e) { + + const item = dom.parentWithClass(e.target, itemClass); + + if (item) { + const prefix = item.getAttribute('data-prefix'); + if (prefix && prefix.length) { + + itemFocusValue = prefix[0]; + if (itemFocusTimeout) { + clearTimeout(itemFocusTimeout); + } + itemFocusTimeout = setTimeout(onItemFocusTimeout, 100); + } + } + } + + this.enabled = function (enabled) { + + if (enabled) { + + if (itemsContainer) { + itemsContainer.addEventListener('focus', onItemsFocusIn, true); + } + + if (options.mode === 'keyboard') { + element.addEventListener('click', onAlphaPickerInKeyboardModeClick); + } + + if (options.valueChangeEvent !== 'click') { + element.addEventListener('focus', onAlphaPickerFocusIn, true); + } else { + element.addEventListener('click', onAlphaPickerClick.bind(this)); + } - if (options.valueChangeEvent !== 'click') { - element.addEventListener('focus', onAlphaPickerFocusIn, true); } else { - element.addEventListener('click', onAlphaPickerClick.bind(this)); - } - } else { - - if (itemsContainer) { - itemsContainer.removeEventListener('focus', onItemsFocusIn, true); - } - - element.removeEventListener('click', onAlphaPickerInKeyboardModeClick); - element.removeEventListener('focus', onAlphaPickerFocusIn, true); - element.removeEventListener('click', onAlphaPickerClick.bind(this)); - } - }; - - render(element, options); - - this.enabled(true); - this.visible(true); - } - - AlphaPicker.prototype.value = function (value, applyValue) { - - var element = this.options.element; - var btn; - var selected; - - if (value !== undefined) { - if (value != null) { - - value = value.toUpperCase(); - this._currentValue = value; - - if (this.options.mode !== 'keyboard') { - selected = element.querySelector('.' + selectedButtonClass); - - try { - btn = element.querySelector('.alphaPickerButton[data-value=\'' + value + '\']'); - } catch (err) { - console.error('error in querySelector: ' + err); + if (itemsContainer) { + itemsContainer.removeEventListener('focus', onItemsFocusIn, true); } - if (btn && btn !== selected) { - btn.classList.add(selectedButtonClass); + element.removeEventListener('click', onAlphaPickerInKeyboardModeClick); + element.removeEventListener('focus', onAlphaPickerFocusIn, true); + element.removeEventListener('click', onAlphaPickerClick.bind(this)); + } + }; + + render(element, options); + + this.enabled(true); + this.visible(true); + } + + value(value, applyValue) { + + const element = this.options.element; + let btn; + let selected; + + if (value !== undefined) { + if (value != null) { + + value = value.toUpperCase(); + this._currentValue = value; + + if (this.options.mode !== 'keyboard') { + selected = element.querySelector(`.${selectedButtonClass}`); + + try { + btn = element.querySelector(`.alphaPickerButton[data-value='${value}']`); + } catch (err) { + console.error(`error in querySelector: ${err}`); + } + + if (btn && btn !== selected) { + btn.classList.add(selectedButtonClass); + } + if (selected && selected !== btn) { + selected.classList.remove(selectedButtonClass); + } } - if (selected && selected !== btn) { + } else { + this._currentValue = value; + + selected = element.querySelector(`.${selectedButtonClass}`); + if (selected) { selected.classList.remove(selectedButtonClass); } } - } else { - this._currentValue = value; - - selected = element.querySelector('.' + selectedButtonClass); - if (selected) { - selected.classList.remove(selectedButtonClass); - } } + + if (applyValue) { + element.dispatchEvent(new CustomEvent('alphavaluechanged', { + cancelable: false, + detail: { + value + } + })); + } + + return this._currentValue; } - if (applyValue) { - element.dispatchEvent(new CustomEvent('alphavaluechanged', { - cancelable: false, - detail: { - value: value - } - })); + on(name, fn) { + const element = this.options.element; + element.addEventListener(name, fn); } - return this._currentValue; - }; - - AlphaPicker.prototype.on = function (name, fn) { - var element = this.options.element; - element.addEventListener(name, fn); - }; - - AlphaPicker.prototype.off = function (name, fn) { - var element = this.options.element; - element.removeEventListener(name, fn); - }; - - AlphaPicker.prototype.visible = function (visible) { - - var element = this.options.element; - element.style.visibility = visible ? 'visible' : 'hidden'; - }; - - AlphaPicker.prototype.values = function () { - - var element = this.options.element; - var elems = element.querySelectorAll('.alphaPickerButton'); - var values = []; - for (var i = 0, length = elems.length; i < length; i++) { - - values.push(elems[i].getAttribute('data-value')); - + off(name, fn) { + const element = this.options.element; + element.removeEventListener(name, fn); } - return values; - }; + visible(visible) { - AlphaPicker.prototype.focus = function () { + const element = this.options.element; + element.style.visibility = visible ? 'visible' : 'hidden'; + } - var element = this.options.element; - focusManager.autoFocus(element, true); - }; + values() { - AlphaPicker.prototype.destroy = function () { + const element = this.options.element; + const elems = element.querySelectorAll('.alphaPickerButton'); + const values = []; + for (let i = 0, length = elems.length; i < length; i++) { - var element = this.options.element; - this.enabled(false); - element.classList.remove('focuscontainer-x'); - this.options = null; - }; + values.push(elems[i].getAttribute('data-value')); - return AlphaPicker; -}); + } + + return values; + } + + focus() { + + const element = this.options.element; + focusManager.autoFocus(element, true); + } + + destroy() { + + const element = this.options.element; + this.enabled(false); + element.classList.remove('focuscontainer-x'); + this.options = null; + } + } + +/* eslint-enable indent */ +export default AlphaPicker; diff --git a/src/components/search/searchfields.js b/src/components/search/searchfields.js index 53ab187a81..7e77814772 100644 --- a/src/components/search/searchfields.js +++ b/src/components/search/searchfields.js @@ -43,7 +43,7 @@ define(['layoutManager', 'globalize', 'require', 'events', 'browser', 'alphaPick function initAlphaPicker(alphaPickerElement, instance) { - instance.alphaPicker = new AlphaPicker({ + instance.alphaPicker = new AlphaPicker.default({ element: alphaPickerElement, mode: 'keyboard' }); diff --git a/src/components/tabbedview/itemstab.js b/src/components/tabbedview/itemstab.js index 884cfa2015..4aac2f747d 100644 --- a/src/components/tabbedview/itemstab.js +++ b/src/components/tabbedview/itemstab.js @@ -51,7 +51,7 @@ define(['playbackManager', 'userSettings', 'alphaPicker', 'alphaNumericShortcuts instance.itemsContainer = view.querySelector('.itemsContainer'); - instance.alphaPicker = new AlphaPicker({ + instance.alphaPicker = new AlphaPicker.default({ element: instance.alphaPickerElement, itemsContainer: instance.itemsContainer, itemClass: 'card' diff --git a/src/controllers/list.js b/src/controllers/list.js index d05616ec9d..fafbd1b419 100644 --- a/src/controllers/list.js +++ b/src/controllers/list.js @@ -1,4 +1,4 @@ -define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager', 'cardBuilder', 'loading', 'connectionManager', 'alphaNumericShortcuts', 'scroller', 'playbackManager', 'alphaPicker', 'emby-itemscontainer', 'emby-scroller'], function (globalize, listView, layoutManager, userSettings, focusManager, cardBuilder, loading, connectionManager, AlphaNumericShortcuts, scroller, playbackManager, alphaPicker) { +define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager', 'cardBuilder', 'loading', 'connectionManager', 'alphaNumericShortcuts', 'scroller', 'playbackManager', 'alphaPicker', 'emby-itemscontainer', 'emby-scroller'], function (globalize, listView, layoutManager, userSettings, focusManager, cardBuilder, loading, connectionManager, AlphaNumericShortcuts, scroller, playbackManager, AlphaPicker) { 'use strict'; function getInitialLiveTvQuery(instance, params) { @@ -544,7 +544,7 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager' alphaPickerElement.classList.add('focuscontainer-right'); self.itemsContainer.parentNode.classList.add('padded-right-withalphapicker'); - self.alphaPicker = new alphaPicker({ + self.alphaPicker = new AlphaPicker.default({ element: alphaPickerElement, itemsContainer: layoutManager.tv ? self.itemsContainer : null, itemClass: 'card', diff --git a/src/controllers/movies/movies.js b/src/controllers/movies/movies.js index 89bcc215e6..55947e6a9c 100644 --- a/src/controllers/movies/movies.js +++ b/src/controllers/movies/movies.js @@ -1,4 +1,4 @@ -define(['loading', 'layoutManager', 'userSettings', 'events', 'libraryBrowser', 'alphaPicker', 'listView', 'cardBuilder', 'globalize', 'emby-itemscontainer'], function (loading, layoutManager, userSettings, events, libraryBrowser, alphaPicker, listView, cardBuilder, globalize) { +define(['loading', 'layoutManager', 'userSettings', 'events', 'libraryBrowser', 'alphaPicker', 'listView', 'cardBuilder', 'globalize', 'emby-itemscontainer'], function (loading, layoutManager, userSettings, events, libraryBrowser, AlphaPicker, listView, cardBuilder, globalize) { 'use strict'; return function (view, params, tabContent, options) { @@ -168,7 +168,7 @@ define(['loading', 'layoutManager', 'userSettings', 'events', 'libraryBrowser', query.StartIndex = 0; itemsContainer.refreshItems(); }); - self.alphaPicker = new alphaPicker({ + self.alphaPicker = new AlphaPicker.default({ element: alphaPickerElement, valueChangeEvent: 'click' }); diff --git a/src/controllers/movies/movietrailers.js b/src/controllers/movies/movietrailers.js index 25d41d4fba..9a7d4c0099 100644 --- a/src/controllers/movies/movietrailers.js +++ b/src/controllers/movies/movietrailers.js @@ -1,4 +1,4 @@ -define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', 'alphaPicker', 'listView', 'cardBuilder', 'userSettings', 'globalize', 'emby-itemscontainer'], function (layoutManager, loading, events, libraryBrowser, imageLoader, alphaPicker, listView, cardBuilder, userSettings, globalize) { +define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', 'alphaPicker', 'listView', 'cardBuilder', 'userSettings', 'globalize', 'emby-itemscontainer'], function (layoutManager, loading, events, libraryBrowser, imageLoader, AlphaPicker, listView, cardBuilder, userSettings, globalize) { 'use strict'; return function (view, params, tabContent) { @@ -208,7 +208,7 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', ' query.StartIndex = 0; reloadItems(); }); - self.alphaPicker = new alphaPicker({ + self.alphaPicker = new AlphaPicker.default({ element: alphaPickerElement, valueChangeEvent: 'click' }); diff --git a/src/controllers/music/musicalbums.js b/src/controllers/music/musicalbums.js index ecb51f9dc3..b9f1333e61 100644 --- a/src/controllers/music/musicalbums.js +++ b/src/controllers/music/musicalbums.js @@ -1,4 +1,4 @@ -define(['layoutManager', 'playbackManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', 'alphaPicker', 'listView', 'cardBuilder', 'userSettings', 'globalize', 'emby-itemscontainer'], function (layoutManager, playbackManager, loading, events, libraryBrowser, imageLoader, alphaPicker, listView, cardBuilder, userSettings, globalize) { +define(['layoutManager', 'playbackManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', 'alphaPicker', 'listView', 'cardBuilder', 'userSettings', 'globalize', 'emby-itemscontainer'], function (layoutManager, playbackManager, loading, events, libraryBrowser, imageLoader, AlphaPicker, listView, cardBuilder, userSettings, globalize) { 'use strict'; return function (view, params, tabContent) { @@ -215,7 +215,7 @@ define(['layoutManager', 'playbackManager', 'loading', 'events', 'libraryBrowser query.StartIndex = 0; reloadItems(tabContent); }); - self.alphaPicker = new alphaPicker({ + self.alphaPicker = new AlphaPicker.default({ element: alphaPickerElement, valueChangeEvent: 'click' }); diff --git a/src/controllers/music/musicartists.js b/src/controllers/music/musicartists.js index bd9341be6d..4341250f83 100644 --- a/src/controllers/music/musicartists.js +++ b/src/controllers/music/musicartists.js @@ -1,4 +1,4 @@ -define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', 'alphaPicker', 'listView', 'cardBuilder', 'apphost', 'userSettings', 'emby-itemscontainer'], function (layoutManager, loading, events, libraryBrowser, imageLoader, alphaPicker, listView, cardBuilder, appHost, userSettings) { +define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', 'alphaPicker', 'listView', 'cardBuilder', 'apphost', 'userSettings', 'emby-itemscontainer'], function (layoutManager, loading, events, libraryBrowser, imageLoader, AlphaPicker, listView, cardBuilder, appHost, userSettings) { 'use strict'; return function (view, params, tabContent) { @@ -199,7 +199,7 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', ' query.StartIndex = 0; reloadItems(tabContent); }); - self.alphaPicker = new alphaPicker({ + self.alphaPicker = new AlphaPicker.default({ element: alphaPickerElement, valueChangeEvent: 'click' }); diff --git a/src/controllers/shows/tvshows.js b/src/controllers/shows/tvshows.js index 753516f902..0aa2dd4448 100644 --- a/src/controllers/shows/tvshows.js +++ b/src/controllers/shows/tvshows.js @@ -1,4 +1,4 @@ -define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', 'listView', 'cardBuilder', 'alphaPicker', 'userSettings', 'globalize', 'emby-itemscontainer'], function (layoutManager, loading, events, libraryBrowser, imageLoader, listView, cardBuilder, alphaPicker, userSettings, globalize) { +define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', 'listView', 'cardBuilder', 'alphaPicker', 'userSettings', 'globalize', 'emby-itemscontainer'], function (layoutManager, loading, events, libraryBrowser, imageLoader, listView, cardBuilder, AlphaPicker, userSettings, globalize) { 'use strict'; return function (view, params, tabContent) { @@ -226,7 +226,7 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', ' query.StartIndex = 0; reloadItems(tabContent); }); - self.alphaPicker = new alphaPicker({ + self.alphaPicker = new AlphaPicker.default({ element: alphaPickerElement, valueChangeEvent: 'click' }); From 7f87c4671df12b8efaed65e1cc921a51efd5d2cd Mon Sep 17 00:00:00 2001 From: Dmitry Lyzo <56478732+dmitrylyzo@users.noreply.github.com> Date: Fri, 12 Jun 2020 16:37:11 +0300 Subject: [PATCH 017/244] Fix 'this' in event handler --- src/components/subtitlesettings/subtitlesettings.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/subtitlesettings/subtitlesettings.js b/src/components/subtitlesettings/subtitlesettings.js index 0c00bbc808..0db6999ba9 100644 --- a/src/components/subtitlesettings/subtitlesettings.js +++ b/src/components/subtitlesettings/subtitlesettings.js @@ -135,7 +135,7 @@ function embed(options, self) { options.element.classList.add('subtitlesettings'); options.element.innerHTML = globalize.translateDocument(template, 'core'); - options.element.querySelector('form').addEventListener('submit', self.onSubmit ); + options.element.querySelector('form').addEventListener('submit', self.onSubmit.bind(self)); options.element.querySelector('#selectSubtitlePlaybackMode').addEventListener('change', onSubtitleModeChange); options.element.querySelector('#selectTextSize').addEventListener('change', onAppearanceFieldChange); From 857c1d8e2a5e05c7c8fcf8b714fa536373bb990c Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Sat, 13 Jun 2020 17:33:56 +0300 Subject: [PATCH 018/244] apply suggestion --- src/components/imageOptionsEditor/imageOptionsEditor.js | 4 ++-- src/components/libraryoptionseditor/libraryoptionseditor.js | 4 ++-- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/src/components/imageOptionsEditor/imageOptionsEditor.js b/src/components/imageOptionsEditor/imageOptionsEditor.js index a1e7f71a9c..2a3022b0da 100644 --- a/src/components/imageOptionsEditor/imageOptionsEditor.js +++ b/src/components/imageOptionsEditor/imageOptionsEditor.js @@ -92,8 +92,8 @@ import 'emby-input'; export class editor { constructor() { this.show = (itemType, options, availableOptions) => { - return new Promise((resolve) => { - import('text!./components/imageOptionsEditor/imageOptionsEditor.template.html').then(({default: template}) => { + return import('text!./components/imageOptionsEditor/imageOptionsEditor.template.html').then(({default: template}) => { + return new Promise((resolve) => { const dlg = dialogHelper.createDialog({ size: 'small', removeOnClose: true, diff --git a/src/components/libraryoptionseditor/libraryoptionseditor.js b/src/components/libraryoptionseditor/libraryoptionseditor.js index 6a5f4f6e9b..8b365e51ae 100644 --- a/src/components/libraryoptionseditor/libraryoptionseditor.js +++ b/src/components/libraryoptionseditor/libraryoptionseditor.js @@ -364,8 +364,8 @@ import 'emby-input'; currentAvailableOptions = null; const isNewLibrary = null === libraryOptions; isNewLibrary && parent.classList.add('newlibrary'); - return new Promise((resolve) => { - import('text!./libraryoptionseditor.template.html').then(({default: template}) => { + return import('text!./libraryoptionseditor.template.html').then(({default: template}) => { + return new Promise((resolve) => { parent.innerHTML = globalize.translateDocument(template); populateRefreshInterval(parent.querySelector('#selectAutoRefreshInterval')); const promises = [populateLanguages(parent), populateCountries(parent.querySelector('#selectCountry'))]; From 09fe6b4d3b3c07941d01d733d137b68b090f3440 Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Sat, 13 Jun 2020 17:44:54 +0300 Subject: [PATCH 019/244] apply suggestion --- src/components/imageUploader/imageUploader.js | 2 +- src/components/itemMediaInfo/itemMediaInfo.js | 4 ++-- src/components/itemidentifier/itemidentifier.js | 4 ++-- 3 files changed, 5 insertions(+), 5 deletions(-) diff --git a/src/components/imageUploader/imageUploader.js b/src/components/imageUploader/imageUploader.js index fec5363886..345475b53d 100644 --- a/src/components/imageUploader/imageUploader.js +++ b/src/components/imageUploader/imageUploader.js @@ -141,7 +141,7 @@ import 'css!./style'; options = options || {}; - import('text!./imageUploader.template.html').then(({default: template}) => { + return import('text!./imageUploader.template.html').then(({default: template}) => { currentItemId = options.itemId; currentServerId = options.serverId; diff --git a/src/components/itemMediaInfo/itemMediaInfo.js b/src/components/itemMediaInfo/itemMediaInfo.js index dcfaf3864a..9c2c8c9664 100644 --- a/src/components/itemMediaInfo/itemMediaInfo.js +++ b/src/components/itemMediaInfo/itemMediaInfo.js @@ -168,8 +168,8 @@ import 'flexStyles'; export function show(itemId, serverId) { loading.show(); - return new Promise((resolve, reject) => { - import('text!./itemMediaInfo.template.html').then(({default: template}) => { + return import('text!./itemMediaInfo.template.html').then(({default: template}) => { + return new Promise((resolve, reject) => { loadMediaInfo(itemId, serverId, template).then(resolve, reject); }); }); diff --git a/src/components/itemidentifier/itemidentifier.js b/src/components/itemidentifier/itemidentifier.js index 10655b1279..9b3afcde2e 100644 --- a/src/components/itemidentifier/itemidentifier.js +++ b/src/components/itemidentifier/itemidentifier.js @@ -357,7 +357,7 @@ import 'cardStyle'; loading.show(); - import('text!./itemidentifier.template.html').then(({default: template}) => { + return import('text!./itemidentifier.template.html').then(({default: template}) => { const apiClient = getApiClient(); @@ -446,7 +446,7 @@ import 'cardStyle'; currentItem = null; currentItemType = itemType; - import('text!./itemidentifier.template.html').then(({default: template}) => { + return import('text!./itemidentifier.template.html').then(({default: template}) => { const dialogOptions = { size: 'small', From 5cca460986d3f43232d5e5e18f94cdc742cb61dc Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Sat, 13 Jun 2020 19:32:38 +0300 Subject: [PATCH 020/244] Migration mediainfo to ES6 modules --- package.json | 1 + src/components/mediainfo/mediainfo.js | 192 ++++++++++++++------------ 2 files changed, 102 insertions(+), 91 deletions(-) diff --git a/package.json b/package.json index 91d070e04d..3089790602 100644 --- a/package.json +++ b/package.json @@ -99,6 +99,7 @@ "src/components/images/imageLoader.js", "src/components/indicators/indicators.js", "src/components/lazyLoader/lazyLoaderIntersectionObserver.js", + "src/components/mediainfo/mediainfo.js", "src/components/playback/brightnessosd.js", "src/components/playback/mediasession.js", "src/components/playback/nowplayinghelper.js", diff --git a/src/components/mediainfo/mediainfo.js b/src/components/mediainfo/mediainfo.js index 7de11c42f7..f64e670351 100644 --- a/src/components/mediainfo/mediainfo.js +++ b/src/components/mediainfo/mediainfo.js @@ -1,9 +1,18 @@ -define(['datetime', 'globalize', 'appRouter', 'itemHelper', 'indicators', 'material-icons', 'css!./mediainfo.css', 'programStyles', 'emby-button'], function (datetime, globalize, appRouter, itemHelper, indicators) { - 'use strict'; +import datetime from 'datetime'; +import globalize from 'globalize'; +import appRouter from 'appRouter'; +import itemHelper from 'itemHelper'; +import indicators from 'indicators'; +import 'material-icons'; +import 'css!./mediainfo.css'; +import 'programStyles'; +import 'emby-button'; + +/* eslint-disable indent */ function getTimerIndicator(item) { - var status; + let status; if (item.Type === 'SeriesTimer') { return ''; @@ -30,11 +39,11 @@ define(['datetime', 'globalize', 'appRouter', 'itemHelper', 'indicators', 'mater } function getProgramInfoHtml(item, options) { - var html = ''; + let html = ''; - var miscInfo = []; - var text; - var date; + const miscInfo = []; + let text; + let date; if (item.StartDate && options.programTime !== false) { @@ -48,35 +57,35 @@ define(['datetime', 'globalize', 'appRouter', 'itemHelper', 'indicators', 'mater text += datetime.toLocaleDateString(date, { weekday: 'short', month: 'short', day: 'numeric' }); } - text += ' ' + datetime.getDisplayTime(date); + text += ` ${datetime.getDisplayTime(date)}`; if (item.EndDate) { date = datetime.parseISO8601Date(item.EndDate); - text += ' - ' + datetime.getDisplayTime(date); + text += ` - ${datetime.getDisplayTime(date)}`; } miscInfo.push(text); } catch (e) { - console.error('error parsing date: ' + item.StartDate); + console.error(`error parsing date: ${item.StartDate}`); } } if (item.ChannelNumber) { - miscInfo.push('CH ' + item.ChannelNumber); + miscInfo.push(`CH ${item.ChannelNumber}`); } if (item.ChannelName) { if (options.interactive && item.ChannelId) { miscInfo.push({ - html: '' + item.ChannelName + '' + })}">${item.ChannelName}` }); } else { miscInfo.push(item.ChannelName); @@ -84,7 +93,7 @@ define(['datetime', 'globalize', 'appRouter', 'itemHelper', 'indicators', 'mater } if (options.timerIndicator !== false) { - var timerHtml = getTimerIndicator(item); + const timerHtml = getTimerIndicator(item); if (timerHtml) { miscInfo.push({ html: timerHtml @@ -92,24 +101,24 @@ define(['datetime', 'globalize', 'appRouter', 'itemHelper', 'indicators', 'mater } } - html += miscInfo.map(function (m) { + html += miscInfo.map(m => { return getMediaInfoItem(m); }).join(''); return html; } - function getMediaInfoHtml(item, options) { - var html = ''; + export function getMediaInfoHtml(item, options) { + let html = ''; - var miscInfo = []; + const miscInfo = []; options = options || {}; - var text; - var date; - var minutes; - var count; + let text; + let date; + let minutes; + let count; - var showFolderRuntime = item.Type === 'MusicAlbum' || item.MediaType === 'MusicArtist' || item.MediaType === 'Playlist' || item.MediaType === 'MusicGenre'; + const showFolderRuntime = item.Type === 'MusicAlbum' || item.MediaType === 'MusicArtist' || item.MediaType === 'Playlist' || item.MediaType === 'MusicGenre'; if (showFolderRuntime) { @@ -143,7 +152,7 @@ define(['datetime', 'globalize', 'appRouter', 'itemHelper', 'indicators', 'mater text = datetime.toLocaleDateString(date); miscInfo.push(text); } catch (e) { - console.error('error parsing date: ' + item.PremiereDate); + console.error(`error parsing date: ${item.PremiereDate}`); } } } @@ -176,7 +185,7 @@ define(['datetime', 'globalize', 'appRouter', 'itemHelper', 'indicators', 'mater miscInfo.push(text); } } catch (e) { - console.error('error parsing date: ' + item.StartDate); + console.error(`error parsing date: ${item.StartDate}`); } } @@ -193,14 +202,14 @@ define(['datetime', 'globalize', 'appRouter', 'itemHelper', 'indicators', 'mater try { - var endYear = datetime.parseISO8601Date(item.EndDate).getFullYear(); + const endYear = datetime.parseISO8601Date(item.EndDate).getFullYear(); if (endYear !== item.ProductionYear) { - text += '-' + datetime.parseISO8601Date(item.EndDate).getFullYear(); + text += `-${datetime.parseISO8601Date(item.EndDate).getFullYear()}`; } } catch (e) { - console.error('error parsing date: ' + item.EndDate); + console.error(`error parsing date: ${item.EndDate}`); } } @@ -213,19 +222,19 @@ define(['datetime', 'globalize', 'appRouter', 'itemHelper', 'indicators', 'mater if (options.programIndicator !== false) { if (item.IsLive) { miscInfo.push({ - html: '
' + globalize.translate('Live') + '
' + html: `
${globalize.translate('Live')}
` }); } else if (item.IsPremiere) { miscInfo.push({ - html: '
' + globalize.translate('Premiere') + '
' + html: `
${globalize.translate('Premiere')}
` }); } else if (item.IsSeries && !item.IsRepeat) { miscInfo.push({ - html: '
' + globalize.translate('AttributeNew') + '
' + html: `
${globalize.translate('AttributeNew')}
` }); } else if (item.IsSeries && item.IsRepeat) { miscInfo.push({ - html: '
' + globalize.translate('Repeat') + '
' + html: `
${globalize.translate('Repeat')}
` }); } } @@ -248,7 +257,7 @@ define(['datetime', 'globalize', 'appRouter', 'itemHelper', 'indicators', 'mater text = globalize.translate('OriginalAirDateValue', datetime.toLocaleDateString(date)); miscInfo.push(text); } catch (e) { - console.error('error parsing date: ' + item.PremiereDate); + console.error(`error parsing date: ${item.PremiereDate}`); } } else if (item.ProductionYear) { miscInfo.push(item.ProductionYear); @@ -267,7 +276,7 @@ define(['datetime', 'globalize', 'appRouter', 'itemHelper', 'indicators', 'mater text = datetime.parseISO8601Date(item.PremiereDate).getFullYear(); miscInfo.push(text); } catch (e) { - console.error('error parsing date: ' + item.PremiereDate); + console.error(`error parsing date: ${item.PremiereDate}`); } } } @@ -284,7 +293,7 @@ define(['datetime', 'globalize', 'appRouter', 'itemHelper', 'indicators', 'mater minutes = minutes || 1; - miscInfo.push(Math.round(minutes) + ' mins'); + miscInfo.push(`${Math.round(minutes)} mins`); } } @@ -300,14 +309,14 @@ define(['datetime', 'globalize', 'appRouter', 'itemHelper', 'indicators', 'mater } if (item.MediaType === 'Photo' && item.Width && item.Height) { - miscInfo.push(item.Width + 'x' + item.Height); + miscInfo.push(`${item.Width}x${item.Height}`); } if (options.container !== false && item.Type === 'Audio' && item.Container) { miscInfo.push(item.Container); } - html += miscInfo.map(function (m) { + html += miscInfo.map(m => { return getMediaInfoItem(m); }).join(''); @@ -320,15 +329,15 @@ define(['datetime', 'globalize', 'appRouter', 'itemHelper', 'indicators', 'mater if (item.CriticRating && options.criticRating !== false) { if (item.CriticRating >= 60) { - html += '
' + item.CriticRating + '
'; + html += `
${item.CriticRating}
`; } else { - html += '
' + item.CriticRating + '
'; + html += `
${item.CriticRating}
`; } } if (options.endsAt !== false) { - var endsAt = getEndsAt(item); + const endsAt = getEndsAt(item); if (endsAt) { html += getMediaInfoItem(endsAt, 'endsAt'); } @@ -339,15 +348,15 @@ define(['datetime', 'globalize', 'appRouter', 'itemHelper', 'indicators', 'mater return html; } - function getEndsAt(item) { + export function getEndsAt(item) { if (item.MediaType === 'Video' && item.RunTimeTicks) { if (!item.StartDate) { - var endDate = new Date().getTime() + (item.RunTimeTicks / 10000); + let endDate = new Date().getTime() + (item.RunTimeTicks / 10000); endDate = new Date(endDate); - var displayTime = datetime.getDisplayTime(endDate); + const displayTime = datetime.getDisplayTime(endDate); return globalize.translate('EndsAtValue', displayTime); } } @@ -355,12 +364,12 @@ define(['datetime', 'globalize', 'appRouter', 'itemHelper', 'indicators', 'mater return null; } - function getEndsAtFromPosition(runtimeTicks, positionTicks, includeText) { + export function getEndsAtFromPosition(runtimeTicks, positionTicks, includeText) { - var endDate = new Date().getTime() + ((runtimeTicks - (positionTicks || 0)) / 10000); + let endDate = new Date().getTime() + ((runtimeTicks - (positionTicks || 0)) / 10000); endDate = new Date(endDate); - var displayTime = datetime.getDisplayTime(endDate); + const displayTime = datetime.getDisplayTime(endDate); if (includeText === false) { return displayTime; @@ -370,8 +379,8 @@ define(['datetime', 'globalize', 'appRouter', 'itemHelper', 'indicators', 'mater function getMediaInfoItem(m, cssClass) { - cssClass = cssClass ? (cssClass + ' mediaInfoItem') : 'mediaInfoItem'; - var mediaInfoText = m; + cssClass = cssClass ? (`${cssClass} mediaInfoItem`) : 'mediaInfoItem'; + let mediaInfoText = m; if (typeof (m) !== 'string' && typeof (m) !== 'number') { @@ -379,13 +388,13 @@ define(['datetime', 'globalize', 'appRouter', 'itemHelper', 'indicators', 'mater return m.html; } mediaInfoText = m.text; - cssClass += ' ' + m.cssClass; + cssClass += ` ${m.cssClass}`; } - return '
' + mediaInfoText + '
'; + return `
${mediaInfoText}
`; } function getStarIconsHtml(item) { - var html = ''; + let html = ''; if (item.CommunityRating) { html += '
'; @@ -400,7 +409,7 @@ define(['datetime', 'globalize', 'appRouter', 'itemHelper', 'indicators', 'mater function dynamicEndTime(elem, item) { - var interval = setInterval(function () { + const interval = setInterval(() => { if (!document.body.contains(elem)) { @@ -413,15 +422,15 @@ define(['datetime', 'globalize', 'appRouter', 'itemHelper', 'indicators', 'mater }, 60000); } - function fillPrimaryMediaInfo(elem, item, options) { - var html = getPrimaryMediaInfoHtml(item, options); + export function fillPrimaryMediaInfo(elem, item, options) { + const html = getPrimaryMediaInfoHtml(item, options); elem.innerHTML = html; afterFill(elem, item, options); } - function fillSecondaryMediaInfo(elem, item, options) { - var html = getSecondaryMediaInfoHtml(item, options); + export function fillSecondaryMediaInfo(elem, item, options) { + const html = getSecondaryMediaInfoHtml(item, options); elem.innerHTML = html; afterFill(elem, item, options); @@ -430,13 +439,13 @@ define(['datetime', 'globalize', 'appRouter', 'itemHelper', 'indicators', 'mater function afterFill(elem, item, options) { if (options.endsAt !== false) { - var endsAtElem = elem.querySelector('.endsAt'); + const endsAtElem = elem.querySelector('.endsAt'); if (endsAtElem) { dynamicEndTime(endsAtElem, item); } } - var lnkChannel = elem.querySelector('.lnkChannel'); + const lnkChannel = elem.querySelector('.lnkChannel'); if (lnkChannel) { lnkChannel.addEventListener('click', onChannelLinkClick); } @@ -444,8 +453,8 @@ define(['datetime', 'globalize', 'appRouter', 'itemHelper', 'indicators', 'mater function onChannelLinkClick(e) { - var channelId = this.getAttribute('data-id'); - var serverId = this.getAttribute('data-serverid'); + const channelId = this.getAttribute('data-id'); + const serverId = this.getAttribute('data-serverid'); appRouter.showItem(channelId, serverId); @@ -453,7 +462,7 @@ define(['datetime', 'globalize', 'appRouter', 'itemHelper', 'indicators', 'mater return false; } - function getPrimaryMediaInfoHtml(item, options) { + export function getPrimaryMediaInfoHtml(item, options) { options = options || {}; if (options.interactive == null) { @@ -463,7 +472,7 @@ define(['datetime', 'globalize', 'appRouter', 'itemHelper', 'indicators', 'mater return getMediaInfoHtml(item, options); } - function getSecondaryMediaInfoHtml(item, options) { + export function getSecondaryMediaInfoHtml(item, options) { options = options || {}; if (options.interactive == null) { @@ -476,10 +485,10 @@ define(['datetime', 'globalize', 'appRouter', 'itemHelper', 'indicators', 'mater return ''; } - function getResolutionText(i) { + export function getResolutionText(i) { - var width = i.Width; - var height = i.Height; + const width = i.Width; + const height = i.Height; if (width && height) { @@ -522,28 +531,28 @@ define(['datetime', 'globalize', 'appRouter', 'itemHelper', 'indicators', 'mater return null; } - var mediaSource = item.MediaSources[0]; + const mediaSource = item.MediaSources[0]; if (!mediaSource) { return null; } - return (mediaSource.MediaStreams || []).filter(function (i) { + return (mediaSource.MediaStreams || []).filter(i => { return i.Type === 'Audio' && (i.Index === mediaSource.DefaultAudioStreamIndex || mediaSource.DefaultAudioStreamIndex == null); })[0]; } - function getMediaInfoStats(item, options) { + export function getMediaInfoStats(item, options) { options = options || {}; - var list = []; + const list = []; - var mediaSource = (item.MediaSources || [])[0] || {}; + const mediaSource = (item.MediaSources || [])[0] || {}; - var videoStream = (mediaSource.MediaStreams || []).filter(function (i) { + const videoStream = (mediaSource.MediaStreams || []).filter(i => { return i.Type === 'Video'; })[0] || {}; - var audioStream = getAudioStreamForDisplay(item) || {}; + const audioStream = getAudioStreamForDisplay(item) || {}; if (item.VideoType === 'Dvd') { list.push({ @@ -563,7 +572,7 @@ define(['datetime', 'globalize', 'appRouter', 'itemHelper', 'indicators', 'mater // html += '
' + mediaSource.Container + '
'; //} - var resolutionText = getResolutionText(videoStream); + const resolutionText = getResolutionText(videoStream); if (resolutionText) { list.push({ type: 'mediainfo', @@ -578,8 +587,8 @@ define(['datetime', 'globalize', 'appRouter', 'itemHelper', 'indicators', 'mater }); } - var channels = audioStream.Channels; - var channelText; + const channels = audioStream.Channels; + let channelText; if (channels === 8) { @@ -605,7 +614,7 @@ define(['datetime', 'globalize', 'appRouter', 'itemHelper', 'indicators', 'mater }); } - var audioCodec = (audioStream.Codec || '').toLowerCase(); + const audioCodec = (audioStream.Codec || '').toLowerCase(); if ((audioCodec === 'dca' || audioCodec === 'dts') && audioStream.Profile) { list.push({ @@ -621,27 +630,28 @@ define(['datetime', 'globalize', 'appRouter', 'itemHelper', 'indicators', 'mater if (item.DateCreated && itemHelper.enableDateAddedDisplay(item)) { - var dateCreated = datetime.parseISO8601Date(item.DateCreated); + const dateCreated = datetime.parseISO8601Date(item.DateCreated); list.push({ type: 'added', - text: globalize.translate('AddedOnValue', datetime.toLocaleDateString(dateCreated) + ' ' + datetime.getDisplayTime(dateCreated)) + text: globalize.translate('AddedOnValue', `${datetime.toLocaleDateString(dateCreated)} ${datetime.getDisplayTime(dateCreated)}`) }); } return list; } - return { - getMediaInfoHtml: getPrimaryMediaInfoHtml, - fill: fillPrimaryMediaInfo, - getEndsAt: getEndsAt, - getEndsAtFromPosition: getEndsAtFromPosition, - getPrimaryMediaInfoHtml: getPrimaryMediaInfoHtml, - getSecondaryMediaInfoHtml: getSecondaryMediaInfoHtml, - fillPrimaryMediaInfo: fillPrimaryMediaInfo, - fillSecondaryMediaInfo: fillSecondaryMediaInfo, - getMediaInfoStats: getMediaInfoStats, - getResolutionText: getResolutionText - }; -}); +/* eslint-enable indent */ + +export default { + getMediaInfoHtml: getPrimaryMediaInfoHtml, + fill: fillPrimaryMediaInfo, + getEndsAt: getEndsAt, + getEndsAtFromPosition: getEndsAtFromPosition, + getPrimaryMediaInfoHtml: getPrimaryMediaInfoHtml, + getSecondaryMediaInfoHtml: getSecondaryMediaInfoHtml, + fillPrimaryMediaInfo: fillPrimaryMediaInfo, + fillSecondaryMediaInfo: fillSecondaryMediaInfo, + getMediaInfoStats: getMediaInfoStats, + getResolutionText: getResolutionText +}; From 1556cc10e1ba94f490d9f902e62fd3b19c736826 Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Sat, 13 Jun 2020 19:36:44 +0300 Subject: [PATCH 021/244] remove duplicate code --- src/components/mediainfo/mediainfo.js | 1 - 1 file changed, 1 deletion(-) diff --git a/src/components/mediainfo/mediainfo.js b/src/components/mediainfo/mediainfo.js index f64e670351..724d3462fb 100644 --- a/src/components/mediainfo/mediainfo.js +++ b/src/components/mediainfo/mediainfo.js @@ -645,7 +645,6 @@ import 'emby-button'; export default { getMediaInfoHtml: getPrimaryMediaInfoHtml, - fill: fillPrimaryMediaInfo, getEndsAt: getEndsAt, getEndsAtFromPosition: getEndsAtFromPosition, getPrimaryMediaInfoHtml: getPrimaryMediaInfoHtml, From 6982176c676864e850493197e9623d2b1a837082 Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Sun, 14 Jun 2020 01:30:00 +0300 Subject: [PATCH 022/244] add default --- src/components/shortcuts.js | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/src/components/shortcuts.js b/src/components/shortcuts.js index 83a4dfc311..f105d6c599 100644 --- a/src/components/shortcuts.js +++ b/src/components/shortcuts.js @@ -76,7 +76,7 @@ import recordingHelper from 'recordingHelper'; function showProgramDialog(item) { - import('recordingCreator').then((recordingCreator) => { + import('recordingCreator').then(({default:recordingCreator}) => { recordingCreator.show(item.Id, item.ServerId); }); @@ -121,7 +121,7 @@ import recordingHelper from 'recordingHelper'; item.PlaylistItemId = elem ? elem.getAttribute('data-playlistitemid') : null; } - import('itemContextMenu').then((itemContextMenu) => { + import('itemContextMenu').then(({default: itemContextMenu}) => { connectionManager.getApiClient(item.ServerId).getCurrentUser().then(user => { itemContextMenu.show(Object.assign({ @@ -169,7 +169,7 @@ import recordingHelper from 'recordingHelper'; const item = getItemInfoFromCard(card); - import('playMenu').then((playMenu) => { + import('playMenu').then(({default: playMenu}) => { playMenu.show({ @@ -180,7 +180,7 @@ import recordingHelper from 'recordingHelper'; } function sendToast(text) { - import('toast').then((toast) => { + import('toast').then(({default: toast}) => { toast(text); }); } @@ -293,7 +293,7 @@ import recordingHelper from 'recordingHelper'; } function addToPlaylist(item) { - import('playlistEditor').then((playlistEditor) => { + import('playlistEditor').then(({default: playlistEditor}) => { new playlistEditor().show({ items: [item.Id], @@ -322,18 +322,18 @@ import recordingHelper from 'recordingHelper'; if (item.Type === 'Timer') { if (item.ProgramId) { - import('recordingCreator').then((recordingCreator) => { + import('recordingCreator').then(({default: recordingCreator}) => { recordingCreator.show(item.ProgramId, serverId).then(resolve, reject); }); } else { - import('recordingEditor').then((recordingEditor) => { + import('recordingEditor').then(({default: recordingEditor}) => { recordingEditor.show(item.Id, serverId).then(resolve, reject); }); } } else { - import('metadataEditor').then((metadataEditor) => { + import('metadataEditor').then(({default: metadataEditor}) => { metadataEditor.show(item.Id, serverId).then(resolve, reject); }); From e81a7dbb8f08be452bebcf23693a6b9e7d2d4484 Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Sun, 14 Jun 2020 02:28:15 +0300 Subject: [PATCH 023/244] Migration collectionEditor and playlisteditor to ES6 modules --- package.json | 2 + .../collectionEditor/collectionEditor.js | 194 ++++++++++-------- src/components/itemContextMenu.js | 4 +- src/components/multiSelect/multiSelect.js | 4 +- .../playlisteditor/playlisteditor.js | 193 +++++++++-------- src/components/remotecontrol/remotecontrol.js | 2 +- src/controllers/list.js | 2 +- src/controllers/movies/moviecollections.js | 2 +- src/scripts/playlists.js | 2 +- 9 files changed, 217 insertions(+), 188 deletions(-) diff --git a/package.json b/package.json index 91d070e04d..c3cc490761 100644 --- a/package.json +++ b/package.json @@ -96,6 +96,7 @@ "src/components/cardbuilder/cardBuilder.js", "src/components/cardbuilder/chaptercardbuilder.js", "src/components/cardbuilder/peoplecardbuilder.js", + "src/components/collectionEditor/collectionEditor.js", "src/components/images/imageLoader.js", "src/components/indicators/indicators.js", "src/components/lazyLoader/lazyLoaderIntersectionObserver.js", @@ -108,6 +109,7 @@ "src/components/playback/playmethodhelper.js", "src/components/playback/remotecontrolautoplay.js", "src/components/playback/volumeosd.js", + "src/components/playlisteditor/playlisteditor.js", "src/components/playmenu.js", "src/components/sanatizefilename.js", "src/components/scrollManager.js", diff --git a/src/components/collectionEditor/collectionEditor.js b/src/components/collectionEditor/collectionEditor.js index 46b0640305..a6bdc51eeb 100644 --- a/src/components/collectionEditor/collectionEditor.js +++ b/src/components/collectionEditor/collectionEditor.js @@ -1,16 +1,32 @@ -define(['dom', 'dialogHelper', 'loading', 'apphost', 'layoutManager', 'connectionManager', 'appRouter', 'globalize', 'emby-checkbox', 'emby-input', 'paper-icon-button-light', 'emby-select', 'material-icons', 'css!./../formdialog', 'emby-button', 'flexStyles'], function (dom, dialogHelper, loading, appHost, layoutManager, connectionManager, appRouter, globalize) { - 'use strict'; +import dom from 'dom'; +import dialogHelper from 'dialogHelper'; +import loading from 'loading'; +import appHost from 'apphost'; +import layoutManager from 'layoutManager'; +import connectionManager from 'connectionManager'; +import appRouter from 'appRouter'; +import globalize from 'globalize'; +import 'emby-checkbox'; +import 'emby-input'; +import 'paper-icon-button-light'; +import 'emby-select'; +import 'material-icons'; +import 'css!./../formdialog'; +import 'emby-button'; +import 'flexStyles'; - var currentServerId; +/* eslint-disable indent */ + + let currentServerId; function onSubmit(e) { loading.show(); - var panel = dom.parentWithClass(this, 'dialog'); + const panel = dom.parentWithClass(this, 'dialog'); - var collectionId = panel.querySelector('#selectCollectionToAddTo').value; + const collectionId = panel.querySelector('#selectCollectionToAddTo').value; - var apiClient = connectionManager.getApiClient(currentServerId); + const apiClient = connectionManager.getApiClient(currentServerId); if (collectionId) { addToCollection(apiClient, panel, collectionId); @@ -24,7 +40,7 @@ define(['dom', 'dialogHelper', 'loading', 'apphost', 'layoutManager', 'connectio function createCollection(apiClient, dlg) { - var url = apiClient.getUrl('Collections', { + const url = apiClient.getUrl('Collections', { Name: dlg.querySelector('#txtNewCollectionName').value, IsLocked: !dlg.querySelector('#chkEnableInternetMetadata').checked, @@ -36,11 +52,11 @@ define(['dom', 'dialogHelper', 'loading', 'apphost', 'layoutManager', 'connectio url: url, dataType: 'json' - }).then(function (result) { + }).then(result => { loading.hide(); - var id = result.Id; + const id = result.Id; dlg.submitted = true; dialogHelper.close(dlg); @@ -56,7 +72,7 @@ define(['dom', 'dialogHelper', 'loading', 'apphost', 'layoutManager', 'connectio function addToCollection(apiClient, dlg, id) { - var url = apiClient.getUrl('Collections/' + id + '/Items', { + const url = apiClient.getUrl(`Collections/${id}/Items`, { Ids: dlg.querySelector('.fldSelectedItemIds').value || '' }); @@ -65,14 +81,14 @@ define(['dom', 'dialogHelper', 'loading', 'apphost', 'layoutManager', 'connectio type: 'POST', url: url - }).then(function () { + }).then(() => { loading.hide(); dlg.submitted = true; dialogHelper.close(dlg); - require(['toast'], function (toast) { + import('toast').then(({default: toast}) => { toast(globalize.translate('MessageItemsAdded')); }); }); @@ -86,11 +102,11 @@ define(['dom', 'dialogHelper', 'loading', 'apphost', 'layoutManager', 'connectio loading.show(); - var select = panel.querySelector('#selectCollectionToAddTo'); + const select = panel.querySelector('#selectCollectionToAddTo'); panel.querySelector('.newCollectionInfo').classList.add('hide'); - var options = { + const options = { Recursive: true, IncludeItemTypes: 'BoxSet', @@ -98,16 +114,16 @@ define(['dom', 'dialogHelper', 'loading', 'apphost', 'layoutManager', 'connectio EnableTotalRecordCount: false }; - var apiClient = connectionManager.getApiClient(currentServerId); - apiClient.getItems(apiClient.getCurrentUserId(), options).then(function (result) { + const apiClient = connectionManager.getApiClient(currentServerId); + apiClient.getItems(apiClient.getCurrentUserId(), options).then(result => { - var html = ''; + let html = ''; - html += ''; + html += ``; - html += result.Items.map(function (i) { + html += result.Items.map(i => { - return ''; + return ``; }); select.innerHTML = html; @@ -120,7 +136,7 @@ define(['dom', 'dialogHelper', 'loading', 'apphost', 'layoutManager', 'connectio function getEditorHtml() { - var html = ''; + let html = ''; html += '
'; html += '
'; @@ -134,27 +150,27 @@ define(['dom', 'dialogHelper', 'loading', 'apphost', 'layoutManager', 'connectio html += '
'; html += '
'; html += '
'; - html += ''; + html += ``; html += '
'; html += '
'; html += '
'; html += '
'; - html += ''; - html += '
' + globalize.translate('NewCollectionNameExample') + '
'; + html += ``; + html += `
${globalize.translate('NewCollectionNameExample')}
`; html += '
'; html += ''; // newCollectionInfo html += '
'; html += '
'; - html += ''; + html += ``; html += '
'; html += ''; @@ -188,7 +204,7 @@ define(['dom', 'dialogHelper', 'loading', 'apphost', 'layoutManager', 'connectio } else { content.querySelector('.fldSelectCollection').classList.add('hide'); - var selectCollectionToAddTo = content.querySelector('#selectCollectionToAddTo'); + const selectCollectionToAddTo = content.querySelector('#selectCollectionToAddTo'); selectCollectionToAddTo.innerHTML = ''; selectCollectionToAddTo.value = ''; triggerChange(selectCollectionToAddTo); @@ -196,79 +212,77 @@ define(['dom', 'dialogHelper', 'loading', 'apphost', 'layoutManager', 'connectio } function centerFocus(elem, horiz, on) { - require(['scrollHelper'], function (scrollHelper) { - var fn = on ? 'on' : 'off'; + import('scrollHelper').then(scrollHelper => { + const fn = on ? 'on' : 'off'; scrollHelper.centerFocus[fn](elem, horiz); }); } - function CollectionEditor() { + class CollectionEditor { + show(options) { - } + const items = options.items || {}; + currentServerId = options.serverId; - CollectionEditor.prototype.show = function (options) { - - var items = options.items || {}; - currentServerId = options.serverId; - - var dialogOptions = { - removeOnClose: true, - scrollY: false - }; - - if (layoutManager.tv) { - dialogOptions.size = 'fullscreen'; - } else { - dialogOptions.size = 'small'; - } - - var dlg = dialogHelper.createDialog(dialogOptions); - - dlg.classList.add('formDialog'); - - var html = ''; - var title = items.length ? globalize.translate('HeaderAddToCollection') : globalize.translate('NewCollection'); - - html += '
'; - html += ''; - html += '

'; - html += title; - html += '

'; - - if (appHost.supports('externallinks')) { - html += '' + globalize.translate('Help') + ''; - } - - html += '
'; - - html += getEditorHtml(); - - dlg.innerHTML = html; - - initEditor(dlg, items); - - dlg.querySelector('.btnCancel').addEventListener('click', function () { - - dialogHelper.close(dlg); - }); - - if (layoutManager.tv) { - centerFocus(dlg.querySelector('.formDialogContent'), false, true); - } - - return dialogHelper.open(dlg).then(function () { + const dialogOptions = { + removeOnClose: true, + scrollY: false + }; if (layoutManager.tv) { - centerFocus(dlg.querySelector('.formDialogContent'), false, false); + dialogOptions.size = 'fullscreen'; + } else { + dialogOptions.size = 'small'; } - if (dlg.submitted) { - return Promise.resolve(); + const dlg = dialogHelper.createDialog(dialogOptions); + + dlg.classList.add('formDialog'); + + let html = ''; + const title = items.length ? globalize.translate('HeaderAddToCollection') : globalize.translate('NewCollection'); + + html += '
'; + html += ''; + html += '

'; + html += title; + html += '

'; + + if (appHost.supports('externallinks')) { + html += `${globalize.translate('Help')}`; } - return Promise.reject(); - }); - }; + html += '
'; - return CollectionEditor; -}); + html += getEditorHtml(); + + dlg.innerHTML = html; + + initEditor(dlg, items); + + dlg.querySelector('.btnCancel').addEventListener('click', () => { + + dialogHelper.close(dlg); + }); + + if (layoutManager.tv) { + centerFocus(dlg.querySelector('.formDialogContent'), false, true); + } + + return dialogHelper.open(dlg).then(() => { + + if (layoutManager.tv) { + centerFocus(dlg.querySelector('.formDialogContent'), false, false); + } + + if (dlg.submitted) { + return Promise.resolve(); + } + + return Promise.reject(); + }); + } + } + +/* eslint-enable indent */ +export default CollectionEditor; diff --git a/src/components/itemContextMenu.js b/src/components/itemContextMenu.js index f258f5fe4b..e969721d64 100644 --- a/src/components/itemContextMenu.js +++ b/src/components/itemContextMenu.js @@ -319,7 +319,7 @@ define(['apphost', 'globalize', 'connectionManager', 'itemHelper', 'appRouter', switch (id) { case 'addtocollection': require(['collectionEditor'], function (collectionEditor) { - new collectionEditor().show({ + new collectionEditor.default().show({ items: [itemId], serverId: serverId }).then(getResolveFunction(resolve, id, true), getResolveFunction(resolve, id)); @@ -327,7 +327,7 @@ define(['apphost', 'globalize', 'connectionManager', 'itemHelper', 'appRouter', break; case 'addtoplaylist': require(['playlistEditor'], function (playlistEditor) { - new playlistEditor().show({ + new playlistEditor.default().show({ items: [itemId], serverId: serverId }).then(getResolveFunction(resolve, id, true), getResolveFunction(resolve, id)); diff --git a/src/components/multiSelect/multiSelect.js b/src/components/multiSelect/multiSelect.js index 83982413ae..4919b9dd34 100644 --- a/src/components/multiSelect/multiSelect.js +++ b/src/components/multiSelect/multiSelect.js @@ -255,7 +255,7 @@ define(['browser', 'appStorage', 'apphost', 'loading', 'connectionManager', 'glo switch (id) { case 'addtocollection': require(['collectionEditor'], function (collectionEditor) { - new collectionEditor().show({ + new collectionEditor.default().show({ items: items, serverId: serverId }); @@ -265,7 +265,7 @@ define(['browser', 'appStorage', 'apphost', 'loading', 'connectionManager', 'glo break; case 'playlist': require(['playlistEditor'], function (playlistEditor) { - new playlistEditor().show({ + new playlistEditor.default().show({ items: items, serverId: serverId }); diff --git a/src/components/playlisteditor/playlisteditor.js b/src/components/playlisteditor/playlisteditor.js index 56d7142ad3..12aa54f306 100644 --- a/src/components/playlisteditor/playlisteditor.js +++ b/src/components/playlisteditor/playlisteditor.js @@ -1,13 +1,28 @@ -define(['dom', 'shell', 'dialogHelper', 'loading', 'layoutManager', 'playbackManager', 'connectionManager', 'userSettings', 'appRouter', 'globalize', 'emby-input', 'paper-icon-button-light', 'emby-select', 'material-icons', 'css!./../formdialog', 'emby-button'], function (dom, shell, dialogHelper, loading, layoutManager, playbackManager, connectionManager, userSettings, appRouter, globalize) { - 'use strict'; +import dom from 'dom'; +import dialogHelper from 'dialogHelper'; +import loading from 'loading'; +import layoutManager from 'layoutManager'; +import playbackManager from 'playbackManager'; +import connectionManager from 'connectionManager'; +import userSettings from 'userSettings'; +import appRouter from 'appRouter'; +import globalize from 'globalize'; +import 'emby-input'; +import 'paper-icon-button-light'; +import 'emby-select'; +import 'material-icons'; +import 'css!./../formdialog'; +import 'emby-button'; - var currentServerId; +/* eslint-disable indent */ + + let currentServerId; function onSubmit(e) { - var panel = dom.parentWithClass(this, 'dialog'); + const panel = dom.parentWithClass(this, 'dialog'); - var playlistId = panel.querySelector('#selectPlaylistToAddTo').value; - var apiClient = connectionManager.getApiClient(currentServerId); + const playlistId = panel.querySelector('#selectPlaylistToAddTo').value; + const apiClient = connectionManager.getApiClient(currentServerId); if (playlistId) { userSettings.set('playlisteditor-lastplaylistid', playlistId); @@ -23,7 +38,7 @@ define(['dom', 'shell', 'dialogHelper', 'loading', 'layoutManager', 'playbackMan function createPlaylist(apiClient, dlg) { loading.show(); - var url = apiClient.getUrl('Playlists', { + const url = apiClient.getUrl('Playlists', { Name: dlg.querySelector('#txtNewPlaylistName').value, Ids: dlg.querySelector('.fldSelectedItemIds').value || '', userId: apiClient.getCurrentUserId() @@ -34,10 +49,10 @@ define(['dom', 'shell', 'dialogHelper', 'loading', 'layoutManager', 'playbackMan type: 'POST', url: url, dataType: 'json' - }).then(function (result) { + }).then(result => { loading.hide(); - var id = result.Id; + const id = result.Id; dlg.submitted = true; dialogHelper.close(dlg); redirectToPlaylist(apiClient, id); @@ -49,7 +64,7 @@ define(['dom', 'shell', 'dialogHelper', 'loading', 'layoutManager', 'playbackMan } function addToPlaylist(apiClient, dlg, id) { - var itemIds = dlg.querySelector('.fldSelectedItemIds').value || ''; + const itemIds = dlg.querySelector('.fldSelectedItemIds').value || ''; if (id === 'queue') { playbackManager.queue({ @@ -63,7 +78,7 @@ define(['dom', 'shell', 'dialogHelper', 'loading', 'layoutManager', 'playbackMan loading.show(); - var url = apiClient.getUrl('Playlists/' + id + '/Items', { + const url = apiClient.getUrl(`Playlists/${id}/Items`, { Ids: itemIds, userId: apiClient.getCurrentUserId() }); @@ -72,7 +87,7 @@ define(['dom', 'shell', 'dialogHelper', 'loading', 'layoutManager', 'playbackMan type: 'POST', url: url - }).then(function () { + }).then(() => { loading.hide(); dlg.submitted = true; @@ -85,36 +100,36 @@ define(['dom', 'shell', 'dialogHelper', 'loading', 'layoutManager', 'playbackMan } function populatePlaylists(editorOptions, panel) { - var select = panel.querySelector('#selectPlaylistToAddTo'); + const select = panel.querySelector('#selectPlaylistToAddTo'); loading.hide(); panel.querySelector('.newPlaylistInfo').classList.add('hide'); - var options = { + const options = { Recursive: true, IncludeItemTypes: 'Playlist', SortBy: 'SortName', EnableTotalRecordCount: false }; - var apiClient = connectionManager.getApiClient(currentServerId); - apiClient.getItems(apiClient.getCurrentUserId(), options).then(function (result) { - var html = ''; + const apiClient = connectionManager.getApiClient(currentServerId); + apiClient.getItems(apiClient.getCurrentUserId(), options).then(result => { + let html = ''; if (editorOptions.enableAddToPlayQueue !== false && playbackManager.isPlaying()) { - html += ''; + html += ``; } - html += ''; + html += ``; - html += result.Items.map(function (i) { - return ''; + html += result.Items.map(i => { + return ``; }); select.innerHTML = html; - var defaultValue = editorOptions.defaultValue; + let defaultValue = editorOptions.defaultValue; if (!defaultValue) { defaultValue = userSettings.get('playlisteditor-lastplaylistid') || ''; } @@ -132,29 +147,29 @@ define(['dom', 'shell', 'dialogHelper', 'loading', 'layoutManager', 'playbackMan } function getEditorHtml(items) { - var html = ''; + let html = ''; html += '
'; html += '
'; html += '
'; html += '
'; - var autoFocus = items.length ? ' autofocus' : ''; - html += ''; + let autoFocus = items.length ? ' autofocus' : ''; + html += ``; html += '
'; html += '
'; html += '
'; autoFocus = items.length ? '' : ' autofocus'; - html += ''; + html += ``; html += '
'; // newPlaylistInfo html += '
'; html += '
'; - html += ''; + html += ``; html += '
'; html += ''; @@ -187,7 +202,7 @@ define(['dom', 'shell', 'dialogHelper', 'loading', 'layoutManager', 'playbackMan } else { content.querySelector('.fldSelectPlaylist').classList.add('hide'); - var selectPlaylistToAddTo = content.querySelector('#selectPlaylistToAddTo'); + const selectPlaylistToAddTo = content.querySelector('#selectPlaylistToAddTo'); selectPlaylistToAddTo.innerHTML = ''; selectPlaylistToAddTo.value = ''; triggerChange(selectPlaylistToAddTo); @@ -195,72 +210,70 @@ define(['dom', 'shell', 'dialogHelper', 'loading', 'layoutManager', 'playbackMan } function centerFocus(elem, horiz, on) { - require(['scrollHelper'], function (scrollHelper) { - var fn = on ? 'on' : 'off'; + import('scrollHelper').then(scrollHelper => { + const fn = on ? 'on' : 'off'; scrollHelper.centerFocus[fn](elem, horiz); }); } - function PlaylistEditor() { + class PlaylistEditor { + show(options) { + const items = options.items || {}; + currentServerId = options.serverId; + const dialogOptions = { + removeOnClose: true, + scrollY: false + }; + + if (layoutManager.tv) { + dialogOptions.size = 'fullscreen'; + } else { + dialogOptions.size = 'small'; + } + + const dlg = dialogHelper.createDialog(dialogOptions); + + dlg.classList.add('formDialog'); + + let html = ''; + const title = globalize.translate('HeaderAddToPlaylist'); + + html += '
'; + html += ''; + html += '

'; + html += title; + html += '

'; + + html += '
'; + + html += getEditorHtml(items); + + dlg.innerHTML = html; + + initEditor(dlg, options, items); + + dlg.querySelector('.btnCancel').addEventListener('click', () => { + dialogHelper.close(dlg); + }); + + if (layoutManager.tv) { + centerFocus(dlg.querySelector('.formDialogContent'), false, true); + } + + return dialogHelper.open(dlg).then(() => { + if (layoutManager.tv) { + centerFocus(dlg.querySelector('.formDialogContent'), false, false); + } + + if (dlg.submitted) { + return Promise.resolve(); + } + + return Promise.reject(); + }); + } } - PlaylistEditor.prototype.show = function (options) { - var items = options.items || {}; - currentServerId = options.serverId; - - var dialogOptions = { - removeOnClose: true, - scrollY: false - }; - - if (layoutManager.tv) { - dialogOptions.size = 'fullscreen'; - } else { - dialogOptions.size = 'small'; - } - - var dlg = dialogHelper.createDialog(dialogOptions); - - dlg.classList.add('formDialog'); - - var html = ''; - var title = globalize.translate('HeaderAddToPlaylist'); - - html += '
'; - html += ''; - html += '

'; - html += title; - html += '

'; - - html += '
'; - - html += getEditorHtml(items); - - dlg.innerHTML = html; - - initEditor(dlg, options, items); - - dlg.querySelector('.btnCancel').addEventListener('click', function () { - dialogHelper.close(dlg); - }); - - if (layoutManager.tv) { - centerFocus(dlg.querySelector('.formDialogContent'), false, true); - } - - return dialogHelper.open(dlg).then(function () { - if (layoutManager.tv) { - centerFocus(dlg.querySelector('.formDialogContent'), false, false); - } - - if (dlg.submitted) { - return Promise.resolve(); - } - - return Promise.reject(); - }); - }; - - return PlaylistEditor; -}); +/* eslint-enable indent */ +export default PlaylistEditor; diff --git a/src/components/remotecontrol/remotecontrol.js b/src/components/remotecontrol/remotecontrol.js index 089915a834..b1cc84f81e 100644 --- a/src/components/remotecontrol/remotecontrol.js +++ b/src/components/remotecontrol/remotecontrol.js @@ -589,7 +589,7 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL require(['playlistEditor'], function (playlistEditor) { getSaveablePlaylistItems().then(function (items) { var serverId = items.length ? items[0].ServerId : ApiClient.serverId(); - new playlistEditor().show({ + new playlistEditor.default().show({ items: items.map(function (i) { return i.Id; }), diff --git a/src/controllers/list.js b/src/controllers/list.js index d05616ec9d..f5af412cd1 100644 --- a/src/controllers/list.js +++ b/src/controllers/list.js @@ -386,7 +386,7 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager' var instance = this; require(['playlistEditor'], function (playlistEditor) { - new playlistEditor().show({ + new playlistEditor.default().show({ items: [], serverId: instance.params.serverId }); diff --git a/src/controllers/movies/moviecollections.js b/src/controllers/movies/moviecollections.js index 54d30c0c37..bc47eecd2d 100644 --- a/src/controllers/movies/moviecollections.js +++ b/src/controllers/movies/moviecollections.js @@ -242,7 +242,7 @@ define(['loading', 'events', 'libraryBrowser', 'imageLoader', 'listView', 'cardB tabContent.querySelector('.btnNewCollection').addEventListener('click', function () { require(['collectionEditor'], function (collectionEditor) { var serverId = ApiClient.serverInfo().Id; - new collectionEditor().show({ + new collectionEditor.default().show({ items: [], serverId: serverId }); diff --git a/src/scripts/playlists.js b/src/scripts/playlists.js index 974d00f8e6..7e5ec7ae4a 100644 --- a/src/scripts/playlists.js +++ b/src/scripts/playlists.js @@ -184,7 +184,7 @@ define(['loading', 'listView', 'cardBuilder', 'libraryMenu', 'libraryBrowser', ' view.querySelector('.btnNewPlaylist').addEventListener('click', function () { require(['playlistEditor'], function (playlistEditor) { var serverId = ApiClient.serverInfo().Id; - new playlistEditor().show({ + new playlistEditor.default().show({ items: [], serverId: serverId }); From 3e583fcf212cc2fa4e3003d6a028f6cf07a8f091 Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Tue, 16 Jun 2020 22:23:19 +0300 Subject: [PATCH 024/244] Fix userSettings Cannot read property 'get' of undefined --- src/components/playlisteditor/playlisteditor.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/playlisteditor/playlisteditor.js b/src/components/playlisteditor/playlisteditor.js index 12aa54f306..283acfd0fe 100644 --- a/src/components/playlisteditor/playlisteditor.js +++ b/src/components/playlisteditor/playlisteditor.js @@ -4,7 +4,7 @@ import loading from 'loading'; import layoutManager from 'layoutManager'; import playbackManager from 'playbackManager'; import connectionManager from 'connectionManager'; -import userSettings from 'userSettings'; +import * as userSettings from 'userSettings'; import appRouter from 'appRouter'; import globalize from 'globalize'; import 'emby-input'; From cfd2ec1ddca3e017a6603e693a2c9c59520bd2f8 Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Tue, 16 Jun 2020 23:45:03 +0300 Subject: [PATCH 025/244] Migration backdrop to ES6 modules (cherry picked from commit 4ff4df6477cec4ea71ab042340bfd8875561221e) --- package.json | 1 + src/components/appRouter.js | 4 +- src/components/backdrop/backdrop.js | 186 +++++++++--------- src/components/remotecontrol/remotecontrol.js | 2 +- src/components/skinManager.js | 2 +- src/components/tabbedview/tabbedview.js | 2 +- src/controllers/itemDetails.js | 2 +- src/scripts/autoBackdrops.js | 6 +- 8 files changed, 106 insertions(+), 99 deletions(-) diff --git a/package.json b/package.json index 29aa2f82a7..4f5b607b6a 100644 --- a/package.json +++ b/package.json @@ -93,6 +93,7 @@ "src/components/accessSchedule/accessSchedule.js", "src/components/actionSheet/actionSheet.js", "src/components/autoFocuser.js", + "src/components/backdrop/backdrop.js", "src/components/cardbuilder/cardBuilder.js", "src/components/cardbuilder/chaptercardbuilder.js", "src/components/cardbuilder/peoplecardbuilder.js", diff --git a/src/components/appRouter.js b/src/components/appRouter.js index 0861cf7e00..1791aef7e2 100644 --- a/src/components/appRouter.js +++ b/src/components/appRouter.js @@ -21,7 +21,7 @@ define(['loading', 'globalize', 'events', 'viewManager', 'skinManager', 'backdro }; function beginConnectionWizard() { - backdrop.clear(); + backdrop.clearBackdrop(); loading.show(); connectionManager.connect({ enableAutoLogin: appSettings.enableAutoLogin() @@ -657,7 +657,7 @@ define(['loading', 'globalize', 'events', 'viewManager', 'skinManager', 'backdro } if (level === 'full' || level === 2) { - backdrop.clear(true); + backdrop.clearBackdrop(true); document.documentElement.classList.add('transparentDocument'); backgroundContainer.classList.add('backgroundContainer-transparent'); backdropContainer.classList.add('hide'); diff --git a/src/components/backdrop/backdrop.js b/src/components/backdrop/backdrop.js index c15e35524c..51bb280765 100644 --- a/src/components/backdrop/backdrop.js +++ b/src/components/backdrop/backdrop.js @@ -1,5 +1,11 @@ -define(['browser', 'connectionManager', 'playbackManager', 'dom', 'userSettings', 'css!./backdrop'], function (browser, connectionManager, playbackManager, dom, userSettings) { - 'use strict'; +import browser from 'browser'; +import connectionManager from 'connectionManager'; +import playbackManager from 'playbackManager'; +import dom from 'dom'; +import * as userSettings from 'userSettings'; +import 'css!./backdrop'; + +/* eslint-disable indent */ function enableAnimation(elem) { if (browser.slow) { @@ -22,71 +28,70 @@ define(['browser', 'connectionManager', 'playbackManager', 'dom', 'userSettings' return true; } - function Backdrop() { - } + class Backdrop { + load(url, parent, existingBackdropImage) { + const img = new Image(); + const self = this; - Backdrop.prototype.load = function (url, parent, existingBackdropImage) { - var img = new Image(); - var self = this; - - img.onload = function () { - if (self.isDestroyed) { - return; - } - - var backdropImage = document.createElement('div'); - backdropImage.classList.add('backdropImage'); - backdropImage.classList.add('displayingBackdropImage'); - backdropImage.style.backgroundImage = "url('" + url + "')"; - backdropImage.setAttribute('data-url', url); - - backdropImage.classList.add('backdropImageFadeIn'); - parent.appendChild(backdropImage); - - if (!enableAnimation(backdropImage)) { - if (existingBackdropImage && existingBackdropImage.parentNode) { - existingBackdropImage.parentNode.removeChild(existingBackdropImage); + img.onload = () => { + if (self.isDestroyed) { + return; } - internalBackdrop(true); - return; - } - var onAnimationComplete = function () { - dom.removeEventListener(backdropImage, dom.whichAnimationEvent(), onAnimationComplete, { + const backdropImage = document.createElement('div'); + backdropImage.classList.add('backdropImage'); + backdropImage.classList.add('displayingBackdropImage'); + backdropImage.style.backgroundImage = `url('${url}')`; + backdropImage.setAttribute('data-url', url); + + backdropImage.classList.add('backdropImageFadeIn'); + parent.appendChild(backdropImage); + + if (!enableAnimation(backdropImage)) { + if (existingBackdropImage && existingBackdropImage.parentNode) { + existingBackdropImage.parentNode.removeChild(existingBackdropImage); + } + internalBackdrop(true); + return; + } + + const onAnimationComplete = () => { + dom.removeEventListener(backdropImage, dom.whichAnimationEvent(), onAnimationComplete, { + once: true + }); + if (backdropImage === self.currentAnimatingElement) { + self.currentAnimatingElement = null; + } + if (existingBackdropImage && existingBackdropImage.parentNode) { + existingBackdropImage.parentNode.removeChild(existingBackdropImage); + } + }; + + dom.addEventListener(backdropImage, dom.whichAnimationEvent(), onAnimationComplete, { once: true }); - if (backdropImage === self.currentAnimatingElement) { - self.currentAnimatingElement = null; - } - if (existingBackdropImage && existingBackdropImage.parentNode) { - existingBackdropImage.parentNode.removeChild(existingBackdropImage); - } + + internalBackdrop(true); }; - dom.addEventListener(backdropImage, dom.whichAnimationEvent(), onAnimationComplete, { - once: true - }); - - internalBackdrop(true); - }; - - img.src = url; - }; - - Backdrop.prototype.cancelAnimation = function () { - var elem = this.currentAnimatingElement; - if (elem) { - elem.classList.remove('backdropImageFadeIn'); - this.currentAnimatingElement = null; + img.src = url; } - }; - Backdrop.prototype.destroy = function () { - this.isDestroyed = true; - this.cancelAnimation(); - }; + cancelAnimation() { + const elem = this.currentAnimatingElement; + if (elem) { + elem.classList.remove('backdropImageFadeIn'); + this.currentAnimatingElement = null; + } + } - var backdropContainer; + destroy() { + this.isDestroyed = true; + this.cancelAnimation(); + } + } + + let backdropContainer; function getBackdropContainer() { if (!backdropContainer) { backdropContainer = document.querySelector('.backdropContainer'); @@ -101,7 +106,7 @@ define(['browser', 'connectionManager', 'playbackManager', 'dom', 'userSettings' return backdropContainer; } - function clearBackdrop(clearAll) { + export function clearBackdrop(clearAll) { clearRotation(); if (currentLoadingBackdrop) { @@ -109,7 +114,7 @@ define(['browser', 'connectionManager', 'playbackManager', 'dom', 'userSettings' currentLoadingBackdrop = null; } - var elem = getBackdropContainer(); + const elem = getBackdropContainer(); elem.innerHTML = ''; if (clearAll) { @@ -119,7 +124,7 @@ define(['browser', 'connectionManager', 'playbackManager', 'dom', 'userSettings' internalBackdrop(false); } - var backgroundContainer; + let backgroundContainer; function getBackgroundContainer() { if (!backgroundContainer) { backgroundContainer = document.querySelector('.backgroundContainer'); @@ -135,14 +140,14 @@ define(['browser', 'connectionManager', 'playbackManager', 'dom', 'userSettings' } } - var hasInternalBackdrop; + let hasInternalBackdrop; function internalBackdrop(enabled) { hasInternalBackdrop = enabled; setBackgroundContainerBackgroundEnabled(); } - var hasExternalBackdrop; - function externalBackdrop(enabled) { + let hasExternalBackdrop; + export function externalBackdrop(enabled) { hasExternalBackdrop = enabled; setBackgroundContainerBackgroundEnabled(); } @@ -151,15 +156,15 @@ define(['browser', 'connectionManager', 'playbackManager', 'dom', 'userSettings' return Math.floor(Math.random() * (max - min) + min); } - var currentLoadingBackdrop; + let currentLoadingBackdrop; function setBackdropImage(url) { if (currentLoadingBackdrop) { currentLoadingBackdrop.destroy(); currentLoadingBackdrop = null; } - var elem = getBackdropContainer(); - var existingBackdropImage = elem.querySelector('.displayingBackdropImage'); + const elem = getBackdropContainer(); + const existingBackdropImage = elem.querySelector('.displayingBackdropImage'); if (existingBackdropImage && existingBackdropImage.getAttribute('data-url') === url) { if (existingBackdropImage.getAttribute('data-url') === url) { @@ -168,7 +173,7 @@ define(['browser', 'connectionManager', 'playbackManager', 'dom', 'userSettings' existingBackdropImage.classList.remove('displayingBackdropImage'); } - var instance = new Backdrop(); + const instance = new Backdrop(); instance.load(url, elem, existingBackdropImage); currentLoadingBackdrop = instance; } @@ -176,9 +181,9 @@ define(['browser', 'connectionManager', 'playbackManager', 'dom', 'userSettings' function getItemImageUrls(item, imageOptions) { imageOptions = imageOptions || {}; - var apiClient = connectionManager.getApiClient(item.ServerId); + const apiClient = connectionManager.getApiClient(item.ServerId); if (item.BackdropImageTags && item.BackdropImageTags.length > 0) { - return item.BackdropImageTags.map(function (imgTag, index) { + return item.BackdropImageTags.map((imgTag, index) => { return apiClient.getScaledImageUrl(item.BackdropItemId || item.Id, Object.assign(imageOptions, { type: 'Backdrop', tag: imgTag, @@ -189,7 +194,7 @@ define(['browser', 'connectionManager', 'playbackManager', 'dom', 'userSettings' } if (item.ParentBackdropItemId && item.ParentBackdropImageTags && item.ParentBackdropImageTags.length) { - return item.ParentBackdropImageTags.map(function (imgTag, index) { + return item.ParentBackdropImageTags.map((imgTag, index) => { return apiClient.getScaledImageUrl(item.ParentBackdropItemId, Object.assign(imageOptions, { type: 'Backdrop', tag: imgTag, @@ -203,13 +208,13 @@ define(['browser', 'connectionManager', 'playbackManager', 'dom', 'userSettings' } function getImageUrls(items, imageOptions) { - var list = []; - var onImg = function (img) { + const list = []; + const onImg = img => { list.push(img); }; - for (var i = 0, length = items.length; i < length; i++) { - var itemImages = getItemImageUrls(items[i], imageOptions); + for (let i = 0, length = items.length; i < length; i++) { + const itemImages = getItemImageUrls(items[i], imageOptions); itemImages.forEach(onImg); } @@ -229,7 +234,7 @@ define(['browser', 'connectionManager', 'playbackManager', 'dom', 'userSettings' // If you don't care about the order of the elements inside // the array, you should sort both arrays here. - for (var i = 0; i < a.length; ++i) { + for (let i = 0; i < a.length; ++i) { if (a[i] !== b[i]) { return false; } @@ -242,12 +247,12 @@ define(['browser', 'connectionManager', 'playbackManager', 'dom', 'userSettings' return userSettings.enableBackdrops(); } - var rotationInterval; - var currentRotatingImages = []; - var currentRotationIndex = -1; - function setBackdrops(items, imageOptions, enableImageRotation) { + let rotationInterval; + let currentRotatingImages = []; + let currentRotationIndex = -1; + export function setBackdrops(items, imageOptions, enableImageRotation) { if (enabled()) { - var images = getImageUrls(items, imageOptions); + const images = getImageUrls(items, imageOptions); if (images.length) { startRotation(images, enableImageRotation); @@ -279,7 +284,7 @@ define(['browser', 'connectionManager', 'playbackManager', 'dom', 'userSettings' return; } - var newIndex = currentRotationIndex + 1; + let newIndex = currentRotationIndex + 1; if (newIndex >= currentRotatingImages.length) { newIndex = 0; } @@ -289,7 +294,7 @@ define(['browser', 'connectionManager', 'playbackManager', 'dom', 'userSettings' } function clearRotation() { - var interval = rotationInterval; + const interval = rotationInterval; if (interval) { clearInterval(interval); } @@ -299,7 +304,7 @@ define(['browser', 'connectionManager', 'playbackManager', 'dom', 'userSettings' currentRotationIndex = -1; } - function setBackdrop(url, imageOptions) { + export function setBackdrop(url, imageOptions) { if (url && typeof url !== 'string') { url = getImageUrls([url], imageOptions)[0]; } @@ -312,10 +317,11 @@ define(['browser', 'connectionManager', 'playbackManager', 'dom', 'userSettings' } } - return { - setBackdrops: setBackdrops, - setBackdrop: setBackdrop, - clear: clearBackdrop, - externalBackdrop: externalBackdrop - }; -}); +/* eslint-enable indent */ + +export default { + setBackdrops: setBackdrops, + setBackdrop: setBackdrop, + clearBackdrop: clearBackdrop, + externalBackdrop: externalBackdrop +}; diff --git a/src/components/remotecontrol/remotecontrol.js b/src/components/remotecontrol/remotecontrol.js index 089915a834..0f713dbe07 100644 --- a/src/components/remotecontrol/remotecontrol.js +++ b/src/components/remotecontrol/remotecontrol.js @@ -175,7 +175,7 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL context.querySelector('.nowPlayingPageUserDataButtons').innerHTML = ''; }); } else { - backdrop.clear(); + backdrop.clearBackdrop(); context.querySelector('.nowPlayingPageUserDataButtons').innerHTML = ''; } } diff --git a/src/components/skinManager.js b/src/components/skinManager.js index c38d34181b..faa1a1f306 100644 --- a/src/components/skinManager.js +++ b/src/components/skinManager.js @@ -84,7 +84,7 @@ define(['apphost', 'userSettings', 'browser', 'events', 'backdrop', 'globalize', currentSound = null; } - backdrop.clear(); + backdrop.clearBackdrop(); } function onThemeLoaded() { diff --git a/src/components/tabbedview/tabbedview.js b/src/components/tabbedview/tabbedview.js index a67e8e0fa1..4fec69f619 100644 --- a/src/components/tabbedview/tabbedview.js +++ b/src/components/tabbedview/tabbedview.js @@ -95,7 +95,7 @@ define(['backdrop', 'mainTabsManager', 'layoutManager', 'emby-tabs'], function ( TabbedView.prototype.onResume = function (options) { this.setTitle(); - backdrop.clear(); + backdrop.clearBackdrop(); var currentTabController = this.currentTabController; diff --git a/src/controllers/itemDetails.js b/src/controllers/itemDetails.js index 67aa5f9407..58b0861e17 100644 --- a/src/controllers/itemDetails.js +++ b/src/controllers/itemDetails.js @@ -462,7 +462,7 @@ define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSetti if (dom.getWindowSize().innerWidth >= 1000) { backdrop.setBackdrops([item]); } else { - backdrop.clear(); + backdrop.clearBackdrop(); } } diff --git a/src/scripts/autoBackdrops.js b/src/scripts/autoBackdrops.js index abd86c9dbf..678aa4c332 100644 --- a/src/scripts/autoBackdrops.js +++ b/src/scripts/autoBackdrops.js @@ -50,7 +50,7 @@ define(['backdrop', 'userSettings', 'libraryMenu'], function (backdrop, userSett return i; })); } else { - backdrop.clear(); + backdrop.clearBackdrop(); } }); } @@ -67,10 +67,10 @@ define(['backdrop', 'userSettings', 'libraryMenu'], function (backdrop, userSett showBackdrop(type, parentId); } else { page.classList.remove('backdropPage'); - backdrop.clear(); + backdrop.clearBackdrop(); } } else { - backdrop.clear(); + backdrop.clearBackdrop(); } } }); From 2b156bfe57b1ecb8a35a2b971964b00f2798e5bc Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Tue, 16 Jun 2020 23:51:30 +0300 Subject: [PATCH 026/244] Remove unused function (cherry picked from commit c1b65c0122949ccb99be794a6a81e59e8146d450) --- src/components/backdrop/backdrop.js | 4 ---- 1 file changed, 4 deletions(-) diff --git a/src/components/backdrop/backdrop.js b/src/components/backdrop/backdrop.js index 51bb280765..d3c9e58b59 100644 --- a/src/components/backdrop/backdrop.js +++ b/src/components/backdrop/backdrop.js @@ -152,10 +152,6 @@ import 'css!./backdrop'; setBackgroundContainerBackgroundEnabled(); } - function getRandom(min, max) { - return Math.floor(Math.random() * (max - min) + min); - } - let currentLoadingBackdrop; function setBackdropImage(url) { if (currentLoadingBackdrop) { From 582ea612675a8a24d39a87ffc5e217aa24a8c97d Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Wed, 17 Jun 2020 00:43:22 +0300 Subject: [PATCH 027/244] Migration dialog to ES6 modules --- package.json | 1 + src/components/alert.js | 2 +- src/components/confirm/confirm.js | 2 +- src/components/dialog/dialog.js | 72 ++++++++++++++++++------------- 4 files changed, 46 insertions(+), 31 deletions(-) diff --git a/package.json b/package.json index 29aa2f82a7..b1873fa7da 100644 --- a/package.json +++ b/package.json @@ -96,6 +96,7 @@ "src/components/cardbuilder/cardBuilder.js", "src/components/cardbuilder/chaptercardbuilder.js", "src/components/cardbuilder/peoplecardbuilder.js", + "src/components/dialog/dialog.js", "src/components/images/imageLoader.js", "src/components/indicators/indicators.js", "src/components/lazyLoader/lazyLoaderIntersectionObserver.js", diff --git a/src/components/alert.js b/src/components/alert.js index 8a37ac1845..97b580f8f6 100644 --- a/src/components/alert.js +++ b/src/components/alert.js @@ -31,7 +31,7 @@ define(['browser', 'dialog', 'globalize'], function (browser, dialog, globalize) options.buttons = items; - return dialog(options).then(function (result) { + return dialog.show(options).then(function (result) { if (result === 'ok') { return Promise.resolve(); } diff --git a/src/components/confirm/confirm.js b/src/components/confirm/confirm.js index 517d6fa9be..6b9252b5f5 100644 --- a/src/components/confirm/confirm.js +++ b/src/components/confirm/confirm.js @@ -53,7 +53,7 @@ define(['browser', 'dialog', 'globalize'], function(browser, dialog, globalize) options.buttons = items; - return dialog(options).then(function (result) { + return dialog.show(options).then(function (result) { if (result === 'ok') { return Promise.resolve(); } diff --git a/src/components/dialog/dialog.js b/src/components/dialog/dialog.js index cfb5821b38..937e96d297 100644 --- a/src/components/dialog/dialog.js +++ b/src/components/dialog/dialog.js @@ -1,20 +1,31 @@ -define(['dialogHelper', 'dom', 'layoutManager', 'scrollHelper', 'globalize', 'require', 'material-icons', 'emby-button', 'paper-icon-button-light', 'emby-input', 'formDialogStyle', 'flexStyles'], function (dialogHelper, dom, layoutManager, scrollHelper, globalize, require) { - 'use strict'; +import dialogHelper from 'dialogHelper'; +import dom from 'dom'; +import layoutManager from 'layoutManager'; +import scrollHelper from 'scrollHelper'; +import globalize from 'globalize'; +import 'material-icons'; +import 'emby-button'; +import 'paper-icon-button-light'; +import 'emby-input'; +import 'formDialogStyle'; +import 'flexStyles'; + +/* eslint-disable indent */ function showDialog(options, template) { - var dialogOptions = { + const dialogOptions = { removeOnClose: true, scrollY: false }; - var enableTvLayout = layoutManager.tv; + const enableTvLayout = layoutManager.tv; if (enableTvLayout) { dialogOptions.size = 'fullscreen'; } - var dlg = dialogHelper.createDialog(dialogOptions); + const dlg = dialogHelper.createDialog(dialogOptions); dlg.classList.add('formDialog'); @@ -22,7 +33,7 @@ define(['dialogHelper', 'dom', 'layoutManager', 'scrollHelper', 'globalize', 're dlg.classList.add('align-items-center'); dlg.classList.add('justify-content-center'); - var formDialogContent = dlg.querySelector('.formDialogContent'); + const formDialogContent = dlg.querySelector('.formDialogContent'); formDialogContent.classList.add('no-grow'); if (enableTvLayout) { @@ -30,7 +41,7 @@ define(['dialogHelper', 'dom', 'layoutManager', 'scrollHelper', 'globalize', 're formDialogContent.style['max-height'] = '60%'; scrollHelper.centerFocus.on(formDialogContent, false); } else { - formDialogContent.style.maxWidth = (Math.min((options.buttons.length * 150) + 200, dom.getWindowSize().innerWidth - 50)) + 'px'; + formDialogContent.style.maxWidth = `${Math.min((options.buttons.length * 150) + 200, dom.getWindowSize().innerWidth - 50)}px`; dlg.classList.add('dialog-fullscreen-lowres'); } @@ -44,27 +55,27 @@ define(['dialogHelper', 'dom', 'layoutManager', 'scrollHelper', 'globalize', 're dlg.querySelector('.formDialogHeaderTitle').classList.add('hide'); } - var displayText = options.html || options.text || ''; + const displayText = options.html || options.text || ''; dlg.querySelector('.text').innerHTML = displayText; if (!displayText) { dlg.querySelector('.dialogContentInner').classList.add('hide'); } - var i; - var length; - var html = ''; - var hasDescriptions = false; + let i; + let length; + let html = ''; + let hasDescriptions = false; for (i = 0, length = options.buttons.length; i < length; i++) { - var item = options.buttons[i]; - var autoFocus = i === 0 ? ' autofocus' : ''; + const item = options.buttons[i]; + const autoFocus = i === 0 ? ' autofocus' : ''; - var buttonClass = 'btnOption raised formDialogFooterItem formDialogFooterItem-autosize'; + let buttonClass = 'btnOption raised formDialogFooterItem formDialogFooterItem-autosize'; if (item.type) { - buttonClass += ' button-' + item.type; + buttonClass += ` button-${item.type}`; } if (item.description) { @@ -75,10 +86,10 @@ define(['dialogHelper', 'dom', 'layoutManager', 'scrollHelper', 'globalize', 're buttonClass += ' formDialogFooterItem-vertical formDialogFooterItem-nomarginbottom'; } - html += ''; + html += ``; if (item.description) { - html += '
' + item.description + '
'; + html += `
${item.description}
`; } } @@ -88,18 +99,18 @@ define(['dialogHelper', 'dom', 'layoutManager', 'scrollHelper', 'globalize', 're dlg.querySelector('.formDialogFooter').classList.add('formDialogFooter-vertical'); } - var dialogResult; + let dialogResult; function onButtonClick() { dialogResult = this.getAttribute('data-id'); dialogHelper.close(dlg); } - var buttons = dlg.querySelectorAll('.btnOption'); + const buttons = dlg.querySelectorAll('.btnOption'); for (i = 0, length = buttons.length; i < length; i++) { buttons[i].addEventListener('click', onButtonClick); } - return dialogHelper.open(dlg).then(function () { + return dialogHelper.open(dlg).then(() => { if (enableTvLayout) { scrollHelper.centerFocus.off(dlg.querySelector('.formDialogContent'), false); @@ -113,9 +124,9 @@ define(['dialogHelper', 'dom', 'layoutManager', 'scrollHelper', 'globalize', 're }); } - return function (text, title) { + export async function show(text, title) { - var options; + let options; if (typeof text === 'string') { options = { title: title, @@ -125,10 +136,13 @@ define(['dialogHelper', 'dom', 'layoutManager', 'scrollHelper', 'globalize', 're options = text; } - return new Promise(function (resolve, reject) { - require(['text!./dialog.template.html'], function (template) { - showDialog(options, template).then(resolve, reject); - }); + const { default: template } = await import('text!./dialog.template.html'); + return new Promise((resolve, reject) => { + showDialog(options, template).then(resolve, reject); }); - }; -}); + } + +/* eslint-enable indent */ +export default { + show: show +}; From 7c8a5d31846cef50b590be9ea72f9b128fc7b80e Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Wed, 17 Jun 2020 01:19:59 +0300 Subject: [PATCH 028/244] Migration dialogHelper to ES6 modules --- package.json | 1 + src/components/dialogHelper/dialogHelper.js | 127 +++++++++++--------- 2 files changed, 69 insertions(+), 59 deletions(-) diff --git a/package.json b/package.json index b1873fa7da..a1f2fe9a0a 100644 --- a/package.json +++ b/package.json @@ -97,6 +97,7 @@ "src/components/cardbuilder/chaptercardbuilder.js", "src/components/cardbuilder/peoplecardbuilder.js", "src/components/dialog/dialog.js", + "src/components/dialogHelper/dialogHelper.js", "src/components/images/imageLoader.js", "src/components/indicators/indicators.js", "src/components/lazyLoader/lazyLoaderIntersectionObserver.js", diff --git a/src/components/dialogHelper/dialogHelper.js b/src/components/dialogHelper/dialogHelper.js index 8b08cde678..73aee88f0f 100644 --- a/src/components/dialogHelper/dialogHelper.js +++ b/src/components/dialogHelper/dialogHelper.js @@ -1,7 +1,15 @@ -define(['appRouter', 'focusManager', 'browser', 'layoutManager', 'inputManager', 'dom', 'css!./dialoghelper.css', 'scrollStyles'], function (appRouter, focusManager, browser, layoutManager, inputManager, dom) { - 'use strict'; +import appRouter from 'appRouter'; +import focusManager from 'focusManager'; +import browser from 'browser'; +import layoutManager from 'layoutManager'; +import inputManager from 'inputManager'; +import dom from 'dom'; +import 'css!./dialoghelper.css'; +import 'scrollStyles'; - var globalOnOpenCallback; +/* eslint-disable indent */ + + let globalOnOpenCallback; function enableAnimation() { @@ -25,28 +33,28 @@ define(['appRouter', 'focusManager', 'browser', 'layoutManager', 'inputManager', } function tryRemoveElement(elem) { - var parentNode = elem.parentNode; + const parentNode = elem.parentNode; if (parentNode) { // Seeing crashes in edge webview try { parentNode.removeChild(elem); } catch (err) { - console.error('error removing dialog element: ' + err); + console.error(`error removing dialog element: ${err}`); } } } function DialogHashHandler(dlg, hash, resolve) { - var self = this; + const self = this; self.originalUrl = window.location.href; - var activeElement = document.activeElement; - var removeScrollLockOnClose = false; + const activeElement = document.activeElement; + let removeScrollLockOnClose = false; function onHashChange(e) { - var isBack = self.originalUrl === window.location.href; + const isBack = self.originalUrl === window.location.href; if (isBack || !isOpened(dlg)) { window.removeEventListener('popstate', onHashChange); @@ -84,7 +92,7 @@ define(['appRouter', 'focusManager', 'browser', 'layoutManager', 'inputManager', } if (!self.closedByBack && isHistoryEnabled(dlg)) { - var state = history.state || {}; + const state = history.state || {}; if (state.dialogId === hash) { history.back(); } @@ -97,7 +105,7 @@ define(['appRouter', 'focusManager', 'browser', 'layoutManager', 'inputManager', if (dlg.getAttribute('data-removeonclose') !== 'false') { removeCenterFocus(dlg); - var dialogContainer = dlg.dialogContainer; + const dialogContainer = dlg.dialogContainer; if (dialogContainer) { tryRemoveElement(dialogContainer); dlg.dialogContainer = null; @@ -108,7 +116,7 @@ define(['appRouter', 'focusManager', 'browser', 'layoutManager', 'inputManager', //resolve(); // if we just called history.back(), then use a timeout to allow the history events to fire first - setTimeout(function () { + setTimeout(() => { resolve({ element: dlg, closedByBack: self.closedByBack @@ -118,7 +126,7 @@ define(['appRouter', 'focusManager', 'browser', 'layoutManager', 'inputManager', dlg.addEventListener('close', onDialogClosed); - var center = !dlg.classList.contains('dialog-fixedSize'); + const center = !dlg.classList.contains('dialog-fixedSize'); if (center) { dlg.classList.add('centeredDialog'); } @@ -141,7 +149,7 @@ define(['appRouter', 'focusManager', 'browser', 'layoutManager', 'inputManager', animateDialogOpen(dlg); if (isHistoryEnabled(dlg)) { - appRouter.pushState({ dialogId: hash }, 'Dialog', '#' + hash); + appRouter.pushState({ dialogId: hash }, 'Dialog', `#${hash}`); window.addEventListener('popstate', onHashChange); } else { @@ -151,10 +159,10 @@ define(['appRouter', 'focusManager', 'browser', 'layoutManager', 'inputManager', function addBackdropOverlay(dlg) { - var backdrop = document.createElement('div'); + const backdrop = document.createElement('div'); backdrop.classList.add('dialogBackdrop'); - var backdropParent = dlg.dialogContainer || dlg; + const backdropParent = dlg.dialogContainer || dlg; backdropParent.parentNode.insertBefore(backdrop, backdropParent); dlg.backdrop = backdrop; @@ -162,7 +170,7 @@ define(['appRouter', 'focusManager', 'browser', 'layoutManager', 'inputManager', void backdrop.offsetWidth; backdrop.classList.add('dialogBackdropOpened'); - dom.addEventListener((dlg.dialogContainer || backdrop), 'click', function (e) { + dom.addEventListener((dlg.dialogContainer || backdrop), 'click', e => { if (e.target === dlg.dialogContainer) { close(dlg); } @@ -170,7 +178,7 @@ define(['appRouter', 'focusManager', 'browser', 'layoutManager', 'inputManager', passive: true }); - dom.addEventListener((dlg.dialogContainer || backdrop), 'contextmenu', function (e) { + dom.addEventListener((dlg.dialogContainer || backdrop), 'contextmenu', e => { if (e.target === dlg.dialogContainer) { // Close the application dialog menu close(dlg); @@ -184,26 +192,26 @@ define(['appRouter', 'focusManager', 'browser', 'layoutManager', 'inputManager', return dlg.getAttribute('data-history') === 'true'; } - function open(dlg) { + export function open(dlg) { if (globalOnOpenCallback) { globalOnOpenCallback(dlg); } - var parent = dlg.parentNode; + const parent = dlg.parentNode; if (parent) { parent.removeChild(dlg); } - var dialogContainer = document.createElement('div'); + const dialogContainer = document.createElement('div'); dialogContainer.classList.add('dialogContainer'); dialogContainer.appendChild(dlg); dlg.dialogContainer = dialogContainer; document.body.appendChild(dialogContainer); - return new Promise(function (resolve, reject) { + return new Promise((resolve, reject) => { - new DialogHashHandler(dlg, 'dlg' + new Date().getTime(), resolve); + new DialogHashHandler(dlg, `dlg${new Date().getTime()}`, resolve); }); } @@ -213,7 +221,7 @@ define(['appRouter', 'focusManager', 'browser', 'layoutManager', 'inputManager', return !dlg.classList.contains('hide'); } - function close(dlg) { + export function close(dlg) { if (isOpened(dlg)) { if (isHistoryEnabled(dlg)) { @@ -233,7 +241,7 @@ define(['appRouter', 'focusManager', 'browser', 'layoutManager', 'inputManager', cancelable: false })); - var onAnimationFinish = function () { + const onAnimationFinish = () => { focusManager.popScope(dlg); dlg.classList.add('hide'); @@ -249,7 +257,7 @@ define(['appRouter', 'focusManager', 'browser', 'layoutManager', 'inputManager', function animateDialogOpen(dlg) { - var onAnimationFinish = function () { + const onAnimationFinish = () => { focusManager.pushScope(dlg); if (dlg.getAttribute('data-autofocus') === 'true') { @@ -264,7 +272,7 @@ define(['appRouter', 'focusManager', 'browser', 'layoutManager', 'inputManager', if (enableAnimation()) { - var onFinish = function () { + const onFinish = () => { dom.removeEventListener(dlg, dom.whichAnimationEvent(), onFinish, { once: true }); @@ -283,24 +291,24 @@ define(['appRouter', 'focusManager', 'browser', 'layoutManager', 'inputManager', if (enableAnimation()) { - var animated = true; + let animated = true; switch (dlg.animationConfig.exit.name) { case 'fadeout': - dlg.style.animation = 'fadeout ' + dlg.animationConfig.exit.timing.duration + 'ms ease-out normal both'; + dlg.style.animation = `fadeout ${dlg.animationConfig.exit.timing.duration}ms ease-out normal both`; break; case 'scaledown': - dlg.style.animation = 'scaledown ' + dlg.animationConfig.exit.timing.duration + 'ms ease-out normal both'; + dlg.style.animation = `scaledown ${dlg.animationConfig.exit.timing.duration}ms ease-out normal both`; break; case 'slidedown': - dlg.style.animation = 'slidedown ' + dlg.animationConfig.exit.timing.duration + 'ms ease-out normal both'; + dlg.style.animation = `slidedown ${dlg.animationConfig.exit.timing.duration}ms ease-out normal both`; break; default: animated = false; break; } - var onFinish = function () { + const onFinish = () => { dom.removeEventListener(dlg, dom.whichAnimationEvent(), onFinish, { once: true }); @@ -318,7 +326,7 @@ define(['appRouter', 'focusManager', 'browser', 'layoutManager', 'inputManager', onAnimationFinish(); } - var supportsOverscrollBehavior = 'overscroll-behavior-y' in document.body.style; + const supportsOverscrollBehavior = 'overscroll-behavior-y' in document.body.style; function shouldLockDocumentScroll(options) { @@ -343,7 +351,7 @@ define(['appRouter', 'focusManager', 'browser', 'layoutManager', 'inputManager', function removeBackdrop(dlg) { - var backdrop = dlg.backdrop; + const backdrop = dlg.backdrop; if (!backdrop) { return; @@ -351,7 +359,7 @@ define(['appRouter', 'focusManager', 'browser', 'layoutManager', 'inputManager', dlg.backdrop = null; - var onAnimationFinish = function () { + const onAnimationFinish = () => { tryRemoveElement(backdrop); }; @@ -368,20 +376,20 @@ define(['appRouter', 'focusManager', 'browser', 'layoutManager', 'inputManager', } function centerFocus(elem, horiz, on) { - require(['scrollHelper'], function (scrollHelper) { - var fn = on ? 'on' : 'off'; + import('scrollHelper').then(scrollHelper => { + const fn = on ? 'on' : 'off'; scrollHelper.centerFocus[fn](elem, horiz); }); } - function createDialog(options) { + export function createDialog(options) { options = options || {}; // If there's no native dialog support, use a plain div // Also not working well in samsung tizen browser, content inside not clickable // Just go ahead and always use a plain div because we're seeing issues overlaying absoltutely positioned content over a modal dialog - var dlg = document.createElement('div'); + const dlg = document.createElement('div'); dlg.classList.add('focuscontainer'); dlg.classList.add('hide'); @@ -406,17 +414,17 @@ define(['appRouter', 'focusManager', 'browser', 'layoutManager', 'inputManager', dlg.setAttribute('data-autofocus', 'true'); } - var defaultEntryAnimation; - var defaultExitAnimation; + let defaultEntryAnimation; + let defaultExitAnimation; defaultEntryAnimation = 'scaleup'; defaultExitAnimation = 'scaledown'; - var entryAnimation = options.entryAnimation || defaultEntryAnimation; - var exitAnimation = options.exitAnimation || defaultExitAnimation; + const entryAnimation = options.entryAnimation || defaultEntryAnimation; + const exitAnimation = options.exitAnimation || defaultExitAnimation; // If it's not fullscreen then lower the default animation speed to make it open really fast - var entryAnimationDuration = options.entryAnimationDuration || (options.size !== 'fullscreen' ? 180 : 280); - var exitAnimationDuration = options.exitAnimationDuration || (options.size !== 'fullscreen' ? 120 : 220); + const entryAnimationDuration = options.entryAnimationDuration || (options.size !== 'fullscreen' ? 180 : 280); + const exitAnimationDuration = options.exitAnimationDuration || (options.size !== 'fullscreen' ? 120 : 220); dlg.animationConfig = { // scale up @@ -461,7 +469,7 @@ define(['appRouter', 'focusManager', 'browser', 'layoutManager', 'inputManager', if (options.size) { dlg.classList.add('dialog-fixedSize'); - dlg.classList.add('dialog-' + options.size); + dlg.classList.add(`dialog-${options.size}`); } if (enableAnimation()) { @@ -469,16 +477,16 @@ define(['appRouter', 'focusManager', 'browser', 'layoutManager', 'inputManager', switch (dlg.animationConfig.entry.name) { case 'fadein': - dlg.style.animation = 'fadein ' + entryAnimationDuration + 'ms ease-out normal'; + dlg.style.animation = `fadein ${entryAnimationDuration}ms ease-out normal`; break; case 'scaleup': - dlg.style.animation = 'scaleup ' + entryAnimationDuration + 'ms ease-out normal both'; + dlg.style.animation = `scaleup ${entryAnimationDuration}ms ease-out normal both`; break; case 'slideup': - dlg.style.animation = 'slideup ' + entryAnimationDuration + 'ms ease-out normal'; + dlg.style.animation = `slideup ${entryAnimationDuration}ms ease-out normal`; break; case 'slidedown': - dlg.style.animation = 'slidedown ' + entryAnimationDuration + 'ms ease-out normal'; + dlg.style.animation = `slidedown ${entryAnimationDuration}ms ease-out normal`; break; default: break; @@ -488,12 +496,13 @@ define(['appRouter', 'focusManager', 'browser', 'layoutManager', 'inputManager', return dlg; } - return { - open: open, - close: close, - createDialog: createDialog, - setOnOpen: function (val) { - globalOnOpenCallback = val; - } - }; -}); +/* eslint-enable indent */ + +export default { + open: open, + close: close, + createDialog: createDialog, + setOnOpen: function (val) { + globalOnOpenCallback = val; + } +}; From 999f27614081f687d500bafa87ad4803d5ebb0ee Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Thu, 18 Jun 2020 22:34:03 +0300 Subject: [PATCH 029/244] Migration multiSelect to ES6 modules --- package.json | 1 + src/components/multiSelect/multiSelect.js | 168 +++++++++--------- .../emby-itemscontainer.js | 2 +- 3 files changed, 90 insertions(+), 81 deletions(-) diff --git a/package.json b/package.json index 29aa2f82a7..632030879f 100644 --- a/package.json +++ b/package.json @@ -99,6 +99,7 @@ "src/components/images/imageLoader.js", "src/components/indicators/indicators.js", "src/components/lazyLoader/lazyLoaderIntersectionObserver.js", + "src/components/multiSelect/multiSelect.js", "src/components/playback/brightnessosd.js", "src/components/playback/mediasession.js", "src/components/playback/nowplayinghelper.js", diff --git a/src/components/multiSelect/multiSelect.js b/src/components/multiSelect/multiSelect.js index 83982413ae..5c8a378b43 100644 --- a/src/components/multiSelect/multiSelect.js +++ b/src/components/multiSelect/multiSelect.js @@ -1,13 +1,20 @@ -define(['browser', 'appStorage', 'apphost', 'loading', 'connectionManager', 'globalize', 'appRouter', 'dom', 'css!./multiSelect'], function (browser, appStorage, appHost, loading, connectionManager, globalize, appRouter, dom) { - 'use strict'; +import browser from 'browser'; +import appHost from 'apphost'; +import loading from 'loading'; +import connectionManager from 'connectionManager'; +import globalize from 'globalize'; +import dom from 'dom'; +import 'css!./multiSelect'; - var selectedItems = []; - var selectedElements = []; - var currentSelectionCommandsPanel; +/* eslint-disable indent */ + + let selectedItems = []; + let selectedElements = []; + let currentSelectionCommandsPanel; function hideSelections() { - var selectionCommandsPanel = currentSelectionCommandsPanel; + const selectionCommandsPanel = currentSelectionCommandsPanel; if (selectionCommandsPanel) { selectionCommandsPanel.parentNode.removeChild(selectionCommandsPanel); @@ -15,10 +22,10 @@ define(['browser', 'appStorage', 'apphost', 'loading', 'connectionManager', 'glo selectedItems = []; selectedElements = []; - var elems = document.querySelectorAll('.itemSelectionPanel'); - for (var i = 0, length = elems.length; i < length; i++) { + const elems = document.querySelectorAll('.itemSelectionPanel'); + for (let i = 0, length = elems.length; i < length; i++) { - var parent = elems[i].parentNode; + const parent = elems[i].parentNode; parent.removeChild(elems[i]); parent.classList.remove('withMultiSelect'); } @@ -29,14 +36,14 @@ define(['browser', 'appStorage', 'apphost', 'loading', 'connectionManager', 'glo // toggle the checkbox, if it wasn't clicked on if (!dom.parentWithClass(e.target, 'chkItemSelect')) { - var chkItemSelect = itemSelectionPanel.querySelector('.chkItemSelect'); + const chkItemSelect = itemSelectionPanel.querySelector('.chkItemSelect'); if (chkItemSelect) { if (chkItemSelect.classList.contains('checkedInitial')) { chkItemSelect.classList.remove('checkedInitial'); } else { - var newValue = !chkItemSelect.checked; + const newValue = !chkItemSelect.checked; chkItemSelect.checked = newValue; updateItemSelection(chkItemSelect, newValue); } @@ -50,11 +57,11 @@ define(['browser', 'appStorage', 'apphost', 'loading', 'connectionManager', 'glo function updateItemSelection(chkItemSelect, selected) { - var id = dom.parentWithAttribute(chkItemSelect, 'data-id').getAttribute('data-id'); + const id = dom.parentWithAttribute(chkItemSelect, 'data-id').getAttribute('data-id'); if (selected) { - var current = selectedItems.filter(function (i) { + const current = selectedItems.filter(i => { return i === id; }); @@ -64,16 +71,16 @@ define(['browser', 'appStorage', 'apphost', 'loading', 'connectionManager', 'glo } } else { - selectedItems = selectedItems.filter(function (i) { + selectedItems = selectedItems.filter(i => { return i !== id; }); - selectedElements = selectedElements.filter(function (i) { + selectedElements = selectedElements.filter(i => { return i !== chkItemSelect; }); } if (selectedItems.length) { - var itemSelectionCount = document.querySelector('.itemSelectionCount'); + const itemSelectionCount = document.querySelector('.itemSelectionCount'); if (itemSelectionCount) { itemSelectionCount.innerHTML = selectedItems.length; } @@ -88,33 +95,33 @@ define(['browser', 'appStorage', 'apphost', 'loading', 'connectionManager', 'glo function showSelection(item, isChecked) { - var itemSelectionPanel = item.querySelector('.itemSelectionPanel'); + let itemSelectionPanel = item.querySelector('.itemSelectionPanel'); if (!itemSelectionPanel) { itemSelectionPanel = document.createElement('div'); itemSelectionPanel.classList.add('itemSelectionPanel'); - var parent = item.querySelector('.cardBox') || item.querySelector('.cardContent'); + const parent = item.querySelector('.cardBox') || item.querySelector('.cardContent'); parent.classList.add('withMultiSelect'); parent.appendChild(itemSelectionPanel); - var cssClass = 'chkItemSelect'; + let cssClass = 'chkItemSelect'; if (isChecked && !browser.firefox) { // In firefox, the initial tap hold doesnt' get treated as a click // In other browsers it does, so we need to make sure that initial click is ignored cssClass += ' checkedInitial'; } - var checkedAttribute = isChecked ? ' checked' : ''; - itemSelectionPanel.innerHTML = ''; - var chkItemSelect = itemSelectionPanel.querySelector('.chkItemSelect'); + const checkedAttribute = isChecked ? ' checked' : ''; + itemSelectionPanel.innerHTML = ``; + const chkItemSelect = itemSelectionPanel.querySelector('.chkItemSelect'); chkItemSelect.addEventListener('change', onSelectionChange); } } function showSelectionCommands() { - var selectionCommandsPanel = currentSelectionCommandsPanel; + let selectionCommandsPanel = currentSelectionCommandsPanel; if (!selectionCommandsPanel) { @@ -124,19 +131,19 @@ define(['browser', 'appStorage', 'apphost', 'loading', 'connectionManager', 'glo document.body.appendChild(selectionCommandsPanel); currentSelectionCommandsPanel = selectionCommandsPanel; - var html = ''; + let html = ''; html += ''; html += '

'; const moreIcon = 'more_vert'; - html += ''; + html += ``; selectionCommandsPanel.innerHTML = html; selectionCommandsPanel.querySelector('.btnCloseSelectionPanel').addEventListener('click', hideSelections); - var btnSelectionPanelOptions = selectionCommandsPanel.querySelector('.btnSelectionPanelOptions'); + const btnSelectionPanelOptions = selectionCommandsPanel.querySelector('.btnSelectionPanelOptions'); dom.addEventListener(btnSelectionPanelOptions, 'click', showMenuForSelectedItems, { passive: true }); } @@ -144,9 +151,9 @@ define(['browser', 'appStorage', 'apphost', 'loading', 'connectionManager', 'glo function alertText(options) { - return new Promise(function (resolve, reject) { + return new Promise((resolve, reject) => { - require(['alert'], function (alert) { + import('alert').then(({default: alert}) => { alert(options).then(resolve, resolve); }); }); @@ -154,24 +161,24 @@ define(['browser', 'appStorage', 'apphost', 'loading', 'connectionManager', 'glo function deleteItems(apiClient, itemIds) { - return new Promise(function (resolve, reject) { + return new Promise((resolve, reject) => { - var msg = globalize.translate('ConfirmDeleteItem'); - var title = globalize.translate('HeaderDeleteItem'); + let msg = globalize.translate('ConfirmDeleteItem'); + let title = globalize.translate('HeaderDeleteItem'); if (itemIds.length > 1) { msg = globalize.translate('ConfirmDeleteItems'); title = globalize.translate('HeaderDeleteItems'); } - require(['confirm'], function (confirm) { + import('confirm').then(({default: confirm}) => { - confirm(msg, title).then(function () { - var promises = itemIds.map(function (itemId) { + confirm(msg, title).then(() => { + const promises = itemIds.map(itemId => { apiClient.deleteItem(itemId); }); - Promise.all(promises).then(resolve, function () { + Promise.all(promises).then(resolve, () => { alertText(globalize.translate('ErrorDeletingItem')).then(reject, reject); }); @@ -183,11 +190,11 @@ define(['browser', 'appStorage', 'apphost', 'loading', 'connectionManager', 'glo function showMenuForSelectedItems(e) { - var apiClient = connectionManager.currentApiClient(); + const apiClient = connectionManager.currentApiClient(); - apiClient.getCurrentUser().then(function (user) { + apiClient.getCurrentUser().then(user => { - var menuItems = []; + const menuItems = []; menuItems.push({ name: globalize.translate('AddToCollection'), @@ -244,17 +251,17 @@ define(['browser', 'appStorage', 'apphost', 'loading', 'connectionManager', 'glo icon: 'refresh' }); - require(['actionsheet'], function (actionsheet) { + import('actionsheet').then(({default: actionsheet}) => { actionsheet.show({ items: menuItems, positionTo: e.target, callback: function (id) { - var items = selectedItems.slice(0); - var serverId = apiClient.serverInfo().Id; + const items = selectedItems.slice(0); + const serverId = apiClient.serverInfo().Id; switch (id) { case 'addtocollection': - require(['collectionEditor'], function (collectionEditor) { + import('collectionEditor').then(({default: collectionEditor}) => { new collectionEditor().show({ items: items, serverId: serverId @@ -264,7 +271,7 @@ define(['browser', 'appStorage', 'apphost', 'loading', 'connectionManager', 'glo dispatchNeedsRefresh(); break; case 'playlist': - require(['playlistEditor'], function (playlistEditor) { + import('playlistEditor').then(({default: playlistEditor}) => { new playlistEditor().show({ items: items, serverId: serverId @@ -282,21 +289,21 @@ define(['browser', 'appStorage', 'apphost', 'loading', 'connectionManager', 'glo combineVersions(apiClient, items); break; case 'markplayed': - items.forEach(function (itemId) { + items.forEach(itemId => { apiClient.markPlayed(apiClient.getCurrentUserId(), itemId); }); hideSelections(); dispatchNeedsRefresh(); break; case 'markunplayed': - items.forEach(function (itemId) { + items.forEach(itemId => { apiClient.markUnplayed(apiClient.getCurrentUserId(), itemId); }); hideSelections(); dispatchNeedsRefresh(); break; case 'refresh': - require(['refreshDialog'], function (refreshDialog) { + import('refreshDialog').then(({default: refreshDialog}) => { new refreshDialog({ itemIds: items, serverId: serverId @@ -317,18 +324,18 @@ define(['browser', 'appStorage', 'apphost', 'loading', 'connectionManager', 'glo function dispatchNeedsRefresh() { - var elems = []; + const elems = []; - [].forEach.call(selectedElements, function (i) { + [].forEach.call(selectedElements, i => { - var container = dom.parentWithAttribute(i, 'is', 'emby-itemscontainer'); + const container = dom.parentWithAttribute(i, 'is', 'emby-itemscontainer'); - if (container && elems.indexOf(container) === -1) { + if (container && !elems.includes(container)) { elems.push(container); } }); - for (var i = 0, length = elems.length; i < length; i++) { + for (let i = 0, length = elems.length; i < length; i++) { elems[i].notifyRefreshNeeded(true); } } @@ -337,7 +344,7 @@ define(['browser', 'appStorage', 'apphost', 'loading', 'connectionManager', 'glo if (selection.length < 2) { - require(['alert'], function (alert) { + import('alert').then(({default: alert}) => { alert({ text: globalize.translate('PleaseSelectTwoItems') }); @@ -352,7 +359,7 @@ define(['browser', 'appStorage', 'apphost', 'loading', 'connectionManager', 'glo type: 'POST', url: apiClient.getUrl('Videos/MergeVersions', { Ids: selection.join(',') }) - }).then(function () { + }).then(() => { loading.hide(); hideSelections(); @@ -362,9 +369,9 @@ define(['browser', 'appStorage', 'apphost', 'loading', 'connectionManager', 'glo function showSelections(initialCard) { - require(['emby-checkbox'], function () { - var cards = document.querySelectorAll('.card'); - for (var i = 0, length = cards.length; i < length; i++) { + import('emby-checkbox').then(() => { + const cards = document.querySelectorAll('.card'); + for (let i = 0, length = cards.length; i < length; i++) { showSelection(cards[i], initialCard === cards[i]); } @@ -375,13 +382,13 @@ define(['browser', 'appStorage', 'apphost', 'loading', 'connectionManager', 'glo function onContainerClick(e) { - var target = e.target; + const target = e.target; if (selectedItems.length) { - var card = dom.parentWithClass(target, 'card'); + const card = dom.parentWithClass(target, 'card'); if (card) { - var itemSelectionPanel = card.querySelector('.itemSelectionPanel'); + const itemSelectionPanel = card.querySelector('.itemSelectionPanel'); if (itemSelectionPanel) { return onItemSelectionPanelClick(e, itemSelectionPanel); } @@ -395,15 +402,15 @@ define(['browser', 'appStorage', 'apphost', 'loading', 'connectionManager', 'glo document.addEventListener('viewbeforehide', hideSelections); - return function (options) { + export default function (options) { - var self = this; + const self = this; - var container = options.container; + const container = options.container; function onTapHold(e) { - var card = dom.parentWithClass(e.target, 'card'); + const card = dom.parentWithClass(e.target, 'card'); if (card) { @@ -423,13 +430,13 @@ define(['browser', 'appStorage', 'apphost', 'loading', 'connectionManager', 'glo return e.changedTouches || e.targetTouches || e.touches; } - var touchTarget; - var touchStartTimeout; - var touchStartX; - var touchStartY; + let touchTarget; + let touchStartTimeout; + let touchStartX; + let touchStartY; function onTouchStart(e) { - var touch = getTouches(e)[0]; + const touch = getTouches(e)[0]; touchTarget = null; touchStartX = 0; touchStartY = 0; @@ -437,10 +444,10 @@ define(['browser', 'appStorage', 'apphost', 'loading', 'connectionManager', 'glo if (touch) { touchStartX = touch.clientX; touchStartY = touch.clientY; - var element = touch.target; + const element = touch.target; if (element) { - var card = dom.parentWithClass(element, 'card'); + const card = dom.parentWithClass(element, 'card'); if (card) { @@ -459,13 +466,13 @@ define(['browser', 'appStorage', 'apphost', 'loading', 'connectionManager', 'glo function onTouchMove(e) { if (touchTarget) { - var touch = getTouches(e)[0]; - var deltaX; - var deltaY; + const touch = getTouches(e)[0]; + let deltaX; + let deltaY; if (touch) { - var touchEndX = touch.clientX || 0; - var touchEndY = touch.clientY || 0; + const touchEndX = touch.clientX || 0; + const touchEndY = touch.clientY || 0; deltaX = Math.abs(touchEndX - (touchStartX || 0)); deltaY = Math.abs(touchEndY - (touchStartY || 0)); } else { @@ -509,7 +516,7 @@ define(['browser', 'appStorage', 'apphost', 'loading', 'connectionManager', 'glo return; } - var card = dom.parentWithClass(touchTarget, 'card'); + const card = dom.parentWithClass(touchTarget, 'card'); touchTarget = null; if (card) { @@ -556,12 +563,12 @@ define(['browser', 'appStorage', 'apphost', 'loading', 'connectionManager', 'glo self.onContainerClick = onContainerClick; - self.destroy = function () { + self.destroy = () => { container.removeEventListener('click', onContainerClick); container.removeEventListener('contextmenu', onTapHold); - var element = container; + const element = container; dom.removeEventListener(element, 'touchstart', onTouchStart, { passive: true @@ -586,5 +593,6 @@ define(['browser', 'appStorage', 'apphost', 'loading', 'connectionManager', 'glo passive: true }); }; - }; -}); + } + +/* eslint-enable indent */ diff --git a/src/elements/emby-itemscontainer/emby-itemscontainer.js b/src/elements/emby-itemscontainer/emby-itemscontainer.js index 5d3772ca93..593e50794f 100644 --- a/src/elements/emby-itemscontainer/emby-itemscontainer.js +++ b/src/elements/emby-itemscontainer/emby-itemscontainer.js @@ -63,7 +63,7 @@ define(['itemShortcuts', 'inputManager', 'connectionManager', 'playbackManager', var self = this; require(['multiSelect'], function (MultiSelect) { - self.multiSelect = new MultiSelect({ + self.multiSelect = new MultiSelect.default({ container: self, bindOnClick: false }); From 1b581077f23892635cfe3c78d0d0891dd261b14e Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Thu, 18 Jun 2020 22:41:43 +0300 Subject: [PATCH 030/244] Migration confirm to ES6 modules --- package.json | 1 + src/components/confirm/confirm.js | 25 +++++++++++-------- src/components/imageeditor/imageeditor.js | 2 +- .../recordingcreator/recordinghelper.js | 4 +-- .../subtitleeditor/subtitleeditor.js | 2 +- src/controllers/dashboard/apikeys.js | 2 +- src/controllers/dashboard/dashboard.js | 4 +-- src/controllers/dashboard/devices/devices.js | 2 +- src/controllers/dashboard/dlna/profiles.js | 2 +- src/controllers/dashboard/mediaLibrary.js | 2 +- src/controllers/dashboard/plugins/add.js | 2 +- .../dashboard/plugins/installed.js | 2 +- .../dashboard/scheduledtasks/scheduledtask.js | 2 +- .../dashboard/users/userpasswordpage.js | 4 +-- .../dashboard/users/userprofilespage.js | 2 +- src/controllers/itemDetails.js | 2 +- src/controllers/livetvstatus.js | 4 +-- src/controllers/user/profile.js | 2 +- 18 files changed, 36 insertions(+), 30 deletions(-) diff --git a/package.json b/package.json index 632030879f..b3b5298499 100644 --- a/package.json +++ b/package.json @@ -96,6 +96,7 @@ "src/components/cardbuilder/cardBuilder.js", "src/components/cardbuilder/chaptercardbuilder.js", "src/components/cardbuilder/peoplecardbuilder.js", + "src/components/confirm/confirm.js", "src/components/images/imageLoader.js", "src/components/indicators/indicators.js", "src/components/lazyLoader/lazyLoaderIntersectionObserver.js", diff --git a/src/components/confirm/confirm.js b/src/components/confirm/confirm.js index 517d6fa9be..2d5cfdb55c 100644 --- a/src/components/confirm/confirm.js +++ b/src/components/confirm/confirm.js @@ -1,5 +1,9 @@ -define(['browser', 'dialog', 'globalize'], function(browser, dialog, globalize) { - 'use strict'; +import browser from 'browser'; +import dialog from 'dialog'; +import globalize from 'globalize'; + +/* eslint-disable indent */ +export default (() => { function replaceAll(str, find, replace) { return str.split(find).join(replace); @@ -7,7 +11,7 @@ define(['browser', 'dialog', 'globalize'], function(browser, dialog, globalize) if (browser.tv && window.confirm) { // Use the native confirm dialog - return function (options) { + return options => { if (typeof options === 'string') { options = { title: '', @@ -15,8 +19,8 @@ define(['browser', 'dialog', 'globalize'], function(browser, dialog, globalize) }; } - var text = replaceAll(options.text || '', '
', '\n'); - var result = confirm(text); + const text = replaceAll(options.text || '', '
', '\n'); + const result = confirm(text); if (result) { return Promise.resolve(); @@ -26,8 +30,8 @@ define(['browser', 'dialog', 'globalize'], function(browser, dialog, globalize) }; } else { // Use our own dialog - return function (text, title) { - var options; + return (text, title) => { + let options; if (typeof text === 'string') { options = { title: title, @@ -37,7 +41,7 @@ define(['browser', 'dialog', 'globalize'], function(browser, dialog, globalize) options = text; } - var items = []; + const items = []; items.push({ name: options.cancelText || globalize.translate('ButtonCancel'), @@ -53,7 +57,7 @@ define(['browser', 'dialog', 'globalize'], function(browser, dialog, globalize) options.buttons = items; - return dialog(options).then(function (result) { + return dialog.show(options).then(result => { if (result === 'ok') { return Promise.resolve(); } @@ -62,4 +66,5 @@ define(['browser', 'dialog', 'globalize'], function(browser, dialog, globalize) }); }; } -}); +})(); +/* eslint-enable indent */ diff --git a/src/components/imageeditor/imageeditor.js b/src/components/imageeditor/imageeditor.js index 2927a0b120..93495eec0d 100644 --- a/src/components/imageeditor/imageeditor.js +++ b/src/components/imageeditor/imageeditor.js @@ -200,7 +200,7 @@ define(['dialogHelper', 'connectionManager', 'loading', 'dom', 'layoutManager', require(['confirm'], function (confirm) { - confirm({ + confirm.default({ text: globalize.translate('ConfirmDeleteImage'), confirmText: globalize.translate('Delete'), diff --git a/src/components/recordingcreator/recordinghelper.js b/src/components/recordingcreator/recordinghelper.js index a071cb2032..c773368f2d 100644 --- a/src/components/recordingcreator/recordinghelper.js +++ b/src/components/recordingcreator/recordinghelper.js @@ -34,7 +34,7 @@ define(['globalize', 'loading', 'connectionManager'], function (globalize, loadi require(['confirm'], function (confirm) { - confirm({ + confirm.default({ text: globalize.translate('MessageConfirmRecordingCancellation'), primary: 'delete', @@ -59,7 +59,7 @@ define(['globalize', 'loading', 'connectionManager'], function (globalize, loadi require(['confirm'], function (confirm) { - confirm({ + confirm.default({ text: globalize.translate('MessageConfirmRecordingCancellation'), primary: 'delete', diff --git a/src/components/subtitleeditor/subtitleeditor.js b/src/components/subtitleeditor/subtitleeditor.js index e9bcc0bfca..b356c4f079 100644 --- a/src/components/subtitleeditor/subtitleeditor.js +++ b/src/components/subtitleeditor/subtitleeditor.js @@ -69,7 +69,7 @@ define(['dialogHelper', 'require', 'layoutManager', 'globalize', 'userSettings', require(['confirm'], function (confirm) { - confirm({ + confirm.default({ title: globalize.translate('ConfirmDeletion'), text: msg, diff --git a/src/controllers/dashboard/apikeys.js b/src/controllers/dashboard/apikeys.js index f43bfd0329..dc17d43c5a 100644 --- a/src/controllers/dashboard/apikeys.js +++ b/src/controllers/dashboard/apikeys.js @@ -3,7 +3,7 @@ define(['datetime', 'loading', 'libraryMenu', 'dom', 'globalize', 'emby-button'] function revoke(page, key) { require(['confirm'], function (confirm) { - confirm(globalize.translate('MessageConfirmRevokeApiKey'), globalize.translate('HeaderConfirmRevokeApiKey')).then(function () { + confirm.default(globalize.translate('MessageConfirmRevokeApiKey'), globalize.translate('HeaderConfirmRevokeApiKey')).then(function () { loading.show(); ApiClient.ajax({ type: 'DELETE', diff --git a/src/controllers/dashboard/dashboard.js b/src/controllers/dashboard/dashboard.js index 1bae9a0b34..dcd56921ea 100644 --- a/src/controllers/dashboard/dashboard.js +++ b/src/controllers/dashboard/dashboard.js @@ -708,7 +708,7 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa }, restart: function (btn) { require(['confirm'], function (confirm) { - confirm({ + confirm.default({ title: globalize.translate('HeaderRestart'), text: globalize.translate('MessageConfirmRestart'), confirmText: globalize.translate('ButtonRestart'), @@ -723,7 +723,7 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa }, shutdown: function (btn) { require(['confirm'], function (confirm) { - confirm({ + confirm.default({ title: globalize.translate('HeaderShutdown'), text: globalize.translate('MessageConfirmShutdown'), confirmText: globalize.translate('ButtonShutdown'), diff --git a/src/controllers/dashboard/devices/devices.js b/src/controllers/dashboard/devices/devices.js index 0dea81c756..d20132db8b 100644 --- a/src/controllers/dashboard/devices/devices.js +++ b/src/controllers/dashboard/devices/devices.js @@ -9,7 +9,7 @@ define(['loading', 'dom', 'libraryMenu', 'globalize', 'scripts/imagehelper', 'da var msg = globalize.translate('DeleteDeviceConfirmation'); require(['confirm'], function (confirm) { - confirm({ + confirm.default({ text: msg, title: globalize.translate('HeaderDeleteDevice'), confirmText: globalize.translate('ButtonDelete'), diff --git a/src/controllers/dashboard/dlna/profiles.js b/src/controllers/dashboard/dlna/profiles.js index fb4caadeb9..a6eccd2339 100644 --- a/src/controllers/dashboard/dlna/profiles.js +++ b/src/controllers/dashboard/dlna/profiles.js @@ -59,7 +59,7 @@ define(['jQuery', 'globalize', 'loading', 'libraryMenu', 'listViewStyle', 'emby- function deleteProfile(page, id) { require(['confirm'], function (confirm) { - confirm(globalize.translate('MessageConfirmProfileDeletion'), globalize.translate('HeaderConfirmProfileDeletion')).then(function () { + confirm.default(globalize.translate('MessageConfirmProfileDeletion'), globalize.translate('HeaderConfirmProfileDeletion')).then(function () { loading.show(); ApiClient.ajax({ type: 'DELETE', diff --git a/src/controllers/dashboard/mediaLibrary.js b/src/controllers/dashboard/mediaLibrary.js index 06eba37cbd..2d0d45438d 100644 --- a/src/controllers/dashboard/mediaLibrary.js +++ b/src/controllers/dashboard/mediaLibrary.js @@ -38,7 +38,7 @@ define(['jQuery', 'apphost', 'scripts/taskbutton', 'loading', 'libraryMenu', 'gl } require(['confirm'], function (confirm) { - confirm({ + confirm.default({ text: msg, title: globalize.translate('HeaderRemoveMediaFolder'), diff --git a/src/controllers/dashboard/plugins/add.js b/src/controllers/dashboard/plugins/add.js index 8b1deb804d..375a0c0ec7 100644 --- a/src/controllers/dashboard/plugins/add.js +++ b/src/controllers/dashboard/plugins/add.js @@ -91,7 +91,7 @@ define(['jQuery', 'loading', 'libraryMenu', 'globalize', 'connectionManager', 'e msg += globalize.translate('PleaseConfirmPluginInstallation'); require(['confirm'], function (confirm) { - confirm(msg, globalize.translate('HeaderConfirmPluginInstallation')).then(function () { + confirm.default(msg, globalize.translate('HeaderConfirmPluginInstallation')).then(function () { alertCallback(); }, function () { console.debug('plugin not installed'); diff --git a/src/controllers/dashboard/plugins/installed.js b/src/controllers/dashboard/plugins/installed.js index 87e9428cc6..7a8110f8b5 100644 --- a/src/controllers/dashboard/plugins/installed.js +++ b/src/controllers/dashboard/plugins/installed.js @@ -5,7 +5,7 @@ define(['loading', 'libraryMenu', 'dom', 'globalize', 'cardStyle', 'emby-button' var msg = globalize.translate('UninstallPluginConfirmation', name); require(['confirm'], function (confirm) { - confirm({ + confirm.default({ title: globalize.translate('UninstallPluginHeader'), text: msg, primary: 'delete', diff --git a/src/controllers/dashboard/scheduledtasks/scheduledtask.js b/src/controllers/dashboard/scheduledtasks/scheduledtask.js index 52050d1f80..b632d176f4 100644 --- a/src/controllers/dashboard/scheduledtasks/scheduledtask.js +++ b/src/controllers/dashboard/scheduledtasks/scheduledtask.js @@ -130,7 +130,7 @@ define(['jQuery', 'loading', 'datetime', 'dom', 'globalize', 'emby-input', 'emby }, confirmDeleteTrigger: function (view, index) { require(['confirm'], function (confirm) { - confirm(globalize.translate('MessageDeleteTaskTrigger'), globalize.translate('HeaderDeleteTaskTrigger')).then(function () { + confirm.default(globalize.translate('MessageDeleteTaskTrigger'), globalize.translate('HeaderDeleteTaskTrigger')).then(function () { ScheduledTaskPage.deleteTrigger(view, index); }); }); diff --git a/src/controllers/dashboard/users/userpasswordpage.js b/src/controllers/dashboard/users/userpasswordpage.js index 186e39b151..9061c00c7f 100644 --- a/src/controllers/dashboard/users/userpasswordpage.js +++ b/src/controllers/dashboard/users/userpasswordpage.js @@ -142,7 +142,7 @@ define(['loading', 'libraryMenu', 'globalize', 'emby-button'], function (loading var msg = globalize.translate('PasswordResetConfirmation'); require(['confirm'], function (confirm) { - confirm(msg, globalize.translate('PasswordResetHeader')).then(function () { + confirm.default(msg, globalize.translate('PasswordResetHeader')).then(function () { var userId = params.userId; loading.show(); ApiClient.resetUserPassword(userId).then(function () { @@ -161,7 +161,7 @@ define(['loading', 'libraryMenu', 'globalize', 'emby-button'], function (loading var msg = globalize.translate('PinCodeResetConfirmation'); require(['confirm'], function (confirm) { - confirm(msg, globalize.translate('HeaderPinCodeReset')).then(function () { + confirm.default(msg, globalize.translate('HeaderPinCodeReset')).then(function () { var userId = params.userId; loading.show(); ApiClient.resetEasyPassword(userId).then(function () { diff --git a/src/controllers/dashboard/users/userprofilespage.js b/src/controllers/dashboard/users/userprofilespage.js index c691c665f6..f04c7ad082 100644 --- a/src/controllers/dashboard/users/userprofilespage.js +++ b/src/controllers/dashboard/users/userprofilespage.js @@ -5,7 +5,7 @@ define(['loading', 'dom', 'globalize', 'date-fns', 'dfnshelper', 'paper-icon-but var msg = globalize.translate('DeleteUserConfirmation'); require(['confirm'], function (confirm) { - confirm({ + confirm.default({ title: globalize.translate('DeleteUser'), text: msg, confirmText: globalize.translate('ButtonDelete'), diff --git a/src/controllers/itemDetails.js b/src/controllers/itemDetails.js index 67aa5f9407..aa131999a4 100644 --- a/src/controllers/itemDetails.js +++ b/src/controllers/itemDetails.js @@ -1936,7 +1936,7 @@ define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSetti function splitVersions(instance, page, apiClient, params) { require(['confirm'], function (confirm) { - confirm('Are you sure you wish to split the media sources into separate items?', 'Split Media Apart').then(function () { + confirm.default('Are you sure you wish to split the media sources into separate items?', 'Split Media Apart').then(function () { loading.show(); apiClient.ajax({ type: 'DELETE', diff --git a/src/controllers/livetvstatus.js b/src/controllers/livetvstatus.js index 82d0b697db..b070098b9e 100644 --- a/src/controllers/livetvstatus.js +++ b/src/controllers/livetvstatus.js @@ -49,7 +49,7 @@ define(['jQuery', 'globalize', 'scripts/taskbutton', 'dom', 'libraryMenu', 'layo var message = globalize.translate('MessageConfirmDeleteTunerDevice'); require(['confirm'], function (confirm) { - confirm(message, globalize.translate('HeaderDeleteDevice')).then(function () { + confirm.default(message, globalize.translate('HeaderDeleteDevice')).then(function () { loading.show(); ApiClient.ajax({ type: 'DELETE', @@ -167,7 +167,7 @@ define(['jQuery', 'globalize', 'scripts/taskbutton', 'dom', 'libraryMenu', 'layo var message = globalize.translate('MessageConfirmDeleteGuideProvider'); require(['confirm'], function (confirm) { - confirm(message, globalize.translate('HeaderDeleteProvider')).then(function () { + confirm.default(message, globalize.translate('HeaderDeleteProvider')).then(function () { loading.show(); ApiClient.ajax({ type: 'DELETE', diff --git a/src/controllers/user/profile.js b/src/controllers/user/profile.js index fd7d1e32cc..8e2977180c 100644 --- a/src/controllers/user/profile.js +++ b/src/controllers/user/profile.js @@ -86,7 +86,7 @@ define(['controllers/dashboard/users/userpasswordpage', 'loading', 'libraryMenu' new UserPasswordPage(view, params); view.querySelector('#btnDeleteImage').addEventListener('click', function () { require(['confirm'], function (confirm) { - confirm(globalize.translate('DeleteImageConfirmation'), globalize.translate('DeleteImage')).then(function () { + confirm.default(globalize.translate('DeleteImageConfirmation'), globalize.translate('DeleteImage')).then(function () { loading.show(); var userId = getParameterByName('userId'); ApiClient.deleteUserImage(userId, 'primary').then(function () { From 30cd42ae7cdd084ab73e87ee3d7dbbf3b46994ff Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Thu, 18 Jun 2020 22:43:30 +0300 Subject: [PATCH 031/244] Migration prompt to ES6 modules --- package.json | 1 + .../metadataEditor/metadataEditor.js | 2 +- src/components/prompt/prompt.js | 49 ++++++++++++------- src/controllers/dashboard/apikeys.js | 2 +- src/controllers/dashboard/dashboard.js | 2 +- src/controllers/dashboard/mediaLibrary.js | 2 +- .../dashboard/users/userparentalcontrol.js | 2 +- 7 files changed, 37 insertions(+), 23 deletions(-) diff --git a/package.json b/package.json index b3b5298499..a88fa394b2 100644 --- a/package.json +++ b/package.json @@ -110,6 +110,7 @@ "src/components/playback/playmethodhelper.js", "src/components/playback/remotecontrolautoplay.js", "src/components/playback/volumeosd.js", + "src/components/prompt/prompt.js", "src/components/playmenu.js", "src/components/sanatizefilename.js", "src/components/scrollManager.js", diff --git a/src/components/metadataEditor/metadataEditor.js b/src/components/metadataEditor/metadataEditor.js index 52f030cd23..2f7bfc951e 100644 --- a/src/components/metadataEditor/metadataEditor.js +++ b/src/components/metadataEditor/metadataEditor.js @@ -212,7 +212,7 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi function addElementToList(source, sortCallback) { require(['prompt'], function (prompt) { - prompt({ + prompt.default({ label: 'Value:' }).then(function (text) { var list = dom.parentWithClass(source, 'editableListviewContainer').querySelector('.paperList'); diff --git a/src/components/prompt/prompt.js b/src/components/prompt/prompt.js index a76083cf04..f3bf72f8f2 100644 --- a/src/components/prompt/prompt.js +++ b/src/components/prompt/prompt.js @@ -1,12 +1,24 @@ -define(['browser', 'dialogHelper', 'layoutManager', 'scrollHelper', 'globalize', 'dom', 'require', 'material-icons', 'emby-button', 'paper-icon-button-light', 'emby-input', 'formDialogStyle'], function(browser, dialogHelper, layoutManager, scrollHelper, globalize, dom, require) { - 'use strict'; +import browser from 'browser'; +import dialogHelper from 'dialogHelper'; +import layoutManager from 'layoutManager'; +import scrollHelper from 'scrollHelper'; +import globalize from 'globalize'; +import dom from 'dom'; +import 'material-icons'; +import 'emby-button'; +import 'paper-icon-button-light'; +import 'emby-input'; +import 'formDialogStyle'; + +/* eslint-disable indent */ +export default (() => { function replaceAll(str, find, replace) { return str.split(find).join(replace); } function setInputProperties(dlg, options) { - var txtInput = dlg.querySelector('#txtInput'); + const txtInput = dlg.querySelector('#txtInput'); if (txtInput.label) { txtInput.label(options.label || ''); @@ -17,7 +29,7 @@ define(['browser', 'dialogHelper', 'layoutManager', 'scrollHelper', 'globalize', } function showDialog(options, template) { - var dialogOptions = { + const dialogOptions = { removeOnClose: true, scrollY: false }; @@ -26,7 +38,7 @@ define(['browser', 'dialogHelper', 'layoutManager', 'scrollHelper', 'globalize', dialogOptions.size = 'fullscreen'; } - var dlg = dialogHelper.createDialog(dialogOptions); + const dlg = dialogHelper.createDialog(dialogOptions); dlg.classList.add('formDialog'); @@ -39,7 +51,7 @@ define(['browser', 'dialogHelper', 'layoutManager', 'scrollHelper', 'globalize', dlg.classList.add('dialog-fullscreen-lowres'); } - dlg.querySelector('.btnCancel').addEventListener('click', function (e) { + dlg.querySelector('.btnCancel').addEventListener('click', () => { dialogHelper.close(dlg); }); @@ -53,16 +65,16 @@ define(['browser', 'dialogHelper', 'layoutManager', 'scrollHelper', 'globalize', setInputProperties(dlg, options); - var submitValue; + let submitValue; - dlg.querySelector('form').addEventListener('submit', function (e) { + dlg.querySelector('form').addEventListener('submit', e => { submitValue = dlg.querySelector('#txtInput').value; e.preventDefault(); e.stopPropagation(); // Important, don't close the dialog until after the form has completed submitting, or it will cause an error in Chrome - setTimeout(function () { + setTimeout(() => { dialogHelper.close(dlg); }, 300); @@ -71,9 +83,9 @@ define(['browser', 'dialogHelper', 'layoutManager', 'scrollHelper', 'globalize', dlg.querySelector('.submitText').innerHTML = options.confirmText || globalize.translate('ButtonOk'); - dlg.style.minWidth = (Math.min(400, dom.getWindowSize().innerWidth - 50)) + 'px'; + dlg.style.minWidth = `${Math.min(400, dom.getWindowSize().innerWidth - 50)}px`; - return dialogHelper.open(dlg).then(function () { + return dialogHelper.open(dlg).then(() => { if (layoutManager.tv) { scrollHelper.centerFocus.off(dlg.querySelector('.formDialogContent'), false); } @@ -87,7 +99,7 @@ define(['browser', 'dialogHelper', 'layoutManager', 'scrollHelper', 'globalize', } if ((browser.tv || browser.xboxOne) && window.confirm) { - return function (options) { + return options => { if (typeof options === 'string') { options = { label: '', @@ -95,8 +107,8 @@ define(['browser', 'dialogHelper', 'layoutManager', 'scrollHelper', 'globalize', }; } - var label = replaceAll(options.label || '', '
', '\n'); - var result = prompt(label, options.text || ''); + const label = replaceAll(options.label || '', '
', '\n'); + const result = prompt(label, options.text || ''); if (result) { return Promise.resolve(result); @@ -105,9 +117,9 @@ define(['browser', 'dialogHelper', 'layoutManager', 'scrollHelper', 'globalize', } }; } else { - return function (options) { - return new Promise(function (resolve, reject) { - require(['text!./prompt.template.html'], function (template) { + return options => { + return new Promise((resolve, reject) => { + import('text!./prompt.template.html').then(({default: template}) => { if (typeof options === 'string') { options = { title: '', @@ -119,4 +131,5 @@ define(['browser', 'dialogHelper', 'layoutManager', 'scrollHelper', 'globalize', }); }; } -}); +})(); +/* eslint-enable indent */ diff --git a/src/controllers/dashboard/apikeys.js b/src/controllers/dashboard/apikeys.js index dc17d43c5a..d3e824ed50 100644 --- a/src/controllers/dashboard/apikeys.js +++ b/src/controllers/dashboard/apikeys.js @@ -47,7 +47,7 @@ define(['datetime', 'loading', 'libraryMenu', 'dom', 'globalize', 'emby-button'] function showNewKeyPrompt(page) { require(['prompt'], function (prompt) { - prompt({ + prompt.default({ title: globalize.translate('HeaderNewApiKey'), label: globalize.translate('LabelAppName'), description: globalize.translate('LabelAppNameExample') diff --git a/src/controllers/dashboard/dashboard.js b/src/controllers/dashboard/dashboard.js index dcd56921ea..116c8574fe 100644 --- a/src/controllers/dashboard/dashboard.js +++ b/src/controllers/dashboard/dashboard.js @@ -34,7 +34,7 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa function showSendMessageForm(btn, session) { require(['prompt'], function (prompt) { - prompt({ + prompt.default({ title: globalize.translate('HeaderSendMessage'), label: globalize.translate('LabelMessageText'), confirmText: globalize.translate('ButtonSend') diff --git a/src/controllers/dashboard/mediaLibrary.js b/src/controllers/dashboard/mediaLibrary.js index 2d0d45438d..bfa4ab1b30 100644 --- a/src/controllers/dashboard/mediaLibrary.js +++ b/src/controllers/dashboard/mediaLibrary.js @@ -66,7 +66,7 @@ define(['jQuery', 'apphost', 'scripts/taskbutton', 'loading', 'libraryMenu', 'gl function renameVirtualFolder(page, virtualFolder) { require(['prompt'], function (prompt) { - prompt({ + prompt.default({ label: globalize.translate('LabelNewName'), confirmText: globalize.translate('ButtonRename') }).then(function (newName) { diff --git a/src/controllers/dashboard/users/userparentalcontrol.js b/src/controllers/dashboard/users/userparentalcontrol.js index e8255512d6..f5d4e70afd 100644 --- a/src/controllers/dashboard/users/userparentalcontrol.js +++ b/src/controllers/dashboard/users/userparentalcontrol.js @@ -225,7 +225,7 @@ define(['jQuery', 'datetime', 'loading', 'libraryMenu', 'globalize', 'listViewSt function showBlockedTagPopup(page) { require(['prompt'], function (prompt) { - prompt({ + prompt.default({ label: globalize.translate('LabelTag') }).then(function (value) { var tags = getBlockedTagsFromPage(page); From 4e6792309d953cca4938abbcad092adfc26fd93d Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Thu, 18 Jun 2020 22:45:35 +0300 Subject: [PATCH 032/244] Fix context Event Listener (cherry picked from commit 27d1c21089a0996c9e53c49f2b10e98636467a5f) --- src/components/metadataEditor/metadataEditor.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/metadataEditor/metadataEditor.js b/src/components/metadataEditor/metadataEditor.js index 2f7bfc951e..eb387828fc 100644 --- a/src/components/metadataEditor/metadataEditor.js +++ b/src/components/metadataEditor/metadataEditor.js @@ -308,8 +308,8 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi } }); - context.removeEventListener('submit', onEditorClick); - context.addEventListener('submit', onEditorClick); + context.removeEventListener('click', onEditorClick); + context.addEventListener('click', onEditorClick); var form = context.querySelector('form'); form.removeEventListener('submit', onSubmit); From 58205e11bbecc1a0d1b5cd06faaf98584c09f9ce Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Fri, 19 Jun 2020 18:56:12 +0300 Subject: [PATCH 033/244] Migration directorybrowser to ES6 modules --- package.json | 1 + .../directorybrowser/directorybrowser.js | 214 +++++++++--------- src/components/tvproviders/xmltv.js | 2 +- src/controllers/dashboard/encodingsettings.js | 4 +- src/controllers/dashboard/general.js | 4 +- src/controllers/dashboard/networking.js | 2 +- src/controllers/livetvsettings.js | 8 +- src/controllers/livetvtuner.js | 2 +- 8 files changed, 125 insertions(+), 112 deletions(-) diff --git a/package.json b/package.json index 29aa2f82a7..675e7a6b35 100644 --- a/package.json +++ b/package.json @@ -96,6 +96,7 @@ "src/components/cardbuilder/cardBuilder.js", "src/components/cardbuilder/chaptercardbuilder.js", "src/components/cardbuilder/peoplecardbuilder.js", + "src/components/directorybrowser/directorybrowser.js", "src/components/images/imageLoader.js", "src/components/indicators/indicators.js", "src/components/lazyLoader/lazyLoaderIntersectionObserver.js", diff --git a/src/components/directorybrowser/directorybrowser.js b/src/components/directorybrowser/directorybrowser.js index e08fcc8336..fbe99154f5 100644 --- a/src/components/directorybrowser/directorybrowser.js +++ b/src/components/directorybrowser/directorybrowser.js @@ -1,9 +1,19 @@ -define(['loading', 'dialogHelper', 'dom', 'globalize', 'listViewStyle', 'emby-input', 'paper-icon-button-light', 'css!./directorybrowser', 'formDialogStyle', 'emby-button'], function(loading, dialogHelper, dom, globalize) { - 'use strict'; +import loading from 'loading'; +import dialogHelper from 'dialogHelper'; +import dom from 'dom'; +import globalize from 'globalize'; +import 'listViewStyle'; +import 'emby-input'; +import 'paper-icon-button-light'; +import 'css!./directorybrowser'; +import 'formDialogStyle'; +import 'emby-button'; + +/* eslint-disable indent */ function getSystemInfo() { return systemInfo ? Promise.resolve(systemInfo) : ApiClient.getPublicSystemInfo().then( - function(info) { + info => { systemInfo = info; return info; } @@ -21,9 +31,9 @@ define(['loading', 'dialogHelper', 'dom', 'globalize', 'listViewStyle', 'emby-in loading.show(); - var promises = []; + const promises = []; - if ('Network' === path) { + if (path === 'Network') { promises.push(ApiClient.getNetworkDevices()); } else { if (path) { @@ -35,10 +45,10 @@ define(['loading', 'dialogHelper', 'dom', 'globalize', 'listViewStyle', 'emby-in } Promise.all(promises).then( - function(responses) { - var folders = responses[0]; - var parentPath = responses[1] || ''; - var html = ''; + responses => { + const folders = responses[0]; + const parentPath = responses[1] || ''; + let html = ''; page.querySelector('.results').scrollTop = 0; page.querySelector('#txtDirectoryPickerPath').value = path || ''; @@ -46,9 +56,9 @@ define(['loading', 'dialogHelper', 'dom', 'globalize', 'listViewStyle', 'emby-in if (path) { html += getItem('lnkPath lnkDirectory', '', parentPath, '...'); } - for (var i = 0, length = folders.length; i < length; i++) { - var folder = folders[i]; - var cssClass = 'File' === folder.Type ? 'lnkPath lnkFile' : 'lnkPath lnkDirectory'; + for (let i = 0, length = folders.length; i < length; i++) { + const folder = folders[i]; + const cssClass = folder.Type === 'File' ? 'lnkPath lnkFile' : 'lnkPath lnkDirectory'; html += getItem(cssClass, folder.Type, folder.Path, folder.Name); } @@ -58,7 +68,7 @@ define(['loading', 'dialogHelper', 'dom', 'globalize', 'listViewStyle', 'emby-in page.querySelector('.results').innerHTML = html; loading.hide(); - }, function() { + }, () => { if (updatePathOnError) { page.querySelector('#txtDirectoryPickerPath').value = ''; page.querySelector('.results').innerHTML = ''; @@ -69,8 +79,8 @@ define(['loading', 'dialogHelper', 'dom', 'globalize', 'listViewStyle', 'emby-in } function getItem(cssClass, type, path, name) { - var html = ''; - html += '
'; + let html = ''; + html += `
`; html += '
'; html += '
'; html += name; @@ -82,19 +92,19 @@ define(['loading', 'dialogHelper', 'dom', 'globalize', 'listViewStyle', 'emby-in } function getEditorHtml(options, systemInfo) { - var html = ''; + let html = ''; html += '
'; html += '
'; if (!options.pathReadOnly) { - var instruction = options.instruction ? options.instruction + '

' : ''; + const instruction = options.instruction ? `${options.instruction}

` : ''; html += '
'; html += instruction; - if ('bsd' === systemInfo.OperatingSystem.toLowerCase()) { + if (systemInfo.OperatingSystem.toLowerCase() === 'bsd') { html += '
'; html += '
'; html += globalize.translate('MessageDirectoryPickerBSDInstruction'); html += '
'; - } else if ('linux' === systemInfo.OperatingSystem.toLowerCase()) { + } else if (systemInfo.OperatingSystem.toLowerCase() === 'linux') { html += '
'; html += '
'; html += globalize.translate('MessageDirectoryPickerLinuxInstruction'); @@ -105,17 +115,17 @@ define(['loading', 'dialogHelper', 'dom', 'globalize', 'listViewStyle', 'emby-in html += ''; html += '
'; html += '
'; - var labelKey; + let labelKey; if (options.includeFiles !== true) { labelKey = 'LabelFolder'; } else { labelKey = 'LabelPath'; } - var readOnlyAttribute = options.pathReadOnly ? ' readonly' : ''; - html += ''; + const readOnlyAttribute = options.pathReadOnly ? ' readonly' : ''; + html += ``; html += '
'; if (!readOnlyAttribute) { - html += ''; + html += ``; } html += '
'; if (!readOnlyAttribute) { @@ -123,14 +133,14 @@ define(['loading', 'dialogHelper', 'dom', 'globalize', 'listViewStyle', 'emby-in } if (options.enableNetworkSharePath) { html += '
'; - html += ''; + html += ``; html += '
'; html += globalize.translate('LabelOptionalNetworkPathHelp', '\\\\server', '\\\\192.168.1.101'); html += '
'; html += '
'; } html += '
'; - html += ''; + html += ``; html += '
'; html += ''; html += '
'; @@ -147,7 +157,7 @@ define(['loading', 'dialogHelper', 'dom', 'globalize', 'listViewStyle', 'emby-in } function alertTextWithOptions(options) { - require(['alert'], function(alert) { + require(['alert'], alert => { alert(options); }); } @@ -160,7 +170,7 @@ define(['loading', 'dialogHelper', 'dom', 'globalize', 'listViewStyle', 'emby-in ValidateWriteable: validateWriteable, Path: path } - }).catch(function(response) { + }).catch(response => { if (response) { if (response.status === 404) { alertText(globalize.translate('PathNotFound')); @@ -180,10 +190,10 @@ define(['loading', 'dialogHelper', 'dom', 'globalize', 'listViewStyle', 'emby-in } function initEditor(content, options, fileOptions) { - content.addEventListener('click', function(e) { - var lnkPath = dom.parentWithClass(e.target, 'lnkPath'); + content.addEventListener('click', e => { + const lnkPath = dom.parentWithClass(e.target, 'lnkPath'); if (lnkPath) { - var path = lnkPath.getAttribute('data-path'); + const path = lnkPath.getAttribute('data-path'); if (lnkPath.classList.contains('lnkFile')) { content.querySelector('#txtDirectoryPickerPath').value = path; } else { @@ -192,25 +202,25 @@ define(['loading', 'dialogHelper', 'dom', 'globalize', 'listViewStyle', 'emby-in } }); - content.addEventListener('click', function(e) { + content.addEventListener('click', e => { if (dom.parentWithClass(e.target, 'btnRefreshDirectories')) { - var path = content.querySelector('#txtDirectoryPickerPath').value; + const path = content.querySelector('#txtDirectoryPickerPath').value; refreshDirectoryBrowser(content, path, fileOptions); } }); - content.addEventListener('change', function(e) { - var txtDirectoryPickerPath = dom.parentWithTag(e.target, 'INPUT'); - if (txtDirectoryPickerPath && 'txtDirectoryPickerPath' === txtDirectoryPickerPath.id) { + content.addEventListener('change', e => { + const txtDirectoryPickerPath = dom.parentWithTag(e.target, 'INPUT'); + if (txtDirectoryPickerPath && txtDirectoryPickerPath.id === 'txtDirectoryPickerPath') { refreshDirectoryBrowser(content, txtDirectoryPickerPath.value, fileOptions); } }); content.querySelector('form').addEventListener('submit', function(e) { if (options.callback) { - var networkSharePath = this.querySelector('#txtNetworkPath'); + let networkSharePath = this.querySelector('#txtNetworkPath'); networkSharePath = networkSharePath ? networkSharePath.value : null; - var path = this.querySelector('#txtDirectoryPickerPath').value; + const path = this.querySelector('#txtDirectoryPickerPath').value; validatePath(path, options.validateWriteable, ApiClient).then(options.callback(path, networkSharePath)); } e.preventDefault(); @@ -224,77 +234,79 @@ define(['loading', 'dialogHelper', 'dom', 'globalize', 'listViewStyle', 'emby-in return Promise.resolve(options.path); } else { return ApiClient.getJSON(ApiClient.getUrl('Environment/DefaultDirectoryBrowser')).then( - function(result) { + result => { return result.Path || ''; - }, function() { + }, () => { return ''; } ); } } - function directoryBrowser() { - var currentDialog; - var self = this; - self.show = function(options) { - options = options || {}; - var fileOptions = { - includeDirectories: true - }; - if (options.includeDirectories != null) { - fileOptions.includeDirectories = options.includeDirectories; - } - if (options.includeFiles != null) { - fileOptions.includeFiles = options.includeFiles; - } - Promise.all([getSystemInfo(), getDefaultPath(options)]).then( - function(responses) { - var systemInfo = responses[0]; - var initialPath = responses[1]; - var dlg = dialogHelper.createDialog({ - size: 'small', - removeOnClose: true, - scrollY: false - }); - dlg.classList.add('ui-body-a'); - dlg.classList.add('background-theme-a'); - dlg.classList.add('directoryPicker'); - dlg.classList.add('formDialog'); - - var html = ''; - html += '
'; - html += ''; - html += '

'; - html += options.header || globalize.translate('HeaderSelectPath'); - html += '

'; - html += '
'; - html += getEditorHtml(options, systemInfo); - dlg.innerHTML = html; - initEditor(dlg, options, fileOptions); - dlg.addEventListener('close', onDialogClosed); - dialogHelper.open(dlg); - dlg.querySelector('.btnCloseDialog').addEventListener('click', function() { - dialogHelper.close(dlg); - }); - currentDialog = dlg; - dlg.querySelector('#txtDirectoryPickerPath').value = initialPath; - var txtNetworkPath = dlg.querySelector('#txtNetworkPath'); - if (txtNetworkPath) { - txtNetworkPath.value = options.networkSharePath || ''; - } - if (!options.pathReadOnly) { - refreshDirectoryBrowser(dlg, initialPath, fileOptions, true); - } + class directoryBrowser { + constructor() { + let currentDialog; + this.show = options => { + options = options || {}; + const fileOptions = { + includeDirectories: true + }; + if (options.includeDirectories != null) { + fileOptions.includeDirectories = options.includeDirectories; } - ); - }; - self.close = function() { - if (currentDialog) { - dialogHelper.close(currentDialog); - } - }; + if (options.includeFiles != null) { + fileOptions.includeFiles = options.includeFiles; + } + Promise.all([getSystemInfo(), getDefaultPath(options)]).then( + responses => { + const systemInfo = responses[0]; + const initialPath = responses[1]; + const dlg = dialogHelper.createDialog({ + size: 'small', + removeOnClose: true, + scrollY: false + }); + dlg.classList.add('ui-body-a'); + dlg.classList.add('background-theme-a'); + dlg.classList.add('directoryPicker'); + dlg.classList.add('formDialog'); + + let html = ''; + html += '
'; + html += ''; + html += '

'; + html += options.header || globalize.translate('HeaderSelectPath'); + html += '

'; + html += '
'; + html += getEditorHtml(options, systemInfo); + dlg.innerHTML = html; + initEditor(dlg, options, fileOptions); + dlg.addEventListener('close', onDialogClosed); + dialogHelper.open(dlg); + dlg.querySelector('.btnCloseDialog').addEventListener('click', () => { + dialogHelper.close(dlg); + }); + currentDialog = dlg; + dlg.querySelector('#txtDirectoryPickerPath').value = initialPath; + const txtNetworkPath = dlg.querySelector('#txtNetworkPath'); + if (txtNetworkPath) { + txtNetworkPath.value = options.networkSharePath || ''; + } + if (!options.pathReadOnly) { + refreshDirectoryBrowser(dlg, initialPath, fileOptions, true); + } + } + ); + }; + this.close = () => { + if (currentDialog) { + dialogHelper.close(currentDialog); + } + }; + } } - var systemInfo; - return directoryBrowser; -}); + let systemInfo; + +/* eslint-enable indent */ +export default directoryBrowser; diff --git a/src/components/tvproviders/xmltv.js b/src/components/tvproviders/xmltv.js index 4c39b14430..054c5b640d 100644 --- a/src/components/tvproviders/xmltv.js +++ b/src/components/tvproviders/xmltv.js @@ -139,7 +139,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'emby-input', 'listVi var page = $(e.target).parents('.xmltvForm')[0]; require(['directorybrowser'], function (directoryBrowser) { - var picker = new directoryBrowser(); + var picker = new directoryBrowser.default(); picker.show({ includeFiles: true, callback: function (path) { diff --git a/src/controllers/dashboard/encodingsettings.js b/src/controllers/dashboard/encodingsettings.js index 0f54f9d70f..b8cdd66651 100644 --- a/src/controllers/dashboard/encodingsettings.js +++ b/src/controllers/dashboard/encodingsettings.js @@ -151,7 +151,7 @@ define(['jQuery', 'loading', 'globalize', 'dom', 'libraryMenu'], function ($, lo }); $('#btnSelectEncoderPath', page).on('click.selectDirectory', function () { require(['directorybrowser'], function (directoryBrowser) { - var picker = new directoryBrowser(); + var picker = new directoryBrowser.default(); picker.show({ includeFiles: true, callback: function (path) { @@ -166,7 +166,7 @@ define(['jQuery', 'loading', 'globalize', 'dom', 'libraryMenu'], function ($, lo }); $('#btnSelectTranscodingTempPath', page).on('click.selectDirectory', function () { require(['directorybrowser'], function (directoryBrowser) { - var picker = new directoryBrowser(); + var picker = new directoryBrowser.default(); picker.show({ callback: function (path) { if (path) { diff --git a/src/controllers/dashboard/general.js b/src/controllers/dashboard/general.js index f215ace28b..eb0f7edfa4 100644 --- a/src/controllers/dashboard/general.js +++ b/src/controllers/dashboard/general.js @@ -59,7 +59,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'emby-textarea', 'emb return function (view, params) { $('#btnSelectCachePath', view).on('click.selectDirectory', function () { require(['directorybrowser'], function (directoryBrowser) { - var picker = new directoryBrowser(); + var picker = new directoryBrowser.default(); picker.show({ callback: function (path) { if (path) { @@ -76,7 +76,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'emby-textarea', 'emb }); $('#btnSelectMetadataPath', view).on('click.selectDirectory', function () { require(['directorybrowser'], function (directoryBrowser) { - var picker = new directoryBrowser(); + var picker = new directoryBrowser.default(); picker.show({ path: $('#txtMetadataPath', view).val(), networkSharePath: $('#txtMetadataNetworkPath', view).val(), diff --git a/src/controllers/dashboard/networking.js b/src/controllers/dashboard/networking.js index 4ddde7f24c..33fc75b484 100644 --- a/src/controllers/dashboard/networking.js +++ b/src/controllers/dashboard/networking.js @@ -136,7 +136,7 @@ define(['loading', 'libraryMenu', 'globalize', 'emby-checkbox', 'emby-select'], }); view.querySelector('#btnSelectCertPath').addEventListener('click', function () { require(['directorybrowser'], function (directoryBrowser) { - var picker = new directoryBrowser(); + var picker = new directoryBrowser.default(); picker.show({ includeFiles: true, includeDirectories: true, diff --git a/src/controllers/livetvsettings.js b/src/controllers/livetvsettings.js index 4c5fdc60de..715eb06214 100644 --- a/src/controllers/livetvsettings.js +++ b/src/controllers/livetvsettings.js @@ -59,7 +59,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-button'], function ($, loading, $('.liveTvSettingsForm').off('submit', onSubmit).on('submit', onSubmit); $('#btnSelectRecordingPath', page).on('click.selectDirectory', function () { require(['directorybrowser'], function (directoryBrowser) { - var picker = new directoryBrowser(); + var picker = new directoryBrowser.default(); picker.show({ callback: function (path) { if (path) { @@ -74,7 +74,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-button'], function ($, loading, }); $('#btnSelectMovieRecordingPath', page).on('click.selectDirectory', function () { require(['directorybrowser'], function (directoryBrowser) { - var picker = new directoryBrowser(); + var picker = new directoryBrowser.default(); picker.show({ callback: function (path) { if (path) { @@ -89,7 +89,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-button'], function ($, loading, }); $('#btnSelectSeriesRecordingPath', page).on('click.selectDirectory', function () { require(['directorybrowser'], function (directoryBrowser) { - var picker = new directoryBrowser(); + var picker = new directoryBrowser.default(); picker.show({ callback: function (path) { if (path) { @@ -104,7 +104,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-button'], function ($, loading, }); $('#btnSelectPostProcessorPath', page).on('click.selectDirectory', function () { require(['directorybrowser'], function (directoryBrowser) { - var picker = new directoryBrowser(); + var picker = new directoryBrowser.default(); picker.show({ includeFiles: true, callback: function (path) { diff --git a/src/controllers/livetvtuner.js b/src/controllers/livetvtuner.js index d7a4d92db2..92f705c02f 100644 --- a/src/controllers/livetvtuner.js +++ b/src/controllers/livetvtuner.js @@ -215,7 +215,7 @@ define(['globalize', 'loading', 'libraryMenu', 'dom', 'emby-input', 'emby-button }); view.querySelector('.btnSelectPath').addEventListener('click', function () { require(['directorybrowser'], function (directoryBrowser) { - var picker = new directoryBrowser(); + var picker = new directoryBrowser.default(); picker.show({ includeFiles: true, callback: function (path) { From 0aeff0b4648f265ee2e4b90127162d086fa5b358 Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Sun, 21 Jun 2020 05:53:59 +0300 Subject: [PATCH 034/244] Migration displaySettings to ES6 modules --- package.json | 1 + .../displaySettings/displaySettings.js | 157 ++++++++++-------- src/controllers/user/display.js | 2 +- 3 files changed, 87 insertions(+), 73 deletions(-) diff --git a/package.json b/package.json index 034c92a7d9..5811839a34 100644 --- a/package.json +++ b/package.json @@ -96,6 +96,7 @@ "src/components/cardbuilder/cardBuilder.js", "src/components/cardbuilder/chaptercardbuilder.js", "src/components/cardbuilder/peoplecardbuilder.js", + "src/components/displaySettings/displaySettings.js", "src/components/images/imageLoader.js", "src/components/indicators/indicators.js", "src/components/lazyLoader/lazyLoaderIntersectionObserver.js", diff --git a/src/components/displaySettings/displaySettings.js b/src/components/displaySettings/displaySettings.js index c4eb35f49f..801c8657bd 100644 --- a/src/components/displaySettings/displaySettings.js +++ b/src/components/displaySettings/displaySettings.js @@ -1,22 +1,37 @@ -define(['require', 'browser', 'layoutManager', 'appSettings', 'pluginManager', 'apphost', 'focusManager', 'datetime', 'globalize', 'loading', 'connectionManager', 'skinManager', 'dom', 'events', 'emby-select', 'emby-checkbox', 'emby-button'], function (require, browser, layoutManager, appSettings, pluginManager, appHost, focusManager, datetime, globalize, loading, connectionManager, skinManager, dom, events) { - 'use strict'; +import browser from 'browser'; +import layoutManager from 'layoutManager'; +import appSettings from 'appSettings'; +import pluginManager from 'pluginManager'; +import appHost from 'apphost'; +import focusManager from 'focusManager'; +import datetime from 'datetime'; +import globalize from 'globalize'; +import loading from 'loading'; +import connectionManager from 'connectionManager'; +import skinManager from 'skinManager'; +import events from 'events'; +import 'emby-select'; +import 'emby-checkbox'; +import 'emby-button'; + +/* eslint-disable indent */ function fillThemes(select, isDashboard) { - select.innerHTML = skinManager.getThemes().map(function (t) { - var value = t.id; + select.innerHTML = skinManager.getThemes().map(t => { + let value = t.id; if (t.isDefault && !isDashboard) { value = ''; } else if (t.isDefaultServerDashboard && isDashboard) { value = ''; } - return ''; + return ``; }).join(''); } function loadScreensavers(context, userSettings) { - var selectScreensaver = context.querySelector('.selectScreensaver'); - var options = pluginManager.ofType('screensaver').map(function (plugin) { + const selectScreensaver = context.querySelector('.selectScreensaver'); + const options = pluginManager.ofType('screensaver').map(plugin => { return { name: plugin.name, value: plugin.id @@ -28,8 +43,8 @@ define(['require', 'browser', 'layoutManager', 'appSettings', 'pluginManager', ' value: 'none' }); - selectScreensaver.innerHTML = options.map(function (o) { - return ''; + selectScreensaver.innerHTML = options.map(o => { + return ``; }).join(''); selectScreensaver.value = userSettings.screensaver(); @@ -41,8 +56,8 @@ define(['require', 'browser', 'layoutManager', 'appSettings', 'pluginManager', ' function loadSoundEffects(context, userSettings) { - var selectSoundEffects = context.querySelector('.selectSoundEffects'); - var options = pluginManager.ofType('soundeffects').map(function (plugin) { + const selectSoundEffects = context.querySelector('.selectSoundEffects'); + const options = pluginManager.ofType('soundeffects').map(plugin => { return { name: plugin.name, value: plugin.id @@ -54,8 +69,8 @@ define(['require', 'browser', 'layoutManager', 'appSettings', 'pluginManager', ' value: 'none' }); - selectSoundEffects.innerHTML = options.map(function (o) { - return ''; + selectSoundEffects.innerHTML = options.map(o => { + return ``; }).join(''); selectSoundEffects.value = userSettings.soundEffects(); @@ -67,17 +82,17 @@ define(['require', 'browser', 'layoutManager', 'appSettings', 'pluginManager', ' function loadSkins(context, userSettings) { - var selectSkin = context.querySelector('.selectSkin'); + const selectSkin = context.querySelector('.selectSkin'); - var options = pluginManager.ofType('skin').map(function (plugin) { + const options = pluginManager.ofType('skin').map(plugin => { return { name: plugin.name, value: plugin.id }; }); - selectSkin.innerHTML = options.map(function (o) { - return ''; + selectSkin.innerHTML = options.map(o => { + return ``; }).join(''); selectSkin.value = userSettings.skin(); @@ -92,7 +107,7 @@ define(['require', 'browser', 'layoutManager', 'appSettings', 'pluginManager', ' } } - function showOrHideMissingEpisodesField(context, user, apiClient) { + function showOrHideMissingEpisodesField(context) { if (browser.tizen || browser.web0s) { context.querySelector('.fldDisplayMissingEpisodes').classList.add('hide'); @@ -102,10 +117,7 @@ define(['require', 'browser', 'layoutManager', 'appSettings', 'pluginManager', ' context.querySelector('.fldDisplayMissingEpisodes').classList.remove('hide'); } - function loadForm(context, user, userSettings, apiClient) { - - var loggedInUserId = apiClient.getCurrentUserId(); - var userId = user.Id; + function loadForm(context, user, userSettings) { if (user.Policy.IsAdministrator) { context.querySelector('.selectDashboardThemeContainer').classList.remove('hide'); @@ -167,8 +179,8 @@ define(['require', 'browser', 'layoutManager', 'appSettings', 'pluginManager', ' context.querySelector('.chkRunAtStartup').checked = appSettings.runAtStartup(); - var selectTheme = context.querySelector('#selectTheme'); - var selectDashboardTheme = context.querySelector('#selectDashboardTheme'); + const selectTheme = context.querySelector('#selectTheme'); + const selectDashboardTheme = context.querySelector('#selectDashboardTheme'); fillThemes(selectTheme); fillThemes(selectDashboardTheme, true); @@ -195,7 +207,7 @@ define(['require', 'browser', 'layoutManager', 'appSettings', 'pluginManager', ' context.querySelector('.selectLayout').value = layoutManager.getSavedLayout() || ''; - showOrHideMissingEpisodesField(context, user, apiClient); + showOrHideMissingEpisodesField(context); loading.hide(); } @@ -239,29 +251,29 @@ define(['require', 'browser', 'layoutManager', 'appSettings', 'pluginManager', ' function save(instance, context, userId, userSettings, apiClient, enableSaveConfirmation) { loading.show(); - apiClient.getUser(userId).then(function (user) { - saveUser(context, user, userSettings, apiClient).then(function () { + apiClient.getUser(userId).then(user => { + saveUser(context, user, userSettings, apiClient).then(() => { loading.hide(); if (enableSaveConfirmation) { - require(['toast'], function (toast) { + import('toast').then(({default: toast}) => { toast(globalize.translate('SettingsSaved')); }); } events.trigger(instance, 'saved'); - }, function () { + }, () => { loading.hide(); }); }); } function onSubmit(e) { - var self = this; - var apiClient = connectionManager.getApiClient(self.options.serverId); - var userId = self.options.userId; - var userSettings = self.options.userSettings; + const self = this; + const apiClient = connectionManager.getApiClient(self.options.serverId); + const userId = self.options.userId; + const userSettings = self.options.userSettings; - userSettings.setUserInfo(userId, apiClient).then(function () { - var enableSaveConfirmation = self.options.enableSaveConfirmation; + userSettings.setUserInfo(userId, apiClient).then(() => { + const enableSaveConfirmation = self.options.enableSaveConfirmation; save(self, self.options.element, userId, userSettings, apiClient, enableSaveConfirmation); }); @@ -272,50 +284,51 @@ define(['require', 'browser', 'layoutManager', 'appSettings', 'pluginManager', ' return false; } - function embed(options, self) { - require(['text!./displaySettings.template.html'], function (template) { - options.element.innerHTML = globalize.translateDocument(template, 'core'); - options.element.querySelector('form').addEventListener('submit', onSubmit.bind(self)); - if (options.enableSaveButton) { - options.element.querySelector('.btnSave').classList.remove('hide'); - } - self.loadData(options.autoFocus); - }); + async function embed(options, self) { + const { default: template } = await import('text!./displaySettings.template.html'); + options.element.innerHTML = globalize.translateDocument(template, 'core'); + options.element.querySelector('form').addEventListener('submit', onSubmit.bind(self)); + if (options.enableSaveButton) { + options.element.querySelector('.btnSave').classList.remove('hide'); + } + self.loadData(options.autoFocus); } - function DisplaySettings(options) { - this.options = options; - embed(options, this); - } + class DisplaySettings { + constructor(options) { + this.options = options; + embed(options, this); + } - DisplaySettings.prototype.loadData = function (autoFocus) { - var self = this; - var context = self.options.element; + loadData(autoFocus) { + const self = this; + const context = self.options.element; - loading.show(); + loading.show(); - var userId = self.options.userId; - var apiClient = connectionManager.getApiClient(self.options.serverId); - var userSettings = self.options.userSettings; + const userId = self.options.userId; + const apiClient = connectionManager.getApiClient(self.options.serverId); + const userSettings = self.options.userSettings; - return apiClient.getUser(userId).then(function (user) { - return userSettings.setUserInfo(userId, apiClient).then(function () { - self.dataLoaded = true; - loadForm(context, user, userSettings, apiClient); - if (autoFocus) { - focusManager.autoFocus(context); - } + return apiClient.getUser(userId).then(user => { + return userSettings.setUserInfo(userId, apiClient).then(() => { + self.dataLoaded = true; + loadForm(context, user, userSettings); + if (autoFocus) { + focusManager.autoFocus(context); + } + }); }); - }); - }; + } - DisplaySettings.prototype.submit = function () { - onSubmit.call(this); - }; + submit() { + onSubmit.call(this); + } - DisplaySettings.prototype.destroy = function () { - this.options = null; - }; + destroy() { + this.options = null; + } + } - return DisplaySettings; -}); +/* eslint-enable indent */ +export default DisplaySettings; diff --git a/src/controllers/user/display.js b/src/controllers/user/display.js index 26c75f209a..408631b383 100644 --- a/src/controllers/user/display.js +++ b/src/controllers/user/display.js @@ -21,7 +21,7 @@ define(['displaySettings', 'userSettings', 'autoFocuser'], function (DisplaySett if (settingsInstance) { settingsInstance.loadData(); } else { - settingsInstance = new DisplaySettings({ + settingsInstance = new DisplaySettings.default({ serverId: ApiClient.serverId(), userId: userId, element: view.querySelector('.settingsContainer'), From 30bddd04b0d91679b28cf402ae609f365cd4afd5 Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Sun, 21 Jun 2020 04:38:42 +0300 Subject: [PATCH 035/244] Migration homeScreenSettings to ES6 modules --- package.json | 1 + .../homeScreenSettings/homeScreenSettings.js | 277 +++++++++--------- src/controllers/user/home.js | 2 +- 3 files changed, 137 insertions(+), 143 deletions(-) diff --git a/package.json b/package.json index 5811839a34..3c2f9ef1d8 100644 --- a/package.json +++ b/package.json @@ -97,6 +97,7 @@ "src/components/cardbuilder/chaptercardbuilder.js", "src/components/cardbuilder/peoplecardbuilder.js", "src/components/displaySettings/displaySettings.js", + "src/components/homeScreenSettings/homeScreenSettings.js", "src/components/images/imageLoader.js", "src/components/indicators/indicators.js", "src/components/lazyLoader/lazyLoaderIntersectionObserver.js", diff --git a/src/components/homeScreenSettings/homeScreenSettings.js b/src/components/homeScreenSettings/homeScreenSettings.js index 9eae944d26..5e7d6b4c51 100644 --- a/src/components/homeScreenSettings/homeScreenSettings.js +++ b/src/components/homeScreenSettings/homeScreenSettings.js @@ -1,26 +1,37 @@ -define(['require', 'apphost', 'layoutManager', 'focusManager', 'globalize', 'loading', 'connectionManager', 'homeSections', 'dom', 'events', 'listViewStyle', 'emby-select', 'emby-checkbox'], function (require, appHost, layoutManager, focusManager, globalize, loading, connectionManager, homeSections, dom, events) { - 'use strict'; +import layoutManager from 'layoutManager'; +import focusManager from 'focusManager'; +import globalize from 'globalize'; +import loading from 'loading'; +import connectionManager from 'connectionManager'; +import homeSections from 'homeSections'; +import dom from 'dom'; +import events from 'events'; +import 'listViewStyle'; +import 'emby-select'; +import 'emby-checkbox'; - var numConfigurableSections = 7; +/* eslint-disable indent */ + + const numConfigurableSections = 7; function renderViews(page, user, result) { - var folderHtml = ''; + let folderHtml = ''; folderHtml += '
'; - folderHtml += result.map(function (i) { + folderHtml += result.map(i => { - var currentHtml = ''; + let currentHtml = ''; - var id = 'chkGroupFolder' + i.Id; + const id = `chkGroupFolder${i.Id}`; - var isChecked = user.Configuration.GroupedFolders.indexOf(i.Id) !== -1; + const isChecked = user.Configuration.GroupedFolders.includes(i.Id); - var checkedHtml = isChecked ? ' checked="checked"' : ''; + const checkedHtml = isChecked ? ' checked="checked"' : ''; currentHtml += ''; return currentHtml; @@ -34,7 +45,7 @@ define(['require', 'apphost', 'layoutManager', 'focusManager', 'globalize', 'loa function getLandingScreenOptions(type) { - var list = []; + const list = []; if (type === 'movies') { list.push({ @@ -123,27 +134,27 @@ define(['require', 'apphost', 'layoutManager', 'focusManager', 'globalize', 'loa function getLandingScreenOptionsHtml(type, userValue) { - return getLandingScreenOptions(type).map(function (o) { + return getLandingScreenOptions(type).map(o => { - var selected = userValue === o.value || (o.isDefault && !userValue); - var selectedHtml = selected ? ' selected' : ''; - var optionValue = o.isDefault ? '' : o.value; + const selected = userValue === o.value || (o.isDefault && !userValue); + const selectedHtml = selected ? ' selected' : ''; + const optionValue = o.isDefault ? '' : o.value; - return ''; + return ``; }).join(''); } function renderViewOrder(context, user, result) { - var html = ''; + let html = ''; - var index = 0; + let index = 0; - html += result.Items.map(function (view) { + html += result.Items.map(view => { - var currentHtml = ''; + let currentHtml = ''; - currentHtml += '
'; + currentHtml += `
`; currentHtml += ''; @@ -155,8 +166,8 @@ define(['require', 'apphost', 'layoutManager', 'focusManager', 'globalize', 'loa currentHtml += '
'; - currentHtml += ''; - currentHtml += ''; + currentHtml += ``; + currentHtml += ``; currentHtml += '
'; @@ -170,14 +181,14 @@ define(['require', 'apphost', 'layoutManager', 'focusManager', 'globalize', 'loa function updateHomeSectionValues(context, userSettings) { - for (var i = 1; i <= 7; i++) { + for (let i = 1; i <= 7; i++) { - var select = context.querySelector('#selectHomeSection' + i); - var defaultValue = homeSections.getDefaultSection(i - 1); + const select = context.querySelector(`#selectHomeSection${i}`); + const defaultValue = homeSections.getDefaultSection(i - 1); - var option = select.querySelector('option[value=' + defaultValue + ']') || select.querySelector('option[value=""]'); + const option = select.querySelector(`option[value=${defaultValue}]`) || select.querySelector('option[value=""]'); - var userValue = userSettings.get('homesection' + (i - 1)); + const userValue = userSettings.get(`homesection${i - 1}`); option.value = ''; @@ -193,42 +204,42 @@ define(['require', 'apphost', 'layoutManager', 'focusManager', 'globalize', 'loa function getPerLibrarySettingsHtml(item, user, userSettings, apiClient) { - var html = ''; + let html = ''; - var isChecked; + let isChecked; if (item.Type === 'Channel' || item.CollectionType === 'boxsets' || item.CollectionType === 'playlists') { - isChecked = (user.Configuration.MyMediaExcludes || []).indexOf(item.Id) === -1; + isChecked = !(user.Configuration.MyMediaExcludes || []).includes(item.Id); html += '
'; html += ''; html += '
'; } - var excludeFromLatest = ['playlists', 'livetv', 'boxsets', 'channels']; - if (excludeFromLatest.indexOf(item.CollectionType || '') === -1) { + const excludeFromLatest = ['playlists', 'livetv', 'boxsets', 'channels']; + if (!excludeFromLatest.includes(item.CollectionType || '')) { - isChecked = user.Configuration.LatestItemsExcludes.indexOf(item.Id) === -1; + isChecked = !user.Configuration.LatestItemsExcludes.includes(item.Id); html += ''; } if (html) { - html = '
' + html + '
'; + html = `
${html}
`; } if (item.CollectionType === 'movies' || item.CollectionType === 'tvshows' || item.CollectionType === 'music' || item.CollectionType === 'livetv') { - var idForLanding = item.CollectionType === 'livetv' ? item.CollectionType : item.Id; + const idForLanding = item.CollectionType === 'livetv' ? item.CollectionType : item.Id; html += '
'; - html += '`; - var userValue = userSettings.get('landing-' + idForLanding); + const userValue = userSettings.get(`landing-${idForLanding}`); html += getLandingScreenOptionsHtml(item.CollectionType, userValue); @@ -238,7 +249,7 @@ define(['require', 'apphost', 'layoutManager', 'focusManager', 'globalize', 'loa if (html) { - var prefix = ''; + let prefix = ''; prefix += '
'; prefix += '

'; @@ -254,10 +265,10 @@ define(['require', 'apphost', 'layoutManager', 'focusManager', 'globalize', 'loa function renderPerLibrarySettings(context, user, userViews, userSettings, apiClient) { - var elem = context.querySelector('.perLibrarySettings'); - var html = ''; + const elem = context.querySelector('.perLibrarySettings'); + let html = ''; - for (var i = 0, length = userViews.length; i < length; i++) { + for (let i = 0, length = userViews.length; i < length; i++) { html += getPerLibrarySettingsHtml(userViews[i], user, userSettings, apiClient); } @@ -271,10 +282,10 @@ define(['require', 'apphost', 'layoutManager', 'focusManager', 'globalize', 'loa updateHomeSectionValues(context, userSettings); - var promise1 = apiClient.getUserViews({ IncludeHidden: true }, user.Id); - var promise2 = apiClient.getJSON(apiClient.getUrl('Users/' + user.Id + '/GroupingOptions')); + const promise1 = apiClient.getUserViews({ IncludeHidden: true }, user.Id); + const promise2 = apiClient.getJSON(apiClient.getUrl(`Users/${user.Id}/GroupingOptions`)); - Promise.all([promise1, promise2]).then(function (responses) { + Promise.all([promise1, promise2]).then(responses => { renderViewOrder(context, user, responses[0]); @@ -286,38 +297,19 @@ define(['require', 'apphost', 'layoutManager', 'focusManager', 'globalize', 'loa }); } - function getSibling(elem, type, className) { - - var sibling = elem[type]; - - while (sibling != null) { - if (sibling.classList.contains(className)) { - break; - } - } - - if (sibling != null) { - if (!sibling.classList.contains(className)) { - sibling = null; - } - } - - return sibling; - } - function onSectionOrderListClick(e) { - var target = dom.parentWithClass(e.target, 'btnViewItemMove'); + const target = dom.parentWithClass(e.target, 'btnViewItemMove'); if (target) { - var viewItem = dom.parentWithClass(target, 'viewItem'); + const viewItem = dom.parentWithClass(target, 'viewItem'); if (viewItem) { - var ul = dom.parentWithClass(viewItem, 'paperList'); + const ul = dom.parentWithClass(viewItem, 'paperList'); if (target.classList.contains('btnViewItemDown')) { - var next = viewItem.nextSibling; + const next = viewItem.nextSibling; if (next) { viewItem.parentNode.removeChild(viewItem); @@ -327,7 +319,7 @@ define(['require', 'apphost', 'layoutManager', 'focusManager', 'globalize', 'loa } else { - var prev = viewItem.previousSibling; + const prev = viewItem.previousSibling; if (prev) { viewItem.parentNode.removeChild(viewItem); @@ -341,10 +333,10 @@ define(['require', 'apphost', 'layoutManager', 'focusManager', 'globalize', 'loa function getCheckboxItems(selector, context, isChecked) { - var inputs = context.querySelectorAll(selector); - var list = []; + const inputs = context.querySelectorAll(selector); + const list = []; - for (var i = 0, length = inputs.length; i < length; i++) { + for (let i = 0, length = inputs.length; i < length; i++) { if (inputs[i].checked === isChecked) { list.push(inputs[i]); @@ -359,25 +351,25 @@ define(['require', 'apphost', 'layoutManager', 'focusManager', 'globalize', 'loa user.Configuration.HidePlayedInLatest = context.querySelector('.chkHidePlayedFromLatest').checked; - user.Configuration.LatestItemsExcludes = getCheckboxItems('.chkIncludeInLatest', context, false).map(function (i) { + user.Configuration.LatestItemsExcludes = getCheckboxItems('.chkIncludeInLatest', context, false).map(i => { return i.getAttribute('data-folderid'); }); - user.Configuration.MyMediaExcludes = getCheckboxItems('.chkIncludeInMyMedia', context, false).map(function (i) { + user.Configuration.MyMediaExcludes = getCheckboxItems('.chkIncludeInMyMedia', context, false).map(i => { return i.getAttribute('data-folderid'); }); - user.Configuration.GroupedFolders = getCheckboxItems('.chkGroupFolder', context, true).map(function (i) { + user.Configuration.GroupedFolders = getCheckboxItems('.chkGroupFolder', context, true).map(i => { return i.getAttribute('data-folderid'); }); - var viewItems = context.querySelectorAll('.viewItem'); - var orderedViews = []; - var i; - var length; + const viewItems = context.querySelectorAll('.viewItem'); + const orderedViews = []; + let i; + let length; for (i = 0, length = viewItems.length; i < length; i++) { orderedViews.push(viewItems[i].getAttribute('data-viewid')); } @@ -394,10 +386,10 @@ define(['require', 'apphost', 'layoutManager', 'focusManager', 'globalize', 'loa userSettingsInstance.set('homesection5', context.querySelector('#selectHomeSection6').value); userSettingsInstance.set('homesection6', context.querySelector('#selectHomeSection7').value); - var selectLandings = context.querySelectorAll('.selectLanding'); + const selectLandings = context.querySelectorAll('.selectLanding'); for (i = 0, length = selectLandings.length; i < length; i++) { - var selectLanding = selectLandings[i]; - userSettingsInstance.set('landing-' + selectLanding.getAttribute('data-folderid'), selectLanding.value); + const selectLanding = selectLandings[i]; + userSettingsInstance.set(`landing-${selectLanding.getAttribute('data-folderid')}`, selectLanding.value); } return apiClient.updateUserConfiguration(user.Id, user.Configuration); @@ -407,20 +399,20 @@ define(['require', 'apphost', 'layoutManager', 'focusManager', 'globalize', 'loa loading.show(); - apiClient.getUser(userId).then(function (user) { + apiClient.getUser(userId).then(user => { - saveUser(context, user, userSettings, apiClient).then(function () { + saveUser(context, user, userSettings, apiClient).then(() => { loading.hide(); if (enableSaveConfirmation) { - require(['toast'], function (toast) { + import('toast').then(({default: toast}) => { toast(globalize.translate('SettingsSaved')); }); } events.trigger(instance, 'saved'); - }, function () { + }, () => { loading.hide(); }); }); @@ -428,14 +420,14 @@ define(['require', 'apphost', 'layoutManager', 'focusManager', 'globalize', 'loa function onSubmit(e) { - var self = this; - var apiClient = connectionManager.getApiClient(self.options.serverId); - var userId = self.options.userId; - var userSettings = self.options.userSettings; + const self = this; + const apiClient = connectionManager.getApiClient(self.options.serverId); + const userId = self.options.userId; + const userSettings = self.options.userSettings; - userSettings.setUserInfo(userId, apiClient).then(function () { + userSettings.setUserInfo(userId, apiClient).then(() => { - var enableSaveConfirmation = self.options.enableSaveConfirmation; + const enableSaveConfirmation = self.options.enableSaveConfirmation; save(self, self.options.element, userId, userSettings, apiClient, enableSaveConfirmation); }); @@ -448,13 +440,13 @@ define(['require', 'apphost', 'layoutManager', 'focusManager', 'globalize', 'loa function onChange(e) { - var chkIncludeInMyMedia = dom.parentWithClass(e.target, 'chkIncludeInMyMedia'); + const chkIncludeInMyMedia = dom.parentWithClass(e.target, 'chkIncludeInMyMedia'); if (!chkIncludeInMyMedia) { return; } - var section = dom.parentWithClass(chkIncludeInMyMedia, 'verticalSection'); - var fldIncludeInLatest = section.querySelector('.fldIncludeInLatest'); + const section = dom.parentWithClass(chkIncludeInMyMedia, 'verticalSection'); + const fldIncludeInLatest = section.querySelector('.fldIncludeInLatest'); if (fldIncludeInLatest) { if (chkIncludeInMyMedia.checked) { fldIncludeInLatest.classList.remove('hide'); @@ -466,10 +458,10 @@ define(['require', 'apphost', 'layoutManager', 'focusManager', 'globalize', 'loa function embed(options, self) { - require(['text!./homeScreenSettings.template.html'], function (template) { + return import('text!./homeScreenSettings.template.html').then(({default: template}) => { - for (var i = 1; i <= numConfigurableSections; i++) { - template = template.replace('{section' + i + 'label}', globalize.translate('LabelHomeScreenSectionValue', i)); + for (let i = 1; i <= numConfigurableSections; i++) { + template = template.replace(`{section${i}label}`, globalize.translate('LabelHomeScreenSectionValue', i)); } options.element.innerHTML = globalize.translateDocument(template, 'core'); @@ -492,47 +484,48 @@ define(['require', 'apphost', 'layoutManager', 'focusManager', 'globalize', 'loa }); } - function HomeScreenSettings(options) { + class HomeScreenSettings { + constructor(options) { + this.options = options; + embed(options, this); + } - this.options = options; + loadData(autoFocus) { - embed(options, this); + const self = this; + const context = self.options.element; + + loading.show(); + + const userId = self.options.userId; + const apiClient = connectionManager.getApiClient(self.options.serverId); + const userSettings = self.options.userSettings; + + apiClient.getUser(userId).then(user => { + + userSettings.setUserInfo(userId, apiClient).then(() => { + + self.dataLoaded = true; + + loadForm(context, user, userSettings, apiClient); + + if (autoFocus) { + focusManager.autoFocus(context); + } + }); + }); + } + + submit() { + onSubmit.call(this); + } + + destroy() { + + this.options = null; + } } - HomeScreenSettings.prototype.loadData = function (autoFocus) { +/* eslint-enable indent */ - var self = this; - var context = self.options.element; - - loading.show(); - - var userId = self.options.userId; - var apiClient = connectionManager.getApiClient(self.options.serverId); - var userSettings = self.options.userSettings; - - apiClient.getUser(userId).then(function (user) { - - userSettings.setUserInfo(userId, apiClient).then(function () { - - self.dataLoaded = true; - - loadForm(context, user, userSettings, apiClient); - - if (autoFocus) { - focusManager.autoFocus(context); - } - }); - }); - }; - - HomeScreenSettings.prototype.submit = function () { - onSubmit.call(this); - }; - - HomeScreenSettings.prototype.destroy = function () { - - this.options = null; - }; - - return HomeScreenSettings; -}); +export default HomeScreenSettings; diff --git a/src/controllers/user/home.js b/src/controllers/user/home.js index 8f826c425d..117a457d3f 100644 --- a/src/controllers/user/home.js +++ b/src/controllers/user/home.js @@ -21,7 +21,7 @@ define(['homescreenSettings', 'dom', 'globalize', 'loading', 'userSettings', 'au if (homescreenSettingsInstance) { homescreenSettingsInstance.loadData(); } else { - homescreenSettingsInstance = new HomescreenSettings({ + homescreenSettingsInstance = new HomescreenSettings.default({ serverId: ApiClient.serverId(), userId: userId, element: view.querySelector('.homeScreenSettingsContainer'), From 7cb209fa10ddeed3a90054673cf930579fdbe852 Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Sun, 21 Jun 2020 04:56:48 +0300 Subject: [PATCH 036/244] Migration playbackSettings to ES6 modules --- package.json | 1 + .../playbackSettings/playbackSettings.js | 161 ++++++++++-------- src/controllers/user/playback.js | 2 +- 3 files changed, 88 insertions(+), 76 deletions(-) diff --git a/package.json b/package.json index 3c2f9ef1d8..85225a15f9 100644 --- a/package.json +++ b/package.json @@ -110,6 +110,7 @@ "src/components/playback/playmethodhelper.js", "src/components/playback/remotecontrolautoplay.js", "src/components/playback/volumeosd.js", + "src/components/playbackSettings/playbackSettings.js", "src/components/playmenu.js", "src/components/sanatizefilename.js", "src/components/scrollManager.js", diff --git a/src/components/playbackSettings/playbackSettings.js b/src/components/playbackSettings/playbackSettings.js index 06d2e38d2c..846efe1fd4 100644 --- a/src/components/playbackSettings/playbackSettings.js +++ b/src/components/playbackSettings/playbackSettings.js @@ -1,31 +1,42 @@ -define(['require', 'browser', 'appSettings', 'apphost', 'focusManager', 'qualityoptions', 'globalize', 'loading', 'connectionManager', 'dom', 'events', 'emby-select', 'emby-checkbox'], function (require, browser, appSettings, appHost, focusManager, qualityoptions, globalize, loading, connectionManager, dom, events) { - 'use strict'; +import browser from 'browser'; +import appSettings from 'appSettings'; +import appHost from 'apphost'; +import focusManager from 'focusManager'; +import qualityoptions from 'qualityoptions'; +import globalize from 'globalize'; +import loading from 'loading'; +import connectionManager from 'connectionManager'; +import events from 'events'; +import 'emby-select'; +import 'emby-checkbox'; + +/* eslint-disable indent */ function fillSkipLengths(select) { - var options = [5, 10, 15, 20, 25, 30]; + const options = [5, 10, 15, 20, 25, 30]; - select.innerHTML = options.map(function (option) { + select.innerHTML = options.map(option => { return { name: globalize.translate('ValueSeconds', option), value: option * 1000 }; - }).map(function (o) { - return ''; + }).map(o => { + return ``; }).join(''); } function populateLanguages(select, languages) { - var html = ''; + let html = ''; - html += "'; + html += ``; - for (var i = 0, length = languages.length; i < length; i++) { + for (let i = 0, length = languages.length; i < length; i++) { - var culture = languages[i]; + const culture = languages[i]; - html += "'; + html += ``; } select.innerHTML = html; @@ -33,7 +44,7 @@ define(['require', 'browser', 'appSettings', 'apphost', 'focusManager', 'quality function setMaxBitrateIntoField(select, isInNetwork, mediatype) { - var options = mediatype === 'Audio' ? qualityoptions.getAudioQualityOptions({ + const options = mediatype === 'Audio' ? qualityoptions.getAudioQualityOptions({ currentMaxBitrate: appSettings.maxStreamingBitrate(isInNetwork, mediatype), isAutomaticBitrateEnabled: appSettings.enableAutomaticBitrateDetection(isInNetwork, mediatype), @@ -47,10 +58,10 @@ define(['require', 'browser', 'appSettings', 'apphost', 'focusManager', 'quality }); - select.innerHTML = options.map(function (i) { + select.innerHTML = options.map(i => { // render empty string instead of 0 for the auto option - return ''; + return ``; }).join(''); if (appSettings.enableAutomaticBitrateDetection(isInNetwork, mediatype)) { @@ -62,23 +73,23 @@ define(['require', 'browser', 'appSettings', 'apphost', 'focusManager', 'quality function fillChromecastQuality(select) { - var options = qualityoptions.getVideoQualityOptions({ + const options = qualityoptions.getVideoQualityOptions({ currentMaxBitrate: appSettings.maxChromecastBitrate(), isAutomaticBitrateEnabled: !appSettings.maxChromecastBitrate(), enableAuto: true }); - select.innerHTML = options.map(function (i) { + select.innerHTML = options.map(i => { // render empty string instead of 0 for the auto option - return ''; + return ``; }).join(''); select.value = appSettings.maxChromecastBitrate() || ''; } - function setMaxBitrateFromField(select, isInNetwork, mediatype, value) { + function setMaxBitrateFromField(select, isInNetwork, mediatype) { if (select.value) { appSettings.maxStreamingBitrate(isInNetwork, mediatype, select.value); @@ -110,7 +121,7 @@ define(['require', 'browser', 'appSettings', 'apphost', 'focusManager', 'quality return; } - apiClient.getEndpointInfo().then(function (endpointInfo) { + apiClient.getEndpointInfo().then(endpointInfo => { if (endpointInfo.IsInNetwork) { @@ -133,7 +144,7 @@ define(['require', 'browser', 'appSettings', 'apphost', 'focusManager', 'quality }); } - function showOrHideEpisodesField(context, user, apiClient) { + function showOrHideEpisodesField(context) { if (browser.tizen || browser.web0s) { context.querySelector('.fldEpisodeAutoPlay').classList.add('hide'); @@ -145,12 +156,12 @@ define(['require', 'browser', 'appSettings', 'apphost', 'focusManager', 'quality function loadForm(context, user, userSettings, apiClient) { - var loggedInUserId = apiClient.getCurrentUserId(); - var userId = user.Id; + const loggedInUserId = apiClient.getCurrentUserId(); + const userId = user.Id; showHideQualityFields(context, user, apiClient); - apiClient.getCultures().then(function (allCultures) { + apiClient.getCultures().then(allCultures => { populateLanguages(context.querySelector('#selectAudioLanguage'), allCultures); @@ -159,7 +170,7 @@ define(['require', 'browser', 'appSettings', 'apphost', 'focusManager', 'quality }); // hide cinema mode options if disabled at server level - apiClient.getNamedConfiguration('cinemamode').then(function (cinemaConfig) { + apiClient.getNamedConfiguration('cinemamode').then(cinemaConfig => { if (cinemaConfig.EnableIntrosForMovies || cinemaConfig.EnableIntrosForEpisodes) { context.querySelector('.cinemaModeOptions').classList.remove('hide'); @@ -204,18 +215,18 @@ define(['require', 'browser', 'appSettings', 'apphost', 'focusManager', 'quality fillChromecastQuality(context.querySelector('.selectChromecastVideoQuality')); - var selectChromecastVersion = context.querySelector('.selectChromecastVersion'); + const selectChromecastVersion = context.querySelector('.selectChromecastVersion'); selectChromecastVersion.value = userSettings.chromecastVersion(); - var selectSkipForwardLength = context.querySelector('.selectSkipForwardLength'); + const selectSkipForwardLength = context.querySelector('.selectSkipForwardLength'); fillSkipLengths(selectSkipForwardLength); selectSkipForwardLength.value = userSettings.skipForwardLength(); - var selectSkipBackLength = context.querySelector('.selectSkipBackLength'); + const selectSkipBackLength = context.querySelector('.selectSkipBackLength'); fillSkipLengths(selectSkipBackLength); selectSkipBackLength.value = userSettings.skipBackLength(); - showOrHideEpisodesField(context, user, apiClient); + showOrHideEpisodesField(context); loading.hide(); } @@ -248,20 +259,20 @@ define(['require', 'browser', 'appSettings', 'apphost', 'focusManager', 'quality loading.show(); - apiClient.getUser(userId).then(function (user) { + apiClient.getUser(userId).then(user => { - saveUser(context, user, userSettings, apiClient).then(function () { + saveUser(context, user, userSettings, apiClient).then(() => { loading.hide(); if (enableSaveConfirmation) { - require(['toast'], function (toast) { + import('toast').then(({default: toast}) => { toast(globalize.translate('SettingsSaved')); }); } events.trigger(instance, 'saved'); - }, function () { + }, () => { loading.hide(); }); }); @@ -269,14 +280,14 @@ define(['require', 'browser', 'appSettings', 'apphost', 'focusManager', 'quality function onSubmit(e) { - var self = this; - var apiClient = connectionManager.getApiClient(self.options.serverId); - var userId = self.options.userId; - var userSettings = self.options.userSettings; + const self = this; + const apiClient = connectionManager.getApiClient(self.options.serverId); + const userId = self.options.userId; + const userSettings = self.options.userSettings; - userSettings.setUserInfo(userId, apiClient).then(function () { + userSettings.setUserInfo(userId, apiClient).then(() => { - var enableSaveConfirmation = self.options.enableSaveConfirmation; + const enableSaveConfirmation = self.options.enableSaveConfirmation; save(self, self.options.element, userId, userSettings, apiClient, enableSaveConfirmation); }); @@ -289,7 +300,7 @@ define(['require', 'browser', 'appSettings', 'apphost', 'focusManager', 'quality function embed(options, self) { - require(['text!./playbackSettings.template.html'], function (template) { + return import('text!./playbackSettings.template.html').then(({default: template}) => { options.element.innerHTML = globalize.translateDocument(template, 'core'); @@ -307,43 +318,43 @@ define(['require', 'browser', 'appSettings', 'apphost', 'focusManager', 'quality }); } - function PlaybackSettings(options) { + class PlaybackSettings { + constructor(options) { + this.options = options; + embed(options, this); + } - this.options = options; + loadData() { - embed(options, this); + const self = this; + const context = self.options.element; + + loading.show(); + + const userId = self.options.userId; + const apiClient = connectionManager.getApiClient(self.options.serverId); + const userSettings = self.options.userSettings; + + apiClient.getUser(userId).then(user => { + + userSettings.setUserInfo(userId, apiClient).then(() => { + + self.dataLoaded = true; + + loadForm(context, user, userSettings, apiClient); + }); + }); + } + + submit() { + onSubmit.call(this); + } + + destroy() { + + this.options = null; + } } - PlaybackSettings.prototype.loadData = function () { - - var self = this; - var context = self.options.element; - - loading.show(); - - var userId = self.options.userId; - var apiClient = connectionManager.getApiClient(self.options.serverId); - var userSettings = self.options.userSettings; - - apiClient.getUser(userId).then(function (user) { - - userSettings.setUserInfo(userId, apiClient).then(function () { - - self.dataLoaded = true; - - loadForm(context, user, userSettings, apiClient); - }); - }); - }; - - PlaybackSettings.prototype.submit = function () { - onSubmit.call(this); - }; - - PlaybackSettings.prototype.destroy = function () { - - this.options = null; - }; - - return PlaybackSettings; -}); +/* eslint-enable indent */ +export default PlaybackSettings; diff --git a/src/controllers/user/playback.js b/src/controllers/user/playback.js index 02a718eb8c..c138b5a86d 100644 --- a/src/controllers/user/playback.js +++ b/src/controllers/user/playback.js @@ -21,7 +21,7 @@ define(['playbackSettings', 'dom', 'globalize', 'loading', 'userSettings', 'auto if (settingsInstance) { settingsInstance.loadData(); } else { - settingsInstance = new PlaybackSettings({ + settingsInstance = new PlaybackSettings.default({ serverId: ApiClient.serverId(), userId: userId, element: view.querySelector('.settingsContainer'), From 4c55a07b0a46386a9141ff930492ba99bbd766d4 Mon Sep 17 00:00:00 2001 From: ferferga Date: Wed, 24 Jun 2020 07:48:25 +0200 Subject: [PATCH 037/244] Remove legacy loading --- src/components/loading/loader.gif | Bin 11493 -> 0 bytes src/components/loading/loading.js | 6 +---- src/components/loading/loadingLegacy.css | 10 -------- src/components/loading/loadingLegacy.js | 28 ----------------------- 4 files changed, 1 insertion(+), 43 deletions(-) delete mode 100644 src/components/loading/loader.gif delete mode 100644 src/components/loading/loadingLegacy.css delete mode 100644 src/components/loading/loadingLegacy.js diff --git a/src/components/loading/loader.gif b/src/components/loading/loader.gif deleted file mode 100644 index 86fb6daa79669dabcdf43da630e5de612a44140e..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 11493 zcmaKyWn5Hk!|jJo=>`#yZV+h&L5ZQeyHmP*=8v*GCiJ?;gWsdjrp6B=8 z=gZk2_iyiy>sr_PuO%%jB`9Q~ji`-yg93m;p%)hyot>RiQ&XFpn{YTB@Slekj-~iT zT}|?n@)urCZX|@iFKHi2xRDm^t3uCf^!b zV}IJ?#6Iihu30e513SsEQzVR)xQyEi7tBH2fYrLS8Ux~hW1rrgx?dvLnX|`D zKGXbW+gEK=rLWg7e|2?lTs*^r>|H^jVIs)-KG89;aRz?DNy#ax2;mu-S;+CZdHHdP zX+^~)!CB>y4><)@)iu$Dr45Zu0Tr!n6qU7I-95e%%>#o&E$ySO2)&b2(OdJ zLZ-gFcO7Y8Whs%i5Y;)Mn)qxsr^G7MB09ms@~vDUi1+-UX=hOpq0sh~XIjdvnQEuw z2Jm4TP#*)`(~b7Po^EhLt9PK3;$ZCX>KWO59$_}**1?+o^PFC5B5wr`XQ5)MH|33Z zTkP`tSJLW)A)?$?F3XwOh^i>t(q#J`&6L3ze_@q&U7XL#J6C;!=cipu`hbZ6`3 zb{`1qjbc~Z_5N52o6$^H`|Z(Ov0Q;-w-4v4n}*&tr>T?PIZzpiX1e<~%Jo4~9koMG zH|jOGyb6xB)$M=g^R`c5kCP(V($84&&F9Sz`Gh&k8u zENhU)@{f+!N_ZMZs45m0?>7>ZB=#m1G^CR2m zLW$DbbpT8rrHq{RFZ0uB<;X!Yc@op!C(OIIbjkA=Up_8&)*fk3z*94Qf0^}2I8|M@~fn6!@eG98*JB~t6Zrb}c zEzpL_c2+k;Vs}u z*o$YAYnQChg^`^=v2Z(=haNAq#m6cy>F=Zv4!f&|IxqW@?|cWd07?wp{n#m{PUuRE zQ)b++wAiNy-^%=sD);iRtnVS4M3-bt`Ne zk!JoTs?~iT)xG+P7@p3hC?tPX2%^}}nFSdVMcndvA5*0TESx+B#0#qn_HaI*H7z?n zpSK;=JYRJEym-D`nmZ@BB4P5`uoqwSJk zeQWmT+ST09^H+#xfGqfU_WDCsMW&J6vyS|j53jw4k{I4TnmgRUePHXwxb8z)kfOLB z!45!Hx$lwXhccSJG1AsiUmBm27s2O#Fi~XEiw!GCP&xJ`pRSia_zJ!3boyB_v)S-- z9lNJ7Eo;yNzsT=d)y@^!%$_9{97i;hf<%*%xjoiH0FSCfD4Fr!4&stP;<9ZSKq_tEi*g06yejlfsS(=B4C+b7w zK7>B4PGrv+Pm`YLjq}}zSjZQ>Mhg0O0TyFY!Z%5Yu_g3Ovg1JAo8-)?5=MdXaYdh- z6fkxvv$QM_0|pC6rq^PL(~kIvVnS9)4{YJiE1RhmId6)HD*Agw8eAr5&k!aqn5C0TBOUrN}y=a3`Ab5BBE5TW^ZEErR zX>wfAGS^(4I|PwcSuy8 ze+x;?huG9%w#Xad6KT>^3gOXy9OfkcE4!o z&BYdc90HrJuwpEJTlDy*T6H9ZsVRb}sR;hg_?bS2$LM+qu?}JzlFFE~1WdpRsZG7C z0!t%OrZ(s%*RlA~6kvCbx2)|$kPuR}uF;vt{))-{OVx*8x{bmL9?5=BRRnxF@f|?p zniFGtE3}d|sIVqwZs~ws-Z$N*WKA0#(`p+L?)93H1pm%^fNi6R4iok=dC@t86BZA6 z502W3(0YGv>wddINR>fe&w&(_t7m}z*^_+LVe`175)lx#j0T|lisf?}b9*7~53@k< zHLwmleG2KkuI}^nPud`wBDH)B>kl+g(eviz>f<4EV!QH1GNuzmeJH&oBoZw}8{O$s zip&c$+gY~1(?TY~*$cP8GXW(08e&$gkJg&nBkBA#%pG4JYbC!=vHojBaHc-qb84Sj zj%FzTms0>wt_kcZ6OkbxEKz#SWR2PzQM?RzV0>qONuYx%>wyB&=rY1kL+H_ncTuXD zJFr)82bdm)`g$r`9#F4#Ia|BFYoRg{GW*GQGVPrGeQM);ZDnRk`v$vV3hPsX3%ou2 zm{-=Y%c^2Vxs^?mFL0T^5b>+Vd`}%JxYT-A%It@u`$TQIkjaTqXiG==#b{aHCoB1y z4syHrM)OMGu~AbtUS?SZpQ}T8{MFi0rC)Q3+>M=apz2ChI7UO~FWE1fYgAI4rBjpJ<3c@_NM#T=i?PGJ`ux1(a zRj|q8d4#le`JbqS&ez;^`>6Cn)u}wiT#9$shn#QpIHJG!X zT51?f+OZpFBK&fbIoow8F#9;;`*I7$?LL-PdYaF9xq~Qm!?b3fmO5YV>k_)ptdySD z)?XglX1gyul^X478*;|ZkS_0&yp-vi2nI)kcU%n>P3hsUdlS~KE3W;p*x^+-_9wU7 zGbs@h>JRM)zPE+mPaQGC&uiOVkLMp>f)D-wMA`;QdrtYcO$L@&Me@LZOMdYGT}eCq z{PXjlqri|vBLsAo1LfvG`gN0=9?j%F#jzD5$ zufFXE13;iJ*1;Xc4x-Ybax(s{gCMh#P?bo922iMxd6-rkXPg;G$I6d!CG1v0$Yji3 zOgxr2mP&-mf#S@DDwdRFcQ8VDD}yg$Wuo;d(S@4_ zmL_1a8+sLD>$V%8T_#s{Pc{{at!wR|;coGsHq;oPk*GE0%~`m!pBJjt5m`nE!ZP)pTKlnjGaE%&{& zbhq?#L0kvfbW}lyL+%WIka0k}<8n~O0eVu}QW9ZN8gG-POgb@Ue=u;;driSc%Csh?};Jr zgH+z!31V+no(5yCc4DrVQ~pM;Kt1SHA7+z@ENve3@_+>CM9SSC};Cm?;7l=g0nm=FWB5#}=Kbq4a zM39+Oguq|uj)2m&>P?0zpg!V_$yzi%=*`&?r{GkazYKo!gvbN)melo^@+pzYE&+Cw z$ghaUd=K9w3%l$i>bnd_EW`jlB`m)T+>h_88n z>7bzZDSQt@7I{Kp7tSOgMPc;u>S8Iv#4F0SDpag1%+f0VE+ZU*=|$#Kj+a!7nhgPA zR+x|!`oJJ}mJq|8azgrwkNjX`HE;$jPaPgqxctk!Bs#7LW`+rM_vbOZJ{E>dR0v4r zeR?vi$TrK&u5hk{?te4eSj}r-HCtS*bm^<4V)dvz`8fJ$g%lEzV`Da)B{;2XHmD2r zLbc=`sU(MGO%vyAW@D7Bp~O-s<_Q_3LrvSCP_icoD#lG8Kv>^_RV*Wn1UFSomRZKZ zwQr@e=qhS))5XG0YIihi;s$Sn;l5D4l8b zM5cIDY_$jxoLKlZ&zc(Oa>=Nl8s?8Z8X57GvJ_Y=YZNh<_bEOyRp!fhN44J7f3J8; z$yda2+9*s3B+02`#BY3RmyK?y5r+pg6%I9a_#`9C#l06I%8yp_kd?S5mAixzb3$Xi zvmG4p8>;I`C3Un62T9`|^qq;x#dVS*2gyMKb#rDEvMsf|{Y^bYiC&ejntcee7!w^2 zDPQQ#I`}m{+q88lH_|E)-SlAy}ZXRpUo;I3=0{Gs|amftoHV z2iVx-4m%l^bKLDB`re%}(aFCjh#k0|WX&L7B$O||5(uV%JZhA*gmmzgC*yzq%kx+YYMBps|;(ducm#X zN7cLO41sx+2KbW=t7{U8c4|m}YQ%49EO%<6Yiep^YUcOU9M$x^==7rg^pfB7${9Px zzhFxQfDWL5U;zO93$_R#Pl+H0apQ#^=KT+BfiTWeVuQRmBP|^M16y+E;u}p_NA1I< zK9>H4Eo+G@#l-t({GM~wUh?^tvtu_ylNXpkSeu{Xr}c$9Dc?)#AMhY`PmouzUxdF? za7-*qXhK*}WQt)xTt+5NVop+EYJp>PREzo|PJ#AM~DDnqHinTi952UEUG=y0*T#*}HoJK-xNpJ-j-G zoqRpNaJhPXu)Y05`~1`RWPxdRThs~x1&1Co1r|d95MJoE)qw{C_UTCq$G*Y$z62uk zA@0iX?qw!0FJ}?yl+(*5u>7evvzhua8O|dnQ4-Z(rjRN0>f(T`d42w|^KZT2Cy6R*~7_qd0?ve(WvOTl5bdtk3_GLVGX+G(=uM@UM4bFlka zGnke6aP#H#Cv43#1g)1NSJSa#$nBZ8CsP3DpgWn#$W8vRVP`7)nzMWF@!js68Lk#f z9vL4jrdXpc{Osv|dxhF^;iE%mJ>F)9-Om>hf?pTIgIN2Vw!hm-4ze{S9jS8#?wZnE z)oSB^`eO7B zEQwf+3uo$dkoBVkK;0v15W_g1))G%H8zbng4P*VGlm)a+BG+|5wLFAFJj;sQTvO08 zCUE8xAmub^$+$2GS=Z3{nP+XRaPCideu)n)1qJ@P$y0Q3Hj7Da`B0x=7CCvcE_SI? z^++CctY;mRaX8wN9MCZjQ=VjFyc70uz-=YIH>f z+av|b%Q@svn66uYTnDakaK~j5)|Af)dt)RYB~t`(_j+Ho+n4<&Oo z?>DHx7~$caUnytBRh>HTefpPPW6eI-5MHd{JNLgT7*{7D<*KUsoadHX+f4UJcQZ~g z9&|GSr2m&58UN}L2Dtct^!OKk`qF}!{(+y&XgG*FJvM*g=ZA)`HAo(paB+M{GuvUv zSjjvZuW-yH#0}d2p;iRyQQ2(TD_rBXaT_u#-QdGP1>RO}@%zX#c*)ses6?{|xA6@z z^$!X+0Y#}fM#OPPCw_{JPZdqd;7dtM%gkfS&dJFyrVc19FR35}mqVbnxM9_e33V-1 zP1P-RW$o>q72Q3(eVGk|W9h@uZR10eA=5LnbFT9Xi{EXRS60{bH#WDnWA+Zc4-Ae@ zPt=f4ug+Dj?rvlU?lvF9cOS=|Eq*^DX-k5|LwK*q`6BSX^oGq)WCyh=@4bp9=79F0 ztHAeB!>CrhyRJCRN0W%fvx%a3CC1a3^gb$Mq?F2|z8Bguzv3=$%fqyOYKpq~p&Ts` zM$G_qu8>XrkjHxmQD;>P(bUrA%O)-!f*6z&R8c(Gb~JF~7k!6%RL_Jv{=py%ONk%rM9KBA!V;KYIz_C{+@>G6i)Dp#z4 zN%6_;V8PAEh|sw+-(;kFve3eyD^qQ4`f^p>@B_K@$tJEakzqiQ*!4MEN3j@j_HX!~ zFNjk92&OJ5K`0c~pM5d5GQNQN4uWVxi`)8kJP?%86#!JW=-3f7KImAH^wAK^D2D7~ zjA&+PBt{H-2N^~z&x9a)9QRrqT09?25G_IQX$&>-6Q&Sqk|@PEO0qa>1xkv7FgZ%< zXJ7?#nv8A~a=MP~2~viSBQ zfl%Q8WP<=U$J9kA45OexD6(e7L@16Eo&c2C1EGLYC*5e9vS>%3Re8P()C%JDBx_sY zl0RVug%+_|Rt9BboI(v}C@RxiwqWKpO~CQfa?Kaavzh@-3j6vf>KOa{s|n6^#+sRr z>-J3sigFIgbB1~r)oYG+4z2Gku^bcj;wdj$4=sP$b{suTIL4gzP|~&Dc#wVVZdj`1 z?7o3kT=x8EIIZnL`kBMkgVuY>*pGpwUpIg&;#WIFSl(IJ|4NUlzMa%e|GKS8qKjwj zEr^nL_>HG;!w5s=2G1miQ77*>m#b*w`1=K_cg-F?x%HDm`&4{$A|fKJ6JmDjjbmT9 zeEFsn-gfdW%1(+lPYba5H_u7x=$25!sxT|@f0 zWyx&+PxGcHXtQO}KPInr2Xt%Dw(FbYV1@X<4G1G30$>4Sb%hceVa|q4>4yH5 z@2mYW&0FkhjmD9)Y7t`ijI{gBYvft!pA-SsL8OKu4x#v*5uhmCSm*dx;fWr}8fi(% zS>Eyfxjv!bfS}akIM?zJ*D@$XKc=R{q#;(npgCKuJyET?t3$Rg4cI%_|8X?y^T@=Q z-OP~C^f!BKonfc9OM)9enXVt6(*>OV zNV+(H(|q0`Q=IKO7UCfa%?SAgU#$;Oh;iOPm?h!61F;lFckf7D#+s6;X&5CRKVi$! zu?tNkdL@wqvv>_(u72TKVdv3EKKX$f#uSPfG@f?aacyKu*(6C!guj}9s`zZp*_2&d z!d+0%U^dZC@v?8 z^_B}$hJcWw6yM}}wFpO7Lv>M*!-8oYl`es~GFG-)xk*Q`WX)fc;~G?LcN; zU4T}HnL~HHO(k&;_rq-e(5s@6>yGu5!C>%?f)Pp}d(rGI$9pl{BP)A^yi3;malG@9`|+Yn z5VHhv)T})s36jVnQH4`P*bgDIxk4RZVh0swQicMY^oxcxj?x0ET&{>5YtK zmWXOpS(0rHhGmW;HHKBLCF`f79N7)>gIu3AFUtbX8;s)=51i;?a5!qTbrCz~1SC5C zqmM;lGJ)>rQn|yZlb9qR@TBaWEv7A`D86H_yiC#C23lT}4XrF2pg4tAN$9dxHpKg| z)pX7P?W$7<5UQ#Na4KQABd9U<4ePy#>!+2&6zlfYvrjO|h6%$-`=&ufIgZwu5XzdC zbxu7;oE6I$$&S4Mxr_GGhUc25!vPV=4%kG{*B+i7z1r@lrt3i5u_WFJzEx+2)w=w#>Em#T9^_?t|>oqmsO`oia)Z0W| z3rvD+N6H-4g(J#6xq*>|QP`{)GZ`D+)OjcE6OIwx{$=`1f33kTSCI>U|D+>emUid6o?nP>pp7{w(lN|CD$Xj#G(OqLDN#u^B}?5i zT{xrDuSyPb712jB;4GV0@-y zl5l2$H1`|P;^Hz#%j)1d$JY4V4$j`#(huCtqt;>=*Lly?{7v^A!P!IQ!LR3wUv$4a ziSa^ug29*);$y4^pTet%gay%6l0Ul=OWqfIvcvaFJV|rB-Q4Q?WfU05l|{!#cO}zF z)DVNn-<8T_`|{5ZW}zPpr->4e=aQ=@Dtf(+nZNc{VJRpCBnvyZs&7tLSY`r;bkSfM zHHP{<$m^)A$_*M|f-iPb_IUE_tM3l&8q#3cIe%PJOAr{YdWGkWGKJ1{cojoFQ|cDm%ir z)p|>oYu%sh<0<^^uJ(97MtsIG6LdagOce-o91wDXk(S6!#eE37y`ax^Mcv-z?>Su= zb}e_z=k?z0+6GzUD!!l(JxF$GX25%n;Ji*R7WMCkp{Zbjga`ox46OhVBI<|ngdE_%ldV=iVE zWMwH~kg+`}Obu~5Db4b!J1Nhzy*hzpdH`7~%JO|!OQ0>f(7c)vOuMS47TMG4TF0o< z8p8{iU5(@mt9|kSNu^c%2qRWi1bl)&#Nu|&EP0B)w{j^U_TGMozPlnr9f@2j8dq!HP=kY)>+E+7`ZRL z2-y5;YkDNtveNBupuaSwpkT1DN1$LhcXOU=G!5vf0*~W|RP7GaI_ejVa)rm9jrT)0 z4!S#f`#dmWxK`{(Uis27E)1LNNVrI+#Nc zFZ$Os;^P8e?*E-eq-?p@T#CNA>&S6J`DYp-ZJgzYQ4mt*2DIR)?S&nWmsyr)r_a^TA_0@VsGGa!JH9ndBYmH?(TDM4uXdAR`PZ z&a28UL`~+Dn@;$BYCK9K5d`%tw!4PT7KEC-6T}3X8|$4;f>WDV7U!Z}LHG7Ma)Js5pMnXk29(>b z--Oc;%aJgQ*8kwNWVFK}-fcKy$`XkANWa^7f>9`4$vL>wbh=n+#znUC#CNt*Ns0&g z^T_Y`z1myv;g2sL62br_Ay-d3!uf$;#=8t`geSw31tdLj$JZPWXJ6l)U0mFYcr{S9 zr5M@1h%VyJE~7bIZZXL{3Z5)$$x3{9iHAR(M|{KB|1+u*gh;n2;fIPDY8-MmHV2l# zl@P>vg{|nN7)Cmon1tTbqt&(*%jf>id zd`m`t6B(XBU$a}3D1m2VLM4O4f*SvA2j4sexFkK6DyoT*&mi3cVQ_`IRqST8-P4r? znSc5nvkMwzcsfxV=<%^KnmhzWlA2feB{)8&c(7q1 z6!-9!x2^cuy=~e6>*2L`p$<6KUzj#S@~D<_*t(?W%P)IT`sAqk{*A)q5abZf{>O#? zcXwn*((#|&5xL_(C@d%2i9N^h@9t=3+7I{i@9t>jiag;>k;}LrZ9(^6adAl0)Q){&3Pz5bMy4(x+fK4MuWQ$_TyOmgW=IK)VVBg`X}5Rx2|pbl zpPv83JX|Ab%NPSf!jb9NAx^Y3Ae=|>*fuM=FCrvd1LKfu_^Z))Yiw%dlX}|mk8hMP zffWtWW9hUy1Lk)whrkqmgQckoHO5&^k-+&o7NW?pq%S#C3Q#we1qQ_esc2RW^zTrq zTGMG~q7%&;-QJ~Rmv6{l&X0C=fHlD+W z%VD+U>;6bZ=R@aK))4}3fa9-F_YoE%r2s!l*U8y@$v2Ff0}Zg03bWQ4JCOs8EsbDY z_#cADp2OLguO$IU&kq-W`rhbUe*7c*pfWd(+x8Lu0{`{L(})NWdjC1tH7bOLxt@KD z1{WuvK{C{dM{-wNOkbN;kfLSSB!YSXsfdB@g&~Mt79F)Onz<%@3BWcYXo|zLgx(kX zzR%h$POwJ2FJAm1G6Wz_!a|QKMpAK*M2uH)kRmU&bC9AgwHg$!Zs}c|CTn|Qk*enN zXpvwN&2kuPk!@ocVFRsT40Gr>ISg^0U?~rBU$ZIqM?R=1&p&s6JOWFFM=%sdqUsnF zMDcgfyG97JR>TeR2%nTj&y%o}{)`NZDHxLX+AJ$h)xHrGOVYRwW=xp z={q1`30kR+JOw?iO?^3FtsAmkRjq9&sXU8^lhWp#HOyH?D>p5^oG3T1YzaBEY~;%- zx9(72DYqR+tSYr11J@Nh&Th1oI;-E6+AWs`Hz5klx0gb%fY=gJqO8DwbvJbq@Q95~~1^M~Qaabffz{?V zhZDa!815@@y$S1P72msxdioW~BxwjPru5JgIzG_k1t0FmzLRA*&NJG%10aPO3M2pf zy!eI?3a|pG{5PfJh2#CRQ~YrBV$2N86Uet-OU;AzywMwQJ0Gj69&GD^ms8`&9H9FT zoBvo*6V{qKTp%Y_O#8l{mTBSWxp~}5LXu$g1E!NUQv-6i7a_WwF>`-@oq~JG2n&h8igJiSiF1xfN)AkQ_sz(3&G!D9=WhirG%60(D=Sy42ve%6)~>D7Z-{DY zZWL}yGVYA)?rGug@9h|B=Np9%PLxbdr;W_T_bmi`U-Fq>brjoJUf(v{+H+a?A$f4D z3p+hIy5JDMRz1ICeE3Op`*id8v-OGi`wwoUL=QSZj*=RT%XY-SO zrZap~D&`H3B9YLI@mK`Y`?5Q-m;*644wafvp++j=3@(QyB2Tr$FXip1F(w$cq2)d3ny8mHQhCYwFOYb3{O zX3pnZuhN&#bc)^GQ8h(8b&dKpc5$R~$gWIBZOAY0-7~L@I+BRR)~4DUk7mJ=G1Lkj zO(zQwwMxV3j^@+lIO5)AC;pADfI^UAgG<4Zoi?16TZL!O9J8n2qY_8L5g)&J0U;DM|VK5KWMw506ZC5 z(2J1sE{L45a3>sv4l?9NLt$+ag^(Xf7pR0+XBzaHtoLyh5|V7i##xqn`Sxy4o!T>omS1vev`18 zgM8x)-0hI(fhN}%pk$|*`7>+X-NVE=&V#KTs4W`i>i{_~!$RyDThpl!K`=uJ7w~#H#Km&B(Pcrs@^1ET4w19FkxxY%osHWjsn{ zanw>V%rL46p{ITD9p8Tobm2GuX7u|PdHfAsH{G07)nCwA<}h|QN2vN|G_>*qnY#^^ z4~KhnZQ(1*K)slrRUXHH66_cFijd4Jx$w@(4d_E%#>fvrtD(6Xl;`PXy+K;-`b DwI{5l diff --git a/src/components/loading/loading.js b/src/components/loading/loading.js index 9a9aa3ca7d..f36e41f44d 100644 --- a/src/components/loading/loading.js +++ b/src/components/loading/loading.js @@ -1,10 +1,6 @@ -define(['components/loading/loadingLegacy', 'browser', 'css!./loading'], function (loadingLegacy, browser) { +define(['css!./loading'], function () { 'use strict'; - if (browser.tizen || browser.operaTv || browser.chromecast || browser.orsay || browser.web0s || browser.ps4) { - return loadingLegacy; - } - var loadingElem; var layer1; var layer2; diff --git a/src/components/loading/loadingLegacy.css b/src/components/loading/loadingLegacy.css deleted file mode 100644 index 17ea94950e..0000000000 --- a/src/components/loading/loadingLegacy.css +++ /dev/null @@ -1,10 +0,0 @@ -.loading-spinner { - margin-top: -3em; - margin-left: -3em; - width: 6em; - height: 6em; - position: fixed; - top: 50%; - left: 50%; - z-index: 9999999; -} diff --git a/src/components/loading/loadingLegacy.js b/src/components/loading/loadingLegacy.js deleted file mode 100644 index d766a4aca4..0000000000 --- a/src/components/loading/loadingLegacy.js +++ /dev/null @@ -1,28 +0,0 @@ -define(['require', 'css!./loadingLegacy'], function (require) { - 'use strict'; - - var loadingElem; - - return { - show: function () { - var elem = loadingElem; - if (!elem) { - elem = document.createElement('img'); - elem.src = require.toUrl('.').split('?')[0] + '/loader.gif'; - - loadingElem = elem; - elem.classList.add('loading-spinner'); - - document.body.appendChild(elem); - } - - elem.classList.remove('hide'); - }, - hide: function () { - var elem = loadingElem; - if (elem) { - elem.classList.add('hide'); - } - } - }; -}); From c5e2bbf87fa55e76fea264e663a576af6bd1dfac Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Fri, 26 Jun 2020 17:31:48 +0300 Subject: [PATCH 038/244] apply suggestion --- src/components/mediaLibraryEditor/mediaLibraryEditor.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/mediaLibraryEditor/mediaLibraryEditor.js b/src/components/mediaLibraryEditor/mediaLibraryEditor.js index 7996867b2e..332c9a410f 100644 --- a/src/components/mediaLibraryEditor/mediaLibraryEditor.js +++ b/src/components/mediaLibraryEditor/mediaLibraryEditor.js @@ -247,5 +247,5 @@ export class editor { let hasChanges = false; let isCreating = false; - /* eslint-enable indent */ +/* eslint-enable indent */ export default editor; From daedd3a61d33df9a52ff096daf12c80e62b72060 Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Fri, 26 Jun 2020 19:30:44 +0300 Subject: [PATCH 039/244] apply suggestion --- .../mediaLibraryCreator.js | 58 +++++++++---------- .../mediaLibraryEditor/mediaLibraryEditor.js | 58 +++++++++---------- src/controllers/dashboard/mediaLibrary.js | 4 +- 3 files changed, 58 insertions(+), 62 deletions(-) diff --git a/src/components/mediaLibraryCreator/mediaLibraryCreator.js b/src/components/mediaLibraryCreator/mediaLibraryCreator.js index 6940da1baf..c1b7453ca9 100644 --- a/src/components/mediaLibraryCreator/mediaLibraryCreator.js +++ b/src/components/mediaLibraryCreator/mediaLibraryCreator.js @@ -194,37 +194,35 @@ import 'flexStyles'; }); } -export class editor { - constructor() { - this.show = options => { - return new Promise((resolve) => { - currentOptions = options; - currentResolve = resolve; - hasChanges = false; - import('text!./components/mediaLibraryCreator/mediaLibraryCreator.template.html').then(({default: template}) => { - const dlg = dialogHelper.createDialog({ - size: 'small', - modal: false, - removeOnClose: true, - scrollY: false - }); - dlg.classList.add('ui-body-a'); - dlg.classList.add('background-theme-a'); - dlg.classList.add('dlg-librarycreator'); - dlg.classList.add('formDialog'); - dlg.innerHTML = globalize.translateDocument(template); - initEditor(dlg, options.collectionTypeOptions); - dlg.addEventListener('close', onDialogClosed); - dialogHelper.open(dlg); - dlg.querySelector('.btnCancel').addEventListener('click', () => { - dialogHelper.close(dlg); - }); - pathInfos = []; - renderPaths(dlg); - initLibraryOptions(dlg); +export class showEditor { + constructor(options) { + return new Promise((resolve) => { + currentOptions = options; + currentResolve = resolve; + hasChanges = false; + import('text!./components/mediaLibraryCreator/mediaLibraryCreator.template.html').then(({default: template}) => { + const dlg = dialogHelper.createDialog({ + size: 'small', + modal: false, + removeOnClose: true, + scrollY: false }); + dlg.classList.add('ui-body-a'); + dlg.classList.add('background-theme-a'); + dlg.classList.add('dlg-librarycreator'); + dlg.classList.add('formDialog'); + dlg.innerHTML = globalize.translateDocument(template); + initEditor(dlg, options.collectionTypeOptions); + dlg.addEventListener('close', onDialogClosed); + dialogHelper.open(dlg); + dlg.querySelector('.btnCancel').addEventListener('click', () => { + dialogHelper.close(dlg); + }); + pathInfos = []; + renderPaths(dlg); + initLibraryOptions(dlg); }); - }; + }); } } @@ -235,4 +233,4 @@ export class editor { let isCreating = false; /* eslint-enable indent */ -export default editor; +export default showEditor; diff --git a/src/components/mediaLibraryEditor/mediaLibraryEditor.js b/src/components/mediaLibraryEditor/mediaLibraryEditor.js index 332c9a410f..4577b67131 100644 --- a/src/components/mediaLibraryEditor/mediaLibraryEditor.js +++ b/src/components/mediaLibraryEditor/mediaLibraryEditor.js @@ -209,36 +209,34 @@ import 'flexStyles'; currentDeferred.resolveWith(null, [hasChanges]); } -export class editor { - constructor() { - this.show = options => { - const deferred = jQuery.Deferred(); - currentOptions = options; - currentDeferred = deferred; - hasChanges = false; - import('text!./components/mediaLibraryEditor/mediaLibraryEditor.template.html').then(({default: template}) => { - const dlg = dialogHelper.createDialog({ - size: 'small', - modal: false, - removeOnClose: true, - scrollY: false - }); - dlg.classList.add('dlg-libraryeditor'); - dlg.classList.add('ui-body-a'); - dlg.classList.add('background-theme-a'); - dlg.classList.add('formDialog'); - dlg.innerHTML = globalize.translateDocument(template); - dlg.querySelector('.formDialogHeaderTitle').innerHTML = options.library.Name; - initEditor(dlg, options); - dlg.addEventListener('close', onDialogClosed); - dialogHelper.open(dlg); - dlg.querySelector('.btnCancel').addEventListener('click', () => { - dialogHelper.close(dlg); - }); - refreshLibraryFromServer(dlg); +export class showEditor { + constructor(options) { + const deferred = jQuery.Deferred(); + currentOptions = options; + currentDeferred = deferred; + hasChanges = false; + import('text!./components/mediaLibraryEditor/mediaLibraryEditor.template.html').then(({default: template}) => { + const dlg = dialogHelper.createDialog({ + size: 'small', + modal: false, + removeOnClose: true, + scrollY: false }); - return deferred.promise(); - }; + dlg.classList.add('dlg-libraryeditor'); + dlg.classList.add('ui-body-a'); + dlg.classList.add('background-theme-a'); + dlg.classList.add('formDialog'); + dlg.innerHTML = globalize.translateDocument(template); + dlg.querySelector('.formDialogHeaderTitle').innerHTML = options.library.Name; + initEditor(dlg, options); + dlg.addEventListener('close', onDialogClosed); + dialogHelper.open(dlg); + dlg.querySelector('.btnCancel').addEventListener('click', () => { + dialogHelper.close(dlg); + }); + refreshLibraryFromServer(dlg); + }); + return deferred.promise(); } } @@ -248,4 +246,4 @@ export class editor { let isCreating = false; /* eslint-enable indent */ -export default editor; +export default showEditor; diff --git a/src/controllers/dashboard/mediaLibrary.js b/src/controllers/dashboard/mediaLibrary.js index ed6aabc8fd..d9b288c62a 100644 --- a/src/controllers/dashboard/mediaLibrary.js +++ b/src/controllers/dashboard/mediaLibrary.js @@ -3,7 +3,7 @@ define(['jQuery', 'apphost', 'scripts/taskbutton', 'loading', 'libraryMenu', 'gl function addVirtualFolder(page) { require(['medialibrarycreator'], function (medialibrarycreator) { - new medialibrarycreator.default().show({ + new medialibrarycreator.showEditor({ collectionTypeOptions: getCollectionTypeOptions().filter(function (f) { return !f.hidden; }), @@ -18,7 +18,7 @@ define(['jQuery', 'apphost', 'scripts/taskbutton', 'loading', 'libraryMenu', 'gl function editVirtualFolder(page, virtualFolder) { require(['medialibraryeditor'], function (medialibraryeditor) { - new medialibraryeditor.default().show({ + new medialibraryeditor.showEditor({ refresh: shouldRefreshLibraryAfterChanges(page), library: virtualFolder }).then(function (hasChanges) { From 7fe80dcbf14be43a1e56f43aadd67a5264c34191 Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Fri, 26 Jun 2020 21:15:00 +0300 Subject: [PATCH 040/244] apply suggestion --- .../imageOptionsEditor/imageOptionsEditor.js | 42 +++++++++---------- .../libraryoptionseditor.js | 5 +-- 2 files changed, 22 insertions(+), 25 deletions(-) diff --git a/src/components/imageOptionsEditor/imageOptionsEditor.js b/src/components/imageOptionsEditor/imageOptionsEditor.js index 2a3022b0da..8177e1b779 100644 --- a/src/components/imageOptionsEditor/imageOptionsEditor.js +++ b/src/components/imageOptionsEditor/imageOptionsEditor.js @@ -89,31 +89,29 @@ import 'emby-input'; }); } -export class editor { - constructor() { - this.show = (itemType, options, availableOptions) => { - return import('text!./components/imageOptionsEditor/imageOptionsEditor.template.html').then(({default: template}) => { - return new Promise((resolve) => { - const dlg = dialogHelper.createDialog({ - size: 'small', - removeOnClose: true, - scrollY: false - }); - dlg.classList.add('formDialog'); - dlg.innerHTML = globalize.translateDocument(template); - dlg.addEventListener('close', () => { - saveValues(dlg, options); - }); - loadValues(dlg, itemType, options, availableOptions); - dialogHelper.open(dlg).then(resolve, resolve); - dlg.querySelector('.btnCancel').addEventListener('click', () => { - dialogHelper.close(dlg); - }); +export class showEditor { + constructor(itemType, options, availableOptions) { + return import('text!./components/imageOptionsEditor/imageOptionsEditor.template.html').then(({default: template}) => { + return new Promise((resolve) => { + const dlg = dialogHelper.createDialog({ + size: 'small', + removeOnClose: true, + scrollY: false + }); + dlg.classList.add('formDialog'); + dlg.innerHTML = globalize.translateDocument(template); + dlg.addEventListener('close', () => { + saveValues(dlg, options); + }); + loadValues(dlg, itemType, options, availableOptions); + dialogHelper.open(dlg).then(resolve, resolve); + dlg.querySelector('.btnCancel').addEventListener('click', () => { + dialogHelper.close(dlg); }); }); - }; + }); } } /* eslint-enable indent */ -export default editor; +export default showEditor; diff --git a/src/components/libraryoptionseditor/libraryoptionseditor.js b/src/components/libraryoptionseditor/libraryoptionseditor.js index 8b365e51ae..f7c1ff1361 100644 --- a/src/components/libraryoptionseditor/libraryoptionseditor.js +++ b/src/components/libraryoptionseditor/libraryoptionseditor.js @@ -306,7 +306,7 @@ import 'emby-input'; } function showImageOptionsForType(type) { - import('imageoptionseditor').then(({default: ImageOptionsEditor}) => { + import('imageoptionseditor').then(ImageOptionsEditor => { let typeOptions = getTypeOptions(currentLibraryOptions, type); if (!typeOptions) { typeOptions = { @@ -315,8 +315,7 @@ import 'emby-input'; currentLibraryOptions.TypeOptions.push(typeOptions); } const availableOptions = getTypeOptions(currentAvailableOptions || {}, type); - const imageOptionsEditor = new ImageOptionsEditor(); - imageOptionsEditor.show(type, typeOptions, availableOptions); + new ImageOptionsEditor.showEditor(type, typeOptions, availableOptions); }); } From cf931d429a1913e6272d7347a41817dc199e68ae Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Fri, 26 Jun 2020 21:39:47 +0300 Subject: [PATCH 041/244] apply suggestion --- src/components/collectionEditor/collectionEditor.js | 6 +++--- src/components/itemContextMenu.js | 4 ++-- src/components/multiSelect/multiSelect.js | 4 ++-- src/components/playlisteditor/playlisteditor.js | 6 +++--- src/components/remotecontrol/remotecontrol.js | 2 +- src/controllers/list.js | 2 +- src/controllers/movies/moviecollections.js | 2 +- src/scripts/playlists.js | 2 +- 8 files changed, 14 insertions(+), 14 deletions(-) diff --git a/src/components/collectionEditor/collectionEditor.js b/src/components/collectionEditor/collectionEditor.js index a6bdc51eeb..18cc0d311f 100644 --- a/src/components/collectionEditor/collectionEditor.js +++ b/src/components/collectionEditor/collectionEditor.js @@ -218,8 +218,8 @@ import 'flexStyles'; }); } - class CollectionEditor { - show(options) { + export class showEditor { + constructor(options) { const items = options.items || {}; currentServerId = options.serverId; @@ -285,4 +285,4 @@ import 'flexStyles'; } /* eslint-enable indent */ -export default CollectionEditor; +export default showEditor; diff --git a/src/components/itemContextMenu.js b/src/components/itemContextMenu.js index e969721d64..89834eefcc 100644 --- a/src/components/itemContextMenu.js +++ b/src/components/itemContextMenu.js @@ -319,7 +319,7 @@ define(['apphost', 'globalize', 'connectionManager', 'itemHelper', 'appRouter', switch (id) { case 'addtocollection': require(['collectionEditor'], function (collectionEditor) { - new collectionEditor.default().show({ + new collectionEditor.showEditor({ items: [itemId], serverId: serverId }).then(getResolveFunction(resolve, id, true), getResolveFunction(resolve, id)); @@ -327,7 +327,7 @@ define(['apphost', 'globalize', 'connectionManager', 'itemHelper', 'appRouter', break; case 'addtoplaylist': require(['playlistEditor'], function (playlistEditor) { - new playlistEditor.default().show({ + new playlistEditor.showEditor({ items: [itemId], serverId: serverId }).then(getResolveFunction(resolve, id, true), getResolveFunction(resolve, id)); diff --git a/src/components/multiSelect/multiSelect.js b/src/components/multiSelect/multiSelect.js index 4919b9dd34..05a2b68f42 100644 --- a/src/components/multiSelect/multiSelect.js +++ b/src/components/multiSelect/multiSelect.js @@ -255,7 +255,7 @@ define(['browser', 'appStorage', 'apphost', 'loading', 'connectionManager', 'glo switch (id) { case 'addtocollection': require(['collectionEditor'], function (collectionEditor) { - new collectionEditor.default().show({ + new collectionEditor.showEditor({ items: items, serverId: serverId }); @@ -265,7 +265,7 @@ define(['browser', 'appStorage', 'apphost', 'loading', 'connectionManager', 'glo break; case 'playlist': require(['playlistEditor'], function (playlistEditor) { - new playlistEditor.default().show({ + new playlistEditor.showEditor({ items: items, serverId: serverId }); diff --git a/src/components/playlisteditor/playlisteditor.js b/src/components/playlisteditor/playlisteditor.js index 283acfd0fe..7b1e915e1f 100644 --- a/src/components/playlisteditor/playlisteditor.js +++ b/src/components/playlisteditor/playlisteditor.js @@ -216,8 +216,8 @@ import 'emby-button'; }); } - class PlaylistEditor { - show(options) { + export class showEditor { + constructor(options) { const items = options.items || {}; currentServerId = options.serverId; @@ -276,4 +276,4 @@ import 'emby-button'; } /* eslint-enable indent */ -export default PlaylistEditor; +export default showEditor; diff --git a/src/components/remotecontrol/remotecontrol.js b/src/components/remotecontrol/remotecontrol.js index b1cc84f81e..86273c89ed 100644 --- a/src/components/remotecontrol/remotecontrol.js +++ b/src/components/remotecontrol/remotecontrol.js @@ -589,7 +589,7 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL require(['playlistEditor'], function (playlistEditor) { getSaveablePlaylistItems().then(function (items) { var serverId = items.length ? items[0].ServerId : ApiClient.serverId(); - new playlistEditor.default().show({ + new playlistEditor.showEditor({ items: items.map(function (i) { return i.Id; }), diff --git a/src/controllers/list.js b/src/controllers/list.js index f5af412cd1..401df3f4d1 100644 --- a/src/controllers/list.js +++ b/src/controllers/list.js @@ -386,7 +386,7 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager' var instance = this; require(['playlistEditor'], function (playlistEditor) { - new playlistEditor.default().show({ + new playlistEditor.showEditor({ items: [], serverId: instance.params.serverId }); diff --git a/src/controllers/movies/moviecollections.js b/src/controllers/movies/moviecollections.js index bc47eecd2d..65abca46e0 100644 --- a/src/controllers/movies/moviecollections.js +++ b/src/controllers/movies/moviecollections.js @@ -242,7 +242,7 @@ define(['loading', 'events', 'libraryBrowser', 'imageLoader', 'listView', 'cardB tabContent.querySelector('.btnNewCollection').addEventListener('click', function () { require(['collectionEditor'], function (collectionEditor) { var serverId = ApiClient.serverInfo().Id; - new collectionEditor.default().show({ + new collectionEditor.showEditor({ items: [], serverId: serverId }); diff --git a/src/scripts/playlists.js b/src/scripts/playlists.js index 7e5ec7ae4a..a1868d3131 100644 --- a/src/scripts/playlists.js +++ b/src/scripts/playlists.js @@ -184,7 +184,7 @@ define(['loading', 'listView', 'cardBuilder', 'libraryMenu', 'libraryBrowser', ' view.querySelector('.btnNewPlaylist').addEventListener('click', function () { require(['playlistEditor'], function (playlistEditor) { var serverId = ApiClient.serverInfo().Id; - new playlistEditor.default().show({ + new playlistEditor.showEditor({ items: [], serverId: serverId }); From 44320ef50526bf68154cbc490e4a88f9bf378da5 Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Fri, 26 Jun 2020 23:16:10 +0300 Subject: [PATCH 042/244] apply suggestion --- src/components/dialogHelper/dialogHelper.js | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/src/components/dialogHelper/dialogHelper.js b/src/components/dialogHelper/dialogHelper.js index 73aee88f0f..ca7c94a416 100644 --- a/src/components/dialogHelper/dialogHelper.js +++ b/src/components/dialogHelper/dialogHelper.js @@ -40,7 +40,7 @@ import 'scrollStyles'; try { parentNode.removeChild(elem); } catch (err) { - console.error(`error removing dialog element: ${err}`); + console.error('error removing dialog element: ' + err); } } } @@ -496,13 +496,15 @@ import 'scrollStyles'; return dlg; } + export function setOnOpen(val) { + globalOnOpenCallback = val; + } + /* eslint-enable indent */ export default { open: open, close: close, createDialog: createDialog, - setOnOpen: function (val) { - globalOnOpenCallback = val; - } + setOnOpen: setOnOpen }; From fbdd2328694e75b6a8b10479bc447770b9f605c9 Mon Sep 17 00:00:00 2001 From: Influence365 Date: Tue, 16 Jun 2020 18:42:55 +0100 Subject: [PATCH 043/244] Migrate htmlMediaHelper to ES6 fix typo --- package.json | 1 + src/components/htmlMediaHelper.js | 64 ++++++++++++------------------- 2 files changed, 26 insertions(+), 39 deletions(-) diff --git a/package.json b/package.json index da51190354..00dfd9be76 100644 --- a/package.json +++ b/package.json @@ -114,6 +114,7 @@ "src/components/playback/remotecontrolautoplay.js", "src/components/playback/volumeosd.js", "src/components/playlisteditor/playlisteditor.js", + "src/components/htmlMediaHelper.js", "src/components/playmenu.js", "src/components/sanatizefilename.js", "src/components/scrollManager.js", diff --git a/src/components/htmlMediaHelper.js b/src/components/htmlMediaHelper.js index 3f17eeb336..4ff44cdcf9 100644 --- a/src/components/htmlMediaHelper.js +++ b/src/components/htmlMediaHelper.js @@ -1,17 +1,22 @@ -define(['appSettings', 'browser', 'events'], function (appSettings, browser, events) { +/* eslint-disable indent */ + +import appSettings from 'appSettings' ; +import browser from 'browser'; +import events from 'events'; + 'use strict'; - function getSavedVolume() { + export function getSavedVolume() { return appSettings.get('volume') || 1; } - function saveVolume(value) { + export function saveVolume(value) { if (value) { appSettings.set('volume', value); } } - function getCrossOriginValue(mediaSource) { + export function getCrossOriginValue(mediaSource) { if (mediaSource.IsRemote) { return null; } @@ -30,7 +35,7 @@ define(['appSettings', 'browser', 'events'], function (appSettings, browser, eve return false; } - function enableHlsShakaPlayer(item, mediaSource, mediaType) { + export function enableHlsShakaPlayer(item, mediaSource, mediaType) { /* eslint-disable-next-line compat/compat */ if (!!window.MediaSource && !!MediaSource.isTypeSupported) { @@ -56,7 +61,7 @@ define(['appSettings', 'browser', 'events'], function (appSettings, browser, eve return false; } - function enableHlsJsPlayer(runTimeTicks, mediaType) { + export function enableHlsJsPlayer(runTimeTicks, mediaType) { if (window.MediaSource == null) { return false; @@ -98,7 +103,7 @@ define(['appSettings', 'browser', 'events'], function (appSettings, browser, eve var recoverDecodingErrorDate; var recoverSwapAudioCodecDate; - function handleHlsJsMediaError(instance, reject) { + export function handleHlsJsMediaError(instance, reject) { var hlsPlayer = instance._hlsPlayer; @@ -134,7 +139,7 @@ define(['appSettings', 'browser', 'events'], function (appSettings, browser, eve } } - function onErrorInternal(instance, type) { + export function onErrorInternal(instance, type) { // Needed for video if (instance.destroyCustomTrack) { @@ -148,7 +153,7 @@ define(['appSettings', 'browser', 'events'], function (appSettings, browser, eve ]); } - function isValidDuration(duration) { + export function isValidDuration(duration) { if (duration && !isNaN(duration) && duration !== Number.POSITIVE_INFINITY && duration !== Number.NEGATIVE_INFINITY) { return true; } @@ -162,7 +167,7 @@ define(['appSettings', 'browser', 'events'], function (appSettings, browser, eve } } - function seekOnPlaybackStart(instance, element, ticks, onMediaReady) { + export function seekOnPlaybackStart(instance, element, ticks, onMediaReady) { var seconds = (ticks || 0) / 10000000; @@ -200,7 +205,7 @@ define(['appSettings', 'browser', 'events'], function (appSettings, browser, eve } } - function applySrc(elem, src, options) { + export function applySrc(elem, src, options) { if (window.Windows && options.mediaSource && options.mediaSource.IsLocal) { @@ -228,7 +233,7 @@ define(['appSettings', 'browser', 'events'], function (appSettings, browser, eve elem.addEventListener('error', onErrorFn); } - function playWithPromise(elem, onErrorFn) { + export function playWithPromise(elem, onErrorFn) { try { var promise = elem.play(); @@ -256,7 +261,7 @@ define(['appSettings', 'browser', 'events'], function (appSettings, browser, eve } } - function destroyCastPlayer(instance) { + export function destroyCastPlayer(instance) { var player = instance._castPlayer; if (player) { @@ -270,7 +275,7 @@ define(['appSettings', 'browser', 'events'], function (appSettings, browser, eve } } - function destroyShakaPlayer(instance) { + export function destroyShakaPlayer(instance) { var player = instance._shakaPlayer; if (player) { try { @@ -283,7 +288,7 @@ define(['appSettings', 'browser', 'events'], function (appSettings, browser, eve } } - function destroyHlsPlayer(instance) { + export function destroyHlsPlayer(instance) { var player = instance._hlsPlayer; if (player) { try { @@ -296,7 +301,7 @@ define(['appSettings', 'browser', 'events'], function (appSettings, browser, eve } } - function destroyFlvPlayer(instance) { + export function destroyFlvPlayer(instance) { var player = instance._flvPlayer; if (player) { try { @@ -311,7 +316,7 @@ define(['appSettings', 'browser', 'events'], function (appSettings, browser, eve } } - function bindEventsToHlsPlayer(instance, hls, elem, onErrorFn, resolve, reject) { + export function bindEventsToHlsPlayer(instance, hls, elem, onErrorFn, resolve, reject) { hls.on(Hls.Events.MANIFEST_PARSED, function () { playWithPromise(elem, onErrorFn).then(resolve, function () { @@ -403,7 +408,7 @@ define(['appSettings', 'browser', 'events'], function (appSettings, browser, eve }); } - function onEndedInternal(instance, elem, onErrorFn) { + export function onEndedInternal(instance, elem, onErrorFn) { elem.removeEventListener('error', onErrorFn); @@ -427,7 +432,7 @@ define(['appSettings', 'browser', 'events'], function (appSettings, browser, eve instance._currentPlayOptions = null; } - function getBufferedRanges(instance, elem) { + export function getBufferedRanges(instance, elem) { var ranges = []; var seekable = elem.buffered || []; @@ -462,23 +467,4 @@ define(['appSettings', 'browser', 'events'], function (appSettings, browser, eve return ranges; } - return { - getSavedVolume: getSavedVolume, - saveVolume: saveVolume, - enableHlsJsPlayer: enableHlsJsPlayer, - enableHlsShakaPlayer: enableHlsShakaPlayer, - handleHlsJsMediaError: handleHlsJsMediaError, - isValidDuration: isValidDuration, - onErrorInternal: onErrorInternal, - seekOnPlaybackStart: seekOnPlaybackStart, - applySrc: applySrc, - playWithPromise: playWithPromise, - destroyHlsPlayer: destroyHlsPlayer, - destroyFlvPlayer: destroyFlvPlayer, - destroyCastPlayer: destroyCastPlayer, - bindEventsToHlsPlayer: bindEventsToHlsPlayer, - onEndedInternal: onEndedInternal, - getCrossOriginValue: getCrossOriginValue, - getBufferedRanges: getBufferedRanges - }; -}); + From d27fb43d682134a4c7a3d2ec47fe469648e5ff8b Mon Sep 17 00:00:00 2001 From: Influence365 Date: Tue, 16 Jun 2020 18:45:21 +0100 Subject: [PATCH 044/244] Migrate Groupedcards.js to ES6 --- package.json | 1 + src/components/groupedcards.js | 14 +++++++------- 2 files changed, 8 insertions(+), 7 deletions(-) diff --git a/package.json b/package.json index 00dfd9be76..24574d83d3 100644 --- a/package.json +++ b/package.json @@ -114,6 +114,7 @@ "src/components/playback/remotecontrolautoplay.js", "src/components/playback/volumeosd.js", "src/components/playlisteditor/playlisteditor.js", + "src/components/groupedcards.js", "src/components/htmlMediaHelper.js", "src/components/playmenu.js", "src/components/sanatizefilename.js", diff --git a/src/components/groupedcards.js b/src/components/groupedcards.js index 602c4310f4..2412e0f733 100644 --- a/src/components/groupedcards.js +++ b/src/components/groupedcards.js @@ -1,4 +1,9 @@ -define(['dom', 'appRouter', 'connectionManager'], function (dom, appRouter, connectionManager) { +/* eslint-disable indent */ + +import dom from 'dom'; +import appRouter from 'appRouter'; +import connectionManager from 'connectionManager'; + 'use strict'; function onGroupedCardClick(e, card) { @@ -31,15 +36,10 @@ define(['dom', 'appRouter', 'connectionManager'], function (dom, appRouter, conn } } - function onItemsContainerClick(e) { + export function onItemsContainerClick(e) { var groupedCard = dom.parentWithClass(e.target, 'groupedCard'); if (groupedCard) { onGroupedCardClick(e, groupedCard); } } - - return { - onItemsContainerClick: onItemsContainerClick - }; -}); From eab7ef00df508e1fcc2a29ade4b9f5f0d93a5eda Mon Sep 17 00:00:00 2001 From: Influence365 Date: Tue, 16 Jun 2020 18:46:54 +0100 Subject: [PATCH 045/244] Migrate themeLoader to ES6 fix bug remove console log Revert "remove console log" This reverts commit 944c1673df95b4047864f38a5e3c6fceb90b991c. Revert "Revert "remove console log"" This reverts commit 7b086194443b37a2515e17faaaa36e89161a9a5b. fix lint added eslint-enable indent fix lint fix lint remove console log Revert "remove console log" This reverts commit 944c1673df95b4047864f38a5e3c6fceb90b991c. Revert "Revert "remove console log"" This reverts commit 7b086194443b37a2515e17faaaa36e89161a9a5b. added eslint-enable indent fix lint --- package.json | 1 + src/components/groupedcards.js | 4 +-- src/components/htmlMediaHelper.js | 4 +-- src/scripts/themeLoader.js | 47 ++++++++++++++++--------------- 4 files changed, 29 insertions(+), 27 deletions(-) diff --git a/package.json b/package.json index 24574d83d3..16a94df5bf 100644 --- a/package.json +++ b/package.json @@ -142,6 +142,7 @@ "src/scripts/keyboardNavigation.js", "src/scripts/settings/appSettings.js", "src/scripts/settings/userSettings.js", + "src/scripts/themeLoader.js", "src/scripts/settings/webSettings.js" ], "plugins": [ diff --git a/src/components/groupedcards.js b/src/components/groupedcards.js index 2412e0f733..719a599a60 100644 --- a/src/components/groupedcards.js +++ b/src/components/groupedcards.js @@ -4,8 +4,6 @@ import dom from 'dom'; import appRouter from 'appRouter'; import connectionManager from 'connectionManager'; - 'use strict'; - function onGroupedCardClick(e, card) { var itemId = card.getAttribute('data-id'); var serverId = card.getAttribute('data-serverid'); @@ -43,3 +41,5 @@ import connectionManager from 'connectionManager'; onGroupedCardClick(e, groupedCard); } } + + /* eslint-enable indent */ diff --git a/src/components/htmlMediaHelper.js b/src/components/htmlMediaHelper.js index 4ff44cdcf9..062c80efa6 100644 --- a/src/components/htmlMediaHelper.js +++ b/src/components/htmlMediaHelper.js @@ -4,8 +4,6 @@ import appSettings from 'appSettings' ; import browser from 'browser'; import events from 'events'; - 'use strict'; - export function getSavedVolume() { return appSettings.get('volume') || 1; } @@ -467,4 +465,4 @@ import events from 'events'; return ranges; } - +/* eslint-enable indent */ diff --git a/src/scripts/themeLoader.js b/src/scripts/themeLoader.js index f75d6d0e29..b071ee6781 100644 --- a/src/scripts/themeLoader.js +++ b/src/scripts/themeLoader.js @@ -1,27 +1,30 @@ -define(['userSettings', 'skinManager', 'connectionManager', 'events'], function (userSettings, skinManager, connectionManager, events) { - 'use strict'; +import * as userSettings from 'userSettings'; +import skinManager from 'skinManager'; +import connectionManager from 'connectionManager'; +import events from 'events'; - var currentViewType; - pageClassOn('viewbeforeshow', 'page', function () { - var classList = this.classList; - var viewType = classList.contains('type-interior') || classList.contains('wizardPage') ? 'a' : 'b'; +var currentViewType; +pageClassOn('viewbeforeshow', 'page', function () { + var classList = this.classList; + var viewType = classList.contains('type-interior') || classList.contains('wizardPage') ? 'a' : 'b'; - if (viewType !== currentViewType) { - currentViewType = viewType; - var theme; - var context; + if (viewType !== currentViewType) { + currentViewType = viewType; + var theme; + var context; - if ('a' === viewType) { - theme = userSettings.dashboardTheme(); - context = 'serverdashboard'; - } else { - theme = userSettings.theme(); - } - - skinManager.setTheme(theme, context); + if ('a' === viewType) { + theme = userSettings.dashboardTheme(); + context = 'serverdashboard'; + } else { + theme = userSettings.theme(); } - }); - events.on(connectionManager, 'localusersignedin', function (e, user) { - currentViewType = null; - }); + + skinManager.setTheme(theme, context); + } }); + +events.on(connectionManager, 'localusersignedin', function (e, user) { + currentViewType = null; +}); + From c0c66dea5778ea0b36cf7b00828392b819ba7ebe Mon Sep 17 00:00:00 2001 From: dkanada Date: Sun, 28 Jun 2020 16:36:00 +0900 Subject: [PATCH 046/244] code style changes --- src/components/settingshelper.js | 8 +++--- .../subtitleappearancehelper.js | 3 ++- .../subtitlesettings/subtitlesettings.js | 26 +++++++++---------- 3 files changed, 18 insertions(+), 19 deletions(-) diff --git a/src/components/settingshelper.js b/src/components/settingshelper.js index 3bbff9d8ed..3db638c7ad 100644 --- a/src/components/settingshelper.js +++ b/src/components/settingshelper.js @@ -1,18 +1,16 @@ import globalize from 'globalize'; + /** - * Helper for handling settings + * Helper for handling settings. * @module components/settingsHelper */ -export function populateLanguages(select, languages) { +export function populateLanguages(select, languages) { let html = ''; html += "'; - for (let i = 0, length = languages.length; i < length; i++) { - const culture = languages[i]; - html += "'; } diff --git a/src/components/subtitlesettings/subtitleappearancehelper.js b/src/components/subtitlesettings/subtitleappearancehelper.js index d1c55e1aea..f710751376 100644 --- a/src/components/subtitlesettings/subtitleappearancehelper.js +++ b/src/components/subtitlesettings/subtitleappearancehelper.js @@ -1,7 +1,8 @@ /** - * Subtitle settings visual helper + * Subtitle settings visual helper. * @module components/subtitleSettings/subtitleAppearanceHelper */ + function getTextStyles(settings, isCue) { let list = []; diff --git a/src/components/subtitlesettings/subtitlesettings.js b/src/components/subtitlesettings/subtitlesettings.js index 0db6999ba9..73dddb9a2c 100644 --- a/src/components/subtitlesettings/subtitlesettings.js +++ b/src/components/subtitlesettings/subtitlesettings.js @@ -16,7 +16,7 @@ import 'emby-checkbox'; import 'flexStyles'; /** - * Subtitle settings + * Subtitle settings. * @module components/subtitleSettings/subtitleSettings */ @@ -40,7 +40,7 @@ function loadForm(context, user, userSettings, appearanceSettings, apiClient) { context.querySelector('.fldBurnIn').classList.remove('hide'); } - let selectSubtitleLanguage = context.querySelector( '#selectSubtitleLanguage' ); + let selectSubtitleLanguage = context.querySelector('#selectSubtitleLanguage'); settingsHelper.populateLanguages(selectSubtitleLanguage, allCultures); @@ -67,7 +67,7 @@ function loadForm(context, user, userSettings, appearanceSettings, apiClient) { function saveUser(context, user, userSettingsInstance, appearanceKey, apiClient) { - let appearanceSettings = userSettingsInstance.getSubtitleAppearanceSettings( appearanceKey ); + let appearanceSettings = userSettingsInstance.getSubtitleAppearanceSettings(appearanceKey); appearanceSettings = Object.assign(appearanceSettings, getSubtitleAppearanceObject(context)); userSettingsInstance.setSubtitleAppearanceSettings(appearanceSettings, appearanceKey); @@ -105,9 +105,9 @@ function save(instance, context, userId, userSettings, apiClient, enableSaveConf function onSubtitleModeChange(e) { - let view = dom.parentWithClass( e.target, 'subtitlesettings' ); + let view = dom.parentWithClass(e.target, 'subtitlesettings'); - let subtitlesHelp = view.querySelectorAll( '.subtitlesHelp' ); + let subtitlesHelp = view.querySelectorAll('.subtitlesHelp'); for (let i = 0, length = subtitlesHelp.length; i < length; i++) { subtitlesHelp[i].classList.add('hide'); } @@ -116,13 +116,13 @@ function onSubtitleModeChange(e) { function onAppearanceFieldChange(e) { - let view = dom.parentWithClass( e.target, 'subtitlesettings' ); + let view = dom.parentWithClass(e.target, 'subtitlesettings'); - let appearanceSettings = getSubtitleAppearanceObject( view ); + let appearanceSettings = getSubtitleAppearanceObject(view); let elements = { - window: view.querySelector( '.subtitleappearance-preview-window' ), - text: view.querySelector( '.subtitleappearance-preview-text' ) + window: view.querySelector('.subtitleappearance-preview-window'), + text: view.querySelector('.subtitleappearance-preview-text') }; subtitleAppearanceHelper.applyStyles(elements, appearanceSettings); @@ -176,14 +176,14 @@ export class SubtitleSettings { loading.show(); let userId = self.options.userId; - let apiClient = connectionManager.getApiClient( self.options.serverId ); + let apiClient = connectionManager.getApiClient(self.options.serverId); let 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 ); + let appearanceSettings = userSettings.getSubtitleAppearanceSettings(self.options.appearanceKey); loadForm(context, user, userSettings, appearanceSettings, apiClient); }); @@ -191,14 +191,14 @@ export class SubtitleSettings { } submit() { - this.onSubmit( null ); + this.onSubmit(null); } destroy() { this.options = null; } - onSubmit( e ) { + onSubmit(e) { const self = this; let apiClient = connectionManager.getApiClient(self.options.serverId); let userId = self.options.userId; From b2de904b5196953d9f9d75a3ba41649e896bcc42 Mon Sep 17 00:00:00 2001 From: Influence365 Date: Tue, 16 Jun 2020 18:46:54 +0100 Subject: [PATCH 047/244] Migrate themeLoader to ES6 --- src/scripts/themeLoader.js | 1 - 1 file changed, 1 deletion(-) diff --git a/src/scripts/themeLoader.js b/src/scripts/themeLoader.js index b071ee6781..3a3a60e565 100644 --- a/src/scripts/themeLoader.js +++ b/src/scripts/themeLoader.js @@ -27,4 +27,3 @@ pageClassOn('viewbeforeshow', 'page', function () { events.on(connectionManager, 'localusersignedin', function (e, user) { currentViewType = null; }); - From fd2d2a638615a17e9ea00ec9add3f514f9d6b81f Mon Sep 17 00:00:00 2001 From: MrTimscampi Date: Sun, 28 Jun 2020 09:38:06 +0200 Subject: [PATCH 048/244] Fix issue in eslintrc --- .eslintrc.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.eslintrc.js b/.eslintrc.js index ab53f0f03d..baf6d0e084 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -193,4 +193,4 @@ module.exports = { } } ] -} +}; From e663aecb3e80a2909a70ade18ff65d2c3e9a9441 Mon Sep 17 00:00:00 2001 From: dkanada Date: Sun, 28 Jun 2020 16:55:05 +0900 Subject: [PATCH 049/244] fix indentation --- src/components/groupedcards.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/groupedcards.js b/src/components/groupedcards.js index 719a599a60..543b295fea 100644 --- a/src/components/groupedcards.js +++ b/src/components/groupedcards.js @@ -42,4 +42,4 @@ import connectionManager from 'connectionManager'; } } - /* eslint-enable indent */ +/* eslint-enable indent */ From fc2c19d827d3add763de5b7be00b64eadd728191 Mon Sep 17 00:00:00 2001 From: dkanada Date: Thu, 2 Jul 2020 12:57:29 +0900 Subject: [PATCH 050/244] update error message --- src/components/alphaPicker/alphaPicker.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/alphaPicker/alphaPicker.js b/src/components/alphaPicker/alphaPicker.js index 576e35cb42..bd11afc7f1 100644 --- a/src/components/alphaPicker/alphaPicker.js +++ b/src/components/alphaPicker/alphaPicker.js @@ -252,7 +252,7 @@ import 'material-icons'; try { btn = element.querySelector(`.alphaPickerButton[data-value='${value}']`); } catch (err) { - console.error(`error in querySelector: ${err}`); + console.error('error in querySelector:', err); } if (btn && btn !== selected) { From 8af1a74fd288675aa878ac5569d6cc392a1c5c29 Mon Sep 17 00:00:00 2001 From: Cameron Date: Wed, 8 Jul 2020 16:19:44 +0100 Subject: [PATCH 051/244] migrate itemContextMenu and maintabmanager to ES6 modules --- package.json | 2 ++ src/components/itemContextMenu.js | 29 ++++++++++++++++++++--------- src/components/maintabsmanager.js | 22 +++++++++++----------- 3 files changed, 33 insertions(+), 20 deletions(-) diff --git a/package.json b/package.json index 230eee3f21..233bda9258 100644 --- a/package.json +++ b/package.json @@ -102,7 +102,9 @@ "src/components/channelMapper/channelMapper.js", "src/components/images/imageLoader.js", "src/components/indicators/indicators.js", + "src/components/itemContextMenu.js", "src/components/lazyLoader/lazyLoaderIntersectionObserver.js", + "src/components/maintabsmanager.js", "src/components/mediaLibraryCreator/mediaLibraryCreator.js", "src/components/mediaLibraryEditor/mediaLibraryEditor.js", "src/components/listview/listview.js", diff --git a/src/components/itemContextMenu.js b/src/components/itemContextMenu.js index 584b25f0e4..688ddd3490 100644 --- a/src/components/itemContextMenu.js +++ b/src/components/itemContextMenu.js @@ -1,7 +1,17 @@ -define(['apphost', 'globalize', 'connectionManager', 'itemHelper', 'appRouter', 'playbackManager', 'loading', 'appSettings', 'browser', 'actionsheet'], function (appHost, globalize, connectionManager, itemHelper, appRouter, playbackManager, loading, appSettings, browser, actionsheet) { - 'use strict'; +import appHost from 'apphost'; +import globalize from 'globalize'; +import connectionManager from 'connectionManager'; +import itemHelper from 'itemHelper'; +import appRouter from 'appRouter'; +import playbackManager from 'playbackManager'; +import loading from 'loading'; +import appSettings from 'appSettings'; +import browser from 'browser'; +import actionsheet from 'actionsheet'; - function getCommands(options) { +/* eslint-disable indent */ + + export function getCommands(options) { var item = options.item; var user = options.user; @@ -583,7 +593,7 @@ define(['apphost', 'globalize', 'connectionManager', 'itemHelper', 'appRouter', }); } - function show(options) { + export function show(options) { var commands = getCommands(options); if (!commands.length) { return Promise.reject(); @@ -598,8 +608,9 @@ define(['apphost', 'globalize', 'connectionManager', 'itemHelper', 'appRouter', }); } - return { - getCommands: getCommands, - show: show - }; -}); +/* eslint-enable indent */ + +export default { + getCommands: getCommands, + show: show +}; diff --git a/src/components/maintabsmanager.js b/src/components/maintabsmanager.js index e1c5434363..c73ebd97a8 100644 --- a/src/components/maintabsmanager.js +++ b/src/components/maintabsmanager.js @@ -1,5 +1,10 @@ -define(['dom', 'browser', 'events', 'emby-tabs', 'emby-button'], function (dom, browser, events) { - 'use strict'; +import dom from 'dom'; +import browser from 'browser'; +import events from 'events'; +import 'emby-tabs'; +import 'emby-button'; + +/* eslint-disable indent */ var tabOwnerView; var queryScope = document.querySelector('.skinHeader'); @@ -96,7 +101,7 @@ define(['dom', 'browser', 'events', 'emby-tabs', 'emby-button'], function (dom, }); } - function setTabs(view, selectedIndex, getTabsFn, getTabContainersFn, onBeforeTabChange, onTabChange, setSelectedIndex) { + export function setTabs(view, selectedIndex, getTabsFn, getTabContainersFn, onBeforeTabChange, onTabChange, setSelectedIndex) { var enableInFooter = enableTabsInFooter(); @@ -241,7 +246,7 @@ define(['dom', 'browser', 'events', 'emby-tabs', 'emby-button'], function (dom, }; } - function selectedTabIndex(index) { + export function selectedTabIndex(index) { var tabsContainerElem = headerTabsContainer; @@ -256,13 +261,8 @@ define(['dom', 'browser', 'events', 'emby-tabs', 'emby-button'], function (dom, } } - function getTabsElement() { + export function getTabsElement() { return document.querySelector('.tabs-viewmenubar'); } - return { - setTabs: setTabs, - getTabsElement: getTabsElement, - selectedTabIndex: selectedTabIndex - }; -}); +/* eslint-enable indent */ From 69507a0bd99f403d34531241fe1c9de4a25092f6 Mon Sep 17 00:00:00 2001 From: Cameron Date: Wed, 8 Jul 2020 16:32:57 +0100 Subject: [PATCH 052/244] Migration of emby-checkbox, textarea, toggle to ES6 Modules --- package.json | 3 +++ src/elements/emby-checkbox/emby-checkbox.js | 11 ++++++++--- src/elements/emby-textarea/emby-textarea.js | 12 +++++++++--- src/elements/emby-toggle/emby-toggle.js | 9 ++++++--- 4 files changed, 26 insertions(+), 9 deletions(-) diff --git a/package.json b/package.json index 230eee3f21..e65c362ae0 100644 --- a/package.json +++ b/package.json @@ -132,6 +132,9 @@ "src/controllers/dashboard/logs.js", "src/controllers/user/subtitles.js", "src/controllers/dashboard/plugins/repositories.js", + "src/elements/emby-checkbox/emby-checkbox.js", + "src/elements/emby-textarea/emby-textarea.js", + "src/elements/emby-toggle/emby-toggle.js", "src/plugins/bookPlayer/plugin.js", "src/plugins/bookPlayer/tableOfContents.js", "src/plugins/photoPlayer/plugin.js", diff --git a/src/elements/emby-checkbox/emby-checkbox.js b/src/elements/emby-checkbox/emby-checkbox.js index 4d02d56163..3ba35ff8a6 100644 --- a/src/elements/emby-checkbox/emby-checkbox.js +++ b/src/elements/emby-checkbox/emby-checkbox.js @@ -1,5 +1,9 @@ -define(['browser', 'dom', 'css!./emby-checkbox', 'registerElement'], function (browser, dom) { - 'use strict'; +import browser from 'browser'; +import dom from 'dom'; +import 'css!./emby-checkbox'; +import 'registerElement'; + +/* eslint-disable indent */ var EmbyCheckboxPrototype = Object.create(HTMLInputElement.prototype); @@ -103,4 +107,5 @@ define(['browser', 'dom', 'css!./emby-checkbox', 'registerElement'], function (b prototype: EmbyCheckboxPrototype, extends: 'input' }); -}); + +/* eslint-enable indent */ diff --git a/src/elements/emby-textarea/emby-textarea.js b/src/elements/emby-textarea/emby-textarea.js index 87a3d7fcee..9e813ad045 100644 --- a/src/elements/emby-textarea/emby-textarea.js +++ b/src/elements/emby-textarea/emby-textarea.js @@ -1,5 +1,10 @@ -define(['layoutManager', 'browser', 'css!./emby-textarea', 'registerElement', 'emby-input'], function (layoutManager, browser) { - 'use strict'; +import layoutManager from 'layoutManager'; +import browser from 'browser'; +import 'css!./emby-textarea'; +import 'registerElement'; +import 'emby-input'; + +/* eslint-disable indent */ function autoGrow(textarea, maxLines) { var self = this; @@ -136,4 +141,5 @@ define(['layoutManager', 'browser', 'css!./emby-textarea', 'registerElement', 'e prototype: EmbyTextAreaPrototype, extends: 'textarea' }); -}); + +/* eslint-enable indent */ diff --git a/src/elements/emby-toggle/emby-toggle.js b/src/elements/emby-toggle/emby-toggle.js index bd7eba3078..5b9ab35394 100644 --- a/src/elements/emby-toggle/emby-toggle.js +++ b/src/elements/emby-toggle/emby-toggle.js @@ -1,5 +1,7 @@ -define(['css!./emby-toggle', 'registerElement'], function () { - 'use strict'; +import 'css!./emby-toggle'; +import 'registerElement'; + +/* eslint-disable indent */ var EmbyTogglePrototype = Object.create(HTMLInputElement.prototype); @@ -47,4 +49,5 @@ define(['css!./emby-toggle', 'registerElement'], function () { prototype: EmbyTogglePrototype, extends: 'input' }); -}); + +/* eslint-enable indent */ From 5a1e01c650de030e28693ff80c046a85bb8b307f Mon Sep 17 00:00:00 2001 From: Cameron Date: Wed, 8 Jul 2020 16:40:30 +0100 Subject: [PATCH 053/244] migrate emby-ratingbutton, scrollbuttons and select to ES6 modules --- package.json | 3 +++ src/elements/emby-ratingbutton/emby-ratingbutton.js | 12 +++++++++--- .../emby-scrollbuttons/emby-scrollbuttons.js | 12 +++++++++--- src/elements/emby-select/emby-select.js | 12 +++++++++--- 4 files changed, 30 insertions(+), 9 deletions(-) diff --git a/package.json b/package.json index 230eee3f21..668999bf7c 100644 --- a/package.json +++ b/package.json @@ -132,6 +132,9 @@ "src/controllers/dashboard/logs.js", "src/controllers/user/subtitles.js", "src/controllers/dashboard/plugins/repositories.js", + "src/elements/emby-ratingbutton/emby-ratingbutton.js", + "src/elements/emby-scrollbuttons/emby-scrollbuttons.js", + "src/elements/emby-select/emby-select.js", "src/plugins/bookPlayer/plugin.js", "src/plugins/bookPlayer/tableOfContents.js", "src/plugins/photoPlayer/plugin.js", diff --git a/src/elements/emby-ratingbutton/emby-ratingbutton.js b/src/elements/emby-ratingbutton/emby-ratingbutton.js index 142920ca15..befaa497ab 100644 --- a/src/elements/emby-ratingbutton/emby-ratingbutton.js +++ b/src/elements/emby-ratingbutton/emby-ratingbutton.js @@ -1,5 +1,10 @@ -define(['connectionManager', 'serverNotifications', 'events', 'globalize', 'emby-button'], function (connectionManager, serverNotifications, events, globalize, EmbyButtonPrototype) { - 'use strict'; +import connectionManager from 'connectionManager'; +import serverNotifications from 'serverNotifications'; +import events from 'events'; +import globalize from 'globalize'; +import EmbyButtonPrototype from 'emby-button'; + +/* eslint-disable indent */ function addNotificationEvent(instance, name, handler) { @@ -199,4 +204,5 @@ define(['connectionManager', 'serverNotifications', 'events', 'globalize', 'emby prototype: EmbyRatingButtonPrototype, extends: 'button' }); -}); + +/* eslint-enable indent */ diff --git a/src/elements/emby-scrollbuttons/emby-scrollbuttons.js b/src/elements/emby-scrollbuttons/emby-scrollbuttons.js index a4c37384c8..5052a2853a 100644 --- a/src/elements/emby-scrollbuttons/emby-scrollbuttons.js +++ b/src/elements/emby-scrollbuttons/emby-scrollbuttons.js @@ -1,5 +1,10 @@ -define(['layoutManager', 'dom', 'css!./emby-scrollbuttons', 'registerElement', 'paper-icon-button-light'], function (layoutManager, dom) { - 'use strict'; +import layoutManager from 'layoutManager'; +import dom from 'dom'; +import 'css!./emby-scrollbuttons'; +import 'registerElement'; +import 'paper-icon-button-light'; + +/* eslint-disable indent */ var EmbyScrollButtonsPrototype = Object.create(HTMLDivElement.prototype); @@ -175,4 +180,5 @@ define(['layoutManager', 'dom', 'css!./emby-scrollbuttons', 'registerElement', ' prototype: EmbyScrollButtonsPrototype, extends: 'div' }); -}); + +/* eslint-enable indent */ diff --git a/src/elements/emby-select/emby-select.js b/src/elements/emby-select/emby-select.js index 2716967560..ae3c233363 100644 --- a/src/elements/emby-select/emby-select.js +++ b/src/elements/emby-select/emby-select.js @@ -1,5 +1,10 @@ -define(['layoutManager', 'browser', 'actionsheet', 'css!./emby-select', 'registerElement'], function (layoutManager, browser, actionsheet) { - 'use strict'; +import layoutManager from 'layoutManager'; +import browser from 'browser'; +import actionsheet from 'actionsheet'; +import 'css!./emby-select'; +import 'registerElement'; + +/* eslint-disable indent */ var EmbySelectPrototype = Object.create(HTMLSelectElement.prototype); @@ -159,4 +164,5 @@ define(['layoutManager', 'browser', 'actionsheet', 'css!./emby-select', 'registe prototype: EmbySelectPrototype, extends: 'select' }); -}); + +/* eslint-enable indent */ From 8d17c6fc6f533eceb55eeb8f1805d675d4513481 Mon Sep 17 00:00:00 2001 From: Cameron Date: Wed, 8 Jul 2020 16:44:47 +0100 Subject: [PATCH 054/244] fix lint --- src/elements/emby-checkbox/emby-checkbox.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/elements/emby-checkbox/emby-checkbox.js b/src/elements/emby-checkbox/emby-checkbox.js index 3ba35ff8a6..1f7d70e7ec 100644 --- a/src/elements/emby-checkbox/emby-checkbox.js +++ b/src/elements/emby-checkbox/emby-checkbox.js @@ -2,7 +2,7 @@ import browser from 'browser'; import dom from 'dom'; import 'css!./emby-checkbox'; import 'registerElement'; - + /* eslint-disable indent */ var EmbyCheckboxPrototype = Object.create(HTMLInputElement.prototype); From f2669cd53006bd694bff4d8c2516deadf7bf34b0 Mon Sep 17 00:00:00 2001 From: Cameron Date: Wed, 8 Jul 2020 17:41:33 +0100 Subject: [PATCH 055/244] migrate emby-radio, scroller and tabs to ES6 modules --- package.json | 3 +++ src/elements/emby-radio/emby-radio.js | 10 +++++++--- src/elements/emby-scroller/emby-scroller.js | 15 ++++++++++++--- src/elements/emby-tabs/emby-tabs.js | 15 ++++++++++++--- 4 files changed, 34 insertions(+), 9 deletions(-) diff --git a/package.json b/package.json index 230eee3f21..679e39f481 100644 --- a/package.json +++ b/package.json @@ -132,6 +132,9 @@ "src/controllers/dashboard/logs.js", "src/controllers/user/subtitles.js", "src/controllers/dashboard/plugins/repositories.js", + "src/elements/emby-tabs/emby-tabs.js", + "src/elements/emby-scroller/emby-scroller.js", + "src/elements/emby-radio/emby-radio.js", "src/plugins/bookPlayer/plugin.js", "src/plugins/bookPlayer/tableOfContents.js", "src/plugins/photoPlayer/plugin.js", diff --git a/src/elements/emby-radio/emby-radio.js b/src/elements/emby-radio/emby-radio.js index 46a3e3826c..7e30b2796f 100644 --- a/src/elements/emby-radio/emby-radio.js +++ b/src/elements/emby-radio/emby-radio.js @@ -1,5 +1,8 @@ -define(['layoutManager', 'css!./emby-radio', 'registerElement'], function (layoutManager) { - 'use strict'; +import layoutManager from 'layoutManager'; +import 'css!./emby-radio'; +import 'registerElement'; + +/* eslint-disable indent */ var EmbyRadioPrototype = Object.create(HTMLInputElement.prototype); @@ -76,4 +79,5 @@ define(['layoutManager', 'css!./emby-radio', 'registerElement'], function (layou prototype: EmbyRadioPrototype, extends: 'input' }); -}); + +/* eslint-enable indent */ diff --git a/src/elements/emby-scroller/emby-scroller.js b/src/elements/emby-scroller/emby-scroller.js index 3df40fa6c2..b9ea7ecd4c 100644 --- a/src/elements/emby-scroller/emby-scroller.js +++ b/src/elements/emby-scroller/emby-scroller.js @@ -1,5 +1,13 @@ -define(['scroller', 'dom', 'layoutManager', 'inputManager', 'focusManager', 'browser', 'registerElement', 'css!./emby-scroller'], function (scroller, dom, layoutManager, inputManager, focusManager, browser) { - 'use strict'; +import scroller from 'scroller'; +import dom from 'dom'; +import layoutManager from 'layoutManager'; +import inputManager from 'inputManager'; +import focusManager from 'focusManager'; +import browser from 'browser'; +import 'registerElement'; +import 'css!./emby-scroller'; + +/* eslint-disable indent */ var ScrollerPrototype = Object.create(HTMLDivElement.prototype); @@ -189,4 +197,5 @@ define(['scroller', 'dom', 'layoutManager', 'inputManager', 'focusManager', 'bro prototype: ScrollerPrototype, extends: 'div' }); -}); + +/* eslint-enable indent */ diff --git a/src/elements/emby-tabs/emby-tabs.js b/src/elements/emby-tabs/emby-tabs.js index 5e03c3f096..4c55962783 100644 --- a/src/elements/emby-tabs/emby-tabs.js +++ b/src/elements/emby-tabs/emby-tabs.js @@ -1,5 +1,13 @@ -define(['dom', 'scroller', 'browser', 'layoutManager', 'focusManager', 'registerElement', 'css!./emby-tabs', 'scrollStyles'], function (dom, scroller, browser, layoutManager, focusManager) { - 'use strict'; +import dom from 'dom'; +import scroller from 'scroller'; +import browser from 'browser'; +import layoutManager from 'layoutManager'; +import focusManager from 'focusManager'; +import 'registerElement'; +import 'css!./emby-tabs'; +import 'scrollStyles'; + +/* eslint-disable indent */ var EmbyTabs = Object.create(HTMLDivElement.prototype); var buttonClass = 'emby-tab-button'; @@ -338,4 +346,5 @@ define(['dom', 'scroller', 'browser', 'layoutManager', 'focusManager', 'register prototype: EmbyTabs, extends: 'div' }); -}); + +/* eslint-enable indent */ From d07a0aa3a9da5d949ff2270491ff0a48071cd1d3 Mon Sep 17 00:00:00 2001 From: Cameron Date: Wed, 8 Jul 2020 18:01:19 +0100 Subject: [PATCH 056/244] Migrate emby-itemscontainer, playstatebutton, programcell to ES6 modules --- package.json | 3 ++ .../emby-itemscontainer.js | 32 +++++++++++++------ .../emby-playstatebutton.js | 12 +++++-- .../emby-programcell/emby-programcell.js | 22 ++++++------- 4 files changed, 44 insertions(+), 25 deletions(-) diff --git a/package.json b/package.json index 230eee3f21..361bc444ca 100644 --- a/package.json +++ b/package.json @@ -132,6 +132,9 @@ "src/controllers/dashboard/logs.js", "src/controllers/user/subtitles.js", "src/controllers/dashboard/plugins/repositories.js", + "src/elements/emby-itemscontainer/emby-itemscontainer.js", + "src/elements/emby-programcell/emby-programcell.js", + "src/elements/emby-playstatebutton/emby-playstatebutton.js", "src/plugins/bookPlayer/plugin.js", "src/plugins/bookPlayer/tableOfContents.js", "src/plugins/photoPlayer/plugin.js", diff --git a/src/elements/emby-itemscontainer/emby-itemscontainer.js b/src/elements/emby-itemscontainer/emby-itemscontainer.js index 5d3772ca93..5c456b6fe2 100644 --- a/src/elements/emby-itemscontainer/emby-itemscontainer.js +++ b/src/elements/emby-itemscontainer/emby-itemscontainer.js @@ -1,5 +1,18 @@ -define(['itemShortcuts', 'inputManager', 'connectionManager', 'playbackManager', 'imageLoader', 'layoutManager', 'browser', 'dom', 'loading', 'focusManager', 'serverNotifications', 'events', 'registerElement'], function (itemShortcuts, inputManager, connectionManager, playbackManager, imageLoader, layoutManager, browser, dom, loading, focusManager, serverNotifications, events) { - 'use strict'; +import itemShortcuts from 'itemShortcuts'; +import inputManager from 'inputManager'; +import connectionManager from 'connectionManager'; +import playbackManager from 'playbackManager'; +import imageLoader from 'imageLoader'; +import layoutManager from 'layoutManager'; +import browser from 'browser'; +import dom from 'dom'; +import loading from 'loading'; +import focusManager from 'focusManager'; +import serverNotifications from 'serverNotifications'; +import events from 'events'; +import 'registerElement'; + +/* eslint-disable indent */ var ItemsContainerPrototype = Object.create(HTMLDivElement.prototype); @@ -62,7 +75,7 @@ define(['itemShortcuts', 'inputManager', 'connectionManager', 'playbackManager', } var self = this; - require(['multiSelect'], function (MultiSelect) { + import('multiSelect').then(({default: MultiSelect}) => { self.multiSelect = new MultiSelect({ container: self, bindOnClick: false @@ -122,7 +135,7 @@ define(['itemShortcuts', 'inputManager', 'connectionManager', 'playbackManager', } var self = this; - require(['sortable'], function (Sortable) { + import('sortable').then(({default: Sortable}) => { self.sortable = new Sortable(self, { draggable: '.listItem', handle: '.listViewDragHandle', @@ -139,7 +152,7 @@ define(['itemShortcuts', 'inputManager', 'connectionManager', 'playbackManager', var itemsContainer = this; - require(['cardBuilder'], function (cardBuilder) { + import('cardBuilder').then(({default: cardBuilder}) => { cardBuilder.onUserDataChanged(userData, itemsContainer); }); @@ -175,7 +188,7 @@ define(['itemShortcuts', 'inputManager', 'connectionManager', 'playbackManager', // This could be null, not supported by all tv providers var newTimerId = data.Id; - require(['cardBuilder'], function (cardBuilder) { + import('cardBuilder').then(({default: cardBuilder}) => { cardBuilder.onTimerCreated(programId, newTimerId, itemsContainer); }); } @@ -195,7 +208,7 @@ define(['itemShortcuts', 'inputManager', 'connectionManager', 'playbackManager', return; } - require(['cardBuilder'], function (cardBuilder) { + import('cardBuilder').then(({default: cardBuilder}) => { cardBuilder.onTimerCancelled(data.Id, itemsContainer); }); } @@ -207,7 +220,7 @@ define(['itemShortcuts', 'inputManager', 'connectionManager', 'playbackManager', return; } - require(['cardBuilder'], function (cardBuilder) { + import('cardBuilder').then(({default: cardBuilder}) => { cardBuilder.onSeriesTimerCancelled(data.Id, itemsContainer); }); } @@ -479,4 +492,5 @@ define(['itemShortcuts', 'inputManager', 'connectionManager', 'playbackManager', prototype: ItemsContainerPrototype, extends: 'div' }); -}); + +/* eslint-enable indent */ diff --git a/src/elements/emby-playstatebutton/emby-playstatebutton.js b/src/elements/emby-playstatebutton/emby-playstatebutton.js index 57f7eb76eb..a14d913387 100644 --- a/src/elements/emby-playstatebutton/emby-playstatebutton.js +++ b/src/elements/emby-playstatebutton/emby-playstatebutton.js @@ -1,5 +1,10 @@ -define(['connectionManager', 'serverNotifications', 'events', 'globalize', 'emby-button'], function (connectionManager, serverNotifications, events, globalize, EmbyButtonPrototype) { - 'use strict'; +import connectionManager from 'connectionManager'; +import serverNotifications from 'serverNotifications'; +import events from 'events'; +import globalize from 'globalize'; +import EmbyButtonPrototype from 'emby-button'; + +/* eslint-disable indent */ function addNotificationEvent(instance, name, handler) { var localHandler = handler.bind(instance); @@ -156,4 +161,5 @@ define(['connectionManager', 'serverNotifications', 'events', 'globalize', 'emby prototype: EmbyPlaystateButtonPrototype, extends: 'button' }); -}); + +/* eslint-enable indent */ diff --git a/src/elements/emby-programcell/emby-programcell.js b/src/elements/emby-programcell/emby-programcell.js index a959033186..d5f6de8a09 100644 --- a/src/elements/emby-programcell/emby-programcell.js +++ b/src/elements/emby-programcell/emby-programcell.js @@ -1,16 +1,12 @@ -define([], function() { - 'use strict'; +var ProgramCellPrototype = Object.create(HTMLButtonElement.prototype); - var ProgramCellPrototype = Object.create(HTMLButtonElement.prototype); +ProgramCellPrototype.detachedCallback = function () { + this.posLeft = null; + this.posWidth = null; + this.guideProgramName = null; +}; - ProgramCellPrototype.detachedCallback = function () { - this.posLeft = null; - this.posWidth = null; - this.guideProgramName = null; - }; - - document.registerElement('emby-programcell', { - prototype: ProgramCellPrototype, - extends: 'button' - }); +document.registerElement('emby-programcell', { + prototype: ProgramCellPrototype, + extends: 'button' }); From 1ac3ecbfa7fee4b2301d66f4399704237badea5d Mon Sep 17 00:00:00 2001 From: Cameron Date: Wed, 8 Jul 2020 19:58:28 +0100 Subject: [PATCH 057/244] Migrate networking.js, playback.js, serveractivity.js to ES6 modules --- package.json | 3 +++ src/controllers/dashboard/networking.js | 14 ++++++++++---- src/controllers/dashboard/playback.js | 11 ++++++++--- src/controllers/dashboard/serveractivity.js | 11 +++++++---- 4 files changed, 28 insertions(+), 11 deletions(-) diff --git a/package.json b/package.json index 230eee3f21..152498a759 100644 --- a/package.json +++ b/package.json @@ -124,6 +124,9 @@ "src/components/settingshelper.js", "src/components/subtitlesettings/subtitlesettings.js", "src/components/subtitlesettings/subtitleappearancehelper.js", + "src/controllers/dashboard/playback.js", + "src/controllers/dashboard/serveractivity.js", + "src/controllers/dashboard/networking.js", "src/components/shortcuts.js", "src/components/syncPlay/groupSelectionMenu.js", "src/components/syncPlay/playbackPermissionManager.js", diff --git a/src/controllers/dashboard/networking.js b/src/controllers/dashboard/networking.js index 4ddde7f24c..e9fdec6391 100644 --- a/src/controllers/dashboard/networking.js +++ b/src/controllers/dashboard/networking.js @@ -1,5 +1,10 @@ -define(['loading', 'libraryMenu', 'globalize', 'emby-checkbox', 'emby-select'], function (loading, libraryMenu, globalize) { - 'use strict'; +import loading from 'loading'; +import libraryMenu from 'libraryMenu'; +import globalize from 'globalize'; +import 'emby-checkbox'; +import 'emby-select'; + +/* eslint-disable indent */ function onSubmit(e) { var form = this; @@ -97,7 +102,7 @@ define(['loading', 'libraryMenu', 'globalize', 'emby-checkbox', 'emby-select'], } } - return function (view, params) { + export default function (view, params) { function loadPage(page, config) { page.querySelector('#txtPortNumber').value = config.HttpServerPortNumber; page.querySelector('#txtPublicPort').value = config.PublicPort; @@ -159,4 +164,5 @@ define(['loading', 'libraryMenu', 'globalize', 'emby-checkbox', 'emby-select'], }); }); }; -}); + +/* eslint-enable indent */ diff --git a/src/controllers/dashboard/playback.js b/src/controllers/dashboard/playback.js index d5b67a2961..9c7bc00b4f 100644 --- a/src/controllers/dashboard/playback.js +++ b/src/controllers/dashboard/playback.js @@ -1,5 +1,9 @@ -define(['jQuery', 'loading', 'libraryMenu', 'globalize'], function ($, loading, libraryMenu, globalize) { - 'use strict'; +import $ from 'jQuery'; +import loading from 'loading'; +import libraryMenu from 'libraryMenu'; +import globalize from 'globalize'; + +/* eslint-disable indent */ function loadPage(page, config) { $('#txtMinResumePct', page).val(config.MinResumePct); @@ -45,4 +49,5 @@ define(['jQuery', 'loading', 'libraryMenu', 'globalize'], function ($, loading, loadPage(page, config); }); }); -}); + +/* eslint-enable indent */ diff --git a/src/controllers/dashboard/serveractivity.js b/src/controllers/dashboard/serveractivity.js index c48a2903ae..2bd98836e0 100644 --- a/src/controllers/dashboard/serveractivity.js +++ b/src/controllers/dashboard/serveractivity.js @@ -1,7 +1,9 @@ -define(['components/activitylog', 'globalize'], function (ActivityLog, globalize) { - 'use strict'; +import ActivityLog from 'components/activitylog'; +import globalize from 'globalize'; - return function (view, params) { +/* eslint-disable indent */ + + export default function (view, params) { var activityLog; if (params.useractivity !== 'false') { @@ -28,4 +30,5 @@ define(['components/activitylog', 'globalize'], function (ActivityLog, globalize activityLog = null; }); }; -}); + +/* eslint-ensable indent */ From e230e05e6ec670bca8d2498685c4885ff273d07e Mon Sep 17 00:00:00 2001 From: Cameron Date: Wed, 8 Jul 2020 20:24:44 +0100 Subject: [PATCH 058/244] migrate mediaLibrary to ES6 module --- package.json | 7 +++-- src/controllers/dashboard/mediaLibrary.js | 32 ++++++++++++++------- src/controllers/dashboard/serveractivity.js | 2 +- 3 files changed, 27 insertions(+), 14 deletions(-) diff --git a/package.json b/package.json index 152498a759..56aeb4c004 100644 --- a/package.json +++ b/package.json @@ -124,9 +124,6 @@ "src/components/settingshelper.js", "src/components/subtitlesettings/subtitlesettings.js", "src/components/subtitlesettings/subtitleappearancehelper.js", - "src/controllers/dashboard/playback.js", - "src/controllers/dashboard/serveractivity.js", - "src/controllers/dashboard/networking.js", "src/components/shortcuts.js", "src/components/syncPlay/groupSelectionMenu.js", "src/components/syncPlay/playbackPermissionManager.js", @@ -134,7 +131,11 @@ "src/components/syncPlay/timeSyncManager.js", "src/controllers/dashboard/logs.js", "src/controllers/user/subtitles.js", + "src/controllers/dashboard/mediaLibrary.js", + "src/controllers/dashboard/networking.js", + "src/controllers/dashboard/playback.js", "src/controllers/dashboard/plugins/repositories.js", + "src/controllers/dashboard/serveractivity.js", "src/plugins/bookPlayer/plugin.js", "src/plugins/bookPlayer/tableOfContents.js", "src/plugins/photoPlayer/plugin.js", diff --git a/src/controllers/dashboard/mediaLibrary.js b/src/controllers/dashboard/mediaLibrary.js index d9b288c62a..1284602e4c 100644 --- a/src/controllers/dashboard/mediaLibrary.js +++ b/src/controllers/dashboard/mediaLibrary.js @@ -1,8 +1,19 @@ -define(['jQuery', 'apphost', 'scripts/taskbutton', 'loading', 'libraryMenu', 'globalize', 'dom', 'indicators', 'scripts/imagehelper', 'cardStyle', 'emby-itemrefreshindicator'], function ($, appHost, taskButton, loading, libraryMenu, globalize, dom, indicators, imageHelper) { - 'use strict'; +import $ from 'jQuery'; +import appHost from 'apphost'; +import taskButton from 'scripts/taskbutton'; +import loading from 'loading'; +import libraryMenu from 'libraryMenu'; +import globalize from 'globalize'; +import dom from 'dom'; +import indicators from 'indicators'; +import imageHelper from 'scripts/imagehelper'; +import 'cardStyle'; +import 'emby-itemrefreshindicator'; + +/* eslint-disable indent */ function addVirtualFolder(page) { - require(['medialibrarycreator'], function (medialibrarycreator) { + import('medialibrarycreator').then(({default: medialibrarycreator}) => { new medialibrarycreator.showEditor({ collectionTypeOptions: getCollectionTypeOptions().filter(function (f) { return !f.hidden; @@ -17,7 +28,7 @@ define(['jQuery', 'apphost', 'scripts/taskbutton', 'loading', 'libraryMenu', 'gl } function editVirtualFolder(page, virtualFolder) { - require(['medialibraryeditor'], function (medialibraryeditor) { + import('medialibraryeditor').then(({default:medialibraryeditor }) => { new medialibraryeditor.showEditor({ refresh: shouldRefreshLibraryAfterChanges(page), library: virtualFolder @@ -37,7 +48,7 @@ define(['jQuery', 'apphost', 'scripts/taskbutton', 'loading', 'libraryMenu', 'gl msg += virtualFolder.Locations.join('
'); } - require(['confirm'], function (confirm) { + import('confirm').then(({default: confirm}) => { confirm({ text: msg, @@ -55,7 +66,7 @@ define(['jQuery', 'apphost', 'scripts/taskbutton', 'loading', 'libraryMenu', 'gl } function refreshVirtualFolder(page, virtualFolder) { - require(['refreshDialog'], function (refreshDialog) { + import('refreshDialog').then(({default: refreshDialog}) => { new refreshDialog({ itemIds: [virtualFolder.ItemId], serverId: ApiClient.serverId(), @@ -65,7 +76,7 @@ define(['jQuery', 'apphost', 'scripts/taskbutton', 'loading', 'libraryMenu', 'gl } function renameVirtualFolder(page, virtualFolder) { - require(['prompt'], function (prompt) { + import('prompt').then(({default: prompt}) => { prompt({ label: globalize.translate('LabelNewName'), confirmText: globalize.translate('ButtonRename') @@ -111,7 +122,7 @@ define(['jQuery', 'apphost', 'scripts/taskbutton', 'loading', 'libraryMenu', 'gl icon: 'refresh' }); - require(['actionsheet'], function (actionsheet) { + import('actionsheet').then(({default: actionsheet}) => { actionsheet.show({ items: menuItems, positionTo: elem, @@ -192,7 +203,7 @@ define(['jQuery', 'apphost', 'scripts/taskbutton', 'loading', 'libraryMenu', 'gl } function editImages(page, virtualFolder) { - require(['imageEditor'], function (imageEditor) { + import('imageEditor').then(({default: imageEditor}) => { imageEditor.show({ itemId: virtualFolder.ItemId, serverId: ApiClient.serverId() @@ -388,4 +399,5 @@ define(['jQuery', 'apphost', 'scripts/taskbutton', 'loading', 'libraryMenu', 'gl button: page.querySelector('.btnRefresh') }); }); -}); + +/* eslint-enable indent */ diff --git a/src/controllers/dashboard/serveractivity.js b/src/controllers/dashboard/serveractivity.js index 2bd98836e0..624c5cc4ad 100644 --- a/src/controllers/dashboard/serveractivity.js +++ b/src/controllers/dashboard/serveractivity.js @@ -31,4 +31,4 @@ import globalize from 'globalize'; }); }; -/* eslint-ensable indent */ +/* eslint-enable indent */ From 3186955376cc3c8ecdf53a37f8354ad50682c1d5 Mon Sep 17 00:00:00 2001 From: Cameron Date: Thu, 9 Jul 2020 08:54:12 +0100 Subject: [PATCH 059/244] Migration of metadataImages, metadatanfo, streaming to ES6 Mo --- package.json | 3 +++ src/controllers/dashboard/metadataImages.js | 13 ++++++++++--- src/controllers/dashboard/metadatanfo.js | 13 +++++++++---- src/controllers/dashboard/streaming.js | 11 ++++++++--- 4 files changed, 30 insertions(+), 10 deletions(-) diff --git a/package.json b/package.json index 230eee3f21..054bcb7939 100644 --- a/package.json +++ b/package.json @@ -131,7 +131,10 @@ "src/components/syncPlay/timeSyncManager.js", "src/controllers/dashboard/logs.js", "src/controllers/user/subtitles.js", + "src/controllers/dashboard/metadataImages.js", + "src/controllers/dashboard/metadatanfo.js", "src/controllers/dashboard/plugins/repositories.js", + "src/controllers/dashboard/streaming.js", "src/plugins/bookPlayer/plugin.js", "src/plugins/bookPlayer/tableOfContents.js", "src/plugins/photoPlayer/plugin.js", diff --git a/src/controllers/dashboard/metadataImages.js b/src/controllers/dashboard/metadataImages.js index 3047736a68..6573d9858d 100644 --- a/src/controllers/dashboard/metadataImages.js +++ b/src/controllers/dashboard/metadataImages.js @@ -1,5 +1,11 @@ -define(['jQuery', 'dom', 'loading', 'libraryMenu', 'globalize', 'listViewStyle'], function($, dom, loading, libraryMenu, globalize) { - 'use strict'; +import $ from 'jQuery'; +import dom from 'dom'; +import loading from 'loading'; +import libraryMenu from 'libraryMenu'; +import globalize from 'globalize'; +import 'listViewStyle'; + +/* eslint-disable indent */ function populateLanguages(select) { return ApiClient.getCultures().then(function(languages) { @@ -67,4 +73,5 @@ define(['jQuery', 'dom', 'loading', 'libraryMenu', 'globalize', 'listViewStyle'] loading.show(); loadPage(this); }); -}); + +/* eslint-enable indent */ diff --git a/src/controllers/dashboard/metadatanfo.js b/src/controllers/dashboard/metadatanfo.js index a936192618..0659d477cb 100644 --- a/src/controllers/dashboard/metadatanfo.js +++ b/src/controllers/dashboard/metadatanfo.js @@ -1,5 +1,9 @@ -define(['jQuery', 'loading', 'libraryMenu', 'globalize'], function ($, loading, libraryMenu, globalize) { - 'use strict'; +import $ from 'jQuery'; +import loading from 'loading'; +import libraryMenu from 'libraryMenu'; +import globalize from 'globalize'; + +/* eslint-disable indent */ function loadPage(page, config, users) { var html = ''; @@ -35,7 +39,7 @@ define(['jQuery', 'loading', 'libraryMenu', 'globalize'], function ($, loading, var msg = []; msg.push(globalize.translate('MetadataSettingChangeHelp')); - require(['alert'], function (alert) { + import('alert').then(({default: alert}) => { alert({ text: msg.join('

') }); @@ -71,4 +75,5 @@ define(['jQuery', 'loading', 'libraryMenu', 'globalize'], function ($, loading, loadPage(page, responses[1], responses[0]); }); }); -}); + +/* eslint-enable indent */ diff --git a/src/controllers/dashboard/streaming.js b/src/controllers/dashboard/streaming.js index 37afe5a054..15d6c89209 100644 --- a/src/controllers/dashboard/streaming.js +++ b/src/controllers/dashboard/streaming.js @@ -1,5 +1,9 @@ -define(['jQuery', 'libraryMenu', 'loading', 'globalize'], function ($, libraryMenu, loading, globalize) { - 'use strict'; +import $ from 'jQuery'; +import libraryMenu from 'libraryMenu'; +import loading from 'loading'; +import globalize from 'globalize'; + +/* eslint-disable indent */ function loadPage(page, config) { $('#txtRemoteClientBitrateLimit', page).val(config.RemoteClientBitrateLimit / 1e6 || ''); @@ -40,4 +44,5 @@ define(['jQuery', 'libraryMenu', 'loading', 'globalize'], function ($, libraryMe loadPage(page, config); }); }); -}); + +/* eslint-enable indent */ From 613f0024bc0b1fa46c5997f9def0a5dd6f2fe6e2 Mon Sep 17 00:00:00 2001 From: Cameron Date: Thu, 9 Jul 2020 08:54:47 +0100 Subject: [PATCH 060/244] Migration of general and library details to ES6 Modules --- package.json | 2 ++ src/controllers/dashboard/general.js | 23 ++++++++++++++------- src/controllers/dashboard/librarydisplay.js | 15 ++++++++++---- 3 files changed, 29 insertions(+), 11 deletions(-) diff --git a/package.json b/package.json index 054bcb7939..5e40babfef 100644 --- a/package.json +++ b/package.json @@ -131,6 +131,8 @@ "src/components/syncPlay/timeSyncManager.js", "src/controllers/dashboard/logs.js", "src/controllers/user/subtitles.js", + "src/controllers/dashboard/general.js", + "src/controllers/dashboard/librarydisplay.js", "src/controllers/dashboard/metadataImages.js", "src/controllers/dashboard/metadatanfo.js", "src/controllers/dashboard/plugins/repositories.js", diff --git a/src/controllers/dashboard/general.js b/src/controllers/dashboard/general.js index f215ace28b..2defc6d449 100644 --- a/src/controllers/dashboard/general.js +++ b/src/controllers/dashboard/general.js @@ -1,5 +1,13 @@ -define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'emby-textarea', 'emby-input', 'emby-select', 'emby-button'], function ($, loading, globalize) { - 'use strict'; +import $ from 'jQuery'; +import loading from 'loading'; +import globalize from 'globalize'; +import 'emby-checkbox'; +import 'emby-textarea'; +import 'emby-input'; +import 'emby-select'; +import 'emby-button'; + +/* eslint-disable indent */ function loadPage(page, config, languageOptions, systemInfo) { page.querySelector('#txtServerName').value = systemInfo.ServerName; @@ -43,7 +51,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'emby-textarea', 'emb }); }); }, function () { - require(['alert'], function (alert) { + import('alert').then(({default: alert}) => { alert(globalize.translate('DefaultErrorMessage')); }); @@ -56,9 +64,9 @@ define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'emby-textarea', 'emb var currentBrandingOptions; var currentLanguage; var brandingConfigKey = 'branding'; - return function (view, params) { + export default function (view, params) { $('#btnSelectCachePath', view).on('click.selectDirectory', function () { - require(['directorybrowser'], function (directoryBrowser) { + import('directorybrowser').then(({default: directoryBrowser}) => { var picker = new directoryBrowser(); picker.show({ callback: function (path) { @@ -75,7 +83,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'emby-textarea', 'emb }); }); $('#btnSelectMetadataPath', view).on('click.selectDirectory', function () { - require(['directorybrowser'], function (directoryBrowser) { + import('directorybrowser').then(({default: directoryBrowser}) => { var picker = new directoryBrowser(); picker.show({ path: $('#txtMetadataPath', view).val(), @@ -113,4 +121,5 @@ define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'emby-textarea', 'emb }); }); }; -}); + +/* eslint-enable indent */ diff --git a/src/controllers/dashboard/librarydisplay.js b/src/controllers/dashboard/librarydisplay.js index a820c37528..95475cfb9b 100644 --- a/src/controllers/dashboard/librarydisplay.js +++ b/src/controllers/dashboard/librarydisplay.js @@ -1,5 +1,11 @@ -define(['globalize', 'loading', 'libraryMenu', 'emby-checkbox', 'emby-button', 'emby-button'], function(globalize, loading, libraryMenu) { - 'use strict'; +import globalize from 'globalize'; +import loading from 'loading'; +import libraryMenu from 'libraryMenu'; +import 'emby-checkbox'; +import 'emby-button'; +import 'emby-button'; + +/* eslint-disable indent */ function getTabs() { return [{ @@ -17,7 +23,7 @@ define(['globalize', 'loading', 'libraryMenu', 'emby-checkbox', 'emby-button', ' }]; } - return function(view, params) { + export default function(view, params) { function loadData() { ApiClient.getServerConfiguration().then(function(config) { view.querySelector('.chkFolderView').checked = config.EnableFolderView; @@ -64,4 +70,5 @@ define(['globalize', 'loading', 'libraryMenu', 'emby-checkbox', 'emby-button', ' }); }); }; -}); + + /* eslint-enable indent */ From ccad3345176d956616cfa9c659d21abbd0bb082d Mon Sep 17 00:00:00 2001 From: Cameron Date: Thu, 9 Jul 2020 13:47:12 +0100 Subject: [PATCH 061/244] migration of useredit and library access to ES6 modules --- package.json | 2 ++ src/controllers/dashboard/users/useredit.js | 13 +++++++++---- .../dashboard/users/userlibraryaccess.js | 13 +++++++++---- 3 files changed, 20 insertions(+), 8 deletions(-) diff --git a/package.json b/package.json index 230eee3f21..eb59900fd6 100644 --- a/package.json +++ b/package.json @@ -132,6 +132,8 @@ "src/controllers/dashboard/logs.js", "src/controllers/user/subtitles.js", "src/controllers/dashboard/plugins/repositories.js", + "src/controllers/dashboard/users/useredit.js", + "src/controllers/dashboard/users/userlibraryaccess.js", "src/plugins/bookPlayer/plugin.js", "src/plugins/bookPlayer/tableOfContents.js", "src/plugins/photoPlayer/plugin.js", diff --git a/src/controllers/dashboard/users/useredit.js b/src/controllers/dashboard/users/useredit.js index af187412d0..02e0dade0e 100644 --- a/src/controllers/dashboard/users/useredit.js +++ b/src/controllers/dashboard/users/useredit.js @@ -1,5 +1,9 @@ -define(['jQuery', 'loading', 'libraryMenu', 'globalize'], function ($, loading, libraryMenu, globalize) { - 'use strict'; +import $ from 'jQuery'; +import loading from 'loading'; +import libraryMenu from 'libraryMenu'; +import globalize from 'globalize'; + +/* eslint-disable indent */ function loadDeleteFolders(page, user, mediaFolders) { ApiClient.getJSON(ApiClient.getUrl('Channels', { @@ -112,7 +116,7 @@ define(['jQuery', 'loading', 'libraryMenu', 'globalize'], function ($, loading, Dashboard.navigate('userprofiles.html'); loading.hide(); - require(['toast'], function (toast) { + import('toast').then(({default: toast}) => { toast(globalize.translate('SettingsSaved')); }); } @@ -197,4 +201,5 @@ define(['jQuery', 'loading', 'libraryMenu', 'globalize'], function ($, loading, }).on('pagebeforeshow', '#editUserPage', function () { loadData(this); }); -}); + +/* eslint-enable indent */ diff --git a/src/controllers/dashboard/users/userlibraryaccess.js b/src/controllers/dashboard/users/userlibraryaccess.js index 5ea24e3da3..072b228c53 100644 --- a/src/controllers/dashboard/users/userlibraryaccess.js +++ b/src/controllers/dashboard/users/userlibraryaccess.js @@ -1,5 +1,9 @@ -define(['jQuery', 'loading', 'libraryMenu', 'globalize'], function ($, loading, libraryMenu, globalize) { - 'use strict'; +import $ from 'jQuery'; +import loading from 'loading'; +import libraryMenu from 'libraryMenu'; +import globalize from 'globalize'; + +/* eslint-disable indent */ function triggerChange(select) { var evt = document.createEvent('HTMLEvents'); @@ -84,7 +88,7 @@ define(['jQuery', 'loading', 'libraryMenu', 'globalize'], function ($, loading, function onSaveComplete(page) { loading.hide(); - require(['toast'], function (toast) { + import('toast').then(({default: toast}) => { toast(globalize.translate('SettingsSaved')); }); } @@ -175,4 +179,5 @@ define(['jQuery', 'loading', 'libraryMenu', 'globalize'], function ($, loading, loadUser(page, responses[0], responses[1], responses[2].Items, responses[3].Items, responses[4].Items); }); }); -}); + +/* eslint-enable indent */ From 84a47081be527daa26bb0ae3e493943e53410d39 Mon Sep 17 00:00:00 2001 From: Cameron Date: Thu, 9 Jul 2020 13:47:35 +0100 Subject: [PATCH 062/244] migration of usernew and userparentalcontrol to ES6 modules --- package.json | 2 ++ src/controllers/dashboard/users/usernew.js | 13 +++++++---- .../dashboard/users/userparentalcontrol.js | 22 +++++++++++++------ 3 files changed, 26 insertions(+), 11 deletions(-) diff --git a/package.json b/package.json index eb59900fd6..5e7bd347e9 100644 --- a/package.json +++ b/package.json @@ -134,6 +134,8 @@ "src/controllers/dashboard/plugins/repositories.js", "src/controllers/dashboard/users/useredit.js", "src/controllers/dashboard/users/userlibraryaccess.js", + "src/controllers/dashboard/users/usernew.js", + "src/controllers/dashboard/users/userparentalcontrol.js", "src/plugins/bookPlayer/plugin.js", "src/plugins/bookPlayer/tableOfContents.js", "src/plugins/photoPlayer/plugin.js", diff --git a/src/controllers/dashboard/users/usernew.js b/src/controllers/dashboard/users/usernew.js index ef4cd74f86..71072898d3 100644 --- a/src/controllers/dashboard/users/usernew.js +++ b/src/controllers/dashboard/users/usernew.js @@ -1,5 +1,9 @@ -define(['jQuery', 'loading', 'globalize', 'emby-checkbox'], function ($, loading, globalize) { - 'use strict'; +import $ from 'jQuery'; +import loading from 'loading'; +import globalize from 'globalize'; +import 'emby-checkbox'; + +/* eslint-disable indent */ function loadMediaFolders(page, mediaFolders) { var html = ''; @@ -84,7 +88,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-checkbox'], function ($, loading Dashboard.navigate('useredit.html?userId=' + user.Id); }); }, function (response) { - require(['toast'], function (toast) { + import('toast').then(({default: toast}) => { toast(globalize.translate('DefaultErrorMessage')); }); @@ -123,4 +127,5 @@ define(['jQuery', 'loading', 'globalize', 'emby-checkbox'], function ($, loading }).on('pageshow', '#newUserPage', function () { loadData(this); }); -}); + +/* eslint-enable indent */ diff --git a/src/controllers/dashboard/users/userparentalcontrol.js b/src/controllers/dashboard/users/userparentalcontrol.js index e8255512d6..907f99b8cc 100644 --- a/src/controllers/dashboard/users/userparentalcontrol.js +++ b/src/controllers/dashboard/users/userparentalcontrol.js @@ -1,5 +1,13 @@ -define(['jQuery', 'datetime', 'loading', 'libraryMenu', 'globalize', 'listViewStyle', 'paper-icon-button-light'], function ($, datetime, loading, libraryMenu, globalize) { - 'use strict'; +import $ from 'jQuery'; +import datetime from 'datetime'; +import loading from 'loading'; +import libraryMenu from 'libraryMenu'; +import globalize from 'globalize'; +import 'listViewStyle'; +import 'paper-icon-button-light'; + + +/* eslint-disable indent */ function populateRatings(allParentalRatings, page) { var html = ''; @@ -158,7 +166,7 @@ define(['jQuery', 'datetime', 'loading', 'libraryMenu', 'globalize', 'listViewSt function onSaveComplete(page) { loading.hide(); - require(['toast'], function (toast) { + import('toast').then(({default: toast}) => { toast(globalize.translate('SettingsSaved')); }); } @@ -190,8 +198,7 @@ define(['jQuery', 'datetime', 'loading', 'libraryMenu', 'globalize', 'listViewSt function showSchedulePopup(page, schedule, index) { schedule = schedule || {}; - - require(['components/accessSchedule/accessSchedule'], function (accessschedule) { + import('components/accessSchedule/accessSchedule').then(({default: accessschedule}) => { accessschedule.show({ schedule: schedule }).then(function (updatedSchedule) { @@ -224,7 +231,7 @@ define(['jQuery', 'datetime', 'loading', 'libraryMenu', 'globalize', 'listViewSt } function showBlockedTagPopup(page) { - require(['prompt'], function (prompt) { + import('prompt').then(({default: prompt}) => { prompt({ label: globalize.translate('LabelTag') }).then(function (value) { @@ -268,4 +275,5 @@ define(['jQuery', 'datetime', 'loading', 'libraryMenu', 'globalize', 'listViewSt loadUser(page, responses[0], responses[1]); }); }); -}); + +/* eslint-enable indent */ From ee54d4efdb51efbde404b21bc21583cf94e95a0f Mon Sep 17 00:00:00 2001 From: Cameron Date: Thu, 9 Jul 2020 13:47:58 +0100 Subject: [PATCH 063/244] Migration of userpasswordpage and userprofilespage to ES6 modules --- package.json | 2 ++ .../dashboard/users/userpasswordpage.js | 27 +++++++++++-------- .../dashboard/users/userprofilespage.js | 25 ++++++++++++----- 3 files changed, 36 insertions(+), 18 deletions(-) diff --git a/package.json b/package.json index 5e7bd347e9..a77647458c 100644 --- a/package.json +++ b/package.json @@ -136,6 +136,8 @@ "src/controllers/dashboard/users/userlibraryaccess.js", "src/controllers/dashboard/users/usernew.js", "src/controllers/dashboard/users/userparentalcontrol.js", + "src/controllers/dashboard/users/userpasswordpage.js", + "src/controllers/dashboard/users/userprofilespage.js", "src/plugins/bookPlayer/plugin.js", "src/plugins/bookPlayer/tableOfContents.js", "src/plugins/photoPlayer/plugin.js", diff --git a/src/controllers/dashboard/users/userpasswordpage.js b/src/controllers/dashboard/users/userpasswordpage.js index 186e39b151..e9731e50e9 100644 --- a/src/controllers/dashboard/users/userpasswordpage.js +++ b/src/controllers/dashboard/users/userpasswordpage.js @@ -1,5 +1,10 @@ -define(['loading', 'libraryMenu', 'globalize', 'emby-button'], function (loading, libraryMenu, globalize) { - 'use strict'; +import loading from 'loading'; +import libraryMenu from 'libraryMenu'; +import globalize from 'globalize'; +import 'emby-button'; + + +/* eslint-disable indent */ function loadUser(page, params) { var userid = params.userId; @@ -48,7 +53,7 @@ define(['loading', 'libraryMenu', 'globalize', 'emby-button'], function (loading page.querySelector('.chkEnableLocalEasyPassword').checked = user.Configuration.EnableLocalPassword; - require(['autoFocuser'], function (autoFocuser) { + import('autoFocuser').then(({default: autoFocuser}) => { autoFocuser.autoFocus(page); }); }); @@ -58,7 +63,7 @@ define(['loading', 'libraryMenu', 'globalize', 'emby-button'], function (loading page.querySelector('#txtNewPasswordConfirm').value = ''; } - return function (view, params) { + export default function (view, params) { function saveEasyPassword() { var userId = params.userId; var easyPassword = view.querySelector('#txtEasyPassword').value; @@ -78,7 +83,7 @@ define(['loading', 'libraryMenu', 'globalize', 'emby-button'], function (loading ApiClient.updateUserConfiguration(user.Id, user.Configuration).then(function () { loading.hide(); - require(['toast'], function (toast) { + import('toast').then(({default: toast}) => { toast(globalize.translate('MessageSettingsSaved')); }); @@ -101,7 +106,7 @@ define(['loading', 'libraryMenu', 'globalize', 'emby-button'], function (loading ApiClient.updateUserPassword(userId, currentPassword, newPassword).then(function () { loading.hide(); - require(['toast'], function (toast) { + import('toast').then(({default: toast}) => { toast(globalize.translate('PasswordSaved')); }); @@ -119,7 +124,7 @@ define(['loading', 'libraryMenu', 'globalize', 'emby-button'], function (loading var form = this; if (form.querySelector('#txtNewPassword').value != form.querySelector('#txtNewPasswordConfirm').value) { - require(['toast'], function (toast) { + import('toast').then(({default: toast}) => { toast(globalize.translate('PasswordMatchError')); }); } else { @@ -140,8 +145,7 @@ define(['loading', 'libraryMenu', 'globalize', 'emby-button'], function (loading function resetPassword() { var msg = globalize.translate('PasswordResetConfirmation'); - - require(['confirm'], function (confirm) { + import('confirm').then(({default: confirm}) => { confirm(msg, globalize.translate('PasswordResetHeader')).then(function () { var userId = params.userId; loading.show(); @@ -160,7 +164,7 @@ define(['loading', 'libraryMenu', 'globalize', 'emby-button'], function (loading function resetEasyPassword() { var msg = globalize.translate('PinCodeResetConfirmation'); - require(['confirm'], function (confirm) { + import('confirm').then(({default: confirm}) => { confirm(msg, globalize.translate('HeaderPinCodeReset')).then(function () { var userId = params.userId; loading.show(); @@ -184,4 +188,5 @@ define(['loading', 'libraryMenu', 'globalize', 'emby-button'], function (loading loadUser(view, params); }); }; -}); + +/* eslint-enable indent */ diff --git a/src/controllers/dashboard/users/userprofilespage.js b/src/controllers/dashboard/users/userprofilespage.js index c691c665f6..46e9665b7d 100644 --- a/src/controllers/dashboard/users/userprofilespage.js +++ b/src/controllers/dashboard/users/userprofilespage.js @@ -1,10 +1,20 @@ -define(['loading', 'dom', 'globalize', 'date-fns', 'dfnshelper', 'paper-icon-button-light', 'cardStyle', 'emby-button', 'indicators', 'flexStyles'], function (loading, dom, globalize, datefns, dfnshelper) { - 'use strict'; +import loading from 'loading'; +import dom from 'dom'; +import globalize from 'globalize'; +import * as datefns from 'date-fns'; +import dfnshelper from 'dfnshelper'; +import 'paper-icon-button-light'; +import 'cardStyle'; +import 'emby-button'; +import 'indicators'; +import 'flexStyles'; + +/* eslint-disable indent */ function deleteUser(page, id) { var msg = globalize.translate('DeleteUserConfirmation'); - require(['confirm'], function (confirm) { + import('confirm').then(({default: confirm}) => { confirm({ title: globalize.translate('DeleteUser'), text: msg, @@ -45,7 +55,7 @@ define(['loading', 'dom', 'globalize', 'date-fns', 'dfnshelper', 'paper-icon-but icon: 'delete' }); - require(['actionsheet'], function (actionsheet) { + import('actionsheet').then(({default: actionsheet}) => { actionsheet.show({ items: menuItems, positionTo: card, @@ -153,7 +163,7 @@ define(['loading', 'dom', 'globalize', 'date-fns', 'dfnshelper', 'paper-icon-but icon: 'delete' }); - require(['actionsheet'], function (actionsheet) { + import('actionsheet').then(({default: actionsheet}) => { var card = dom.parentWithClass(elem, 'card'); var page = dom.parentWithClass(card, 'page'); var id = card.getAttribute('data-id'); @@ -236,7 +246,7 @@ define(['loading', 'dom', 'globalize', 'date-fns', 'dfnshelper', 'paper-icon-but } function showInvitePopup(page) { - require(['components/guestinviter/guestinviter'], function (guestinviter) { + import('components/guestinviter/guestinviter').then(({default: guestinviter}) => { guestinviter.show().then(function () { loadData(page); }); @@ -266,4 +276,5 @@ define(['loading', 'dom', 'globalize', 'date-fns', 'dfnshelper', 'paper-icon-but pageIdOn('pagebeforeshow', 'userProfilesPage', function () { loadData(this); }); -}); + +/* eslint-enable indent */ From 8ad12fa0bbee164443af9f049ae5eaf5959389dc Mon Sep 17 00:00:00 2001 From: Cameron Date: Thu, 9 Jul 2020 14:23:41 +0100 Subject: [PATCH 064/244] migration of device and devices.js to ES6 modules --- package.json | 2 ++ src/controllers/dashboard/devices/device.js | 14 ++++++++---- src/controllers/dashboard/devices/devices.js | 23 +++++++++++++++----- 3 files changed, 29 insertions(+), 10 deletions(-) diff --git a/package.json b/package.json index 230eee3f21..f0b5d34b78 100644 --- a/package.json +++ b/package.json @@ -132,6 +132,8 @@ "src/controllers/dashboard/logs.js", "src/controllers/user/subtitles.js", "src/controllers/dashboard/plugins/repositories.js", + "src/controllers/dashboard/devices/devices.js", + "src/controllers/dashboard/devices/device.js", "src/plugins/bookPlayer/plugin.js", "src/plugins/bookPlayer/tableOfContents.js", "src/plugins/photoPlayer/plugin.js", diff --git a/src/controllers/dashboard/devices/device.js b/src/controllers/dashboard/devices/device.js index 9ff3f5902e..69a282db6b 100644 --- a/src/controllers/dashboard/devices/device.js +++ b/src/controllers/dashboard/devices/device.js @@ -1,5 +1,10 @@ -define(['loading', 'libraryMenu', 'dom', 'emby-input', 'emby-button'], function (loading, libraryMenu, dom) { - 'use strict'; +import loading from 'loading'; +import libraryMenu from 'libraryMenu'; +import dom from 'dom'; +import 'emby-input'; +import 'emby-button'; + +/* eslint-disable indent */ function load(page, device, deviceOptions) { page.querySelector('#txtCustomName', page).value = deviceOptions.CustomName || ''; @@ -43,8 +48,9 @@ define(['loading', 'libraryMenu', 'dom', 'emby-input', 'emby-button'], function return false; } - return function (view, params) { + export default function (view, params) { view.querySelector('form').addEventListener('submit', onSubmit); view.addEventListener('viewshow', loadData); }; -}); + +/* eslint-enable indent */ diff --git a/src/controllers/dashboard/devices/devices.js b/src/controllers/dashboard/devices/devices.js index 0dea81c756..fe8f9e6124 100644 --- a/src/controllers/dashboard/devices/devices.js +++ b/src/controllers/dashboard/devices/devices.js @@ -1,5 +1,15 @@ -define(['loading', 'dom', 'libraryMenu', 'globalize', 'scripts/imagehelper', 'date-fns', 'dfnshelper', 'emby-button', 'emby-itemscontainer', 'cardStyle'], function (loading, dom, libraryMenu, globalize, imageHelper, datefns, dfnshelper) { - 'use strict'; +import loading from 'loading'; +import dom from 'dom'; +import libraryMenu from 'libraryMenu'; +import globalize from 'globalize'; +import imageHelper from 'scripts/imagehelper'; +import * as datefns from 'date-fns'; +import dfnshelper from 'dfnshelper'; +import 'emby-button'; +import 'emby-itemscontainer'; +import 'cardStyle'; + +/* eslint-disable indent */ function canDelete(deviceId) { return deviceId !== ApiClient.deviceId(); @@ -8,7 +18,7 @@ define(['loading', 'dom', 'libraryMenu', 'globalize', 'scripts/imagehelper', 'da function deleteDevice(page, id) { var msg = globalize.translate('DeleteDeviceConfirmation'); - require(['confirm'], function (confirm) { + import('confirm').then(({default: confirm}) => { confirm({ text: msg, title: globalize.translate('HeaderDeleteDevice'), @@ -47,7 +57,7 @@ define(['loading', 'dom', 'libraryMenu', 'globalize', 'scripts/imagehelper', 'da }); } - require(['actionsheet'], function (actionsheet) { + import('actionsheet').then(({default: actionsheet}) => { actionsheet.show({ items: menuItems, positionTo: btn, @@ -125,7 +135,7 @@ define(['loading', 'dom', 'libraryMenu', 'globalize', 'scripts/imagehelper', 'da } var canEdit = ApiClient.isMinServerVersion('3.4.1.31'); - return function (view, params) { + export default function (view, params) { view.querySelector('.devicesList').addEventListener('click', function (e) { var btnDeviceMenu = dom.parentWithClass(e.target, 'btnDeviceMenu'); @@ -137,4 +147,5 @@ define(['loading', 'dom', 'libraryMenu', 'globalize', 'scripts/imagehelper', 'da loadData(this); }); }; -}); + +/* eslint-enable indent */ From e033a748ccf461fba47fa08f8477f9840029ad37 Mon Sep 17 00:00:00 2001 From: Cameron Date: Thu, 9 Jul 2020 16:20:32 +0100 Subject: [PATCH 065/244] Migration of all files in auth to ES6 Modules addserver forgotpassword forgotpasswordpin login selectserver --- package.json | 5 ++++ src/controllers/auth/addserver.js | 18 ++++++++++----- src/controllers/auth/forgotpassword.js | 10 ++++---- src/controllers/auth/forgotpasswordpin.js | 10 ++++---- src/controllers/auth/login.js | 23 ++++++++++++++----- src/controllers/auth/selectserver.js | 28 +++++++++++++++++++---- 6 files changed, 69 insertions(+), 25 deletions(-) diff --git a/package.json b/package.json index 230eee3f21..510c63aa07 100644 --- a/package.json +++ b/package.json @@ -129,6 +129,11 @@ "src/components/syncPlay/playbackPermissionManager.js", "src/components/syncPlay/syncPlayManager.js", "src/components/syncPlay/timeSyncManager.js", + "src/controllers/auth/addserver.js", + "src/controllers/auth/forgotpassword.js", + "src/controllers/auth/forgotpasswordpin.js", + "src/controllers/auth/login.js", + "src/controllers/auth/selectserver.js", "src/controllers/dashboard/logs.js", "src/controllers/user/subtitles.js", "src/controllers/dashboard/plugins/repositories.js", diff --git a/src/controllers/auth/addserver.js b/src/controllers/auth/addserver.js index 622d19082e..3c0fb3be04 100644 --- a/src/controllers/auth/addserver.js +++ b/src/controllers/auth/addserver.js @@ -1,5 +1,10 @@ -define(['appSettings', 'loading', 'browser', 'globalize', 'emby-button'], function(appSettings, loading, browser, globalize) { - 'use strict'; +import appSettings from 'appSettings'; +import loading from 'loading'; +import browser from 'browser'; +import globalize from 'globalize'; +import 'emby-button'; + +/* eslint-disable indent */ function handleConnectionResult(page, result) { loading.hide(); @@ -42,11 +47,11 @@ define(['appSettings', 'loading', 'browser', 'globalize', 'emby-button'], functi }); } - return function(view, params) { + export default function(view, params) { view.querySelector('.addServerForm').addEventListener('submit', onServerSubmit); view.querySelector('.btnCancel').addEventListener('click', goBack); - require(['autoFocuser'], function (autoFocuser) { + import('autoFocuser').then(({default: autoFocuser}) => { autoFocuser.autoFocus(view); }); @@ -57,9 +62,10 @@ define(['appSettings', 'loading', 'browser', 'globalize', 'emby-button'], functi } function goBack() { - require(['appRouter'], function(appRouter) { + import('appRouter').then(({default: appRouter}) => { appRouter.back(); }); } }; -}); + +/* eslint-enable indent */ diff --git a/src/controllers/auth/forgotpassword.js b/src/controllers/auth/forgotpassword.js index 3756bf814d..f9fd1c2bce 100644 --- a/src/controllers/auth/forgotpassword.js +++ b/src/controllers/auth/forgotpassword.js @@ -1,5 +1,6 @@ -define(['globalize'], function (globalize) { - 'use strict'; +import globalize from 'globalize'; + +/* eslint-disable indent */ function processForgotPasswordResult(result) { if ('ContactAdmin' == result.Action) { @@ -34,7 +35,7 @@ define(['globalize'], function (globalize) { } } - return function (view, params) { + export default function (view, params) { function onSubmit(e) { ApiClient.ajax({ type: 'POST', @@ -50,4 +51,5 @@ define(['globalize'], function (globalize) { view.querySelector('form').addEventListener('submit', onSubmit); }; -}); + +/* eslint-enable indent */ diff --git a/src/controllers/auth/forgotpasswordpin.js b/src/controllers/auth/forgotpasswordpin.js index 2a51890d2f..d0b20f6884 100644 --- a/src/controllers/auth/forgotpasswordpin.js +++ b/src/controllers/auth/forgotpasswordpin.js @@ -1,5 +1,6 @@ -define(['globalize'], function (globalize) { - 'use strict'; +import globalize from 'globalize'; + +/* eslint-disable indent */ function processForgotPasswordResult(result) { if (result.Success) { @@ -22,7 +23,7 @@ define(['globalize'], function (globalize) { }); } - return function (view, params) { + export default function (view, params) { function onSubmit(e) { ApiClient.ajax({ type: 'POST', @@ -38,4 +39,5 @@ define(['globalize'], function (globalize) { view.querySelector('form').addEventListener('submit', onSubmit); }; -}); + +/* eslint-disable indent */ diff --git a/src/controllers/auth/login.js b/src/controllers/auth/login.js index c0c37e27d6..ead35d052a 100644 --- a/src/controllers/auth/login.js +++ b/src/controllers/auth/login.js @@ -1,5 +1,15 @@ -define(['apphost', 'appSettings', 'dom', 'connectionManager', 'loading', 'layoutManager', 'browser', 'globalize', 'cardStyle', 'emby-checkbox'], function (appHost, appSettings, dom, connectionManager, loading, layoutManager, browser, globalize) { - 'use strict'; +import appHost from 'apphost'; +import appSettings from 'appSettings'; +import dom from 'dom'; +import connectionManager from 'connectionManager'; +import loading from 'loading'; +import layoutManager from 'layoutManager'; +import browser from 'browser'; +import globalize from 'globalize'; +import 'cardStyle'; +import 'emby-checkbox'; + +/* eslint-disable indent */ var enableFocusTransform = !browser.slow && !browser.edge; @@ -26,7 +36,7 @@ define(['apphost', 'appSettings', 'dom', 'connectionManager', 'loading', 'layout const UnauthorizedOrForbidden = [401, 403]; if (UnauthorizedOrForbidden.includes(response.status)) { - require(['toast'], function (toast) { + import('toast').then(({default: toast}) => { const messageKey = response.status === 401 ? 'MessageInvalidUser' : 'MessageUnauthorizedUser'; toast(globalize.translate(messageKey)); }); @@ -131,7 +141,7 @@ define(['apphost', 'appSettings', 'dom', 'connectionManager', 'loading', 'layout context.querySelector('#divUsers').innerHTML = html; } - return function (view, params) { + export default function (view, params) { function getApiClient() { var serverId = params.serverid; @@ -147,7 +157,7 @@ define(['apphost', 'appSettings', 'dom', 'connectionManager', 'loading', 'layout view.querySelector('.manualLoginForm').classList.add('hide'); view.querySelector('.btnManual').classList.remove('hide'); - require(['autoFocuser'], function (autoFocuser) { + import('autoFocuser').then(({default: autoFocuser}) => { autoFocuser.autoFocus(view); }); } @@ -216,4 +226,5 @@ define(['apphost', 'appSettings', 'dom', 'connectionManager', 'loading', 'layout }); }); }; -}); + +/* eslint-enable indent */ diff --git a/src/controllers/auth/selectserver.js b/src/controllers/auth/selectserver.js index ba88313484..2bdfaf1abc 100644 --- a/src/controllers/auth/selectserver.js +++ b/src/controllers/auth/selectserver.js @@ -1,5 +1,22 @@ -define(['loading', 'appRouter', 'layoutManager', 'appSettings', 'apphost', 'focusManager', 'connectionManager', 'globalize', 'actionsheet', 'dom', 'browser', 'material-icons', 'flexStyles', 'emby-scroller', 'emby-itemscontainer', 'cardStyle', 'emby-button'], function (loading, appRouter, layoutManager, appSettings, appHost, focusManager, connectionManager, globalize, actionSheet, dom, browser) { - 'use strict'; +import loading from 'loading'; +import appRouter from 'appRouter'; +import layoutManager from 'layoutManager'; +import appSettings from 'appSettings'; +import appHost from 'apphost'; +import focusManager from 'focusManager'; +import connectionManager from 'connectionManager'; +import globalize from 'globalize'; +import actionSheet from 'actionsheet'; +import dom from 'dom'; +import browser from 'browser'; +import 'material-icons'; +import 'flexStyles'; +import 'emby-scroller'; +import 'emby-itemscontainer'; +import 'cardStyle'; +import 'emby-button'; + +/* eslint-disable indent */ var enableFocusTransform = !browser.slow && !browser.edge; @@ -89,7 +106,7 @@ define(['loading', 'appRouter', 'layoutManager', 'appSettings', 'apphost', 'focu } function alertTextWithOptions(options) { - require(['alert'], function (alert) { + import('alert').then(({default: alert}) => { alert(options); }); } @@ -98,7 +115,7 @@ define(['loading', 'appRouter', 'layoutManager', 'appSettings', 'apphost', 'focu alertText(globalize.translate('MessageUnableToConnectToServer')); } - return function (view, params) { + export default function (view, params) { function connectToServer(server) { loading.show(); connectionManager.connectToServer(server, { @@ -205,4 +222,5 @@ define(['loading', 'appRouter', 'layoutManager', 'appSettings', 'apphost', 'focu } }); }; -}); + +/* eslint-enable indent */ From 1be111eeef20c8eaa2f0ba36b5b2edfec4c45d1d Mon Sep 17 00:00:00 2001 From: Dmitry Lyzo Date: Wed, 8 Jul 2020 14:23:59 +0300 Subject: [PATCH 066/244] Use proper target property --- src/controllers/playback/videoosd.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/controllers/playback/videoosd.js b/src/controllers/playback/videoosd.js index 634e4d3093..b54d30a387 100644 --- a/src/controllers/playback/videoosd.js +++ b/src/controllers/playback/videoosd.js @@ -1102,7 +1102,7 @@ define(['playbackManager', 'dom', 'inputManager', 'datetime', 'itemHelper', 'med var clickedElement; function onKeyDown(e) { - clickedElement = e.srcElement; + clickedElement = e.target; var key = keyboardnavigation.getKeyName(e); @@ -1223,7 +1223,7 @@ define(['playbackManager', 'dom', 'inputManager', 'datetime', 'itemHelper', 'med } function onWindowMouseDown(e) { - clickedElement = e.srcElement; + clickedElement = e.target; lockOsd(); } @@ -1232,7 +1232,7 @@ define(['playbackManager', 'dom', 'inputManager', 'datetime', 'itemHelper', 'med } function onWindowTouchStart(e) { - clickedElement = e.srcElement; + clickedElement = e.target; lockOsd(); } From 8843f7cb9301006812b917f8d3c4d5151ad97835 Mon Sep 17 00:00:00 2001 From: Dmitry Lyzo Date: Thu, 9 Jul 2020 19:05:24 +0300 Subject: [PATCH 067/244] Fix OSD lock --- src/controllers/playback/videoosd.js | 77 +++++++++++++++++----------- 1 file changed, 48 insertions(+), 29 deletions(-) diff --git a/src/controllers/playback/videoosd.js b/src/controllers/playback/videoosd.js index b54d30a387..823d43ee4c 100644 --- a/src/controllers/playback/videoosd.js +++ b/src/controllers/playback/videoosd.js @@ -333,21 +333,17 @@ define(['playbackManager', 'dom', 'inputManager', 'datetime', 'itemHelper', 'med osdPoster.innerHTML = ''; } - let osdLockCount = 0; + let mouseIsDown = false; function showOsd() { slideDownToShow(headerElement); showMainOsdControls(); - if (!osdLockCount) { + if (!mouseIsDown) { startOsdHideTimer(); } } function hideOsd() { - if (osdLockCount) { - return; - } - slideUpToHide(headerElement); hideMainOsdControls(); } @@ -360,19 +356,6 @@ define(['playbackManager', 'dom', 'inputManager', 'datetime', 'itemHelper', 'med } } - function lockOsd() { - osdLockCount++; - stopOsdHideTimer(); - } - - function unlockOsd() { - osdLockCount--; - // Restart hide timer if OSD is currently visible - if (currentVisibleMenu && !osdLockCount) { - startOsdHideTimer(); - } - } - function startOsdHideTimer() { stopOsdHideTimer(); osdHideTimeout = setTimeout(hideOsd, 3e3); @@ -444,6 +427,17 @@ define(['playbackManager', 'dom', 'inputManager', 'datetime', 'itemHelper', 'med } } + // TODO: Move all idle-related code to `inputManager` or `idleManager` or `idleHelper` (per dialog thing) and listen event from there. + + function resetIdle() { + // Restart hide timer if OSD is currently visible + if (currentVisibleMenu && !mouseIsDown) { + startOsdHideTimer(); + } else { + stopOsdHideTimer(); + } + } + function onPointerMove(e) { if ('mouse' === (e.pointerType || (layoutManager.mobile ? 'touch' : 'mouse'))) { var eventX = e.screenX || 0; @@ -1216,28 +1210,35 @@ define(['playbackManager', 'dom', 'inputManager', 'datetime', 'itemHelper', 'med } function onKeyDownCapture() { - // Restart hide timer if OSD is currently visible - if (currentVisibleMenu) { - showOsd(); - } + resetIdle(); } function onWindowMouseDown(e) { clickedElement = e.target; - lockOsd(); + mouseIsDown = true; + resetIdle(); } function onWindowMouseUp() { - unlockOsd(); + mouseIsDown = false; + resetIdle(); } function onWindowTouchStart(e) { clickedElement = e.target; - lockOsd(); + mouseIsDown = true; + resetIdle(); } function onWindowTouchEnd() { - unlockOsd(); + mouseIsDown = false; + resetIdle(); + } + + function onWindowDragEnd() { + // mousedown -> dragstart -> dragend !!! no mouseup :( + mouseIsDown = false; + resetIdle(); } function getImgUrl(item, chapter, index, maxWidth, apiClient) { @@ -1373,24 +1374,33 @@ define(['playbackManager', 'dom', 'inputManager', 'datetime', 'itemHelper', 'med inputManager.on(window, onInputCommand); document.addEventListener('keydown', onKeyDown); dom.addEventListener(document, 'keydown', onKeyDownCapture, { - capture: true + capture: true, + passive: true }); /* eslint-disable-next-line compat/compat */ dom.addEventListener(window, window.PointerEvent ? 'pointerdown' : 'mousedown', onWindowMouseDown, { + capture: true, passive: true }); /* eslint-disable-next-line compat/compat */ dom.addEventListener(window, window.PointerEvent ? 'pointerup' : 'mouseup', onWindowMouseUp, { + capture: true, passive: true }); dom.addEventListener(window, 'touchstart', onWindowTouchStart, { + capture: true, passive: true }); ['touchend', 'touchcancel'].forEach((event) => { dom.addEventListener(window, event, onWindowTouchEnd, { + capture: true, passive: true }); }); + dom.addEventListener(window, 'dragend', onWindowDragEnd, { + capture: true, + passive: true + }); } catch (e) { require(['appRouter'], function(appRouter) { appRouter.goHome(); @@ -1404,24 +1414,33 @@ define(['playbackManager', 'dom', 'inputManager', 'datetime', 'itemHelper', 'med document.removeEventListener('keydown', onKeyDown); dom.removeEventListener(document, 'keydown', onKeyDownCapture, { - capture: true + capture: true, + passive: true }); /* eslint-disable-next-line compat/compat */ dom.removeEventListener(window, window.PointerEvent ? 'pointerdown' : 'mousedown', onWindowMouseDown, { + capture: true, passive: true }); /* eslint-disable-next-line compat/compat */ dom.removeEventListener(window, window.PointerEvent ? 'pointerup' : 'mouseup', onWindowMouseUp, { + capture: true, passive: true }); dom.removeEventListener(window, 'touchstart', onWindowTouchStart, { + capture: true, passive: true }); ['touchend', 'touchcancel'].forEach((event) => { dom.removeEventListener(window, event, onWindowTouchEnd, { + capture: true, passive: true }); }); + dom.removeEventListener(window, 'dragend', onWindowDragEnd, { + capture: true, + passive: true + }); stopOsdHideTimer(); headerElement.classList.remove('osdHeader'); headerElement.classList.remove('osdHeader-hidden'); From c5b7ce973fe336a12e74f8e011db3b31cd3a4c63 Mon Sep 17 00:00:00 2001 From: dkanada Date: Fri, 10 Jul 2020 01:56:47 +0900 Subject: [PATCH 068/244] update comment --- src/components/itemidentifier/itemidentifier.js | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/components/itemidentifier/itemidentifier.js b/src/components/itemidentifier/itemidentifier.js index 9b3afcde2e..6f638dc271 100644 --- a/src/components/itemidentifier/itemidentifier.js +++ b/src/components/itemidentifier/itemidentifier.js @@ -440,7 +440,7 @@ import 'cardStyle'; } } - //TODO investigate where was used this? + // TODO investigate where this was used function showEditorFindNew(itemName, itemYear, itemType, resolveFunc) { currentItem = null; @@ -547,4 +547,3 @@ export default { show: show, showFindNew: showFindNew }; - From 60a6023e77cd0ff1bf80f0416e59a6a7f0efcd5a Mon Sep 17 00:00:00 2001 From: Dmitry Lyzo Date: Fri, 10 Jul 2020 15:15:46 +0300 Subject: [PATCH 069/244] Keep OSD visible when dialog is open --- src/controllers/playback/videoosd.js | 26 ++++++++++++++++++++------ 1 file changed, 20 insertions(+), 6 deletions(-) diff --git a/src/controllers/playback/videoosd.js b/src/controllers/playback/videoosd.js index 823d43ee4c..dd0dc25efd 100644 --- a/src/controllers/playback/videoosd.js +++ b/src/controllers/playback/videoosd.js @@ -45,6 +45,10 @@ define(['playbackManager', 'dom', 'inputManager', 'datetime', 'itemHelper', 'med return null; } + function getOpenedDialog() { + return document.querySelector('.dialogContainer .dialog.opened'); + } + return function (view, params) { function onVerticalSwipe(e, elem, data) { var player = currentPlayer; @@ -338,9 +342,7 @@ define(['playbackManager', 'dom', 'inputManager', 'datetime', 'itemHelper', 'med function showOsd() { slideDownToShow(headerElement); showMainOsdControls(); - if (!mouseIsDown) { - startOsdHideTimer(); - } + resetIdle(); } function hideOsd() { @@ -430,8 +432,8 @@ define(['playbackManager', 'dom', 'inputManager', 'datetime', 'itemHelper', 'med // TODO: Move all idle-related code to `inputManager` or `idleManager` or `idleHelper` (per dialog thing) and listen event from there. function resetIdle() { - // Restart hide timer if OSD is currently visible - if (currentVisibleMenu && !mouseIsDown) { + // Restart hide timer if OSD is currently visible and there is no opened dialog + if (currentVisibleMenu && !mouseIsDown && !getOpenedDialog()) { startOsdHideTimer(); } else { stopOsdHideTimer(); @@ -954,7 +956,11 @@ define(['playbackManager', 'dom', 'inputManager', 'datetime', 'itemHelper', 'med stats: true, suboffset: showSubOffset, onOption: onSettingsOption + }).finally(() => { + resetIdle(); }); + + setTimeout(resetIdle, 0); } }); } @@ -1023,7 +1029,11 @@ define(['playbackManager', 'dom', 'inputManager', 'datetime', 'itemHelper', 'med if (index !== currentIndex) { playbackManager.setAudioStreamIndex(index, player); } + }).finally(() => { + resetIdle(); }); + + setTimeout(resetIdle, 0); }); } @@ -1067,7 +1077,11 @@ define(['playbackManager', 'dom', 'inputManager', 'datetime', 'itemHelper', 'med } toggleSubtitleSync(); + }).finally(() => { + resetIdle(); }); + + setTimeout(resetIdle, 0); }); } @@ -1118,7 +1132,7 @@ define(['playbackManager', 'dom', 'inputManager', 'datetime', 'itemHelper', 'med case 'Escape': case 'Back': // Ignore key when some dialog is opened - if (currentVisibleMenu === 'osd' && !document.querySelector('.dialogContainer')) { + if (currentVisibleMenu === 'osd' && !getOpenedDialog()) { hideOsd(); e.stopPropagation(); } From b4e43f2436981e3d4201ac201e8cff662d50bb53 Mon Sep 17 00:00:00 2001 From: Cameron Date: Fri, 10 Jul 2020 18:09:02 +0100 Subject: [PATCH 070/244] remove var --- .../emby-itemscontainer.js | 97 +++++++++---------- .../emby-playstatebutton.js | 26 ++--- .../emby-programcell/emby-programcell.js | 2 +- 3 files changed, 62 insertions(+), 63 deletions(-) diff --git a/src/elements/emby-itemscontainer/emby-itemscontainer.js b/src/elements/emby-itemscontainer/emby-itemscontainer.js index 5c456b6fe2..58e8565289 100644 --- a/src/elements/emby-itemscontainer/emby-itemscontainer.js +++ b/src/elements/emby-itemscontainer/emby-itemscontainer.js @@ -14,12 +14,12 @@ import 'registerElement'; /* eslint-disable indent */ - var ItemsContainerPrototype = Object.create(HTMLDivElement.prototype); + const ItemsContainerPrototype = Object.create(HTMLDivElement.prototype); function onClick(e) { - var itemsContainer = this; - var target = e.target; - var multiSelect = itemsContainer.multiSelect; + const itemsContainer = this; + const target = e.target; + let multiSelect = itemsContainer.multiSelect; if (multiSelect) { if (multiSelect.onContainerClick.call(itemsContainer, e) === false) { @@ -37,9 +37,8 @@ import 'registerElement'; } function onContextMenu(e) { - var itemsContainer = this; - var target = e.target; - var card = dom.parentWithAttribute(target, 'data-id'); + const target = e.target; + const card = dom.parentWithAttribute(target, 'data-id'); // check for serverId, it won't be present on selectserver if (card && card.getAttribute('data-serverid')) { @@ -60,7 +59,7 @@ import 'registerElement'; } ItemsContainerPrototype.enableMultiSelect = function (enabled) { - var current = this.multiSelect; + const current = this.multiSelect; if (!enabled) { if (current) { @@ -74,7 +73,7 @@ import 'registerElement'; return; } - var self = this; + const self = this; import('multiSelect').then(({default: MultiSelect}) => { self.multiSelect = new MultiSelect({ container: self, @@ -84,14 +83,14 @@ import 'registerElement'; }; function onDrop(evt, itemsContainer) { - var el = evt.item; + const el = evt.item; - var newIndex = evt.newIndex; - var itemId = el.getAttribute('data-playlistitemid'); - var playlistId = el.getAttribute('data-playlistid'); + const newIndex = evt.newIndex; + const itemId = el.getAttribute('data-playlistitemid'); + const playlistId = el.getAttribute('data-playlistid'); if (!playlistId) { - var oldIndex = evt.oldIndex; + const oldIndex = evt.oldIndex; el.dispatchEvent(new CustomEvent('itemdrop', { detail: { oldIndex: oldIndex, @@ -104,8 +103,8 @@ import 'registerElement'; return; } - var serverId = el.getAttribute('data-serverid'); - var apiClient = connectionManager.getApiClient(serverId); + const serverId = el.getAttribute('data-serverid'); + const apiClient = connectionManager.getApiClient(serverId); loading.show(); @@ -121,7 +120,7 @@ import 'registerElement'; } ItemsContainerPrototype.enableDragReordering = function (enabled) { - var current = this.sortable; + const current = this.sortable; if (!enabled) { if (current) { current.destroy(); @@ -134,7 +133,7 @@ import 'registerElement'; return; } - var self = this; + const self = this; import('sortable').then(({default: Sortable}) => { self.sortable = new Sortable(self, { draggable: '.listItem', @@ -150,13 +149,13 @@ import 'registerElement'; function onUserDataChanged(e, apiClient, userData) { - var itemsContainer = this; + const itemsContainer = this; import('cardBuilder').then(({default: cardBuilder}) => { cardBuilder.onUserDataChanged(userData, itemsContainer); }); - var eventsToMonitor = getEventsToMonitor(itemsContainer); + const eventsToMonitor = getEventsToMonitor(itemsContainer); // TODO: Check user data change reason? if (eventsToMonitor.indexOf('markfavorite') !== -1) { @@ -167,7 +166,7 @@ import 'registerElement'; } function getEventsToMonitor(itemsContainer) { - var monitor = itemsContainer.getAttribute('data-monitor'); + let monitor = itemsContainer.getAttribute('data-monitor'); if (monitor) { return monitor.split(','); } @@ -177,16 +176,16 @@ import 'registerElement'; function onTimerCreated(e, apiClient, data) { - var itemsContainer = this; + const itemsContainer = this; if (getEventsToMonitor(itemsContainer).indexOf('timers') !== -1) { itemsContainer.notifyRefreshNeeded(); return; } - var programId = data.ProgramId; + const programId = data.ProgramId; // This could be null, not supported by all tv providers - var newTimerId = data.Id; + const newTimerId = data.Id; import('cardBuilder').then(({default: cardBuilder}) => { cardBuilder.onTimerCreated(programId, newTimerId, itemsContainer); @@ -194,7 +193,7 @@ import 'registerElement'; } function onSeriesTimerCreated(e, apiClient, data) { - var itemsContainer = this; + const itemsContainer = this; if (getEventsToMonitor(itemsContainer).indexOf('seriestimers') !== -1) { itemsContainer.notifyRefreshNeeded(); return; @@ -202,7 +201,7 @@ import 'registerElement'; } function onTimerCancelled(e, apiClient, data) { - var itemsContainer = this; + const itemsContainer = this; if (getEventsToMonitor(itemsContainer).indexOf('timers') !== -1) { itemsContainer.notifyRefreshNeeded(); return; @@ -214,7 +213,7 @@ import 'registerElement'; } function onSeriesTimerCancelled(e, apiClient, data) { - var itemsContainer = this; + const itemsContainer = this; if (getEventsToMonitor(itemsContainer).indexOf('seriestimers') !== -1) { itemsContainer.notifyRefreshNeeded(); return; @@ -226,25 +225,25 @@ import 'registerElement'; } function onLibraryChanged(e, apiClient, data) { - var itemsContainer = this; + const itemsContainer = this; - var eventsToMonitor = getEventsToMonitor(itemsContainer); + const eventsToMonitor = getEventsToMonitor(itemsContainer); if (eventsToMonitor.indexOf('seriestimers') !== -1 || eventsToMonitor.indexOf('timers') !== -1) { // yes this is an assumption return; } - var itemsAdded = data.ItemsAdded || []; - var itemsRemoved = data.ItemsRemoved || []; + const itemsAdded = data.ItemsAdded || []; + const itemsRemoved = data.ItemsRemoved || []; if (!itemsAdded.length && !itemsRemoved.length) { return; } - var parentId = itemsContainer.getAttribute('data-parentid'); + const parentId = itemsContainer.getAttribute('data-parentid'); if (parentId) { - var foldersAddedTo = data.FoldersAddedTo || []; - var foldersRemovedFrom = data.FoldersRemovedFrom || []; - var collectionFolders = data.CollectionFolders || []; + const foldersAddedTo = data.FoldersAddedTo || []; + const foldersRemovedFrom = data.FoldersRemovedFrom || []; + const collectionFolders = data.CollectionFolders || []; if (foldersAddedTo.indexOf(parentId) === -1 && foldersRemovedFrom.indexOf(parentId) === -1 && collectionFolders.indexOf(parentId) === -1) { return; @@ -255,10 +254,10 @@ import 'registerElement'; } function onPlaybackStopped(e, stopInfo) { - var itemsContainer = this; - var state = stopInfo.state; + const itemsContainer = this; + const state = stopInfo.state; - var eventsToMonitor = getEventsToMonitor(itemsContainer); + const eventsToMonitor = getEventsToMonitor(itemsContainer); if (state.NowPlayingItem && state.NowPlayingItem.MediaType === 'Video') { if (eventsToMonitor.indexOf('videoplayback') !== -1) { itemsContainer.notifyRefreshNeeded(true); @@ -273,14 +272,14 @@ import 'registerElement'; } function addNotificationEvent(instance, name, handler, owner) { - var localHandler = handler.bind(instance); + const localHandler = handler.bind(instance); owner = owner || serverNotifications; events.on(owner, name, localHandler); instance['event_' + name] = localHandler; } function removeNotificationEvent(instance, name, owner) { - var handler = instance['event_' + name]; + const handler = instance['event_' + name]; if (handler) { owner = owner || serverNotifications; events.off(owner, name, handler); @@ -360,10 +359,10 @@ import 'registerElement'; ItemsContainerPrototype.resume = function (options) { this.paused = false; - var refreshIntervalEndTime = this.refreshIntervalEndTime; + let refreshIntervalEndTime = this.refreshIntervalEndTime; if (refreshIntervalEndTime) { - var remainingMs = refreshIntervalEndTime - new Date().getTime(); + const remainingMs = refreshIntervalEndTime - new Date().getTime(); if (remainingMs > 0 && !this.needsRefresh) { resetRefreshInterval(this, remainingMs); } else { @@ -400,7 +399,7 @@ import 'registerElement'; return; } - var timeout = this.refreshTimeout; + let timeout = this.refreshTimeout; if (timeout) { clearTimeout(timeout); } @@ -437,9 +436,9 @@ import 'registerElement'; } function onDataFetched(result) { - var items = result.Items || result; + const items = result.Items || result; - var parentContainer = this.parentContainer; + let parentContainer = this.parentContainer; if (parentContainer) { if (items.length) { parentContainer.classList.remove('hide'); @@ -448,9 +447,9 @@ import 'registerElement'; } } - var activeElement = document.activeElement; - var focusId; - var hasActiveElement; + const activeElement = document.activeElement; + let focusId; + let hasActiveElement; if (this.contains(activeElement)) { hasActiveElement = true; @@ -474,7 +473,7 @@ import 'registerElement'; function setFocus(itemsContainer, focusId) { if (focusId) { - var newElement = itemsContainer.querySelector('[data-id="' + focusId + '"]'); + const newElement = itemsContainer.querySelector('[data-id="' + focusId + '"]'); if (newElement) { try { focusManager.focus(newElement); diff --git a/src/elements/emby-playstatebutton/emby-playstatebutton.js b/src/elements/emby-playstatebutton/emby-playstatebutton.js index a14d913387..e1b34318b8 100644 --- a/src/elements/emby-playstatebutton/emby-playstatebutton.js +++ b/src/elements/emby-playstatebutton/emby-playstatebutton.js @@ -7,13 +7,13 @@ import EmbyButtonPrototype from 'emby-button'; /* eslint-disable indent */ function addNotificationEvent(instance, name, handler) { - var localHandler = handler.bind(instance); + const localHandler = handler.bind(instance); events.on(serverNotifications, name, localHandler); instance[name] = localHandler; } function removeNotificationEvent(instance, name) { - var handler = instance[name]; + const handler = instance[name]; if (handler) { events.off(serverNotifications, name, handler); instance[name] = null; @@ -22,10 +22,10 @@ import EmbyButtonPrototype from 'emby-button'; function onClick(e) { - var button = this; - var id = button.getAttribute('data-id'); - var serverId = button.getAttribute('data-serverid'); - var apiClient = connectionManager.getApiClient(serverId); + const button = this; + const id = button.getAttribute('data-id'); + const serverId = button.getAttribute('data-serverid'); + const apiClient = connectionManager.getApiClient(serverId); if (!button.classList.contains('playstatebutton-played')) { apiClient.markPlayed(apiClient.getCurrentUserId(), id, new Date()); @@ -37,14 +37,14 @@ import EmbyButtonPrototype from 'emby-button'; } function onUserDataChanged(e, apiClient, userData) { - var button = this; + const button = this; if (userData.ItemId === button.getAttribute('data-id')) { setState(button, userData.Played); } } function setState(button, played, updateAttribute) { - var icon = button.iconElement; + let icon = button.iconElement; if (!icon) { button.iconElement = button.querySelector('.material-icons'); icon = button.iconElement; @@ -77,7 +77,7 @@ import EmbyButtonPrototype from 'emby-button'; button.title = globalize.translate('Played'); } - var text = button.querySelector('.button-text'); + let text = button.querySelector('.button-text'); if (text) { text.innerHTML = button.title; } @@ -97,7 +97,7 @@ import EmbyButtonPrototype from 'emby-button'; addNotificationEvent(button, 'UserDataChanged', onUserDataChanged); } - var EmbyPlaystateButtonPrototype = Object.create(EmbyButtonPrototype); + const EmbyPlaystateButtonPrototype = Object.create(EmbyButtonPrototype); EmbyPlaystateButtonPrototype.createdCallback = function () { @@ -114,8 +114,8 @@ import EmbyButtonPrototype from 'emby-button'; EmbyButtonPrototype.attachedCallback.call(this); } - var itemId = this.getAttribute('data-id'); - var serverId = this.getAttribute('data-serverid'); + const itemId = this.getAttribute('data-id'); + const serverId = this.getAttribute('data-serverid'); if (itemId && serverId) { setState(this, this.getAttribute('data-played') === 'true', false); @@ -142,7 +142,7 @@ import EmbyButtonPrototype from 'emby-button'; this.setAttribute('data-id', item.Id); this.setAttribute('data-serverid', item.ServerId); - var played = item.UserData && item.UserData.Played; + const played = item.UserData && item.UserData.Played; setState(this, played); bindEvents(this); diff --git a/src/elements/emby-programcell/emby-programcell.js b/src/elements/emby-programcell/emby-programcell.js index d5f6de8a09..d1f1820e5e 100644 --- a/src/elements/emby-programcell/emby-programcell.js +++ b/src/elements/emby-programcell/emby-programcell.js @@ -1,4 +1,4 @@ -var ProgramCellPrototype = Object.create(HTMLButtonElement.prototype); +const ProgramCellPrototype = Object.create(HTMLButtonElement.prototype); ProgramCellPrototype.detachedCallback = function () { this.posLeft = null; From e3d95185743af27adfec7ff181bd50028e326109 Mon Sep 17 00:00:00 2001 From: Cameron Date: Fri, 10 Jul 2020 19:56:24 +0100 Subject: [PATCH 071/244] remove rerquire and update var declerations --- src/components/itemContextMenu.js | 76 +++++++++++++++---------------- src/components/maintabsmanager.js | 46 +++++++++---------- 2 files changed, 61 insertions(+), 61 deletions(-) diff --git a/src/components/itemContextMenu.js b/src/components/itemContextMenu.js index 688ddd3490..010fe44c09 100644 --- a/src/components/itemContextMenu.js +++ b/src/components/itemContextMenu.js @@ -12,13 +12,13 @@ import actionsheet from 'actionsheet'; /* eslint-disable indent */ export function getCommands(options) { - var item = options.item; - var user = options.user; + const item = options.item; + const user = options.user; - var canPlay = playbackManager.canPlay(item); - var restrictOptions = (browser.operaTv || browser.web0s) && !user.Policy.IsAdministrator; + const canPlay = playbackManager.canPlay(item); + const restrictOptions = (browser.operaTv || browser.web0s) && !user.Policy.IsAdministrator; - var commands = []; + let commands = []; if (canPlay && item.MediaType !== 'Photo') { if (options.play !== false) { @@ -171,10 +171,10 @@ import actionsheet from 'actionsheet'; }); } - var canEdit = itemHelper.canEdit(user, item); + const canEdit = itemHelper.canEdit(user, item); if (canEdit) { if (options.edit !== false && item.Type !== 'SeriesTimer') { - var text = (item.Type === 'Timer' || item.Type === 'SeriesTimer') ? globalize.translate('Edit') : globalize.translate('EditMetadata'); + const text = (item.Type === 'Timer' || item.Type === 'SeriesTimer') ? globalize.translate('Edit') : globalize.translate('EditMetadata'); commands.push({ name: text, id: 'edit', @@ -321,31 +321,31 @@ import actionsheet from 'actionsheet'; } function executeCommand(item, id, options) { - var itemId = item.Id; - var serverId = item.ServerId; - var apiClient = connectionManager.getApiClient(serverId); + const itemId = item.Id; + const serverId = item.ServerId; + const apiClient = connectionManager.getApiClient(serverId); return new Promise(function (resolve, reject) { switch (id) { case 'addtocollection': - require(['collectionEditor'], function (collectionEditor) { - new collectionEditor.showEditor({ + import('collectionEditor').then(({default: collectionEditor}) => { + new collectionEditor({ items: [itemId], serverId: serverId }).then(getResolveFunction(resolve, id, true), getResolveFunction(resolve, id)); }); break; case 'addtoplaylist': - require(['playlistEditor'], function (playlistEditor) { - new playlistEditor.showEditor({ + import('playlistEditor').then(({default: playlistEditor}) => { + new playlistEditor({ items: [itemId], serverId: serverId }).then(getResolveFunction(resolve, id, true), getResolveFunction(resolve, id)); }); break; case 'download': - require(['fileDownloader'], function (fileDownloader) { - var downloadHref = apiClient.getItemDownloadUrl(itemId); + import('fileDownloader').then(({default: fileDownloader}) => { + const downloadHref = apiClient.getItemDownloadUrl(itemId); fileDownloader.download([{ url: downloadHref, itemId: itemId, @@ -357,16 +357,16 @@ import actionsheet from 'actionsheet'; }); break; case 'copy-stream': - var downloadHref = apiClient.getItemDownloadUrl(itemId); - var textAreaCopy = function () { - var textArea = document.createElement('textarea'); + const downloadHref = apiClient.getItemDownloadUrl(itemId); + const textAreaCopy = function () { + let textArea = document.createElement('textarea'); textArea.value = downloadHref; document.body.appendChild(textArea); textArea.focus(); textArea.select(); if (document.execCommand('copy')) { - require(['toast'], function (toast) { + import('toast').then(({default: toast}) => { toast(globalize.translate('CopyStreamURLSuccess')); }); } else { @@ -381,7 +381,7 @@ import actionsheet from 'actionsheet'; } else { /* eslint-disable-next-line compat/compat */ navigator.clipboard.writeText(downloadHref).then(function () { - require(['toast'], function (toast) { + import('toast').then(({default: toast}) => { toast(globalize.translate('CopyStreamURLSuccess')); }); }).catch(function () { @@ -391,7 +391,7 @@ import actionsheet from 'actionsheet'; getResolveFunction(resolve, id)(); break; case 'editsubtitles': - require(['subtitleEditor'], function (subtitleEditor) { + import('subtitleEditor').then(({default: subtitleEditor}) => { subtitleEditor.show(itemId, serverId).then(getResolveFunction(resolve, id, true), getResolveFunction(resolve, id)); }); break; @@ -399,7 +399,7 @@ import actionsheet from 'actionsheet'; editItem(apiClient, item).then(getResolveFunction(resolve, id, true), getResolveFunction(resolve, id)); break; case 'editimages': - require(['imageEditor'], function (imageEditor) { + import('imageEditor').then(({default: imageEditor}) => { imageEditor.show({ itemId: itemId, serverId: serverId @@ -407,12 +407,12 @@ import actionsheet from 'actionsheet'; }); break; case 'identify': - require(['itemIdentifier'], function (itemIdentifier) { + import('itemIdentifier').then(({default:itemIdentifier }) => { itemIdentifier.show(itemId, serverId).then(getResolveFunction(resolve, id, true), getResolveFunction(resolve, id)); }); break; case 'moremediainfo': - require(['itemMediaInfo'], function (itemMediaInfo) { + import('itemMediaInfo').then(({default: itemMediaInfo}) => { itemMediaInfo.show(itemId, serverId).then(getResolveFunction(resolve, id), getResolveFunction(resolve, id)); }); break; @@ -441,7 +441,7 @@ import actionsheet from 'actionsheet'; getResolveFunction(resolve, id)(); break; case 'record': - require(['recordingCreator'], function (recordingCreator) { + import('recordingCreator').then(({default: recordingCreator}) => { recordingCreator.show(itemId, serverId).then(getResolveFunction(resolve, id, true), getResolveFunction(resolve, id)); }); break; @@ -512,8 +512,8 @@ import actionsheet from 'actionsheet'; } function deleteTimer(apiClient, item, resolve, command) { - require(['recordingHelper'], function (recordingHelper) { - var timerId = item.TimerId || item.Id; + import('recordingHelper').then(({default: recordingHelper}) => { + const timerId = item.TimerId || item.Id; recordingHelper.cancelTimerWithConfirmation(timerId, item.ServerId).then(function () { getResolveFunction(resolve, command, true)(); }); @@ -521,7 +521,7 @@ import actionsheet from 'actionsheet'; } function deleteSeriesTimer(apiClient, item, resolve, command) { - require(['recordingHelper'], function (recordingHelper) { + import('recordingHelper').then(({default: recordingHelper}) => { recordingHelper.cancelSeriesTimerWithConfirmation(item.Id, item.ServerId).then(function () { getResolveFunction(resolve, command, true)(); }); @@ -529,9 +529,9 @@ import actionsheet from 'actionsheet'; } function play(item, resume, queue, queueNext) { - var method = queue ? (queueNext ? 'queueNext' : 'queue') : 'play'; + const method = queue ? (queueNext ? 'queueNext' : 'queue') : 'play'; - var startPosition = 0; + let startPosition = 0; if (resume && item.UserData && item.UserData.PlaybackPositionTicks) { startPosition = item.UserData.PlaybackPositionTicks; } @@ -552,18 +552,18 @@ import actionsheet from 'actionsheet'; function editItem(apiClient, item) { return new Promise(function (resolve, reject) { - var serverId = apiClient.serverInfo().Id; + const serverId = apiClient.serverInfo().Id; if (item.Type === 'Timer') { - require(['recordingEditor'], function (recordingEditor) { + import('recordingEditor').then(({default: recordingEditor}) => { recordingEditor.show(item.Id, serverId).then(resolve, reject); }); } else if (item.Type === 'SeriesTimer') { - require(['seriesRecordingEditor'], function (recordingEditor) { + import('seriesRecordingEditor').then(({default: recordingEditor}) => { recordingEditor.show(item.Id, serverId).then(resolve, reject); }); } else { - require(['metadataEditor'], function (metadataEditor) { + import('metadataEditor').then(({default: metadataEditor}) => { metadataEditor.show(item.Id, serverId).then(resolve, reject); }); } @@ -572,7 +572,7 @@ import actionsheet from 'actionsheet'; function deleteItem(apiClient, item) { return new Promise(function (resolve, reject) { - require(['deleteHelper'], function (deleteHelper) { + import('deleteHelper').then(({default: deleteHelper}) => { deleteHelper.deleteItem({ item: item, navigate: false @@ -584,7 +584,7 @@ import actionsheet from 'actionsheet'; } function refresh(apiClient, item) { - require(['refreshDialog'], function (refreshDialog) { + import('refreshDialog').then(({default: refreshDialog}) => { new refreshDialog({ itemIds: [item.Id], serverId: apiClient.serverInfo().Id, @@ -594,7 +594,7 @@ import actionsheet from 'actionsheet'; } export function show(options) { - var commands = getCommands(options); + const commands = getCommands(options); if (!commands.length) { return Promise.reject(); } diff --git a/src/components/maintabsmanager.js b/src/components/maintabsmanager.js index c73ebd97a8..343670eb86 100644 --- a/src/components/maintabsmanager.js +++ b/src/components/maintabsmanager.js @@ -6,11 +6,11 @@ import 'emby-button'; /* eslint-disable indent */ - var tabOwnerView; - var queryScope = document.querySelector('.skinHeader'); - var footerTabsContainer; - var headerTabsContainer; - var tabsElem; + let tabOwnerView; + const queryScope = document.querySelector('.skinHeader'); + let footerTabsContainer; + let headerTabsContainer; + let tabsElem; function enableTabsInFooter() { return false; @@ -49,7 +49,7 @@ import 'emby-button'; return false; } - var classList = elem.classList; + const classList = elem.classList; if (classList) { return !classList.contains('scrollX') && !classList.contains('animatedScrollX'); } @@ -57,7 +57,7 @@ import 'emby-button'; return true; } - var parent = target; + let parent = target; while (parent != null) { if (!allowSwipeOn(parent)) { return false; @@ -75,22 +75,22 @@ import 'emby-button'; } // implement without hammer - var pageCount = getTabContainersFn().length; - var onSwipeLeft = function (e, target) { + const pageCount = getTabContainersFn().length; + onSwipeLeft = function (e, target) { if (allowSwipe(target) && view.contains(target)) { tabsElem.selectNext(); } }; - var onSwipeRight = function (e, target) { + onSwipeRight = function (e, target) { if (allowSwipe(target) && view.contains(target)) { tabsElem.selectPrevious(); } }; - require(['touchHelper'], function (TouchHelper) { + import('touchHelper').then(({default: TouchHelper}) => { - var touchHelper = new TouchHelper(view.parentNode.parentNode); + const touchHelper = new TouchHelper(view.parentNode.parentNode); events.on(touchHelper, 'swipeleft', onSwipeLeft); events.on(touchHelper, 'swiperight', onSwipeRight); @@ -103,7 +103,7 @@ import 'emby-button'; export function setTabs(view, selectedIndex, getTabsFn, getTabContainersFn, onBeforeTabChange, onTabChange, setSelectedIndex) { - var enableInFooter = enableTabsInFooter(); + const enableInFooter = enableTabsInFooter(); if (!view) { if (tabOwnerView) { @@ -134,7 +134,7 @@ import 'emby-button'; ensureElements(enableInFooter); - var tabsContainerElem = enableInFooter ? footerTabsContainer : headerTabsContainer; + const tabsContainerElem = enableInFooter ? footerTabsContainer : headerTabsContainer; if (!tabOwnerView) { tabsContainerElem.classList.remove('hide'); @@ -142,18 +142,18 @@ import 'emby-button'; if (tabOwnerView !== view) { - var index = 0; + let index = 0; - var indexAttribute = selectedIndex == null ? '' : (' data-index="' + selectedIndex + '"'); - var tabsHtml = '
' + getTabsFn().map(function (t) { + const indexAttribute = selectedIndex == null ? '' : (' data-index="' + selectedIndex + '"'); + const tabsHtml = '
' + getTabsFn().map(function (t) { - var tabClass = 'emby-tab-button'; + let tabClass = 'emby-tab-button'; if (t.enabled === false) { tabClass += ' hide'; } - var tabHtml; + let tabHtml; if (t.cssClass) { tabClass += ' ' + t.cssClass; @@ -182,16 +182,16 @@ import 'emby-button'; tabsElem.addEventListener('beforetabchange', function (e) { - var tabContainers = getTabContainersFn(); + const tabContainers = getTabContainersFn(); if (e.detail.previousIndex != null) { - var previousPanel = tabContainers[e.detail.previousIndex]; + const previousPanel = tabContainers[e.detail.previousIndex]; if (previousPanel) { previousPanel.classList.remove('is-active'); } } - var newPanel = tabContainers[e.detail.selectedTabIndex]; + const newPanel = tabContainers[e.detail.selectedTabIndex]; //if (e.detail.previousIndex != null && e.detail.previousIndex != e.detail.selectedTabIndex) { // if (newPanel.animate && (animateTabs || []).indexOf(e.detail.selectedTabIndex) != -1) { @@ -248,7 +248,7 @@ import 'emby-button'; export function selectedTabIndex(index) { - var tabsContainerElem = headerTabsContainer; + const tabsContainerElem = headerTabsContainer; if (!tabsElem) { tabsElem = tabsContainerElem.querySelector('[is="emby-tabs"]'); From c18118275a8be8ba0767e03c0dd63c781b03a8ba Mon Sep 17 00:00:00 2001 From: Cameron Date: Fri, 10 Jul 2020 19:57:42 +0100 Subject: [PATCH 072/244] define functions --- src/components/maintabsmanager.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/maintabsmanager.js b/src/components/maintabsmanager.js index 343670eb86..0d31c2958a 100644 --- a/src/components/maintabsmanager.js +++ b/src/components/maintabsmanager.js @@ -76,13 +76,13 @@ import 'emby-button'; // implement without hammer const pageCount = getTabContainersFn().length; - onSwipeLeft = function (e, target) { + const onSwipeLeft = function (e, target) { if (allowSwipe(target) && view.contains(target)) { tabsElem.selectNext(); } }; - onSwipeRight = function (e, target) { + const onSwipeRight = function (e, target) { if (allowSwipe(target) && view.contains(target)) { tabsElem.selectPrevious(); } From 85b86712949ddb999678e044aef1f6c98add38f6 Mon Sep 17 00:00:00 2001 From: Cameron Date: Fri, 10 Jul 2020 20:05:00 +0100 Subject: [PATCH 073/244] update var declerations --- src/elements/emby-checkbox/emby-checkbox.js | 22 ++++++++-------- src/elements/emby-textarea/emby-textarea.js | 28 ++++++++++----------- src/elements/emby-toggle/emby-toggle.js | 6 ++--- 3 files changed, 28 insertions(+), 28 deletions(-) diff --git a/src/elements/emby-checkbox/emby-checkbox.js b/src/elements/emby-checkbox/emby-checkbox.js index 1f7d70e7ec..af611917ab 100644 --- a/src/elements/emby-checkbox/emby-checkbox.js +++ b/src/elements/emby-checkbox/emby-checkbox.js @@ -5,7 +5,7 @@ import 'registerElement'; /* eslint-disable indent */ - var EmbyCheckboxPrototype = Object.create(HTMLInputElement.prototype); + let EmbyCheckboxPrototype = Object.create(HTMLInputElement.prototype); function onKeyDown(e) { // Don't submit form on enter @@ -23,10 +23,10 @@ import 'registerElement'; } } - var enableRefreshHack = browser.tizen || browser.orsay || browser.operaTv || browser.web0s ? true : false; + const enableRefreshHack = browser.tizen || browser.orsay || browser.operaTv || browser.web0s ? true : false; function forceRefresh(loading) { - var elem = this.parentNode; + let elem = this.parentNode; elem.style.webkitAnimationName = 'repaintChrome'; elem.style.webkitAnimationDelay = (loading === true ? '500ms' : ''); @@ -47,22 +47,22 @@ import 'registerElement'; this.classList.add('emby-checkbox'); - var labelElement = this.parentNode; + const labelElement = this.parentNode; labelElement.classList.add('emby-checkbox-label'); - var labelTextElement = labelElement.querySelector('span'); + const labelTextElement = labelElement.querySelector('span'); - var outlineClass = 'checkboxOutline'; + const outlineClass = 'checkboxOutline'; - var customClass = this.getAttribute('data-outlineclass'); + const customClass = this.getAttribute('data-outlineclass'); if (customClass) { outlineClass += ' ' + customClass; } - var checkedIcon = this.getAttribute('data-checkedicon') || 'check'; - var uncheckedIcon = this.getAttribute('data-uncheckedicon') || ''; - var checkHtml = ''; - var uncheckedHtml = ''; + const checkedIcon = this.getAttribute('data-checkedicon') || 'check'; + const uncheckedIcon = this.getAttribute('data-uncheckedicon') || ''; + const checkHtml = ''; + const uncheckedHtml = ''; labelElement.insertAdjacentHTML('beforeend', '' + checkHtml + uncheckedHtml + ''); labelTextElement.classList.add('checkboxLabel'); diff --git a/src/elements/emby-textarea/emby-textarea.js b/src/elements/emby-textarea/emby-textarea.js index 9e813ad045..3b7624e74a 100644 --- a/src/elements/emby-textarea/emby-textarea.js +++ b/src/elements/emby-textarea/emby-textarea.js @@ -7,7 +7,7 @@ import 'emby-input'; /* eslint-disable indent */ function autoGrow(textarea, maxLines) { - var self = this; + const self = this; if (maxLines === undefined) { maxLines = 999; @@ -19,17 +19,17 @@ import 'emby-input'; * @returns {number} */ self.getOffset = function (textarea) { - var style = window.getComputedStyle(textarea, null); - var props = ['paddingTop', 'paddingBottom']; - var offset = 0; + const style = window.getComputedStyle(textarea, null); + const props = ['paddingTop', 'paddingBottom']; + let offset = 0; - for (var i = 0; i < props.length; i++) { + for (let i = 0; i < props.length; i++) { offset += parseInt(style[props[i]]); } return offset; }; - var offset; + let offset; function reset() { textarea.rows = 1; offset = self.getOffset(textarea); @@ -48,8 +48,8 @@ import 'emby-input'; textarea.rows = 3; return; } - var newHeight = 0; - var hasGrown = false; + let newHeight = 0; + let hasGrown = false; if ((textarea.scrollHeight - offset) > self.maxAllowedHeight) { textarea.style.overflowY = 'scroll'; @@ -72,17 +72,17 @@ import 'emby-input'; autogrowFn(); } - var EmbyTextAreaPrototype = Object.create(HTMLTextAreaElement.prototype); + const EmbyTextAreaPrototype = Object.create(HTMLTextAreaElement.prototype); - var elementId = 0; + let elementId = 0; if (Object.getOwnPropertyDescriptor && Object.defineProperty) { - var descriptor = Object.getOwnPropertyDescriptor(HTMLTextAreaElement.prototype, 'value'); + const descriptor = Object.getOwnPropertyDescriptor(HTMLTextAreaElement.prototype, 'value'); // descriptor returning null in webos if (descriptor && descriptor.configurable) { - var baseSetMethod = descriptor.set; + const baseSetMethod = descriptor.set; descriptor.set = function (value) { baseSetMethod.call(this, value); @@ -113,8 +113,8 @@ import 'emby-input'; this.rows = 1; this.classList.add('emby-textarea'); - var parentNode = this.parentNode; - var label = this.ownerDocument.createElement('label'); + const parentNode = this.parentNode; + const label = this.ownerDocument.createElement('label'); label.innerHTML = this.getAttribute('label') || ''; label.classList.add('textareaLabel'); diff --git a/src/elements/emby-toggle/emby-toggle.js b/src/elements/emby-toggle/emby-toggle.js index 5b9ab35394..99856923e9 100644 --- a/src/elements/emby-toggle/emby-toggle.js +++ b/src/elements/emby-toggle/emby-toggle.js @@ -3,7 +3,7 @@ import 'registerElement'; /* eslint-disable indent */ - var EmbyTogglePrototype = Object.create(HTMLInputElement.prototype); + const EmbyTogglePrototype = Object.create(HTMLInputElement.prototype); function onKeyDown(e) { @@ -31,11 +31,11 @@ import 'registerElement'; this.classList.add('mdl-switch__input'); - var labelElement = this.parentNode; + const labelElement = this.parentNode; labelElement.classList.add('mdl-switch'); labelElement.classList.add('mdl-js-switch'); - var labelTextElement = labelElement.querySelector('span'); + const labelTextElement = labelElement.querySelector('span'); labelElement.insertAdjacentHTML('beforeend', '
'); From abcc8b6c60449d0bda80f1269ce54101d947b520 Mon Sep 17 00:00:00 2001 From: Cameron Date: Fri, 10 Jul 2020 20:07:32 +0100 Subject: [PATCH 074/244] fix lint --- src/elements/emby-checkbox/emby-checkbox.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/elements/emby-checkbox/emby-checkbox.js b/src/elements/emby-checkbox/emby-checkbox.js index af611917ab..b22ff151af 100644 --- a/src/elements/emby-checkbox/emby-checkbox.js +++ b/src/elements/emby-checkbox/emby-checkbox.js @@ -52,7 +52,7 @@ import 'registerElement'; const labelTextElement = labelElement.querySelector('span'); - const outlineClass = 'checkboxOutline'; + let outlineClass = 'checkboxOutline'; const customClass = this.getAttribute('data-outlineclass'); if (customClass) { From e31cae5af8704552328d864a3707a7ed0b4dac16 Mon Sep 17 00:00:00 2001 From: Cameron Date: Sat, 11 Jul 2020 09:52:35 +0100 Subject: [PATCH 075/244] update variable declerations --- .../emby-ratingbutton/emby-ratingbutton.js | 34 ++++++------ .../emby-scrollbuttons/emby-scrollbuttons.js | 54 +++++++++---------- src/elements/emby-select/emby-select.js | 23 ++++---- 3 files changed, 54 insertions(+), 57 deletions(-) diff --git a/src/elements/emby-ratingbutton/emby-ratingbutton.js b/src/elements/emby-ratingbutton/emby-ratingbutton.js index befaa497ab..b455495a2e 100644 --- a/src/elements/emby-ratingbutton/emby-ratingbutton.js +++ b/src/elements/emby-ratingbutton/emby-ratingbutton.js @@ -8,14 +8,14 @@ import EmbyButtonPrototype from 'emby-button'; function addNotificationEvent(instance, name, handler) { - var localHandler = handler.bind(instance); + const localHandler = handler.bind(instance); events.on(serverNotifications, name, localHandler); instance[name] = localHandler; } function removeNotificationEvent(instance, name) { - var handler = instance[name]; + const handler = instance[name]; if (handler) { events.off(serverNotifications, name, handler); instance[name] = null; @@ -29,13 +29,13 @@ import EmbyButtonPrototype from 'emby-button'; function onClick(e) { - var button = this; - var id = button.getAttribute('data-id'); - var serverId = button.getAttribute('data-serverid'); - var apiClient = connectionManager.getApiClient(serverId); + const button = this; + const id = button.getAttribute('data-id'); + const serverId = button.getAttribute('data-serverid'); + const apiClient = connectionManager.getApiClient(serverId); - var likes = this.getAttribute('data-likes'); - var isFavorite = this.getAttribute('data-isfavorite') === 'true'; + let likes = this.getAttribute('data-likes'); + const isFavorite = this.getAttribute('data-isfavorite') === 'true'; if (likes === 'true') { likes = true; } else if (likes === 'false') { @@ -52,7 +52,7 @@ import EmbyButtonPrototype from 'emby-button'; function onUserDataChanged(e, apiClient, userData) { - var button = this; + const button = this; if (userData.ItemId === button.getAttribute('data-id')) { @@ -62,7 +62,7 @@ import EmbyButtonPrototype from 'emby-button'; function setState(button, likes, isFavorite, updateAttribute) { - var icon = button.querySelector('.material-icons'); + const icon = button.querySelector('.material-icons'); if (isFavorite) { @@ -111,7 +111,7 @@ import EmbyButtonPrototype from 'emby-button'; function setTitle(button) { button.title = globalize.translate('Favorite'); - var text = button.querySelector('.button-text'); + const text = button.querySelector('.button-text'); if (text) { text.innerHTML = button.title; } @@ -131,7 +131,7 @@ import EmbyButtonPrototype from 'emby-button'; addNotificationEvent(button, 'UserDataChanged', onUserDataChanged); } - var EmbyRatingButtonPrototype = Object.create(EmbyButtonPrototype); + const EmbyRatingButtonPrototype = Object.create(EmbyButtonPrototype); EmbyRatingButtonPrototype.createdCallback = function () { @@ -148,12 +148,12 @@ import EmbyButtonPrototype from 'emby-button'; EmbyButtonPrototype.attachedCallback.call(this); } - var itemId = this.getAttribute('data-id'); - var serverId = this.getAttribute('data-serverid'); + const itemId = this.getAttribute('data-id'); + const serverId = this.getAttribute('data-serverid'); if (itemId && serverId) { - var likes = this.getAttribute('data-likes'); - var isFavorite = this.getAttribute('data-isfavorite') === 'true'; + let likes = this.getAttribute('data-likes'); + const isFavorite = this.getAttribute('data-isfavorite') === 'true'; if (likes === 'true') { likes = true; } else if (likes === 'false') { @@ -186,7 +186,7 @@ import EmbyButtonPrototype from 'emby-button'; this.setAttribute('data-id', item.Id); this.setAttribute('data-serverid', item.ServerId); - var userData = item.UserData || {}; + const userData = item.UserData || {}; setState(this, userData.Likes, userData.IsFavorite); bindEvents(this); diff --git a/src/elements/emby-scrollbuttons/emby-scrollbuttons.js b/src/elements/emby-scrollbuttons/emby-scrollbuttons.js index 5052a2853a..b4b0ffb3b9 100644 --- a/src/elements/emby-scrollbuttons/emby-scrollbuttons.js +++ b/src/elements/emby-scrollbuttons/emby-scrollbuttons.js @@ -6,13 +6,13 @@ import 'paper-icon-button-light'; /* eslint-disable indent */ - var EmbyScrollButtonsPrototype = Object.create(HTMLDivElement.prototype); +const EmbyScrollButtonsPrototype = Object.create(HTMLDivElement.prototype); EmbyScrollButtonsPrototype.createdCallback = function () {}; function getScrollButtonHtml(direction) { - var html = ''; - var icon = direction === 'left' ? 'chevron_left' : 'chevron_right'; + let html = ''; + const icon = direction === 'left' ? 'chevron_left' : 'chevron_right'; html += ''; @@ -35,7 +35,7 @@ import 'emby-button'; html += item.AppName || ''; html += ''; html += ''; - var date = datetime.parseISO8601Date(item.DateCreated, true); + const date = datetime.parseISO8601Date(item.DateCreated, true); html += datetime.toLocaleDateString(date) + ' ' + datetime.getDisplayTime(date); html += ''; return html += ''; @@ -71,12 +71,12 @@ import 'emby-button'; } pageIdOn('pageinit', 'apiKeysPage', function () { - var page = this; + const page = this; page.querySelector('.btnNewKey').addEventListener('click', function () { showNewKeyPrompt(page); }); page.querySelector('.tblApiKeys').addEventListener('click', function (e) { - var btnRevoke = dom.parentWithClass(e.target, 'btnRevoke'); + const btnRevoke = dom.parentWithClass(e.target, 'btnRevoke'); if (btnRevoke) { revoke(page, btnRevoke.getAttribute('data-token')); diff --git a/src/controllers/dashboard/dashboard.js b/src/controllers/dashboard/dashboard.js index 55e24f49d5..7aa706840d 100644 --- a/src/controllers/dashboard/dashboard.js +++ b/src/controllers/dashboard/dashboard.js @@ -17,16 +17,15 @@ import indicators from 'indicators'; import 'listViewStyle'; import 'emby-button'; import 'flexStyles'; -import 'emby-button'; import 'emby-itemscontainer'; /* eslint-disable indent */ function showPlaybackInfo(btn, session) { - import('alert').then(({default: Alert}) => { - var title; - var text = []; - var displayPlayMethod = playMethodHelper.getDisplayPlayMethod(session); + import('alert').then(({default: alert}) => { + let title; + let text = []; + const displayPlayMethod = playMethodHelper.getDisplayPlayMethod(session); if (displayPlayMethod === 'DirectStream') { title = globalize.translate('DirectStreaming'); @@ -72,7 +71,7 @@ import 'emby-itemscontainer'; function showOptionsMenu(btn, session) { import('actionsheet').then(({default: actionsheet}) => { - var menuItems = []; + const menuItems = []; if (session.ServerId && session.DeviceId !== connectionManager.deviceId()) { menuItems.push({ @@ -105,14 +104,14 @@ import 'emby-itemscontainer'; } function onActiveDevicesClick(evt) { - var btn = dom.parentWithClass(evt.target, 'sessionCardButton'); + const btn = dom.parentWithClass(evt.target, 'sessionCardButton'); if (btn) { - var card = dom.parentWithClass(btn, 'card'); + const card = dom.parentWithClass(btn, 'card'); if (card) { - var sessionId = card.id; - var session = (DashboardPage.sessionsList || []).filter(function (dashboardSession) { + const sessionId = card.id; + const session = (DashboardPage.sessionsList || []).filter(function (dashboardSession) { return 'session' + dashboardSession.Id === sessionId; })[0]; @@ -134,11 +133,11 @@ import 'emby-itemscontainer'; } function filterSessions(sessions) { - var list = []; - var minActiveDate = new Date().getTime() - 9e5; + const list = []; + const minActiveDate = new Date().getTime() - 9e5; - for (var i = 0, length = sessions.length; i < length; i++) { - var session = sessions[i]; + for (let i = 0, length = sessions.length; i < length; i++) { + const session = sessions[i]; if (!session.NowPlayingItem && !session.UserId) { continue; @@ -160,7 +159,7 @@ import 'emby-itemscontainer'; EnableTotalRecordCount: false, EnableImageTypes: 'Primary,Thumb,Backdrop' }).then(function (result) { - var itemsContainer = view.querySelector('.activeRecordingItems'); + const itemsContainer = view.querySelector('.activeRecordingItems'); if (!result.Items.length) { view.querySelector('.activeRecordingsSection').classList.add('hide'); @@ -190,7 +189,7 @@ import 'emby-itemscontainer'; function reloadSystemInfo(view, apiClient) { apiClient.getSystemInfo().then(function (systemInfo) { view.querySelector('#serverName').innerHTML = globalize.translate('DashboardServerName', systemInfo.ServerName); - var localizedVersion = globalize.translate('DashboardVersionNumber', systemInfo.Version); + let localizedVersion = globalize.translate('DashboardVersionNumber', systemInfo.Version); if (systemInfo.SystemUpdateLevel !== 'Release') { localizedVersion += ' ' + systemInfo.SystemUpdateLevel; @@ -226,31 +225,31 @@ import 'emby-itemscontainer'; } function renderActiveConnections(view, sessions) { - var html = ''; + let html = ''; DashboardPage.sessionsList = sessions; - var parentElement = view.querySelector('.activeDevices'); - var cardElem = parentElement.querySelector('.card'); + const parentElement = view.querySelector('.activeDevices'); + const cardElem = parentElement.querySelector('.card'); if (cardElem) { cardElem.classList.add('deadSession'); } - for (var i = 0, length = sessions.length; i < length; i++) { - var session = sessions[i]; - var rowId = 'session' + session.Id; - var elem = view.querySelector('#' + rowId); + for (let i = 0, length = sessions.length; i < length; i++) { + const session = sessions[i]; + const rowId = 'session' + session.Id; + const elem = view.querySelector('#' + rowId); if (elem) { DashboardPage.updateSession(elem, session); } else { - var nowPlayingItem = session.NowPlayingItem; - var className = 'scalableCard card activeSession backdropCard backdropCard-scalable'; + const nowPlayingItem = session.NowPlayingItem; + const className = 'scalableCard card activeSession backdropCard backdropCard-scalable'; html += '
'; html += '
'; html += '
'; html += '
'; html += '
'; - var imgUrl = DashboardPage.getNowPlayingImageUrl(nowPlayingItem); + const imgUrl = DashboardPage.getNowPlayingImageUrl(nowPlayingItem); if (imgUrl) { html += '
'; html += nowPlayingName.html; html += '
'; @@ -282,7 +281,7 @@ import 'emby-itemscontainer'; html += '
'; if (nowPlayingItem && nowPlayingItem.RunTimeTicks) { - var percent = 100 * (session.PlayState.PositionTicks || 0) / nowPlayingItem.RunTimeTicks; + const percent = 100 * (session.PlayState.PositionTicks || 0) / nowPlayingItem.RunTimeTicks; html += indicators.getProgressHtml(percent, { containerClass: 'playbackProgress' }); @@ -294,7 +293,7 @@ import 'emby-itemscontainer'; } if (session.TranscodingInfo && session.TranscodingInfo.CompletionPercentage) { - var percent = session.TranscodingInfo.CompletionPercentage.toFixed(1); + const percent = session.TranscodingInfo.CompletionPercentage.toFixed(1); html += indicators.getProgressHtml(percent, { containerClass: 'transcodingProgress' }); @@ -311,7 +310,7 @@ import 'emby-itemscontainer'; html += '
'; html += '
'; - var btnCssClass = session.ServerId && session.NowPlayingItem && session.SupportsRemoteControl ? '' : ' hide'; + let btnCssClass = session.ServerId && session.NowPlayingItem && session.SupportsRemoteControl ? '' : ' hide'; const playIcon = session.PlayState.IsPaused ? 'pause' : 'play_arrow'; html += ''; @@ -329,7 +328,7 @@ import 'emby-itemscontainer'; html += '
'; html += '
'; - var userImage = DashboardPage.getUserImage(session); + const userImage = DashboardPage.getUserImage(session); html += userImage ? '
" : '
'; html += '
'; html += DashboardPage.getUsersHtml(session); @@ -343,7 +342,7 @@ import 'emby-itemscontainer'; } parentElement.insertAdjacentHTML('beforeend', html); - var deadSessionElem = parentElement.querySelector('.deadSession'); + const deadSessionElem = parentElement.querySelector('.deadSession'); if (deadSessionElem) { deadSessionElem.parentNode.removeChild(deadSessionElem); @@ -351,7 +350,7 @@ import 'emby-itemscontainer'; } function renderRunningTasks(view, tasks) { - var html = ''; + let html = ''; tasks = tasks.filter(function (task) { if ('Idle' != task.State) { return !task.IsHidden; @@ -366,13 +365,13 @@ import 'emby-itemscontainer'; view.querySelector('.runningTasksContainer').classList.add('hide'); } - for (var i = 0, length = tasks.length; i < length; i++) { - var task = tasks[i]; + for (let i = 0, length = tasks.length; i < length; i++) { + const task = tasks[i]; html += '

'; html += task.Name + '
'; if (task.State === 'Running') { - var progress = (task.CurrentProgressPercentage || 0).toFixed(1); + const progress = (task.CurrentProgressPercentage || 0).toFixed(1); html += ''; html += progress + '%'; html += ''; @@ -398,9 +397,9 @@ import 'emby-itemscontainer'; apiClient.sendMessage('ScheduledTasksInfoStop'); }, getSessionNowPlayingStreamInfo: function (session) { - var html = ''; - var showTranscodingInfo = false; - var displayPlayMethod = playMethodHelper.getDisplayPlayMethod(session); + let html = ''; + let showTranscodingInfo = false; + const displayPlayMethod = playMethodHelper.getDisplayPlayMethod(session); if (displayPlayMethod === 'DirectStream') { html += globalize.translate('DirectStreaming'); @@ -417,7 +416,7 @@ import 'emby-itemscontainer'; } if (showTranscodingInfo) { - var line = []; + const line = []; if (session.TranscodingInfo) { if (session.TranscodingInfo.Bitrate) { @@ -449,8 +448,8 @@ import 'emby-itemscontainer'; return html; }, getSessionNowPlayingTime: function (session) { - var nowPlayingItem = session.NowPlayingItem; - var html = ''; + const nowPlayingItem = session.NowPlayingItem; + let html = ''; if (nowPlayingItem) { if (session.PlayState.PositionTicks) { @@ -474,8 +473,8 @@ import 'emby-itemscontainer'; return session.Client + ' ' + session.ApplicationVersion; }, getNowPlayingName: function (session) { - var imgUrl = ''; - var nowPlayingItem = session.NowPlayingItem; + let imgUrl = ''; + const nowPlayingItem = session.NowPlayingItem; // FIXME: It seems that, sometimes, server sends date in the future, so date-fns displays messages like 'in less than a minute'. We should fix // how dates are returned by the server when the session is active and show something like 'Active now', instead of past/future sentences if (!nowPlayingItem) { @@ -485,8 +484,8 @@ import 'emby-itemscontainer'; }; } - var topText = itemHelper.getDisplayName(nowPlayingItem); - var bottomText = ''; + let topText = itemHelper.getDisplayName(nowPlayingItem); + let bottomText = ''; if (nowPlayingItem.Artists && nowPlayingItem.Artists.length) { bottomText = topText; @@ -526,13 +525,13 @@ import 'emby-itemscontainer'; }; }, getUsersHtml: function (session) { - var html = []; + const html = []; if (session.UserId) { html.push(session.UserName); } - for (var i = 0, length = session.AdditionalUsers.length; i < length; i++) { + for (let i = 0, length = session.AdditionalUsers.length; i < length; i++) { html.push(session.AdditionalUsers[i].UserName); } @@ -550,7 +549,7 @@ import 'emby-itemscontainer'; }, updateSession: function (row, session) { row.classList.remove('deadSession'); - var nowPlayingItem = session.NowPlayingItem; + const nowPlayingItem = session.NowPlayingItem; if (nowPlayingItem) { row.classList.add('playingSession'); @@ -570,7 +569,7 @@ import 'emby-itemscontainer'; row.querySelector('.btnSessionInfo').classList.add('hide'); } - var btnSessionPlayPause = row.querySelector('.btnSessionPlayPause'); + const btnSessionPlayPause = row.querySelector('.btnSessionPlayPause'); if (session.ServerId && nowPlayingItem && session.SupportsRemoteControl && session.DeviceId !== connectionManager.deviceId()) { btnSessionPlayPause.classList.remove('hide'); @@ -588,18 +587,18 @@ import 'emby-itemscontainer'; row.querySelector('.sessionNowPlayingTime').innerHTML = DashboardPage.getSessionNowPlayingTime(session); row.querySelector('.sessionUserName').innerHTML = DashboardPage.getUsersHtml(session); row.querySelector('.sessionAppSecondaryText').innerHTML = DashboardPage.getAppSecondaryText(session); - var nowPlayingName = DashboardPage.getNowPlayingName(session); - var nowPlayingInfoElem = row.querySelector('.sessionNowPlayingInfo'); + const nowPlayingName = DashboardPage.getNowPlayingName(session); + const nowPlayingInfoElem = row.querySelector('.sessionNowPlayingInfo'); if (!(nowPlayingName.image && nowPlayingName.image == nowPlayingInfoElem.getAttribute('data-imgsrc'))) { nowPlayingInfoElem.innerHTML = nowPlayingName.html; nowPlayingInfoElem.setAttribute('data-imgsrc', nowPlayingName.image || ''); } - var playbackProgressElem = row.querySelector('.playbackProgress'); + const playbackProgressElem = row.querySelector('.playbackProgress'); if (nowPlayingItem && nowPlayingItem.RunTimeTicks) { - var percent = 100 * (session.PlayState.PositionTicks || 0) / nowPlayingItem.RunTimeTicks; + const percent = 100 * (session.PlayState.PositionTicks || 0) / nowPlayingItem.RunTimeTicks; playbackProgressElem.outerHTML = indicators.getProgressHtml(percent, { containerClass: 'playbackProgress' }); @@ -609,10 +608,10 @@ import 'emby-itemscontainer'; }); } - var transcodingProgress = row.querySelector('.transcodingProgress'); + const transcodingProgress = row.querySelector('.transcodingProgress'); if (session.TranscodingInfo && session.TranscodingInfo.CompletionPercentage) { - var percent = session.TranscodingInfo.CompletionPercentage.toFixed(1); + const percent = session.TranscodingInfo.CompletionPercentage.toFixed(1); transcodingProgress.outerHTML = indicators.getProgressHtml(percent, { containerClass: 'transcodingProgress' }); @@ -622,8 +621,8 @@ import 'emby-itemscontainer'; }); } - var imgUrl = DashboardPage.getNowPlayingImageUrl(nowPlayingItem) || ''; - var imgElem = row.querySelector('.sessionNowPlayingContent'); + const imgUrl = DashboardPage.getNowPlayingImageUrl(nowPlayingItem) || ''; + const imgElem = row.querySelector('.sessionNowPlayingContent'); if (imgUrl != imgElem.getAttribute('data-src')) { imgElem.style.backgroundImage = imgUrl ? "url('" + imgUrl + "')" : ''; @@ -637,7 +636,7 @@ import 'emby-itemscontainer'; } }, getClientImage: function (connection) { - var iconUrl = imageHelper.getDeviceIcon(connection); + const iconUrl = imageHelper.getDeviceIcon(connection); return ""; }, getNowPlayingImageUrl: function (item) { @@ -667,7 +666,7 @@ import 'emby-itemscontainer'; }); } - var imageTags = (item || {}).ImageTags || {}; + const imageTags = (item || {}).ImageTags || {}; if (item && imageTags.Thumb) { return ApiClient.getScaledImageUrl(item.Id, { @@ -721,7 +720,7 @@ import 'emby-itemscontainer'; }, systemUpdateTaskKey: 'SystemUpdateTask', stopTask: function (btn, id) { - var page = dom.parentWithClass(btn, 'page'); + const page = dom.parentWithClass(btn, 'page'); ApiClient.stopScheduledTask(id).then(function () { pollForInfo(page, ApiClient); }); @@ -734,7 +733,7 @@ import 'emby-itemscontainer'; confirmText: globalize.translate('ButtonRestart'), primary: 'delete' }).then(function () { - var page = dom.parentWithClass(btn, 'page'); + const page = dom.parentWithClass(btn, 'page'); page.querySelector('#btnRestartServer').disabled = true; page.querySelector('#btnShutdown').disabled = true; ApiClient.restartServer(); @@ -749,7 +748,7 @@ import 'emby-itemscontainer'; confirmText: globalize.translate('ButtonShutdown'), primary: 'delete' }).then(function () { - var page = dom.parentWithClass(btn, 'page'); + const page = dom.parentWithClass(btn, 'page'); page.querySelector('#btnRestartServer').disabled = true; page.querySelector('#btnShutdown').disabled = true; ApiClient.shutdownServer(); @@ -796,11 +795,11 @@ import 'emby-itemscontainer'; } } - var serverId = ApiClient.serverId(); + const serverId = ApiClient.serverId(); view.querySelector('.activeDevices').addEventListener('click', onActiveDevicesClick); view.addEventListener('viewshow', function () { - var page = this; - var apiClient = ApiClient; + const page = this; + const apiClient = ApiClient; if (apiClient) { loading.show(); @@ -837,7 +836,7 @@ import 'emby-itemscontainer'; } }); view.addEventListener('viewbeforehide', function () { - var apiClient = ApiClient; + const apiClient = ApiClient; events.off(serverNotifications, 'RestartRequired', onRestartRequired); events.off(serverNotifications, 'ServerShuttingDown', onServerShuttingDown); events.off(serverNotifications, 'ServerRestarting', onServerRestarting); @@ -851,14 +850,14 @@ import 'emby-itemscontainer'; } }); view.addEventListener('viewdestroy', function () { - var page = this; - var userActivityLog = page.userActivityLog; + const page = this; + const userActivityLog = page.userActivityLog; if (userActivityLog) { userActivityLog.destroy(); } - var serverActivityLog = page.serverActivityLog; + const serverActivityLog = page.serverActivityLog; if (serverActivityLog) { serverActivityLog.destroy(); diff --git a/src/controllers/dashboard/encodingsettings.js b/src/controllers/dashboard/encodingsettings.js index fd91db4bb4..aac18360ac 100644 --- a/src/controllers/dashboard/encodingsettings.js +++ b/src/controllers/dashboard/encodingsettings.js @@ -32,7 +32,7 @@ import libraryMenu from 'libraryMenu'; function onSaveEncodingPathFailure(response) { loading.hide(); - var msg = ''; + let msg = ''; msg = globalize.translate('FFmpegSavePathNotFound'); import('alert').then(({default: alert}) => { @@ -54,9 +54,9 @@ import libraryMenu from 'libraryMenu'; } function onSubmit() { - var form = this; + const form = this; - var onDecoderConfirmed = function () { + const onDecoderConfirmed = function () { loading.show(); ApiClient.getNamedConfiguration('encoding').then(function (config) { config.DownMixAudioBoost = $('#txtDownMixAudioBoost', form).val(); @@ -105,7 +105,7 @@ import libraryMenu from 'libraryMenu'; function setDecodingCodecsVisible(context, value) { value = value || ''; - var any; + let any; Array.prototype.forEach.call(context.querySelectorAll('.chkDecodeCodec'), function (c) { if (-1 === c.getAttribute('data-types').split(',').indexOf(value)) { dom.parentWithTag(c, 'LABEL').classList.add('hide'); @@ -136,7 +136,7 @@ import libraryMenu from 'libraryMenu'; } $(document).on('pageinit', '#encodingSettingsPage', function () { - var page = this; + const page = this; page.querySelector('#selectVideoDecoder').addEventListener('change', function () { if ('vaapi' == this.value) { page.querySelector('.fldVaapiDevice').classList.remove('hide'); @@ -156,7 +156,7 @@ import libraryMenu from 'libraryMenu'; }); $('#btnSelectEncoderPath', page).on('click.selectDirectory', function () { import('directorybrowser').then(({default: directoryBrowser}) => { - var picker = new directoryBrowser(); + const picker = new directoryBrowser(); picker.show({ includeFiles: true, callback: function (path) { @@ -171,7 +171,7 @@ import libraryMenu from 'libraryMenu'; }); $('#btnSelectTranscodingTempPath', page).on('click.selectDirectory', function () { import('directorybrowser').then(({default: directoryBrowser}) => { - var picker = new directoryBrowser(); + const picker = new directoryBrowser(); picker.show({ callback: function (path) { if (path) { @@ -190,7 +190,7 @@ import libraryMenu from 'libraryMenu'; }).on('pageshow', '#encodingSettingsPage', function () { loading.show(); libraryMenu.setTabs('playback', 0, getTabs); - var page = this; + const page = this; ApiClient.getNamedConfiguration('encoding').then(function (config) { ApiClient.getSystemInfo().then(function (systemInfo) { loadPage(page, config, systemInfo); From 5545c05089ea8197d3afa0f62c67010a72bfab0f Mon Sep 17 00:00:00 2001 From: Cameron Date: Fri, 10 Jul 2020 13:54:05 +0100 Subject: [PATCH 083/244] updates to lint and profile --- src/controllers/dashboard/users/userparentalcontrol.js | 1 - src/controllers/dashboard/users/userpasswordpage.js | 3 +-- src/controllers/dashboard/users/userprofilespage.js | 2 +- src/controllers/user/profile.js | 2 +- 4 files changed, 3 insertions(+), 5 deletions(-) diff --git a/src/controllers/dashboard/users/userparentalcontrol.js b/src/controllers/dashboard/users/userparentalcontrol.js index 907f99b8cc..38ada8b8fd 100644 --- a/src/controllers/dashboard/users/userparentalcontrol.js +++ b/src/controllers/dashboard/users/userparentalcontrol.js @@ -6,7 +6,6 @@ import globalize from 'globalize'; import 'listViewStyle'; import 'paper-icon-button-light'; - /* eslint-disable indent */ function populateRatings(allParentalRatings, page) { diff --git a/src/controllers/dashboard/users/userpasswordpage.js b/src/controllers/dashboard/users/userpasswordpage.js index e9731e50e9..4f9b7e2519 100644 --- a/src/controllers/dashboard/users/userpasswordpage.js +++ b/src/controllers/dashboard/users/userpasswordpage.js @@ -3,7 +3,6 @@ import libraryMenu from 'libraryMenu'; import globalize from 'globalize'; import 'emby-button'; - /* eslint-disable indent */ function loadUser(page, params) { @@ -187,6 +186,6 @@ import 'emby-button'; view.addEventListener('viewshow', function () { loadUser(view, params); }); - }; + } /* eslint-enable indent */ diff --git a/src/controllers/dashboard/users/userprofilespage.js b/src/controllers/dashboard/users/userprofilespage.js index 46e9665b7d..cf246cdeaf 100644 --- a/src/controllers/dashboard/users/userprofilespage.js +++ b/src/controllers/dashboard/users/userprofilespage.js @@ -276,5 +276,5 @@ import 'flexStyles'; pageIdOn('pagebeforeshow', 'userProfilesPage', function () { loadData(this); }); - + /* eslint-enable indent */ diff --git a/src/controllers/user/profile.js b/src/controllers/user/profile.js index fd7d1e32cc..b8d1e209c6 100644 --- a/src/controllers/user/profile.js +++ b/src/controllers/user/profile.js @@ -83,7 +83,7 @@ define(['controllers/dashboard/users/userpasswordpage', 'loading', 'libraryMenu' return function (view, params) { reloadUser(view); - new UserPasswordPage(view, params); + new UserPasswordPage.default(view, params); view.querySelector('#btnDeleteImage').addEventListener('click', function () { require(['confirm'], function (confirm) { confirm(globalize.translate('DeleteImageConfirmation'), globalize.translate('DeleteImage')).then(function () { From 376f00c0599d98978e9811bcd4d73bddb5d0a662 Mon Sep 17 00:00:00 2001 From: Cameron Date: Sat, 11 Jul 2020 14:04:11 +0100 Subject: [PATCH 084/244] update variable declerations --- src/controllers/dashboard/users/useredit.js | 30 ++++---- .../dashboard/users/userlibraryaccess.js | 54 +++++++------- src/controllers/dashboard/users/usernew.js | 22 +++--- .../dashboard/users/userparentalcontrol.js | 70 +++++++++---------- .../dashboard/users/userpasswordpage.js | 28 ++++---- .../dashboard/users/userprofilespage.js | 36 +++++----- 6 files changed, 117 insertions(+), 123 deletions(-) diff --git a/src/controllers/dashboard/users/useredit.js b/src/controllers/dashboard/users/useredit.js index 02e0dade0e..ba14cbe1b2 100644 --- a/src/controllers/dashboard/users/useredit.js +++ b/src/controllers/dashboard/users/useredit.js @@ -9,21 +9,19 @@ import globalize from 'globalize'; ApiClient.getJSON(ApiClient.getUrl('Channels', { SupportsMediaDeletion: true })).then(function (channelsResult) { - var i; - var length; - var folder; - var isChecked; - var checkedAttribute; - var html = ''; + let folder; + let isChecked; + let checkedAttribute; + let html = ''; - for (i = 0, length = mediaFolders.length; i < length; i++) { + for (let i = 0, length = mediaFolders.length; i < length; i++) { folder = mediaFolders[i]; isChecked = user.Policy.EnableContentDeletion || -1 != user.Policy.EnableContentDeletionFromFolders.indexOf(folder.Id); checkedAttribute = isChecked ? ' checked="checked"' : ''; html += ''; } - for (i = 0, length = channelsResult.Items.length; i < length; i++) { + for (let i = 0, length = channelsResult.Items.length; i < length; i++) { folder = channelsResult.Items[i]; isChecked = user.Policy.EnableContentDeletion || -1 != user.Policy.EnableContentDeletionFromFolders.indexOf(folder.Id); checkedAttribute = isChecked ? ' checked="checked"' : ''; @@ -42,9 +40,9 @@ import globalize from 'globalize'; page.querySelector('.fldSelectLoginProvider').classList.add('hide'); } - var currentProviderId = user.Policy.AuthenticationProviderId; + const currentProviderId = user.Policy.AuthenticationProviderId; page.querySelector('.selectLoginProvider').innerHTML = providers.map(function (provider) { - var selected = provider.Id === currentProviderId || providers.length < 2 ? ' selected' : ''; + const selected = provider.Id === currentProviderId || providers.length < 2 ? ' selected' : ''; return ''; }); } @@ -56,15 +54,14 @@ import globalize from 'globalize'; page.querySelector('.fldSelectPasswordResetProvider').classList.add('hide'); } - var currentProviderId = user.Policy.PasswordResetProviderId; + const currentProviderId = user.Policy.PasswordResetProviderId; page.querySelector('.selectPasswordResetProvider').innerHTML = providers.map(function (provider) { - var selected = provider.Id === currentProviderId || providers.length < 2 ? ' selected' : ''; + const selected = provider.Id === currentProviderId || providers.length < 2 ? ' selected' : ''; return ''; }); } function loadUser(page, user) { - currentUser = user; ApiClient.getJSON(ApiClient.getUrl('Auth/Providers')).then(function (providers) { loadAuthProviders(page, user, providers); }); @@ -159,7 +156,7 @@ import globalize from 'globalize'; } function onSubmit() { - var page = $(this).parents('.page')[0]; + const page = $(this).parents('.page')[0]; loading.show(); getUser().then(function (result) { saveUser(result, page); @@ -168,7 +165,7 @@ import globalize from 'globalize'; } function getUser() { - var userId = getParameterByName('userId'); + const userId = getParameterByName('userId'); return ApiClient.getUser(userId); } @@ -179,11 +176,10 @@ import globalize from 'globalize'; }); } - var currentUser; $(document).on('pageinit', '#editUserPage', function () { $('.editUserProfileForm').off('submit', onSubmit).on('submit', onSubmit); this.querySelector('.sharingHelp').innerHTML = globalize.translate('OptionAllowLinkSharingHelp', 30); - var page = this; + const page = this; $('#chkEnableDeleteAllFolders', this).on('change', function () { if (this.checked) { $('.deleteAccess', page).hide(); diff --git a/src/controllers/dashboard/users/userlibraryaccess.js b/src/controllers/dashboard/users/userlibraryaccess.js index 072b228c53..df42733f0c 100644 --- a/src/controllers/dashboard/users/userlibraryaccess.js +++ b/src/controllers/dashboard/users/userlibraryaccess.js @@ -6,39 +6,39 @@ import globalize from 'globalize'; /* eslint-disable indent */ function triggerChange(select) { - var evt = document.createEvent('HTMLEvents'); + const evt = document.createEvent('HTMLEvents'); evt.initEvent('change', false, true); select.dispatchEvent(evt); } function loadMediaFolders(page, user, mediaFolders) { - var html = ''; + let html = ''; html += '

' + globalize.translate('HeaderLibraries') + '

'; html += '
'; - for (var i = 0, length = mediaFolders.length; i < length; i++) { - var folder = mediaFolders[i]; - var isChecked = user.Policy.EnableAllFolders || -1 != user.Policy.EnabledFolders.indexOf(folder.Id); - var checkedAttribute = isChecked ? ' checked="checked"' : ''; + for (let i = 0, length = mediaFolders.length; i < length; i++) { + const folder = mediaFolders[i]; + const isChecked = user.Policy.EnableAllFolders || -1 != user.Policy.EnabledFolders.indexOf(folder.Id); + const checkedAttribute = isChecked ? ' checked="checked"' : ''; html += ''; } html += '
'; page.querySelector('.folderAccess').innerHTML = html; - var chkEnableAllFolders = page.querySelector('#chkEnableAllFolders'); + const chkEnableAllFolders = page.querySelector('#chkEnableAllFolders'); chkEnableAllFolders.checked = user.Policy.EnableAllFolders; triggerChange(chkEnableAllFolders); } function loadChannels(page, user, channels) { - var html = ''; + let html = ''; html += '

' + globalize.translate('HeaderChannels') + '

'; html += '
'; - for (var i = 0, length = channels.length; i < length; i++) { - var folder = channels[i]; - var isChecked = user.Policy.EnableAllChannels || -1 != user.Policy.EnabledChannels.indexOf(folder.Id); - var checkedAttribute = isChecked ? ' checked="checked"' : ''; + for (let i = 0, length = channels.length; i < length; i++) { + const folder = channels[i]; + const isChecked = user.Policy.EnableAllChannels || -1 != user.Policy.EnabledChannels.indexOf(folder.Id); + const checkedAttribute = isChecked ? ' checked="checked"' : ''; html += ''; } @@ -55,13 +55,13 @@ import globalize from 'globalize'; } function loadDevices(page, user, devices) { - var html = ''; + let html = ''; html += '

' + globalize.translate('HeaderDevices') + '

'; html += '
'; - for (var i = 0, length = devices.length; i < length; i++) { - var device = devices[i]; - var checkedAttribute = user.Policy.EnableAllDevices || -1 != user.Policy.EnabledDevices.indexOf(device.Id) ? ' checked="checked"' : ''; + for (let i = 0, length = devices.length; i < length; i++) { + const device = devices[i]; + const checkedAttribute = user.Policy.EnableAllDevices || -1 != user.Policy.EnabledDevices.indexOf(device.Id) ? ' checked="checked"' : ''; html += ''; } @@ -120,9 +120,9 @@ import globalize from 'globalize'; } function onSubmit() { - var page = $(this).parents('.page'); + const page = $(this).parents('.page'); loading.show(); - var userId = getParameterByName('userId'); + const userId = getParameterByName('userId'); ApiClient.getUser(userId).then(function (result) { saveUser(result, page); }); @@ -130,7 +130,7 @@ import globalize from 'globalize'; } $(document).on('pageinit', '#userLibraryAccessPage', function () { - var page = this; + const page = this; $('#chkEnableAllDevices', page).on('change', function () { if (this.checked) { $('.deviceAccessListContainer', page).hide(); @@ -154,27 +154,27 @@ import globalize from 'globalize'; }); $('.userLibraryAccessForm').off('submit', onSubmit).on('submit', onSubmit); }).on('pageshow', '#userLibraryAccessPage', function () { - var page = this; + const page = this; loading.show(); - var promise1; - var userId = getParameterByName('userId'); + let promise1; + const userId = getParameterByName('userId'); if (userId) { promise1 = ApiClient.getUser(userId); } else { - var deferred = $.Deferred(); + const deferred = $.Deferred(); deferred.resolveWith(null, [{ Configuration: {} }]); promise1 = deferred.promise(); } - var promise2 = Dashboard.getCurrentUser(); - var promise4 = ApiClient.getJSON(ApiClient.getUrl('Library/MediaFolders', { + const promise2 = Dashboard.getCurrentUser(); + const promise4 = ApiClient.getJSON(ApiClient.getUrl('Library/MediaFolders', { IsHidden: false })); - var promise5 = ApiClient.getJSON(ApiClient.getUrl('Channels')); - var promise6 = ApiClient.getJSON(ApiClient.getUrl('Devices')); + const promise5 = ApiClient.getJSON(ApiClient.getUrl('Channels')); + const promise6 = ApiClient.getJSON(ApiClient.getUrl('Devices')); Promise.all([promise1, promise2, promise4, promise5, promise6]).then(function (responses) { loadUser(page, responses[0], responses[1], responses[2].Items, responses[3].Items, responses[4].Items); }); diff --git a/src/controllers/dashboard/users/usernew.js b/src/controllers/dashboard/users/usernew.js index 71072898d3..f45cbf8ca8 100644 --- a/src/controllers/dashboard/users/usernew.js +++ b/src/controllers/dashboard/users/usernew.js @@ -6,12 +6,12 @@ import 'emby-checkbox'; /* eslint-disable indent */ function loadMediaFolders(page, mediaFolders) { - var html = ''; + let html = ''; html += '

' + globalize.translate('HeaderLibraries') + '

'; html += '
'; - for (var i = 0; i < mediaFolders.length; i++) { - var folder = mediaFolders[i]; + for (let i = 0; i < mediaFolders.length; i++) { + const folder = mediaFolders[i]; html += ''; } @@ -21,12 +21,12 @@ import 'emby-checkbox'; } function loadChannels(page, channels) { - var html = ''; + let html = ''; html += '

' + globalize.translate('HeaderChannels') + '

'; html += '
'; - for (var i = 0; i < channels.length; i++) { - var folder = channels[i]; + for (let i = 0; i < channels.length; i++) { + const folder = channels[i]; html += ''; } @@ -46,10 +46,10 @@ import 'emby-checkbox'; $('#txtUsername', page).val(''); $('#txtPassword', page).val(''); loading.show(); - var promiseFolders = ApiClient.getJSON(ApiClient.getUrl('Library/MediaFolders', { + const promiseFolders = ApiClient.getJSON(ApiClient.getUrl('Library/MediaFolders', { IsHidden: false })); - var promiseChannels = ApiClient.getJSON(ApiClient.getUrl('Channels')); + const promiseChannels = ApiClient.getJSON(ApiClient.getUrl('Channels')); Promise.all([promiseFolders, promiseChannels]).then(function (responses) { loadMediaFolders(page, responses[0].Items); loadChannels(page, responses[1].Items); @@ -58,7 +58,7 @@ import 'emby-checkbox'; } function saveUser(page) { - var user = {}; + const user = {}; user.Name = $('#txtUsername', page).val(); user.Password = $('#txtPassword', page).val(); ApiClient.createUser(user).then(function (user) { @@ -97,7 +97,7 @@ import 'emby-checkbox'; } function onSubmit() { - var page = $(this).parents('.page')[0]; + const page = $(this).parents('.page')[0]; loading.show(); saveUser(page); return false; @@ -108,7 +108,7 @@ import 'emby-checkbox'; } $(document).on('pageinit', '#newUserPage', function () { - var page = this; + const page = this; $('#chkEnableAllChannels', page).on('change', function () { if (this.checked) { $('.channelAccessListContainer', page).hide(); diff --git a/src/controllers/dashboard/users/userparentalcontrol.js b/src/controllers/dashboard/users/userparentalcontrol.js index 38ada8b8fd..e146aac567 100644 --- a/src/controllers/dashboard/users/userparentalcontrol.js +++ b/src/controllers/dashboard/users/userparentalcontrol.js @@ -9,16 +9,14 @@ import 'paper-icon-button-light'; /* eslint-disable indent */ function populateRatings(allParentalRatings, page) { - var html = ''; + let html = ''; html += ""; - var i; - var length; - var rating; - var ratings = []; + let rating; + const ratings = []; - for (i = 0, length = allParentalRatings.length; i < length; i++) { + for (let i = 0, length = allParentalRatings.length; i < length; i++) { if (rating = allParentalRatings[i], ratings.length) { - var lastRating = ratings[ratings.length - 1]; + const lastRating = ratings[ratings.length - 1]; if (lastRating.Value === rating.Value) { lastRating.Name += '/' + rating.Name; @@ -32,7 +30,7 @@ import 'paper-icon-button-light'; }); } - for (i = 0, length = ratings.length; i < length; i++) { + for (let i = 0, length = ratings.length; i < length; i++) { rating = ratings[i]; html += "'; } @@ -41,7 +39,7 @@ import 'paper-icon-button-light'; } function loadUnratedItems(page, user) { - var items = [{ + const items = [{ name: globalize.translate('OptionBlockBooks'), value: 'Book' }, { @@ -63,13 +61,13 @@ import 'paper-icon-button-light'; name: globalize.translate('OptionBlockTvShows'), value: 'Series' }]; - var html = ''; + let html = ''; html += '

' + globalize.translate('HeaderBlockItemsWithNoRating') + '

'; html += '
'; - for (var i = 0, length = items.length; i < length; i++) { - var item = items[i]; - var checkedAttribute = -1 != user.Policy.BlockUnratedItems.indexOf(item.value) ? ' checked="checked"' : ''; + for (let i = 0, length = items.length; i < length; i++) { + const item = items[i]; + const checkedAttribute = -1 != user.Policy.BlockUnratedItems.indexOf(item.value) ? ' checked="checked"' : ''; html += ''; } @@ -83,11 +81,11 @@ import 'paper-icon-button-light'; loadUnratedItems(page, user); loadBlockedTags(page, user.Policy.BlockedTags); populateRatings(allParentalRatings, page); - var ratingValue = ''; + let ratingValue = ''; if (user.Policy.MaxParentalRating) { - for (var i = 0, length = allParentalRatings.length; i < length; i++) { - var rating = allParentalRatings[i]; + for (let i = 0, length = allParentalRatings.length; i < length; i++) { + const rating = allParentalRatings[i]; if (user.Policy.MaxParentalRating >= rating.Value) { ratingValue = rating.Value; @@ -108,8 +106,8 @@ import 'paper-icon-button-light'; } function loadBlockedTags(page, tags) { - var html = tags.map(function (h) { - var li = '
'; + let html = tags.map(function (h) { + let li = '
'; li += '
'; li += '

'; li += h; @@ -123,10 +121,10 @@ import 'paper-icon-button-light'; html = '
' + html + '
'; } - var elem = $('.blockedTags', page).html(html).trigger('create'); + const elem = $('.blockedTags', page).html(html).trigger('create'); $('.btnDeleteTag', elem).on('click', function () { - var tag = this.getAttribute('data-tag'); - var newTags = tags.filter(function (t) { + const tag = this.getAttribute('data-tag'); + const newTags = tags.filter(function (t) { return t != tag; }); loadBlockedTags(page, newTags); @@ -139,10 +137,10 @@ import 'paper-icon-button-light'; } function renderAccessSchedule(page, schedules) { - var html = ''; - var index = 0; + let html = ''; + let index = 0; html += schedules.map(function (a) { - var itemHtml = ''; + let itemHtml = ''; itemHtml += '
'; itemHtml += '
'; itemHtml += '

'; @@ -155,7 +153,7 @@ import 'paper-icon-button-light'; index++; return itemHtml; }).join(''); - var accessScheduleList = page.querySelector('.accessScheduleList'); + const accessScheduleList = page.querySelector('.accessScheduleList'); accessScheduleList.innerHTML = html; $('.btnDelete', accessScheduleList).on('click', function () { deleteAccessSchedule(page, schedules, parseInt(this.getAttribute('data-index'))); @@ -185,8 +183,8 @@ import 'paper-icon-button-light'; } function getDisplayTime(hours) { - var minutes = 0; - var pct = hours % 1; + let minutes = 0; + const pct = hours % 1; if (pct) { minutes = parseInt(60 * pct); @@ -201,7 +199,7 @@ import 'paper-icon-button-light'; accessschedule.show({ schedule: schedule }).then(function (updatedSchedule) { - var schedules = getSchedulesFromPage(page); + const schedules = getSchedulesFromPage(page); if (-1 == index) { index = schedules.length; @@ -234,7 +232,7 @@ import 'paper-icon-button-light'; prompt({ label: globalize.translate('LabelTag') }).then(function (value) { - var tags = getBlockedTagsFromPage(page); + const tags = getBlockedTagsFromPage(page); if (-1 == tags.indexOf(value)) { tags.push(value); @@ -246,9 +244,9 @@ import 'paper-icon-button-light'; window.UserParentalControlPage = { onSubmit: function () { - var page = $(this).parents('.page'); + const page = $(this).parents('.page'); loading.show(); - var userId = getParameterByName('userId'); + const userId = getParameterByName('userId'); ApiClient.getUser(userId).then(function (result) { saveUser(result, page); }); @@ -256,7 +254,7 @@ import 'paper-icon-button-light'; } }; $(document).on('pageinit', '#userParentalControlPage', function () { - var page = this; + const page = this; $('.btnAddSchedule', page).on('click', function () { showSchedulePopup(page, {}, -1); }); @@ -265,11 +263,11 @@ import 'paper-icon-button-light'; }); $('.userParentalControlForm').off('submit', UserParentalControlPage.onSubmit).on('submit', UserParentalControlPage.onSubmit); }).on('pageshow', '#userParentalControlPage', function () { - var page = this; + const page = this; loading.show(); - var userId = getParameterByName('userId'); - var promise1 = ApiClient.getUser(userId); - var promise2 = ApiClient.getParentalRatings(); + const userId = getParameterByName('userId'); + const promise1 = ApiClient.getUser(userId); + const promise2 = ApiClient.getParentalRatings(); Promise.all([promise1, promise2]).then(function (responses) { loadUser(page, responses[0], responses[1]); }); diff --git a/src/controllers/dashboard/users/userpasswordpage.js b/src/controllers/dashboard/users/userpasswordpage.js index 4f9b7e2519..d694bb2c5d 100644 --- a/src/controllers/dashboard/users/userpasswordpage.js +++ b/src/controllers/dashboard/users/userpasswordpage.js @@ -6,13 +6,13 @@ import 'emby-button'; /* eslint-disable indent */ function loadUser(page, params) { - var userid = params.userId; + const userid = params.userId; ApiClient.getUser(userid).then(function (user) { Dashboard.getCurrentUser().then(function (loggedInUser) { libraryMenu.setTitle(user.Name); page.querySelector('.username').innerHTML = user.Name; - var showPasswordSection = true; - var showLocalAccessSection = false; + let showPasswordSection = true; + let showLocalAccessSection = false; if ('Guest' == user.ConnectLinkType) { page.querySelector('.localAccessSection').classList.add('hide'); @@ -38,7 +38,7 @@ import 'emby-button'; page.querySelector('.localAccessSection').classList.add('hide'); } - var txtEasyPassword = page.querySelector('#txtEasyPassword'); + const txtEasyPassword = page.querySelector('#txtEasyPassword'); txtEasyPassword.value = ''; if (user.HasConfiguredEasyPassword) { @@ -64,8 +64,8 @@ import 'emby-button'; export default function (view, params) { function saveEasyPassword() { - var userId = params.userId; - var easyPassword = view.querySelector('#txtEasyPassword').value; + const userId = params.userId; + const easyPassword = view.querySelector('#txtEasyPassword').value; if (easyPassword) { ApiClient.updateEasyPassword(userId, easyPassword).then(function () { @@ -92,9 +92,9 @@ import 'emby-button'; } function savePassword() { - var userId = params.userId; - var currentPassword = view.querySelector('#txtCurrentPassword').value; - var newPassword = view.querySelector('#txtNewPassword').value; + const userId = params.userId; + let currentPassword = view.querySelector('#txtCurrentPassword').value; + const newPassword = view.querySelector('#txtNewPassword').value; if (view.querySelector('#fldCurrentPassword').classList.contains('hide')) { // Firefox does not respect autocomplete=off, so clear it if the field is supposed to be hidden (and blank) @@ -120,7 +120,7 @@ import 'emby-button'; } function onSubmit(e) { - var form = this; + const form = this; if (form.querySelector('#txtNewPassword').value != form.querySelector('#txtNewPasswordConfirm').value) { import('toast').then(({default: toast}) => { @@ -143,10 +143,10 @@ import 'emby-button'; } function resetPassword() { - var msg = globalize.translate('PasswordResetConfirmation'); + const msg = globalize.translate('PasswordResetConfirmation'); import('confirm').then(({default: confirm}) => { confirm(msg, globalize.translate('PasswordResetHeader')).then(function () { - var userId = params.userId; + const userId = params.userId; loading.show(); ApiClient.resetUserPassword(userId).then(function () { loading.hide(); @@ -161,11 +161,11 @@ import 'emby-button'; } function resetEasyPassword() { - var msg = globalize.translate('PinCodeResetConfirmation'); + const msg = globalize.translate('PinCodeResetConfirmation'); import('confirm').then(({default: confirm}) => { confirm(msg, globalize.translate('HeaderPinCodeReset')).then(function () { - var userId = params.userId; + const userId = params.userId; loading.show(); ApiClient.resetEasyPassword(userId).then(function () { loading.hide(); diff --git a/src/controllers/dashboard/users/userprofilespage.js b/src/controllers/dashboard/users/userprofilespage.js index cf246cdeaf..dbdec4f752 100644 --- a/src/controllers/dashboard/users/userprofilespage.js +++ b/src/controllers/dashboard/users/userprofilespage.js @@ -12,7 +12,7 @@ import 'flexStyles'; /* eslint-disable indent */ function deleteUser(page, id) { - var msg = globalize.translate('DeleteUserConfirmation'); + const msg = globalize.translate('DeleteUserConfirmation'); import('confirm').then(({default: confirm}) => { confirm({ @@ -30,10 +30,10 @@ import 'flexStyles'; } function showUserMenu(elem) { - var card = dom.parentWithClass(elem, 'card'); - var page = dom.parentWithClass(card, 'page'); - var userId = card.getAttribute('data-userid'); - var menuItems = []; + const card = dom.parentWithClass(elem, 'card'); + const page = dom.parentWithClass(card, 'page'); + const userId = card.getAttribute('data-userid'); + const menuItems = []; menuItems.push({ name: globalize.translate('ButtonOpen'), id: 'open', @@ -82,8 +82,8 @@ import 'flexStyles'; } function getUserHtml(user, addConnectIndicator) { - var html = ''; - var cssClass = 'card squareCard scalableCard squareCard-scalable'; + let html = ''; + let cssClass = 'card squareCard scalableCard squareCard-scalable'; if (user.Policy.IsDisabled) { cssClass += ' grayscale'; @@ -94,7 +94,7 @@ import 'flexStyles'; html += ''; html += '
'; - var lastSeen = getLastSeenText(user.LastActivityDate); + const lastSeen = getLastSeenText(user.LastActivityDate); html += '' != lastSeen ? lastSeen : ' '; html += '
'; html += '

'; @@ -156,7 +156,7 @@ import 'flexStyles'; } function showPendingUserMenu(elem) { - var menuItems = []; + const menuItems = []; menuItems.push({ name: globalize.translate('ButtonCancel'), id: 'delete', @@ -164,9 +164,9 @@ import 'flexStyles'; }); import('actionsheet').then(({default: actionsheet}) => { - var card = dom.parentWithClass(elem, 'card'); - var page = dom.parentWithClass(card, 'page'); - var id = card.getAttribute('data-id'); + const card = dom.parentWithClass(elem, 'card'); + const page = dom.parentWithClass(card, 'page'); + const id = card.getAttribute('data-id'); actionsheet.show({ items: menuItems, positionTo: card, @@ -181,7 +181,7 @@ import 'flexStyles'; } function getPendingUserHtml(user) { - var html = ''; + let html = ''; html += "
"; html += '
'; html += '
'; @@ -254,19 +254,19 @@ import 'flexStyles'; } pageIdOn('pageinit', 'userProfilesPage', function () { - var page = this; + const page = this; page.querySelector('.btnAddUser').addEventListener('click', function() { Dashboard.navigate('usernew.html'); }); page.querySelector('.localUsers').addEventListener('click', function (e__e) { - var btnUserMenu = dom.parentWithClass(e__e.target, 'btnUserMenu'); + const btnUserMenu = dom.parentWithClass(e__e.target, 'btnUserMenu'); if (btnUserMenu) { showUserMenu(btnUserMenu); } }); page.querySelector('.pending').addEventListener('click', function (e__r) { - var btnUserMenu = dom.parentWithClass(e__r.target, 'btnUserMenu'); + const btnUserMenu = dom.parentWithClass(e__r.target, 'btnUserMenu'); if (btnUserMenu) { showPendingUserMenu(btnUserMenu); From 7b509fdde4ef0d129ed2805bc19d00fd27cfecb1 Mon Sep 17 00:00:00 2001 From: Cameron Date: Sat, 11 Jul 2020 16:54:20 +0100 Subject: [PATCH 085/244] Migration of proflie, profiles and settings (DLNA) to ES6 Modules --- package.json | 3 + src/controllers/dashboard/dlna/profile.js | 165 +++++++++++---------- src/controllers/dashboard/dlna/profiles.js | 23 ++- src/controllers/dashboard/dlna/settings.js | 21 ++- 4 files changed, 118 insertions(+), 94 deletions(-) diff --git a/package.json b/package.json index 81c627f085..c49c53d41b 100644 --- a/package.json +++ b/package.json @@ -137,6 +137,9 @@ "src/controllers/dashboard/logs.js", "src/controllers/user/subtitles.js", "src/controllers/dashboard/plugins/repositories.js", + "src/controllers/dashboard/dlna/profile.js", + "src/controllers/dashboard/dlna/profiles.js", + "src/controllers/dashboard/dlna/settings.js", "src/plugins/bookPlayer/plugin.js", "src/plugins/bookPlayer/tableOfContents.js", "src/plugins/photoPlayer/plugin.js", diff --git a/src/controllers/dashboard/dlna/profile.js b/src/controllers/dashboard/dlna/profile.js index 54ef75a6d1..003cb88245 100644 --- a/src/controllers/dashboard/dlna/profile.js +++ b/src/controllers/dashboard/dlna/profile.js @@ -1,10 +1,18 @@ -define(['jQuery', 'loading', 'globalize', 'emby-select', 'emby-button', 'emby-input', 'emby-checkbox', 'listViewStyle', 'emby-button'], function ($, loading, globalize) { - 'use strict'; +import $ from 'jQuery'; +import loading from 'loading'; +import globalize from 'globalize'; +import 'emby-select'; +import 'emby-button'; +import 'emby-input'; +import 'emby-checkbox'; +import 'listViewStyle'; + +/* eslint-disable indent */ function loadProfile(page) { loading.show(); - var promise1 = getProfile(); - var promise2 = ApiClient.getUsers(); + const promise1 = getProfile(); + const promise2 = ApiClient.getUsers(); Promise.all([promise1, promise2]).then(function (responses) { currentProfile = responses[0]; renderProfile(page, currentProfile, responses[1]); @@ -13,8 +21,8 @@ define(['jQuery', 'loading', 'globalize', 'emby-select', 'emby-button', 'emby-in } function getProfile() { - var id = getParameterByName('id'); - var url = id ? 'Dlna/Profiles/' + id : 'Dlna/Profiles/Default'; + const id = getParameterByName('id'); + const url = id ? 'Dlna/Profiles/' + id : 'Dlna/Profiles/Default'; return ApiClient.getJSON(ApiClient.getUrl(url)); } @@ -26,7 +34,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-select', 'emby-button', 'emby-in $('#chkEnableAlbumArtInDidl', page).prop('checked', profile.EnableAlbumArtInDidl); $('#chkEnableSingleImageLimit', page).prop('checked', profile.EnableSingleAlbumArtLimit); renderXmlDocumentAttributes(page, profile.XmlRootAttributes || []); - var idInfo = profile.Identification || {}; + const idInfo = profile.Identification || {}; renderIdentificationHeaders(page, idInfo.Headers || []); renderSubtitleProfiles(page, profile.SubtitleProfiles || []); $('#txtInfoFriendlyName', page).val(profile.FriendlyName || ''); @@ -65,7 +73,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-select', 'emby-button', 'emby-in profile.ContainerProfiles = profile.ContainerProfiles || []; profile.CodecProfiles = profile.CodecProfiles || []; profile.ResponseProfiles = profile.ResponseProfiles || []; - var usersHtml = '' + users.map(function (u) { + const usersHtml = '' + users.map(function (u) { return ''; }).join(''); $('#selectUser', page).html(usersHtml).val(profile.UserId || ''); @@ -73,9 +81,9 @@ define(['jQuery', 'loading', 'globalize', 'emby-select', 'emby-button', 'emby-in } function renderIdentificationHeaders(page, headers) { - var index = 0; - var html = '
' + headers.map(function (h) { - var li = '
'; + let index = 0; + const html = '
' + headers.map(function (h) { + let li = '
'; li += ''; li += '
'; li += '

' + h.Name + ': ' + (h.Value || '') + '

'; @@ -86,9 +94,9 @@ define(['jQuery', 'loading', 'globalize', 'emby-select', 'emby-button', 'emby-in index++; return li; }).join('') + '
'; - var elem = $('.httpHeaderIdentificationList', page).html(html).trigger('create'); + const elem = $('.httpHeaderIdentificationList', page).html(html).trigger('create'); $('.btnDeleteIdentificationHeader', elem).on('click', function () { - var itemIndex = parseInt(this.getAttribute('data-index')); + const itemIndex = parseInt(this.getAttribute('data-index')); currentProfile.Identification.Headers.splice(itemIndex, 1); renderIdentificationHeaders(page, currentProfile.Identification.Headers); }); @@ -106,7 +114,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-select', 'emby-button', 'emby-in isSubProfileNew = null == header; header = header || {}; currentSubProfile = header; - var popup = $('#identificationHeaderPopup', page); + const popup = $('#identificationHeaderPopup', page); $('#txtIdentificationHeaderName', popup).val(header.Name || ''); $('#txtIdentificationHeaderValue', popup).val(header.Value || ''); $('#selectMatchType', popup).val(header.Match || 'Equals'); @@ -130,8 +138,8 @@ define(['jQuery', 'loading', 'globalize', 'emby-select', 'emby-button', 'emby-in } function renderXmlDocumentAttributes(page, attribute) { - var html = '
' + attribute.map(function (h) { - var li = '
'; + const html = '
' + attribute.map(function (h) { + let li = '
'; li += ''; li += '
'; li += '

' + h.Name + ' = ' + (h.Value || '') + '

'; @@ -139,9 +147,9 @@ define(['jQuery', 'loading', 'globalize', 'emby-select', 'emby-button', 'emby-in li += ''; return li += '
'; }).join('') + '
'; - var elem = $('.xmlDocumentAttributeList', page).html(html).trigger('create'); + const elem = $('.xmlDocumentAttributeList', page).html(html).trigger('create'); $('.btnDeleteXmlAttribute', elem).on('click', function () { - var itemIndex = parseInt(this.getAttribute('data-index')); + const itemIndex = parseInt(this.getAttribute('data-index')); currentProfile.XmlRootAttributes.splice(itemIndex, 1); renderXmlDocumentAttributes(page, currentProfile.XmlRootAttributes); }); @@ -151,7 +159,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-select', 'emby-button', 'emby-in isSubProfileNew = null == attribute; attribute = attribute || {}; currentSubProfile = attribute; - var popup = $('#xmlAttributePopup', page); + const popup = $('#xmlAttributePopup', page); $('#txtXmlAttributeName', popup).val(attribute.Name || ''); $('#txtXmlAttributeValue', popup).val(attribute.Value || ''); openPopup(popup[0]); @@ -171,9 +179,9 @@ define(['jQuery', 'loading', 'globalize', 'emby-select', 'emby-button', 'emby-in } function renderSubtitleProfiles(page, profiles) { - var index = 0; - var html = '
' + profiles.map(function (h) { - var li = '
'; + let index = 0; + const html = '
' + profiles.map(function (h) { + let li = '
'; li += ''; li += '
'; li += '

' + (h.Format || '') + '

'; @@ -183,14 +191,14 @@ define(['jQuery', 'loading', 'globalize', 'emby-select', 'emby-button', 'emby-in index++; return li; }).join('') + '
'; - var elem = $('.subtitleProfileList', page).html(html).trigger('create'); + const elem = $('.subtitleProfileList', page).html(html).trigger('create'); $('.btnDeleteProfile', elem).on('click', function () { - var itemIndex = parseInt(this.getAttribute('data-index')); + const itemIndex = parseInt(this.getAttribute('data-index')); currentProfile.SubtitleProfiles.splice(itemIndex, 1); renderSubtitleProfiles(page, currentProfile.SubtitleProfiles); }); $('.lnkEditSubProfile', elem).on('click', function () { - var itemIndex = parseInt(this.getAttribute('data-index')); + const itemIndex = parseInt(this.getAttribute('data-index')); editSubtitleProfile(page, currentProfile.SubtitleProfiles[itemIndex]); }); } @@ -199,7 +207,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-select', 'emby-button', 'emby-in isSubProfileNew = null == profile; profile = profile || {}; currentSubProfile = profile; - var popup = $('#subtitleProfilePopup', page); + const popup = $('#subtitleProfilePopup', page); $('#txtSubtitleProfileFormat', popup).val(profile.Format || ''); $('#selectSubtitleProfileMethod', popup).val(profile.Method || ''); $('#selectSubtitleProfileDidlMode', popup).val(profile.DidlMode || ''); @@ -244,12 +252,12 @@ define(['jQuery', 'loading', 'globalize', 'emby-select', 'emby-button', 'emby-in } function renderDirectPlayProfiles(page, profiles) { - var html = ''; + let html = ''; html += '
    '; - var currentType; + let currentType; - for (var i = 0, length = profiles.length; i < length; i++) { - var profile = profiles[i]; + for (let i = 0, length = profiles.length; i < length; i++) { + const profile = profiles[i]; if (profile.Type !== currentType) { html += '
  • ' + profile.Type + '
  • '; @@ -275,13 +283,13 @@ define(['jQuery', 'loading', 'globalize', 'emby-select', 'emby-button', 'emby-in } html += '
'; - var elem = $('.directPlayProfiles', page).html(html).trigger('create'); + const elem = $('.directPlayProfiles', page).html(html).trigger('create'); $('.btnDeleteProfile', elem).on('click', function () { - var index = this.getAttribute('data-profileindex'); + const index = this.getAttribute('data-profileindex'); deleteDirectPlayProfile(page, index); }); $('.lnkEditSubProfile', elem).on('click', function () { - var index = parseInt(this.getAttribute('data-profileindex')); + const index = parseInt(this.getAttribute('data-profileindex')); editDirectPlayProfile(page, currentProfile.DirectPlayProfiles[index]); }); } @@ -295,7 +303,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-select', 'emby-button', 'emby-in isSubProfileNew = null == directPlayProfile; directPlayProfile = directPlayProfile || {}; currentSubProfile = directPlayProfile; - var popup = $('#popupEditDirectPlayProfile', page); + const popup = $('#popupEditDirectPlayProfile', page); $('#selectDirectPlayProfileType', popup).val(directPlayProfile.Type || 'Video').trigger('change'); $('#txtDirectPlayContainer', popup).val(directPlayProfile.Container || ''); $('#txtDirectPlayAudioCodec', popup).val(directPlayProfile.AudioCodec || ''); @@ -304,12 +312,12 @@ define(['jQuery', 'loading', 'globalize', 'emby-select', 'emby-button', 'emby-in } function renderTranscodingProfiles(page, profiles) { - var html = ''; + let html = ''; html += '
    '; - var currentType; + let currentType; - for (var i = 0, length = profiles.length; i < length; i++) { - var profile = profiles[i]; + for (let i = 0, length = profiles.length; i < length; i++) { + let profile = profiles[i]; if (profile.Type !== currentType) { html += '
  • ' + profile.Type + '
  • '; @@ -336,13 +344,13 @@ define(['jQuery', 'loading', 'globalize', 'emby-select', 'emby-button', 'emby-in } html += '
'; - var elem = $('.transcodingProfiles', page).html(html).trigger('create'); + const elem = $('.transcodingProfiles', page).html(html).trigger('create'); $('.btnDeleteProfile', elem).on('click', function () { - var index = this.getAttribute('data-profileindex'); + const index = this.getAttribute('data-profileindex'); deleteTranscodingProfile(page, index); }); $('.lnkEditSubProfile', elem).on('click', function () { - var index = parseInt(this.getAttribute('data-profileindex')); + const index = parseInt(this.getAttribute('data-profileindex')); editTranscodingProfile(page, currentProfile.TranscodingProfiles[index]); }); } @@ -351,7 +359,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-select', 'emby-button', 'emby-in isSubProfileNew = null == transcodingProfile; transcodingProfile = transcodingProfile || {}; currentSubProfile = transcodingProfile; - var popup = $('#transcodingProfilePopup', page); + const popup = $('#transcodingProfilePopup', page); $('#selectTranscodingProfileType', popup).val(transcodingProfile.Type || 'Video').trigger('change'); $('#txtTranscodingContainer', popup).val(transcodingProfile.Container || ''); $('#txtTranscodingAudioCodec', popup).val(transcodingProfile.AudioCodec || ''); @@ -390,12 +398,12 @@ define(['jQuery', 'loading', 'globalize', 'emby-select', 'emby-button', 'emby-in } function renderContainerProfiles(page, profiles) { - var html = ''; + let html = ''; html += '
    '; - var currentType; + let currentType; - for (var i = 0, length = profiles.length; i < length; i++) { - var profile = profiles[i]; + for (let i = 0, length = profiles.length; i < length; i++) { + let profile = profiles[i]; if (profile.Type !== currentType) { html += '
  • ' + profile.Type + '
  • '; @@ -420,13 +428,13 @@ define(['jQuery', 'loading', 'globalize', 'emby-select', 'emby-button', 'emby-in } html += '
'; - var elem = $('.containerProfiles', page).html(html).trigger('create'); + const elem = $('.containerProfiles', page).html(html).trigger('create'); $('.btnDeleteProfile', elem).on('click', function () { - var index = this.getAttribute('data-profileindex'); + const index = this.getAttribute('data-profileindex'); deleteContainerProfile(page, index); }); $('.lnkEditSubProfile', elem).on('click', function () { - var index = parseInt(this.getAttribute('data-profileindex')); + const index = parseInt(this.getAttribute('data-profileindex')); editContainerProfile(page, currentProfile.ContainerProfiles[index]); }); } @@ -440,7 +448,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-select', 'emby-button', 'emby-in isSubProfileNew = null == containerProfile; containerProfile = containerProfile || {}; currentSubProfile = containerProfile; - var popup = $('#containerProfilePopup', page); + const popup = $('#containerProfilePopup', page); $('#selectContainerProfileType', popup).val(containerProfile.Type || 'Video').trigger('change'); $('#txtContainerProfileContainer', popup).val(containerProfile.Container || ''); $('.radioTabButton:first', popup).trigger('click'); @@ -461,13 +469,13 @@ define(['jQuery', 'loading', 'globalize', 'emby-select', 'emby-button', 'emby-in } function renderCodecProfiles(page, profiles) { - var html = ''; + let html = ''; html += '
    '; - var currentType; + let currentType; - for (var i = 0, length = profiles.length; i < length; i++) { - var profile = profiles[i]; - var type = profile.Type.replace('VideoAudio', 'Video Audio'); + for (let i = 0, length = profiles.length; i < length; i++) { + let profile = profiles[i]; + const type = profile.Type.replace('VideoAudio', 'Video Audio'); if (type !== currentType) { html += '
  • ' + type + '
  • '; @@ -492,13 +500,13 @@ define(['jQuery', 'loading', 'globalize', 'emby-select', 'emby-button', 'emby-in } html += '
'; - var elem = $('.codecProfiles', page).html(html).trigger('create'); + const elem = $('.codecProfiles', page).html(html).trigger('create'); $('.btnDeleteProfile', elem).on('click', function () { - var index = this.getAttribute('data-profileindex'); + const index = this.getAttribute('data-profileindex'); deleteCodecProfile(page, index); }); $('.lnkEditSubProfile', elem).on('click', function () { - var index = parseInt(this.getAttribute('data-profileindex')); + const index = parseInt(this.getAttribute('data-profileindex')); editCodecProfile(page, currentProfile.CodecProfiles[index]); }); } @@ -512,7 +520,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-select', 'emby-button', 'emby-in isSubProfileNew = null == codecProfile; codecProfile = codecProfile || {}; currentSubProfile = codecProfile; - var popup = $('#codecProfilePopup', page); + const popup = $('#codecProfilePopup', page); $('#selectCodecProfileType', popup).val(codecProfile.Type || 'Video').trigger('change'); $('#txtCodecProfileCodec', popup).val(codecProfile.Codec || ''); $('.radioTabButton:first', popup).trigger('click'); @@ -533,12 +541,12 @@ define(['jQuery', 'loading', 'globalize', 'emby-select', 'emby-button', 'emby-in } function renderResponseProfiles(page, profiles) { - var html = ''; + let html = ''; html += '
    '; - var currentType; + let currentType; - for (var i = 0, length = profiles.length; i < length; i++) { - var profile = profiles[i]; + for (let i = 0, length = profiles.length; i < length; i++) { + const profile = profiles[i]; if (profile.Type !== currentType) { html += '
  • ' + profile.Type + '
  • '; @@ -572,13 +580,13 @@ define(['jQuery', 'loading', 'globalize', 'emby-select', 'emby-button', 'emby-in } html += '
'; - var elem = $('.mediaProfiles', page).html(html).trigger('create'); + const elem = $('.mediaProfiles', page).html(html).trigger('create'); $('.btnDeleteProfile', elem).on('click', function () { - var index = this.getAttribute('data-profileindex'); + const index = this.getAttribute('data-profileindex'); deleteResponseProfile(page, index); }); $('.lnkEditSubProfile', elem).on('click', function () { - var index = parseInt(this.getAttribute('data-profileindex')); + const index = parseInt(this.getAttribute('data-profileindex')); editResponseProfile(page, currentProfile.ResponseProfiles[index]); }); } @@ -592,7 +600,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-select', 'emby-button', 'emby-in isSubProfileNew = null == responseProfile; responseProfile = responseProfile || {}; currentSubProfile = responseProfile; - var popup = $('#responseProfilePopup', page); + const popup = $('#responseProfilePopup', page); $('#selectResponseProfileType', popup).val(responseProfile.Type || 'Video').trigger('change'); $('#txtResponseProfileContainer', popup).val(responseProfile.Container || ''); $('#txtResponseProfileAudioCodec', popup).val(responseProfile.AudioCodec || ''); @@ -618,7 +626,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-select', 'emby-button', 'emby-in function saveProfile(page, profile) { updateProfile(page, profile); - var id = getParameterByName('id'); + const id = getParameterByName('id'); if (id) { ApiClient.ajax({ @@ -627,7 +635,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-select', 'emby-button', 'emby-in data: JSON.stringify(profile), contentType: 'application/json' }).then(function () { - require(['toast'], function (toast) { + import('toast').then(({default: toast}) => { toast('Settings saved.'); }); }, Dashboard.processErrorResponse); @@ -687,18 +695,18 @@ define(['jQuery', 'loading', 'globalize', 'emby-select', 'emby-button', 'emby-in profile.UserId = $('#selectUser', page).val(); } - var currentProfile; - var currentSubProfile; - var isSubProfileNew; - var allText = globalize.translate('LabelAll'); + let currentProfile; + let currentSubProfile; + let isSubProfileNew; + const allText = globalize.translate('LabelAll'); $(document).on('pageinit', '#dlnaProfilePage', function () { - var page = this; + const page = this; $('.radioTabButton', page).on('click', function () { $(this).siblings().removeClass('ui-btn-active'); $(this).addClass('ui-btn-active'); - var value = 'A' == this.tagName ? this.getAttribute('data-value') : this.value; - var elem = $('.' + value, page); + const value = 'A' == this.tagName ? this.getAttribute('data-value') : this.value; + const elem = $('.' + value, page); elem.siblings('.tabContent').hide(); elem.show(); }); @@ -783,7 +791,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-select', 'emby-button', 'emby-in $('.xmlAttributeForm').off('submit', DlnaProfilePage.onXmlAttributeFormSubmit).on('submit', DlnaProfilePage.onXmlAttributeFormSubmit); $('.subtitleProfileForm').off('submit', DlnaProfilePage.onSubtitleProfileFormSubmit).on('submit', DlnaProfilePage.onSubtitleProfileFormSubmit); }).on('pageshow', '#dlnaProfilePage', function () { - var page = this; + const page = this; $('#radioInfo', page).trigger('click'); loadProfile(page); }); @@ -826,4 +834,5 @@ define(['jQuery', 'loading', 'globalize', 'emby-select', 'emby-button', 'emby-in return false; } }; -}); + +/* eslint-enable indent */ diff --git a/src/controllers/dashboard/dlna/profiles.js b/src/controllers/dashboard/dlna/profiles.js index fb4caadeb9..510128be4b 100644 --- a/src/controllers/dashboard/dlna/profiles.js +++ b/src/controllers/dashboard/dlna/profiles.js @@ -1,5 +1,11 @@ -define(['jQuery', 'globalize', 'loading', 'libraryMenu', 'listViewStyle', 'emby-button'], function ($, globalize, loading, libraryMenu) { - 'use strict'; +import $ from 'jQuery'; +import globalize from 'globalize'; +import loading from 'loading'; +import libraryMenu from 'libraryMenu'; +import 'listViewStyle'; +import 'emby-button'; + +/* eslint-disable indent */ function loadProfiles(page) { loading.show(); @@ -23,14 +29,14 @@ define(['jQuery', 'globalize', 'loading', 'libraryMenu', 'listViewStyle', 'emby- } function renderProfiles(page, element, profiles) { - var html = ''; + let html = ''; if (profiles.length) { html += '
'; } - for (var i = 0, length = profiles.length; i < length; i++) { - var profile = profiles[i]; + for (let i = 0, length = profiles.length; i < length; i++) { + let profile = profiles[i]; html += '
'; html += ''; html += '
'; @@ -52,13 +58,13 @@ define(['jQuery', 'globalize', 'loading', 'libraryMenu', 'listViewStyle', 'emby- element.innerHTML = html; $('.btnDeleteProfile', element).on('click', function () { - var id = this.getAttribute('data-profileid'); + const id = this.getAttribute('data-profileid'); deleteProfile(page, id); }); } function deleteProfile(page, id) { - require(['confirm'], function (confirm) { + import('confirm').then(({default: confirm}) => { confirm(globalize.translate('MessageConfirmProfileDeletion'), globalize.translate('HeaderConfirmProfileDeletion')).then(function () { loading.show(); ApiClient.ajax({ @@ -86,4 +92,5 @@ define(['jQuery', 'globalize', 'loading', 'libraryMenu', 'listViewStyle', 'emby- libraryMenu.setTabs('dlna', 1, getTabs); loadProfiles(this); }); -}); + +/* eslint-enable indent */ diff --git a/src/controllers/dashboard/dlna/settings.js b/src/controllers/dashboard/dlna/settings.js index 5bbfea5d4b..9e7d78d799 100644 --- a/src/controllers/dashboard/dlna/settings.js +++ b/src/controllers/dashboard/dlna/settings.js @@ -1,5 +1,9 @@ -define(['jQuery', 'loading', 'libraryMenu', 'globalize'], function ($, loading, libraryMenu, globalize) { - 'use strict'; +import $ from 'jQuery'; +import loading from 'loading'; +import libraryMenu from 'libraryMenu'; +import globalize from 'globalize'; + +/* eslint-disable indent */ function loadPage(page, config, users) { page.querySelector('#chkEnablePlayTo').checked = config.EnablePlayTo; @@ -8,7 +12,7 @@ define(['jQuery', 'loading', 'libraryMenu', 'globalize'], function ($, loading, $('#chkEnableServer', page).prop('checked', config.EnableServer); $('#chkBlastAliveMessages', page).prop('checked', config.BlastAliveMessages); $('#txtBlastInterval', page).val(config.BlastAliveMessageIntervalSeconds); - var usersHtml = users.map(function (u) { + const usersHtml = users.map(function (u) { return ''; }).join(''); $('#selectUser', page).html(usersHtml).val(config.DefaultUserId || ''); @@ -17,7 +21,7 @@ define(['jQuery', 'loading', 'libraryMenu', 'globalize'], function ($, loading, function onSubmit() { loading.show(); - var form = this; + const form = this; ApiClient.getNamedConfiguration('dlna').then(function (config) { config.EnablePlayTo = form.querySelector('#chkEnablePlayTo').checked; config.EnableDebugLog = form.querySelector('#chkEnableDlnaDebugLogging').checked; @@ -46,11 +50,12 @@ define(['jQuery', 'loading', 'libraryMenu', 'globalize'], function ($, loading, }).on('pageshow', '#dlnaSettingsPage', function () { libraryMenu.setTabs('dlna', 0, getTabs); loading.show(); - var page = this; - var promise1 = ApiClient.getNamedConfiguration('dlna'); - var promise2 = ApiClient.getUsers(); + const page = this; + const promise1 = ApiClient.getNamedConfiguration('dlna'); + const promise2 = ApiClient.getUsers(); Promise.all([promise1, promise2]).then(function (responses) { loadPage(page, responses[0], responses[1]); }); }); -}); + +/* eslint-enable indent */ From a0bc2f217abcfb4234973b8872e1a273aee85613 Mon Sep 17 00:00:00 2001 From: Cameron Date: Sun, 12 Jul 2020 15:25:13 +0100 Subject: [PATCH 086/244] Migration of episodes to ES6 module --- package.json | 1 + src/controllers/shows/episodes.js | 64 +++++++++++++++++-------------- 2 files changed, 37 insertions(+), 28 deletions(-) diff --git a/package.json b/package.json index 81c627f085..ffd9fddfdb 100644 --- a/package.json +++ b/package.json @@ -137,6 +137,7 @@ "src/controllers/dashboard/logs.js", "src/controllers/user/subtitles.js", "src/controllers/dashboard/plugins/repositories.js", + "src/controllers/shows/episodes.js", "src/plugins/bookPlayer/plugin.js", "src/plugins/bookPlayer/tableOfContents.js", "src/plugins/photoPlayer/plugin.js", diff --git a/src/controllers/shows/episodes.js b/src/controllers/shows/episodes.js index eeede20661..1e067a7674 100644 --- a/src/controllers/shows/episodes.js +++ b/src/controllers/shows/episodes.js @@ -1,10 +1,19 @@ -define(['loading', 'events', 'libraryBrowser', 'imageLoader', 'listView', 'cardBuilder', 'userSettings', 'globalize', 'emby-itemscontainer'], function (loading, events, libraryBrowser, imageLoader, listView, cardBuilder, userSettings, globalize) { - 'use strict'; +import loading from 'loading'; +import events from 'events'; +import libraryBrowser from 'libraryBrowser'; +import imageLoader from 'imageLoader'; +import listView from 'listView'; +import cardBuilder from 'cardBuilder'; +import * as userSettings from 'userSettings'; +import globalize from 'globalize'; +import 'emby-itemscontainer'; - return function (view, params, tabContent) { +/* eslint-disable indent */ + + export default function (view, params, tabContent) { function getPageData(context) { - var key = getSavedQueryKey(context); - var pageData = data[key]; + const key = getSavedQueryKey(context); + let pageData = data[key]; if (!pageData) { pageData = data[key] = { @@ -46,8 +55,8 @@ define(['loading', 'events', 'libraryBrowser', 'imageLoader', 'listView', 'cardB } function onViewStyleChange() { - var viewStyle = self.getCurrentViewStyle(); - var itemsContainer = tabContent.querySelector('.itemsContainer'); + const viewStyle = self.getCurrentViewStyle(); + const itemsContainer = tabContent.querySelector('.itemsContainer'); if ('List' == viewStyle) { itemsContainer.classList.add('vertical-list'); @@ -63,7 +72,7 @@ define(['loading', 'events', 'libraryBrowser', 'imageLoader', 'listView', 'cardB function reloadItems(page) { loading.show(); isLoading = true; - var query = getQuery(page); + const query = getQuery(page); ApiClient.getItems(Dashboard.getCurrentUserId(), query).then(function (result) { function onNextPageClick() { if (isLoading) { @@ -88,8 +97,8 @@ define(['loading', 'events', 'libraryBrowser', 'imageLoader', 'listView', 'cardB } window.scrollTo(0, 0); - var html; - var pagingHtml = libraryBrowser.getQueryPagingHtml({ + let html; + const pagingHtml = libraryBrowser.getQueryPagingHtml({ startIndex: query.StartIndex, limit: query.Limit, totalRecordCount: result.TotalRecordCount, @@ -99,8 +108,8 @@ define(['loading', 'events', 'libraryBrowser', 'imageLoader', 'listView', 'cardB sortButton: false, filterButton: false }); - var viewStyle = self.getCurrentViewStyle(); - var itemsContainer = tabContent.querySelector('.itemsContainer'); + const viewStyle = self.getCurrentViewStyle(); + const itemsContainer = tabContent.querySelector('.itemsContainer'); if (viewStyle == 'List') { html = listView.getListViewHtml({ items: result.Items, @@ -128,22 +137,20 @@ define(['loading', 'events', 'libraryBrowser', 'imageLoader', 'listView', 'cardB overlayPlayButton: true }); } - var i; - var length; - var elems; + let elems; elems = tabContent.querySelectorAll('.paging'); - for (i = 0, length = elems.length; i < length; i++) { + for (let i = 0, length = elems.length; i < length; i++) { elems[i].innerHTML = pagingHtml; } elems = tabContent.querySelectorAll('.btnNextPage'); - for (i = 0, length = elems.length; i < length; i++) { + for (let i = 0, length = elems.length; i < length; i++) { elems[i].addEventListener('click', onNextPageClick); } elems = tabContent.querySelectorAll('.btnPreviousPage'); - for (i = 0, length = elems.length; i < length; i++) { + for (let i = 0, length = elems.length; i < length; i++) { elems[i].addEventListener('click', onPreviousPageClick); } @@ -153,19 +160,19 @@ define(['loading', 'events', 'libraryBrowser', 'imageLoader', 'listView', 'cardB loading.hide(); isLoading = false; - require(['autoFocuser'], function (autoFocuser) { + import('autoFocuser').then(({default: autoFocuser}) => { autoFocuser.autoFocus(page); }); }); } - var self = this; - var data = {}; - var isLoading = false; + const self = this; + const data = {}; + let isLoading = false; self.showFilterMenu = function () { - require(['components/filterdialog/filterdialog'], function ({default: filterDialogFactory}) { - var filterDialog = new filterDialogFactory({ + import('components/filterdialog/filterdialog').then(({default: filterDialogFactory}) => { + const filterDialog = new filterDialogFactory({ query: getQuery(tabContent), mode: 'episodes', serverId: ApiClient.serverId() @@ -219,12 +226,12 @@ define(['loading', 'events', 'libraryBrowser', 'imageLoader', 'listView', 'cardB button: e.target }); }); - var btnSelectView = tabContent.querySelector('.btnSelectView'); + const btnSelectView = tabContent.querySelector('.btnSelectView'); btnSelectView.addEventListener('click', function (e) { libraryBrowser.showLayoutMenu(e.target, self.getCurrentViewStyle(), 'List,Poster,PosterCard'.split(',')); }); btnSelectView.addEventListener('layoutchange', function (e) { - var viewStyle = e.detail.viewStyle; + const viewStyle = e.detail.viewStyle; getPageData(tabContent).view = viewStyle; libraryBrowser.saveViewSetting(getSavedQueryKey(tabContent), viewStyle); onViewStyleChange(); @@ -240,5 +247,6 @@ define(['loading', 'events', 'libraryBrowser', 'imageLoader', 'listView', 'cardB }; self.destroy = function () {}; - }; -}); + } + +/* eslint-enable indent */ From 5659c0f92196521c9111f0ef5e8034d96d8b8884 Mon Sep 17 00:00:00 2001 From: Cameron Date: Sun, 12 Jul 2020 15:25:28 +0100 Subject: [PATCH 087/244] Migration of genres to ES6 module --- package.json | 1 + src/controllers/shows/tvgenres.js | 61 ++++++++++++++++++------------- 2 files changed, 37 insertions(+), 25 deletions(-) diff --git a/package.json b/package.json index ffd9fddfdb..bd4ee75d86 100644 --- a/package.json +++ b/package.json @@ -138,6 +138,7 @@ "src/controllers/user/subtitles.js", "src/controllers/dashboard/plugins/repositories.js", "src/controllers/shows/episodes.js", + "src/controllers/shows/tvgenres.js", "src/plugins/bookPlayer/plugin.js", "src/plugins/bookPlayer/tableOfContents.js", "src/plugins/photoPlayer/plugin.js", diff --git a/src/controllers/shows/tvgenres.js b/src/controllers/shows/tvgenres.js index 7d09307fc2..f48b91d68f 100644 --- a/src/controllers/shows/tvgenres.js +++ b/src/controllers/shows/tvgenres.js @@ -1,10 +1,20 @@ -define(['layoutManager', 'loading', 'libraryBrowser', 'cardBuilder', 'lazyLoader', 'apphost', 'globalize', 'appRouter', 'dom', 'emby-button'], function (layoutManager, loading, libraryBrowser, cardBuilder, lazyLoader, appHost, globalize, appRouter, dom) { - 'use strict'; +import layoutManager from 'layoutManager'; +import loading from 'loading'; +import libraryBrowser from 'libraryBrowser'; +import cardBuilder from 'cardBuilder'; +import lazyLoader from 'lazyLoader'; +import appHost from 'apphost'; +import globalize from 'globalize'; +import appRouter from 'appRouter'; +import dom from 'dom'; +import 'emby-button'; - return function (view, params, tabContent) { +/* eslint-disable indent */ + + export default function (view, params, tabContent) { function getPageData() { - var key = getSavedQueryKey(); - var pageData = data[key]; + const key = getSavedQueryKey(); + let pageData = data[key]; if (!pageData) { pageData = data[key] = { @@ -34,7 +44,7 @@ define(['layoutManager', 'loading', 'libraryBrowser', 'cardBuilder', 'lazyLoader function getPromise() { loading.show(); - var query = getQuery(); + const query = getQuery(); return ApiClient.getGenres(ApiClient.getCurrentUserId(), query); } @@ -51,17 +61,17 @@ define(['layoutManager', 'loading', 'libraryBrowser', 'cardBuilder', 'lazyLoader } function fillItemsContainer(entry) { - var elem = entry.target; - var id = elem.getAttribute('data-id'); - var viewStyle = self.getCurrentViewStyle(); - var limit = 'Thumb' == viewStyle || 'ThumbCard' == viewStyle ? 5 : 9; + const elem = entry.target; + const id = elem.getAttribute('data-id'); + const viewStyle = self.getCurrentViewStyle(); + let limit = 'Thumb' == viewStyle || 'ThumbCard' == viewStyle ? 5 : 9; if (enableScrollX()) { limit = 10; } - var enableImageTypes = 'Thumb' == viewStyle || 'ThumbCard' == viewStyle ? 'Primary,Backdrop,Thumb' : 'Primary'; - var query = { + const enableImageTypes = 'Thumb' == viewStyle || 'ThumbCard' == viewStyle ? 'Primary,Backdrop,Thumb' : 'Primary'; + const query = { SortBy: 'SortName', SortOrder: 'Ascending', IncludeItemTypes: 'Series', @@ -75,7 +85,7 @@ define(['layoutManager', 'loading', 'libraryBrowser', 'cardBuilder', 'lazyLoader ParentId: params.topParentId }; ApiClient.getItems(ApiClient.getCurrentUserId(), query).then(function (result) { - var supportsImageAnalysis = appHost.supports('imageanalysis'); + const supportsImageAnalysis = appHost.supports('imageanalysis'); if (viewStyle == 'Thumb') { cardBuilder.buildCards(result.Items, { @@ -128,14 +138,14 @@ define(['layoutManager', 'loading', 'libraryBrowser', 'cardBuilder', 'lazyLoader } function reloadItems(context, promise) { - var query = getQuery(); + const query = getQuery(); promise.then(function (result) { - var elem = context.querySelector('#items'); - var html = ''; - var items = result.Items; + const elem = context.querySelector('#items'); + let html = ''; + const items = result.Items; - for (var i = 0, length = items.length; i < length; i++) { - var item = items[i]; + for (let i = 0, length = items.length; i < length; i++) { + const item = items[i]; html += '
'; html += '
'; html += ' { autoFocuser.autoFocus(context); }); }); } - return function (view, params, tabContent) { - var self = this; - var latestPromise; + export default function (view, params, tabContent) { + console.log(tabContent) + const self = this; + let latestPromise; self.preRender = function () { latestPromise = getLatestPromise(view, params); @@ -59,6 +65,7 @@ define(['loading', 'components/groupedcards', 'cardBuilder', 'apphost', 'imageLo loadLatest(tabContent, params, latestPromise); }; - tabContent.querySelector('#latestEpisodes').addEventListener('click', groupedcards.onItemsContainerClick); - }; -}); + tabContent.querySelector('#latestEpisodes').addEventListener('click', groupedcards); + } + +/* eslint-enable indent */ From 13a617d8ed295b48806aee9f8058e0b37fcf6e43 Mon Sep 17 00:00:00 2001 From: Cameron Date: Sun, 12 Jul 2020 15:26:14 +0100 Subject: [PATCH 089/244] migration of tvrecommended to ES6 module --- package.json | 1 + src/controllers/shows/tvrecommended.js | 87 +++++++++++++++----------- 2 files changed, 53 insertions(+), 35 deletions(-) diff --git a/package.json b/package.json index 1c2a35966c..959be2aa48 100644 --- a/package.json +++ b/package.json @@ -140,6 +140,7 @@ "src/controllers/shows/episodes.js", "src/controllers/shows/tvgenres.js", "src/controllers/shows/tvlatest.js", + "src/controllers/shows/tvrecommended.js", "src/plugins/bookPlayer/plugin.js", "src/plugins/bookPlayer/tableOfContents.js", "src/plugins/photoPlayer/plugin.js", diff --git a/src/controllers/shows/tvrecommended.js b/src/controllers/shows/tvrecommended.js index 8087a03096..d32b47840c 100644 --- a/src/controllers/shows/tvrecommended.js +++ b/src/controllers/shows/tvrecommended.js @@ -1,5 +1,19 @@ -define(['events', 'inputManager', 'libraryMenu', 'layoutManager', 'loading', 'dom', 'userSettings', 'cardBuilder', 'playbackManager', 'mainTabsManager', 'globalize', 'scrollStyles', 'emby-itemscontainer', 'emby-button'], function (events, inputManager, libraryMenu, layoutManager, loading, dom, userSettings, cardBuilder, playbackManager, mainTabsManager, globalize) { - 'use strict'; +import events from 'events'; +import inputManager from 'inputManager'; +import libraryMenu from 'libraryMenu'; +import layoutManager from 'layoutManager'; +import loading from 'loading'; +import dom from 'dom'; +import * as userSettings from 'userSettings'; +import cardBuilder from 'cardBuilder'; +import playbackManager from 'playbackManager'; +import mainTabsManager from 'mainTabsManager'; +import globalize from 'globalize'; +import 'scrollStyles'; +import 'emby-itemscontainer'; +import 'emby-button'; + +/* eslint-disable indent */ function getTabs() { return [{ @@ -59,7 +73,7 @@ define(['events', 'inputManager', 'libraryMenu', 'layoutManager', 'loading', 'do } } - return function (view, params) { + export default function (view, params) { function reload() { loading.show(); loadResume(); @@ -67,7 +81,7 @@ define(['events', 'inputManager', 'libraryMenu', 'layoutManager', 'loading', 'do } function loadNextUp() { - var query = { + const query = { Limit: 24, Fields: 'PrimaryImageAspectRatio,SeriesInfo,DateCreated,BasicSyncInfo', UserId: ApiClient.getCurrentUserId(), @@ -83,7 +97,7 @@ define(['events', 'inputManager', 'libraryMenu', 'layoutManager', 'loading', 'do view.querySelector('.noNextUpItems').classList.remove('hide'); } - var container = view.querySelector('#nextUpItems'); + const container = view.querySelector('#nextUpItems'); cardBuilder.buildCards(result.Items, { itemsContainer: container, preferThumb: true, @@ -98,7 +112,7 @@ define(['events', 'inputManager', 'libraryMenu', 'layoutManager', 'loading', 'do }); loading.hide(); - require(['autoFocuser'], function (autoFocuser) { + import('autoFocuser').then(({default: autoFocuser}) => { autoFocuser.autoFocus(view); }); }); @@ -113,10 +127,10 @@ define(['events', 'inputManager', 'libraryMenu', 'layoutManager', 'loading', 'do } function loadResume() { - var parentId = libraryMenu.getTopParentId(); - var screenWidth = dom.getWindowSize().innerWidth; - var limit = screenWidth >= 1600 ? 5 : 6; - var options = { + const parentId = libraryMenu.getTopParentId(); + const screenWidth = dom.getWindowSize().innerWidth; + const limit = screenWidth >= 1600 ? 5 : 6; + const options = { SortBy: 'DatePlayed', SortOrder: 'Descending', IncludeItemTypes: 'Episode', @@ -137,8 +151,8 @@ define(['events', 'inputManager', 'libraryMenu', 'layoutManager', 'loading', 'do view.querySelector('#resumableSection').classList.add('hide'); } - var allowBottomPadding = !enableScrollX(); - var container = view.querySelector('#resumableItems'); + const allowBottomPadding = !enableScrollX(); + const container = view.querySelector('#resumableItems'); cardBuilder.buildCards(result.Items, { itemsContainer: container, preferThumb: true, @@ -160,7 +174,7 @@ define(['events', 'inputManager', 'libraryMenu', 'layoutManager', 'loading', 'do } function onTabChange(e) { - var newIndex = parseInt(e.detail.selectedTabIndex); + const newIndex = parseInt(e.detail.selectedTabIndex); loadTab(view, newIndex); } @@ -173,49 +187,51 @@ define(['events', 'inputManager', 'libraryMenu', 'layoutManager', 'loading', 'do } function getTabController(page, index, callback) { - var depends = []; + let depends; switch (index) { case 0: - depends.push('controllers/shows/tvshows'); + depends = 'controllers/shows/tvshows'; break; case 1: + depends = 'controllers/shows/tvrecommended'; break; case 2: - depends.push('controllers/shows/tvlatest'); + depends = 'controllers/shows/tvlatest'; break; case 3: - depends.push('controllers/shows/tvupcoming'); + depends = 'controllers/shows/tvupcoming'; break; case 4: - depends.push('controllers/shows/tvgenres'); + depends = 'controllers/shows/tvgenres'; break; case 5: - depends.push('controllers/shows/tvstudios'); + depends = 'controllers/shows/tvstudios'; break; case 6: - depends.push('controllers/shows/episodes'); + depends = 'controllers/shows/episodes'; break; case 7: - depends.push('scripts/searchtab'); + depends = 'scripts/searchtab'; } - require(depends, function (controllerFactory) { - var tabContent; + import(depends).then(({default: controllerFactory}) => { + console.log('using controller factory from ' + depends) + let tabContent; if (index === 1) { tabContent = view.querySelector(".pageTabContent[data-index='" + index + "']"); self.tabContent = tabContent; } - var controller = tabControllers[index]; + let controller = tabControllers[index]; if (!controller) { tabContent = view.querySelector(".pageTabContent[data-index='" + index + "']"); @@ -270,7 +286,7 @@ define(['events', 'inputManager', 'libraryMenu', 'layoutManager', 'loading', 'do } function onWebSocketMessage(e, data) { - var msg = data; + const msg = data; if (msg.MessageType === 'UserDataChanged' && msg.Data.UserId == ApiClient.getCurrentUserId()) { renderedTabs = []; @@ -285,13 +301,13 @@ define(['events', 'inputManager', 'libraryMenu', 'layoutManager', 'loading', 'do } } - var isViewRestored; - var self = this; - var currentTabIndex = parseInt(params.tab || getDefaultTabIndex(params.topParentId)); - var initialTabIndex = currentTabIndex; + let isViewRestored; + const self = this; + let currentTabIndex = parseInt(params.tab || getDefaultTabIndex(params.topParentId)); + let initialTabIndex = currentTabIndex; self.initTab = function () { - var tabContent = self.tabContent; + const tabContent = self.tabContent; setScrollClasses(tabContent.querySelector('#resumableItems'), enableScrollX()); }; @@ -299,14 +315,14 @@ define(['events', 'inputManager', 'libraryMenu', 'layoutManager', 'loading', 'do reload(); }; - var tabControllers = []; - var renderedTabs = []; + const tabControllers = []; + let renderedTabs = []; setScrollClasses(view.querySelector('#resumableItems'), enableScrollX()); view.addEventListener('viewshow', function (e) { isViewRestored = e.detail.isRestored; initTabs(); if (!view.getAttribute('data-title')) { - var parentId = params.topParentId; + const parentId = params.topParentId; if (parentId) { ApiClient.getItem(ApiClient.getCurrentUserId(), parentId).then(function (item) { @@ -335,5 +351,6 @@ define(['events', 'inputManager', 'libraryMenu', 'layoutManager', 'loading', 'do } }); }); - }; -}); + } + +/* eslint-enable indent */ From 253322742638623c3186154376b5c7ade24bf05b Mon Sep 17 00:00:00 2001 From: Cameron Date: Sun, 12 Jul 2020 15:26:33 +0100 Subject: [PATCH 090/244] Migration of tvshows to ES6 module --- package.json | 1 + src/controllers/shows/tvshows.js | 79 ++++++++++++++++++-------------- 2 files changed, 46 insertions(+), 34 deletions(-) diff --git a/package.json b/package.json index 959be2aa48..173d56bfc4 100644 --- a/package.json +++ b/package.json @@ -141,6 +141,7 @@ "src/controllers/shows/tvgenres.js", "src/controllers/shows/tvlatest.js", "src/controllers/shows/tvrecommended.js", + "src/controllers/shows/tvshows.js", "src/plugins/bookPlayer/plugin.js", "src/plugins/bookPlayer/tableOfContents.js", "src/plugins/photoPlayer/plugin.js", diff --git a/src/controllers/shows/tvshows.js b/src/controllers/shows/tvshows.js index 4425c3aee1..cde5ae5058 100644 --- a/src/controllers/shows/tvshows.js +++ b/src/controllers/shows/tvshows.js @@ -1,10 +1,21 @@ -define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', 'listView', 'cardBuilder', 'alphaPicker', 'userSettings', 'globalize', 'emby-itemscontainer'], function (layoutManager, loading, events, libraryBrowser, imageLoader, listView, cardBuilder, AlphaPicker, userSettings, globalize) { - 'use strict'; +import layoutManager from 'layoutManager'; +import loading from 'loading'; +import events from 'events'; +import libraryBrowser from 'libraryBrowser'; +import imageLoader from 'imageLoader'; +import listView from 'listView'; +import cardBuilder from 'cardBuilder'; +import AlphaPicker from 'alphaPicker'; +import * as userSettings from 'userSettings'; +import globalize from 'globalize'; +import 'emby-itemscontainer'; - return function (view, params, tabContent) { +/* eslint-disable indent */ + + export default function (view, params, tabContent) { function getPageData(context) { - var key = getSavedQueryKey(context); - var pageData = data[key]; + const key = getSavedQueryKey(context); + let pageData = data[key]; if (!pageData) { pageData = data[key] = { @@ -45,8 +56,8 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', ' } function onViewStyleChange() { - var viewStyle = self.getCurrentViewStyle(); - var itemsContainer = tabContent.querySelector('.itemsContainer'); + const viewStyle = self.getCurrentViewStyle(); + const itemsContainer = tabContent.querySelector('.itemsContainer'); if ('List' == viewStyle) { itemsContainer.classList.add('vertical-list'); @@ -62,7 +73,7 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', ' function reloadItems(page) { loading.show(); isLoading = true; - var query = getQuery(page); + const query = getQuery(page); ApiClient.getItems(ApiClient.getCurrentUserId(), query).then(function (result) { function onNextPageClick() { if (isLoading) { @@ -88,8 +99,8 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', ' window.scrollTo(0, 0); updateFilterControls(page); - var html; - var pagingHtml = libraryBrowser.getQueryPagingHtml({ + let html; + const pagingHtml = libraryBrowser.getQueryPagingHtml({ startIndex: query.StartIndex, limit: query.Limit, totalRecordCount: result.TotalRecordCount, @@ -99,7 +110,7 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', ' sortButton: false, filterButton: false }); - var viewStyle = self.getCurrentViewStyle(); + const viewStyle = self.getCurrentViewStyle(); if (viewStyle == 'Thumb') { html = cardBuilder.getCardsHtml({ items: result.Items, @@ -156,49 +167,48 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', ' showYear: true }); } - var i; - var length; - var elems = tabContent.querySelectorAll('.paging'); - for (i = 0, length = elems.length; i < length; i++) { + let elems = tabContent.querySelectorAll('.paging'); + + for (let i = 0, length = elems.length; i < length; i++) { elems[i].innerHTML = pagingHtml; } elems = tabContent.querySelectorAll('.btnNextPage'); - for (i = 0, length = elems.length; i < length; i++) { + for (let i = 0, length = elems.length; i < length; i++) { elems[i].addEventListener('click', onNextPageClick); } elems = tabContent.querySelectorAll('.btnPreviousPage'); - for (i = 0, length = elems.length; i < length; i++) { + for (let i = 0, length = elems.length; i < length; i++) { elems[i].addEventListener('click', onPreviousPageClick); } - var itemsContainer = tabContent.querySelector('.itemsContainer'); + const itemsContainer = tabContent.querySelector('.itemsContainer'); itemsContainer.innerHTML = html; imageLoader.lazyChildren(itemsContainer); libraryBrowser.saveQueryValues(getSavedQueryKey(page), query); loading.hide(); isLoading = false; - require(['autoFocuser'], function (autoFocuser) { + import('autoFocuser').then(({default: autoFocuser}) => { autoFocuser.autoFocus(page); }); }); } function updateFilterControls(tabContent) { - var query = getQuery(tabContent); + const query = getQuery(tabContent); self.alphaPicker.value(query.NameStartsWithOrGreater); } - var self = this; - var data = {}; - var isLoading = false; + const self = this; + const data = {}; + let isLoading = false; self.showFilterMenu = function () { - require(['components/filterdialog/filterdialog'], function ({default: filterDialogFactory}) { - var filterDialog = new filterDialogFactory({ + import('components/filterdialog/filterdialog').then(({default: filterDialogFactory}) => { + const filterDialog = new filterDialogFactory({ query: getQuery(tabContent), mode: 'series', serverId: ApiClient.serverId() @@ -216,17 +226,17 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', ' }; function initPage(tabContent) { - var alphaPickerElement = tabContent.querySelector('.alphaPicker'); - var itemsContainer = tabContent.querySelector('.itemsContainer'); + const alphaPickerElement = tabContent.querySelector('.alphaPicker'); + const itemsContainer = tabContent.querySelector('.itemsContainer'); alphaPickerElement.addEventListener('alphavaluechanged', function (e) { - var newValue = e.detail.value; - var query = getQuery(tabContent); + const newValue = e.detail.value; + const query = getQuery(tabContent); query.NameStartsWithOrGreater = newValue; query.StartIndex = 0; reloadItems(tabContent); }); - self.alphaPicker = new AlphaPicker.default({ + self.alphaPicker = new AlphaPicker({ element: alphaPickerElement, valueChangeEvent: 'click' }); @@ -267,12 +277,12 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', ' button: e.target }); }); - var btnSelectView = tabContent.querySelector('.btnSelectView'); + const btnSelectView = tabContent.querySelector('.btnSelectView'); btnSelectView.addEventListener('click', function (e) { libraryBrowser.showLayoutMenu(e.target, self.getCurrentViewStyle(), 'Banner,List,Poster,PosterCard,Thumb,ThumbCard'.split(',')); }); btnSelectView.addEventListener('layoutchange', function (e) { - var viewStyle = e.detail.viewStyle; + const viewStyle = e.detail.viewStyle; getPageData(tabContent).view = viewStyle; libraryBrowser.saveViewSetting(getSavedQueryKey(tabContent), viewStyle); getQuery(tabContent).StartIndex = 0; @@ -290,5 +300,6 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', ' }; self.destroy = function () {}; - }; -}); + } + +/* eslint-enable indent */ From 91fc196b78a6192c9de361d05a8dd43c3732444b Mon Sep 17 00:00:00 2001 From: Cameron Date: Sun, 12 Jul 2020 15:26:49 +0100 Subject: [PATCH 091/244] migration of tvstudios to ES6 module --- package.json | 1 + src/controllers/shows/tvstudios.js | 32 ++++++++++++++++++------------ 2 files changed, 20 insertions(+), 13 deletions(-) diff --git a/package.json b/package.json index 173d56bfc4..59eb94ebde 100644 --- a/package.json +++ b/package.json @@ -142,6 +142,7 @@ "src/controllers/shows/tvlatest.js", "src/controllers/shows/tvrecommended.js", "src/controllers/shows/tvshows.js", + "src/controllers/shows/tvstudios.js", "src/plugins/bookPlayer/plugin.js", "src/plugins/bookPlayer/tableOfContents.js", "src/plugins/photoPlayer/plugin.js", diff --git a/src/controllers/shows/tvstudios.js b/src/controllers/shows/tvstudios.js index 1051bfa10b..ba7fdfaf78 100644 --- a/src/controllers/shows/tvstudios.js +++ b/src/controllers/shows/tvstudios.js @@ -1,9 +1,13 @@ -define(['loading', 'libraryBrowser', 'cardBuilder', 'apphost'], function (loading, libraryBrowser, cardBuilder, appHost) { - 'use strict'; +import loading from 'loading'; +import libraryBrowser from 'libraryBrowser'; +import cardBuilder from 'cardBuilder'; +import appHost from 'apphost'; + +/* eslint-disable indent */ function getQuery(params) { - var key = getSavedQueryKey(); - var pageData = data[key]; + const key = getSavedQueryKey(); + let pageData = data[key]; if (!pageData) { pageData = data[key] = { @@ -27,14 +31,14 @@ define(['loading', 'libraryBrowser', 'cardBuilder', 'apphost'], function (loadin } function getPromise(context, params) { - var query = getQuery(params); + const query = getQuery(params); loading.show(); return ApiClient.getStudios(ApiClient.getCurrentUserId(), query); } function reloadItems(context, params, promise) { promise.then(function (result) { - var elem = context.querySelector('#items'); + const elem = context.querySelector('#items'); cardBuilder.buildCards(result.Items, { itemsContainer: elem, shape: 'backdrop', @@ -47,16 +51,17 @@ define(['loading', 'libraryBrowser', 'cardBuilder', 'apphost'], function (loadin }); loading.hide(); - require(['autoFocuser'], function (autoFocuser) { + import('autoFocuser').then(({default: autoFocuser}) => { autoFocuser.autoFocus(context); }); }); } - var data = {}; - return function (view, params, tabContent) { - var promise; - var self = this; + const data = {}; + + export default function (view, params, tabContent) { + let promise; + const self = this; self.preRender = function () { promise = getPromise(view, params); @@ -65,5 +70,6 @@ define(['loading', 'libraryBrowser', 'cardBuilder', 'apphost'], function (loadin self.renderTab = function () { reloadItems(tabContent, params, promise); }; - }; -}); + } + +/* eslint-enable indent */ From eec81ac54d5a8b9b26c8587419c6c15b424a75b6 Mon Sep 17 00:00:00 2001 From: Cameron Date: Sun, 12 Jul 2020 15:27:05 +0100 Subject: [PATCH 092/244] Migration of tvupcomming to ES6 module --- package.json | 1 + src/controllers/shows/tvupcoming.js | 57 +++++++++++++++++------------ 2 files changed, 34 insertions(+), 24 deletions(-) diff --git a/package.json b/package.json index 59eb94ebde..09e7b1e064 100644 --- a/package.json +++ b/package.json @@ -143,6 +143,7 @@ "src/controllers/shows/tvrecommended.js", "src/controllers/shows/tvshows.js", "src/controllers/shows/tvstudios.js", + "src/controllers/shows/tvupcoming.js", "src/plugins/bookPlayer/plugin.js", "src/plugins/bookPlayer/tableOfContents.js", "src/plugins/photoPlayer/plugin.js", diff --git a/src/controllers/shows/tvupcoming.js b/src/controllers/shows/tvupcoming.js index d57a5ae3cd..a2016279b8 100644 --- a/src/controllers/shows/tvupcoming.js +++ b/src/controllers/shows/tvupcoming.js @@ -1,9 +1,19 @@ -define(['layoutManager', 'loading', 'datetime', 'libraryBrowser', 'cardBuilder', 'apphost', 'imageLoader', 'globalize', 'scrollStyles', 'emby-itemscontainer'], function (layoutManager, loading, datetime, libraryBrowser, cardBuilder, appHost, imageLoader, globalize) { - 'use strict'; +import layoutManager from 'layoutManager'; +import loading from 'loading'; +import datetime from 'datetime'; +import libraryBrowser from 'libraryBrowser'; +import cardBuilder from 'cardBuilder'; +import appHost from 'apphost'; +import imageLoader from 'imageLoader'; +import globalize from 'globalize'; +import 'scrollStyles'; +import 'emby-itemscontainer'; + +/* eslint-disable indent */ function getUpcomingPromise(context, params) { loading.show(); - var query = { + const query = { Limit: 48, Fields: 'AirTime,UserData', UserId: ApiClient.getCurrentUserId(), @@ -17,7 +27,7 @@ define(['layoutManager', 'loading', 'datetime', 'libraryBrowser', 'cardBuilder', function loadUpcoming(context, params, promise) { promise.then(function (result) { - var items = result.Items; + const items = result.Items; if (items.length) { context.querySelector('.noItemsMessage').style.display = 'none'; @@ -39,19 +49,17 @@ define(['layoutManager', 'loading', 'datetime', 'libraryBrowser', 'cardBuilder', } function renderUpcoming(elem, items) { - var i; - var length; - var groups = []; - var currentGroupName = ''; - var currentGroup = []; + const groups = []; + let currentGroupName = ''; + let currentGroup = []; - for (i = 0, length = items.length; i < length; i++) { - var item = items[i]; - var dateText = ''; + for (let i = 0, length = items.length; i < length; i++) { + const item = items[i]; + let dateText = ''; if (item.PremiereDate) { try { - var premiereDate = datetime.parseISO8601Date(item.PremiereDate, true); + const premiereDate = datetime.parseISO8601Date(item.PremiereDate, true); dateText = datetime.isRelativeDay(premiereDate, -1) ? globalize.translate('Yesterday') : datetime.toLocaleDateString(premiereDate, { weekday: 'long', month: 'short', @@ -77,17 +85,17 @@ define(['layoutManager', 'loading', 'datetime', 'libraryBrowser', 'cardBuilder', } } - var html = ''; + let html = ''; - for (i = 0, length = groups.length; i < length; i++) { - var group = groups[i]; + for (let i = 0, length = groups.length; i < length; i++) { + const group = groups[i]; html += '
'; html += '

' + group.name + '

'; - var allowBottomPadding = true; + let allowBottomPadding = true; if (enableScrollX()) { allowBottomPadding = false; - var scrollXClass = 'scrollX hiddenScrollX'; + let scrollXClass = 'scrollX hiddenScrollX'; if (layoutManager.tv) { scrollXClass += ' smoothScrollX'; @@ -98,7 +106,7 @@ define(['layoutManager', 'loading', 'datetime', 'libraryBrowser', 'cardBuilder', html += '
'; } - var supportsImageAnalysis = appHost.supports('imageanalysis'); + let supportsImageAnalysis = appHost.supports('imageanalysis'); supportsImageAnalysis = false; html += cardBuilder.getCardsHtml({ items: group.items, @@ -124,9 +132,9 @@ define(['layoutManager', 'loading', 'datetime', 'libraryBrowser', 'cardBuilder', imageLoader.lazyChildren(elem); } - return function (view, params, tabContent) { - var upcomingPromise; - var self = this; + export default function (view, params, tabContent) { + let upcomingPromise; + const self = this; self.preRender = function () { upcomingPromise = getUpcomingPromise(view, params); @@ -135,5 +143,6 @@ define(['layoutManager', 'loading', 'datetime', 'libraryBrowser', 'cardBuilder', self.renderTab = function () { loadUpcoming(tabContent, params, upcomingPromise); }; - }; -}); + } + +/* eslint-enable indent */ From 1c2399c70e2aab9bae1365f3589cd2e8998f96f7 Mon Sep 17 00:00:00 2001 From: Cameron Date: Tue, 14 Jul 2020 13:50:37 +0100 Subject: [PATCH 093/244] Migration of appFooter and homesections to ES6 modules --- package.json | 7 +- src/components/appFooter/appFooter.js | 30 +-- src/components/homesections/homesections.js | 192 +++++++++++--------- 3 files changed, 125 insertions(+), 104 deletions(-) diff --git a/package.json b/package.json index 81c627f085..629d7c7329 100644 --- a/package.json +++ b/package.json @@ -93,16 +93,19 @@ "src/components/accessSchedule/accessSchedule.js", "src/components/actionSheet/actionSheet.js", "src/components/alphaPicker/alphaPicker.js", + "src/components/appFooter/appFooter.js", "src/components/autoFocuser.js", "src/components/cardbuilder/cardBuilder.js", "src/components/cardbuilder/chaptercardbuilder.js", "src/components/cardbuilder/peoplecardbuilder.js", - "src/components/directorybrowser/directorybrowser.js", + "src/components/channelMapper/channelMapper.js", "src/components/collectionEditor/collectionEditor.js", "src/components/dialog/dialog.js", + "src/components/directorybrowser/directorybrowser.js", "src/components/dialogHelper/dialogHelper.js", - "src/components/channelMapper/channelMapper.js", + "src/components/homesections/homesections.js", "src/components/images/imageLoader.js", + "", "src/components/imageUploader/imageUploader.js", "src/components/indicators/indicators.js", "src/components/itemidentifier/itemidentifier.js", diff --git a/src/components/appFooter/appFooter.js b/src/components/appFooter/appFooter.js index 033a0b008d..427d3b8019 100644 --- a/src/components/appFooter/appFooter.js +++ b/src/components/appFooter/appFooter.js @@ -1,17 +1,18 @@ -define(['browser', 'css!./appFooter'], function (browser) { - 'use strict'; +import browser from 'browser'; +import 'css!./appFooter'; - function render(options) { - var elem = document.createElement('div'); - elem.classList.add('appfooter'); +function render(options) { + const elem = document.createElement('div'); + elem.classList.add('appfooter'); - document.body.appendChild(elem); + document.body.appendChild(elem); - return elem; - } + return elem; +} - function appFooter(options) { - var self = this; +class appFooter { + constructor(options) { + const self = this; self.element = render(options); self.add = function (elem) { @@ -26,12 +27,11 @@ define(['browser', 'css!./appFooter'], function (browser) { } }; } - - appFooter.prototype.destroy = function () { + destroy() { var self = this; self.element = null; - }; + } +} - return appFooter; -}); +export default new appFooter; diff --git a/src/components/homesections/homesections.js b/src/components/homesections/homesections.js index bba4b9db1b..bae24a0eb0 100644 --- a/src/components/homesections/homesections.js +++ b/src/components/homesections/homesections.js @@ -1,7 +1,24 @@ -define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'layoutManager', 'imageLoader', 'globalize', 'itemShortcuts', 'itemHelper', 'appRouter', 'scripts/imagehelper', 'paper-icon-button-light', 'emby-itemscontainer', 'emby-scroller', 'emby-button', 'css!./homesections'], function (connectionManager, cardBuilder, appSettings, dom, appHost, layoutManager, imageLoader, globalize, itemShortcuts, itemHelper, appRouter, imageHelper) { - 'use strict'; +import connectionManager from 'connectionManager'; +import cardBuilder from 'cardBuilder'; +import appSettings from 'appSettings'; +import dom from 'dom'; +import appHost from 'apphost'; +import layoutManager from 'layoutManager'; +import imageLoader from 'imageLoader'; +import globalize from 'globalize'; +import itemShortcuts from 'itemShortcuts'; +import itemHelper from 'itemHelper'; +import appRouter from 'appRouter'; +import imageHelper from 'scripts/imagehelper'; +import 'paper-icon-button-light'; +import 'emby-itemscontainer'; +import 'emby-scroller'; +import 'emby-button'; +import 'css!./homesections'; - function getDefaultSection(index) { +/* eslint-disable indent */ + + export function getDefaultSection(index) { switch (index) { case 0: return 'smalllibrarytiles'; @@ -23,9 +40,9 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la } function getAllSectionsToShow(userSettings, sectionCount) { - var sections = []; - for (var i = 0, length = sectionCount; i < length; i++) { - var section = userSettings.get('homesection' + i) || getDefaultSection(i); + const sections = []; + for (let i = 0, length = sectionCount; i < length; i++) { + let section = userSettings.get('homesection' + i) || getDefaultSection(i); if (section === 'folders') { section = getDefaultSection(0); } @@ -36,22 +53,22 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la return sections; } - function loadSections(elem, apiClient, user, userSettings) { + export function loadSections(elem, apiClient, user, userSettings) { return getUserViews(apiClient, user.Id).then(function (userViews) { - var html = ''; + let html = ''; if (userViews.length) { - var sectionCount = 7; - for (var i = 0; i < sectionCount; i++) { + const sectionCount = 7; + for (let i = 0; i < sectionCount; i++) { html += '
'; } elem.innerHTML = html; elem.classList.add('homeSectionsContainer'); - var promises = []; - var sections = getAllSectionsToShow(userSettings, sectionCount); - for (var i = 0; i < sections.length; i++) { + const promises = []; + const sections = getAllSectionsToShow(userSettings, sectionCount); + for (let i = 0; i < sections.length; i++) { promises.push(loadSection(elem, apiClient, user, userSettings, userViews, sections, i)); } @@ -62,7 +79,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la }); }); } else { - var noLibDescription; + let noLibDescription; if (user['Policy'] && user['Policy']['IsAdministrator']) { noLibDescription = globalize.translate('NoCreatedLibraries', '
', ''); } else { @@ -75,7 +92,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la html += '
'; elem.innerHTML = html; - var createNowLink = elem.querySelector('#button-createLibrary'); + const createNowLink = elem.querySelector('#button-createLibrary'); if (createNowLink) { createNowLink.addEventListener('click', function () { Dashboard.navigate('library.html'); @@ -85,9 +102,9 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la }); } - function destroySections(elem) { - var elems = elem.querySelectorAll('.itemsContainer'); - for (var i = 0; i < elems.length; i++) { + export function destroySections(elem) { + const elems = elem.querySelectorAll('.itemsContainer'); + for (let i = 0; i < elems.length; i++) { elems[i].fetchData = null; elems[i].parentContainer = null; elems[i].getItemsHtml = null; @@ -96,24 +113,22 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la elem.innerHTML = ''; } - function pause(elem) { - var elems = elem.querySelectorAll('.itemsContainer'); - for (var i = 0; i < elems.length; i++) { + export function pause(elem) { + const elems = elem.querySelectorAll('.itemsContainer'); + for (let i = 0; i < elems.length; i++) { elems[i].pause(); } } - function resume(elem, options) { - var elems = elem.querySelectorAll('.itemsContainer'); - var i; - var length; - var promises = []; + export function resume(elem, options) { + const elems = elem.querySelectorAll('.itemsContainer'); + const promises = []; - for (i = 0, length = elems.length; i < length; i++) { + for (let i = 0, length = elems.length; i < length; i++) { promises.push(elems[i].resume(options)); } - var promise = Promise.all(promises); + const promise = Promise.all(promises); if (!options || options.returnPromise !== false) { return promise; } @@ -121,10 +136,10 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la function loadSection(page, apiClient, user, userSettings, userViews, allSections, index) { - var section = allSections[index]; - var userId = user.Id; + const section = allSections[index]; + const userId = user.Id; - var elem = page.querySelector('.section' + index); + const elem = page.querySelector('.section' + index); if (section === 'latestmedia') { loadRecentlyAdded(elem, apiClient, user, userViews); @@ -172,7 +187,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la } function getLibraryButtonsHtml(items) { - var html = ''; + let html = ''; html += '
'; html += '

' + globalize.translate('HeaderMyMedia') + '

'; @@ -180,9 +195,9 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la html += '
'; // library card background images - for (var i = 0, length = items.length; i < length; i++) { - var item = items[i]; - var icon = imageHelper.getLibraryIcon(item.CollectionType); + for (let i = 0, length = items.length; i < length; i++) { + const item = items[i]; + const icon = imageHelper.getLibraryIcon(item.CollectionType); html += '' + item.Name + ''; } @@ -194,7 +209,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la function loadlibraryButtons(elem, apiClient, user, userSettings, userViews) { elem.classList.remove('verticalSection'); - var html = getLibraryButtonsHtml(userViews); + const html = getLibraryButtonsHtml(userViews); elem.innerHTML = html; imageLoader.lazyChildren(elem); @@ -210,8 +225,8 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la function getFetchLatestItemsFn(serverId, parentId, collectionType) { return function () { - var apiClient = connectionManager.getApiClient(serverId); - var limit = 16; + const apiClient = connectionManager.getApiClient(serverId); + let limit = 16; if (enableScrollX()) { if (collectionType === 'music') { @@ -227,7 +242,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la } } - var options = { + const options = { Limit: limit, Fields: 'PrimaryImageAspectRatio,BasicSyncInfo,Path', ImageTypeLimit: 1, @@ -241,8 +256,8 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la function getLatestItemsHtmlFn(itemType, viewType) { return function (items) { - var cardLayout = false; - var shape; + const cardLayout = false; + let shape; if (itemType === 'Channel' || viewType === 'movies' || viewType === 'books' || viewType === 'tvshows') { shape = getPortraitShape(); } else if (viewType === 'music' || viewType === 'homevideos') { @@ -272,7 +287,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la } function renderLatestSection(elem, apiClient, user, parent) { - var html = ''; + let html = ''; html += '
'; if (!layoutManager.tv) { @@ -303,7 +318,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la elem.innerHTML = html; - var itemsContainer = elem.querySelector('.itemsContainer'); + const itemsContainer = elem.querySelector('.itemsContainer'); itemsContainer.fetchData = getFetchLatestItemsFn(apiClient.serverId(), parent.Id, parent.CollectionType); itemsContainer.getItemsHtml = getLatestItemsHtmlFn(parent.Type, parent.CollectionType); itemsContainer.parentContainer = elem; @@ -311,10 +326,10 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la function loadRecentlyAdded(elem, apiClient, user, userViews) { elem.classList.remove('verticalSection'); - var excludeViewTypes = ['playlists', 'livetv', 'boxsets', 'channels']; + const excludeViewTypes = ['playlists', 'livetv', 'boxsets', 'channels']; - for (var i = 0, length = userViews.length; i < length; i++) { - var item = userViews[i]; + for (let i = 0, length = userViews.length; i < length; i++) { + const item = userViews[i]; if (user.Configuration.LatestItemsExcludes.indexOf(item.Id) !== -1) { continue; } @@ -323,7 +338,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la continue; } - var frag = document.createElement('div'); + const frag = document.createElement('div'); frag.classList.add('verticalSection'); frag.classList.add('hide'); elem.appendChild(frag); @@ -334,12 +349,14 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la function getRequirePromise(deps) { return new Promise(function (resolve, reject) { - require(deps, resolve); + import(deps).then(() => { + return resolve; + }); }); } - function loadLibraryTiles(elem, apiClient, user, userSettings, shape, userViews, allSections) { - var html = ''; + export function loadLibraryTiles(elem, apiCdflient, user, userSettings, shape, userViews, allSections) { + let html = ''; if (userViews.length) { html += '

' + globalize.translate('HeaderMyMedia') + '

'; if (enableScrollX()) { @@ -372,10 +389,10 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la function getContinueWatchingFetchFn(serverId) { return function () { - var apiClient = connectionManager.getApiClient(serverId); - var screenWidth = dom.getWindowSize().innerWidth; + const apiClient = connectionManager.getApiClient(serverId); + const screenWidth = dom.getWindowSize().innerWidth; - var limit; + let limit; if (enableScrollX()) { limit = 12; } else { @@ -383,7 +400,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la limit = Math.min(limit, 5); } - var options = { + const options = { Limit: limit, Recursive: true, Fields: 'PrimaryImageAspectRatio,BasicSyncInfo', @@ -398,7 +415,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la } function getContinueWatchingItemsHtml(items) { - var cardLayout = false; + const cardLayout = false; return cardBuilder.getCardsHtml({ items: items, preferThumb: true, @@ -419,7 +436,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la } function loadResumeVideo(elem, apiClient, userId) { - var html = ''; + let html = ''; html += '

' + globalize.translate('HeaderContinueWatching') + '

'; if (enableScrollX()) { @@ -437,7 +454,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la elem.classList.add('hide'); elem.innerHTML = html; - var itemsContainer = elem.querySelector('.itemsContainer'); + const itemsContainer = elem.querySelector('.itemsContainer'); itemsContainer.fetchData = getContinueWatchingFetchFn(apiClient.serverId()); itemsContainer.getItemsHtml = getContinueWatchingItemsHtml; itemsContainer.parentContainer = elem; @@ -445,10 +462,10 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la function getContinueListeningFetchFn(serverId) { return function () { - var apiClient = connectionManager.getApiClient(serverId); - var screenWidth = dom.getWindowSize().innerWidth; + const apiClient = connectionManager.getApiClient(serverId); + const screenWidth = dom.getWindowSize().innerWidth; - var limit; + let limit; if (enableScrollX()) { limit = 12; } else { @@ -456,7 +473,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la limit = Math.min(limit, 5); } - var options = { + const options = { Limit: limit, Recursive: true, Fields: 'PrimaryImageAspectRatio,BasicSyncInfo', @@ -471,7 +488,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la } function getContinueListeningItemsHtml(items) { - var cardLayout = false; + const cardLayout = false; return cardBuilder.getCardsHtml({ items: items, preferThumb: true, @@ -492,7 +509,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la } function loadResumeAudio(elem, apiClient, userId) { - var html = ''; + let html = ''; html += '

' + globalize.translate('HeaderContinueWatching') + '

'; if (enableScrollX()) { @@ -510,7 +527,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la elem.classList.add('hide'); elem.innerHTML = html; - var itemsContainer = elem.querySelector('.itemsContainer'); + const itemsContainer = elem.querySelector('.itemsContainer'); itemsContainer.fetchData = getContinueListeningFetchFn(apiClient.serverId()); itemsContainer.getItemsHtml = getContinueListeningItemsHtml; itemsContainer.parentContainer = elem; @@ -518,7 +535,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la function getOnNowFetchFn(serverId) { return function () { - var apiClient = connectionManager.getApiClient(serverId); + const apiClient = connectionManager.getApiClient(serverId); return apiClient.getLiveTvRecommendedPrograms({ userId: apiClient.getCurrentUserId(), IsAiring: true, @@ -532,7 +549,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la } function getOnNowItemsHtml(items) { - var cardLayout = false; + const cardLayout = false; return cardBuilder.getCardsHtml({ items: items, preferThumb: 'auto', @@ -559,7 +576,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la return Promise.resolve(); } - var userId = user.Id; + const userId = user.Id; return apiClient.getLiveTvRecommendedPrograms({ userId: apiClient.getCurrentUserId(), IsAiring: true, @@ -569,7 +586,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la EnableTotalRecordCount: false, Fields: 'ChannelInfo,PrimaryImageAspectRatio' }).then(function (result) { - var html = ''; + let html = ''; if (result.Items.length) { elem.classList.remove('padded-left'); elem.classList.remove('padded-right'); @@ -654,7 +671,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la elem.innerHTML = html; - var itemsContainer = elem.querySelector('.itemsContainer'); + const itemsContainer = elem.querySelector('.itemsContainer'); itemsContainer.parentContainer = elem; itemsContainer.fetchData = getOnNowFetchFn(apiClient.serverId()); itemsContainer.getItemsHtml = getOnNowItemsHtml; @@ -664,7 +681,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la function getNextUpFetchFn(serverId) { return function () { - var apiClient = connectionManager.getApiClient(serverId); + const apiClient = connectionManager.getApiClient(serverId); return apiClient.getNextUpEpisodes({ Limit: enableScrollX() ? 24 : 15, Fields: 'PrimaryImageAspectRatio,SeriesInfo,DateCreated,BasicSyncInfo,Path', @@ -677,7 +694,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la } function getNextUpItemsHtml(items) { - var cardLayout = false; + const cardLayout = false; return cardBuilder.getCardsHtml({ items: items, preferThumb: true, @@ -695,7 +712,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la } function loadNextUp(elem, apiClient, userId) { - var html = ''; + let html = ''; html += '
'; if (!layoutManager.tv) { @@ -727,7 +744,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la elem.classList.add('hide'); elem.innerHTML = html; - var itemsContainer = elem.querySelector('.itemsContainer'); + const itemsContainer = elem.querySelector('.itemsContainer'); itemsContainer.fetchData = getNextUpFetchFn(apiClient.serverId()); itemsContainer.getItemsHtml = getNextUpItemsHtml; itemsContainer.parentContainer = elem; @@ -735,7 +752,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la function getLatestRecordingsFetchFn(serverId, activeRecordingsOnly) { return function () { - var apiClient = connectionManager.getApiClient(serverId); + const apiClient = connectionManager.getApiClient(serverId); return apiClient.getLiveTvRecordings({ userId: apiClient.getCurrentUserId(), Limit: enableScrollX() ? 12 : 5, @@ -749,7 +766,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la function getLatestRecordingItemsHtml(activeRecordingsOnly) { return function (items) { - var cardLayout = false; + const cardLayout = false; return cardBuilder.getCardsHtml({ items: items, shape: enableScrollX() ? 'autooverflow' : 'auto', @@ -774,11 +791,11 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la } function loadLatestLiveTvRecordings(elem, activeRecordingsOnly, apiClient, userId) { - var title = activeRecordingsOnly ? + const title = activeRecordingsOnly ? globalize.translate('HeaderActiveRecordings') : globalize.translate('HeaderLatestRecordings'); - var html = ''; + let html = ''; html += '
'; html += '

' + title + '

'; @@ -799,18 +816,19 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la elem.classList.add('hide'); elem.innerHTML = html; - var itemsContainer = elem.querySelector('.itemsContainer'); + const itemsContainer = elem.querySelector('.itemsContainer'); itemsContainer.fetchData = getLatestRecordingsFetchFn(apiClient.serverId(), activeRecordingsOnly); itemsContainer.getItemsHtml = getLatestRecordingItemsHtml(activeRecordingsOnly); itemsContainer.parentContainer = elem; } - return { - loadLibraryTiles: loadLibraryTiles, - getDefaultSection: getDefaultSection, - loadSections: loadSections, - destroySections: destroySections, - pause: pause, - resume: resume - }; -}); +export default { + loadLibraryTiles: loadLibraryTiles, + getDefaultSection: getDefaultSection, + loadSections: loadSections, + destroySections: destroySections, + pause: pause, + resume: resume +}; + +/* eslint-enable indent */ From ef74521028bef3d2d000c5c1b14b560c7a6a02b1 Mon Sep 17 00:00:00 2001 From: Cameron Date: Tue, 14 Jul 2020 13:57:56 +0100 Subject: [PATCH 094/244] fix lint --- src/components/itemContextMenu.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/components/itemContextMenu.js b/src/components/itemContextMenu.js index b66e8a0703..96a5cb71d7 100644 --- a/src/components/itemContextMenu.js +++ b/src/components/itemContextMenu.js @@ -356,7 +356,7 @@ import actionsheet from 'actionsheet'; getResolveFunction(getResolveFunction(resolve, id), id)(); }); break; - case 'copy-stream': + case 'copy-stream': { const downloadHref = apiClient.getItemDownloadUrl(itemId); const textAreaCopy = function () { let textArea = document.createElement('textarea'); @@ -390,6 +390,7 @@ import actionsheet from 'actionsheet'; } getResolveFunction(resolve, id)(); break; + } case 'editsubtitles': import('subtitleEditor').then(({default: subtitleEditor}) => { subtitleEditor.show(itemId, serverId).then(getResolveFunction(resolve, id, true), getResolveFunction(resolve, id)); From 9e61810bb10d44fb7aed3b77f20506842c610292 Mon Sep 17 00:00:00 2001 From: Cameron Date: Sun, 12 Jul 2020 15:28:02 +0100 Subject: [PATCH 095/244] remove console log --- src/controllers/shows/tvlatest.js | 1 - src/controllers/shows/tvrecommended.js | 1 - 2 files changed, 2 deletions(-) diff --git a/src/controllers/shows/tvlatest.js b/src/controllers/shows/tvlatest.js index c9860e17de..c08f3d5a15 100644 --- a/src/controllers/shows/tvlatest.js +++ b/src/controllers/shows/tvlatest.js @@ -53,7 +53,6 @@ import imageLoader from 'imageLoader'; } export default function (view, params, tabContent) { - console.log(tabContent) const self = this; let latestPromise; diff --git a/src/controllers/shows/tvrecommended.js b/src/controllers/shows/tvrecommended.js index d32b47840c..6853f11d65 100644 --- a/src/controllers/shows/tvrecommended.js +++ b/src/controllers/shows/tvrecommended.js @@ -223,7 +223,6 @@ import 'emby-button'; } import(depends).then(({default: controllerFactory}) => { - console.log('using controller factory from ' + depends) let tabContent; if (index === 1) { From a8a85df303c88aa5d07ca06734ecf9d2404960f7 Mon Sep 17 00:00:00 2001 From: dkanada Date: Wed, 15 Jul 2020 06:23:36 +0900 Subject: [PATCH 096/244] fix some minor console issues --- src/components/playback/playbackmanager.js | 1 - src/components/syncPlay/groupSelectionMenu.js | 2 +- src/components/syncPlay/syncPlayManager.js | 4 ++++ 3 files changed, 5 insertions(+), 2 deletions(-) diff --git a/src/components/playback/playbackmanager.js b/src/components/playback/playbackmanager.js index 797fc39bd2..cb1a91fb75 100644 --- a/src/components/playback/playbackmanager.js +++ b/src/components/playback/playbackmanager.js @@ -72,7 +72,6 @@ define(['events', 'datetime', 'appSettings', 'itemHelper', 'pluginManager', 'pla const now = (new Date).getTime(); if (method !== reportPlaybackLastMethod || now - (reportPlaybackLastTime || 0) >= reportPlaybackLogDelay) { - console.debug(method + '-' + JSON.stringify(info)); reportPlaybackLastMethod = method; reportPlaybackLastTime = now; } diff --git a/src/components/syncPlay/groupSelectionMenu.js b/src/components/syncPlay/groupSelectionMenu.js index 3c77a67ea5..360aa0b0c2 100644 --- a/src/components/syncPlay/groupSelectionMenu.js +++ b/src/components/syncPlay/groupSelectionMenu.js @@ -84,7 +84,7 @@ function showNewJoinGroupSelection (button, user, apiClient) { actionsheet.show(menuOptions).then(function (id) { if (id == 'new-group') { apiClient.createSyncPlayGroup(); - } else { + } else if (id) { apiClient.joinSyncPlayGroup({ GroupId: id, PlayingItemId: playingItemId diff --git a/src/components/syncPlay/syncPlayManager.js b/src/components/syncPlay/syncPlayManager.js index c847fbaede..c8660b2bc4 100644 --- a/src/components/syncPlay/syncPlayManager.js +++ b/src/components/syncPlay/syncPlayManager.js @@ -212,6 +212,7 @@ class SyncPlayManager { if (!this.lastPlaybackWaiting) { this.lastPlaybackWaiting = new Date(); } + events.trigger(this, 'waiting'); } @@ -288,6 +289,7 @@ class SyncPlayManager { player.setPlaybackRate(this.localPlayerPlaybackRate); this.localPlayerPlaybackRate = 1.0; } + this.currentPlayer = null; this.playbackRateSupported = false; } @@ -433,6 +435,7 @@ class SyncPlayManager { }); return; } + // Get playing item id let playingItemId; try { @@ -619,6 +622,7 @@ class SyncPlayManager { if (this.currentPlayer) { this.currentPlayer.setPlaybackRate(1); } + this.clearSyncIcon(); } From 4bde73b96eb0674562868086804bc9ce454e26de Mon Sep 17 00:00:00 2001 From: Cameron Date: Wed, 15 Jul 2020 09:29:15 +0100 Subject: [PATCH 097/244] Update variable Declerations --- src/controllers/auth/addserver.js | 9 ++-- src/controllers/auth/forgotpassword.js | 4 +- src/controllers/auth/forgotpasswordpin.js | 6 +-- src/controllers/auth/login.js | 54 +++++++++++------------ src/controllers/auth/selectserver.js | 34 +++++++------- 5 files changed, 54 insertions(+), 53 deletions(-) diff --git a/src/controllers/auth/addserver.js b/src/controllers/auth/addserver.js index 3c0fb3be04..1129283246 100644 --- a/src/controllers/auth/addserver.js +++ b/src/controllers/auth/addserver.js @@ -9,11 +9,12 @@ import 'emby-button'; function handleConnectionResult(page, result) { loading.hide(); switch (result.State) { - case 'SignedIn': - var apiClient = result.ApiClient; + case 'SignedIn': { + const apiClient = result.ApiClient; Dashboard.onServerChanged(apiClient.getCurrentUserId(), apiClient.accessToken(), apiClient); Dashboard.navigate('home.html'); break; + } case 'ServerSignIn': Dashboard.navigate('login.html?serverid=' + result.Servers[0].Id, false, 'none'); break; @@ -35,7 +36,7 @@ import 'emby-button'; function submitServer(page) { loading.show(); - var host = page.querySelector('#txtServerHost').value; + const host = page.querySelector('#txtServerHost').value; ConnectionManager.connectToAddress(host, { enableAutoLogin: appSettings.enableAutoLogin() }).then(function(result) { @@ -66,6 +67,6 @@ import 'emby-button'; appRouter.back(); }); } - }; + } /* eslint-enable indent */ diff --git a/src/controllers/auth/forgotpassword.js b/src/controllers/auth/forgotpassword.js index f9fd1c2bce..ace5a3ec15 100644 --- a/src/controllers/auth/forgotpassword.js +++ b/src/controllers/auth/forgotpassword.js @@ -18,7 +18,7 @@ import globalize from 'globalize'; } if ('PinCode' == result.Action) { - var msg = globalize.translate('MessageForgotPasswordFileCreated'); + let msg = globalize.translate('MessageForgotPasswordFileCreated'); msg += '
'; msg += '
'; msg += 'Enter PIN here to finish Password Reset
'; @@ -50,6 +50,6 @@ import globalize from 'globalize'; } view.querySelector('form').addEventListener('submit', onSubmit); - }; + } /* eslint-enable indent */ diff --git a/src/controllers/auth/forgotpasswordpin.js b/src/controllers/auth/forgotpasswordpin.js index d0b20f6884..a88e131eea 100644 --- a/src/controllers/auth/forgotpasswordpin.js +++ b/src/controllers/auth/forgotpasswordpin.js @@ -4,7 +4,7 @@ import globalize from 'globalize'; function processForgotPasswordResult(result) { if (result.Success) { - var msg = globalize.translate('MessagePasswordResetForUsers'); + let msg = globalize.translate('MessagePasswordResetForUsers'); msg += '
'; msg += '
'; msg += result.UsersReset.join('
'); @@ -38,6 +38,6 @@ import globalize from 'globalize'; } view.querySelector('form').addEventListener('submit', onSubmit); - }; + } -/* eslint-disable indent */ +/* eslint-enable indent */ diff --git a/src/controllers/auth/login.js b/src/controllers/auth/login.js index ead35d052a..fb16413ae7 100644 --- a/src/controllers/auth/login.js +++ b/src/controllers/auth/login.js @@ -11,14 +11,14 @@ import 'emby-checkbox'; /* eslint-disable indent */ - var enableFocusTransform = !browser.slow && !browser.edge; + const enableFocusTransform = !browser.slow && !browser.edge; function authenticateUserByName(page, apiClient, username, password) { loading.show(); apiClient.authenticateUserByName(username, password).then(function (result) { - var user = result.User; - var serverId = getParameterByName('serverid'); - var newUrl; + const user = result.User; + const serverId = getParameterByName('serverid'); + let newUrl; if (user.Policy.IsAdministrator && !serverId) { newUrl = 'dashboard.html'; @@ -68,23 +68,23 @@ import 'emby-checkbox'; } } - var metroColors = ['#6FBD45', '#4BB3DD', '#4164A5', '#E12026', '#800080', '#E1B222', '#008040', '#0094FF', '#FF00C7', '#FF870F', '#7F0037']; + const metroColors = ['#6FBD45', '#4BB3DD', '#4164A5', '#E12026', '#800080', '#E1B222', '#008040', '#0094FF', '#FF00C7', '#FF870F', '#7F0037']; function getRandomMetroColor() { - var index = Math.floor(Math.random() * (metroColors.length - 1)); + const index = Math.floor(Math.random() * (metroColors.length - 1)); return metroColors[index]; } function getMetroColor(str) { if (str) { - var character = String(str.substr(0, 1).charCodeAt()); - var sum = 0; + const character = String(str.substr(0, 1).charCodeAt()); + let sum = 0; - for (var i = 0; i < character.length; i++) { + for (let i = 0; i < character.length; i++) { sum += parseInt(character.charAt(i)); } - var index = String(sum).substr(-1); + const index = String(sum).substr(-1); return metroColors[index]; } @@ -92,13 +92,13 @@ import 'emby-checkbox'; } function loadUserList(context, apiClient, users) { - var html = ''; + let html = ''; - for (var i = 0; i < users.length; i++) { - var user = users[i]; + for (let i = 0; i < users.length; i++) { + const user = users[i]; // TODO move card creation code to Card component - var cssClass = 'card squareCard scalableCard squareCard-scalable'; + let cssClass = 'card squareCard scalableCard squareCard-scalable'; if (layoutManager.tv) { cssClass += ' show-focus'; @@ -108,13 +108,13 @@ import 'emby-checkbox'; } } - var cardBoxCssClass = 'cardBox cardBox-bottompadded'; + const cardBoxCssClass = 'cardBox cardBox-bottompadded'; html += '
'; return cardContainer; }).join(''); - var itemsContainer = view.querySelector('.servers'); + const itemsContainer = view.querySelector('.servers'); if (!items.length) { html = '

' + globalize.translate('MessageNoServersAvailable') + '

'; @@ -122,7 +122,7 @@ import 'emby-button'; enableAutoLogin: appSettings.enableAutoLogin() }).then(function (result) { loading.hide(); - var apiClient = result.ApiClient; + const apiClient = result.ApiClient; switch (result.State) { case 'SignedIn': @@ -157,7 +157,7 @@ import 'emby-button'; } function onServerClick(server) { - var menuItems = []; + const menuItems = []; menuItems.push({ name: globalize.translate('Connect'), id: 'connect' @@ -195,10 +195,10 @@ import 'emby-button'; connectionManager.getAvailableServers().then(onServersRetrieved); } - var servers; + let servers; updatePageStyle(view, params); view.addEventListener('viewshow', function (e) { - var isRestored = e.detail.isRestored; + const isRestored = e.detail.isRestored; appRouter.setTitle(null); if (!isRestored) { @@ -206,21 +206,21 @@ import 'emby-button'; } }); view.querySelector('.servers').addEventListener('click', function (e) { - var card = dom.parentWithClass(e.target, 'card'); + const card = dom.parentWithClass(e.target, 'card'); if (card) { - var url = card.getAttribute('data-url'); + const url = card.getAttribute('data-url'); if (url) { appRouter.show(url); } else { - var id = card.getAttribute('data-id'); + const id = card.getAttribute('data-id'); onServerClick(servers.filter(function (s) { return s.Id === id; })[0]); } } }); - }; + } /* eslint-enable indent */ From 9e2d2892654f2f019131533bcb8f0f2c96271b5e Mon Sep 17 00:00:00 2001 From: Cameron Date: Wed, 15 Jul 2020 11:41:59 +0100 Subject: [PATCH 098/244] Migration of emby-buttton, paper-icon-button-light, emby-collapse, emby-imput to ES6 modules --- package.json | 4 +++ src/elements/emby-button/emby-button.js | 23 ++++++++---- .../emby-button/paper-icon-button-light.js | 12 ++++--- src/elements/emby-collapse/emby-collapse.js | 35 +++++++++++-------- src/elements/emby-input/emby-input.js | 32 ++++++++++------- 5 files changed, 67 insertions(+), 39 deletions(-) diff --git a/package.json b/package.json index 51f1ae10d2..bc3847441a 100644 --- a/package.json +++ b/package.json @@ -147,6 +147,10 @@ "src/elements/emby-checkbox/emby-checkbox.js", "src/elements/emby-textarea/emby-textarea.js", "src/elements/emby-toggle/emby-toggle.js", + "src/elements/emby-button/emby-button.js", + "src/elements/emby-button/paper-icon-button-light.js", + "src/elements/emby-collapse/emby-collapse.js", + "src/elements/emby-input/emby-input.js", "src/plugins/bookPlayer/plugin.js", "src/plugins/bookPlayer/tableOfContents.js", "src/plugins/photoPlayer/plugin.js", diff --git a/src/elements/emby-button/emby-button.js b/src/elements/emby-button/emby-button.js index be52b1d512..4848f4751f 100644 --- a/src/elements/emby-button/emby-button.js +++ b/src/elements/emby-button/emby-button.js @@ -1,11 +1,19 @@ -define(['browser', 'dom', 'layoutManager', 'shell', 'appRouter', 'apphost', 'css!./emby-button', 'registerElement'], function (browser, dom, layoutManager, shell, appRouter, appHost) { - 'use strict'; +import browser from 'browser'; +import dom from 'dom'; +import layoutManager from 'layoutManager'; +import shell from 'shell'; +import appRouter from 'appRouter'; +import appHost from 'apphost'; +import 'css!./emby-button'; +import 'registerElement'; - var EmbyButtonPrototype = Object.create(HTMLButtonElement.prototype); - var EmbyLinkButtonPrototype = Object.create(HTMLAnchorElement.prototype); +/* eslint-disable indent */ + + const EmbyButtonPrototype = Object.create(HTMLButtonElement.prototype); + const EmbyLinkButtonPrototype = Object.create(HTMLAnchorElement.prototype); function onAnchorClick(e) { - var href = this.getAttribute('href') || ''; + const href = this.getAttribute('href') || ''; if (href !== '#') { if (this.getAttribute('target')) { if (!appHost.supports('targetblank')) { @@ -66,5 +74,6 @@ define(['browser', 'dom', 'layoutManager', 'shell', 'appRouter', 'apphost', 'css extends: 'a' }); - return EmbyButtonPrototype; -}); + export default EmbyButtonPrototype; + +/* eslint-enable indent */ diff --git a/src/elements/emby-button/paper-icon-button-light.js b/src/elements/emby-button/paper-icon-button-light.js index 7eda76baec..5226f13db6 100644 --- a/src/elements/emby-button/paper-icon-button-light.js +++ b/src/elements/emby-button/paper-icon-button-light.js @@ -1,7 +1,10 @@ -define(['layoutManager', 'css!./emby-button', 'registerElement'], function (layoutManager) { - 'use strict'; +import layoutManager from 'layoutManager'; +import 'css!./emby-button'; +import 'registerElement'; - var EmbyButtonPrototype = Object.create(HTMLButtonElement.prototype); +/* eslint-disable indent */ + + const EmbyButtonPrototype = Object.create(HTMLButtonElement.prototype); EmbyButtonPrototype.createdCallback = function () { this.classList.add('paper-icon-button-light'); @@ -15,4 +18,5 @@ define(['layoutManager', 'css!./emby-button', 'registerElement'], function (layo prototype: EmbyButtonPrototype, extends: 'button' }); -}); + +/* eslint-enable indent */ diff --git a/src/elements/emby-collapse/emby-collapse.js b/src/elements/emby-collapse/emby-collapse.js index 707e81a786..805e40afd9 100644 --- a/src/elements/emby-collapse/emby-collapse.js +++ b/src/elements/emby-collapse/emby-collapse.js @@ -1,18 +1,22 @@ -define(['browser', 'css!./emby-collapse', 'registerElement', 'emby-button'], function (browser) { - 'use strict'; +import browser from 'browser'; +import 'css!./emby-collapse'; +import 'registerElement'; +import 'emby-button'; - var EmbyButtonPrototype = Object.create(HTMLDivElement.prototype); +/* eslint-disable indent */ + + const EmbyButtonPrototype = Object.create(HTMLDivElement.prototype); function slideDownToShow(button, elem) { elem.classList.remove('hide'); elem.classList.add('expanded'); elem.style.height = 'auto'; - var height = elem.offsetHeight + 'px'; + const height = elem.offsetHeight + 'px'; elem.style.height = '0'; // trigger reflow - var newHeight = elem.offsetHeight; + const newHeight = elem.offsetHeight; elem.style.height = height; setTimeout(function () { @@ -24,7 +28,7 @@ define(['browser', 'css!./emby-collapse', 'registerElement', 'emby-button'], fun elem.style.height = 'auto'; }, 300); - var icon = button.querySelector('.material-icons'); + const icon = button.querySelector('.material-icons'); //icon.innerHTML = 'expand_less'; icon.classList.add('emby-collapse-expandIconExpanded'); } @@ -33,7 +37,7 @@ define(['browser', 'css!./emby-collapse', 'registerElement', 'emby-button'], fun elem.style.height = elem.offsetHeight + 'px'; // trigger reflow - var newHeight = elem.offsetHeight; + const newHeight = elem.offsetHeight; elem.classList.remove('expanded'); elem.style.height = '0'; @@ -46,15 +50,15 @@ define(['browser', 'css!./emby-collapse', 'registerElement', 'emby-button'], fun } }, 300); - var icon = button.querySelector('.material-icons'); + const icon = button.querySelector('.material-icons'); //icon.innerHTML = 'expand_more'; icon.classList.remove('emby-collapse-expandIconExpanded'); } function onButtonClick(e) { - var button = this; - var collapseContent = button.parentNode.querySelector('.collapseContent'); + const button = this; + const collapseContent = button.parentNode.querySelector('.collapseContent'); if (collapseContent.expanded) { collapseContent.expanded = false; @@ -73,18 +77,18 @@ define(['browser', 'css!./emby-collapse', 'registerElement', 'emby-button'], fun this.classList.add('emby-collapse'); - var collapseContent = this.querySelector('.collapseContent'); + const collapseContent = this.querySelector('.collapseContent'); if (collapseContent) { collapseContent.classList.add('hide'); } - var title = this.getAttribute('title'); + const title = this.getAttribute('title'); - var html = ''; + const html = ''; this.insertAdjacentHTML('afterbegin', html); - var button = this.querySelector('.emby-collapsible-button'); + const button = this.querySelector('.emby-collapsible-button'); button.addEventListener('click', onButtonClick); @@ -97,4 +101,5 @@ define(['browser', 'css!./emby-collapse', 'registerElement', 'emby-button'], fun prototype: EmbyButtonPrototype, extends: 'div' }); -}); + +/* eslint-enable indent */ diff --git a/src/elements/emby-input/emby-input.js b/src/elements/emby-input/emby-input.js index 1cef349bf0..f5c60ca92f 100644 --- a/src/elements/emby-input/emby-input.js +++ b/src/elements/emby-input/emby-input.js @@ -1,18 +1,23 @@ -define(['layoutManager', 'browser', 'dom', 'css!./emby-input', 'registerElement'], function (layoutManager, browser, dom) { - 'use strict'; +import layoutManager from 'layoutManager'; +import browser from 'browser'; +import dom from 'dom'; +import 'css!./emby-input'; +import 'registerElement'; - var EmbyInputPrototype = Object.create(HTMLInputElement.prototype); +/* eslint-disable indent */ - var inputId = 0; - var supportsFloatingLabel = false; + const EmbyInputPrototype = Object.create(HTMLInputElement.prototype); + + let inputId = 0; + let supportsFloatingLabel = false; if (Object.getOwnPropertyDescriptor && Object.defineProperty) { - var descriptor = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, 'value'); + const descriptor = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, 'value'); // descriptor returning null in webos if (descriptor && descriptor.configurable) { - var baseSetMethod = descriptor.set; + const baseSetMethod = descriptor.set; descriptor.set = function (value) { baseSetMethod.call(this, value); @@ -39,9 +44,9 @@ define(['layoutManager', 'browser', 'dom', 'css!./emby-input', 'registerElement' this.classList.add('emby-input'); - var parentNode = this.parentNode; - var document = this.ownerDocument; - var label = document.createElement('label'); + const parentNode = this.parentNode; + const document = this.ownerDocument; + const label = document.createElement('label'); label.innerHTML = this.getAttribute('label') || ''; label.classList.add('inputLabel'); label.classList.add('inputLabelUnfocused'); @@ -95,12 +100,12 @@ define(['layoutManager', 'browser', 'dom', 'css!./emby-input', 'registerElement' function onChange() { - var label = this.labelElement; + const label = this.labelElement; if (this.value) { label.classList.remove('inputLabel-float'); } else { - var instanceSupportsFloat = supportsFloatingLabel && this.type !== 'date' && this.type !== 'time'; + const instanceSupportsFloat = supportsFloatingLabel && this.type !== 'date' && this.type !== 'time'; if (instanceSupportsFloat) { label.classList.add('inputLabel-float'); @@ -121,4 +126,5 @@ define(['layoutManager', 'browser', 'dom', 'css!./emby-input', 'registerElement' prototype: EmbyInputPrototype, extends: 'input' }); -}); + +/* eslint-enable indent */ From 1200617639db7aac537ba514b8d5fcc0437efd84 Mon Sep 17 00:00:00 2001 From: Cameron Date: Wed, 15 Jul 2020 14:34:57 +0100 Subject: [PATCH 099/244] Migration of activitylog and datetime to ES6 modules --- package.json | 2 ++ src/components/activitylog.js | 29 +++++++++++++++------ src/controllers/dashboard/serveractivity.js | 2 +- src/scripts/datetime.js | 24 +++++++++-------- 4 files changed, 37 insertions(+), 20 deletions(-) diff --git a/package.json b/package.json index 51f1ae10d2..81d8b5f950 100644 --- a/package.json +++ b/package.json @@ -92,6 +92,7 @@ "test": [ "src/components/accessSchedule/accessSchedule.js", "src/components/actionSheet/actionSheet.js", + "src/components/activitylog.js", "src/components/alphaPicker/alphaPicker.js", "src/components/autoFocuser.js", "src/components/cardbuilder/cardBuilder.js", @@ -150,6 +151,7 @@ "src/plugins/bookPlayer/plugin.js", "src/plugins/bookPlayer/tableOfContents.js", "src/plugins/photoPlayer/plugin.js", + "src/scripts/datetime.js", "src/scripts/deleteHelper.js", "src/scripts/dfnshelper.js", "src/scripts/dom.js", diff --git a/src/components/activitylog.js b/src/components/activitylog.js index bbb0995063..b51fc6787a 100644 --- a/src/components/activitylog.js +++ b/src/components/activitylog.js @@ -1,5 +1,15 @@ -define(['events', 'globalize', 'dom', 'date-fns', 'dfnshelper', 'userSettings', 'serverNotifications', 'connectionManager', 'emby-button', 'listViewStyle'], function (events, globalize, dom, datefns, dfnshelper, userSettings, serverNotifications, connectionManager) { - 'use strict'; +import events from 'events'; +import globalize from 'globalize'; +import dom from 'dom'; +import * as datefns from 'date-fns'; +import dfnshelper from 'dfnshelper'; +import userSettings from 'userSettings'; +import serverNotifications from 'serverNotifications'; +import connectionManager from 'connectionManager'; +import 'emby-button'; +import 'listViewStyle'; + +/*eslint-disable indent */ function getEntryHtml(entry, apiClient) { var html = ''; @@ -125,7 +135,9 @@ define(['events', 'globalize', 'dom', 'date-fns', 'dfnshelper', 'userSettings', }); } - function ActivityLog(options) { +class ActivityLog { + constructor(options) { + console.log(options) this.options = options; var element = options.element; element.classList.add('activityLogListWidget'); @@ -137,8 +149,7 @@ define(['events', 'globalize', 'dom', 'date-fns', 'dfnshelper', 'userSettings', events.on(serverNotifications, 'ActivityLogEntry', onUpdate); apiClient.sendMessage('ActivityLogEntryStart', '0,1500'); } - - ActivityLog.prototype.destroy = function () { + destroy() { var options = this.options; if (options) { @@ -154,7 +165,9 @@ define(['events', 'globalize', 'dom', 'date-fns', 'dfnshelper', 'userSettings', this.items = null; this.options = null; - }; + } +} - return ActivityLog; -}); +export default ActivityLog; + +/*eslint-enable indent */ diff --git a/src/controllers/dashboard/serveractivity.js b/src/controllers/dashboard/serveractivity.js index c48a2903ae..a3ce91592f 100644 --- a/src/controllers/dashboard/serveractivity.js +++ b/src/controllers/dashboard/serveractivity.js @@ -14,7 +14,7 @@ define(['components/activitylog', 'globalize'], function (ActivityLog, globalize view.addEventListener('viewshow', function () { if (!activityLog) { - activityLog = new ActivityLog({ + activityLog = new ActivityLog.default({ serverId: ApiClient.serverId(), element: view.querySelector('.activityItems') }); diff --git a/src/scripts/datetime.js b/src/scripts/datetime.js index 34ff23fe63..6b7aa69996 100644 --- a/src/scripts/datetime.js +++ b/src/scripts/datetime.js @@ -1,7 +1,8 @@ -define(['globalize'], function (globalize) { - 'use strict'; +import globalize from 'globalize'; - function parseISO8601Date(s, toLocal) { +/*eslint-disable indent */ + + export function parseISO8601Date(s, toLocal) { // parenthese matches: // year month day hours minutes seconds @@ -58,7 +59,7 @@ define(['globalize'], function (globalize) { return new Date(ms); } - function getDisplayRunningTime(ticks) { + export function getDisplayRunningTime(ticks) { var ticksPerHour = 36000000000; var ticksPerMinute = 600000000; var ticksPerSecond = 10000000; @@ -118,7 +119,7 @@ define(['globalize'], function (globalize) { return list; } - function toLocaleString(date, options) { + export function toLocaleString(date, options) { if (!date) { throw new Error('date cannot be null'); @@ -138,7 +139,7 @@ define(['globalize'], function (globalize) { return date.toLocaleString(); } - function toLocaleDateString(date, options) { + export function toLocaleDateString(date, options) { if (!date) { throw new Error('date cannot be null'); @@ -172,7 +173,7 @@ define(['globalize'], function (globalize) { return date.toLocaleDateString(); } - function toLocaleTimeString(date, options) { + export function toLocaleTimeString(date, options) { if (!date) { throw new Error('date cannot be null'); @@ -192,7 +193,7 @@ define(['globalize'], function (globalize) { return date.toLocaleTimeString(); } - function getDisplayTime(date) { + export function getDisplayTime(date) { if (!date) { throw new Error('date cannot be null'); @@ -253,7 +254,7 @@ define(['globalize'], function (globalize) { return time; } - function isRelativeDay(date, offsetInDays) { + export function isRelativeDay(date, offsetInDays) { if (!date) { throw new Error('date cannot be null'); @@ -267,7 +268,7 @@ define(['globalize'], function (globalize) { return date.getFullYear() === yesterday.getFullYear() && date.getMonth() === yesterday.getMonth() && date.getDate() === day; } - return { + export default { parseISO8601Date: parseISO8601Date, getDisplayRunningTime: getDisplayRunningTime, toLocaleDateString: toLocaleDateString, @@ -279,4 +280,5 @@ define(['globalize'], function (globalize) { return toLocaleTimeStringSupportsLocales; } }; -}); + +/*eslint-enable indent */ From 45df6ef764bd469abab449d7966ab5136170bfe2 Mon Sep 17 00:00:00 2001 From: Cameron Date: Wed, 15 Jul 2020 14:46:56 +0100 Subject: [PATCH 100/244] Migration of alert to ES6 module --- package.json | 1 + src/components/activitylog.js | 3 +-- src/components/alert.js | 14 +++++++++----- src/components/appRouter.js | 2 +- src/components/multiSelect/multiSelect.js | 2 +- src/components/playback/playbackmanager.js | 2 +- src/controllers/dashboard/encodingsettings.js | 2 +- src/controllers/dashboard/metadatanfo.js | 2 +- src/controllers/itemDetails.js | 2 +- src/plugins/chromecastPlayer/plugin.js | 2 +- src/scripts/serverNotifications.js | 2 +- src/scripts/site.js | 2 +- 12 files changed, 20 insertions(+), 16 deletions(-) diff --git a/package.json b/package.json index 81d8b5f950..1707f06202 100644 --- a/package.json +++ b/package.json @@ -93,6 +93,7 @@ "src/components/accessSchedule/accessSchedule.js", "src/components/actionSheet/actionSheet.js", "src/components/activitylog.js", + "src/components/alert.js", "src/components/alphaPicker/alphaPicker.js", "src/components/autoFocuser.js", "src/components/cardbuilder/cardBuilder.js", diff --git a/src/components/activitylog.js b/src/components/activitylog.js index b51fc6787a..75b07a4cc8 100644 --- a/src/components/activitylog.js +++ b/src/components/activitylog.js @@ -128,7 +128,7 @@ import 'listViewStyle'; } function showItemOverview(item) { - require(['alert'], function (alert) { + import('alert').then(({default: alert})=> { alert({ text: item.Overview }); @@ -137,7 +137,6 @@ import 'listViewStyle'; class ActivityLog { constructor(options) { - console.log(options) this.options = options; var element = options.element; element.classList.add('activityLogListWidget'); diff --git a/src/components/alert.js b/src/components/alert.js index 97b580f8f6..80bfbc48e8 100644 --- a/src/components/alert.js +++ b/src/components/alert.js @@ -1,12 +1,15 @@ -define(['browser', 'dialog', 'globalize'], function (browser, dialog, globalize) { - 'use strict'; +import browser from 'browser'; +import dialog from 'dialog'; +import globalize from 'globalize'; + +/*eslint-disable indent*/ function replaceAll(originalString, strReplace, strWith) { var reg = new RegExp(strReplace, 'ig'); return originalString.replace(reg, strWith); } - return function (text, title) { + export default function (text, title) { var options; if (typeof text === 'string') { @@ -41,5 +44,6 @@ define(['browser', 'dialog', 'globalize'], function (browser, dialog, globalize) } return Promise.resolve(); - }; -}); + } + +/*eslint-enable indent*/ diff --git a/src/components/appRouter.js b/src/components/appRouter.js index 0861cf7e00..c2bec1769f 100644 --- a/src/components/appRouter.js +++ b/src/components/appRouter.js @@ -53,7 +53,7 @@ define(['loading', 'globalize', 'events', 'viewManager', 'skinManager', 'backdro break; case 'ServerUpdateNeeded': require(['alert'], function (alert) { - alert({ + alert.default({ text: globalize.translate('ServerUpdateNeeded', 'https://github.com/jellyfin/jellyfin'), html: globalize.translate('ServerUpdateNeeded', 'https://github.com/jellyfin/jellyfin') }).then(function () { diff --git a/src/components/multiSelect/multiSelect.js b/src/components/multiSelect/multiSelect.js index 05a2b68f42..922a1fcc19 100644 --- a/src/components/multiSelect/multiSelect.js +++ b/src/components/multiSelect/multiSelect.js @@ -338,7 +338,7 @@ define(['browser', 'appStorage', 'apphost', 'loading', 'connectionManager', 'glo if (selection.length < 2) { require(['alert'], function (alert) { - alert({ + alert.default({ text: globalize.translate('PleaseSelectTwoItems') }); }); diff --git a/src/components/playback/playbackmanager.js b/src/components/playback/playbackmanager.js index 73f07a05f2..b74ca5fb3d 100644 --- a/src/components/playback/playbackmanager.js +++ b/src/components/playback/playbackmanager.js @@ -709,7 +709,7 @@ define(['events', 'datetime', 'appSettings', 'itemHelper', 'pluginManager', 'pla function showPlaybackInfoErrorMessage(instance, errorCode, playNextTrack) { require(['alert'], function (alert) { - alert({ + alert.default({ text: globalize.translate('PlaybackError' + errorCode), title: globalize.translate('HeaderPlaybackError') }).then(function () { diff --git a/src/controllers/dashboard/encodingsettings.js b/src/controllers/dashboard/encodingsettings.js index b8cdd66651..098a8d6f68 100644 --- a/src/controllers/dashboard/encodingsettings.js +++ b/src/controllers/dashboard/encodingsettings.js @@ -86,7 +86,7 @@ define(['jQuery', 'loading', 'globalize', 'dom', 'libraryMenu'], function ($, lo if ($('#selectVideoDecoder', form).val()) { require(['alert'], function (alert) { - alert({ + alert.default({ title: globalize.translate('TitleHardwareAcceleration'), text: globalize.translate('HardwareAccelerationWarning') }).then(onDecoderConfirmed); diff --git a/src/controllers/dashboard/metadatanfo.js b/src/controllers/dashboard/metadatanfo.js index a936192618..3ef1a7cbf9 100644 --- a/src/controllers/dashboard/metadatanfo.js +++ b/src/controllers/dashboard/metadatanfo.js @@ -36,7 +36,7 @@ define(['jQuery', 'loading', 'libraryMenu', 'globalize'], function ($, loading, msg.push(globalize.translate('MetadataSettingChangeHelp')); require(['alert'], function (alert) { - alert({ + alert.default({ text: msg.join('

') }); }); diff --git a/src/controllers/itemDetails.js b/src/controllers/itemDetails.js index c9b6b7fc1c..cfaa5ab973 100644 --- a/src/controllers/itemDetails.js +++ b/src/controllers/itemDetails.js @@ -1787,7 +1787,7 @@ define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSetti imageLoader.lazyChildren(collectionItems); collectionItems.querySelector('.btnAddToCollection').addEventListener('click', function () { require(['alert'], function (alert) { - alert({ + alert.default({ text: globalize.translate('AddItemToCollectionHelp'), html: globalize.translate('AddItemToCollectionHelp') + '

' + globalize.translate('ButtonLearnMore') + '' }); diff --git a/src/plugins/chromecastPlayer/plugin.js b/src/plugins/chromecastPlayer/plugin.js index b3f75f7a6d..dad95691fc 100644 --- a/src/plugins/chromecastPlayer/plugin.js +++ b/src/plugins/chromecastPlayer/plugin.js @@ -150,7 +150,7 @@ define(['appSettings', 'userSettings', 'playbackManager', 'connectionManager', ' function alertText(text, title) { require(['alert'], function (alert) { - alert({ + alert.default({ text: text, title: title }); diff --git a/src/scripts/serverNotifications.js b/src/scripts/serverNotifications.js index 2553c284f0..8e212ab718 100644 --- a/src/scripts/serverNotifications.js +++ b/src/scripts/serverNotifications.js @@ -15,7 +15,7 @@ define(['connectionManager', 'playbackManager', 'syncPlayManager', 'events', 'in }); } else { require(['alert'], function (alert) { - alert({ title: args.Header, text: args.Text }); + alert.default({ title: args.Header, text: args.Text }); }); } } diff --git a/src/scripts/site.js b/src/scripts/site.js index c3f93d9545..17bff0decb 100644 --- a/src/scripts/site.js +++ b/src/scripts/site.js @@ -187,7 +187,7 @@ var Dashboard = { } require(['alert'], function (alert) { - alert({ + alert.default({ title: options.title || Globalize.translate('HeaderAlert'), text: options.message }).then(options.callback || function () {}); From 89fcda5f058d525294184d08dedca33df9bf32d9 Mon Sep 17 00:00:00 2001 From: Cameron Date: Thu, 16 Jul 2020 10:28:08 +0100 Subject: [PATCH 101/244] Migration of searchfields, searchresults and searchpage to ES6 modules --- package.json | 3 ++ src/components/search/searchfields.js | 61 +++++++++++++---------- src/components/search/searchresults.js | 61 +++++++++++++---------- src/controllers/searchpage.js | 67 +++++++++++++------------- 4 files changed, 109 insertions(+), 83 deletions(-) diff --git a/package.json b/package.json index 51f1ae10d2..b7c08fd281 100644 --- a/package.json +++ b/package.json @@ -126,6 +126,8 @@ "src/components/playmenu.js", "src/components/sanatizefilename.js", "src/components/scrollManager.js", + "src/components/search/searchfields.js", + "src/components/search/searchresults.js", "src/components/settingshelper.js", "src/components/subtitlesettings/subtitlesettings.js", "src/components/subtitlesettings/subtitleappearancehelper.js", @@ -137,6 +139,7 @@ "src/controllers/dashboard/logs.js", "src/controllers/user/subtitles.js", "src/controllers/dashboard/plugins/repositories.js", + "src/controllers/searchpage.js", "src/elements/emby-tabs/emby-tabs.js", "src/elements/emby-scroller/emby-scroller.js", "src/elements/emby-radio/emby-radio.js", diff --git a/src/components/search/searchfields.js b/src/components/search/searchfields.js index 7e77814772..99915e40b6 100644 --- a/src/components/search/searchfields.js +++ b/src/components/search/searchfields.js @@ -1,10 +1,20 @@ -define(['layoutManager', 'globalize', 'require', 'events', 'browser', 'alphaPicker', 'emby-input', 'flexStyles', 'material-icons', 'css!./searchfields'], function (layoutManager, globalize, require, events, browser, AlphaPicker) { - 'use strict'; +import layoutManager from 'layoutManager'; +import globalize from 'globalize'; +import require from 'require'; +import events from 'events'; +import browser from 'browser'; +import AlphaPicker from 'alphaPicker'; +import 'emby-input'; +import 'flexStyles'; +import 'material-icons'; +import 'css!./searchfields'; + +/* eslint-disable indent*/ function onSearchTimeout() { - var instance = this; - var value = instance.nextSearchValue; + const instance = this; + let value = instance.nextSearchValue; value = (value || '').trim(); events.trigger(instance, 'search', [value]); @@ -22,14 +32,14 @@ define(['layoutManager', 'globalize', 'require', 'events', 'browser', 'alphaPick function onAlphaValueClicked(e) { - var value = e.detail.value; - var searchFieldsInstance = this; + const value = e.detail.value; + const searchFieldsInstance = this; - var txtSearch = searchFieldsInstance.options.element.querySelector('.searchfields-txtSearch'); + const txtSearch = searchFieldsInstance.options.element.querySelector('.searchfields-txtSearch'); if (value === 'backspace') { - var val = txtSearch.value; + const val = txtSearch.value; txtSearch.value = val.length ? val.substring(0, val.length - 1) : ''; } else { @@ -53,8 +63,8 @@ define(['layoutManager', 'globalize', 'require', 'events', 'browser', 'alphaPick function onSearchInput(e) { - var value = e.target.value; - var searchFieldsInstance = this; + const value = e.target.value; + const searchFieldsInstance = this; triggerSearch(searchFieldsInstance, value); } @@ -62,7 +72,7 @@ define(['layoutManager', 'globalize', 'require', 'events', 'browser', 'alphaPick require(['text!./searchfields.template.html'], function (template) { - var html = globalize.translateDocument(template, 'core'); + let html = globalize.translateDocument(template, 'core'); if (browser.tizen || browser.orsay) { html = html.replace(''; + let itemHtml = ''; return itemHtml; }).join(''); - var searchSuggestions = context.querySelector('.searchSuggestions'); + const searchSuggestions = context.querySelector('.searchSuggestions'); searchSuggestions.querySelector('.searchSuggestionsList').innerHTML = html; if (result.Items.length) { @@ -49,9 +59,9 @@ define(['layoutManager', 'globalize', 'require', 'events', 'connectionManager', }); } - var allowSearch = true; + let allowSearch = true; - var queryIncludeItemTypes = query.IncludeItemTypes; + const queryIncludeItemTypes = query.IncludeItemTypes; if (instance.options.collectionType === 'tvshows') { if (query.IncludeArtists) { @@ -127,7 +137,7 @@ define(['layoutManager', 'globalize', 'require', 'events', 'connectionManager', query.EnableTotalRecordCount = false; query.ImageTypeLimit = 1; - var methodName = 'getItems'; + let methodName = 'getItems'; if (!query.IncludeMedia) { if (query.IncludePeople) { @@ -566,9 +576,9 @@ define(['layoutManager', 'globalize', 'require', 'events', 'connectionManager', section = context.querySelector(section); - var items = result.Items || result.SearchHints; + const items = result.Items || result.SearchHints; - var itemsContainer = section.querySelector('.itemsContainer'); + const itemsContainer = section.querySelector('.itemsContainer'); cardBuilder.buildCards(items, Object.assign({ @@ -588,7 +598,7 @@ define(['layoutManager', 'globalize', 'require', 'events', 'connectionManager', } function replaceAll(originalString, strReplace, strWith) { - var reg = new RegExp(strReplace, 'ig'); + const reg = new RegExp(strReplace, 'ig'); return originalString.replace(reg, strWith); } @@ -601,7 +611,7 @@ define(['layoutManager', 'globalize', 'require', 'events', 'connectionManager', template = replaceAll(template, 'itemsContainer scrollSlider', 'itemsContainer scrollSlider vertical-wrap'); } - var html = globalize.translateDocument(template, 'core'); + const html = globalize.translateDocument(template, 'core'); elem.innerHTML = html; @@ -610,28 +620,29 @@ define(['layoutManager', 'globalize', 'require', 'events', 'connectionManager', }); } - function SearchResults(options) { +class SearchResults { + constructor(options) { this.options = options; embed(options.element, this, options); } + search(value) { - SearchResults.prototype.search = function (value) { - - var apiClient = connectionManager.getApiClient(this.options.serverId); + const apiClient = connectionManager.getApiClient(this.options.serverId); search(this, apiClient, this.options.element, value); - }; + } + destroy() { - SearchResults.prototype.destroy = function () { - - var options = this.options; + const options = this.options; if (options) { options.element.classList.remove('searchFields'); } this.options = null; - }; + } +} - return SearchResults; -}); +export default SearchResults; + +/*eslint-enable indent*/ diff --git a/src/controllers/searchpage.js b/src/controllers/searchpage.js index 8a138b7516..8ce3e8afe8 100644 --- a/src/controllers/searchpage.js +++ b/src/controllers/searchpage.js @@ -1,36 +1,37 @@ -define(['focusManager', 'searchFields', 'searchResults', 'events'], function (focusManager, SearchFields, SearchResults, events) { - 'use strict'; +import focusManager from 'focusManager'; +import SearchFields from 'searchFields'; +import SearchResults from 'searchResults'; +import events from 'events'; - return function (view, params) { - function onSearch(e, value) { - self.searchResults.search(value); +export default function (view, params) { + function onSearch(e, value) { + self.searchResults.search(value); + } + + const self = this; + view.addEventListener('viewshow', function () { + if (!self.searchFields) { + self.searchFields = new SearchFields({ + element: view.querySelector('.searchFields') + }); + self.searchResults = new SearchResults({ + element: view.querySelector('.searchResults'), + serverId: params.serverId || ApiClient.serverId(), + parentId: params.parentId, + collectionType: params.collectionType + }); + events.on(self.searchFields, 'search', onSearch); + } + }); + view.addEventListener('viewdestroy', function () { + if (self.searchFields) { + self.searchFields.destroy(); + self.searchFields = null; } - var self = this; - view.addEventListener('viewshow', function () { - if (!self.searchFields) { - self.searchFields = new SearchFields({ - element: view.querySelector('.searchFields') - }); - self.searchResults = new SearchResults({ - element: view.querySelector('.searchResults'), - serverId: params.serverId || ApiClient.serverId(), - parentId: params.parentId, - collectionType: params.collectionType - }); - events.on(self.searchFields, 'search', onSearch); - } - }); - view.addEventListener('viewdestroy', function () { - if (self.searchFields) { - self.searchFields.destroy(); - self.searchFields = null; - } - - if (self.searchResults) { - self.searchResults.destroy(); - self.searchResults = null; - } - }); - }; -}); + if (self.searchResults) { + self.searchResults.destroy(); + self.searchResults = null; + } + }); +} From dfcf0d5d6b034943b43becf42b56a6ace14fbf3c Mon Sep 17 00:00:00 2001 From: Cameron Date: Thu, 16 Jul 2020 11:25:17 +0100 Subject: [PATCH 102/244] update variable declerations --- src/controllers/dashboard/general.js | 22 ++++++++++----------- src/controllers/dashboard/librarydisplay.js | 5 ++--- src/controllers/dashboard/metadataImages.js | 18 ++++++++--------- src/controllers/dashboard/metadatanfo.js | 14 ++++++------- src/controllers/dashboard/streaming.js | 4 ++-- 5 files changed, 31 insertions(+), 32 deletions(-) diff --git a/src/controllers/dashboard/general.js b/src/controllers/dashboard/general.js index 2defc6d449..8e30749aba 100644 --- a/src/controllers/dashboard/general.js +++ b/src/controllers/dashboard/general.js @@ -24,7 +24,7 @@ import 'emby-button'; function onSubmit() { loading.show(); - var form = this; + const form = this; $(form).parents('.page'); ApiClient.getServerConfiguration().then(function (config) { config.ServerName = $('#txtServerName', form).val(); @@ -32,7 +32,7 @@ import 'emby-button'; config.CachePath = form.querySelector('#txtCachePath').value; config.MetadataPath = $('#txtMetadataPath', form).val(); config.MetadataNetworkPath = $('#txtMetadataNetworkPath', form).val(); - var requiresReload = config.UICulture !== currentLanguage; + let requiresReload = config.UICulture !== currentLanguage; ApiClient.updateServerConfiguration(config).then(function() { ApiClient.getNamedConfiguration(brandingConfigKey).then(function(brandingConfig) { brandingConfig.LoginDisclaimer = form.querySelector('#txtLoginDisclaimer').value; @@ -61,13 +61,13 @@ import 'emby-button'; return false; } - var currentBrandingOptions; - var currentLanguage; - var brandingConfigKey = 'branding'; + let currentBrandingOptions; + let currentLanguage; + const brandingConfigKey = 'branding'; export default function (view, params) { $('#btnSelectCachePath', view).on('click.selectDirectory', function () { import('directorybrowser').then(({default: directoryBrowser}) => { - var picker = new directoryBrowser(); + const picker = new directoryBrowser(); picker.show({ callback: function (path) { if (path) { @@ -84,7 +84,7 @@ import 'emby-button'; }); $('#btnSelectMetadataPath', view).on('click.selectDirectory', function () { import('directorybrowser').then(({default: directoryBrowser}) => { - var picker = new directoryBrowser(); + const picker = new directoryBrowser(); picker.show({ path: $('#txtMetadataPath', view).val(), networkSharePath: $('#txtMetadataNetworkPath', view).val(), @@ -108,9 +108,9 @@ import 'emby-button'; }); $('.dashboardGeneralForm', view).off('submit', onSubmit).on('submit', onSubmit); view.addEventListener('viewshow', function () { - var promiseConfig = ApiClient.getServerConfiguration(); - var promiseLanguageOptions = ApiClient.getJSON(ApiClient.getUrl('Localization/Options')); - var promiseSystemInfo = ApiClient.getSystemInfo(); + const promiseConfig = ApiClient.getServerConfiguration(); + const promiseLanguageOptions = ApiClient.getJSON(ApiClient.getUrl('Localization/Options')); + const promiseSystemInfo = ApiClient.getSystemInfo(); Promise.all([promiseConfig, promiseLanguageOptions, promiseSystemInfo]).then(function (responses) { loadPage(view, responses[0], responses[1], responses[2]); }); @@ -120,6 +120,6 @@ import 'emby-button'; view.querySelector('#txtCustomCss').value = config.CustomCss || ''; }); }); - }; + } /* eslint-enable indent */ diff --git a/src/controllers/dashboard/librarydisplay.js b/src/controllers/dashboard/librarydisplay.js index 95475cfb9b..54ed028a3a 100644 --- a/src/controllers/dashboard/librarydisplay.js +++ b/src/controllers/dashboard/librarydisplay.js @@ -3,7 +3,6 @@ import loading from 'loading'; import libraryMenu from 'libraryMenu'; import 'emby-checkbox'; import 'emby-button'; -import 'emby-button'; /* eslint-disable indent */ @@ -39,7 +38,7 @@ import 'emby-button'; view.querySelector('form').addEventListener('submit', function(e) { loading.show(); - var form = this; + const form = this; ApiClient.getServerConfiguration().then(function(config) { config.EnableFolderView = form.querySelector('.chkFolderView').checked; config.EnableGroupingIntoCollections = form.querySelector('.chkGroupMoviesIntoCollections').checked; @@ -69,6 +68,6 @@ import 'emby-button'; } }); }); - }; + } /* eslint-enable indent */ diff --git a/src/controllers/dashboard/metadataImages.js b/src/controllers/dashboard/metadataImages.js index 6573d9858d..cbfe05419c 100644 --- a/src/controllers/dashboard/metadataImages.js +++ b/src/controllers/dashboard/metadataImages.js @@ -9,10 +9,10 @@ import 'listViewStyle'; function populateLanguages(select) { return ApiClient.getCultures().then(function(languages) { - var html = ''; + let html = ''; html += ""; - for (var i = 0, length = languages.length; i < length; i++) { - var culture = languages[i]; + for (let i = 0, length = languages.length; i < length; i++) { + const culture = languages[i]; html += "'; } select.innerHTML = html; @@ -21,10 +21,10 @@ import 'listViewStyle'; function populateCountries(select) { return ApiClient.getCountries().then(function(allCountries) { - var html = ''; + let html = ''; html += ""; - for (var i = 0, length = allCountries.length; i < length; i++) { - var culture = allCountries[i]; + for (let i = 0, length = allCountries.length; i < length; i++) { + const culture = allCountries[i]; html += "'; } select.innerHTML = html; @@ -32,9 +32,9 @@ import 'listViewStyle'; } function loadPage(page) { - var promises = [ApiClient.getServerConfiguration(), populateLanguages(page.querySelector('#selectLanguage')), populateCountries(page.querySelector('#selectCountry'))]; + const promises = [ApiClient.getServerConfiguration(), populateLanguages(page.querySelector('#selectLanguage')), populateCountries(page.querySelector('#selectCountry'))]; Promise.all(promises).then(function(responses) { - var config = responses[0]; + const config = responses[0]; page.querySelector('#selectLanguage').value = config.PreferredMetadataLanguage || ''; page.querySelector('#selectCountry').value = config.MetadataCountryCode || ''; loading.hide(); @@ -42,7 +42,7 @@ import 'listViewStyle'; } function onSubmit() { - var form = this; + const form = this; return loading.show(), ApiClient.getServerConfiguration().then(function(config) { config.PreferredMetadataLanguage = form.querySelector('#selectLanguage').value; config.MetadataCountryCode = form.querySelector('#selectCountry').value; diff --git a/src/controllers/dashboard/metadatanfo.js b/src/controllers/dashboard/metadatanfo.js index 0659d477cb..f1b768d18b 100644 --- a/src/controllers/dashboard/metadatanfo.js +++ b/src/controllers/dashboard/metadatanfo.js @@ -6,7 +6,7 @@ import globalize from 'globalize'; /* eslint-disable indent */ function loadPage(page, config, users) { - var html = ''; + let html = ''; html += users.map(function (user) { return ''; }).join(''); @@ -20,7 +20,7 @@ import globalize from 'globalize'; function onSubmit() { loading.show(); - var form = this; + const form = this; ApiClient.getNamedConfiguration(metadataKey).then(function (config) { config.UserId = $('#selectUser', form).val() || null; config.ReleaseDateFormat = $('#selectReleaseDateFormat', form).val(); @@ -36,7 +36,7 @@ import globalize from 'globalize'; } function showConfirmMessage(config) { - var msg = []; + const msg = []; msg.push(globalize.translate('MetadataSettingChangeHelp')); import('alert').then(({default: alert}) => { @@ -62,15 +62,15 @@ import globalize from 'globalize'; }]; } - var metadataKey = 'xbmcmetadata'; + const metadataKey = 'xbmcmetadata'; $(document).on('pageinit', '#metadataNfoPage', function () { $('.metadataNfoForm').off('submit', onSubmit).on('submit', onSubmit); }).on('pageshow', '#metadataNfoPage', function () { libraryMenu.setTabs('metadata', 3, getTabs); loading.show(); - var page = this; - var promise1 = ApiClient.getUsers(); - var promise2 = ApiClient.getNamedConfiguration(metadataKey); + const page = this; + const promise1 = ApiClient.getUsers(); + const promise2 = ApiClient.getNamedConfiguration(metadataKey); Promise.all([promise1, promise2]).then(function (responses) { loadPage(page, responses[1], responses[0]); }); diff --git a/src/controllers/dashboard/streaming.js b/src/controllers/dashboard/streaming.js index 15d6c89209..c54fbea472 100644 --- a/src/controllers/dashboard/streaming.js +++ b/src/controllers/dashboard/streaming.js @@ -12,7 +12,7 @@ import globalize from 'globalize'; function onSubmit() { loading.show(); - var form = this; + const form = this; ApiClient.getServerConfiguration().then(function (config) { config.RemoteClientBitrateLimit = parseInt(1e6 * parseFloat($('#txtRemoteClientBitrateLimit', form).val() || '0')); ApiClient.updateServerConfiguration(config).then(Dashboard.processServerConfigurationUpdateResult); @@ -39,7 +39,7 @@ import globalize from 'globalize'; }).on('pageshow', '#streamingSettingsPage', function () { loading.show(); libraryMenu.setTabs('playback', 2, getTabs); - var page = this; + const page = this; ApiClient.getServerConfiguration().then(function (config) { loadPage(page, config); }); From f296eb34750a38d0f185c49fdbe4efe425ef284e Mon Sep 17 00:00:00 2001 From: Cameron Date: Fri, 17 Jul 2020 11:30:39 +0100 Subject: [PATCH 103/244] Migration of taskbutton and touchHelper to ES6 modules --- package.json | 14 +- src/components/maintabsmanager.js | 2 +- src/controllers/dashboard/mediaLibrary.js | 4 +- src/controllers/livetvstatus.js | 4 +- src/controllers/playback/videoosd.js | 2 +- src/scripts/taskbutton.js | 227 +++++++++++----------- src/scripts/touchHelper.js | 23 ++- 7 files changed, 140 insertions(+), 136 deletions(-) diff --git a/package.json b/package.json index b911778bc2..ecf54d2ca4 100644 --- a/package.json +++ b/package.json @@ -154,6 +154,9 @@ "src/plugins/bookPlayer/plugin.js", "src/plugins/bookPlayer/tableOfContents.js", "src/plugins/photoPlayer/plugin.js", + "src/scripts/settings/appSettings.js", + "src/scripts/settings/userSettings.js", + "src/scripts/settings/webSettings.js", "src/scripts/deleteHelper.js", "src/scripts/dfnshelper.js", "src/scripts/dom.js", @@ -161,14 +164,13 @@ "src/scripts/filesystem.js", "src/scripts/imagehelper.js", "src/scripts/inputManager.js", + "src/scripts/keyboardNavigation.js", + "src/scripts/taskbutton.js", + "src/scripts/touchHelper.js", + "src/scripts/themeLoader.js", "src/plugins/backdropScreensaver/plugin.js", "src/components/filterdialog/filterdialog.js", - "src/components/fetchhelper.js", - "src/scripts/keyboardNavigation.js", - "src/scripts/settings/appSettings.js", - "src/scripts/settings/userSettings.js", - "src/scripts/themeLoader.js", - "src/scripts/settings/webSettings.js" + "src/components/fetchhelper.js" ], "plugins": [ "@babel/plugin-transform-modules-amd", diff --git a/src/components/maintabsmanager.js b/src/components/maintabsmanager.js index e1c5434363..e50d75bc05 100644 --- a/src/components/maintabsmanager.js +++ b/src/components/maintabsmanager.js @@ -85,7 +85,7 @@ define(['dom', 'browser', 'events', 'emby-tabs', 'emby-button'], function (dom, require(['touchHelper'], function (TouchHelper) { - var touchHelper = new TouchHelper(view.parentNode.parentNode); + var touchHelper = new TouchHelper.default(view.parentNode.parentNode); events.on(touchHelper, 'swipeleft', onSwipeLeft); events.on(touchHelper, 'swiperight', onSwipeRight); diff --git a/src/controllers/dashboard/mediaLibrary.js b/src/controllers/dashboard/mediaLibrary.js index d9b288c62a..8e0020f62b 100644 --- a/src/controllers/dashboard/mediaLibrary.js +++ b/src/controllers/dashboard/mediaLibrary.js @@ -372,7 +372,7 @@ define(['jQuery', 'apphost', 'scripts/taskbutton', 'loading', 'libraryMenu', 'gl pageIdOn('pageshow', 'mediaLibraryPage', function () { libraryMenu.setTabs('librarysetup', 0, getTabs); var page = this; - taskButton({ + taskButton.default({ mode: 'on', progressElem: page.querySelector('.refreshProgress'), taskKey: 'RefreshLibrary', @@ -381,7 +381,7 @@ define(['jQuery', 'apphost', 'scripts/taskbutton', 'loading', 'libraryMenu', 'gl }); pageIdOn('pagebeforehide', 'mediaLibraryPage', function () { var page = this; - taskButton({ + taskButton.default({ mode: 'off', progressElem: page.querySelector('.refreshProgress'), taskKey: 'RefreshLibrary', diff --git a/src/controllers/livetvstatus.js b/src/controllers/livetvstatus.js index c6daf53a4f..efafd50871 100644 --- a/src/controllers/livetvstatus.js +++ b/src/controllers/livetvstatus.js @@ -303,7 +303,7 @@ define(['jQuery', 'globalize', 'scripts/taskbutton', 'dom', 'libraryMenu', 'layo }).on('pageshow', '#liveTvStatusPage', function () { var page = this; reload(page); - taskButton({ + taskButton.default({ mode: 'on', progressElem: page.querySelector('.refreshGuideProgress'), taskKey: 'RefreshGuide', @@ -311,7 +311,7 @@ define(['jQuery', 'globalize', 'scripts/taskbutton', 'dom', 'libraryMenu', 'layo }); }).on('pagehide', '#liveTvStatusPage', function () { var page = this; - taskButton({ + taskButton.default({ mode: 'off', progressElem: page.querySelector('.refreshGuideProgress'), taskKey: 'RefreshGuide', diff --git a/src/controllers/playback/videoosd.js b/src/controllers/playback/videoosd.js index d6caf24e81..0907a700b3 100644 --- a/src/controllers/playback/videoosd.js +++ b/src/controllers/playback/videoosd.js @@ -1533,7 +1533,7 @@ define(['playbackManager', 'dom', 'inputManager', 'datetime', 'itemHelper', 'med if (browser.touch) { (function () { require(['touchHelper'], function (TouchHelper) { - self.touchHelper = new TouchHelper(view, { + self.touchHelper = new TouchHelper.default(view, { swipeYThreshold: 30, triggerOnMove: true, preventDefaultOnMove: true, diff --git a/src/scripts/taskbutton.js b/src/scripts/taskbutton.js index 8facaf8900..d2c9d6c91e 100644 --- a/src/scripts/taskbutton.js +++ b/src/scripts/taskbutton.js @@ -1,119 +1,122 @@ -define(['events', 'userSettings', 'serverNotifications', 'connectionManager', 'globalize', 'emby-button'], function (events, userSettings, serverNotifications, connectionManager, globalize) { - 'use strict'; +import events from 'events'; +import * as userSettings from 'userSettings'; +import serverNotifications from 'serverNotifications'; +import connectionManager from 'connectionManager'; +import globalize from 'globalize'; +import 'emby-button'; - return function (options) { - function pollTasks() { - connectionManager.getApiClient(serverId).getScheduledTasks({ - IsEnabled: true - }).then(updateTasks); - } +export default function (options) { + function pollTasks() { + connectionManager.getApiClient(serverId).getScheduledTasks({ + IsEnabled: true + }).then(updateTasks); + } - function updateTasks(tasks) { - var task = tasks.filter(function (t) { - return t.Key == options.taskKey; - })[0]; - - if (options.panel) { - if (task) { - options.panel.classList.remove('hide'); - } else { - options.panel.classList.add('hide'); - } - } - - if (!task) { - return; - } - - if (task.State == 'Idle') { - button.removeAttribute('disabled'); - } else { - button.setAttribute('disabled', 'disabled'); - } - - button.setAttribute('data-taskid', task.Id); - var progress = (task.CurrentProgressPercentage || 0).toFixed(1); - - if (options.progressElem) { - options.progressElem.value = progress; - - if (task.State == 'Running') { - options.progressElem.classList.remove('hide'); - } else { - options.progressElem.classList.add('hide'); - } - } - - if (options.lastResultElem) { - var lastResult = task.LastExecutionResult ? task.LastExecutionResult.Status : ''; - - if (lastResult == 'Failed') { - options.lastResultElem.html('(' + globalize.translate('LabelFailed') + ')'); - } else if (lastResult == 'Cancelled') { - options.lastResultElem.html('(' + globalize.translate('LabelCancelled') + ')'); - } else if (lastResult == 'Aborted') { - options.lastResultElem.html('' + globalize.translate('LabelAbortedByServerShutdown') + ''); - } else { - options.lastResultElem.html(lastResult); - } - } - } - - function onScheduledTaskMessageConfirmed(id) { - connectionManager.getApiClient(serverId).startScheduledTask(id).then(pollTasks); - } - - function onButtonClick() { - onScheduledTaskMessageConfirmed(this.getAttribute('data-taskid')); - } - - function onScheduledTasksUpdate(e, apiClient, info) { - if (apiClient.serverId() === serverId) { - updateTasks(info); - } - } - - var pollInterval; - var button = options.button; - var serverId = ApiClient.serverId(); - - function onPollIntervalFired() { - if (!connectionManager.getApiClient(serverId).isMessageChannelOpen()) { - pollTasks(); - } - } - - function startInterval() { - var apiClient = connectionManager.getApiClient(serverId); - - if (pollInterval) { - clearInterval(pollInterval); - } - apiClient.sendMessage('ScheduledTasksInfoStart', '1000,1000'); - pollInterval = setInterval(onPollIntervalFired, 5000); - } - - function stopInterval() { - connectionManager.getApiClient(serverId).sendMessage('ScheduledTasksInfoStop'); - - if (pollInterval) { - clearInterval(pollInterval); - } - } + function updateTasks(tasks) { + var task = tasks.filter(function (t) { + return t.Key == options.taskKey; + })[0]; if (options.panel) { - options.panel.classList.add('hide'); + if (task) { + options.panel.classList.remove('hide'); + } else { + options.panel.classList.add('hide'); + } } - if (options.mode == 'off') { - button.removeEventListener('click', onButtonClick); - events.off(serverNotifications, 'ScheduledTasksInfo', onScheduledTasksUpdate); - stopInterval(); - } else { - button.addEventListener('click', onButtonClick); - pollTasks(); - startInterval(); - events.on(serverNotifications, 'ScheduledTasksInfo', onScheduledTasksUpdate); + if (!task) { + return; } - }; -}); + + if (task.State == 'Idle') { + button.removeAttribute('disabled'); + } else { + button.setAttribute('disabled', 'disabled'); + } + + button.setAttribute('data-taskid', task.Id); + var progress = (task.CurrentProgressPercentage || 0).toFixed(1); + + if (options.progressElem) { + options.progressElem.value = progress; + + if (task.State == 'Running') { + options.progressElem.classList.remove('hide'); + } else { + options.progressElem.classList.add('hide'); + } + } + + if (options.lastResultElem) { + var lastResult = task.LastExecutionResult ? task.LastExecutionResult.Status : ''; + + if (lastResult == 'Failed') { + options.lastResultElem.html('(' + globalize.translate('LabelFailed') + ')'); + } else if (lastResult == 'Cancelled') { + options.lastResultElem.html('(' + globalize.translate('LabelCancelled') + ')'); + } else if (lastResult == 'Aborted') { + options.lastResultElem.html('' + globalize.translate('LabelAbortedByServerShutdown') + ''); + } else { + options.lastResultElem.html(lastResult); + } + } + } + + function onScheduledTaskMessageConfirmed(id) { + connectionManager.getApiClient(serverId).startScheduledTask(id).then(pollTasks); + } + + function onButtonClick() { + onScheduledTaskMessageConfirmed(this.getAttribute('data-taskid')); + } + + function onScheduledTasksUpdate(e, apiClient, info) { + if (apiClient.serverId() === serverId) { + updateTasks(info); + } + } + + var pollInterval; + var button = options.button; + var serverId = ApiClient.serverId(); + + function onPollIntervalFired() { + if (!connectionManager.getApiClient(serverId).isMessageChannelOpen()) { + pollTasks(); + } + } + + function startInterval() { + var apiClient = connectionManager.getApiClient(serverId); + + if (pollInterval) { + clearInterval(pollInterval); + } + apiClient.sendMessage('ScheduledTasksInfoStart', '1000,1000'); + pollInterval = setInterval(onPollIntervalFired, 5000); + } + + function stopInterval() { + connectionManager.getApiClient(serverId).sendMessage('ScheduledTasksInfoStop'); + + if (pollInterval) { + clearInterval(pollInterval); + } + } + + if (options.panel) { + options.panel.classList.add('hide'); + } + + if (options.mode == 'off') { + button.removeEventListener('click', onButtonClick); + events.off(serverNotifications, 'ScheduledTasksInfo', onScheduledTasksUpdate); + stopInterval(); + } else { + button.addEventListener('click', onButtonClick); + pollTasks(); + startInterval(); + events.on(serverNotifications, 'ScheduledTasksInfo', onScheduledTasksUpdate); + } +} diff --git a/src/scripts/touchHelper.js b/src/scripts/touchHelper.js index 97455fc969..c3e3b01a1c 100644 --- a/src/scripts/touchHelper.js +++ b/src/scripts/touchHelper.js @@ -1,12 +1,12 @@ -define(['dom', 'events'], function (dom, events) { - 'use strict'; +import dom from 'dom'; +import events from 'events'; - function getTouches(e) { +function getTouches(e) { + return e.changedTouches || e.targetTouches || e.touches; +} - return e.changedTouches || e.targetTouches || e.touches; - } - - function TouchHelper(elem, options) { +class TouchHelper { + constructor(elem, options) { options = options || {}; var touchTarget; @@ -138,8 +138,7 @@ define(['dom', 'events'], function (dom, events) { passive: true }); } - - TouchHelper.prototype.destroy = function () { + destroy() { var elem = this.elem; @@ -165,7 +164,7 @@ define(['dom', 'events'], function (dom, events) { this.touchEnd = null; this.elem = null; - }; + } +} - return TouchHelper; -}); +export default TouchHelper; From 0473e549abca7ce5aa449ff9f240f3e3b9cf7fbb Mon Sep 17 00:00:00 2001 From: Cameron Date: Fri, 17 Jul 2020 11:30:56 +0100 Subject: [PATCH 104/244] update variable declerations for appSettings and userSettings --- src/scripts/settings/appSettings.js | 8 ++++---- src/scripts/settings/userSettings.js | 20 ++++++++++---------- 2 files changed, 14 insertions(+), 14 deletions(-) diff --git a/src/scripts/settings/appSettings.js b/src/scripts/settings/appSettings.js index 6f0975e98c..ffd63b9561 100644 --- a/src/scripts/settings/appSettings.js +++ b/src/scripts/settings/appSettings.js @@ -28,7 +28,7 @@ import events from 'events'; } export function enableAutomaticBitrateDetection(isInNetwork, mediaType, val) { - var key = 'enableautobitratebitrate-' + mediaType + '-' + isInNetwork; + const key = 'enableautobitratebitrate-' + mediaType + '-' + isInNetwork; if (val !== undefined) { if (isInNetwork && mediaType === 'Audio') { val = true; @@ -45,7 +45,7 @@ import events from 'events'; } export function maxStreamingBitrate(isInNetwork, mediaType, val) { - var key = 'maxbitrate-' + mediaType + '-' + isInNetwork; + const key = 'maxbitrate-' + mediaType + '-' + isInNetwork; if (val !== undefined) { if (isInNetwork && mediaType === 'Audio') { // nothing to do, this is always a max value @@ -67,7 +67,7 @@ import events from 'events'; this.set('maxStaticMusicBitrate', val); } - var defaultValue = 320000; + const defaultValue = 320000; return parseInt(this.get('maxStaticMusicBitrate') || defaultValue.toString()) || defaultValue; } @@ -118,7 +118,7 @@ import events from 'events'; } export function set(name, value, userId) { - var currentValue = this.get(name, userId); + const currentValue = this.get(name, userId); appStorage.setItem(getKey(name, userId), value); if (currentValue !== value) { diff --git a/src/scripts/settings/userSettings.js b/src/scripts/settings/userSettings.js index 1b5283fa43..bd6050b5fe 100644 --- a/src/scripts/settings/userSettings.js +++ b/src/scripts/settings/userSettings.js @@ -2,7 +2,7 @@ import appSettings from 'appSettings'; import events from 'events'; function onSaveTimeout() { - var self = this; + const self = this; self.saveTimeout = null; self.currentApiClient.updateDisplayPreferences('usersettings', self.displayPrefs, self.currentUserId, 'emby'); } @@ -37,7 +37,7 @@ export class UserSettings { return Promise.resolve(); } - var self = this; + const self = this; return apiClient.getDisplayPreferences('usersettings', userId, 'emby').then(function (result) { result.CustomPrefs = result.CustomPrefs || {}; @@ -63,9 +63,9 @@ export class UserSettings { * @param {boolean} enableOnServer - Flag to save preferences on server. */ set(name, value, enableOnServer) { - var userId = this.currentUserId; - var currentValue = this.get(name, enableOnServer); - var result = appSettings.set(name, value, userId); + const userId = this.currentUserId; + const currentValue = this.get(name, enableOnServer); + const result = appSettings.set(name, value, userId); if (enableOnServer !== false && this.displayPrefs) { this.displayPrefs.CustomPrefs[name] = value == null ? value : value.toString(); @@ -86,7 +86,7 @@ export class UserSettings { * @return {string} Value of setting. */ get(name, enableOnServer) { - var userId = this.currentUserId; + const userId = this.currentUserId; if (enableOnServer !== false && this.displayPrefs) { return this.displayPrefs.CustomPrefs[name]; } @@ -100,7 +100,7 @@ export class UserSettings { * @return {Object|Promise} Configuration or Promise. */ serverConfig(config) { - var apiClient = this.currentApiClient; + const apiClient = this.currentApiClient; if (config) { return apiClient.updateUserConfiguration(this.currentUserId, config); } @@ -349,7 +349,7 @@ export class UserSettings { return this.set('libraryPageSize', parseInt(val, 10), false); } - var libraryPageSize = parseInt(this.get('libraryPageSize', false), 10); + const libraryPageSize = parseInt(this.get('libraryPageSize', false), 10); if (libraryPageSize === 0) { // Explicitly return 0 to avoid returning 100 because 0 is falsy. return 0; @@ -378,7 +378,7 @@ export class UserSettings { * @return {Object} Query. */ loadQuerySettings(key, query) { - var values = this.get(key); + let values = this.get(key); if (values) { values = JSON.parse(values); return Object.assign(query, values); @@ -393,7 +393,7 @@ export class UserSettings { * @param {Object} query - Query. */ saveQuerySettings(key, query) { - var values = {}; + const values = {}; if (query.SortBy) { values.SortBy = query.SortBy; } From 46638fb9a9f94b70ad6dea378a22fededf26b5de Mon Sep 17 00:00:00 2001 From: Cameron Date: Fri, 17 Jul 2020 11:32:23 +0100 Subject: [PATCH 105/244] update Variable declerations for taskbutton and touchHelper --- src/scripts/taskbutton.js | 14 +++++----- src/scripts/touchHelper.js | 52 +++++++++++++++++++------------------- 2 files changed, 33 insertions(+), 33 deletions(-) diff --git a/src/scripts/taskbutton.js b/src/scripts/taskbutton.js index d2c9d6c91e..85062fdaa5 100644 --- a/src/scripts/taskbutton.js +++ b/src/scripts/taskbutton.js @@ -13,7 +13,7 @@ export default function (options) { } function updateTasks(tasks) { - var task = tasks.filter(function (t) { + const task = tasks.filter(function (t) { return t.Key == options.taskKey; })[0]; @@ -36,7 +36,7 @@ export default function (options) { } button.setAttribute('data-taskid', task.Id); - var progress = (task.CurrentProgressPercentage || 0).toFixed(1); + const progress = (task.CurrentProgressPercentage || 0).toFixed(1); if (options.progressElem) { options.progressElem.value = progress; @@ -49,7 +49,7 @@ export default function (options) { } if (options.lastResultElem) { - var lastResult = task.LastExecutionResult ? task.LastExecutionResult.Status : ''; + const lastResult = task.LastExecutionResult ? task.LastExecutionResult.Status : ''; if (lastResult == 'Failed') { options.lastResultElem.html('(' + globalize.translate('LabelFailed') + ')'); @@ -77,9 +77,9 @@ export default function (options) { } } - var pollInterval; - var button = options.button; - var serverId = ApiClient.serverId(); + let pollInterval; + const button = options.button; + const serverId = ApiClient.serverId(); function onPollIntervalFired() { if (!connectionManager.getApiClient(serverId).isMessageChannelOpen()) { @@ -88,7 +88,7 @@ export default function (options) { } function startInterval() { - var apiClient = connectionManager.getApiClient(serverId); + const apiClient = connectionManager.getApiClient(serverId); if (pollInterval) { clearInterval(pollInterval); diff --git a/src/scripts/touchHelper.js b/src/scripts/touchHelper.js index c3e3b01a1c..c12cf79513 100644 --- a/src/scripts/touchHelper.js +++ b/src/scripts/touchHelper.js @@ -9,23 +9,23 @@ class TouchHelper { constructor(elem, options) { options = options || {}; - var touchTarget; - var touchStartX; - var touchStartY; - var lastDeltaX; - var lastDeltaY; - var thresholdYMet; - var self = this; + let touchTarget; + let touchStartX; + let touchStartY; + let lastDeltaX; + let lastDeltaY; + let thresholdYMet; + const self = this; - var swipeXThreshold = options.swipeXThreshold || 50; - var swipeYThreshold = options.swipeYThreshold || 50; - var swipeXMaxY = 30; + const swipeXThreshold = options.swipeXThreshold || 50; + const swipeYThreshold = options.swipeYThreshold || 50; + const swipeXMaxY = 30; - var excludeTagNames = options.ignoreTagNames || []; + const excludeTagNames = options.ignoreTagNames || []; - var touchStart = function (e) { + const touchStart = function (e) { - var touch = getTouches(e)[0]; + const touch = getTouches(e)[0]; touchTarget = null; touchStartX = 0; touchStartY = 0; @@ -35,7 +35,7 @@ class TouchHelper { if (touch) { - var currentTouchTarget = touch.target; + const currentTouchTarget = touch.target; if (dom.parentWithTag(currentTouchTarget, excludeTagNames)) { return; @@ -47,18 +47,18 @@ class TouchHelper { } }; - var touchEnd = function (e) { + const touchEnd = function (e) { - var isTouchMove = e.type === 'touchmove'; + const isTouchMove = e.type === 'touchmove'; if (touchTarget) { - var touch = getTouches(e)[0]; + const touch = getTouches(e)[0]; - var deltaX; - var deltaY; + let deltaX; + let deltaY; - var clientX; - var clientY; + let clientX; + let clientY; if (touch) { clientX = touch.clientX || 0; @@ -70,8 +70,8 @@ class TouchHelper { deltaY = 0; } - var currentDeltaX = lastDeltaX == null ? deltaX : (deltaX - lastDeltaX); - var currentDeltaY = lastDeltaY == null ? deltaY : (deltaY - lastDeltaY); + const currentDeltaX = lastDeltaX == null ? deltaX : (deltaX - lastDeltaX); + const currentDeltaY = lastDeltaY == null ? deltaY : (deltaY - lastDeltaY); lastDeltaX = deltaX; lastDeltaY = deltaY; @@ -140,11 +140,11 @@ class TouchHelper { } destroy() { - var elem = this.elem; + const elem = this.elem; if (elem) { - var touchStart = this.touchStart; - var touchEnd = this.touchEnd; + const touchStart = this.touchStart; + const touchEnd = this.touchEnd; dom.removeEventListener(elem, 'touchstart', touchStart, { passive: true From 93fcca6965d99c017cd8389c68cce105970663d6 Mon Sep 17 00:00:00 2001 From: Cameron Date: Fri, 17 Jul 2020 17:02:49 +0100 Subject: [PATCH 106/244] update paper button and button --- src/elements/emby-button/emby-button.js | 106 +++++++++--------- .../emby-button/paper-icon-button-light.js | 26 ++--- 2 files changed, 62 insertions(+), 70 deletions(-) diff --git a/src/elements/emby-button/emby-button.js b/src/elements/emby-button/emby-button.js index 4848f4751f..683c59cca0 100644 --- a/src/elements/emby-button/emby-button.js +++ b/src/elements/emby-button/emby-button.js @@ -7,73 +7,69 @@ import appHost from 'apphost'; import 'css!./emby-button'; import 'registerElement'; -/* eslint-disable indent */ +const EmbyButtonPrototype = Object.create(HTMLButtonElement.prototype); +const EmbyLinkButtonPrototype = Object.create(HTMLAnchorElement.prototype); - const EmbyButtonPrototype = Object.create(HTMLButtonElement.prototype); - const EmbyLinkButtonPrototype = Object.create(HTMLAnchorElement.prototype); - - function onAnchorClick(e) { - const href = this.getAttribute('href') || ''; - if (href !== '#') { - if (this.getAttribute('target')) { - if (!appHost.supports('targetblank')) { - e.preventDefault(); - shell.openUrl(href); - } - } else { - appRouter.handleAnchorClick(e); +function onAnchorClick(e) { + const href = this.getAttribute('href') || ''; + if (href !== '#') { + if (this.getAttribute('target')) { + if (!appHost.supports('targetblank')) { + e.preventDefault(); + shell.openUrl(href); } } else { - e.preventDefault(); + appRouter.handleAnchorClick(e); } + } else { + e.preventDefault(); + } +} + +EmbyButtonPrototype.createdCallback = function () { + if (this.classList.contains('emby-button')) { + return; } - EmbyButtonPrototype.createdCallback = function () { - if (this.classList.contains('emby-button')) { - return; - } + this.classList.add('emby-button'); + // TODO replace all instances of element-showfocus with this method + if (layoutManager.tv) { + // handles all special css for tv layout + // this method utilizes class chaining + this.classList.add('show-focus'); + } +}; - this.classList.add('emby-button'); - // TODO replace all instances of element-showfocus with this method - if (layoutManager.tv) { - // handles all special css for tv layout - // this method utilizes class chaining - this.classList.add('show-focus'); - } - }; +EmbyButtonPrototype.attachedCallback = function () { + if (this.tagName === 'A') { + dom.removeEventListener(this, 'click', onAnchorClick, {}); + dom.addEventListener(this, 'click', onAnchorClick, {}); - EmbyButtonPrototype.attachedCallback = function () { - if (this.tagName === 'A') { - dom.removeEventListener(this, 'click', onAnchorClick, {}); - dom.addEventListener(this, 'click', onAnchorClick, {}); - - if (this.getAttribute('data-autohide') === 'true') { - if (appHost.supports('externallinks')) { - this.classList.remove('hide'); - } else { - this.classList.add('hide'); - } + if (this.getAttribute('data-autohide') === 'true') { + if (appHost.supports('externallinks')) { + this.classList.remove('hide'); + } else { + this.classList.add('hide'); } } - }; + } +}; - EmbyButtonPrototype.detachedCallback = function () { - dom.removeEventListener(this, 'click', onAnchorClick, {}); - }; +EmbyButtonPrototype.detachedCallback = function () { + dom.removeEventListener(this, 'click', onAnchorClick, {}); +}; - EmbyLinkButtonPrototype.createdCallback = EmbyButtonPrototype.createdCallback; - EmbyLinkButtonPrototype.attachedCallback = EmbyButtonPrototype.attachedCallback; +EmbyLinkButtonPrototype.createdCallback = EmbyButtonPrototype.createdCallback; +EmbyLinkButtonPrototype.attachedCallback = EmbyButtonPrototype.attachedCallback; - document.registerElement('emby-button', { - prototype: EmbyButtonPrototype, - extends: 'button' - }); +document.registerElement('emby-button', { + prototype: EmbyButtonPrototype, + extends: 'button' +}); - document.registerElement('emby-linkbutton', { - prototype: EmbyLinkButtonPrototype, - extends: 'a' - }); +document.registerElement('emby-linkbutton', { + prototype: EmbyLinkButtonPrototype, + extends: 'a' +}); - export default EmbyButtonPrototype; - -/* eslint-enable indent */ +export default EmbyButtonPrototype; diff --git a/src/elements/emby-button/paper-icon-button-light.js b/src/elements/emby-button/paper-icon-button-light.js index 5226f13db6..609dec2967 100644 --- a/src/elements/emby-button/paper-icon-button-light.js +++ b/src/elements/emby-button/paper-icon-button-light.js @@ -2,21 +2,17 @@ import layoutManager from 'layoutManager'; import 'css!./emby-button'; import 'registerElement'; -/* eslint-disable indent */ +const EmbyButtonPrototype = Object.create(HTMLButtonElement.prototype); - const EmbyButtonPrototype = Object.create(HTMLButtonElement.prototype); +EmbyButtonPrototype.createdCallback = function () { + this.classList.add('paper-icon-button-light'); - EmbyButtonPrototype.createdCallback = function () { - this.classList.add('paper-icon-button-light'); + if (layoutManager.tv) { + this.classList.add('show-focus'); + } +}; - if (layoutManager.tv) { - this.classList.add('show-focus'); - } - }; - - document.registerElement('paper-icon-button-light', { - prototype: EmbyButtonPrototype, - extends: 'button' - }); - -/* eslint-enable indent */ +document.registerElement('paper-icon-button-light', { + prototype: EmbyButtonPrototype, + extends: 'button' +}); From 523231fcd1a474d189a061e7e6914ab4e201468a Mon Sep 17 00:00:00 2001 From: Cameron Date: Fri, 17 Jul 2020 17:43:39 +0100 Subject: [PATCH 107/244] Migration of metadataeditor and personeditor to ES6 modules This reverts commit e75ff1fb9a12dbfe4a99a9dad4a0ea31a6343894. --- package.json | 2 + src/components/itemContextMenu.js | 2 +- .../metadataEditor/metadataEditor.js | 212 ++++++++++-------- src/components/metadataEditor/personEditor.js | 31 ++- 4 files changed, 139 insertions(+), 108 deletions(-) diff --git a/package.json b/package.json index b911778bc2..32ae3a2c01 100644 --- a/package.json +++ b/package.json @@ -111,6 +111,8 @@ "src/components/lazyLoader/lazyLoaderIntersectionObserver.js", "src/components/mediaLibraryCreator/mediaLibraryCreator.js", "src/components/mediaLibraryEditor/mediaLibraryEditor.js", + "src/components/metadataEditor/metadataEditor.js", + "src/components/metadataEditor/personEditor.js", "src/components/listview/listview.js", "src/components/playback/brightnessosd.js", "src/components/playback/mediasession.js", diff --git a/src/components/itemContextMenu.js b/src/components/itemContextMenu.js index 584b25f0e4..68fbbb74c5 100644 --- a/src/components/itemContextMenu.js +++ b/src/components/itemContextMenu.js @@ -554,7 +554,7 @@ define(['apphost', 'globalize', 'connectionManager', 'itemHelper', 'appRouter', }); } else { require(['metadataEditor'], function (metadataEditor) { - metadataEditor.show(item.Id, serverId).then(resolve, reject); + metadataEditor.default.show(item.Id, serverId).then(resolve, reject); }); } }); diff --git a/src/components/metadataEditor/metadataEditor.js b/src/components/metadataEditor/metadataEditor.js index 61a4ba7f24..9977ae1ead 100644 --- a/src/components/metadataEditor/metadataEditor.js +++ b/src/components/metadataEditor/metadataEditor.js @@ -1,9 +1,30 @@ -define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loading', 'focusManager', 'connectionManager', 'globalize', 'require', 'shell', 'emby-checkbox', 'emby-input', 'emby-select', 'listViewStyle', 'emby-textarea', 'emby-button', 'paper-icon-button-light', 'css!./../formdialog', 'clearButtonStyle', 'flexStyles'], function (itemHelper, dom, layoutManager, dialogHelper, datetime, loading, focusManager, connectionManager, globalize, require, shell) { - 'use strict'; +import itemHelper from 'itemHelper'; +import dom from 'dom'; +import layoutManager from 'layoutManager'; +import dialogHelper from 'dialogHelper'; +import datetime from 'datetime'; +import loading from 'loading'; +import focusManager from 'focusManager'; +import connectionManager from 'connectionManager'; +import globalize from 'globalize'; +import require from 'require'; +import shell from 'shell'; +import 'emby-checkbox'; +import 'emby-input'; +import 'emby-select'; +import 'listViewStyle'; +import 'emby-textarea'; +import 'emby-button'; +import 'paper-icon-button-light'; +import 'css!./../formdialog'; +import 'clearButtonStyle'; +import 'flexStyles'; - var currentContext; - var metadataEditorInfo; - var currentItem; +/* eslint-disable indent */ + + let currentContext; + let metadataEditorInfo; + let currentItem; function isDialog() { return currentContext.classList.contains('dialog'); @@ -28,11 +49,11 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi closeDialog(true); } - var apiClient = getApiClient(); + const apiClient = getApiClient(); apiClient.updateItem(item).then(function () { - var newContentType = form.querySelector('#selectContentType').value || ''; + const newContentType = form.querySelector('#selectContentType').value || ''; if ((metadataEditorInfo.ContentType || '') !== newContentType) { @@ -56,7 +77,7 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi } function getSelectedAirDays(form) { - var checkedItems = form.querySelectorAll('.chkAirDay:checked') || []; + const checkedItems = form.querySelectorAll('.chkAirDay:checked') || []; return Array.prototype.map.call(checkedItems, function (c) { return c.getAttribute('data-day'); }); @@ -92,7 +113,7 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi function getDateValue(form, element, property) { - var val = form.querySelector(element).value; + let val = form.querySelector(element).value; if (!val) { return null; @@ -100,14 +121,14 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi if (currentItem[property]) { - var date = datetime.parseISO8601Date(currentItem[property], true); + const date = datetime.parseISO8601Date(currentItem[property], true); - var parts = date.toISOString().split('T'); + const parts = date.toISOString().split('T'); // If the date is the same, preserve the time if (parts[0].indexOf(val) === 0) { - var iso = parts[1]; + const iso = parts[1]; val += 'T' + iso; } @@ -120,9 +141,9 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi loading.show(); - var form = this; + const form = this; - var item = { + const item = { Id: currentItem.Id, Name: form.querySelector('#txtName').value, OriginalTitle: form.querySelector('#txtOriginalName').value, @@ -168,9 +189,9 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi item.ProviderIds = Object.assign({}, currentItem.ProviderIds); - var idElements = form.querySelectorAll('.txtExternalId'); + const idElements = form.querySelectorAll('.txtExternalId'); Array.prototype.map.call(idElements, function (idElem) { - var providerKey = idElem.getAttribute('data-providerkey'); + const providerKey = idElem.getAttribute('data-providerkey'); item.ProviderIds[providerKey] = idElem.value; }); @@ -179,7 +200,7 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi if (currentItem.Type === 'Person') { - var placeOfBirth = form.querySelector('#txtPlaceOfBirth').value; + const placeOfBirth = form.querySelector('#txtPlaceOfBirth').value; item.ProductionLocations = placeOfBirth ? [placeOfBirth] : []; } @@ -187,11 +208,11 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi if (currentItem.Type === 'Series') { // 600000000 - var seriesRuntime = form.querySelector('#txtSeriesRuntime').value; + const seriesRuntime = form.querySelector('#txtSeriesRuntime').value; item.RunTimeTicks = seriesRuntime ? (seriesRuntime * 600000000) : null; } - var tagline = form.querySelector('#txtTagline').value; + const tagline = form.querySelector('#txtTagline').value; item.Taglines = tagline ? [tagline] : []; submitUpdatedItem(form, item); @@ -215,8 +236,8 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi prompt({ label: 'Value:' }).then(function (text) { - var list = dom.parentWithClass(source, 'editableListviewContainer').querySelector('.paperList'); - var items = getListValues(list); + const list = dom.parentWithClass(source, 'editableListviewContainer').querySelector('.paperList'); + const items = getListValues(list); items.push(text); populateListView(list, items, sortCallback); }); @@ -224,7 +245,7 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi } function removeElementFromList(source) { - var el = dom.parentWithClass(source, 'listItem'); + const el = dom.parentWithClass(source, 'listItem'); el.parentNode.removeChild(el); } @@ -234,7 +255,7 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi personEditor.show(person).then(function (updatedPerson) { - var isNew = index === -1; + const isNew = index === -1; if (isNew) { currentItem.People.push(updatedPerson); @@ -247,13 +268,13 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi function onEditorClick(e) { - var btnRemoveFromEditorList = dom.parentWithClass(e.target, 'btnRemoveFromEditorList'); + const btnRemoveFromEditorList = dom.parentWithClass(e.target, 'btnRemoveFromEditorList'); if (btnRemoveFromEditorList) { removeElementFromList(btnRemoveFromEditorList); return; } - var btnAddTextItem = dom.parentWithClass(e.target, 'btnAddTextItem'); + const btnAddTextItem = dom.parentWithClass(e.target, 'btnAddTextItem'); if (btnAddTextItem) { addElementToList(btnAddTextItem); } @@ -264,7 +285,7 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi } function bindAll(elems, eventName, fn) { - for (var i = 0, length = elems.length; i < length; i++) { + for (let i = 0, length = elems.length; i < length; i++) { elems[i].addEventListener(eventName, fn); } } @@ -272,11 +293,11 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi function init(context, apiClient) { context.querySelector('.externalIds').addEventListener('click', function (e) { - var btnOpenExternalId = dom.parentWithClass(e.target, 'btnOpenExternalId'); + const btnOpenExternalId = dom.parentWithClass(e.target, 'btnOpenExternalId'); if (btnOpenExternalId) { - var field = context.querySelector('#' + btnOpenExternalId.getAttribute('data-fieldid')); + const field = context.querySelector('#' + btnOpenExternalId.getAttribute('data-fieldid')); - var formatString = field.getAttribute('data-formatstring'); + const formatString = field.getAttribute('data-formatstring'); if (field.value) { shell.openUrl(formatString.replace('{0}', field.value)); @@ -311,7 +332,7 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi context.removeEventListener('click', onEditorClick); context.addEventListener('click', onEditorClick); - var form = context.querySelector('form'); + const form = context.querySelector('form'); form.removeEventListener('submit', onSubmit); form.addEventListener('submit', onSubmit); @@ -322,15 +343,15 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi context.querySelector('#peopleList').addEventListener('click', function (e) { - var index; - var btnDeletePerson = dom.parentWithClass(e.target, 'btnDeletePerson'); + let index; + const btnDeletePerson = dom.parentWithClass(e.target, 'btnDeletePerson'); if (btnDeletePerson) { index = parseInt(btnDeletePerson.getAttribute('data-index')); currentItem.People.splice(index, 1); populatePeople(context, currentItem.People); } - var btnEditPerson = dom.parentWithClass(e.target, 'btnEditPerson'); + const btnEditPerson = dom.parentWithClass(e.target, 'btnEditPerson'); if (btnEditPerson) { index = parseInt(btnEditPerson.getAttribute('data-index')); editPerson(context, currentItem.People[index], index); @@ -340,7 +361,7 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi function getItem(itemId, serverId) { - var apiClient = connectionManager.getApiClient(serverId); + const apiClient = connectionManager.getApiClient(serverId); if (itemId) { return apiClient.getItem(apiClient.getCurrentUserId(), itemId); @@ -351,7 +372,7 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi function getEditorConfig(itemId, serverId) { - var apiClient = connectionManager.getApiClient(serverId); + const apiClient = connectionManager.getApiClient(serverId); if (itemId) { return apiClient.getJSON(apiClient.getUrl('Items/' + itemId + '/MetadataEditor')); @@ -362,13 +383,13 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi function populateCountries(select, allCountries) { - var html = ''; + let html = ''; html += ""; - for (var i = 0, length = allCountries.length; i < length; i++) { + for (let i = 0, length = allCountries.length; i < length; i++) { - var culture = allCountries[i]; + const culture = allCountries[i]; html += "'; } @@ -378,13 +399,13 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi function populateLanguages(select, languages) { - var html = ''; + let html = ''; html += ""; - for (var i = 0, length = languages.length; i < length; i++) { + for (let i = 0, length = languages.length; i < length; i++) { - var culture = languages[i]; + const culture = languages[i]; html += "'; } @@ -400,41 +421,41 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi showElement('#fldContentType', context); } - var html = metadataInfo.ContentTypeOptions.map(function (i) { + const html = metadataInfo.ContentTypeOptions.map(function (i) { return ''; }).join(''); - var selectEl = context.querySelector('#selectContentType'); + const selectEl = context.querySelector('#selectContentType'); selectEl.innerHTML = html; selectEl.value = metadataInfo.ContentType || ''; } function loadExternalIds(context, item, externalIds) { - var html = ''; + let html = ''; - var providerIds = item.ProviderIds || {}; + const providerIds = item.ProviderIds || {}; - for (var i = 0, length = externalIds.length; i < length; i++) { + for (let i = 0, length = externalIds.length; i < length; i++) { - var idInfo = externalIds[i]; + const idInfo = externalIds[i]; - var id = 'txt1' + idInfo.Key; - var formatString = idInfo.UrlFormatString || ''; + const id = 'txt1' + idInfo.Key; + const formatString = idInfo.UrlFormatString || ''; - var fullName = idInfo.Name; + let fullName = idInfo.Name; if (idInfo.Type) { fullName = idInfo.Name + ' ' + globalize.translate(idInfo.Type); } - var labelText = globalize.translate('LabelDynamicExternalId', fullName); + const labelText = globalize.translate('LabelDynamicExternalId', fullName); html += '
'; html += '
'; - var value = providerIds[idInfo.Key] || ''; + const value = providerIds[idInfo.Key] || ''; html += '
'; html += ''; @@ -448,7 +469,7 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi html += '
'; } - var elem = context.querySelector('.externalIds', context); + const elem = context.querySelector('.externalIds', context); elem.innerHTML = html; if (externalIds.length) { @@ -465,7 +486,7 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi context = context || document; if (typeof selector === 'string') { - var elements = multiple ? context.querySelectorAll(selector) : [context.querySelector(selector)]; + const elements = multiple ? context.querySelectorAll(selector) : [context.querySelector(selector)]; Array.prototype.forEach.call(elements, function (el) { if (el) { @@ -484,7 +505,7 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi context = context || document; if (typeof selector === 'string') { - var elements = multiple ? context.querySelectorAll(selector) : [context.querySelector(selector)]; + const elements = multiple ? context.querySelectorAll(selector) : [context.querySelector(selector)]; Array.prototype.forEach.call(elements, function (el) { if (el) { @@ -686,7 +707,7 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi function fillItemInfo(context, item, parentalRatingOptions) { - var select = context.querySelector('#selectOfficialRating'); + let select = context.querySelector('#selectOfficialRating'); populateRatings(parentalRatingOptions, select, item.OfficialRating); @@ -698,7 +719,7 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi select.value = item.CustomRating || ''; - var selectStatus = context.querySelector('#selectStatus'); + const selectStatus = context.querySelector('#selectStatus'); populateStatus(selectStatus); selectStatus.value = item.Status || ''; @@ -717,8 +738,8 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi populateListView(context.querySelector('#listTags'), item.Tags); - var lockData = (item.LockData || false); - var chkLockData = context.querySelector('#chkLockData'); + const lockData = (item.LockData || false); + const chkLockData = context.querySelector('#chkLockData'); chkLockData.checked = lockData; if (chkLockData.checked) { hideElement('.providerSettingsContainer', context); @@ -756,7 +777,7 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi return a.Name; }).join(';'); - var date; + let date; if (item.DateCreated) { try { @@ -798,7 +819,7 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi context.querySelector('#txtAirTime').value = item.AirTime || ''; - var placeofBirth = item.ProductionLocations && item.ProductionLocations.length ? item.ProductionLocations[0] : ''; + const placeofBirth = item.ProductionLocations && item.ProductionLocations.length ? item.ProductionLocations[0] : ''; context.querySelector('#txtPlaceOfBirth').value = placeofBirth; context.querySelector('#txtOriginalAspectRatio').value = item.AspectRatio || ''; @@ -808,7 +829,7 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi if (item.RunTimeTicks) { - var minutes = item.RunTimeTicks / 600000000; + const minutes = item.RunTimeTicks / 600000000; context.querySelector('#txtSeriesRuntime').value = Math.round(minutes); } else { @@ -818,18 +839,16 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi function populateRatings(allParentalRatings, select, currentValue) { - var html = ''; + let html = ''; html += ""; - var ratings = []; - var i; - var length; - var rating; + const ratings = []; + let rating; - var currentValueFound = false; + let currentValueFound = false; - for (i = 0, length = allParentalRatings.length; i < length; i++) { + for (let i = 0, length = allParentalRatings.length; i < length; i++) { rating = allParentalRatings[i]; @@ -844,7 +863,7 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi ratings.push({ Name: currentValue, Value: currentValue }); } - for (i = 0, length = ratings.length; i < length; i++) { + for (let i = 0, length = ratings.length; i < length; i++) { rating = ratings[i]; @@ -855,7 +874,7 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi } function populateStatus(select) { - var html = ''; + let html = ''; html += ""; html += "'; @@ -873,8 +892,8 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi } else { items = sortCallback(items); } - var html = ''; - for (var i = 0; i < items.length; i++) { + let html = ''; + for (let i = 0; i < items.length; i++) { html += '
'; html += ''; @@ -897,14 +916,14 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi function populatePeople(context, people) { - var lastType = ''; - var html = ''; + let lastType = ''; + let html = ''; - var elem = context.querySelector('#peopleList'); + const elem = context.querySelector('#peopleList'); - for (var i = 0, length = people.length; i < length; i++) { + for (let i = 0, length = people.length; i < length; i++) { - var person = people[i]; + const person = people[i]; html += '
'; @@ -934,13 +953,13 @@ define(['itemHelper', 'dom', 'layoutManager', 'dialogHelper', 'datetime', 'loadi function getLockedFieldsHtml(fields, currentFields) { - var html = ''; - for (var i = 0; i < fields.length; i++) { + let html = ''; + for (let i = 0; i < fields.length; i++) { - var field = fields[i]; - var name = field.name; - var value = field.value || field.name; - var checkedHtml = currentFields.indexOf(value) === -1 ? ' checked' : ''; + const field = fields[i]; + const name = field.name; + const value = field.value || field.name; + const checkedHtml = currentFields.indexOf(value) === -1 ? ' checked' : ''; html += '