1
0
Fork 0
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:
Luke Pulverenti 2016-05-15 13:11:26 -04:00
parent 26dcecb51f
commit 2fd65cdcd9
7 changed files with 513 additions and 502 deletions

View file

@ -1,4 +1,4 @@
<div id="liveTvSuggestedPage" data-dom-cache="true" data-role="page" class="page libraryPage liveTvPage pageWithAbsoluteTabs" data-contextname="${HeaderLiveTv}" data-backdroptype="series,movie" data-require="scripts/livetvsuggested,livetvcss,scripts/livetvcomponents,paper-checkbox">
<div id="liveTvSuggestedPage" data-dom-cache="true" data-role="page" class="page libraryPage liveTvPage pageWithAbsoluteTabs" data-contextname="${HeaderLiveTv}" data-backdroptype="series,movie">
<div class="libraryViewNav">
<button class="pageTabButton is-active" data-index="0">${TabSuggestions}</button>

View file

@ -1,5 +1,8 @@
define(['jQuery'], function ($) {
return function (view, params, tabContent) {
var self = this;
var data = {};
function getPageData(context) {
@ -45,11 +48,11 @@
});
}
function renderChannels(page, result) {
function renderChannels(context, result) {
var query = getQuery(page);
var query = getQuery(context);
$('.listTopPaging', page).html(LibraryBrowser.getQueryPagingHtml({
$('.listTopPaging', context).html(LibraryBrowser.getQueryPagingHtml({
startIndex: query.StartIndex,
limit: query.Limit,
totalRecordCount: result.TotalRecordCount,
@ -60,63 +63,64 @@
var html = getChannelsHtml(result.Items);
var elem = page.querySelector('#items');
var elem = context.querySelector('#items');
elem.innerHTML = html;
ImageLoader.lazyChildren(elem);
$('.btnNextPage', page).on('click', function () {
$('.btnNextPage', context).on('click', function () {
query.StartIndex += query.Limit;
reloadItems(page);
reloadItems(context);
});
$('.btnPreviousPage', page).on('click', function () {
$('.btnPreviousPage', context).on('click', function () {
query.StartIndex -= query.Limit;
reloadItems(page);
reloadItems(context);
});
$('.btnFilter', page).on('click', function () {
showFilterMenu(page);
$('.btnFilter', context).on('click', function () {
showFilterMenu(context);
});
LibraryBrowser.saveQueryValues(getSavedQueryKey(page), query);
LibraryBrowser.saveQueryValues(getSavedQueryKey(context), query);
}
function showFilterMenu(page) {
function showFilterMenu(context) {
require(['components/filterdialog/filterdialog'], function (filterDialogFactory) {
var filterDialog = new filterDialogFactory({
query: getQuery(page),
query: getQuery(context),
mode: 'livetvchannels'
});
Events.on(filterDialog, 'filterchange', function () {
reloadItems(page);
reloadItems(context);
});
filterDialog.show();
});
}
function reloadItems(page) {
function reloadItems(context) {
Dashboard.showLoadingMsg();
var query = getQuery(page);
var query = getQuery(context);
query.UserId = Dashboard.getCurrentUserId();
ApiClient.getLiveTvChannels(query).then(function (result) {
renderChannels(page, result);
renderChannels(context, result);
Dashboard.hideLoadingMsg();
});
}
window.LiveTvPage.renderChannelsTab = function (page, tabContent) {
self.renderTab = function () {
reloadItems(tabContent);
};
};
});

View file

@ -1,17 +1,15 @@
define(['tvguide'], function (tvguide) {
window.LiveTvPage.initGuideTab = function (page, tabContent) {
return function (view, params, tabContent) {
};
window.LiveTvPage.renderGuideTab = function (page, tabContent) {
if (!page.guideInstance) {
page.guideInstance = new tvguide({
var self = this;
var guideInstance;
self.renderTab = function () {
if (!guideInstance) {
guideInstance = new tvguide({
element: tabContent
});
}
};
};
});

View file

@ -1,4 +1,4 @@
define(['jQuery'], function ($) {
define(['jQuery', 'scripts/livetvcomponents'], function ($) {
function getRecordingGroupHtml(group) {
@ -30,12 +30,12 @@
return html;
}
function renderRecordingGroups(page, groups) {
function renderRecordingGroups(context, groups) {
if (groups.length) {
$('#recordingGroups', page).show();
$('#recordingGroups', context).show();
} else {
$('#recordingGroups', page).hide();
$('#recordingGroups', context).hide();
}
var html = '';
@ -49,7 +49,7 @@
html += '</div>';
page.querySelector('#recordingGroupItems').innerHTML = html;
context.querySelector('#recordingGroupItems').innerHTML = html;
Dashboard.hideLoadingMsg();
}
@ -78,7 +78,7 @@
ImageLoader.lazyChildren(recordingItems);
}
function renderActiveRecordings(page) {
function renderActiveRecordings(context) {
ApiClient.getLiveTvRecordings({
@ -88,12 +88,12 @@
}).then(function (result) {
renderRecordings(page.querySelector('#activeRecordings'), result.Items);
renderRecordings(context.querySelector('#activeRecordings'), result.Items);
});
}
function renderLatestRecordings(page) {
function renderLatestRecordings(context) {
ApiClient.getLiveTvRecordings({
@ -104,15 +104,15 @@
}).then(function (result) {
renderRecordings(page.querySelector('#latestRecordings'), result.Items);
renderRecordings(context.querySelector('#latestRecordings'), result.Items);
});
}
function renderTimers(page, timers) {
function renderTimers(context, timers) {
LiveTvHelpers.getTimersHtml(timers).then(function (html) {
var elem = page.querySelector('#upcomingRecordings');
var elem = context.querySelector('#upcomingRecordings');
if (html) {
elem.classList.remove('hide');
@ -127,21 +127,21 @@
});
}
function renderUpcomingRecordings(page) {
function renderUpcomingRecordings(context) {
ApiClient.getLiveTvTimers().then(function (result) {
renderTimers(page, result.Items);
renderTimers(context, result.Items);
});
}
function reload(page) {
function reload(context) {
Dashboard.showLoadingMsg();
renderUpcomingRecordings(page);
renderActiveRecordings(page);
renderLatestRecordings(page);
renderUpcomingRecordings(context);
renderActiveRecordings(context);
renderLatestRecordings(context);
ApiClient.getLiveTvRecordingGroups({
@ -150,21 +150,21 @@
}).then(function (result) {
require(['paper-fab', 'paper-item-body', 'paper-icon-item'], function () {
renderRecordingGroups(page, result.Items);
renderRecordingGroups(context, result.Items);
});
});
}
window.LiveTvPage.initRecordingsTab = function (page, tabContent) {
return function (view, params, tabContent) {
var self = this;
tabContent.querySelector('#upcomingRecordings .recordingItems').addEventListener('timercancelled', function () {
reload(tabContent);
});
};
window.LiveTvPage.renderRecordingsTab = function (page, tabContent) {
self.renderTab = function () {
reload(tabContent);
};
};
});

View file

@ -6,7 +6,7 @@
SortOrder: "Ascending"
};
function deleteSeriesTimer(page, id) {
function deleteSeriesTimer(context, id) {
require(['confirm'], function (confirm) {
@ -20,13 +20,13 @@
toast(Globalize.translate('MessageSeriesCancelled'));
});
reload(page);
reload(context);
});
});
});
}
function renderTimers(page, timers) {
function renderTimers(context, timers) {
var html = '';
@ -88,32 +88,36 @@
html += '</div>';
}
var elem = $('#items', page).html(html);
var elem = $('#items', context).html(html);
$('.btnCancelSeries', elem).on('click', function () {
deleteSeriesTimer(page, this.getAttribute('data-seriestimerid'));
deleteSeriesTimer(context, this.getAttribute('data-seriestimerid'));
});
Dashboard.hideLoadingMsg();
}
function reload(page) {
function reload(context) {
Dashboard.showLoadingMsg();
ApiClient.getLiveTvSeriesTimers(query).then(function (result) {
require(['paper-fab', 'paper-item-body', 'paper-icon-item'], function () {
renderTimers(page, result.Items);
renderTimers(context, result.Items);
});
});
}
window.LiveTvPage.renderSeriesTimersTab = function (page, tabContent) {
return function (view, params, tabContent) {
var self = this;
self.renderTab = function () {
reload(tabContent);
};
};
});

View file

@ -125,106 +125,110 @@
ImageLoader.lazyChildren(elem);
}
function initSuggestedTab(page, tabContent) {
return function (view, params) {
var self = this;
self.initTab = function () {
var tabContent = view.querySelector('.pageTabContent[data-index=\'' + 0 + '\']');
if (enableScrollX()) {
$('.itemsContainer', tabContent).addClass('hiddenScrollX').createCardMenus();
} else {
$('.itemsContainer', tabContent).removeClass('hiddenScrollX').createCardMenus();
}
}
function renderSuggestedTab(page, tabContent) {
};
self.renderTab = function () {
var tabContent = view.querySelector('.pageTabContent[data-index=\'' + 0 + '\']');
reload(tabContent);
}
};
var tabControllers = [];
var renderedTabs = [];
function loadTab(page, index) {
var tabContent = page.querySelector('.pageTabContent[data-index=\'' + index + '\']');
var depends = [];
var scope = 'LiveTvPage';
var renderMethod = '';
var initMethod = '';
var viewMenuBar = document.querySelector('.viewMenuBar');
switch (index) {
case 0:
renderMethod = 'renderSuggestedTab';
initMethod = 'initSuggestedTab';
break;
case 1:
depends.push('registrationservices');
depends.push('scripts/livetvguide');
renderMethod = 'renderGuideTab';
initMethod = 'initGuideTab';
break;
case 2:
depends.push('scripts/livetvchannels');
depends.push('paper-icon-item');
depends.push('paper-item-body');
renderMethod = 'renderChannelsTab';
break;
case 3:
depends.push('scripts/livetvrecordings');
initMethod = 'initRecordingsTab';
renderMethod = 'renderRecordingsTab';
break;
case 4:
depends.push('scripts/livetvseriestimers');
renderMethod = 'renderSeriesTimersTab';
break;
default:
break;
}
require(depends, function () {
require(depends, function (controllerFactory) {
if (initMethod && !tabContent.initComplete) {
if (index == 0) {
self.tabContent = tabContent;
}
var controller = tabControllers[index];
if (!controller) {
controller = index ? new controllerFactory(view, params, tabContent) : self;
tabControllers[index] = controller;
window[scope][initMethod](page, tabContent);
tabContent.initComplete = true;
if (controller.initTab) {
controller.initTab();
}
}
window[scope][renderMethod](page, tabContent);
if (renderedTabs.indexOf(index) == -1) {
renderedTabs.push(index);
controller.renderTab();
}
});
}
pageIdOn('pageinit', "liveTvSuggestedPage", function () {
var mdlTabs = view.querySelector('.libraryViewNav');
var page = this;
var baseUrl = 'tv.html';
var topParentId = params.topParentId;
if (topParentId) {
baseUrl += '?topParentId=' + topParentId;
}
var mdlTabs = page.querySelector('.libraryViewNav');
libraryBrowser.configurePaperLibraryTabs(page, mdlTabs, page.querySelectorAll('.pageTabContent'));
libraryBrowser.configurePaperLibraryTabs(view, mdlTabs, view.querySelectorAll('.pageTabContent'));
mdlTabs.addEventListener('tabchange', function (e) {
loadTab(page, parseInt(e.detail.selectedTabIndex));
});
loadTab(view, parseInt(e.detail.selectedTabIndex));
});
pageIdOn('viewshow', "liveTvSuggestedPage", function () {
var page = this;
view.addEventListener('viewshow', function (e) {
// Needed on the guide tab
// Ideally this should be moved to the guide tab on show/hide
document.body.classList.add('autoScrollY');
});
pageIdOn('viewbeforehide', "liveTvSuggestedPage", function () {
var page = this;
view.addEventListener('viewbeforehide', function (e) {
document.body.classList.remove('autoScrollY');
});
window.LiveTvPage = {
renderSuggestedTab: renderSuggestedTab,
initSuggestedTab: initSuggestedTab
};
view.addEventListener('viewdestroy', function (e) {
tabControllers.forEach(function (t) {
if (t.destroy) {
t.destroy();
}
});
});
};
});

View file

@ -2613,7 +2613,8 @@ var AppInfo = {};
defineRoute({
path: '/livetv.html',
dependencies: ['paper-button'],
dependencies: ['paper-button', 'livetvcss', 'paper-checkbox'],
controller: 'scripts/livetvsuggested',
autoFocus: false
});