1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00

update tabs

This commit is contained in:
Luke Pulverenti 2016-05-15 12:30:32 -04:00
parent 516c5715a1
commit 26dcecb51f
29 changed files with 535 additions and 501 deletions

View file

@ -16,12 +16,12 @@
}, },
"devDependencies": {}, "devDependencies": {},
"ignore": [], "ignore": [],
"version": "1.3.25", "version": "1.3.26",
"_release": "1.3.25", "_release": "1.3.26",
"_resolution": { "_resolution": {
"type": "version", "type": "version",
"tag": "1.3.25", "tag": "1.3.26",
"commit": "004eca200cd748222897d11f6bd92a29899d7945" "commit": "094d2fc7c9e0c008e1c44744da95a69d1aa6516f"
}, },
"_source": "https://github.com/MediaBrowser/emby-webcomponents.git", "_source": "https://github.com/MediaBrowser/emby-webcomponents.git",
"_target": "^1.2.0", "_target": "^1.2.0",

View file

@ -24,10 +24,14 @@
} }
.formDialog .dialogContentInner { .formDialog .dialogContentInner {
padding-bottom: 50vh; padding-bottom: 10vh;
padding-top: 1em; padding-top: 1em;
} }
.layout-tv .formDialog .dialogContentInner {
padding-bottom: 50vh;
}
@media all and (min-width: 1000px) { @media all and (min-width: 1000px) {
.formDialog form { .formDialog form {

View file

@ -49,5 +49,5 @@
"Download": "Download", "Download": "Download",
"Advanced": "Advanced", "Advanced": "Advanced",
"Refresh": "Refresh", "Refresh": "Refresh",
"RefreshQueued": "Refresh queued" "RefreshQueued": "Refresh queued."
} }

View file

@ -30,14 +30,14 @@
"web-component-tester": "polymer/web-component-tester#^3.4.0" "web-component-tester": "polymer/web-component-tester#^3.4.0"
}, },
"ignore": [], "ignore": [],
"homepage": "https://github.com/polymerelements/iron-a11y-announcer", "homepage": "https://github.com/PolymerElements/iron-a11y-announcer",
"_release": "1.0.4", "_release": "1.0.4",
"_resolution": { "_resolution": {
"type": "version", "type": "version",
"tag": "v1.0.4", "tag": "v1.0.4",
"commit": "5ce3eb8c4282bb53cd72e348858dc6be6b4c50b9" "commit": "5ce3eb8c4282bb53cd72e348858dc6be6b4c50b9"
}, },
"_source": "git://github.com/polymerelements/iron-a11y-announcer.git", "_source": "git://github.com/PolymerElements/iron-a11y-announcer.git",
"_target": "^1.0.0", "_target": "^1.0.0",
"_originalSource": "polymerelements/iron-a11y-announcer" "_originalSource": "PolymerElements/iron-a11y-announcer"
} }

View file

@ -36,7 +36,7 @@
"tag": "v1.5.1", "tag": "v1.5.1",
"commit": "e3e34408fad8f7cde59c4255cf3fe90f7dcf91d8" "commit": "e3e34408fad8f7cde59c4255cf3fe90f7dcf91d8"
}, },
"_source": "git://github.com/polymerelements/iron-selector.git", "_source": "git://github.com/PolymerElements/iron-selector.git",
"_target": "^1.0.0", "_target": "^1.0.0",
"_originalSource": "polymerelements/iron-selector" "_originalSource": "PolymerElements/iron-selector"
} }

View file

@ -45,7 +45,7 @@
"tag": "v1.0.11", "tag": "v1.0.11",
"commit": "e3c1ab0c72905b58fb4d9adc2921ea73b5c085a5" "commit": "e3c1ab0c72905b58fb4d9adc2921ea73b5c085a5"
}, },
"_source": "git://github.com/PolymerElements/paper-behaviors.git", "_source": "git://github.com/polymerelements/paper-behaviors.git",
"_target": "^1.0.0", "_target": "^1.0.0",
"_originalSource": "PolymerElements/paper-behaviors" "_originalSource": "polymerelements/paper-behaviors"
} }

View file

@ -32,14 +32,14 @@
"iron-test-helpers": "PolymerElements/iron-test-helpers#^1.0.0" "iron-test-helpers": "PolymerElements/iron-test-helpers#^1.0.0"
}, },
"ignore": [], "ignore": [],
"homepage": "https://github.com/PolymerElements/paper-ripple", "homepage": "https://github.com/polymerelements/paper-ripple",
"_release": "1.0.5", "_release": "1.0.5",
"_resolution": { "_resolution": {
"type": "version", "type": "version",
"tag": "v1.0.5", "tag": "v1.0.5",
"commit": "d72e7a9a8ab518b901ed18dde492df3b87a93be5" "commit": "d72e7a9a8ab518b901ed18dde492df3b87a93be5"
}, },
"_source": "git://github.com/PolymerElements/paper-ripple.git", "_source": "git://github.com/polymerelements/paper-ripple.git",
"_target": "^1.0.0", "_target": "^1.0.0",
"_originalSource": "PolymerElements/paper-ripple" "_originalSource": "polymerelements/paper-ripple"
} }

View file

@ -34,6 +34,6 @@
"commit": "11c987b2eb3c73b388a79fc8aaea8ca01624f514" "commit": "11c987b2eb3c73b388a79fc8aaea8ca01624f514"
}, },
"_source": "git://github.com/Polymer/polymer.git", "_source": "git://github.com/Polymer/polymer.git",
"_target": "^1.1.0", "_target": "^1.0.0",
"_originalSource": "Polymer/polymer" "_originalSource": "Polymer/polymer"
} }

View file

@ -1,21 +1,17 @@
<div id="channelsPage" data-role="page" data-dom-cache="true" class="page libraryPage channelsPage pageWithAbsoluteTabs" data-contextname="${HeaderChannels}" data-require="scripts/channels,scripts/channelslatest,scripts/sections,MaterialTabs"> <div id="channelsPage" data-role="page" data-dom-cache="true" class="page libraryPage channelsPage pageWithAbsoluteTabs" data-contextname="${HeaderChannels}" data-require="scripts/channels,scripts/channelslatest,scripts/sections">
<div class="mdl-tabs mdl-js-tabs mdl-js-ripple-effect">
<div class="libraryViewNav"> <div class="libraryViewNav">
<div class="mdl-tabs__tab-bar"> <button class="pageTabButton is-active" data-index="0">${TabLatest}</button>
<a href="#latestTab" class="mdl-tabs__tab is-active" data-index="0">${TabLatest}</a> <button class="pageTabButton" data-index="1">${TabChannels}</button>
<a href="#channelsTab" class="mdl-tabs__tab" data-index="1">${TabChannels}</a>
</div> </div>
</div> <div class="is-active pageTabContent ehsContent" id="latestTab" data-index="0">
<div class="mdl-tabs__panel is-active pageTabContent ehsContent" id="latestTab" data-index="0">
<div class="latestItems"></div> <div class="latestItems"></div>
</div> </div>
<div class="mdl-tabs__panel pageTabContent ehsContent" id="channelsTab" data-index="1"> <div class="pageTabContent ehsContent" id="channelsTab" data-index="1">
<div class="viewSettings"> <div class="viewSettings">
</div> </div>
<div id="items" class="itemsContainer paddedItemsContainer" style="text-align:center;"></div> <div id="items" class="itemsContainer paddedItemsContainer" style="text-align:center;"></div>
</div> </div>
</div>
<div data-role="content"> <div data-role="content">
</div> </div>

