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 pull request #1761 from Camc314/migrate-to-ES6-61

Browse source 
Migration of recordingeditor and recordingfields to ES6 modules
This commit is contained in:
dkanada 2020-08-16 19:16:52 +09:00 • committed by GitHub
commit 5e53170cf6
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 348 additions and 334 deletions
Download patch file Download diff file Expand all files Collapse all files

2
package.json
View file

@ -165,6 +165,8 @@
"src/components/recordingcreator/seriesrecordingeditor.js",
"src/components/recordingcreator/recordinghelper.js",
"src/components/refreshdialog/refreshdialog.js",
"src/components/recordingcreator/recordingeditor.js",
"src/components/recordingcreator/recordingfields.js",
"src/components/qualityOptions.js",
"src/components/remotecontrol/remotecontrol.js",
"src/components/sanatizefilename.js",

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

@ -118,7 +118,7 @@ function reload(context, programId, serverId, refreshRecordingStateOnly) {
function executeCloseAction(action, programId, serverId) {
if (action === 'play') {
import('playbackManager').then(({default: playbackManager}) => {
import('playbackManager').then(({ default: playbackManager }) => {
const apiClient = connectionManager.getApiClient(serverId);
apiClient.getLiveTvProgram(programId, apiClient.getCurrentUserId()).then(function (item) {
@ -138,7 +138,7 @@ function showEditor(itemId, serverId) {
loading.show();
import('text!./recordingcreator.template.html').then(({default: template}) => {
import('text!./recordingcreator.template.html').then(({ default: template }) => {
const dialogOptions = {
removeOnClose: true,
scrollY: false

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

@ -1,43 +1,47 @@
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';
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 'scrollStyles';
import 'emby-button';
import 'emby-collapse';
import 'emby-input';
import 'paper-icon-button-light';
import 'css!./../formdialog';
import 'css!./recordingcreator';
import 'material-icons';
import 'flexStyles';
scrollHelper = scrollHelper.default || scrollHelper;
loading = loading.default || loading;
layoutManager = layoutManager.default || layoutManager;
let currentDialog;
let recordingDeleted = false;
let currentItemId;
let currentServerId;
let currentResolve;
var currentDialog;
var recordingDeleted = false;
var currentItemId;
var currentServerId;
var currentResolve;
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);
function deleteTimer(apiClient, timerId) {
return import('recordingHelper').then(({ default: recordingHelper }) => {
recordingHelper.cancelTimerWithConfirmation(timerId, apiClient.serverId());
});
});
}
}
function renderTimer(context, item, apiClient) {
function renderTimer(context, item, apiClient) {
context.querySelector('#txtPrePaddingMinutes').value = item.PrePaddingSeconds / 60;
context.querySelector('#txtPostPaddingMinutes').value = item.PostPaddingSeconds / 60;
loading.hide();
}
}
function closeDialog(isDeleted) {
function closeDialog(isDeleted) {
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.getLiveTvTimer(currentItemId).then(function (item) {
item.PrePaddingSeconds = form.querySelector('#txtPrePaddingMinutes').value * 60;
@ -49,35 +53,36 @@ define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'c
// Disable default form submission
return false;
}
}
function init(context) {
function init(context) {
context.querySelector('.btnCancel').addEventListener('click', function () {
closeDialog(false);
});
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) {
function reload(context, id) {
loading.show();
currentItemId = id;
var apiClient = connectionManager.getApiClient(currentServerId);
const apiClient = connectionManager.getApiClient(currentServerId);
apiClient.getLiveTvTimer(id).then(function (result) {
renderTimer(context, result, apiClient);
loading.hide();
});
}
}
function showEditor(itemId, serverId, options) {
function showEditor(itemId, serverId, options) {
return new Promise(function (resolve, reject) {
recordingDeleted = false;
currentServerId = serverId;
@ -85,8 +90,8 @@ define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'c
options = options || {};
currentResolve = resolve;
require(['text!./recordingeditor.template.html'], function (template) {
var dialogOptions = {
import('text!./recordingeditor.template.html').then(({default: template}) => {
const dialogOptions = {
removeOnClose: true,
scrollY: false
};
@ -95,7 +100,7 @@ define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'c
dialogOptions.size = 'fullscreen';
}
var dlg = dialogHelper.createDialog(dialogOptions);
const dlg = dialogHelper.createDialog(dialogOptions);
dlg.classList.add('formDialog');
dlg.classList.add('recordingDialog');
@ -105,7 +110,7 @@ define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'c
dlg.classList.add('dialog-fullscreen-lowres');
}
var html = '';
let html = '';
html += globalize.translateHtml(template, 'core');
@ -143,9 +148,8 @@ define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'c
dialogHelper.open(dlg);
});
});
}
}
return {
export default {
show: showEditor
};
});
};

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

@ -1,11 +1,18 @@
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';
import globalize from 'globalize';
import connectionManager from 'connectionManager';
import serverNotifications from 'serverNotifications';
import loading from 'loading';
import dom from 'dom';
import recordingHelper from 'recordingHelper';
import events from 'events';
import 'paper-icon-button-light';
import 'emby-button';
import 'css!./recordingfields';
import 'flexStyles';
serverNotifications = serverNotifications.default || serverNotifications;
recordingHelper = recordingHelper.default || recordingHelper;
loading = loading.default || loading;
/*eslint prefer-const: "error"*/
function loadData(parent, program, apiClient) {
function loadData(parent, program, apiClient) {
if (program.IsSeries) {
parent.querySelector('.recordSeriesContainer').classList.remove('hide');
} else {
@ -35,11 +42,11 @@ define(['globalize', 'connectionManager', 'serverNotifications', 'require', 'loa
parent.querySelector('.singleRecordingButton .recordingIcon').classList.remove('recordingIcon-active');
parent.querySelector('.singleRecordingButton .buttonText').innerHTML = globalize.translate('Record');
}
}
}
function fetchData(instance) {
var options = instance.options;
var apiClient = connectionManager.getApiClient(options.serverId);
function fetchData(instance) {
const options = instance.options;
const apiClient = connectionManager.getApiClient(options.serverId);
options.parent.querySelector('.recordingFields').classList.remove('hide');
return apiClient.getLiveTvProgram(options.programId, apiClient.getCurrentUserId()).then(function (program) {
@ -48,11 +55,11 @@ define(['globalize', 'connectionManager', 'serverNotifications', 'require', 'loa
instance.SeriesTimerId = program.SeriesTimerId;
loadData(options.parent, program, apiClient);
});
}
}
function onTimerChangedExternally(e, apiClient, data) {
var options = this.options;
var refresh = false;
function onTimerChangedExternally(e, apiClient, data) {
const options = this.options;
let refresh = false;
if (data.Id) {
if (this.TimerId === data.Id) {
@ -68,11 +75,11 @@ define(['globalize', 'connectionManager', 'serverNotifications', 'require', 'loa
if (refresh) {
this.refresh();
}
}
}
function onSeriesTimerChangedExternally(e, apiClient, data) {
var options = this.options;
var refresh = false;
function onSeriesTimerChangedExternally(e, apiClient, data) {
const options = this.options;
let refresh = false;
if (data.Id) {
if (this.SeriesTimerId === data.Id) {
@ -88,51 +95,93 @@ define(['globalize', 'connectionManager', 'serverNotifications', 'require', 'loa
if (refresh) {
this.refresh();
}
}
}
function RecordingEditor(options) {
class RecordingEditor {
constructor(options) {
this.options = options;
this.embed();
var timerChangedHandler = onTimerChangedExternally.bind(this);
const timerChangedHandler = onTimerChangedExternally.bind(this);
this.timerChangedHandler = timerChangedHandler;
events.on(serverNotifications, 'TimerCreated', timerChangedHandler);
events.on(serverNotifications, 'TimerCancelled', timerChangedHandler);
var seriesTimerChangedHandler = onSeriesTimerChangedExternally.bind(this);
const seriesTimerChangedHandler = onSeriesTimerChangedExternally.bind(this);
this.seriesTimerChangedHandler = seriesTimerChangedHandler;
events.on(serverNotifications, 'SeriesTimerCreated', seriesTimerChangedHandler);
events.on(serverNotifications, 'SeriesTimerCancelled', seriesTimerChangedHandler);
}
function onManageRecordingClick(e) {
var options = this.options;
embed() {
const self = this;
return new Promise(function (resolve, reject) {
import('text!./recordingfields.template.html').then(({default: template}) => {
const options = self.options;
const context = options.parent;
context.innerHTML = globalize.translateHtml(template, 'core');
context.querySelector('.singleRecordingButton').addEventListener('click', onRecordChange.bind(self));
context.querySelector('.seriesRecordingButton').addEventListener('click', onRecordSeriesChange.bind(self));
context.querySelector('.btnManageRecording').addEventListener('click', onManageRecordingClick.bind(self));
context.querySelector('.btnManageSeriesRecording').addEventListener('click', onManageSeriesRecordingClick.bind(self));
fetchData(self).then(resolve);
});
});
}
hasChanged() {
return this.changed;
}
refresh() {
fetchData(this);
}
destroy() {
const timerChangedHandler = this.timerChangedHandler;
this.timerChangedHandler = null;
events.off(serverNotifications, 'TimerCreated', timerChangedHandler);
events.off(serverNotifications, 'TimerCancelled', timerChangedHandler);
const seriesTimerChangedHandler = this.seriesTimerChangedHandler;
this.seriesTimerChangedHandler = null;
events.off(serverNotifications, 'SeriesTimerCreated', seriesTimerChangedHandler);
events.off(serverNotifications, 'SeriesTimerCancelled', seriesTimerChangedHandler);
}
}
function onManageRecordingClick(e) {
const options = this.options;
if (!this.TimerId || this.Status === 'Cancelled') {
return;
}
var self = this;
require(['recordingEditor'], function (recordingEditor) {
const self = this;
import('recordingEditor').then(({default: recordingEditor}) => {
recordingEditor.show(self.TimerId, options.serverId, {
enableCancel: false
}).then(function () {
self.changed = true;
});
});
}
}
function onManageSeriesRecordingClick(e) {
var options = this.options;
function onManageSeriesRecordingClick(e) {
const options = this.options;
if (!this.SeriesTimerId) {
return;
}
var self = this;
const self = this;
require(['seriesRecordingEditor'], function (seriesRecordingEditor) {
import('seriesRecordingEditor').then(({default: seriesRecordingEditor}) => {
seriesRecordingEditor.show(self.SeriesTimerId, options.serverId, {
enableCancel: false
@ -141,19 +190,19 @@ define(['globalize', 'connectionManager', 'serverNotifications', 'require', 'loa
self.changed = true;
});
});
}
}
function onRecordChange(e) {
function onRecordChange(e) {
this.changed = true;
var self = this;
var options = this.options;
var apiClient = connectionManager.getApiClient(options.serverId);
const self = this;
const options = this.options;
const apiClient = connectionManager.getApiClient(options.serverId);
var button = dom.parentWithTag(e.target, 'BUTTON');
var isChecked = !button.querySelector('.material-icons').classList.contains('recordingIcon-active');
const button = dom.parentWithTag(e.target, 'BUTTON');
const isChecked = !button.querySelector('.material-icons').classList.contains('recordingIcon-active');
var hasEnabledTimer = this.TimerId && this.Status !== 'Cancelled';
const hasEnabledTimer = this.TimerId && this.Status !== 'Cancelled';
if (isChecked) {
if (!hasEnabledTimer) {
@ -174,28 +223,28 @@ define(['globalize', 'connectionManager', 'serverNotifications', 'require', 'loa
});
}
}
}
}
function sendToast(msg) {
require(['toast'], function (toast) {
function sendToast(msg) {
import('toast').then(({default: toast}) => {
toast(msg);
});
}
}
function onRecordSeriesChange(e) {
function onRecordSeriesChange(e) {
this.changed = true;
var self = this;
var options = this.options;
var apiClient = connectionManager.getApiClient(options.serverId);
const self = this;
const options = this.options;
const apiClient = connectionManager.getApiClient(options.serverId);
var button = dom.parentWithTag(e.target, 'BUTTON');
var isChecked = !button.querySelector('.material-icons').classList.contains('recordingIcon-active');
const button = dom.parentWithTag(e.target, 'BUTTON');
const isChecked = !button.querySelector('.material-icons').classList.contains('recordingIcon-active');
if (isChecked) {
options.parent.querySelector('.recordSeriesContainer').classList.remove('hide');
if (!this.SeriesTimerId) {
var promise = this.TimerId ?
const promise = this.TimerId ?
recordingHelper.changeRecordingToSeries(apiClient, this.TimerId, options.programId) :
recordingHelper.createRecording(apiClient, options.programId, true);
promise.then(function () {
@ -210,47 +259,6 @@ define(['globalize', 'connectionManager', 'serverNotifications', 'require', 'loa
});
}
}
}
}
RecordingEditor.prototype.embed = function () {
var self = this;
return new Promise(function (resolve, reject) {
require(['text!./recordingfields.template.html'], function (template) {
var options = self.options;
var context = options.parent;
context.innerHTML = globalize.translateHtml(template, 'core');
context.querySelector('.singleRecordingButton').addEventListener('click', onRecordChange.bind(self));
context.querySelector('.seriesRecordingButton').addEventListener('click', onRecordSeriesChange.bind(self));
context.querySelector('.btnManageRecording').addEventListener('click', onManageRecordingClick.bind(self));
context.querySelector('.btnManageSeriesRecording').addEventListener('click', onManageSeriesRecordingClick.bind(self));
fetchData(self).then(resolve);
});
});
};
RecordingEditor.prototype.hasChanged = function () {
return this.changed;
};
RecordingEditor.prototype.refresh = function () {
fetchData(this);
};
RecordingEditor.prototype.destroy = function () {
var timerChangedHandler = this.timerChangedHandler;
this.timerChangedHandler = null;
events.off(serverNotifications, 'TimerCreated', timerChangedHandler);
events.off(serverNotifications, 'TimerCancelled', timerChangedHandler);
var seriesTimerChangedHandler = this.seriesTimerChangedHandler;
this.seriesTimerChangedHandler = null;
events.off(serverNotifications, 'SeriesTimerCreated', seriesTimerChangedHandler);
events.off(serverNotifications, 'SeriesTimerCancelled', seriesTimerChangedHandler);
};
return RecordingEditor;
});
export default RecordingEditor;