mirrors/jellyfin-web
1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00
Code Activity

Merge branch 'es6' into es6-migration-6

Browse source
This commit is contained in:
dkanada 2020-07-19 14:13:15 +09:00 • committed by GitHub
commit acb9244b5a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
32 changed files with 779 additions and 630 deletions
Download patch file Download diff file Expand all files Collapse all files

20
package.json
View file

@ -94,11 +94,13 @@
"src/components/actionSheet/actionSheet.js",
"src/components/alphaPicker/alphaPicker.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",
"src/components/displaySettings/displaySettings.js",
"src/components/homeScreenSettings/homeScreenSettings.js",
"src/components/directorybrowser/directorybrowser.js",
"src/components/collectionEditor/collectionEditor.js",
"src/components/dialog/dialog.js",
"src/components/dialogHelper/dialogHelper.js",
@ -106,9 +108,11 @@
"src/components/images/imageLoader.js",
"src/components/imageUploader/imageUploader.js",
"src/components/indicators/indicators.js",
"src/components/itemContextMenu.js",
"src/components/itemidentifier/itemidentifier.js",
"src/components/itemMediaInfo/itemMediaInfo.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",
@ -136,9 +140,25 @@
"src/components/syncPlay/playbackPermissionManager.js",
"src/components/syncPlay/syncPlayManager.js",
"src/components/syncPlay/timeSyncManager.js",
"src/controllers/dashboard/apikeys.js",
"src/controllers/dashboard/dashboard.js",
"src/controllers/dashboard/encodingsettings.js",
"src/controllers/dashboard/logs.js",
"src/controllers/user/subtitles.js",
"src/controllers/dashboard/plugins/repositories.js",
"src/elements/emby-checkbox/emby-checkbox.js",
"src/elements/emby-itemrefreshindicator/emby-itemrefreshindicator.js",
"src/elements/emby-progressbar/emby-progressbar.js",
"src/elements/emby-progressring/emby-progressring.js",
"src/elements/emby-radio/emby-radio.js",
"src/elements/emby-ratingbutton/emby-ratingbutton.js",
"src/elements/emby-scrollbuttons/emby-scrollbuttons.js",
"src/elements/emby-scroller/emby-scroller.js",
"src/elements/emby-select/emby-select.js",
"src/elements/emby-slider/emby-slider.js",
"src/elements/emby-tabs/emby-tabs.js",
"src/elements/emby-textarea/emby-textarea.js",
"src/elements/emby-toggle/emby-toggle.js",
"src/plugins/bookPlayer/plugin.js",
"src/plugins/bookPlayer/tableOfContents.js",
"src/plugins/photoPlayer/plugin.js",

4
src/components/appRouter.js
View file

@ -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');

108
src/components/backdrop/backdrop.js
View file

