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

update music filters

Browse source
This commit is contained in:
Luke Pulverenti 2016-02-15 11:57:51 -05:00
parent d42d6c123a
commit 1bd86570be
11 changed files with 128 additions and 553 deletions
Download patch file Download diff file Expand all files Collapse all files

6
dashboard-ui/components/filterdialog/filterdialog.js
View file

@ -435,8 +435,8 @@
function setVisibility(context, options) { function setVisibility(context, options) {
if (options.mode == 'livetvchannels') { if (options.mode == 'livetvchannels' || options.mode == 'albums' || options.mode == 'artists' || options.mode == 'albumartists' || options.mode == 'songs') {
hideByClass(context, 'nolivetvchannels'); hideByClass(context, 'videoStandard');
} }
if (enableDynamicFilters(options.mode)) { if (enableDynamicFilters(options.mode)) {
@ -487,7 +487,7 @@
} }
function enableDynamicFilters(mode) { function enableDynamicFilters(mode) {
return mode == 'movies' || mode == 'games' || mode == 'series'; return mode == 'movies' || mode == 'games' || mode == 'series' || mode == 'albums' || mode == 'albumartists' || mode == 'artists' || mode == 'songs';
} }
return function (options) { return function (options) {

6
dashboard-ui/components/filterdialog/filterdialog.template.html
View file

@ -3,9 +3,9 @@
${HeaderFilters} ${HeaderFilters}
</h2> </h2>
<div class="paperCheckboxList"> <div class="paperCheckboxList">
<paper-checkbox class="chkStandardFilter nolivetvchannels" data-filter="IsPlayed">${OptionPlayed}</paper-checkbox> <paper-checkbox class="chkStandardFilter videoStandard" data-filter="IsPlayed">${OptionPlayed}</paper-checkbox>
<paper-checkbox class="chkStandardFilter nolivetvchannels" data-filter="IsUnPlayed">${OptionUnplayed}</paper-checkbox> <paper-checkbox class="chkStandardFilter videoStandard" data-filter="IsUnPlayed">${OptionUnplayed}</paper-checkbox>
<paper-checkbox class="chkStandardFilter nolivetvchannels" data-filter="IsResumable">${OptionResumable}</paper-checkbox> <paper-checkbox class="chkStandardFilter videoStandard" data-filter="IsResumable">${OptionResumable}</paper-checkbox>
<paper-checkbox class="chkStandardFilter chkFavorite" data-filter="IsFavorite">${OptionFavorite}</paper-checkbox> <paper-checkbox class="chkStandardFilter chkFavorite" data-filter="IsFavorite">${OptionFavorite}</paper-checkbox>
<paper-checkbox class="chkStandardFilter chkLikes" data-filter="Likes">${OptionLikes}</paper-checkbox> <paper-checkbox class="chkStandardFilter chkLikes" data-filter="Likes">${OptionLikes}</paper-checkbox>
<paper-checkbox class="chkStandardFilter chkDislikes" data-filter="Dislikes">${OptionDislikes}</paper-checkbox> <paper-checkbox class="chkStandardFilter chkDislikes" data-filter="Dislikes">${OptionDislikes}</paper-checkbox>

2
dashboard-ui/livetvitems.html
View file

@ -4,7 +4,7 @@
<title>Emby</title> <title>Emby</title>
</head> </head>
<body> <body>
<div id="liveTvItemsPage" data-role="page" class="page libraryPage liveTvPage noSecondaryNavPage" data-contextname="${HeaderLiveTv}" data-require="scripts/livetvitems,scripts/queryfilters,livetvcss" data-backbutton="true" data-menubutton="false"> <div id="liveTvItemsPage" data-role="page" class="page libraryPage liveTvPage noSecondaryNavPage" data-contextname="${HeaderLiveTv}" data-require="scripts/livetvitems,livetvcss" data-backbutton="true" data-menubutton="false">
<div data-role="content"> <div data-role="content">
<div class="viewSettings"> <div class="viewSettings">

152
dashboard-ui/music.html
View file

@ -4,7 +4,7 @@
<title>Emby</title> <title>Emby</title>
</head> </head>
<body> <body>
<div id="musicRecommendedPage" data-dom-cache="true" data-role="page" class="page libraryPage backdropPage pageWithAbsoluteTabs" data-backdroptype="musicartist" data-require="jqmpanel,jqmcollapsible,scripts/musicrecommended,paper-tabs,neon-animated-pages,paper-checkbox"> <div id="musicRecommendedPage" data-dom-cache="true" data-role="page" class="page libraryPage backdropPage pageWithAbsoluteTabs" data-backdroptype="musicartist" data-require="scripts/musicrecommended,paper-tabs,neon-animated-pages,paper-checkbox">
<div class="libraryViewNav libraryViewNavWithMinHeight"> <div class="libraryViewNav libraryViewNavWithMinHeight">
<paper-tabs hidescrollbuttons noink> <paper-tabs hidescrollbuttons noink>
<paper-tab>${TabSuggestions}</paper-tab> <paper-tab>${TabSuggestions}</paper-tab>
@ -125,156 +125,6 @@
</neon-animated-pages> </neon-animated-pages>
</div> </div>
<div data-role="panel" class="viewPanel albumsViewPanel hide" data-theme="b" data-position="right" data-display="overlay" data-position-fixed="true">
<div class="ui-panel-inner">
<form>
<div>
<h1>${HeaderFilters}</h1>
<div class="paperCheckboxList">
<paper-checkbox class="chkStandardFilter" data-filter="IsFavorite">${OptionFavorite}</paper-checkbox>
<paper-checkbox class="chkStandardFilter" data-filter="Likes">${OptionLikes}</paper-checkbox>
<paper-checkbox class="chkStandardFilter" data-filter="Dislikes">${OptionDislikes}</paper-checkbox>
</div>
</div>
<br />
<div data-role="collapsible" data-collapsed="true" data-mini="true" class="genreFilters">
<h2>${HeaderGenres}</h2>
<div class="filterOptions">
</div>
</div>
<div data-role="collapsible" data-collapsed="true" data-mini="true" class="officialRatingFilters">
<h2>${HeaderParentalRatings}</h2>
<div class="filterOptions">
</div>
</div>
<div data-role="collapsible" data-collapsed="true" data-mini="true" class="tagFilters">
<h2>${HeaderTags}</h2>
<div class="filterOptions">
</div>
</div>
<div data-role="collapsible" data-collapsed="true" data-mini="true" class="yearFilters">
<h2>${HeaderYears}</h2>
<div class="filterOptions">
</div>
</div>
</form>
</div>
</div>
<div data-role="panel" class="viewPanel artistsViewPanel hide" data-theme="b" data-position="right" data-display="overlay" data-position-fixed="true">
<div class="ui-panel-inner">
<form>
<div>
<h1>${HeaderFilters}</h1>
<div class="paperCheckboxList">
<paper-checkbox class="chkStandardFilter" data-filter="IsFavorite">${OptionFavorite}</paper-checkbox>
<paper-checkbox class="chkStandardFilter" data-filter="Likes">${OptionLikes}</paper-checkbox>
<paper-checkbox class="chkStandardFilter" data-filter="Dislikes">${OptionDislikes}</paper-checkbox>
</div>
</div>
<br />
<div data-role="collapsible" data-collapsed="true" data-mini="true" class="genreFilters">
<h2>${HeaderGenres}</h2>
<div class="filterOptions">
</div>
</div>
</form>
</div>
</div>
<div data-role="panel" class="viewPanel albumArtistsViewPanel hide" data-theme="b" data-position="right" data-display="overlay" data-position-fixed="true">
<div class="ui-panel-inner">
<form>
<div>
<h1>${HeaderFilters}</h1>
<div class="paperCheckboxList">
<paper-checkbox class="chkStandardFilter" data-filter="IsFavorite">${OptionFavorite}</paper-checkbox>
<paper-checkbox class="chkStandardFilter" data-filter="Likes">${OptionLikes}</paper-checkbox>
<paper-checkbox class="chkStandardFilter" data-filter="Dislikes">${OptionDislikes}</paper-checkbox>
</div>
</div>
<br />
<div data-role="collapsible" data-collapsed="true" data-mini="true" class="genreFilters">
<h2>${HeaderGenres}</h2>
<div class="filterOptions">
</div>
</div>
</form>
</div>
</div>
<div data-role="panel" class="viewPanel songsViewPanel hide" data-theme="b" data-position="right" data-display="overlay" data-position-fixed="true">
<div class="ui-panel-inner">
<form>
<div>
<h1>${HeaderFilters}</h1>
<div class="paperCheckboxList">
<paper-checkbox class="chkStandardFilter" data-filter="IsPlayed">${OptionPlayed}</paper-checkbox>
<paper-checkbox class="chkStandardFilter" data-filter="IsUnPlayed">${OptionUnplayed}</paper-checkbox>
<paper-checkbox class="chkStandardFilter" data-filter="IsFavorite">${OptionFavorite}</paper-checkbox>
<paper-checkbox class="chkStandardFilter" data-filter="Likes">${OptionLikes}</paper-checkbox>
<paper-checkbox class="chkStandardFilter" data-filter="Dislikes">${OptionDislikes}</paper-checkbox>
</div>
</div>
<br />
<div data-role="collapsible" data-collapsed="true" data-mini="true" class="genreFilters">
<h2>${HeaderGenres}</h2>
<div class="filterOptions">
</div>
</div>
<div data-role="collapsible" data-collapsed="true" data-mini="true" class="officialRatingFilters">
<h2>${HeaderParentalRatings}</h2>
<div class="filterOptions">
</div>
</div>
<div data-role="collapsible" data-collapsed="true" data-mini="true" class="tagFilters">
<h2>${HeaderTags}</h2>
<div class="filterOptions">
</div>
</div>
<div data-role="collapsible" data-collapsed="true" data-mini="true" class="yearFilters">
<h2>${HeaderYears}</h2>
<div class="filterOptions">
</div>
</div>
</form>
</div>
</div>
<div data-role="content"> <div data-role="content">
</div> </div>
</div> </div>

2
dashboard-ui/scripts/livetvitems.js
View file

@ -106,8 +106,6 @@
LibraryBrowser.loadSavedQueryValues(viewkey, query); LibraryBrowser.loadSavedQueryValues(viewkey, query);
QueryFilters.onPageShow(page, query);
reloadItems(page); reloadItems(page);
}); });

