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 remote-tracking branch 'upstream/master' into deinterlace-improvements

Browse source
This commit is contained in:
Orry Verducci 2020-08-10 22:11:25 +01:00
commit 077c02282f
221 changed files with 13279 additions and 13706 deletions
Download patch file Download diff file Expand all files Collapse all files

1
.eslintignore
View file

@ -2,4 +2,3 @@ node_modules
dist
.idea
.vscode
src/libraries

4
.eslintrc.js
View file

@ -29,7 +29,7 @@ module.exports = {
],
rules: {
'block-spacing': ['error'],
'brace-style': ['error', "1tbs", { "allowSingleLine": true }],
'brace-style': ['error', '1tbs', { 'allowSingleLine': true }],
'comma-dangle': ['error', 'never'],
'comma-spacing': ['error'],
'eol-last': ['error'],
@ -41,7 +41,7 @@ module.exports = {
'no-multiple-empty-lines': ['error', { 'max': 1 }],
'no-trailing-spaces': ['error'],
'no-unused-expressions': ['error', { 'allowShortCircuit': true, 'allowTernary': true, 'allowTaggedTemplates': true }],
"no-unused-vars": ["error", { "vars": "all", "args": "none", "ignoreRestSiblings": true }],
'no-unused-vars': ['error', { 'vars': 'all', 'args': 'none', 'ignoreRestSiblings': true }],
'one-var': ['error', 'never'],
'padded-blocks': ['error', 'never'],
'quotes': ['error', 'single', { 'avoidEscape': true, 'allowTemplateLiterals': false }],

1
CONTRIBUTORS.md
View file

@ -35,6 +35,7 @@
- [Thibault Nocchi](https://github.com/ThibaultNocchi)
- [MrTimscampi](https://github.com/MrTimscampi)
- [Sarab Singh](https://github.com/sarab97)
- [GuilhermeHideki](https://github.com/GuilhermeHideki)
- [Andrei Oanca](https://github.com/OancaAndrei)
- [Cromefire_](https://github.com/cromefire)

86
package.json
View file

@ -5,9 +5,9 @@
"repository": "https://github.com/jellyfin/jellyfin-web",
"license": "GPL-2.0-or-later",
"devDependencies": {
"@babel/core": "^7.11.0",
"@babel/eslint-parser": "^7.11.0",
"@babel/eslint-plugin": "^7.11.0",
"@babel/core": "^7.11.1",
"@babel/eslint-parser": "^7.11.3",
"@babel/eslint-plugin": "^7.11.3",
"@babel/plugin-proposal-class-properties": "^7.10.1",
"@babel/plugin-proposal-private-methods": "^7.10.1",
"@babel/plugin-transform-modules-amd": "^7.10.5",
@ -17,10 +17,10 @@
"babel-loader": "^8.0.6",
"browser-sync": "^2.26.12",
"copy-webpack-plugin": "^5.1.1",
"css-loader": "^4.1.1",
"css-loader": "^4.2.1",
"cssnano": "^4.1.10",
"del": "^5.1.0",
"eslint": "^6.8.0",
"eslint": "^7.6.0",
"eslint-plugin-compat": "^3.5.1",
"eslint-plugin-eslint-comments": "^3.2.0",
"eslint-plugin-import": "^2.21.2",
@ -38,7 +38,7 @@
"gulp-postcss": "^8.0.0",
"gulp-sass": "^4.0.2",
"gulp-sourcemaps": "^2.6.5",
"gulp-terser": "^1.2.1",
"gulp-terser": "^1.3.2",
"html-webpack-plugin": "^4.3.0",
"lazypipe": "^1.0.2",
"node-sass": "^4.13.1",
@ -63,7 +63,7 @@
"fast-text-encoding": "^1.0.3",
"flv.js": "^1.5.0",
"headroom.js": "^0.11.0",
"hls.js": "^0.14.7",
"hls.js": "^0.14.8",
"howler": "^2.2.0",
"intersection-observer": "^0.11.0",
"jellyfin-apiclient": "^1.4.1",
@ -80,7 +80,7 @@
"sortablejs": "^1.10.2",
"swiper": "^5.4.5",
"webcomponents.js": "^0.7.24",
"whatwg-fetch": "^3.2.0"
"whatwg-fetch": "^3.4.0"
},
"babel": {
"presets": [
@ -107,9 +107,13 @@
"src/components/dialogHelper/dialogHelper.js",
"src/components/directorybrowser/directorybrowser.js",
"src/components/displaySettings/displaySettings.js",
"src/components/favoriteitems.js",
"src/components/fetchhelper.js",
"src/components/filterdialog/filterdialog.js",
"src/components/focusManager.js",
"src/components/groupedcards.js",
"src/components/guide/guide.js",
"src/components/guide/guide-settings.js",
"src/components/homeScreenSettings/homeScreenSettings.js",
"src/components/homesections/homesections.js",
"src/components/htmlMediaHelper.js",
@ -123,9 +127,12 @@
"src/components/itemHelper.js",
"src/components/itemidentifier/itemidentifier.js",
"src/components/itemMediaInfo/itemMediaInfo.js",
"src/components/itemsrefresher.js",
"src/components/layoutManager.js",
"src/components/lazyLoader/lazyLoaderIntersectionObserver.js",
"src/components/libraryoptionseditor/libraryoptionseditor.js",
"src/components/listview/listview.js",
"src/components/loading/loading.js",
"src/components/maintabsmanager.js",
"src/components/mediainfo/mediainfo.js",
"src/components/mediaLibraryCreator/mediaLibraryCreator.js",
@ -138,6 +145,7 @@
"src/components/playback/mediasession.js",
"src/components/playback/nowplayinghelper.js",
"src/components/playback/playbackorientation.js",
"src/components/playback/playbackmanager.js",
"src/components/playback/playerSelectionMenu.js",
"src/components/playback/playersettingsmenu.js",
"src/components/playback/playmethodhelper.js",
@ -149,20 +157,41 @@
"src/components/playlisteditor/playlisteditor.js",
"src/components/playmenu.js",
"src/components/prompt/prompt.js",
"src/components/recordingcreator/recordingbutton.js",
"src/components/recordingcreator/recordingcreator.js",
"src/components/recordingcreator/seriesrecordingeditor.js",
"src/components/recordingcreator/recordinghelper.js",
"src/components/refreshdialog/refreshdialog.js",
"src/components/remotecontrol/remotecontrol.js",
"src/components/sanatizefilename.js",
"src/components/scrollManager.js",
"src/plugins/htmlAudioPlayer/plugin.js",
"src/plugins/chromecastPlayer/plugin.js",
"src/components/slideshow/slideshow.js",
"src/components/sortmenu/sortmenu.js",
"src/plugins/htmlVideoPlayer/plugin.js",
"src/plugins/logoScreensaver/plugin.js",
"src/plugins/playAccessValidation/plugin.js",
"src/components/search/searchfields.js",
"src/components/search/searchresults.js",
"src/components/settingshelper.js",
"src/components/shortcuts.js",
"src/components/subtitleeditor/subtitleeditor.js",
"src/components/subtitlesync/subtitlesync.js",
"src/components/subtitlesettings/subtitleappearancehelper.js",
"src/components/subtitlesettings/subtitlesettings.js",
"src/components/syncPlay/groupSelectionMenu.js",
"src/components/syncPlay/playbackPermissionManager.js",
"src/components/syncPlay/syncPlayManager.js",
"src/components/syncPlay/timeSyncManager.js",
"src/components/tabbedview/tabbedview.js",
"src/components/viewManager/viewManager.js",
"src/components/tvproviders/schedulesdirect.js",
"src/components/tvproviders/xmltv.js",
"src/components/toast/toast.js",
"src/components/upnextdialog/upnextdialog.js",
"src/components/viewContainer.js",
"src/components/castSenderApi.js",
"src/controllers/session/addServer/index.js",
"src/controllers/session/forgotPassword/index.js",
"src/controllers/session/redeemPassword/index.js",
@ -185,11 +214,16 @@
"src/controllers/music/musicplaylists.js",
"src/controllers/music/musicrecommended.js",
"src/controllers/music/songs.js",
"src/controllers/dashboard/mediaLibrary.js",
"src/controllers/dashboard/library.js",
"src/controllers/dashboard/metadataImages.js",
"src/controllers/dashboard/metadatanfo.js",
"src/controllers/dashboard/networking.js",
"src/controllers/dashboard/notifications/notification.js",
"src/controllers/dashboard/notifications/notifications.js",
"src/controllers/dashboard/playback.js",
"src/controllers/dashboard/plugins/add/index.js",
"src/controllers/dashboard/plugins/installed/index.js",
"src/controllers/dashboard/plugins/available/index.js",
"src/controllers/dashboard/plugins/repositories/index.js",
"src/controllers/dashboard/scheduledtasks/scheduledtask.js",
"src/controllers/dashboard/scheduledtasks/scheduledtasks.js",
@ -201,11 +235,31 @@
"src/controllers/dashboard/users/userparentalcontrol.js",
"src/controllers/dashboard/users/userpasswordpage.js",
"src/controllers/dashboard/users/userprofilespage.js",
"src/controllers/home.js",
"src/controllers/list.js",
"src/controllers/edititemmetadata.js",
"src/controllers/favorites.js",
"src/controllers/hometab.js",
"src/controllers/movies/moviecollections.js",
"src/controllers/movies/moviegenres.js",
"src/controllers/movies/movies.js",
"src/controllers/movies/moviesrecommended.js",
"src/controllers/movies/movietrailers.js",
"src/controllers/playback/nowplaying.js",
"src/controllers/playback/videoosd.js",
"src/controllers/itemDetails/index.js",
"src/controllers/playback/queue/index.js",
"src/controllers/playback/video/index.js",
"src/controllers/searchpage.js",
"src/controllers/livetv/livetvguide.js",
"src/controllers/livetvtuner.js",
"src/controllers/livetvstatus.js",
"src/controllers/livetvguideprovider.js",
"src/controllers/livetvsettings.js",
"src/controllers/livetv/livetvrecordings.js",
"src/controllers/livetv/livetvschedule.js",
"src/controllers/livetv/livetvseriestimers.js",
"src/controllers/livetv/livetvchannels.js",
"src/controllers/shows/episodes.js",
"src/controllers/shows/tvgenres.js",
"src/controllers/shows/tvlatest.js",
@ -244,6 +298,9 @@
"src/elements/emby-tabs/emby-tabs.js",
"src/elements/emby-textarea/emby-textarea.js",
"src/elements/emby-toggle/emby-toggle.js",
"src/libraries/screensavermanager.js",
"src/libraries/navdrawer/navdrawer.js",
"src/libraries/scroller.js",
"src/plugins/backdropScreensaver/plugin.js",
"src/plugins/bookPlayer/plugin.js",
"src/plugins/bookPlayer/tableOfContents.js",
@ -261,14 +318,24 @@
"src/scripts/filesystem.js",
"src/scripts/globalize.js",
"src/scripts/imagehelper.js",
"src/scripts/itembynamedetailpage.js",
"src/scripts/inputManager.js",
"src/scripts/autoThemes.js",
"src/scripts/themeManager.js",
"src/scripts/keyboardNavigation.js",
"src/scripts/libraryMenu.js",
"src/scripts/libraryBrowser.js",
"src/scripts/livetvcomponents.js",
"src/scripts/mouseManager.js",
"src/scripts/multiDownload.js",
"src/scripts/playlists.js",
"src/scripts/scrollHelper.js",
"src/scripts/serverNotifications.js",
"src/scripts/routes.js",
"src/scripts/settings/appSettings.js",
"src/scripts/settings/userSettings.js",
"src/scripts/settings/webSettings.js",
"src/scripts/shell.js",
"src/scripts/taskbutton.js",
"src/scripts/themeLoader.js",
"src/scripts/touchHelper.js"
@ -298,6 +365,7 @@
"Firefox ESR"
],
"scripts": {
"start": "yarn serve",
"serve": "gulp serve --development",
"prepare": "gulp --production",
"build:development": "gulp --development",

33
scripts/duplicates.py Normal file
View file

@ -0,0 +1,33 @@
import sys
import os
import json
# load every string in the source language
# print all duplicate values to a file
cwd = os.getcwd()
source = cwd + '/../src/strings/en-us.json'
reverse = {}
duplicates = {}
with open(source) as en:
strings = json.load(en)
for key, value in strings.items():
if value not in reverse:
reverse[value] = [key]
else:
reverse[value].append(key)
for key, value in reverse.items():
if len(value) > 1:
duplicates[key] = value
print('LENGTH: ' + str(len(duplicates)))
with open('duplicates.txt', 'w') as out:
for item in duplicates:
out.write(json.dumps(item) + ': ')
out.write(json.dumps(duplicates[item]) + '\n')
out.close()
print('DONE')

2
scripts/scrm.py → scripts/remove.py
View file

@ -11,7 +11,7 @@ langlst = os.listdir(langdir)
keys = []
with open('scout.txt', 'r') as f:
with open('unused.txt', 'r') as f:
for line in f:
keys.append(line.strip('\n'))

0
scripts/scdup.py → scripts/source.py
View file

0
scripts/scgen.py → scripts/unused.py
View file

6
src/assets/css/librarybrowser.css
View file

@ -236,12 +236,6 @@
text-align: center;
}
.layout-desktop .searchTabButton,
.layout-mobile .searchTabButton,
.layout-tv .headerSearchButton {
display: none !important;
}
.mainDrawer-scrollContainer {
padding-bottom: 10vh;
}

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

@ -49,7 +49,7 @@ import 'formDialogStyle';
};
if (parseFloat(updatedSchedule.StartHour) >= parseFloat(updatedSchedule.EndHour)) {
return void alert(globalize.translate('ErrorMessageStartHourGreaterThanEnd'));
return void alert(globalize.translate('ErrorStartHourGreaterThanEnd'));
}
context.submitted = true;

21
src/components/appRouter.js
View file

@ -1,6 +1,10 @@
define(['loading', 'globalize', 'events', 'viewManager', 'skinManager', 'backdrop', 'browser', 'page', 'appSettings', 'apphost', 'connectionManager'], function (loading, globalize, events, viewManager, skinManager, backdrop, browser, page, appSettings, appHost, connectionManager) {
'use strict';
viewManager = viewManager.default || viewManager;
browser = browser.default || browser;
loading = loading.default || loading;
var appRouter = {
showLocalLogin: function (serverId, manualLogin) {
var pageName = manualLogin ? 'manuallogin' : 'login';
@ -34,7 +38,7 @@ define(['loading', 'globalize', 'events', 'viewManager', 'skinManager', 'backdro
switch (result.State) {
case 'SignedIn':
loading.hide();
skinManager.loadUserSkin();
Emby.Page.goHome();
break;
case 'ServerSignIn':
result.ApiClient.getPublicUsers().then(function (users) {
@ -147,7 +151,6 @@ define(['loading', 'globalize', 'events', 'viewManager', 'skinManager', 'backdro
if (typeof route.path === 'string') {
loadContentUrl(ctx, next, route, currentRequest);
} else {
// ? TODO
next();
}
};
@ -285,12 +288,9 @@ define(['loading', 'globalize', 'events', 'viewManager', 'skinManager', 'backdro
connectionManager.connect({
enableAutoLogin: appSettings.enableAutoLogin()
}).then(function (result) {
firstConnectionResult = result;
options = options || {};
page({
click: options.click !== false,
hashbang: options.hashbang !== false
@ -342,7 +342,7 @@ define(['loading', 'globalize', 'events', 'viewManager', 'skinManager', 'backdro
if (route.isDefaultRoute) {
console.debug('appRouter - loading skin home page');
loadUserSkinWithOptions(ctx);
Emby.Page.goHome();
return;
} else if (route.roles) {
validateRoles(apiClient, route.roles).then(function () {
@ -356,15 +356,6 @@ define(['loading', 'globalize', 'events', 'viewManager', 'skinManager', 'backdro
callback();
}
function loadUserSkinWithOptions(ctx) {
require(['queryString'], function (queryString) {
var params = queryString.parse(ctx.querystring);
skinManager.loadUserSkin({
start: params.start
});
});
}
function validateRoles(apiClient, roles) {
return Promise.all(roles.split(',').map(function (role) {
return validateRole(apiClient, role);

11
src/components/apphost.js
View file

@ -1,6 +1,8 @@
define(['appSettings', 'browser', 'events', 'htmlMediaHelper', 'webSettings', 'globalize'], function (appSettings, browser, events, htmlMediaHelper, webSettings, globalize) {
'use strict';
browser = browser.default || browser;
function getBaseProfileOptions(item) {
var disableHlsVideoAudioCodecs = [];
@ -277,7 +279,7 @@ define(['appSettings', 'browser', 'events', 'htmlMediaHelper', 'webSettings', 'g
features.push('targetblank');
features.push('screensaver');
webSettings.enableMultiServer().then(enabled => {
webSettings.getMultiServer().then(enabled => {
if (enabled) features.push('multiserver');
});
@ -407,13 +409,6 @@ define(['appSettings', 'browser', 'events', 'htmlMediaHelper', 'webSettings', 'g
getPushTokenInfo: function () {
return {};
},
setThemeColor: function (color) {
var metaThemeColor = document.querySelector('meta[name=theme-color]');
if (metaThemeColor) {
metaThemeColor.setAttribute('content', color);
}
},
setUserScalable: function (scalable) {
if (!browser.tv) {
var att = scalable ? 'width=device-width, initial-scale=1, minimum-scale=1, user-scalable=yes' : 'width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no';

22
src/components/castSenderApi.js
View file

@ -1,23 +1,16 @@
define([], function() {
'use strict';
class CastSenderApi {
load() {
if (window.appMode === 'cordova' || window.appMode === 'android') {
return {
load: function () {
window.chrome = window.chrome || {};
return Promise.resolve();
}
};
} else {
var ccLoaded = false;
return {
load: function () {
let ccLoaded = false;
if (ccLoaded) {
return Promise.resolve();
}
return new Promise(function (resolve, reject) {
var fileref = document.createElement('script');
return new Promise(function (resolve) {
const fileref = document.createElement('script');
fileref.setAttribute('type', 'text/javascript');
fileref.onload = function () {
@ -29,6 +22,7 @@ define([], function() {
document.querySelector('head').appendChild(fileref);
});
}
};
}
});
}
export default CastSenderApi;

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

@ -200,7 +200,7 @@ import 'flexStyles';
}
function centerFocus(elem, horiz, on) {
import('scrollHelper').then(scrollHelper => {
import('scrollHelper').then((scrollHelper) => {
const fn = on ? 'on' : 'off';
scrollHelper.centerFocus[fn](elem, horiz);
});

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

@ -354,7 +354,7 @@ import 'scrollStyles';
}
function centerFocus(elem, horiz, on) {
import('scrollHelper').then(scrollHelper => {
import('scrollHelper').then((scrollHelper) => {
const fn = on ? 'on' : 'off';
scrollHelper.centerFocus[fn](elem, horiz);
});

113
src/components/displaySettings/displaySettings.js
View file

@ -1,6 +1,5 @@
import browser from 'browser';
import layoutManager from 'layoutManager';
import appSettings from 'appSettings';
import pluginManager from 'pluginManager';
import appHost from 'apphost';
import focusManager from 'focusManager';
@ -16,17 +15,22 @@ import 'emby-button';
/* eslint-disable indent */
function fillThemes(select, isDashboard) {
select.innerHTML = skinManager.getThemes().map(t => {
let value = t.id;
if (t.isDefault && !isDashboard) {
value = '';
} else if (t.isDefaultServerDashboard && isDashboard) {
value = '';
}
function fillThemes(context, userSettings) {
const select = context.querySelector('#selectTheme');
return `<option value="${value}">${t.name}</option>`;
skinManager.getThemes().then(themes => {
select.innerHTML = themes.map(t => {
return `<option value="${t.id}">${t.name}</option>`;
}).join('');
// get default theme
var defaultTheme = themes.find(theme => {
return theme.default;
});
// set the current theme
select.value = userSettings.theme() || defaultTheme.id;
});
}
function loadScreensavers(context, userSettings) {
@ -46,6 +50,7 @@ import 'emby-button';
selectScreensaver.innerHTML = options.map(o => {
return `<option value="${o.value}">${o.name}</option>`;
}).join('');
selectScreensaver.value = userSettings.screensaver();
if (!selectScreensaver.value) {
@ -54,57 +59,6 @@ import 'emby-button';
}
}
function loadSoundEffects(context, userSettings) {
const selectSoundEffects = context.querySelector('.selectSoundEffects');
const options = pluginManager.ofType('soundeffects').map(plugin => {
return {
name: plugin.name,
value: plugin.id
};
});
options.unshift({
name: globalize.translate('None'),
value: 'none'
});
selectSoundEffects.innerHTML = options.map(o => {
return `<option value="${o.value}">${o.name}</option>`;
}).join('');
selectSoundEffects.value = userSettings.soundEffects();
if (!selectSoundEffects.value) {
// TODO: set the default instead of none
selectSoundEffects.value = 'none';
}
}
function loadSkins(context, userSettings) {
const selectSkin = context.querySelector('.selectSkin');
const options = pluginManager.ofType('skin').map(plugin => {
return {
name: plugin.name,
value: plugin.id
};
});
selectSkin.innerHTML = options.map(o => {
return `<option value="${o.value}">${o.name}</option>`;
}).join('');
selectSkin.value = userSettings.skin();
if (!selectSkin.value && options.length) {
selectSkin.value = options[0].value;
}
if (options.length > 1 && appHost.supports('skins')) {
context.querySelector('.selectSkinContainer').classList.remove('hide');
} else {
context.querySelector('.selectSkinContainer').classList.add('hide');
}
}
function showOrHideMissingEpisodesField(context) {
if (browser.tizen || browser.web0s) {
context.querySelector('.fldDisplayMissingEpisodes').classList.add('hide');
@ -115,12 +69,6 @@ import 'emby-button';
}
function loadForm(context, user, userSettings) {
if (user.Policy.IsAdministrator) {
context.querySelector('.selectDashboardThemeContainer').classList.remove('hide');
} else {
context.querySelector('.selectDashboardThemeContainer').classList.add('hide');
}
if (appHost.supports('displaylanguage')) {
context.querySelector('.languageSection').classList.remove('hide');
} else {
@ -139,18 +87,6 @@ import 'emby-button';
context.querySelector('.learnHowToContributeContainer').classList.add('hide');
}
if (appHost.supports('runatstartup')) {
context.querySelector('.fldAutorun').classList.remove('hide');
} else {
context.querySelector('.fldAutorun').classList.add('hide');
}
if (appHost.supports('soundeffects')) {
context.querySelector('.fldSoundEffects').classList.remove('hide');
} else {
context.querySelector('.fldSoundEffects').classList.add('hide');
}
if (appHost.supports('screensaver')) {
context.querySelector('.selectScreensaverContainer').classList.remove('hide');
} else {
@ -173,16 +109,8 @@ import 'emby-button';
context.querySelector('.fldThemeVideo').classList.add('hide');
}
context.querySelector('.chkRunAtStartup').checked = appSettings.runAtStartup();
const selectTheme = context.querySelector('#selectTheme');
const selectDashboardTheme = context.querySelector('#selectDashboardTheme');
fillThemes(selectTheme);
fillThemes(selectDashboardTheme, true);
fillThemes(context, userSettings);
loadScreensavers(context, userSettings);
loadSoundEffects(context, userSettings);
loadSkins(context, userSettings);
context.querySelector('.chkDisplayMissingEpisodes').checked = user.Configuration.DisplayMissingEpisodes || false;
@ -198,9 +126,6 @@ import 'emby-button';
context.querySelector('#txtLibraryPageSize').value = userSettings.libraryPageSize();
selectDashboardTheme.value = userSettings.dashboardTheme() || '';
selectTheme.value = userSettings.theme() || '';
context.querySelector('.selectLayout').value = layoutManager.getSavedLayout() || '';
showOrHideMissingEpisodesField(context);
@ -209,8 +134,6 @@ import 'emby-button';
}
function saveUser(context, user, userSettingsInstance, apiClient) {
appSettings.runAtStartup(context.querySelector('.chkRunAtStartup').checked);
user.Configuration.DisplayMissingEpisodes = context.querySelector('.chkDisplayMissingEpisodes').checked;
if (appHost.supports('displaylanguage')) {
@ -221,15 +144,11 @@ import 'emby-button';
userSettingsInstance.enableThemeSongs(context.querySelector('#chkThemeSong').checked);
userSettingsInstance.enableThemeVideos(context.querySelector('#chkThemeVideo').checked);
userSettingsInstance.dashboardTheme(context.querySelector('#selectDashboardTheme').value);
userSettingsInstance.theme(context.querySelector('#selectTheme').value);
userSettingsInstance.soundEffects(context.querySelector('.selectSoundEffects').value);
userSettingsInstance.screensaver(context.querySelector('.selectScreensaver').value);
userSettingsInstance.libraryPageSize(context.querySelector('#txtLibraryPageSize').value);
userSettingsInstance.skin(context.querySelector('.selectSkin').value);
userSettingsInstance.enableFastFadein(context.querySelector('#chkFadein').checked);
userSettingsInstance.enableBlurhash(context.querySelector('#chkBlurhash').checked);
userSettingsInstance.enableBackdrops(context.querySelector('#chkBackdrops').checked);

24
src/components/displaySettings/displaySettings.template.html
View file

@ -1,5 +1,4 @@
<form style="margin: 0 auto;">
<h2 class="sectionTitle">
${Display}
</h2>
@ -123,26 +122,14 @@
<div class="fieldDescription">${LabelPleaseRestart}</div>
</div>
<div class="selectContainer hide selectSkinContainer">
<select is="emby-select" class="selectSkin" label="${LabelSkin}"></select>
</div>
<div class="selectContainer">
<select id="selectTheme" is="emby-select" label="${LabelTheme}"></select>
</div>
<div class="selectContainer selectDashboardThemeContainer hide">
<select id="selectDashboardTheme" is="emby-select" label="${LabelDashboardTheme}"></select>
</div>
<div class="selectContainer hide selectScreensaverContainer">
<select is="emby-select" class="selectScreensaver" label="${LabelScreensaver}"></select>
</div>
<div class="selectContainer fldSoundEffects hide">
<select is="emby-select" class="selectSoundEffects" label="${LabelSoundEffects}"></select>
</div>
<div class="inputContainer inputContainer-withDescription">
<input is="emby-input" type="number" id="txtLibraryPageSize" pattern="[0-9]*" required="required" min="0" max="1000" step="1" label="${LabelLibraryPageSize}" />
<div class="fieldDescription">${LabelLibraryPageSizeHelp}</div>
@ -159,9 +146,9 @@
<div class="checkboxContainer checkboxContainer-withDescription">
<label>
<input type="checkbox" is="emby-checkbox" id="chkBlurhash" />
<span>${EnableBlurhash}</span>
<span>${EnableBlurHash}</span>
</label>
<div class="fieldDescription checkboxFieldDescription">${EnableBlurhashHelp}</div>
<div class="fieldDescription checkboxFieldDescription">${EnableBlurHashHelp}</div>
</div>
<div class="checkboxContainer checkboxContainer-withDescription">
@ -196,13 +183,6 @@
<div class="fieldDescription checkboxFieldDescription">${EnableThemeVideosHelp}</div>
</div>
<div class="checkboxContainer hide fldAutorun">
<label>
<input type="checkbox" is="emby-checkbox" class="chkRunAtStartup" />
<span>${RunAtStartup}</span>
</label>
</div>
<div class="checkboxContainer checkboxContainer-withDescription fldDisplayMissingEpisodes hide">
<label>
<input type="checkbox" is="emby-checkbox" class="chkDisplayMissingEpisodes" />

52
src/components/favoriteitems.js
View file

@ -1,5 +1,14 @@
define(['loading', 'libraryBrowser', 'cardBuilder', 'dom', 'apphost', 'imageLoader', 'globalize', 'layoutManager', 'scrollStyles', 'emby-itemscontainer'], function (loading, libraryBrowser, cardBuilder, dom, appHost, imageLoader, globalize, layoutManager) {
'use strict';
import loading from 'loading';
import cardBuilder from 'cardBuilder';
import dom from 'dom';
import appHost from 'apphost';
import imageLoader from 'imageLoader';
import globalize from 'globalize';
import layoutManager from 'layoutManager';
import 'scrollStyles';
import 'emby-itemscontainer';
/* eslint-disable indent */
function enableScrollX() {
return !layoutManager.desktop;
@ -94,8 +103,8 @@ define(['loading', 'libraryBrowser', 'cardBuilder', 'dom', 'apphost', 'imageLoad
}
function loadSection(elem, userId, topParentId, section, isSingleSection) {
var screenWidth = dom.getWindowSize().innerWidth;
var options = {
const screenWidth = dom.getWindowSize().innerWidth;
const options = {
SortBy: 'SortName',
SortOrder: 'Ascending',
Filters: 'IsFavorite',
@ -118,7 +127,7 @@ define(['loading', 'libraryBrowser', 'cardBuilder', 'dom', 'apphost', 'imageLoad
}
}
var promise;
let promise;
if (section.types === 'MusicArtist') {
promise = ApiClient.getArtists(userId, options);
@ -128,7 +137,7 @@ define(['loading', 'libraryBrowser', 'cardBuilder', 'dom', 'apphost', 'imageLoad
}
return promise.then(function (result) {
var html = '';
let html = '';
if (result.Items.length) {
if (html += '<div class="sectionTitleContainer sectionTitleContainer-cards padded-left">', !layoutManager.tv && options.Limit && result.Items.length >= options.Limit) {
@ -144,7 +153,7 @@ define(['loading', 'libraryBrowser', 'cardBuilder', 'dom', 'apphost', 'imageLoad
html += '</div>';
if (enableScrollX()) {
var scrollXClass = 'scrollX hiddenScrollX';
let scrollXClass = 'scrollX hiddenScrollX';
if (layoutManager.tv) {
scrollXClass += ' smoothScrollX';
}
@ -154,7 +163,7 @@ define(['loading', 'libraryBrowser', 'cardBuilder', 'dom', 'apphost', 'imageLoad
html += '<div is="emby-itemscontainer" class="itemsContainer vertical-wrap padded-left padded-right">';
}
var cardLayout = appHost.preferVisualCards && section.autoCardLayout && section.showTitle;
let cardLayout = appHost.preferVisualCards && section.autoCardLayout && section.showTitle;
cardLayout = false;
html += cardBuilder.getCardsHtml(result.Items, {
preferThumb: section.preferThumb,
@ -179,10 +188,10 @@ define(['loading', 'libraryBrowser', 'cardBuilder', 'dom', 'apphost', 'imageLoad
});
}
function loadSections(page, userId, topParentId, types) {
export function loadSections(page, userId, topParentId, types) {
loading.show();
var sections = getSections();
var sectionid = getParameterByName('sectionid');
let sections = getSections();
const sectionid = getParameterByName('sectionid');
if (sectionid) {
sections = sections.filter(function (s) {
@ -196,24 +205,22 @@ define(['loading', 'libraryBrowser', 'cardBuilder', 'dom', 'apphost', 'imageLoad
});
}
var i;
var length;
var elem = page.querySelector('.favoriteSections');
let elem = page.querySelector('.favoriteSections');
if (!elem.innerHTML) {
var html = '';
let html = '';
for (i = 0, length = sections.length; i < length; i++) {
for (let i = 0, length = sections.length; i < length; i++) {
html += '<div class="verticalSection section' + sections[i].id + '"></div>';
}
elem.innerHTML = html;
}
var promises = [];
const promises = [];
for (i = 0, length = sections.length; i < length; i++) {
var section = sections[i];
for (let i = 0, length = sections.length; i < length; i++) {
const section = sections[i];
elem = page.querySelector('.section' + section.id);
promises.push(loadSection(elem, userId, topParentId, section, sections.length === 1));
}
@ -223,7 +230,8 @@ define(['loading', 'libraryBrowser', 'cardBuilder', 'dom', 'apphost', 'imageLoad
});
}
return {
export default {
render: loadSections
};
});
};
/* eslint-enable indent */

4
src/components/filtermenu/filtermenu.js
View file

@ -1,5 +1,8 @@
define(['require', 'dom', 'focusManager', 'dialogHelper', 'loading', 'apphost', 'inputManager', 'layoutManager', 'connectionManager', 'appRouter', 'globalize', 'userSettings', 'emby-checkbox', 'emby-input', 'paper-icon-button-light', 'emby-select', 'material-icons', 'css!./../formdialog', 'emby-button', 'flexStyles'], function (require, dom, focusManager, dialogHelper, loading, appHost, inputManager, layoutManager, connectionManager, appRouter, globalize, userSettings) {
'use strict';
focusManager = focusManager.default || focusManager;
layoutManager = layoutManager.default || layoutManager;
function onSubmit(e) {
e.preventDefault();
@ -150,6 +153,7 @@ define(['require', 'dom', 'focusManager', 'dialogHelper', 'loading', 'apphost',
function centerFocus(elem, horiz, on) {
require(['scrollHelper'], function (scrollHelper) {
scrollHelper = scrollHelper.default || scrollHelper;
var fn = on ? 'on' : 'off';
scrollHelper.centerFocus[fn](elem, horiz);
});

13
src/components/focusManager.js
View file

@ -1,5 +1,7 @@
define(['dom', 'scrollManager'], function (dom, scrollManager) {
'use strict';
/* eslint-disable indent */
import dom from 'dom';
import scrollManager from 'scrollManager';
var scopes = [];
function pushScope(elem) {
@ -472,7 +474,9 @@ define(['dom', 'scrollManager'], function (dom, scrollManager) {
}
}
return {
/* eslint-enable indent */
export default {
autoFocus: autoFocus,
focus: focus,
focusableParent: focusableParent,
@ -504,5 +508,4 @@ define(['dom', 'scrollManager'], function (dom, scrollManager) {
focusFirst: focusFirst,
focusLast: focusLast,
moveFocus: moveFocus
};
});
};

112
src/components/guide/guide-settings.js
View file

@ -1,14 +1,21 @@
define(['dialogHelper', 'globalize', 'userSettings', 'layoutManager', 'connectionManager', 'require', 'loading', 'scrollHelper', 'emby-checkbox', 'emby-radio', 'css!./../formdialog', 'material-icons'], function (dialogHelper, globalize, userSettings, layoutManager, connectionManager, require, loading, scrollHelper) {
'use strict';
import dialogHelper from 'dialogHelper';
import globalize from 'globalize';
import * as userSettings from 'userSettings';
import layoutManager from 'layoutManager';
import scrollHelper from 'scrollHelper';
import 'emby-checkbox';
import 'emby-radio';
import 'css!./../formdialog';
import 'material-icons';
function saveCategories(context, options) {
var categories = [];
function saveCategories(context, options) {
const categories = [];
var chkCategorys = context.querySelectorAll('.chkCategory');
for (var i = 0, length = chkCategorys.length; i < length; i++) {
var type = chkCategorys[i].getAttribute('data-type');
const chkCategorys = context.querySelectorAll('.chkCategory');
for (const chkCategory of chkCategorys) {
const type = chkCategory.getAttribute('data-type');
if (chkCategorys[i].checked) {
if (chkCategory.checked) {
categories.push(type);
}
}
@ -20,73 +27,69 @@ define(['dialogHelper', 'globalize', 'userSettings', 'layoutManager', 'connectio
// differentiate between none and all
categories.push('all');
options.categories = categories;
}
function loadCategories(context, options) {
const selectedCategories = options.categories || [];
const chkCategorys = context.querySelectorAll('.chkCategory');
for (const chkCategory of chkCategorys) {
const type = chkCategory.getAttribute('data-type');
chkCategory.checked = !selectedCategories.length || selectedCategories.indexOf(type) !== -1;
}
}
function loadCategories(context, options) {
var selectedCategories = options.categories || [];
function save(context) {
const chkIndicators = context.querySelectorAll('.chkIndicator');
var chkCategorys = context.querySelectorAll('.chkCategory');
for (var i = 0, length = chkCategorys.length; i < length; i++) {
var type = chkCategorys[i].getAttribute('data-type');
chkCategorys[i].checked = !selectedCategories.length || selectedCategories.indexOf(type) !== -1;
}
}
function save(context) {
var i;
var length;
var chkIndicators = context.querySelectorAll('.chkIndicator');
for (i = 0, length = chkIndicators.length; i < length; i++) {
var type = chkIndicators[i].getAttribute('data-type');
userSettings.set('guide-indicator-' + type, chkIndicators[i].checked);
for (const chkIndicator of chkIndicators) {
const type = chkIndicator.getAttribute('data-type');
userSettings.set('guide-indicator-' + type, chkIndicator.checked);
}
userSettings.set('guide-colorcodedbackgrounds', context.querySelector('.chkColorCodedBackgrounds').checked);
userSettings.set('livetv-favoritechannelsattop', context.querySelector('.chkFavoriteChannelsAtTop').checked);
var sortBys = context.querySelectorAll('.chkSortOrder');
for (i = 0, length = sortBys.length; i < length; i++) {
if (sortBys[i].checked) {
userSettings.set('livetv-channelorder', sortBys[i].value);
const sortBys = context.querySelectorAll('.chkSortOrder');
for (const sortBy of sortBys) {
if (sortBy.checked) {
userSettings.set('livetv-channelorder', sortBy.value);
break;
}
}
}
}
function load(context) {
var i;
var length;
function load(context) {
const chkIndicators = context.querySelectorAll('.chkIndicator');
var chkIndicators = context.querySelectorAll('.chkIndicator');
for (i = 0, length = chkIndicators.length; i < length; i++) {
var type = chkIndicators[i].getAttribute('data-type');
for (const chkIndicator of chkIndicators) {
const type = chkIndicator.getAttribute('data-type');
if (chkIndicators[i].getAttribute('data-default') === 'true') {
chkIndicators[i].checked = userSettings.get('guide-indicator-' + type) !== 'false';
if (chkIndicator.getAttribute('data-default') === 'true') {
chkIndicator.checked = userSettings.get('guide-indicator-' + type) !== 'false';
} else {
chkIndicators[i].checked = userSettings.get('guide-indicator-' + type) === 'true';
chkIndicator.checked = userSettings.get('guide-indicator-' + type) === 'true';
}
}
context.querySelector('.chkColorCodedBackgrounds').checked = userSettings.get('guide-colorcodedbackgrounds') === 'true';
context.querySelector('.chkFavoriteChannelsAtTop').checked = userSettings.get('livetv-favoritechannelsattop') !== 'false';
var sortByValue = userSettings.get('livetv-channelorder') || 'Number';
const sortByValue = userSettings.get('livetv-channelorder') || 'Number';
var sortBys = context.querySelectorAll('.chkSortOrder');
for (i = 0, length = sortBys.length; i < length; i++) {
sortBys[i].checked = sortBys[i].value === sortByValue;
}
const sortBys = context.querySelectorAll('.chkSortOrder');
for (const sortBy of sortBys) {
sortBy.checked = sortBy.value === sortByValue;
}
}
function showEditor(options) {
function showEditor(options) {
return new Promise(function (resolve, reject) {
var settingsChanged = false;
let settingsChanged = false;
require(['text!./guide-settings.template.html'], function (template) {
var dialogOptions = {
import('text!./guide-settings.template.html').then(({ default: template }) => {
const dialogOptions = {
removeOnClose: true,
scrollY: false
};
@ -97,11 +100,11 @@ define(['dialogHelper', 'globalize', 'userSettings', 'layoutManager', 'connectio
dialogOptions.size = 'small';
}
var dlg = dialogHelper.createDialog(dialogOptions);
const dlg = dialogHelper.createDialog(dialogOptions);
dlg.classList.add('formDialog');
var html = '';
let html = '';
html += globalize.translateHtml(template, 'core');
@ -139,9 +142,8 @@ define(['dialogHelper', 'globalize', 'userSettings', 'layoutManager', 'connectio
dialogHelper.open(dlg);
});
});
}
}
return {
export default {
show: showEditor
};
});
};

420
src/components/guide/guide.js
View file

@ -1,39 +1,64 @@
define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager', 'scrollHelper', 'serverNotifications', 'loading', 'datetime', 'focusManager', 'playbackManager', 'userSettings', 'imageLoader', 'events', 'layoutManager', 'itemShortcuts', 'dom', 'css!./guide.css', 'programStyles', 'material-icons', 'scrollStyles', 'emby-programcell', 'emby-button', 'paper-icon-button-light', 'emby-tabs', 'emby-scroller', 'flexStyles', 'webcomponents'], function (require, inputManager, browser, globalize, connectionManager, scrollHelper, serverNotifications, loading, datetime, focusManager, playbackManager, userSettings, imageLoader, events, layoutManager, itemShortcuts, dom) {
'use strict';
import inputManager from 'inputManager';
import browser from 'browser';
import globalize from 'globalize';
import connectionManager from 'connectionManager';
import scrollHelper from 'scrollHelper';
import serverNotifications from 'serverNotifications';
import loading from 'loading';
import datetime from 'datetime';
import focusManager from 'focusManager';
import playbackManager from 'playbackManager';
import * as userSettings from 'userSettings';
import imageLoader from 'imageLoader';
import events from 'events';
import layoutManager from 'layoutManager';
import itemShortcuts from 'itemShortcuts';
import dom from 'dom';
import 'css!./guide.css';
import 'programStyles';
import 'material-icons';
import 'scrollStyles';
import 'emby-programcell';
import 'emby-button';
import 'paper-icon-button-light';
import 'emby-tabs';
import 'emby-scroller';
import 'flexStyles';
import 'webcomponents';
function showViewSettings(instance) {
require(['guide-settings-dialog'], function (guideSettingsDialog) {
function showViewSettings(instance) {
import('guide-settings-dialog').then(({default: guideSettingsDialog}) => {
guideSettingsDialog.show(instance.categoryOptions).then(function () {
instance.refresh();
});
});
}
}
function updateProgramCellOnScroll(cell, scrollPct) {
var left = cell.posLeft;
function updateProgramCellOnScroll(cell, scrollPct) {
let left = cell.posLeft;
if (!left) {
left = parseFloat(cell.style.left.replace('%', ''));
cell.posLeft = left;
}
var width = cell.posWidth;
let width = cell.posWidth;
if (!width) {
width = parseFloat(cell.style.width.replace('%', ''));
cell.posWidth = width;
}
var right = left + width;
var newPct = Math.max(Math.min(scrollPct, right), left);
const right = left + width;
const newPct = Math.max(Math.min(scrollPct, right), left);
var offset = newPct - left;
var pctOfWidth = (offset / width) * 100;
const offset = newPct - left;
const pctOfWidth = (offset / width) * 100;
var guideProgramName = cell.guideProgramName;
let guideProgramName = cell.guideProgramName;
if (!guideProgramName) {
guideProgramName = cell.querySelector('.guideProgramName');
cell.guideProgramName = guideProgramName;
}
var caret = cell.caret;
let caret = cell.caret;
if (!caret) {
caret = cell.querySelector('.guide-programNameCaret');
cell.caret = caret;
@ -48,10 +73,10 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
caret.classList.add('hide');
}
}
}
}
var isUpdatingProgramCellScroll = false;
function updateProgramCellsOnScroll(programGrid, programCells) {
let isUpdatingProgramCellScroll = false;
function updateProgramCellsOnScroll(programGrid, programCells) {
if (isUpdatingProgramCellScroll) {
return;
}
@ -59,34 +84,34 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
isUpdatingProgramCellScroll = true;
requestAnimationFrame(function () {
var scrollLeft = programGrid.scrollLeft;
const scrollLeft = programGrid.scrollLeft;
var scrollPct = scrollLeft ? (scrollLeft / programGrid.scrollWidth) * 100 : 0;
const scrollPct = scrollLeft ? (scrollLeft / programGrid.scrollWidth) * 100 : 0;
for (var i = 0, length = programCells.length; i < length; i++) {
updateProgramCellOnScroll(programCells[i], scrollPct);
for (const programCell of programCells) {
updateProgramCellOnScroll(programCell, scrollPct);
}
isUpdatingProgramCellScroll = false;
});
}
}
function onProgramGridClick(e) {
function onProgramGridClick(e) {
if (!layoutManager.tv) {
return;
}
var programCell = dom.parentWithClass(e.target, 'programCell');
const programCell = dom.parentWithClass(e.target, 'programCell');
if (programCell) {
var startDate = programCell.getAttribute('data-startdate');
var endDate = programCell.getAttribute('data-enddate');
let startDate = programCell.getAttribute('data-startdate');
let endDate = programCell.getAttribute('data-enddate');
startDate = datetime.parseISO8601Date(startDate, { toLocal: true }).getTime();
endDate = datetime.parseISO8601Date(endDate, { toLocal: true }).getTime();
var now = new Date().getTime();
const now = new Date().getTime();
if (now >= startDate && now < endDate) {
var channelId = programCell.getAttribute('data-channelid');
var serverId = programCell.getAttribute('data-serverid');
const channelId = programCell.getAttribute('data-channelid');
const serverId = programCell.getAttribute('data-serverid');
e.preventDefault();
e.stopPropagation();
@ -97,27 +122,27 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
});
}
}
}
}
function Guide(options) {
var self = this;
var items = {};
function Guide(options) {
const self = this;
let items = {};
self.options = options;
self.categoryOptions = { categories: [] };
// 30 mins
var cellCurationMinutes = 30;
var cellDurationMs = cellCurationMinutes * 60 * 1000;
var msPerDay = 86400000;
const cellCurationMinutes = 30;
const cellDurationMs = cellCurationMinutes * 60 * 1000;
const msPerDay = 86400000;
var currentDate;
var currentStartIndex = 0;
var currentChannelLimit = 0;
var autoRefreshInterval;
var programCells;
var lastFocusDirection;
var programGrid;
let currentDate;
let currentStartIndex = 0;
let currentChannelLimit = 0;
let autoRefreshInterval;
let programCells;
let lastFocusDirection;
let programGrid;
self.refresh = function () {
currentDate = null;
@ -153,7 +178,7 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
function restartAutoRefresh() {
stopAutoRefresh();
var intervalMs = 60000 * 15; // (minutes)
const intervalMs = 60000 * 15; // (minutes)
autoRefreshInterval = setInterval(function () {
self.refresh();
@ -168,7 +193,7 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
}
function normalizeDateToTimeslot(date) {
var minutesOffset = date.getMinutes() - cellCurationMinutes;
const minutesOffset = date.getMinutes() - cellCurationMinutes;
if (minutesOffset >= 0) {
date.setHours(date.getHours(), cellCurationMinutes, 0, 0);
@ -188,9 +213,9 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
}
function reloadGuide(context, newStartDate, scrollToTimeMs, focusToTimeMs, startTimeOfDayMs, focusProgramOnRender) {
var apiClient = connectionManager.getApiClient(options.serverId);
const apiClient = connectionManager.getApiClient(options.serverId);
var channelQuery = {
const channelQuery = {
StartIndex: 0,
EnableFavoriteSorting: userSettings.get('livetv-favoritechannelsattop') !== 'false'
@ -198,7 +223,7 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
channelQuery.UserId = apiClient.getCurrentUserId();
var channelLimit = 500;
const channelLimit = 500;
currentChannelLimit = channelLimit;
showLoading();
@ -209,12 +234,12 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
channelQuery.EnableUserData = false;
channelQuery.EnableImageTypes = 'Primary';
var categories = self.categoryOptions.categories || [];
var displayMovieContent = !categories.length || categories.indexOf('movies') !== -1;
var displaySportsContent = !categories.length || categories.indexOf('sports') !== -1;
var displayNewsContent = !categories.length || categories.indexOf('news') !== -1;
var displayKidsContent = !categories.length || categories.indexOf('kids') !== -1;
var displaySeriesContent = !categories.length || categories.indexOf('series') !== -1;
const categories = self.categoryOptions.categories || [];
const displayMovieContent = !categories.length || categories.indexOf('movies') !== -1;
const displaySportsContent = !categories.length || categories.indexOf('sports') !== -1;
const displayNewsContent = !categories.length || categories.indexOf('news') !== -1;
const displayKidsContent = !categories.length || categories.indexOf('kids') !== -1;
const displaySeriesContent = !categories.length || categories.indexOf('series') !== -1;
if (displayMovieContent && displaySportsContent && displayNewsContent && displayKidsContent) {
channelQuery.IsMovie = null;
@ -248,19 +273,19 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
channelQuery.SortOrder = null;
}
var date = newStartDate;
let date = newStartDate;
// Add one second to avoid getting programs that are just ending
date = new Date(date.getTime() + 1000);
// Subtract to avoid getting programs that are starting when the grid ends
var nextDay = new Date(date.getTime() + msPerDay - 2000);
const nextDay = new Date(date.getTime() + msPerDay - 2000);
// Normally we'd want to just let responsive css handle this,
// but since mobile browsers are often underpowered,
// it can help performance to get them out of the markup
var allowIndicators = dom.getWindowSize().innerWidth >= 600;
const allowIndicators = dom.getWindowSize().innerWidth >= 600;
var renderOptions = {
const renderOptions = {
showHdIcon: allowIndicators && userSettings.get('guide-indicator-hd') === 'true',
showLiveIndicator: allowIndicators && userSettings.get('guide-indicator-live') !== 'false',
showPremiereIndicator: allowIndicators && userSettings.get('guide-indicator-premiere') !== 'false',
@ -270,8 +295,8 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
};
apiClient.getLiveTvChannels(channelQuery).then(function (channelsResult) {
var btnPreviousPage = context.querySelector('.btnPreviousPage');
var btnNextPage = context.querySelector('.btnNextPage');
const btnPreviousPage = context.querySelector('.btnPreviousPage');
const btnNextPage = context.querySelector('.btnNextPage');
if (channelsResult.TotalRecordCount > channelLimit) {
context.querySelector('.guideOptions').classList.remove('hide');
@ -294,9 +319,9 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
context.querySelector('.guideOptions').classList.add('hide');
}
var programFields = [];
const programFields = [];
var programQuery = {
const programQuery = {
UserId: apiClient.getCurrentUserId(),
MaxStartDate: nextDay.toISOString(),
MinEndDate: date.toISOString(),
@ -340,7 +365,7 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
}
function getTimeslotHeadersHtml(startDate, endDateTime) {
var html = '';
let html = '';
// clone
startDate = new Date(startDate.getTime());
@ -381,7 +406,7 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
}
function getTimerIndicator(item) {
var status;
let status;
if (item.Type === 'SeriesTimer') {
return '<span class="material-icons programIcon seriesTimerIcon fiber_smart_record"></span>';
@ -405,30 +430,30 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
}
function getChannelProgramsHtml(context, date, channel, programs, options, listInfo) {
var html = '';
let html = '';
var startMs = date.getTime();
var endMs = startMs + msPerDay - 1;
const startMs = date.getTime();
const endMs = startMs + msPerDay - 1;
var outerCssClass = layoutManager.tv ? 'channelPrograms channelPrograms-tv' : 'channelPrograms';
const outerCssClass = layoutManager.tv ? 'channelPrograms channelPrograms-tv' : 'channelPrograms';
html += '<div class="' + outerCssClass + '" data-channelid="' + channel.Id + '">';
var clickAction = layoutManager.tv ? 'link' : 'programdialog';
const clickAction = layoutManager.tv ? 'link' : 'programdialog';
var categories = self.categoryOptions.categories || [];
var displayMovieContent = !categories.length || categories.indexOf('movies') !== -1;
var displaySportsContent = !categories.length || categories.indexOf('sports') !== -1;
var displayNewsContent = !categories.length || categories.indexOf('news') !== -1;
var displayKidsContent = !categories.length || categories.indexOf('kids') !== -1;
var displaySeriesContent = !categories.length || categories.indexOf('series') !== -1;
var enableColorCodedBackgrounds = userSettings.get('guide-colorcodedbackgrounds') === 'true';
const categories = self.categoryOptions.categories || [];
const displayMovieContent = !categories.length || categories.indexOf('movies') !== -1;
const displaySportsContent = !categories.length || categories.indexOf('sports') !== -1;
const displayNewsContent = !categories.length || categories.indexOf('news') !== -1;
const displayKidsContent = !categories.length || categories.indexOf('kids') !== -1;
const displaySeriesContent = !categories.length || categories.indexOf('series') !== -1;
const enableColorCodedBackgrounds = userSettings.get('guide-colorcodedbackgrounds') === 'true';
var programsFound;
var now = new Date().getTime();
let programsFound;
const now = new Date().getTime();
for (var i = listInfo.startIndex, length = programs.length; i < length; i++) {
var program = programs[i];
for (let i = listInfo.startIndex, length = programs.length; i < length; i++) {
const program = programs[i];
if (program.ChannelId !== channel.Id) {
if (programsFound) {
@ -443,8 +468,8 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
parseDates(program);
var startDateLocalMs = program.StartDateLocal.getTime();
var endDateLocalMs = program.EndDateLocal.getTime();
const startDateLocalMs = program.StartDateLocal.getTime();
const endDateLocalMs = program.EndDateLocal.getTime();
if (endDateLocalMs < startMs) {
continue;
@ -456,18 +481,18 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
items[program.Id] = program;
var renderStartMs = Math.max(startDateLocalMs, startMs);
var startPercent = (startDateLocalMs - startMs) / msPerDay;
const renderStartMs = Math.max(startDateLocalMs, startMs);
let startPercent = (startDateLocalMs - startMs) / msPerDay;
startPercent *= 100;
startPercent = Math.max(startPercent, 0);
var renderEndMs = Math.min(endDateLocalMs, endMs);
var endPercent = (renderEndMs - renderStartMs) / msPerDay;
const renderEndMs = Math.min(endDateLocalMs, endMs);
let endPercent = (renderEndMs - renderStartMs) / msPerDay;
endPercent *= 100;
var cssClass = 'programCell itemAction';
var accentCssClass = null;
var displayInnerContent = true;
let cssClass = 'programCell itemAction';
let accentCssClass = null;
let displayInnerContent = true;
if (program.IsKids) {
displayInnerContent = displayKidsContent;
@ -495,7 +520,7 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
cssClass += ' programCell-active';
}
var timerAttributes = '';
let timerAttributes = '';
if (program.TimerId) {
timerAttributes += ' data-timerid="' + program.TimerId + '"';
}
@ -503,12 +528,12 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
timerAttributes += ' data-seriestimerid="' + program.SeriesTimerId + '"';
}
var isAttribute = endPercent >= 2 ? ' is="emby-programcell"' : '';
const isAttribute = endPercent >= 2 ? ' is="emby-programcell"' : '';
html += '<button' + isAttribute + ' data-action="' + clickAction + '"' + timerAttributes + ' data-channelid="' + program.ChannelId + '" data-id="' + program.Id + '" data-serverid="' + program.ServerId + '" data-startdate="' + program.StartDate + '" data-enddate="' + program.EndDate + '" data-type="' + program.Type + '" class="' + cssClass + '" style="left:' + startPercent + '%;width:' + endPercent + '%;">';
if (displayInnerContent) {
var guideProgramNameClass = 'guideProgramName';
const guideProgramNameClass = 'guideProgramName';
html += '<div class="' + guideProgramNameClass + '">';
@ -516,7 +541,7 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
html += '<div class="guideProgramNameText">' + program.Name;
var indicatorHtml = null;
let indicatorHtml = null;
if (program.IsLive && options.showLiveIndicator) {
indicatorHtml = '<span class="liveTvProgram guideProgramIndicator">' + globalize.translate('Live') + '</span>';
} else if (program.IsPremiere && options.showPremiereIndicator) {
@ -561,19 +586,18 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
}
function renderChannelHeaders(context, channels, apiClient) {
var html = '';
let html = '';
for (var i = 0, length = channels.length; i < length; i++) {
var channel = channels[i];
var hasChannelImage = channel.ImageTags.Primary;
for (const channel of channels) {
const hasChannelImage = channel.ImageTags.Primary;
var cssClass = 'guide-channelHeaderCell itemAction';
let cssClass = 'guide-channelHeaderCell itemAction';
if (layoutManager.tv) {
cssClass += ' guide-channelHeaderCell-tv';
}
var title = [];
const title = [];
if (channel.ChannelNumber) {
title.push(channel.ChannelNumber);
}
@ -584,7 +608,7 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
html += '<button title="' + title.join(' ') + '" type="button" class="' + cssClass + '"' + ' data-action="link" data-isfolder="' + channel.IsFolder + '" data-id="' + channel.Id + '" data-serverid="' + channel.ServerId + '" data-type="' + channel.Type + '">';
if (hasChannelImage) {
var url = apiClient.getScaledImageUrl(channel.Id, {
const url = apiClient.getScaledImageUrl(channel.Id, {
maxHeight: 220,
tag: channel.ImageTags.Primary,
type: 'Primary'
@ -604,20 +628,20 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
html += '</button>';
}
var channelList = context.querySelector('.channelsContainer');
const channelList = context.querySelector('.channelsContainer');
channelList.innerHTML = html;
imageLoader.lazyChildren(channelList);
}
function renderPrograms(context, date, channels, programs, options) {
var listInfo = {
const listInfo = {
startIndex: 0
};
var html = [];
const html = [];
for (var i = 0, length = channels.length; i < length; i++) {
html.push(getChannelProgramsHtml(context, date, channels[i], programs, options, listInfo));
for (const channel of channels) {
html.push(getChannelProgramsHtml(context, date, channel, programs, options, listInfo));
}
programGrid.innerHTML = html.join('');
@ -628,17 +652,17 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
}
function getProgramSortOrder(program, channels) {
var channelId = program.ChannelId;
var channelIndex = -1;
const channelId = program.ChannelId;
let channelIndex = -1;
for (var i = 0, length = channels.length; i < length; i++) {
for (let i = 0, length = channels.length; i < length; i++) {
if (channelId === channels[i].Id) {
channelIndex = i;
break;
}
}
var start = datetime.parseISO8601Date(program.StartDate, { toLocal: true });
const start = datetime.parseISO8601Date(program.StartDate, { toLocal: true });
return (channelIndex * 10000000) + (start.getTime() / 60000);
}
@ -648,9 +672,9 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
return getProgramSortOrder(a, channels) - getProgramSortOrder(b, channels);
});
var activeElement = document.activeElement;
var itemId = activeElement && activeElement.getAttribute ? activeElement.getAttribute('data-id') : null;
var channelRowId = null;
const activeElement = document.activeElement;
const itemId = activeElement && activeElement.getAttribute ? activeElement.getAttribute('data-id') : null;
let channelRowId = null;
if (activeElement) {
channelRowId = dom.parentWithClass(activeElement, 'channelPrograms');
@ -659,8 +683,8 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
renderChannelHeaders(context, channels, apiClient);
var startDate = date;
var endDate = new Date(startDate.getTime() + msPerDay);
const startDate = date;
const endDate = new Date(startDate.getTime() + msPerDay);
context.querySelector('.timeslotHeaders').innerHTML = getTimeslotHeadersHtml(startDate, endDate);
items = {};
renderPrograms(context, date, channels, programs, renderOptions);
@ -675,17 +699,17 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
function scrollProgramGridToTimeMs(context, scrollToTimeMs, startTimeOfDayMs) {
scrollToTimeMs -= startTimeOfDayMs;
var pct = scrollToTimeMs / msPerDay;
const pct = scrollToTimeMs / msPerDay;
programGrid.scrollTop = 0;
var scrollPos = pct * programGrid.scrollWidth;
const scrollPos = pct * programGrid.scrollWidth;
nativeScrollTo(programGrid, scrollPos, true);
}
function focusProgram(context, itemId, channelRowId, focusToTimeMs, startTimeOfDayMs) {
var focusElem;
let focusElem;
if (itemId) {
focusElem = context.querySelector('[data-id="' + itemId + '"]');
}
@ -693,7 +717,7 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
if (focusElem) {
focusManager.focus(focusElem);
} else {
var autoFocusParent;
let autoFocusParent;
if (channelRowId) {
autoFocusParent = context.querySelector('[data-channelid="' + channelRowId + '"]');
@ -705,14 +729,14 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
focusToTimeMs -= startTimeOfDayMs;
var pct = (focusToTimeMs / msPerDay) * 100;
const pct = (focusToTimeMs / msPerDay) * 100;
var programCell = autoFocusParent.querySelector('.programCell');
let programCell = autoFocusParent.querySelector('.programCell');
while (programCell) {
var left = (programCell.style.left || '').replace('%', '');
let left = (programCell.style.left || '').replace('%', '');
left = left ? parseFloat(left) : 0;
var width = (programCell.style.width || '').replace('%', '');
let width = (programCell.style.width || '').replace('%', '');
width = width ? parseFloat(width) : 0;
if (left >= pct || (left + width) >= pct) {
@ -745,14 +769,14 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
}
}
var lastGridScroll = 0;
var lastHeaderScroll = 0;
var scrollXPct = 0;
let lastGridScroll = 0;
let lastHeaderScroll = 0;
let scrollXPct = 0;
function onProgramGridScroll(context, elem, timeslotHeaders) {
if ((new Date().getTime() - lastHeaderScroll) >= 1000) {
lastGridScroll = new Date().getTime();
var scrollLeft = elem.scrollLeft;
const scrollLeft = elem.scrollLeft;
scrollXPct = (scrollLeft * 100) / elem.scrollWidth;
nativeScrollTo(timeslotHeaders, scrollLeft, true);
}
@ -768,17 +792,17 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
}
function changeDate(page, date, scrollToTimeMs, focusToTimeMs, startTimeOfDayMs, focusProgramOnRender) {
var newStartDate = normalizeDateToTimeslot(date);
const newStartDate = normalizeDateToTimeslot(date);
currentDate = newStartDate;
reloadGuide(page, newStartDate, scrollToTimeMs, focusToTimeMs, startTimeOfDayMs, focusProgramOnRender);
}
function getDateTabText(date, isActive, tabIndex) {
var cssClass = isActive ? 'emby-tab-button guide-date-tab-button emby-tab-button-active' : 'emby-tab-button guide-date-tab-button';
const cssClass = isActive ? 'emby-tab-button guide-date-tab-button emby-tab-button-active' : 'emby-tab-button guide-date-tab-button';
var html = '<button is="emby-button" class="' + cssClass + '" data-index="' + tabIndex + '" data-date="' + date.getTime() + '">';
var tabText = datetime.toLocaleDateString(date, { weekday: 'short' });
let html = '<button is="emby-button" class="' + cssClass + '" data-index="' + tabIndex + '" data-date="' + date.getTime() + '">';
let tabText = datetime.toLocaleDateString(date, { weekday: 'short' });
tabText += '<br/>';
tabText += date.getDate();
@ -789,12 +813,12 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
}
function setDateRange(page, guideInfo) {
var today = new Date();
var nowHours = today.getHours();
const today = new Date();
const nowHours = today.getHours();
today.setHours(nowHours, 0, 0, 0);
var start = datetime.parseISO8601Date(guideInfo.StartDate, { toLocal: true });
var end = datetime.parseISO8601Date(guideInfo.EndDate, { toLocal: true });
let start = datetime.parseISO8601Date(guideInfo.StartDate, { toLocal: true });
const end = datetime.parseISO8601Date(guideInfo.EndDate, { toLocal: true });
start.setHours(nowHours, 0, 0, 0);
end.setHours(0, 0, 0, 0);
@ -805,11 +829,11 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
start = new Date(Math.max(today, start));
var dateTabsHtml = '';
var tabIndex = 0;
let dateTabsHtml = '';
let tabIndex = 0;
// TODO: Use date-fns
var date = new Date();
const date = new Date();
if (currentDate) {
date.setTime(currentDate.getTime());
@ -817,11 +841,11 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
date.setHours(nowHours, 0, 0, 0);
var startTimeOfDayMs = (start.getHours() * 60 * 60 * 1000);
let startTimeOfDayMs = (start.getHours() * 60 * 60 * 1000);
startTimeOfDayMs += start.getMinutes() * 60 * 1000;
while (start <= end) {
var isActive = date.getDate() === start.getDate() && date.getMonth() === start.getMonth() && date.getFullYear() === start.getFullYear();
const isActive = date.getDate() === start.getDate() && date.getMonth() === start.getMonth() && date.getFullYear() === start.getFullYear();
dateTabsHtml += getDateTabText(start, isActive, tabIndex);
@ -833,23 +857,23 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
page.querySelector('.emby-tabs-slider').innerHTML = dateTabsHtml;
page.querySelector('.guideDateTabs').refresh();
var newDate = new Date();
var newDateHours = newDate.getHours();
var scrollToTimeMs = newDateHours * 60 * 60 * 1000;
const newDate = new Date();
const newDateHours = newDate.getHours();
let scrollToTimeMs = newDateHours * 60 * 60 * 1000;
var minutes = newDate.getMinutes();
const minutes = newDate.getMinutes();
if (minutes >= 30) {
scrollToTimeMs += 30 * 60 * 1000;
}
var focusToTimeMs = ((newDateHours * 60) + minutes) * 60 * 1000;
const focusToTimeMs = ((newDateHours * 60) + minutes) * 60 * 1000;
changeDate(page, date, scrollToTimeMs, focusToTimeMs, startTimeOfDayMs, layoutManager.tv);
}
function reloadPage(page) {
showLoading();
var apiClient = connectionManager.getApiClient(options.serverId);
const apiClient = connectionManager.getApiClient(options.serverId);
apiClient.getLiveTvGuideInfo().then(function (guideInfo) {
setDateRange(page, guideInfo);
@ -857,18 +881,17 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
}
function getChannelProgramsFocusableElements(container) {
var elements = container.querySelectorAll('.programCell');
const elements = container.querySelectorAll('.programCell');
var list = [];
const list = [];
// add 1 to avoid programs that are out of view to the left
var currentScrollXPct = scrollXPct + 1;
const currentScrollXPct = scrollXPct + 1;
for (var i = 0, length = elements.length; i < length; i++) {
var elem = elements[i];
var left = (elem.style.left || '').replace('%', '');
for (const elem of elements) {
let left = (elem.style.left || '').replace('%', '');
left = left ? parseFloat(left) : 0;
var width = (elem.style.width || '').replace('%', '');
let width = (elem.style.width || '').replace('%', '');
width = width ? parseFloat(width) : 0;
if ((left + width) >= currentScrollXPct) {
@ -880,12 +903,12 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
}
function onInputCommand(e) {
var target = e.target;
var programCell = dom.parentWithClass(target, 'programCell');
var container;
var channelPrograms;
var focusableElements;
var newRow;
const target = e.target;
const programCell = dom.parentWithClass(target, 'programCell');
let container;
let channelPrograms;
let focusableElements;
let newRow;
switch (e.detail.command) {
case 'up':
@ -969,14 +992,14 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
}
function onScrollerFocus(e) {
var target = e.target;
var programCell = dom.parentWithClass(target, 'programCell');
const target = e.target;
const programCell = dom.parentWithClass(target, 'programCell');
if (programCell) {
var focused = target;
const focused = target;
var id = focused.getAttribute('data-id');
var item = items[id];
const id = focused.getAttribute('data-id');
const item = items[id];
if (item) {
events.trigger(self, 'focus', [
@ -995,9 +1018,9 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
scrollHelper.toCenter(programGrid, programCell, true, true);
}
} else if (lastFocusDirection === 'up' || lastFocusDirection === 'down') {
var verticalScroller = dom.parentWithClass(target, 'guideVerticalScroller');
const verticalScroller = dom.parentWithClass(target, 'guideVerticalScroller');
if (verticalScroller) {
var focusedElement = programCell || dom.parentWithTag(target, 'BUTTON');
const focusedElement = programCell || dom.parentWithTag(target, 'BUTTON');
verticalScroller.toCenter(focusedElement, true);
}
}
@ -1005,7 +1028,7 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
function setScrollEvents(view, enabled) {
if (layoutManager.tv) {
var guideVerticalScroller = view.querySelector('.guideVerticalScroller');
const guideVerticalScroller = view.querySelector('.guideVerticalScroller');
if (enabled) {
inputManager.on(guideVerticalScroller, onInputCommand);
@ -1016,16 +1039,14 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
}
function onTimerCreated(e, apiClient, data) {
var programId = data.ProgramId;
const programId = data.ProgramId;
// This could be null, not supported by all tv providers
var newTimerId = data.Id;
const newTimerId = data.Id;
// find guide cells by program id, ensure timer icon
var cells = options.element.querySelectorAll('.programCell[data-id="' + programId + '"]');
for (var i = 0, length = cells.length; i < length; i++) {
var cell = cells[i];
var icon = cell.querySelector('.timerIcon');
const cells = options.element.querySelectorAll('.programCell[data-id="' + programId + '"]');
for (const cell of cells) {
const icon = cell.querySelector('.timerIcon');
if (!icon) {
cell.querySelector('.guideProgramName').insertAdjacentHTML('beforeend', '<span class="timerIcon material-icons programIcon fiber_manual_record"></span>');
}
@ -1040,42 +1061,46 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
}
function onTimerCancelled(e, apiClient, data) {
var id = data.Id;
const id = data.Id;
// find guide cells by timer id, remove timer icon
var cells = options.element.querySelectorAll('.programCell[data-timerid="' + id + '"]');
for (var i = 0, length = cells.length; i < length; i++) {
var cell = cells[i];
var icon = cell.querySelector('.timerIcon');
const cells = options.element.querySelectorAll('.programCell[data-timerid="' + id + '"]');
for (const cell of cells) {
const icon = cell.querySelector('.timerIcon');
if (icon) {
icon.parentNode.removeChild(icon);
}
cell.removeAttribute('data-timerid');
}
}
function onSeriesTimerCancelled(e, apiClient, data) {
var id = data.Id;
const id = data.Id;
// find guide cells by timer id, remove timer icon
var cells = options.element.querySelectorAll('.programCell[data-seriestimerid="' + id + '"]');
for (var i = 0, length = cells.length; i < length; i++) {
var cell = cells[i];
var icon = cell.querySelector('.seriesTimerIcon');
const cells = options.element.querySelectorAll('.programCell[data-seriestimerid="' + id + '"]');
for (const cell of cells) {
const icon = cell.querySelector('.seriesTimerIcon');
if (icon) {
icon.parentNode.removeChild(icon);
}
cell.removeAttribute('data-seriestimerid');
}
}
require(['text!./tvguide.template.html'], function (template) {
var context = options.element;
import('text!./tvguide.template.html').then(({default: template}) => {
const context = options.element;
context.classList.add('tvguide');
context.innerHTML = globalize.translateHtml(template, 'core');
programGrid = context.querySelector('.programGrid');
var timeslotHeaders = context.querySelector('.timeslotHeaders');
const timeslotHeaders = context.querySelector('.timeslotHeaders');
if (layoutManager.tv) {
dom.addEventListener(context.querySelector('.guideVerticalScroller'), 'focus', onScrollerFocus, {
@ -1124,17 +1149,17 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
});
context.querySelector('.guideDateTabs').addEventListener('tabchange', function (e) {
var allTabButtons = e.target.querySelectorAll('.guide-date-tab-button');
const allTabButtons = e.target.querySelectorAll('.guide-date-tab-button');
var tabButton = allTabButtons[parseInt(e.detail.selectedTabIndex)];
const tabButton = allTabButtons[parseInt(e.detail.selectedTabIndex)];
if (tabButton) {
var previousButton = e.detail.previousIndex == null ? null : allTabButtons[parseInt(e.detail.previousIndex)];
const previousButton = e.detail.previousIndex == null ? null : allTabButtons[parseInt(e.detail.previousIndex)];
var date = new Date();
const date = new Date();
date.setTime(parseInt(tabButton.getAttribute('data-date')));
var scrollWidth = programGrid.scrollWidth;
var scrollToTimeMs;
const scrollWidth = programGrid.scrollWidth;
let scrollToTimeMs;
if (scrollWidth) {
scrollToTimeMs = (programGrid.scrollLeft / scrollWidth) * msPerDay;
} else {
@ -1142,14 +1167,14 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
}
if (previousButton) {
var previousDate = new Date();
const previousDate = new Date();
previousDate.setTime(parseInt(previousButton.getAttribute('data-date')));
scrollToTimeMs += (previousDate.getHours() * 60 * 60 * 1000);
scrollToTimeMs += (previousDate.getMinutes() * 60 * 1000);
}
var startTimeOfDayMs = (date.getHours() * 60 * 60 * 1000);
let startTimeOfDayMs = (date.getHours() * 60 * 60 * 1000);
startTimeOfDayMs += (date.getMinutes() * 60 * 1000);
changeDate(context, date, scrollToTimeMs, scrollToTimeMs, startTimeOfDayMs, false);
@ -1168,7 +1193,6 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
self.refresh();
});
}
}
return Guide;
});
export default Guide;

3
src/components/imageDownloader/imageDownloader.js
View file

@ -8,7 +8,6 @@ import browser from 'browser';
import layoutManager from 'layoutManager';
import scrollHelper from 'scrollHelper';
import globalize from 'globalize';
import require from 'require';
import 'emby-checkbox';
import 'paper-icon-button-light';
import 'emby-button';
@ -317,7 +316,7 @@ import 'cardStyle';
function showEditor(itemId, serverId, itemType) {
loading.show();
require(['text!./imageDownloader.template.html'], function (template) {
import('text!./imageDownloader.template.html').then(({default: template}) => {
const apiClient = connectionManager.getApiClient(serverId);
currentItemId = itemId;

6
src/components/imageeditor/imageeditor.js
View file

@ -59,8 +59,8 @@ import 'css!./imageeditor';
currentItem = item;
apiClient.getRemoteImageProviders(getBaseRemoteOptions()).then(function (providers) {
const btnBrowseAllImages = page.querySelectorAll('.btnBrowseAllImages');
for (let i = 0, length = btnBrowseAllImages.length; i < length; i++) {
var btnBrowseAllImages = page.querySelectorAll('.btnBrowseAllImages');
for (var i = 0, length = btnBrowseAllImages.length; i < length; i++) {
if (providers.length) {
btnBrowseAllImages[i].classList.remove('hide');
} else {
@ -217,7 +217,7 @@ import 'css!./imageeditor';
reload(context, null, focusContext);
}, function () {
import('alert').then(({default: alert}) => {
alert(globalize.translate('DefaultErrorMessage'));
alert(globalize.translate('ErrorDefault'));
});
});
}

2
src/components/images/imageLoader.js
View file

@ -205,7 +205,7 @@ import 'css!./style';
/* eslint-enable indent */
export default {
serLazyImage: setLazyImage,
setLazyImage: setLazyImage,
fillImages: fillImages,
fillImage: fillImage,
lazyImage: lazyImage,

190
src/components/itemsrefresher.js
View file

@ -1,10 +1,11 @@
define(['playbackManager', 'serverNotifications', 'events'], function (playbackManager, serverNotifications, events) {
'use strict';
import playbackManager from 'playbackManager';
import serverNotifications from 'serverNotifications';
import events from 'events';
function onUserDataChanged(e, apiClient, userData) {
var instance = this;
function onUserDataChanged(e, apiClient, userData) {
const instance = this;
var eventsToMonitor = getEventsToMonitor(instance);
const eventsToMonitor = getEventsToMonitor(instance);
// TODO: Check user data change reason?
if (eventsToMonitor.indexOf('markfavorite') !== -1) {
@ -12,72 +13,72 @@ define(['playbackManager', 'serverNotifications', 'events'], function (playbackM
} else if (eventsToMonitor.indexOf('markplayed') !== -1) {
instance.notifyRefreshNeeded();
}
}
}
function getEventsToMonitor(instance) {
var options = instance.options;
var monitor = options ? options.monitorEvents : null;
function getEventsToMonitor(instance) {
const options = instance.options;
const monitor = options ? options.monitorEvents : null;
if (monitor) {
return monitor.split(',');
}
return [];
}
}
function onTimerCreated(e, apiClient, data) {
var instance = this;
function onTimerCreated(e, apiClient, data) {
const instance = this;
if (getEventsToMonitor(instance).indexOf('timers') !== -1) {
instance.notifyRefreshNeeded();
return;
}
}
}
function onSeriesTimerCreated(e, apiClient, data) {
var instance = this;
function onSeriesTimerCreated(e, apiClient, data) {
const instance = this;
if (getEventsToMonitor(instance).indexOf('seriestimers') !== -1) {
instance.notifyRefreshNeeded();
return;
}
}
}
function onTimerCancelled(e, apiClient, data) {
var instance = this;
function onTimerCancelled(e, apiClient, data) {
const instance = this;
if (getEventsToMonitor(instance).indexOf('timers') !== -1) {
instance.notifyRefreshNeeded();
return;
}
}
}
function onSeriesTimerCancelled(e, apiClient, data) {
var instance = this;
function onSeriesTimerCancelled(e, apiClient, data) {
const instance = this;
if (getEventsToMonitor(instance).indexOf('seriestimers') !== -1) {
instance.notifyRefreshNeeded();
return;
}
}
}
function onLibraryChanged(e, apiClient, data) {
var instance = this;
var eventsToMonitor = getEventsToMonitor(instance);
function onLibraryChanged(e, apiClient, data) {
const instance = this;
const eventsToMonitor = getEventsToMonitor(instance);
if (eventsToMonitor.indexOf('seriestimers') !== -1 || eventsToMonitor.indexOf('timers') !== -1) {
// yes this is an assumption
return;
}
var itemsAdded = data.ItemsAdded || [];
var itemsRemoved = data.ItemsRemoved || [];
const itemsAdded = data.ItemsAdded || [];
const itemsRemoved = data.ItemsRemoved || [];
if (!itemsAdded.length && !itemsRemoved.length) {
return;
}
var options = instance.options || {};
var parentId = options.parentId;
const options = instance.options || {};
const parentId = options.parentId;
if (parentId) {
var foldersAddedTo = data.FoldersAddedTo || [];
var foldersRemovedFrom = data.FoldersRemovedFrom || [];
var collectionFolders = data.CollectionFolders || [];
const foldersAddedTo = data.FoldersAddedTo || [];
const foldersRemovedFrom = data.FoldersRemovedFrom || [];
const collectionFolders = data.CollectionFolders || [];
if (foldersAddedTo.indexOf(parentId) === -1 && foldersRemovedFrom.indexOf(parentId) === -1 && collectionFolders.indexOf(parentId) === -1) {
return;
@ -85,14 +86,14 @@ define(['playbackManager', 'serverNotifications', 'events'], function (playbackM
}
instance.notifyRefreshNeeded();
}
}
function onPlaybackStopped(e, stopInfo) {
var instance = this;
function onPlaybackStopped(e, stopInfo) {
const instance = this;
var state = stopInfo.state;
const state = stopInfo.state;
var eventsToMonitor = getEventsToMonitor(instance);
const eventsToMonitor = getEventsToMonitor(instance);
if (state.NowPlayingItem && state.NowPlayingItem.MediaType === 'Video') {
if (eventsToMonitor.indexOf('videoplayback') !== -1) {
instance.notifyRefreshNeeded(true);
@ -104,25 +105,26 @@ define(['playbackManager', 'serverNotifications', 'events'], function (playbackM
return;
}
}
}
}
function addNotificationEvent(instance, name, handler, owner) {
var localHandler = handler.bind(instance);
function addNotificationEvent(instance, name, handler, owner) {
const localHandler = handler.bind(instance);
owner = owner || serverNotifications;
events.on(owner, name, localHandler);
instance['event_' + name] = localHandler;
}
}
function removeNotificationEvent(instance, name, owner) {
var handler = instance['event_' + name];
function removeNotificationEvent(instance, name, owner) {
const handler = instance['event_' + name];
if (handler) {
owner = owner || serverNotifications;
events.off(owner, name, handler);
instance['event_' + name] = null;
}
}
}
function ItemsRefresher(options) {
class ItemsRefresher {
constructor(options) {
this.options = options || {};
addNotificationEvent(this, 'UserDataChanged', onUserDataChanged);
@ -134,18 +136,18 @@ define(['playbackManager', 'serverNotifications', 'events'], function (playbackM
addNotificationEvent(this, 'playbackstop', onPlaybackStopped, playbackManager);
}
ItemsRefresher.prototype.pause = function () {
pause() {
clearRefreshInterval(this, true);
this.paused = true;
};
}
ItemsRefresher.prototype.resume = function (options) {
resume(options) {
this.paused = false;
var refreshIntervalEndTime = this.refreshIntervalEndTime;
const refreshIntervalEndTime = this.refreshIntervalEndTime;
if (refreshIntervalEndTime) {
var remainingMs = refreshIntervalEndTime - new Date().getTime();
const remainingMs = refreshIntervalEndTime - new Date().getTime();
if (remainingMs > 0 && !this.needsRefresh) {
resetRefreshInterval(this, remainingMs);
} else {
@ -159,9 +161,9 @@ define(['playbackManager', 'serverNotifications', 'events'], function (playbackM
}
return Promise.resolve();
};
}
ItemsRefresher.prototype.refreshItems = function () {
refreshItems() {
if (!this.fetchData) {
return Promise.resolve();
}
@ -174,15 +176,15 @@ define(['playbackManager', 'serverNotifications', 'events'], function (playbackM
this.needsRefresh = false;
return this.fetchData().then(onDataFetched.bind(this));
};
}
ItemsRefresher.prototype.notifyRefreshNeeded = function (isInForeground) {
notifyRefreshNeeded(isInForeground) {
if (this.paused) {
this.needsRefresh = true;
return;
}
var timeout = this.refreshTimeout;
const timeout = this.refreshTimeout;
if (timeout) {
clearTimeout(timeout);
}
@ -192,44 +194,9 @@ define(['playbackManager', 'serverNotifications', 'events'], function (playbackM
} else {
this.refreshTimeout = setTimeout(this.refreshItems.bind(this), 10000);
}
};
function clearRefreshInterval(instance, isPausing) {
if (instance.refreshInterval) {
clearInterval(instance.refreshInterval);
instance.refreshInterval = null;
if (!isPausing) {
instance.refreshIntervalEndTime = null;
}
}
}
function resetRefreshInterval(instance, intervalMs) {
clearRefreshInterval(instance);
if (!intervalMs) {
var options = instance.options;
if (options) {
intervalMs = options.refreshIntervalMs;
}
}
if (intervalMs) {
instance.refreshInterval = setInterval(instance.notifyRefreshNeeded.bind(instance), intervalMs);
instance.refreshIntervalEndTime = new Date().getTime() + intervalMs;
}
}
function onDataFetched(result) {
resetRefreshInterval(this);
if (this.afterRefresh) {
this.afterRefresh(result);
}
}
ItemsRefresher.prototype.destroy = function () {
destroy() {
clearRefreshInterval(this);
removeNotificationEvent(this, 'UserDataChanged');
@ -242,7 +209,42 @@ define(['playbackManager', 'serverNotifications', 'events'], function (playbackM
this.fetchData = null;
this.options = null;
};
}
}
return ItemsRefresher;
});
function clearRefreshInterval(instance, isPausing) {
if (instance.refreshInterval) {
clearInterval(instance.refreshInterval);
instance.refreshInterval = null;
if (!isPausing) {
instance.refreshIntervalEndTime = null;
}
}
}
function resetRefreshInterval(instance, intervalMs) {
clearRefreshInterval(instance);
if (!intervalMs) {
const options = instance.options;
if (options) {
intervalMs = options.refreshIntervalMs;
}
}
if (intervalMs) {
instance.refreshInterval = setInterval(instance.notifyRefreshNeeded.bind(instance), intervalMs);
instance.refreshIntervalEndTime = new Date().getTime() + intervalMs;
}
}
function onDataFetched(result) {
resetRefreshInterval(this);
if (this.afterRefresh) {
this.afterRefresh(result);
}
}
export default ItemsRefresher;

36
src/components/layoutManager.js
View file

@ -1,7 +1,8 @@
define(['browser', 'appSettings', 'events'], function (browser, appSettings, events) {
'use strict';
import browser from 'browser';
import appSettings from 'appSettings';
import events from 'events';
function setLayout(instance, layout, selectedLayout) {
function setLayout(instance, layout, selectedLayout) {
if (layout === selectedLayout) {
instance[layout] = true;
document.documentElement.classList.add('layout-' + layout);
@ -9,13 +10,10 @@ define(['browser', 'appSettings', 'events'], function (browser, appSettings, eve
instance[layout] = false;
document.documentElement.classList.remove('layout-' + layout);
}
}
}
function LayoutManager() {
}
LayoutManager.prototype.setLayout = function (layout, save) {
class LayoutManager {
setLayout(layout, save) {
if (!layout || layout === 'auto') {
this.autoLayout();
@ -33,13 +31,13 @@ define(['browser', 'appSettings', 'events'], function (browser, appSettings, eve
}
events.trigger(this, 'modechange');
};
}
LayoutManager.prototype.getSavedLayout = function (layout) {
getSavedLayout(layout) {
return appSettings.get('layout');
};
}
LayoutManager.prototype.autoLayout = function () {
autoLayout() {
// Take a guess at initial layout. The consuming app can override
if (browser.mobile) {
this.setLayout('mobile', false);
@ -48,16 +46,16 @@ define(['browser', 'appSettings', 'events'], function (browser, appSettings, eve
} else {
this.setLayout(this.defaultLayout || 'tv', false);
}
};
}
LayoutManager.prototype.init = function () {
var saved = this.getSavedLayout();
init() {
const saved = this.getSavedLayout();
if (saved) {
this.setLayout(saved, false);
} else {
this.autoLayout();
}
};
}
}
return new LayoutManager();
});
export default new LayoutManager();

52
src/components/loading/loading.js
View file

@ -1,17 +1,15 @@
define(['css!./loading'], function () {
'use strict';
import 'css!./loading';
var loadingElem;
var layer1;
var layer2;
var layer3;
var layer4;
var circleLefts;
var circleRights;
let loadingElem;
let layer1;
let layer2;
let layer3;
let layer4;
let circleLefts;
let circleRights;
return {
show: function () {
var elem = loadingElem;
export function show() {
let elem = loadingElem;
if (!elem) {
elem = document.createElement('div');
@ -40,19 +38,17 @@ define(['css!./loading'], function () {
layer3.classList.add('mdl-spinner__layer-3-active');
layer4.classList.add('mdl-spinner__layer-4-active');
var i;
var length;
for (i = 0, length = circleLefts.length; i < length; i++) {
for (let i = 0, length = circleLefts.length; i < length; i++) {
circleLefts[i].classList.add('mdl-spinner__circleLeft-active');
}
for (i = 0, length = circleRights.length; i < length; i++) {
for (let i = 0, length = circleRights.length; i < length; i++) {
circleRights[i].classList.add('mdl-spinner__circleRight-active');
}
},
hide: function () {
var elem = loadingElem;
}
export function hide() {
const elem = loadingElem;
if (elem) {
elem.classList.remove('mdlSpinnerActive');
@ -62,17 +58,17 @@ define(['css!./loading'], function () {
elem.classList.remove('mdl-spinner__layer-3-active');
elem.classList.remove('mdl-spinner__layer-4-active');
var i;
var length;
for (i = 0, length = circleLefts.length; i < length; i++) {
for (let i = 0, length = circleLefts.length; i < length; i++) {
circleLefts[i].classList.remove('mdl-spinner__circleLeft-active');
}
for (i = 0, length = circleRights.length; i < length; i++) {
for (let i = 0, length = circleRights.length; i < length; i++) {
circleRights[i].classList.remove('mdl-spinner__circleRight-active');
}
}
}
};
});
}
export default {
show: show,
hide: hide
};

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

@ -85,7 +85,7 @@ import 'flexStyles';
refreshLibraryFromServer(dom.parentWithClass(button, 'dlg-libraryeditor'));
}, () => {
import('toast').then(({default: toast}) => {
toast(globalize.translate('DefaultErrorMessage'));
toast(globalize.translate('ErrorDefault'));
});
});
});

9
src/components/metadataEditor/metadataEditor.js
View file

@ -6,7 +6,6 @@ import loading from 'loading';
import focusManager from 'focusManager';
import connectionManager from 'connectionManager';
import globalize from 'globalize';
import require from 'require';
import shell from 'shell';
import 'emby-checkbox';
import 'emby-input';
@ -37,7 +36,7 @@ import 'flexStyles';
function submitUpdatedItem(form, item) {
function afterContentTypeUpdated() {
require(['toast'], function (toast) {
import('toast').then(({default: toast}) => {
toast(globalize.translate('MessageItemSaved'));
});
@ -227,7 +226,7 @@ import 'flexStyles';
}
function editPerson(context, person, index) {
require(['personEditor'], function (personEditor) {
import('personEditor').then(({default: personEditor}) => {
personEditor.show(person).then(function (updatedPerson) {
const isNew = index === -1;
@ -246,14 +245,14 @@ import 'flexStyles';
if (parentId) {
reload(context, parentId, item.ServerId);
} else {
require(['appRouter'], function (appRouter) {
import('appRouter').then(({default: appRouter}) => {
appRouter.goHome();
});
}
}
function showMoreMenu(context, button, user) {
require(['itemContextMenu'], function (itemContextMenu) {
import('itemContextMenu').then(({default: itemContextMenu}) => {
var item = currentItem;
itemContextMenu.show({

3
src/components/notifications/notifications.js
View file

@ -1,6 +1,9 @@
define(['serverNotifications', 'playbackManager', 'events', 'globalize', 'require'], function (serverNotifications, playbackManager, events, globalize, require) {
'use strict';
playbackManager = playbackManager.default || playbackManager;
serverNotifications = serverNotifications.default || serverNotifications;
function onOneDocumentClick() {
document.removeEventListener('click', onOneDocumentClick);
document.removeEventListener('keydown', onOneDocumentClick);

1037
src/components/playback/playbackmanager.js
View file

File diff suppressed because it is too large Load diff

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

@ -210,7 +210,7 @@ import 'emby-button';
}
function centerFocus(elem, horiz, on) {
import('scrollHelper').then(scrollHelper => {
import('scrollHelper').then((scrollHelper) => {
const fn = on ? 'on' : 'off';
scrollHelper.centerFocus[fn](elem, horiz);
});

129
src/components/recordingcreator/recordingbutton.js
View file

@ -1,35 +1,40 @@
define(['globalize', 'connectionManager', 'require', 'loading', 'apphost', 'dom', 'recordingHelper', 'events', 'paper-icon-button-light', 'emby-button', 'css!./recordingfields'], function (globalize, connectionManager, require, loading, appHost, dom, recordingHelper, events) {
'use strict';
import connectionManager from 'connectionManager';
import dom from 'dom';
import recordingHelper from 'recordingHelper';
import 'paper-icon-button-light';
import 'emby-button';
import 'css!./recordingfields';
function onRecordingButtonClick(e) {
var item = this.item;
function onRecordingButtonClick(e) {
const item = this.item;
if (item) {
var serverId = item.ServerId;
var programId = item.Id;
var timerId = item.TimerId;
var timerStatus = item.Status;
var seriesTimerId = item.SeriesTimerId;
const serverId = item.ServerId;
const programId = item.Id;
const timerId = item.TimerId;
const timerStatus = item.Status;
const seriesTimerId = item.SeriesTimerId;
var instance = this;
const instance = this;
recordingHelper.toggleRecording(serverId, programId, timerId, timerStatus, seriesTimerId).then(function () {
instance.refresh(serverId, programId);
});
}
}
}
function setButtonIcon(button, icon) {
var inner = button.querySelector('.material-icons');
function setButtonIcon(button, icon) {
const inner = button.querySelector('.material-icons');
inner.classList.remove('fiber_smart_record');
inner.classList.remove('fiber_manual_record');
inner.classList.add(icon);
}
}
function RecordingButton(options) {
class RecordingButton {
constructor(options) {
this.options = options;
var button = options.button;
const button = options.button;
setButtonIcon(button, 'fiber_manual_record');
@ -39,7 +44,7 @@ define(['globalize', 'connectionManager', 'require', 'loading', 'apphost', 'dom'
this.refresh(options.itemId, options.serverId);
}
var clickFn = onRecordingButtonClick.bind(this);
const clickFn = onRecordingButtonClick.bind(this);
this.clickFn = clickFn;
dom.addEventListener(button, 'click', clickFn, {
@ -47,8 +52,49 @@ define(['globalize', 'connectionManager', 'require', 'loading', 'apphost', 'dom'
});
}
function getIndicatorIcon(item) {
var status;
refresh(serverId, itemId) {
const apiClient = connectionManager.getApiClient(serverId);
const self = this;
apiClient.getItem(apiClient.getCurrentUserId(), itemId).then(function (item) {
self.refreshItem(item);
});
}
refreshItem(item) {
const options = this.options;
const button = options.button;
this.item = item;
setButtonIcon(button, getIndicatorIcon(item));
if (item.TimerId && (item.Status || 'Cancelled') !== 'Cancelled') {
button.classList.add('recordingIcon-active');
} else {
button.classList.remove('recordingIcon-active');
}
}
destroy() {
const options = this.options;
if (options) {
const button = options.button;
const clickFn = this.clickFn;
if (clickFn) {
dom.removeEventListener(button, 'click', clickFn, {
passive: true
});
}
}
this.options = null;
this.item = null;
}
}
function getIndicatorIcon(item) {
let status;
if (item.Type === 'SeriesTimer') {
return 'fiber_smart_record';
@ -67,47 +113,6 @@ define(['globalize', 'connectionManager', 'require', 'loading', 'apphost', 'dom'
}
return 'fiber_manual_record';
}
}
RecordingButton.prototype.refresh = function (serverId, itemId) {
var apiClient = connectionManager.getApiClient(serverId);
var self = this;
apiClient.getItem(apiClient.getCurrentUserId(), itemId).then(function (item) {
self.refreshItem(item);
});
};
RecordingButton.prototype.refreshItem = function (item) {
var options = this.options;
var button = options.button;
this.item = item;
setButtonIcon(button, getIndicatorIcon(item));
if (item.TimerId && (item.Status || 'Cancelled') !== 'Cancelled') {
button.classList.add('recordingIcon-active');
} else {
button.classList.remove('recordingIcon-active');
}
};
RecordingButton.prototype.destroy = function () {
var options = this.options;
if (options) {
var button = options.button;
var clickFn = this.clickFn;
if (clickFn) {
dom.removeEventListener(button, 'click', clickFn, {
passive: true
});
}
}
this.options = null;
this.item = null;
};
return RecordingButton;
});
export default RecordingButton;

93
src/components/recordingcreator/recordingcreator.js
View file

@ -1,15 +1,33 @@
define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'connectionManager', 'require', 'loading', 'scrollHelper', 'datetime', 'imageLoader', 'recordingFields', 'events', 'emby-checkbox', 'emby-button', 'emby-collapse', 'emby-input', 'paper-icon-button-light', 'css!./../formdialog', 'css!./recordingcreator', 'material-icons'], function (dialogHelper, globalize, layoutManager, mediaInfo, appHost, connectionManager, require, loading, scrollHelper, datetime, imageLoader, recordingFields, events) {
'use strict';
import dialogHelper from 'dialogHelper';
import globalize from 'globalize';
import layoutManager from 'layoutManager';
import mediaInfo from 'mediaInfo';
import connectionManager from 'connectionManager';
import require from 'require';
import loading from 'loading';
import scrollHelper from 'scrollHelper';
import datetime from 'datetime';
import imageLoader from 'imageLoader';
import recordingFields from 'recordingFields';
import events from 'events';
import 'emby-checkbox';
import 'emby-button';
import 'emby-collapse';
import 'emby-input';
import 'paper-icon-button-light';
import 'css!./../formdialog';
import 'css!./recordingcreator';
import 'material-icons';
var currentDialog;
var closeAction;
var currentRecordingFields;
let currentDialog;
let closeAction;
let currentRecordingFields;
function closeDialog() {
function closeDialog() {
dialogHelper.close(currentDialog);
}
}
function init(context) {
function init(context) {
context.querySelector('.btnPlay').addEventListener('click', function () {
closeAction = 'play';
closeDialog();
@ -19,10 +37,10 @@ define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'c
closeAction = null;
closeDialog();
});
}
}
function getImageUrl(item, apiClient, imageHeight) {
var imageTags = item.ImageTags || {};
function getImageUrl(item, apiClient, imageHeight) {
const imageTags = item.ImageTags || {};
if (item.PrimaryImageTag) {
imageTags.Primary = item.PrimaryImageTag;
@ -43,12 +61,12 @@ define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'c
}
return null;
}
}
function renderRecording(context, defaultTimer, program, apiClient, refreshRecordingStateOnly) {
function renderRecording(context, defaultTimer, program, apiClient, refreshRecordingStateOnly) {
if (!refreshRecordingStateOnly) {
var imgUrl = getImageUrl(program, apiClient, 200);
var imageContainer = context.querySelector('.recordingDialog-imageContainer');
const imgUrl = getImageUrl(program, apiClient, 200);
const imageContainer = context.querySelector('.recordingDialog-imageContainer');
if (imgUrl) {
imageContainer.innerHTML = '<img src="' + require.toUrl('.').split('?')[0] + '/empty.png" data-src="' + imgUrl + '" class="recordingDialog-img lazy" />';
@ -65,8 +83,8 @@ define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'c
context.querySelector('.itemGenres').innerHTML = (program.Genres || []).join(' / ');
context.querySelector('.itemOverview').innerHTML = program.Overview || '';
var formDialogFooter = context.querySelector('.formDialogFooter');
var now = new Date();
const formDialogFooter = context.querySelector('.formDialogFooter');
const now = new Date();
if (now >= datetime.parseISO8601Date(program.StartDate, true) && now < datetime.parseISO8601Date(program.EndDate, true)) {
formDialogFooter.classList.remove('hide');
} else {
@ -80,28 +98,28 @@ define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'c
});
loading.hide();
}
}
function reload(context, programId, serverId, refreshRecordingStateOnly) {
function reload(context, programId, serverId, refreshRecordingStateOnly) {
loading.show();
var apiClient = connectionManager.getApiClient(serverId);
const apiClient = connectionManager.getApiClient(serverId);
var promise1 = apiClient.getNewLiveTvTimerDefaults({ programId: programId });
var promise2 = apiClient.getLiveTvProgram(programId, apiClient.getCurrentUserId());
const promise1 = apiClient.getNewLiveTvTimerDefaults({ programId: programId });
const promise2 = apiClient.getLiveTvProgram(programId, apiClient.getCurrentUserId());
Promise.all([promise1, promise2]).then(function (responses) {
var defaults = responses[0];
var program = responses[1];
const defaults = responses[0];
const program = responses[1];
renderRecording(context, defaults, program, apiClient, refreshRecordingStateOnly);
});
}
}
function executeCloseAction(action, programId, serverId) {
function executeCloseAction(action, programId, serverId) {
if (action === 'play') {
require(['playbackManager'], function (playbackManager) {
var apiClient = connectionManager.getApiClient(serverId);
import('playbackManager').then(({default: playbackManager}) => {
const apiClient = connectionManager.getApiClient(serverId);
apiClient.getLiveTvProgram(programId, apiClient.getCurrentUserId()).then(function (item) {
playbackManager.play({
@ -112,16 +130,16 @@ define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'c
});
return;
}
}
}
function showEditor(itemId, serverId) {
function showEditor(itemId, serverId) {
return new Promise(function (resolve, reject) {
closeAction = null;
loading.show();
require(['text!./recordingcreator.template.html'], function (template) {
var dialogOptions = {
import('text!./recordingcreator.template.html').then(({default: template}) => {
const dialogOptions = {
removeOnClose: true,
scrollY: false
};
@ -132,12 +150,12 @@ define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'c
dialogOptions.size = 'small';
}
var dlg = dialogHelper.createDialog(dialogOptions);
const dlg = dialogHelper.createDialog(dialogOptions);
dlg.classList.add('formDialog');
dlg.classList.add('recordingDialog');
var html = '';
let html = '';
html += globalize.translateHtml(template, 'core');
@ -179,9 +197,8 @@ define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'c
dialogHelper.open(dlg);
});
});
}
}
return {
export default {
show: showEditor
};
});
};

6
src/components/recordingcreator/recordingeditor.js
View file

@ -1,6 +1,10 @@
define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'connectionManager', 'require', 'loading', 'scrollHelper', 'imageLoader', 'scrollStyles', 'emby-button', 'emby-collapse', 'emby-input', 'paper-icon-button-light', 'css!./../formdialog', 'css!./recordingcreator', 'material-icons', 'flexStyles'], function (dialogHelper, globalize, layoutManager, mediaInfo, appHost, connectionManager, require, loading, scrollHelper, imageLoader) {
'use strict';
scrollHelper = scrollHelper.default || scrollHelper;
loading = loading.default || loading;
layoutManager = layoutManager.default || layoutManager;
var currentDialog;
var recordingDeleted = false;
var currentItemId;
@ -10,6 +14,8 @@ define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'c
function deleteTimer(apiClient, timerId) {
return new Promise(function (resolve, reject) {
require(['recordingHelper'], function (recordingHelper) {
recordingHelper = recordingHelper.default || recordingHelper;
recordingHelper.cancelTimerWithConfirmation(timerId, apiClient.serverId()).then(resolve, reject);
});
});

4
src/components/recordingcreator/recordingfields.js
View file

@ -1,6 +1,10 @@
define(['globalize', 'connectionManager', 'serverNotifications', 'require', 'loading', 'apphost', 'dom', 'recordingHelper', 'events', 'paper-icon-button-light', 'emby-button', 'css!./recordingfields', 'flexStyles'], function (globalize, connectionManager, serverNotifications, require, loading, appHost, dom, recordingHelper, events) {
'use strict';
serverNotifications = serverNotifications.default || serverNotifications;
recordingHelper = recordingHelper.default || recordingHelper;
loading = loading.default || loading;
function loadData(parent, program, apiClient) {
if (program.IsSeries) {
parent.querySelector('.recordSeriesContainer').classList.remove('hide');

71
src/components/recordingcreator/recordinghelper.js
View file

@ -1,7 +1,10 @@
define(['globalize', 'loading', 'connectionManager'], function (globalize, loading, connectionManager) {
'use strict';
import globalize from 'globalize';
import loading from 'loading';
import connectionManager from 'connectionManager';
function changeRecordingToSeries(apiClient, timerId, programId, confirmTimerCancellation) {
/*eslint prefer-const: "error"*/
function changeRecordingToSeries(apiClient, timerId, programId, confirmTimerCancellation) {
loading.show();
return apiClient.getItem(apiClient.getCurrentUserId(), programId).then(function (item) {
@ -22,11 +25,11 @@ define(['globalize', 'loading', 'connectionManager'], function (globalize, loadi
return cancelTimer(apiClient.serverId(), timerId, true);
}
});
}
}
function cancelTimerWithConfirmation(timerId, serverId) {
function cancelTimerWithConfirmation(timerId, serverId) {
return new Promise(function (resolve, reject) {
require(['confirm'], function (confirm) {
import('confirm').then(({ default: confirm }) => {
confirm.default({
text: globalize.translate('MessageConfirmRecordingCancellation'),
@ -37,16 +40,16 @@ define(['globalize', 'loading', 'connectionManager'], function (globalize, loadi
}).then(function () {
loading.show();
var apiClient = connectionManager.getApiClient(serverId);
const apiClient = connectionManager.getApiClient(serverId);
cancelTimer(apiClient, timerId, true).then(resolve, reject);
}, reject);
});
});
}
}
function cancelSeriesTimerWithConfirmation(timerId, serverId) {
function cancelSeriesTimerWithConfirmation(timerId, serverId) {
return new Promise(function (resolve, reject) {
require(['confirm'], function (confirm) {
import('confirm').then(({ default: confirm }) => {
confirm.default({
text: globalize.translate('MessageConfirmRecordingCancellation'),
@ -57,9 +60,9 @@ define(['globalize', 'loading', 'connectionManager'], function (globalize, loadi
}).then(function () {
loading.show();
var apiClient = connectionManager.getApiClient(serverId);
const apiClient = connectionManager.getApiClient(serverId);
apiClient.cancelLiveTvSeriesTimer(timerId).then(function () {
require(['toast'], function (toast) {
import('toast').then(({default: toast}) => {
toast(globalize.translate('SeriesCancelled'));
});
@ -69,9 +72,9 @@ define(['globalize', 'loading', 'connectionManager'], function (globalize, loadi
}, reject);
});
});
}
}
function cancelTimer(apiClient, timerId, hideLoading) {
function cancelTimer(apiClient, timerId, hideLoading) {
loading.show();
return apiClient.cancelLiveTvTimer(timerId).then(function () {
if (hideLoading !== false) {
@ -79,12 +82,12 @@ define(['globalize', 'loading', 'connectionManager'], function (globalize, loadi
sendToast(globalize.translate('RecordingCancelled'));
}
});
}
}
function createRecording(apiClient, programId, isSeries) {
function createRecording(apiClient, programId, isSeries) {
loading.show();
return apiClient.getNewLiveTvTimerDefaults({ programId: programId }).then(function (item) {
var promise = isSeries ?
const promise = isSeries ?
apiClient.createLiveTvSeriesTimer(item) :
apiClient.createLiveTvTimer(item);
@ -93,18 +96,18 @@ define(['globalize', 'loading', 'connectionManager'], function (globalize, loadi
sendToast(globalize.translate('RecordingScheduled'));
});
});
}
}
function sendToast(msg) {
require(['toast'], function (toast) {
function sendToast(msg) {
import('toast').then(({ default: toast }) => {
toast(msg);
});
}
}
function showMultiCancellationPrompt(serverId, programId, timerId, timerStatus, seriesTimerId) {
function showMultiCancellationPrompt(serverId, programId, timerId, timerStatus, seriesTimerId) {
return new Promise(function (resolve, reject) {
require(['dialog'], function (dialog) {
var items = [];
import('dialog').then(({ default: dialog }) => {
const items = [];
items.push({
name: globalize.translate('HeaderKeepRecording'),
@ -138,7 +141,7 @@ define(['globalize', 'loading', 'connectionManager'], function (globalize, loadi
buttons: items
}).then(function (result) {
var apiClient = connectionManager.getApiClient(serverId);
const apiClient = connectionManager.getApiClient(serverId);
if (result === 'canceltimer') {
loading.show();
@ -148,7 +151,7 @@ define(['globalize', 'loading', 'connectionManager'], function (globalize, loadi
loading.show();
apiClient.cancelLiveTvSeriesTimer(seriesTimerId).then(function () {
require(['toast'], function (toast) {
import('toast').then(({ default: toast }) => {
toast(globalize.translate('SeriesCancelled'));
});
@ -161,11 +164,11 @@ define(['globalize', 'loading', 'connectionManager'], function (globalize, loadi
}, reject);
});
});
}
}
function toggleRecording(serverId, programId, timerId, timerStatus, seriesTimerId) {
var apiClient = connectionManager.getApiClient(serverId);
var hasTimer = timerId && timerStatus !== 'Cancelled';
function toggleRecording(serverId, programId, timerId, timerStatus, seriesTimerId) {
const apiClient = connectionManager.getApiClient(serverId);
const hasTimer = timerId && timerStatus !== 'Cancelled';
if (seriesTimerId && hasTimer) {
// cancel
return showMultiCancellationPrompt(serverId, programId, timerId, timerStatus, seriesTimerId);
@ -179,14 +182,14 @@ define(['globalize', 'loading', 'connectionManager'], function (globalize, loadi
} else {
return Promise.reject();
}
}
}
return {
export default {
cancelTimer: cancelTimer,
createRecording: createRecording,
changeRecordingToSeries: changeRecordingToSeries,
toggleRecording: toggleRecording,
cancelTimerWithConfirmation: cancelTimerWithConfirmation,
cancelSeriesTimerWithConfirmation: cancelSeriesTimerWithConfirmation
};
});
};

110
src/components/recordingcreator/seriesrecordingeditor.js
View file

@ -1,21 +1,38 @@
define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'connectionManager', 'require', 'loading', 'scrollHelper', 'imageLoader', 'datetime', 'scrollStyles', 'emby-button', 'emby-checkbox', 'emby-input', 'emby-select', 'paper-icon-button-light', 'css!./../formdialog', 'css!./recordingcreator', 'material-icons', 'flexStyles'], function (dialogHelper, globalize, layoutManager, mediaInfo, appHost, connectionManager, require, loading, scrollHelper, imageLoader, datetime) {
'use strict';
import dialogHelper from 'dialogHelper';
import globalize from 'globalize';
import layoutManager from 'layoutManager';
import connectionManager from 'connectionManager';
import loading from 'loading';
import scrollHelper from 'scrollHelper';
import datetime from 'datetime';
import 'scrollStyles';
import 'emby-button';
import 'emby-checkbox';
import 'emby-input';
import 'emby-select';
import 'paper-icon-button-light';
import 'css!./../formdialog';
import 'css!./recordingcreator';
import 'material-icons';
import 'flexStyles';
var currentDialog;
var recordingUpdated = false;
var recordingDeleted = false;
var currentItemId;
var currentServerId;
/*eslint prefer-const: "error"*/
function deleteTimer(apiClient, timerId) {
let currentDialog;
let recordingUpdated = false;
let recordingDeleted = false;
let currentItemId;
let currentServerId;
function deleteTimer(apiClient, timerId) {
return new Promise(function (resolve, reject) {
require(['recordingHelper'], function (recordingHelper) {
import('recordingHelper').then(({ default: recordingHelper }) => {
recordingHelper.cancelSeriesTimerWithConfirmation(timerId, apiClient.serverId()).then(resolve, reject);
});
});
}
}
function renderTimer(context, item, apiClient) {
function renderTimer(context, item) {
context.querySelector('#txtPrePaddingMinutes').value = item.PrePaddingSeconds / 60;
context.querySelector('#txtPostPaddingMinutes').value = item.PostPaddingSeconds / 60;
@ -35,19 +52,19 @@ define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'c
context.querySelector('.optionAroundTime').innerHTML = globalize.translate('AroundTime', datetime.getDisplayTime(datetime.parseISO8601Date(item.StartDate)));
loading.hide();
}
}
function closeDialog(isDeleted) {
function closeDialog(isDeleted) {
recordingUpdated = true;
recordingDeleted = isDeleted;
dialogHelper.close(currentDialog);
}
}
function onSubmit(e) {
var form = this;
function onSubmit(e) {
const form = this;
var apiClient = connectionManager.getApiClient(currentServerId);
const apiClient = connectionManager.getApiClient(currentServerId);
apiClient.getLiveTvSeriesTimer(currentItemId).then(function (item) {
item.PrePaddingSeconds = form.querySelector('#txtPrePaddingMinutes').value * 60;
@ -65,9 +82,9 @@ define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'c
// Disable default form submission
return false;
}
}
function init(context) {
function init(context) {
fillKeepUpTo(context);
context.querySelector('.btnCancel').addEventListener('click', function () {
@ -75,39 +92,39 @@ define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'c
});
context.querySelector('.btnCancelRecording').addEventListener('click', function () {
var apiClient = connectionManager.getApiClient(currentServerId);
const apiClient = connectionManager.getApiClient(currentServerId);
deleteTimer(apiClient, currentItemId).then(function () {
closeDialog(true);
});
});
context.querySelector('form').addEventListener('submit', onSubmit);
}
}
function reload(context, id) {
var apiClient = connectionManager.getApiClient(currentServerId);
function reload(context, id) {
const apiClient = connectionManager.getApiClient(currentServerId);
loading.show();
if (typeof id === 'string') {
currentItemId = id;
apiClient.getLiveTvSeriesTimer(id).then(function (result) {
renderTimer(context, result, apiClient);
renderTimer(context, result);
loading.hide();
});
} else if (id) {
currentItemId = id.Id;
renderTimer(context, id, apiClient);
renderTimer(context, id);
loading.hide();
}
}
}
function fillKeepUpTo(context) {
var html = '';
function fillKeepUpTo(context) {
let html = '';
for (var i = 0; i <= 50; i++) {
var text;
for (let i = 0; i <= 50; i++) {
let text;
if (i === 0) {
text = globalize.translate('AsManyAsPossible');
@ -121,21 +138,21 @@ define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'c
}
context.querySelector('.selectKeepUpTo').innerHTML = html;
}
}
function onFieldChange(e) {
function onFieldChange() {
this.querySelector('.btnSubmit').click();
}
}
function embed(itemId, serverId, options) {
function embed(itemId, serverId, options) {
recordingUpdated = false;
recordingDeleted = false;
currentServerId = serverId;
loading.show();
options = options || {};
require(['text!./seriesrecordingeditor.template.html'], function (template) {
var dialogOptions = {
import('text!./seriesrecordingeditor.template.html').then(({ default: template }) => {
const dialogOptions = {
removeOnClose: true,
scrollY: false
};
@ -146,7 +163,7 @@ define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'c
dialogOptions.size = 'small';
}
var dlg = options.context;
const dlg = options.context;
dlg.classList.add('hide');
dlg.innerHTML = globalize.translateHtml(template, 'core');
@ -166,9 +183,9 @@ define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'c
reload(dlg, itemId);
});
}
}
function showEditor(itemId, serverId, options) {
function showEditor(itemId, serverId, options) {
return new Promise(function (resolve, reject) {
recordingUpdated = false;
recordingDeleted = false;
@ -176,8 +193,8 @@ define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'c
loading.show();
options = options || {};
require(['text!./seriesrecordingeditor.template.html'], function (template) {
var dialogOptions = {
import('text!./seriesrecordingeditor.template.html').then(({ default: template }) => {
const dialogOptions = {
removeOnClose: true,
scrollY: false
};
@ -188,7 +205,7 @@ define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'c
dialogOptions.size = 'small';
}
var dlg = dialogHelper.createDialog(dialogOptions);
const dlg = dialogHelper.createDialog(dialogOptions);
dlg.classList.add('formDialog');
dlg.classList.add('recordingDialog');
@ -197,7 +214,7 @@ define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'c
dlg.style['min-width'] = '20%';
}
var html = '';
let html = '';
html += globalize.translateHtml(template, 'core');
@ -237,10 +254,9 @@ define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'c
dialogHelper.open(dlg);
});
});
}
}
return {
export default {
show: showEditor,
embed: embed
};
});
};

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

@ -1,13 +1,32 @@
define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageLoader', 'playbackManager', 'nowPlayingHelper', 'events', 'connectionManager', 'apphost', 'globalize', 'layoutManager', 'userSettings', 'cardBuilder', 'itemContextMenu', 'cardStyle', 'emby-itemscontainer', 'css!./remotecontrol.css', 'emby-ratingbutton'], function (browser, datetime, backdrop, libraryBrowser, listView, imageLoader, playbackManager, nowPlayingHelper, events, connectionManager, appHost, globalize, layoutManager, userSettings, cardBuilder, itemContextMenu) {
'use strict';
var showMuteButton = true;
var showVolumeSlider = true;
import datetime from 'datetime';
import backdrop from 'backdrop';
import listView from 'listView';
import imageLoader from 'imageLoader';
import playbackManager from 'playbackManager';
import nowPlayingHelper from 'nowPlayingHelper';
import events from 'events';
import connectionManager from 'connectionManager';
import appHost from 'apphost';
import globalize from 'globalize';
import layoutManager from 'layoutManager';
import * as userSettings from 'userSettings';
import cardBuilder from 'cardBuilder';
import itemContextMenu from 'itemContextMenu';
import 'cardStyle';
import 'emby-itemscontainer';
import 'css!./remotecontrol.css';
import 'emby-ratingbutton';
function showAudioMenu(context, player, button, item) {
var currentIndex = playbackManager.getAudioStreamIndex(player);
var streams = playbackManager.audioTracks(player);
var menuItems = streams.map(function (s) {
var menuItem = {
/*eslint prefer-const: "error"*/
let showMuteButton = true;
let showVolumeSlider = true;
function showAudioMenu(context, player, button, item) {
const currentIndex = playbackManager.getAudioStreamIndex(player);
const streams = playbackManager.audioTracks(player);
const menuItems = streams.map(function (s) {
const menuItem = {
name: s.DisplayTitle,
id: s.Index
};
@ -19,7 +38,7 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
return menuItem;
});
require(['actionsheet'], function (actionsheet) {
import('actionsheet').then(({ default: actionsheet }) => {
actionsheet.show({
items: menuItems,
positionTo: button,
@ -28,13 +47,13 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
}
});
});
}
}
function showSubtitleMenu(context, player, button, item) {
var currentIndex = playbackManager.getSubtitleStreamIndex(player);
var streams = playbackManager.subtitleTracks(player);
var menuItems = streams.map(function (s) {
var menuItem = {
function showSubtitleMenu(context, player, button, item) {
const currentIndex = playbackManager.getSubtitleStreamIndex(player);
const streams = playbackManager.subtitleTracks(player);
const menuItems = streams.map(function (s) {
const menuItem = {
name: s.DisplayTitle,
id: s.Index
};
@ -51,7 +70,7 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
selected: currentIndex == null
});
require(['actionsheet'], function (actionsheet) {
import('actionsheet').then(({ default: actionsheet }) => {
actionsheet.show({
items: menuItems,
positionTo: button,
@ -60,15 +79,15 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
}
});
});
}
}
function getNowPlayingNameHtml(nowPlayingItem, includeNonNameInfo) {
function getNowPlayingNameHtml(nowPlayingItem, includeNonNameInfo) {
return nowPlayingHelper.getNowPlayingNames(nowPlayingItem, includeNonNameInfo).map(function (i) {
return i.text;
}).join('<br/>');
}
}
function seriesImageUrl(item, options) {
function seriesImageUrl(item, options) {
if (item.Type !== 'Episode') {
return null;
}
@ -93,9 +112,9 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
}
return null;
}
}
function imageUrl(item, options) {
function imageUrl(item, options) {
options = options || {};
options.type = options.type || 'Primary';
@ -110,22 +129,22 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
}
return null;
}
}
function updateNowPlayingInfo(context, state, serverId) {
var item = state.NowPlayingItem;
var displayName = item ? getNowPlayingNameHtml(item).replace('<br/>', ' - ') : '';
function updateNowPlayingInfo(context, state, serverId) {
const item = state.NowPlayingItem;
const displayName = item ? getNowPlayingNameHtml(item).replace('<br/>', ' - ') : '';
if (typeof item !== 'undefined') {
var nowPlayingServerId = (item.ServerId || serverId);
const nowPlayingServerId = (item.ServerId || serverId);
if (item.Type == 'Audio' || item.MediaStreams[0].Type == 'Audio') {
var songName = item.Name;
if (item.Album != null && item.Artists != null) {
var artistsSeries = '';
var albumName = item.Album;
const songName = item.Name;
let artistsSeries = '';
let albumName = '';
if (item.Artists != null) {
if (item.ArtistItems != null) {
for (const artist of item.ArtistItems) {
let artistName = artist.Name;
let artistId = artist.Id;
const artistName = artist.Name;
const artistId = artist.Id;
artistsSeries += `<a class="button-link emby-button" is="emby-linkbutton" href="details?id=${artistId}&serverId=${nowPlayingServerId}">${artistName}</a>`;
if (artist !== item.ArtistItems.slice(-1)[0]) {
artistsSeries += ', ';
@ -142,17 +161,20 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
}
}
}
context.querySelector('.nowPlayingArtist').innerHTML = artistsSeries;
context.querySelector('.nowPlayingAlbum').innerHTML = '<a class="button-link emby-button" is="emby-linkbutton" href="details?id=' + item.AlbumId + `&serverId=${nowPlayingServerId}">${albumName}</a>`;
}
if (item.Album != null) {
albumName = '<a class="button-link emby-button" is="emby-linkbutton" href="details?id=' + item.AlbumId + `&serverId=${nowPlayingServerId}">` + item.Album + '</a>';
}
context.querySelector('.nowPlayingAlbum').innerHTML = albumName;
context.querySelector('.nowPlayingArtist').innerHTML = artistsSeries;
context.querySelector('.nowPlayingSongName').innerHTML = songName;
} else if (item.Type == 'Episode') {
if (item.SeasonName != null) {
var seasonName = item.SeasonName;
const seasonName = item.SeasonName;
context.querySelector('.nowPlayingSeason').innerHTML = '<a class="button-link emby-button" is="emby-linkbutton" href="details?id=' + item.SeasonId + `&serverId=${nowPlayingServerId}">${seasonName}</a>`;
}
if (item.SeriesName != null) {
var seriesName = item.SeriesName;
const seriesName = item.SeriesName;
if (item.SeriesId != null) {
context.querySelector('.nowPlayingSerie').innerHTML = '<a class="button-link emby-button" is="emby-linkbutton" href="details?id=' + item.SeriesId + `&serverId=${nowPlayingServerId}">${seriesName}</a>`;
} else {
@ -170,7 +192,7 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
context.querySelector('.nowPlayingPageTitle').classList.add('hide');
}
var url = item ? seriesImageUrl(item, {
const url = item ? seriesImageUrl(item, {
maxHeight: 300
}) || imageUrl(item, {
maxHeight: 300
@ -179,14 +201,14 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
let contextButton = context.querySelector('.btnToggleContextMenu');
// We remove the previous event listener by replacing the item in each update event
const autoFocusContextButton = document.activeElement === contextButton;
let contextButtonClone = contextButton.cloneNode(true);
const contextButtonClone = contextButton.cloneNode(true);
contextButton.parentNode.replaceChild(contextButtonClone, contextButton);
contextButton = context.querySelector('.btnToggleContextMenu');
if (autoFocusContextButton) {
contextButton.focus();
}
const stopPlayback = !!layoutManager.mobile;
var options = {
const options = {
play: false,
queue: false,
stopPlayback: stopPlayback,
@ -194,7 +216,7 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
openAlbum: false,
positionTo: contextButton
};
var apiClient = connectionManager.getApiClient(item.ServerId);
const apiClient = connectionManager.getApiClient(item.ServerId);
apiClient.getItem(apiClient.getCurrentUserId(), item.Id).then(function (fullItem) {
apiClient.getCurrentUser().then(function (user) {
contextButton.addEventListener('click', function () {
@ -209,8 +231,8 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
if (item) {
backdrop.setBackdrops([item]);
apiClient.getItem(apiClient.getCurrentUserId(), item.Id).then(function (fullItem) {
var userData = fullItem.UserData || {};
var likes = userData.Likes == null ? '' : userData.Likes;
const userData = fullItem.UserData || {};
const likes = userData.Likes == null ? '' : userData.Likes;
context.querySelector('.nowPlayingPageUserDataButtonsTitle').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>';
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>';
});
@ -219,11 +241,11 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
context.querySelector('.nowPlayingPageUserDataButtons').innerHTML = '';
}
}
}
}
function setImageUrl(context, state, url) {
var item = state.NowPlayingItem;
var imgContainer = context.querySelector('.nowPlayingPageImageContainer');
function setImageUrl(context, state, url) {
const item = state.NowPlayingItem;
const imgContainer = context.querySelector('.nowPlayingPageImageContainer');
if (url) {
imgContainer.innerHTML = '<img class="nowPlayingPageImage" src="' + url + '" />';
@ -237,26 +259,26 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
} else {
imgContainer.innerHTML = '<div class="nowPlayingPageImageContainerNoAlbum"><button data-action="link" class="cardImageContainer coveredImage ' + cardBuilder.getDefaultBackgroundClass(item.Name) + ' cardContent cardContent-shadow itemAction"><span class="cardImageIcon material-icons album"></span></button></div>';
}
}
}
function buttonVisible(btn, enabled) {
function buttonVisible(btn, enabled) {
if (enabled) {
btn.classList.remove('hide');
} else {
btn.classList.add('hide');
}
}
}
function updateSupportedCommands(context, commands) {
var all = context.querySelectorAll('.btnCommand');
function updateSupportedCommands(context, commands) {
const all = context.querySelectorAll('.btnCommand');
for (var i = 0, length = all.length; i < length; i++) {
var enableButton = commands.indexOf(all[i].getAttribute('data-command')) !== -1;
for (let i = 0, length = all.length; i < length; i++) {
const enableButton = commands.indexOf(all[i].getAttribute('data-command')) !== -1;
all[i].disabled = !enableButton;
}
}
}
return function () {
export default function () {
function toggleRepeat() {
switch (playbackManager.getRepeatMode()) {
case 'RepeatAll':
@ -272,12 +294,12 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
function updatePlayerState(player, context, state) {
lastPlayerState = state;
var item = state.NowPlayingItem;
var playerInfo = playbackManager.getPlayerInfo();
var supportedCommands = playerInfo.supportedCommands;
const item = state.NowPlayingItem;
const playerInfo = playbackManager.getPlayerInfo();
const supportedCommands = playerInfo.supportedCommands;
currentPlayerSupportedCommands = supportedCommands;
var playState = state.PlayState || {};
var isSupportedCommands = supportedCommands.includes('DisplayMessage') || supportedCommands.includes('SendString') || supportedCommands.includes('Select');
const playState = state.PlayState || {};
const isSupportedCommands = supportedCommands.includes('DisplayMessage') || supportedCommands.includes('SendString') || supportedCommands.includes('Select');
buttonVisible(context.querySelector('.btnToggleFullscreen'), item && item.MediaType == 'Video' && supportedCommands.includes('ToggleFullscreen'));
updateAudioTracksDisplay(player, context);
updateSubtitleTracksDisplay(player, context);
@ -316,7 +338,7 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
buttonVisible(context.querySelector('.btnRewind'), item != null);
buttonVisible(context.querySelector('.btnFastForward'), item != null);
}
var positionSlider = context.querySelector('.nowPlayingPositionSlider');
const positionSlider = context.querySelector('.nowPlayingPositionSlider');
if (positionSlider && item && item.RunTimeTicks) {
positionSlider.setKeyboardSteps(userSettings.skipBackLength() * 1000000 / item.RunTimeTicks,
@ -325,7 +347,7 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
if (positionSlider && !positionSlider.dragging) {
positionSlider.disabled = !playState.CanSeek;
var isProgressClear = state.MediaSource && state.MediaSource.RunTimeTicks == null;
const isProgressClear = state.MediaSource && state.MediaSource.RunTimeTicks == null;
positionSlider.setIsClear(isProgressClear);
}
@ -345,18 +367,18 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
}
function updateAudioTracksDisplay(player, context) {
var supportedCommands = currentPlayerSupportedCommands;
const supportedCommands = currentPlayerSupportedCommands;
buttonVisible(context.querySelector('.btnAudioTracks'), playbackManager.audioTracks(player).length > 1 && supportedCommands.indexOf('SetAudioStreamIndex') != -1);
}
function updateSubtitleTracksDisplay(player, context) {
var supportedCommands = currentPlayerSupportedCommands;
const supportedCommands = currentPlayerSupportedCommands;
buttonVisible(context.querySelector('.btnSubtitles'), playbackManager.subtitleTracks(player).length && supportedCommands.indexOf('SetSubtitleStreamIndex') != -1);
}
function updateRepeatModeDisplay(repeatMode) {
var context = dlg;
let toggleRepeatButtons = context.querySelectorAll('.repeatToggleButton');
const context = dlg;
const toggleRepeatButtons = context.querySelectorAll('.repeatToggleButton');
const cssClass = 'buttonActive';
let innHtml = '<span class="material-icons repeat"></span>';
let repeatOn = true;
@ -380,8 +402,8 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
}
function updatePlayerVolumeState(context, isMuted, volumeLevel) {
var view = context;
var supportedCommands = currentPlayerSupportedCommands;
const view = context;
const supportedCommands = currentPlayerSupportedCommands;
if (supportedCommands.indexOf('Mute') === -1) {
showMuteButton = false;
@ -414,8 +436,8 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
} else {
buttonMute.classList.toggle('hide', !showMuteButton);
var nowPlayingVolumeSlider = context.querySelector('.nowPlayingVolumeSlider');
var nowPlayingVolumeSliderContainer = context.querySelector('.nowPlayingVolumeSliderContainer');
const nowPlayingVolumeSlider = context.querySelector('.nowPlayingVolumeSlider');
const nowPlayingVolumeSliderContainer = context.querySelector('.nowPlayingVolumeSliderContainer');
if (nowPlayingVolumeSlider) {
nowPlayingVolumeSliderContainer.classList.toggle('hide', !showVolumeSlider);
@ -428,8 +450,8 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
}
function updatePlayPauseState(isPaused, isActive) {
var context = dlg;
var btnPlayPause = context.querySelector('.btnPlayPause');
const context = dlg;
const btnPlayPause = context.querySelector('.btnPlayPause');
const btnPlayPauseIcon = btnPlayPause.querySelector('.material-icons');
btnPlayPauseIcon.classList.remove('play_circle_filled', 'pause_circle_filled');
@ -439,12 +461,12 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
}
function updateTimeDisplay(positionTicks, runtimeTicks) {
var context = dlg;
var positionSlider = context.querySelector('.nowPlayingPositionSlider');
const context = dlg;
const positionSlider = context.querySelector('.nowPlayingPositionSlider');
if (positionSlider && !positionSlider.dragging) {
if (runtimeTicks) {
var pct = positionTicks / runtimeTicks;
let pct = positionTicks / runtimeTicks;
pct *= 100;
positionSlider.value = pct;
} else {
@ -462,7 +484,7 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
function loadPlaylist(context, player) {
getPlaylistItems(player).then(function (items) {
var html = '';
let html = '';
let favoritesEnabled = true;
if (layoutManager.mobile) {
if (items.length > 0) {
@ -486,7 +508,7 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
dragHandle: true
});
var itemsContainer = context.querySelector('.playlist');
const itemsContainer = context.querySelector('.playlist');
let focusedItemPlaylistId = itemsContainer.querySelector('button:focus');
itemsContainer.innerHTML = html;
if (focusedItemPlaylistId !== null) {
@ -497,10 +519,10 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
}
}
var playlistItemId = playbackManager.getCurrentPlaylistItemId(player);
const playlistItemId = playbackManager.getCurrentPlaylistItemId(player);
if (playlistItemId) {
var img = itemsContainer.querySelector(`.listItem[data-playlistItemId="${playlistItemId}"] .listItemImage`);
const img = itemsContainer.querySelector(`.listItem[data-playlistItemId="${playlistItemId}"] .listItemImage`);
if (img) {
img.classList.remove('lazy');
@ -514,7 +536,7 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
function onPlaybackStart(e, state) {
console.debug('remotecontrol event: ' + e.type);
var player = this;
const player = this;
onStateChanged.call(player, e, state);
}
@ -523,12 +545,12 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
}
function onShuffleQueueModeChange(updateView = true) {
let shuffleMode = playbackManager.getQueueShuffleMode(this);
let context = dlg;
const shuffleMode = playbackManager.getQueueShuffleMode(this);
const context = dlg;
const cssClass = 'buttonActive';
let shuffleButtons = context.querySelectorAll('.btnShuffleQueue');
const shuffleButtons = context.querySelectorAll('.btnShuffleQueue');
for (let shuffleButton of shuffleButtons) {
for (const shuffleButton of shuffleButtons) {
switch (shuffleMode) {
case 'Shuffle':
shuffleButton.classList.add(cssClass);
@ -550,12 +572,12 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
}
function onPlaylistItemRemoved(e, info) {
var context = dlg;
const context = dlg;
if (info !== undefined) {
var playlistItemIds = info.playlistItemIds;
const playlistItemIds = info.playlistItemIds;
for (var i = 0, length = playlistItemIds.length; i < length; i++) {
var listItem = context.querySelector('.listItem[data-playlistItemId="' + playlistItemIds[i] + '"]');
for (let i = 0, length = playlistItemIds.length; i < length; i++) {
const listItem = context.querySelector('.listItem[data-playlistItemId="' + playlistItemIds[i] + '"]');
if (listItem) {
listItem.parentNode.removeChild(listItem);
@ -568,7 +590,7 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
function onPlaybackStopped(e, state) {
console.debug('remotecontrol event: ' + e.type);
var player = this;
const player = this;
if (!state.NextMediaType) {
updatePlayerState(player, dlg, {});
@ -581,29 +603,29 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
}
function onStateChanged(event, state) {
var player = this;
const player = this;
updatePlayerState(player, dlg, state);
onPlaylistUpdate();
}
function onTimeUpdate(e) {
var now = new Date().getTime();
const now = new Date().getTime();
if (!(now - lastUpdateTime < 700)) {
lastUpdateTime = now;
var player = this;
const player = this;
currentRuntimeTicks = playbackManager.duration(player);
updateTimeDisplay(playbackManager.currentTime(player), currentRuntimeTicks);
}
}
function onVolumeChanged(e) {
var player = this;
const player = this;
updatePlayerVolumeState(dlg, player.isMuted(), player.getVolume());
}
function releaseCurrentPlayer() {
var player = currentPlayer;
const player = currentPlayer;
if (player) {
events.off(player, 'playbackstart', onPlaybackStart);
@ -624,7 +646,7 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
function bindToPlayer(context, player) {
if (releaseCurrentPlayer(), currentPlayer = player, player) {
var state = playbackManager.getPlayerState(player);
const state = playbackManager.getPlayerState(player);
onStateChanged.call(player, {
type: 'init'
}, state);
@ -640,8 +662,8 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
events.on(player, 'pause', onPlayPauseStateChanged);
events.on(player, 'unpause', onPlayPauseStateChanged);
events.on(player, 'timeupdate', onTimeUpdate);
var playerInfo = playbackManager.getPlayerInfo();
var supportedCommands = playerInfo.supportedCommands;
const playerInfo = playbackManager.getPlayerInfo();
const supportedCommands = playerInfo.supportedCommands;
currentPlayerSupportedCommands = supportedCommands;
updateSupportedCommands(context, supportedCommands);
}
@ -668,10 +690,10 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
}
function savePlaylist() {
require(['playlistEditor'], function (playlistEditor) {
import('playlistEditor').then(({ default: playlistEditor }) => {
getSaveablePlaylistItems().then(function (items) {
var serverId = items.length ? items[0].ServerId : ApiClient.serverId();
new playlistEditor.showEditor({
const serverId = items.length ? items[0].ServerId : ApiClient.serverId();
new playlistEditor({
items: items.map(function (i) {
return i.Id;
}),
@ -684,10 +706,10 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
}
function bindEvents(context) {
var btnCommand = context.querySelectorAll('.btnCommand');
var positionSlider = context.querySelector('.nowPlayingPositionSlider');
const btnCommand = context.querySelectorAll('.btnCommand');
const positionSlider = context.querySelector('.nowPlayingPositionSlider');
for (var i = 0, length = btnCommand.length; i < length; i++) {
for (let i = 0, length = btnCommand.length; i < length; i++) {
btnCommand[i].addEventListener('click', onBtnCommandClick);
}
@ -764,22 +786,22 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
}
});
positionSlider.addEventListener('change', function () {
var value = this.value;
const value = this.value;
if (currentPlayer) {
var newPercent = parseFloat(value);
const newPercent = parseFloat(value);
playbackManager.seekPercent(newPercent, currentPlayer);
}
});
positionSlider.getBubbleText = function (value) {
var state = lastPlayerState;
const state = lastPlayerState;
if (!state || !state.NowPlayingItem || !currentRuntimeTicks) {
return '--:--';
}
var ticks = currentRuntimeTicks;
let ticks = currentRuntimeTicks;
ticks /= 100;
ticks *= value;
return datetime.getDisplayRunningTime(ticks);
@ -792,13 +814,13 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
context.querySelector('.buttonMute').addEventListener('click', function () {
playbackManager.toggleMute(currentPlayer);
});
var playlistContainer = context.querySelector('.playlist');
const playlistContainer = context.querySelector('.playlist');
playlistContainer.addEventListener('action-remove', function (e) {
playbackManager.removeFromPlaylist([e.detail.playlistItemId], currentPlayer);
});
playlistContainer.addEventListener('itemdrop', function (e) {
var newIndex = e.detail.newIndex;
var playlistItemId = e.detail.playlistItemId;
const newIndex = e.detail.newIndex;
const playlistItemId = e.detail.playlistItemId;
playbackManager.movePlaylistItem(playlistItemId, newIndex, currentPlayer);
});
context.querySelector('.btnSavePlaylist').addEventListener('click', savePlaylist);
@ -828,7 +850,7 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
}
function onMessageSubmit(e) {
var form = e.target;
const form = e.target;
playbackManager.sendCommand({
Name: 'DisplayMessage',
Arguments: {
@ -838,7 +860,7 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
}, currentPlayer);
form.querySelector('input').value = '';
require(['toast'], function (toast) {
import('toast').then(({ default: toast }) => {
toast('Message sent.');
});
@ -848,7 +870,7 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
}
function onSendStringSubmit(e) {
var form = e.target;
const form = e.target;
playbackManager.sendCommand({
Name: 'SendString',
Arguments: {
@ -857,7 +879,7 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
}, currentPlayer);
form.querySelector('input').value = '';
require(['toast'], function (toast) {
import('toast').then(({ default: toast }) => {
toast('Text sent.');
});
@ -871,7 +893,7 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
volumecontrolHtml += `<button is="paper-icon-button-light" class="buttonMute autoSize" title=${globalize.translate('Mute')}><span class="xlargePaperIconButton material-icons volume_up"></span></button>`;
volumecontrolHtml += '<div class="sliderContainer nowPlayingVolumeSliderContainer"><input is="emby-slider" type="range" step="1" min="0" max="100" value="0" class="nowPlayingVolumeSlider"/></div>';
volumecontrolHtml += '</div>';
let optionsSection = context.querySelector('.playlistSectionButton');
const optionsSection = context.querySelector('.playlistSectionButton');
if (!layoutManager.mobile) {
context.querySelector('.nowPlayingSecondaryButtons').insertAdjacentHTML('beforeend', volumecontrolHtml);
optionsSection.classList.remove('align-items-center', 'justify-content-center');
@ -893,7 +915,7 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
events.on(playbackManager, 'playerchange', onPlayerChange);
if (layoutManager.tv) {
var positionSlider = context.querySelector('.nowPlayingPositionSlider');
const positionSlider = context.querySelector('.nowPlayingPositionSlider');
positionSlider.classList.add('focusable');
positionSlider.enableKeyboardDragging();
}
@ -909,13 +931,13 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
bindToPlayer(context, playbackManager.getCurrentPlayer());
}
var dlg;
var currentPlayer;
var lastPlayerState;
var currentPlayerSupportedCommands = [];
var lastUpdateTime = 0;
var currentRuntimeTicks = 0;
var self = this;
let dlg;
let currentPlayer;
let lastPlayerState;
let currentPlayerSupportedCommands = [];
let lastUpdateTime = 0;
let currentRuntimeTicks = 0;
const self = this;
self.init = function (ownerView, context) {
dlg = context;
@ -929,5 +951,4 @@ define(['browser', 'datetime', 'backdrop', 'libraryBrowser', 'listView', 'imageL
self.destroy = function () {
onDialogClosed();
};
};
});
}

184
src/components/skinManager.js
View file

@ -1,184 +0,0 @@
define(['apphost', 'userSettings', 'browser', 'events', 'backdrop', 'globalize', 'require', 'appSettings'], function (appHost, userSettings, browser, events, backdrop, globalize, require, appSettings) {
'use strict';
var themeStyleElement;
var currentThemeId;
function unloadTheme() {
var elem = themeStyleElement;
if (elem) {
elem.parentNode.removeChild(elem);
themeStyleElement = null;
currentThemeId = null;
}
}
function loadUserSkin(options) {
options = options || {};
if (options.start) {
Emby.Page.invokeShortcut(options.start);
} else {
Emby.Page.goHome();
}
}
function getThemes() {
return [{
name: 'Apple TV',
id: 'appletv'
}, {
name: 'Blue Radiance',
id: 'blueradiance'
}, {
name: 'Dark',
id: 'dark',
isDefault: true,
isDefaultServerDashboard: true
}, {
name: 'Light',
id: 'light'
}, {
name: 'Purple Haze',
id: 'purplehaze'
}, {
name: 'Windows Media Center',
id: 'wmc'
}];
}
var skinManager = {
getThemes: getThemes,
loadUserSkin: loadUserSkin
};
function getThemeStylesheetInfo(id, isDefaultProperty) {
var themes = skinManager.getThemes();
var defaultTheme;
var selectedTheme;
for (var i = 0, length = themes.length; i < length; i++) {
var theme = themes[i];
if (theme[isDefaultProperty]) {
defaultTheme = theme;
}
if (id === theme.id) {
selectedTheme = theme;
}
}
selectedTheme = selectedTheme || defaultTheme;
return {
stylesheetPath: require.toUrl('themes/' + selectedTheme.id + '/theme.css'),
themeId: selectedTheme.id
};
}
var themeResources = {};
var lastSound = 0;
var currentSound;
function loadThemeResources(id) {
lastSound = 0;
if (currentSound) {
currentSound.stop();
currentSound = null;
}
backdrop.clearBackdrop();
}
function onThemeLoaded() {
document.documentElement.classList.remove('preload');
try {
var color = getComputedStyle(document.querySelector('.skinHeader')).getPropertyValue('background-color');
if (color) {
appHost.setThemeColor(color);
}
} catch (err) {
console.error('error setting theme color: ' + err);
}
}
skinManager.setTheme = function (id, context) {
return new Promise(function (resolve, reject) {
if (currentThemeId && currentThemeId === id) {
resolve();
return;
}
var isDefaultProperty = context === 'serverdashboard' ? 'isDefaultServerDashboard' : 'isDefault';
var info = getThemeStylesheetInfo(id, isDefaultProperty);
if (currentThemeId && currentThemeId === info.themeId) {
resolve();
return;
}
var linkUrl = info.stylesheetPath;
unloadTheme();
var link = document.createElement('link');
link.setAttribute('rel', 'stylesheet');
link.setAttribute('type', 'text/css');
link.onload = function () {
onThemeLoaded();
resolve();
};
link.setAttribute('href', linkUrl);
document.head.appendChild(link);
themeStyleElement = link;
currentThemeId = info.themeId;
loadThemeResources(info.themeId);
onViewBeforeShow({});
});
};
function onViewBeforeShow(e) {
if (e.detail && e.detail.type === 'video-osd') {
// This removes the space that the scrollbar takes while playing a video
document.body.classList.remove('force-scroll');
return;
}
if (themeResources.backdrop) {
backdrop.setBackdrop(themeResources.backdrop);
}
if (!browser.mobile && userSettings.enableThemeSongs()) {
if (lastSound === 0) {
if (themeResources.themeSong) {
playSound(themeResources.themeSong);
}
} else if ((new Date().getTime() - lastSound) > 30000) {
if (themeResources.effect) {
playSound(themeResources.effect);
}
}
}
// This keeps the scrollbar always present in all pages, so we avoid clipping while switching between pages
// that need the scrollbar and pages that don't.
document.body.classList.add('force-scroll');
}
document.addEventListener('viewshow', onViewBeforeShow);
function playSound(path, volume) {
lastSound = new Date().getTime();
require(['howler'], function (howler) {
/* globals Howl */
try {
var sound = new Howl({
src: [path],
volume: volume || 0.1
});
sound.play();
currentSound = sound;
} catch (err) {
console.error('error playing sound: ' + err);
}
});
}
return skinManager;
});

130
src/components/slideshow/slideshow.js
View file

@ -2,28 +2,37 @@
* Image viewer component
* @module components/slideshow/slideshow
*/
define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'focusManager', 'browser', 'apphost', 'dom', 'css!./style', 'material-icons', 'paper-icon-button-light'], function (dialogHelper, inputManager, connectionManager, layoutManager, focusManager, browser, appHost, dom) {
'use strict';
import dialogHelper from 'dialogHelper';
import inputManager from 'inputManager';
import connectionManager from 'connectionManager';
import layoutManager from 'layoutManager';
import focusManager from 'focusManager';
import browser from 'browser';
import appHost from 'apphost';
import dom from 'dom';
import 'css!./style';
import 'material-icons';
import 'paper-icon-button-light';
/**
/**
* Name of transition event.
*/
const transitionEndEventName = dom.whichTransitionEvent();
const transitionEndEventName = dom.whichTransitionEvent();
/**
/**
* Flag to use fake image to fix blurry zoomed image.
* At least WebKit doesn't restore quality for zoomed images.
*/
const useFakeZoomImage = browser.safari;
const useFakeZoomImage = browser.safari;
/**
/**
* Retrieves an item's image URL from the API.
* @param {object|string} item - Item used to generate the image URL.
* @param {object} options - Options of the image.
* @param {object} apiClient - API client instance used to retrieve the image.
* @returns {null|string} URL of the item's image.
*/
function getImageUrl(item, options, apiClient) {
function getImageUrl(item, options, apiClient) {
options = options || {};
options.type = options.type || 'Primary';
@ -44,16 +53,16 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
}
return null;
}
}
/**
/**
* Retrieves a backdrop's image URL from the API.
* @param {object} item - Item used to generate the image URL.
* @param {object} options - Options of the image.
* @param {object} apiClient - API client instance used to retrieve the image.
* @returns {null|string} URL of the item's backdrop.
*/
function getBackdropImageUrl(item, options, apiClient) {
function getBackdropImageUrl(item, options, apiClient) {
options = options || {};
options.type = options.type || 'Backdrop';
@ -68,16 +77,16 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
}
return null;
}
}
/**
/**
* Dispatches a request for an item's image to its respective handler.
* @param {object} item - Item used to generate the image URL.
* @returns {string} URL of the item's image.
*/
function getImgUrl(item, user) {
var apiClient = connectionManager.getApiClient(item.ServerId);
var imageOptions = {};
function getImgUrl(item, user) {
const apiClient = connectionManager.getApiClient(item.ServerId);
const imageOptions = {};
if (item.BackdropImageTags && item.BackdropImageTags.length) {
return getBackdropImageUrl(item, imageOptions, apiClient);
@ -88,9 +97,9 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
imageOptions.type = 'Primary';
return getImageUrl(item, imageOptions, apiClient);
}
}
}
/**
/**
* Generates a button using the specified icon, classes and properties.
* @param {string} icon - Name of the material icon on the button
* @param {string} cssClass - CSS classes to assign to the button
@ -98,36 +107,36 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
* @param {boolean} autoFocus - Flag to set the autofocus attribute on the button.
* @returns {string} The HTML markup of the button.
*/
function getIcon(icon, cssClass, canFocus, autoFocus) {
var tabIndex = canFocus ? '' : ' tabindex="-1"';
function getIcon(icon, cssClass, canFocus, autoFocus) {
const tabIndex = canFocus ? '' : ' tabindex="-1"';
autoFocus = autoFocus ? ' autofocus' : '';
return '<button is="paper-icon-button-light" class="autoSize ' + cssClass + '"' + tabIndex + autoFocus + '><span class="material-icons slideshowButtonIcon ' + icon + '"></span></button>';
}
}
/**
/**
* Sets the viewport meta tag to enable or disable scaling by the user.
* @param {boolean} scalable - Flag to set the scalability of the viewport.
*/
function setUserScalable(scalable) {
function setUserScalable(scalable) {
try {
appHost.setUserScalable(scalable);
} catch (err) {
console.error('error in appHost.setUserScalable: ' + err);
}
}
}
return function (options) {
var self = this;
export default function (options) {
const self = this;
/** Initialized instance of Swiper. */
var swiperInstance;
let swiperInstance;
/** Initialized instance of the dialog containing the Swiper instance. */
var dialog;
let dialog;
/** Options of the slideshow components */
var currentOptions;
let currentOptions;
/** ID of the timeout used to hide the OSD. */
var hideTimeout;
let hideTimeout;
/** Last coordinates of the mouse pointer. */
var lastMouseMoveData;
let lastMouseMoveData;
/**
* Creates the HTML markup for the dialog and the OSD.
@ -147,12 +156,12 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
dialog.classList.add('slideshowDialog');
var html = '';
let html = '';
html += '<div class="slideshowSwiperContainer"><div class="swiper-wrapper"></div></div>';
if (options.interactive && !layoutManager.tv) {
var actionButtonsOnTop = layoutManager.mobile;
const actionButtonsOnTop = layoutManager.mobile;
html += getIcon('keyboard_arrow_left', 'btnSlideshowPrevious slideshowButton hide-mouse-idle-tv', false);
html += getIcon('keyboard_arrow_right', 'btnSlideshowNext slideshowButton hide-mouse-idle-tv', false);
@ -193,17 +202,17 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
dialogHelper.close(dialog);
});
var btnPause = dialog.querySelector('.btnSlideshowPause');
const btnPause = dialog.querySelector('.btnSlideshowPause');
if (btnPause) {
btnPause.addEventListener('click', playPause);
}
var btnDownload = dialog.querySelector('.btnDownload');
const btnDownload = dialog.querySelector('.btnDownload');
if (btnDownload) {
btnDownload.addEventListener('click', download);
}
var btnShare = dialog.querySelector('.btnShare');
const btnShare = dialog.querySelector('.btnShare');
if (btnShare) {
btnShare.addEventListener('click', share);
}
@ -228,7 +237,7 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
* Handles OSD changes when the autoplay is started.
*/
function onAutoplayStart() {
var btnSlideshowPause = dialog.querySelector('.btnSlideshowPause .material-icons');
const btnSlideshowPause = dialog.querySelector('.btnSlideshowPause .material-icons');
if (btnSlideshowPause) {
btnSlideshowPause.classList.replace('play_arrow', 'pause');
}
@ -238,7 +247,7 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
* Handles OSD changes when the autoplay is stopped.
*/
function onAutoplayStop() {
var btnSlideshowPause = dialog.querySelector('.btnSlideshowPause .material-icons');
const btnSlideshowPause = dialog.querySelector('.btnSlideshowPause .material-icons');
if (btnSlideshowPause) {
btnSlideshowPause.classList.replace('pause', 'play_arrow');
}
@ -285,14 +294,14 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
* @param {Object} options - Options used to initialize the Swiper instance.
*/
function loadSwiper(dialog, options) {
var slides;
let slides;
if (currentOptions.slides) {
slides = currentOptions.slides;
} else {
slides = currentOptions.items;
}
require(['swiper'], function (Swiper) {
import('swiper').then(({default: Swiper}) => {
swiperInstance = new Swiper(dialog.querySelector('.slideshowSwiperContainer'), {
direction: 'horizontal',
// Loop is disabled due to the virtual slides option not supporting it.
@ -366,7 +375,7 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
* @returns {string} The HTML markup of the slide.
*/
function getSwiperSlideHtmlFromSlide(item) {
var html = '';
let html = '';
html += '<div class="swiper-slide" data-original="' + item.originalImage + '" data-itemid="' + item.Id + '" data-serverid="' + item.ServerId + '">';
html += '<div class="swiper-zoom-container">';
if (useFakeZoomImage) {
@ -401,7 +410,7 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
*/
function getCurrentImageInfo() {
if (swiperInstance) {
var slide = document.querySelector('.swiper-slide-active');
const slide = document.querySelector('.swiper-slide-active');
if (slide) {
return {
@ -421,9 +430,9 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
* Starts a download for the currently displayed slide.
*/
function download() {
var imageInfo = getCurrentImageInfo();
const imageInfo = getCurrentImageInfo();
require(['fileDownloader'], function (fileDownloader) {
import('fileDownloader').then(({default: fileDownloader}) => {
fileDownloader.download([imageInfo]);
});
}
@ -432,7 +441,7 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
* Shares the currently displayed slide using the browser's built-in sharing feature.
*/
function share() {
var imageInfo = getCurrentImageInfo();
const imageInfo = getCurrentImageInfo();
navigator.share({
url: imageInfo.shareUrl
@ -461,7 +470,7 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
* Toggles the autoplay feature of the Swiper instance.
*/
function playPause() {
var paused = !dialog.querySelector('.btnSlideshowPause .material-icons').classList.contains('pause');
const paused = !dialog.querySelector('.btnSlideshowPause .material-icons').classList.contains('pause');
if (paused) {
play();
} else {
@ -473,7 +482,7 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
* Closes the dialog and destroys the Swiper instance.
*/
function onDialogClosed() {
var swiper = swiperInstance;
const swiper = swiperInstance;
if (swiper) {
swiper.destroy(true, true);
swiperInstance = null;
@ -491,7 +500,7 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
* Shows the OSD.
*/
function showOsd() {
var bottom = dialog.querySelector('.slideshowBottomBar');
const bottom = dialog.querySelector('.slideshowBottomBar');
if (bottom) {
slideUpToShow(bottom);
startHideTimer();
@ -502,7 +511,7 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
* Hides the OSD.
*/
function hideOsd() {
var bottom = dialog.querySelector('.slideshowBottomBar');
const bottom = dialog.querySelector('.slideshowBottomBar');
if (bottom) {
slideDownToHide(bottom);
}
@ -537,7 +546,7 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
element.classList.remove('hide');
var onFinish = function () {
const onFinish = function () {
focusManager.focus(element.querySelector('.btnSlideshowPause'));
};
@ -547,11 +556,11 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
}
requestAnimationFrame(function () {
var keyframes = [
const keyframes = [
{ transform: 'translate3d(0,' + element.offsetHeight + 'px,0)', opacity: '.3', offset: 0 },
{ transform: 'translate3d(0,0,0)', opacity: '1', offset: 1 }
];
var timing = { duration: 300, iterations: 1, easing: 'ease-out' };
const timing = { duration: 300, iterations: 1, easing: 'ease-out' };
element.animate(keyframes, timing).onfinish = onFinish;
});
}
@ -565,7 +574,7 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
return;
}
var onFinish = function () {
const onFinish = function () {
element.classList.add('hide');
};
@ -575,11 +584,11 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
}
requestAnimationFrame(function () {
var keyframes = [
const keyframes = [
{ transform: 'translate3d(0,0,0)', opacity: '1', offset: 0 },
{ transform: 'translate3d(0,' + element.offsetHeight + 'px,0)', opacity: '.3', offset: 1 }
];
var timing = { duration: 300, iterations: 1, easing: 'ease-out' };
const timing = { duration: 300, iterations: 1, easing: 'ease-out' };
element.animate(keyframes, timing).onfinish = onFinish;
});
}
@ -589,13 +598,13 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
* @param {Event} event - Pointer movement event.
*/
function onPointerMove(event) {
var pointerType = event.pointerType || (layoutManager.mobile ? 'touch' : 'mouse');
const pointerType = event.pointerType || (layoutManager.mobile ? 'touch' : 'mouse');
if (pointerType === 'mouse') {
var eventX = event.screenX || 0;
var eventY = event.screenY || 0;
const eventX = event.screenX || 0;
const eventY = event.screenY || 0;
var obj = lastMouseMoveData;
const obj = lastMouseMoveData;
if (!obj) {
lastMouseMoveData = {
x: eventX,
@ -661,5 +670,4 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
dialogHelper.close(dialog);
}
};
};
});
}

63
src/components/sortmenu/sortmenu.js
View file

@ -1,46 +1,51 @@
define(['require', 'dom', 'focusManager', 'dialogHelper', 'loading', 'layoutManager', 'connectionManager', 'globalize', 'userSettings', 'emby-select', 'paper-icon-button-light', 'material-icons', 'css!./../formdialog', 'emby-button', 'flexStyles'], function (require, dom, focusManager, dialogHelper, loading, layoutManager, connectionManager, globalize, userSettings) {
'use strict';
import dialogHelper from 'dialogHelper';
import layoutManager from 'layoutManager';
import globalize from 'globalize';
import * as userSettings from 'userSettings';
import 'emby-select';
import 'paper-icon-button-light';
import 'material-icons';
import 'css!./../formdialog';
import 'emby-button';
import 'flexStyles';
function onSubmit(e) {
function onSubmit(e) {
e.preventDefault();
return false;
}
}
function initEditor(context, settings) {
function initEditor(context, settings) {
context.querySelector('form').addEventListener('submit', onSubmit);
context.querySelector('.selectSortOrder').value = settings.sortOrder;
context.querySelector('.selectSortBy').value = settings.sortBy;
}
}
function centerFocus(elem, horiz, on) {
require(['scrollHelper'], function (scrollHelper) {
var fn = on ? 'on' : 'off';
function centerFocus(elem, horiz, on) {
import('scrollHelper').then(({default: scrollHelper}) => {
const fn = on ? 'on' : 'off';
scrollHelper.centerFocus[fn](elem, horiz);
});
}
}
function fillSortBy(context, options) {
var selectSortBy = context.querySelector('.selectSortBy');
function fillSortBy(context, options) {
const selectSortBy = context.querySelector('.selectSortBy');
selectSortBy.innerHTML = options.map(function (o) {
return '<option value="' + o.value + '">' + o.name + '</option>';
}).join('');
}
}
function saveValues(context, settings, settingsKey) {
function saveValues(context, settingsKey) {
userSettings.setFilter(settingsKey + '-sortorder', context.querySelector('.selectSortOrder').value);
userSettings.setFilter(settingsKey + '-sortby', context.querySelector('.selectSortBy').value);
}
}
function SortMenu() {
}
SortMenu.prototype.show = function (options) {
class SortMenu {
show(options) {
return new Promise(function (resolve, reject) {
require(['text!./sortmenu.template.html'], function (template) {
var dialogOptions = {
import('text!./sortmenu.template.html').then(({default: template}) => {
const dialogOptions = {
removeOnClose: true,
scrollY: false
};
@ -51,11 +56,11 @@ define(['require', 'dom', 'focusManager', 'dialogHelper', 'loading', 'layoutMana
dialogOptions.size = 'small';
}
var dlg = dialogHelper.createDialog(dialogOptions);
const dlg = dialogHelper.createDialog(dialogOptions);
dlg.classList.add('formDialog');
var html = '';
let html = '';
html += '<div class="formDialogHeader">';
html += '<button is="paper-icon-button-light" class="btnCancel hide-mouse-idle-tv" tabindex="-1"><span class="material-icons arrow_back"></span></button>';
@ -78,7 +83,7 @@ define(['require', 'dom', 'focusManager', 'dialogHelper', 'loading', 'layoutMana
centerFocus(dlg.querySelector('.formDialogContent'), false, true);
}
var submitted;
let submitted;
dlg.querySelector('form').addEventListener('change', function () {
submitted = true;
@ -90,7 +95,7 @@ define(['require', 'dom', 'focusManager', 'dialogHelper', 'loading', 'layoutMana
}
if (submitted) {
saveValues(dlg, options.settings, options.settingsKey);
saveValues(dlg, options.settingsKey);
resolve();
return;
}
@ -99,7 +104,7 @@ define(['require', 'dom', 'focusManager', 'dialogHelper', 'loading', 'layoutMana
});
});
});
};
}
}
return SortMenu;
});
export default SortMenu;

185
src/components/subtitleeditor/subtitleeditor.js
View file

@ -1,13 +1,27 @@
define(['dialogHelper', 'require', 'layoutManager', 'globalize', 'userSettings', 'connectionManager', 'loading', 'focusManager', 'dom', 'apphost', 'emby-select', 'listViewStyle', 'paper-icon-button-light', 'css!./../formdialog', 'material-icons', 'css!./subtitleeditor', 'emby-button', 'flexStyles'], function (dialogHelper, require, layoutManager, globalize, userSettings, connectionManager, loading, focusManager, dom, appHost) {
'use strict';
import dialogHelper from 'dialogHelper';
import layoutManager from 'layoutManager';
import globalize from 'globalize';
import * as userSettings from 'userSettings';
import connectionManager from 'connectionManager';
import loading from 'loading';
import focusManager from 'focusManager';
import dom from 'dom';
import 'emby-select';
import 'listViewStyle';
import 'paper-icon-button-light';
import 'css!./../formdialog';
import 'material-icons';
import 'css!./subtitleeditor';
import 'emby-button';
import 'flexStyles';
var currentItem;
var hasChanges;
let currentItem;
let hasChanges;
function downloadRemoteSubtitles(context, id) {
var url = 'Items/' + currentItem.Id + '/RemoteSearch/Subtitles/' + id;
function downloadRemoteSubtitles(context, id) {
let url = 'Items/' + currentItem.Id + '/RemoteSearch/Subtitles/' + id;
var apiClient = connectionManager.getApiClient(currentItem.ServerId);
let apiClient = connectionManager.getApiClient(currentItem.ServerId);
apiClient.ajax({
type: 'POST',
@ -16,19 +30,19 @@ define(['dialogHelper', 'require', 'layoutManager', 'globalize', 'userSettings',
}).then(function () {
hasChanges = true;
require(['toast'], function (toast) {
import('toast').then(({default: toast}) => {
toast(globalize.translate('MessageDownloadQueued'));
});
focusManager.autoFocus(context);
});
}
}
function deleteLocalSubtitle(context, index) {
var msg = globalize.translate('MessageAreYouSureDeleteSubtitles');
function deleteLocalSubtitle(context, index) {
let msg = globalize.translate('MessageAreYouSureDeleteSubtitles');
require(['confirm'], function (confirm) {
confirm.default({
import('confirm').then(({default: confirm}) => {
confirm({
title: globalize.translate('ConfirmDeletion'),
text: msg,
@ -38,10 +52,10 @@ define(['dialogHelper', 'require', 'layoutManager', 'globalize', 'userSettings',
}).then(function () {
loading.show();
var itemId = currentItem.Id;
var url = 'Videos/' + itemId + '/Subtitles/' + index;
let itemId = currentItem.Id;
let url = 'Videos/' + itemId + '/Subtitles/' + index;
var apiClient = connectionManager.getApiClient(currentItem.ServerId);
let apiClient = connectionManager.getApiClient(currentItem.ServerId);
apiClient.ajax({
@ -54,16 +68,16 @@ define(['dialogHelper', 'require', 'layoutManager', 'globalize', 'userSettings',
});
});
});
}
}
function fillSubtitleList(context, item) {
var streams = item.MediaStreams || [];
function fillSubtitleList(context, item) {
let streams = item.MediaStreams || [];
var subs = streams.filter(function (s) {
let subs = streams.filter(function (s) {
return s.Type === 'Subtitle';
});
var html = '';
let html = '';
if (subs.length) {
html += '<h2>' + globalize.translate('MySubtitles') + '</h2>';
@ -71,10 +85,10 @@ define(['dialogHelper', 'require', 'layoutManager', 'globalize', 'userSettings',
html += '<div>';
html += subs.map(function (s) {
var itemHtml = '';
let itemHtml = '';
var tagName = layoutManager.tv ? 'button' : 'div';
var className = layoutManager.tv && s.Path ? 'listItem listItem-border btnDelete' : 'listItem listItem-border';
let tagName = layoutManager.tv ? 'button' : 'div';
let className = layoutManager.tv && s.Path ? 'listItem listItem-border btnDelete' : 'listItem listItem-border';
if (layoutManager.tv) {
className += ' listItem-focusscale listItem-button';
@ -113,7 +127,7 @@ define(['dialogHelper', 'require', 'layoutManager', 'globalize', 'userSettings',
html += '</div>';
}
var elem = context.querySelector('.subtitleList');
let elem = context.querySelector('.subtitleList');
if (subs.length) {
elem.classList.remove('hide');
@ -121,32 +135,32 @@ define(['dialogHelper', 'require', 'layoutManager', 'globalize', 'userSettings',
elem.classList.add('hide');
}
elem.innerHTML = html;
}
}
function fillLanguages(context, apiClient, languages) {
var selectLanguage = context.querySelector('#selectLanguage');
function fillLanguages(context, apiClient, languages) {
let selectLanguage = context.querySelector('#selectLanguage');
selectLanguage.innerHTML = languages.map(function (l) {
return '<option value="' + l.ThreeLetterISOLanguageName + '">' + l.DisplayName + '</option>';
});
var lastLanguage = userSettings.get('subtitleeditor-language');
let lastLanguage = userSettings.get('subtitleeditor-language');
if (lastLanguage) {
selectLanguage.value = lastLanguage;
} else {
apiClient.getCurrentUser().then(function (user) {
var lang = user.Configuration.SubtitleLanguagePreference;
let lang = user.Configuration.SubtitleLanguagePreference;
if (lang) {
selectLanguage.value = lang;
}
});
}
}
}
function renderSearchResults(context, results) {
var lastProvider = '';
var html = '';
function renderSearchResults(context, results) {
let lastProvider = '';
let html = '';
if (!results.length) {
context.querySelector('.noSearchResults').classList.remove('hide');
@ -157,10 +171,10 @@ define(['dialogHelper', 'require', 'layoutManager', 'globalize', 'userSettings',
context.querySelector('.noSearchResults').classList.add('hide');
for (var i = 0, length = results.length; i < length; i++) {
var result = results[i];
for (let i = 0, length = results.length; i < length; i++) {
let result = results[i];
var provider = result.ProviderName;
let provider = result.ProviderName;
if (provider !== lastProvider) {
if (i > 0) {
@ -171,8 +185,8 @@ define(['dialogHelper', 'require', 'layoutManager', 'globalize', 'userSettings',
lastProvider = provider;
}
var tagName = layoutManager.tv ? 'button' : 'div';
var className = layoutManager.tv ? 'listItem listItem-border btnOptions' : 'listItem listItem-border';
let tagName = layoutManager.tv ? 'button' : 'div';
let className = layoutManager.tv ? 'listItem listItem-border btnOptions' : 'listItem listItem-border';
if (layoutManager.tv) {
className += ' listItem-focusscale listItem-button';
}
@ -181,7 +195,7 @@ define(['dialogHelper', 'require', 'layoutManager', 'globalize', 'userSettings',
html += '<span class="listItemIcon material-icons closed_caption"></span>';
var bodyClass = result.Comment || result.IsHashMatch ? 'three-line' : 'two-line';
let bodyClass = result.Comment || result.IsHashMatch ? 'three-line' : 'two-line';
html += '<div class="listItemBody ' + bodyClass + '">';
@ -218,34 +232,34 @@ define(['dialogHelper', 'require', 'layoutManager', 'globalize', 'userSettings',
html += '</div>';
}
var elem = context.querySelector('.subtitleResults');
let elem = context.querySelector('.subtitleResults');
elem.innerHTML = html;
loading.hide();
}
}
function searchForSubtitles(context, language) {
function searchForSubtitles(context, language) {
userSettings.set('subtitleeditor-language', language);
loading.show();
var apiClient = connectionManager.getApiClient(currentItem.ServerId);
var url = apiClient.getUrl('Items/' + currentItem.Id + '/RemoteSearch/Subtitles/' + language);
let apiClient = connectionManager.getApiClient(currentItem.ServerId);
let url = apiClient.getUrl('Items/' + currentItem.Id + '/RemoteSearch/Subtitles/' + language);
apiClient.getJSON(url).then(function (results) {
renderSearchResults(context, results);
});
}
}
function reload(context, apiClient, itemId) {
function reload(context, apiClient, itemId) {
context.querySelector('.noSearchResults').classList.add('hide');
function onGetItem(item) {
currentItem = item;
fillSubtitleList(context, item);
var file = item.Path || '';
var index = Math.max(file.lastIndexOf('/'), file.lastIndexOf('\\'));
let file = item.Path || '';
let index = Math.max(file.lastIndexOf('/'), file.lastIndexOf('\\'));
if (index > -1) {
file = file.substring(index + 1);
}
@ -266,56 +280,56 @@ define(['dialogHelper', 'require', 'layoutManager', 'globalize', 'userSettings',
} else {
onGetItem(itemId);
}
}
}
function onSearchSubmit(e) {
var form = this;
function onSearchSubmit(e) {
let form = this;
var lang = form.querySelector('#selectLanguage', form).value;
let lang = form.querySelector('#selectLanguage', form).value;
searchForSubtitles(dom.parentWithClass(form, 'formDialogContent'), lang);
e.preventDefault();
return false;
}
}
function onSubtitleListClick(e) {
var btnDelete = dom.parentWithClass(e.target, 'btnDelete');
function onSubtitleListClick(e) {
let btnDelete = dom.parentWithClass(e.target, 'btnDelete');
if (btnDelete) {
var index = btnDelete.getAttribute('data-index');
var context = dom.parentWithClass(btnDelete, 'subtitleEditorDialog');
let index = btnDelete.getAttribute('data-index');
let context = dom.parentWithClass(btnDelete, 'subtitleEditorDialog');
deleteLocalSubtitle(context, index);
}
}
}
function onSubtitleResultsClick(e) {
var subtitleId;
var context;
function onSubtitleResultsClick(e) {
let subtitleId;
let context;
var btnOptions = dom.parentWithClass(e.target, 'btnOptions');
let btnOptions = dom.parentWithClass(e.target, 'btnOptions');
if (btnOptions) {
subtitleId = btnOptions.getAttribute('data-subid');
context = dom.parentWithClass(btnOptions, 'subtitleEditorDialog');
showDownloadOptions(btnOptions, context, subtitleId);
}
var btnDownload = dom.parentWithClass(e.target, 'btnDownload');
let btnDownload = dom.parentWithClass(e.target, 'btnDownload');
if (btnDownload) {
subtitleId = btnDownload.getAttribute('data-subid');
context = dom.parentWithClass(btnDownload, 'subtitleEditorDialog');
downloadRemoteSubtitles(context, subtitleId);
}
}
}
function showDownloadOptions(button, context, subtitleId) {
var items = [];
function showDownloadOptions(button, context, subtitleId) {
let items = [];
items.push({
name: globalize.translate('Download'),
id: 'download'
});
require(['actionsheet'], function (actionsheet) {
import('actionsheet').then(({default: actionsheet}) => {
actionsheet.show({
items: items,
positionTo: button
@ -330,21 +344,21 @@ define(['dialogHelper', 'require', 'layoutManager', 'globalize', 'userSettings',
}
});
});
}
}
function centerFocus(elem, horiz, on) {
require(['scrollHelper'], function (scrollHelper) {
var fn = on ? 'on' : 'off';
function centerFocus(elem, horiz, on) {
import('scrollHelper').then(({default: scrollHelper}) => {
let fn = on ? 'on' : 'off';
scrollHelper.centerFocus[fn](elem, horiz);
});
}
}
function showEditorInternal(itemId, serverId, template) {
function showEditorInternal(itemId, serverId, template) {
hasChanges = false;
var apiClient = connectionManager.getApiClient(serverId);
let apiClient = connectionManager.getApiClient(serverId);
return apiClient.getItem(apiClient.getCurrentUserId(), itemId).then(function (item) {
var dialogOptions = {
let dialogOptions = {
removeOnClose: true,
scrollY: false
};
@ -355,7 +369,7 @@ define(['dialogHelper', 'require', 'layoutManager', 'globalize', 'userSettings',
dialogOptions.size = 'small';
}
var dlg = dialogHelper.createDialog(dialogOptions);
let dlg = dialogHelper.createDialog(dialogOptions);
dlg.classList.add('formDialog');
dlg.classList.add('subtitleEditorDialog');
@ -366,7 +380,7 @@ define(['dialogHelper', 'require', 'layoutManager', 'globalize', 'userSettings',
dlg.querySelector('.subtitleSearchForm').addEventListener('submit', onSearchSubmit);
var btnSubmit = dlg.querySelector('.btnSubmit');
let btnSubmit = dlg.querySelector('.btnSubmit');
if (layoutManager.tv) {
centerFocus(dlg.querySelector('.formDialogContent'), false, true);
@ -375,7 +389,7 @@ define(['dialogHelper', 'require', 'layoutManager', 'globalize', 'userSettings',
btnSubmit.classList.add('hide');
}
var editorContent = dlg.querySelector('.formDialogContent');
let editorContent = dlg.querySelector('.formDialogContent');
dlg.querySelector('.subtitleList').addEventListener('click', onSubtitleListClick);
dlg.querySelector('.subtitleResults').addEventListener('click', onSubtitleResultsClick);
@ -406,19 +420,18 @@ define(['dialogHelper', 'require', 'layoutManager', 'globalize', 'userSettings',
reload(editorContent, apiClient, item);
});
});
}
}
function showEditor(itemId, serverId) {
function showEditor(itemId, serverId) {
loading.show();
return new Promise(function (resolve, reject) {
require(['text!./subtitleeditor.template.html'], function (template) {
import('text!./subtitleeditor.template.html').then(({default: template}) => {
showEditorInternal(itemId, serverId, template).then(resolve, reject);
});
});
}
}
return {
export default {
show: showEditor
};
});
};

63
src/components/subtitlesettings/subtitleappearancehelper.js
View file

@ -3,31 +3,9 @@
* @module components/subtitleSettings/subtitleAppearanceHelper
*/
function getTextStyles(settings, isCue) {
function getTextStyles(settings, preview) {
let list = [];
if (isCue) {
switch (settings.textSize || '') {
case 'smaller':
list.push({ name: 'font-size', value: '.5em' });
break;
case 'small':
list.push({ name: 'font-size', value: '.7em' });
break;
case 'large':
list.push({ name: 'font-size', value: '1.3em' });
break;
case 'larger':
list.push({ name: 'font-size', value: '1.72em' });
break;
case 'extralarge':
list.push({ name: 'font-size', value: '2em' });
break;
default:
case 'medium':
break;
}
} else {
switch (settings.textSize || '') {
case 'smaller':
list.push({ name: 'font-size', value: '.8em' });
@ -49,7 +27,6 @@ function getTextStyles(settings, isCue) {
list.push({ name: 'font-size', value: '1.36em' });
break;
}
}
switch (settings.dropShadow || '') {
case 'raised':
@ -111,13 +88,43 @@ function getTextStyles(settings, isCue) {
break;
}
if (!preview) {
const pos = parseInt(settings.verticalPosition, 10);
const lineHeight = 1.35; // FIXME: It is better to read this value from element
const line = Math.abs(pos * lineHeight);
if (pos < 0) {
list.push({ name: 'min-height', value: `${line}em` });
list.push({ name: 'margin-top', value: '' });
} else {
list.push({ name: 'min-height', value: '' });
list.push({ name: 'margin-top', value: `${line}em` });
}
}
return list;
}
export function getStyles(settings, isCue) {
function getWindowStyles(settings, preview) {
const list = [];
if (!preview) {
const pos = parseInt(settings.verticalPosition, 10);
if (pos < 0) {
list.push({ name: 'top', value: '' });
list.push({ name: 'bottom', value: '0' });
} else {
list.push({ name: 'top', value: '0' });
list.push({ name: 'bottom', value: '' });
}
}
return list;
}
export function getStyles(settings, preview) {
return {
text: getTextStyles(settings, isCue),
window: []
text: getTextStyles(settings, preview),
window: getWindowStyles(settings, preview)
};
}
@ -130,7 +137,7 @@ function applyStyleList(styles, elem) {
}
export function applyStyles(elements, appearanceSettings) {
let styles = getStyles(appearanceSettings);
let styles = getStyles(appearanceSettings, !!elements.preview);
if (elements.text) {
applyStyleList(styles.text, elements.text);

26
src/components/subtitlesettings/subtitlesettings.css Normal file
View file

@ -0,0 +1,26 @@
.subtitleappearance-fullpreview {
position: fixed;
width: 100%;
height: 100%;
top: 0;
left: 0;
z-index: 1000;
pointer-events: none;
transition: 0.2s;
}
.subtitleappearance-fullpreview-hide {
opacity: 0;
}
.subtitleappearance-fullpreview-window {
position: absolute;
width: 100%;
font-size: 170%;
text-align: center;
}
.subtitleappearance-fullpreview-text {
display: inline-block;
max-width: 70%;
}

72
src/components/subtitlesettings/subtitlesettings.js
View file

@ -2,6 +2,7 @@ import globalize from 'globalize';
import appHost from 'apphost';
import appSettings from 'appSettings';
import focusManager from 'focusManager';
import layoutManager from 'layoutManager';
import loading from 'loading';
import connectionManager from 'connectionManager';
import subtitleAppearanceHelper from 'subtitleAppearanceHelper';
@ -10,9 +11,11 @@ import dom from 'dom';
import events from 'events';
import 'listViewStyle';
import 'emby-select';
import 'emby-slider';
import 'emby-input';
import 'emby-checkbox';
import 'flexStyles';
import 'css!./subtitlesettings';
/**
* Subtitle settings.
@ -27,6 +30,7 @@ function getSubtitleAppearanceObject(context) {
appearanceSettings.font = context.querySelector('#selectFont').value;
appearanceSettings.textBackground = context.querySelector('#inputTextBackground').value;
appearanceSettings.textColor = context.querySelector('#inputTextColor').value;
appearanceSettings.verticalPosition = context.querySelector('#sliderVerticalPosition').value;
return appearanceSettings;
}
@ -51,6 +55,7 @@ function loadForm(context, user, userSettings, appearanceSettings, apiClient) {
context.querySelector('#inputTextBackground').value = appearanceSettings.textBackground || 'transparent';
context.querySelector('#inputTextColor').value = appearanceSettings.textColor || '#ffffff';
context.querySelector('#selectFont').value = appearanceSettings.font || '';
context.querySelector('#sliderVerticalPosition').value = appearanceSettings.verticalPosition;
context.querySelector('#selectSubtitleBurnIn').value = appSettings.get('subtitleburnin') || '';
@ -112,10 +117,45 @@ function onAppearanceFieldChange(e) {
let elements = {
window: view.querySelector('.subtitleappearance-preview-window'),
text: view.querySelector('.subtitleappearance-preview-text')
text: view.querySelector('.subtitleappearance-preview-text'),
preview: true
};
subtitleAppearanceHelper.applyStyles(elements, appearanceSettings);
subtitleAppearanceHelper.applyStyles({
window: view.querySelector('.subtitleappearance-fullpreview-window'),
text: view.querySelector('.subtitleappearance-fullpreview-text')
}, appearanceSettings);
}
const subtitlePreviewDelay = 1000;
let subtitlePreviewTimer;
function showSubtitlePreview(persistent) {
clearTimeout(subtitlePreviewTimer);
this._fullPreview.classList.remove('subtitleappearance-fullpreview-hide');
if (persistent) {
this._refFullPreview++;
}
if (this._refFullPreview === 0) {
subtitlePreviewTimer = setTimeout(hideSubtitlePreview.bind(this), subtitlePreviewDelay);
}
}
function hideSubtitlePreview(persistent) {
clearTimeout(subtitlePreviewTimer);
if (persistent) {
this._refFullPreview--;
}
if (this._refFullPreview === 0) {
this._fullPreview.classList.add('subtitleappearance-fullpreview-hide');
}
}
function embed(options, self) {
@ -138,6 +178,36 @@ function embed(options, self) {
if (appHost.supports('subtitleappearancesettings')) {
options.element.querySelector('.subtitleAppearanceSection').classList.remove('hide');
self._fullPreview = options.element.querySelector('.subtitleappearance-fullpreview');
self._refFullPreview = 0;
const sliderVerticalPosition = options.element.querySelector('#sliderVerticalPosition');
sliderVerticalPosition.addEventListener('input', onAppearanceFieldChange);
sliderVerticalPosition.addEventListener('input', () => showSubtitlePreview.call(self));
const eventPrefix = window.PointerEvent ? 'pointer' : 'mouse';
sliderVerticalPosition.addEventListener(`${eventPrefix}enter`, () => showSubtitlePreview.call(self, true));
sliderVerticalPosition.addEventListener(`${eventPrefix}leave`, () => hideSubtitlePreview.call(self, true));
if (layoutManager.tv) {
sliderVerticalPosition.addEventListener('focus', () => showSubtitlePreview.call(self, true));
sliderVerticalPosition.addEventListener('blur', () => hideSubtitlePreview.call(self, true));
// Give CustomElements time to attach
setTimeout(() => {
sliderVerticalPosition.classList.add('focusable');
sliderVerticalPosition.enableKeyboardDragging();
}, 0);
}
options.element.querySelector('.chkPreview').addEventListener('change', (e) => {
if (e.target.checked) {
showSubtitlePreview.call(self, true);
} else {
hideSubtitlePreview.call(self, true);
}
});
}
self.loadData();

24
src/components/subtitlesettings/subtitlesettings.template.html
View file

@ -38,6 +38,16 @@
${HeaderSubtitleAppearance}
</h2>
<div class="subtitleappearance-fullpreview subtitleappearance-fullpreview-hide">
<div class="subtitleappearance-fullpreview-window">
<div class="subtitleappearance-fullpreview-text">
${HeaderSubtitleAppearance}
<br>
${TheseSettingsAffectSubtitlesOnThisDevice}
</div>
</div>
</div>
<div style="margin: 2em 0 2em;">
<div class="subtitleappearance-preview flex align-items-center justify-content-center" style="margin:2em 0;padding:1.6em;color:black;background:linear-gradient(140deg,#aa5cc3,#00a4dc);">
<div class="subtitleappearance-preview-window flex align-items-center justify-content-center" style="width: 90%; padding: .25em;">
@ -89,6 +99,20 @@
<option value="">${DropShadow}</option>
</select>
</div>
<div class="sliderContainer-settings">
<div class="sliderContainer">
<input is="emby-slider" id="sliderVerticalPosition" label="${LabelSubtitleVerticalPosition}" type="range" min="-16" max="16" />
</div>
<div class="fieldDescription">${SubtitleVerticalPositionHelp}</div>
</div>
<div class="checkboxContainer">
<label>
<input is="emby-checkbox" type="checkbox" class="chkPreview" />
<span>${Preview}</span>
</label>
</div>
</div>
<button is="emby-button" type="submit" class="raised button-submit block btnSave hide">

65
src/components/subtitlesync/subtitlesync.js
View file

@ -1,14 +1,16 @@
define(['playbackManager', 'layoutManager', 'text!./subtitlesync.template.html', 'css!./subtitlesync'], function (playbackManager, layoutManager, template, css) {
'use strict';
import playbackManager from 'playbackManager';
import layoutManager from 'layoutManager';
import template from 'text!./subtitlesync.template.html';
import 'css!./subtitlesync';
var player;
var subtitleSyncSlider;
var subtitleSyncTextField;
var subtitleSyncCloseButton;
var subtitleSyncContainer;
let player;
let subtitleSyncSlider;
let subtitleSyncTextField;
let subtitleSyncCloseButton;
let subtitleSyncContainer;
function init(instance) {
var parent = document.createElement('div');
function init(instance) {
const parent = document.createElement('div');
document.body.appendChild(parent);
parent.innerHTML = template;
@ -27,7 +29,7 @@ define(['playbackManager', 'layoutManager', 'text!./subtitlesync.template.html',
subtitleSyncContainer.classList.add('hide');
subtitleSyncTextField.updateOffset = function(offset) {
subtitleSyncTextField.updateOffset = function (offset) {
this.textContent = offset + 's';
};
@ -36,10 +38,10 @@ define(['playbackManager', 'layoutManager', 'text!./subtitlesync.template.html',
this.hasFocus = true;
});
subtitleSyncTextField.addEventListener('keydown', function(event) {
subtitleSyncTextField.addEventListener('keydown', function (event) {
if (event.key === 'Enter') {
// if input key is enter search for float pattern
var inputOffset = /[-+]?\d+\.?\d*/g.exec(this.textContent);
let inputOffset = /[-+]?\d+\.?\d*/g.exec(this.textContent);
if (inputOffset) {
inputOffset = inputOffset[0];
@ -69,14 +71,14 @@ define(['playbackManager', 'layoutManager', 'text!./subtitlesync.template.html',
event.stopPropagation();
});
subtitleSyncTextField.blur = function() {
subtitleSyncTextField.blur = function () {
// prevent textfield to blur while element has focus
if (!this.hasFocus && this.prototype) {
this.prototype.blur();
}
};
subtitleSyncSlider.updateOffset = function(percent) {
subtitleSyncSlider.updateOffset = function (percent) {
// default value is 0s = 50%
this.value = percent === undefined ? 50 : percent;
};
@ -90,56 +92,57 @@ define(['playbackManager', 'layoutManager', 'text!./subtitlesync.template.html',
});
subtitleSyncSlider.getBubbleHtml = function (value) {
var newOffset = getOffsetFromPercentage(value);
const newOffset = getOffsetFromPercentage(value);
return '<h1 class="sliderBubbleText">' +
(newOffset > 0 ? '+' : '') + parseFloat(newOffset) + 's' +
'</h1>';
};
subtitleSyncCloseButton.addEventListener('click', function() {
subtitleSyncCloseButton.addEventListener('click', function () {
playbackManager.disableShowingSubtitleOffset(player);
SubtitleSync.prototype.toggle('forceToHide');
});
instance.element = parent;
}
}
function getOffsetFromPercentage(value) {
function getOffsetFromPercentage(value) {
// convert percent to fraction
var offset = (value - 50) / 50;
let offset = (value - 50) / 50;
// multiply by offset min/max range value (-x to +x) :
offset *= 30;
return offset.toFixed(1);
}
}
function getPercentageFromOffset(value) {
function getPercentageFromOffset(value) {
// divide by offset min/max range value (-x to +x) :
var percentValue = value / 30;
let percentValue = value / 30;
// convert fraction to percent
percentValue *= 50;
percentValue += 50;
return Math.min(100, Math.max(0, percentValue.toFixed()));
}
}
function SubtitleSync(currentPlayer) {
class SubtitleSync {
constructor(currentPlayer) {
player = currentPlayer;
init(this);
}
SubtitleSync.prototype.destroy = function() {
destroy() {
SubtitleSync.prototype.toggle('forceToHide');
if (player) {
playbackManager.disableShowingSubtitleOffset(player);
playbackManager.setSubtitleOffset(0, player);
}
var elem = this.element;
const elem = this.element;
if (elem) {
elem.parentNode.removeChild(elem);
this.element = null;
}
};
}
SubtitleSync.prototype.toggle = function(action) {
toggle(action) {
if (player && playbackManager.supportSubtitleOffset(player)) {
/* eslint-disable no-fallthrough */
switch (action) {
@ -168,7 +171,7 @@ define(['playbackManager', 'layoutManager', 'text!./subtitlesync.template.html',
}
/* eslint-enable no-fallthrough */
}
};
}
}
return SubtitleSync;
});
export default SubtitleSync;

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

@ -1,7 +1,9 @@
define(['backdrop', 'mainTabsManager', 'layoutManager', 'emby-tabs'], function (backdrop, mainTabsManager, layoutManager) {
'use strict';
import backdrop from 'backdrop';
import * as mainTabsManager from 'mainTabsManager';
import layoutManager from 'layoutManager';
import 'emby-tabs';
function onViewDestroy(e) {
function onViewDestroy(e) {
var tabControllers = this.tabControllers;
if (tabControllers) {
@ -18,13 +20,14 @@ define(['backdrop', 'mainTabsManager', 'layoutManager', 'emby-tabs'], function (
this.params = null;
this.currentTabController = null;
this.initialTabIndex = null;
}
}
function onBeforeTabChange() {
function onBeforeTabChange() {
}
}
function TabbedView(view, params) {
class TabbedView {
constructor(view, params) {
this.tabControllers = [];
this.view = view;
this.params = params;
@ -85,7 +88,7 @@ define(['backdrop', 'mainTabsManager', 'layoutManager', 'emby-tabs'], function (
view.addEventListener('viewdestroy', onViewDestroy.bind(this));
}
TabbedView.prototype.onResume = function (options) {
onResume(options) {
this.setTitle();
backdrop.clearBackdrop();
@ -96,19 +99,18 @@ define(['backdrop', 'mainTabsManager', 'layoutManager', 'emby-tabs'], function (
} else if (currentTabController && currentTabController.onResume) {
currentTabController.onResume({});
}
};
}
TabbedView.prototype.onPause = function () {
onPause() {
var currentTabController = this.currentTabController;
if (currentTabController && currentTabController.onPause) {
currentTabController.onPause();
}
};
TabbedView.prototype.setTitle = function () {
}
setTitle() {
Emby.Page.setTitle('');
};
}
}
return TabbedView;
});
export default TabbedView;

2
src/components/themeMediaPlayer.js
View file

@ -1,6 +1,8 @@
define(['playbackManager', 'userSettings', 'connectionManager'], function (playbackManager, userSettings, connectionManager) {
'use strict';
playbackManager = playbackManager.default || playbackManager;
var currentOwnerId;
var currentThemeIds = [];

18
src/components/toast/toast.js
View file

@ -1,27 +1,26 @@
define(['css!./toast'], function () {
'use strict';
import 'css!./toast';
function remove(elem) {
function remove(elem) {
setTimeout(function () {
elem.parentNode.removeChild(elem);
}, 300);
}
}
function animateRemove(elem) {
function animateRemove(elem) {
setTimeout(function () {
elem.classList.remove('toastVisible');
remove(elem);
}, 3300);
}
}
return function (options) {
export default function (options) {
if (typeof options === 'string') {
options = {
text: options
};
}
var elem = document.createElement('div');
const elem = document.createElement('div');
elem.classList.add('toast');
elem.innerHTML = options.text;
@ -32,5 +31,4 @@ define(['css!./toast'], function () {
animateRemove(elem);
}, 300);
};
});
}

6
src/components/tunerPicker.js
View file

@ -1,6 +1,12 @@
define(['dialogHelper', 'dom', 'layoutManager', 'connectionManager', 'globalize', 'loading', 'browser', 'focusManager', 'scrollHelper', 'material-icons', 'formDialogStyle', 'emby-button', 'emby-itemscontainer', 'cardStyle'], function (dialogHelper, dom, layoutManager, connectionManager, globalize, loading, browser, focusManager, scrollHelper) {
'use strict';
browser = browser.default || browser;
loading = loading.default || loading;
layoutManager = layoutManager.default || layoutManager;
focusManager = focusManager.default || focusManager;
scrollHelper = scrollHelper.default || scrollHelper;
var enableFocusTransform = !browser.slow && !browser.edge;
function getEditorHtml() {

73
src/components/tvproviders/schedulesdirect.js
View file

@ -1,11 +1,19 @@
define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'listViewStyle', 'emby-input', 'emby-select', 'emby-button', 'flexStyles'], function ($, loading, globalize) {
'use strict';
import $ from 'jQuery';
import loading from 'loading';
import globalize from 'globalize';
import 'emby-checkbox';
import 'emby-input';
import 'listViewStyle';
import 'paper-icon-button-light';
import 'emby-select';
import 'emby-button';
import 'flexStyles';
return function (page, providerId, options) {
export default function (page, providerId, options) {
function reload() {
loading.show();
ApiClient.getNamedConfiguration('livetv').then(function (config) {
var info = config.ListingProviders.filter(function (i) {
const info = config.ListingProviders.filter(function (i) {
return i.Id === providerId;
})[0] || {};
listingsId = info.ListingsId;
@ -35,12 +43,12 @@ define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'listViewStyle', 'emb
function setCountry(info) {
ApiClient.getJSON(ApiClient.getUrl('LiveTv/ListingProviders/SchedulesDirect/Countries')).then(function (result) {
var i;
var length;
var countryList = [];
let i;
let length;
const countryList = [];
for (var region in result) {
var countries = result[region];
for (const region in result) {
const countries = result[region];
if (countries.length && region !== 'ZZZ') {
for (i = 0, length = countries.length; i < length; i++) {
@ -80,20 +88,20 @@ define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'listViewStyle', 'emb
return Promise.resolve('');
}
var buffer = new TextEncoder('utf-8').encode(str);
const buffer = new TextEncoder('utf-8').encode(str);
return crypto.subtle.digest('SHA-256', buffer).then(function (hash) {
return hex(hash);
});
}
function hex(buffer) {
var hexCodes = [];
var view = new DataView(buffer);
const hexCodes = [];
const view = new DataView(buffer);
for (var i = 0; i < view.byteLength; i += 4) {
var value = view.getUint32(i);
var stringValue = value.toString(16);
var paddedValue = ('00000000' + stringValue).slice(-'00000000'.length);
for (let i = 0; i < view.byteLength; i += 4) {
const value = view.getUint32(i);
const stringValue = value.toString(16);
const paddedValue = ('00000000' + stringValue).slice(-'00000000'.length);
hexCodes.push(paddedValue);
}
@ -103,14 +111,14 @@ define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'listViewStyle', 'emb
function submitLoginForm() {
loading.show();
sha256(page.querySelector('.txtPass').value).then(function (passwordHash) {
var info = {
const info = {
Type: 'SchedulesDirect',
Username: page.querySelector('.txtUser').value,
EnableAllTuners: true,
Password: passwordHash,
Pw: page.querySelector('.txtPass').value
};
var id = providerId;
const id = providerId;
if (id) {
info.Id = id;
@ -137,7 +145,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'listViewStyle', 'emb
}
function submitListingsForm() {
var selectedListingsId = $('#selectListing', page).val();
const selectedListingsId = $('#selectListing', page).val();
if (!selectedListingsId) {
return void Dashboard.alert({
@ -146,9 +154,9 @@ define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'listViewStyle', 'emb
}
loading.show();
var id = providerId;
const id = providerId;
ApiClient.getNamedConfiguration('livetv').then(function (config) {
var info = config.ListingProviders.filter(function (i) {
const info = config.ListingProviders.filter(function (i) {
return i.Id === id;
})[0];
info.ZipCode = page.querySelector('.txtZipCode').value;
@ -231,14 +239,14 @@ define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'listViewStyle', 'emb
}
function refreshTunerDevices(page, providerInfo, devices) {
var html = '';
let html = '';
for (var i = 0, length = devices.length; i < length; i++) {
var device = devices[i];
for (let i = 0, length = devices.length; i < length; i++) {
const device = devices[i];
html += '<div class="listItem">';
var enabledTuners = providerInfo.EnabledTuners || [];
var isChecked = providerInfo.EnableAllTuners || enabledTuners.indexOf(device.Id) !== -1;
var checkedAttribute = isChecked ? ' checked' : '';
const enabledTuners = providerInfo.EnabledTuners || [];
const isChecked = providerInfo.EnableAllTuners || enabledTuners.indexOf(device.Id) !== -1;
const checkedAttribute = isChecked ? ' checked' : '';
html += '<label class="checkboxContainer listItemCheckboxContainer"><input type="checkbox" is="emby-checkbox" data-id="' + device.Id + '" class="chkTuner" ' + checkedAttribute + '/><span></span></label>';
html += '<div class="listItemBody two-line">';
html += '<div class="listItemBodyText">';
@ -254,8 +262,8 @@ define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'listViewStyle', 'emb
page.querySelector('.tunerList').innerHTML = html;
}
var listingsId;
var self = this;
let listingsId;
const self = this;
self.submit = function () {
page.querySelector('.btnSubmitListingsContainer').click();
@ -266,10 +274,10 @@ define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'listViewStyle', 'emb
// Only hide the buttons if explicitly set to false; default to showing if undefined or null
// FIXME: rename this option to clarify logic
var hideCancelButton = options.showCancelButton === false;
const hideCancelButton = options.showCancelButton === false;
page.querySelector('.btnCancel').classList.toggle('hide', hideCancelButton);
var hideSubmitButton = options.showSubmitButton === false;
const hideSubmitButton = options.showSubmitButton === false;
page.querySelector('.btnSubmitListings').classList.toggle('hide', hideSubmitButton);
$('.formLogin', page).on('submit', function () {
@ -293,5 +301,4 @@ define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'listViewStyle', 'emb
$('.createAccountHelp', page).html(globalize.translate('MessageCreateAccountAt', '<a is="emby-linkbutton" class="button-link" href="http://www.schedulesdirect.org" target="_blank">http://www.schedulesdirect.org</a>'));
reload();
};
};
});
}

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

@ -1,10 +1,15 @@
define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'emby-input', 'listViewStyle', 'paper-icon-button-light'], function ($, loading, globalize) {
'use strict';
import $ from 'jQuery';
import loading from 'loading';
import globalize from 'globalize';
import 'emby-checkbox';
import 'emby-input';
import 'listViewStyle';
import 'paper-icon-button-light';
return function (page, providerId, options) {
export default function (page, providerId, options) {
function getListingProvider(config, id) {
if (config && id) {
var result = config.ListingProviders.filter(function (provider) {
const result = config.ListingProviders.filter(function (provider) {
return provider.Id === id;
})[0];
@ -44,7 +49,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'emby-input', 'listVi
}
function getCategories(txtInput) {
var value = txtInput.value;
const value = txtInput.value;
if (value) {
return value.split('|');
@ -55,9 +60,9 @@ define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'emby-input', 'listVi
function submitListingsForm() {
loading.show();
var id = providerId;
const id = providerId;
ApiClient.getNamedConfiguration('livetv').then(function (config) {
var info = config.ListingProviders.filter(function (provider) {
const info = config.ListingProviders.filter(function (provider) {
return provider.Id === id;
})[0] || {};
info.Type = 'xmltv';
@ -112,14 +117,14 @@ define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'emby-input', 'listVi
}
function refreshTunerDevices(page, providerInfo, devices) {
var html = '';
let html = '';
for (var i = 0, length = devices.length; i < length; i++) {
var device = devices[i];
for (let i = 0, length = devices.length; i < length; i++) {
const device = devices[i];
html += '<div class="listItem">';
var enabledTuners = providerInfo.EnabledTuners || [];
var isChecked = providerInfo.EnableAllTuners || enabledTuners.indexOf(device.Id) !== -1;
var checkedAttribute = isChecked ? ' checked' : '';
const enabledTuners = providerInfo.EnabledTuners || [];
const isChecked = providerInfo.EnableAllTuners || enabledTuners.indexOf(device.Id) !== -1;
const checkedAttribute = isChecked ? ' checked' : '';
html += '<label class="listItemCheckboxContainer"><input type="checkbox" is="emby-checkbox" class="chkTuner" data-id="' + device.Id + '" ' + checkedAttribute + '><span></span></label>';
html += '<div class="listItemBody two-line">';
html += '<div class="listItemBodyText">';
@ -136,15 +141,15 @@ define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'emby-input', 'listVi
}
function onSelectPathClick(e) {
var page = $(e.target).parents('.xmltvForm')[0];
const page = $(e.target).parents('.xmltvForm')[0];
require(['directorybrowser'], function (directoryBrowser) {
var picker = new directoryBrowser.default();
import('directorybrowser').then(({default: directoryBrowser}) => {
const picker = new directoryBrowser();
picker.show({
includeFiles: true,
callback: function (path) {
if (path) {
var txtPath = page.querySelector('.txtPath');
const txtPath = page.querySelector('.txtPath');
txtPath.value = path;
txtPath.focus();
}
@ -154,7 +159,7 @@ define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'emby-input', 'listVi
});
}
var self = this;
const self = this;
self.submit = function () {
page.querySelector('.btnSubmitListings').click();
@ -165,10 +170,10 @@ define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'emby-input', 'listVi
// Only hide the buttons if explicitly set to false; default to showing if undefined or null
// FIXME: rename this option to clarify logic
var hideCancelButton = options.showCancelButton === false;
const hideCancelButton = options.showCancelButton === false;
page.querySelector('.btnCancel').classList.toggle('hide', hideCancelButton);
var hideSubmitButton = options.showSubmitButton === false;
const hideSubmitButton = options.showSubmitButton === false;
page.querySelector('.btnSubmitListings').classList.toggle('hide', hideSubmitButton);
$('form', page).on('submit', function () {
@ -185,5 +190,4 @@ define(['jQuery', 'loading', 'globalize', 'emby-checkbox', 'emby-input', 'listVi
});
reload();
};
};
});
}

88
src/components/upnextdialog/upnextdialog.js
View file

@ -1,7 +1,19 @@
define(['dom', 'playbackManager', 'connectionManager', 'events', 'mediaInfo', 'layoutManager', 'focusManager', 'globalize', 'itemHelper', 'css!./upnextdialog', 'emby-button', 'flexStyles'], function (dom, playbackManager, connectionManager, events, mediaInfo, layoutManager, focusManager, globalize, itemHelper) {
'use strict';
import dom from 'dom';
import playbackManager from 'playbackManager';
import connectionManager from 'connectionManager';
import events from 'events';
import mediaInfo from 'mediaInfo';
import layoutManager from 'layoutManager';
import focusManager from 'focusManager';
import globalize from 'globalize';
import itemHelper from 'itemHelper';
import 'css!./upnextdialog';
import 'emby-button';
import 'flexStyles';
var transitionEndEventName = dom.whichTransitionEvent();
/* eslint-disable indent */
const transitionEndEventName = dom.whichTransitionEvent();
function seriesImageUrl(item, options) {
if (item.Type !== 'Episode') {
@ -56,7 +68,7 @@ define(['dom', 'playbackManager', 'connectionManager', 'events', 'mediaInfo', 'l
function setPoster(osdPoster, item, secondaryItem) {
if (item) {
var imgUrl = seriesImageUrl(item, { type: 'Primary' }) ||
let imgUrl = seriesImageUrl(item, { type: 'Primary' }) ||
seriesImageUrl(item, { type: 'Thumb' }) ||
imageUrl(item, { type: 'Primary' });
@ -76,7 +88,7 @@ define(['dom', 'playbackManager', 'connectionManager', 'events', 'mediaInfo', 'l
}
function getHtml() {
var html = '';
let html = '';
html += '<div class="upNextDialog-poster">';
html += '</div>';
@ -112,17 +124,17 @@ define(['dom', 'playbackManager', 'connectionManager', 'events', 'mediaInfo', 'l
}
function setNextVideoText() {
var instance = this;
const instance = this;
var elem = instance.options.parent;
const elem = instance.options.parent;
var secondsRemaining = Math.max(Math.round(getTimeRemainingMs(instance) / 1000), 0);
const secondsRemaining = Math.max(Math.round(getTimeRemainingMs(instance) / 1000), 0);
console.debug('up next seconds remaining: ' + secondsRemaining);
var timeText = '<span class="upNextDialog-countdownText">' + globalize.translate('HeaderSecondsValue', secondsRemaining) + '</span>';
const timeText = '<span class="upNextDialog-countdownText">' + globalize.translate('HeaderSecondsValue', secondsRemaining) + '</span>';
var nextVideoText = instance.itemType === 'Episode' ?
const nextVideoText = instance.itemType === 'Episode' ?
globalize.translate('HeaderNextEpisodePlayingInValue', timeText) :
globalize.translate('HeaderNextVideoPlayingInValue', timeText);
@ -130,9 +142,9 @@ define(['dom', 'playbackManager', 'connectionManager', 'events', 'mediaInfo', 'l
}
function fillItem(item) {
var instance = this;
const instance = this;
var elem = instance.options.parent;
const elem = instance.options.parent;
setPoster(elem.querySelector('.upNextDialog-poster'), item);
@ -141,7 +153,7 @@ define(['dom', 'playbackManager', 'connectionManager', 'events', 'mediaInfo', 'l
elem.querySelector('.upNextDialog-mediainfo').innerHTML = mediaInfo.getPrimaryMediaInfoHtml(item, {
});
var title = itemHelper.getDisplayName(item);
let title = itemHelper.getDisplayName(item);
if (item.SeriesName) {
title = item.SeriesName + ' - ' + title;
}
@ -161,10 +173,10 @@ define(['dom', 'playbackManager', 'connectionManager', 'events', 'mediaInfo', 'l
}
function onStartNowClick() {
var options = this.options;
const options = this.options;
if (options) {
var player = options.player;
const player = options.player;
this.hide();
@ -186,7 +198,7 @@ define(['dom', 'playbackManager', 'connectionManager', 'events', 'mediaInfo', 'l
}
function clearHideAnimationEventListeners(instance, elem) {
var fn = instance._onHideAnimationComplete;
const fn = instance._onHideAnimationComplete;
if (fn) {
dom.removeEventListener(elem, transitionEndEventName, fn, {
@ -196,8 +208,8 @@ define(['dom', 'playbackManager', 'connectionManager', 'events', 'mediaInfo', 'l
}
function onHideAnimationComplete(e) {
var instance = this;
var elem = e.target;
const instance = this;
const elem = e.target;
elem.classList.add('hide');
@ -206,14 +218,14 @@ define(['dom', 'playbackManager', 'connectionManager', 'events', 'mediaInfo', 'l
}
function hideComingUpNext() {
var instance = this;
const instance = this;
clearCountdownTextTimeout(this);
if (!instance.options) {
return;
}
var elem = instance.options.parent;
const elem = instance.options.parent;
if (!elem) {
return;
@ -230,7 +242,7 @@ define(['dom', 'playbackManager', 'connectionManager', 'events', 'mediaInfo', 'l
elem.classList.add('upNextDialog-hidden');
var fn = onHideAnimationComplete.bind(instance);
const fn = onHideAnimationComplete.bind(instance);
instance._onHideAnimationComplete = fn;
dom.addEventListener(elem, transitionEndEventName, fn, {
@ -239,12 +251,12 @@ define(['dom', 'playbackManager', 'connectionManager', 'events', 'mediaInfo', 'l
}
function getTimeRemainingMs(instance) {
var options = instance.options;
const options = instance.options;
if (options) {
var runtimeTicks = playbackManager.duration(options.player);
const runtimeTicks = playbackManager.duration(options.player);
if (runtimeTicks) {
var timeRemainingTicks = runtimeTicks - playbackManager.currentTime(options.player);
const timeRemainingTicks = runtimeTicks - playbackManager.currentTime(options.player);
return Math.round(timeRemainingTicks / 10000);
}
@ -254,7 +266,7 @@ define(['dom', 'playbackManager', 'connectionManager', 'events', 'mediaInfo', 'l
}
function startComingUpNextHideTimer(instance) {
var timeRemainingMs = getTimeRemainingMs(instance);
const timeRemainingMs = getTimeRemainingMs(instance);
if (timeRemainingMs <= 0) {
return;
@ -266,14 +278,14 @@ define(['dom', 'playbackManager', 'connectionManager', 'events', 'mediaInfo', 'l
instance._countdownTextTimeout = setInterval(setNextVideoText.bind(instance), 400);
}
function UpNextDialog(options) {
class UpNextDialog {
constructor(options) {
this.options = options;
init(this, options);
}
UpNextDialog.prototype.show = function () {
var elem = this.options.parent;
show() {
const elem = this.options.parent;
clearHideAnimationEventListeners(this, elem);
@ -291,18 +303,18 @@ define(['dom', 'playbackManager', 'connectionManager', 'events', 'mediaInfo', 'l
}
startComingUpNextHideTimer(this);
};
UpNextDialog.prototype.hide = function () {
}
hide() {
hideComingUpNext.call(this);
};
UpNextDialog.prototype.destroy = function () {
}
destroy() {
hideComingUpNext.call(this);
this.options = null;
this.itemType = null;
};
}
}
return UpNextDialog;
});
export default UpNextDialog;
/* eslint-enable indent */

102
src/components/viewContainer.js
View file

@ -1,12 +1,12 @@
define(['browser', 'dom', 'layoutManager', 'css!components/viewManager/viewContainer'], function (browser, dom, layoutManager) {
'use strict';
import 'css!components/viewManager/viewContainer';
/* eslint-disable indent */
function setControllerClass(view, options) {
if (options.controllerFactory) {
return Promise.resolve();
}
var controllerUrl = view.getAttribute('data-controller');
let controllerUrl = view.getAttribute('data-controller');
if (controllerUrl) {
if (controllerUrl.indexOf('__plugin/') === 0) {
@ -14,7 +14,7 @@ define(['browser', 'dom', 'layoutManager', 'css!components/viewManager/viewConta
}
controllerUrl = Dashboard.getConfigurationResourceUrl(controllerUrl);
return getRequirePromise([controllerUrl]).then(function (ControllerFactory) {
return import(controllerUrl).then((ControllerFactory) => {
options.controllerFactory = ControllerFactory;
});
}
@ -22,36 +22,28 @@ define(['browser', 'dom', 'layoutManager', 'css!components/viewManager/viewConta
return Promise.resolve();
}
function getRequirePromise(deps) {
return new Promise(function (resolve, reject) {
require(deps, resolve);
});
}
function loadView(options) {
export function loadView(options) {
if (!options.cancel) {
var selected = selectedPageIndex;
var previousAnimatable = selected === -1 ? null : allPages[selected];
var pageIndex = selected + 1;
const selected = selectedPageIndex;
const previousAnimatable = selected === -1 ? null : allPages[selected];
let pageIndex = selected + 1;
if (pageIndex >= pageContainerCount) {
pageIndex = 0;
}
var isPluginpage = options.url.toLowerCase().indexOf('/configurationpage') !== -1;
var newViewInfo = normalizeNewView(options, isPluginpage);
var newView = newViewInfo.elem;
var modulesToLoad = [];
const isPluginpage = options.url.toLowerCase().indexOf('/configurationpage') !== -1;
const newViewInfo = normalizeNewView(options, isPluginpage);
const newView = newViewInfo.elem;
return new Promise(function (resolve) {
require(modulesToLoad, function () {
var currentPage = allPages[pageIndex];
return new Promise((resolve) => {
const currentPage = allPages[pageIndex];
if (currentPage) {
triggerDestroy(currentPage);
}
var view = newView;
let view = newView;
if (typeof view == 'string') {
view = document.createElement('div');
@ -62,8 +54,8 @@ define(['browser', 'dom', 'layoutManager', 'css!components/viewManager/viewConta
if (currentPage) {
if (newViewInfo.hasScript && window.$) {
view = $(view).appendTo(mainAnimatedPages)[0];
mainAnimatedPages.removeChild(currentPage);
view = $(view).appendTo(mainAnimatedPages)[0];
} else {
mainAnimatedPages.replaceChild(view, currentPage);
}
@ -79,7 +71,7 @@ define(['browser', 'dom', 'layoutManager', 'css!components/viewManager/viewConta
view.setAttribute('data-type', options.type);
}
var properties = [];
const properties = [];
if (options.fullscreen) {
properties.push('fullscreen');
@ -90,7 +82,7 @@ define(['browser', 'dom', 'layoutManager', 'css!components/viewManager/viewConta
}
allPages[pageIndex] = view;
setControllerClass(view, options).then(function () {
setControllerClass(view, options).then(() => {
if (onBeforeChange) {
onBeforeChange(view, false, options);
}
@ -111,7 +103,6 @@ define(['browser', 'dom', 'layoutManager', 'css!components/viewManager/viewConta
resolve(view);
});
});
});
}
}
@ -125,28 +116,28 @@ define(['browser', 'dom', 'layoutManager', 'css!components/viewManager/viewConta
html = replaceAll(html, '<\/script>--\x3e', '<\/script>');
}
var wrapper = document.createElement('div');
const wrapper = document.createElement('div');
wrapper.innerHTML = html;
return wrapper.querySelector('div[data-role="page"]');
}
function normalizeNewView(options, isPluginpage) {
var viewHtml = options.view;
const viewHtml = options.view;
if (viewHtml.indexOf('data-role="page"') === -1) {
return viewHtml;
}
var hasScript = viewHtml.indexOf('<script') !== -1;
var elem = parseHtml(viewHtml, hasScript);
let hasScript = viewHtml.indexOf('<script') !== -1;
const elem = parseHtml(viewHtml, hasScript);
if (hasScript) {
hasScript = elem.querySelector('script') != null;
}
var hasjQuery = false;
var hasjQuerySelect = false;
var hasjQueryChecked = false;
let hasjQuery = false;
let hasjQuerySelect = false;
let hasjQueryChecked = false;
if (isPluginpage) {
hasjQuery = viewHtml.indexOf('jQuery') != -1 || viewHtml.indexOf('$(') != -1 || viewHtml.indexOf('$.') != -1;
@ -164,7 +155,7 @@ define(['browser', 'dom', 'layoutManager', 'css!components/viewManager/viewConta
}
function beforeAnimate(allPages, newPageIndex, oldPageIndex) {
for (var index = 0, length = allPages.length; index < length; index++) {
for (let index = 0, length = allPages.length; index < length; index++) {
if (newPageIndex !== index && oldPageIndex !== index) {
allPages[index].classList.add('hide');
}
@ -172,33 +163,33 @@ define(['browser', 'dom', 'layoutManager', 'css!components/viewManager/viewConta
}
function afterAnimate(allPages, newPageIndex) {
for (var index = 0, length = allPages.length; index < length; index++) {
for (let index = 0, length = allPages.length; index < length; index++) {
if (newPageIndex !== index) {
allPages[index].classList.add('hide');
}
}
}
function setOnBeforeChange(fn) {
export function setOnBeforeChange(fn) {
onBeforeChange = fn;
}
function tryRestoreView(options) {
var url = options.url;
var index = currentUrls.indexOf(url);
export function tryRestoreView(options) {
const url = options.url;
const index = currentUrls.indexOf(url);
if (index !== -1) {
var animatable = allPages[index];
var view = animatable;
const animatable = allPages[index];
const view = animatable;
if (view) {
if (options.cancel) {
return;
}
var selected = selectedPageIndex;
var previousAnimatable = selected === -1 ? null : allPages[selected];
return setControllerClass(view, options).then(function () {
const selected = selectedPageIndex;
const previousAnimatable = selected === -1 ? null : allPages[selected];
return setControllerClass(view, options).then(() => {
if (onBeforeChange) {
onBeforeChange(view, true, options);
}
@ -228,25 +219,28 @@ define(['browser', 'dom', 'layoutManager', 'css!components/viewManager/viewConta
view.dispatchEvent(new CustomEvent('viewdestroy', {}));
}
function reset() {
export function reset() {
allPages = [];
currentUrls = [];
mainAnimatedPages.innerHTML = '';
selectedPageIndex = -1;
}
var onBeforeChange;
var mainAnimatedPages = document.querySelector('.mainAnimatedPages');
var allPages = [];
var currentUrls = [];
var pageContainerCount = 3;
var selectedPageIndex = -1;
let onBeforeChange;
const mainAnimatedPages = document.querySelector('.mainAnimatedPages');
let allPages = [];
let currentUrls = [];
const pageContainerCount = 3;
let selectedPageIndex = -1;
reset();
mainAnimatedPages.classList.remove('hide');
return {
/* eslint-enable indent */
export default {
loadView: loadView,
tryRestoreView: tryRestoreView,
reset: reset,
setOnBeforeChange: setOnBeforeChange
};
});
};

82
src/components/viewManager/viewManager.js
View file

@ -1,20 +1,22 @@
define(['viewContainer', 'focusManager', 'queryString', 'layoutManager'], function (viewContainer, focusManager, queryString, layoutManager) {
'use strict';
import viewContainer from 'viewContainer';
import focusManager from 'focusManager';
import queryString from 'queryString';
import layoutManager from 'layoutManager';
var currentView;
var dispatchPageEvents;
let currentView;
let dispatchPageEvents;
viewContainer.setOnBeforeChange(function (newView, isRestored, options) {
var lastView = currentView;
viewContainer.setOnBeforeChange(function (newView, isRestored, options) {
const lastView = currentView;
if (lastView) {
var beforeHideResult = dispatchViewEvent(lastView, null, 'viewbeforehide', true);
const beforeHideResult = dispatchViewEvent(lastView, null, 'viewbeforehide', true);
if (!beforeHideResult) {
// todo: cancel
}
}
var eventDetail = getViewEventDetail(newView, options, isRestored);
const eventDetail = getViewEventDetail(newView, options, isRestored);
if (!newView.initComplete) {
newView.initComplete = true;
@ -31,17 +33,17 @@ define(['viewContainer', 'focusManager', 'queryString', 'layoutManager'], functi
}
dispatchViewEvent(newView, eventDetail, 'viewbeforeshow');
});
});
function onViewChange(view, options, isRestore) {
var lastView = currentView;
function onViewChange(view, options, isRestore) {
const lastView = currentView;
if (lastView) {
dispatchViewEvent(lastView, null, 'viewhide');
}
currentView = view;
var eventDetail = getViewEventDetail(view, options, isRestore);
const eventDetail = getViewEventDetail(view, options, isRestore);
if (!isRestore) {
if (options.autoFocus !== false) {
@ -60,19 +62,19 @@ define(['viewContainer', 'focusManager', 'queryString', 'layoutManager'], functi
if (dispatchPageEvents) {
view.dispatchEvent(new CustomEvent('pageshow', eventDetail));
}
}
}
function getProperties(view) {
var props = view.getAttribute('data-properties');
function getProperties(view) {
const props = view.getAttribute('data-properties');
if (props) {
return props.split(',');
}
return [];
}
}
function dispatchViewEvent(view, eventInfo, eventName, isCancellable) {
function dispatchViewEvent(view, eventInfo, eventName, isCancellable) {
if (!eventInfo) {
eventInfo = {
detail: {
@ -86,7 +88,7 @@ define(['viewContainer', 'focusManager', 'queryString', 'layoutManager'], functi
eventInfo.cancelable = isCancellable || false;
var eventResult = view.dispatchEvent(new CustomEvent(eventName, eventInfo));
const eventResult = view.dispatchEvent(new CustomEvent(eventName, eventInfo));
if (dispatchPageEvents) {
eventInfo.cancelable = false;
@ -94,12 +96,12 @@ define(['viewContainer', 'focusManager', 'queryString', 'layoutManager'], functi
}
return eventResult;
}
}
function getViewEventDetail(view, options, isRestore) {
var url = options.url;
var index = url.indexOf('?');
var params = index === -1 ? {} : queryString.parse(url.substring(index + 1));
function getViewEventDetail(view, options, isRestore) {
const url = options.url;
const index = url.indexOf('?');
const params = index === -1 ? {} : queryString.parse(url.substring(index + 1));
return {
detail: {
@ -115,20 +117,18 @@ define(['viewContainer', 'focusManager', 'queryString', 'layoutManager'], functi
bubbles: true,
cancelable: false
};
}
}
function resetCachedViews() {
function resetCachedViews() {
// Reset all cached views whenever the skin changes
viewContainer.reset();
}
}
document.addEventListener('skinunload', resetCachedViews);
document.addEventListener('skinunload', resetCachedViews);
function ViewManager() {
}
ViewManager.prototype.loadView = function (options) {
var lastView = currentView;
class ViewManager {
loadView(options) {
const lastView = currentView;
// Record the element that has focus
if (lastView) {
@ -142,9 +142,9 @@ define(['viewContainer', 'focusManager', 'queryString', 'layoutManager'], functi
viewContainer.loadView(options).then(function (view) {
onViewChange(view, options);
});
};
}
ViewManager.prototype.tryRestoreView = function (options, onViewChanging) {
tryRestoreView(options, onViewChanging) {
if (options.cancel) {
return Promise.reject({ cancelled: true });
}
@ -158,15 +158,15 @@ define(['viewContainer', 'focusManager', 'queryString', 'layoutManager'], functi
onViewChanging();
onViewChange(view, options, true);
});
};
}
ViewManager.prototype.currentView = function () {
currentView() {
return currentView;
};
}
ViewManager.prototype.dispatchPageEvents = function (value) {
dispatchPageEvents(value) {
dispatchPageEvents = value;
};
}
}
return new ViewManager();
});
export default new ViewManager();

3
src/components/viewSettings/viewSettings.js
View file

@ -1,6 +1,8 @@
define(['require', 'dialogHelper', 'loading', 'apphost', 'layoutManager', 'connectionManager', 'appRouter', 'globalize', 'userSettings', 'emby-checkbox', 'emby-input', 'paper-icon-button-light', 'emby-select', 'material-icons', 'css!./../formdialog', 'emby-button', 'flexStyles'], function (require, dialogHelper, loading, appHost, layoutManager, connectionManager, appRouter, globalize, userSettings) {
'use strict';
layoutManager = layoutManager.default || layoutManager;
function onSubmit(e) {
e.preventDefault();
return false;
@ -29,6 +31,7 @@ define(['require', 'dialogHelper', 'loading', 'apphost', 'layoutManager', 'conne
function centerFocus(elem, horiz, on) {
require(['scrollHelper'], function (scrollHelper) {
scrollHelper = scrollHelper.default || scrollHelper;
var fn = on ? 'on' : 'off';
scrollHelper.centerFocus[fn](elem, horiz);
});

37
src/config.template.json
View file

@ -1,3 +1,38 @@
{
"multiserver": false
"multiserver": false,
"themes": [
{
"name": "Apple TV",
"id": "appletv"
}, {
"name": "Blue Radiance",
"id": "blueradiance"
}, {
"name": "Dark",
"id": "dark",
"default": true
}, {
"name": "Light",
"id": "light"
}, {
"name": "Purple Haze",
"id": "purplehaze"
}, {
"name": "WMC",
"id": "wmc"
}
],
"plugins": [
"plugins/playAccessValidation/plugin",
"plugins/experimentalWarnings/plugin",
"plugins/htmlAudioPlayer/plugin",
"plugins/htmlVideoPlayer/plugin",
"plugins/photoPlayer/plugin",
"plugins/bookPlayer/plugin",
"plugins/youtubePlayer/plugin",
"plugins/backdropScreensaver/plugin",
"plugins/logoScreensaver/plugin",
"plugins/sessionPlayer/plugin",
"plugins/chromecastPlayer/plugin"
]
}

0
src/apikeys.html → src/controllers/dashboard/apikeys.html
View file

0
src/dashboard.html → src/controllers/dashboard/dashboard.html
View file

0
src/device.html → src/controllers/dashboard/devices/device.html
View file

0
src/devices.html → src/controllers/dashboard/devices/devices.html
View file

0
src/dlnaprofile.html → src/controllers/dashboard/dlna/profile.html
View file

0
src/dlnaprofiles.html → src/controllers/dashboard/dlna/profiles.html
View file

0
src/dlnasettings.html → src/controllers/dashboard/dlna/settings.html
View file

0
src/encodingsettings.html → src/controllers/dashboard/encodingsettings.html
View file

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

@ -83,7 +83,7 @@ import libraryMenu from 'libraryMenu';
updateEncoder(form);
}, function () {
import('alert').then(({default: alert}) => {
alert(globalize.translate('DefaultErrorMessage'));
alert(globalize.translate('ErrorDefault'));
});
Dashboard.processServerConfigurationUpdateResult();

0
src/dashboardgeneral.html → src/controllers/dashboard/general.html
View file

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

@ -52,7 +52,7 @@ import 'emby-button';
});
}, function () {
import('alert').then(({default: alert}) => {
alert(globalize.translate('DefaultErrorMessage'));
alert(globalize.translate('ErrorDefault'));
});
Dashboard.processServerConfigurationUpdateResult();

0
src/library.html → src/controllers/dashboard/library.html
View file

0
src/controllers/dashboard/mediaLibrary.js → src/controllers/dashboard/library.js
View file

0
src/librarydisplay.html → src/controllers/dashboard/librarydisplay.html
View file

0
src/log.html → src/controllers/dashboard/logs.html
View file

0
src/metadataimages.html → src/controllers/dashboard/metadataimages.html
View file

0
src/metadatanfo.html → src/controllers/dashboard/metadatanfo.html
View file

0
src/networking.html → src/controllers/dashboard/networking.html
View file

67
src/controllers/dashboard/notifications/notification/index.js
View file

@ -1,32 +1,32 @@
define(['jQuery', 'emby-checkbox'], function ($) {
'use strict';
import $ from 'jQuery';
import 'emby-checkbox';
function fillItems(elem, items, cssClass, idPrefix, currentList, isEnabledList) {
var html = '<div class="checkboxList paperList" style="padding: .5em 1em;">';
function fillItems(elem, items, cssClass, idPrefix, currentList, isEnabledList) {
let html = '<div class="checkboxList paperList" style="padding: .5em 1em;">';
html += items.map(function (u) {
var isChecked = isEnabledList ? currentList.indexOf(u.Id) != -1 : currentList.indexOf(u.Id) == -1;
var checkedHtml = isChecked ? ' checked="checked"' : '';
const isChecked = isEnabledList ? currentList.indexOf(u.Id) != -1 : currentList.indexOf(u.Id) == -1;
const checkedHtml = isChecked ? ' checked="checked"' : '';
return '<label><input is="emby-checkbox" class="' + cssClass + '" type="checkbox" data-itemid="' + u.Id + '"' + checkedHtml + '/><span>' + u.Name + '</span></label>';
}).join('');
html += '</div>';
elem.html(html).trigger('create');
}
}
function reload(page) {
var type = getParameterByName('type');
var promise1 = ApiClient.getUsers();
var promise2 = ApiClient.getNamedConfiguration(notificationsConfigurationKey);
var promise3 = ApiClient.getJSON(ApiClient.getUrl('Notifications/Types'));
var promise4 = ApiClient.getJSON(ApiClient.getUrl('Notifications/Services'));
function reload(page) {
const type = getParameterByName('type');
const promise1 = ApiClient.getUsers();
const promise2 = ApiClient.getNamedConfiguration(notificationsConfigurationKey);
const promise3 = ApiClient.getJSON(ApiClient.getUrl('Notifications/Types'));
const promise4 = ApiClient.getJSON(ApiClient.getUrl('Notifications/Services'));
Promise.all([promise1, promise2, promise3, promise4]).then(function (responses) {
var users = responses[0];
var notificationOptions = responses[1];
var types = responses[2];
var services = responses[3];
var notificationConfig = notificationOptions.Options.filter(function (n) {
const users = responses[0];
const notificationOptions = responses[1];
const types = responses[2];
const services = responses[3];
let notificationConfig = notificationOptions.Options.filter(function (n) {
return n.Type == type;
})[0];
var typeInfo = types.filter(function (n) {
const typeInfo = types.filter(function (n) {
return n.Type == type;
})[0] || {};
@ -53,16 +53,16 @@ define(['jQuery', 'emby-checkbox'], function ($) {
$('#chkEnabled', page).prop('checked', notificationConfig.Enabled || false);
$('#selectUsers', page).val(notificationConfig.SendToUserMode).trigger('change');
});
}
}
function save(page) {
var type = getParameterByName('type');
var promise1 = ApiClient.getNamedConfiguration(notificationsConfigurationKey);
function save(page) {
const type = getParameterByName('type');
const promise1 = ApiClient.getNamedConfiguration(notificationsConfigurationKey);
// TODO: Check if this promise is really needed, as it's unused.
var promise2 = ApiClient.getJSON(ApiClient.getUrl('Notifications/Types'));
const promise2 = ApiClient.getJSON(ApiClient.getUrl('Notifications/Types'));
Promise.all([promise1, promise2]).then(function (responses) {
var notificationOptions = responses[0];
var notificationConfig = notificationOptions.Options.filter(function (n) {
const notificationOptions = responses[0];
let notificationConfig = notificationOptions.Options.filter(function (n) {
return n.Type == type;
})[0];
@ -95,16 +95,16 @@ define(['jQuery', 'emby-checkbox'], function ($) {
Dashboard.navigate('notificationsettings.html');
});
});
}
}
function onSubmit() {
function onSubmit() {
save($(this).parents('.page'));
return false;
}
}
var notificationsConfigurationKey = 'notifications';
$(document).on('pageinit', '#notificationSettingPage', function () {
var page = this;
const notificationsConfigurationKey = 'notifications';
$(document).on('pageinit', '#notificationSettingPage', function () {
const page = this;
$('#selectUsers', page).on('change', function () {
if (this.value == 'Custom') {
$('.selectCustomUsers', page).show();
@ -113,7 +113,6 @@ define(['jQuery', 'emby-checkbox'], function ($) {
}
});
$('.notificationSettingForm').off('submit', onSubmit).on('submit', onSubmit);
}).on('pageshow', '#notificationSettingPage', function () {
}).on('pageshow', '#notificationSettingPage', function () {
reload(this);
});
});

29
src/controllers/dashboard/notifications/notifications/index.js
View file

@ -1,14 +1,16 @@
define(['loading', 'libraryMenu', 'globalize', 'listViewStyle', 'emby-button'], function(loading, libraryMenu, globalize) {
'use strict';
import loading from 'loading';
import globalize from 'globalize';
import 'listViewStyle';
import 'emby-button';
function reload(page) {
function reload(page) {
loading.show();
ApiClient.getJSON(ApiClient.getUrl('Notifications/Types')).then(function(list) {
var html = '';
var lastCategory = '';
var showHelp = true;
html += list.map(function(notification) {
var itemHtml = '';
ApiClient.getJSON(ApiClient.getUrl('Notifications/Types')).then(function (list) {
let html = '';
let lastCategory = '';
let showHelp = true;
html += list.map(function (notification) {
let itemHtml = '';
if (notification.Category !== lastCategory) {
lastCategory = notification.Category;
if (lastCategory) {
@ -50,11 +52,10 @@ define(['loading', 'libraryMenu', 'globalize', 'listViewStyle', 'emby-button'],
page.querySelector('.notificationList').innerHTML = html;
loading.hide();
});
}
}
return function(view, params) {
view.addEventListener('viewshow', function() {
export default function (view, params) {
view.addEventListener('viewshow', function () {
reload(view);
});
};
});
}

0
src/playbackconfiguration.html → src/controllers/dashboard/playback.html
View file

95
src/controllers/dashboard/plugins/add/index.js
View file

@ -1,41 +1,43 @@
define(['jQuery', 'loading', 'libraryMenu', 'globalize', 'connectionManager', 'emby-button'], function ($, loading, libraryMenu, globalize, connectionManager) {
'use strict';
import $ from 'jQuery';
import loading from 'loading';
import globalize from 'globalize';
import 'emby-button';
function populateHistory(packageInfo, page) {
var html = '';
var length = Math.min(packageInfo.versions.length, 10);
function populateHistory(packageInfo, page) {
let html = '';
const length = Math.min(packageInfo.versions.length, 10);
for (var i = 0; i < length; i++) {
var version = packageInfo.versions[i];
for (let i = 0; i < length; i++) {
let version = packageInfo.versions[i];
html += '<h2 style="margin:.5em 0;">' + version.version + '</h2>';
html += '<div style="margin-bottom:1.5em;">' + version.changelog + '</div>';
}
$('#revisionHistory', page).html(html);
}
}
function populateVersions(packageInfo, page, installedPlugin) {
var html = '';
function populateVersions(packageInfo, page, installedPlugin) {
let html = '';
for (var i = 0; i < packageInfo.versions.length; i++) {
var version = packageInfo.versions[i];
for (let i = 0; i < packageInfo.versions.length; i++) {
const version = packageInfo.versions[i];
html += '<option value="' + version.version + '">' + version.version + '</option>';
}
var selectmenu = $('#selectVersion', page).html(html);
const selectmenu = $('#selectVersion', page).html(html);
if (!installedPlugin) {
$('#pCurrentVersion', page).hide().html('');
}
var packageVersion = packageInfo.versions[0];
const packageVersion = packageInfo.versions[0];
if (packageVersion) {
selectmenu.val(packageVersion.version);
}
}
}
function renderPackage(pkg, installedPlugins, page) {
var installedPlugin = installedPlugins.filter(function (ip) {
function renderPackage(pkg, installedPlugins, page) {
const installedPlugin = installedPlugins.filter(function (ip) {
return ip.Name == pkg.name;
})[0];
@ -56,64 +58,66 @@ define(['jQuery', 'loading', 'libraryMenu', 'globalize', 'connectionManager', 'e
$('#developer', page).html(pkg.owner);
if (installedPlugin) {
var currentVersionText = globalize.translate('MessageYouHaveVersionInstalled', '<strong>' + installedPlugin.Version + '</strong>');
const currentVersionText = globalize.translate('MessageYouHaveVersionInstalled', '<strong>' + installedPlugin.Version + '</strong>');
$('#pCurrentVersion', page).show().html(currentVersionText);
} else {
$('#pCurrentVersion', page).hide().html('');
}
loading.hide();
}
}
function alertText(options) {
require(['alert'], function ({default: alert}) {
function alertText(options) {
import('alert').then(({default: alert}) => {
alert(options);
});
}
}
function performInstallation(page, name, guid, version) {
var developer = $('#developer', page).html().toLowerCase();
function performInstallation(page, name, guid, version) {
const developer = $('#developer', page).html().toLowerCase();
var alertCallback = function () {
const alertCallback = function () {
loading.show();
page.querySelector('#btnInstall').disabled = true;
ApiClient.installPlugin(name, guid, version).then(function () {
ApiClient.installPlugin(name, guid, version).then(() => {
loading.hide();
alertText(globalize.translate('PluginInstalledMessage'));
alertText(globalize.translate('MessagePluginInstalled'));
}).catch(() => {
alertText(globalize.translate('MessagePluginInstallError'));
});
};
if (developer !== 'jellyfin') {
loading.hide();
var msg = globalize.translate('MessagePluginInstallDisclaimer');
let msg = globalize.translate('MessagePluginInstallDisclaimer');
msg += '<br/>';
msg += '<br/>';
msg += globalize.translate('PleaseConfirmPluginInstallation');
require(['confirm'], function (confirm) {
confirm.default(msg, globalize.translate('HeaderConfirmPluginInstallation')).then(function () {
import('confirm').then(({default: confirm}) => {
confirm(msg, globalize.translate('HeaderConfirmPluginInstallation')).then(function () {
alertCallback();
}, function () {
}).catch(() => {
console.debug('plugin not installed');
});
});
} else {
alertCallback();
}
}
}
return function (view, params) {
export default function(view, params) {
$('.addPluginForm', view).on('submit', function () {
loading.show();
var page = $(this).parents('#addPluginPage')[0];
var name = params.name;
var guid = params.guid;
const page = $(this).parents('#addPluginPage')[0];
const name = params.name;
const guid = params.guid;
ApiClient.getInstalledPlugins().then(function (plugins) {
var installedPlugin = plugins.filter(function (plugin) {
const installedPlugin = plugins.filter(function (plugin) {
return plugin.Name == name;
})[0];
var version = $('#selectVersion', page).val();
const version = $('#selectVersion', page).val();
if (installedPlugin && installedPlugin.Version === version) {
loading.hide();
Dashboard.alert({
@ -123,19 +127,20 @@ define(['jQuery', 'loading', 'libraryMenu', 'globalize', 'connectionManager', 'e
} else {
performInstallation(page, name, guid, version);
}
}).catch(() => {
alertText(globalize.translate('MessageGetInstalledPluginsError'));
});
return false;
});
view.addEventListener('viewshow', function () {
var page = this;
const page = this;
loading.show();
var name = params.name;
var guid = params.guid;
var promise1 = ApiClient.getPackageInfo(name, guid);
var promise2 = ApiClient.getInstalledPlugins();
const name = params.name;
const guid = params.guid;
const promise1 = ApiClient.getPackageInfo(name, guid);
const promise2 = ApiClient.getInstalledPlugins();
Promise.all([promise1, promise2]).then(function (responses) {
renderPackage(responses[0], responses[1], page);
});
});
};
});
}

65
src/controllers/dashboard/plugins/available/index.js
View file

@ -1,10 +1,15 @@
define(['loading', 'libraryMenu', 'globalize', 'cardStyle', 'emby-button', 'emby-checkbox', 'emby-select'], function (loading, libraryMenu, globalize) {
'use strict';
import loading from 'loading';
import libraryMenu from 'libraryMenu';
import globalize from 'globalize';
import 'cardStyle';
import 'emby-button';
import 'emby-checkbox';
import 'emby-select';
function reloadList(page) {
function reloadList(page) {
loading.show();
var promise1 = ApiClient.getAvailablePlugins();
var promise2 = ApiClient.getInstalledPlugins();
const promise1 = ApiClient.getAvailablePlugins();
const promise2 = ApiClient.getInstalledPlugins();
Promise.all([promise1, promise2]).then(function (responses) {
populateList({
catalogElement: page.querySelector('#pluginTiles'),
@ -13,10 +18,11 @@ define(['loading', 'libraryMenu', 'globalize', 'cardStyle', 'emby-button', 'emby
installedPlugins: responses[1]
});
});
}
}
function getHeaderText(category) {
function getHeaderText(category) {
category = category.replace(' ', '');
// TODO: Replace with switch
if (category === 'Channel') {
category = 'Channels';
} else if (category === 'Theme') {
@ -28,11 +34,11 @@ define(['loading', 'libraryMenu', 'globalize', 'cardStyle', 'emby-button', 'emby
}
return globalize.translate(category);
}
}
function populateList(options) {
var availablePlugins = options.availablePlugins;
var installedPlugins = options.installedPlugins;
function populateList(options) {
const availablePlugins = options.availablePlugins;
const installedPlugins = options.installedPlugins;
availablePlugins.forEach(function (plugin, index, array) {
plugin.category = plugin.category || 'General';
@ -54,12 +60,12 @@ define(['loading', 'libraryMenu', 'globalize', 'cardStyle', 'emby-button', 'emby
return 0;
});
var currentCategory = null;
var html = '';
let currentCategory = null;
let html = '';
for (var i = 0; i < availablePlugins.length; i++) {
var plugin = availablePlugins[i];
var category = plugin.categoryDisplayName;
for (let i = 0; i < availablePlugins.length; i++) {
const plugin = availablePlugins[i];
const category = plugin.categoryDisplayName;
if (category != currentCategory) {
if (currentCategory) {
html += '</div>';
@ -81,17 +87,17 @@ define(['loading', 'libraryMenu', 'globalize', 'cardStyle', 'emby-button', 'emby
options.catalogElement.innerHTML = html;
loading.hide();
}
}
function getPluginHtml(plugin, options, installedPlugins) {
var html = '';
var href = plugin.externalUrl ? plugin.externalUrl : 'addplugin.html?name=' + encodeURIComponent(plugin.name) + '&guid=' + plugin.guid;
function getPluginHtml(plugin, options, installedPlugins) {
let html = '';
let href = plugin.externalUrl ? plugin.externalUrl : 'addplugin.html?name=' + encodeURIComponent(plugin.name) + '&guid=' + plugin.guid;
if (options.context) {
href += '&context=' + options.context;
}
var target = plugin.externalUrl ? ' target="_blank"' : '';
const target = plugin.externalUrl ? ' target="_blank"' : '';
html += "<div class='card backdropCard'>";
html += '<div class="cardBox visualCardBox">';
html += '<div class="cardScalable visualCardBox-cardScalable">';
@ -104,7 +110,7 @@ define(['loading', 'libraryMenu', 'globalize', 'cardStyle', 'emby-button', 'emby
html += "<div class='cardText'>";
html += plugin.name;
html += '</div>';
var installedPlugin = installedPlugins.filter(function (ip) {
const installedPlugin = installedPlugins.filter(function (ip) {
return ip.Id == plugin.guid;
})[0];
html += "<div class='cardText cardText-secondary'>";
@ -113,9 +119,9 @@ define(['loading', 'libraryMenu', 'globalize', 'cardStyle', 'emby-button', 'emby
html += '</div>';
html += '</div>';
return html += '</div>';
}
}
function getTabs() {
function getTabs() {
return [{
href: 'installedplugins.html',
name: globalize.translate('TabMyPlugins')
@ -126,16 +132,11 @@ define(['loading', 'libraryMenu', 'globalize', 'cardStyle', 'emby-button', 'emby
href: 'repositories.html',
name: globalize.translate('TabRepositories')
}];
}
}
window.PluginCatalog = {
renderCatalog: populateList
};
return function (view, params) {
export default function (view) {
view.addEventListener('viewshow', function () {
libraryMenu.setTabs('plugins', 1, getTabs);
reloadList(this);
});
};
});
}

97
src/controllers/dashboard/plugins/installed/index.js
View file

@ -1,15 +1,19 @@
define(['loading', 'libraryMenu', 'dom', 'globalize', 'cardStyle', 'emby-button'], function (loading, libraryMenu, dom, globalize) {
'use strict';
import loading from 'loading';
import libraryMenu from 'libraryMenu';
import dom from 'dom';
import globalize from 'globalize';
import 'cardStyle';
import 'emby-button';
function deletePlugin(page, uniqueid, name) {
var msg = globalize.translate('UninstallPluginConfirmation', name);
function deletePlugin(page, uniqueid, name) {
const msg = globalize.translate('UninstallPluginConfirmation', name);
require(['confirm'], function (confirm) {
import('confirm').then(({default: confirm}) => {
confirm.default({
title: globalize.translate('UninstallPluginHeader'),
title: globalize.translate('HeaderUninstallPlugin'),
text: msg,
primary: 'delete',
confirmText: globalize.translate('UninstallPluginHeader')
confirmText: globalize.translate('HeaderUninstallPlugin')
}).then(function () {
loading.show();
ApiClient.uninstallPlugin(uniqueid).then(function () {
@ -17,26 +21,26 @@ define(['loading', 'libraryMenu', 'dom', 'globalize', 'cardStyle', 'emby-button'
});
});
});
}
}
function showNoConfigurationMessage() {
function showNoConfigurationMessage() {
Dashboard.alert({
message: globalize.translate('NoPluginConfigurationMessage')
message: globalize.translate('MessageNoPluginConfiguration')
});
}
}
function showConnectMessage() {
function showConnectMessage() {
Dashboard.alert({
message: globalize.translate('MessagePluginConfigurationRequiresLocalAccess')
});
}
}
function getPluginCardHtml(plugin, pluginConfigurationPages) {
var configPage = pluginConfigurationPages.filter(function (pluginConfigurationPage) {
function getPluginCardHtml(plugin, pluginConfigurationPages) {
const configPage = pluginConfigurationPages.filter(function (pluginConfigurationPage) {
return pluginConfigurationPage.PluginId == plugin.Id;
})[0];
var configPageUrl = configPage ? Dashboard.getConfigurationPageUrl(configPage.Name) : null;
var html = '';
const configPageUrl = configPage ? Dashboard.getConfigurationPageUrl(configPage.Name) : null;
let html = '';
html += "<div data-id='" + plugin.Id + "' data-name='" + plugin.Name + "' data-removable='" + plugin.CanUninstall + "' class='card backdropCard'>";
html += '<div class="cardBox visualCardBox">';
html += '<div class="cardScalable">';
@ -63,15 +67,15 @@ define(['loading', 'libraryMenu', 'dom', 'globalize', 'cardStyle', 'emby-button'
html += '</div>';
html += '</div>';
return html;
}
}
function renderPlugins(page, plugins) {
function renderPlugins(page, plugins) {
ApiClient.getJSON(ApiClient.getUrl('web/configurationpages') + '?pageType=PluginConfiguration').then(function (configPages) {
populateList(page, plugins, configPages);
});
}
}
function populateList(page, plugins, pluginConfigurationPages) {
function populateList(page, plugins, pluginConfigurationPages) {
plugins = plugins.sort(function (plugin1, plugin2) {
if (plugin1.Name > plugin2.Name) {
return 1;
@ -80,11 +84,11 @@ define(['loading', 'libraryMenu', 'dom', 'globalize', 'cardStyle', 'emby-button'
return -1;
});
var html = plugins.map(function (p) {
let html = plugins.map(function (p) {
return getPluginCardHtml(p, pluginConfigurationPages);
}).join('');
var installedPluginsElement = page.querySelector('.installedPlugins');
const installedPluginsElement = page.querySelector('.installedPlugins');
installedPluginsElement.removeEventListener('click', onInstalledPluginsClick);
installedPluginsElement.addEventListener('click', onInstalledPluginsClick);
@ -95,22 +99,22 @@ define(['loading', 'libraryMenu', 'dom', 'globalize', 'cardStyle', 'emby-button'
html += '<div class="centerMessage">';
html += '<h1>' + globalize.translate('MessageNoPluginsInstalled') + '</h1>';
html += '<p><a is="emby-linkbutton" class="button-link" href="availableplugins.html">';
html += globalize.translate('BrowsePluginCatalogMessage');
html += globalize.translate('MessageBrowsePluginCatalog');
html += '</a></p>';
html += '</div>';
}
installedPluginsElement.innerHTML = html;
loading.hide();
}
}
function showPluginMenu(page, elem) {
var card = dom.parentWithClass(elem, 'card');
var id = card.getAttribute('data-id');
var name = card.getAttribute('data-name');
var removable = card.getAttribute('data-removable');
var configHref = card.querySelector('.cardContent').getAttribute('href');
var menuItems = [];
function showPluginMenu(page, elem) {
const card = dom.parentWithClass(elem, 'card');
const id = card.getAttribute('data-id');
const name = card.getAttribute('data-name');
const removable = card.getAttribute('data-removable');
const configHref = card.querySelector('.cardContent').getAttribute('href');
const menuItems = [];
if (configHref) {
menuItems.push({
@ -128,7 +132,7 @@ define(['loading', 'libraryMenu', 'dom', 'globalize', 'cardStyle', 'emby-button'
});
}
require(['actionsheet'], function (actionsheet) {
import('actionsheet').then(({default: actionsheet}) => {
actionsheet.show({
items: menuItems,
positionTo: elem,
@ -144,16 +148,16 @@ define(['loading', 'libraryMenu', 'dom', 'globalize', 'cardStyle', 'emby-button'
}
});
});
}
}
function reloadList(page) {
function reloadList(page) {
loading.show();
ApiClient.getInstalledPlugins().then(function (plugins) {
renderPlugins(page, plugins);
});
}
}
function getTabs() {
function getTabs() {
return [{
href: 'installedplugins.html',
name: globalize.translate('TabMyPlugins')
@ -164,27 +168,26 @@ define(['loading', 'libraryMenu', 'dom', 'globalize', 'cardStyle', 'emby-button'
href: 'repositories.html',
name: globalize.translate('TabRepositories')
}];
}
}
function onInstalledPluginsClick(e) {
function onInstalledPluginsClick(e) {
if (dom.parentWithClass(e.target, 'noConfigPluginCard')) {
showNoConfigurationMessage();
} else if (dom.parentWithClass(e.target, 'connectModePluginCard')) {
showConnectMessage();
} else {
var btnCardMenu = dom.parentWithClass(e.target, 'btnCardMenu');
const btnCardMenu = dom.parentWithClass(e.target, 'btnCardMenu');
if (btnCardMenu) {
showPluginMenu(dom.parentWithClass(btnCardMenu, 'page'), btnCardMenu);
}
}
}
}
pageIdOn('pageshow', 'pluginsPage', function () {
pageIdOn('pageshow', 'pluginsPage', function () {
libraryMenu.setTabs('plugins', 0, getTabs);
reloadList(this);
});
window.PluginsPage = {
renderPlugins: renderPlugins
};
});
window.PluginsPage = {
renderPlugins: renderPlugins
};

0
src/scheduledtask.html → src/controllers/dashboard/scheduledtasks/scheduledtask.html
View file

0
src/scheduledtasks.html → src/controllers/dashboard/scheduledtasks/scheduledtasks.html
View file

0
src/serveractivity.html → src/controllers/dashboard/serveractivity.html
View file

0
src/streamingsettings.html → src/controllers/dashboard/streaming.html
View file

0
src/useredit.html → src/controllers/dashboard/users/useredit.html
View file

0
src/userlibraryaccess.html → src/controllers/dashboard/users/userlibraryaccess.html
View file

0
src/usernew.html → src/controllers/dashboard/users/usernew.html
View file

2
src/controllers/dashboard/users/usernew.js
View file

@ -89,7 +89,7 @@ import 'emby-checkbox';
});
}, function (response) {
import('toast').then(({default: toast}) => {
toast(globalize.translate('DefaultErrorMessage'));
toast(globalize.translate('ErrorDefault'));
});
loading.hide();

0
src/userparentalcontrol.html → src/controllers/dashboard/users/userparentalcontrol.html
View file

0
src/userpassword.html → src/controllers/dashboard/users/userpassword.html
View file

4
src/controllers/dashboard/users/userpasswordpage.js
View file

@ -145,14 +145,14 @@ import 'emby-button';
function resetPassword() {
const msg = globalize.translate('PasswordResetConfirmation');
import('confirm').then(({default: confirm}) => {
confirm(msg, globalize.translate('PasswordResetHeader')).then(function () {
confirm(msg, globalize.translate('HeaderResetPassword')).then(function () {
const userId = params.userId;
loading.show();
ApiClient.resetUserPassword(userId).then(function () {
loading.hide();
Dashboard.alert({
message: globalize.translate('PasswordResetComplete'),
title: globalize.translate('PasswordResetHeader')
title: globalize.translate('HeaderResetPassword')
});
loadUser(view, params);
});

0
src/userprofiles.html → src/controllers/dashboard/users/userprofiles.html
View file

0
src/edititemmetadata.html → src/controllers/edititemmetadata.html
View file

15
src/controllers/edititemmetadata.js
View file

@ -1,20 +1,20 @@
define(['loading', 'scripts/editorsidebar'], function (loading) {
'use strict';
import loading from 'loading';
import 'scripts/editorsidebar';
function reload(context, itemId) {
function reload(context, itemId) {
loading.show();
if (itemId) {
require(['metadataEditor'], function ({default: metadataEditor}) {
import('metadataEditor').then(({ default: metadataEditor }) => {
metadataEditor.embed(context.querySelector('.editPageInnerContent'), itemId, ApiClient.serverInfo().Id);
});
} else {
context.querySelector('.editPageInnerContent').innerHTML = '';
loading.hide();
}
}
}
return function (view, params) {
export default function (view, params) {
view.addEventListener('viewshow', function () {
reload(this, MetadataEditor.getCurrentItemId());
});
@ -27,5 +27,4 @@ define(['loading', 'scripts/editorsidebar'], function (loading) {
reload(view, data.id);
}
});
};
});
}

110
src/controllers/favorites.js
View file

@ -1,5 +1,15 @@
define(['appRouter', 'cardBuilder', 'dom', 'globalize', 'connectionManager', 'apphost', 'layoutManager', 'focusManager', 'emby-itemscontainer', 'emby-scroller'], function (appRouter, cardBuilder, dom, globalize, connectionManager, appHost, layoutManager, focusManager) {
'use strict';
import appRouter from 'appRouter';
import cardBuilder from 'cardBuilder';
import dom from 'dom';
import globalize from 'globalize';
import connectionManager from 'connectionManager';
import appHost from 'apphost';
import layoutManager from 'layoutManager';
import focusManager from 'focusManager';
import 'emby-itemscontainer';
import 'emby-scroller';
/* eslint-disable indent */
function enableScrollX() {
return true;
@ -133,8 +143,8 @@ define(['appRouter', 'cardBuilder', 'dom', 'globalize', 'connectionManager', 'ap
function getFetchDataFn(section) {
return function () {
var apiClient = this.apiClient;
var options = {
const apiClient = this.apiClient;
const options = {
SortBy: (section.types, 'SeriesName,SortName'),
SortOrder: 'Ascending',
Filters: 'IsFavorite',
@ -145,7 +155,7 @@ define(['appRouter', 'cardBuilder', 'dom', 'globalize', 'connectionManager', 'ap
EnableTotalRecordCount: false
};
options.Limit = 20;
var userId = apiClient.getCurrentUserId();
const userId = apiClient.getCurrentUserId();
if (section.types === 'MusicArtist') {
return apiClient.getArtists(userId, options);
@ -170,16 +180,16 @@ define(['appRouter', 'cardBuilder', 'dom', 'globalize', 'connectionManager', 'ap
function getItemsHtmlFn(section) {
return function (items) {
var cardLayout = appHost.preferVisualCards && section.autoCardLayout && section.showTitle;
let cardLayout = appHost.preferVisualCards && section.autoCardLayout && section.showTitle;
cardLayout = false;
var serverId = this.apiClient.serverId();
var leadingButtons = layoutManager.tv ? [{
const serverId = this.apiClient.serverId();
const leadingButtons = layoutManager.tv ? [{
name: globalize.translate('All'),
id: 'more',
icon: 'favorite',
routeUrl: getRouteUrl(section, serverId)
}] : null;
var lines = 0;
let lines = 0;
if (section.showTitle) {
lines++;
@ -215,23 +225,12 @@ define(['appRouter', 'cardBuilder', 'dom', 'globalize', 'connectionManager', 'ap
};
}
function FavoritesTab(view, params) {
this.view = view;
this.params = params;
this.apiClient = connectionManager.currentApiClient();
this.sectionsContainer = view.querySelector('.sections');
createSections(this, this.sectionsContainer, this.apiClient);
}
function createSections(instance, elem, apiClient) {
var i;
var length;
var sections = getSections();
var html = '';
const sections = getSections();
let html = '';
for (i = 0, length = sections.length; i < length; i++) {
var section = sections[i];
var sectionClass = 'verticalSection';
for (const section of sections) {
let sectionClass = 'verticalSection';
if (!section.showTitle) {
sectionClass += ' verticalSection-extrabottompadding';
@ -257,23 +256,32 @@ define(['appRouter', 'cardBuilder', 'dom', 'globalize', 'connectionManager', 'ap
}
elem.innerHTML = html;
var elems = elem.querySelectorAll('.itemsContainer');
const elems = elem.querySelectorAll('.itemsContainer');
for (i = 0, length = elems.length; i < length; i++) {
var itemsContainer = elems[i];
for (let i = 0, length = elems.length; i < length; i++) {
const itemsContainer = elems[i];
itemsContainer.fetchData = getFetchDataFn(sections[i]).bind(instance);
itemsContainer.getItemsHtml = getItemsHtmlFn(sections[i]).bind(instance);
itemsContainer.parentContainer = dom.parentWithClass(itemsContainer, 'verticalSection');
}
}
FavoritesTab.prototype.onResume = function (options) {
var promises = (this.apiClient, []);
var view = this.view;
var elems = this.sectionsContainer.querySelectorAll('.itemsContainer');
class FavoritesTab {
constructor(view, params) {
this.view = view;
this.params = params;
this.apiClient = connectionManager.currentApiClient();
this.sectionsContainer = view.querySelector('.sections');
createSections(this, this.sectionsContainer, this.apiClient);
}
for (var i = 0, length = elems.length; i < length; i++) {
promises.push(elems[i].resume(options));
onResume(options) {
const promises = (this.apiClient, []);
const view = this.view;
const elems = this.sectionsContainer.querySelectorAll('.itemsContainer');
for (const elem of elems) {
promises.push(elem.resume(options));
}
Promise.all(promises).then(function () {
@ -281,30 +289,32 @@ define(['appRouter', 'cardBuilder', 'dom', 'globalize', 'connectionManager', 'ap
focusManager.autoFocus(view);
}
});
};
FavoritesTab.prototype.onPause = function () {
var elems = this.sectionsContainer.querySelectorAll('.itemsContainer');
for (var i = 0, length = elems.length; i < length; i++) {
elems[i].pause();
}
};
FavoritesTab.prototype.destroy = function () {
onPause() {
const elems = this.sectionsContainer.querySelectorAll('.itemsContainer');
for (const elem of elems) {
elem.pause();
}
}
destroy() {
this.view = null;
this.params = null;
this.apiClient = null;
var elems = this.sectionsContainer.querySelectorAll('.itemsContainer');
const elems = this.sectionsContainer.querySelectorAll('.itemsContainer');
for (var i = 0, length = elems.length; i < length; i++) {
elems[i].fetchData = null;
elems[i].getItemsHtml = null;
elems[i].parentContainer = null;
for (const elem of elems) {
elem.fetchData = null;
elem.getItemsHtml = null;
elem.parentContainer = null;
}
this.sectionsContainer = null;
};
}
}
return FavoritesTab;
});
export default FavoritesTab;
/* eslint-enable indent */

0
src/home.html → src/controllers/home.html
View file

Some files were not shown because too many files have changed in this diff Show more