diff --git a/package.json b/package.json
index db2dd72826..75255f3892 100644
--- a/package.json
+++ b/package.json
@@ -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",
diff --git a/src/components/recordingcreator/recordingbutton.js b/src/components/recordingcreator/recordingbutton.js
index 1207208e90..9f102e2f9c 100644
--- a/src/components/recordingcreator/recordingbutton.js
+++ b/src/components/recordingcreator/recordingbutton.js
@@ -1,37 +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';
- recordingHelper = recordingHelper.default || recordingHelper;
+function onRecordingButtonClick(e) {
+ const item = this.item;
- function onRecordingButtonClick(e) {
- var item = this.item;
+ if (item) {
+ const serverId = item.ServerId;
+ const programId = item.Id;
+ const timerId = item.TimerId;
+ const timerStatus = item.Status;
+ const seriesTimerId = item.SeriesTimerId;
- if (item) {
- var serverId = item.ServerId;
- var programId = item.Id;
- var timerId = item.TimerId;
- var timerStatus = item.Status;
- var seriesTimerId = item.SeriesTimerId;
+ const instance = this;
- var instance = this;
-
- recordingHelper.toggleRecording(serverId, programId, timerId, timerStatus, seriesTimerId).then(function () {
- instance.refresh(serverId, programId);
- });
- }
+ recordingHelper.toggleRecording(serverId, programId, timerId, timerStatus, seriesTimerId).then(function () {
+ instance.refresh(serverId, programId);
+ });
}
+}
- function setButtonIcon(button, icon) {
- var inner = button.querySelector('.material-icons');
- inner.classList.remove('fiber_smart_record');
- inner.classList.remove('fiber_manual_record');
- inner.classList.add(icon);
- }
+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');
@@ -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,39 +52,17 @@ define(['globalize', 'connectionManager', 'require', 'loading', 'apphost', 'dom'
});
}
- function getIndicatorIcon(item) {
- var status;
-
- if (item.Type === 'SeriesTimer') {
- return 'fiber_smart_record';
- } else if (item.TimerId || item.SeriesTimerId) {
- status = item.Status || 'Cancelled';
- } else if (item.Type === 'Timer') {
- status = item.Status;
- } else {
- return 'fiber_manual_record';
- }
-
- if (item.SeriesTimerId) {
- if (status !== 'Cancelled') {
- return 'fiber_smart_record';
- }
- }
-
- return 'fiber_manual_record';
- }
-
- RecordingButton.prototype.refresh = function (serverId, itemId) {
- var apiClient = connectionManager.getApiClient(serverId);
- var self = this;
+ refresh(serverId, itemId) {
+ const apiClient = connectionManager.getApiClient(serverId);
+ const 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;
+ refreshItem(item) {
+ const options = this.options;
+ const button = options.button;
this.item = item;
setButtonIcon(button, getIndicatorIcon(item));
@@ -90,15 +71,15 @@ define(['globalize', 'connectionManager', 'require', 'loading', 'apphost', 'dom'
} else {
button.classList.remove('recordingIcon-active');
}
- };
+ }
- RecordingButton.prototype.destroy = function () {
- var options = this.options;
+ destroy() {
+ const options = this.options;
if (options) {
- var button = options.button;
+ const button = options.button;
- var clickFn = this.clickFn;
+ const clickFn = this.clickFn;
if (clickFn) {
dom.removeEventListener(button, 'click', clickFn, {
@@ -109,7 +90,29 @@ define(['globalize', 'connectionManager', 'require', 'loading', 'apphost', 'dom'
this.options = null;
this.item = null;
- };
+ }
+}
- return RecordingButton;
-});
+function getIndicatorIcon(item) {
+ let status;
+
+ if (item.Type === 'SeriesTimer') {
+ return 'fiber_smart_record';
+ } else if (item.TimerId || item.SeriesTimerId) {
+ status = item.Status || 'Cancelled';
+ } else if (item.Type === 'Timer') {
+ status = item.Status;
+ } else {
+ return 'fiber_manual_record';
+ }
+
+ if (item.SeriesTimerId) {
+ if (status !== 'Cancelled') {
+ return 'fiber_smart_record';
+ }
+ }
+
+ return 'fiber_manual_record';
+}
+
+export default RecordingButton;
diff --git a/src/components/recordingcreator/recordingcreator.js b/src/components/recordingcreator/recordingcreator.js
index d54dd219a8..f4ae64977d 100644
--- a/src/components/recordingcreator/recordingcreator.js
+++ b/src/components/recordingcreator/recordingcreator.js
@@ -1,190 +1,204 @@
-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;
+let currentDialog;
+let closeAction;
+let currentRecordingFields;
- var currentDialog;
- var closeAction;
- var currentRecordingFields;
+function closeDialog() {
+ dialogHelper.close(currentDialog);
+}
- function closeDialog() {
- dialogHelper.close(currentDialog);
+function init(context) {
+ context.querySelector('.btnPlay').addEventListener('click', function () {
+ closeAction = 'play';
+ closeDialog();
+ });
+
+ context.querySelector('.btnCancel').addEventListener('click', function () {
+ closeAction = null;
+ closeDialog();
+ });
+}
+
+function getImageUrl(item, apiClient, imageHeight) {
+ const imageTags = item.ImageTags || {};
+
+ if (item.PrimaryImageTag) {
+ imageTags.Primary = item.PrimaryImageTag;
}
- function init(context) {
- context.querySelector('.btnPlay').addEventListener('click', function () {
- closeAction = 'play';
- closeDialog();
+ if (imageTags.Primary) {
+ return apiClient.getScaledImageUrl(item.Id, {
+ type: 'Primary',
+ maxHeight: imageHeight,
+ tag: item.ImageTags.Primary
});
-
- context.querySelector('.btnCancel').addEventListener('click', function () {
- closeAction = null;
- closeDialog();
+ } else if (imageTags.Thumb) {
+ return apiClient.getScaledImageUrl(item.Id, {
+ type: 'Thumb',
+ maxHeight: imageHeight,
+ tag: item.ImageTags.Thumb
});
}
- function getImageUrl(item, apiClient, imageHeight) {
- var imageTags = item.ImageTags || {};
+ return null;
+}
- if (item.PrimaryImageTag) {
- imageTags.Primary = item.PrimaryImageTag;
+function renderRecording(context, defaultTimer, program, apiClient, refreshRecordingStateOnly) {
+ if (!refreshRecordingStateOnly) {
+ const imgUrl = getImageUrl(program, apiClient, 200);
+ const imageContainer = context.querySelector('.recordingDialog-imageContainer');
+
+ if (imgUrl) {
+ imageContainer.innerHTML = '.split('?')[0] + '/empty.png)
';
+ imageContainer.classList.remove('hide');
+
+ imageLoader.lazyChildren(imageContainer);
+ } else {
+ imageContainer.innerHTML = '';
+ imageContainer.classList.add('hide');
}
- if (imageTags.Primary) {
- return apiClient.getScaledImageUrl(item.Id, {
- type: 'Primary',
- maxHeight: imageHeight,
- tag: item.ImageTags.Primary
- });
- } else if (imageTags.Thumb) {
- return apiClient.getScaledImageUrl(item.Id, {
- type: 'Thumb',
- maxHeight: imageHeight,
- tag: item.ImageTags.Thumb
- });
+ context.querySelector('.recordingDialog-itemName').innerHTML = program.Name;
+ context.querySelector('.formDialogHeaderTitle').innerHTML = program.Name;
+ context.querySelector('.itemGenres').innerHTML = (program.Genres || []).join(' / ');
+ context.querySelector('.itemOverview').innerHTML = program.Overview || '';
+
+ 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 {
+ formDialogFooter.classList.add('hide');
}
- return null;
+ context.querySelector('.itemMiscInfoPrimary').innerHTML = mediaInfo.getPrimaryMediaInfoHtml(program);
}
- function renderRecording(context, defaultTimer, program, apiClient, refreshRecordingStateOnly) {
- if (!refreshRecordingStateOnly) {
- var imgUrl = getImageUrl(program, apiClient, 200);
- var imageContainer = context.querySelector('.recordingDialog-imageContainer');
+ context.querySelector('.itemMiscInfoSecondary').innerHTML = mediaInfo.getSecondaryMediaInfoHtml(program, {
+ });
- if (imgUrl) {
- imageContainer.innerHTML = '';
- imageContainer.classList.remove('hide');
+ loading.hide();
+}
- imageLoader.lazyChildren(imageContainer);
- } else {
- imageContainer.innerHTML = '';
- imageContainer.classList.add('hide');
- }
+function reload(context, programId, serverId, refreshRecordingStateOnly) {
+ loading.show();
- context.querySelector('.recordingDialog-itemName').innerHTML = program.Name;
- context.querySelector('.formDialogHeaderTitle').innerHTML = program.Name;
- context.querySelector('.itemGenres').innerHTML = (program.Genres || []).join(' / ');
- context.querySelector('.itemOverview').innerHTML = program.Overview || '';
+ const apiClient = connectionManager.getApiClient(serverId);
- var formDialogFooter = context.querySelector('.formDialogFooter');
- var now = new Date();
- if (now >= datetime.parseISO8601Date(program.StartDate, true) && now < datetime.parseISO8601Date(program.EndDate, true)) {
- formDialogFooter.classList.remove('hide');
- } else {
- formDialogFooter.classList.add('hide');
- }
+ const promise1 = apiClient.getNewLiveTvTimerDefaults({ programId: programId });
+ const promise2 = apiClient.getLiveTvProgram(programId, apiClient.getCurrentUserId());
- context.querySelector('.itemMiscInfoPrimary').innerHTML = mediaInfo.getPrimaryMediaInfoHtml(program);
- }
+ Promise.all([promise1, promise2]).then(function (responses) {
+ const defaults = responses[0];
+ const program = responses[1];
- context.querySelector('.itemMiscInfoSecondary').innerHTML = mediaInfo.getSecondaryMediaInfoHtml(program, {
- });
+ renderRecording(context, defaults, program, apiClient, refreshRecordingStateOnly);
+ });
+}
- loading.hide();
- }
+function executeCloseAction(action, programId, serverId) {
+ if (action === 'play') {
+ import('playbackManager').then(({default: playbackManager}) => {
+ const apiClient = connectionManager.getApiClient(serverId);
- function reload(context, programId, serverId, refreshRecordingStateOnly) {
- loading.show();
-
- var apiClient = connectionManager.getApiClient(serverId);
-
- var promise1 = apiClient.getNewLiveTvTimerDefaults({ programId: programId });
- var promise2 = apiClient.getLiveTvProgram(programId, apiClient.getCurrentUserId());
-
- Promise.all([promise1, promise2]).then(function (responses) {
- var defaults = responses[0];
- var program = responses[1];
-
- renderRecording(context, defaults, program, apiClient, refreshRecordingStateOnly);
- });
- }
-
- function executeCloseAction(action, programId, serverId) {
- if (action === 'play') {
- require(['playbackManager'], function (playbackManager) {
- var apiClient = connectionManager.getApiClient(serverId);
-
- apiClient.getLiveTvProgram(programId, apiClient.getCurrentUserId()).then(function (item) {
- playbackManager.default.play({
- ids: [item.ChannelId],
- serverId: serverId
- });
- });
- });
- return;
- }
- }
-
- function showEditor(itemId, serverId) {
- return new Promise(function (resolve, reject) {
- closeAction = null;
-
- loading.show();
-
- require(['text!./recordingcreator.template.html'], function (template) {
- var dialogOptions = {
- removeOnClose: true,
- scrollY: false
- };
-
- if (layoutManager.tv) {
- dialogOptions.size = 'fullscreen';
- } else {
- dialogOptions.size = 'small';
- }
-
- var dlg = dialogHelper.createDialog(dialogOptions);
-
- dlg.classList.add('formDialog');
- dlg.classList.add('recordingDialog');
-
- var html = '';
-
- html += globalize.translateHtml(template, 'core');
-
- dlg.innerHTML = html;
-
- currentDialog = dlg;
-
- function onRecordingChanged() {
- reload(dlg, itemId, serverId, true);
- }
-
- dlg.addEventListener('close', function () {
- events.off(currentRecordingFields, 'recordingchanged', onRecordingChanged);
- executeCloseAction(closeAction, itemId, serverId);
-
- if (currentRecordingFields && currentRecordingFields.hasChanged()) {
- resolve();
- } else {
- reject();
- }
- });
-
- if (layoutManager.tv) {
- scrollHelper.centerFocus.on(dlg.querySelector('.formDialogContent'), false);
- }
-
- init(dlg);
-
- reload(dlg, itemId, serverId);
-
- currentRecordingFields = new recordingFields({
- parent: dlg.querySelector('.recordingFields'),
- programId: itemId,
+ apiClient.getLiveTvProgram(programId, apiClient.getCurrentUserId()).then(function (item) {
+ playbackManager.play({
+ ids: [item.ChannelId],
serverId: serverId
});
-
- events.on(currentRecordingFields, 'recordingchanged', onRecordingChanged);
-
- dialogHelper.open(dlg);
});
});
+ return;
}
+}
- return {
- show: showEditor
- };
-});
+function showEditor(itemId, serverId) {
+ return new Promise(function (resolve, reject) {
+ closeAction = null;
+
+ loading.show();
+
+ import('text!./recordingcreator.template.html').then(({default: template}) => {
+ const dialogOptions = {
+ removeOnClose: true,
+ scrollY: false
+ };
+
+ if (layoutManager.tv) {
+ dialogOptions.size = 'fullscreen';
+ } else {
+ dialogOptions.size = 'small';
+ }
+
+ const dlg = dialogHelper.createDialog(dialogOptions);
+
+ dlg.classList.add('formDialog');
+ dlg.classList.add('recordingDialog');
+
+ let html = '';
+
+ html += globalize.translateHtml(template, 'core');
+
+ dlg.innerHTML = html;
+
+ currentDialog = dlg;
+
+ function onRecordingChanged() {
+ reload(dlg, itemId, serverId, true);
+ }
+
+ dlg.addEventListener('close', function () {
+ events.off(currentRecordingFields, 'recordingchanged', onRecordingChanged);
+ executeCloseAction(closeAction, itemId, serverId);
+
+ if (currentRecordingFields && currentRecordingFields.hasChanged()) {
+ resolve();
+ } else {
+ reject();
+ }
+ });
+
+ if (layoutManager.tv) {
+ scrollHelper.centerFocus.on(dlg.querySelector('.formDialogContent'), false);
+ }
+
+ init(dlg);
+
+ reload(dlg, itemId, serverId);
+
+ currentRecordingFields = new recordingFields({
+ parent: dlg.querySelector('.recordingFields'),
+ programId: itemId,
+ serverId: serverId
+ });
+
+ events.on(currentRecordingFields, 'recordingchanged', onRecordingChanged);
+
+ dialogHelper.open(dlg);
+ });
+ });
+}
+
+export default {
+ show: showEditor
+};
';
+ imageContainer.classList.remove('hide');
+
+ imageLoader.lazyChildren(imageContainer);
+ } else {
+ imageContainer.innerHTML = '';
+ imageContainer.classList.add('hide');
}
- if (imageTags.Primary) {
- return apiClient.getScaledImageUrl(item.Id, {
- type: 'Primary',
- maxHeight: imageHeight,
- tag: item.ImageTags.Primary
- });
- } else if (imageTags.Thumb) {
- return apiClient.getScaledImageUrl(item.Id, {
- type: 'Thumb',
- maxHeight: imageHeight,
- tag: item.ImageTags.Thumb
- });
+ context.querySelector('.recordingDialog-itemName').innerHTML = program.Name;
+ context.querySelector('.formDialogHeaderTitle').innerHTML = program.Name;
+ context.querySelector('.itemGenres').innerHTML = (program.Genres || []).join(' / ');
+ context.querySelector('.itemOverview').innerHTML = program.Overview || '';
+
+ 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 {
+ formDialogFooter.classList.add('hide');
}
- return null;
+ context.querySelector('.itemMiscInfoPrimary').innerHTML = mediaInfo.getPrimaryMediaInfoHtml(program);
}
- function renderRecording(context, defaultTimer, program, apiClient, refreshRecordingStateOnly) {
- if (!refreshRecordingStateOnly) {
- var imgUrl = getImageUrl(program, apiClient, 200);
- var imageContainer = context.querySelector('.recordingDialog-imageContainer');
+ context.querySelector('.itemMiscInfoSecondary').innerHTML = mediaInfo.getSecondaryMediaInfoHtml(program, {
+ });
- if (imgUrl) {
- imageContainer.innerHTML = '