improve next up performance

dashboard-ui/bower_components/emby-webcomponents/emby-tabs/emby-tabs.js

@@ -1 +1 @@
-define(["dom","scroller","browser","layoutManager","focusManager","registerElement","css!./emby-tabs","scrollStyles"],function(dom,scroller,browser,layoutManager,focusManager){"use strict";function setActiveTabButton(tabs,newButton,oldButton,animate){newButton.classList.add(activeButtonClass)}function getFocusCallback(tabs,e){return function(){onClick.call(tabs,e)}}function onFocus(e){layoutManager.tv&&(this.focusTimeout&&clearTimeout(this.focusTimeout),this.focusTimeout=setTimeout(getFocusCallback(this,e),700))}function getTabPanel(tabs,index){var tabsContainer=dom.parentWithClass(tabs,"tabs-container");if(tabsContainer)return tabsContainer.querySelector('.tabContent[data-index="'+index+'"]')}function removeActivePanelClass(tabs,index){var tabPanel=getTabPanel(tabs,index);tabPanel&&tabPanel.classList.remove("is-active")}function fadeInRight(elem){var pct=browser.mobile?"4%":"0.5%",keyframes=[{opacity:"0",transform:"translate3d("+pct+", 0, 0)",offset:0},{opacity:"1",transform:"none",offset:1}];elem.animate(keyframes,{duration:160,iterations:1,easing:"ease-out"})}function triggerBeforeTabChange(tabs,index,previousIndex){tabs.dispatchEvent(new CustomEvent("beforetabchange",{detail:{selectedTabIndex:index,previousIndex:previousIndex}})),null!=previousIndex&&previousIndex!==index&&removeActivePanelClass(tabs,previousIndex);var newPanel=getTabPanel(tabs,index);newPanel&&(newPanel.animate&&fadeInRight(newPanel),newPanel.classList.add("is-active"))}function onClick(e){this.focusTimeout&&clearTimeout(this.focusTimeout);var tabs=this,current=tabs.querySelector("."+activeButtonClass),tabButton=dom.parentWithClass(e.target,buttonClass);if(tabButton&&tabButton!==current){current&&current.classList.remove(activeButtonClass);var previousIndex=current?parseInt(current.getAttribute("data-index")):null;setActiveTabButton(tabs,tabButton,current,!0);var index=parseInt(tabButton.getAttribute("data-index"));triggerBeforeTabChange(tabs,index,previousIndex),setTimeout(function(){tabs.selectedTabIndex=index,tabs.dispatchEvent(new CustomEvent("tabchange",{detail:{selectedTabIndex:index,previousIndex:previousIndex}}))},120),tabs.scroller&&tabs.scroller.toCenter(tabButton,!1)}}function initScroller(tabs){if(!tabs.scroller){var contentScrollSlider=tabs.querySelector(".emby-tabs-slider");contentScrollSlider?(tabs.scroller=new scroller(tabs,{horizontal:1,itemNav:0,mouseDragging:1,touchDragging:1,slidee:contentScrollSlider,smart:!0,releaseSwing:!0,scrollBy:200,speed:120,elasticBounds:1,dragHandle:1,dynamicHandle:1,clickBar:1,hiddenScroll:!0,requireAnimation:!browser.safari}),tabs.scroller.init()):tabs.classList.add("hiddenScrollX")}}var EmbyTabs=Object.create(HTMLDivElement.prototype),buttonClass="emby-tab-button",activeButtonClass=buttonClass+"-active";EmbyTabs.createdCallback=function(){this.classList.contains("emby-tabs")||(this.classList.add("emby-tabs"),this.classList.add("focusable"),dom.addEventListener(this,"click",onClick,{passive:!0}),dom.addEventListener(this,"focus",onFocus,{passive:!0,capture:!0}))},EmbyTabs.focus=function(){var selected=this.querySelector("."+activeButtonClass);selected?focusManager.focus(selected):focusManager.autoFocus(this)},EmbyTabs.refresh=function(){this.scroller&&this.scroller.reload()},EmbyTabs.attachedCallback=function(){initScroller(this);var current=this.querySelector("."+activeButtonClass),currentIndex=current?parseInt(current.getAttribute("data-index")):parseInt(this.getAttribute("data-index")||"1");if(currentIndex!==-1){var tabButtons=this.querySelectorAll("."+buttonClass),newTabButton=tabButtons[currentIndex];newTabButton&&setActiveTabButton(this,newTabButton,current,!1)}},EmbyTabs.detachedCallback=function(){this.scroller&&(this.scroller.destroy(),this.scroller=null),dom.removeEventListener(this,"click",onClick,{passive:!0}),dom.removeEventListener(this,"focus",onFocus,{passive:!0,capture:!0})},EmbyTabs.selectedIndex=function(selected,triggerEvent){var tabs=this;if(null==selected)return tabs.selectedTabIndex||0;var current=tabs.selectedIndex();tabs.selectedTabIndex=selected;var tabButtons=tabs.querySelectorAll("."+buttonClass);if(current===selected||triggerEvent===!1){triggerBeforeTabChange(tabs,selected,current),tabs.dispatchEvent(new CustomEvent("tabchange",{detail:{selectedTabIndex:selected}}));var currentTabButton=tabButtons[current];setActiveTabButton(tabs,tabButtons[selected],currentTabButton,!1),current!==selected&&currentTabButton&&currentTabButton.classList.remove(activeButtonClass)}else onClick.call(tabs,{target:tabButtons[selected]})},EmbyTabs.triggerBeforeTabChange=function(selected){var tabs=this;triggerBeforeTabChange(tabs,tabs.selectedIndex())},EmbyTabs.triggerTabChange=function(selected){var tabs=this;tabs.dispatchEvent(new CustomEvent("tabchange",{detail:{selectedTabIndex:tabs.selectedIndex()}}))},document.registerElement("emby-tabs",{prototype:EmbyTabs,extends:"div"})});
+define(["dom","scroller","browser","layoutManager","focusManager","registerElement","css!./emby-tabs","scrollStyles"],function(dom,scroller,browser,layoutManager,focusManager){"use strict";function setActiveTabButton(tabs,newButton,oldButton,animate){newButton.classList.add(activeButtonClass)}function getFocusCallback(tabs,e){return function(){onClick.call(tabs,e)}}function onFocus(e){layoutManager.tv&&(this.focusTimeout&&clearTimeout(this.focusTimeout),this.focusTimeout=setTimeout(getFocusCallback(this,e),700))}function getTabPanel(tabs,index){var tabsContainer=dom.parentWithClass(tabs,"tabs-container");if(tabsContainer)return tabsContainer.querySelector('.tabContent[data-index="'+index+'"]')}function removeActivePanelClass(tabs,index){var tabPanel=getTabPanel(tabs,index);tabPanel&&tabPanel.classList.remove("is-active")}function fadeInRight(elem){var pct=browser.mobile?"4%":"0.5%",keyframes=[{opacity:"0",transform:"translate3d("+pct+", 0, 0)",offset:0},{opacity:"1",transform:"none",offset:1}];elem.animate(keyframes,{duration:160,iterations:1,easing:"ease-out"})}function triggerBeforeTabChange(tabs,index,previousIndex){tabs.dispatchEvent(new CustomEvent("beforetabchange",{detail:{selectedTabIndex:index,previousIndex:previousIndex}})),null!=previousIndex&&previousIndex!==index&&removeActivePanelClass(tabs,previousIndex);var newPanel=getTabPanel(tabs,index);newPanel&&(newPanel.animate&&fadeInRight(newPanel),newPanel.classList.add("is-active"))}function onClick(e){this.focusTimeout&&clearTimeout(this.focusTimeout);var tabs=this,current=tabs.querySelector("."+activeButtonClass),tabButton=dom.parentWithClass(e.target,buttonClass);if(tabButton&&tabButton!==current){current&&current.classList.remove(activeButtonClass);var previousIndex=current?parseInt(current.getAttribute("data-index")):null;setActiveTabButton(tabs,tabButton,current,!0);var index=parseInt(tabButton.getAttribute("data-index"));triggerBeforeTabChange(tabs,index,previousIndex),setTimeout(function(){tabs.selectedTabIndex=index,tabs.dispatchEvent(new CustomEvent("tabchange",{detail:{selectedTabIndex:index,previousIndex:previousIndex}}))},120),tabs.scroller&&tabs.scroller.toCenter(tabButton,!1)}}function initScroller(tabs){if(!tabs.scroller){var contentScrollSlider=tabs.querySelector(".emby-tabs-slider");contentScrollSlider?(tabs.scroller=new scroller(tabs,{horizontal:1,itemNav:0,mouseDragging:1,touchDragging:1,slidee:contentScrollSlider,smart:!0,releaseSwing:!0,scrollBy:200,speed:120,elasticBounds:1,dragHandle:1,dynamicHandle:1,clickBar:1,hiddenScroll:!0,requireAnimation:!browser.safari}),tabs.scroller.init()):tabs.classList.add("hiddenScrollX")}}var EmbyTabs=Object.create(HTMLDivElement.prototype),buttonClass="emby-tab-button",activeButtonClass=buttonClass+"-active";EmbyTabs.createdCallback=function(){this.classList.contains("emby-tabs")||(this.classList.add("emby-tabs"),this.classList.add("focusable"),dom.addEventListener(this,"click",onClick,{passive:!0}),dom.addEventListener(this,"focus",onFocus,{passive:!0,capture:!0}),this.dispatchEvent(new CustomEvent("ready",{})))},EmbyTabs.focus=function(){var selected=this.querySelector("."+activeButtonClass);selected?focusManager.focus(selected):focusManager.autoFocus(this)},EmbyTabs.refresh=function(){this.scroller&&this.scroller.reload()},EmbyTabs.attachedCallback=function(){initScroller(this);var current=this.querySelector("."+activeButtonClass),currentIndex=current?parseInt(current.getAttribute("data-index")):parseInt(this.getAttribute("data-index")||"1");if(currentIndex!==-1){this.selectedTabIndex=currentIndex;var tabButtons=this.querySelectorAll("."+buttonClass),newTabButton=tabButtons[currentIndex];newTabButton&&setActiveTabButton(this,newTabButton,current,!1)}},EmbyTabs.detachedCallback=function(){this.scroller&&(this.scroller.destroy(),this.scroller=null),dom.removeEventListener(this,"click",onClick,{passive:!0}),dom.removeEventListener(this,"focus",onFocus,{passive:!0,capture:!0})},EmbyTabs.selectedIndex=function(selected,triggerEvent){var tabs=this;if(null==selected)return tabs.selectedTabIndex||0;var current=tabs.selectedIndex();tabs.selectedTabIndex=selected;var tabButtons=tabs.querySelectorAll("."+buttonClass);if(current===selected||triggerEvent===!1){triggerBeforeTabChange(tabs,selected,current),tabs.dispatchEvent(new CustomEvent("tabchange",{detail:{selectedTabIndex:selected}}));var currentTabButton=tabButtons[current];setActiveTabButton(tabs,tabButtons[selected],currentTabButton,!1),current!==selected&&currentTabButton&&currentTabButton.classList.remove(activeButtonClass)}else onClick.call(tabs,{target:tabButtons[selected]})},EmbyTabs.triggerBeforeTabChange=function(selected){var tabs=this;triggerBeforeTabChange(tabs,tabs.selectedIndex())},EmbyTabs.triggerTabChange=function(selected){var tabs=this;tabs.dispatchEvent(new CustomEvent("tabchange",{detail:{selectedTabIndex:tabs.selectedIndex()}}))},document.registerElement("emby-tabs",{prototype:EmbyTabs,extends:"div"})});

