fixes #943 - Add web client filtering by genres, parental ratings, tags and years

This commit is contained in:
Luke Pulverenti 2014-11-09 23:20:11 -05:00
parent 31c16972b0
commit a1535a341b
30 changed files with 592 additions and 394 deletions

View File

@ -91,7 +91,7 @@
.visualCardBox-b {
border-radius: 3px;
background: #111;
background: rgb(51, 51, 51);
}
.cardScalable {
@ -130,18 +130,6 @@
right: 0;
}
/*.cardContent:hover {
-moz-box-shadow: 0 0 0 5px #38c;
-webkit-box-shadow: 0 0 0 5px #38c;
box-shadow: 0 0 0 5px #38c;
}*/
.alternateHover:hover .cardContent {
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
}
.cardContent:hover .cardImage {
opacity: .5;
}

View File

@ -85,14 +85,6 @@
top: 8px;
}
.viewPanel {
width: 250px;
}
.viewPanelModelOpen {
right: 250px !important;
}
.viewPanelTabs {
margin-bottom: 2em;
}
@ -977,7 +969,7 @@ a.itemTag:hover {
}
.itemSelectionPanel .ui-checkbox {
max-width: 90px;
max-width: 130px;
margin-left: auto;
margin-right: auto;
}
@ -1039,24 +1031,6 @@ a.itemTag:hover {
}
}
.playerSelectionPanel {
width: 250px;
}
.playerSelectionPanel + .ui-panel-dismiss {
right: 250px;
}
@media all and (min-width: 600px) {
.playerSelectionPanel {
width: 300px;
}
.playerSelectionPanel + .ui-panel-dismiss {
right: 300px;
}
}
.spotlight {
position: absolute;
left: 0;

View File

@ -1,12 +1,4 @@
.notificationsFlyout {
width: 250px;
}
.notificationsPanelModelOpen {
right: 250px !important;
}
.btnNotifications {
.btnNotifications {
text-decoration: none !important;
}

View File

@ -1,12 +1,4 @@
.searchPanel {
width: 250px;
}
.searchPanelModelOpen {
right: 250px!important;
}
.searchHints {
.searchHints {
margin-top: 1em;
}

View File

@ -135,11 +135,24 @@ h1 a:hover {
-ms-overflow-style: none;
overflow: -moz-scrollbars-none;
}
.ui-panel-inner::-webkit-scrollbar {
width: 0 !important;
display: none;
}
.largePanel {
width: 250px;
}
/* Make panels larger */
.largePanelModalOpen.ui-panel-dismiss-position-right {
right: 250px !important;
}
.largePanelModalOpen.ui-panel-dismiss-position-left {
left: 250px !important;
}
pre, textarea.pre {
display: block;

View File

@ -127,22 +127,35 @@
<input class="radioPlayers" type="radio" name="radioPlayers" id="radioFour" value="off" data-value="4" data-mini="true">
<label for="radioFour">${Option4Player}</label>
</fieldset>
<br />
<fieldset data-role="controlgroup">
<legend>
${LabelFeatures}
</legend>
<div data-role="collapsible" data-collapsed="true" data-mini="true" class="genreFilters">
<h2>${HeaderGenres}</h2>
<input class="chkFeatureFilter" type="checkbox" name="chkTrailer" id="chkTrailer" data-mini="true">
<label for="chkTrailer">${OptionHasTrailer}</label>
<div class="filterOptions">
</div>
</div>
<input class="chkFeatureFilter" type="checkbox" name="chkThemeSong" id="chkThemeSong" data-mini="true">
<label for="chkThemeSong">${OptionHasThemeSong}</label>
<div data-role="collapsible" data-collapsed="true" data-mini="true" class="officialRatingFilters">
<h2>${HeaderParentalRatings}</h2>
<input class="chkFeatureFilter" type="checkbox" name="chkThemeVideo" id="chkThemeVideo" data-mini="true">
<label for="chkThemeVideo">${OptionHasThemeVideo}</label>
<div class="filterOptions">
</div>
</div>
</fieldset>
<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>
</div>
</form>
</div>

View File

@ -86,29 +86,7 @@
<input class="chkStandardFilter" type="checkbox" name="chkDislikes" id="chkDislikes" data-filter="Dislikes" data-mini="true">
<label for="chkDislikes">${OptionDislikes}</label>
</fieldset>
<fieldset data-role="controlgroup">
<legend>
${LabelVideoType}
</legend>
<input class="chkVideoTypeFilter" type="checkbox" name="chkBluray" id="chkBluray" data-filter="Bluray" data-mini="true">
<label for="chkBluray">${OptionBluray}</label>
<input class="chkVideoTypeFilter" type="checkbox" name="chkDvd" id="chkDvd" data-filter="Dvd" data-mini="true">
<label for="chkDvd">${OptionDvd}</label>
<input class="chkVideoTypeFilter" type="checkbox" name="chkIso" id="chkIso" data-filter="Iso" data-mini="true">
<label for="chkIso">${OptionIso}</label>
<input class="chkHDFilter" type="checkbox" name="chkHD" id="chkHD" data-filter="IsHD" data-mini="true">
<label for="chkHD">${OptionIsHD}</label>
<input class="chkSDFilter" type="checkbox" name="chkSD" id="chkSD" data-filter="IsHD" data-mini="true">
<label for="chkSD">${OptionIsSD}</label>
<input class="chk3DFilter" type="checkbox" name="chk3D" id="chk3D" data-filter="Digital3D,Sbs3D" data-mini="true">
<label for="chk3D">${Option3D}</label>
</fieldset>
<br />
<div data-role="collapsible" data-collapsed="true" data-mini="true">
<h2>${HeaderFeatures}</h2>
@ -132,21 +110,56 @@
</div>
</div>
<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">
<h2>${HeaderManagement}</h2>
<h2>${HeaderVideoTypes}</h2>
<div data-role="controlgroup">
<input class="chkMissingImdbId" type="checkbox" name="chkMissingImdbId" id="chkMissingImdbId" data-mini="true">
<label for="chkMissingImdbId">${OptionMissingImdbId}</label>
<input class="chkMissingTmdbId" type="checkbox" name="chkMissingTmdbId" id="chkMissingTmdbId" data-mini="true">
<label for="chkMissingTmdbId">${OptionMissingTmdbId}</label>
<input class="chkVideoTypeFilter" type="checkbox" name="chkBluray" id="chkBluray" data-filter="Bluray" data-mini="true">
<label for="chkBluray">${OptionBluray}</label>
<input class="chkMissingOverview" type="checkbox" name="chkMissingOverview" id="chkMissingOverview" data-mini="true">
<label for="chkMissingOverview">${OptionMissingOverview}</label>
<input class="chkVideoTypeFilter" type="checkbox" name="chkDvd" id="chkDvd" data-filter="Dvd" data-mini="true">
<label for="chkDvd">${OptionDvd}</label>
<input class="chkYearMismatch" type="checkbox" name="chkYearMismatch" id="chkYearMismatch" data-mini="true">
<label for="chkYearMismatch">${OptionFileMetadataYearMismatch}</label>
<input class="chkVideoTypeFilter" type="checkbox" name="chkIso" id="chkIso" data-filter="Iso" data-mini="true">
<label for="chkIso">${OptionIso}</label>
<input class="chkHDFilter" type="checkbox" name="chkHD" id="chkHD" data-filter="IsHD" data-mini="true">
<label for="chkHD">${OptionIsHD}</label>
<input class="chkSDFilter" type="checkbox" name="chkSD" id="chkSD" data-filter="IsHD" data-mini="true">
<label for="chkSD">${OptionIsSD}</label>
<input class="chk3DFilter" type="checkbox" name="chk3D" id="chk3D" data-filter="Digital3D,Sbs3D" data-mini="true">
<label for="chk3D">${Option3D}</label>
</div>
</div>
<div data-role="collapsible" data-collapsed="true" data-mini="true" class="yearFilters">
<h2>${HeaderYears}</h2>
<div class="filterOptions">
</div>
</div>

View File

@ -66,6 +66,14 @@
<input class="chkStandardFilter" type="checkbox" name="chkDislikes" id="chkDislikes" data-filter="Dislikes" data-mini="true">
<label for="chkDislikes">${OptionDislikes}</label>
</fieldset>
<br />
<div data-role="collapsible" data-collapsed="true" data-mini="true" class="genreFilters">
<h2>${HeaderGenres}</h2>
<div class="filterOptions">
</div>
</div>
</div>
</form>

View File

@ -67,6 +67,35 @@
<input class="chkStandardFilter" type="checkbox" name="chkDislikes" id="chkDislikes" data-filter="Dislikes" data-mini="true">
<label for="chkDislikes">${OptionDislikes}</label>
</fieldset>
<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>
</div>
<div class="tabSort viewTab">

View File

@ -65,6 +65,14 @@
<input class="chkStandardFilter" type="checkbox" name="chkDislikes" id="chkDislikes" data-filter="Dislikes" data-mini="true">
<label for="chkDislikes">${OptionDislikes}</label>
</fieldset>
<br />
<div data-role="collapsible" data-collapsed="true" data-mini="true" class="genreFilters">
<h2>${HeaderGenres}</h2>
<div class="filterOptions">
</div>
</div>
</div>
</form>

View File

@ -66,42 +66,35 @@
<input class="chkStandardFilter" type="checkbox" name="chkDislikes" id="chkDislikes" data-filter="Dislikes" data-mini="true">
<label for="chkDislikes">${OptionDislikes}</label>
</fieldset>
<fieldset data-role="controlgroup">
<legend>
${LabelVideoType}
</legend>
<br />
<input class="chkVideoTypeFilter" type="checkbox" name="chkBluray" id="chkBluray" data-filter="Bluray" data-mini="true">
<label for="chkBluray">${OptionBluray}</label>
<div data-role="collapsible" data-collapsed="true" data-mini="true" class="genreFilters">
<h2>${HeaderGenres}</h2>
<input class="chkVideoTypeFilter" type="checkbox" name="chkDvd" id="chkDvd" data-filter="Dvd" data-mini="true">
<label for="chkDvd">${OptionDvd}</label>
<div class="filterOptions">
</div>
</div>
<input class="chkVideoTypeFilter" type="checkbox" name="chkIso" id="chkIso" data-filter="Iso" data-mini="true">
<label for="chkIso">${OptionIso}</label>
<div data-role="collapsible" data-collapsed="true" data-mini="true" class="officialRatingFilters">
<h2>${HeaderParentalRatings}</h2>
<input class="chk3DFilter" type="checkbox" name="chk3D" id="chk3D" data-filter="Digital3D,Sbs3D" data-mini="true">
<label for="chk3D">${Option3D}</label>
</fieldset>
<div class="filterOptions">
</div>
</div>
<fieldset data-role="controlgroup">
<legend>
${LabelFeatures}
</legend>
<div data-role="collapsible" data-collapsed="true" data-mini="true" class="tagFilters">
<h2>${HeaderTags}</h2>
<input class="chkFeatureFilter" type="checkbox" name="chkSubtitle" id="chkSubtitle" data-mini="true">
<label for="chkSubtitle">${OptionHasSubtitles}</label>
<div class="filterOptions">
</div>
</div>
<input class="chkFeatureFilter" type="checkbox" name="chkTrailer" id="chkTrailer" data-mini="true">
<label for="chkTrailer">${OptionHasTrailer}</label>
<div data-role="collapsible" data-collapsed="true" data-mini="true" class="yearFilters">
<h2>${HeaderYears}</h2>
<input class="chkFeatureFilter" type="checkbox" name="chkThemeSong" id="chkThemeSong" data-mini="true">
<label for="chkThemeSong">${OptionHasThemeSong}</label>
<input class="chkFeatureFilter" type="checkbox" name="chkThemeVideo" id="chkThemeVideo" data-mini="true">
<label for="chkThemeVideo">${OptionHasThemeVideo}</label>
</fieldset>
<div class="filterOptions">
</div>
</div>
</div>
<div class="tabSort viewTab">

View File

@ -121,18 +121,33 @@
$('#selectView', page).val(view).selectmenu('refresh');
$('#chkTrailer', page).checked(query.HasTrailer == true).checkboxradio('refresh');
$('#chkThemeSong', page).checked(query.HasThemeSong == true).checkboxradio('refresh');
$('#chkThemeVideo', page).checked(query.HasThemeVideo == true).checkboxradio('refresh');
$('.alphabetPicker', page).alphaValue(query.NameStartsWith);
$('#selectPageSize', page).val(query.Limit).selectmenu('refresh');
}
var filtersLoaded;
function reloadFiltersIfNeeded(page) {
if (!filtersLoaded) {
filtersLoaded = true;
QueryFilters.loadFilters(page, Dashboard.getCurrentUserId(), query, function () {
reloadItems(page);
});
}
}
$(document).on('pageinit', "#gamesPage", function () {
var page = this;
$('.viewPanel', page).on('panelopen', function () {
reloadFiltersIfNeeded(page);
});
$('.radioSortBy', this).on('click', function () {
query.StartIndex = 0;
query.SortBy = this.getAttribute('data-sortby');
@ -173,30 +188,6 @@
reloadItems(page);
});
$('#chkTrailer', this).on('change', function () {
query.StartIndex = 0;
query.HasTrailer = this.checked ? true : null;
reloadItems(page);
});
$('#chkThemeSong', this).on('change', function () {
query.StartIndex = 0;
query.HasThemeSong = this.checked ? true : null;
reloadItems(page);
});
$('#chkThemeVideo', this).on('change', function () {
query.StartIndex = 0;
query.HasThemeVideo = this.checked ? true : null;
reloadItems(page);
});
$('.alphabetPicker', this).on('alphaselect', function (e, character) {
query.NameStartsWithOrGreater = character;
@ -251,6 +242,7 @@
var viewkey = getSavedQueryKey();
LibraryBrowser.loadSavedQueryValues(viewkey, query);
QueryFilters.onPageShow(page, query);
LibraryBrowser.getSavedViewSetting(viewkey).done(function (val) {

View File

@ -1241,7 +1241,12 @@
dataSrc = ' data-src="' + imgUrl + '"';
}
html += '<div class="cardBox">';
var cardboxCssClass = 'cardBox';
if (options.cardLayout) {
cardboxCssClass += ' visualCardBox visualCardBox-b';
}
html += '<div class="' + cardboxCssClass + '">';
html += '<div class="cardScalable">';
html += '<div class="cardPadder"></div>';
@ -1267,13 +1272,6 @@
html += '<div class="unidentifiedIndicator"><div class="ui-icon-alert ui-btn-icon-notext"></div></div>';
}
if (options.selectionPanel) {
var chkItemSelectId = 'chkItemSelect' + i;
// Render this pre-enhanced to save on jquery mobile dom manipulation
html += '<div class="itemSelectionPanel" onclick="return false;" style="display:none;"><div class="ui-checkbox ui-mini"><label class="ui-btn ui-corner-all ui-btn-inherit ui-btn-icon-left ui-checkbox-off" for="' + chkItemSelectId + '">Select</label><input id="' + chkItemSelectId + '" type="checkbox" class="chkItemSelect" data-enhanced="true" /></div></div>';
}
var progressHtml = options.showProgress === false || item.IsFolder ? '' : LibraryBrowser.getItemProgressBarHtml((item.Type == 'Recording' ? item : item.UserData));
var footerOverlayed = false;

View File

@ -646,7 +646,20 @@
selectionCommands.show();
$('.itemSelectionPanel', page).show();
var panels = $('.itemSelectionPanel', page).show();
if (!panels.length) {
var index = 0;
$('.cardContent', page).each(function () {
var chkItemSelectId = 'chkItemSelect' + index;
$(this).append('<div class="itemSelectionPanel" onclick="return false;"><div class="ui-checkbox"><label class="ui-btn ui-corner-all ui-btn-inherit ui-btn-icon-left ui-checkbox-off" for="' + chkItemSelectId + '">Select</label><input id="' + chkItemSelectId + '" type="checkbox" class="chkItemSelect" data-enhanced="true" /></div></div>');
index++;
});
$('.itemsContainer', page).trigger('create');
}
$('.chkItemSelect:checked', page).checked(false).checkboxradio('refresh');
}
@ -815,7 +828,7 @@
$('.' + this.getAttribute('data-tab'), page).show();
});
var viewPanel = $('.viewPanel', page).panel('option', 'classes.modalOpen', 'viewPanelModelOpen ui-panel-dismiss-open');
var viewPanel = $('.viewPanel', page);
$('#selectPageSize', viewPanel).html(LibraryBrowser.getDefaultPageSizeSelections().map(function (i) {

View File

@ -8,7 +8,7 @@
userId: Dashboard.getCurrentUserId(),
IsAiring: true,
limit: 10
limit: 18
}).done(function (result) {
@ -31,7 +31,7 @@
userId: Dashboard.getCurrentUserId(),
IsAiring: false,
HasAired: false,
limit: 10
limit: 18
}).done(function (result) {

View File

@ -498,7 +498,7 @@
var promise = MediaController.getTargets();
var html = '<div data-role="panel" data-position="right" data-display="overlay" data-position-fixed="true" id="playerSelectionPanel" class="playerSelectionPanel" data-theme="a">';
var html = '<div data-role="panel" data-position="right" data-display="overlay" data-position-fixed="true" id="playerSelectionPanel" data-theme="a">';
html += '<div class="players"></div>';

View File

@ -22,7 +22,9 @@
Dashboard.showLoadingMsg();
ApiClient.getItems(Dashboard.getCurrentUserId(), query).done(function (result) {
var userId = Dashboard.getCurrentUserId();
ApiClient.getItems(userId, query).done(function (result) {
// Scroll back up so they can see the results from the beginning
$(document).scrollTop(0);
@ -50,7 +52,8 @@
context: 'movies',
selectionPanel: true,
lazy: true,
overlayText: true
overlayText: true,
showTitle: false
});
$('.itemsContainer', page).removeClass('timelineItemsContainer');
}
@ -166,18 +169,33 @@
$('#chkThemeSong', page).checked(query.HasThemeSong == true).checkboxradio('refresh');
$('#chkThemeVideo', page).checked(query.HasThemeVideo == true).checkboxradio('refresh');
$('#chkMissingImdbId', page).checked(query.HasImdbId == false).checkboxradio('refresh');
$('#chkMissingTmdbId', page).checked(query.HasTmdbId == false).checkboxradio('refresh');
$('#chkYearMismatch', page).checked(query.IsYearMismatched == true).checkboxradio('refresh');
$('.alphabetPicker', page).alphaValue(query.NameStartsWithOrGreater);
$('#selectPageSize', page).val(query.Limit).selectmenu('refresh');
}
var filtersLoaded;
function reloadFiltersIfNeeded(page) {
if (!filtersLoaded) {
filtersLoaded = true;
QueryFilters.loadFilters(page, Dashboard.getCurrentUserId(), query, function () {
reloadItems(page);
});
}
}
$(document).on('pageinit', "#moviesPage", function () {
var page = this;
$('.viewPanel', page).on('panelopen', function () {
reloadFiltersIfNeeded(page);
});
$('.radioSortBy', this).on('click', function () {
query.StartIndex = 0;
query.SortBy = this.getAttribute('data-sortby');
@ -340,31 +358,7 @@
}
});
$('#chkMissingImdbId', this).on('change', function () {
query.StartIndex = 0;
query.HasImdbId = this.checked ? false : null;
reloadItems(page);
});
$('#chkMissingTmdbId', this).on('change', function () {
query.StartIndex = 0;
query.HasTmdbId = this.checked ? false : null;
reloadItems(page);
});
$('#chkYearMismatch', this).on('change', function () {
query.StartIndex = 0;
query.IsYearMismatched = this.checked ? true : null;
reloadItems(page);
});
$('.itemsContainer', page).on('needsrefresh', function() {
$('.itemsContainer', page).on('needsrefresh', function () {
reloadItems(page);
@ -393,6 +387,8 @@
LibraryBrowser.loadSavedQueryValues(viewkey, query);
QueryFilters.onPageShow(page, query);
LibraryBrowser.getSavedViewSetting(viewkey).done(function (val) {
if (val) {
@ -404,7 +400,170 @@
}).on('pageshow', "#moviesPage", function () {
updateFilterControls(this);
var page = this;
updateFilterControls(page);
filtersLoaded = false;
});
})(jQuery, document);
})(jQuery, document);
(function (window) {
function renderOptions(page, selector, cssClass, items) {
var elem;
if (items.length) {
elem = $(selector, page).show();
} else {
elem = $(selector, page).hide();
}
var html = '';
// style="margin: -.2em -.8em;"
html += '<div data-role="controlgroup">';
var index = 0;
var idPrefix = 'chk' + selector.substring(1);
html += items.map(function (filter) {
var itemHtml = '';
var id = idPrefix + index;
itemHtml += '<label for="' + id + '">' + filter + '</label>';
itemHtml += '<input id="' + id + '" type="checkbox" data-filter="' + filter + '" data-mini="true" class="' + cssClass + '" />';
index++;
return itemHtml;
}).join('');
html += '</div>';
$('.filterOptions', elem).html(html).trigger('create');
}
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
})).done(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);

View File

@ -49,61 +49,17 @@
updateFilterControls(page);
if (view == "Thumb") {
html = LibraryBrowser.getPosterViewHtml({
items: result.Items,
shape: "backdrop",
preferThumb: true,
context: 'movies-trailers',
lazy: true,
overlayText: true
});
$('.itemsContainer', page).removeClass('timelineItemsContainer');
}
else if (view == "Banner") {
html = LibraryBrowser.getPosterViewHtml({
items: result.Items,
shape: "portrait",
context: 'movies-trailers',
showTitle: false,
centerText: true,
lazy: true,
overlayText: false
});
html = LibraryBrowser.getPosterViewHtml({
items: result.Items,
shape: "banner",
preferBanner: true,
context: 'movies-trailers',
lazy: true
});
$('.itemsContainer', page).removeClass('timelineItemsContainer');
}
else if (view == "List") {
html = LibraryBrowser.getListViewHtml({
items: result.Items,
context: 'movies-trailers',
sortBy: query.SortBy
});
$('.itemsContainer', page).removeClass('timelineItemsContainer');
}
else if (view == "Poster") {
html = LibraryBrowser.getPosterViewHtml({
items: result.Items,
shape: "portrait",
context: 'movies-trailers',
showTitle: false,
centerText: true,
lazy: true,
overlayText: true
});
$('.itemsContainer', page).removeClass('timelineItemsContainer');
}
else if (view == "Timeline") {
html = LibraryBrowser.getPosterViewHtml({
items: result.Items,
shape: "portrait",
context: 'movies-trailers',
showTitle: true,
timeline: true,
centerText: true,
lazy: true
});
$('.itemsContainer', page).addClass('timelineItemsContainer');
}
$('.itemsContainer', page).removeClass('timelineItemsContainer');
html += pagingHtml;

View File

@ -102,10 +102,29 @@
$('#selectPageSize', page).val(query.Limit).selectmenu('refresh');
}
var filtersLoaded;
function reloadFiltersIfNeeded(page) {
if (!filtersLoaded) {
filtersLoaded = true;
QueryFilters.loadFilters(page, Dashboard.getCurrentUserId(), query, function () {
reloadItems(page);
});
}
}
$(document).on('pageinit', "#musicAlbumArtistsPage", function () {
var page = this;
$('.viewPanel', page).on('panelopen', function () {
reloadFiltersIfNeeded(page);
});
$('.chkStandardFilter', this).on('change', function () {
var filterName = this.getAttribute('data-filter');
@ -168,6 +187,7 @@
var viewkey = getSavedQueryKey();
LibraryBrowser.loadSavedQueryValues(viewkey, query);
QueryFilters.onPageShow(page, query);
LibraryBrowser.getSavedViewSetting(viewkey).done(function (val) {

View File

@ -118,10 +118,29 @@
$('#selectPageSize', page).val(query.Limit).selectmenu('refresh');
}
var filtersLoaded;
function reloadFiltersIfNeeded(page) {
if (!filtersLoaded) {
filtersLoaded = true;
QueryFilters.loadFilters(page, Dashboard.getCurrentUserId(), query, function () {
reloadItems(page);
});
}
}
$(document).on('pageinit', "#musicAlbumsPage", function () {
var page = this;
$('.viewPanel', page).on('panelopen', function () {
reloadFiltersIfNeeded(page);
});
$('.radioSortBy', page).on('click', function () {
query.SortBy = this.getAttribute('data-sortby');
query.StartIndex = 0;
@ -223,6 +242,7 @@
var viewKey = getSavedQueryKey();
LibraryBrowser.loadSavedQueryValues(viewKey, query);
QueryFilters.onPageShow(page, query);
LibraryBrowser.getSavedViewSetting(viewKey).done(function (val) {

View File

@ -102,10 +102,29 @@
$('#selectPageSize', page).val(query.Limit).selectmenu('refresh');
}
var filtersLoaded;
function reloadFiltersIfNeeded(page) {
if (!filtersLoaded) {
filtersLoaded = true;
QueryFilters.loadFilters(page, Dashboard.getCurrentUserId(), query, function () {
reloadItems(page);
});
}
}
$(document).on('pageinit', "#musicArtistsPage", function () {
var page = this;
$('.viewPanel', page).on('panelopen', function () {
reloadFiltersIfNeeded(page);
});
$('.chkStandardFilter', this).on('change', function () {
var filterName = this.getAttribute('data-filter');
@ -169,6 +188,7 @@
var viewkey = getSavedQueryKey();
LibraryBrowser.loadSavedQueryValues(viewkey, query);
QueryFilters.onPageShow(page, query);
LibraryBrowser.getSavedViewSetting(viewkey).done(function (val) {

View File

@ -38,7 +38,7 @@
$('.listTopPaging', page).html(pagingHtml).trigger('create');
updateFilterControls(page);
html = LibraryBrowser.getPosterViewHtml({
items: result.Items,
shape: "square",
@ -62,7 +62,7 @@
});
LibraryBrowser.saveQueryValues(getSavedQueryKey(), query);
Dashboard.hideLoadingMsg();
});
}
@ -91,30 +91,33 @@
}).checkboxradio('refresh');
$('.chkVideoTypeFilter', page).each(function () {
var filters = "," + (query.VideoTypes || "");
var filterName = this.getAttribute('data-filter');
this.checked = filters.indexOf(',' + filterName) != -1;
}).checkboxradio('refresh');
$('#chk3D', page).checked(query.Is3D == true).checkboxradio('refresh');
$('#chkSubtitle', page).checked(query.HasSubtitles == true).checkboxradio('refresh');
$('#chkTrailer', page).checked(query.HasTrailer == true).checkboxradio('refresh');
$('#chkThemeSong', page).checked(query.HasThemeSong == true).checkboxradio('refresh');
$('#chkThemeVideo', page).checked(query.HasThemeVideo == true).checkboxradio('refresh');
$('.alphabetPicker', page).alphaValue(query.NameStartsWithOrGreater);
$('#selectPageSize', page).val(query.Limit).selectmenu('refresh');
}
var filtersLoaded;
function reloadFiltersIfNeeded(page) {
if (!filtersLoaded) {
filtersLoaded = true;
QueryFilters.loadFilters(page, Dashboard.getCurrentUserId(), query, function () {
reloadItems(page);
});
}
}
$(document).on('pageinit', "#musicVideosPage", function () {
var page = this;
$('.viewPanel', page).on('panelopen', function () {
reloadFiltersIfNeeded(page);
});
$('.radioSortBy', this).on('click', function () {
query.StartIndex = 0;
query.SortBy = this.getAttribute('data-sortby');
@ -144,64 +147,6 @@
reloadItems(page);
});
$('.chkVideoTypeFilter', this).on('change', function () {
var filterName = this.getAttribute('data-filter');
var filters = query.VideoTypes || "";
filters = (',' + filters).replace(',' + filterName, '').substring(1);
if (this.checked) {
filters = filters ? (filters + ',' + filterName) : filterName;
}
query.StartIndex = 0;
query.VideoTypes = filters;
reloadItems(page);
});
$('#chk3D', this).on('change', function () {
query.StartIndex = 0;
query.Is3D = this.checked ? this.getAttribute('data-filter') : null;
reloadItems(page);
});
$('#chkSubtitle', this).on('change', function () {
query.StartIndex = 0;
query.HasSubtitles = this.checked ? true : null;
reloadItems(page);
});
$('#chkTrailer', this).on('change', function () {
query.StartIndex = 0;
query.HasTrailer = this.checked ? true : null;
reloadItems(page);
});
$('#chkThemeSong', this).on('change', function () {
query.StartIndex = 0;
query.HasThemeSong = this.checked ? true : null;
reloadItems(page);
});
$('#chkThemeVideo', this).on('change', function () {
query.StartIndex = 0;
query.HasThemeVideo = this.checked ? true : null;
reloadItems(page);
});
$('.alphabetPicker', this).on('alphaselect', function (e, character) {
query.NameStartsWithOrGreater = character;
@ -224,6 +169,8 @@
}).on('pagebeforeshow', "#musicVideosPage", function () {
var page = this;
query.ParentId = LibraryMenu.getTopParentId();
var limit = LibraryBrowser.getDefaultPageSize();
@ -235,8 +182,9 @@
}
LibraryBrowser.loadSavedQueryValues(getSavedQueryKey(), query);
QueryFilters.onPageShow(page, query);
reloadItems(this);
reloadItems(page);
}).on('pageshow', "#musicVideosPage", function () {

View File

@ -64,7 +64,7 @@
$(document.body).append(html);
$('.notificationsFlyout').panel({}).panel('option', 'classes.modalOpen', 'notificationsPanelModelOpen ui-panel-dismiss-open').trigger('create').panel("open").on("panelclose", function () {
$('.notificationsFlyout').panel({}).trigger('create').panel("open").on("panelclose", function () {
$(this).off("panelclose").remove();

View File

@ -221,7 +221,7 @@
$(page).append(html);
panel = $('#searchPanel', page).panel({}).panel('option', 'classes.modalOpen', 'searchPanelModelOpen ui-panel-dismiss-open').trigger('create');
panel = $('#searchPanel', page).panel({}).trigger('create');
$('#txtSearch', panel).on("keyup", function (e) {

View File

@ -41,7 +41,7 @@
var html = '';
var cssClass = "card homePageSquareCard alternateHover bottomPaddedCard";
var cssClass = "card homePageSquareCard bottomPaddedCard";
html += "<div data-id='" + server.Id + "' class='" + cssClass + "'>";

View File

@ -36,6 +36,10 @@ var Dashboard = {
$.mobile.popup.prototype.options.transition = "fade";
$.mobile.defaultPageTransition = "none";
//$.mobile.collapsible.prototype.options.contentTheme = "a";
// Make panels a little larger than the defaults
$.mobile.panel.prototype.options.classes.modalOpen = "largePanelModalOpen ui-panel-dismiss-open";
$.mobile.panel.prototype.options.classes.panel = "largePanel ui-panel";
},
onRequestFail: function (e, data) {

View File

@ -13,12 +13,12 @@
Limit: 200,
StartIndex: 0
};
function getSavedQueryKey() {
return 'songs' + (query.ParentId || '');
}
function updateFilterControls(page) {
// Reset form values using the last used query
@ -57,7 +57,7 @@
$('.listTopPaging', page).html(pagingHtml).trigger('create');
updateFilterControls(page);
html += LibraryBrowser.getListViewHtml({
items: result.Items,
smallIcon: true,
@ -106,17 +106,36 @@
reloadItems(page);
});
LibraryBrowser.saveQueryValues(getSavedQueryKey(), query);
Dashboard.hideLoadingMsg();
});
}
var filtersLoaded;
function reloadFiltersIfNeeded(page) {
if (!filtersLoaded) {
filtersLoaded = true;
QueryFilters.loadFilters(page, Dashboard.getCurrentUserId(), query, function () {
reloadItems(page);
});
}
}
$(document).on('pageinit', "#songsPage", function () {
var page = this;
$('.viewPanel', page).on('panelopen', function () {
reloadFiltersIfNeeded(page);
});
$('.radioSortBy', this).on('click', function () {
query.SortBy = this.getAttribute('data-sortby');
query.StartIndex = 0;
@ -154,11 +173,14 @@
}).on('pagebeforeshow', "#songsPage", function () {
var page = this;
query.ParentId = LibraryMenu.getTopParentId();
LibraryBrowser.loadSavedQueryValues(getSavedQueryKey(), query);
QueryFilters.onPageShow(page, query);
reloadItems(this);
reloadItems(page);
}).on('pageshow', "#songsPage", function () {

View File

@ -156,19 +156,33 @@
$('#chkThemeVideo', page).checked(query.HasThemeVideo == true).checkboxradio('refresh');
$('#chkSpecialFeature', page).checked(query.HasSpecialFeature == true).checkboxradio('refresh');
$('#chkMissingImdbId', page).checked(query.HasImdbId == false).checkboxradio('refresh');
$('#chkMissingTvdbId', page).checked(query.HasTvdbId == false).checkboxradio('refresh');
$('#chkMissingOverview', page).checked(query.HasOverview == false).checkboxradio('refresh');
$('#chkYearMismatch', page).checked(query.IsYearMismatched == true).checkboxradio('refresh');
$('.alphabetPicker', page).alphaValue(query.NameStartsWith);
$('#selectPageSize', page).val(query.Limit).selectmenu('refresh');
}
var filtersLoaded;
function reloadFiltersIfNeeded(page) {
if (!filtersLoaded) {
filtersLoaded = true;
QueryFilters.loadFilters(page, Dashboard.getCurrentUserId(), query, function () {
reloadItems(page);
});
}
}
$(document).on('pageinit', "#tvShowsPage", function () {
var page = this;
$('.viewPanel', page).on('panelopen', function () {
reloadFiltersIfNeeded(page);
});
$('.radioSortBy', this).on('click', function () {
query.SortBy = this.getAttribute('data-sortby');
query.StartIndex = 0;
@ -312,38 +326,6 @@
}
});
$('#chkMissingImdbId', this).on('change', function () {
query.StartIndex = 0;
query.HasImdbId = this.checked ? false : null;
reloadItems(page);
});
$('#chkMissingTvdbId', this).on('change', function () {
query.StartIndex = 0;
query.HasTvdbId = this.checked ? false : null;
reloadItems(page);
});
$('#chkMissingOverview', this).on('change', function () {
query.StartIndex = 0;
query.HasOverview = this.checked ? false : null;
reloadItems(page);
});
$('#chkYearMismatch', this).on('change', function () {
query.StartIndex = 0;
query.IsYearMismatched = this.checked ? true : null;
reloadItems(page);
});
$('#selectPageSize', page).on('change', function () {
query.Limit = parseInt(this.value);
query.StartIndex = 0;
@ -366,6 +348,7 @@
var viewKey = getSavedQueryKey();
LibraryBrowser.loadSavedQueryValues(viewKey, query);
QueryFilters.onPageShow(page, query);
LibraryBrowser.getSavedViewSetting(viewKey).done(function (val) {

View File

@ -58,6 +58,35 @@
<label for="chkDislikes">${OptionDislikes}</label>
</fieldset>
<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>
</div>
<div class="tabSort viewTab">

View File

@ -83,6 +83,7 @@
<label for="chkStatusEnded">${OptionEnded}</label>
</fieldset>
<br />
<div data-role="collapsible" data-collapsed="true" data-mini="true">
<h2>${HeaderAirDays}</h2>
@ -103,7 +104,6 @@
<label for="chkSaturday">${OptionSaturday}</label>
</div>
</div>
<div data-role="collapsible" data-collapsed="true" data-mini="true">
<h2>${HeaderFeatures}</h2>
@ -122,23 +122,34 @@
</div>
</div>
<div data-role="collapsible" data-collapsed="true" data-mini="true">
<h2>${HeaderManagement}</h2>
<div data-role="collapsible" data-collapsed="true" data-mini="true" class="genreFilters">
<h2>${HeaderGenres}</h2>
<div data-role="controlgroup">
<input class="chkMissingImdbId" type="checkbox" name="chkMissingImdbId" id="chkMissingImdbId" data-mini="true">
<label for="chkMissingImdbId">${OptionMissingImdbId}</label>
<input class="chkMissingTvdbId" type="checkbox" name="chkMissingTvdbId" id="chkMissingTvdbId" data-mini="true">
<label for="chkMissingTvdbId">${OptionMissingTvdbId}</label>
<input class="chkMissingOverview" type="checkbox" name="chkMissingOverview" id="chkMissingOverview" data-mini="true">
<label for="chkMissingOverview">${OptionMissingOverview}</label>
<input class="chkYearMismatch" type="checkbox" name="chkYearMismatch" id="chkYearMismatch" data-mini="true">
<label for="chkYearMismatch">${OptionFileMetadataYearMismatch}</label>
<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>
</div>
<div class="tabSort viewTab">