mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
update live tv tabs
This commit is contained in:
parent
26dcecb51f
commit
2fd65cdcd9
7 changed files with 513 additions and 502 deletions
|
@ -1,170 +1,170 @@
|
|||
define(['jQuery'], function ($) {
|
||||
|
||||
function getRecordingGroupHtml(group) {
|
||||
|
||||
var html = '';
|
||||
|
||||
html += '<paper-icon-item>';
|
||||
|
||||
html += '<paper-fab mini class="blue" icon="live-tv" item-icon></paper-fab>';
|
||||
|
||||
html += '<paper-item-body two-line>';
|
||||
html += '<a href="livetvrecordinglist.html?groupid=' + group.Id + '" class="clearLink">';
|
||||
|
||||
html += '<div>';
|
||||
html += group.Name;
|
||||
html += '</div>';
|
||||
|
||||
html += '<div secondary>';
|
||||
if (group.RecordingCount == 1) {
|
||||
html += Globalize.translate('ValueItemCount', group.RecordingCount);
|
||||
} else {
|
||||
html += Globalize.translate('ValueItemCountPlural', group.RecordingCount);
|
||||
}
|
||||
html += '</div>';
|
||||
|
||||
html += '</a>';
|
||||
html += '</paper-item-body>';
|
||||
html += '</paper-icon-item>';
|
||||
|
||||
return html;
|
||||
}
|
||||
|
||||
function renderRecordingGroups(page, groups) {
|
||||
|
||||
if (groups.length) {
|
||||
$('#recordingGroups', page).show();
|
||||
} else {
|
||||
$('#recordingGroups', page).hide();
|
||||
}
|
||||
|
||||
var html = '';
|
||||
|
||||
html += '<div class="paperList">';
|
||||
|
||||
for (var i = 0, length = groups.length; i < length; i++) {
|
||||
|
||||
html += getRecordingGroupHtml(groups[i]);
|
||||
}
|
||||
|
||||
html += '</div>';
|
||||
|
||||
page.querySelector('#recordingGroupItems').innerHTML = html;
|
||||
|
||||
Dashboard.hideLoadingMsg();
|
||||
}
|
||||
|
||||
function renderRecordings(elem, recordings) {
|
||||
|
||||
if (recordings.length) {
|
||||
elem.classList.remove('hide');
|
||||
} else {
|
||||
elem.classList.add('hide');
|
||||
}
|
||||
|
||||
var recordingItems = elem.querySelector('.recordingItems');
|
||||
recordingItems.innerHTML = LibraryBrowser.getPosterViewHtml({
|
||||
items: recordings,
|
||||
shape: "auto",
|
||||
showTitle: true,
|
||||
showParentTitle: true,
|
||||
centerText: true,
|
||||
coverImage: true,
|
||||
lazy: true,
|
||||
overlayPlayButton: true
|
||||
|
||||
});
|
||||
|
||||
ImageLoader.lazyChildren(recordingItems);
|
||||
}
|
||||
|
||||
function renderActiveRecordings(page) {
|
||||
|
||||
ApiClient.getLiveTvRecordings({
|
||||
|
||||
userId: Dashboard.getCurrentUserId(),
|
||||
IsInProgress: true,
|
||||
Fields: 'CanDelete'
|
||||
|
||||
}).then(function (result) {
|
||||
|
||||
renderRecordings(page.querySelector('#activeRecordings'), result.Items);
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
function renderLatestRecordings(page) {
|
||||
|
||||
ApiClient.getLiveTvRecordings({
|
||||
|
||||
userId: Dashboard.getCurrentUserId(),
|
||||
limit: 4,
|
||||
IsInProgress: false,
|
||||
Fields: 'CanDelete,PrimaryImageAspectRatio'
|
||||
|
||||
}).then(function (result) {
|
||||
|
||||
renderRecordings(page.querySelector('#latestRecordings'), result.Items);
|
||||
});
|
||||
}
|
||||
|
||||
function renderTimers(page, timers) {
|
||||
|
||||
LiveTvHelpers.getTimersHtml(timers).then(function (html) {
|
||||
|
||||
var elem = page.querySelector('#upcomingRecordings');
|
||||
|
||||
if (html) {
|
||||
elem.classList.remove('hide');
|
||||
} else {
|
||||
elem.classList.add('hide');
|
||||
}
|
||||
|
||||
elem.querySelector('.recordingItems').innerHTML = html;
|
||||
|
||||
ImageLoader.lazyChildren(elem);
|
||||
$(elem).createCardMenus();
|
||||
});
|
||||
}
|
||||
|
||||
function renderUpcomingRecordings(page) {
|
||||
|
||||
ApiClient.getLiveTvTimers().then(function (result) {
|
||||
|
||||
renderTimers(page, result.Items);
|
||||
});
|
||||
}
|
||||
|
||||
function reload(page) {
|
||||
|
||||
Dashboard.showLoadingMsg();
|
||||
|
||||
renderUpcomingRecordings(page);
|
||||
renderActiveRecordings(page);
|
||||
renderLatestRecordings(page);
|
||||
|
||||
ApiClient.getLiveTvRecordingGroups({
|
||||
|
||||
userId: Dashboard.getCurrentUserId()
|
||||
|
||||
}).then(function (result) {
|
||||
|
||||
require(['paper-fab', 'paper-item-body', 'paper-icon-item'], function () {
|
||||
renderRecordingGroups(page, result.Items);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
window.LiveTvPage.initRecordingsTab = function (page, tabContent) {
|
||||
|
||||
tabContent.querySelector('#upcomingRecordings .recordingItems').addEventListener('timercancelled', function () {
|
||||
reload(tabContent);
|
||||
});
|
||||
};
|
||||
|
||||
window.LiveTvPage.renderRecordingsTab = function (page, tabContent) {
|
||||
|
||||
reload(tabContent);
|
||||
};
|
||||
|
||||
define(['jQuery', 'scripts/livetvcomponents'], function ($) {
|
||||
|
||||
function getRecordingGroupHtml(group) {
|
||||
|
||||
var html = '';
|
||||
|
||||
html += '<paper-icon-item>';
|
||||
|
||||
html += '<paper-fab mini class="blue" icon="live-tv" item-icon></paper-fab>';
|
||||
|
||||
html += '<paper-item-body two-line>';
|
||||
html += '<a href="livetvrecordinglist.html?groupid=' + group.Id + '" class="clearLink">';
|
||||
|
||||
html += '<div>';
|
||||
html += group.Name;
|
||||
html += '</div>';
|
||||
|
||||
html += '<div secondary>';
|
||||
if (group.RecordingCount == 1) {
|
||||
html += Globalize.translate('ValueItemCount', group.RecordingCount);
|
||||
} else {
|
||||
html += Globalize.translate('ValueItemCountPlural', group.RecordingCount);
|
||||
}
|
||||
html += '</div>';
|
||||
|
||||
html += '</a>';
|
||||
html += '</paper-item-body>';
|
||||
html += '</paper-icon-item>';
|
||||
|
||||
return html;
|
||||
}
|
||||
|
||||
function renderRecordingGroups(context, groups) {
|
||||
|
||||
if (groups.length) {
|
||||
$('#recordingGroups', context).show();
|
||||
} else {
|
||||
$('#recordingGroups', context).hide();
|
||||
}
|
||||
|
||||
var html = '';
|
||||
|
||||
html += '<div class="paperList">';
|
||||
|
||||
for (var i = 0, length = groups.length; i < length; i++) {
|
||||
|
||||
html += getRecordingGroupHtml(groups[i]);
|
||||
}
|
||||
|
||||
html += '</div>';
|
||||
|
||||
context.querySelector('#recordingGroupItems').innerHTML = html;
|
||||
|
||||
Dashboard.hideLoadingMsg();
|
||||
}
|
||||
|
||||
function renderRecordings(elem, recordings) {
|
||||
|
||||
if (recordings.length) {
|
||||
elem.classList.remove('hide');
|
||||
} else {
|
||||
elem.classList.add('hide');
|
||||
}
|
||||
|
||||
var recordingItems = elem.querySelector('.recordingItems');
|
||||
recordingItems.innerHTML = LibraryBrowser.getPosterViewHtml({
|
||||
items: recordings,
|
||||
shape: "auto",
|
||||
showTitle: true,
|
||||
showParentTitle: true,
|
||||
centerText: true,
|
||||
coverImage: true,
|
||||
lazy: true,
|
||||
overlayPlayButton: true
|
||||
|
||||
});
|
||||
|
||||
ImageLoader.lazyChildren(recordingItems);
|
||||
}
|
||||
|
||||
function renderActiveRecordings(context) {
|
||||
|
||||
ApiClient.getLiveTvRecordings({
|
||||
|
||||
userId: Dashboard.getCurrentUserId(),
|
||||
IsInProgress: true,
|
||||
Fields: 'CanDelete'
|
||||
|
||||
}).then(function (result) {
|
||||
|
||||
renderRecordings(context.querySelector('#activeRecordings'), result.Items);
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
function renderLatestRecordings(context) {
|
||||
|
||||
ApiClient.getLiveTvRecordings({
|
||||
|
||||
userId: Dashboard.getCurrentUserId(),
|
||||
limit: 4,
|
||||
IsInProgress: false,
|
||||
Fields: 'CanDelete,PrimaryImageAspectRatio'
|
||||
|
||||
}).then(function (result) {
|
||||
|
||||
renderRecordings(context.querySelector('#latestRecordings'), result.Items);
|
||||
});
|
||||
}
|
||||
|
||||
function renderTimers(context, timers) {
|
||||
|
||||
LiveTvHelpers.getTimersHtml(timers).then(function (html) {
|
||||
|
||||
var elem = context.querySelector('#upcomingRecordings');
|
||||
|
||||
if (html) {
|
||||
elem.classList.remove('hide');
|
||||
} else {
|
||||
elem.classList.add('hide');
|
||||
}
|
||||
|
||||
elem.querySelector('.recordingItems').innerHTML = html;
|
||||
|
||||
ImageLoader.lazyChildren(elem);
|
||||
$(elem).createCardMenus();
|
||||
});
|
||||
}
|
||||
|
||||
function renderUpcomingRecordings(context) {
|
||||
|
||||
ApiClient.getLiveTvTimers().then(function (result) {
|
||||
|
||||
renderTimers(context, result.Items);
|
||||
});
|
||||
}
|
||||
|
||||
function reload(context) {
|
||||
|
||||
Dashboard.showLoadingMsg();
|
||||
|
||||
renderUpcomingRecordings(context);
|
||||
renderActiveRecordings(context);
|
||||
renderLatestRecordings(context);
|
||||
|
||||
ApiClient.getLiveTvRecordingGroups({
|
||||
|
||||
userId: Dashboard.getCurrentUserId()
|
||||
|
||||
}).then(function (result) {
|
||||
|
||||
require(['paper-fab', 'paper-item-body', 'paper-icon-item'], function () {
|
||||
renderRecordingGroups(context, result.Items);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
return function (view, params, tabContent) {
|
||||
|
||||
var self = this;
|
||||
tabContent.querySelector('#upcomingRecordings .recordingItems').addEventListener('timercancelled', function () {
|
||||
reload(tabContent);
|
||||
});
|
||||
|
||||
self.renderTab = function () {
|
||||
reload(tabContent);
|
||||
};
|
||||
};
|
||||
|
||||
});
|
Loading…
Add table
Add a link
Reference in a new issue