dashboard-ui/channels.html

@@ -1,24 +1,12 @@
-<div id="channelsPage" data-role="page" data-dom-cache="true" class="page libraryPage channelsPage pageWithAbsoluteTabs" data-title="${HeaderChannels}">
+<div id="channelsPage" data-role="page" data-dom-cache="true" class="page libraryPage channelsPage noSecondaryNavPage" data-title="${HeaderChannels}">
 
-    <div is="emby-tabs" class="libraryViewNav">
+    <div class="homePageSection">
-        <div class="emby-tabs-slider">
+
-            <button is="emby-button" class="emby-tab-button is-active" data-index="0">
+        <h1 class="listHeader">${TabChannels}</h1>
-                <div class="emby-button-foreground">${TabLatest}</div>
+        <div is="emby-itemscontainer" id="items" class="itemsContainer paddedItemsContainer vertical-wrap"></div>
-            </button>
-            <button is="emby-button" class="emby-tab-button" data-index="1">
-                <div class="emby-button-foreground">${TabChannels}</div>
-            </button>
-        </div>
     </div>
 
-    <div class="is-active pageTabContent ehsContent" id="latestTab" data-index="0">
+    <div class="latestItems"></div>
-        <div class="latestItems"></div>
-    </div>
-    <div class="pageTabContent ehsContent" id="channelsTab" data-index="1">
-        <div class="viewSettings">
-        </div>
-        <div is="emby-itemscontainer" id="items" class="itemsContainer paddedItemsContainer vertical-wrap" style="text-align:center;"></div>
-    </div>
 
     <div data-role="content">
     </div>

dashboard-ui/components/maintabsmanager.js

@@ -0,0 +1 @@
+define(["emby-tabs","emby-button"],function(){"use strict";function setTabs(type,selectedIndex,builder){var viewMenuBarTabs;if(!type)return void(tabType&&(document.body.classList.remove("withTallToolbar"),viewMenuBarTabs=queryScope.querySelector(".viewMenuBarTabs"),viewMenuBarTabs.innerHTML="",viewMenuBarTabs.classList.add("hide"),tabType=null));if(viewMenuBarTabs=queryScope.querySelector(".viewMenuBarTabs"),tabType||viewMenuBarTabs.classList.remove("hide"),tabType!=type){var index=0,indexAttribute=null==selectedIndex?"":' data-index="'+selectedIndex+'"';return viewMenuBarTabs.innerHTML='<div is="emby-tabs"'+indexAttribute+' class="tabs-viewmenubar"><div class="emby-tabs-slider" style="white-space:nowrap;">'+builder().map(function(t){var tabHtml,tabClass="emby-tab-button";return tabHtml=t.href?'<button onclick="Dashboard.navigate(this.getAttribute(\'data-href\'));" type="button" data-href="'+t.href+'" is="emby-button" class="'+tabClass+'" data-index="'+index+'"><div class="emby-button-foreground">'+t.name+"</div></button>":'<button type="button" is="emby-button" class="'+tabClass+'" data-index="'+index+'"><div class="emby-button-foreground">'+t.name+"</div></button>",index++,tabHtml}).join("")+"</div></div>",document.body.classList.add("withTallToolbar"),tabType=type,!0}return viewMenuBarTabs.querySelector('[is="emby-tabs"]').selectedIndex(selectedIndex),tabType=type,!1}function getTabsElement(){return document.querySelector(".tabs-viewmenubar")}var tabType,queryScope=document.querySelector(".skinHeader");return{setTabs:setTabs,getTabsElement:getTabsElement}});

dashboard-ui/dashboard/livetvtuner.js

@@ -1 +1 @@
-define(["globalize","emby-input","emby-button","emby-checkbox","emby-select"],function(globalize){"use strict";function fillTypes(view,currentId){return ApiClient.getJSON(ApiClient.getUrl("LiveTv/TunerHosts/Types")).then(function(types){var selectType=view.querySelector(".selectType");selectType.innerHTML=types.map(function(t){return'<option value="'+t.Id+'">'+t.Name+"</option>"}).join(""),selectType.disabled=null!=currentId,selectType.value="",selectType.dispatchEvent(new CustomEvent("change",{}))})}function reload(view,providerId){view.querySelector(".txtDevicePath").value="",view.querySelector(".chkFavorite").checked=!1,providerId&&ApiClient.getNamedConfiguration("livetv").then(function(config){var info=config.TunerHosts.filter(function(i){return i.Id==providerId})[0];fillTunerHostInfo(view,info)})}function fillTunerHostInfo(view,info){var selectType=view.querySelector(".selectType");selectType.value=info.Type||"",selectType.dispatchEvent(new CustomEvent("change",{})),view.querySelector(".txtDevicePath").value=info.Url||"",view.querySelector(".chkFavorite").checked=info.ImportFavoritesOnly,view.querySelector(".chkTranscode").checked=info.AllowHWTranscoding}function submitForm(page){Dashboard.showLoadingMsg();var info={Type:page.querySelector(".selectType").value,Url:page.querySelector(".txtDevicePath").value,ImportFavoritesOnly:page.querySelector(".chkFavorite").checked,AllowHWTranscoding:page.querySelector(".chkTranscode").checked},id=getParameterByName("id");id&&(info.Id=id),ApiClient.ajax({type:"POST",url:ApiClient.getUrl("LiveTv/TunerHosts"),data:JSON.stringify(info),contentType:"application/json"}).then(function(result){Dashboard.processServerConfigurationUpdateResult(),Dashboard.navigate("livetvstatus.html")},function(){Dashboard.alert({message:Globalize.translate("ErrorSavingTvProvider")})})}function getRequirePromise(deps){return new Promise(function(resolve,reject){require(deps,resolve)})}function getDetectedDevice(){return getRequirePromise(["tunerPicker"]).then(function(tunerPicker){return(new tunerPicker).show({serverId:ApiClient.serverId()})})}return function(view,params){function onTypeChange(){var value=this.value,mayIncludeUnsupportedDrmChannels="hdhomerun"===value,supportsTranscoding="hdhomerun"===value,supportsFavorites="hdhomerun"===value,supportsTunerIpAddress="hdhomerun"===value,supportsTunerFileOrUrl="m3u"===value;supportsTunerIpAddress?(view.querySelector(".txtDevicePath").label(globalize.translate("LabelTunerIpAddress")),view.querySelector(".btnSelectPath").classList.add("hide"),view.querySelector(".fldPath").classList.remove("hide")):supportsTunerFileOrUrl?(view.querySelector(".txtDevicePath").label(globalize.translate("LabelFileOrUrl")),view.querySelector(".btnSelectPath").classList.remove("hide"),view.querySelector(".fldPath").classList.remove("hide")):(view.querySelector(".fldPath").classList.add("hide"),view.querySelector(".btnSelectPath").classList.add("hide")),supportsFavorites?view.querySelector(".fldFavorites").classList.remove("hide"):view.querySelector(".fldFavorites").classList.add("hide"),supportsTranscoding?view.querySelector(".fldTranscode").classList.remove("hide"):view.querySelector(".fldTranscode").classList.add("hide"),mayIncludeUnsupportedDrmChannels?view.querySelector(".drmMessage").classList.remove("hide"):view.querySelector(".drmMessage").classList.add("hide")}params.id||view.querySelector(".btnDetect").classList.remove("hide"),view.addEventListener("viewshow",function(){var currentId=params.id;fillTypes(view,currentId).then(function(){reload(view,currentId)})}),view.querySelector("form").addEventListener("submit",function(e){return submitForm(view),e.preventDefault(),e.stopPropagation(),!1}),view.querySelector(".selectType").addEventListener("change",onTypeChange),view.querySelector(".btnDetect").addEventListener("click",function(){getDetectedDevice().then(function(info){fillTunerHostInfo(view,info)})}),view.querySelector(".btnSelectPath").addEventListener("click",function(){require(["directorybrowser"],function(directoryBrowser){var picker=new directoryBrowser;picker.show({includeFiles:!0,callback:function(path){path&&(view.querySelector(".txtDevicePath").value=path),picker.close()}})})})}});
+define(["globalize","emby-input","emby-button","emby-checkbox","emby-select"],function(globalize){"use strict";function fillTypes(view,currentId){return ApiClient.getJSON(ApiClient.getUrl("LiveTv/TunerHosts/Types")).then(function(types){var selectType=view.querySelector(".selectType");selectType.innerHTML=types.map(function(t){return'<option value="'+t.Id+'">'+t.Name+"</option>"}).join(""),selectType.disabled=null!=currentId,selectType.value="",selectType.dispatchEvent(new CustomEvent("change",{}))})}function reload(view,providerId){view.querySelector(".txtDevicePath").value="",view.querySelector(".chkFavorite").checked=!1,providerId&&ApiClient.getNamedConfiguration("livetv").then(function(config){var info=config.TunerHosts.filter(function(i){return i.Id==providerId})[0];fillTunerHostInfo(view,info)})}function fillTunerHostInfo(view,info){var selectType=view.querySelector(".selectType");selectType.value=info.Type||"",selectType.dispatchEvent(new CustomEvent("change",{})),view.querySelector(".txtDevicePath").value=info.Url||"",view.querySelector(".chkFavorite").checked=info.ImportFavoritesOnly,view.querySelector(".chkTranscode").checked=info.AllowHWTranscoding}function submitForm(page){Dashboard.showLoadingMsg();var info={Type:page.querySelector(".selectType").value,Url:page.querySelector(".txtDevicePath").value,ImportFavoritesOnly:page.querySelector(".chkFavorite").checked,AllowHWTranscoding:page.querySelector(".chkTranscode").checked,EnableTvgId:!0},id=getParameterByName("id");id&&(info.Id=id),ApiClient.ajax({type:"POST",url:ApiClient.getUrl("LiveTv/TunerHosts"),data:JSON.stringify(info),contentType:"application/json"}).then(function(result){Dashboard.processServerConfigurationUpdateResult(),Dashboard.navigate("livetvstatus.html")},function(){Dashboard.alert({message:Globalize.translate("ErrorSavingTvProvider")})})}function getRequirePromise(deps){return new Promise(function(resolve,reject){require(deps,resolve)})}function getDetectedDevice(){return getRequirePromise(["tunerPicker"]).then(function(tunerPicker){return(new tunerPicker).show({serverId:ApiClient.serverId()})})}return function(view,params){function onTypeChange(){var value=this.value,mayIncludeUnsupportedDrmChannels="hdhomerun"===value,supportsTranscoding="hdhomerun"===value,supportsFavorites="hdhomerun"===value,supportsTunerIpAddress="hdhomerun"===value,supportsTunerFileOrUrl="m3u"===value;supportsTunerIpAddress?(view.querySelector(".txtDevicePath").label(globalize.translate("LabelTunerIpAddress")),view.querySelector(".btnSelectPath").classList.add("hide"),view.querySelector(".fldPath").classList.remove("hide")):supportsTunerFileOrUrl?(view.querySelector(".txtDevicePath").label(globalize.translate("LabelFileOrUrl")),view.querySelector(".btnSelectPath").classList.remove("hide"),view.querySelector(".fldPath").classList.remove("hide")):(view.querySelector(".fldPath").classList.add("hide"),view.querySelector(".btnSelectPath").classList.add("hide")),supportsFavorites?view.querySelector(".fldFavorites").classList.remove("hide"):view.querySelector(".fldFavorites").classList.add("hide"),supportsTranscoding?view.querySelector(".fldTranscode").classList.remove("hide"):view.querySelector(".fldTranscode").classList.add("hide"),mayIncludeUnsupportedDrmChannels?view.querySelector(".drmMessage").classList.remove("hide"):view.querySelector(".drmMessage").classList.add("hide")}params.id||view.querySelector(".btnDetect").classList.remove("hide"),view.addEventListener("viewshow",function(){var currentId=params.id;fillTypes(view,currentId).then(function(){reload(view,currentId)})}),view.querySelector("form").addEventListener("submit",function(e){return submitForm(view),e.preventDefault(),e.stopPropagation(),!1}),view.querySelector(".selectType").addEventListener("change",onTypeChange),view.querySelector(".btnDetect").addEventListener("click",function(){getDetectedDevice().then(function(info){fillTunerHostInfo(view,info)})}),view.querySelector(".btnSelectPath").addEventListener("click",function(){require(["directorybrowser"],function(directoryBrowser){var picker=new directoryBrowser;picker.show({includeFiles:!0,callback:function(path){path&&(view.querySelector(".txtDevicePath").value=path),picker.close()}})})})}});

dashboard-ui/home.html

@@ -1,19 +1,6 @@
-<div id="indexPage" style="outline: none;" data-role="page" data-dom-cache="true" class="page homePage libraryPage allLibraryPage backdropPage pageWithAbsoluteTabs" 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 withTabs" data-backdroptype="movie,series,game,book">
 
-    <div is="emby-tabs" class="libraryViewNav">
+    <div class="pageTabContent ehsContent fullWidth" id="homeTab" data-index="0">
-        <div class="emby-tabs-slider">
-            <button is="emby-button" class="emby-tab-button emby-tab-button-active" data-index="0">
-                <div class="emby-button-foreground">${TabHome}</div>
-            </button>
-            <button is="emby-button" class="emby-tab-button" data-index="1">
-                <div class="emby-button-foreground">${TabFavorites}</div>
-            </button>
-            <button is="emby-button" class="emby-tab-button" data-index="2">
-                <div class="emby-button-foreground">${TabUpcoming}</div>
-            </button>
-        </div>
-    </div>
-    <div class="is-active pageTabContent ehsContent fullWidth" id="homeTab" data-index="0">
         <div class="ui-bar-b readOnlyContent welcomeMessage hide" style="padding: 2em; border-radius: 10px; margin: 2em auto; font-weight: normal;">
             <h1 style="margin-top: 0;" class="tourHeader"></h1>
             <p>

dashboard-ui/livetv.html

@@ -1,4 +1,4 @@
-<div id="liveTvSuggestedPage" data-dom-cache="true" data-role="page" class="page libraryPage liveTvPage pageWithAbsoluteTabs" data-title="${HeaderLiveTv}" data-backdroptype="series,movie">
+<div id="liveTvSuggestedPage" data-dom-cache="true" data-role="page" class="page libraryPage liveTvPage pageWithAbsoluteTabs withTabs" data-title="${HeaderLiveTv}" data-backdroptype="series,movie">
 
     <style>
         .guideOptions {
@@ -6,30 +6,8 @@
             margin-bottom: 55px;
         }
     </style>
-    <div is="emby-tabs" class="libraryViewNav">
-        <div class="emby-tabs-slider">
-            <button is="emby-button" class="emby-tab-button emby-tab-button-active" data-index="0">
-                <div class="emby-button-foreground">${TabSuggestions}</div>
-            </button>
-            <button is="emby-button" class="emby-tab-button" data-index="1">
-                <div class="emby-button-foreground">${TabGuide}</div>
-            </button>
-            <button is="emby-button" class="emby-tab-button" data-index="2">
-                <div class="emby-button-foreground">${TabChannels}</div>
-            </button>
-            <button is="emby-button" class="emby-tab-button" data-index="3">
-                <div class="emby-button-foreground">${TabRecordings}</div>
-            </button>
-            <button is="emby-button" class="emby-tab-button" data-index="4">
-                <div class="emby-button-foreground">${HeaderSchedule}</div>
-            </button>
-            <button is="emby-button" class="emby-tab-button" data-index="5">
-                <div class="emby-button-foreground">${TabSeries}</div>
-            </button>
-        </div>
-    </div>
 
-    <div class="is-active pageTabContent ehsContent fullWidth" id="suggestionsTab" data-index="0">
+    <div class="pageTabContent ehsContent fullWidth" id="suggestionsTab" data-index="0">
         <div id="activeRecordings" class="homePageSection hide">
             <h1 class="listHeader">${HeaderActiveRecordings}</h1>
             <div is="emby-itemscontainer" class="recordingItems itemsContainer"></div>

dashboard-ui/movies.html

@@ -1,27 +1,5 @@
-<div id="moviesPage" data-role="page" data-dom-cache="true" class="page libraryPage backdropPage collectionEditorPage pageWithAbsoluteTabs" data-backdroptype="movie">
+<div id="moviesPage" data-role="page" data-dom-cache="true" class="page libraryPage backdropPage collectionEditorPage pageWithAbsoluteTabs withTabs" data-backdroptype="movie">
 
-    <div is="emby-tabs" class="libraryViewNav">
-        <div class="emby-tabs-slider">
-            <button is="emby-button" class="emby-tab-button emby-tab-button-active" data-index="0">
-                <div class="emby-button-foreground">${TabSuggestions}</div>
-            </button>
-            <button is="emby-button" class="emby-tab-button" data-index="1">
-                <div class="emby-button-foreground">${TabMovies}</div>
-            </button>
-            <button is="emby-button" class="emby-tab-button" data-index="2">
-                <div class="emby-button-foreground">${TabTrailers}</div>
-            </button>
-            <button is="emby-button" class="emby-tab-button" data-index="3">
-                <div class="emby-button-foreground">${TabCollections}</div>
-            </button>
-            <button is="emby-button" class="emby-tab-button" data-index="4">
-                <div class="emby-button-foreground">${TabGenres}</div>
-            </button>
-            <button is="emby-button" class="emby-tab-button" data-index="5">
-                <div class="emby-button-foreground">${TabStudios}</div>
-            </button>
-        </div>
-    </div>
     <div class="is-active pageTabContent ehsContent fullWidth" id="suggestionsTab" data-index="0">
         <div id="resumableSection" class="homePageSection hide">
             <div>

dashboard-ui/music.html

@@ -1,32 +1,6 @@
-<div id="musicRecommendedPage" data-dom-cache="true" data-role="page" class="page libraryPage backdropPage pageWithAbsoluteTabs" data-backdroptype="musicartist">
+<div id="musicRecommendedPage" data-dom-cache="true" data-role="page" class="page libraryPage backdropPage pageWithAbsoluteTabs withTabs" data-backdroptype="musicartist">
 
-    <div is="emby-tabs" class="libraryViewNav">
+    <div class="pageTabContent pageTabContent ehsContent fullWidth" id="suggestionsTab" data-index="0">
-        <div class="emby-tabs-slider">
-            <button is="emby-button" class="emby-tab-button emby-tab-button-active" data-index="0">
-                <div class="emby-button-foreground">${TabSuggestions}</div>
-            </button>
-            <button is="emby-button" class="emby-tab-button" data-index="1">
-                <div class="emby-button-foreground">${TabAlbums}</div>
-            </button>
-            <button is="emby-button" class="emby-tab-button" data-index="2">
-                <div class="emby-button-foreground">${TabAlbumArtists}</div>
-            </button>
-            <button is="emby-button" class="emby-tab-button" data-index="3">
-                <div class="emby-button-foreground">${TabArtists}</div>
-            </button>
-            <button is="emby-button" class="emby-tab-button" data-index="4">
-                <div class="emby-button-foreground">${TabSongs}</div>
-            </button>
-            <button is="emby-button" class="emby-tab-button" data-index="5">
-                <div class="emby-button-foreground">${TabGenres}</div>
-            </button>
-            <button is="emby-button" class="emby-tab-button" data-index="6">
-                <div class="emby-button-foreground">${TabFolders}</div>
-            </button>
-        </div>
-    </div>
-
-    <div class="pageTabContent is-active pageTabContent ehsContent fullWidth" id="suggestionsTab" data-index="0">
         <div class="homePageSection">
             <h1 class="listHeader">${HeaderLatestMusic}</h1>
 

dashboard-ui/scripts/channels.js

@@ -1 +1 @@
-define(["libraryBrowser","cardBuilder","imageLoader","emby-itemscontainer","emby-tabs","emby-button","scripts/channelslatest","scripts/sections"],function(libraryBrowser,cardBuilder,imageLoader){"use strict";function reloadItems(page){Dashboard.showLoadingMsg(),query.UserId=Dashboard.getCurrentUserId(),ApiClient.getJSON(ApiClient.getUrl("Channels",query)).then(function(result){window.scrollTo(0,0);var html="",view="Thumb";"Thumb"==view?html=cardBuilder.getCardsHtml({items:result.Items,shape:"backdrop",context:"channels",showTitle:!0,lazy:!0,centerText:!0,preferThumb:!0}):"ThumbCard"==view&&(html=cardBuilder.getCardsHtml({items:result.Items,shape:"backdrop",preferThumb:!0,context:"channels",lazy:!0,cardLayout:!0,showTitle:!0}));var elem=page.querySelector("#items");elem.innerHTML=html,imageLoader.lazyChildren(elem),libraryBrowser.saveQueryValues("channels",query),Dashboard.hideLoadingMsg()})}function loadTab(page,index){switch(index){case 1:libraryBrowser.loadSavedQueryValues("channels",query),reloadItems(page)}}var query={StartIndex:0};return function(view,params){var self=this,viewTabs=view.querySelector(".libraryViewNav");libraryBrowser.configurePaperLibraryTabs(view,viewTabs,view.querySelectorAll(".pageTabContent"),[0,1]),viewTabs.addEventListener("tabchange",function(e){loadTab(view,parseInt(e.detail.selectedTabIndex))}),require(["headroom-window"],function(headroom){headroom.add(viewTabs),self.headroom=headroom}),view.addEventListener("viewdestroy",function(e){self.headroom&&self.headroom.remove(viewTabs)})}});
+define(["libraryBrowser","cardBuilder","imageLoader","scripts/sections","emby-itemscontainer","emby-button"],function(libraryBrowser,cardBuilder,imageLoader){"use strict";function reloadItems(page){Dashboard.showLoadingMsg(),query.UserId=Dashboard.getCurrentUserId(),ApiClient.getJSON(ApiClient.getUrl("Channels",query)).then(function(result){window.scrollTo(0,0);var html="",view="Thumb";"Thumb"==view?html=cardBuilder.getCardsHtml({items:result.Items,shape:"backdrop",context:"channels",showTitle:!0,lazy:!0,centerText:!0,preferThumb:!0}):"ThumbCard"==view&&(html=cardBuilder.getCardsHtml({items:result.Items,shape:"backdrop",preferThumb:!0,context:"channels",lazy:!0,cardLayout:!0,showTitle:!0}));var elem=page.querySelector("#items");elem.innerHTML=html,imageLoader.lazyChildren(elem),libraryBrowser.saveQueryValues("channels",query),Dashboard.hideLoadingMsg()})}var query={StartIndex:0};return function(view,params){view.addEventListener("viewshow",function(e){libraryBrowser.loadSavedQueryValues("channels",query),Sections.loadLatestChannelItems(view.querySelector(".latestItems"),Dashboard.getCurrentUserId()),reloadItems(view)})}});

dashboard-ui/scripts/channelslatest.js

@@ -1 +0,0 @@
-define([],function(){"use strict";function reloadItems(page){Dashboard.showLoadingMsg(),Sections.loadLatestChannelItems(page.querySelector(".latestItems"),Dashboard.getCurrentUserId()).then(function(){Dashboard.hideLoadingMsg()},function(){Dashboard.hideLoadingMsg()})}function loadTab(page,index){switch(index){case 0:reloadItems(page)}}pageIdOn("pageinit","channelsPage",function(){var page=this,mdlTabs=page.querySelector(".libraryViewNav");mdlTabs.addEventListener("tabchange",function(e){loadTab(page,parseInt(e.detail.selectedTabIndex))})})});

dashboard-ui/tv.html

@@ -1,32 +1,6 @@
-<div id="tvRecommendedPage" data-dom-cache="true" data-role="page" class="page libraryPage backdropPage pageWithAbsoluteTabs" data-backdroptype="series">
+<div id="tvRecommendedPage" data-dom-cache="true" data-role="page" class="page libraryPage backdropPage pageWithAbsoluteTabs withTabs" data-backdroptype="series">
 
-    <div is="emby-tabs" class="libraryViewNav">
+    <div class="pageTabContent ehsContent fullWidth" id="suggestionsTab" data-index="0">
-        <div class="emby-tabs-slider">
-            <button is="emby-button" class="emby-tab-button emby-tab-button-active" data-index="0">
-                <div class="emby-button-foreground">${TabSuggestions}</div>
-            </button>
-            <button is="emby-button" class="emby-tab-button" data-index="1">
-                <div class="emby-button-foreground">${TabLatest}</div>
-            </button>
-            <button is="emby-button" class="emby-tab-button" data-index="2">
-                <div class="emby-button-foreground">${TabShows}</div>
-            </button>
-            <button is="emby-button" class="emby-tab-button" data-index="3">
-                <div class="emby-button-foreground">${TabUpcoming}</div>
-            </button>
-            <button is="emby-button" class="emby-tab-button" data-index="4">
-                <div class="emby-button-foreground">${TabGenres}</div>
-            </button>
-            <button is="emby-button" class="emby-tab-button" data-index="5">
-                <div class="emby-button-foreground">${TabNetworks}</div>
-            </button>
-            <button is="emby-button" class="emby-tab-button" data-index="6">
-                <div class="emby-button-foreground">${TabEpisodes}</div>
-            </button>
-        </div>
-    </div>
-
-    <div class="is-active pageTabContent ehsContent fullWidth" id="suggestionsTab" data-index="0">
         <div id="resumableSection" class="homePageSection">
             <div>
                 <h1 class="listHeader" style="display: inline-block; vertical-align: middle;">${HeaderContinueWatching}</h1>