95
dashboard-ui/scripts/musicalbumartists.js
View file

@ -36,7 +36,7 @@
return LibraryBrowser.getSavedQueryKey('albumartists'); return LibraryBrowser.getSavedQueryKey('albumartists');
} }
function reloadItems(page, viewPanel) { function reloadItems(page) {
Dashboard.showLoadingMsg(); Dashboard.showLoadingMsg();
@ -55,17 +55,15 @@
limit: query.Limit, limit: query.Limit,
totalRecordCount: result.TotalRecordCount, totalRecordCount: result.TotalRecordCount,
showLimit: false, showLimit: false,
viewPanelClass: 'albumArtistsViewPanel',
updatePageSizeSetting: false, updatePageSizeSetting: false,
addLayoutButton: true, addLayoutButton: true,
currentLayout: view, currentLayout: view,
viewButton: true, filterButton: true
viewIcon: 'filter-list'
}); });
page.querySelector('.listTopPaging').innerHTML = pagingHtml; page.querySelector('.listTopPaging').innerHTML = pagingHtml;
updateFilterControls(page, viewPanel); updateFilterControls(page);
if (view == "List") { if (view == "List") {
@ -107,18 +105,22 @@
$('.btnNextPage', page).on('click', function () { $('.btnNextPage', page).on('click', function () {
query.StartIndex += query.Limit; query.StartIndex += query.Limit;
reloadItems(page, viewPanel); reloadItems(page);
}); });
$('.btnPreviousPage', page).on('click', function () { $('.btnPreviousPage', page).on('click', function () {
query.StartIndex -= query.Limit; query.StartIndex -= query.Limit;
reloadItems(page, viewPanel); reloadItems(page);
}); });
$('.btnChangeLayout', page).on('layoutchange', function (e, layout) { $('.btnChangeLayout', page).on('layoutchange', function (e, layout) {
getPageData().view = layout; getPageData().view = layout;
LibraryBrowser.saveViewSetting(getSavedQueryKey(), layout); LibraryBrowser.saveViewSetting(getSavedQueryKey(), layout);
reloadItems(page, viewPanel); reloadItems(page);
});
$('.btnFilter', page).on('click', function () {
showFilterMenu(page);
}); });
LibraryBrowser.saveQueryValues(getSavedQueryKey(), query); LibraryBrowser.saveQueryValues(getSavedQueryKey(), query);
@ -127,60 +129,31 @@
}); });
} }
function updateFilterControls(tabContent, viewPanel) { function showFilterMenu(page) {
require(['components/filterdialog/filterdialog'], function (filterDialogFactory) {
var filterDialog = new filterDialogFactory({
query: getQuery(),
mode: 'albumartists'
});
Events.on(filterDialog, 'filterchange', function () {
reloadItems(page);
});
filterDialog.show();
});
}
function updateFilterControls(tabContent) {
var query = getQuery(); var query = getQuery();
$('.chkStandardFilter', viewPanel).each(function () {
var filters = "," + (query.Filters || "");
var filterName = this.getAttribute('data-filter');
this.checked = filters.indexOf(',' + filterName) != -1;
});
$('.alphabetPicker', tabContent).alphaValue(query.NameStartsWithOrGreater); $('.alphabetPicker', tabContent).alphaValue(query.NameStartsWithOrGreater);
} }
function reloadFiltersIfNeeded(page, viewPanel) { function initPage(tabContent) {
if (!getPageData().filtersLoaded) {
getPageData().filtersLoaded = true;
var query = getQuery();
QueryFilters.loadFilters(viewPanel, Dashboard.getCurrentUserId(), query, function () {
reloadItems(page, viewPanel);
});
}
}
function initPage(tabContent, viewPanel) {
$(viewPanel).on('panelopen', function () {
reloadFiltersIfNeeded(tabContent, viewPanel);
});
$('.chkStandardFilter', viewPanel).on('change', function () {
var query = getQuery();
var filterName = this.getAttribute('data-filter');
var filters = query.Filters || "";
filters = (',' + filters).replace(',' + filterName, '').substring(1);
if (this.checked) {
filters = filters ? (filters + ',' + filterName) : filterName;
}
query.StartIndex = 0;
query.Filters = filters;
reloadItems(tabContent, viewPanel);
});
$('.alphabetPicker', tabContent).on('alphaselect', function (e, character) { $('.alphabetPicker', tabContent).on('alphaselect', function (e, character) {
@ -189,7 +162,7 @@
query.NameStartsWithOrGreater = character; query.NameStartsWithOrGreater = character;
query.StartIndex = 0; query.StartIndex = 0;
reloadItems(tabContent, viewPanel); reloadItems(tabContent);
}).on('alphaclear', function (e) { }).on('alphaclear', function (e) {
@ -197,21 +170,19 @@
query.NameStartsWithOrGreater = ''; query.NameStartsWithOrGreater = '';
reloadItems(tabContent, viewPanel); reloadItems(tabContent);
}); });
} }
window.MusicPage.initAlbumArtistsTab = function (page, tabContent) { window.MusicPage.initAlbumArtistsTab = function (page, tabContent) {
var viewPanel = page.querySelector('.albumArtistsViewPanel'); initPage(tabContent);
initPage(tabContent, viewPanel);
}; };
window.MusicPage.renderAlbumArtistsTab = function (page, tabContent) { window.MusicPage.renderAlbumArtistsTab = function (page, tabContent) {
if (LibraryBrowser.needsRefresh(tabContent)) { if (LibraryBrowser.needsRefresh(tabContent)) {
var viewPanel = page.querySelector('.albumArtistsViewPanel'); reloadItems(tabContent);
reloadItems(tabContent, viewPanel);
} }
}; };

