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

consolidate scripts

This commit is contained in:
Luke Pulverenti 2016-06-17 15:44:19 -04:00
parent 68f26ae96e
commit 0783ddff59
11 changed files with 268 additions and 146 deletions

View file

@ -58,29 +58,52 @@
</div> </div>
</div> </div>
<div class="pageTabContent pageTabContent ehsContent" id="albumArtistsTab" data-index="2"> <div class="pageTabContent pageTabContent ehsContent" id="albumArtistsTab" data-index="2">
<div style="text-align: center; display: flex; flex-wrap: wrap; align-items: center; justify-content: center;padding:.7em .5em;">
<div class="paging"></div>
<button is="paper-icon-button-light" class="btnSelectView" title="${ButtonSelectView}"><iron-icon icon="view-comfy"></iron-icon></button>
<button is="paper-icon-button-light" class="btnFilter" title="${ButtonFilter}"><iron-icon icon="filter-list"></iron-icon></button>
</div>
<div class="alphaPicker alphabetPicker vertical"> <div class="alphaPicker alphabetPicker vertical">
</div> </div>
<div class="viewSettings">
<div class="listTopPaging"> <div class="itemsContainer itemsContainerWithAlphaPicker">
</div> </div>
<div style="text-align: center; display: flex; flex-wrap: wrap; align-items: center; justify-content: center;padding:.7em .5em;">
<div class="paging"></div>
</div> </div>
<div id="items" class="itemsContainer paddedItemsContainer itemsContainerWithAlphaPicker" style="text-align:center;"></div>
</div> </div>
<div class="pageTabContent pageTabContent ehsContent" id="artistsTab" data-index="3"> <div class="pageTabContent pageTabContent ehsContent" id="artistsTab" data-index="3">
<div style="text-align: center; display: flex; flex-wrap: wrap; align-items: center; justify-content: center;padding:.7em .5em;">
<div class="paging"></div>
<button is="paper-icon-button-light" class="btnSelectView" title="${ButtonSelectView}"><iron-icon icon="view-comfy"></iron-icon></button>
<button is="paper-icon-button-light" class="btnFilter" title="${ButtonFilter}"><iron-icon icon="filter-list"></iron-icon></button>
</div>
<div class="alphaPicker alphabetPicker vertical"> <div class="alphaPicker alphabetPicker vertical">
</div> </div>
<div class="viewSettings">
<div class="listTopPaging"> <div class="itemsContainer itemsContainerWithAlphaPicker">
</div> </div>
<div style="text-align: center; display: flex; flex-wrap: wrap; align-items: center; justify-content: center;padding:.7em .5em;">
<div class="paging"></div>
</div> </div>
<div id="items" class="itemsContainer paddedItemsContainer itemsContainerWithAlphaPicker" style="text-align:center;"></div>
</div> </div>
<div class="pageTabContent pageTabContent ehsContent" id="songsTab" data-index="4"> <div class="pageTabContent pageTabContent ehsContent" id="songsTab" data-index="4">
<div class="viewSettings"> <div style="text-align: center; display: flex; flex-wrap: wrap; align-items: center; justify-content: center;padding:.7em .5em;">
<div class="listTopPaging"> <div class="paging"></div>
</div> <button is="paper-icon-button-light" class="btnSort" title="${ButtonSort}"><iron-icon icon="sort-by-alpha"></iron-icon></button>
<button is="paper-icon-button-light" class="btnFilter" title="${ButtonFilter}"><iron-icon icon="filter-list"></iron-icon></button>
</div>
<div class="alphaPicker alphabetPicker vertical">
</div>
<div class="itemsContainer itemsContainerWithAlphaPicker" style="max-width: 1000px;margin: 0 auto;">
</div>
<div style="text-align: center; display: flex; flex-wrap: wrap; align-items: center; justify-content: center;padding:.7em .5em;">
<div class="paging"></div>
</div> </div>
<div id="items" class="itemsContainer" style="max-width:1000px;margin: 0 auto;"></div>
</div> </div>
<div class="pageTabContent pageTabContent ehsContent" id="genresTab" data-index="5"> <div class="pageTabContent pageTabContent ehsContent" id="genresTab" data-index="5">
<div style="text-align: center; display: flex; align-items: center; justify-content: center;"> <div style="text-align: center; display: flex; align-items: center; justify-content: center;">

