added library list to editor

This commit is contained in:
Luke Pulverenti 2014-03-02 15:44:48 -05:00
parent e8df96102f
commit c2b9b4e6d8
10 changed files with 624 additions and 20 deletions

View File

@ -11,6 +11,7 @@
text-align: left; text-align: left;
width: 100%; width: 100%;
margin: 0 auto; margin: 0 auto;
text-shadow: none!important;
} }
.stretchedDetailTable { .stretchedDetailTable {

View File

@ -53,7 +53,6 @@
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: contain; background-size: contain;
display: block; display: block;
/* For the box shadow so that the bottom border isnt underneath the text */ /* For the box shadow so that the bottom border isnt underneath the text */
z-index: 100000; z-index: 100000;
position: relative; position: relative;
@ -145,6 +144,24 @@
} }
} }
.libraryReportIndicator {
position: relative;
display: block;
text-align: center;
vertical-align: middle;
width: 24px;
height: 19px;
padding-top: 3px;
border-radius: 50%;
color: #fff;
background: rgb(204, 0, 0);
background: rgba(204, 0, 0, .8);
}
.libraryReportIndicator div:after {
background-color: transparent !important;
}
.editorTile { .editorTile {
display: inline-block; display: inline-block;
margin: 5px; margin: 5px;

View File

@ -0,0 +1,165 @@
<!DOCTYPE html>
<html>
<head>
<title>Media Browser</title>
</head>
<body>
<div id="libraryReportPage" data-role="page" data-theme="b" class="page libraryPage metadataEditorPage">
<div data-role="content editPageContent">
<div class="editPageSidebar">
<div class="libraryTree">
<ul>
</ul>
</div>
</div>
<div class="editPageInnerContent">
<h1 style="margin-bottom: 0;">Library List</h1>
<div style="text-align: center;">
<div class="viewControls">
<button data-mini="true" data-icon="filter" data-inline="true" onclick="$('#filterPanel', $(this).parents('.page')).panel( 'toggle' );">Filter</button>
</div>
<div class="listTopPaging">
</div>
</div>
<table data-role="table" data-mode="reflow" class="tblLibraryReport detailTable stripedTable ui-responsive table-stroke" style="display: table;">
<thead>
<tr>
<th data-priority="1"></th>
<th data-priority="1">Parent</th>
<th data-priority="1">Name</th>
<th data-priority="1">Type</th>
<th data-priority="1">Date/Year</th>
<th data-priority="1">Rating</th>
<th data-priority="1">Runtime</th>
<th data-priority="1">Features</th>
</tr>
</thead>
<tbody class="resultBody">
</tbody>
</table>
<div class="listBottomPaging">
</div>
</div>
</div>
<div data-role="panel" id="filterPanel" data-position="right" data-display="overlay" data-theme="a" data-position-fixed="true">
<form>
<fieldset data-role="controlgroup" data-type="horizontal" style="margin-bottom: 1em;">
<legend>Filters:</legend>
<input type="radio" name="radioFilterTypes" id="radioBasicFilters" value="on" checked="checked" data-mini="true">
<label for="radioBasicFilters">Basic</label>
<input type="radio" name="radioFilterTypes" id="radioAdvancedFilters" value="off" data-mini="true">
<label for="radioAdvancedFilters">Advanced</label>
</fieldset>
<div class="basicFilters">
<fieldset data-role="controlgroup">
<legend>
<strong>Type:</strong>
</legend>
<input class="chkTypeFilter" type="checkbox" id="chkMovie" data-filter="Movie" data-mini="true">
<label for="chkMovie">Movie</label>
<input class="chkTypeFilter" type="checkbox" id="chkTrailerType" data-filter="Trailer" data-mini="true">
<label for="chkTrailerType">Trailer</label>
<input class="chkTypeFilter" type="checkbox" id="chkCollection" data-filter="BoxSet" data-mini="true">
<label for="chkCollection">Collection</label>
<input class="chkTypeFilter" type="checkbox" id="chkSeries" data-filter="Series" data-mini="true">
<label for="chkSeries">Series</label>
<input class="chkTypeFilter" type="checkbox" id="chkSeason" data-filter="Season" data-mini="true">
<label for="chkSeason">Season</label>
<input class="chkTypeFilter" type="checkbox" id="chkEpisode" data-filter="Episode" data-mini="true">
<label for="chkEpisode">Episode</label>
<input class="chkTypeFilter" type="checkbox" id="chkArtist" data-filter="MusicArtist" data-mini="true">
<label for="chkArtist">Artist</label>
<input class="chkTypeFilter" type="checkbox" id="chkAlbum" data-filter="MusicAlbum" data-mini="true">
<label for="chkAlbum">Album</label>
<input class="chkTypeFilter" type="checkbox" id="chkSong" data-filter="Audio" data-mini="true">
<label for="chkSong">Song</label>
<input class="chkTypeFilter" type="checkbox" id="chkBook" data-filter="Book" data-mini="true">
<label for="chkBook">Book</label>
<input class="chkTypeFilter" type="checkbox" id="chkGame" data-filter="Game" data-mini="true">
<label for="chkGame">Game</label>
</fieldset>
<fieldset data-role="controlgroup">
<legend>
<strong>Video Type:</strong>
</legend>
<input class="chkVideoTypeFilter" type="checkbox" name="chkBluray" id="chkBluray" data-filter="Bluray" data-mini="true">
<label for="chkBluray">Bluray</label>
<input class="chkVideoTypeFilter" type="checkbox" name="chkDvd" id="chkDvd" data-filter="Dvd" data-mini="true">
<label for="chkDvd">Dvd</label>
<input class="chkVideoTypeFilter" type="checkbox" name="chkIso" id="chkIso" data-filter="Iso" data-mini="true">
<label for="chkIso">Iso</label>
<input class="chkHDFilter" type="checkbox" name="chkHD" id="chkHD" data-filter="IsHD" data-mini="true">
<label for="chkHD">HD</label>
<input class="chkSDFilter" type="checkbox" name="chkSD" id="chkSD" data-filter="IsHD" data-mini="true">
<label for="chkSD">SD</label>
<input class="chk3DFilter" type="checkbox" name="chk3D" id="chk3D" data-filter="Digital3D,Sbs3D" data-mini="true">
<label for="chk3D">3D</label>
</fieldset>
</div>
<div class="advancedFilters" style="display: none;">
<fieldset data-role="controlgroup">
<legend>
<strong>Management:</strong>
</legend>
<input class="chkMissingOverview" type="checkbox" name="chkMissingOverview" id="chkMissingOverview" data-mini="true">
<label for="chkMissingOverview">Missing Overview</label>
<input class="chkYearMismatch" type="checkbox" name="chkYearMismatch" id="chkYearMismatch" data-mini="true">
<label for="chkYearMismatch">File/Metadata Years Mismatched</label>
</fieldset>
<fieldset data-role="controlgroup">
<legend>
<strong>Features:</strong>
</legend>
<input class="chkFeatureFilter" type="checkbox" name="chkSubtitle" id="chkSubtitle" data-mini="true">
<label for="chkSubtitle">Subtitles</label>
<input class="chkFeatureFilter" type="checkbox" name="chkTrailer" id="chkTrailer" data-mini="true">
<label for="chkTrailer">Trailer</label>
<input class="chkFeatureFilter" type="checkbox" name="chkSpecialFeature" id="chkSpecialFeature" data-mini="true">
<label for="chkSpecialFeature">Special features</label>
<input class="chkFeatureFilter" type="checkbox" name="chkThemeSong" id="chkThemeSong" data-mini="true">
<label for="chkThemeSong">Theme song</label>
<input class="chkFeatureFilter" type="checkbox" name="chkThemeVideo" id="chkThemeVideo" data-mini="true">
<label for="chkThemeVideo">Theme video</label>
</fieldset>
</div>
</form>
</div>
</div>
</body>
</html>

View File

@ -538,6 +538,15 @@
$('.libraryTree', page).on('itemclicked', function (event, data) { $('.libraryTree', page).on('itemclicked', function (event, data) {
if (data.itemType == "libraryreport") {
Dashboard.navigate('libraryreport.html');
return;
}
if (data.itemType == "livetvservice") {
return;
}
if (data.id != currentItem.Id) { if (data.id != currentItem.Id) {
MetadataEditor.currentItemId = data.id; MetadataEditor.currentItemId = data.id;

View File

@ -1155,6 +1155,11 @@
$('.libraryTree', page).on('itemclicked', function (event, data) { $('.libraryTree', page).on('itemclicked', function (event, data) {
if (data.itemType == "libraryreport") {
Dashboard.navigate('libraryreport.html');
return;
}
if (data.itemType == "livetvservice") { if (data.itemType == "livetvservice") {
return; return;
} }

View File

@ -254,6 +254,15 @@
$('.libraryTree', page).on('itemclicked', function (event, data) { $('.libraryTree', page).on('itemclicked', function (event, data) {
if (data.itemType == "libraryreport") {
Dashboard.navigate('libraryreport.html');
return;
}
if (data.itemType == "livetvservice") {
return;
}
if (data.id != currentItem.Id) { if (data.id != currentItem.Id) {
MetadataEditor.currentItemId = data.id; MetadataEditor.currentItemId = data.id;
MetadataEditor.currentItemName = data.itemName; MetadataEditor.currentItemName = data.itemName;

View File

@ -106,6 +106,8 @@
nodes.push({ attr: { id: name, rel: 'folder', itemtype: 'livetvservice' }, data: htmlName, state: 'closed' }); nodes.push({ attr: { id: name, rel: 'folder', itemtype: 'livetvservice' }, data: htmlName, state: 'closed' });
} }
nodes.push({ attr: { id: 'libraryreport', rel: 'default', itemtype: 'libraryreport' }, data: 'Library List' });
callback(nodes); callback(nodes);
}); });
@ -141,6 +143,11 @@
var itemtype = node.attr("itemtype"); var itemtype = node.attr("itemtype");
if (itemtype == 'libraryreport') {
return;
}
if (itemtype == 'livetvservice') { if (itemtype == 'livetvservice') {
loadLiveTvChannels(id, openItems, callback); loadLiveTvChannels(id, openItems, callback);

View File

@ -1760,7 +1760,8 @@
if (item.Status == "Continuing") { if (item.Status == "Continuing") {
miscInfo.push(item.ProductionYear + "-Present"); miscInfo.push(item.ProductionYear + "-Present");
} else if (item.ProductionYear) { }
else if (item.ProductionYear) {
text = item.ProductionYear; text = item.ProductionYear;

View File

@ -0,0 +1,391 @@
(function ($, document, window) {
// The base query options
var query = {
SortBy: "SeriesSortName,SortName",
SortOrder: "Ascending",
Recursive: true,
Fields: "",
StartIndex: 0
};
function getFriendlyTypeName(type) {
if (type == "MusicArtist") {
return "Artist";
}
if (type == "MusicAlbum") {
return "Album";
}
if (type == "Audio") {
return "Song";
}
if (type == "BoxSet") {
return "Collection";
}
return type;
}
function getTableRowsHtml(items) {
var html = '';
for (var i = 0, length = items.length; i < length; i++) {
var item = items[i];
html += '<tr>';
html += '<td>';
if (item.IsUnidentified) {
html += '<div class="libraryReportIndicator"><div class="ui-icon-alert ui-btn-icon-notext"></div></div>';
}
html += '</td>';
html += '<td>';
if (item.SeriesName) {
html += '<a href="itemdetails.html?id=' + item.SeriesId + '">' + item.SeriesName + '</a>';
}
else if (item.Album) {
html += item.Album + '<br/>';
}
else if (item.AlbumArtist) {
html += item.AlbumArtist + '<br/>';
}
else {
html += '&nbsp;';
}
html += '</td>';
html += '<td>';
html += '<a href="' + LibraryBrowser.getHref(item) + '">' + LibraryBrowser.getPosterViewDisplayName(item, false, true) + '</a>';
html += '</td>';
html += '<td>';
html += getFriendlyTypeName(item.Type);
html += '</td>';
html += '<td>';
if (item.PremiereDate && item.Type != "Series") {
try {
var date = parseISO8601Date(item.PremiereDate, { toLocal: true });
html += date.toLocaleDateString();
}
catch (e) {
html += '&nbsp;';
}
}
else if (item.ProductionYear) {
html += item.ProductionYear;
if (item.Status == "Continuing") {
html += "-Present";
}
else if (item.EndDate) {
try {
var endYear = parseISO8601Date(item.EndDate, { toLocal: true }).getFullYear();
if (endYear != item.ProductionYear) {
html += "-" + parseISO8601Date(item.EndDate, { toLocal: true }).getFullYear();
}
}
catch (e) {
console.log("Error parsing date: " + item.EndDate);
}
}
} else {
html += '&nbsp;';
}
html += '</td>';
html += '<td>';
html += item.OfficialRating || '&nbsp;';
html += '</td>';
html += '<td>';
if (item.RunTimeTicks) {
html += Dashboard.getDisplayTime(item.RunTimeTicks);
} else {
html += '&nbsp;';
}
html += '</td>';
html += '<td>';
if (item.SpecialFeatureCount == 1) {
html += '1 Special<br/>';
}
else if (item.SpecialFeatureCount) {
html += item.SpecialFeatureCount + ' Specials<br/>';
}
if (item.LocalTrailerCount == 1) {
html += '1 Trailer<br/>';
}
else if (item.LocalTrailerCount) {
html += item.LocalTrailerCount + ' Trailers<br/>';
}
html += '</td>';
html += '</tr>';
}
return html;
}
function renderItems(page, result) {
// Scroll back up so they can see the results from the beginning
$(document).scrollTop(0);
$('.listTopPaging', page).html(LibraryBrowser.getPagingHtml(query, result.TotalRecordCount, true)).trigger('create');
updateFilterControls(page);
$('.listBottomPaging', page).html(LibraryBrowser.getPagingHtml(query, result.TotalRecordCount)).trigger('create');
$('.resultBody', page).html(getTableRowsHtml(result.Items)).parents('.tblLibraryReport').table("refresh").trigger('create');
$('.btnNextPage', page).on('click', function () {
query.StartIndex += query.Limit;
reloadItems(page);
});
$('.btnPreviousPage', page).on('click', function () {
query.StartIndex -= query.Limit;
reloadItems(page);
});
$('.selectPageSize', page).on('change', function () {
query.Limit = parseInt(this.value);
query.StartIndex = 0;
reloadItems(page);
});
}
function reloadItems(page) {
var url = ApiClient.getUrl("Items", query);
$.getJSON(url).done(function (result) {
renderItems(page, result);
});
}
function updateFilterControls(page) {
$('.chkTypeFilter', page).each(function () {
var filters = "," + (query.IncludeItemTypes || "");
var filterName = this.getAttribute('data-filter');
this.checked = filters.indexOf(',' + filterName) != -1;
}).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');
$('#chkHD', page).checked(query.IsHD == true).checkboxradio('refresh');
$('#chkSD', page).checked(query.IsHD == false).checkboxradio('refresh');
$('#chkSubtitle', page).checked(query.HasSubtitles == true).checkboxradio('refresh');
$('#chkTrailer', page).checked(query.HasTrailer == true).checkboxradio('refresh');
$('#chkSpecialFeature', page).checked(query.HasSpecialFeature == true).checkboxradio('refresh');
$('#chkThemeSong', page).checked(query.HasThemeSong == true).checkboxradio('refresh');
$('#chkThemeVideo', page).checked(query.HasThemeVideo == true).checkboxradio('refresh');
$('#chkMissingOverview', page).checked(query.HasOverview == false).checkboxradio('refresh');
$('#chkYearMismatch', page).checked(query.IsYearMismatched == true).checkboxradio('refresh');
}
$(document).on('pageinit', "#libraryReportPage", function () {
var page = this;
$('.libraryTree', page).on('itemclicked', function (event, data) {
if (data.itemType == "libraryreport") {
return;
}
if (data.itemType == "livetvservice") {
return;
}
Dashboard.navigate('edititemmetadata.html?id=' + data.id);
});
$('#radioBasicFilters', page).on('change', function () {
if (this.checked) {
$('.basicFilters', page).show();
$('.advancedFilters', page).hide();
} else {
$('.basicFilters', page).hide();
}
});
$('#radioAdvancedFilters', page).on('change', function () {
if (this.checked) {
$('.advancedFilters', page).show();
$('.basicFilters', page).hide();
} else {
$('.advancedFilters', page).hide();
}
});
$('.chkTypeFilter', page).on('change', function () {
var filterName = this.getAttribute('data-filter');
var filters = query.IncludeItemTypes || "";
filters = (',' + filters).replace(',' + filterName, '').substring(1);
if (this.checked) {
filters = filters ? (filters + ',' + filterName) : filterName;
}
query.StartIndex = 0;
query.IncludeItemTypes = filters;
reloadItems(page);
});
$('.chkVideoTypeFilter', page).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', page).on('change', function () {
query.StartIndex = 0;
query.Is3D = this.checked ? true : null;
reloadItems(page);
});
$('#chkHD', page).on('change', function () {
query.StartIndex = 0;
query.IsHD = this.checked ? true : null;
reloadItems(page);
});
$('#chkSD', page).on('change', function () {
query.StartIndex = 0;
query.IsHD = this.checked ? false : null;
reloadItems(page);
});
$('#chkSubtitle', page).on('change', function () {
query.StartIndex = 0;
query.HasSubtitles = this.checked ? true : null;
reloadItems(page);
});
$('#chkTrailer', page).on('change', function () {
query.StartIndex = 0;
query.HasTrailer = this.checked ? true : null;
reloadItems(page);
});
$('#chkSpecialFeature', page).on('change', function () {
query.StartIndex = 0;
query.HasSpecialFeature = this.checked ? true : null;
reloadItems(page);
});
$('#chkThemeSong', page).on('change', function () {
query.StartIndex = 0;
query.HasThemeSong = this.checked ? true : null;
reloadItems(page);
});
$('#chkThemeVideo', page).on('change', function () {
query.StartIndex = 0;
query.HasThemeVideo = this.checked ? true : null;
reloadItems(page);
});
$('#chkMissingOverview', page).on('change', function () {
query.StartIndex = 0;
query.HasOverview = this.checked ? false : null;
reloadItems(page);
});
$('#chkYearMismatch', page).on('change', function () {
query.StartIndex = 0;
query.IsYearMismatched = this.checked ? true : null;
reloadItems(page);
});
}).on('pagebeforeshow', "#libraryReportPage", function () {
var page = this;
var limit = LibraryBrowser.getDefaultPageSize();
// If the default page size has changed, the start index will have to be reset
if (limit != query.Limit) {
query.Limit = limit;
query.StartIndex = 0;
}
reloadItems(page);
}).on('pageshow', "#libraryReportPage", function () {
updateFilterControls(this);
});
})(jQuery, document, window);

View File

@ -176,24 +176,6 @@
reloadItems(page); 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);
});
$('#selectView', this).on('change', function () { $('#selectView', this).on('change', function () {
view = this.value; view = this.value;
@ -212,6 +194,23 @@
LibraryBrowser.saveViewSetting('movies', view); LibraryBrowser.saveViewSetting('movies', view);
}); });
$('.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 () { $('#chk3D', this).on('change', function () {
query.StartIndex = 0; query.StartIndex = 0;