90
dashboard-ui/scripts/musicalbums.js
View file

@ -37,7 +37,7 @@
return LibraryBrowser.getSavedQueryKey('albums'); return LibraryBrowser.getSavedQueryKey('albums');
} }
function reloadItems(page, viewPanel) { function reloadItems(page) {
Dashboard.showLoadingMsg(); Dashboard.showLoadingMsg();
@ -54,20 +54,18 @@
startIndex: query.StartIndex, startIndex: query.StartIndex,
limit: query.Limit, limit: query.Limit,
totalRecordCount: result.TotalRecordCount, totalRecordCount: result.TotalRecordCount,
viewButton: true,
showLimit: false, showLimit: false,
sortButton: true, sortButton: true,
viewPanelClass: 'albumsViewPanel',
addLayoutButton: true, addLayoutButton: true,
currentLayout: view, currentLayout: view,
updatePageSizeSetting: false, updatePageSizeSetting: false,
viewIcon: 'filter-list', layouts: 'List,Poster,PosterCard,Timeline',
layouts: 'List,Poster,PosterCard,Timeline' filterButton: true
}); });
page.querySelector('.listTopPaging').innerHTML = pagingHtml; page.querySelector('.listTopPaging').innerHTML = pagingHtml;
updateFilterControls(page, viewPanel); updateFilterControls(page);
if (view == "Poster") { if (view == "Poster") {
html = LibraryBrowser.getPosterViewHtml({ html = LibraryBrowser.getPosterViewHtml({
@ -120,12 +118,16 @@
$('.btnNextPage', page).on('click', function () { $('.btnNextPage', page).on('click', function () {
query.StartIndex += query.Limit; query.StartIndex += query.Limit;
reloadItems(page, viewPanel); reloadItems(page);
}); });
$('.btnPreviousPage', page).on('click', function () { $('.btnPreviousPage', page).on('click', function () {
query.StartIndex -= query.Limit; query.StartIndex -= query.Limit;
reloadItems(page, viewPanel); reloadItems(page);
});
$('.btnFilter', page).on('click', function () {
showFilterMenu(page);
}); });
$('.btnChangeLayout', page).on('layoutchange', function (e, layout) { $('.btnChangeLayout', page).on('layoutchange', function (e, layout) {
@ -137,7 +139,7 @@
getPageData().view = layout; getPageData().view = layout;
LibraryBrowser.saveViewSetting(getSavedQueryKey(), layout); LibraryBrowser.saveViewSetting(getSavedQueryKey(), layout);
reloadItems(page, viewPanel); reloadItems(page);
}); });
// On callback make sure to set StartIndex = 0 // On callback make sure to set StartIndex = 0
@ -168,7 +170,7 @@
id: 'ProductionYear,PremiereDate,SortName' id: 'ProductionYear,PremiereDate,SortName'
}], }],
callback: function () { callback: function () {
reloadItems(page, viewPanel); reloadItems(page);
}, },
query: query query: query
}); });
@ -180,51 +182,31 @@
}); });
} }
function updateFilterControls(page, viewPanel) { function showFilterMenu(page) {
require(['components/filterdialog/filterdialog'], function (filterDialogFactory) {
var filterDialog = new filterDialogFactory({
query: getQuery(),
mode: 'albums'
});
Events.on(filterDialog, 'filterchange', function () {
reloadItems(page);
});
filterDialog.show();
});
}
function updateFilterControls(page) {
var query = getQuery(); var query = getQuery();
$('.alphabetPicker', page).alphaValue(query.NameStartsWith); $('.alphabetPicker', page).alphaValue(query.NameStartsWith);
} }
function reloadFiltersIfNeeded(page, viewPanel) { function initPage(tabContent) {
if (!getPageData().filtersLoaded) {
getPageData().filtersLoaded = true;
var query = getQuery();
QueryFilters.loadFilters(viewPanel, Dashboard.getCurrentUserId(), query, function () {
reloadItems(page, viewPanel);
});
}
}
function initPage(tabContent, viewPanel) {
$(viewPanel).on('panelopen', function () {
reloadFiltersIfNeeded(tabContent, viewPanel);
});
$('.chkStandardFilter', viewPanel).on('change', function () {
var query = getQuery();
var filterName = this.getAttribute('data-filter');
var filters = query.Filters || "";
filters = (',' + filters).replace(',' + filterName, '').substring(1);
if (this.checked) {
filters = filters ? (filters + ',' + filterName) : filterName;
}
query.StartIndex = 0;
query.Filters = filters;
reloadItems(tabContent, viewPanel);
});
$('.alphabetPicker', tabContent).on('alphaselect', function (e, character) { $('.alphabetPicker', tabContent).on('alphaselect', function (e, character) {
@ -240,7 +222,7 @@
query.StartIndex = 0; query.StartIndex = 0;
reloadItems(tabContent, viewPanel); reloadItems(tabContent);
}).on('alphaclear', function (e) { }).on('alphaclear', function (e) {
@ -249,21 +231,19 @@
query.NameStartsWithOrGreater = ''; query.NameStartsWithOrGreater = '';
query.AlbumArtistStartsWithOrGreater = ''; query.AlbumArtistStartsWithOrGreater = '';
reloadItems(tabContent, viewPanel); reloadItems(tabContent);
}); });
} }
window.MusicPage.initAlbumsTab = function (page, tabContent) { window.MusicPage.initAlbumsTab = function (page, tabContent) {
var viewPanel = page.querySelector('.albumsViewPanel'); initPage(tabContent);
initPage(tabContent, viewPanel);
}; };
window.MusicPage.renderAlbumsTab = function (page, tabContent) { window.MusicPage.renderAlbumsTab = function (page, tabContent) {
if (LibraryBrowser.needsRefresh(tabContent)) { if (LibraryBrowser.needsRefresh(tabContent)) {
var viewPanel = page.querySelector('.albumsViewPanel'); reloadItems(tabContent);
reloadItems(tabContent, viewPanel);
} }
}; };