View file

@ -32,12 +32,12 @@
} }
var menuItem = { var menuItem = {
name: name, name: s.DisplayTitle || name,
id: s.Index id: s.Index
}; };
if (s.Index == currentIndex) { if (s.Index == currentIndex) {
menuItem.ironIcon = 'check'; menuItem.selected = true;
} }
return menuItem; return menuItem;
@ -83,12 +83,12 @@
} }
var menuItem = { var menuItem = {
name: name, name: s.DisplayTitle || name,
id: s.Index id: s.Index
}; };
if (s.Index == currentIndex) { if (s.Index == currentIndex) {
menuItem.ironIcon = 'check'; menuItem.selected = true;
} }
return menuItem; return menuItem;
@ -459,7 +459,7 @@
} }
function isPlaylistOpen(context) { function isPlaylistOpen(context) {
return libraryBrowser.selectedTab(context.querySelector('.mdl-tabs')) == 2; return libraryBrowser.selectedTab(context.querySelector('.libraryViewNav')) == 2;
} }
function onStateChanged(e, state) { function onStateChanged(e, state) {
@ -813,7 +813,7 @@
// showSlideshowMenu(context); // showSlideshowMenu(context);
//}); //});
var mdlTabs = context.querySelector('.mdl-tabs'); var mdlTabs = context.querySelector('.libraryViewNav');
if (AppInfo.enableNowPlayingPageBottomTabs) { if (AppInfo.enableNowPlayingPageBottomTabs) {
context.querySelector('.libraryViewNav').classList.add('bottom'); context.querySelector('.libraryViewNav').classList.add('bottom');
@ -821,7 +821,7 @@
context.querySelector('.libraryViewNav').classList.remove('bottom'); context.querySelector('.libraryViewNav').classList.remove('bottom');
} }
libraryBrowser.configurePaperLibraryTabs(ownerView, mdlTabs); libraryBrowser.configurePaperLibraryTabs(ownerView, mdlTabs, ownerView.querySelectorAll('.pageTabContent'));
mdlTabs.addEventListener('tabchange', function (e) { mdlTabs.addEventListener('tabchange', function (e) {
if (e.detail.selectedTabIndex == 2 && playlistNeedsRefresh) { if (e.detail.selectedTabIndex == 2 && playlistNeedsRefresh) {
@ -862,7 +862,6 @@
context.querySelector('.topRightContainer').style.position = 'relative'; context.querySelector('.topRightContainer').style.position = 'relative';
} }
componentHandler.upgradeAllRegistered(dlg);
init(ownerView, dlg); init(ownerView, dlg);
}; };

View file

@ -29,6 +29,10 @@
bottom: -92px !important; bottom: -92px !important;
} }
.pageTabContent:not(.is-active) {
display: none !important;
}
.sidebarDivider { .sidebarDivider {
height: 1px; height: 1px;
background: #eaeaea; background: #eaeaea;
@ -181,50 +185,70 @@
text-transform: uppercase; text-transform: uppercase;
white-space: nowrap; white-space: nowrap;
padding: 0 0 0; padding: 0 0 0;
overflow-x: scroll;
-ms-overflow-style: none;
overflow: -moz-scrollbars-none;
-webkit-overflow-scrolling: touch;
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.2); box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.2);
} }
.libraryViewNav.bottom { .libraryViewNav.bottom {
top: auto!important; top: auto !important;
bottom: 0; bottom: 0;
} }
.libraryViewNav .mdl-tabs__tab-bar { .libraryViewNav {
-webkit-justify-content: initial; justify-content: center;
justify-content: initial; display: flex;
display: inline-flex; display: block;
text-align: center; text-align: center;
margin: 0 auto; margin: 0 auto;
} align-items: center;
}
.libraryViewNav .pageTabButton {
.libraryViewNav .mdl-tabs__tab { background: transparent;
color: #aaa !important; border: 0 !important;
padding: 0 1.25em; cursor: pointer;
float: none; outline: none !important;
width: auto;
font-family: inherit;
font-size: inherit;
color: #999 !important;
display: inline-block;
vertical-align: middle;
flex-shrink: 0; flex-shrink: 0;
margin: 0;
padding: 1.2em .9em;
transition: none !important;
position: relative;
text-transform: uppercase;
font-weight: 500 !important;
height: auto;
min-width: initial;
line-height: initial;
} }
.libraryViewNav .mdl-tabs__tab.is-active { .libraryViewNav .pageTabButton:focus {
font-weight: 500 !important;
}
.libraryViewNav .pageTabButton.is-active {
color: #fff !important; color: #fff !important;
} }
.libraryViewNav .mdl-tabs__tab.is-active:after { .libraryViewNav .pageTabButton:before {
background: #52B54B !important; content: '';
position: absolute;
left: 0;
border: 0;
bottom: 0;
height: 2px;
transition: all .12s cubic-bezier(.4,0,1,1);
right: 0;
transform: translateX(-100%);
} }
.libraryViewNav::-webkit-scrollbar { .libraryViewNav .pageTabButton.is-active:before {
height: 0 !important; transform: none;
display: none; background: #52B54B;
}
.libraryViewNav .mdl-tabs__tab .mdl-tabs__ripple-container .mdl-ripple {
background: #52B54B !important;
} }
.viewMenuBar, .libraryViewNav { .viewMenuBar, .libraryViewNav {

View file

@ -2,17 +2,21 @@
font-weight: bold !important; font-weight: bold !important;
} }
.libraryViewNav .mdl-tabs__tab { .libraryViewNav .pageTabButton {
font-weight: bold !important; font-weight: bold !important;
} }
.libraryViewNav .pageTabButton:focus {
font-weight: bold !important;
}
@media all and (min-width: 300px) { @media all and (min-width: 300px) {
.libraryViewNav .mdl-tabs__tab-bar { .libraryViewNav {
display: flex; display: flex;
} }
.libraryViewNav .mdl-tabs__tab { .libraryViewNav .pageTabButton {
flex-grow: 1; flex-grow: 1;
} }
} }

View file

@ -59,15 +59,11 @@ body:not(.dashboardDocument) .mainDrawerButton {
padding: 12px 13px 8px; padding: 12px 13px 8px;
} }
.libraryViewNav .mdl-tabs__ripple-container { .libraryViewNav .pageTabButton.is-active:after {
display: none !important; display: none !important;
} }
.libraryViewNav .mdl-tabs__tab.is-active:after { .libraryViewNav .pageTabButton.is-active {
display: none !important;
}
.libraryViewNav .mdl-tabs__tab.is-active {
color: #52B54B !important; color: #52B54B !important;
} }

View file

@ -1,15 +1,12 @@
<div id="indexPage" style="outline: none;" data-role="page" data-dom-cache="true" class="page homePage libraryPage allLibraryPage backdropPage pageWithAbsoluteTabs" data-title="${ButtonHome}" data-backdroptype="movie,series,game,book"> <div id="indexPage" style="outline: none;" data-role="page" data-dom-cache="true" class="page homePage libraryPage allLibraryPage backdropPage pageWithAbsoluteTabs" data-title="${ButtonHome}" data-backdroptype="movie,series,game,book">
<div class="mdl-tabs mdl-js-tabs mdl-js-ripple-effect">
<div class="libraryViewNav"> <div class="libraryViewNav">
<div class="mdl-tabs__tab-bar"> <button class="pageTabButton is-active" data-index="0">${TabHome}</button>
<a href="#homeTab" class="mdl-tabs__tab is-active" data-index="0">${TabHome}</a> <button class="pageTabButton" data-index="1">${TabNextUp}</button>
<a href="#nextUpTab" class="mdl-tabs__tab" data-index="1">${TabNextUp}</a> <button class="pageTabButton homeFavoritesTab" data-index="2">${TabFavorites}</button>
<a href="#favoritesTab" class="mdl-tabs__tab homeFavoritesTab" data-index="2">${TabFavorites}</a> <button class="pageTabButton" data-index="3">${TabUpcoming}</button>
<a href="#upcomingTab" class="mdl-tabs__tab" data-index="3">${TabUpcoming}</a>
</div> </div>
</div> <div class="is-active pageTabContent ehsContent" id="homeTab" data-index="0">
<div class="mdl-tabs__panel is-active pageTabContent ehsContent" id="homeTab" data-index="0">
<div class="ui-bar-b readOnlyContent welcomeMessage" style="display: none; padding: 2em; border-radius: 10px; margin: 2em auto; font-weight: normal;"> <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> <h1 style="margin-top: 0;" class="tourHeader"></h1>
<p> <p>
@ -19,7 +16,7 @@
<div class="sections"></div> <div class="sections"></div>
</div> </div>
<div class="mdl-tabs__panel pageTabContent ehsContent" id="nextUpTab" data-index="1"> <div class="pageTabContent ehsContent" id="nextUpTab" data-index="1">
<div class="homePageSection"> <div class="homePageSection">
<div> <div>
<h1 class="listHeader nextUpHeader" style="display: inline-block; vertical-align: middle;">${HeaderNextUp}</h1> <h1 class="listHeader nextUpHeader" style="display: inline-block; vertical-align: middle;">${HeaderNextUp}</h1>
@ -30,10 +27,10 @@
</div> </div>
<p class="noNextUpItems" style="display: none;">${NoNextUpItemsMessage}</p> <p class="noNextUpItems" style="display: none;">${NoNextUpItemsMessage}</p>
</div> </div>
<div class="mdl-tabs__panel pageTabContent ehsContent" id="favoritesTab" data-index="2"> <div class="pageTabContent ehsContent" id="favoritesTab" data-index="2">
<div class="favoriteSections"></div> <div class="favoriteSections"></div>
</div> </div>
<div class="mdl-tabs__panel pageTabContent ehsContent" id="upcomingTab" data-index="3"> <div class="pageTabContent ehsContent" id="upcomingTab" data-index="3">
<div id="upcomingItems" class="itemsContainer"> <div id="upcomingItems" class="itemsContainer">
</div> </div>
<div class="noItemsMessage" style="display: none;"> <div class="noItemsMessage" style="display: none;">
@ -44,7 +41,6 @@
</div> </div>
</div> </div>
</div>
<div data-role="content"> <div data-role="content">

View file

@ -1,16 +1,13 @@
<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,MaterialTabs,paper-checkbox,paper-button"> <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 class="mdl-tabs mdl-js-tabs mdl-js-ripple-effect">
<div class="libraryViewNav"> <div class="libraryViewNav">
<div class="mdl-tabs__tab-bar"> <button class="pageTabButton is-active" data-index="0">${TabSuggestions}</button>
<a href="#suggestionsTab" class="mdl-tabs__tab is-active" data-index="0">${TabSuggestions}</a> <button class="pageTabButton" data-index="1">${TabGuide}</button>
<a href="#guideTab" class="mdl-tabs__tab" data-index="1">${TabGuide}</a> <button class="pageTabButton" data-index="2">${TabChannels}</button>
<a href="#channelsTab" class="mdl-tabs__tab" data-index="2">${TabChannels}</a> <button class="pageTabButton" data-index="3">${TabRecordings}</button>
<a href="#recordingsTab" class="mdl-tabs__tab" data-index="3">${TabRecordings}</a> <button class="pageTabButton" data-index="4">${TabSeries}</button>
<a href="#seriesTab" class="mdl-tabs__tab" data-index="4">${TabSeries}</a>
</div> </div>
</div> <div class="is-active pageTabContent ehsContent" id="suggestionsTab" data-index="0">
<div class="mdl-tabs__panel is-active pageTabContent ehsContent" id="suggestionsTab" data-index="0">
<div id="activePrograms" class="homePageSection"> <div id="activePrograms" class="homePageSection">
<h1 class="listHeader">${HeaderWhatsOnTV}</h1> <h1 class="listHeader">${HeaderWhatsOnTV}</h1>
<div class="activeProgramItems itemsContainer noautoinit"></div> <div class="activeProgramItems itemsContainer noautoinit"></div>
@ -46,16 +43,16 @@
<br /> <br />
</div> </div>
</div> </div>
<div class="mdl-tabs__panel pageTabContent ehsContent fullWidth flexPageTabContent absolutePageTabContent" id="guideTab" data-index="1" style="width:auto;padding-top:0; padding-bottom: 0;"> <div class="pageTabContent ehsContent fullWidth flexPageTabContent absolutePageTabContent" id="guideTab" data-index="1" style="width:auto;padding-top:0; padding-bottom: 0;">
</div> </div>
<div class="mdl-tabs__panel pageTabContent ehsContent" id="channelsTab" data-index="2"> <div class="pageTabContent ehsContent" id="channelsTab" data-index="2">
<div class="viewSettings"> <div class="viewSettings">
<div class="listTopPaging"> <div class="listTopPaging">
</div> </div>
</div> </div>
<div id="items" class="itemsContainer"></div> <div id="items" class="itemsContainer"></div>
</div> </div>
<div class="mdl-tabs__panel pageTabContent ehsContent" id="recordingsTab" data-index="3"> <div class="pageTabContent ehsContent" id="recordingsTab" data-index="3">
<div id="activeRecordings" class="homePageSection hide"> <div id="activeRecordings" class="homePageSection hide">
<h1 class="listHeader">${HeaderActiveRecordings}</h1> <h1 class="listHeader">${HeaderActiveRecordings}</h1>
<div class="recordingItems itemsContainer"></div> <div class="recordingItems itemsContainer"></div>
@ -80,11 +77,10 @@
<div id="recordingGroupItems"></div> <div id="recordingGroupItems"></div>
</div> </div>
</div> </div>
<div class="mdl-tabs__panel pageTabContent ehsContent" id="seriesTab" data-index="4"> <div class="pageTabContent ehsContent" id="seriesTab" data-index="4">
<div style="max-width: 700px; margin: 0 auto;" id="items"> <div style="max-width: 700px; margin: 0 auto;" id="items">
</div> </div>
</div> </div>
</div>
<div data-role="content"> <div data-role="content">
</div> </div>

