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

add column sorting to reports

This commit is contained in:
Luke Pulverenti 2014-03-08 13:17:05 -05:00
parent 67f909cd87
commit fce65d5942
8 changed files with 246 additions and 87 deletions

View file

@ -776,6 +776,10 @@ a.itemTag:hover {
max-width: 950px;
}
.detailPageContent {
max-width: 930px;
}
.primaryDetailPageContent {
max-width: 850px;
}
@ -788,9 +792,6 @@ a.itemTag:hover {
}
}
@media all and (min-width: 1920px) {
}
.detailPageParentLink {
text-decoration: none;
}

View file

@ -308,14 +308,6 @@
@media all and (min-width: 1920px) {
.portraitPosterItem {
width: 160px;
}
.portraitPosterItem .posterItemImage {
height: 240px;
}
.squarePosterItem {
width: 190px;
}

View file

@ -160,10 +160,10 @@
<p class="itemTags"></p>
</div>
</div>
<div class="collectionItems"></div>
<div id="childrenCollapsible" class="hide detailSection">
<div class="detailSectionHeader" style="position: relative;">
<div class="detailSectionHeader">
<span id="childrenTitle"></span>
<a id="btnEditCollectionTitles" href="#" data-role="button" data-icon="edit" data-iconpos="notext" data-inline="true" style="display: none; position: absolute; right: 0; top: 6px; margin-top: 0; margin-bottom: 0;">Edit</a>
</div>
<div id="childrenContent" class="detailSectionContent"></div>
</div>

View file

@ -287,7 +287,17 @@
$('#fldYear', page).show();
}
if (item.Type == "Movie" || item.Type == "Trailer" || item.Type == "AdultVideo" || item.Type == "Series" || item.Type == "Game" || item.Type == "BoxSet" || item.Type == "Person" || item.Type == "Book") {
if (item.Type == "Movie" ||
item.Type == "Trailer" ||
item.Type == "AdultVideo" ||
item.Type == "Series" ||
item.Type == "Game" ||
item.Type == "BoxSet" ||
item.Type == "Person" ||
item.Type == "Book" ||
item.Type == "MusicAlbum" ||
item.Type == "MusicArtist") {
$('#btnIdentify', page).show();
} else {
$('#btnIdentify', page).hide();

View file

@ -46,7 +46,7 @@
}
if (!item.BackdropImageTags || !item.BackdropImageTags.length) {
if (item.Type !== "Episode" && item.Type !== "Season" && item.MediaType !== "Audio" && item.Type !== "Channel") {
if (item.Type !== "Episode" && item.Type !== "Season" && item.MediaType !== "Audio" && item.Type !== "Channel" && item.Type !== "MusicAlbum") {
htmlName += '<img src="css/images/editor/missingbackdrop.png" title="Missing backdrop image." />';
}
}

View file

@ -36,13 +36,6 @@
$('#editButtonContainer', page).hide();
}
if (user.Configuration.IsAdministrator && item.Type == "BoxSet") {
$('#btnEditCollectionTitles', page).show().attr('href', 'editcollectionitems.html?id=' + item.Id);
} else {
$('#btnEditCollectionTitles', page).hide();
}
if (MediaPlayer.canPlay(item, user)) {
var url = MediaPlayer.getPlayUrl(item);
@ -184,8 +177,15 @@
function setInitialCollapsibleState(page, item, context, user) {
$('.collectionItems', page).empty();
if (item.IsFolder) {
if (item.Type == "BoxSet") {
$('#childrenCollapsible', page).addClass('hide');
} else {
$('#childrenCollapsible', page).removeClass('hide');
}
renderChildren(page, item, user);
}
else {
@ -579,7 +579,7 @@
var html = '';
if (item.Type == "Series" || item.Type == "BoxSet") {
if (item.Type == "Series") {
html = LibraryBrowser.getPosterViewHtml({
items: result.Items,
shape: "portrait",
@ -608,9 +608,20 @@
});
}
$('#childrenContent', page).html(html).createPosterItemHoverMenu();
if (item.Type == "BoxSet") {
var collectionItemTypes = [
{ name: 'Movies', type: 'Movie' },
{ name: 'Series', type: 'Series' },
{ name: 'Albums', type: 'MusicAlbum' },
{ name: 'Games', type: 'Game' },
{ name: 'Books', type: 'Book' }
];
renderCollectionItems(page, collectionItemTypes, result.Items, user);
}
}
});
@ -620,9 +631,6 @@
else if (item.Type == "Series") {
$('#childrenTitle', page).html('Seasons');
}
else if (item.Type == "BoxSet") {
$('#childrenTitle', page).html('Titles');
}
else if (item.Type == "MusicAlbum") {
$('#childrenTitle', page).html('Tracks');
}
@ -633,6 +641,82 @@
$('#childrenTitle', page).html('Items');
}
}
function renderCollectionItems(page, types, items, user) {
for (var i = 0, length = types.length; i < length; i++) {
var type = types[i];
var typeItems = items.filter(function (curr) {
return curr.Type == type.type;
});
if (!typeItems.length) {
continue;
}
renderCollectionItemType(page, type, typeItems, user);
}
var otherType = { name: 'Other Items' };
var otherTypeItems = items.filter(function (curr) {
return !types.filter(function(t) {
return t.type == curr.Type;
}).length;
});
if (otherTypeItems.length) {
renderCollectionItemType(page, otherType, otherTypeItems, user);
}
if (!items.length) {
renderCollectionItemType(page, {name: 'Titles'}, items, user);
}
$('.collectionItems', page).trigger('create').createPosterItemHoverMenu();
}
function renderCollectionItemType(page, type, items, user) {
var html = '';
html += '<div class="detailSection">';
html += '<div class="detailSectionHeader" style="position: relative;">';
html += '<span>' + type.name + '</span>';
if (user.Configuration.IsAdministrator) {
html += '<a href="editcollectionitems.html?id=' + currentItem.Id + '" data-role="button" data-icon="edit" data-iconpos="notext" data-inline="true" style="position: absolute; right: 0; top: 6px; margin-top: 0; margin-bottom: 0;">Edit</a>';
}
html += '</div>';
html += '<div class="detailSectionContent">';
var shape = type.type == 'MusicAlbum' ? 'square' : 'portrait';
html += LibraryBrowser.getPosterViewHtml({
items: items,
shape: shape,
useAverageAspectRatio: true,
showTitle: true,
centerText: true
});
html += '</div>';
html += '</div>';
$('.collectionItems', page).append(html);
}
function renderUserDataIcons(page, item) {
$('.userDataIcons', page).html(LibraryBrowser.getUserDataIconsHtml(item));
}

View file

@ -1,9 +1,11 @@
(function ($, document, window) {
var defaultSortBy = "SortName";
// The base query options
var query = {
SortBy: "SeriesSortName,SortName",
SortBy: defaultSortBy,
SortOrder: "Ascending",
Recursive: true,
Fields: "MediaStreams,DateCreated,Settings,Studios",
@ -21,21 +23,22 @@
{
return [
{},
{ name: 'Series' },
{ name: 'Season' },
{ name: 'Date Added' }
{ name: 'Series', sortField: 'SeriesSortName,SortName' },
{ name: 'Season', sortField: 'SortName' },
{ name: 'Date Added', sortField: 'DateCreated,SortName' }
];
}
case 'Series':
{
return [
{},
{ name: 'Name' },
{ name: 'Network' },
{ name: 'Date Added' },
{ name: 'Year' },
{ name: 'Rating' },
{ name: 'Runtime' },
{ name: 'Name', sortField: 'SortName' },
{ name: 'Network', sortField: 'Studio,SortName' },
{ name: 'Date Added', sortField: 'DateCreated,SortName' },
{ name: 'Year', sortField: 'ProductionYear,PremiereDate,SortName' },
{ name: 'Parental Rating', sortField: 'OfficialRating,SortName' },
{ name: 'Community Rating', sortField: 'CommunityRating,SortName' },
{ name: 'Runtime', sortField: 'Runtime,SortName' },
{ name: 'Trailers' },
{ name: 'Specials' }
];
@ -44,12 +47,13 @@
{
return [
{},
{ name: 'Name' },
{ name: 'Game System' },
{ name: 'Date Added' },
{ name: 'Release Date' },
{ name: 'Rating' },
{ name: 'Players' },
{ name: 'Name', sortField: 'SortName' },
{ name: 'Game System', sortField: 'GameSystem,SortName' },
{ name: 'Date Added', sortField: 'DateCreated,GameSystem,SortName' },
{ name: 'Release Date', sortField: 'ProductionYear,PremiereDate,GameSystem,SortName' },
{ name: 'Parental Rating', sortField: 'OfficialRating,GameSystem,SortName' },
{ name: 'Community Rating', sortField: 'CommunityRating,GameSystem,SortName' },
{ name: 'Players', sortField: 'Players,GameSystem,SortName' },
{ name: 'Trailers' }
];
}
@ -57,13 +61,14 @@
{
return [
{},
{ name: 'Album Artist' },
{ name: 'Album' },
{ name: 'Track' },
{ name: 'Name' },
{ name: 'Date Added' },
{ name: 'Release Date' },
{ name: 'Runtime' },
{ name: 'Album Artist', sortField: 'AlbumArtist,SortName' },
{ name: 'Album', sortField: 'Album,SortName' },
{ name: 'Disc', sortField: 'Album,SortName' },
{ name: 'Track', sortField: 'Album,SortName' },
{ name: 'Name', sortField: 'Name' },
{ name: 'Date Added', sortField: 'DateCreated,SortName' },
{ name: 'Release Date', sortField: 'ProductionYear,PremiereDate,SortName' },
{ name: 'Runtime', sortField: 'Runtime,SortName' },
{ name: 'Audio' },
{ name: 'Embedded Image' }
];
@ -72,12 +77,13 @@
{
return [
{},
{ name: 'Series' },
{ name: 'Series', sortField: 'SeriesSortName,SortName' },
{ name: 'Season' },
{ name: 'Name' },
{ name: 'Date Added' },
{ name: 'Release Date' },
{ name: 'Runtime' },
{ name: 'Name', sortField: 'SortName' },
{ name: 'Date Added', sortField: 'DateCreated,SortName' },
{ name: 'Release Date', sortField: 'ProductionYear,PremiereDate,SortName' },
{ name: 'Community Rating', sortField: 'CommunityRating,SortName' },
{ name: 'Runtime', sortField: 'Runtime,SortName' },
{ name: 'Video' },
{ name: 'Audio' },
{ name: 'Subtitles' }
@ -87,10 +93,11 @@
{
return [
{},
{ name: 'Name' },
{ name: 'Date Added' },
{ name: 'Release Date' },
{ name: 'Rating' },
{ name: 'Name', sortField: 'SortName' },
{ name: 'Date Added', sortField: 'DateCreated,SortName' },
{ name: 'Release Date', sortField: 'ProductionYear,PremiereDate,SortName' },
{ name: 'Parental Rating', sortField: 'OfficialRating,SortName' },
{ name: 'Community Rating', sortField: 'CommunityRating,SortName' },
{ name: 'Trailers' }
];
}
@ -99,41 +106,44 @@
return [
{},
{ name: 'Series' },
{ name: 'Name' },
{ name: 'Date Added' },
{ name: 'Release Date' },
{ name: 'Rating' }
{ name: 'Name', sortField: 'SortName' },
{ name: 'Date Added', sortField: 'DateCreated,SortName' },
{ name: 'Release Date', sortField: 'ProductionYear,PremiereDate,SortName' },
{ name: 'Parental Rating', sortField: 'OfficialRating,SortName' },
{ name: 'Community Rating', sortField: 'CommunityRating,SortName' }
];
}
case 'MusicArtist':
{
return [
{},
{ name: 'Name' },
{ name: 'Date Added' }
{ name: 'Name', sortField: 'SortName' },
{ name: 'Date Added', sortField: 'DateCreated,SortName' }
];
}
case 'MusicAlbum':
{
return [
{},
{ name: 'Album Artist' },
{ name: 'Name' },
{ name: 'Date Added' },
{ name: 'Release Date' },
{ name: 'Rating' },
{ name: 'Runtime' }
{ name: 'Album Artist', sortField: 'AlbumArtist,SortName' },
{ name: 'Name', sortField: 'SortName' },
{ name: 'Date Added', sortField: 'DateCreated,SortName' },
{ name: 'Release Date', sortField: 'ProductionYear,PremiereDate,SortName' },
{ name: 'Parental Rating', sortField: 'OfficialRating,SortName' },
{ name: 'Community Rating', sortField: 'CommunityRating,SortName' },
{ name: 'Runtime', sortField: 'Runtime,SortName' }
];
}
default:
{
return [
{},
{ name: 'Name' },
{ name: 'Date Added' },
{ name: 'Release Date' },
{ name: 'Rating' },
{ name: 'Runtime' },
{ name: 'Name', sortField: 'SortName' },
{ name: 'Date Added', sortField: 'DateCreated,SortName' },
{ name: 'Release Date', sortField: 'ProductionYear,PremiereDate,SortName' },
{ name: 'Parental Rating', sortField: 'OfficialRating,SortName' },
{ name: 'Community Rating', sortField: 'CommunityRating,SortName' },
{ name: 'Runtime', sortField: 'Runtime,SortName' },
{ name: 'Video' },
{ name: 'Audio' },
{ name: 'Subtitles' },
@ -178,6 +188,11 @@
html += item.Studios.length ? item.Studios[0].Name : '&nbsp;';
break;
}
case 'Disc':
{
html += item.ParentIndexNumber == null ? '' : item.ParentIndexNumber;
break;
}
case 'Track':
{
html += item.IndexNumber == null ? '' : item.IndexNumber;
@ -281,7 +296,12 @@
html += '<a href="edititemmetadata.html?id=' + item.Id + '">' + LibraryBrowser.getPosterViewDisplayName(item, false, false) + '</a>';
break;
}
case 'Rating':
case 'Community Rating':
{
html += item.CommunityRating || '&nbsp;';
break;
}
case 'Parental Rating':
{
html += item.OfficialRating || '&nbsp;';
break;
@ -357,7 +377,7 @@
}
if (!item.BackdropImageTags || !item.BackdropImageTags.length) {
if (item.Type !== "Episode" && item.Type !== "Season" && item.MediaType !== "Audio" && item.Type !== "Channel") {
if (item.Type !== "Episode" && item.Type !== "Season" && item.MediaType !== "Audio" && item.Type !== "Channel" && item.Type !== "MusicAlbum") {
html += '<a href="edititemimages.html?id=' + item.Id + '"><img src="css/images/editor/missingbackdrop.png" title="Missing backdrop image." /></a>';
}
}
@ -378,11 +398,11 @@
}).join('');
}
function getReportHtml(items, reportType) {
function getReportHtml(items, reportType, currentSortField, currentSortDirection) {
var html = '';
html += '<table data-role="table" data-mode="reflow" class="tblLibraryReport detailTable stripedTable ui-responsive table-stroke" style="display: table;">';
html += '<table id="tblReport" data-role="table" data-mode="reflow" class="tblLibraryReport stripedTable ui-responsive table-stroke detailTable" style="display:table;">';
html += '<thead>';
html += '<tr>';
@ -391,7 +411,31 @@
html += cells.map(function (c) {
return '<th>' + (c.name || '&nbsp;') + '</th>';
var cellHtml = '<th data-priority="' + (c.priority || 'persist') + '">';
if (c.sortField) {
cellHtml += '<a class="lnkColumnSort" href="#" data-sortfield="' + c.sortField + '" style="text-decoration:underline;">';
}
cellHtml += (c.name || '&nbsp;');
if (c.sortField) {
cellHtml += '</a>';
if (c.sortField == currentSortField) {
if (currentSortDirection == "Descending") {
cellHtml += '<span style="font-weight:bold;margin-left:5px;vertical-align:top;font-size:12px;">&darr;</span>';
} else {
cellHtml += '<span style="font-weight:bold;margin-left:5px;vertical-align:top;font-size:12px;">&uarr;</span>';
}
}
}
cellHtml += '</th>';
return cellHtml;
}).join('');
@ -427,7 +471,7 @@
$('.listBottomPaging', page).html(LibraryBrowser.getPagingHtml(query, result.TotalRecordCount)).trigger('create');
$('.reportContainer', page).html(getReportHtml(result.Items, reportType)).trigger('create');
$('.reportContainer', page).html(getReportHtml(result.Items, reportType, query.SortBy, query.SortOrder)).trigger('create');
$('.btnNextPage', page).on('click', function () {
query.StartIndex += query.Limit;
@ -444,6 +488,34 @@
query.StartIndex = 0;
reloadItems(page);
});
$('.lnkColumnSort', page).on('click', function () {
var order = this.getAttribute('data-sortfield');
if (query.SortBy == order) {
if (query.SortOrder == "Descending") {
query.SortOrder = "Ascending";
query.SortBy = defaultSortBy;
} else {
query.SortOrder = "Descending";
query.SortBy = order;
}
} else {
query.SortOrder = "Ascending";
query.SortBy = order;
}
query.StartIndex = 0;
reloadItems(page);
});
}
function reloadItems(page) {

View file

@ -11,7 +11,7 @@
SortBy: "DateCreated",
SortOrder: "Descending",
IncludeItemTypes: "Movie",
Limit: screenWidth >= 1920 ? 21 : (screenWidth >= 1440 ? 16 : 12),
Limit: screenWidth >= 1920 ? 24 : (screenWidth >= 1440 ? 16 : 12),
Recursive: true,
Fields: "PrimaryImageAspectRatio,DateCreated,UserData",
Filters: "IsUnplayed"
@ -62,7 +62,7 @@
SortBy: "DateCreated",
SortOrder: "Descending",
IncludeItemTypes: "Trailer",
Limit: screenWidth >= 1920 ? 7 : (screenWidth >= 1440 ? 8 : 6),
Limit: screenWidth >= 1920 ? 8 : (screenWidth >= 1440 ? 8 : 6),
Recursive: true,
Fields: "PrimaryImageAspectRatio,DateCreated,UserData",
Filters: "IsUnplayed"