95
dashboard-ui/scripts/musicartists.js
View file

@ -36,7 +36,7 @@
return LibraryBrowser.getSavedQueryKey('artists'); return LibraryBrowser.getSavedQueryKey('artists');
} }
function reloadItems(page, viewPanel) { function reloadItems(page) {
Dashboard.showLoadingMsg(); Dashboard.showLoadingMsg();
@ -55,17 +55,15 @@
limit: query.Limit, limit: query.Limit,
totalRecordCount: result.TotalRecordCount, totalRecordCount: result.TotalRecordCount,
showLimit: false, showLimit: false,
viewPanelClass: 'artistsViewPanel',
updatePageSizeSetting: false, updatePageSizeSetting: false,
addLayoutButton: true, addLayoutButton: true,
currentLayout: view, currentLayout: view,
viewButton: true, filterButton: true
viewIcon: 'filter-list'
}); });
page.querySelector('.listTopPaging').innerHTML = pagingHtml; page.querySelector('.listTopPaging').innerHTML = pagingHtml;
updateFilterControls(page, viewPanel); updateFilterControls(page);
if (view == "List") { if (view == "List") {
@ -107,18 +105,22 @@
$('.btnNextPage', page).on('click', function () { $('.btnNextPage', page).on('click', function () {
query.StartIndex += query.Limit; query.StartIndex += query.Limit;
reloadItems(page, viewPanel); reloadItems(page);
}); });
$('.btnPreviousPage', page).on('click', function () { $('.btnPreviousPage', page).on('click', function () {
query.StartIndex -= query.Limit; query.StartIndex -= query.Limit;
reloadItems(page, viewPanel); reloadItems(page);
}); });
$('.btnChangeLayout', page).on('layoutchange', function (e, layout) { $('.btnChangeLayout', page).on('layoutchange', function (e, layout) {
getPageData().view = layout; getPageData().view = layout;
LibraryBrowser.saveViewSetting(getSavedQueryKey(), layout); LibraryBrowser.saveViewSetting(getSavedQueryKey(), layout);
reloadItems(page, viewPanel); reloadItems(page);
});
$('.btnFilter', page).on('click', function () {
showFilterMenu(page);
}); });
LibraryBrowser.saveQueryValues(getSavedQueryKey(), query); LibraryBrowser.saveQueryValues(getSavedQueryKey(), query);
@ -127,60 +129,31 @@
}); });
} }
function updateFilterControls(tabContent, viewPanel) { function showFilterMenu(page) {
require(['components/filterdialog/filterdialog'], function (filterDialogFactory) {
var filterDialog = new filterDialogFactory({
query: getQuery(),
mode: 'artists'
});
Events.on(filterDialog, 'filterchange', function () {
reloadItems(page);
});
filterDialog.show();
});
}
function updateFilterControls(tabContent) {
var query = getQuery(); var query = getQuery();
$('.chkStandardFilter', viewPanel).each(function () {
var filters = "," + (query.Filters || "");
var filterName = this.getAttribute('data-filter');
this.checked = filters.indexOf(',' + filterName) != -1;
});
$('.alphabetPicker', tabContent).alphaValue(query.NameStartsWithOrGreater); $('.alphabetPicker', tabContent).alphaValue(query.NameStartsWithOrGreater);
} }
function reloadFiltersIfNeeded(page, viewPanel) { function initPage(tabContent) {
if (!getPageData().filtersLoaded) {
getPageData().filtersLoaded = true;
var query = getQuery();
QueryFilters.loadFilters(viewPanel, Dashboard.getCurrentUserId(), query, function () {
reloadItems(page, viewPanel);
});
}
}
function initPage(tabContent, viewPanel) {
$(viewPanel).on('panelopen', function () {
reloadFiltersIfNeeded(tabContent, viewPanel);
});
$('.chkStandardFilter', viewPanel).on('change', function () {
var query = getQuery();
var filterName = this.getAttribute('data-filter');
var filters = query.Filters || "";
filters = (',' + filters).replace(',' + filterName, '').substring(1);
if (this.checked) {
filters = filters ? (filters + ',' + filterName) : filterName;
}
query.StartIndex = 0;
query.Filters = filters;
reloadItems(tabContent, viewPanel);
});
$('.alphabetPicker', tabContent).on('alphaselect', function (e, character) { $('.alphabetPicker', tabContent).on('alphaselect', function (e, character) {
@ -189,7 +162,7 @@
query.NameStartsWithOrGreater = character; query.NameStartsWithOrGreater = character;
query.StartIndex = 0; query.StartIndex = 0;
reloadItems(tabContent, viewPanel); reloadItems(tabContent);
}).on('alphaclear', function (e) { }).on('alphaclear', function (e) {
@ -197,21 +170,19 @@
query.NameStartsWithOrGreater = ''; query.NameStartsWithOrGreater = '';
reloadItems(tabContent, viewPanel); reloadItems(tabContent);
}); });
} }
window.MusicPage.initArtistsTab = function (page, tabContent) { window.MusicPage.initArtistsTab = function (page, tabContent) {
var viewPanel = page.querySelector('.artistsViewPanel'); initPage(tabContent);
initPage(tabContent, viewPanel);
}; };
window.MusicPage.renderArtistsTab = function (page, tabContent) { window.MusicPage.renderArtistsTab = function (page, tabContent) {
if (LibraryBrowser.needsRefresh(tabContent)) { if (LibraryBrowser.needsRefresh(tabContent)) {
var viewPanel = page.querySelector('.artistsViewPanel'); reloadItems(tabContent);
reloadItems(tabContent, viewPanel);
} }
}; };