@ -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,22 +28,20 @@ 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 () {
img.onload = () => {
if (self.isDestroyed) {
return;
}
var backdropImage = document.createElement('div');
const backdropImage = document.createElement('div');
backdropImage.classList.add('backdropImage');
backdropImage.classList.add('displayingBackdropImage');
backdropImage.style.backgroundImage = "url('" + url + "')";
backdropImage.style.backgroundImage = `url('${url}')`;
backdropImage.setAttribute('data-url', url);
backdropImage.classList.add('backdropImageFadeIn');
@ -51,7 +55,7 @@ define(['browser', 'connectionManager', 'playbackManager', 'dom', 'userSettings'
return;
}
var onAnimationComplete = function () {
const onAnimationComplete = () => {
dom.removeEventListener(backdropImage, dom.whichAnimationEvent(), onAnimationComplete, {
once: true
});
@ -71,22 +75,23 @@ define(['browser', 'connectionManager', 'playbackManager', 'dom', 'userSettings'
};
img.src = url;
};
}
Backdrop.prototype.cancelAnimation = function () {
var elem = this.currentAnimatingElement;
cancelAnimation() {
const elem = this.currentAnimatingElement;
if (elem) {
elem.classList.remove('backdropImageFadeIn');
this.currentAnimatingElement = null;
}
};
}
Backdrop.prototype.destroy = function () {
destroy() {
this.isDestroyed = true;
this.cancelAnimation();
};
}
}
var backdropContainer;
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,31 +140,27 @@ 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();
}
function getRandom(min, max) {
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 +169,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 +177,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 +190,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 +204,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 +230,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 +243,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 +280,7 @@ define(['browser', 'connectionManager', 'playbackManager', 'dom', 'userSettings'
return;
}
var newIndex = currentRotationIndex + 1;
let newIndex = currentRotationIndex + 1;
if (newIndex >= currentRotatingImages.length) {
newIndex = 0;
}
@ -289,7 +290,7 @@ define(['browser', 'connectionManager', 'playbackManager', 'dom', 'userSettings'
}
function clearRotation() {
var interval = rotationInterval;
const interval = rotationInterval;
if (interval) {
clearInterval(interval);
}
@ -299,7 +300,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 +313,11 @@ define(['browser', 'connectionManager', 'playbackManager', 'dom', 'userSettings'
}
}
return {
/* eslint-enable indent */
export default {
setBackdrops: setBackdrops,
setBackdrop: setBackdrop,
clear: clearBackdrop,
clearBackdrop: clearBackdrop,
externalBackdrop: externalBackdrop
};
});
};

122
src/components/directorybrowser/directorybrowser.js
View file

@ -1,9 +1,19 @@
define(['loading', 'dialogHelper', 'dom', 'globalize', 'listViewStyle', 'emby-input', 'paper-icon-button-light', 'css!./directorybrowser', 'formDialogStyle', 'emby-button'], function(loading, dialogHelper, dom, globalize) {
'use strict';
import loading from 'loading';
import dialogHelper from 'dialogHelper';
import dom from 'dom';
import globalize from 'globalize';
import 'listViewStyle';
import 'emby-input';
import 'paper-icon-button-light';
import 'css!./directorybrowser';
import 'formDialogStyle';
import 'emby-button';
/* eslint-disable indent */
function getSystemInfo() {
return systemInfo ? Promise.resolve(systemInfo) : ApiClient.getPublicSystemInfo().then(
function(info) {
info => {
systemInfo = info;
return info;
}
@ -21,9 +31,9 @@ define(['loading', 'dialogHelper', 'dom', 'globalize', 'listViewStyle', 'emby-in
loading.show();
var promises = [];
const promises = [];
if ('Network' === path) {
if (path === 'Network') {
promises.push(ApiClient.getNetworkDevices());
} else {
if (path) {
@ -35,10 +45,10 @@ define(['loading', 'dialogHelper', 'dom', 'globalize', 'listViewStyle', 'emby-in
}
Promise.all(promises).then(
function(responses) {
var folders = responses[0];
var parentPath = responses[1] || '';
var html = '';
responses => {
const folders = responses[0];
const parentPath = responses[1] || '';
let html = '';
page.querySelector('.results').scrollTop = 0;
page.querySelector('#txtDirectoryPickerPath').value = path || '';
@ -46,9 +56,9 @@ define(['loading', 'dialogHelper', 'dom', 'globalize', 'listViewStyle', 'emby-in
if (path) {
html += getItem('lnkPath lnkDirectory', '', parentPath, '...');
}
for (var i = 0, length = folders.length; i < length; i++) {
var folder = folders[i];
var cssClass = 'File' === folder.Type ? 'lnkPath lnkFile' : 'lnkPath lnkDirectory';
for (let i = 0, length = folders.length; i < length; i++) {
const folder = folders[i];
const cssClass = folder.Type === 'File' ? 'lnkPath lnkFile' : 'lnkPath lnkDirectory';
html += getItem(cssClass, folder.Type, folder.Path, folder.Name);
}
@ -58,7 +68,7 @@ define(['loading', 'dialogHelper', 'dom', 'globalize', 'listViewStyle', 'emby-in
page.querySelector('.results').innerHTML = html;
loading.hide();
}, function() {
}, () => {
if (updatePathOnError) {
page.querySelector('#txtDirectoryPickerPath').value = '';
page.querySelector('.results').innerHTML = '';
@ -69,8 +79,8 @@ define(['loading', 'dialogHelper', 'dom', 'globalize', 'listViewStyle', 'emby-in
}
function getItem(cssClass, type, path, name) {
var html = '';
html += '<div class="listItem listItem-border ' + cssClass + '" data-type="' + type + '" data-path="' + path + '">';
let html = '';
html += `<div class="listItem listItem-border ${cssClass}" data-type="${type}" data-path="${path}">`;
html += '<div class="listItemBody" style="padding-left:0;padding-top:.5em;padding-bottom:.5em;">';
html += '<div class="listItemBodyText">';
html += name;
@ -82,19 +92,19 @@ define(['loading', 'dialogHelper', 'dom', 'globalize', 'listViewStyle', 'emby-in
}
function getEditorHtml(options, systemInfo) {
var html = '';
let html = '';
html += '<div class="formDialogContent scrollY">';
html += '<div class="dialogContentInner dialog-content-centered" style="padding-top:2em;">';
if (!options.pathReadOnly) {
var instruction = options.instruction ? options.instruction + '<br/><br/>' : '';
const instruction = options.instruction ? `${options.instruction}<br/><br/>` : '';
html += '<div class="infoBanner" style="margin-bottom:1.5em;">';
html += instruction;
if ('bsd' === systemInfo.OperatingSystem.toLowerCase()) {
if (systemInfo.OperatingSystem.toLowerCase() === 'bsd') {
html += '<br/>';
html += '<br/>';
html += globalize.translate('MessageDirectoryPickerBSDInstruction');
html += '<br/>';
} else if ('linux' === systemInfo.OperatingSystem.toLowerCase()) {
} else if (systemInfo.OperatingSystem.toLowerCase() === 'linux') {
html += '<br/>';
html += '<br/>';
html += globalize.translate('MessageDirectoryPickerLinuxInstruction');
@ -105,17 +115,17 @@ define(['loading', 'dialogHelper', 'dom', 'globalize', 'listViewStyle', 'emby-in
html += '<form style="margin:auto;">';
html += '<div class="inputContainer" style="display: flex; align-items: center;">';
html += '<div style="flex-grow:1;">';
var labelKey;
let labelKey;
if (options.includeFiles !== true) {
labelKey = 'LabelFolder';
} else {
labelKey = 'LabelPath';
}
var readOnlyAttribute = options.pathReadOnly ? ' readonly' : '';
html += '<input is="emby-input" id="txtDirectoryPickerPath" type="text" required="required" ' + readOnlyAttribute + ' label="' + globalize.translate(labelKey) + '"/>';
const readOnlyAttribute = options.pathReadOnly ? ' readonly' : '';
html += `<input is="emby-input" id="txtDirectoryPickerPath" type="text" required="required" ${readOnlyAttribute} label="${globalize.translate(labelKey)}"/>`;
html += '</div>';
if (!readOnlyAttribute) {
html += '<button type="button" is="paper-icon-button-light" class="btnRefreshDirectories emby-input-iconbutton" title="' + globalize.translate('ButtonRefresh') + '"><span class="material-icons search"></span></button>';
html += `<button type="button" is="paper-icon-button-light" class="btnRefreshDirectories emby-input-iconbutton" title="${globalize.translate('ButtonRefresh')}"><span class="material-icons search"></span></button>`;
}
html += '</div>';
if (!readOnlyAttribute) {
@ -123,14 +133,14 @@ define(['loading', 'dialogHelper', 'dom', 'globalize', 'listViewStyle', 'emby-in
}
if (options.enableNetworkSharePath) {
html += '<div class="inputContainer" style="margin-top:2em;">';
html += '<input is="emby-input" id="txtNetworkPath" type="text" label="' + globalize.translate('LabelOptionalNetworkPath') + '"/>';
html += `<input is="emby-input" id="txtNetworkPath" type="text" label="${globalize.translate('LabelOptionalNetworkPath')}"/>`;
html += '<div class="fieldDescription">';
html += globalize.translate('LabelOptionalNetworkPathHelp', '<b>\\\\server</b>', '<b>\\\\192.168.1.101</b>');
html += '</div>';
html += '</div>';
}
html += '<div class="formDialogFooter">';
html += '<button is="emby-button" type="submit" class="raised button-submit block formDialogFooterItem">' + globalize.translate('ButtonOk') + '</button>';
html += `<button is="emby-button" type="submit" class="raised button-submit block formDialogFooterItem">${globalize.translate('ButtonOk')}</button>`;
html += '</div>';
html += '</form>';
html += '</div>';
@ -147,7 +157,7 @@ define(['loading', 'dialogHelper', 'dom', 'globalize', 'listViewStyle', 'emby-in
}
function alertTextWithOptions(options) {
require(['alert'], function(alert) {
require(['alert'], alert => {
alert(options);
});
}
@ -160,7 +170,7 @@ define(['loading', 'dialogHelper', 'dom', 'globalize', 'listViewStyle', 'emby-in
ValidateWriteable: validateWriteable,
Path: path
}
}).catch(function(response) {
}).catch(response => {
if (response) {
if (response.status === 404) {
alertText(globalize.translate('PathNotFound'));
@ -180,10 +190,10 @@ define(['loading', 'dialogHelper', 'dom', 'globalize', 'listViewStyle', 'emby-in
}
function initEditor(content, options, fileOptions) {
content.addEventListener('click', function(e) {
var lnkPath = dom.parentWithClass(e.target, 'lnkPath');
content.addEventListener('click', e => {
const lnkPath = dom.parentWithClass(e.target, 'lnkPath');
if (lnkPath) {
var path = lnkPath.getAttribute('data-path');
const path = lnkPath.getAttribute('data-path');
if (lnkPath.classList.contains('lnkFile')) {
content.querySelector('#txtDirectoryPickerPath').value = path;
} else {
@ -192,25 +202,25 @@ define(['loading', 'dialogHelper', 'dom', 'globalize', 'listViewStyle', 'emby-in
}
});
content.addEventListener('click', function(e) {
content.addEventListener('click', e => {
if (dom.parentWithClass(e.target, 'btnRefreshDirectories')) {
var path = content.querySelector('#txtDirectoryPickerPath').value;
const path = content.querySelector('#txtDirectoryPickerPath').value;
refreshDirectoryBrowser(content, path, fileOptions);
}
});
content.addEventListener('change', function(e) {
var txtDirectoryPickerPath = dom.parentWithTag(e.target, 'INPUT');
if (txtDirectoryPickerPath && 'txtDirectoryPickerPath' === txtDirectoryPickerPath.id) {
content.addEventListener('change', e => {
const txtDirectoryPickerPath = dom.parentWithTag(e.target, 'INPUT');
if (txtDirectoryPickerPath && txtDirectoryPickerPath.id === 'txtDirectoryPickerPath') {
refreshDirectoryBrowser(content, txtDirectoryPickerPath.value, fileOptions);
}
});
content.querySelector('form').addEventListener('submit', function(e) {
if (options.callback) {
var networkSharePath = this.querySelector('#txtNetworkPath');
let networkSharePath = this.querySelector('#txtNetworkPath');
networkSharePath = networkSharePath ? networkSharePath.value : null;
var path = this.querySelector('#txtDirectoryPickerPath').value;
const path = this.querySelector('#txtDirectoryPickerPath').value;
validatePath(path, options.validateWriteable, ApiClient).then(options.callback(path, networkSharePath));
}
e.preventDefault();
@ -224,21 +234,21 @@ define(['loading', 'dialogHelper', 'dom', 'globalize', 'listViewStyle', 'emby-in
return Promise.resolve(options.path);
} else {
return ApiClient.getJSON(ApiClient.getUrl('Environment/DefaultDirectoryBrowser')).then(
function(result) {
result => {
return result.Path || '';
}, function() {
}, () => {
return '';
}
);
}
}
function directoryBrowser() {
var currentDialog;
var self = this;
self.show = function(options) {
class directoryBrowser {
constructor() {
let currentDialog;
this.show = options => {
options = options || {};
var fileOptions = {
const fileOptions = {
includeDirectories: true
};
if (options.includeDirectories != null) {
@ -248,10 +258,10 @@ define(['loading', 'dialogHelper', 'dom', 'globalize', 'listViewStyle', 'emby-in
fileOptions.includeFiles = options.includeFiles;
}
Promise.all([getSystemInfo(), getDefaultPath(options)]).then(
function(responses) {
var systemInfo = responses[0];
var initialPath = responses[1];
var dlg = dialogHelper.createDialog({
responses => {
const systemInfo = responses[0];
const initialPath = responses[1];
const dlg = dialogHelper.createDialog({
size: 'small',
removeOnClose: true,
scrollY: false
@ -261,7 +271,7 @@ define(['loading', 'dialogHelper', 'dom', 'globalize', 'listViewStyle', 'emby-in
dlg.classList.add('directoryPicker');
dlg.classList.add('formDialog');
var html = '';
let html = '';
html += '<div class="formDialogHeader">';
html += '<button is="paper-icon-button-light" class="btnCloseDialog autoSize" tabindex="-1"><span class="material-icons arrow_back"></span></button>';
html += '<h3 class="formDialogHeaderTitle">';
@ -273,12 +283,12 @@ define(['loading', 'dialogHelper', 'dom', 'globalize', 'listViewStyle', 'emby-in
initEditor(dlg, options, fileOptions);
dlg.addEventListener('close', onDialogClosed);
dialogHelper.open(dlg);
dlg.querySelector('.btnCloseDialog').addEventListener('click', function() {
dlg.querySelector('.btnCloseDialog').addEventListener('click', () => {
dialogHelper.close(dlg);
});
currentDialog = dlg;
dlg.querySelector('#txtDirectoryPickerPath').value = initialPath;
var txtNetworkPath = dlg.querySelector('#txtNetworkPath');
const txtNetworkPath = dlg.querySelector('#txtNetworkPath');
if (txtNetworkPath) {
txtNetworkPath.value = options.networkSharePath || '';
}
@ -288,13 +298,15 @@ define(['loading', 'dialogHelper', 'dom', 'globalize', 'listViewStyle', 'emby-in
}
);
};
self.close = function() {
this.close = () => {
if (currentDialog) {
dialogHelper.close(currentDialog);
}
};
}
}
var systemInfo;
return directoryBrowser;
});
let systemInfo;
/* eslint-enable indent */
export default directoryBrowser;

104
src/components/itemContextMenu.js
View file

@ -1,14 +1,24 @@
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) {
var item = options.item;
var user = options.user;
/* eslint-disable indent */
var canPlay = playbackManager.canPlay(item);
var restrictOptions = (browser.operaTv || browser.web0s) && !user.Policy.IsAdministrator;
export function getCommands(options) {
const item = options.item;
const user = options.user;
var commands = [];
const canPlay = playbackManager.canPlay(item);
const restrictOptions = (browser.operaTv || browser.web0s) && !user.Policy.IsAdministrator;
let commands = [];
if (canPlay && item.MediaType !== 'Photo') {
if (options.play !== false) {
@ -161,10 +171,10 @@ define(['apphost', 'globalize', 'connectionManager', 'itemHelper', 'appRouter',
});
}
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',
@ -311,31 +321,31 @@ define(['apphost', 'globalize', 'connectionManager', 'itemHelper', 'appRouter',
}
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,
@ -346,17 +356,17 @@ define(['apphost', 'globalize', 'connectionManager', 'itemHelper', 'appRouter',
getResolveFunction(getResolveFunction(resolve, id), id)();
});
break;
case 'copy-stream':
var downloadHref = apiClient.getItemDownloadUrl(itemId);
var textAreaCopy = function () {
var textArea = document.createElement('textarea');
case 'copy-stream': {
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 {
@ -371,7 +381,7 @@ define(['apphost', 'globalize', 'connectionManager', 'itemHelper', 'appRouter',
} 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 () {
@ -380,8 +390,9 @@ define(['apphost', 'globalize', 'connectionManager', 'itemHelper', 'appRouter',
}
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;
@ -389,7 +400,7 @@ define(['apphost', 'globalize', 'connectionManager', 'itemHelper', 'appRouter',
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
@ -397,12 +408,12 @@ define(['apphost', 'globalize', 'connectionManager', 'itemHelper', 'appRouter',
});
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;
@ -431,7 +442,7 @@ define(['apphost', 'globalize', 'connectionManager', 'itemHelper', 'appRouter',
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;
@ -502,8 +513,8 @@ define(['apphost', 'globalize', 'connectionManager', 'itemHelper', 'appRouter',
}
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)();
});
@ -511,7 +522,7 @@ define(['apphost', 'globalize', 'connectionManager', 'itemHelper', 'appRouter',
}
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)();
});
@ -519,9 +530,9 @@ define(['apphost', 'globalize', 'connectionManager', 'itemHelper', 'appRouter',
}
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;
}
@ -542,18 +553,18 @@ define(['apphost', 'globalize', 'connectionManager', 'itemHelper', 'appRouter',
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);
});
}
@ -562,7 +573,7 @@ define(['apphost', 'globalize', 'connectionManager', 'itemHelper', 'appRouter',
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
@ -574,7 +585,7 @@ define(['apphost', 'globalize', 'connectionManager', 'itemHelper', 'appRouter',
}
function refresh(apiClient, item) {
require(['refreshDialog'], function (refreshDialog) {
import('refreshDialog').then(({default: refreshDialog}) => {
new refreshDialog({
itemIds: [item.Id],
serverId: apiClient.serverInfo().Id,
@ -583,8 +594,8 @@ define(['apphost', 'globalize', 'connectionManager', 'itemHelper', 'appRouter',
});
}
function show(options) {
var commands = getCommands(options);
export function show(options) {
const commands = getCommands(options);
if (!commands.length) {
return Promise.reject();
}
@ -598,8 +609,9 @@ define(['apphost', 'globalize', 'connectionManager', 'itemHelper', 'appRouter',
});
}
return {
/* eslint-enable indent */
export default {
getCommands: getCommands,
show: show
};
});
};

68
src/components/maintabsmanager.js
View file

@ -1,11 +1,16 @@
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';
var tabOwnerView;
var queryScope = document.querySelector('.skinHeader');
var footerTabsContainer;
var headerTabsContainer;
var tabsElem;
/* eslint-disable indent */
let tabOwnerView;
const queryScope = document.querySelector('.skinHeader');
let footerTabsContainer;
let headerTabsContainer;
let tabsElem;
function enableTabsInFooter() {
return false;
@ -44,7 +49,7 @@ define(['dom', 'browser', 'events', 'emby-tabs', 'emby-button'], function (dom,
return false;
}
var classList = elem.classList;
const classList = elem.classList;
if (classList) {
return !classList.contains('scrollX') && !classList.contains('animatedScrollX');
}
@ -52,7 +57,7 @@ define(['dom', 'browser', 'events', 'emby-tabs', 'emby-button'], function (dom,
return true;
}
var parent = target;
let parent = target;
while (parent != null) {
if (!allowSwipeOn(parent)) {
return false;
@ -70,22 +75,22 @@ define(['dom', 'browser', 'events', 'emby-tabs', 'emby-button'], function (dom,
}
// implement without hammer
var pageCount = getTabContainersFn().length;
var onSwipeLeft = function (e, target) {
const pageCount = getTabContainersFn().length;
const onSwipeLeft = function (e, target) {
if (allowSwipe(target) && view.contains(target)) {
tabsElem.selectNext();
}
};
var onSwipeRight = function (e, target) {
const 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);
@ -96,9 +101,9 @@ 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();
const enableInFooter = enableTabsInFooter();
if (!view) {
if (tabOwnerView) {
@ -129,7 +134,7 @@ define(['dom', 'browser', 'events', 'emby-tabs', 'emby-button'], function (dom,
ensureElements(enableInFooter);
var tabsContainerElem = enableInFooter ? footerTabsContainer : headerTabsContainer;
const tabsContainerElem = enableInFooter ? footerTabsContainer : headerTabsContainer;
if (!tabOwnerView) {
tabsContainerElem.classList.remove('hide');
@ -137,18 +142,18 @@ define(['dom', 'browser', 'events', 'emby-tabs', 'emby-button'], function (dom,
if (tabOwnerView !== view) {
var index = 0;
let index = 0;
var indexAttribute = selectedIndex == null ? '' : (' data-index="' + selectedIndex + '"');
var tabsHtml = '<div is="emby-tabs"' + indexAttribute + ' class="tabs-viewmenubar"><div class="emby-tabs-slider" style="white-space:nowrap;">' + getTabsFn().map(function (t) {
const indexAttribute = selectedIndex == null ? '' : (' data-index="' + selectedIndex + '"');
const tabsHtml = '<div is="emby-tabs"' + indexAttribute + ' class="tabs-viewmenubar"><div class="emby-tabs-slider" style="white-space:nowrap;">' + 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;
@ -177,16 +182,16 @@ define(['dom', 'browser', 'events', 'emby-tabs', 'emby-button'], function (dom,
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) {
@ -241,9 +246,9 @@ define(['dom', 'browser', 'events', 'emby-tabs', 'emby-button'], function (dom,
};
}
function selectedTabIndex(index) {
export function selectedTabIndex(index) {
var tabsContainerElem = headerTabsContainer;
const tabsContainerElem = headerTabsContainer;
if (!tabsElem) {
tabsElem = tabsContainerElem.querySelector('[is="emby-tabs"]');
@ -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 */

2
src/components/remotecontrol/remotecontrol.js
View file

@ -175,7 +175,7 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
context.querySelector('.nowPlayingPageUserDataButtons').innerHTML = '<button is="emby-ratingbutton" type="button" class="listItemButton paper-icon-button-light" data-id="' + fullItem.Id + '" data-serverid="' + fullItem.ServerId + '" data-itemtype="' + fullItem.Type + '" data-likes="' + likes + '" data-isfavorite="' + userData.IsFavorite + '"><span class="material-icons favorite"></span></button>';
});
} else {
backdrop.clear();
backdrop.clearBackdrop();
context.querySelector('.nowPlayingPageUserDataButtons').innerHTML = '';
}
}

2
src/components/skinManager.js
View file

@ -84,7 +84,7 @@ define(['apphost', 'userSettings', 'browser', 'events', 'backdrop', 'globalize',
currentSound = null;
}
backdrop.clear();
backdrop.clearBackdrop();
}
function onThemeLoaded() {

2
src/components/tabbedview/tabbedview.js
View file

@ -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;

2
src/components/tvproviders/xmltv.js
View file

@ -139,7 +139,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'emby-input', 'listVi
var page = $(e.target).parents('.xmltvForm')[0];
require(['directorybrowser'], function (directoryBrowser) {
var picker = new directoryBrowser();
var picker = new directoryBrowser.default();
picker.show({
includeFiles: true,
callback: function (path) {

27
src/controllers/dashboard/apikeys.js
View file

@ -1,8 +1,14 @@
define(['datetime', 'loading', 'libraryMenu', 'dom', 'globalize', 'emby-button'], function (datetime, loading, libraryMenu, dom, globalize) {
'use strict';
import datetime from 'datetime';
import loading from 'loading';
import libraryMenu from 'libraryMenu';
import dom from 'dom';
import globalize from 'globalize';
import 'emby-button';
/* eslint-disable indent */
function revoke(page, key) {
require(['confirm'], function (confirm) {
import('confirm').then(({default: confirm}) => {
confirm(globalize.translate('MessageConfirmRevokeApiKey'), globalize.translate('HeaderConfirmRevokeApiKey')).then(function () {
loading.show();
ApiClient.ajax({
@ -16,8 +22,8 @@ define(['datetime', 'loading', 'libraryMenu', 'dom', 'globalize', 'emby-button']
}
function renderKeys(page, keys) {
var rows = keys.map(function (item) {
var html = '';
const rows = keys.map(function (item) {
let html = '';
html += '<tr class="detailTableBodyRow detailTableBodyRow-shaded">';
html += '<td class="detailTableBodyCell">';
html += '<button type="button" is="emby-button" data-token="' + item.AccessToken + '" class="raised raised-mini btnRevoke" data-mini="true" title="' + globalize.translate('ButtonRevoke') + '" style="margin:0;">' + globalize.translate('ButtonRevoke') + '</button>';
@ -29,7 +35,7 @@ define(['datetime', 'loading', 'libraryMenu', 'dom', 'globalize', 'emby-button']
html += item.AppName || '';
html += '</td>';
html += '<td class="detailTableBodyCell" style="vertical-align:middle;">';
var date = datetime.parseISO8601Date(item.DateCreated, true);
const date = datetime.parseISO8601Date(item.DateCreated, true);
html += datetime.toLocaleDateString(date) + ' ' + datetime.getDisplayTime(date);
html += '</td>';
return html += '</tr>';
@ -46,7 +52,7 @@ define(['datetime', 'loading', 'libraryMenu', 'dom', 'globalize', 'emby-button']
}
function showNewKeyPrompt(page) {
require(['prompt'], function (prompt) {
import('prompt').then(({default: prompt}) => {
prompt({
title: globalize.translate('HeaderNewApiKey'),
label: globalize.translate('LabelAppName'),
@ -65,12 +71,12 @@ define(['datetime', 'loading', 'libraryMenu', 'dom', 'globalize', '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'));
@ -80,4 +86,5 @@ define(['datetime', 'loading', 'libraryMenu', 'dom', 'globalize', 'emby-button']
pageIdOn('pagebeforeshow', 'apiKeysPage', function () {
loadData(this);
});
});
/* eslint-enable indent */

179
src/controllers/dashboard/dashboard.js
View file

@ -1,11 +1,31 @@
define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globalize', 'date-fns', 'dfnshelper', 'loading', 'connectionManager', 'playMethodHelper', 'cardBuilder', 'imageLoader', 'components/activitylog', 'scripts/imagehelper', 'indicators', 'listViewStyle', 'emby-button', 'flexStyles', 'emby-button', 'emby-itemscontainer'], function (datetime, events, itemHelper, serverNotifications, dom, globalize, datefns, dfnshelper, loading, connectionManager, playMethodHelper, cardBuilder, imageLoader, ActivityLog, imageHelper, indicators) {
'use strict';
import datetime from 'datetime';
import events from 'events';
import itemHelper from 'itemHelper';
import serverNotifications from 'serverNotifications';
import dom from 'dom';
import globalize from 'globalize';
import * as datefns from 'date-fns';
import dfnshelper from 'dfnshelper';
import loading from 'loading';
import connectionManager from 'connectionManager';
import playMethodHelper from 'playMethodHelper';
import cardBuilder from 'cardBuilder';
import imageLoader from 'imageLoader';
import ActivityLog from 'components/activitylog';
import imageHelper from 'scripts/imagehelper';
import indicators from 'indicators';
import 'listViewStyle';
import 'emby-button';
import 'flexStyles';
import 'emby-itemscontainer';
/* eslint-disable indent */
function showPlaybackInfo(btn, session) {
require(['alert'], function (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');
@ -33,7 +53,7 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa
}
function showSendMessageForm(btn, session) {
require(['prompt'], function (prompt) {
import('prompt').then(({default: prompt}) => {
prompt({
title: globalize.translate('HeaderSendMessage'),
label: globalize.translate('LabelMessageText'),
@ -50,8 +70,8 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa
}
function showOptionsMenu(btn, session) {
require(['actionsheet'], function (actionsheet) {
var menuItems = [];
import('actionsheet').then(({default: actionsheet}) => {
const menuItems = [];
if (session.ServerId && session.DeviceId !== connectionManager.deviceId()) {
menuItems.push({
@ -84,14 +104,14 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa
}
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];
@ -113,11 +133,11 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa
}
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;
@ -139,7 +159,7 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa
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');
@ -169,7 +189,7 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa
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;
@ -205,31 +225,31 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa
}
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 += '<div class="' + className + '" id="' + rowId + '">';
html += '<div class="cardBox visualCardBox">';
html += '<div class="cardScalable visualCardBox-cardScalable">';
html += '<div class="cardPadder cardPadder-backdrop"></div>';
html += '<div class="cardContent">';
var imgUrl = DashboardPage.getNowPlayingImageUrl(nowPlayingItem);
const imgUrl = DashboardPage.getNowPlayingImageUrl(nowPlayingItem);
if (imgUrl) {
html += '<div class="sessionNowPlayingContent sessionNowPlayingContent-withbackground"';
@ -240,7 +260,7 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa
html += '<div class="sessionNowPlayingInnerContent">';
html += '<div class="sessionAppInfo">';
var clientImage = DashboardPage.getClientImage(session);
const clientImage = DashboardPage.getClientImage(session);
if (clientImage) {
html += clientImage;
@ -253,7 +273,7 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa
html += '</div>';
html += '<div class="sessionNowPlayingDetails">';
var nowPlayingName = DashboardPage.getNowPlayingName(session);
const nowPlayingName = DashboardPage.getNowPlayingName(session);
html += '<div class="sessionNowPlayingInfo" data-imgsrc="' + nowPlayingName.image + '">';
html += nowPlayingName.html;
html += '</div>';
@ -261,7 +281,7 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa
html += '</div>';
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'
});
@ -273,7 +293,7 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa
}
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'
});
@ -290,7 +310,7 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa
html += '<div class="sessionCardFooter cardFooter">';
html += '<div class="sessionCardButtons flex align-items-center justify-content-center">';
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 += '<button is="paper-icon-button-light" class="sessionCardButton btnSessionPlayPause paper-icon-button-light ' + btnCssClass + '"><span class="material-icons ' + playIcon + '"></span></button>';
@ -308,7 +328,7 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa
html += '</div>';
html += '<div class="flex align-items-center justify-content-center">';
var userImage = DashboardPage.getUserImage(session);
const userImage = DashboardPage.getUserImage(session);
html += userImage ? '<div class="activitylogUserPhoto" style="background-image:url(\'' + userImage + "');\"></div>" : '<div style="height:1.71em;"></div>';
html += '<div class="sessionUserName">';
html += DashboardPage.getUsersHtml(session);
@ -322,7 +342,7 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa
}
parentElement.insertAdjacentHTML('beforeend', html);
var deadSessionElem = parentElement.querySelector('.deadSession');
const deadSessionElem = parentElement.querySelector('.deadSession');
if (deadSessionElem) {
deadSessionElem.parentNode.removeChild(deadSessionElem);
@ -330,7 +350,7 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa
}
function renderRunningTasks(view, tasks) {
var html = '';
let html = '';
tasks = tasks.filter(function (task) {
if ('Idle' != task.State) {
return !task.IsHidden;
@ -345,13 +365,13 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa
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 += '<p>';
html += task.Name + '<br/>';
if (task.State === 'Running') {
var progress = (task.CurrentProgressPercentage || 0).toFixed(1);
const progress = (task.CurrentProgressPercentage || 0).toFixed(1);
html += '<progress max="100" value="' + progress + '" title="' + progress + '%">';
html += progress + '%';
html += '</progress>';
@ -377,9 +397,9 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa
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');
@ -396,7 +416,7 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa
}
if (showTranscodingInfo) {
var line = [];
const line = [];
if (session.TranscodingInfo) {
if (session.TranscodingInfo.Bitrate) {
@ -428,8 +448,8 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa
return html;
},
getSessionNowPlayingTime: function (session) {
var nowPlayingItem = session.NowPlayingItem;
var html = '';
const nowPlayingItem = session.NowPlayingItem;
let html = '';
if (nowPlayingItem) {
if (session.PlayState.PositionTicks) {
@ -453,8 +473,8 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa
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) {
@ -464,8 +484,8 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa
};
}
var topText = itemHelper.getDisplayName(nowPlayingItem);
var bottomText = '';
let topText = itemHelper.getDisplayName(nowPlayingItem);
let bottomText = '';
if (nowPlayingItem.Artists && nowPlayingItem.Artists.length) {
bottomText = topText;
@ -505,13 +525,13 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa
};
},
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);
}
@ -529,7 +549,7 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa
},
updateSession: function (row, session) {
row.classList.remove('deadSession');
var nowPlayingItem = session.NowPlayingItem;
const nowPlayingItem = session.NowPlayingItem;
if (nowPlayingItem) {
row.classList.add('playingSession');
@ -549,7 +569,7 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa
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');
@ -567,18 +587,18 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa
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'
});
@ -588,10 +608,10 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa
});
}
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'
});
@ -601,8 +621,8 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa
});
}
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 + "')" : '';
@ -616,7 +636,7 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa
}
},
getClientImage: function (connection) {
var iconUrl = imageHelper.getDeviceIcon(connection);
const iconUrl = imageHelper.getDeviceIcon(connection);
return "<img src='" + iconUrl + "' />";
},
getNowPlayingImageUrl: function (item) {
@ -646,7 +666,7 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa
});
}
var imageTags = (item || {}).ImageTags || {};
const imageTags = (item || {}).ImageTags || {};
if (item && imageTags.Thumb) {
return ApiClient.getScaledImageUrl(item.Id, {
@ -700,20 +720,20 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa
},
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);
});
},
restart: function (btn) {
require(['confirm'], function (confirm) {
import('confirm').then(({default: confirm}) => {
confirm({
title: globalize.translate('HeaderRestart'),
text: globalize.translate('MessageConfirmRestart'),
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();
@ -721,14 +741,14 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa
});
},
shutdown: function (btn) {
require(['confirm'], function (confirm) {
import('confirm').then(({default: confirm}) => {
confirm({
title: globalize.translate('HeaderShutdown'),
text: globalize.translate('MessageConfirmShutdown'),
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();
@ -736,7 +756,7 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa
});
}
};
return function (view, params) {
export default function (view, params) {
function onRestartRequired(evt, apiClient) {
console.debug('onRestartRequired not implemented', evt, apiClient);
}
@ -775,11 +795,11 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa
}
}
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();
@ -816,7 +836,7 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa
}
});
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);
@ -830,18 +850,19 @@ define(['datetime', 'events', 'itemHelper', 'serverNotifications', 'dom', 'globa
}
});
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();
}
});
};
});
}
/* eslint-enable indent */

38
src/controllers/dashboard/encodingsettings.js
View file

@ -1,5 +1,10 @@
define(['jQuery', 'loading', 'globalize', 'dom', 'libraryMenu'], function ($, loading, globalize, dom, libraryMenu) {
'use strict';
import $ from 'jQuery';
import loading from 'loading';
import globalize from 'globalize';
import dom from 'dom';
import libraryMenu from 'libraryMenu';
/* eslint-disable indent */
function loadPage(page, config, systemInfo) {
Array.prototype.forEach.call(page.querySelectorAll('.chkDecodeCodec'), function (c) {
@ -27,10 +32,10 @@ define(['jQuery', 'loading', 'globalize', 'dom', 'libraryMenu'], function ($, lo
function onSaveEncodingPathFailure(response) {
loading.hide();
var msg = '';
let msg = '';
msg = globalize.translate('FFmpegSavePathNotFound');
require(['alert'], function (alert) {
import('alert').then(({default: alert}) => {
alert(msg);
});
}
@ -49,9 +54,9 @@ define(['jQuery', 'loading', 'globalize', 'dom', 'libraryMenu'], function ($, lo
}
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();
@ -75,7 +80,7 @@ define(['jQuery', 'loading', 'globalize', 'dom', 'libraryMenu'], function ($, lo
ApiClient.updateNamedConfiguration('encoding', config).then(function () {
updateEncoder(form);
}, function () {
require(['alert'], function (alert) {
import('alert').then(({default: alert}) => {
alert(globalize.translate('DefaultErrorMessage'));
});
@ -85,7 +90,7 @@ define(['jQuery', 'loading', 'globalize', 'dom', 'libraryMenu'], function ($, lo
};
if ($('#selectVideoDecoder', form).val()) {
require(['alert'], function (alert) {
import('alert').then(({default: alert}) => {
alert({
title: globalize.translate('TitleHardwareAcceleration'),
text: globalize.translate('HardwareAccelerationWarning')
@ -100,7 +105,7 @@ define(['jQuery', 'loading', 'globalize', 'dom', 'libraryMenu'], function ($, lo
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');
@ -131,7 +136,7 @@ define(['jQuery', 'loading', 'globalize', 'dom', 'libraryMenu'], function ($, lo
}
$(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');
@ -150,8 +155,8 @@ define(['jQuery', 'loading', 'globalize', 'dom', 'libraryMenu'], function ($, lo
setDecodingCodecsVisible(page, this.value);
});
$('#btnSelectEncoderPath', page).on('click.selectDirectory', function () {
require(['directorybrowser'], function (directoryBrowser) {
var picker = new directoryBrowser();
import('directorybrowser').then(({default: directoryBrowser}) => {
const picker = new directoryBrowser();
picker.show({
includeFiles: true,
callback: function (path) {
@ -165,8 +170,8 @@ define(['jQuery', 'loading', 'globalize', 'dom', 'libraryMenu'], function ($, lo
});
});
$('#btnSelectTranscodingTempPath', page).on('click.selectDirectory', function () {
require(['directorybrowser'], function (directoryBrowser) {
var picker = new directoryBrowser();
import('directorybrowser').then(({default: directoryBrowser}) => {
const picker = new directoryBrowser();
picker.show({
callback: function (path) {
if (path) {
@ -185,11 +190,12 @@ define(['jQuery', 'loading', 'globalize', 'dom', 'libraryMenu'], function ($, lo
}).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);
});
});
});
});
/* eslint-enable indent */

4
src/controllers/dashboard/general.js
View file

@ -59,7 +59,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'emby-textarea', 'emb
return function (view, params) {
$('#btnSelectCachePath', view).on('click.selectDirectory', function () {
require(['directorybrowser'], function (directoryBrowser) {
var picker = new directoryBrowser();
var picker = new directoryBrowser.default();
picker.show({
callback: function (path) {
if (path) {
@ -76,7 +76,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'emby-textarea', 'emb
});
$('#btnSelectMetadataPath', view).on('click.selectDirectory', function () {
require(['directorybrowser'], function (directoryBrowser) {
var picker = new directoryBrowser();
var picker = new directoryBrowser.default();
picker.show({
path: $('#txtMetadataPath', view).val(),
networkSharePath: $('#txtMetadataNetworkPath', view).val(),

2
src/controllers/dashboard/networking.js
View file

@ -136,7 +136,7 @@ define(['loading', 'libraryMenu', 'globalize', 'emby-checkbox', 'emby-select'],
});
view.querySelector('#btnSelectCertPath').addEventListener('click', function () {
require(['directorybrowser'], function (directoryBrowser) {
var picker = new directoryBrowser();
var picker = new directoryBrowser.default();
picker.show({
includeFiles: true,
includeDirectories: true,

2
src/controllers/itemDetails.js
View file

@ -462,7 +462,7 @@ define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSetti
if (dom.getWindowSize().innerWidth >= 1000) {
backdrop.setBackdrops([item]);
} else {
backdrop.clear();
backdrop.clearBackdrop();
}
}

8
src/controllers/livetvsettings.js
View file

@ -59,7 +59,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-button'], function ($, loading,
$('.liveTvSettingsForm').off('submit', onSubmit).on('submit', onSubmit);
$('#btnSelectRecordingPath', page).on('click.selectDirectory', function () {
require(['directorybrowser'], function (directoryBrowser) {
var picker = new directoryBrowser();
var picker = new directoryBrowser.default();
picker.show({
callback: function (path) {
if (path) {
@ -74,7 +74,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-button'], function ($, loading,
});
$('#btnSelectMovieRecordingPath', page).on('click.selectDirectory', function () {
require(['directorybrowser'], function (directoryBrowser) {
var picker = new directoryBrowser();
var picker = new directoryBrowser.default();
picker.show({
callback: function (path) {
if (path) {
@ -89,7 +89,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-button'], function ($, loading,
});
$('#btnSelectSeriesRecordingPath', page).on('click.selectDirectory', function () {
require(['directorybrowser'], function (directoryBrowser) {
var picker = new directoryBrowser();
var picker = new directoryBrowser.default();
picker.show({
callback: function (path) {
if (path) {
@ -104,7 +104,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-button'], function ($, loading,
});
$('#btnSelectPostProcessorPath', page).on('click.selectDirectory', function () {
require(['directorybrowser'], function (directoryBrowser) {
var picker = new directoryBrowser();
var picker = new directoryBrowser.default();
picker.show({
includeFiles: true,
callback: function (path) {

2
src/controllers/livetvtuner.js
View file

@ -215,7 +215,7 @@ define(['globalize', 'loading', 'libraryMenu', 'dom', 'emby-input', 'emby-button
});
view.querySelector('.btnSelectPath').addEventListener('click', function () {
require(['directorybrowser'], function (directoryBrowser) {
var picker = new directoryBrowser();
var picker = new directoryBrowser.default();
picker.show({
includeFiles: true,
callback: function (path) {

33
src/elements/emby-checkbox/emby-checkbox.js
View file

@ -1,7 +1,11 @@
define(['browser', 'dom', 'css!./emby-checkbox', 'registerElement'], function (browser, dom) {
'use strict';
import browser from 'browser';
import dom from 'dom';
import 'css!./emby-checkbox';
import 'registerElement';
var EmbyCheckboxPrototype = Object.create(HTMLInputElement.prototype);
/* eslint-disable indent */
let EmbyCheckboxPrototype = Object.create(HTMLInputElement.prototype);
function onKeyDown(e) {
// Don't submit form on enter
@ -19,10 +23,10 @@ define(['browser', 'dom', 'css!./emby-checkbox', 'registerElement'], function (b
}
}
var enableRefreshHack = browser.tizen || browser.orsay || browser.operaTv || browser.web0s ? true : false;
const enableRefreshHack = browser.tizen || browser.orsay || browser.operaTv || browser.web0s ? true : false;
function forceRefresh(loading) {
var elem = this.parentNode;
let elem = this.parentNode;
elem.style.webkitAnimationName = 'repaintChrome';
elem.style.webkitAnimationDelay = (loading === true ? '500ms' : '');
@ -43,22 +47,22 @@ define(['browser', 'dom', 'css!./emby-checkbox', 'registerElement'], function (b
this.classList.add('emby-checkbox');
var labelElement = this.parentNode;
const labelElement = this.parentNode;
labelElement.classList.add('emby-checkbox-label');
var labelTextElement = labelElement.querySelector('span');
const labelTextElement = labelElement.querySelector('span');
var outlineClass = 'checkboxOutline';
let outlineClass = 'checkboxOutline';
var customClass = this.getAttribute('data-outlineclass');
const customClass = this.getAttribute('data-outlineclass');
if (customClass) {
outlineClass += ' ' + customClass;
}
var checkedIcon = this.getAttribute('data-checkedicon') || 'check';
var uncheckedIcon = this.getAttribute('data-uncheckedicon') || '';
var checkHtml = '<span class="material-icons checkboxIcon checkboxIcon-checked ' + checkedIcon + '"></span>';
var uncheckedHtml = '<span class="material-icons checkboxIcon checkboxIcon-unchecked ' + uncheckedIcon + '"></span>';
const checkedIcon = this.getAttribute('data-checkedicon') || 'check';
const uncheckedIcon = this.getAttribute('data-uncheckedicon') || '';
const checkHtml = '<span class="material-icons checkboxIcon checkboxIcon-checked ' + checkedIcon + '"></span>';
const uncheckedHtml = '<span class="material-icons checkboxIcon checkboxIcon-unchecked ' + uncheckedIcon + '"></span>';
labelElement.insertAdjacentHTML('beforeend', '<span class="' + outlineClass + '">' + checkHtml + uncheckedHtml + '</span>');
labelTextElement.classList.add('checkboxLabel');
@ -103,4 +107,5 @@ define(['browser', 'dom', 'css!./emby-checkbox', 'registerElement'], function (b
prototype: EmbyCheckboxPrototype,
extends: 'input'
});
});
/* eslint-enable indent */

22
src/elements/emby-itemrefreshindicator/emby-itemrefreshindicator.js
View file

@ -1,16 +1,21 @@
define(['emby-progressring', 'dom', 'serverNotifications', 'events', 'registerElement'], function (EmbyProgressRing, dom, serverNotifications, events) {
'use strict';
import EmbyProgressRing from 'emby-progressring';
import dom from 'dom';
import serverNotifications from 'serverNotifications';
import events from 'events';
import 'registerElement';
/* 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;
@ -19,7 +24,7 @@ define(['emby-progressring', 'dom', 'serverNotifications', 'events', 'registerEl
function onRefreshProgress(e, apiClient, info) {
var indicator = this;
const indicator = this;
if (!indicator.itemId) {
indicator.itemId = dom.parentWithAttribute(indicator, 'data-id').getAttribute('data-id');
@ -27,7 +32,7 @@ define(['emby-progressring', 'dom', 'serverNotifications', 'events', 'registerEl
if (info.ItemId === indicator.itemId) {
var progress = parseFloat(info.Progress);
const progress = parseFloat(info.Progress);
if (progress && progress < 100) {
this.classList.remove('hide');
@ -39,7 +44,7 @@ define(['emby-progressring', 'dom', 'serverNotifications', 'events', 'registerEl
}
}
var EmbyItemRefreshIndicatorPrototype = Object.create(EmbyProgressRing);
let EmbyItemRefreshIndicatorPrototype = Object.create(EmbyProgressRing);
EmbyItemRefreshIndicatorPrototype.createdCallback = function () {
@ -74,4 +79,5 @@ define(['emby-progressring', 'dom', 'serverNotifications', 'events', 'registerEl
prototype: EmbyItemRefreshIndicatorPrototype,
extends: 'div'
});
});
/* eslint-enable indent */

20
src/elements/emby-progressbar/emby-progressbar.js
View file

@ -1,20 +1,19 @@
define([], function() {
'use strict';
/* eslint-disable indent */
var ProgressBarPrototype = Object.create(HTMLDivElement.prototype);
let ProgressBarPrototype = Object.create(HTMLDivElement.prototype);
function onAutoTimeProgress() {
var start = parseInt(this.getAttribute('data-starttime'));
var end = parseInt(this.getAttribute('data-endtime'));
const start = parseInt(this.getAttribute('data-starttime'));
const end = parseInt(this.getAttribute('data-endtime'));
var now = new Date().getTime();
var total = end - start;
var pct = 100 * ((now - start) / total);
const now = new Date().getTime();
const total = end - start;
let pct = 100 * ((now - start) / total);
pct = Math.min(100, pct);
pct = Math.max(0, pct);
var itemProgressBarForeground = this.querySelector('.itemProgressBarForeground');
const itemProgressBarForeground = this.querySelector('.itemProgressBarForeground');
itemProgressBarForeground.style.width = pct + '%';
}
@ -39,4 +38,5 @@ define([], function() {
prototype: ProgressBarPrototype,
extends: 'div'
});
});
/* eslint-enable indent */

20
src/elements/emby-progressring/emby-progressring.js
View file

@ -1,12 +1,15 @@
define(['require', 'css!./emby-progressring', 'registerElement'], function (require) {
'use strict';
import require from 'require';
import 'css!./emby-progressring';
import 'webcomponents';
var EmbyProgressRing = Object.create(HTMLDivElement.prototype);
/* eslint-disable indent */
let EmbyProgressRing = Object.create(HTMLDivElement.prototype);
EmbyProgressRing.createdCallback = function () {
this.classList.add('progressring');
var instance = this;
const instance = this;
require(['text!./emby-progressring.template.html'], function (template) {
instance.innerHTML = template;
@ -37,7 +40,7 @@ define(['require', 'css!./emby-progressring', 'registerElement'], function (requ
progress = Math.floor(progress);
var angle;
let angle;
if (progress < 25) {
angle = -90 + (progress / 100) * 360;
@ -82,7 +85,7 @@ define(['require', 'css!./emby-progressring', 'registerElement'], function (requ
EmbyProgressRing.detachedCallback = function () {
var observer = this.observer;
let observer = this.observer;
if (observer) {
// later, you can stop observing
@ -97,5 +100,6 @@ define(['require', 'css!./emby-progressring', 'registerElement'], function (requ
extends: 'div'
});
return EmbyProgressRing;
});
export default EmbyProgressRing;
/* eslint-enable indent */

20
src/elements/emby-radio/emby-radio.js
View file

@ -1,7 +1,10 @@
define(['layoutManager', 'css!./emby-radio', 'registerElement'], function (layoutManager) {
'use strict';
import layoutManager from 'layoutManager';
import 'css!./emby-radio';
import 'registerElement';
var EmbyRadioPrototype = Object.create(HTMLInputElement.prototype);
/* eslint-disable indent */
let EmbyRadioPrototype = Object.create(HTMLInputElement.prototype);
function onKeyDown(e) {
@ -23,7 +26,7 @@ define(['layoutManager', 'css!./emby-radio', 'registerElement'], function (layou
}
EmbyRadioPrototype.attachedCallback = function () {
var showFocus = !layoutManager.mobile;
const showFocus = !layoutManager.mobile;
if (this.getAttribute('data-radio') === 'true') {
return;
@ -33,7 +36,7 @@ define(['layoutManager', 'css!./emby-radio', 'registerElement'], function (layou
this.classList.add('mdl-radio__button');
var labelElement = this.parentNode;
let labelElement = this.parentNode;
//labelElement.classList.add('"mdl-radio mdl-js-radio mdl-js-ripple-effect');
labelElement.classList.add('mdl-radio');
labelElement.classList.add('mdl-js-radio');
@ -42,12 +45,12 @@ define(['layoutManager', 'css!./emby-radio', 'registerElement'], function (layou
labelElement.classList.add('show-focus');
}
var labelTextElement = labelElement.querySelector('span');
let labelTextElement = labelElement.querySelector('span');
labelTextElement.classList.add('radioButtonLabel');
labelTextElement.classList.add('mdl-radio__label');
var html = '';
let html = '';
html += '<div class="mdl-radio__circles">';
@ -76,4 +79,5 @@ define(['layoutManager', 'css!./emby-radio', 'registerElement'], function (layou
prototype: EmbyRadioPrototype,
extends: 'input'
});
});
/* eslint-enable indent */

46
src/elements/emby-ratingbutton/emby-ratingbutton.js
View file

@ -1,16 +1,21 @@
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);
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;
@ -24,13 +29,13 @@ define(['connectionManager', 'serverNotifications', 'events', 'globalize', 'emby
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') {
@ -47,7 +52,7 @@ define(['connectionManager', 'serverNotifications', 'events', 'globalize', 'emby
function onUserDataChanged(e, apiClient, userData) {
var button = this;
const button = this;
if (userData.ItemId === button.getAttribute('data-id')) {
@ -57,7 +62,7 @@ define(['connectionManager', 'serverNotifications', 'events', 'globalize', 'emby
function setState(button, likes, isFavorite, updateAttribute) {
var icon = button.querySelector('.material-icons');
const icon = button.querySelector('.material-icons');
if (isFavorite) {
@ -106,7 +111,7 @@ define(['connectionManager', 'serverNotifications', 'events', 'globalize', 'emby
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;
}
@ -126,7 +131,7 @@ define(['connectionManager', 'serverNotifications', 'events', 'globalize', 'emby
addNotificationEvent(button, 'UserDataChanged', onUserDataChanged);
}
var EmbyRatingButtonPrototype = Object.create(EmbyButtonPrototype);
const EmbyRatingButtonPrototype = Object.create(EmbyButtonPrototype);
EmbyRatingButtonPrototype.createdCallback = function () {
@ -143,12 +148,12 @@ define(['connectionManager', 'serverNotifications', 'events', 'globalize', 'emby
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') {
@ -181,7 +186,7 @@ define(['connectionManager', 'serverNotifications', 'events', 'globalize', 'emby
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);
@ -199,4 +204,5 @@ define(['connectionManager', 'serverNotifications', 'events', 'globalize', 'emby
prototype: EmbyRatingButtonPrototype,
extends: 'button'
});
});
/* eslint-enable indent */

66
src/elements/emby-scrollbuttons/emby-scrollbuttons.js
View file

@ -1,13 +1,18 @@
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';
var EmbyScrollButtonsPrototype = Object.create(HTMLDivElement.prototype);
/* eslint-disable indent */
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 += '<button type="button" is="paper-icon-button-light" data-ripple="false" data-direction="' + direction + '" class="emby-scrollbuttons-button">';
html += '<span class="material-icons ' + icon + '"></span>';
@ -45,7 +50,7 @@ define(['layoutManager', 'dom', 'css!./emby-scrollbuttons', 'registerElement', '
scrollButtons.scrollButtonsLeft.disabled = true;
}
var scrollPosEnd = scrollPos + scrollSize;
const scrollPosEnd = scrollPos + scrollSize;
if (scrollWidth > 0 && scrollPosEnd >= scrollWidth) {
scrollButtons.scrollButtonsRight.disabled = true;
} else {
@ -54,18 +59,18 @@ define(['layoutManager', 'dom', 'css!./emby-scrollbuttons', 'registerElement', '
}
function onScroll(e) {
var scrollButtons = this;
var scroller = this.scroller;
const scrollButtons = this;
const scroller = this.scroller;
var scrollSize = getScrollSize(scroller);
var scrollPos = getScrollPosition(scroller);
var scrollWidth = getScrollWidth(scroller);
const scrollSize = getScrollSize(scroller);
const scrollPos = getScrollPosition(scroller);
const scrollWidth = getScrollWidth(scroller);
updateScrollButtons(scrollButtons, scrollSize, scrollPos, scrollWidth);
}
function getStyleValue(style, name) {
var value = style.getPropertyValue(name);
let value = style.getPropertyValue(name);
if (!value) {
return 0;
}
@ -84,20 +89,20 @@ define(['layoutManager', 'dom', 'css!./emby-scrollbuttons', 'registerElement', '
}
function getScrollSize(elem) {
var scrollSize = elem.offsetWidth;
var style = window.getComputedStyle(elem, null);
let scrollSize = elem.offsetWidth;
let style = window.getComputedStyle(elem, null);
var paddingLeft = getStyleValue(style, 'padding-left');
let paddingLeft = getStyleValue(style, 'padding-left');
if (paddingLeft) {
scrollSize -= paddingLeft;
}
var paddingRight = getStyleValue(style, 'padding-right');
let paddingRight = getStyleValue(style, 'padding-right');
if (paddingRight) {
scrollSize -= paddingRight;
}
var slider = elem.getScrollSlider();
const slider = elem.getScrollSlider();
style = window.getComputedStyle(slider, null);
paddingLeft = getStyleValue(style, 'padding-left');
@ -114,14 +119,14 @@ define(['layoutManager', 'dom', 'css!./emby-scrollbuttons', 'registerElement', '
}
function onScrollButtonClick(e) {
var scroller = this.parentNode.nextSibling;
let scroller = this.parentNode.nextSibling;
var direction = this.getAttribute('data-direction');
var scrollSize = getScrollSize(scroller);
var scrollPos = getScrollPosition(scroller);
var scrollWidth = getScrollWidth(scroller);
const direction = this.getAttribute('data-direction');
const scrollSize = getScrollSize(scroller);
const scrollPos = getScrollPosition(scroller);
const scrollWidth = getScrollWidth(scroller);
var newPos;
let newPos;
if (direction === 'left') {
newPos = Math.max(0, scrollPos - scrollSize);
} else {
@ -132,21 +137,21 @@ define(['layoutManager', 'dom', 'css!./emby-scrollbuttons', 'registerElement', '
}
EmbyScrollButtonsPrototype.attachedCallback = function () {
var scroller = this.nextSibling;
const scroller = this.nextSibling;
this.scroller = scroller;
var parent = this.parentNode;
const parent = this.parentNode;
parent.classList.add('emby-scroller-container');
this.innerHTML = getScrollButtonHtml('left') + getScrollButtonHtml('right');
var buttons = this.querySelectorAll('.emby-scrollbuttons-button');
const buttons = this.querySelectorAll('.emby-scrollbuttons-button');
buttons[0].addEventListener('click', onScrollButtonClick);
buttons[1].addEventListener('click', onScrollButtonClick);
this.scrollButtonsLeft = buttons[0];
this.scrollButtonsRight = buttons[1];
var scrollHandler = onScroll.bind(this);
const scrollHandler = onScroll.bind(this);
this.scrollHandler = scrollHandler;
scroller.addScrollEventListener(scrollHandler, {
capture: false,
@ -155,10 +160,10 @@ define(['layoutManager', 'dom', 'css!./emby-scrollbuttons', 'registerElement', '
};
EmbyScrollButtonsPrototype.detachedCallback = function () {
var parent = this.scroller;
const parent = this.scroller;
this.scroller = null;
var scrollHandler = this.scrollHandler;
let scrollHandler = this.scrollHandler;
if (parent && scrollHandler) {
parent.removeScrollEventListener(scrollHandler, {
capture: false,
@ -175,4 +180,5 @@ define(['layoutManager', 'dom', 'css!./emby-scrollbuttons', 'registerElement', '
prototype: EmbyScrollButtonsPrototype,
extends: 'div'
});
});
/* eslint-enable indent */

39
src/elements/emby-scroller/emby-scroller.js
View file

@ -1,7 +1,15 @@
define(['scroller', 'dom', 'layoutManager', 'inputManager', 'focusManager', 'browser', 'registerElement', 'css!./emby-scroller'], function (scroller, dom, layoutManager, inputManager, focusManager, browser) {
'use strict';
import scroller from 'scroller';
import dom from 'dom';
import layoutManager from 'layoutManager';
import inputManager from 'inputManager';
import focusManager from 'focusManager';
import browser from 'browser';
import 'registerElement';
import 'css!./emby-scroller';
var ScrollerPrototype = Object.create(HTMLDivElement.prototype);
/* eslint-disable indent */
let ScrollerPrototype = Object.create(HTMLDivElement.prototype);
ScrollerPrototype.createdCallback = function () {
this.classList.add('emby-scroller');
@ -9,7 +17,7 @@ define(['scroller', 'dom', 'layoutManager', 'inputManager', 'focusManager', 'bro
function initCenterFocus(elem, scrollerInstance) {
dom.addEventListener(elem, 'focus', function (e) {
var focused = focusManager.focusableParent(e.target);
const focused = focusManager.focusableParent(e.target);
if (focused) {
scrollerInstance.toCenter(focused);
}
@ -80,7 +88,7 @@ define(['scroller', 'dom', 'layoutManager', 'inputManager', 'focusManager', 'bro
};
function onInputCommand(e) {
var cmd = e.detail.command;
const cmd = e.detail.command;
if (cmd === 'end') {
focusManager.focusLast(this, '.' + this.getAttribute('data-navcommands'));
e.preventDefault();
@ -101,18 +109,18 @@ define(['scroller', 'dom', 'layoutManager', 'inputManager', 'focusManager', 'bro
inputManager.on(this, onInputCommand);
}
var horizontal = this.getAttribute('data-horizontal') !== 'false';
const horizontal = this.getAttribute('data-horizontal') !== 'false';
var slider = this.querySelector('.scrollSlider');
const slider = this.querySelector('.scrollSlider');
if (horizontal) {
slider.style['white-space'] = 'nowrap';
}
var scrollFrame = this;
var enableScrollButtons = layoutManager.desktop && horizontal && this.getAttribute('data-scrollbuttons') !== 'false';
const scrollFrame = this;
const enableScrollButtons = layoutManager.desktop && horizontal && this.getAttribute('data-scrollbuttons') !== 'false';
var options = {
const options = {
horizontal: horizontal,
mouseDragging: 1,
mouseWheel: this.getAttribute('data-mousewheel') !== 'false',
@ -154,14 +162,14 @@ define(['scroller', 'dom', 'layoutManager', 'inputManager', 'focusManager', 'bro
}
ScrollerPrototype.pause = function () {
var headroom = this.headroom;
const headroom = this.headroom;
if (headroom) {
headroom.pause();
}
};
ScrollerPrototype.resume = function () {
var headroom = this.headroom;
const headroom = this.headroom;
if (headroom) {
headroom.resume();
}
@ -172,13 +180,13 @@ define(['scroller', 'dom', 'layoutManager', 'inputManager', 'focusManager', 'bro
inputManager.off(this, onInputCommand);
}
var headroom = this.headroom;
const headroom = this.headroom;
if (headroom) {
headroom.destroy();
this.headroom = null;
}
var scrollerInstance = this.scroller;
const scrollerInstance = this.scroller;
if (scrollerInstance) {
scrollerInstance.destroy();
this.scroller = null;
@ -189,4 +197,5 @@ define(['scroller', 'dom', 'layoutManager', 'inputManager', 'focusManager', 'bro
prototype: ScrollerPrototype,
extends: 'div'
});
});
/* eslint-enable indent */

35
src/elements/emby-select/emby-select.js
View file

@ -1,7 +1,12 @@
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';
var EmbySelectPrototype = Object.create(HTMLSelectElement.prototype);
/* eslint-disable indent */
const EmbySelectPrototype = Object.create(HTMLSelectElement.prototype);
function enableNativeMenu() {
@ -27,7 +32,7 @@ define(['layoutManager', 'browser', 'actionsheet', 'css!./emby-select', 'registe
}
function triggerChange(select) {
var evt = document.createEvent('HTMLEvents');
const evt = document.createEvent('HTMLEvents');
evt.initEvent('change', false, true);
select.dispatchEvent(evt);
}
@ -39,8 +44,8 @@ define(['layoutManager', 'browser', 'actionsheet', 'css!./emby-select', 'registe
function showActionSheet(select) {
var labelElem = getLabel(select);
var title = labelElem ? (labelElem.textContent || labelElem.innerText) : null;
const labelElem = getLabel(select);
const title = labelElem ? (labelElem.textContent || labelElem.innerText) : null;
actionsheet.show({
items: select.options,
@ -54,7 +59,7 @@ define(['layoutManager', 'browser', 'actionsheet', 'css!./emby-select', 'registe
}
function getLabel(select) {
var elem = select.previousSibling;
let elem = select.previousSibling;
while (elem && elem.tagName !== 'LABEL') {
elem = elem.previousSibling;
}
@ -62,21 +67,20 @@ define(['layoutManager', 'browser', 'actionsheet', 'css!./emby-select', 'registe
}
function onFocus(e) {
var label = getLabel(this);
const label = getLabel(this);
if (label) {
label.classList.add('selectLabelFocused');
}
}
function onBlur(e) {
var label = getLabel(this);
const label = getLabel(this);
if (label) {
label.classList.remove('selectLabelFocused');
}
}
function onMouseDown(e) {
// e.button=0 for primary (left) mouse button click
if (!e.button && !enableNativeMenu()) {
e.preventDefault();
@ -85,9 +89,7 @@ define(['layoutManager', 'browser', 'actionsheet', 'css!./emby-select', 'registe
}
function onKeyDown(e) {
switch (e.keyCode) {
case 13:
if (!enableNativeMenu()) {
e.preventDefault();
@ -107,7 +109,7 @@ define(['layoutManager', 'browser', 'actionsheet', 'css!./emby-select', 'registe
}
}
var inputId = 0;
let inputId = 0;
EmbySelectPrototype.createdCallback = function () {
@ -137,7 +139,7 @@ define(['layoutManager', 'browser', 'actionsheet', 'css!./emby-select', 'registe
this.classList.add('emby-select');
var label = this.ownerDocument.createElement('label');
const label = this.ownerDocument.createElement('label');
label.innerHTML = this.getAttribute('label') || '';
label.classList.add('selectLabel');
label.htmlFor = this.id;
@ -150,7 +152,7 @@ define(['layoutManager', 'browser', 'actionsheet', 'css!./emby-select', 'registe
EmbySelectPrototype.setLabel = function (text) {
var label = this.parentNode.querySelector('label');
const label = this.parentNode.querySelector('label');
label.innerHTML = text;
};
@ -159,4 +161,5 @@ define(['layoutManager', 'browser', 'actionsheet', 'css!./emby-select', 'registe
prototype: EmbySelectPrototype,
extends: 'select'
});
});
/* eslint-enable indent */

94
src/elements/emby-slider/emby-slider.js
View file

@ -1,15 +1,22 @@
define(['browser', 'dom', 'layoutManager', 'keyboardnavigation', 'css!./emby-slider', 'registerElement', 'emby-input'], function (browser, dom, layoutManager, keyboardnavigation) {
'use strict';
import browser from 'browser';
import dom from 'dom';
import layoutManager from 'layoutManager';
import keyboardnavigation from 'keyboardnavigation';
import 'css!./emby-slider';
import 'webcomponents';
import 'emby-input';
var EmbySliderPrototype = Object.create(HTMLInputElement.prototype);
/* eslint-disable indent */
var supportsValueSetOverride = false;
let EmbySliderPrototype = Object.create(HTMLInputElement.prototype);
var enableWidthWithTransform;
let supportsValueSetOverride = false;
let enableWidthWithTransform;
if (Object.getOwnPropertyDescriptor && Object.defineProperty) {
var descriptor = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, 'value');
const descriptor = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, 'value');
// descriptor returning null in webos
if (descriptor && descriptor.configurable) {
supportsValueSetOverride = true;
@ -24,14 +31,14 @@ define(['browser', 'dom', 'layoutManager', 'keyboardnavigation', 'css!./emby-sli
* @return {number} slider fraction
*/
function mapClientToFraction(range, clientX) {
var rect = range.sliderBubbleTrack.getBoundingClientRect();
const rect = range.sliderBubbleTrack.getBoundingClientRect();
var fraction = (clientX - rect.left) / rect.width;
let fraction = (clientX - rect.left) / rect.width;
// Snap to step
var valueRange = range.max - range.min;
const valueRange = range.max - range.min;
if (range.step !== 'any' && valueRange !== 0) {
var step = (range.step || 1) / valueRange;
const step = (range.step || 1) / valueRange;
fraction = Math.round(fraction / step) * step;
}
@ -46,7 +53,7 @@ define(['browser', 'dom', 'layoutManager', 'keyboardnavigation', 'css!./emby-sli
* @return {number} slider value
*/
function mapFractionToValue(range, fraction) {
var value = (range.max - range.min) * fraction;
let value = (range.max - range.min) * fraction;
// Snap to step
if (range.step !== 'any') {
@ -67,8 +74,8 @@ define(['browser', 'dom', 'layoutManager', 'keyboardnavigation', 'css!./emby-sli
* @return {number} slider fraction
*/
function mapValueToFraction(range, value) {
var valueRange = range.max - range.min;
var fraction = valueRange !== 0 ? (value - range.min) / valueRange : 0;
const valueRange = range.max - range.min;
const fraction = valueRange !== 0 ? (value - range.min) / valueRange : 0;
return Math.min(Math.max(fraction, 0), 1);
}
@ -84,18 +91,18 @@ define(['browser', 'dom', 'layoutManager', 'keyboardnavigation', 'css!./emby-sli
return;
}
var range = this;
var value = range.value;
const range = this;
const value = range.value;
// put this on a callback. Doing it within the event sometimes causes the slider to get hung up and not respond
// Keep only one per slider frame request
cancelAnimationFrame(range.updateValuesFrame);
range.updateValuesFrame = requestAnimationFrame(function () {
var backgroundLower = range.backgroundLower;
let backgroundLower = range.backgroundLower;
if (backgroundLower) {
var fraction = (value - range.min) / (range.max - range.min);
let fraction = (value - range.min) / (range.max - range.min);
if (enableWidthWithTransform) {
backgroundLower.style.transform = 'scaleX(' + (fraction) + ')';
@ -110,10 +117,10 @@ define(['browser', 'dom', 'layoutManager', 'keyboardnavigation', 'css!./emby-sli
function updateBubble(range, value, bubble, bubbleText) {
requestAnimationFrame(function () {
var bubbleTrackRect = range.sliderBubbleTrack.getBoundingClientRect();
var bubbleRect = bubble.getBoundingClientRect();
const bubbleTrackRect = range.sliderBubbleTrack.getBoundingClientRect();
const bubbleRect = bubble.getBoundingClientRect();
var bubblePos = bubbleTrackRect.width * value / 100;
let bubblePos = bubbleTrackRect.width * value / 100;
bubblePos = Math.min(Math.max(bubblePos, bubbleRect.width / 2), bubbleTrackRect.width - bubbleRect.width / 2);
bubble.style.left = bubblePos + 'px';
@ -158,10 +165,10 @@ define(['browser', 'dom', 'layoutManager', 'keyboardnavigation', 'css!./emby-sli
this.classList.add('show-focus');
}
var containerElement = this.parentNode;
const containerElement = this.parentNode;
containerElement.classList.add('mdl-slider-container');
var htmlToInsert = '';
let htmlToInsert = '';
htmlToInsert += '<div class="mdl-slider-background-flex-container">';
htmlToInsert += '<div class="mdl-slider-background-flex">';
@ -187,9 +194,9 @@ define(['browser', 'dom', 'layoutManager', 'keyboardnavigation', 'css!./emby-sli
this.sliderBubbleTrack = containerElement.querySelector('.sliderBubbleTrack');
this.backgroundLower = containerElement.querySelector('.mdl-slider-background-lower');
this.backgroundUpper = containerElement.querySelector('.mdl-slider-background-upper');
var sliderBubble = containerElement.querySelector('.sliderBubble');
const sliderBubble = containerElement.querySelector('.sliderBubble');
var hasHideClass = sliderBubble.classList.contains('hide');
let hasHideClass = sliderBubble.classList.contains('hide');
dom.addEventListener(this, 'input', function (e) {
this.dragging = true;
@ -198,7 +205,7 @@ define(['browser', 'dom', 'layoutManager', 'keyboardnavigation', 'css!./emby-sli
updateValues.call(this);
}
var bubbleValue = mapValueToFraction(this, this.value) * 100;
const bubbleValue = mapValueToFraction(this, this.value) * 100;
updateBubble(this, bubbleValue, sliderBubble);
if (hasHideClass) {
@ -223,10 +230,11 @@ define(['browser', 'dom', 'layoutManager', 'keyboardnavigation', 'css!./emby-sli
passive: true
});
/* eslint-disable-next-line compat/compat */
dom.addEventListener(this, (window.PointerEvent ? 'pointermove' : 'mousemove'), function (e) {
if (!this.dragging) {
var bubbleValue = mapClientToFraction(this, e.clientX) * 100;
const bubbleValue = mapClientToFraction(this, e.clientX) * 100;
updateBubble(this, bubbleValue, sliderBubble);
@ -240,6 +248,7 @@ define(['browser', 'dom', 'layoutManager', 'keyboardnavigation', 'css!./emby-sli
passive: true
});
/* eslint-disable-next-line compat/compat */
dom.addEventListener(this, (window.PointerEvent ? 'pointerleave' : 'mouseleave'), function () {
sliderBubble.classList.add('hide');
hasHideClass = true;
@ -256,7 +265,7 @@ define(['browser', 'dom', 'layoutManager', 'keyboardnavigation', 'css!./emby-sli
this.touched = true;
var fraction = mapClientToFraction(this, e.targetTouches[0].clientX);
const fraction = mapClientToFraction(this, e.targetTouches[0].clientX);
this.value = mapFractionToValue(this, fraction);
this.dispatchEvent(new Event('input', {
@ -276,7 +285,7 @@ define(['browser', 'dom', 'layoutManager', 'keyboardnavigation', 'css!./emby-sli
return;
}
var fraction = mapClientToFraction(this, e.targetTouches[0].clientX);
const fraction = mapClientToFraction(this, e.targetTouches[0].clientX);
this.value = mapFractionToValue(this, fraction);
this.dispatchEvent(new Event('input', {
@ -288,7 +297,7 @@ define(['browser', 'dom', 'layoutManager', 'keyboardnavigation', 'css!./emby-sli
});
dom.addEventListener(this, 'touchend', function (e) {
var range = this;
const range = this;
setTimeout(function () {
range.touched = false;
@ -314,12 +323,12 @@ define(['browser', 'dom', 'layoutManager', 'keyboardnavigation', 'css!./emby-sli
* Keyboard dragging timeout.
* After this delay "change" event will be fired.
*/
var KeyboardDraggingTimeout = 1000;
const KeyboardDraggingTimeout = 1000;
/**
* Keyboard dragging timer.
*/
var keyboardDraggingTimer;
let keyboardDraggingTimer;
/**
* Start keyboard dragging.
@ -346,7 +355,7 @@ define(['browser', 'dom', 'layoutManager', 'keyboardnavigation', 'css!./emby-sli
elem.keyboardDragging = false;
var event = new Event('change', {
const event = new Event('change', {
bubbles: true,
cancelable: false
});
@ -364,7 +373,7 @@ define(['browser', 'dom', 'layoutManager', 'keyboardnavigation', 'css!./emby-sli
elem.value = Math.max(elem.min, Math.min(elem.max, parseFloat(elem.value) + delta));
var event = new Event('input', {
const event = new Event('input', {
bubbles: true,
cancelable: false
});
@ -414,10 +423,10 @@ define(['browser', 'dom', 'layoutManager', 'keyboardnavigation', 'css!./emby-sli
function setRange(elem, startPercent, endPercent) {
var style = elem.style;
const style = elem.style;
style.left = Math.max(startPercent, 0) + '%';
var widthPercent = endPercent - startPercent;
const widthPercent = endPercent - startPercent;
style.width = Math.max(Math.min(widthPercent, 100), 0) + '%';
}
@ -438,7 +447,7 @@ define(['browser', 'dom', 'layoutManager', 'keyboardnavigation', 'css!./emby-sli
EmbySliderPrototype.setBufferedRanges = function (ranges, runtime, position) {
var elem = this.backgroundUpper;
const elem = this.backgroundUpper;
if (!elem) {
return;
}
@ -449,9 +458,7 @@ define(['browser', 'dom', 'layoutManager', 'keyboardnavigation', 'css!./emby-sli
position = (position / runtime) * 100;
}
for (var i = 0, length = ranges.length; i < length; i++) {
var range = ranges[i];
for (const range in ranges) {
if (position != null) {
if (position >= range.end) {
@ -468,7 +475,7 @@ define(['browser', 'dom', 'layoutManager', 'keyboardnavigation', 'css!./emby-sli
EmbySliderPrototype.setIsClear = function (isClear) {
var backgroundLower = this.backgroundLower;
const backgroundLower = this.backgroundLower;
if (backgroundLower) {
if (isClear) {
backgroundLower.classList.add('mdl-slider-background-lower-clear');
@ -479,7 +486,7 @@ define(['browser', 'dom', 'layoutManager', 'keyboardnavigation', 'css!./emby-sli
};
function startInterval(range) {
var interval = range.interval;
const interval = range.interval;
if (interval) {
clearInterval(interval);
}
@ -488,7 +495,7 @@ define(['browser', 'dom', 'layoutManager', 'keyboardnavigation', 'css!./emby-sli
EmbySliderPrototype.detachedCallback = function () {
var interval = this.interval;
const interval = this.interval;
if (interval) {
clearInterval(interval);
}
@ -501,4 +508,5 @@ define(['browser', 'dom', 'layoutManager', 'keyboardnavigation', 'css!./emby-sli
prototype: EmbySliderPrototype,
extends: 'input'
});
});
/* eslint-enable indent */

79
src/elements/emby-tabs/emby-tabs.js
View file

@ -1,9 +1,17 @@
define(['dom', 'scroller', 'browser', 'layoutManager', 'focusManager', 'registerElement', 'css!./emby-tabs', 'scrollStyles'], function (dom, scroller, browser, layoutManager, focusManager) {
'use strict';
import dom from 'dom';
import scroller from 'scroller';
import browser from 'browser';
import layoutManager from 'layoutManager';
import focusManager from 'focusManager';
import 'registerElement';
import 'css!./emby-tabs';
import 'scrollStyles';
var EmbyTabs = Object.create(HTMLDivElement.prototype);
var buttonClass = 'emby-tab-button';
var activeButtonClass = buttonClass + '-active';
/* eslint-disable indent */
let EmbyTabs = Object.create(HTMLDivElement.prototype);
const buttonClass = 'emby-tab-button';
const activeButtonClass = buttonClass + '-active';
function setActiveTabButton(tabs, newButton, oldButton, animate) {
@ -16,14 +24,14 @@ define(['dom', 'scroller', 'browser', 'layoutManager', 'focusManager', 'register
}
function removeActivePanelClass(tabs, index) {
var tabPanel = getTabPanel(tabs, index);
let tabPanel = getTabPanel(tabs, index);
if (tabPanel) {
tabPanel.classList.remove('is-active');
}
}
function addActivePanelClass(tabs, index) {
var tabPanel = getTabPanel(tabs, index);
let tabPanel = getTabPanel(tabs, index);
if (tabPanel) {
tabPanel.classList.add('is-active');
}
@ -31,9 +39,9 @@ define(['dom', 'scroller', 'browser', 'layoutManager', 'focusManager', 'register
function fadeInRight(elem) {
var pct = browser.mobile ? '4%' : '0.5%';
const pct = browser.mobile ? '4%' : '0.5%';
var keyframes = [
const keyframes = [
{ opacity: '0', transform: 'translate3d(' + pct + ', 0, 0)', offset: 0 },
{ opacity: '1', transform: 'none', offset: 1 }];
@ -56,7 +64,7 @@ define(['dom', 'scroller', 'browser', 'layoutManager', 'focusManager', 'register
removeActivePanelClass(tabs, previousIndex);
}
var newPanel = getTabPanel(tabs, index);
let newPanel = getTabPanel(tabs, index);
if (newPanel) {
// animate new panel ?
@ -70,10 +78,10 @@ define(['dom', 'scroller', 'browser', 'layoutManager', 'focusManager', 'register
function onClick(e) {
var tabs = this;
const tabs = this;
var current = tabs.querySelector('.' + activeButtonClass);
var tabButton = dom.parentWithClass(e.target, buttonClass);
const current = tabs.querySelector('.' + activeButtonClass);
const tabButton = dom.parentWithClass(e.target, buttonClass);
if (tabButton && tabButton !== current) {
@ -81,11 +89,11 @@ define(['dom', 'scroller', 'browser', 'layoutManager', 'focusManager', 'register
current.classList.remove(activeButtonClass);
}
var previousIndex = current ? parseInt(current.getAttribute('data-index')) : null;
const previousIndex = current ? parseInt(current.getAttribute('data-index')) : null;
setActiveTabButton(tabs, tabButton, current, true);
var index = parseInt(tabButton.getAttribute('data-index'));
const index = parseInt(tabButton.getAttribute('data-index'));
triggerBeforeTabChange(tabs, index, previousIndex);
@ -115,7 +123,7 @@ define(['dom', 'scroller', 'browser', 'layoutManager', 'focusManager', 'register
return;
}
var contentScrollSlider = tabs.querySelector('.emby-tabs-slider');
const contentScrollSlider = tabs.querySelector('.emby-tabs-slider');
if (contentScrollSlider) {
tabs.scroller = new scroller(tabs, {
horizontal: 1,
@ -160,7 +168,7 @@ define(['dom', 'scroller', 'browser', 'layoutManager', 'focusManager', 'register
EmbyTabs.focus = function () {
var selected = this.querySelector('.' + activeButtonClass);
const selected = this.querySelector('.' + activeButtonClass);
if (selected) {
focusManager.focus(selected);
@ -180,16 +188,16 @@ define(['dom', 'scroller', 'browser', 'layoutManager', 'focusManager', 'register
initScroller(this);
var current = this.querySelector('.' + activeButtonClass);
var currentIndex = current ? parseInt(current.getAttribute('data-index')) : parseInt(this.getAttribute('data-index') || '0');
const current = this.querySelector('.' + activeButtonClass);
const currentIndex = current ? parseInt(current.getAttribute('data-index')) : parseInt(this.getAttribute('data-index') || '0');
if (currentIndex !== -1) {
this.selectedTabIndex = currentIndex;
var tabButtons = this.querySelectorAll('.' + buttonClass);
const tabButtons = this.querySelectorAll('.' + buttonClass);
var newTabButton = tabButtons[currentIndex];
const newTabButton = tabButtons[currentIndex];
if (newTabButton) {
setActiveTabButton(this, newTabButton, current, false);
@ -221,18 +229,18 @@ define(['dom', 'scroller', 'browser', 'layoutManager', 'focusManager', 'register
EmbyTabs.selectedIndex = function (selected, triggerEvent) {
var tabs = this;
const tabs = this;
if (selected == null) {
return tabs.selectedTabIndex || 0;
}
var current = tabs.selectedIndex();
const current = tabs.selectedIndex();
tabs.selectedTabIndex = selected;
var tabButtons = tabs.querySelectorAll('.' + buttonClass);
const tabButtons = tabs.querySelectorAll('.' + buttonClass);
if (current === selected || triggerEvent === false) {
@ -244,7 +252,7 @@ define(['dom', 'scroller', 'browser', 'layoutManager', 'focusManager', 'register
}
}));
var currentTabButton = tabButtons[current];
let currentTabButton = tabButtons[current];
setActiveTabButton(tabs, tabButtons[selected], currentTabButton, false);
if (current !== selected && currentTabButton) {
@ -262,7 +270,7 @@ define(['dom', 'scroller', 'browser', 'layoutManager', 'focusManager', 'register
function getSibling(elem, method) {
var sibling = elem[method];
let sibling = elem[method];
while (sibling) {
if (sibling.classList.contains(buttonClass)) {
@ -280,9 +288,9 @@ define(['dom', 'scroller', 'browser', 'layoutManager', 'focusManager', 'register
EmbyTabs.selectNext = function () {
var current = getSelectedTabButton(this);
const current = getSelectedTabButton(this);
var sibling = getSibling(current, 'nextSibling');
const sibling = getSibling(current, 'nextSibling');
if (sibling) {
onClick.call(this, {
@ -293,9 +301,9 @@ define(['dom', 'scroller', 'browser', 'layoutManager', 'focusManager', 'register
EmbyTabs.selectPrevious = function () {
var current = getSelectedTabButton(this);
const current = getSelectedTabButton(this);
var sibling = getSibling(current, 'previousSibling');
const sibling = getSibling(current, 'previousSibling');
if (sibling) {
onClick.call(this, {
@ -306,14 +314,14 @@ define(['dom', 'scroller', 'browser', 'layoutManager', 'focusManager', 'register
EmbyTabs.triggerBeforeTabChange = function (selected) {
var tabs = this;
const tabs = this;
triggerBeforeTabChange(tabs, tabs.selectedIndex());
};
EmbyTabs.triggerTabChange = function (selected) {
var tabs = this;
const tabs = this;
tabs.dispatchEvent(new CustomEvent('tabchange', {
detail: {
@ -324,8 +332,8 @@ define(['dom', 'scroller', 'browser', 'layoutManager', 'focusManager', 'register
EmbyTabs.setTabEnabled = function (index, enabled) {
var tabs = this;
var btn = this.querySelector('.emby-tab-button[data-index="' + index + '"]');
const tabs = this;
const btn = this.querySelector('.emby-tab-button[data-index="' + index + '"]');
if (enabled) {
btn.classList.remove('hide');
@ -338,4 +346,5 @@ define(['dom', 'scroller', 'browser', 'layoutManager', 'focusManager', 'register
prototype: EmbyTabs,
extends: 'div'
});
});
/* eslint-enable indent */

40
src/elements/emby-textarea/emby-textarea.js
View file

@ -1,8 +1,13 @@
define(['layoutManager', 'browser', 'css!./emby-textarea', 'registerElement', 'emby-input'], function (layoutManager, browser) {
'use strict';
import layoutManager from 'layoutManager';
import browser from 'browser';
import 'css!./emby-textarea';
import 'registerElement';
import 'emby-input';
/* eslint-disable indent */
function autoGrow(textarea, maxLines) {
var self = this;
const self = this;
if (maxLines === undefined) {
maxLines = 999;
@ -14,17 +19,17 @@ define(['layoutManager', 'browser', 'css!./emby-textarea', 'registerElement', 'e
* @returns {number}
*/
self.getOffset = function (textarea) {
var style = window.getComputedStyle(textarea, null);
var props = ['paddingTop', 'paddingBottom'];
var offset = 0;
const style = window.getComputedStyle(textarea, null);
const props = ['paddingTop', 'paddingBottom'];
let offset = 0;
for (var i = 0; i < props.length; i++) {
for (let i = 0; i < props.length; i++) {
offset += parseInt(style[props[i]]);
}
return offset;
};
var offset;
let offset;
function reset() {
textarea.rows = 1;
offset = self.getOffset(textarea);
@ -43,8 +48,8 @@ define(['layoutManager', 'browser', 'css!./emby-textarea', 'registerElement', 'e
textarea.rows = 3;
return;
}
var newHeight = 0;
var hasGrown = false;
let newHeight = 0;
let hasGrown = false;
if ((textarea.scrollHeight - offset) > self.maxAllowedHeight) {
textarea.style.overflowY = 'scroll';
@ -67,17 +72,17 @@ define(['layoutManager', 'browser', 'css!./emby-textarea', 'registerElement', 'e
autogrowFn();
}
var EmbyTextAreaPrototype = Object.create(HTMLTextAreaElement.prototype);
const EmbyTextAreaPrototype = Object.create(HTMLTextAreaElement.prototype);
var elementId = 0;
let elementId = 0;
if (Object.getOwnPropertyDescriptor && Object.defineProperty) {
var descriptor = Object.getOwnPropertyDescriptor(HTMLTextAreaElement.prototype, 'value');
const descriptor = Object.getOwnPropertyDescriptor(HTMLTextAreaElement.prototype, 'value');
// descriptor returning null in webos
if (descriptor && descriptor.configurable) {
var baseSetMethod = descriptor.set;
const baseSetMethod = descriptor.set;
descriptor.set = function (value) {
baseSetMethod.call(this, value);
@ -108,8 +113,8 @@ define(['layoutManager', 'browser', 'css!./emby-textarea', 'registerElement', 'e
this.rows = 1;
this.classList.add('emby-textarea');
var parentNode = this.parentNode;
var label = this.ownerDocument.createElement('label');
const parentNode = this.parentNode;
const label = this.ownerDocument.createElement('label');
label.innerHTML = this.getAttribute('label') || '';
label.classList.add('textareaLabel');
@ -136,4 +141,5 @@ define(['layoutManager', 'browser', 'css!./emby-textarea', 'registerElement', 'e
prototype: EmbyTextAreaPrototype,
extends: 'textarea'
});
});
/* eslint-enable indent */

15
src/elements/emby-toggle/emby-toggle.js
View file

@ -1,7 +1,9 @@
define(['css!./emby-toggle', 'registerElement'], function () {
'use strict';
import 'css!./emby-toggle';
import 'registerElement';
var EmbyTogglePrototype = Object.create(HTMLInputElement.prototype);
/* eslint-disable indent */
const EmbyTogglePrototype = Object.create(HTMLInputElement.prototype);
function onKeyDown(e) {
@ -29,11 +31,11 @@ define(['css!./emby-toggle', 'registerElement'], function () {
this.classList.add('mdl-switch__input');
var labelElement = this.parentNode;
const labelElement = this.parentNode;
labelElement.classList.add('mdl-switch');
labelElement.classList.add('mdl-js-switch');
var labelTextElement = labelElement.querySelector('span');
const labelTextElement = labelElement.querySelector('span');
labelElement.insertAdjacentHTML('beforeend', '<div class="mdl-switch__trackContainer"><div class="mdl-switch__track"></div><div class="mdl-switch__thumb"><span class="mdl-switch__focus-helper"></span></div></div>');
@ -47,4 +49,5 @@ define(['css!./emby-toggle', 'registerElement'], function () {
prototype: EmbyTogglePrototype,
extends: 'input'
});
});
/* eslint-enable indent */

6
src/scripts/autoBackdrops.js
View file

@ -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();
}
}
});