jellyfin-web/dashboard-ui/scripts/itembynamedetailpage.js

340 lines
9.6 KiB
JavaScript
Raw Normal View History

2013-04-10 10:36:34 -07:00
(function ($, document, LibraryBrowser) {
2013-03-27 15:29:37 -07:00
2015-08-18 21:08:03 -07:00
function renderItems(page, item) {
2013-04-17 21:45:00 -07:00
2015-08-18 21:08:03 -07:00
var sections = [];
2013-04-16 22:36:56 -07:00
if (item.MovieCount) {
2013-04-16 22:36:56 -07:00
2015-08-18 21:08:03 -07:00
sections.push({
name: Globalize.translate('TabMovies'),
type: 'Movie'
});
}
2013-04-16 22:36:56 -07:00
if (item.SeriesCount) {
2013-04-16 22:36:56 -07:00
2015-08-18 21:08:03 -07:00
sections.push({
name: Globalize.translate('TabSeries'),
type: 'Series'
});
}
2013-04-16 22:36:56 -07:00
if (item.EpisodeCount) {
2013-04-16 22:36:56 -07:00
2015-08-18 21:08:03 -07:00
sections.push({
name: Globalize.translate('TabEpisodes'),
type: 'Episode'
});
}
2013-04-17 21:45:00 -07:00
if (item.TrailerCount) {
2013-04-16 22:36:56 -07:00
2015-08-18 21:08:03 -07:00
sections.push({
name: Globalize.translate('TabTrailers'),
type: 'Trailer'
});
}
2013-04-16 22:36:56 -07:00
if (item.GameCount) {
2015-08-18 21:08:03 -07:00
sections.push({
name: Globalize.translate('TabGames'),
type: 'Game'
});
}
2013-04-16 22:36:56 -07:00
if (item.AlbumCount) {
2013-04-16 22:36:56 -07:00
2015-08-18 21:08:03 -07:00
sections.push({
name: Globalize.translate('TabAlbums'),
type: 'MusicAlbum'
});
}
if (item.SongCount) {
2015-08-18 21:08:03 -07:00
sections.push({
name: Globalize.translate('TabSongs'),
type: 'Audio'
});
}
if (item.MusicVideoCount) {
2015-08-18 21:08:03 -07:00
sections.push({
name: Globalize.translate('TabMusicVideos'),
type: 'MusicVideo'
});
2015-08-18 21:08:03 -07:00
}
2015-08-18 21:08:03 -07:00
var elem = page.querySelector('#childrenContent');
2013-04-17 21:45:00 -07:00
2015-08-18 21:08:03 -07:00
elem.innerHTML = sections.map(function (section) {
2013-04-17 21:45:00 -07:00
2015-08-18 21:08:03 -07:00
var html = '';
2013-04-17 21:45:00 -07:00
2015-08-18 21:08:03 -07:00
html += '<div class="homePageSection" data-type="' + section.type + '">';
2013-04-16 22:36:56 -07:00
2015-08-18 21:08:03 -07:00
html += '<div>';
html += '<h1 class="listHeader" style="display:inline-block;vertical-align:middle;">';
html += section.name;
html += '</h1>';
2015-08-20 20:21:27 -07:00
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>';
2015-08-18 21:08:03 -07:00
html += '</div>';
2013-04-17 21:45:00 -07:00
2015-08-18 21:08:03 -07:00
html += '<div class="itemsContainer">';
html += '</div>';
2013-04-17 21:45:00 -07:00
2015-08-18 21:08:03 -07:00
html += '</div>';
2013-04-17 21:45:00 -07:00
2015-08-18 21:08:03 -07:00
return html;
2013-04-17 21:45:00 -07:00
2015-08-18 21:08:03 -07:00
}).join('');
2013-04-17 21:45:00 -07:00
2015-08-18 21:08:03 -07:00
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'));
}
}
2013-04-19 16:57:23 -07:00
2015-08-18 21:08:03 -07:00
function renderSection(page, item, element, type) {
2013-04-19 16:57:23 -07:00
2015-08-18 21:08:03 -07:00
switch (type) {
2013-04-19 17:44:35 -07:00
2015-08-18 21:08:03 -07:00
case 'Movie':
loadItems(element, item, type, {
MediaTypes: "",
IncludeItemTypes: "Movie",
PersonTypes: "",
ArtistIds: "",
Limit: 10
}, {
shape: "detailPagePortrait",
showTitle: true,
centerText: true,
2015-08-18 23:12:58 -07:00
overlayMoreButton: true
2015-08-18 21:08:03 -07:00
});
break;
case 'MusicVideo':
loadItems(element, item, type, {
MediaTypes: "",
IncludeItemTypes: "MusicVideo",
PersonTypes: "",
ArtistIds: "",
Limit: 10
}, {
shape: "detailPagePortrait",
showTitle: true,
centerText: true,
overlayPlayButton: true
});
break;
case 'Game':
loadItems(element, item, type, {
MediaTypes: "",
IncludeItemTypes: "Game",
PersonTypes: "",
ArtistIds: "",
Limit: 10
}, {
shape: "detailPagePortrait",
showTitle: true,
2015-08-18 23:12:58 -07:00
centerText: true,
overlayMoreButton: true
2015-08-18 21:08:03 -07:00
});
break;
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,
2015-08-18 23:12:58 -07:00
centerText: true,
overlayMoreButton: true
2015-08-18 21:08:03 -07:00
});
break;
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;
case 'Episode':
loadItems(element, item, type, {
MediaTypes: "",
IncludeItemTypes: "Episode",
PersonTypes: "",
ArtistIds: "",
Limit: 6
}, {
shape: "detailPage169",
showTitle: true,
showParentTitle: true,
centerText: true,
overlayPlayButton: true
});
break;
case 'Audio':
loadItems(element, item, type, {
MediaTypes: "",
IncludeItemTypes: "Audio",
PersonTypes: "",
ArtistIds: "",
2015-08-20 20:21:27 -07:00
Limit: 30
2015-08-18 21:08:03 -07:00
}, {
playFromHere: true,
defaultAction: 'playallfromhere',
smallIcon: true
});
break;
2013-04-19 17:44:35 -07:00
2015-08-18 21:08:03 -07:00
default:
break;
}
2013-04-16 22:36:56 -07:00
}
2015-08-18 21:08:03 -07:00
function loadItems(element, item, type, query, listOptions) {
2013-03-27 21:27:15 -07:00
2015-08-18 21:08:03 -07:00
query = getQuery(query, item);
2013-03-27 21:27:15 -07:00
2015-12-14 08:43:03 -07:00
getItemsFunction(query, item)(query.StartIndex, query.Limit, query.Fields).then(function (result) {
2013-04-12 11:22:40 -07:00
2015-08-18 21:08:03 -07:00
var html = '';
2013-04-12 11:22:40 -07:00
2015-08-18 21:08:03 -07:00
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');
2013-04-18 22:08:18 -07:00
}
2013-04-12 11:22:40 -07:00
2015-08-18 21:08:03 -07:00
listOptions.items = result.Items;
2013-04-12 11:22:40 -07:00
2015-08-18 21:08:03 -07:00
if (type == 'Audio') {
html = LibraryBrowser.getListViewHtml(listOptions);
} else {
html = LibraryBrowser.getPosterViewHtml(listOptions);
2013-04-18 22:08:18 -07:00
}
2013-04-12 11:22:40 -07:00
2015-08-18 21:08:03 -07:00
var itemsContainer = element.querySelector('.itemsContainer');
itemsContainer.innerHTML = html;
2013-04-12 11:22:40 -07:00
2015-08-18 21:08:03 -07:00
$(itemsContainer).createCardMenus();
ImageLoader.lazyChildren(itemsContainer);
});
2013-04-10 10:36:34 -07:00
}
2013-04-02 13:02:23 -07:00
2015-08-18 21:08:03 -07:00
function getMoreItemsHref(item, type) {
return 'secondaryitems.html?type=' + type + '&parentid=' + item.Id;
2013-04-10 10:36:34 -07:00
}
2013-04-02 13:02:23 -07:00
2015-08-18 21:08:03 -07:00
function addCurrentItemToQuery(query, item) {
2013-04-17 21:45:00 -07:00
2015-08-18 21:08:03 -07:00
if (item.Type == "Person") {
query.PersonIds = item.Id;
2013-04-17 21:45:00 -07:00
}
2015-08-18 21:08:03 -07:00
else if (item.Type == "Genre") {
query.Genres = item.Name;
2013-04-17 21:45:00 -07:00
}
2015-08-18 21:08:03 -07:00
else if (item.Type == "MusicGenre") {
query.Genres = item.Name;
2013-06-10 20:31:00 -07:00
}
2015-08-18 21:08:03 -07:00
else if (item.Type == "GameGenre") {
query.Genres = item.Name;
2013-07-01 10:17:33 -07:00
}
2015-08-18 21:08:03 -07:00
else if (item.Type == "Studio") {
query.StudioIds = item.Id;
2013-04-17 21:45:00 -07:00
}
2015-08-18 21:08:03 -07:00
else if (item.Type == "MusicArtist") {
query.ArtistIds = item.Id;
2013-04-24 07:05:47 -07:00
}
2013-04-25 20:31:10 -07:00
}
2013-04-17 21:45:00 -07:00
2015-08-18 21:08:03 -07:00
function getQuery(options, item) {
2015-02-02 11:14:02 -07:00
var query = {
SortBy: "SortName",
SortOrder: "Ascending",
IncludeItemTypes: "",
Recursive: true,
Fields: "AudioInfo,SeriesInfo,ParentId,PrimaryImageAspectRatio,SyncInfo",
Limit: LibraryBrowser.getDefaultPageSize(),
StartIndex: 0,
CollapseBoxSetItems: false
};
query = $.extend(query, options || {});
if (query.IncludeItemTypes == "Audio") {
query.SortBy = "AlbumArtist,Album,SortName";
}
2015-08-18 21:08:03 -07:00
addCurrentItemToQuery(query, item);
2015-02-02 11:14:02 -07:00
2015-04-25 20:25:07 -07:00
return query;
}
2015-08-18 21:08:03 -07:00
function getItemsFunction(options, item) {
2015-04-25 20:25:07 -07:00
2015-08-18 21:08:03 -07:00
var query = getQuery(options, item);
2015-04-25 20:25:07 -07:00
2015-02-02 11:14:02 -07:00
return function (index, limit, fields) {
query.StartIndex = index;
query.Limit = limit;
2015-07-15 10:20:08 -07:00
if (fields) {
query.Fields += "," + fields;
}
2015-02-02 11:14:02 -07:00
return ApiClient.getItems(Dashboard.getCurrentUserId(), query);
};
}
2015-08-18 21:08:03 -07:00
window.ItemsByName = {
renderItems: renderItems
};
2013-03-27 15:29:37 -07:00
2013-04-10 10:36:34 -07:00
})(jQuery, document, LibraryBrowser);