View file

@ -1,17 +1,14 @@
<div id="moviesPage" data-role="page" data-dom-cache="true" class="page libraryPage backdropPage pageWithAbsoluteTabs collectionEditorPage" data-backdroptype="movie"> <div id="moviesPage" data-role="page" data-dom-cache="true" class="page libraryPage backdropPage pageWithAbsoluteTabs collectionEditorPage" data-backdroptype="movie">
<div class="mdl-tabs mdl-js-tabs mdl-js-ripple-effect">
<div class="libraryViewNav"> <div class="libraryViewNav">
<div class="mdl-tabs__tab-bar"> <button class="pageTabButton is-active" data-index="0">${TabSuggestions}</button>
<a href="#suggestionsTab" class="mdl-tabs__tab is-active" data-index="0">${TabSuggestions}</a> <button class="pageTabButton" data-index="1">${TabMovies}</button>
<a href="#moviesTab" class="mdl-tabs__tab" data-index="1">${TabMovies}</a> <button class="pageTabButton movieTrailersTab" data-index="2">${TabTrailers}</button>
<a href="#trailersTab" class="mdl-tabs__tab movieTrailersTab" data-index="2">${TabTrailers}</a> <button class="pageTabButton" data-index="3">${TabCollections}</button>
<a href="#collectionsTab" class="mdl-tabs__tab" data-index="3">${TabCollections}</a> <button class="pageTabButton" data-index="4">${TabGenres}</button>
<a href="#genresTab" class="mdl-tabs__tab" data-index="4">${TabGenres}</a> <button class="pageTabButton movieStudiosTab" data-index="5">${TabStudios}</button>
<a href="#studiosTab" class="mdl-tabs__tab movieStudiosTab" data-index="5">${TabStudios}</a>
</div> </div>
</div> <div class="is-active pageTabContent ehsContent" id="suggestionsTab" data-index="0">
<div class="mdl-tabs__panel is-active pageTabContent ehsContent" id="suggestionsTab" data-index="0">
<div id="resumableSection" style="display: none;" class="homePageSection"> <div id="resumableSection" style="display: none;" class="homePageSection">
<div> <div>
<h1 class="listHeader" style="display:inline-block;vertical-align:middle;">${HeaderResume}</h1> <h1 class="listHeader" style="display:inline-block;vertical-align:middle;">${HeaderResume}</h1>
@ -39,7 +36,7 @@
<p>${MessageNoMovieSuggestionsAvailable}</p> <p>${MessageNoMovieSuggestionsAvailable}</p>
</div> </div>
</div> </div>
<div class="mdl-tabs__panel pageTabContent ehsContent" id="moviesTab" data-index="1"> <div class="pageTabContent ehsContent" id="moviesTab" data-index="1">
<div class="alphabetPicker"> <div class="alphabetPicker">
</div> </div>
<div class="viewSettings"> <div class="viewSettings">
@ -48,7 +45,7 @@
</div> </div>
<div class="itemsContainer" style="text-align:center;"></div> <div class="itemsContainer" style="text-align:center;"></div>
</div> </div>
<div class="mdl-tabs__panel pageTabContent ehsContent" id="trailersTab" data-index="2"> <div class="pageTabContent ehsContent" id="trailersTab" data-index="2">
<div class="alphabetPicker"> <div class="alphabetPicker">
</div> </div>
<div class="viewSettings"> <div class="viewSettings">
@ -58,7 +55,7 @@
<div class="itemsContainer" style="text-align:center;"></div> <div class="itemsContainer" style="text-align:center;"></div>
<p class="noItemsMessage" style="display:none;text-align:center;">${MessageNoTrailersFound}</p> <p class="noItemsMessage" style="display:none;text-align:center;">${MessageNoTrailersFound}</p>
</div> </div>
<div class="mdl-tabs__panel pageTabContent ehsContent" id="collectionsTab" data-index="3"> <div class="pageTabContent ehsContent" id="collectionsTab" data-index="3">
<div class="viewSettings"> <div class="viewSettings">
<div class="listTopPaging"> <div class="listTopPaging">
@ -72,21 +69,20 @@
<paper-fab class="btnNewCollection bottomFab" icon="add" style="position:fixed;right:20px;background-color:#db4437;"></paper-fab> <paper-fab class="btnNewCollection bottomFab" icon="add" style="position:fixed;right:20px;background-color:#db4437;"></paper-fab>
</div> </div>
<div class="mdl-tabs__panel pageTabContent ehsContent" id="genresTab" data-index="4"> <div class="pageTabContent ehsContent" id="genresTab" data-index="4">
<div class="viewSettings"> <div class="viewSettings">
<div class="listTopPaging"> <div class="listTopPaging">
</div> </div>
</div> </div>
<div class="itemsContainer"></div> <div class="itemsContainer"></div>
</div> </div>
<div class="mdl-tabs__panel pageTabContent ehsContent" id="studiosTab" data-index="5"> <div class="pageTabContent ehsContent" id="studiosTab" data-index="5">
<div class="viewSettings"> <div class="viewSettings">
<div class="listTopPaging"> <div class="listTopPaging">
</div> </div>
</div> </div>
<div class="itemsContainer" style="text-align:center;"></div> <div class="itemsContainer" style="text-align:center;"></div>
</div> </div>
</div>
<div data-role="content"> <div data-role="content">

