mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
update detail screens
This commit is contained in:
Luke Pulverenti
parent
7b42686295
commit
f5323ff3c2
34 changed files with 682 additions and 658 deletions
|
|
@ -1,345 +1,299 @@
|
|||
(function ($, document, LibraryBrowser) {
|
||||
|
||||
var currentItem;
|
||||
var shape;
|
||||
var _childrenItemsFunction;
|
||||
function renderItems(page, item) {
|
||||
|
||||
function getPromise() {
|
||||
|
||||
var id = getParameterByName('id');
|
||||
|
||||
if (id) {
|
||||
return ApiClient.getItem(Dashboard.getCurrentUserId(), id);
|
||||
}
|
||||
|
||||
var name = getParameterByName('genre');
|
||||
|
||||
if (name) {
|
||||
return ApiClient.getGenre(name, Dashboard.getCurrentUserId());
|
||||
}
|
||||
|
||||
name = getParameterByName('musicgenre');
|
||||
|
||||
if (name) {
|
||||
return ApiClient.getMusicGenre(name, Dashboard.getCurrentUserId());
|
||||
}
|
||||
|
||||
name = getParameterByName('gamegenre');
|
||||
|
||||
if (name) {
|
||||
return ApiClient.getGameGenre(name, Dashboard.getCurrentUserId());
|
||||
}
|
||||
|
||||
name = getParameterByName('musicartist');
|
||||
|
||||
if (name) {
|
||||
return ApiClient.getArtist(name, Dashboard.getCurrentUserId());
|
||||
}
|
||||
else {
|
||||
throw new Error('Invalid request');
|
||||
}
|
||||
}
|
||||
|
||||
function reload(page) {
|
||||
|
||||
Dashboard.showLoadingMsg();
|
||||
|
||||
getPromise().done(function (item) {
|
||||
|
||||
var context = getParameterByName('context');
|
||||
|
||||
var editQuery = '?id=' + item.Id;
|
||||
|
||||
currentItem = item;
|
||||
|
||||
LibraryMenu.setTitle(item.Name);
|
||||
Backdrops.setBackdrops(page, [item]);
|
||||
|
||||
var name = item.Name;
|
||||
|
||||
Dashboard.setPageTitle(name);
|
||||
|
||||
$('.itemName', page).html(name);
|
||||
|
||||
renderDetails(page, item, context);
|
||||
renderTabs(page, item, context);
|
||||
|
||||
$(page).trigger('displayingitem', [{
|
||||
|
||||
item: item,
|
||||
context: context
|
||||
}]);
|
||||
|
||||
Dashboard.getCurrentUser().done(function (user) {
|
||||
|
||||
if (MediaController.canPlay(item)) {
|
||||
$('.btnPlay', page).visible(true);
|
||||
} else {
|
||||
$('.btnPlay', page).visible(false);
|
||||
}
|
||||
|
||||
if (SyncManager.isAvailable(item, user)) {
|
||||
$('.btnSync', page).removeClass('hide');
|
||||
} else {
|
||||
$('.btnSync', page).addClass('hide');
|
||||
}
|
||||
|
||||
var editImagesHref = user.Policy.IsAdministrator ? 'edititemmetadata.html' + (editQuery + "&tab=3") : null;
|
||||
|
||||
$('#itemImage', page).html(LibraryBrowser.getDetailImageHtml(item, editImagesHref, true));
|
||||
|
||||
if (LibraryBrowser.getMoreCommands(item, user).length) {
|
||||
$('.btnMoreCommands', page).visible(true);
|
||||
} else {
|
||||
$('.btnMoreCommands', page).visible(false);
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
Dashboard.hideLoadingMsg();
|
||||
});
|
||||
}
|
||||
|
||||
function renderTabs(page, item, context) {
|
||||
|
||||
var html = '<fieldset data-role="controlgroup" data-type="horizontal" class="libraryTabs">';
|
||||
|
||||
html += '<legend></legend>';
|
||||
var sections = [];
|
||||
|
||||
if (item.MovieCount) {
|
||||
|
||||
html += '<input type="radio" name="ibnItems" id="radioMovies" class="context-movies" value="on">';
|
||||
html += '<label for="radioMovies">' + Globalize.translate('TabMovies') + '</label>';
|
||||
sections.push({
|
||||
name: Globalize.translate('TabMovies'),
|
||||
type: 'Movie'
|
||||
});
|
||||
}
|
||||
|
||||
if (item.SeriesCount) {
|
||||
|
||||
html += '<input type="radio" name="ibnItems" id="radioShows" class="context-tv" value="on">';
|
||||
html += '<label for="radioShows">' + Globalize.translate('TabSeries') + '</label>';
|
||||
sections.push({
|
||||
name: Globalize.translate('TabSeries'),
|
||||
type: 'Series'
|
||||
});
|
||||
}
|
||||
|
||||
if (item.EpisodeCount) {
|
||||
|
||||
html += '<input type="radio" name="ibnItems" id="radioEpisodes" class="context-tv" value="on">';
|
||||
html += '<label for="radioEpisodes">' + Globalize.translate('TabEpisodes') + '</label>';
|
||||
sections.push({
|
||||
name: Globalize.translate('TabEpisodes'),
|
||||
type: 'Episode'
|
||||
});
|
||||
}
|
||||
|
||||
if (item.TrailerCount) {
|
||||
|
||||
html += '<input type="radio" name="ibnItems" id="radioTrailers" class="context-movies" value="on">';
|
||||
html += '<label for="radioTrailers">' + Globalize.translate('TabTrailers') + '</label>';
|
||||
sections.push({
|
||||
name: Globalize.translate('TabTrailers'),
|
||||
type: 'Trailer'
|
||||
});
|
||||
}
|
||||
|
||||
if (item.GameCount) {
|
||||
|
||||
html += '<input type="radio" name="ibnItems" id="radioGames" class="context-games" value="on">';
|
||||
html += '<label for="radioGames">' + Globalize.translate('TabGames') + '</label>';
|
||||
sections.push({
|
||||
name: Globalize.translate('TabGames'),
|
||||
type: 'Game'
|
||||
});
|
||||
}
|
||||
|
||||
if (item.AlbumCount) {
|
||||
|
||||
html += '<input type="radio" name="ibnItems" id="radioAlbums" class="context-music" value="on">';
|
||||
html += '<label for="radioAlbums">' + Globalize.translate('TabAlbums') + '</label>';
|
||||
sections.push({
|
||||
name: Globalize.translate('TabAlbums'),
|
||||
type: 'MusicAlbum'
|
||||
});
|
||||
}
|
||||
|
||||
if (item.SongCount) {
|
||||
|
||||
html += '<input type="radio" name="ibnItems" id="radioSongs" class="context-music" value="on">';
|
||||
html += '<label for="radioSongs">' + Globalize.translate('TabSongs') + '</label>';
|
||||
sections.push({
|
||||
name: Globalize.translate('TabSongs'),
|
||||
type: 'Audio'
|
||||
});
|
||||
}
|
||||
|
||||
if (item.MusicVideoCount) {
|
||||
|
||||
html += '<input type="radio" name="ibnItems" id="radioMusicVideos" class="context-music" value="on">';
|
||||
html += '<label for="radioMusicVideos">' + Globalize.translate('TabMusicVideos') + '</label>';
|
||||
sections.push({
|
||||
name: Globalize.translate('TabMusicVideos'),
|
||||
type: 'MusicVideo'
|
||||
});
|
||||
}
|
||||
|
||||
html += '</fieldset>';
|
||||
var elem = page.querySelector('#childrenContent');
|
||||
|
||||
var elem = $('#itemTabs', page).html(html).trigger('create');
|
||||
elem.innerHTML = sections.map(function (section) {
|
||||
|
||||
bindRadioEvents(page);
|
||||
var html = '';
|
||||
|
||||
var selectedRadio = null;
|
||||
html += '<div class="homePageSection" data-type="' + section.type + '">';
|
||||
|
||||
if (context) {
|
||||
selectedRadio = $('.context-' + context + ':first', elem);
|
||||
html += '<div>';
|
||||
html += '<h1 class="listHeader" style="display:inline-block;vertical-align:middle;">';
|
||||
html += section.name;
|
||||
html += '</h1>';
|
||||
html += '<a href="#" class="clearLink hide" style="margin-left:1em;vertical-align:middle;"><paper-button raised class="more mini noIcon">' + Globalize.translate('ButtonMore') + '</paper-button></a>';
|
||||
html += '</div>';
|
||||
|
||||
html += '<div class="itemsContainer">';
|
||||
html += '</div>';
|
||||
|
||||
html += '</div>';
|
||||
|
||||
return html;
|
||||
|
||||
}).join('');
|
||||
|
||||
var sectionElems = elem.querySelectorAll('.homePageSection');
|
||||
for (var i = 0, length = sectionElems.length; i < length; i++) {
|
||||
renderSection(page, item, sectionElems[i], sectionElems[i].getAttribute('data-type'));
|
||||
}
|
||||
|
||||
if (selectedRadio && selectedRadio.length) {
|
||||
selectedRadio.attr("checked", "checked").checkboxradio("refresh").trigger('click');
|
||||
} else {
|
||||
$('input:first', elem).attr("checked", "checked").checkboxradio("refresh").trigger('click');
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function bindRadioEvents(page) {
|
||||
function renderSection(page, item, element, type) {
|
||||
|
||||
$("#radioMusicVideos", page).on("click", function () {
|
||||
switch (type) {
|
||||
|
||||
shape = "poster";
|
||||
loadItems(page, {
|
||||
MediaTypes: "",
|
||||
IncludeItemTypes: "MusicVideo",
|
||||
PersonTypes: "",
|
||||
ArtistIds: ""
|
||||
});
|
||||
case 'Movie':
|
||||
loadItems(element, item, type, {
|
||||
MediaTypes: "",
|
||||
IncludeItemTypes: "Movie",
|
||||
PersonTypes: "",
|
||||
ArtistIds: "",
|
||||
Limit: 10
|
||||
}, {
|
||||
shape: "detailPagePortrait",
|
||||
showTitle: true,
|
||||
centerText: true,
|
||||
overlayPlayButton: true
|
||||
});
|
||||
break;
|
||||
|
||||
});
|
||||
case 'MusicVideo':
|
||||
loadItems(element, item, type, {
|
||||
MediaTypes: "",
|
||||
IncludeItemTypes: "MusicVideo",
|
||||
PersonTypes: "",
|
||||
ArtistIds: "",
|
||||
Limit: 10
|
||||
}, {
|
||||
shape: "detailPagePortrait",
|
||||
showTitle: true,
|
||||
centerText: true,
|
||||
overlayPlayButton: true
|
||||
});
|
||||
break;
|
||||
|
||||
$("#radioMovies", page).on("click", function () {
|
||||
case 'Game':
|
||||
loadItems(element, item, type, {
|
||||
MediaTypes: "",
|
||||
IncludeItemTypes: "Game",
|
||||
PersonTypes: "",
|
||||
ArtistIds: "",
|
||||
Limit: 10
|
||||
}, {
|
||||
shape: "detailPagePortrait",
|
||||
showTitle: true,
|
||||
centerText: true
|
||||
});
|
||||
break;
|
||||
|
||||
shape = "poster";
|
||||
loadItems(page, {
|
||||
MediaTypes: "",
|
||||
IncludeItemTypes: "Movie",
|
||||
PersonTypes: "",
|
||||
ArtistIds: ""
|
||||
});
|
||||
case 'Trailer':
|
||||
loadItems(element, item, type, {
|
||||
MediaTypes: "",
|
||||
IncludeItemTypes: "Trailer",
|
||||
PersonTypes: "",
|
||||
ArtistIds: "",
|
||||
Limit: 10
|
||||
}, {
|
||||
shape: "detailPagePortrait",
|
||||
showTitle: true,
|
||||
centerText: true,
|
||||
overlayPlayButton: true
|
||||
});
|
||||
break;
|
||||
|
||||
});
|
||||
case 'Series':
|
||||
loadItems(element, item, type, {
|
||||
MediaTypes: "",
|
||||
IncludeItemTypes: "Series",
|
||||
PersonTypes: "",
|
||||
ArtistIds: "",
|
||||
Limit: 10
|
||||
}, {
|
||||
shape: "detailPagePortrait",
|
||||
showTitle: true,
|
||||
centerText: true
|
||||
});
|
||||
break;
|
||||
|
||||
$("#radioShows", page).on("click", function () {
|
||||
case 'MusicAlbum':
|
||||
loadItems(element, item, type, {
|
||||
MediaTypes: "",
|
||||
IncludeItemTypes: "MusicAlbum",
|
||||
PersonTypes: "",
|
||||
ArtistIds: "",
|
||||
Limit: 8
|
||||
}, {
|
||||
shape: "detailPageSquare",
|
||||
playFromHere: true,
|
||||
showTitle: true,
|
||||
showParentTitle: true,
|
||||
centerText: true,
|
||||
overlayPlayButton: true
|
||||
});
|
||||
break;
|
||||
|
||||
shape = "poster";
|
||||
loadItems(page, {
|
||||
MediaTypes: "",
|
||||
IncludeItemTypes: "Series",
|
||||
PersonTypes: "",
|
||||
ArtistIds: ""
|
||||
});
|
||||
});
|
||||
case 'Episode':
|
||||
loadItems(element, item, type, {
|
||||
MediaTypes: "",
|
||||
IncludeItemTypes: "Episode",
|
||||
PersonTypes: "",
|
||||
ArtistIds: "",
|
||||
Limit: 6
|
||||
}, {
|
||||
shape: "detailPage169",
|
||||
showTitle: true,
|
||||
showParentTitle: true,
|
||||
centerText: true,
|
||||
overlayPlayButton: true
|
||||
});
|
||||
break;
|
||||
|
||||
$("#radioTrailers", page).on("click", function () {
|
||||
case 'Audio':
|
||||
loadItems(element, item, type, {
|
||||
MediaTypes: "",
|
||||
IncludeItemTypes: "Audio",
|
||||
PersonTypes: "",
|
||||
ArtistIds: "",
|
||||
Limit: 100
|
||||
}, {
|
||||
playFromHere: true,
|
||||
defaultAction: 'playallfromhere',
|
||||
smallIcon: true
|
||||
});
|
||||
break;
|
||||
|
||||
shape = "poster";
|
||||
loadItems(page, {
|
||||
MediaTypes: "",
|
||||
IncludeItemTypes: "Trailer",
|
||||
PersonTypes: "",
|
||||
ArtistIds: ""
|
||||
});
|
||||
});
|
||||
|
||||
$("#radioGames", page).on("click", function () {
|
||||
|
||||
shape = "poster";
|
||||
loadItems(page, {
|
||||
IncludeItemTypes: "",
|
||||
MediaTypes: "Game",
|
||||
PersonTypes: "",
|
||||
ArtistIds: ""
|
||||
});
|
||||
});
|
||||
|
||||
$("#radioEpisodes", page).on("click", function () {
|
||||
|
||||
shape = "backdrop";
|
||||
loadItems(page, {
|
||||
MediaTypes: "",
|
||||
IncludeItemTypes: "Episode",
|
||||
PersonTypes: "",
|
||||
ArtistIds: ""
|
||||
});
|
||||
});
|
||||
|
||||
$("#radioAlbums", page).on("click", function () {
|
||||
|
||||
shape = "square";
|
||||
loadItems(page, {
|
||||
MediaTypes: "",
|
||||
IncludeItemTypes: "MusicAlbum",
|
||||
PersonTypes: "",
|
||||
ArtistIds: ""
|
||||
});
|
||||
});
|
||||
|
||||
$("#radioSongs", page).on("click", function () {
|
||||
|
||||
loadItems(page, {
|
||||
MediaTypes: "",
|
||||
IncludeItemTypes: "Audio",
|
||||
PersonTypes: "",
|
||||
ArtistIds: ""
|
||||
});
|
||||
});
|
||||
default:
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
function renderDetails(page, item, context) {
|
||||
function loadItems(element, item, type, query, listOptions) {
|
||||
|
||||
//LibraryBrowser.renderDetailPageBackdrop(page, item);
|
||||
LibraryBrowser.renderOverview(page.querySelectorAll('.itemOverview'), item);
|
||||
query = getQuery(query, item);
|
||||
|
||||
renderUserDataIcons(page, item);
|
||||
LibraryBrowser.renderLinks(page.querySelector('#itemLinks'), item);
|
||||
getItemsFunction(query, item)(query.StartIndex, query.Limit, query.Fields).done(function (result) {
|
||||
|
||||
LibraryBrowser.renderGenres($('.itemGenres', page), item, context);
|
||||
var html = '';
|
||||
|
||||
if (item.Type == "Person" && item.PremiereDate) {
|
||||
|
||||
try {
|
||||
var birthday = parseISO8601Date(item.PremiereDate, { toLocal: true }).toDateString();
|
||||
|
||||
$('#itemBirthday', page).show().html(Globalize.translate('BirthDateValue').replace('{0}', birthday));
|
||||
if (query.Limit && result.TotalRecordCount > query.Limit) {
|
||||
// Add more button
|
||||
var link = element.querySelector('a');
|
||||
link.classList.remove('hide');
|
||||
link.setAttribute('href', getMoreItemsHref(item, type));
|
||||
} else {
|
||||
element.querySelector('a').classList.add('hide');
|
||||
}
|
||||
catch (err) {
|
||||
$('#itemBirthday', page).hide();
|
||||
|
||||
listOptions.items = result.Items;
|
||||
var trigger = false;
|
||||
|
||||
if (type == 'Audio') {
|
||||
html = LibraryBrowser.getListViewHtml(listOptions);
|
||||
trigger = true;
|
||||
} else {
|
||||
html = LibraryBrowser.getPosterViewHtml(listOptions);
|
||||
}
|
||||
} else {
|
||||
$('#itemBirthday', page).hide();
|
||||
|
||||
var itemsContainer = element.querySelector('.itemsContainer');
|
||||
itemsContainer.innerHTML = html;
|
||||
|
||||
$(itemsContainer).createCardMenus();
|
||||
|
||||
if (trigger) {
|
||||
$(itemsContainer).trigger('create');
|
||||
}
|
||||
ImageLoader.lazyChildren(itemsContainer);
|
||||
});
|
||||
}
|
||||
|
||||
function getMoreItemsHref(item, type) {
|
||||
|
||||
return 'secondaryitems.html?type=' + type + '&parentid=' + item.Id;
|
||||
}
|
||||
|
||||
function addCurrentItemToQuery(query, item) {
|
||||
|
||||
if (item.Type == "Person") {
|
||||
query.PersonIds = item.Id;
|
||||
}
|
||||
|
||||
if (item.Type == "Person" && item.EndDate) {
|
||||
|
||||
try {
|
||||
var deathday = parseISO8601Date(item.EndDate, { toLocal: true }).toDateString();
|
||||
|
||||
$('#itemDeathDate', page).show().html(Globalize.translate('DeathDateValue').replace('{0}', deathday));
|
||||
}
|
||||
catch (err) {
|
||||
$('#itemBirthday', page).hide();
|
||||
}
|
||||
} else {
|
||||
else if (item.Type == "Genre") {
|
||||
query.Genres = item.Name;
|
||||
}
|
||||
|
||||
if (item.Type == "Person" && item.ProductionLocations && item.ProductionLocations.length) {
|
||||
|
||||
var gmap = '<a class="textlink" target="_blank" href="https://maps.google.com/maps?q=' + item.ProductionLocations[0] + '">' + item.ProductionLocations[0] + '</a>';
|
||||
|
||||
$('#itemBirthLocation', page).show().html(Globalize.translate('BirthPlaceValue').replace('{0}', gmap)).trigger('create');
|
||||
} else {
|
||||
$('#itemBirthLocation', page).hide();
|
||||
else if (item.Type == "MusicGenre") {
|
||||
query.Genres = item.Name;
|
||||
}
|
||||
else if (item.Type == "GameGenre") {
|
||||
query.Genres = item.Name;
|
||||
}
|
||||
else if (item.Type == "Studio") {
|
||||
query.StudioIds = item.Id;
|
||||
}
|
||||
else if (item.Type == "MusicArtist") {
|
||||
query.ArtistIds = item.Id;
|
||||
}
|
||||
}
|
||||
|
||||
function renderUserDataIcons(page, item) {
|
||||
$('.userDataIcons', page).html(LibraryBrowser.getUserDataIconsHtml(item));
|
||||
}
|
||||
|
||||
function addCurrentItemToQuery(query) {
|
||||
|
||||
if (currentItem.Type == "Person") {
|
||||
query.PersonIds = currentItem.Id;
|
||||
}
|
||||
else if (currentItem.Type == "Genre") {
|
||||
query.Genres = currentItem.Name;
|
||||
}
|
||||
else if (currentItem.Type == "MusicGenre") {
|
||||
query.Genres = currentItem.Name;
|
||||
}
|
||||
else if (currentItem.Type == "GameGenre") {
|
||||
query.Genres = currentItem.Name;
|
||||
}
|
||||
else if (currentItem.Type == "Studio") {
|
||||
query.StudioIds = currentItem.Id;
|
||||
}
|
||||
else if (currentItem.Type == "MusicArtist") {
|
||||
query.ArtistIds = currentItem.Id;
|
||||
}
|
||||
}
|
||||
|
||||
function getQuery(options) {
|
||||
function getQuery(options, item) {
|
||||
|
||||
var query = {
|
||||
|
||||
|
|
@ -359,14 +313,14 @@
|
|||
query.SortBy = "AlbumArtist,Album,SortName";
|
||||
}
|
||||
|
||||
addCurrentItemToQuery(query);
|
||||
addCurrentItemToQuery(query, item);
|
||||
|
||||
return query;
|
||||
}
|
||||
|
||||
function getItemsFunction(options) {
|
||||
function getItemsFunction(options, item) {
|
||||
|
||||
var query = getQuery(options);
|
||||
var query = getQuery(options, item);
|
||||
|
||||
return function (index, limit, fields) {
|
||||
|
||||
|
|
@ -383,187 +337,8 @@
|
|||
|
||||
}
|
||||
|
||||
function loadItems(page, options) {
|
||||
|
||||
Dashboard.showLoadingMsg();
|
||||
|
||||
_childrenItemsFunction = getItemsFunction(options);
|
||||
|
||||
var query = getQuery(options);
|
||||
|
||||
getItemsFunction(options)(options.StartIndex, options.Limit, options.Fields).done(function (result) {
|
||||
|
||||
var html = '';
|
||||
|
||||
if (result.TotalRecordCount > query.Limit) {
|
||||
|
||||
var pagingHtml = LibraryBrowser.getQueryPagingHtml({
|
||||
startIndex: query.StartIndex,
|
||||
limit: query.Limit,
|
||||
totalRecordCount: result.TotalRecordCount,
|
||||
showLimit: false,
|
||||
updatePageSizeSetting: false
|
||||
});
|
||||
|
||||
page.querySelector('.listTopPaging').innerHTML = pagingHtml;
|
||||
|
||||
$('.viewSettings', page).show();
|
||||
} else {
|
||||
$('.listTopPaging', page).html('');
|
||||
$('.viewSettings', page).hide();
|
||||
}
|
||||
|
||||
var screenWidth = $(window).width();
|
||||
|
||||
if (query.IncludeItemTypes == "Audio") {
|
||||
|
||||
html = "<div style='max-width:1000px;margin:auto;'>" + LibraryBrowser.getListViewHtml({
|
||||
items: result.Items,
|
||||
playFromHere: true,
|
||||
defaultAction: 'playallfromhere',
|
||||
smallIcon: true
|
||||
}) + "</div>";
|
||||
}
|
||||
else if (query.IncludeItemTypes == "Movie" || query.IncludeItemTypes == "Trailer") {
|
||||
|
||||
html = LibraryBrowser.getPosterViewHtml({
|
||||
items: result.Items,
|
||||
shape: "portrait",
|
||||
context: 'movies',
|
||||
showTitle: true,
|
||||
centerText: true
|
||||
});
|
||||
|
||||
}
|
||||
else if (query.IncludeItemTypes == "Episode") {
|
||||
|
||||
html += LibraryBrowser.getPosterViewHtml({
|
||||
items: result.Items,
|
||||
shape: "backdrop",
|
||||
showTitle: true,
|
||||
showParentTitle: true,
|
||||
overlayText: screenWidth >= 600
|
||||
});
|
||||
|
||||
}
|
||||
else if (query.IncludeItemTypes == "Series") {
|
||||
|
||||
html = LibraryBrowser.getPosterViewHtml({
|
||||
items: result.Items,
|
||||
shape: "backdrop",
|
||||
preferThumb: true,
|
||||
context: 'tv'
|
||||
});
|
||||
|
||||
}
|
||||
else if (query.IncludeItemTypes == "MusicAlbum") {
|
||||
|
||||
html = LibraryBrowser.getPosterViewHtml({
|
||||
items: result.Items,
|
||||
shape: "square",
|
||||
context: 'music',
|
||||
playFromHere: true,
|
||||
showTitle: true,
|
||||
showParentTitle: true
|
||||
});
|
||||
|
||||
}
|
||||
else {
|
||||
|
||||
html = "<div style='max-width:1000px;margin:auto;'>" + LibraryBrowser.getListViewHtml({
|
||||
items: result.Items,
|
||||
smallIcon: true
|
||||
}) + "</div>";
|
||||
}
|
||||
|
||||
html += LibraryBrowser.getQueryPagingHtml({
|
||||
startIndex: query.StartIndex,
|
||||
limit: query.Limit,
|
||||
totalRecordCount: result.TotalRecordCount,
|
||||
showLimit: false,
|
||||
updatePageSizeSetting: false
|
||||
});
|
||||
|
||||
var elem = page.querySelector('#items');
|
||||
elem.innerHTML = html;
|
||||
ImageLoader.lazyChildren(elem);
|
||||
|
||||
// Do we still need this?
|
||||
$(elem).trigger('create');
|
||||
|
||||
$('.btnNextPage', page).on('click', function () {
|
||||
|
||||
query.StartIndex = query.StartIndex + query.Limit;
|
||||
loadItems(page, query);
|
||||
});
|
||||
|
||||
$('.btnPreviousPage', page).on('click', function () {
|
||||
|
||||
query.StartIndex = query.StartIndex - query.Limit;
|
||||
loadItems(page, query);
|
||||
});
|
||||
|
||||
$('.selectPageSize', page).on('change', function () {
|
||||
query.Limit = parseInt(this.value);
|
||||
query.StartIndex = 0;
|
||||
loadItems(page, query);
|
||||
});
|
||||
|
||||
Dashboard.hideLoadingMsg();
|
||||
});
|
||||
}
|
||||
|
||||
$(document).on('pageinitdepends', "#itemByNameDetailPage", function () {
|
||||
|
||||
var page = this;
|
||||
|
||||
$('.btnPlay', page).on('click', function () {
|
||||
var userdata = currentItem.UserData || {};
|
||||
LibraryBrowser.showPlayMenu(this, currentItem.Id, currentItem.Type, false, "Audio", userdata.PlaybackPositionTicks);
|
||||
});
|
||||
|
||||
$('.itemsContainer', page).on('playallfromhere', function (e, index) {
|
||||
|
||||
LibraryBrowser.playAllFromHere(_childrenItemsFunction, index);
|
||||
|
||||
}).on('queueallfromhere', function (e, index) {
|
||||
|
||||
LibraryBrowser.queueAllFromHere(_childrenItemsFunction, index);
|
||||
|
||||
});
|
||||
|
||||
$('.btnMoreCommands', page).on('click', function () {
|
||||
|
||||
var button = this;
|
||||
|
||||
Dashboard.getCurrentUser().done(function (user) {
|
||||
|
||||
LibraryBrowser.showMoreCommands(button, currentItem.Id, LibraryBrowser.getMoreCommands(currentItem, user));
|
||||
});
|
||||
});
|
||||
|
||||
$('.btnSync', page).on('click', function () {
|
||||
|
||||
SyncManager.showMenu({
|
||||
items: [currentItem]
|
||||
});
|
||||
});
|
||||
|
||||
var btnMore = page.querySelectorAll('.btnMoreCommands iron-icon');
|
||||
for (var i = 0, length = btnMore.length; i < length; i++) {
|
||||
btnMore[i].icon = AppInfo.moreIcon;
|
||||
}
|
||||
|
||||
}).on('pagebeforeshowready', "#itemByNameDetailPage", function () {
|
||||
|
||||
var page = this;
|
||||
|
||||
reload(page);
|
||||
|
||||
}).on('pagebeforehide', "#itemByNameDetailPage", function () {
|
||||
|
||||
currentItem = null;
|
||||
});
|
||||
|
||||
window.ItemsByName = {
|
||||
renderItems: renderItems
|
||||
};
|
||||
|
||||
})(jQuery, document, LibraryBrowser);
|
||||
|
|
@ -2,13 +2,47 @@
|
|||
|
||||
var currentItem;
|
||||
|
||||
function reload(page) {
|
||||
function getPromise() {
|
||||
|
||||
var id = getParameterByName('id');
|
||||
|
||||
if (id) {
|
||||
return ApiClient.getItem(Dashboard.getCurrentUserId(), id);
|
||||
}
|
||||
|
||||
var name = getParameterByName('genre');
|
||||
|
||||
if (name) {
|
||||
return ApiClient.getGenre(name, Dashboard.getCurrentUserId());
|
||||
}
|
||||
|
||||
name = getParameterByName('musicgenre');
|
||||
|
||||
if (name) {
|
||||
return ApiClient.getMusicGenre(name, Dashboard.getCurrentUserId());
|
||||
}
|
||||
|
||||
name = getParameterByName('gamegenre');
|
||||
|
||||
if (name) {
|
||||
return ApiClient.getGameGenre(name, Dashboard.getCurrentUserId());
|
||||
}
|
||||
|
||||
name = getParameterByName('musicartist');
|
||||
|
||||
if (name) {
|
||||
return ApiClient.getArtist(name, Dashboard.getCurrentUserId());
|
||||
}
|
||||
else {
|
||||
throw new Error('Invalid request');
|
||||
}
|
||||
}
|
||||
|
||||
function reload(page) {
|
||||
|
||||
Dashboard.showLoadingMsg();
|
||||
|
||||
ApiClient.getItem(Dashboard.getCurrentUserId(), id).done(function (item) {
|
||||
getPromise().done(function (item) {
|
||||
|
||||
reloadFromItem(page, item);
|
||||
});
|
||||
|
|
@ -251,6 +285,11 @@
|
|||
$('#childrenCollapsible', page).removeClass('hide');
|
||||
renderChannelGuide(page, item, user);
|
||||
}
|
||||
else if (item.Type == 'Studio' || item.Type == 'Person' || item.Type == 'Genre' || item.Type == 'MusicGenre' || item.Type == 'GameGenre' || item.Type == 'MusicArtist') {
|
||||
|
||||
$('#childrenCollapsible', page).removeClass('hide');
|
||||
renderItemsByName(page, item, user);
|
||||
}
|
||||
else if (item.IsFolder) {
|
||||
|
||||
if (item.Type == "BoxSet") {
|
||||
|
|
@ -460,7 +499,7 @@
|
|||
|
||||
var artist = artists[i];
|
||||
|
||||
html.push('<a class="textlink" href="itembynamedetails.html?context=' + context + '&id=' + artist.Id + '">' + artist.Name + '</a>');
|
||||
html.push('<a class="textlink" href="itemdetails.html?context=' + context + '&id=' + artist.Id + '">' + artist.Name + '</a>');
|
||||
|
||||
}
|
||||
|
||||
|
|
@ -620,7 +659,7 @@
|
|||
}
|
||||
|
||||
if (item.Studios.length) {
|
||||
html += ' on <a class="textlink" href="itembynamedetails.html?context=' + context + '&id=' + item.Studios[0].Id + '">' + item.Studios[0].Name + '</a>';
|
||||
html += ' on <a class="textlink" href="itemdetails.html?context=' + context + '&id=' + item.Studios[0].Id + '">' + item.Studios[0].Name + '</a>';
|
||||
}
|
||||
|
||||
if (html) {
|
||||
|
|
@ -833,6 +872,15 @@
|
|||
}
|
||||
}
|
||||
|
||||
function renderItemsByName(page, item, user) {
|
||||
|
||||
require('scripts/itembynamedetailpage'.split(','), function () {
|
||||
|
||||
|
||||
window.ItemsByName.renderItems(page, item);
|
||||
});
|
||||
}
|
||||
|
||||
function renderChannelGuide(page, item, user) {
|
||||
|
||||
require('scripts/livetvcomponents,scripts/livetvchannel,livetvcss'.split(','), function () {
|
||||
|
|
@ -1438,7 +1486,7 @@
|
|||
}
|
||||
|
||||
var cast = casts[i];
|
||||
var href = isStatic ? '#' : 'itembynamedetails.html?context=' + context + '&id=' + cast.Id + '';
|
||||
var href = isStatic ? '#' : 'itemdetails.html?context=' + context + '&id=' + cast.Id + '';
|
||||
html += '<a class="tileItem smallPosterTileItem" href="' + href + '">';
|
||||
|
||||
var imgUrl;
|
||||
|
|
|
|||
|
|
@ -428,7 +428,7 @@
|
|||
var artist = artists[i];
|
||||
|
||||
var css = cssClass ? (' class="' + cssClass + '"') : '';
|
||||
html.push('<a' + css + ' href="itembynamedetails.html?context=music&id=' + artist.Id + '">' + artist.Name + '</a>');
|
||||
html.push('<a' + css + ' href="itemdetails.html?context=music&id=' + artist.Id + '">' + artist.Name + '</a>');
|
||||
|
||||
}
|
||||
|
||||
|
|
@ -824,26 +824,26 @@
|
|||
return "itemdetails.html?id=" + id + contextSuffix;
|
||||
}
|
||||
if (item.Type == "Genre") {
|
||||
return "itembynamedetails.html?id=" + id + contextSuffix;
|
||||
return "itemdetails.html?id=" + id + contextSuffix;
|
||||
}
|
||||
if (item.Type == "MusicGenre") {
|
||||
return "itembynamedetails.html?id=" + id + contextSuffix;
|
||||
return "itemdetails.html?id=" + id + contextSuffix;
|
||||
}
|
||||
if (item.Type == "GameGenre") {
|
||||
return "itembynamedetails.html?id=" + id + contextSuffix;
|
||||
return "itemdetails.html?id=" + id + contextSuffix;
|
||||
}
|
||||
if (item.Type == "Studio") {
|
||||
return "itembynamedetails.html?id=" + id + contextSuffix;
|
||||
return "itemdetails.html?id=" + id + contextSuffix;
|
||||
}
|
||||
if (item.Type == "Person") {
|
||||
return "itembynamedetails.html?id=" + id + contextSuffix;
|
||||
return "itemdetails.html?id=" + id + contextSuffix;
|
||||
}
|
||||
if (item.Type == "Recording") {
|
||||
return "itemdetails.html?id=" + id;
|
||||
}
|
||||
|
||||
if (item.Type == "MusicArtist") {
|
||||
return "itembynamedetails.html?id=" + id + contextSuffix;
|
||||
return "itemdetails.html?id=" + id + contextSuffix;
|
||||
}
|
||||
|
||||
if (item.IsFolder) {
|
||||
|
|
@ -3176,7 +3176,7 @@
|
|||
if (isStatic) {
|
||||
html += item.Studios[i].Name;
|
||||
} else {
|
||||
html += '<a class="textlink" href="itembynamedetails.html?context=' + context + '&id=' + item.Studios[i].Id + '">' + item.Studios[i].Name + '</a>';
|
||||
html += '<a class="textlink" href="itemdetails.html?context=' + context + '&id=' + item.Studios[i].Id + '">' + item.Studios[i].Name + '</a>';
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -3217,7 +3217,7 @@
|
|||
if (isStatic) {
|
||||
html += genres[i];
|
||||
} else {
|
||||
html += '<a class="textlink" href="itembynamedetails.html?context=' + context + '&' + param + '=' + ApiClient.encodeName(genres[i]) + '">' + genres[i] + '</a>';
|
||||
html += '<a class="textlink" href="itemdetails.html?context=' + context + '&' + param + '=' + ApiClient.encodeName(genres[i]) + '">' + genres[i] + '</a>';
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -417,13 +417,13 @@
|
|||
Dashboard.navigate('itemdetails.html?id=' + albumid);
|
||||
break;
|
||||
case 'artist':
|
||||
Dashboard.navigate('itembynamedetails.html?context=music&id=' + artistid);
|
||||
Dashboard.navigate('itemdetails.html?context=music&id=' + artistid);
|
||||
break;
|
||||
case 'play':
|
||||
MediaController.play(itemId);
|
||||
break;
|
||||
case 'playallfromhere':
|
||||
$(card).parents('.itemsContainer').trigger('playallfromhere', [index]);
|
||||
playAllFromHere(index, $(card).parents('.itemsContainer'), 'play');
|
||||
break;
|
||||
case 'queue':
|
||||
MediaController.queue(itemId);
|
||||
|
|
@ -440,7 +440,7 @@
|
|||
});
|
||||
break;
|
||||
case 'queueallfromhere':
|
||||
$(card).parents('.itemsContainer').trigger('queueallfromhere', [index]);
|
||||
playAllFromHere(index, $(card).parents('.itemsContainer'), 'queue');
|
||||
break;
|
||||
case 'sync':
|
||||
SyncManager.showMenu({
|
||||
|
|
@ -1145,12 +1145,34 @@
|
|||
index = elemWithAttributes.getAttribute('data-index');
|
||||
itemsContainer = $(elem).parents('.itemsContainer');
|
||||
|
||||
itemsContainer.trigger('playallfromhere', [index]);
|
||||
playAllFromHere(index, itemsContainer, 'play');
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
function playAllFromHere(index, itemsContainer, method) {
|
||||
|
||||
var ids = $('.mediaItem', itemsContainer).get().map(function(i) {
|
||||
return i.getAttribute('data-itemid') || i.parentNode.getAttribute('data-itemid');
|
||||
});
|
||||
|
||||
ids = ids.slice(index);
|
||||
|
||||
ApiClient.getItems(Dashboard.getCurrentUserId(), {
|
||||
|
||||
Ids: ids.join(','),
|
||||
Fields: 'MediaSources,Chapters',
|
||||
Limit: 100
|
||||
|
||||
}).done(function (result) {
|
||||
|
||||
MediaController[method]({
|
||||
items: result.Items
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
$(document).on('pageinitdepends', ".libraryPage", function () {
|
||||
|
||||
var page = this;
|
||||
|
|
|
|||
|
|
@ -78,7 +78,7 @@
|
|||
|
||||
html += '</paper-item-body>';
|
||||
|
||||
html += '<paper-icon-button icon="delete" data-seriestimerid="' + timer.Id + '" title="' + Globalize.translate('ButtonCancelSeries') + '" class="btnCancelSeries"></paper-icon-button>';
|
||||
html += '<paper-icon-button icon="cancel" data-seriestimerid="' + timer.Id + '" title="' + Globalize.translate('ButtonCancelSeries') + '" class="btnCancelSeries"></paper-icon-button>';
|
||||
|
||||
html += '</paper-icon-item>';
|
||||
}
|
||||
|
|
|
|||
|
|
@ -101,7 +101,7 @@
|
|||
html += '</div>';
|
||||
}
|
||||
|
||||
html += '<paper-icon-button icon="delete" data-timerid="' + timer.Id + '" title="' + Globalize.translate('ButonCancelRecording') + '" class="btnDeleteTimer"></paper-icon-button>';
|
||||
html += '<paper-icon-button icon="cancel" data-timerid="' + timer.Id + '" title="' + Globalize.translate('ButonCancelRecording') + '" class="btnDeleteTimer"></paper-icon-button>';
|
||||
|
||||
html += '</paper-icon-item>';
|
||||
}
|
||||
|
|
|
|||
|
|
@ -106,7 +106,7 @@
|
|||
html += '<a href="itemlist.html?id=' + rRow.Id + '">' + rItem.Name + '</a>';
|
||||
break;
|
||||
case "ItemByNameDetails":
|
||||
html += '<a href="itembynamedetails.html?id=' + rItem.Id + '&context=' + rRow.RowType + '">' + rItem.Name + '</a>';
|
||||
html += '<a href="itemdetails.html?id=' + rItem.Id + '&context=' + rRow.RowType + '">' + rItem.Name + '</a>';
|
||||
break;
|
||||
case "EmbeddedImage":
|
||||
if (rRow.HasEmbeddedImage) {
|
||||
|
|
@ -237,7 +237,7 @@
|
|||
var rItem = group.Items[j];
|
||||
html += '<a class="item ui-btn"';
|
||||
if (rItem.Id > "")
|
||||
html += ' href="itembynamedetails.html?id=' + rItem.Id + '"';
|
||||
html += ' href="itemdetails.html?id=' + rItem.Id + '"';
|
||||
html += '>' + rItem.Name + ' ' + '</a>';
|
||||
html += '<a title="" class="listviewMenuButton ui-btn ui-btn-inline">' + rItem.Value + ' ' + '</a>';
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,10 +1,32 @@
|
|||
(function ($, document) {
|
||||
|
||||
var view = LibraryBrowser.getDefaultItemsView('Poster', 'Poster');
|
||||
|
||||
var data = {};
|
||||
|
||||
function getQuery() {
|
||||
function addCurrentItemToQuery(query, item) {
|
||||
|
||||
if (item.Type == "Person") {
|
||||
query.PersonIds = item.Id;
|
||||
}
|
||||
else if (item.Type == "Genre") {
|
||||
query.Genres = item.Name;
|
||||
}
|
||||
else if (item.Type == "MusicGenre") {
|
||||
query.Genres = item.Name;
|
||||
}
|
||||
else if (item.Type == "GameGenre") {
|
||||
query.Genres = item.Name;
|
||||
}
|
||||
else if (item.Type == "Studio") {
|
||||
query.StudioIds = item.Id;
|
||||
}
|
||||
else if (item.Type == "MusicArtist") {
|
||||
query.ArtistIds = item.Id;
|
||||
} else {
|
||||
query.ParentId = item.Id;
|
||||
}
|
||||
}
|
||||
|
||||
function getQuery(parentItem) {
|
||||
|
||||
var key = getSavedQueryKey();
|
||||
var pageData = data[key];
|
||||
|
|
@ -33,7 +55,10 @@
|
|||
pageData.query.Filters = filters;
|
||||
}
|
||||
|
||||
pageData.query.ParentId = getParameterByName('parentid') || LibraryMenu.getTopParentId();
|
||||
if (parentItem) {
|
||||
addCurrentItemToQuery(pageData.query, parentItem);
|
||||
}
|
||||
|
||||
LibraryBrowser.loadSavedQueryValues(key, pageData.query);
|
||||
}
|
||||
return pageData.query;
|
||||
|
|
@ -59,11 +84,11 @@
|
|||
}
|
||||
}
|
||||
|
||||
function reloadItems(page) {
|
||||
function reloadItems(page, parentItem) {
|
||||
|
||||
Dashboard.showLoadingMsg();
|
||||
|
||||
var query = getQuery();
|
||||
var query = getQuery(parentItem);
|
||||
|
||||
ApiClient.getItems(Dashboard.getCurrentUserId(), query).done(function (result) {
|
||||
|
||||
|
|
@ -79,46 +104,63 @@
|
|||
});
|
||||
|
||||
page.querySelector('.listTopPaging').innerHTML = pagingHtml;
|
||||
var trigger = false;
|
||||
|
||||
var posterOptions = {
|
||||
items: result.Items,
|
||||
shape: "auto",
|
||||
centerText: true,
|
||||
lazy: true,
|
||||
overlayText: true
|
||||
};
|
||||
if (query.IncludeItemTypes == "Audio") {
|
||||
|
||||
if (query.IncludeItemTypes == "MusicAlbum") {
|
||||
posterOptions.overlayText = false;
|
||||
posterOptions.showParentTitle = true;
|
||||
posterOptions.overlayPlayButton = true;
|
||||
}
|
||||
else if (query.IncludeItemTypes == "MusicArtist") {
|
||||
posterOptions.overlayText = false;
|
||||
posterOptions.overlayPlayButton = true;
|
||||
}
|
||||
else if (query.IncludeItemTypes == "Episode") {
|
||||
posterOptions.overlayText = false;
|
||||
posterOptions.showParentTitle = true;
|
||||
posterOptions.overlayPlayButton = true;
|
||||
posterOptions.centerText = false;
|
||||
}
|
||||
html = '<div style="max-width:1000px;margin:auto;">' + LibraryBrowser.getListViewHtml({
|
||||
items: result.Items,
|
||||
playFromHere: true,
|
||||
defaultAction: 'playallfromhere',
|
||||
smallIcon: true
|
||||
}) + '</div>';
|
||||
trigger = true;
|
||||
|
||||
// Poster
|
||||
html = LibraryBrowser.getPosterViewHtml(posterOptions);
|
||||
} else {
|
||||
var posterOptions = {
|
||||
items: result.Items,
|
||||
shape: "auto",
|
||||
centerText: true,
|
||||
lazy: true,
|
||||
overlayText: true
|
||||
};
|
||||
|
||||
if (query.IncludeItemTypes == "MusicAlbum") {
|
||||
posterOptions.overlayText = false;
|
||||
posterOptions.showParentTitle = true;
|
||||
posterOptions.overlayPlayButton = true;
|
||||
}
|
||||
else if (query.IncludeItemTypes == "MusicArtist") {
|
||||
posterOptions.overlayText = false;
|
||||
posterOptions.overlayPlayButton = true;
|
||||
}
|
||||
else if (query.IncludeItemTypes == "Episode") {
|
||||
posterOptions.overlayText = false;
|
||||
posterOptions.showParentTitle = true;
|
||||
posterOptions.overlayPlayButton = true;
|
||||
posterOptions.centerText = false;
|
||||
}
|
||||
|
||||
// Poster
|
||||
html = LibraryBrowser.getPosterViewHtml(posterOptions);
|
||||
}
|
||||
|
||||
var elem = page.querySelector('#items');
|
||||
elem.innerHTML = html + pagingHtml;
|
||||
ImageLoader.lazyChildren(elem);
|
||||
|
||||
if (trigger) {
|
||||
$(elem).trigger('create');
|
||||
}
|
||||
|
||||
$('.btnNextPage', page).on('click', function () {
|
||||
query.StartIndex += query.Limit;
|
||||
reloadItems(page);
|
||||
reloadItems(page, parentItem);
|
||||
});
|
||||
|
||||
$('.btnPreviousPage', page).on('click', function () {
|
||||
query.StartIndex -= query.Limit;
|
||||
reloadItems(page);
|
||||
reloadItems(page, parentItem);
|
||||
});
|
||||
|
||||
LibraryBrowser.setLastRefreshed(page);
|
||||
|
|
@ -139,10 +181,14 @@
|
|||
if (getParameterByName('parentid')) {
|
||||
ApiClient.getItem(Dashboard.getCurrentUserId(), getParameterByName('parentid')).done(function (parent) {
|
||||
LibraryMenu.setTitle(parent.Name);
|
||||
|
||||
if (LibraryBrowser.needsRefresh(page)) {
|
||||
reloadItems(page, parent);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
if (LibraryBrowser.needsRefresh(page)) {
|
||||
else if (LibraryBrowser.needsRefresh(page)) {
|
||||
reloadItems(page);
|
||||
}
|
||||
});
|
||||
|
|
|
|||
|
|
@ -1173,22 +1173,22 @@ var Dashboard = {
|
|||
var type = (cmd.ItemType || "").toLowerCase();
|
||||
|
||||
if (type == "genre") {
|
||||
url = "itembynamedetails.html?id=" + cmd.ItemId;
|
||||
url = "itemdetails.html?id=" + cmd.ItemId;
|
||||
}
|
||||
else if (type == "musicgenre") {
|
||||
url = "itembynamedetails.html?id=" + cmd.ItemId;
|
||||
url = "itemdetails.html?id=" + cmd.ItemId;
|
||||
}
|
||||
else if (type == "gamegenre") {
|
||||
url = "itembynamedetails.html?id=" + cmd.ItemId;
|
||||
url = "itemdetails.html?id=" + cmd.ItemId;
|
||||
}
|
||||
else if (type == "studio") {
|
||||
url = "itembynamedetails.html?id=" + cmd.ItemId;
|
||||
url = "itemdetails.html?id=" + cmd.ItemId;
|
||||
}
|
||||
else if (type == "person") {
|
||||
url = "itembynamedetails.html?id=" + cmd.ItemId;
|
||||
url = "itemdetails.html?id=" + cmd.ItemId;
|
||||
}
|
||||
else if (type == "musicartist") {
|
||||
url = "itembynamedetails.html?id=" + cmd.ItemId;
|
||||
url = "itemdetails.html?id=" + cmd.ItemId;
|
||||
}
|
||||
|
||||
if (url) {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue