From cfd2ec1ddca3e017a6603e693a2c9c59520bd2f8 Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Tue, 16 Jun 2020 23:45:03 +0300 Subject: [PATCH 01/29] 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 02/29] 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 999f27614081f687d500bafa87ad4803d5ebb0ee Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Thu, 18 Jun 2020 22:34:03 +0300 Subject: [PATCH 03/29] 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 04/29] 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 05/29] 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 06/29] 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 0aeff0b4648f265ee2e4b90127162d086fa5b358 Mon Sep 17 00:00:00 2001 From: grafixeyehero Date: Sun, 21 Jun 2020 05:53:59 +0300 Subject: [PATCH 07/29] 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 08/29] 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 09/29] 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 8af1a74fd288675aa878ac5569d6cc392a1c5c29 Mon Sep 17 00:00:00 2001 From: Cameron Date: Wed, 8 Jul 2020 16:19:44 +0100 Subject: [PATCH 10/29] 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 5a1e01c650de030e28693ff80c046a85bb8b307f Mon Sep 17 00:00:00 2001 From: Cameron Date: Wed, 8 Jul 2020 16:40:30 +0100 Subject: [PATCH 11/29] 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 d07a0aa3a9da5d949ff2270491ff0a48071cd1d3 Mon Sep 17 00:00:00 2001 From: Cameron Date: Wed, 8 Jul 2020 18:01:19 +0100 Subject: [PATCH 12/29] 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 13/29] 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 14/29] 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 8ad12fa0bbee164443af9f049ae5eaf5959389dc Mon Sep 17 00:00:00 2001 From: Cameron Date: Thu, 9 Jul 2020 14:23:41 +0100 Subject: [PATCH 15/29] 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 b4e43f2436981e3d4201ac201e8cff662d50bb53 Mon Sep 17 00:00:00 2001 From: Cameron Date: Fri, 10 Jul 2020 18:09:02 +0100 Subject: [PATCH 16/29] 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 17/29] 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 18/29] 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 e31cae5af8704552328d864a3707a7ed0b4dac16 Mon Sep 17 00:00:00 2001 From: Cameron Date: Sat, 11 Jul 2020 09:52:35 +0100 Subject: [PATCH 19/29] 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 7b509fdde4ef0d129ed2805bc19d00fd27cfecb1 Mon Sep 17 00:00:00 2001 From: Cameron Date: Sat, 11 Jul 2020 16:54:20 +0100 Subject: [PATCH 25/29] 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 1c2399c70e2aab9bae1365f3589cd2e8998f96f7 Mon Sep 17 00:00:00 2001 From: Cameron Date: Tue, 14 Jul 2020 13:50:37 +0100 Subject: [PATCH 26/29] 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 27/29] 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 93b9be9c5c56619e6a869cd110cec4ba5f35d10a Mon Sep 17 00:00:00 2001 From: dkanada Date: Sun, 19 Jul 2020 14:05:32 +0900 Subject: [PATCH 28/29] remove empty line --- package.json | 1 - 1 file changed, 1 deletion(-) diff --git a/package.json b/package.json index 629d7c7329..10d59f08e3 100644 --- a/package.json +++ b/package.json @@ -105,7 +105,6 @@ "src/components/dialogHelper/dialogHelper.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", From 54b4b3e11a3bd34deb01cdbf5a0bde8407f72fdd Mon Sep 17 00:00:00 2001 From: Cameron Date: Sun, 19 Jul 2020 10:15:23 +0100 Subject: [PATCH 29/29] fix typo --- src/components/homesections/homesections.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/homesections/homesections.js b/src/components/homesections/homesections.js index bae24a0eb0..010b6b1a78 100644 --- a/src/components/homesections/homesections.js +++ b/src/components/homesections/homesections.js @@ -355,7 +355,7 @@ import 'css!./homesections'; }); } - export function loadLibraryTiles(elem, apiCdflient, user, userSettings, shape, userViews, allSections) { + export function loadLibraryTiles(elem, apiClient, user, userSettings, shape, userViews, allSections) { let html = ''; if (userViews.length) { html += '

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

';