update tabs

This commit is contained in:
Luke Pulverenti 2015-09-01 11:31:50 -04:00
parent 9ea282ff39
commit 26e2cbbb1d
9 changed files with 59 additions and 114 deletions

View File

@ -7,7 +7,7 @@
<div id="liveTvSuggestedPage" data-role="page" class="page libraryPage liveTvPage pageWithAbsoluteTabs" data-contextname="${HeaderLiveTv}" data-backdroptype="series,movie" data-require="scripts/livetvsuggested,livetvcss,scripts/livetvcomponents">
<div class="libraryViewNav libraryViewNavWithMinHeight">
<paper-tabs class="scrollingPaperTabs" hidescrollbuttons noink>
<paper-tabs hidescrollbuttons>
<paper-tab><iron-icon icon="info"></iron-icon>${TabSuggestions}</paper-tab>
<paper-tab><iron-icon icon="grid-on"></iron-icon>${TabGuide}</paper-tab>
<paper-tab><iron-icon icon="live-tv"></iron-icon>${TabChannels}</paper-tab>

View File

@ -7,7 +7,7 @@
<div id="moviesPage" data-role="page" class="page libraryPage backdropPage pageWithAbsoluteTabs collectionEditorPage" data-backdroptype="movie" data-require="scripts/moviesrecommended">
<div class="libraryViewNav libraryViewNavWithMinHeight">
<paper-tabs class="scrollingPaperTabs" hidescrollbuttons noink>
<paper-tabs hidescrollbuttons noink>
<paper-tab><iron-icon icon="info"></iron-icon>${TabSuggestions}</paper-tab>
<paper-tab><iron-icon icon="local-movies"></iron-icon>${TabMovies}</paper-tab>
<paper-tab class="movieTrailersTab"><iron-icon icon="movie"></iron-icon>${TabTrailers}</paper-tab>

View File