View file

@ -202,12 +202,13 @@
}); });
}); });
tabContent.querySelector('.btnSelectView').addEventListener('click', function (e) { var btnSelectView = tabContent.querySelector('.btnSelectView');
btnSelectView.addEventListener('click', function (e) {
libraryBrowser.showLayoutMenu(e.target, self.getCurrentViewStyle(), 'List,Poster,PosterCard'.split(',')); libraryBrowser.showLayoutMenu(e.target, self.getCurrentViewStyle(), 'List,Poster,PosterCard'.split(','));
}); });
tabContent.querySelector('.btnSelectView').addEventListener('layoutchange', function (e) { btnSelectView.addEventListener('layoutchange', function (e) {
var viewStyle = e.detail.viewStyle; var viewStyle = e.detail.viewStyle;
getPageData(tabContent).view = viewStyle; getPageData(tabContent).view = viewStyle;

View file

@ -233,12 +233,13 @@
}); });
}); });
tabContent.querySelector('.btnSelectView').addEventListener('click', function (e) { var btnSelectView = tabContent.querySelector('.btnSelectView');
btnSelectView.addEventListener('click', function (e) {
libraryBrowser.showLayoutMenu(e.target, self.getCurrentViewStyle(), 'List,Poster,PosterCard,Thumb,ThumbCard'.split(',')); libraryBrowser.showLayoutMenu(e.target, self.getCurrentViewStyle(), 'List,Poster,PosterCard,Thumb,ThumbCard'.split(','));
}); });
tabContent.querySelector('.btnSelectView').addEventListener('layoutchange', function (e) { btnSelectView.addEventListener('layoutchange', function (e) {
var viewStyle = e.detail.viewStyle; var viewStyle = e.detail.viewStyle;

View file

@ -127,12 +127,13 @@
reloadItems(tabContent); reloadItems(tabContent);
}; };
tabContent.querySelector('.btnSelectView').addEventListener('click', function (e) { var btnSelectView = tabContent.querySelector('.btnSelectView');
btnSelectView.addEventListener('click', function (e) {
LibraryBrowser.showLayoutMenu(e.target, self.getCurrentViewStyle(), self.getViewStyles()); LibraryBrowser.showLayoutMenu(e.target, self.getCurrentViewStyle(), self.getViewStyles());
}); });
tabContent.querySelector('.btnSelectView').addEventListener('layoutchange', function (e) { btnSelectView.addEventListener('layoutchange', function (e) {
self.setCurrentViewStyle(e.detail.viewStyle); self.setCurrentViewStyle(e.detail.viewStyle);
}); });

View file

@ -283,12 +283,13 @@
}); });
}); });
tabContent.querySelector('.btnSelectView').addEventListener('click', function (e) { var btnSelectView = tabContent.querySelector('.btnSelectView');
btnSelectView.addEventListener('click', function (e) {
libraryBrowser.showLayoutMenu(e.target, self.getCurrentViewStyle(), 'Banner,List,Poster,PosterCard,Thumb,ThumbCard'.split(',')); libraryBrowser.showLayoutMenu(e.target, self.getCurrentViewStyle(), 'Banner,List,Poster,PosterCard,Thumb,ThumbCard'.split(','));
}); });
tabContent.querySelector('.btnSelectView').addEventListener('layoutchange', function (e) { btnSelectView.addEventListener('layoutchange', function (e) {
var viewStyle = e.detail.viewStyle; var viewStyle = e.detail.viewStyle;

View file

@ -224,12 +224,13 @@
}); });
}); });
tabContent.querySelector('.btnSelectView').addEventListener('click', function (e) { var btnSelectView = tabContent.querySelector('.btnSelectView');
btnSelectView.addEventListener('click', function (e) {
libraryBrowser.showLayoutMenu(e.target, self.getCurrentViewStyle(), 'List,Poster,PosterCard'.split(',')); libraryBrowser.showLayoutMenu(e.target, self.getCurrentViewStyle(), 'List,Poster,PosterCard'.split(','));
}); });
tabContent.querySelector('.btnSelectView').addEventListener('layoutchange', function (e) { btnSelectView.addEventListener('layoutchange', function (e) {
var viewStyle = e.detail.viewStyle; var viewStyle = e.detail.viewStyle;

View file

@ -1,10 +1,11 @@
define(['jQuery', 'alphaPicker'], function ($, alphaPicker) { define(['events', 'libraryBrowser', 'imageLoader', 'alphaPicker'], function (events, libraryBrowser, imageLoader, alphaPicker) {
return function (view, params, tabContent) { return function (view, params, tabContent) {
var self = this; var self = this;
var data = {}; var data = {};
function getPageData(context) { function getPageData(context) {
var key = getSavedQueryKey(context); var key = getSavedQueryKey(context);
var pageData = data[key]; var pageData = data[key];
@ -21,11 +22,11 @@
EnableImageTypes: "Primary,Backdrop,Banner,Thumb", EnableImageTypes: "Primary,Backdrop,Banner,Thumb",
Limit: LibraryBrowser.getDefaultPageSize() Limit: LibraryBrowser.getDefaultPageSize()
}, },
view: LibraryBrowser.getSavedView(key) || LibraryBrowser.getDefaultItemsView('Poster', 'Poster') view: libraryBrowser.getSavedView(key) || libraryBrowser.getDefaultItemsView('Poster', 'Poster')
}; };
pageData.query.ParentId = LibraryMenu.getTopParentId(); pageData.query.ParentId = params.topParentId;
LibraryBrowser.loadSavedQueryValues(key, pageData.query); libraryBrowser.loadSavedQueryValues(key, pageData.query);
} }
return pageData; return pageData;
} }
@ -58,25 +59,23 @@
// Scroll back up so they can see the results from the beginning // Scroll back up so they can see the results from the beginning
window.scrollTo(0, 0); window.scrollTo(0, 0);
var view = getPageData(page).view; updateFilterControls(page);
var html = '';
var pagingHtml = LibraryBrowser.getQueryPagingHtml({ var pagingHtml = LibraryBrowser.getQueryPagingHtml({
startIndex: query.StartIndex, startIndex: query.StartIndex,
limit: query.Limit, limit: query.Limit,
totalRecordCount: result.TotalRecordCount, totalRecordCount: result.TotalRecordCount,
showLimit: false, showLimit: false,
updatePageSizeSetting: false, updatePageSizeSetting: false,
addLayoutButton: true, addLayoutButton: false,
currentLayout: view, sortButton: false,
filterButton: true filterButton: false
}); });
page.querySelector('.listTopPaging').innerHTML = pagingHtml; var html;
var viewStyle = self.getCurrentViewStyle();
updateFilterControls(page); if (viewStyle == "List") {
if (view == "List") {
html = LibraryBrowser.getListViewHtml({ html = LibraryBrowser.getListViewHtml({
items: result.Items, items: result.Items,
@ -84,19 +83,7 @@
sortBy: query.SortBy sortBy: query.SortBy
}); });
} }
else if (view == "Poster") { else if (viewStyle == "PosterCard") {
html = LibraryBrowser.getPosterViewHtml({
items: result.Items,
shape: "square",
context: 'music',
showTitle: true,
coverImage: true,
lazy: true,
centerText: true,
overlayPlayButton: true
});
}
else if (view == "PosterCard") {
html = LibraryBrowser.getPosterViewHtml({ html = LibraryBrowser.getPosterViewHtml({
items: result.Items, items: result.Items,
@ -109,47 +96,69 @@
showSongCount: true showSongCount: true
}); });
} }
else {
var elem = page.querySelector('#items'); // Poster
elem.innerHTML = html + pagingHtml; html = LibraryBrowser.getPosterViewHtml({
ImageLoader.lazyChildren(elem); items: result.Items,
shape: "square",
context: 'music',
showTitle: true,
coverImage: true,
lazy: true,
centerText: true,
overlayPlayButton: true
});
}
$('.btnNextPage', page).on('click', function () { var i, length;
var elems = tabContent.querySelectorAll('.paging');
for (i = 0, length = elems.length; i < length; i++) {
elems[i].innerHTML = pagingHtml;
}
function onNextPageClick() {
query.StartIndex += query.Limit; query.StartIndex += query.Limit;
reloadItems(page); reloadItems(tabContent);
}); }
$('.btnPreviousPage', page).on('click', function () { function onPreviousPageClick() {
query.StartIndex -= query.Limit; query.StartIndex -= query.Limit;
reloadItems(page); reloadItems(tabContent);
}); }
$('.btnChangeLayout', page).on('layoutchange', function (e, layout) { elems = tabContent.querySelectorAll('.btnNextPage');
getPageData(page).view = layout; for (i = 0, length = elems.length; i < length; i++) {
LibraryBrowser.saveViewSetting(getSavedQueryKey(page), layout); elems[i].addEventListener('click', onNextPageClick);
reloadItems(page); }
});
$('.btnFilter', page).on('click', function () { elems = tabContent.querySelectorAll('.btnPreviousPage');
showFilterMenu(page); for (i = 0, length = elems.length; i < length; i++) {
}); elems[i].addEventListener('click', onPreviousPageClick);
}
var itemsContainer = tabContent.querySelector('.itemsContainer');
itemsContainer.innerHTML = html;
imageLoader.lazyChildren(itemsContainer);
libraryBrowser.saveQueryValues(getSavedQueryKey(page), query);
LibraryBrowser.saveQueryValues(getSavedQueryKey(page), query);
Dashboard.hideLoadingMsg(); Dashboard.hideLoadingMsg();
}); });
} }
function showFilterMenu(page) { self.showFilterMenu = function () {
require(['components/filterdialog/filterdialog'], function (filterDialogFactory) { require(['components/filterdialog/filterdialog'], function (filterDialogFactory) {
var filterDialog = new filterDialogFactory({ var filterDialog = new filterDialogFactory({
query: getQuery(page), query: getQuery(tabContent),
mode: self.mode mode: self.mode
}); });
Events.on(filterDialog, 'filterchange', function () { Events.on(filterDialog, 'filterchange', function () {
reloadItems(page); getQuery(tabContent).StartIndex = 0;
reloadItems(tabContent);
}); });
filterDialog.show(); filterDialog.show();
@ -159,27 +168,59 @@
function updateFilterControls(tabContent) { function updateFilterControls(tabContent) {
var query = getQuery(tabContent); var query = getQuery(tabContent);
self.alphaPicker.value(query.NameStartsWithOrGreater); self.alphaPicker.value(query.NameStartsWithOrGreater);
} }
var alphaPickerElement = tabContent.querySelector('.alphaPicker'); function initPage(tabContent) {
alphaPickerElement.addEventListener('alphavaluechanged', function (e) {
var newValue = e.detail.value;
var query = getQuery(tabContent);
query.NameStartsWithOrGreater = newValue;
query.StartIndex = 0;
reloadItems(tabContent);
});
self.alphaPicker = new alphaPicker({ var alphaPickerElement = tabContent.querySelector('.alphaPicker');
element: alphaPickerElement, alphaPickerElement.addEventListener('alphavaluechanged', function (e) {
valueChangeEvent: 'click' var newValue = e.detail.value;
}); var query = getQuery(tabContent);
query.NameStartsWithOrGreater = newValue;
query.StartIndex = 0;
reloadItems(tabContent);
});
self.alphaPicker = new alphaPicker({
element: alphaPickerElement,
valueChangeEvent: 'click'
});
tabContent.querySelector('.btnFilter').addEventListener('click', function () {
self.showFilterMenu();
});
var btnSelectView = tabContent.querySelector('.btnSelectView');
btnSelectView.addEventListener('click', function (e) {
libraryBrowser.showLayoutMenu(e.target, self.getCurrentViewStyle(), 'List,Poster,PosterCard'.split(','));
});
btnSelectView.addEventListener('layoutchange', function (e) {
var viewStyle = e.detail.viewStyle;
getPageData(tabContent).view = viewStyle;
libraryBrowser.saveViewSetting(getSavedQueryKey(tabContent), viewStyle);
getQuery(tabContent).StartIndex = 0;
reloadItems(tabContent);
});
}
self.getCurrentViewStyle = function () {
return getPageData(tabContent).view;
};
initPage(tabContent);
self.renderTab = function () { self.renderTab = function () {
reloadItems(tabContent); reloadItems(tabContent);
updateFilterControls(tabContent);
};
self.destroy = function () {
}; };
}; };
}); });

