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

Migration playbackSettings to ES6 modules

Browse source
This commit is contained in:
grafixeyehero 2020-06-21 04:56:48 +03:00
parent 30bddd04b0
commit 7cb209fa10
3 changed files with 88 additions and 76 deletions
Download patch file Download diff file Expand all files Collapse all files

1
package.json
View file

@ -110,6 +110,7 @@
"src/components/playback/playmethodhelper.js", "src/components/playback/playmethodhelper.js",
"src/components/playback/remotecontrolautoplay.js", "src/components/playback/remotecontrolautoplay.js",
"src/components/playback/volumeosd.js", "src/components/playback/volumeosd.js",
"src/components/playbackSettings/playbackSettings.js",
"src/components/playmenu.js", "src/components/playmenu.js",
"src/components/sanatizefilename.js", "src/components/sanatizefilename.js",
"src/components/scrollManager.js", "src/components/scrollManager.js",

125
src/components/playbackSettings/playbackSettings.js
View file

@ -1,31 +1,42 @@
define(['require', 'browser', 'appSettings', 'apphost', 'focusManager', 'qualityoptions', 'globalize', 'loading', 'connectionManager', 'dom', 'events', 'emby-select', 'emby-checkbox'], function (require, browser, appSettings, appHost, focusManager, qualityoptions, globalize, loading, connectionManager, dom, events) { import browser from 'browser';
'use strict'; import appSettings from 'appSettings';
import appHost from 'apphost';
import focusManager from 'focusManager';
import qualityoptions from 'qualityoptions';
import globalize from 'globalize';
import loading from 'loading';
import connectionManager from 'connectionManager';
import events from 'events';
import 'emby-select';
import 'emby-checkbox';
/* eslint-disable indent */
function fillSkipLengths(select) { function fillSkipLengths(select) {
var options = [5, 10, 15, 20, 25, 30]; const options = [5, 10, 15, 20, 25, 30];
select.innerHTML = options.map(function (option) { select.innerHTML = options.map(option => {
return { return {
name: globalize.translate('ValueSeconds', option), name: globalize.translate('ValueSeconds', option),
value: option * 1000 value: option * 1000
}; };
}).map(function (o) { }).map(o => {
return '<option value="' + o.value + '">' + o.name + '</option>'; return `<option value="${o.value}">${o.name}</option>`;
}).join(''); }).join('');
} }
function populateLanguages(select, languages) { function populateLanguages(select, languages) {
var html = ''; let html = '';
html += "<option value=''>" + globalize.translate('AnyLanguage') + '</option>'; html += `<option value=''>${globalize.translate('AnyLanguage')}</option>`;
for (var i = 0, length = languages.length; i < length; i++) { for (let i = 0, length = languages.length; i < length; i++) {
var culture = languages[i]; const culture = languages[i];
html += "<option value='" + culture.ThreeLetterISOLanguageName + "'>" + culture.DisplayName + '</option>'; html += `<option value='${culture.ThreeLetterISOLanguageName}'>${culture.DisplayName}</option>`;
} }
select.innerHTML = html; select.innerHTML = html;
@ -33,7 +44,7 @@ define(['require', 'browser', 'appSettings', 'apphost', 'focusManager', 'quality
function setMaxBitrateIntoField(select, isInNetwork, mediatype) { function setMaxBitrateIntoField(select, isInNetwork, mediatype) {
var options = mediatype === 'Audio' ? qualityoptions.getAudioQualityOptions({ const options = mediatype === 'Audio' ? qualityoptions.getAudioQualityOptions({
currentMaxBitrate: appSettings.maxStreamingBitrate(isInNetwork, mediatype), currentMaxBitrate: appSettings.maxStreamingBitrate(isInNetwork, mediatype),
isAutomaticBitrateEnabled: appSettings.enableAutomaticBitrateDetection(isInNetwork, mediatype), isAutomaticBitrateEnabled: appSettings.enableAutomaticBitrateDetection(isInNetwork, mediatype),
@ -47,10 +58,10 @@ define(['require', 'browser', 'appSettings', 'apphost', 'focusManager', 'quality
}); });
select.innerHTML = options.map(function (i) { select.innerHTML = options.map(i => {
// render empty string instead of 0 for the auto option // render empty string instead of 0 for the auto option
return '<option value="' + (i.bitrate || '') + '">' + i.name + '</option>'; return `<option value="${i.bitrate || ''}">${i.name}</option>`;
}).join(''); }).join('');
if (appSettings.enableAutomaticBitrateDetection(isInNetwork, mediatype)) { if (appSettings.enableAutomaticBitrateDetection(isInNetwork, mediatype)) {
@ -62,23 +73,23 @@ define(['require', 'browser', 'appSettings', 'apphost', 'focusManager', 'quality
function fillChromecastQuality(select) { function fillChromecastQuality(select) {
var options = qualityoptions.getVideoQualityOptions({ const options = qualityoptions.getVideoQualityOptions({
currentMaxBitrate: appSettings.maxChromecastBitrate(), currentMaxBitrate: appSettings.maxChromecastBitrate(),
isAutomaticBitrateEnabled: !appSettings.maxChromecastBitrate(), isAutomaticBitrateEnabled: !appSettings.maxChromecastBitrate(),
enableAuto: true enableAuto: true
}); });
select.innerHTML = options.map(function (i) { select.innerHTML = options.map(i => {
// render empty string instead of 0 for the auto option // render empty string instead of 0 for the auto option
return '<option value="' + (i.bitrate || '') + '">' + i.name + '</option>'; return `<option value="${i.bitrate || ''}">${i.name}</option>`;
}).join(''); }).join('');
select.value = appSettings.maxChromecastBitrate() || ''; select.value = appSettings.maxChromecastBitrate() || '';
} }
function setMaxBitrateFromField(select, isInNetwork, mediatype, value) { function setMaxBitrateFromField(select, isInNetwork, mediatype) {
if (select.value) { if (select.value) {
appSettings.maxStreamingBitrate(isInNetwork, mediatype, select.value); appSettings.maxStreamingBitrate(isInNetwork, mediatype, select.value);
@ -110,7 +121,7 @@ define(['require', 'browser', 'appSettings', 'apphost', 'focusManager', 'quality
return; return;
} }
apiClient.getEndpointInfo().then(function (endpointInfo) { apiClient.getEndpointInfo().then(endpointInfo => {
if (endpointInfo.IsInNetwork) { if (endpointInfo.IsInNetwork) {
@ -133,7 +144,7 @@ define(['require', 'browser', 'appSettings', 'apphost', 'focusManager', 'quality
}); });
} }
function showOrHideEpisodesField(context, user, apiClient) { function showOrHideEpisodesField(context) {
if (browser.tizen || browser.web0s) { if (browser.tizen || browser.web0s) {
context.querySelector('.fldEpisodeAutoPlay').classList.add('hide'); context.querySelector('.fldEpisodeAutoPlay').classList.add('hide');
@ -145,12 +156,12 @@ define(['require', 'browser', 'appSettings', 'apphost', 'focusManager', 'quality
function loadForm(context, user, userSettings, apiClient) { function loadForm(context, user, userSettings, apiClient) {
var loggedInUserId = apiClient.getCurrentUserId(); const loggedInUserId = apiClient.getCurrentUserId();
var userId = user.Id; const userId = user.Id;
showHideQualityFields(context, user, apiClient); showHideQualityFields(context, user, apiClient);
apiClient.getCultures().then(function (allCultures) { apiClient.getCultures().then(allCultures => {
populateLanguages(context.querySelector('#selectAudioLanguage'), allCultures); populateLanguages(context.querySelector('#selectAudioLanguage'), allCultures);
@ -159,7 +170,7 @@ define(['require', 'browser', 'appSettings', 'apphost', 'focusManager', 'quality
}); });
// hide cinema mode options if disabled at server level // hide cinema mode options if disabled at server level
apiClient.getNamedConfiguration('cinemamode').then(function (cinemaConfig) { apiClient.getNamedConfiguration('cinemamode').then(cinemaConfig => {
if (cinemaConfig.EnableIntrosForMovies || cinemaConfig.EnableIntrosForEpisodes) { if (cinemaConfig.EnableIntrosForMovies || cinemaConfig.EnableIntrosForEpisodes) {
context.querySelector('.cinemaModeOptions').classList.remove('hide'); context.querySelector('.cinemaModeOptions').classList.remove('hide');
@ -204,18 +215,18 @@ define(['require', 'browser', 'appSettings', 'apphost', 'focusManager', 'quality
fillChromecastQuality(context.querySelector('.selectChromecastVideoQuality')); fillChromecastQuality(context.querySelector('.selectChromecastVideoQuality'));
var selectChromecastVersion = context.querySelector('.selectChromecastVersion'); const selectChromecastVersion = context.querySelector('.selectChromecastVersion');
selectChromecastVersion.value = userSettings.chromecastVersion(); selectChromecastVersion.value = userSettings.chromecastVersion();
var selectSkipForwardLength = context.querySelector('.selectSkipForwardLength'); const selectSkipForwardLength = context.querySelector('.selectSkipForwardLength');
fillSkipLengths(selectSkipForwardLength); fillSkipLengths(selectSkipForwardLength);
selectSkipForwardLength.value = userSettings.skipForwardLength(); selectSkipForwardLength.value = userSettings.skipForwardLength();
var selectSkipBackLength = context.querySelector('.selectSkipBackLength'); const selectSkipBackLength = context.querySelector('.selectSkipBackLength');
fillSkipLengths(selectSkipBackLength); fillSkipLengths(selectSkipBackLength);
selectSkipBackLength.value = userSettings.skipBackLength(); selectSkipBackLength.value = userSettings.skipBackLength();
showOrHideEpisodesField(context, user, apiClient); showOrHideEpisodesField(context);
loading.hide(); loading.hide();
} }
@ -248,20 +259,20 @@ define(['require', 'browser', 'appSettings', 'apphost', 'focusManager', 'quality
loading.show(); loading.show();
apiClient.getUser(userId).then(function (user) { apiClient.getUser(userId).then(user => {
saveUser(context, user, userSettings, apiClient).then(function () { saveUser(context, user, userSettings, apiClient).then(() => {
loading.hide(); loading.hide();
if (enableSaveConfirmation) { if (enableSaveConfirmation) {
require(['toast'], function (toast) { import('toast').then(({default: toast}) => {
toast(globalize.translate('SettingsSaved')); toast(globalize.translate('SettingsSaved'));
}); });
} }
events.trigger(instance, 'saved'); events.trigger(instance, 'saved');
}, function () { }, () => {
loading.hide(); loading.hide();
}); });
}); });
@ -269,14 +280,14 @@ define(['require', 'browser', 'appSettings', 'apphost', 'focusManager', 'quality
function onSubmit(e) { function onSubmit(e) {
var self = this; const self = this;
var apiClient = connectionManager.getApiClient(self.options.serverId); const apiClient = connectionManager.getApiClient(self.options.serverId);
var userId = self.options.userId; const userId = self.options.userId;
var userSettings = self.options.userSettings; const userSettings = self.options.userSettings;
userSettings.setUserInfo(userId, apiClient).then(function () { userSettings.setUserInfo(userId, apiClient).then(() => {
var enableSaveConfirmation = self.options.enableSaveConfirmation; const enableSaveConfirmation = self.options.enableSaveConfirmation;
save(self, self.options.element, userId, userSettings, apiClient, enableSaveConfirmation); save(self, self.options.element, userId, userSettings, apiClient, enableSaveConfirmation);
}); });
@ -289,7 +300,7 @@ define(['require', 'browser', 'appSettings', 'apphost', 'focusManager', 'quality
function embed(options, self) { function embed(options, self) {
require(['text!./playbackSettings.template.html'], function (template) { return import('text!./playbackSettings.template.html').then(({default: template}) => {
options.element.innerHTML = globalize.translateDocument(template, 'core'); options.element.innerHTML = globalize.translateDocument(template, 'core');
@ -307,43 +318,43 @@ define(['require', 'browser', 'appSettings', 'apphost', 'focusManager', 'quality
}); });
} }
function PlaybackSettings(options) { class PlaybackSettings {
constructor(options) {
this.options = options; this.options = options;
embed(options, this); embed(options, this);
} }
PlaybackSettings.prototype.loadData = function () { loadData() {
var self = this; const self = this;
var context = self.options.element; const context = self.options.element;
loading.show(); loading.show();
var userId = self.options.userId; const userId = self.options.userId;
var apiClient = connectionManager.getApiClient(self.options.serverId); const apiClient = connectionManager.getApiClient(self.options.serverId);
var userSettings = self.options.userSettings; const userSettings = self.options.userSettings;
apiClient.getUser(userId).then(function (user) { apiClient.getUser(userId).then(user => {
userSettings.setUserInfo(userId, apiClient).then(function () { userSettings.setUserInfo(userId, apiClient).then(() => {
self.dataLoaded = true; self.dataLoaded = true;
loadForm(context, user, userSettings, apiClient); loadForm(context, user, userSettings, apiClient);
}); });
}); });
}; }
PlaybackSettings.prototype.submit = function () { submit() {
onSubmit.call(this); onSubmit.call(this);
}; }
PlaybackSettings.prototype.destroy = function () { destroy() {
this.options = null; this.options = null;
}; }
}
return PlaybackSettings; /* eslint-enable indent */
}); export default PlaybackSettings;

2
src/controllers/user/playback.js
View file

@ -21,7 +21,7 @@ define(['playbackSettings', 'dom', 'globalize', 'loading', 'userSettings', 'auto
if (settingsInstance) { if (settingsInstance) {
settingsInstance.loadData(); settingsInstance.loadData();
} else { } else {
settingsInstance = new PlaybackSettings({ settingsInstance = new PlaybackSettings.default({
serverId: ApiClient.serverId(), serverId: ApiClient.serverId(),
userId: userId, userId: userId,
element: view.querySelector('.settingsContainer'), element: view.querySelector('.settingsContainer'),