View file

@ -1,18 +1,15 @@
<div id="musicRecommendedPage" data-dom-cache="true" data-role="page" class="page libraryPage backdropPage pageWithAbsoluteTabs" data-backdroptype="musicartist" data-require="scripts/musicrecommended,MaterialTabs,paper-checkbox,scripts/alphapicker"> <div id="musicRecommendedPage" data-dom-cache="true" data-role="page" class="page libraryPage backdropPage pageWithAbsoluteTabs" data-backdroptype="musicartist" data-require="scripts/musicrecommended,paper-checkbox,scripts/alphapicker">
<div class="mdl-tabs mdl-js-tabs mdl-js-ripple-effect">
<div class="libraryViewNav"> <div class="libraryViewNav">
<div class="mdl-tabs__tab-bar"> <button class="pageTabButton is-active" data-index="0">${TabSuggestions}</button>
<a href="#suggestionsTab" class="mdl-tabs__tab is-active" data-index="0">${TabSuggestions}</a> <button class="pageTabButton" data-index="1">${TabAlbums}</button>
<a href="#albumsTab" class="mdl-tabs__tab" data-index="1">${TabAlbums}</a> <button class="pageTabButton" data-index="2">${TabAlbumArtists}</button>
<a href="#albumArtistsTab" class="mdl-tabs__tab" data-index="2">${TabAlbumArtists}</a> <button class="pageTabButton" data-index="3">${TabArtists}</button>
<a href="#artistsTab" class="mdl-tabs__tab" data-index="3">${TabArtists}</a> <button class="pageTabButton" data-index="4">${TabSongs}</button>
<a href="#songsTab" class="mdl-tabs__tab" data-index="4">${TabSongs}</a> <button class="pageTabButton" data-index="5">${TabGenres}</button>
<a href="#genresTab" class="mdl-tabs__tab" data-index="5">${TabGenres}</a> <button class="pageTabButton" data-index="6">${TabFolders}</button>
<a href="#foldersTab" class="mdl-tabs__tab" data-index="6">${TabFolders}</a>
</div> </div>
</div> <div class="pageTabContent is-active pageTabContent ehsContent" id="suggestionsTab" data-index="0">
<div class="mdl-tabs__panel is-active pageTabContent ehsContent" id="suggestionsTab" data-index="0">
<div class="homePageSection"> <div class="homePageSection">
<h1 class="listHeader">${HeaderLatestMusic}</h1> <h1 class="listHeader">${HeaderLatestMusic}</h1>
@ -43,7 +40,7 @@
<div class="favoriteSections homePageSection"></div> <div class="favoriteSections homePageSection"></div>
</div> </div>
<div class="mdl-tabs__panel pageTabContent ehsContent" id="albumsTab" data-index="1"> <div class="pageTabContent pageTabContent ehsContent" id="albumsTab" data-index="1">
<div class="alphabetPicker"> <div class="alphabetPicker">
</div> </div>
<div class="viewSettings"> <div class="viewSettings">
@ -52,7 +49,7 @@
</div> </div>
<div id="items" class="itemsContainer paddedItemsContainer"></div> <div id="items" class="itemsContainer paddedItemsContainer"></div>
</div> </div>
<div class="mdl-tabs__panel pageTabContent ehsContent" id="albumArtistsTab" data-index="2"> <div class="pageTabContent pageTabContent ehsContent" id="albumArtistsTab" data-index="2">
<div class="alphabetPicker"> <div class="alphabetPicker">
</div> </div>
<div class="viewSettings"> <div class="viewSettings">
@ -61,7 +58,7 @@
</div> </div>
<div id="items" class="itemsContainer paddedItemsContainer" style="text-align:center;"></div> <div id="items" class="itemsContainer paddedItemsContainer" style="text-align:center;"></div>
</div> </div>
<div class="mdl-tabs__panel pageTabContent ehsContent" id="artistsTab" data-index="3"> <div class="pageTabContent pageTabContent ehsContent" id="artistsTab" data-index="3">
<div class="alphabetPicker"> <div class="alphabetPicker">
</div> </div>
<div class="viewSettings"> <div class="viewSettings">
@ -70,28 +67,27 @@
</div> </div>
<div id="items" class="itemsContainer paddedItemsContainer" style="text-align:center;"></div> <div id="items" class="itemsContainer paddedItemsContainer" style="text-align:center;"></div>
</div> </div>
<div class="mdl-tabs__panel pageTabContent ehsContent" id="songsTab" data-index="4"> <div class="pageTabContent pageTabContent ehsContent" id="songsTab" data-index="4">
<div class="viewSettings"> <div class="viewSettings">
<div class="listTopPaging"> <div class="listTopPaging">
</div> </div>
</div> </div>
<div id="items" class="itemsContainer" style="max-width:1000px;margin: 0 auto;"></div> <div id="items" class="itemsContainer" style="max-width:1000px;margin: 0 auto;"></div>
</div> </div>
<div class="mdl-tabs__panel pageTabContent ehsContent" id="genresTab" data-index="5"> <div class="pageTabContent pageTabContent ehsContent" id="genresTab" data-index="5">
<div class="viewSettings"> <div class="viewSettings">
<div class="listTopPaging"> <div class="listTopPaging">
</div> </div>
</div> </div>
<div id="items" class="itemsContainer paddedItemsContainer"></div> <div id="items" class="itemsContainer paddedItemsContainer"></div>
</div> </div>
<div class="mdl-tabs__panel pageTabContent ehsContent" id="foldersTab" data-index="6"> <div class="pageTabContent pageTabContent ehsContent" id="foldersTab" data-index="6">
<div class="viewSettings"> <div class="viewSettings">
<div class="listTopPaging"> <div class="listTopPaging">
</div> </div>
</div> </div>
<div id="items" class="itemsContainer paddedItemsContainer"></div> <div id="items" class="itemsContainer paddedItemsContainer"></div>
</div> </div>
</div>
<div data-role="content"> <div data-role="content">
</div> </div>

View file