View file

@ -127,12 +127,13 @@
reloadItems(tabContent); reloadItems(tabContent);
}; };
tabContent.querySelector('.btnSelectView').addEventListener('click', function (e) { var btnSelectView = tabContent.querySelector('.btnSelectView');
btnSelectView.addEventListener('click', function (e) {
LibraryBrowser.showLayoutMenu(e.target, self.getCurrentViewStyle(), self.getViewStyles()); LibraryBrowser.showLayoutMenu(e.target, self.getCurrentViewStyle(), self.getViewStyles());
}); });
tabContent.querySelector('.btnSelectView').addEventListener('layoutchange', function (e) { btnSelectView.addEventListener('layoutchange', function (e) {
self.setCurrentViewStyle(e.detail.viewStyle); self.setCurrentViewStyle(e.detail.viewStyle);
}); });

View file

@ -1,13 +1,11 @@
define(['jQuery'], function ($) { define(['events', 'libraryBrowser', 'imageLoader', 'alphaPicker'], function (events, libraryBrowser, imageLoader, alphaPicker) {
return function (view, params, tabContent) { return function (view, params, tabContent) {
var self = this; var self = this;
var defaultSortBy = "Album,SortName";
var data = {}; var data = {};
function getPageData(context) { function getPageData(context) {
var key = getSavedQueryKey(context); var key = getSavedQueryKey(context);
var pageData = data[key]; var pageData = data[key];
@ -15,7 +13,7 @@
if (!pageData) { if (!pageData) {
pageData = data[key] = { pageData = data[key] = {
query: { query: {
SortBy: defaultSortBy, SortBy: "Album,SortName",
SortOrder: "Ascending", SortOrder: "Ascending",
IncludeItemTypes: "Audio", IncludeItemTypes: "Audio",
Recursive: true, Recursive: true,
@ -27,8 +25,8 @@
} }
}; };
pageData.query.ParentId = LibraryMenu.getTopParentId(); pageData.query.ParentId = params.topParentId;
LibraryBrowser.loadSavedQueryValues(key, pageData.query); libraryBrowser.loadSavedQueryValues(key, pageData.query);
} }
return pageData; return pageData;
} }
@ -41,66 +39,128 @@
function getSavedQueryKey(context) { function getSavedQueryKey(context) {
if (!context.savedQueryKey) { if (!context.savedQueryKey) {
context.savedQueryKey = LibraryBrowser.getSavedQueryKey('songs'); context.savedQueryKey = libraryBrowser.getSavedQueryKey('songs');
} }
return context.savedQueryKey; return context.savedQueryKey;
} }
function reloadItems(context) { function reloadItems(page) {
Dashboard.showLoadingMsg(); Dashboard.showLoadingMsg();
var query = getQuery(context); var query = getQuery(page);
ApiClient.getItems(Dashboard.getCurrentUserId(), query).then(function (result) { ApiClient.getItems(Dashboard.getCurrentUserId(), query).then(function (result) {
// Scroll back up so they can see the results from the beginning // Scroll back up so they can see the results from the beginning
window.scrollTo(0, 0); window.scrollTo(0, 0);
var html = ''; updateFilterControls(page);
var pagingHtml = LibraryBrowser.getQueryPagingHtml({ var pagingHtml = LibraryBrowser.getQueryPagingHtml({
startIndex: query.StartIndex, startIndex: query.StartIndex,
limit: query.Limit, limit: query.Limit,
totalRecordCount: result.TotalRecordCount, totalRecordCount: result.TotalRecordCount,
showLimit: false, showLimit: false,
sortButton: true,
updatePageSizeSetting: false, updatePageSizeSetting: false,
filterButton: true addLayoutButton: false,
sortButton: false,
filterButton: false
}); });
context.querySelector('.listTopPaging').innerHTML = pagingHtml; var html = LibraryBrowser.getListViewHtml({
html += LibraryBrowser.getListViewHtml({
items: result.Items, items: result.Items,
showIndex: true, showIndex: true,
defaultAction: 'play', defaultAction: 'play',
smallIcon: true smallIcon: true
}); });
var elem = context.querySelector('#items'); var i, length;
elem.innerHTML = html + pagingHtml; var elems = tabContent.querySelectorAll('.paging');
ImageLoader.lazyChildren(elem); for (i = 0, length = elems.length; i < length; i++) {
elems[i].innerHTML = pagingHtml;
}
$('.btnNextPage', context).on('click', function () { function onNextPageClick() {
query.StartIndex += query.Limit; query.StartIndex += query.Limit;
reloadItems(context); reloadItems(tabContent);
}); }
$('.btnPreviousPage', context).on('click', function () { function onPreviousPageClick() {
query.StartIndex -= query.Limit; query.StartIndex -= query.Limit;
reloadItems(context); reloadItems(tabContent);
}
elems = tabContent.querySelectorAll('.btnNextPage');
for (i = 0, length = elems.length; i < length; i++) {
elems[i].addEventListener('click', onNextPageClick);
}
elems = tabContent.querySelectorAll('.btnPreviousPage');
for (i = 0, length = elems.length; i < length; i++) {
elems[i].addEventListener('click', onPreviousPageClick);
}
var itemsContainer = tabContent.querySelector('.itemsContainer');
itemsContainer.innerHTML = html;
imageLoader.lazyChildren(itemsContainer);
libraryBrowser.saveQueryValues(getSavedQueryKey(page), query);
Dashboard.hideLoadingMsg();
});
}
self.showFilterMenu = function () {
require(['components/filterdialog/filterdialog'], function (filterDialogFactory) {
var filterDialog = new filterDialogFactory({
query: getQuery(tabContent),
mode: 'songs'
}); });
$('.btnFilter', context).on('click', function () { Events.on(filterDialog, 'filterchange', function () {
showFilterMenu(context); getQuery(tabContent).StartIndex = 0;
reloadItems(tabContent);
}); });
// On callback make sure to set StartIndex = 0 filterDialog.show();
$('.btnSort', context).on('click', function () { });
LibraryBrowser.showSortMenu({ }
items: [{
name: Globalize.translate('OptionTrackName'), function updateFilterControls(tabContent) {
id: 'Name'
}, var query = getQuery(tabContent);
self.alphaPicker.value(query.NameStartsWithOrGreater);
}
function initPage(tabContent) {
var alphaPickerElement = tabContent.querySelector('.alphaPicker');
alphaPickerElement.addEventListener('alphavaluechanged', function (e) {
var newValue = e.detail.value;
var query = getQuery(tabContent);
query.NameStartsWithOrGreater = newValue;
query.StartIndex = 0;
reloadItems(tabContent);
});
self.alphaPicker = new alphaPicker({
element: alphaPickerElement,
valueChangeEvent: 'click'
});
tabContent.querySelector('.btnFilter').addEventListener('click', function () {
self.showFilterMenu();
});
tabContent.querySelector('.btnSort').addEventListener('click', function (e) {
libraryBrowser.showSortMenu({
items: [{
name: Globalize.translate('OptionTrackName'),
id: 'Name'
},
{ {
name: Globalize.translate('OptionAlbum'), name: Globalize.translate('OptionAlbum'),
id: 'Album,SortName' id: 'Album,SortName'
@ -133,39 +193,29 @@
name: Globalize.translate('OptionRuntime'), name: Globalize.translate('OptionRuntime'),
id: 'Runtime,AlbumArtist,Album,SortName' id: 'Runtime,AlbumArtist,Album,SortName'
}], }],
callback: function () { callback: function () {
reloadItems(context); getQuery(tabContent).StartIndex = 0;
}, reloadItems(tabContent);
query: query },
}); query: getQuery(tabContent),
button: e.target
}); });
LibraryBrowser.saveQueryValues(getSavedQueryKey(context), query);
Dashboard.hideLoadingMsg();
}); });
} }
function showFilterMenu(context) { self.getCurrentViewStyle = function () {
return getPageData(tabContent).view;
};
require(['components/filterdialog/filterdialog'], function (filterDialogFactory) { initPage(tabContent);
var filterDialog = new filterDialogFactory({ self.renderTab = function () {
query: getQuery(context),
mode: 'songs'
});
Events.on(filterDialog, 'filterchange', function () {
reloadItems(context);
});
filterDialog.show();
});
}
self.renderTab = function () {
reloadItems(tabContent); reloadItems(tabContent);
updateFilterControls(tabContent);
};
self.destroy = function () {
}; };
}; };
}); });

View file

@ -127,12 +127,13 @@
reloadItems(tabContent); reloadItems(tabContent);
}; };
tabContent.querySelector('.btnSelectView').addEventListener('click', function (e) { var btnSelectView = tabContent.querySelector('.btnSelectView');
btnSelectView.addEventListener('click', function (e) {
LibraryBrowser.showLayoutMenu(e.target, self.getCurrentViewStyle(), self.getViewStyles()); LibraryBrowser.showLayoutMenu(e.target, self.getCurrentViewStyle(), self.getViewStyles());
}); });
tabContent.querySelector('.btnSelectView').addEventListener('layoutchange', function (e) { btnSelectView.addEventListener('layoutchange', function (e) {
self.setCurrentViewStyle(e.detail.viewStyle); self.setCurrentViewStyle(e.detail.viewStyle);
}); });

View file

@ -263,12 +263,13 @@
}); });
}); });
tabContent.querySelector('.btnSelectView').addEventListener('click', function (e) { var btnSelectView = tabContent.querySelector('.btnSelectView');
btnSelectView.addEventListener('click', function (e) {
libraryBrowser.showLayoutMenu(e.target, self.getCurrentViewStyle(), 'Banner,List,Poster,PosterCard,Thumb,ThumbCard'.split(',')); libraryBrowser.showLayoutMenu(e.target, self.getCurrentViewStyle(), 'Banner,List,Poster,PosterCard,Thumb,ThumbCard'.split(','));
}); });
tabContent.querySelector('.btnSelectView').addEventListener('layoutchange', function (e) { btnSelectView.addEventListener('layoutchange', function (e) {
var viewStyle = e.detail.viewStyle; var viewStyle = e.detail.viewStyle;