5
dashboard-ui/scripts/musicrecommended.js
View file

@ -233,25 +233,20 @@
depends.push('scripts/musicalbums'); depends.push('scripts/musicalbums');
renderMethod = 'renderAlbumsTab'; renderMethod = 'renderAlbumsTab';
initMethod = 'initAlbumsTab'; initMethod = 'initAlbumsTab';
depends.push('scripts/queryfilters');
break; break;
case 2: case 2:
depends.push('scripts/musicalbumartists'); depends.push('scripts/musicalbumartists');
renderMethod = 'renderAlbumArtistsTab'; renderMethod = 'renderAlbumArtistsTab';
initMethod = 'initAlbumArtistsTab'; initMethod = 'initAlbumArtistsTab';
depends.push('scripts/queryfilters');
break; break;
case 3: case 3:
depends.push('scripts/musicartists'); depends.push('scripts/musicartists');
renderMethod = 'renderArtistsTab'; renderMethod = 'renderArtistsTab';
initMethod = 'initArtistsTab'; initMethod = 'initArtistsTab';
depends.push('scripts/queryfilters');
break; break;
case 4: case 4:
depends.push('scripts/songs'); depends.push('scripts/songs');
renderMethod = 'renderSongsTab'; renderMethod = 'renderSongsTab';
initMethod = 'initSongsTab';
depends.push('scripts/queryfilters');
depends.push('paper-icon-item'); depends.push('paper-icon-item');
depends.push('paper-item-body'); depends.push('paper-item-body');
break; break;

162
dashboard-ui/scripts/queryfilters.js
View file

@ -1,162 +0,0 @@
(function (window) {
function renderOptions(page, selector, cssClass, items) {
var elem;
if (items.length) {
elem = $(selector, page).show()[0];
} else {
elem = $(selector, page).hide()[0];
}
var html = '';
// style="margin: -.2em -.8em;"
html += '<div>';
var index = 0;
var idPrefix = 'chk' + selector.substring(1);
html += items.map(function (filter) {
var itemHtml = '';
var id = idPrefix + index;
itemHtml += '<div class="checkboxContainer">';
itemHtml += '<input id="' + id + '" type="checkbox" data-filter="' + filter + '" data-role="none" class="' + cssClass + '" />';
itemHtml += '<label for="' + id + '">' + filter + '</label>';
itemHtml += '</div>';
//itemHtml += '<paper-checkbox id="' + id + '" data-filter="' + filter + '" class="' + cssClass + '">' + filter + '</paper-checkbox>';
index++;
return itemHtml;
}).join('');
html += '</div>';
elem.querySelector('.filterOptions').innerHTML = html;
}
function renderFilters(page, result) {
// If there's a huge number of these they will be really show to render
if (result.Tags) {
result.Tags.length = Math.min(result.Tags.length, 50);
}
renderOptions(page, '.genreFilters', 'chkGenreFilter', result.Genres);
renderOptions(page, '.officialRatingFilters', 'chkOfficialRatingFilter', result.OfficialRatings);
renderOptions(page, '.tagFilters', 'chkTagFilter', result.Tags);
renderOptions(page, '.yearFilters', 'chkYearFilter', result.Years);
}
function onFiltersLoaded(page, query, reloadItemsFn) {
$('.chkGenreFilter', page).on('change', function () {
var filterName = this.getAttribute('data-filter');
var filters = query.Genres || "";
var delimiter = '|';
filters = (delimiter + filters).replace(delimiter + filterName, '').substring(1);
if (this.checked) {
filters = filters ? (filters + delimiter + filterName) : filterName;
}
query.StartIndex = 0;
query.Genres = filters;
reloadItemsFn();
});
$('.chkTagFilter', page).on('change', function () {
var filterName = this.getAttribute('data-filter');
var filters = query.Tags || "";
var delimiter = '|';
filters = (delimiter + filters).replace(delimiter + filterName, '').substring(1);
if (this.checked) {
filters = filters ? (filters + delimiter + filterName) : filterName;
}
query.StartIndex = 0;
query.Tags = filters;
reloadItemsFn();
});
$('.chkYearFilter', page).on('change', function () {
var filterName = this.getAttribute('data-filter');
var filters = query.Years || "";
var delimiter = ',';
filters = (delimiter + filters).replace(delimiter + filterName, '').substring(1);
if (this.checked) {
filters = filters ? (filters + delimiter + filterName) : filterName;
}
query.StartIndex = 0;
query.Years = filters;
reloadItemsFn();
});
$('.chkOfficialRatingFilter', page).on('change', function () {
var filterName = this.getAttribute('data-filter');
var filters = query.OfficialRatings || "";
var delimiter = '|';
filters = (delimiter + filters).replace(delimiter + filterName, '').substring(1);
if (this.checked) {
filters = filters ? (filters + delimiter + filterName) : filterName;
}
query.StartIndex = 0;
query.OfficialRatings = filters;
reloadItemsFn();
});
}
function loadFilters(page, userId, itemQuery, reloadItemsFn) {
return ApiClient.getJSON(ApiClient.getUrl('Items/Filters', {
UserId: userId,
ParentId: itemQuery.ParentId,
IncludeItemTypes: itemQuery.IncludeItemTypes
})).then(function (result) {
renderFilters(page, result);
onFiltersLoaded(page, itemQuery, reloadItemsFn);
});
}
function onPageShow(page, query) {
query.Genres = null;
query.Years = null;
query.OfficialRatings = null;
query.Tags = null;
}
window.QueryFilters = {
loadFilters: loadFilters,
onPageShow: onPageShow
};
})(window);