@ -9,7 +9,7 @@
<div class="detailSectionContent"> <div class="detailSectionContent">
<div class="fldSyncPath hide"> <div class="fldSyncPath hide">
<paper-input type="text" id="txtSyncPath" label="${LabelSyncPath}" style="display:inline-block;width:80%;" readonly></paper-input> <paper-input type="text" id="txtSyncPath" label="${LabelSyncPath}" style="display:inline-block;width:80%;"></paper-input>
<button is="paper-icon-button-light" class="btnSelectSyncPath"><iron-icon icon="search"></iron-icon></button> <button is="paper-icon-button-light" class="btnSelectSyncPath"><iron-icon icon="search"></iron-icon></button>
</div> </div>

View file

@ -10,15 +10,12 @@
</div> </div>
</div> </div>
<div class="mdl-tabs mdl-js-tabs mdl-js-ripple-effect">
<div class="libraryViewNav headroomDisabled"> <div class="libraryViewNav headroomDisabled">
<div class="mdl-tabs__tab-bar"> <button class="pageTabButton is-active" data-index="0">${TabNowPlaying}</button>
<a href="#nowPlayingTab" class="mdl-tabs__tab is-active" data-index="0">${TabNowPlaying}</a> <button class="pageTabButton" data-index="1">${TabControls}</button>
<a href="#controlsTab" class="mdl-tabs__tab" data-index="1">${TabControls}</a> <button class="pageTabButton" data-index="2">${TabPlaylist}</button>
<a href="#playlistTab" class="mdl-tabs__tab" data-index="2">${TabPlaylist}</a>
</div> </div>
</div> <div class="is-active pageTabContent ehsContent" id="nowPlayingTab" data-index="0">
<div class="mdl-tabs__panel is-active pageTabContent ehsContent" id="nowPlayingTab" data-index="0">
<div style="text-align:center;"> <div style="text-align:center;">
<div class="nowPlayingPageTitle" style="line-height: normal;"> <div class="nowPlayingPageTitle" style="line-height: normal;">
</div> </div>
@ -62,7 +59,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="mdl-tabs__panel pageTabContent ehsContent" id="controlsTab" data-index="1"> <div class="pageTabContent ehsContent" id="controlsTab" data-index="1">
<div style="text-align:center;"> <div style="text-align:center;">
<div> <div>
<paper-fab icon="keyboard-arrow-up" class="btnArrowUp btnCommand subdued" title="${ButtonArrowUp}" data-command="MoveUp"></paper-fab> <paper-fab icon="keyboard-arrow-up" class="btnArrowUp btnCommand subdued" title="${ButtonArrowUp}" data-command="MoveUp"></paper-fab>
@ -122,12 +119,11 @@
</div> </div>
</div> </div>
</div> </div>
<div class="mdl-tabs__panel pageTabContent ehsContent" id="playlistTab" data-index="2"> <div class="pageTabContent ehsContent" id="playlistTab" data-index="2">
<div class="playlist itemsContainer" style="max-width: 800px; margin: 3em auto 0; padding-bottom: 200px;"> <div class="playlist itemsContainer" style="max-width: 800px; margin: 3em auto 0; padding-bottom: 200px;">
</div> </div>
</div> </div>
</div> </div>
</div>
<div data-role="content" style="overflow:visible;"> <div data-role="content" style="overflow:visible;">
</div> </div>

View file

