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 #1750 from Camc314/migrate-to-ES6-60

Browse source 
Migration of recordingbutton and recordingcreator to ES6 modules
This commit is contained in:
Bond-009 2020-08-09 14:05:14 +02:00 • committed by GitHub
commit 2e08dd7d0f
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 242 additions and 223 deletions
Download patch file Download diff file Expand all files Collapse all files

2
package.json
View file

@ -157,6 +157,8 @@
"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",

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

@ -1,19 +1,21 @@
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';
recordingHelper = recordingHelper.default || recordingHelper;
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;
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);
@ -22,16 +24,17 @@ define(['globalize', 'connectionManager', 'require', 'loading', 'apphost', 'dom'
}
function setButtonIcon(button, icon) {
var inner = button.querySelector('.material-icons');
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');
@ -41,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, {
@ -49,8 +52,49 @@ define(['globalize', 'connectionManager', 'require', 'loading', 'apphost', 'dom'
});
}
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) {
var status;
let status;
if (item.Type === 'SeriesTimer') {
return 'fiber_smart_record';
@ -71,45 +115,4 @@ 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;

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

@ -1,12 +1,27 @@
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';
layoutManager = layoutManager.default || layoutManager;
scrollHelper = scrollHelper.default || scrollHelper;
var currentDialog;
var closeAction;
var currentRecordingFields;
let currentDialog;
let closeAction;
let currentRecordingFields;
function closeDialog() {
dialogHelper.close(currentDialog);
@ -25,7 +40,7 @@ define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'c
}
function getImageUrl(item, apiClient, imageHeight) {
var imageTags = item.ImageTags || {};
const imageTags = item.ImageTags || {};
if (item.PrimaryImageTag) {
imageTags.Primary = item.PrimaryImageTag;
@ -50,8 +65,8 @@ define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'c
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" />';
@ -68,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 {
@ -88,14 +103,14 @@ define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'c
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);
});
@ -103,11 +118,11 @@ define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'c
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.default.play({
playbackManager.play({
ids: [item.ChannelId],
serverId: serverId
});
@ -123,8 +138,8 @@ define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'c
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
};
@ -135,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');
@ -184,7 +199,6 @@ define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'c
});
}
return {
export default {
show: showEditor
};
});