move music tabs suggestions to the second position
This commit is contained in:
grafixeyehero
parent
5f56bb15c2
commit
71c44dccd6
4 changed files with 51 additions and 50 deletions
|
|
@ -8,7 +8,26 @@
|
|||
}
|
||||
}
|
||||
</style>
|
||||
<div class="pageTabContent pageTabContent" id="suggestionsTab" data-index="0">
|
||||
<div class="pageTabContent pageTabContent" id="albumsTab" data-index="0">
|
||||
<div class="flex align-items-center justify-content-center flex-wrap-wrap padded-top padded-left padded-right padded-bottom">
|
||||
<div class="paging"></div>
|
||||
<button is="paper-icon-button-light" class="btnPlayAll musicglobalButton" title="${HeaderPlayAll}"><span class="material-icons play_arrow"></span></button>
|
||||
<button is="paper-icon-button-light" class="btnShuffle musicglobalButton" title="${Shuffle}"><span class="material-icons shuffle"></span></button>
|
||||
<button is="paper-icon-button-light" class="btnSelectView autoSize" title="${ButtonSelectView}"><span class="material-icons view_comfy"></span></button>
|
||||
<button is="paper-icon-button-light" class="btnSort autoSize" title="${Sort}"><span class="material-icons sort_by_alpha"></span></button>
|
||||
<button is="paper-icon-button-light" class="btnFilter autoSize" title="${Filter}"><span class="material-icons filter_list"></span></button>
|
||||
</div>
|
||||
|
||||
<div class="alphaPicker alphaPicker-fixed alphaPicker-vertical">
|
||||
</div>
|
||||
|
||||
<div is="emby-itemscontainer" class="itemsContainer padded-left padded-right">
|
||||
</div>
|
||||
<div class="flex align-items-center justify-content-center flex-wrap-wrap padded-top padded-left padded-right padded-bottom">
|
||||
<div class="paging"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="pageTabContent pageTabContent" id="suggestionsTab" data-index="1">
|
||||
|
||||
<div class="verticalSection">
|
||||
|
||||
|
|
@ -34,25 +53,6 @@
|
|||
|
||||
<div class="favoriteSections verticalSection"></div>
|
||||
</div>
|
||||
<div class="pageTabContent pageTabContent" id="albumsTab" data-index="1">
|
||||
<div class="flex align-items-center justify-content-center flex-wrap-wrap padded-top padded-left padded-right padded-bottom">
|
||||
<div class="paging"></div>
|
||||
<button is="paper-icon-button-light" class="btnPlayAll musicglobalButton" title="${HeaderPlayAll}"><span class="material-icons play_arrow"></span></button>
|
||||
<button is="paper-icon-button-light" class="btnShuffle musicglobalButton" title="${Shuffle}"><span class="material-icons shuffle"></span></button>
|
||||
<button is="paper-icon-button-light" class="btnSelectView autoSize" title="${ButtonSelectView}"><span class="material-icons view_comfy"></span></button>
|
||||
<button is="paper-icon-button-light" class="btnSort autoSize" title="${Sort}"><span class="material-icons sort_by_alpha"></span></button>
|
||||
<button is="paper-icon-button-light" class="btnFilter autoSize" title="${Filter}"><span class="material-icons filter_list"></span></button>
|
||||
</div>
|
||||
|
||||
<div class="alphaPicker alphaPicker-fixed alphaPicker-vertical">
|
||||
</div>
|
||||
|
||||
<div is="emby-itemscontainer" class="itemsContainer padded-left padded-right">
|
||||
</div>
|
||||
<div class="flex align-items-center justify-content-center flex-wrap-wrap padded-top padded-left padded-right padded-bottom">
|
||||
<div class="paging"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="pageTabContent" id="albumArtistsTab" data-index="2">
|
||||
<div class="flex align-items-center justify-content-center flex-wrap-wrap padded-top padded-left padded-right padded-bottom">
|
||||
<div class="paging"></div>
|
||||
|
|
|
|||
|
|
@ -177,9 +177,9 @@ import 'flexStyles';
|
|||
|
||||
function getTabs() {
|
||||
return [{
|
||||
name: globalize.translate('Suggestions')
|
||||
}, {
|
||||
name: globalize.translate('Albums')
|
||||
}, {
|
||||
name: globalize.translate('Suggestions')
|
||||
}, {
|
||||
name: globalize.translate('HeaderAlbumArtists')
|
||||
}, {
|
||||
|
|
@ -195,7 +195,7 @@ import 'flexStyles';
|
|||
|
||||
function getDefaultTabIndex(folderId) {
|
||||
switch (userSettings.get('landing-' + folderId)) {
|
||||
case 'albums':
|
||||
case 'suggestions':
|
||||
return 1;
|
||||
|
||||
case 'albumartists':
|
||||
|
|
@ -221,7 +221,7 @@ import 'flexStyles';
|
|||
export default function (view, params) {
|
||||
function reload() {
|
||||
loading.show();
|
||||
const tabContent = view.querySelector(".pageTabContent[data-index='0']");
|
||||
const tabContent = view.querySelector(".pageTabContent[data-index='" + suggestionsTabIndex + "']");
|
||||
loadSuggestionsTab(view, tabContent, params.topParentId);
|
||||
}
|
||||
|
||||
|
|
@ -268,11 +268,11 @@ import 'flexStyles';
|
|||
|
||||
switch (index) {
|
||||
case 0:
|
||||
depends = 'controllers/music/musicrecommended';
|
||||
depends = 'controllers/music/musicalbums';
|
||||
break;
|
||||
|
||||
case 1:
|
||||
depends = 'controllers/music/musicalbums';
|
||||
depends = 'controllers/music/musicrecommended';
|
||||
break;
|
||||
|
||||
case 2:
|
||||
|
|
@ -296,7 +296,7 @@ import 'flexStyles';
|
|||
import(depends).then(({default: controllerFactory}) => {
|
||||
let tabContent;
|
||||
|
||||
if (index == 0) {
|
||||
if (index == 1) {
|
||||
tabContent = view.querySelector(".pageTabContent[data-index='" + index + "']");
|
||||
this.tabContent = tabContent;
|
||||
}
|
||||
|
|
@ -306,7 +306,7 @@ import 'flexStyles';
|
|||
if (!controller) {
|
||||
tabContent = view.querySelector(".pageTabContent[data-index='" + index + "']");
|
||||
|
||||
if (index === 0) {
|
||||
if (index === 1) {
|
||||
controller = this;
|
||||
} else if (index === 7) {
|
||||
controller = new controllerFactory(view, tabContent, {
|
||||
|
|
@ -360,9 +360,10 @@ import 'flexStyles';
|
|||
}
|
||||
|
||||
let currentTabIndex = parseInt(params.tab || getDefaultTabIndex(params.topParentId));
|
||||
const suggestionsTabIndex = 1;
|
||||
|
||||
this.initTab = function () {
|
||||
const tabContent = view.querySelector(".pageTabContent[data-index='0']");
|
||||
const tabContent = view.querySelector(".pageTabContent[data-index='" + suggestionsTabIndex + "']");
|
||||
const containers = tabContent.querySelectorAll('.itemsContainer');
|
||||
|
||||
for (let i = 0, length = containers.length; i < length; i++) {
|
||||
|
|
|
|||
|
|
@ -66,16 +66,16 @@ import 'emby-button';
|
|||
}
|
||||
|
||||
function initSuggestedTab(page, tabContent) {
|
||||
var containers = tabContent.querySelectorAll('.itemsContainer');
|
||||
const containers = tabContent.querySelectorAll('.itemsContainer');
|
||||
|
||||
for (var i = 0, length = containers.length; i < length; i++) {
|
||||
for (let i = 0, length = containers.length; i < length; i++) {
|
||||
setScrollClasses(containers[i], enableScrollX());
|
||||
}
|
||||
}
|
||||
|
||||
function loadSuggestionsTab(view, params, tabContent) {
|
||||
var parentId = params.topParentId;
|
||||
var userId = ApiClient.getCurrentUserId();
|
||||
const parentId = params.topParentId;
|
||||
const userId = ApiClient.getCurrentUserId();
|
||||
console.debug('loadSuggestionsTab');
|
||||
loadResume(tabContent, userId, parentId);
|
||||
loadLatest(tabContent, userId, parentId);
|
||||
|
|
@ -83,8 +83,8 @@ import 'emby-button';
|
|||
}
|
||||
|
||||
function loadResume(view, userId, parentId) {
|
||||
var screenWidth = dom.getWindowSize().innerWidth;
|
||||
var options = {
|
||||
const screenWidth = dom.getWindowSize().innerWidth;
|
||||
const options = {
|
||||
SortBy: 'DatePlayed',
|
||||
SortOrder: 'Descending',
|
||||
IncludeItemTypes: 'Episode',
|
||||
|
|
@ -105,8 +105,8 @@ import 'emby-button';
|
|||
view.querySelector('#resumableSection').classList.add('hide');
|
||||
}
|
||||
|
||||
var allowBottomPadding = !enableScrollX();
|
||||
var container = view.querySelector('#resumableItems');
|
||||
const allowBottomPadding = !enableScrollX();
|
||||
const container = view.querySelector('#resumableItems');
|
||||
cardBuilder.buildCards(result.Items, {
|
||||
itemsContainer: container,
|
||||
preferThumb: true,
|
||||
|
|
@ -128,7 +128,7 @@ import 'emby-button';
|
|||
}
|
||||
|
||||
function loadLatest(view, userId, parentId) {
|
||||
var options = {
|
||||
const options = {
|
||||
userId: userId,
|
||||
IncludeItemTypes: 'Episode',
|
||||
Limit: 30,
|
||||
|
|
@ -138,9 +138,9 @@ import 'emby-button';
|
|||
EnableImageTypes: 'Primary,Backdrop,Thumb'
|
||||
};
|
||||
ApiClient.getLatestItems(options).then(function (items) {
|
||||
var section = view.querySelector('#latestItemsSection');
|
||||
var allowBottomPadding = !enableScrollX();
|
||||
var container = section.querySelector('#latestEpisodesItems');
|
||||
const section = view.querySelector('#latestItemsSection');
|
||||
const allowBottomPadding = !enableScrollX();
|
||||
const container = section.querySelector('#latestEpisodesItems');
|
||||
cardBuilder.buildCards(items, {
|
||||
parentContainer: section,
|
||||
itemsContainer: container,
|
||||
|
|
@ -169,7 +169,7 @@ import 'emby-button';
|
|||
}
|
||||
|
||||
function loadNextUp(view, userId, parentId) {
|
||||
var query = {
|
||||
const query = {
|
||||
userId: userId,
|
||||
Limit: 24,
|
||||
Fields: 'PrimaryImageAspectRatio,SeriesInfo,DateCreated,BasicSyncInfo',
|
||||
|
|
@ -186,8 +186,8 @@ import 'emby-button';
|
|||
view.querySelector('.noNextUpItems').classList.remove('hide');
|
||||
}
|
||||
|
||||
var section = view.querySelector('#nextUpItemsSection');
|
||||
var container = section.querySelector('#nextUpItems');
|
||||
const section = view.querySelector('#nextUpItemsSection');
|
||||
const container = section.querySelector('#nextUpItems');
|
||||
cardBuilder.buildCards(result.Items, {
|
||||
parentContainer: section,
|
||||
itemsContainer: container,
|
||||
|
|
@ -345,12 +345,12 @@ import 'emby-button';
|
|||
const suggestionsTabIndex = 1;
|
||||
|
||||
self.initTab = function () {
|
||||
var tabContent = view.querySelector(".pageTabContent[data-index='" + suggestionsTabIndex + "']");
|
||||
const tabContent = view.querySelector(".pageTabContent[data-index='" + suggestionsTabIndex + "']");
|
||||
initSuggestedTab(view, tabContent);
|
||||
};
|
||||
|
||||
self.renderTab = function () {
|
||||
var tabContent = view.querySelector(".pageTabContent[data-index='" + suggestionsTabIndex + "']");
|
||||
const tabContent = view.querySelector(".pageTabContent[data-index='" + suggestionsTabIndex + "']");
|
||||
loadSuggestionsTab(view, params, tabContent);
|
||||
};
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue