mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
update recording editor
This commit is contained in:
parent
236922386b
commit
97f2044bc4
17 changed files with 268 additions and 261 deletions
|
@ -16,12 +16,12 @@
|
|||
},
|
||||
"devDependencies": {},
|
||||
"ignore": [],
|
||||
"version": "1.3.30",
|
||||
"_release": "1.3.30",
|
||||
"version": "1.3.37",
|
||||
"_release": "1.3.37",
|
||||
"_resolution": {
|
||||
"type": "version",
|
||||
"tag": "1.3.30",
|
||||
"commit": "0cce51a6d5a1ab91c305ba22a211ee87fdf1bea0"
|
||||
"tag": "1.3.37",
|
||||
"commit": "43c74d495f1fbdae6d86ac6608e934d396069806"
|
||||
},
|
||||
"_source": "https://github.com/MediaBrowser/emby-webcomponents.git",
|
||||
"_target": "^1.2.0",
|
||||
|
|
|
@ -15,7 +15,7 @@
|
|||
margin-left: .75em;
|
||||
}
|
||||
|
||||
.formDialog form {
|
||||
.formDialog .centeredContent {
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
|
@ -25,16 +25,19 @@
|
|||
|
||||
.formDialog .dialogContentInner {
|
||||
padding-bottom: 10vh;
|
||||
padding-top: 1em;
|
||||
}
|
||||
|
||||
.layout-tv .formDialog .dialogContentInner {
|
||||
padding-bottom: 50vh;
|
||||
}
|
||||
|
||||
.formDialog .centeredContent {
|
||||
max-width: 700px;
|
||||
}
|
||||
|
||||
@media all and (min-width: 1000px) {
|
||||
|
||||
.formDialog form {
|
||||
.layout-tv .formDialog .centeredContent {
|
||||
max-width: 70vw;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
define(['require', 'globalize', 'connectionManager', 'loading', 'scrollHelper', 'datetime', 'focusManager', 'imageLoader', 'events', 'layoutManager', 'itemShortcuts', 'registrationservices', 'clearButtonStyle', 'css!./guide.css', 'html!./../icons/mediainfo.html', 'html!./../icons/nav.html', 'scrollStyles'], function (require, globalize, connectionManager, loading, scrollHelper, datetime, focusManager, imageLoader, events, layoutManager, itemShortcuts, registrationServices) {
|
||||
define(['require', 'browser', 'globalize', 'connectionManager', 'loading', 'scrollHelper', 'datetime', 'focusManager', 'imageLoader', 'events', 'layoutManager', 'itemShortcuts', 'registrationservices', 'clearButtonStyle', 'css!./guide.css', 'html!./../icons/mediainfo.html', 'html!./../icons/nav.html', 'scrollStyles'], function (require, browser, globalize, connectionManager, loading, scrollHelper, datetime, focusManager, imageLoader, events, layoutManager, itemShortcuts, registrationServices) {
|
||||
|
||||
function Guide(options) {
|
||||
|
||||
|
@ -59,7 +59,7 @@
|
|||
|
||||
return registrationServices.validateFeature('livetv').then(function () {
|
||||
|
||||
var limit = 400;
|
||||
var limit = browser.mobile ? 100 : 400;
|
||||
|
||||
context.querySelector('.guideRequiresUnlock').classList.add('hide');
|
||||
|
||||
|
|
|
@ -1,3 +1,7 @@
|
|||
.recordingDialog .btnSubmit {
|
||||
background-color: #cc3333;
|
||||
}
|
||||
}
|
||||
|
||||
.layout-tv .btnHeaderSave {
|
||||
display: none;
|
||||
}
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="dialogContent smoothScrollY">
|
||||
<form class="dialogContentInner">
|
||||
<form class="dialogContentInner centeredContent">
|
||||
|
||||
<h1 class="itemName"></h1>
|
||||
<p class="itemEpisodeName"></p>
|
||||
|
@ -52,11 +52,11 @@
|
|||
<br />
|
||||
<emby-collapsible title="${Advanced}">
|
||||
<div>
|
||||
<paper-input type="number" id="txtPrePaddingMinutes" pattern="[0-9]*" required="required" min="0" step="1" label="${PrePaddingMinutes}"></paper-input>
|
||||
<paper-input type="number" id="txtPrePaddingMinutes" pattern="[0-9]*" required="required" min="0" step="1" label="${LabelPrePaddingMinutes}"></paper-input>
|
||||
</div>
|
||||
<br />
|
||||
<div>
|
||||
<paper-input type="number" id="txtPostPaddingMinutes" pattern="[0-9]*" required="required" min="0" step="1" label="${PostPaddingMinutes}"></paper-input>
|
||||
<paper-input type="number" id="txtPostPaddingMinutes" pattern="[0-9]*" required="required" min="0" step="1" label="${LabelPostPaddingMinutes}"></paper-input>
|
||||
</div>
|
||||
</emby-collapsible>
|
||||
<br />
|
||||
|
|
175
dashboard-ui/bower_components/emby-webcomponents/recordingcreator/recordingeditor.js
vendored
Normal file
175
dashboard-ui/bower_components/emby-webcomponents/recordingcreator/recordingeditor.js
vendored
Normal file
|
@ -0,0 +1,175 @@
|
|||
define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'connectionManager', 'require', 'loading', 'scrollHelper', 'scrollStyles', 'paper-checkbox', 'emby-collapsible', 'paper-input', 'paper-icon-button-light', 'css!./../formdialog', 'css!./recordingcreator', 'html!./../icons/mediainfo.html', 'html!./../icons/nav.html'], function (dialogHelper, globalize, layoutManager, mediaInfo, appHost, connectionManager, require, loading, scrollHelper) {
|
||||
|
||||
var currentDialog;
|
||||
var recordingUpdated = false;
|
||||
var currentItemId;
|
||||
var currentServerId;
|
||||
|
||||
function renderTimer(context, item) {
|
||||
|
||||
var programInfo = item.ProgramInfo || {};
|
||||
|
||||
context.querySelector('.itemName').innerHTML = item.Name;
|
||||
context.querySelector('.itemEpisodeName').innerHTML = programInfo.EpisodeTitle || '';
|
||||
|
||||
context.querySelector('.itemGenres').innerHTML = (programInfo.Genres || []).join(' / ');
|
||||
context.querySelector('.itemOverview').innerHTML = programInfo.Overview || '';
|
||||
|
||||
var timerPageImageContainer = context.querySelector('.timerPageImageContainer');
|
||||
|
||||
context.querySelector('.itemMiscInfoPrimary').innerHTML = mediaInfo.getPrimaryMediaInfoHtml(programInfo);
|
||||
context.querySelector('.itemMiscInfoSecondary').innerHTML = mediaInfo.getSecondaryMediaInfoHtml(programInfo);
|
||||
|
||||
context.querySelector('#txtPrePaddingMinutes').value = item.PrePaddingSeconds / 60;
|
||||
context.querySelector('#txtPostPaddingMinutes').value = item.PostPaddingSeconds / 60;
|
||||
|
||||
var timerStausElem = context.querySelector('.timerStatus');
|
||||
|
||||
if (item.Status == 'New') {
|
||||
timerStausElem.classList.add('hide');
|
||||
} else {
|
||||
timerStausElem.classList.remove('hide');
|
||||
timerStausElem.innerHTML = 'Status: ' + item.Status;
|
||||
}
|
||||
|
||||
loading.hide();
|
||||
}
|
||||
|
||||
function closeDialog(isSubmitted) {
|
||||
|
||||
recordingUpdated = isSubmitted;
|
||||
dialogHelper.close(currentDialog);
|
||||
}
|
||||
|
||||
function onSubmit(e) {
|
||||
|
||||
loading.show();
|
||||
|
||||
var form = this;
|
||||
|
||||
var apiClient = connectionManager.getApiClient(currentServerId);
|
||||
|
||||
apiClient.getLiveTvTimer(currentItemId).then(function (item) {
|
||||
|
||||
item.PrePaddingSeconds = form.querySelector('#txtPrePaddingMinutes').value * 60;
|
||||
item.PostPaddingSeconds = form.querySelector('#txtPostPaddingMinutes').value * 60;
|
||||
apiClient.updateLiveTvTimer(item).then(function () {
|
||||
loading.hide();
|
||||
require(['toast'], function (toast) {
|
||||
toast(Globalize.translate('MessageRecordingSaved'));
|
||||
closeDialog(true);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
e.preventDefault();
|
||||
|
||||
// Disable default form submission
|
||||
return false;
|
||||
}
|
||||
|
||||
function init(context) {
|
||||
|
||||
context.querySelector('.btnCancel').addEventListener('click', function () {
|
||||
|
||||
closeDialog(false);
|
||||
});
|
||||
|
||||
context.querySelector('form').addEventListener('submit', onSubmit);
|
||||
|
||||
context.querySelector('.btnHeaderSave').addEventListener('click', function (e) {
|
||||
|
||||
context.querySelector('.btnSubmit').click();
|
||||
});
|
||||
|
||||
context.querySelector('.btnSubmit').addEventListener('click', function () {
|
||||
|
||||
// Do a fake form submit this the button isn't a real submit button
|
||||
var fakeSubmit = document.createElement('input');
|
||||
fakeSubmit.setAttribute('type', 'submit');
|
||||
fakeSubmit.style.display = 'none';
|
||||
var form = context.querySelector('form');
|
||||
form.appendChild(fakeSubmit);
|
||||
fakeSubmit.click();
|
||||
|
||||
// Seeing issues in smart tv browsers where the form does not get submitted if the button is removed prior to the submission actually happening
|
||||
setTimeout(function () {
|
||||
form.removeChild(fakeSubmit);
|
||||
}, 500);
|
||||
});
|
||||
}
|
||||
|
||||
function reload(context, id) {
|
||||
|
||||
loading.show();
|
||||
currentItemId = id;
|
||||
|
||||
var apiClient = connectionManager.getApiClient(currentServerId);
|
||||
apiClient.getLiveTvTimer(id).then(function (result) {
|
||||
|
||||
renderTimer(context, result);
|
||||
loading.hide();
|
||||
});
|
||||
}
|
||||
|
||||
function showEditor(itemId, serverId) {
|
||||
|
||||
return new Promise(function (resolve, reject) {
|
||||
|
||||
recordingUpdated = false;
|
||||
currentServerId = serverId;
|
||||
loading.show();
|
||||
|
||||
require(['text!./recordingeditor.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.translateDocument(template, 'sharedcomponents');
|
||||
|
||||
dlg.innerHTML = html;
|
||||
document.body.appendChild(dlg);
|
||||
|
||||
currentDialog = dlg;
|
||||
|
||||
dlg.addEventListener('close', function () {
|
||||
|
||||
if (recordingUpdated) {
|
||||
resolve();
|
||||
} else {
|
||||
reject();
|
||||
}
|
||||
});
|
||||
|
||||
if (layoutManager.tv) {
|
||||
scrollHelper.centerFocus.on(dlg.querySelector('.dialogContent'), false);
|
||||
}
|
||||
|
||||
init(dlg);
|
||||
|
||||
reload(dlg, itemId);
|
||||
|
||||
dialogHelper.open(dlg);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
return {
|
||||
show: showEditor
|
||||
};
|
||||
});
|
43
dashboard-ui/bower_components/emby-webcomponents/recordingcreator/recordingeditor.template.html
vendored
Normal file
43
dashboard-ui/bower_components/emby-webcomponents/recordingcreator/recordingeditor.template.html
vendored
Normal file
|
@ -0,0 +1,43 @@
|
|||
<div class="dialogHeader" style="margin:0 0 2em;">
|
||||
<button is="paper-icon-button-light" class="btnCancel" tabindex="-1"><iron-icon icon="arrow-back"></iron-icon></button>
|
||||
<div class="dialogHeaderTitle">
|
||||
${Edit}
|
||||
</div>
|
||||
<div style="margin-left:auto; display: flex; align-items: center; justify-content: center;">
|
||||
<paper-button class="btnHeaderSave accent" tabindex="-1">
|
||||
<iron-icon icon="check"></iron-icon>
|
||||
<span>${Save}</span>
|
||||
</paper-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="dialogContent smoothScrollY">
|
||||
<div class="dialogContentInner centeredContent">
|
||||
<h1 class="itemName"></h1>
|
||||
<p class="itemEpisodeName"></p>
|
||||
<p class="itemMiscInfoPrimary" style="display: flex; align-items: center;"></p>
|
||||
<p class="itemMiscInfoSecondary" style="display: flex; align-items: center;"></p>
|
||||
<p class="itemGenres"></p>
|
||||
<p class="itemOverview"></p>
|
||||
|
||||
<p style="margin-top: 2em;" class="timerStatus hide">
|
||||
</p>
|
||||
|
||||
<form>
|
||||
<br />
|
||||
<div>
|
||||
<paper-input type="number" id="txtPrePaddingMinutes" pattern="[0-9]*" required="required" min="0" step="1" label="${LabelPrePaddingMinutes}"></paper-input>
|
||||
</div>
|
||||
<br />
|
||||
<div>
|
||||
<paper-input type="number" id="txtPostPaddingMinutes" pattern="[0-9]*" required="required" min="0" step="1" label="${LabelPostPaddingMinutes}"></paper-input>
|
||||
</div>
|
||||
<br />
|
||||
<br />
|
||||
<paper-button raised class="btnSubmit block"><iron-icon icon="mediainfo:fiber-manual-record"></iron-icon><span>${Save}</span></paper-button>
|
||||
<br />
|
||||
<br />
|
||||
<br />
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
|
@ -34,8 +34,8 @@
|
|||
"Saturday": "Saturday",
|
||||
"Days": "Days",
|
||||
"RecordSeries": "Record series",
|
||||
"PrePaddingMinutes": "Pre-padding minutes:",
|
||||
"PostPaddingMinutes": "Post-padding minutes:",
|
||||
"LabelPrePaddingMinutes": "Pre-padding minutes:",
|
||||
"LabelPostPaddingMinutes": "Post-padding minutes:",
|
||||
"RecordOnAllChannels": "Record on all channels",
|
||||
"RecordAnytime": "Record at any time",
|
||||
"RecordOnlyNewEpisodes": "Record only new episodes",
|
||||
|
@ -46,6 +46,8 @@
|
|||
"OptionConvertRecordingsToStreamingFormatHelp": "Recordings will be converted on the fly to MP4 for easy playback on your devices.",
|
||||
"FeatureRequiresEmbyPremiere": "This feature requires an active Emby Premiere subscription.",
|
||||
"Record": "Record",
|
||||
"Save": "Save",
|
||||
"Edit": "Edit",
|
||||
"Download": "Download",
|
||||
"Advanced": "Advanced",
|
||||
"Refresh": "Refresh",
|
||||
|
|
|
@ -1,6 +1,7 @@
|
|||
define(['browser'], function (browser) {
|
||||
|
||||
var allPages = document.querySelectorAll('.mainAnimatedPage');
|
||||
var currentUrls = [];
|
||||
var pageContainerCount = allPages.length;
|
||||
var animationDuration = 500;
|
||||
var allowAnimation = true;
|
||||
|
@ -39,7 +40,6 @@ define(['browser'], function (browser) {
|
|||
if (options.type) {
|
||||
view.setAttribute('data-type', options.type);
|
||||
}
|
||||
view.setAttribute('data-url', options.url);
|
||||
view.innerHTML = options.view;
|
||||
|
||||
var animatable = allPages[pageIndex];
|
||||
|
@ -63,6 +63,7 @@ define(['browser'], function (browser) {
|
|||
return animate(animatable, previousAnimatable, options.transition, options.isBack).then(function () {
|
||||
|
||||
selectedPageIndex = pageIndex;
|
||||
currentUrls[pageIndex] = options.url;
|
||||
if (!options.cancel && previousAnimatable) {
|
||||
afterAnimate(allPages, pageIndex);
|
||||
}
|
||||
|
@ -225,22 +226,15 @@ define(['browser'], function (browser) {
|
|||
}
|
||||
|
||||
function tryRestoreView(options) {
|
||||
|
||||
var url = options.url;
|
||||
var view = document.querySelector(".page-view[data-url='" + url + "']");
|
||||
var page = parentWithClass(view, 'mainAnimatedPage');
|
||||
var index = currentUrls.indexOf(url);
|
||||
|
||||
if (view) {
|
||||
if (index != -1) {
|
||||
var page = allPages[index];
|
||||
var view = page.querySelector(".page-view");
|
||||
|
||||
var index = -1;
|
||||
var pages = allPages;
|
||||
for (var i = 0, length = pages.length; i < length; i++) {
|
||||
if (pages[i] == page) {
|
||||
index = i;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
if (index != -1) {
|
||||
if (view) {
|
||||
|
||||
if (options.cancel) {
|
||||
return;
|
||||
|
@ -278,14 +272,7 @@ define(['browser'], function (browser) {
|
|||
|
||||
function reset() {
|
||||
|
||||
var views = document.querySelectorAll(".mainAnimatedPage.hide .page-view");
|
||||
|
||||
for (var i = 0, length = views.length; i < length; i++) {
|
||||
|
||||
var view = views[i];
|
||||
triggerDestroy(view);
|
||||
view.parentNode.removeChild(view);
|
||||
}
|
||||
currentUrls = [];
|
||||
}
|
||||
|
||||
function parentWithClass(elem, className) {
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue