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 channel filters

Browse source
This commit is contained in:
Luke Pulverenti 2016-02-14 15:34:54 -05:00
parent 413a255477
commit d4504e80a2
12 changed files with 248 additions and 326 deletions
Download patch file Download diff file Expand all files Collapse all files

25
dashboard-ui/channelitems.html
View file

@ -4,7 +4,7 @@
<title>Emby</title> <title>Emby</title>
</head> </head>
<body> <body>
<div id="channelItemsPage" data-role="page" class="page libraryPage channelsPage noSecondaryNavPage" data-contextname="${HeaderChannels}" data-require="jqmpanel,scripts/channelitems,paper-checkbox" data-backbutton="true" data-menubutton="false"> <div id="channelItemsPage" data-role="page" class="page libraryPage channelsPage noSecondaryNavPage" data-contextname="${HeaderChannels}" data-require="scripts/channelitems,paper-checkbox" data-backbutton="true" data-menubutton="false">
<div data-role="content"> <div data-role="content">
<div class="viewSettings"> <div class="viewSettings">
@ -14,29 +14,6 @@
</div> </div>
<div id="items" class="itemsContainer paddedItemsContainer" style="text-align:center;"></div> <div id="items" class="itemsContainer paddedItemsContainer" style="text-align:center;"></div>
</div> </div>
<div data-role="panel" class="viewPanel" data-theme="b" data-position="right" data-display="overlay" data-position-fixed="true">
<div class="ui-panel-inner">
<form>
<div class="filterControls">
<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="IsResumable">${OptionResumable}</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>
</form>
</div>
</div>
</div> </div>
</body> </body>
</html> </html>

85
dashboard-ui/components/filterdialog/filterdialog.js Normal file
View file

@ -0,0 +1,85 @@
define(['paperdialoghelper', 'events', 'paper-checkbox'], function (paperDialogHelper, events) {
function updateFilterControls(context, query) {
$('.chkStandardFilter', context).each(function () {
var filters = "," + (query.Filters || "");
var filterName = this.getAttribute('data-filter');
this.checked = filters.indexOf(',' + filterName) != -1;
});
}
function triggerChange(instance) {
events.trigger(instance, 'filterchange');
}
function bindEvents(instance, context, query) {
$('.chkStandardFilter', context).on('change', function () {
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;
triggerChange(instance);
});
}
return function (options) {
var self = this;
self.show = function () {
return new Promise(function (resolve, reject) {
var xhr = new XMLHttpRequest();
xhr.open('GET', 'components/filterdialog/filterdialog.template.html', true);
xhr.onload = function (e) {
var template = this.response;
var dlg = paperDialogHelper.createDialog({
removeOnClose: true,
modal: false,
enableHistory: false,
entryAnimationDuration: 160,
exitAnimationDuration: 200
});
dlg.classList.add('ui-body-b');
dlg.classList.add('background-theme-b');
dlg.classList.add('formDialog');
var html = '';
html += Globalize.translateDocument(template);
dlg.innerHTML = html;
document.body.appendChild(dlg);
paperDialogHelper.open(dlg);
dlg.addEventListener('iron-overlay-closed', resolve);
updateFilterControls(dlg, options.query);
bindEvents(self, dlg, options.query);
}
xhr.send();
});
};
};
});

14
dashboard-ui/components/filterdialog/filterdialog.template.html Normal file
View file

@ -0,0 +1,14 @@
<div style="margin: 0;padding:1.5em 2em;">
<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="IsResumable">${OptionResumable}</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>

37
dashboard-ui/gamegenres.html
View file

@ -4,7 +4,7 @@
<title>Emby</title> <title>Emby</title>
</head> </head>
<body> <body>
<div id="gameGenresPage" data-role="page" class="page libraryPage listPage" data-require="jqmcheckbox,jqmcontrolgroup,jqmpanel,scripts/gamegenrepage"> <div id="gameGenresPage" data-role="page" class="page libraryPage listPage" data-require="scripts/gamegenrepage">
<div class="libraryViewNav scopedLibraryViewNav"> <div class="libraryViewNav scopedLibraryViewNav">
<a href="gamesrecommended.html">${TabSuggestions}</a> <a href="gamesrecommended.html">${TabSuggestions}</a>
<a href="games.html">${TabGames}</a> <a href="games.html">${TabGames}</a>
@ -20,41 +20,6 @@
<div id="items" class="itemsContainer"></div> <div id="items" class="itemsContainer"></div>
</div> </div>
<div data-role="panel" class="viewPanel" data-theme="a" data-position="right" data-display="overlay" data-position-fixed="true">
<form>
<div data-role="controlgroup" data-type="horizontal" data-mini="true" class="viewPanelTabs">
<a href="#" data-role="button" class="viewTabButton" data-tab="tabView">${TabView}</a>
<a href="#" data-role="button" class="viewTabButton" data-tab="tabFilter">${TabFilter}</a>
</div>
<div class="tabView viewTab">
<div>
<label for="selectPageSize">${LabelPageSize}</label>
<select id="selectPageSize" class="selectPageSize"></select>
</div>
</div>
<div class="tabFilter viewTab">
<fieldset data-role="controlgroup">
<legend>
${HeaderFilters}
</legend>
<input class="chkStandardFilter" type="checkbox" name="chkIsFavorite" id="chkIsFavorite" data-filter="IsFavorite" data-mini="true">
<label for="chkIsFavorite">${OptionFavorite}</label>
<input class="chkStandardFilter" type="checkbox" name="chkLikes" id="chkLikes" data-filter="Likes" data-mini="true">
<label for="chkLikes">${OptionLikes}</label>
<input class="chkStandardFilter" type="checkbox" name="chkDislikes" id="chkDislikes" data-filter="Dislikes" data-mini="true">
<label for="chkDislikes">${OptionDislikes}</label>
</fieldset>
</div>
</form>
</div>
</div> </div>
</body> </body>
</html> </html>

37
dashboard-ui/gamestudios.html
View file

@ -4,7 +4,7 @@
<title>Emby</title> <title>Emby</title>
</head> </head>
<body> <body>
<div id="gameStudiosPage" data-role="page" class="page libraryPage listPage" data-require="jqmcheckbox,jqmcontrolgroup,jqmpanel,scripts/gamestudiospage"> <div id="gameStudiosPage" data-role="page" class="page libraryPage listPage" data-require="jqmcontrolgroup,scripts/gamestudiospage">
<div class="libraryViewNav scopedLibraryViewNav"> <div class="libraryViewNav scopedLibraryViewNav">
<a href="gamesrecommended.html">${TabSuggestions}</a> <a href="gamesrecommended.html">${TabSuggestions}</a>
<a href="games.html">${TabGames}</a> <a href="games.html">${TabGames}</a>
@ -19,41 +19,6 @@
</div> </div>
<div id="items" class="itemsContainer"></div> <div id="items" class="itemsContainer"></div>
</div> </div>
<div data-role="panel" class="viewPanel" data-theme="a" data-position="right" data-display="overlay" data-position-fixed="true">
<form>
<div data-role="controlgroup" data-type="horizontal" data-mini="true" class="viewPanelTabs">
<a href="#" data-role="button" class="viewTabButton" data-tab="tabView">${TabView}</a>
<a href="#" data-role="button" class="viewTabButton" data-tab="tabFilter">${TabFilter}</a>
</div>
<div class="tabView viewTab">
<div>
<label for="selectPageSize">${LabelPageSize}</label>
<select id="selectPageSize" class="selectPageSize"></select>
</div>
</div>
<div class="tabFilter viewTab">
<fieldset data-role="controlgroup">
<legend>
${HeaderFilters}
</legend>
<input class="chkStandardFilter" type="checkbox" name="chkIsFavorite" id="chkIsFavorite" data-filter="IsFavorite" data-mini="true">
<label for="chkIsFavorite">${OptionFavorite}</label>
<input class="chkStandardFilter" type="checkbox" name="chkLikes" id="chkLikes" data-filter="Likes" data-mini="true">
<label for="chkLikes">${OptionLikes}</label>
<input class="chkStandardFilter" type="checkbox" name="chkDislikes" id="chkDislikes" data-filter="Dislikes" data-mini="true">
<label for="chkDislikes">${OptionDislikes}</label>
</fieldset>
</div>
</form>
</div>
</div> </div>
</body> </body>
</html> </html>

52
dashboard-ui/scripts/channelitems.js
View file

@ -103,11 +103,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,
updatePageSizeSetting: false, updatePageSizeSetting: false,
viewIcon: 'filter-list', sortButton: true,
sortButton: true filterButton: true
}); });
page.querySelector('.listTopPaging').innerHTML = pagingHtml; page.querySelector('.listTopPaging').innerHTML = pagingHtml;
@ -140,6 +139,10 @@
reloadItems(page); 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
$('.btnSort', page).on('click', function () { $('.btnSort', page).on('click', function () {
showSortMenu(page); showSortMenu(page);
@ -153,6 +156,22 @@
}); });
} }
function showFilterMenu(page) {
require(['components/filterdialog/filterdialog'], function (filterDialogFactory) {
var filterDialog = new filterDialogFactory({
query: getQuery()
});
Events.on(filterDialog, 'filterchange', function () {
reloadItems(page);
});
filterDialog.show();
});
}
function showSortMenu(page) { function showSortMenu(page) {
var sortFields = getPageData().sortFields; var sortFields = getPageData().sortFields;
@ -213,15 +232,6 @@
function updateFilterControls(page) { function updateFilterControls(page) {
var query = getQuery(); var query = getQuery();
$('.chkStandardFilter', page).each(function () {
var filters = "," + (query.Filters || "");
var filterName = this.getAttribute('data-filter');
this.checked = filters.indexOf(',' + filterName) != -1;
});
$('.alphabetPicker', page).alphaValue(query.NameStartsWith); $('.alphabetPicker', page).alphaValue(query.NameStartsWith);
} }
@ -229,24 +239,6 @@
var page = this; var page = this;
$('.chkStandardFilter', this).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(page);
});
$('.alphabetPicker', this).on('alphaselect', function (e, character) { $('.alphabetPicker', this).on('alphaselect', function (e, character) {
var query = getQuery(); var query = getQuery();

39
dashboard-ui/scripts/gamegenrepage.js
View file

@ -30,12 +30,9 @@
startIndex: query.StartIndex, startIndex: query.StartIndex,
limit: query.Limit, limit: query.Limit,
totalRecordCount: result.TotalRecordCount, totalRecordCount: result.TotalRecordCount,
viewButton: true,
showLimit: false showLimit: false
})); }));
updateFilterControls(page);
html = LibraryBrowser.getPosterViewHtml({ html = LibraryBrowser.getPosterViewHtml({
items: result.Items, items: result.Items,
shape: "backdrop", shape: "backdrop",
@ -66,39 +63,7 @@
}); });
} }
function updateFilterControls(page) { $(document).on('pagebeforeshow', "#gameGenresPage", function () {
$('#selectPageSize', page).val(query.Limit);
}
$(document).on('pageinit', "#gameGenresPage", function () {
var page = this;
$('.chkStandardFilter', this).on('change', function () {
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(page);
});
$('#selectPageSize', page).on('change', function () {
query.Limit = parseInt(this.value);
query.StartIndex = 0;
reloadItems(page);
});
}).on('pagebeforeshow', "#gameGenresPage", function () {
query.ParentId = LibraryMenu.getTopParentId(); query.ParentId = LibraryMenu.getTopParentId();
@ -113,8 +78,6 @@
LibraryBrowser.loadSavedQueryValues(getSavedQueryKey(), query); LibraryBrowser.loadSavedQueryValues(getSavedQueryKey(), query);
reloadItems(this); reloadItems(this);
updateFilterControls(this);
}); });
})(jQuery, document); })(jQuery, document);

40
dashboard-ui/scripts/gamestudiospage.js
View file

@ -31,12 +31,9 @@
startIndex: query.StartIndex, startIndex: query.StartIndex,
limit: query.Limit, limit: query.Limit,
totalRecordCount: result.TotalRecordCount, totalRecordCount: result.TotalRecordCount,
viewButton: true,
showLimit: false showLimit: false
})); }));
updateFilterControls(page);
html = LibraryBrowser.getPosterViewHtml({ html = LibraryBrowser.getPosterViewHtml({
items: result.Items, items: result.Items,
shape: "backdrop", shape: "backdrop",
@ -45,7 +42,6 @@
showItemCounts: true, showItemCounts: true,
centerText: true, centerText: true,
lazy: true lazy: true
}); });
var elem = page.querySelector('#items'); var elem = page.querySelector('#items');
@ -68,39 +64,7 @@
}); });
} }
function updateFilterControls(page) { $(document).on('pagebeforeshow', "#gameStudiosPage", function () {
$('#selectPageSize', page).val(query.Limit);
}
$(document).on('pageinit', "#gameStudiosPage", function () {
var page = this;
$('.chkStandardFilter', this).on('change', function () {
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(page);
});
$('#selectPageSize', page).on('change', function () {
query.Limit = parseInt(this.value);
query.StartIndex = 0;
reloadItems(page);
});
}).on('pagebeforeshow', "#gameStudiosPage", function () {
query.ParentId = LibraryMenu.getTopParentId(); query.ParentId = LibraryMenu.getTopParentId();
@ -115,8 +79,6 @@
LibraryBrowser.loadSavedQueryValues(getSavedQueryKey(), query); LibraryBrowser.loadSavedQueryValues(getSavedQueryKey(), query);
reloadItems(this); reloadItems(this);
updateFilterControls(this);
}); });
})(jQuery, document); })(jQuery, document);

7
dashboard-ui/scripts/librarybrowser.js
View file

@ -2821,7 +2821,7 @@
html += '</span>'; html += '</span>';
} }
if (showControls || options.viewButton || options.sortButton || options.addLayoutButton) { if (showControls || options.viewButton || options.filterButton || options.sortButton || options.addLayoutButton) {
html += '<div style="display:inline-block;margin-left:10px;">'; html += '<div style="display:inline-block;margin-left:10px;">';
@ -2849,6 +2849,11 @@
html += '<paper-icon-button title="' + title + '" icon="' + (options.viewIcon || AppInfo.moreIcon) + '" onclick="LibraryBrowser.openViewPanel(this, \'' + viewPanelClass + '\');"></paper-icon-button>'; html += '<paper-icon-button title="' + title + '" icon="' + (options.viewIcon || AppInfo.moreIcon) + '" onclick="LibraryBrowser.openViewPanel(this, \'' + viewPanelClass + '\');"></paper-icon-button>';
} }
if (options.filterButton) {
html += '<paper-icon-button class="btnFilter" title="' + Globalize.translate('ButtonFilter') + '" icon="filter-list"></paper-icon-button>';
}
html += '</div>'; html += '</div>';
if (showControls && options.showLimit) { if (showControls && options.showLimit) {

9
dashboard-ui/scripts/mediaplayer.js
View file

@ -652,7 +652,7 @@
self.createStreamInfo = function (type, item, mediaSource, startPosition) { self.createStreamInfo = function (type, item, mediaSource, startPosition) {
var deferred = $.Deferred(); return new Promise(function (resolve, reject) {
var mediaUrl; var mediaUrl;
var contentType; var contentType;
@ -779,16 +779,15 @@
resultInfo.url = path; resultInfo.url = path;
console.log('LocalAssetManager.translateFilePath: path: ' + resultInfo.url + ' result: ' + path); console.log('LocalAssetManager.translateFilePath: path: ' + resultInfo.url + ' result: ' + path);
deferred.resolveWith(null, [resultInfo]); resolve(resultInfo);
}); });
}); });
} }
else { else {
deferred.resolveWith(null, [resultInfo]); resolve(resultInfo);
} }
});
return deferred.promise();
}; };
self.lastBitrateDetections = {}; self.lastBitrateDetections = {};

32
dashboard-ui/scripts/site.js
View file

@ -2142,8 +2142,6 @@ var AppInfo = {};
deps.push('scripts/mediacontroller'); deps.push('scripts/mediacontroller');
deps.push('scripts/globalize'); deps.push('scripts/globalize');
deps.push('jQuery');
deps.push('paper-drawer-panel'); deps.push('paper-drawer-panel');
require(deps, function (events) { require(deps, function (events) {
@ -2197,26 +2195,14 @@ var AppInfo = {};
MediaBrowser[i] = connectionManagerExports[i]; MediaBrowser[i] = connectionManagerExports[i];
} }
// TODO: This needs to be deprecated, but it's used heavily
$.fn.checked = function (value) {
if (value === true || value === false) {
// Set the value of the checkbox
return $(this).each(function () {
this.checked = value;
});
} else {
// Return check state
return this.length && this[0].checked;
}
};
var promises = []; var promises = [];
deps = []; deps = [];
deps.push('scripts/mediaplayer'); deps.push('scripts/mediaplayer');
deps.push('emby-icons'); deps.push('emby-icons');
deps.push('paper-icon-button'); deps.push('paper-icon-button');
deps.push('paper-button'); deps.push('paper-button');
deps.push('jqm'); deps.push('jQuery');
promises.push(getRequirePromise(deps)); promises.push(getRequirePromise(deps));
promises.push(Globalize.ensure()); promises.push(Globalize.ensure());
@ -2256,6 +2242,19 @@ var AppInfo = {};
require(depends, function () { require(depends, function () {
// TODO: This needs to be deprecated, but it's used heavily
$.fn.checked = function (value) {
if (value === true || value === false) {
// Set the value of the checkbox
return $(this).each(function () {
this.checked = value;
});
} else {
// Return check state
return this.length && this[0].checked;
}
};
// Don't like having to use jQuery here, but it takes care of making sure that embedded script executes // Don't like having to use jQuery here, but it takes care of making sure that embedded script executes
$(mainDrawerPanelContent).html(Globalize.translateDocument(newHtml, 'html')); $(mainDrawerPanelContent).html(Globalize.translateDocument(newHtml, 'html'));
onAppReady(); onAppReady();
@ -2317,6 +2316,7 @@ var AppInfo = {};
deps.push('scripts/backdrops'); deps.push('scripts/backdrops');
deps.push('scripts/librarymenu'); deps.push('scripts/librarymenu');
deps.push('scripts/librarybrowser'); deps.push('scripts/librarybrowser');
deps.push('jqm');
deps.push('css!css/card.css'); deps.push('css!css/card.css');

11
dashboard-ui/thirdparty/jquerymobile-1.4.5/jqm.widget.js vendored
View file

@ -1,8 +1,4 @@
(function () { define(['jqm'], function () {
if (jQuery.widget) {
return;
}
/*! /*!
* jQuery UI Widget c0ab71056b936627e8a7821f03c044aec6280a40 * jQuery UI Widget c0ab71056b936627e8a7821f03c044aec6280a40
@ -498,7 +494,7 @@
(function ($, undefined) { (function ($, undefined) {
var originalWidget = $.widget var originalWidget = $.widget;
$.widget = (function (orig) { $.widget = (function (orig) {
return function () { return function () {
@ -519,5 +515,4 @@
})(jQuery); })(jQuery);
});
})();