@ -74,11 +74,9 @@
var page = this; var page = this;
var mdlTabs = page.querySelector('.mdl-tabs'); var mdlTabs = page.querySelector('.libraryViewNav');
componentHandler.upgradeAllRegistered(page); libraryBrowser.configurePaperLibraryTabs(page, mdlTabs, page.querySelectorAll('.pageTabContent'));
libraryBrowser.configurePaperLibraryTabs(page, mdlTabs);
mdlTabs.addEventListener('tabchange', function (e) { mdlTabs.addEventListener('tabchange', function (e) {
loadTab(page, parseInt(e.detail.selectedTabIndex)); loadTab(page, parseInt(e.detail.selectedTabIndex));

View file

@ -26,7 +26,7 @@
pageIdOn('pageinit', "channelsPage", function () { pageIdOn('pageinit', "channelsPage", function () {
var page = this; var page = this;
var mdlTabs = page.querySelector('.mdl-tabs'); var mdlTabs = page.querySelector('.libraryViewNav');
mdlTabs.addEventListener('tabchange', function (e) { mdlTabs.addEventListener('tabchange', function (e) {
loadTab(page, parseInt(e.detail.selectedTabIndex)); loadTab(page, parseInt(e.detail.selectedTabIndex));

View file

@ -243,21 +243,20 @@
var self = this; var self = this;
self.renderTab = function () { self.renderTab = function () {
var tabContent = view.querySelector('.mdl-tabs__panel[data-index=\'' + 0 + '\']'); var tabContent = view.querySelector('.pageTabContent[data-index=\'' + 0 + '\']');
loadHomeTab(view, tabContent); loadHomeTab(view, tabContent);
}; };
var mdlTabs = view.querySelector('.mdl-tabs'); var mdlTabs = view.querySelector('.libraryViewNav');
componentHandler.upgradeAllRegistered(view); libraryBrowser.configurePaperLibraryTabs(view, mdlTabs, view.querySelectorAll('.pageTabContent'));
libraryBrowser.configurePaperLibraryTabs(view, mdlTabs);
var tabControllers = []; var tabControllers = [];
var renderedTabs = []; var renderedTabs = [];
function loadTab(page, index) { function loadTab(page, index) {
var tabContent = view.querySelector('.mdl-tabs__panel[data-index=\'' + index + '\']'); var tabContent = view.querySelector('.pageTabContent[data-index=\'' + index + '\']');
var depends = []; var depends = [];
switch (index) { switch (index) {

View file

@ -1,4 +1,4 @@
define(['playlistManager', 'appSettings', 'appStorage', 'apphost', 'datetime', 'jQuery', 'itemHelper', 'mediaInfo', 'scrollStyles'], function (playlistManager, appSettings, appStorage, appHost, datetime, $, itemHelper, mediaInfo) { define(['playlistManager', 'scrollHelper', 'appSettings', 'appStorage', 'apphost', 'datetime', 'jQuery', 'itemHelper', 'mediaInfo', 'scrollStyles'], function (playlistManager, scrollHelper, appSettings, appStorage, appHost, datetime, $, itemHelper, mediaInfo) {
function parentWithClass(elem, className) { function parentWithClass(elem, className) {
@ -176,7 +176,7 @@
if (selected == null) { if (selected == null) {
var elem = tabs.querySelector('.mdl-tabs__tab.is-active'); var elem = tabs.querySelector('.pageTabButton.is-active');
if (elem) { if (elem) {
return parseInt(elem.getAttribute('data-index')); return parseInt(elem.getAttribute('data-index'));
} }
@ -191,18 +191,18 @@
} }
})); }));
} else { } else {
var tabButtons = tabs.querySelectorAll('.mdl-tabs__tab'); var tabButtons = tabs.querySelectorAll('.pageTabButton');
tabButtons[selected].click(); tabButtons[selected].click();
} }
}, },
configureSwipeTabs: function (ownerpage, tabs) { configureSwipeTabs: function (ownerpage, tabs) {
var pageCount = tabs.querySelectorAll('.mdl-tabs__panel').length; var pageCount = ownerpage.querySelectorAll('.pageTabContent').length;
require(['hammer'], function (Hammer) { require(['hammer'], function (Hammer) {
var hammertime = new Hammer(tabs); var hammertime = new Hammer(ownerpage);
hammertime.get('swipe').set({ direction: Hammer.DIRECTION_HORIZONTAL }); hammertime.get('swipe').set({ direction: Hammer.DIRECTION_HORIZONTAL });
hammertime.on('swipeleft', function (e) { hammertime.on('swipeleft', function (e) {
@ -225,22 +225,64 @@
}); });
}, },
configurePaperLibraryTabs: function (ownerpage, tabs) { configurePaperLibraryTabs: function (ownerpage, tabs, panels) {
if (!browserInfo.safari) { if (!browserInfo.safari) {
LibraryBrowser.configureSwipeTabs(ownerpage, tabs); LibraryBrowser.configureSwipeTabs(ownerpage, tabs);
} }
tabs.querySelector('.mdl-tabs__tab-bar').addEventListener('click', function (e) { var buttons = tabs.querySelectorAll('.pageTabButton');
for (var i = 0, length = buttons.length; i < length; i++) {
buttons[i].classList.add('mdl-button');
buttons[i].classList.add('mdl-js-button');
}
var link = parentWithClass(e.target, 'mdl-tabs__tab'); tabs.classList.add('hiddenScrollX');
if (link) { function fadeInRight(elem) {
var pct = browserInfo.mobile ? '1%' : '0.5%';
var keyframes = [
{ opacity: '0', transform: 'translate3d(' + pct + ', 0, 0)', offset: 0 },
{ opacity: '1', transform: 'none', offset: 1 }];
elem.animate(keyframes, {
duration: 300,
iterations: 1,
easing: 'ease-out'
});
}
tabs.addEventListener('click', function (e) {
var current = tabs.querySelector('.is-active');
var link = parentWithClass(e.target, 'pageTabButton');
if (link && link != current) {
if (current) {
current.classList.remove('is-active');
panels[parseInt(current.getAttribute('data-index'))].classList.remove('is-active');
}
link.classList.add('is-active');
var index = parseInt(link.getAttribute('data-index'));
tabs.dispatchEvent(new CustomEvent("tabchange", { tabs.dispatchEvent(new CustomEvent("tabchange", {
detail: { detail: {
selectedTabIndex: parseInt(link.getAttribute('data-index')) selectedTabIndex: index
} }
})); }));
panels[index].classList.add('is-active');
//if (browserInfo.animate) {
// fadeInRight(panels[index]);
//}
// If toCenter is called syncronously within the click event, it sometimes ends up canceling it
//setTimeout(function() {
// scrollHelper.toCenter(tabs, link, true);
//}, 10);
} }
}); });
@ -271,7 +313,7 @@
onTabbedpagebeforeshowInternal: function (page, e, isFirstLoad) { onTabbedpagebeforeshowInternal: function (page, e, isFirstLoad) {
var pageTabsContainer = page.querySelector('.mdl-tabs'); var pageTabsContainer = page.querySelector('.libraryViewNav');
if (isFirstLoad) { if (isFirstLoad) {

View file

@ -98,7 +98,7 @@
ApiClient.getLiveTvRecordings({ ApiClient.getLiveTvRecordings({
userId: Dashboard.getCurrentUserId(), userId: Dashboard.getCurrentUserId(),
limit: 6, limit: 4,
IsInProgress: false, IsInProgress: false,
Fields: 'CanDelete,PrimaryImageAspectRatio' Fields: 'CanDelete,PrimaryImageAspectRatio'

View file

@ -141,7 +141,7 @@
function loadTab(page, index) { function loadTab(page, index) {
var tabContent = page.querySelector('.mdl-tabs__panel[data-index=\'' + index + '\']'); var tabContent = page.querySelector('.pageTabContent[data-index=\'' + index + '\']');
var depends = []; var depends = [];
var scope = 'LiveTvPage'; var scope = 'LiveTvPage';
var renderMethod = ''; var renderMethod = '';
@ -197,11 +197,9 @@
var page = this; var page = this;
var mdlTabs = page.querySelector('.mdl-tabs'); var mdlTabs = page.querySelector('.libraryViewNav');
componentHandler.upgradeAllRegistered(page); libraryBrowser.configurePaperLibraryTabs(page, mdlTabs, page.querySelectorAll('.pageTabContent'));
libraryBrowser.configurePaperLibraryTabs(page, mdlTabs);
mdlTabs.addEventListener('tabchange', function (e) { mdlTabs.addEventListener('tabchange', function (e) {
loadTab(page, parseInt(e.detail.selectedTabIndex)); loadTab(page, parseInt(e.detail.selectedTabIndex));

View file

@ -271,19 +271,19 @@
var self = this; var self = this;
self.initTab = function() { self.initTab = function () {
var tabContent = view.querySelector('.mdl-tabs__panel[data-index=\'' + 0 + '\']'); var tabContent = view.querySelector('.pageTabContent[data-index=\'' + 0 + '\']');
initSuggestedTab(view, tabContent); initSuggestedTab(view, tabContent);
}; };
self.renderTab = function () { self.renderTab = function () {
var tabContent = view.querySelector('.mdl-tabs__panel[data-index=\'' + 0 + '\']'); var tabContent = view.querySelector('.pageTabContent[data-index=\'' + 0 + '\']');
loadSuggestionsTab(view, params, tabContent); loadSuggestionsTab(view, params, tabContent);
}; };
$('.recommendations', view).createCardMenus(); $('.recommendations', view).createCardMenus();
var mdlTabs = view.querySelector('.mdl-tabs'); var mdlTabs = view.querySelector('.libraryViewNav');
function onPlaybackStop(e, state) { function onPlaybackStop(e, state) {
@ -297,22 +297,20 @@
} }
} }
componentHandler.upgradeAllRegistered(view);
var baseUrl = 'movies.html'; var baseUrl = 'movies.html';
var topParentId = params.topParentId; var topParentId = params.topParentId;
if (topParentId) { if (topParentId) {
baseUrl += '?topParentId=' + topParentId; baseUrl += '?topParentId=' + topParentId;
} }
libraryBrowser.configurePaperLibraryTabs(view, mdlTabs); libraryBrowser.configurePaperLibraryTabs(view, mdlTabs, view.querySelectorAll('.pageTabContent'));
var tabControllers = []; var tabControllers = [];
var renderedTabs = []; var renderedTabs = [];
function loadTab(page, index) { function loadTab(page, index) {
var tabContent = page.querySelector('.mdl-tabs__panel[data-index=\'' + index + '\']'); var tabContent = view.querySelector('.pageTabContent[data-index=\'' + index + '\']');
var depends = []; var depends = [];
switch (index) { switch (index) {

View file

@ -216,7 +216,7 @@
function loadTab(page, index) { function loadTab(page, index) {
var tabContent = page.querySelector('.mdl-tabs__panel[data-index=\'' + index + '\']'); var tabContent = page.querySelector('.pageTabContent[data-index=\'' + index + '\']');
var depends = []; var depends = [];
var scope = 'MusicPage'; var scope = 'MusicPage';
var renderMethod = ''; var renderMethod = '';
@ -285,7 +285,7 @@
$('.recommendations', page).createCardMenus(); $('.recommendations', page).createCardMenus();
var mdlTabs = page.querySelector('.mdl-tabs'); var mdlTabs = page.querySelector('.libraryViewNav');
var baseUrl = 'music.html'; var baseUrl = 'music.html';
var topParentId = LibraryMenu.getTopParentId(); var topParentId = LibraryMenu.getTopParentId();
@ -293,8 +293,7 @@
baseUrl += '?topParentId=' + topParentId; baseUrl += '?topParentId=' + topParentId;
} }
componentHandler.upgradeAllRegistered(page); libraryBrowser.configurePaperLibraryTabs(page, mdlTabs, page.querySelectorAll('.pageTabContent'));
libraryBrowser.configurePaperLibraryTabs(page, mdlTabs);
mdlTabs.addEventListener('tabchange', function (e) { mdlTabs.addEventListener('tabchange', function (e) {
loadTab(page, parseInt(e.detail.selectedTabIndex)); loadTab(page, parseInt(e.detail.selectedTabIndex));

View file

@ -2004,7 +2004,6 @@ var AppInfo = {};
define("material-design-lite", [bowerPath + "/material-design-lite/material.min", "css!" + bowerPath + "/material-design-lite/material"]); define("material-design-lite", [bowerPath + "/material-design-lite/material.min", "css!" + bowerPath + "/material-design-lite/material"]);
define("MaterialSpinner", ["material-design-lite"]); define("MaterialSpinner", ["material-design-lite"]);
define("MaterialTabs", ["material-design-lite"]);
define("jQuery", [bowerPath + '/jquery/dist/jquery.slim.min'], function () { define("jQuery", [bowerPath + '/jquery/dist/jquery.slim.min'], function () {
@ -2560,7 +2559,7 @@ var AppInfo = {};
defineRoute({ defineRoute({
path: '/home.html', path: '/home.html',
dependencies: ['MaterialTabs'], dependencies: [],
autoFocus: false, autoFocus: false,
controller: 'scripts/indexpage' controller: 'scripts/indexpage'
}); });
@ -2614,7 +2613,7 @@ var AppInfo = {};
defineRoute({ defineRoute({
path: '/livetv.html', path: '/livetv.html',
dependencies: [], dependencies: ['paper-button'],
autoFocus: false autoFocus: false
}); });
@ -2729,7 +2728,7 @@ var AppInfo = {};
defineRoute({ defineRoute({
path: '/movies.html', path: '/movies.html',
dependencies: ['MaterialTabs', 'paper-checkbox', 'paper-fab', 'scripts/alphapicker', 'paper-button'], dependencies: ['paper-checkbox', 'paper-fab', 'scripts/alphapicker', 'paper-button'],
autoFocus: false, autoFocus: false,
controller: 'scripts/moviesrecommended' controller: 'scripts/moviesrecommended'
}); });
@ -2811,7 +2810,7 @@ var AppInfo = {};
defineRoute({ defineRoute({
path: '/nowplaying.html', path: '/nowplaying.html',
dependencies: ['MaterialTabs', 'paper-icon-button-light', 'paper-slider', 'paper-button'], dependencies: ['paper-icon-button-light', 'paper-slider', 'paper-button'],
controller: 'scripts/nowplayingpage', controller: 'scripts/nowplayingpage',
autoFocus: false autoFocus: false
}); });
@ -2944,7 +2943,7 @@ var AppInfo = {};
defineRoute({ defineRoute({
path: '/tv.html', path: '/tv.html',
dependencies: ['paper-checkbox', 'paper-button', 'paper-icon-button-light', 'MaterialTabs'], dependencies: ['paper-checkbox', 'paper-icon-button-light', 'paper-button'],
autoFocus: false, autoFocus: false,
controller: 'scripts/tvrecommended' controller: 'scripts/tvrecommended'
}); });

View file

@ -181,7 +181,7 @@
function loadTab(page, index) { function loadTab(page, index) {
var tabContent = page.querySelector('.mdl-tabs__panel[data-index=\'' + index + '\']'); var tabContent = page.querySelector('.pageTabContent[data-index=\'' + index + '\']');
var depends = []; var depends = [];
switch (index) { switch (index) {
@ -232,7 +232,7 @@
}); });
} }
var mdlTabs = view.querySelector('.mdl-tabs'); var mdlTabs = view.querySelector('.libraryViewNav');
function onPlaybackStop(e, state) { function onPlaybackStop(e, state) {
@ -246,8 +246,6 @@
} }
} }
componentHandler.upgradeAllRegistered(view);
var baseUrl = 'tv.html'; var baseUrl = 'tv.html';
var topParentId = params.topParentId; var topParentId = params.topParentId;
if (topParentId) { if (topParentId) {
@ -260,7 +258,7 @@
view.querySelector('#resumableItems').classList.remove('hiddenScrollX'); view.querySelector('#resumableItems').classList.remove('hiddenScrollX');
} }
libraryBrowser.createCardMenus(view.querySelector('#resumableItems')); libraryBrowser.createCardMenus(view.querySelector('#resumableItems'));
libraryBrowser.configurePaperLibraryTabs(view, mdlTabs); libraryBrowser.configurePaperLibraryTabs(view, mdlTabs, view.querySelectorAll('.pageTabContent'));
mdlTabs.addEventListener('tabchange', function (e) { mdlTabs.addEventListener('tabchange', function (e) {
loadTab(view, parseInt(e.detail.selectedTabIndex)); loadTab(view, parseInt(e.detail.selectedTabIndex));