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

Fix indentation issues

This commit is contained in:
Bill Thornton 2023-04-19 01:56:05 -04:00
parent 52c8cffc82
commit f2726653ae
120 changed files with 30271 additions and 30631 deletions

View file

@ -11,294 +11,291 @@ import Events from '../../utils/events.ts';
import '../../elements/emby-itemscontainer/emby-itemscontainer';
/* eslint-disable indent */
export default function (view, params, tabContent) {
function playAll() {
ApiClient.getItem(ApiClient.getCurrentUserId(), params.topParentId).then(function (item) {
playbackManager.play({
items: [item]
});
export default function (view, params, tabContent) {
function playAll() {
ApiClient.getItem(ApiClient.getCurrentUserId(), params.topParentId).then(function (item) {
playbackManager.play({
items: [item]
});
}
function shuffle() {
ApiClient.getItem(ApiClient.getCurrentUserId(), params.topParentId).then(function (item) {
getQuery();
playbackManager.shuffle(item);
});
}
function getPageData() {
const key = getSavedQueryKey();
if (!pageData) {
pageData = {
query: {
SortBy: 'SortName',
SortOrder: 'Ascending',
IncludeItemTypes: 'MusicAlbum',
Recursive: true,
Fields: 'PrimaryImageAspectRatio,SortName,BasicSyncInfo',
ImageTypeLimit: 1,
EnableImageTypes: 'Primary,Backdrop,Banner,Thumb',
StartIndex: 0
},
view: libraryBrowser.getSavedView(key) || 'Poster'
};
if (userSettings.libraryPageSize() > 0) {
pageData.query['Limit'] = userSettings.libraryPageSize();
}
pageData.query.ParentId = params.topParentId;
libraryBrowser.loadSavedQueryValues(key, pageData.query);
}
return pageData;
}
function getQuery() {
return getPageData().query;
}
function getSavedQueryKey() {
if (!savedQueryKey) {
savedQueryKey = libraryBrowser.getSavedQueryKey('musicalbums');
}
return savedQueryKey;
}
const onViewStyleChange = () => {
const viewStyle = this.getCurrentViewStyle();
const itemsContainer = tabContent.querySelector('.itemsContainer');
if (viewStyle == 'List') {
itemsContainer.classList.add('vertical-list');
itemsContainer.classList.remove('vertical-wrap');
} else {
itemsContainer.classList.remove('vertical-list');
itemsContainer.classList.add('vertical-wrap');
}
itemsContainer.innerHTML = '';
};
const reloadItems = () => {
loading.show();
isLoading = true;
const query = getQuery();
ApiClient.getItems(ApiClient.getCurrentUserId(), query).then((result) => {
function onNextPageClick() {
if (isLoading) {
return;
}
if (userSettings.libraryPageSize() > 0) {
query.StartIndex += query.Limit;
}
reloadItems();
}
function onPreviousPageClick() {
if (isLoading) {
return;
}
if (userSettings.libraryPageSize() > 0) {
query.StartIndex = Math.max(0, query.StartIndex - query.Limit);
}
reloadItems();
}
window.scrollTo(0, 0);
this.alphaPicker?.updateControls(query);
let html;
const pagingHtml = libraryBrowser.getQueryPagingHtml({
startIndex: query.StartIndex,
limit: query.Limit,
totalRecordCount: result.TotalRecordCount,
showLimit: false,
updatePageSizeSetting: false,
addLayoutButton: false,
sortButton: false,
filterButton: false
});
const viewStyle = this.getCurrentViewStyle();
if (viewStyle == 'List') {
html = listView.getListViewHtml({
items: result.Items,
context: 'music',
sortBy: query.SortBy,
addToListButton: true
});
} else if (viewStyle == 'PosterCard') {
html = cardBuilder.getCardsHtml({
items: result.Items,
shape: 'square',
context: 'music',
showTitle: true,
coverImage: true,
showParentTitle: true,
lazy: true,
cardLayout: true
});
} else {
html = cardBuilder.getCardsHtml({
items: result.Items,
shape: 'square',
context: 'music',
showTitle: true,
showParentTitle: true,
lazy: true,
centerText: true,
overlayPlayButton: true
});
}
let elems = tabContent.querySelectorAll('.paging');
for (const elem of elems) {
elem.innerHTML = pagingHtml;
}
elems = tabContent.querySelectorAll('.btnNextPage');
for (const elem of elems) {
elem.addEventListener('click', onNextPageClick);
}
elems = tabContent.querySelectorAll('.btnPreviousPage');
for (const elem of elems) {
elem.addEventListener('click', onPreviousPageClick);
}
const itemsContainer = tabContent.querySelector('.itemsContainer');
itemsContainer.innerHTML = html;
imageLoader.lazyChildren(itemsContainer);
libraryBrowser.saveQueryValues(getSavedQueryKey(), query);
loading.hide();
isLoading = false;
import('../../components/autoFocuser').then(({ default: autoFocuser }) => {
autoFocuser.autoFocus(tabContent);
});
});
};
let savedQueryKey;
let pageData;
let isLoading = false;
this.showFilterMenu = function () {
import('../../components/filterdialog/filterdialog').then(({ default: filterDialogFactory }) => {
const filterDialog = new filterDialogFactory({
query: getQuery(),
mode: 'albums',
serverId: ApiClient.serverId()
});
Events.on(filterDialog, 'filterchange', function () {
getQuery().StartIndex = 0;
reloadItems();
});
filterDialog.show();
});
};
this.getCurrentViewStyle = function () {
return getPageData().view;
};
const initPage = (tabElement) => {
const alphaPickerElement = tabElement.querySelector('.alphaPicker');
const itemsContainer = tabElement.querySelector('.itemsContainer');
alphaPickerElement.addEventListener('alphavaluechanged', function (e) {
const newValue = e.detail.value;
const query = getQuery();
if (newValue === '#') {
query.NameLessThan = 'A';
delete query.NameStartsWith;
} else {
query.NameStartsWith = newValue;
delete query.NameLessThan;
}
query.StartIndex = 0;
reloadItems();
});
this.alphaPicker = new AlphaPicker({
element: alphaPickerElement,
valueChangeEvent: 'click'
});
tabElement.querySelector('.alphaPicker').classList.add('alphabetPicker-right');
alphaPickerElement.classList.add('alphaPicker-fixed-right');
itemsContainer.classList.add('padded-right-withalphapicker');
tabElement.querySelector('.btnFilter').addEventListener('click', () => {
this.showFilterMenu();
});
tabElement.querySelector('.btnSort').addEventListener('click', (e) => {
libraryBrowser.showSortMenu({
items: [{
name: globalize.translate('Name'),
id: 'SortName'
}, {
name: globalize.translate('AlbumArtist'),
id: 'AlbumArtist,SortName'
}, {
name: globalize.translate('OptionCommunityRating'),
id: 'CommunityRating,SortName'
}, {
name: globalize.translate('OptionCriticRating'),
id: 'CriticRating,SortName'
}, {
name: globalize.translate('OptionDateAdded'),
id: 'DateCreated,SortName'
}, {
name: globalize.translate('OptionReleaseDate'),
id: 'ProductionYear,PremiereDate,SortName'
}, {
name: globalize.translate('OptionRandom'),
id: 'Random,SortName'
}],
callback: function () {
getQuery().StartIndex = 0;
reloadItems();
},
query: getQuery(),
button: e.target
});
});
const btnSelectView = tabElement.querySelector('.btnSelectView');
btnSelectView.addEventListener('click', (e) => {
libraryBrowser.showLayoutMenu(e.target, this.getCurrentViewStyle(), 'List,Poster,PosterCard'.split(','));
});
btnSelectView.addEventListener('layoutchange', function (e) {
const viewStyle = e.detail.viewStyle;
getPageData().view = viewStyle;
libraryBrowser.saveViewSetting(getSavedQueryKey(), viewStyle);
getQuery().StartIndex = 0;
onViewStyleChange();
reloadItems();
});
tabElement.querySelector('.btnPlayAll').addEventListener('click', playAll);
tabElement.querySelector('.btnShuffle').addEventListener('click', shuffle);
};
initPage(tabContent);
onViewStyleChange();
this.renderTab = () => {
reloadItems();
this.alphaPicker?.updateControls(getQuery());
};
});
}
/* eslint-enable indent */
function shuffle() {
ApiClient.getItem(ApiClient.getCurrentUserId(), params.topParentId).then(function (item) {
getQuery();
playbackManager.shuffle(item);
});
}
function getPageData() {
const key = getSavedQueryKey();
if (!pageData) {
pageData = {
query: {
SortBy: 'SortName',
SortOrder: 'Ascending',
IncludeItemTypes: 'MusicAlbum',
Recursive: true,
Fields: 'PrimaryImageAspectRatio,SortName,BasicSyncInfo',
ImageTypeLimit: 1,
EnableImageTypes: 'Primary,Backdrop,Banner,Thumb',
StartIndex: 0
},
view: libraryBrowser.getSavedView(key) || 'Poster'
};
if (userSettings.libraryPageSize() > 0) {
pageData.query['Limit'] = userSettings.libraryPageSize();
}
pageData.query.ParentId = params.topParentId;
libraryBrowser.loadSavedQueryValues(key, pageData.query);
}
return pageData;
}
function getQuery() {
return getPageData().query;
}
function getSavedQueryKey() {
if (!savedQueryKey) {
savedQueryKey = libraryBrowser.getSavedQueryKey('musicalbums');
}
return savedQueryKey;
}
const onViewStyleChange = () => {
const viewStyle = this.getCurrentViewStyle();
const itemsContainer = tabContent.querySelector('.itemsContainer');
if (viewStyle == 'List') {
itemsContainer.classList.add('vertical-list');
itemsContainer.classList.remove('vertical-wrap');
} else {
itemsContainer.classList.remove('vertical-list');
itemsContainer.classList.add('vertical-wrap');
}
itemsContainer.innerHTML = '';
};
const reloadItems = () => {
loading.show();
isLoading = true;
const query = getQuery();
ApiClient.getItems(ApiClient.getCurrentUserId(), query).then((result) => {
function onNextPageClick() {
if (isLoading) {
return;
}
if (userSettings.libraryPageSize() > 0) {
query.StartIndex += query.Limit;
}
reloadItems();
}
function onPreviousPageClick() {
if (isLoading) {
return;
}
if (userSettings.libraryPageSize() > 0) {
query.StartIndex = Math.max(0, query.StartIndex - query.Limit);
}
reloadItems();
}
window.scrollTo(0, 0);
this.alphaPicker?.updateControls(query);
let html;
const pagingHtml = libraryBrowser.getQueryPagingHtml({
startIndex: query.StartIndex,
limit: query.Limit,
totalRecordCount: result.TotalRecordCount,
showLimit: false,
updatePageSizeSetting: false,
addLayoutButton: false,
sortButton: false,
filterButton: false
});
const viewStyle = this.getCurrentViewStyle();
if (viewStyle == 'List') {
html = listView.getListViewHtml({
items: result.Items,
context: 'music',
sortBy: query.SortBy,
addToListButton: true
});
} else if (viewStyle == 'PosterCard') {
html = cardBuilder.getCardsHtml({
items: result.Items,
shape: 'square',
context: 'music',
showTitle: true,
coverImage: true,
showParentTitle: true,
lazy: true,
cardLayout: true
});
} else {
html = cardBuilder.getCardsHtml({
items: result.Items,
shape: 'square',
context: 'music',
showTitle: true,
showParentTitle: true,
lazy: true,
centerText: true,
overlayPlayButton: true
});
}
let elems = tabContent.querySelectorAll('.paging');
for (const elem of elems) {
elem.innerHTML = pagingHtml;
}
elems = tabContent.querySelectorAll('.btnNextPage');
for (const elem of elems) {
elem.addEventListener('click', onNextPageClick);
}
elems = tabContent.querySelectorAll('.btnPreviousPage');
for (const elem of elems) {
elem.addEventListener('click', onPreviousPageClick);
}
const itemsContainer = tabContent.querySelector('.itemsContainer');
itemsContainer.innerHTML = html;
imageLoader.lazyChildren(itemsContainer);
libraryBrowser.saveQueryValues(getSavedQueryKey(), query);
loading.hide();
isLoading = false;
import('../../components/autoFocuser').then(({ default: autoFocuser }) => {
autoFocuser.autoFocus(tabContent);
});
});
};
let savedQueryKey;
let pageData;
let isLoading = false;
this.showFilterMenu = function () {
import('../../components/filterdialog/filterdialog').then(({ default: filterDialogFactory }) => {
const filterDialog = new filterDialogFactory({
query: getQuery(),
mode: 'albums',
serverId: ApiClient.serverId()
});
Events.on(filterDialog, 'filterchange', function () {
getQuery().StartIndex = 0;
reloadItems();
});
filterDialog.show();
});
};
this.getCurrentViewStyle = function () {
return getPageData().view;
};
const initPage = (tabElement) => {
const alphaPickerElement = tabElement.querySelector('.alphaPicker');
const itemsContainer = tabElement.querySelector('.itemsContainer');
alphaPickerElement.addEventListener('alphavaluechanged', function (e) {
const newValue = e.detail.value;
const query = getQuery();
if (newValue === '#') {
query.NameLessThan = 'A';
delete query.NameStartsWith;
} else {
query.NameStartsWith = newValue;
delete query.NameLessThan;
}
query.StartIndex = 0;
reloadItems();
});
this.alphaPicker = new AlphaPicker({
element: alphaPickerElement,
valueChangeEvent: 'click'
});
tabElement.querySelector('.alphaPicker').classList.add('alphabetPicker-right');
alphaPickerElement.classList.add('alphaPicker-fixed-right');
itemsContainer.classList.add('padded-right-withalphapicker');
tabElement.querySelector('.btnFilter').addEventListener('click', () => {
this.showFilterMenu();
});
tabElement.querySelector('.btnSort').addEventListener('click', (e) => {
libraryBrowser.showSortMenu({
items: [{
name: globalize.translate('Name'),
id: 'SortName'
}, {
name: globalize.translate('AlbumArtist'),
id: 'AlbumArtist,SortName'
}, {
name: globalize.translate('OptionCommunityRating'),
id: 'CommunityRating,SortName'
}, {
name: globalize.translate('OptionCriticRating'),
id: 'CriticRating,SortName'
}, {
name: globalize.translate('OptionDateAdded'),
id: 'DateCreated,SortName'
}, {
name: globalize.translate('OptionReleaseDate'),
id: 'ProductionYear,PremiereDate,SortName'
}, {
name: globalize.translate('OptionRandom'),
id: 'Random,SortName'
}],
callback: function () {
getQuery().StartIndex = 0;
reloadItems();
},
query: getQuery(),
button: e.target
});
});
const btnSelectView = tabElement.querySelector('.btnSelectView');
btnSelectView.addEventListener('click', (e) => {
libraryBrowser.showLayoutMenu(e.target, this.getCurrentViewStyle(), 'List,Poster,PosterCard'.split(','));
});
btnSelectView.addEventListener('layoutchange', function (e) {
const viewStyle = e.detail.viewStyle;
getPageData().view = viewStyle;
libraryBrowser.saveViewSetting(getSavedQueryKey(), viewStyle);
getQuery().StartIndex = 0;
onViewStyleChange();
reloadItems();
});
tabElement.querySelector('.btnPlayAll').addEventListener('click', playAll);
tabElement.querySelector('.btnShuffle').addEventListener('click', shuffle);
};
initPage(tabContent);
onViewStyleChange();
this.renderTab = () => {
reloadItems();
this.alphaPicker?.updateControls(getQuery());
};
}

View file

@ -9,237 +9,234 @@ import Events from '../../utils/events.ts';
import '../../elements/emby-itemscontainer/emby-itemscontainer';
/* eslint-disable indent */
export default function (view, params, tabContent) {
function getPageData(context) {
const key = getSavedQueryKey(context);
let pageData = data[key];
export default function (view, params, tabContent) {
function getPageData(context) {
const key = getSavedQueryKey(context);
let pageData = data[key];
if (!pageData) {
const queryValues = {
SortBy: 'SortName',
SortOrder: 'Ascending',
Recursive: true,
Fields: 'PrimaryImageAspectRatio,SortName,BasicSyncInfo',
StartIndex: 0,
ImageTypeLimit: 1,
EnableImageTypes: 'Primary,Backdrop,Banner,Thumb'
};
if (!pageData) {
const queryValues = {
SortBy: 'SortName',
SortOrder: 'Ascending',
Recursive: true,
Fields: 'PrimaryImageAspectRatio,SortName,BasicSyncInfo',
StartIndex: 0,
ImageTypeLimit: 1,
EnableImageTypes: 'Primary,Backdrop,Banner,Thumb'
};
if (userSettings.libraryPageSize() > 0) {
queryValues['Limit'] = userSettings.libraryPageSize();
}
pageData = data[key] = {
query: queryValues,
view: libraryBrowser.getSavedView(key) || 'Poster'
};
pageData.query.ParentId = params.topParentId;
libraryBrowser.loadSavedQueryValues(key, pageData.query);
if (userSettings.libraryPageSize() > 0) {
queryValues['Limit'] = userSettings.libraryPageSize();
}
return pageData;
pageData = data[key] = {
query: queryValues,
view: libraryBrowser.getSavedView(key) || 'Poster'
};
pageData.query.ParentId = params.topParentId;
libraryBrowser.loadSavedQueryValues(key, pageData.query);
}
function getQuery(context) {
return getPageData(context).query;
}
const getSavedQueryKey = (context) => {
if (!context.savedQueryKey) {
context.savedQueryKey = libraryBrowser.getSavedQueryKey(this.mode);
}
return context.savedQueryKey;
};
const onViewStyleChange = () => {
const viewStyle = this.getCurrentViewStyle();
const itemsContainer = tabContent.querySelector('.itemsContainer');
if (viewStyle == 'List') {
itemsContainer.classList.add('vertical-list');
itemsContainer.classList.remove('vertical-wrap');
} else {
itemsContainer.classList.remove('vertical-list');
itemsContainer.classList.add('vertical-wrap');
}
itemsContainer.innerHTML = '';
};
const reloadItems = (page) => {
loading.show();
isLoading = true;
const query = getQuery(page);
const promise = this.mode == 'albumartists' ?
ApiClient.getAlbumArtists(ApiClient.getCurrentUserId(), query) :
ApiClient.getArtists(ApiClient.getCurrentUserId(), query);
promise.then((result) => {
function onNextPageClick() {
if (isLoading) {
return;
}
if (userSettings.libraryPageSize() > 0) {
query.StartIndex += query.Limit;
}
reloadItems(tabContent);
}
function onPreviousPageClick() {
if (isLoading) {
return;
}
if (userSettings.libraryPageSize() > 0) {
query.StartIndex = Math.max(0, query.StartIndex - query.Limit);
}
reloadItems(tabContent);
}
window.scrollTo(0, 0);
this.alphaPicker?.updateControls(query);
let html;
const pagingHtml = libraryBrowser.getQueryPagingHtml({
startIndex: query.StartIndex,
limit: query.Limit,
totalRecordCount: result.TotalRecordCount,
showLimit: false,
updatePageSizeSetting: false,
addLayoutButton: false,
sortButton: false,
filterButton: false
});
const viewStyle = this.getCurrentViewStyle();
if (viewStyle == 'List') {
html = listView.getListViewHtml({
items: result.Items,
sortBy: query.SortBy
});
} else if (viewStyle == 'PosterCard') {
html = cardBuilder.getCardsHtml({
items: result.Items,
shape: 'square',
context: 'music',
showTitle: true,
coverImage: true,
cardLayout: true
});
} else {
html = cardBuilder.getCardsHtml({
items: result.Items,
shape: 'square',
context: 'music',
showTitle: true,
coverImage: true,
lazy: true,
centerText: true,
overlayPlayButton: true
});
}
let elems = tabContent.querySelectorAll('.paging');
for (let i = 0, length = elems.length; i < length; i++) {
elems[i].innerHTML = pagingHtml;
}
elems = tabContent.querySelectorAll('.btnNextPage');
for (let i = 0, length = elems.length; i < length; i++) {
elems[i].addEventListener('click', onNextPageClick);
}
elems = tabContent.querySelectorAll('.btnPreviousPage');
for (let i = 0, length = elems.length; i < length; i++) {
elems[i].addEventListener('click', onPreviousPageClick);
}
const itemsContainer = tabContent.querySelector('.itemsContainer');
itemsContainer.innerHTML = html;
imageLoader.lazyChildren(itemsContainer);
libraryBrowser.saveQueryValues(getSavedQueryKey(page), query);
loading.hide();
isLoading = false;
import('../../components/autoFocuser').then(({ default: autoFocuser }) => {
autoFocuser.autoFocus(tabContent);
});
});
};
const data = {};
let isLoading = false;
this.showFilterMenu = function () {
import('../../components/filterdialog/filterdialog').then(({ default: filterDialogFactory }) => {
const filterDialog = new filterDialogFactory({
query: getQuery(tabContent),
mode: this.mode,
serverId: ApiClient.serverId()
});
Events.on(filterDialog, 'filterchange', function () {
getQuery(tabContent).StartIndex = 0;
reloadItems(tabContent);
});
filterDialog.show();
});
};
this.getCurrentViewStyle = function () {
return getPageData(tabContent).view;
};
const initPage = (tabElement) => {
const alphaPickerElement = tabElement.querySelector('.alphaPicker');
const itemsContainer = tabElement.querySelector('.itemsContainer');
alphaPickerElement.addEventListener('alphavaluechanged', function (e) {
const newValue = e.detail.value;
const query = getQuery(tabElement);
if (newValue === '#') {
query.NameLessThan = 'A';
delete query.NameStartsWith;
} else {
query.NameStartsWith = newValue;
delete query.NameLessThan;
}
query.StartIndex = 0;
reloadItems(tabElement);
});
this.alphaPicker = new AlphaPicker({
element: alphaPickerElement,
valueChangeEvent: 'click'
});
tabElement.querySelector('.alphaPicker').classList.add('alphabetPicker-right');
alphaPickerElement.classList.add('alphaPicker-fixed-right');
itemsContainer.classList.add('padded-right-withalphapicker');
tabElement.querySelector('.btnFilter').addEventListener('click', () => {
this.showFilterMenu();
});
const btnSelectView = tabElement.querySelector('.btnSelectView');
btnSelectView.addEventListener('click', (e) => {
libraryBrowser.showLayoutMenu(e.target, this.getCurrentViewStyle(), 'List,Poster,PosterCard'.split(','));
});
btnSelectView.addEventListener('layoutchange', function (e) {
const viewStyle = e.detail.viewStyle;
getPageData(tabElement).view = viewStyle;
libraryBrowser.saveViewSetting(getSavedQueryKey(tabElement), viewStyle);
getQuery(tabElement).StartIndex = 0;
onViewStyleChange();
reloadItems(tabElement);
});
};
initPage(tabContent);
onViewStyleChange();
this.renderTab = () => {
reloadItems(tabContent);
this.alphaPicker?.updateControls(getQuery(tabContent));
};
return pageData;
}
/* eslint-enable indent */
function getQuery(context) {
return getPageData(context).query;
}
const getSavedQueryKey = (context) => {
if (!context.savedQueryKey) {
context.savedQueryKey = libraryBrowser.getSavedQueryKey(this.mode);
}
return context.savedQueryKey;
};
const onViewStyleChange = () => {
const viewStyle = this.getCurrentViewStyle();
const itemsContainer = tabContent.querySelector('.itemsContainer');
if (viewStyle == 'List') {
itemsContainer.classList.add('vertical-list');
itemsContainer.classList.remove('vertical-wrap');
} else {
itemsContainer.classList.remove('vertical-list');
itemsContainer.classList.add('vertical-wrap');
}
itemsContainer.innerHTML = '';
};
const reloadItems = (page) => {
loading.show();
isLoading = true;
const query = getQuery(page);
const promise = this.mode == 'albumartists' ?
ApiClient.getAlbumArtists(ApiClient.getCurrentUserId(), query) :
ApiClient.getArtists(ApiClient.getCurrentUserId(), query);
promise.then((result) => {
function onNextPageClick() {
if (isLoading) {
return;
}
if (userSettings.libraryPageSize() > 0) {
query.StartIndex += query.Limit;
}
reloadItems(tabContent);
}
function onPreviousPageClick() {
if (isLoading) {
return;
}
if (userSettings.libraryPageSize() > 0) {
query.StartIndex = Math.max(0, query.StartIndex - query.Limit);
}
reloadItems(tabContent);
}
window.scrollTo(0, 0);
this.alphaPicker?.updateControls(query);
let html;
const pagingHtml = libraryBrowser.getQueryPagingHtml({
startIndex: query.StartIndex,
limit: query.Limit,
totalRecordCount: result.TotalRecordCount,
showLimit: false,
updatePageSizeSetting: false,
addLayoutButton: false,
sortButton: false,
filterButton: false
});
const viewStyle = this.getCurrentViewStyle();
if (viewStyle == 'List') {
html = listView.getListViewHtml({
items: result.Items,
sortBy: query.SortBy
});
} else if (viewStyle == 'PosterCard') {
html = cardBuilder.getCardsHtml({
items: result.Items,
shape: 'square',
context: 'music',
showTitle: true,
coverImage: true,
cardLayout: true
});
} else {
html = cardBuilder.getCardsHtml({
items: result.Items,
shape: 'square',
context: 'music',
showTitle: true,
coverImage: true,
lazy: true,
centerText: true,
overlayPlayButton: true
});
}
let elems = tabContent.querySelectorAll('.paging');
for (let i = 0, length = elems.length; i < length; i++) {
elems[i].innerHTML = pagingHtml;
}
elems = tabContent.querySelectorAll('.btnNextPage');
for (let i = 0, length = elems.length; i < length; i++) {
elems[i].addEventListener('click', onNextPageClick);
}
elems = tabContent.querySelectorAll('.btnPreviousPage');
for (let i = 0, length = elems.length; i < length; i++) {
elems[i].addEventListener('click', onPreviousPageClick);
}
const itemsContainer = tabContent.querySelector('.itemsContainer');
itemsContainer.innerHTML = html;
imageLoader.lazyChildren(itemsContainer);
libraryBrowser.saveQueryValues(getSavedQueryKey(page), query);
loading.hide();
isLoading = false;
import('../../components/autoFocuser').then(({ default: autoFocuser }) => {
autoFocuser.autoFocus(tabContent);
});
});
};
const data = {};
let isLoading = false;
this.showFilterMenu = function () {
import('../../components/filterdialog/filterdialog').then(({ default: filterDialogFactory }) => {
const filterDialog = new filterDialogFactory({
query: getQuery(tabContent),
mode: this.mode,
serverId: ApiClient.serverId()
});
Events.on(filterDialog, 'filterchange', function () {
getQuery(tabContent).StartIndex = 0;
reloadItems(tabContent);
});
filterDialog.show();
});
};
this.getCurrentViewStyle = function () {
return getPageData(tabContent).view;
};
const initPage = (tabElement) => {
const alphaPickerElement = tabElement.querySelector('.alphaPicker');
const itemsContainer = tabElement.querySelector('.itemsContainer');
alphaPickerElement.addEventListener('alphavaluechanged', function (e) {
const newValue = e.detail.value;
const query = getQuery(tabElement);
if (newValue === '#') {
query.NameLessThan = 'A';
delete query.NameStartsWith;
} else {
query.NameStartsWith = newValue;
delete query.NameLessThan;
}
query.StartIndex = 0;
reloadItems(tabElement);
});
this.alphaPicker = new AlphaPicker({
element: alphaPickerElement,
valueChangeEvent: 'click'
});
tabElement.querySelector('.alphaPicker').classList.add('alphabetPicker-right');
alphaPickerElement.classList.add('alphaPicker-fixed-right');
itemsContainer.classList.add('padded-right-withalphapicker');
tabElement.querySelector('.btnFilter').addEventListener('click', () => {
this.showFilterMenu();
});
const btnSelectView = tabElement.querySelector('.btnSelectView');
btnSelectView.addEventListener('click', (e) => {
libraryBrowser.showLayoutMenu(e.target, this.getCurrentViewStyle(), 'List,Poster,PosterCard'.split(','));
});
btnSelectView.addEventListener('layoutchange', function (e) {
const viewStyle = e.detail.viewStyle;
getPageData(tabElement).view = viewStyle;
libraryBrowser.saveViewSetting(getSavedQueryKey(tabElement), viewStyle);
getQuery(tabElement).StartIndex = 0;
onViewStyleChange();
reloadItems(tabElement);
});
};
initPage(tabContent);
onViewStyleChange();
this.renderTab = () => {
reloadItems(tabContent);
this.alphaPicker?.updateControls(getQuery(tabContent));
};
}

View file

@ -3,132 +3,129 @@ import cardBuilder from '../../components/cardbuilder/cardBuilder';
import imageLoader from '../../components/images/imageLoader';
import loading from '../../components/loading/loading';
/* eslint-disable indent */
export default function (view, params, tabContent) {
function getPageData() {
const key = getSavedQueryKey();
let pageData = data[key];
export default function (view, params, tabContent) {
function getPageData() {
const key = getSavedQueryKey();
let pageData = data[key];
if (!pageData) {
pageData = data[key] = {
query: {
SortBy: 'SortName',
SortOrder: 'Ascending',
Recursive: true,
Fields: 'PrimaryImageAspectRatio,ItemCounts',
StartIndex: 0
},
view: libraryBrowser.getSavedView(key) || 'Poster'
};
pageData.query.ParentId = params.topParentId;
libraryBrowser.loadSavedQueryValues(key, pageData.query);
}
return pageData;
if (!pageData) {
pageData = data[key] = {
query: {
SortBy: 'SortName',
SortOrder: 'Ascending',
Recursive: true,
Fields: 'PrimaryImageAspectRatio,ItemCounts',
StartIndex: 0
},
view: libraryBrowser.getSavedView(key) || 'Poster'
};
pageData.query.ParentId = params.topParentId;
libraryBrowser.loadSavedQueryValues(key, pageData.query);
}
function getQuery() {
return getPageData().query;
}
function getSavedQueryKey() {
return libraryBrowser.getSavedQueryKey('genres');
}
function getPromise() {
loading.show();
const query = getQuery();
return ApiClient.getGenres(ApiClient.getCurrentUserId(), query);
}
const reloadItems = (context, promise) => {
const query = getQuery();
promise.then((result) => {
let html = '';
const viewStyle = this.getCurrentViewStyle();
if (viewStyle == 'Thumb') {
html = cardBuilder.getCardsHtml({
items: result.Items,
shape: 'backdrop',
preferThumb: true,
context: 'music',
centerText: true,
overlayMoreButton: true,
showTitle: true
});
} else if (viewStyle == 'ThumbCard') {
html = cardBuilder.getCardsHtml({
items: result.Items,
shape: 'backdrop',
preferThumb: true,
context: 'music',
cardLayout: true,
showTitle: true
});
} else if (viewStyle == 'PosterCard') {
html = cardBuilder.getCardsHtml({
items: result.Items,
shape: 'auto',
context: 'music',
cardLayout: true,
showTitle: true
});
} else if (viewStyle == 'Poster') {
html = cardBuilder.getCardsHtml({
items: result.Items,
shape: 'auto',
context: 'music',
centerText: true,
overlayMoreButton: true,
showTitle: true
});
}
const elem = context.querySelector('#items');
elem.innerHTML = html;
imageLoader.lazyChildren(elem);
libraryBrowser.saveQueryValues(getSavedQueryKey(), query);
loading.hide();
import('../../components/autoFocuser').then(({ default: autoFocuser }) => {
autoFocuser.autoFocus(context);
});
});
};
function fullyReload() {
this.preRender();
this.renderTab();
}
const data = {};
this.getViewStyles = function () {
return 'Poster,PosterCard,Thumb,ThumbCard'.split(',');
};
this.getCurrentViewStyle = function () {
return getPageData().view;
};
this.setCurrentViewStyle = function (viewStyle) {
getPageData().view = viewStyle;
libraryBrowser.saveViewSetting(getSavedQueryKey(), viewStyle);
fullyReload();
};
this.enableViewSelection = true;
let promise;
this.preRender = function () {
promise = getPromise();
};
this.renderTab = function () {
reloadItems(tabContent, promise);
};
return pageData;
}
/* eslint-enable indent */
function getQuery() {
return getPageData().query;
}
function getSavedQueryKey() {
return libraryBrowser.getSavedQueryKey('genres');
}
function getPromise() {
loading.show();
const query = getQuery();
return ApiClient.getGenres(ApiClient.getCurrentUserId(), query);
}
const reloadItems = (context, promise) => {
const query = getQuery();
promise.then((result) => {
let html = '';
const viewStyle = this.getCurrentViewStyle();
if (viewStyle == 'Thumb') {
html = cardBuilder.getCardsHtml({
items: result.Items,
shape: 'backdrop',
preferThumb: true,
context: 'music',
centerText: true,
overlayMoreButton: true,
showTitle: true
});
} else if (viewStyle == 'ThumbCard') {
html = cardBuilder.getCardsHtml({
items: result.Items,
shape: 'backdrop',
preferThumb: true,
context: 'music',
cardLayout: true,
showTitle: true
});
} else if (viewStyle == 'PosterCard') {
html = cardBuilder.getCardsHtml({
items: result.Items,
shape: 'auto',
context: 'music',
cardLayout: true,
showTitle: true
});
} else if (viewStyle == 'Poster') {
html = cardBuilder.getCardsHtml({
items: result.Items,
shape: 'auto',
context: 'music',
centerText: true,
overlayMoreButton: true,
showTitle: true
});
}
const elem = context.querySelector('#items');
elem.innerHTML = html;
imageLoader.lazyChildren(elem);
libraryBrowser.saveQueryValues(getSavedQueryKey(), query);
loading.hide();
import('../../components/autoFocuser').then(({ default: autoFocuser }) => {
autoFocuser.autoFocus(context);
});
});
};
function fullyReload() {
this.preRender();
this.renderTab();
}
const data = {};
this.getViewStyles = function () {
return 'Poster,PosterCard,Thumb,ThumbCard'.split(',');
};
this.getCurrentViewStyle = function () {
return getPageData().view;
};
this.setCurrentViewStyle = function (viewStyle) {
getPageData().view = viewStyle;
libraryBrowser.saveViewSetting(getSavedQueryKey(), viewStyle);
fullyReload();
};
this.enableViewSelection = true;
let promise;
this.preRender = function () {
promise = getPromise();
};
this.renderTab = function () {
reloadItems(tabContent, promise);
};
}

View file

@ -3,87 +3,84 @@ import cardBuilder from '../../components/cardbuilder/cardBuilder';
import imageLoader from '../../components/images/imageLoader';
import loading from '../../components/loading/loading';
/* eslint-disable indent */
export default function (view, params, tabContent) {
function getPageData() {
const key = getSavedQueryKey();
let pageData = data[key];
export default function (view, params, tabContent) {
function getPageData() {
const key = getSavedQueryKey();
let pageData = data[key];
if (!pageData) {
pageData = data[key] = {
query: {
SortBy: 'SortName',
SortOrder: 'Ascending',
IncludeItemTypes: 'Playlist',
Recursive: true,
Fields: 'PrimaryImageAspectRatio,SortName,CanDelete',
StartIndex: 0
},
view: libraryBrowser.getSavedView(key) || 'Poster'
};
pageData.query.ParentId = params.topParentId;
libraryBrowser.loadSavedQueryValues(key, pageData.query);
}
return pageData;
if (!pageData) {
pageData = data[key] = {
query: {
SortBy: 'SortName',
SortOrder: 'Ascending',
IncludeItemTypes: 'Playlist',
Recursive: true,
Fields: 'PrimaryImageAspectRatio,SortName,CanDelete',
StartIndex: 0
},
view: libraryBrowser.getSavedView(key) || 'Poster'
};
pageData.query.ParentId = params.topParentId;
libraryBrowser.loadSavedQueryValues(key, pageData.query);
}
function getQuery() {
return getPageData().query;
}
function getSavedQueryKey() {
return libraryBrowser.getSavedQueryKey('genres');
}
function getPromise() {
loading.show();
const query = getQuery();
return ApiClient.getItems(ApiClient.getCurrentUserId(), query);
}
function reloadItems(context, promise) {
const query = getQuery();
promise.then(function (result) {
let html = '';
html = cardBuilder.getCardsHtml({
items: result.Items,
shape: 'square',
showTitle: true,
coverImage: true,
centerText: true,
overlayPlayButton: true,
allowBottomPadding: true,
cardLayout: false
});
const elem = context.querySelector('#items');
elem.innerHTML = html;
imageLoader.lazyChildren(elem);
libraryBrowser.saveQueryValues(getSavedQueryKey(), query);
loading.hide();
import('../../components/autoFocuser').then(({ default: autoFocuser }) => {
autoFocuser.autoFocus(context);
});
});
}
const data = {};
this.getCurrentViewStyle = function () {
return getPageData().view;
};
let promise;
this.preRender = function () {
promise = getPromise();
};
this.renderTab = function () {
reloadItems(tabContent, promise);
};
return pageData;
}
/* eslint-enable indent */
function getQuery() {
return getPageData().query;
}
function getSavedQueryKey() {
return libraryBrowser.getSavedQueryKey('genres');
}
function getPromise() {
loading.show();
const query = getQuery();
return ApiClient.getItems(ApiClient.getCurrentUserId(), query);
}
function reloadItems(context, promise) {
const query = getQuery();
promise.then(function (result) {
let html = '';
html = cardBuilder.getCardsHtml({
items: result.Items,
shape: 'square',
showTitle: true,
coverImage: true,
centerText: true,
overlayPlayButton: true,
allowBottomPadding: true,
cardLayout: false
});
const elem = context.querySelector('#items');
elem.innerHTML = html;
imageLoader.lazyChildren(elem);
libraryBrowser.saveQueryValues(getSavedQueryKey(), query);
loading.hide();
import('../../components/autoFocuser').then(({ default: autoFocuser }) => {
autoFocuser.autoFocus(context);
});
});
}
const data = {};
this.getCurrentViewStyle = function () {
return getPageData().view;
};
let promise;
this.preRender = function () {
promise = getPromise();
};
this.renderTab = function () {
reloadItems(tabContent, promise);
};
}

View file

@ -16,386 +16,383 @@ import '../../elements/emby-button/emby-button';
import '../../styles/flexstyles.scss';
import Dashboard from '../../utils/dashboard';
/* eslint-disable indent */
function itemsPerRow() {
const screenWidth = dom.getWindowSize().innerWidth;
function itemsPerRow() {
const screenWidth = dom.getWindowSize().innerWidth;
if (screenWidth >= 1920) {
return 9;
}
if (screenWidth >= 1200) {
return 12;
}
if (screenWidth >= 1000) {
return 10;
}
return 8;
if (screenWidth >= 1920) {
return 9;
}
function enableScrollX() {
return !layoutManager.desktop;
if (screenWidth >= 1200) {
return 12;
}
function getSquareShape() {
return enableScrollX() ? 'overflowSquare' : 'square';
if (screenWidth >= 1000) {
return 10;
}
function loadLatest(page, parentId) {
return 8;
}
function enableScrollX() {
return !layoutManager.desktop;
}
function getSquareShape() {
return enableScrollX() ? 'overflowSquare' : 'square';
}
function loadLatest(page, parentId) {
loading.show();
const userId = ApiClient.getCurrentUserId();
const options = {
IncludeItemTypes: 'Audio',
Limit: enableScrollX() ? 3 * itemsPerRow() : 2 * itemsPerRow(),
Fields: 'PrimaryImageAspectRatio,BasicSyncInfo',
ParentId: parentId,
ImageTypeLimit: 1,
EnableImageTypes: 'Primary,Backdrop,Banner,Thumb',
EnableTotalRecordCount: false
};
ApiClient.getJSON(ApiClient.getUrl('Users/' + userId + '/Items/Latest', options)).then(function (items) {
const elem = page.querySelector('#recentlyAddedSongs');
elem.innerHTML = cardBuilder.getCardsHtml({
items: items,
showUnplayedIndicator: false,
showLatestItemsPopup: false,
shape: getSquareShape(),
showTitle: true,
showParentTitle: true,
lazy: true,
centerText: true,
overlayPlayButton: true,
allowBottomPadding: !enableScrollX(),
cardLayout: false,
coverImage: true
});
imageLoader.lazyChildren(elem);
loading.hide();
import('../../components/autoFocuser').then(({ default: autoFocuser }) => {
autoFocuser.autoFocus(page);
});
});
}
function loadRecentlyPlayed(page, parentId) {
const options = {
SortBy: 'DatePlayed',
SortOrder: 'Descending',
IncludeItemTypes: 'Audio',
Limit: itemsPerRow(),
Recursive: true,
Fields: 'PrimaryImageAspectRatio,AudioInfo',
Filters: 'IsPlayed',
ParentId: parentId,
ImageTypeLimit: 1,
EnableImageTypes: 'Primary,Backdrop,Banner,Thumb',
EnableTotalRecordCount: false
};
ApiClient.getItems(ApiClient.getCurrentUserId(), options).then(function (result) {
const elem = page.querySelector('#recentlyPlayed');
if (result.Items.length) {
elem.classList.remove('hide');
} else {
elem.classList.add('hide');
}
const itemsContainer = elem.querySelector('.itemsContainer');
itemsContainer.innerHTML = cardBuilder.getCardsHtml({
items: result.Items,
showUnplayedIndicator: false,
shape: getSquareShape(),
showTitle: true,
showParentTitle: true,
action: 'instantmix',
lazy: true,
centerText: true,
overlayMoreButton: true,
allowBottomPadding: !enableScrollX(),
cardLayout: false,
coverImage: true
});
imageLoader.lazyChildren(itemsContainer);
});
}
function loadFrequentlyPlayed(page, parentId) {
const options = {
SortBy: 'PlayCount',
SortOrder: 'Descending',
IncludeItemTypes: 'Audio',
Limit: itemsPerRow(),
Recursive: true,
Fields: 'PrimaryImageAspectRatio,AudioInfo',
Filters: 'IsPlayed',
ParentId: parentId,
ImageTypeLimit: 1,
EnableImageTypes: 'Primary,Backdrop,Banner,Thumb',
EnableTotalRecordCount: false
};
ApiClient.getItems(ApiClient.getCurrentUserId(), options).then(function (result) {
const elem = page.querySelector('#topPlayed');
if (result.Items.length) {
elem.classList.remove('hide');
} else {
elem.classList.add('hide');
}
const itemsContainer = elem.querySelector('.itemsContainer');
itemsContainer.innerHTML = cardBuilder.getCardsHtml({
items: result.Items,
showUnplayedIndicator: false,
shape: getSquareShape(),
showTitle: true,
showParentTitle: true,
action: 'instantmix',
lazy: true,
centerText: true,
overlayMoreButton: true,
allowBottomPadding: !enableScrollX(),
cardLayout: false,
coverImage: true
});
imageLoader.lazyChildren(itemsContainer);
});
}
function loadSuggestionsTab(page, tabContent, parentId) {
console.debug('loadSuggestionsTab');
loadLatest(tabContent, parentId);
loadRecentlyPlayed(tabContent, parentId);
loadFrequentlyPlayed(tabContent, parentId);
import('../../components/favoriteitems').then(({ default: favoriteItems }) => {
favoriteItems.render(tabContent, ApiClient.getCurrentUserId(), parentId, ['favoriteArtists', 'favoriteAlbums', 'favoriteSongs']);
});
}
function getTabs() {
return [{
name: globalize.translate('Albums')
}, {
name: globalize.translate('Suggestions')
}, {
name: globalize.translate('HeaderAlbumArtists')
}, {
name: globalize.translate('Artists')
}, {
name: globalize.translate('Playlists')
}, {
name: globalize.translate('Songs')
}, {
name: globalize.translate('Genres')
}];
}
function getDefaultTabIndex(folderId) {
switch (userSettings.get('landing-' + folderId)) {
case 'suggestions':
return 1;
case 'albumartists':
return 2;
case 'artists':
return 3;
case 'playlists':
return 4;
case 'songs':
return 5;
case 'genres':
return 6;
default:
return 0;
}
}
export default function (view, params) {
function reload() {
loading.show();
const userId = ApiClient.getCurrentUserId();
const options = {
IncludeItemTypes: 'Audio',
Limit: enableScrollX() ? 3 * itemsPerRow() : 2 * itemsPerRow(),
Fields: 'PrimaryImageAspectRatio,BasicSyncInfo',
ParentId: parentId,
ImageTypeLimit: 1,
EnableImageTypes: 'Primary,Backdrop,Banner,Thumb',
EnableTotalRecordCount: false
};
ApiClient.getJSON(ApiClient.getUrl('Users/' + userId + '/Items/Latest', options)).then(function (items) {
const elem = page.querySelector('#recentlyAddedSongs');
elem.innerHTML = cardBuilder.getCardsHtml({
items: items,
showUnplayedIndicator: false,
showLatestItemsPopup: false,
shape: getSquareShape(),
showTitle: true,
showParentTitle: true,
lazy: true,
centerText: true,
overlayPlayButton: true,
allowBottomPadding: !enableScrollX(),
cardLayout: false,
coverImage: true
});
imageLoader.lazyChildren(elem);
loading.hide();
import('../../components/autoFocuser').then(({ default: autoFocuser }) => {
autoFocuser.autoFocus(page);
});
});
const tabContent = view.querySelector(".pageTabContent[data-index='" + suggestionsTabIndex + "']");
loadSuggestionsTab(view, tabContent, params.topParentId);
}
function loadRecentlyPlayed(page, parentId) {
const options = {
SortBy: 'DatePlayed',
SortOrder: 'Descending',
IncludeItemTypes: 'Audio',
Limit: itemsPerRow(),
Recursive: true,
Fields: 'PrimaryImageAspectRatio,AudioInfo',
Filters: 'IsPlayed',
ParentId: parentId,
ImageTypeLimit: 1,
EnableImageTypes: 'Primary,Backdrop,Banner,Thumb',
EnableTotalRecordCount: false
};
ApiClient.getItems(ApiClient.getCurrentUserId(), options).then(function (result) {
const elem = page.querySelector('#recentlyPlayed');
function setScrollClasses(elem, scrollX) {
if (scrollX) {
elem.classList.add('hiddenScrollX');
if (result.Items.length) {
elem.classList.remove('hide');
} else {
elem.classList.add('hide');
if (layoutManager.tv) {
elem.classList.add('smoothScrollX');
}
const itemsContainer = elem.querySelector('.itemsContainer');
itemsContainer.innerHTML = cardBuilder.getCardsHtml({
items: result.Items,
showUnplayedIndicator: false,
shape: getSquareShape(),
showTitle: true,
showParentTitle: true,
action: 'instantmix',
lazy: true,
centerText: true,
overlayMoreButton: true,
allowBottomPadding: !enableScrollX(),
cardLayout: false,
coverImage: true
});
imageLoader.lazyChildren(itemsContainer);
});
}
function loadFrequentlyPlayed(page, parentId) {
const options = {
SortBy: 'PlayCount',
SortOrder: 'Descending',
IncludeItemTypes: 'Audio',
Limit: itemsPerRow(),
Recursive: true,
Fields: 'PrimaryImageAspectRatio,AudioInfo',
Filters: 'IsPlayed',
ParentId: parentId,
ImageTypeLimit: 1,
EnableImageTypes: 'Primary,Backdrop,Banner,Thumb',
EnableTotalRecordCount: false
};
ApiClient.getItems(ApiClient.getCurrentUserId(), options).then(function (result) {
const elem = page.querySelector('#topPlayed');
if (result.Items.length) {
elem.classList.remove('hide');
} else {
elem.classList.add('hide');
}
const itemsContainer = elem.querySelector('.itemsContainer');
itemsContainer.innerHTML = cardBuilder.getCardsHtml({
items: result.Items,
showUnplayedIndicator: false,
shape: getSquareShape(),
showTitle: true,
showParentTitle: true,
action: 'instantmix',
lazy: true,
centerText: true,
overlayMoreButton: true,
allowBottomPadding: !enableScrollX(),
cardLayout: false,
coverImage: true
});
imageLoader.lazyChildren(itemsContainer);
});
}
function loadSuggestionsTab(page, tabContent, parentId) {
console.debug('loadSuggestionsTab');
loadLatest(tabContent, parentId);
loadRecentlyPlayed(tabContent, parentId);
loadFrequentlyPlayed(tabContent, parentId);
import('../../components/favoriteitems').then(({ default: favoriteItems }) => {
favoriteItems.render(tabContent, ApiClient.getCurrentUserId(), parentId, ['favoriteArtists', 'favoriteAlbums', 'favoriteSongs']);
});
}
function getTabs() {
return [{
name: globalize.translate('Albums')
}, {
name: globalize.translate('Suggestions')
}, {
name: globalize.translate('HeaderAlbumArtists')
}, {
name: globalize.translate('Artists')
}, {
name: globalize.translate('Playlists')
}, {
name: globalize.translate('Songs')
}, {
name: globalize.translate('Genres')
}];
}
function getDefaultTabIndex(folderId) {
switch (userSettings.get('landing-' + folderId)) {
case 'suggestions':
return 1;
case 'albumartists':
return 2;
case 'artists':
return 3;
case 'playlists':
return 4;
case 'songs':
return 5;
case 'genres':
return 6;
default:
return 0;
elem.classList.add('scrollX');
elem.classList.remove('vertical-wrap');
} else {
elem.classList.remove('hiddenScrollX');
elem.classList.remove('smoothScrollX');
elem.classList.remove('scrollX');
elem.classList.add('vertical-wrap');
}
}
export default function (view, params) {
function reload() {
loading.show();
const tabContent = view.querySelector(".pageTabContent[data-index='" + suggestionsTabIndex + "']");
loadSuggestionsTab(view, tabContent, params.topParentId);
function onBeforeTabChange(e) {
preLoadTab(view, parseInt(e.detail.selectedTabIndex, 10));
}
function onTabChange(e) {
loadTab(view, parseInt(e.detail.selectedTabIndex, 10));
}
function getTabContainers() {
return view.querySelectorAll('.pageTabContent');
}
function initTabs() {
mainTabsManager.setTabs(view, currentTabIndex, getTabs, getTabContainers, onBeforeTabChange, onTabChange);
}
const getTabController = (page, index, callback) => {
let depends;
switch (index) {
case 0:
depends = 'musicalbums';
break;
case 1:
depends = 'musicrecommended';
break;
case 2:
case 3:
depends = 'musicartists';
break;
case 4:
depends = 'musicplaylists';
break;
case 5:
depends = 'songs';
break;
case 6:
depends = 'musicgenres';
break;
}
function setScrollClasses(elem, scrollX) {
if (scrollX) {
elem.classList.add('hiddenScrollX');
import(`../music/${depends}`).then(({ default: controllerFactory }) => {
let tabContent;
if (layoutManager.tv) {
elem.classList.add('smoothScrollX');
}
elem.classList.add('scrollX');
elem.classList.remove('vertical-wrap');
} else {
elem.classList.remove('hiddenScrollX');
elem.classList.remove('smoothScrollX');
elem.classList.remove('scrollX');
elem.classList.add('vertical-wrap');
}
}
function onBeforeTabChange(e) {
preLoadTab(view, parseInt(e.detail.selectedTabIndex, 10));
}
function onTabChange(e) {
loadTab(view, parseInt(e.detail.selectedTabIndex, 10));
}
function getTabContainers() {
return view.querySelectorAll('.pageTabContent');
}
function initTabs() {
mainTabsManager.setTabs(view, currentTabIndex, getTabs, getTabContainers, onBeforeTabChange, onTabChange);
}
const getTabController = (page, index, callback) => {
let depends;
switch (index) {
case 0:
depends = 'musicalbums';
break;
case 1:
depends = 'musicrecommended';
break;
case 2:
case 3:
depends = 'musicartists';
break;
case 4:
depends = 'musicplaylists';
break;
case 5:
depends = 'songs';
break;
case 6:
depends = 'musicgenres';
break;
if (index == 1) {
tabContent = view.querySelector(".pageTabContent[data-index='" + index + "']");
this.tabContent = tabContent;
}
import(`../music/${depends}`).then(({ default: controllerFactory }) => {
let tabContent;
let controller = tabControllers[index];
if (index == 1) {
tabContent = view.querySelector(".pageTabContent[data-index='" + index + "']");
this.tabContent = tabContent;
}
if (!controller) {
tabContent = view.querySelector(".pageTabContent[data-index='" + index + "']");
let controller = tabControllers[index];
if (!controller) {
tabContent = view.querySelector(".pageTabContent[data-index='" + index + "']");
if (index === 1) {
controller = this;
} else {
controller = new controllerFactory(view, params, tabContent);
}
if (index == 2) {
controller.mode = 'albumartists';
} else if (index == 3) {
controller.mode = 'artists';
}
tabControllers[index] = controller;
if (controller.initTab) {
controller.initTab();
}
}
callback(controller);
});
};
function preLoadTab(page, index) {
getTabController(page, index, function (controller) {
if (renderedTabs.indexOf(index) == -1 && controller.preRender) {
controller.preRender();
}
});
}
function loadTab(page, index) {
currentTabIndex = index;
getTabController(page, index, function (controller) {
if (renderedTabs.indexOf(index) == -1) {
renderedTabs.push(index);
controller.renderTab();
}
});
}
function onInputCommand(e) {
if (e.detail.command === 'search') {
e.preventDefault();
Dashboard.navigate('search.html?collectionType=music&parentId=' + params.topParentId);
}
}
let currentTabIndex = parseInt(params.tab || getDefaultTabIndex(params.topParentId), 10);
const suggestionsTabIndex = 1;
this.initTab = function () {
const tabContent = view.querySelector(".pageTabContent[data-index='" + suggestionsTabIndex + "']");
const containers = tabContent.querySelectorAll('.itemsContainer');
for (let i = 0, length = containers.length; i < length; i++) {
setScrollClasses(containers[i], browser.mobile);
}
};
this.renderTab = function () {
reload();
};
const tabControllers = [];
const renderedTabs = [];
view.addEventListener('viewshow', function () {
initTabs();
if (!view.getAttribute('data-title')) {
const parentId = params.topParentId;
if (parentId) {
ApiClient.getItem(ApiClient.getCurrentUserId(), parentId).then(function (item) {
view.setAttribute('data-title', item.Name);
libraryMenu.setTitle(item.Name);
});
if (index === 1) {
controller = this;
} else {
view.setAttribute('data-title', globalize.translate('TabMusic'));
libraryMenu.setTitle(globalize.translate('TabMusic'));
controller = new controllerFactory(view, params, tabContent);
}
if (index == 2) {
controller.mode = 'albumartists';
} else if (index == 3) {
controller.mode = 'artists';
}
tabControllers[index] = controller;
if (controller.initTab) {
controller.initTab();
}
}
inputManager.on(window, onInputCommand);
callback(controller);
});
view.addEventListener('viewbeforehide', function () {
inputManager.off(window, onInputCommand);
});
view.addEventListener('viewdestroy', function () {
tabControllers.forEach(function (t) {
if (t.destroy) {
t.destroy();
}
});
};
function preLoadTab(page, index) {
getTabController(page, index, function (controller) {
if (renderedTabs.indexOf(index) == -1 && controller.preRender) {
controller.preRender();
}
});
}
/* eslint-enable indent */
function loadTab(page, index) {
currentTabIndex = index;
getTabController(page, index, function (controller) {
if (renderedTabs.indexOf(index) == -1) {
renderedTabs.push(index);
controller.renderTab();
}
});
}
function onInputCommand(e) {
if (e.detail.command === 'search') {
e.preventDefault();
Dashboard.navigate('search.html?collectionType=music&parentId=' + params.topParentId);
}
}
let currentTabIndex = parseInt(params.tab || getDefaultTabIndex(params.topParentId), 10);
const suggestionsTabIndex = 1;
this.initTab = function () {
const tabContent = view.querySelector(".pageTabContent[data-index='" + suggestionsTabIndex + "']");
const containers = tabContent.querySelectorAll('.itemsContainer');
for (let i = 0, length = containers.length; i < length; i++) {
setScrollClasses(containers[i], browser.mobile);
}
};
this.renderTab = function () {
reload();
};
const tabControllers = [];
const renderedTabs = [];
view.addEventListener('viewshow', function () {
initTabs();
if (!view.getAttribute('data-title')) {
const parentId = params.topParentId;
if (parentId) {
ApiClient.getItem(ApiClient.getCurrentUserId(), parentId).then(function (item) {
view.setAttribute('data-title', item.Name);
libraryMenu.setTitle(item.Name);
});
} else {
view.setAttribute('data-title', globalize.translate('TabMusic'));
libraryMenu.setTitle(globalize.translate('TabMusic'));
}
}
inputManager.on(window, onInputCommand);
});
view.addEventListener('viewbeforehide', function () {
inputManager.off(window, onInputCommand);
});
view.addEventListener('viewdestroy', function () {
tabControllers.forEach(function (t) {
if (t.destroy) {
t.destroy();
}
});
});
}