66
dashboard-ui/scripts/songs.js
View file

@ -38,7 +38,7 @@
return LibraryBrowser.getSavedQueryKey('songs'); return LibraryBrowser.getSavedQueryKey('songs');
} }
function reloadItems(page, viewPanel) { function reloadItems(page) {
Dashboard.showLoadingMsg(); Dashboard.showLoadingMsg();
@ -53,12 +53,10 @@
startIndex: query.StartIndex, startIndex: query.StartIndex,
limit: query.Limit, limit: query.Limit,
totalRecordCount: result.TotalRecordCount, totalRecordCount: result.TotalRecordCount,
viewButton: true,
showLimit: false, showLimit: false,
sortButton: true, sortButton: true,
viewPanelClass: 'songsViewPanel',
updatePageSizeSetting: false, updatePageSizeSetting: false,
viewIcon: 'filter-list' filterButton: true
}); });
page.querySelector('.listTopPaging').innerHTML = pagingHtml; page.querySelector('.listTopPaging').innerHTML = pagingHtml;
@ -76,12 +74,16 @@
$('.btnNextPage', page).on('click', function () { $('.btnNextPage', page).on('click', function () {
query.StartIndex += query.Limit; query.StartIndex += query.Limit;
reloadItems(page, viewPanel); reloadItems(page);
}); });
$('.btnPreviousPage', page).on('click', function () { $('.btnPreviousPage', page).on('click', function () {
query.StartIndex -= query.Limit; query.StartIndex -= query.Limit;
reloadItems(page, viewPanel); reloadItems(page);
});
$('.btnFilter', page).on('click', function () {
showFilterMenu(page);
}); });
// On callback make sure to set StartIndex = 0 // On callback make sure to set StartIndex = 0
@ -124,7 +126,7 @@
id: 'Runtime,AlbumArtist,Album,SortName' id: 'Runtime,AlbumArtist,Album,SortName'
}], }],
callback: function () { callback: function () {
reloadItems(page, viewPanel); reloadItems(page);
}, },
query: query query: query
}); });
@ -136,57 +138,27 @@
}); });
} }
function reloadFiltersIfNeeded(page, viewPanel) { function showFilterMenu(page) {
if (!getPageData().filtersLoaded) { require(['components/filterdialog/filterdialog'], function (filterDialogFactory) {
getPageData().filtersLoaded = true; var filterDialog = new filterDialogFactory({
query: getQuery(),
var query = getQuery(); mode: 'songs'
QueryFilters.loadFilters(viewPanel, Dashboard.getCurrentUserId(), query, function () {
reloadItems(page, viewPanel);
}); });
}
}
function initPage(tabContent, viewPanel) { Events.on(filterDialog, 'filterchange', function () {
reloadItems(page);
});
$(viewPanel).on('panelopen', function () { filterDialog.show();
reloadFiltersIfNeeded(tabContent, viewPanel);
});
$('.chkStandardFilter', viewPanel).on('change', function () {
var query = getQuery();
var filterName = this.getAttribute('data-filter');
var filters = query.Filters || "";
filters = (',' + filters).replace(',' + filterName, '').substring(1);
if (this.checked) {
filters = filters ? (filters + ',' + filterName) : filterName;
}
query.StartIndex = 0;
query.Filters = filters;
reloadItems(tabContent, viewPanel);
}); });
} }
window.MusicPage.initSongsTab = function (page, tabContent) {
var viewPanel = page.querySelector('.songsViewPanel');
initPage(tabContent, viewPanel);
};
window.MusicPage.renderSongsTab = function (page, tabContent) { window.MusicPage.renderSongsTab = function (page, tabContent) {
if (LibraryBrowser.needsRefresh(tabContent)) { if (LibraryBrowser.needsRefresh(tabContent)) {
var viewPanel = page.querySelector('.songsViewPanel'); reloadItems(tabContent);
reloadItems(tabContent, viewPanel);
} }
}; };