@ -77,23 +77,7 @@
var tabs = page.querySelector('paper-tabs');
var pages = page.querySelector('neon-animated-pages');
LibraryBrowser.configurePaperLibraryTabs(page, tabs, pages);
$(tabs).on('iron-select', function () {
var selected = this.selected;
if (LibraryBrowser.navigateOnLibraryTabSelect()) {
if (selected) {
Dashboard.navigate('channels.html?tab=' + selected);
} else {
Dashboard.navigate('channels.html');
}
} else {
page.querySelector('neon-animated-pages').selected = selected;
}
});
LibraryBrowser.configurePaperLibraryTabs(page, tabs, pages, 'channels.html');
$(pages).on('tabchange', function () {
loadTab(page, parseInt(this.selected));

View File

@ -235,23 +235,7 @@
var tabs = page.querySelector('paper-tabs');
var pages = page.querySelector('neon-animated-pages');
LibraryBrowser.configurePaperLibraryTabs(page, tabs, pages);
$(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;
}
});
LibraryBrowser.configurePaperLibraryTabs(page, tabs, pages, 'index.html');
$(pages).on('tabchange', function () {
loadTab(page, parseInt(this.selected));

View File

@ -193,7 +193,12 @@
return !LibraryBrowser.enableFullPaperTabs();
},
configurePaperLibraryTabs: function (ownerpage, tabs, pages) {
configurePaperLibraryTabs: function (ownerpage, tabs, pages, baseUrl) {
// Causing iron-select to not fire in IE and safari
if ($.browser.chrome) {
tabs.noink = true;
}
if (AppInfo.enableBottomTabs) {
tabs.alignBottom = true;
@ -205,7 +210,7 @@
if ($.browser.safari) {
// Not very iOS-like I suppose
tabs.noSlide = true;
//tabs.noSlide = true;
tabs.noBar = true;
}
else {
@ -232,9 +237,7 @@
$(ownerpage).on('pagebeforeshow', LibraryBrowser.onTabbedpagebeforeshow);
$(pages).on('iron-select', function () {
console.log('iron-select');
pages.addEventListener('iron-select', function () {
// When transition animations are used, add a content loading delay to allow the animations to finish
// Otherwise with both operations happening at the same time, it can cause the animation to not run at full speed.
var pgs = this;
@ -244,39 +247,61 @@
$(pgs).trigger('tabchange');
}, delay);
});
tabs.addEventListener('iron-select', function() {
var selected = this.selected;
if (LibraryBrowser.navigateOnLibraryTabSelect()) {
if (selected) {
var url = replaceQueryString(baseUrl, 'tab', selected);
Dashboard.navigate(url);
} else {
Dashboard.navigate(baseUrl);
}
} else {
pages.selected = selected;
}
});
},
onTabbedpagebeforeshow: function () {
var page = this;
var delay = 0;
var isFirstLoad = false;
if (!page.getAttribute('data-firstload')) {
delay = 300;
isFirstLoad = true;
page.setAttribute('data-firstload', '1');
}
setTimeout(function () {
LibraryBrowser.onTabbedpagebeforeshowInternal(page);
}, delay);
if (delay) {
setTimeout(function () {
LibraryBrowser.onTabbedpagebeforeshowInternal(page, isFirstLoad);
}, delay);
} else {
LibraryBrowser.onTabbedpagebeforeshowInternal(page, isFirstLoad);
}
},
onTabbedpagebeforeshowInternal: function (page) {
onTabbedpagebeforeshowInternal: function (page, isFirstLoad) {
var tabs = page.querySelector('paper-tabs');
var selected = tabs.selected;
if (selected == null) {
if (isFirstLoad) {
Logger.log('selected tab is null, checking query string');
selected = parseInt(getParameterByName('tab') || '0');
var selected = parseInt(getParameterByName('tab') || '0');
Logger.log('selected tab will be ' + selected);
if (LibraryBrowser.enableFullPaperTabs()) {
tabs.selected = selected;
page.querySelector('paper-tabs').selected = selected;
} else {
page.querySelector('neon-animated-pages').selected = selected;
}
@ -291,7 +316,7 @@
pages.entryAnimation = null;
pages.exitAnimation = null;
tabs.selected = 0;
page.querySelector('paper-tabs').selected = 0;
pages.entryAnimation = entryAnimation;
pages.exitAnimation = exitAnimation;

View File

@ -216,23 +216,7 @@
var tabs = page.querySelector('paper-tabs');
var pages = page.querySelector('neon-animated-pages');
LibraryBrowser.configurePaperLibraryTabs(page, tabs, pages);
$(tabs).on('iron-select', function () {
var selected = this.selected;
if (LibraryBrowser.navigateOnLibraryTabSelect()) {
if (selected) {
Dashboard.navigate('livetv.html?tab=' + selected);
} else {
Dashboard.navigate('livetv.html');
}
} else {
page.querySelector('neon-animated-pages').selected = selected;
}
});
LibraryBrowser.configurePaperLibraryTabs(page, tabs, pages, 'livetv.html');
$(pages).on('tabchange', function () {
loadTab(page, parseInt(this.selected));

View File

@ -325,28 +325,13 @@
var tabs = page.querySelector('paper-tabs');
var pages = page.querySelector('neon-animated-pages');
LibraryBrowser.configurePaperLibraryTabs(page, tabs, pages);
var baseUrl = 'movies.html';
var topParentId = LibraryMenu.getTopParentId();
if (topParentId) {
baseUrl += '?topParentId=' + topParentId;
}
$(tabs).on('iron-select', function () {
var selected = this.selected;
if (LibraryBrowser.navigateOnLibraryTabSelect()) {
var url = 'movies.html';
var topParentId = LibraryMenu.getTopParentId();
if (topParentId) {
url += '?topParentId=' + topParentId;
}
if (selected) {
Dashboard.navigate(url + '&tab=' + selected);
} else {
Dashboard.navigate(url);
}
} else {
page.querySelector('neon-animated-pages').selected = selected;
}
});
LibraryBrowser.configurePaperLibraryTabs(page, tabs, pages, baseUrl);
$(pages).on('tabchange', function () {
loadTab(page, parseInt(this.selected));

View File

@ -206,27 +206,14 @@
var page = this;
var tabs = page.querySelector('paper-tabs');
LibraryBrowser.configurePaperLibraryTabs(page, tabs, page.querySelector('neon-animated-pages'));
$(tabs).on('iron-select', function () {
var selected = this.selected;
if (LibraryBrowser.navigateOnLibraryTabSelect()) {
var baseUrl = 'photos.html';
var topParentId = LibraryMenu.getTopParentId();
if (topParentId) {
baseUrl += '?topParentId=' + topParentId;
}
var url = 'photos.html';
var topParentId = LibraryMenu.getTopParentId();
if (topParentId) {
url += '?topParentId=' + topParentId;
}
if (selected) {
Dashboard.navigate(url + '&tab=' + selected);
} else {
Dashboard.navigate(url);
}
} else {
page.querySelector('neon-animated-pages').selected = selected;
}
});
LibraryBrowser.configurePaperLibraryTabs(page, tabs, page.querySelector('neon-animated-pages'), baseUrl);
$(page.querySelector('neon-animated-pages')).on('tabchange', function () {
loadTab(page, parseInt(this.selected));

View File

@ -354,10 +354,6 @@ paper-menu-item {
flex-grow: 0;
}
.scrollingPaperTabs #tabsContainer {
margin: 0 auto;
}
/*.scrollablePaperTabs #tabsContainer {
text-align: center;
overflow-x: scroll;