mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
update tabs
This commit is contained in:
parent
c8eb5f2b0c
commit
5bd79b1ab7
18 changed files with 325 additions and 314 deletions
|
@ -295,6 +295,9 @@
|
|||
|
||||
// http://api.jquery.com/jQuery.ajax/
|
||||
if (enableReconnection && !isUserErrorCode) {
|
||||
|
||||
logger.log("Attempting reconnection");
|
||||
|
||||
tryReconnect().done(function () {
|
||||
|
||||
logger.log("Reconnect succeesed");
|
||||
|
@ -309,6 +312,8 @@
|
|||
});
|
||||
} else {
|
||||
|
||||
logger.log("Reporting request failure");
|
||||
|
||||
onRetryRequestFail(request);
|
||||
deferred.reject();
|
||||
}
|
||||
|
|
|
@ -12,16 +12,33 @@
|
|||
margin-left: .5em;
|
||||
}
|
||||
|
||||
.backdropPage.ui-page-theme-a {
|
||||
.pageWithAbsoluteTabs {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
.backdropPage.ui-page-theme-a:not(.pageWithAbsoluteTabs) {
|
||||
background-color: rgba(240, 240,240, .94) !important;
|
||||
}
|
||||
|
||||
.ui-page-theme-b {
|
||||
background-color: #1f1f1f;
|
||||
.backdropPage.ui-page-theme-b:not(.pageWithAbsoluteTabs), .backdropPage.pageWithAbsoluteTabs .pageBackground {
|
||||
background-color: rgba(20, 20,20, .92) !important;
|
||||
}
|
||||
|
||||
.backdropPage.ui-page-theme-b {
|
||||
background-color: rgba(20, 20,20, .92) !important;
|
||||
.pageWithAbsoluteTabs .pageBackground {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.pageWithAbsoluteTabs neon-animatable {
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.ui-page-theme-b:not(.pageWithAbsoluteTabs), .pageWithAbsoluteTabs .pageBackground {
|
||||
background-color: #1f1f1f;
|
||||
}
|
||||
|
||||
.backdropContainer {
|
||||
|
|
|
@ -253,12 +253,12 @@
|
|||
background-color: #212121;
|
||||
}
|
||||
|
||||
.libraryViewNav .ui-btn-active {
|
||||
.libraryViewNav:not(.paperLibraryViewNav) .ui-btn-active {
|
||||
border-bottom-color: #38c;
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
.libraryViewNav a {
|
||||
.libraryViewNav:not(.paperLibraryViewNav) a {
|
||||
display: inline-block;
|
||||
padding: 14px 13px 11px;
|
||||
color: rgba(255,255,255,.8) !important;
|
||||
|
@ -269,9 +269,35 @@
|
|||
border-bottom: 5px solid transparent;
|
||||
}
|
||||
|
||||
.libraryViewNav a:not(.ui-btn-active):hover {
|
||||
.paperLibraryViewNav a {
|
||||
color: #ddd !important;
|
||||
text-decoration: none;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
line-height: 48px;
|
||||
}
|
||||
|
||||
.paperLibraryViewNav .iron-selected a {
|
||||
color: inherit !important;
|
||||
text-decoration: none;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.basicPaperLibraryTabs .libraryViewNav .tab-content {
|
||||
border-bottom: 6px solid transparent;
|
||||
}
|
||||
|
||||
.basicPaperLibraryTabs .libraryViewNav .iron-selected .tab-content {
|
||||
border-bottom: 6px solid #38c;
|
||||
}
|
||||
|
||||
.basicPaperLibraryTabs .libraryViewNav paper-tabs {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.libraryViewNav:not(.paperLibraryViewNav) a:not(.ui-btn-active):hover {
|
||||
color: #2ad !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media all and (max-width: 500px) {
|
||||
|
||||
|
|
|
@ -15,11 +15,6 @@
|
|||
margin: 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.nowPlayingBar paper-icon-button.mediaButton {
|
||||
padding: 4px;
|
||||
}
|
||||
|
||||
.mediaButton iron-icon {
|
||||
height: 40px;
|
||||
width: 40px;
|
||||
|
@ -100,7 +95,7 @@
|
|||
.nowPlayingBarCenter {
|
||||
vertical-align: middle;
|
||||
text-align: center;
|
||||
margin-top: 20px;
|
||||
margin-top: 17px;
|
||||
}
|
||||
|
||||
.nowPlayingBarPositionContainer {
|
||||
|
@ -143,7 +138,7 @@
|
|||
|
||||
.nowPlayingBarRight {
|
||||
position: absolute;
|
||||
bottom: 22px;
|
||||
bottom: 17px;
|
||||
right: 10px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
@ -156,7 +151,7 @@
|
|||
vertical-align: middle;
|
||||
font-weight: normal;
|
||||
position: absolute;
|
||||
bottom: 38px;
|
||||
bottom: 36px;
|
||||
text-align: center;
|
||||
display: inline-block;
|
||||
margin: 0 auto;
|
||||
|
@ -174,7 +169,7 @@
|
|||
}
|
||||
|
||||
|
||||
@media all and (max-width: 1200px) {
|
||||
@media all and (max-width: 1300px) {
|
||||
|
||||
.nowPlayingBarUserDataButtons {
|
||||
display: none;
|
||||
|
@ -192,14 +187,16 @@
|
|||
}
|
||||
|
||||
.nowPlayingBarRight {
|
||||
bottom: 26px;
|
||||
bottom: 22px;
|
||||
}
|
||||
}
|
||||
|
||||
@media all and (max-width: 800px) {
|
||||
|
||||
.nowPlayingBarCurrentTime {
|
||||
display: none;
|
||||
padding-left: 0;
|
||||
bottom: 30px;
|
||||
right: 130px;
|
||||
}
|
||||
|
||||
.nowPlayingBarCenter > *:not(.nowPlayingBarCurrentTime) {
|
||||
|
@ -207,7 +204,7 @@
|
|||
}
|
||||
|
||||
.nowPlayingBarRight {
|
||||
bottom: 12px;
|
||||
bottom: 10px;
|
||||
}
|
||||
|
||||
.nowPlayingBar, .nowPlayingImage img {
|
||||
|
@ -237,3 +234,10 @@
|
|||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media all and (max-width: 600px) {
|
||||
|
||||
.nowPlayingBarCurrentTime {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -312,6 +312,8 @@ html {
|
|||
|
||||
body {
|
||||
overflow-y: scroll !important;
|
||||
/* This is needed to prevent a horizontal scrollbar while neon-animated-pages are animating. */
|
||||
overflow-x: hidden;
|
||||
font-size: 13px;
|
||||
font-family: Roboto, Arial, Helvetica, sans-serif;
|
||||
/*Can't use this with safari or it causes some content to disappear*/
|
||||
|
@ -330,6 +332,11 @@ body {
|
|||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
/* Undo this from jqm which may cause the page to have it's own scrollbar */
|
||||
.ui-mobile .ui-page-active {
|
||||
overflow-x: visible;
|
||||
}
|
||||
|
||||
.bodyWithPopupOpen {
|
||||
overflow-y: hidden !important;
|
||||
}
|
||||
|
@ -752,7 +759,7 @@ h1 .imageLink {
|
|||
margin-bottom: 30px !important;
|
||||
}
|
||||
|
||||
.page > .ui-content {
|
||||
.page > .ui-content, .pageWithAbsoluteTabs .pageTabContent {
|
||||
/* Need this so that the audio player doesn't cover content, but also for unveil lazy loading. */
|
||||
padding-bottom: 160px;
|
||||
}
|
||||
|
|
|
@ -1,24 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Emby</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="favoritesPage" data-role="page" class="page libraryPage allLibraryPage backdropPage" data-backdroptype="movie,series,game,book" data-require="scripts/favorites,paperbuttonstyle">
|
||||
|
||||
<div class="libraryViewNav scopedLibraryViewNav">
|
||||
<a href="index.html"><i class="material-icons">home</i>${TabHome}</a>
|
||||
<a href="homenextup.html"><i class="material-icons">navigate_next</i>${TabNextUp}</a>
|
||||
<a href="homefavorites.html" class="ui-btn-active"><i class="material-icons">favorite</i>${TabFavorites}</a>
|
||||
<a href="homeupcoming.html"><i class="material-icons">schedule</i>${TabUpcoming}</a>
|
||||
</div>
|
||||
|
||||
<div data-role="content">
|
||||
|
||||
<div class="ehsContent">
|
||||
<div class="sections"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
|
@ -1,41 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Emby</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="homeNextUpPage" data-role="page" class="page libraryPage backdropPage" data-backdroptype="series" data-require="scripts/homenextup,paperbuttonstyle">
|
||||
|
||||
<div class="libraryViewNav globalNav">
|
||||
<a href="index.html"><i class="material-icons">home</i>${TabHome}</a>
|
||||
<a href="#" class="ui-btn-active"><i class="material-icons">navigate_next</i>${TabNextUp}</a>
|
||||
<a href="homefavorites.html"><i class="material-icons">favorite</i>${TabFavorites}</a>
|
||||
<a href="homeupcoming.html"><i class="material-icons">schedule</i>${TabUpcoming}</a>
|
||||
</div>
|
||||
<div data-role="content">
|
||||
<div class="ehsContent">
|
||||
|
||||
<div id="resumableSection" style="display: none;" class="scopedContent homePageSection">
|
||||
<div>
|
||||
<h1 class="listHeader" style="display:inline-block;vertical-align:middle;">${HeaderResume}</h1>
|
||||
<paper-button raised class="submit mini categorySyncButton" data-category="Resume"><iron-icon icon="refresh"></iron-icon><span>${ButtonSync}</span></paper-button>
|
||||
</div>
|
||||
|
||||
<div id="resumableItems" class="itemsContainer">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="homePageSection">
|
||||
<div>
|
||||
<h1 class="listHeader nextUpHeader" style="display:inline-block;vertical-align:middle;">${HeaderNextUp}</h1>
|
||||
<paper-button raised class="submit mini categorySyncButton" data-category="NextUp"><iron-icon icon="refresh"></iron-icon><span>${ButtonSync}</span></paper-button>
|
||||
</div>
|
||||
<div id="nextUpItems" class="itemsContainer">
|
||||
</div>
|
||||
</div>
|
||||
<p class="noNextUpItems" style="display: none;">${NoNextUpItemsMessage}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
|
@ -1,26 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Emby</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="homeUpcomingPage" data-role="page" class="page libraryPage backdropPage" data-backdroptype="series" data-require="scripts/homeupcoming">
|
||||
<div class="libraryViewNav globalNav">
|
||||
<a href="index.html"><i class="material-icons">home</i>${TabHome}</a>
|
||||
<a href="homenextup.html"><i class="material-icons">navigate_next</i>${TabNextUp}</a>
|
||||
<a href="homefavorites.html"><i class="material-icons">favorite</i>${TabFavorites}</a>
|
||||
<a href="#" class="ui-btn-active"><i class="material-icons">schedule</i>${TabUpcoming}</a>
|
||||
</div>
|
||||
<div data-role="content">
|
||||
<div class="ehsContent">
|
||||
<div id="upcomingItems" class="itemsContainer">
|
||||
</div>
|
||||
<div class="noItemsMessage" style="display: none;">
|
||||
<p>${MessageNothingHere}</p>
|
||||
<p><a href="metadata.html">${MessagePleaseEnsureInternetMetadata}</a></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
|
@ -5,16 +5,22 @@
|
|||
</head>
|
||||
<body>
|
||||
|
||||
<div id="indexPage" data-role="page" class="page homePage libraryPage allLibraryPage backdropPage" data-backdroptype="movie,series,game,book" data-require="scripts/sections,scripts/indexpage,paperbuttonstyle">
|
||||
<div id="indexPage" data-role="page" class="page homePage libraryPage allLibraryPage backdropPage pageWithAbsoluteTabs" data-backdroptype="movie,series,game,book" data-require="scripts/sections,scripts/indexpage,scripts/homenextup,scripts/favorites,scripts/homeupcoming,paperbuttonstyle">
|
||||
|
||||
<div class="libraryViewNav scopedLibraryViewNav">
|
||||
<a href="#" class="ui-btn-active"><i class="material-icons">home</i>${TabHome}</a>
|
||||
<a href="homenextup.html"><i class="material-icons">navigate_next</i>${TabNextUp}</a>
|
||||
<a href="homefavorites.html"><i class="material-icons">favorite</i>${TabFavorites}</a>
|
||||
<a href="homeupcoming.html"><i class="material-icons">schedule</i>${TabUpcoming}</a>
|
||||
<div class="libraryViewNav">
|
||||
<paper-tabs style="display:none;">
|
||||
<paper-tab><i class="material-icons">home</i>${TabHome}</paper-tab>
|
||||
<paper-tab><i class="material-icons">navigate_next</i>${TabNextUp}</paper-tab>
|
||||
<paper-tab><i class="material-icons">favorite</i>${TabFavorites}</paper-tab>
|
||||
<paper-tab><i class="material-icons">schedule</i>${TabUpcoming}</paper-tab>
|
||||
</paper-tabs>
|
||||
<div class="legacyTabs" style="display:none;">
|
||||
<a href="index.html" class="ui-btn-active">${TabHome}</a>
|
||||
<a href="index.html?tab=1">${TabNextUp}</a>
|
||||
<a href="index.html?tab=2">${TabFavorites}</a>
|
||||
<a href="index.html?tab=3">${TabUpcoming}</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div data-role="content">
|
||||
|
||||
<div class="ui-bar-b readOnlyContent welcomeMessage" style="display: none; padding: 2em; border-radius: 10px; margin: 2em auto; font-weight: normal;">
|
||||
<h1 style="margin-top: 0;" class="tourHeader"></h1>
|
||||
|
@ -23,9 +29,46 @@
|
|||
</p>
|
||||
</div>
|
||||
|
||||
<div class="ehsContent homeEhsContent">
|
||||
<div class="pageBackground"></div>
|
||||
<div class="ehsContent">
|
||||
<neon-animated-pages entry-animation="slide-from-right-animation" exit-animation="slide-left-animation">
|
||||
<neon-animatable>
|
||||
<div class="pageTabContent homeTabContent">
|
||||
<div class="sections"></div>
|
||||
</div>
|
||||
</neon-animatable>
|
||||
<neon-animatable>
|
||||
<div class="pageTabContent homeNextUpTabContent">
|
||||
<div class="homePageSection">
|
||||
<div>
|
||||
<h1 class="listHeader nextUpHeader" style="display:inline-block;vertical-align:middle;">${HeaderNextUp}</h1>
|
||||
<paper-button raised class="submit mini categorySyncButton" data-category="NextUp"><iron-icon icon="refresh"></iron-icon><span>${ButtonSync}</span></paper-button>
|
||||
</div>
|
||||
<div id="nextUpItems" class="itemsContainer">
|
||||
</div>
|
||||
</div>
|
||||
<p class="noNextUpItems" style="display: none;">${NoNextUpItemsMessage}</p>
|
||||
</div>
|
||||
</neon-animatable>
|
||||
<neon-animatable>
|
||||
<div class="pageTabContent homeFavoritesTabContent">
|
||||
<div class="sections"></div>
|
||||
</div>
|
||||
</neon-animatable>
|
||||
<neon-animatable>
|
||||
<div class="pageTabContent homeUpcomingTabContent">
|
||||
<div id="upcomingItems" class="itemsContainer">
|
||||
</div>
|
||||
<div class="noItemsMessage" style="display: none;">
|
||||
<p>${MessageNothingHere}</p>
|
||||
<p><a href="metadata.html">${MessagePleaseEnsureInternetMetadata}</a></p>
|
||||
</div>
|
||||
</div>
|
||||
</neon-animatable>
|
||||
</neon-animated-pages>
|
||||
</div>
|
||||
|
||||
<div data-role="content">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -9,9 +9,9 @@
|
|||
<div class="itemTabs homeTabs" style="display: none;">
|
||||
<div class="libraryViewNav scopedLibraryViewNav">
|
||||
<a href="index.html" class="lnkHomeHome"><i class="material-icons">home</i>${TabHome}</a>
|
||||
<a href="homenextup.html" class="lnkHomeNextUp"><i class="material-icons">navigate_next</i>${TabNextUp}</a>
|
||||
<a href="homefavorites.html" class="lnkHomeFavorites"><i class="material-icons">favorite</i>${TabFavorites}</a>
|
||||
<a href="homeupcoming.html" class="lnkHomeUpcoming"><i class="material-icons">schedule</i>${TabUpcoming}</a>
|
||||
<a href="index.html?tab=1" class="lnkHomeNextUp"><i class="material-icons">navigate_next</i>${TabNextUp}</a>
|
||||
<a href="index.html?tab=2" class="lnkHomeFavorites"><i class="material-icons">favorite</i>${TabFavorites}</a>
|
||||
<a href="index.html?tab=3" class="lnkHomeUpcoming"><i class="material-icons">schedule</i>${TabUpcoming}</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
@ -54,7 +54,7 @@
|
|||
html += '</div>';
|
||||
|
||||
if (result.TotalRecordCount > result.Items.length) {
|
||||
var href = "homefavorites.html?sectionid=" + section.id;
|
||||
var href = "index.html?tab=2§ionid=" + section.id;
|
||||
|
||||
html += '<a class="clearLink" href="' + href + '"><paper-button raised class="more">' + Globalize.translate('ButtonMoreItems') + '</paper-button></a>';
|
||||
}
|
||||
|
@ -113,15 +113,20 @@
|
|||
});
|
||||
}
|
||||
|
||||
$(document).on('pagebeforeshowready', "#favoritesPage", function () {
|
||||
$(document).on('pageinitdepends', "#indexPage", function () {
|
||||
|
||||
var page = this;
|
||||
var tabContent = page.querySelector('.homeFavoritesTabContent');
|
||||
|
||||
var userId = Dashboard.getCurrentUserId();
|
||||
$(page.querySelector('neon-animated-pages')).on('iron-select', function () {
|
||||
|
||||
if (LibraryBrowser.needsRefresh(page)) {
|
||||
loadSections(page, userId);
|
||||
if (parseInt(this.selected) == 2) {
|
||||
if (LibraryBrowser.needsRefresh(tabContent)) {
|
||||
loadSections(tabContent, Dashboard.getCurrentUserId());
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
})(jQuery, document);
|
|
@ -5,33 +5,11 @@
|
|||
return 'Thumb';
|
||||
}
|
||||
|
||||
function getResumeView() {
|
||||
|
||||
return 'Poster';
|
||||
}
|
||||
|
||||
function reload(page) {
|
||||
|
||||
Dashboard.showLoadingMsg();
|
||||
|
||||
var context = '';
|
||||
|
||||
if (LibraryMenu.getTopParentId()) {
|
||||
|
||||
$('.scopedLibraryViewNav', page).show();
|
||||
$('.globalNav', page).hide();
|
||||
$('.scopedContent', page).show();
|
||||
context = 'tv';
|
||||
|
||||
loadResume(page);
|
||||
|
||||
} else {
|
||||
$('.scopedLibraryViewNav', page).hide();
|
||||
$('.globalNav', page).show();
|
||||
$('.scopedContent', page).hide();
|
||||
}
|
||||
|
||||
loadNextUp(page, context || 'home-nextup');
|
||||
loadNextUp(page, 'home-nextup');
|
||||
}
|
||||
|
||||
function loadNextUp(page, context) {
|
||||
|
@ -55,11 +33,10 @@
|
|||
ApiClient.getNextUpEpisodes(query).done(function (result) {
|
||||
|
||||
if (result.Items.length) {
|
||||
$('.noNextUpItems', page).hide();
|
||||
page.querySelector('.noNextUpItems').classList.add('hide');
|
||||
} else {
|
||||
$('.noNextUpItems', page).show();
|
||||
page.querySelector('.noNextUpItems').classList.remove('hide');
|
||||
}
|
||||
|
||||
var view = getView();
|
||||
var html = '';
|
||||
|
||||
|
@ -101,95 +78,20 @@
|
|||
});
|
||||
}
|
||||
|
||||
function enableScrollX() {
|
||||
return $.browser.mobile && AppInfo.enableAppLayouts;
|
||||
}
|
||||
|
||||
function getThumbShape() {
|
||||
return enableScrollX() ? 'overflowBackdrop' : 'backdrop';
|
||||
}
|
||||
|
||||
function loadResume(page) {
|
||||
|
||||
var parentId = LibraryMenu.getTopParentId();
|
||||
|
||||
var screenWidth = $(window).width();
|
||||
|
||||
var limit = 6;
|
||||
|
||||
var options = {
|
||||
|
||||
SortBy: "DatePlayed",
|
||||
SortOrder: "Descending",
|
||||
IncludeItemTypes: "Episode",
|
||||
Filters: "IsResumable",
|
||||
Limit: limit,
|
||||
Recursive: true,
|
||||
Fields: "PrimaryImageAspectRatio,SeriesInfo,UserData,SyncInfo",
|
||||
ExcludeLocationTypes: "Virtual",
|
||||
ParentId: parentId,
|
||||
ImageTypeLimit: 1,
|
||||
EnableImageTypes: "Primary,Backdrop,Banner,Thumb"
|
||||
};
|
||||
|
||||
ApiClient.getItems(Dashboard.getCurrentUserId(), options).done(function (result) {
|
||||
|
||||
if (result.Items.length) {
|
||||
$('#resumableSection', page).show();
|
||||
} else {
|
||||
$('#resumableSection', page).hide();
|
||||
}
|
||||
|
||||
var view = getResumeView();
|
||||
var html = '';
|
||||
|
||||
if (view == 'PosterCard') {
|
||||
|
||||
html += LibraryBrowser.getPosterViewHtml({
|
||||
items: result.Items,
|
||||
shape: getThumbShape(),
|
||||
showTitle: true,
|
||||
showParentTitle: true,
|
||||
lazy: true,
|
||||
cardLayout: true,
|
||||
context: 'tv',
|
||||
showDetailsMenu: true
|
||||
});
|
||||
|
||||
} else if (view == 'Poster') {
|
||||
|
||||
html += LibraryBrowser.getPosterViewHtml({
|
||||
items: result.Items,
|
||||
shape: getThumbShape(),
|
||||
showTitle: true,
|
||||
showParentTitle: true,
|
||||
overlayText: screenWidth >= 800 && !AppInfo.hasLowImageBandwidth,
|
||||
lazy: true,
|
||||
context: 'tv',
|
||||
showDetailsMenu: true
|
||||
});
|
||||
}
|
||||
|
||||
var elem = page.querySelector('#resumableItems');
|
||||
elem.innerHTML = html;
|
||||
ImageLoader.lazyChildren(elem);
|
||||
});
|
||||
}
|
||||
|
||||
$(document).on('pagebeforeshowready', "#homeNextUpPage", function () {
|
||||
$(document).on('pageinitdepends', "#indexPage", function () {
|
||||
|
||||
var page = this;
|
||||
var tabContent = page.querySelector('.homeNextUpTabContent');
|
||||
|
||||
if (enableScrollX()) {
|
||||
page.querySelector('#resumableItems').classList.add('hiddenScrollX');
|
||||
} else {
|
||||
page.querySelector('#resumableItems').classList.remove('hiddenScrollX');
|
||||
$(page.querySelector('neon-animated-pages')).on('iron-select', function () {
|
||||
|
||||
if (parseInt(this.selected) == 1) {
|
||||
if (LibraryBrowser.needsRefresh(tabContent)) {
|
||||
|
||||
reload(tabContent);
|
||||
}
|
||||
|
||||
if (LibraryBrowser.needsRefresh(page)) {
|
||||
reload(page);
|
||||
}
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
})(jQuery, document);
|
|
@ -59,14 +59,19 @@
|
|||
});
|
||||
}
|
||||
|
||||
$(document).on('pagebeforeshowready', "#homeUpcomingPage", function () {
|
||||
$(document).on('pageinitdepends', "#indexPage", function () {
|
||||
|
||||
var page = this;
|
||||
var tabContent = page.querySelector('.homeUpcomingTabContent');
|
||||
|
||||
if (LibraryBrowser.needsRefresh(page)) {
|
||||
loadUpcoming(page);
|
||||
$(page.querySelector('neon-animated-pages')).on('iron-select', function () {
|
||||
|
||||
if (parseInt(this.selected) == 3) {
|
||||
if (LibraryBrowser.needsRefresh(tabContent)) {
|
||||
loadUpcoming(tabContent);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
})(jQuery, document);
|
|
@ -164,19 +164,11 @@
|
|||
});
|
||||
}
|
||||
|
||||
$(document).on('pageinitdepends', "#indexPage", function () {
|
||||
function loadHomeTab(page) {
|
||||
|
||||
var page = this;
|
||||
var tabContent = page.querySelector('.homeTabContent');
|
||||
|
||||
Events.on(page.querySelector('.btnTakeTour'), 'click', function () {
|
||||
takeTour(page, Dashboard.getCurrentUserId());
|
||||
});
|
||||
|
||||
}).on('pagebeforeshowready', "#indexPage", function () {
|
||||
|
||||
var page = this;
|
||||
|
||||
if (LibraryBrowser.needsRefresh(page)) {
|
||||
if (LibraryBrowser.needsRefresh(tabContent)) {
|
||||
if (window.ApiClient) {
|
||||
var userId = Dashboard.getCurrentUserId();
|
||||
|
||||
|
@ -186,20 +178,76 @@
|
|||
|
||||
Dashboard.getCurrentUser().done(function (user) {
|
||||
|
||||
loadSections(page, user, result).done(function () {
|
||||
loadSections(tabContent, user, result).done(function () {
|
||||
|
||||
if (!AppInfo.isNativeApp) {
|
||||
showWelcomeIfNeeded(page, result);
|
||||
}
|
||||
Dashboard.hideLoadingMsg();
|
||||
|
||||
LibraryBrowser.setLastRefreshed(page);
|
||||
LibraryBrowser.setLastRefreshed(tabContent);
|
||||
});
|
||||
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function loadTab(page, index) {
|
||||
|
||||
switch (index) {
|
||||
|
||||
case 0:
|
||||
loadHomeTab(page);
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
$(document).on('pageinitdepends', "#indexPage", function () {
|
||||
|
||||
var page = this;
|
||||
|
||||
Events.on(page.querySelector('.btnTakeTour'), 'click', function () {
|
||||
takeTour(page, Dashboard.getCurrentUserId());
|
||||
});
|
||||
|
||||
var tabs = page.querySelector('paper-tabs');
|
||||
LibraryBrowser.configurePaperLibraryTabs(page, page.querySelectorAll('paper-tabs')[0], page.querySelectorAll('neon-animated-pages')[0]);
|
||||
|
||||
$(tabs).on('iron-select', function () {
|
||||
var selected = this.selected;
|
||||
if (LibraryBrowser.navigateOnLibraryTabSelect()) {
|
||||
|
||||
if (selected) {
|
||||
Dashboard.navigate('index.html?tab=' + selected);
|
||||
} else {
|
||||
Dashboard.navigate('index.html');
|
||||
}
|
||||
|
||||
} else {
|
||||
page.querySelector('neon-animated-pages').selected = selected;
|
||||
}
|
||||
});
|
||||
|
||||
$(page.querySelector('neon-animated-pages')).on('iron-select', function () {
|
||||
loadTab(page, parseInt(this.selected));
|
||||
});
|
||||
|
||||
}).on('pagebeforeshowready', "#indexPage", function () {
|
||||
|
||||
var page = this;
|
||||
|
||||
var tabs = page.querySelector('paper-tabs');
|
||||
var selected = tabs.selected;
|
||||
|
||||
if (selected == null) {
|
||||
selected = parseInt(getParameterByName('tab') || '0');
|
||||
tabs.selected = selected;
|
||||
page.querySelector('neon-animated-pages').selected = selected;
|
||||
}
|
||||
});
|
||||
|
||||
function getDisplayPreferencesAppName() {
|
||||
|
|
|
@ -112,6 +112,87 @@
|
|||
elem.classList.add('hasrefreshtime');
|
||||
},
|
||||
|
||||
configureSwipeTabs: function (ownerpage, tabs, pages) {
|
||||
|
||||
var pageCount = pages.querySelectorAll('neon-animatable').length;
|
||||
|
||||
function allowSwipe(e) {
|
||||
|
||||
var target = e.target;
|
||||
|
||||
if (target.classList.contains('noSwipe')) {
|
||||
return false;
|
||||
}
|
||||
if ($(target).parents('.noSwipe').length) {
|
||||
return false;
|
||||
}
|
||||
|
||||
return true;
|
||||
}
|
||||
|
||||
$(ownerpage).on('swipeleft', function (e) {
|
||||
|
||||
if (allowSwipe(e)) {
|
||||
var selected = parseInt(pages.selected || '0');
|
||||
if (selected < (pageCount - 1)) {
|
||||
pages.entryAnimation = 'slide-from-right-animation';
|
||||
pages.exitAnimation = 'slide-left-animation';
|
||||
tabs.selectNext();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
$(ownerpage).on('swiperight', function (e) {
|
||||
|
||||
if (allowSwipe(e)) {
|
||||
var selected = parseInt(pages.selected || '0');
|
||||
if (selected > 0) {
|
||||
pages.entryAnimation = 'slide-from-left-animation';
|
||||
pages.exitAnimation = 'slide-right-animation';
|
||||
tabs.selectPrevious();
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
enableFullPaperTabs: function () {
|
||||
return AppInfo.isNativeApp;
|
||||
},
|
||||
|
||||
navigateOnLibraryTabSelect: function () {
|
||||
return !LibraryBrowser.enableFullPaperTabs();
|
||||
},
|
||||
|
||||
configurePaperLibraryTabs: function (ownerpage, tabs, pages) {
|
||||
|
||||
tabs.hideScrollButtons = true;
|
||||
|
||||
if (LibraryBrowser.enableFullPaperTabs()) {
|
||||
|
||||
$(tabs).show();
|
||||
|
||||
LibraryBrowser.configureSwipeTabs(ownerpage, tabs, pages);
|
||||
|
||||
$('.libraryViewNav', ownerpage).addClass('paperLibraryViewNav');
|
||||
|
||||
} else {
|
||||
|
||||
tabs.noSlide = true;
|
||||
tabs.noink = true;
|
||||
tabs.noBar = true;
|
||||
tabs.scrollable = true;
|
||||
|
||||
var legacyTabs = $('.legacyTabs', ownerpage).show();
|
||||
document.body.classList.add('basicPaperLibraryTabs');
|
||||
|
||||
$(pages).on('iron-select', function (e) {
|
||||
|
||||
var selected = this.selected;
|
||||
$('a', legacyTabs).removeClass('ui-btn-active')[selected].classList.add('ui-btn-active');
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
getDateParamValue: function (date) {
|
||||
|
||||
function formatDigit(i) {
|
||||
|
|
|
@ -713,20 +713,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
function allowSwipe(e) {
|
||||
|
||||
var target = $(e.target);
|
||||
|
||||
if (target.is('.noSwipe')) {
|
||||
return false;
|
||||
}
|
||||
if (target.parents('.noSwipe').length) {
|
||||
return false;
|
||||
}
|
||||
|
||||
return true;
|
||||
}
|
||||
|
||||
function onPlayerChange() {
|
||||
bindToPlayer($($.mobile.activePage)[0], MediaController.getCurrentPlayer());
|
||||
}
|
||||
|
@ -742,42 +728,14 @@
|
|||
|
||||
$('.requiresJqmCreate', this).trigger('create');
|
||||
|
||||
$(page).on('swipeleft', function (e) {
|
||||
|
||||
if (allowSwipe(e)) {
|
||||
var pages = this.querySelectorAll('neon-animated-pages')[0];
|
||||
var tabs = this.querySelectorAll('paper-tabs')[0];
|
||||
|
||||
var selected = parseInt(pages.selected || '0');
|
||||
if (selected < 2) {
|
||||
pages.entryAnimation = 'slide-from-right-animation';
|
||||
pages.exitAnimation = 'slide-left-animation';
|
||||
tabs.selectNext();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
$(page).on('swiperight', function (e) {
|
||||
|
||||
if (allowSwipe(e)) {
|
||||
var pages = this.querySelectorAll('neon-animated-pages')[0];
|
||||
var tabs = this.querySelectorAll('paper-tabs')[0];
|
||||
|
||||
var selected = parseInt(pages.selected || '0');
|
||||
if (selected > 0) {
|
||||
pages.entryAnimation = 'slide-from-left-animation';
|
||||
pages.exitAnimation = 'slide-right-animation';
|
||||
tabs.selectPrevious();
|
||||
}
|
||||
}
|
||||
});
|
||||
LibraryBrowser.configureSwipeTabs(page, page.querySelectorAll('paper-tabs')[0], page.querySelectorAll('neon-animated-pages')[0]);
|
||||
|
||||
$(MediaController).on('playerchange', function () {
|
||||
updateCastIcon(page);
|
||||
});
|
||||
|
||||
$('paper-tabs').on('iron-select', function () {
|
||||
page.querySelectorAll('neon-animated-pages')[0].selected = this.selected;
|
||||
page.querySelector('neon-animated-pages').selected = this.selected;
|
||||
});
|
||||
|
||||
}).on('pagebeforeshowready', "#nowPlayingPage", function () {
|
||||
|
|
|
@ -305,7 +305,7 @@
|
|||
if (result.Items.length) {
|
||||
html += '<h1 class="listHeader">' + Globalize.translate('HeaderResume') + '</h1>';
|
||||
if (enableScrollX()) {
|
||||
html += '<div class="hiddenScrollX itemsContainer">';
|
||||
html += '<div class="hiddenScrollX itemsContainer noSwipe">';
|
||||
} else {
|
||||
html += '<div class="itemsContainer">';
|
||||
}
|
||||
|
|
|
@ -266,6 +266,7 @@ paper-tabs, paper-toolbar {
|
|||
|
||||
paper-tab {
|
||||
text-transform: uppercase;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
paper-tabs:not([alignbottom]) #selectionBar {
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue