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

improved games display

Browse source
This commit is contained in:
Luke Pulverenti 2013-04-24 16:28:42 -04:00
parent 9ffcf2bba9
commit 097653775a
21 changed files with 87 additions and 269 deletions
Download patch file Download diff file Expand all files Collapse all files

48
dashboard-ui/gamedetail.html
View file

@ -1,48 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<div id="gameDetailPage" data-role="page" class="page libraryPage" data-theme="a">
<div data-role="content">
<div class="detailPagePrimaryInfo">
<div class="itemImageBlock">
<div id="itemMedia" style="position: relative;">
<div id="itemImage"></div>
</div>
</div>
<div class="itemDetailBlock">
<h1 id="seriesName" class="detailPageName hide"></h1>
<h1 id="itemName" class="detailPageName"></h1>
<p id="itemMiscInfo" class="itemMiscInfo"></p>
<p id="itemTagline" style="font-style: italic;"></p>
<p id="itemOverview"></p>
<p id="itemRatings"></p>
<p id="itemCommunityRating"></p>
<p id="itemBudget"></p>
<p id="itemGenres"></p>
<p id="itemStudios"></p>
<p id="itemLinks"></p>
</div>
</div>
<div data-role="collapsible" id="trailersCollapsible" class="hide" data-mini="true">
<h3>Trailers</h3>
<div id="trailersContent"></div>
</div>
<div data-role="collapsible" id="galleryCollapsible" data-mini="true">
<h3>Gallery</h3>
<div id="galleryContent"></div>
</div>
</div>
</div>
</body>
</html>

17
dashboard-ui/itemdetails.html
View file

@ -72,6 +72,15 @@
<a href="musicgenres.html" data-role="button">Genres</a>
</div>
</div>
<div id="gameTabs" style="display: none;">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="gamesrecommended.html" data-role="button">Suggested</a>
<a href="games.html" data-role="button" class="ui-btn-active">Games</a>
<a href="gamesystems.html" data-role="button">Game Systems</a>
<a href="gamegenres.html" data-role="button">Genres</a>
<a href="gamestudios.html" data-role="button">Studios</a>
</div>
</div>
<div class="detailPageContent">
<div class="detailPagePrimaryInfo">
<div class="itemImageBlock">
@ -136,25 +145,25 @@
<div id="specialsContent"></div>
</div>
</div>
<div style="display: inline-block; vertical-align: top;">
<div>
<div data-role="collapsible" id="galleryCollapsible" style="display: none;" data-mini="true" data-collapsed="false" data-corners="false">
<h3>Gallery</h3>
<div id="galleryContent"></div>
</div>
</div>
<div style="display: inline-block; vertical-align: top;">
<div>
<div data-role="collapsible" id="themeSongsCollapsible" style="display: none;" data-mini="true" data-collapsed="false" data-corners="false">
<h3>Theme Songs</h3>
<div id="themeSongsContent"></div>
</div>
</div>
<div style="display: inline-block; vertical-align: top;">
<div>
<div data-role="collapsible" id="castCollapsible" style="display: none;" data-mini="true" data-collapsed="false" data-corners="false">
<h3>Cast & Crew</h3>
<div id="castContent"></div>
</div>
</div>
<div style="display: inline-block; vertical-align: top;">
<div>
<div data-role="collapsible" id="scenesCollapsible" style="display: none;" data-mini="true" data-collapsed="false" data-corners="false">
<h3>Scenes</h3>
<div id="scenesContent"></div>

4
dashboard-ui/itemlist.html
View file

@ -71,10 +71,10 @@
<strong>Filters:</strong>
</legend>
<input class="chkStandardFilter" type="checkbox" name="chkPlayed" id="chkPlayed" data-theme="c" data-filter="IsPlayed" data-mini="true">
<label for="chkPlayed">Watched</label>
<label for="chkPlayed">Played</label>
<input class="chkStandardFilter" type="checkbox" name="chkUnplayed" id="chkUnplayed" data-theme="c" data-filter="IsUnPlayed" data-mini="true">
<label for="chkUnplayed">Unwatched</label>
<label for="chkUnplayed">Unplayed</label>
<input class="chkStandardFilter" type="checkbox" name="chkResumable" id="chkResumable" data-theme="c" data-filter="IsResumable" data-mini="true">
<label for="chkResumable">Resumable</label>

12
dashboard-ui/scripts/Itemdetailpage.js
View file

@ -105,6 +105,10 @@
enableCustomHeader(page, "Music");
$('#standardLogo', page).hide();
}
else if (item.MediaType == "Game") {
enableCustomHeader(page, "Games");
$('#standardLogo', page).hide();
}
else {
$('.libraryPageHeader', page).hide();
$('#standardLogo', page).show();
@ -128,6 +132,12 @@
$('#movieTabs', page).hide();
}
if (item.MediaType == "Game") {
$('#gameTabs', page).show();
} else {
$('#gameTabs', page).hide();
}
if (item.Type == "BoxSet") {
$('#boxsetTabs', page).show();
} else {
@ -285,7 +295,7 @@
$('#themeSongsCollapsible', page).show();
$('#themeSongsContent', page).html(LibraryBrowser.getSongTableHtml(result.Items, {})).trigger('create');
$('#themeSongsContent', page).html(LibraryBrowser.getSongTableHtml(result.Items, { showArtist: true, showAlbum: true })).trigger('create');
}
}

184
dashboard-ui/scripts/gamedetailpage.js
View file

@ -1,184 +0,0 @@
(function ($, document, LibraryBrowser, window) {
var currentItem;
function reload(page) {
var id = getParameterByName('id');
Dashboard.showLoadingMsg();
ApiClient.getItem(Dashboard.getCurrentUserId(), id).done(function (item) {
currentItem = item;
var name = item.Name;
if (item.IndexNumber != null) {
name = item.IndexNumber + " - " + name;
}
if (item.ParentIndexNumber != null) {
name = item.ParentIndexNumber + "." + name;
}
$('#itemImage', page).html(LibraryBrowser.getDetailImageHtml(item));
Dashboard.setPageTitle(name);
$('#itemName', page).html(name);
setInitialCollapsibleState(page, item);
renderDetails(page, item);
if (LibraryBrowser.shouldDisplayGallery(item)) {
$('#galleryCollapsible', page).show();
} else {
$('#galleryCollapsible', page).hide();
}
Dashboard.hideLoadingMsg();
});
}
function setInitialCollapsibleState(page, item) {
if (!item.LocalTrailerCount || item.LocalTrailerCount == 0) {
$('#trailersCollapsible', page).hide();
} else {
$('#trailersCollapsible', page).show();
}
}
function renderDetails(page, item) {
if (item.Taglines && item.Taglines.length) {
$('#itemTagline', page).html(item.Taglines[0]).show();
} else {
$('#itemTagline', page).hide();
}
LibraryBrowser.renderOverview($('#itemOverview', page), item);
if (item.CommunityRating) {
$('#itemCommunityRating', page).html(LibraryBrowser.getStarRatingHtml(item)).show().attr('title', item.CommunityRating);
} else {
$('#itemCommunityRating', page).hide();
}
LibraryBrowser.renderBudget($('#itemBudget', page), item);
$('#itemMiscInfo', page).html(LibraryBrowser.getMiscInfoHtml(item));
LibraryBrowser.renderGenres($('#itemGenres', page), item, "games");
LibraryBrowser.renderStudios($('#itemStudios', page), item, "games");
renderUserDataIcons(page, item);
LibraryBrowser.renderLinks($('#itemLinks', page), item);
}
function renderUserDataIcons(page, item) {
$('#itemRatings', page).html(LibraryBrowser.getUserDataIconsHtml(item));
}
function renderGallery(page, item) {
var html = LibraryBrowser.getGalleryHtml(item);
$('#galleryContent', page).html(html).trigger('create');
}
function renderTrailers(page, item) {
var html = '';
ApiClient.getLocalTrailers(Dashboard.getCurrentUserId(), item.Id).done(function (trailers) {
for (var i = 0, length = trailers.length; i < length; i++) {
var trailer = trailers[i];
html += '<div class="posterViewItem posterViewItemWithDualText">';
html += '<a href="#play-Trailer-' + i + '" onclick="ItemDetailPage.playTrailer(' + i + ');">';
var imageTags = trailer.ImageTags || {};
if (imageTags.Primary) {
var imgUrl = ApiClient.getImageUrl(trailer.Id, {
maxwidth: 500,
tag: imageTags.Primary,
type: "primary"
});
html += '<img src="' + imgUrl + '" />';
} else {
html += '<img src="css/images/items/detail/video.png"/>';
}
html += '<div class="posterViewItemText posterViewItemPrimaryText">' + trailer.Name + '</div>';
html += '<div class="posterViewItemText">';
if (trailer.RunTimeTicks != "") {
html += ticks_to_human(trailer.RunTimeTicks);
}
else {
html += "&nbsp;";
}
html += '</div>';
html += '</a>';
html += '</div>';
}
$('#trailersContent', page).html(html);
});
}
$(document).on('pageinit', "#gameDetailPage", function () {
var page = this;
}).on('pageshow', "#gameDetailPage", function () {
var page = this;
reload(page);
$('#trailersCollapsible', page).on('expand.lazyload', function () {
renderTrailers(page, currentItem);
$(this).off('expand.lazyload');
});
$('#galleryCollapsible', page).on('expand.lazyload', function () {
renderGallery(page, currentItem);
$(this).off('expand.lazyload');
});
}).on('pagehide', "#gameDetailPage", function () {
currentItem = null;
var page = this;
$('#trailersCollapsible', page).off('expand.lazyload');
$('#galleryCollapsible', page).off('expand.lazyload');
});
function gameDetailPage() {
var self = this;
self.playTrailer = function (index) {
ApiClient.getLocalTrailers(Dashboard.getCurrentUserId(), currentItem.Id).done(function (trailers) {
MediaPlayer.play([trailers[index]]);
});
};
}
window.GameDetailPage = new gameDetailPage();
})(jQuery, document, LibraryBrowser, window);

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

@ -24,7 +24,6 @@
html += LibraryBrowser.getPosterDetailViewHtml({
items: result.Items,
useAverageAspectRatio: true,
countNameSingular: "Game",
countNamePlural: "Games",
context: "games"

2
dashboard-ui/scripts/gamespage.js
View file

@ -29,7 +29,7 @@
var item = result.Items[i];
//console.log(item);
html += '<tr>';
html += '<td><a href="gamedetail.html?id='+item.Id+'">' + item.Name + '</a></td>';
html += '<td><a href="itemdetails.html?id='+item.Id+'">' + item.Name + '</a></td>';
html += '<td>' + item.DisplayMediaType + '</td>';
html += '<td>' + item.ReleaseYear + '</td>';
html += '<td>' + /*LibraryBrowser.renderGenres('', item, "games")*/ + '</td>';

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

@ -24,7 +24,6 @@
html += LibraryBrowser.getPosterDetailViewHtml({
items: result.Items,
useAverageAspectRatio: true,
countNameSingular: "Game",
countNamePlural: "Games",
context: "games"

1
dashboard-ui/scripts/gamesystemspage.js
View file

@ -26,7 +26,6 @@
html += LibraryBrowser.getPosterDetailViewHtml({
items: result.Items,
useAverageAspectRatio: true,
context: "games"
});

16
dashboard-ui/scripts/itembynamedetailpage.js
View file

@ -181,7 +181,7 @@
if (result.GameCount) {
html += '<input type="radio" name="ibnItems" id="radioGames" value="on" data-mini="true">';
html += '<label for="radioGames">Games (' + result.SeriesCount + ')</label>';
html += '<label for="radioGames">Games (' + result.GameCount + ')</label>';
}
if (result.AlbumCount) {
@ -212,6 +212,7 @@
shape = "backdrop";
loadItems(page, {
MediaTypes: "",
IncludeItemTypes: "Movie",
PersonTypes: "",
Artists: ""
@ -223,6 +224,7 @@
shape = "backdrop";
loadItems(page, {
MediaTypes: "",
IncludeItemTypes: "Series",
PersonTypes: "",
Artists: ""
@ -233,6 +235,7 @@
shape = "poster";
loadItems(page, {
MediaTypes: "",
IncludeItemTypes: "Trailer",
PersonTypes: "",
Artists: ""
@ -243,7 +246,8 @@
shape = "poster";
loadItems(page, {
IncludeItemTypes: "Game",
IncludeItemTypes: "",
MediaTypes: "Game",
PersonTypes: "",
Artists: ""
});
@ -253,6 +257,7 @@
shape = "backdrop";
loadItems(page, {
MediaTypes: "",
IncludeItemTypes: "Episode",
PersonTypes: "GuestStar",
Artists: ""
@ -263,6 +268,7 @@
shape = "cd";
loadItems(page, {
MediaTypes: "",
IncludeItemTypes: "MusicAlbum",
PersonTypes: "Artist",
Artists: ""
@ -272,6 +278,7 @@
$("#radioSongs", page).on("click", function () {
loadItems(page, {
MediaTypes: "",
IncludeItemTypes: "Audio",
PersonTypes: "Artist",
Artists: ""
@ -351,7 +358,7 @@
SortBy: "SortName",
SortOrder: "Ascending",
IncludeItemTypes: "Movie",
IncludeItemTypes: "",
Recursive: true,
Fields: "PrimaryImageAspectRatio,UserData,DisplayMediaType,ItemCounts,DateCreated,AudioInfo,SeriesInfo",
Limit: LibraryBrowser.getDetaultPageSize(),
@ -375,8 +382,7 @@
html += LibraryBrowser.getPosterDetailViewHtml({
items: result.Items,
useAverageAspectRatio: true,
preferBackdrop: true,
preferBackdrop: shape == "backdrop",
shape: shape
});

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

@ -1109,14 +1109,47 @@
getMiscInfoHtml: function (item) {
var miscInfo = [];
var text;
if (item.ProductionYear && item.Type != "Episode") {
if (item.ProductionYear && item.Type == "Series") {
if (item.Status == "Continuing") {
miscInfo.push(item.ProductionYear + "-Present");
} else {
} else if (item.ProductionYear) {
text = item.ProductionYear;
if (item.EndDate) {
try {
text += "-" + parseISO8601Date(item.EndDate, { toLocal: true }).getFullYear();
}
catch (e) {
console.log("Error parsing date: " + item.EndDate);
}
}
miscInfo.push(text);
}
}
if (item.Type != "Series" && item.Type != "Episode") {
if (item.ProductionYear) {
miscInfo.push(item.ProductionYear);
}
else if (item.PremiereDate) {
try {
text = "-" + parseISO8601Date(item.PremiereDate, { toLocal: true }).getFullYear();
miscInfo.push(text);
}
catch (e) {
console.log("Error parsing date: " + item.PremiereDate);
}
}
}
if (item.OfficialRating) {
@ -1212,7 +1245,12 @@
renderPremiereDate: function (elem, item) {
if (item.PremiereDate) {
try {
elem.show().html('Premiered&nbsp;&nbsp;' + parseISO8601Date(item.PremiereDate, { toLocal: true }).toDateString());
var date = parseISO8601Date(item.PremiereDate, { toLocal: true });
var text = new Date().getTime() > date.getTime() ? "Premiered" : "Premieres";
elem.show().html(text + '&nbsp;&nbsp;' + date.toDateString());
} catch (err) {
elem.hide();
}

1
dashboard-ui/scripts/moviegenres.js
View file

@ -24,7 +24,6 @@
html += LibraryBrowser.getPosterDetailViewHtml({
items: result.Items,
useAverageAspectRatio: true,
countNameSingular: "Movie",
countNamePlural: "Movies",
context: "movies"

1
dashboard-ui/scripts/moviepeople.js
View file

@ -25,7 +25,6 @@
html += LibraryBrowser.getPosterDetailViewHtml({
items: result.Items,
useAverageAspectRatio: true,
countNameSingular: "Movie",
countNamePlural: "Movies",
context: "movies"

1
dashboard-ui/scripts/movies.js
View file

@ -27,7 +27,6 @@
if (view == "Backdrop") {
html += LibraryBrowser.getPosterDetailViewHtml({
items: result.Items,
useAverageAspectRatio: true,
preferBackdrop: true,
context: "movies",
shape: "backdrop"

1
dashboard-ui/scripts/moviestudios.js
View file

@ -24,7 +24,6 @@
html += LibraryBrowser.getPosterDetailViewHtml({
items: result.Items,
useAverageAspectRatio: true,
countNameSingular: "Movie",
countNamePlural: "Movies",
context: "movies"

1
dashboard-ui/scripts/movietrailers.js
View file

@ -27,7 +27,6 @@
if (view == "Backdrop") {
html += LibraryBrowser.getPosterDetailViewHtml({
items: result.Items,
useAverageAspectRatio: true,
preferBackdrop: true,
context: "movies"
});

1
dashboard-ui/scripts/musicartists.js
View file

@ -24,7 +24,6 @@
html += LibraryBrowser.getPosterDetailViewHtml({
items: result.Items,
useAverageAspectRatio: true,
countNameSingular: "Song",
countNamePlural: "Songs",
preferBackdrop: true,

1
dashboard-ui/scripts/musicgenres.js
View file

@ -24,7 +24,6 @@
html += LibraryBrowser.getPosterDetailViewHtml({
items: result.Items,
useAverageAspectRatio: true,
countNameSingular: "Song",
countNamePlural: "Songs",
context: "music"

1
dashboard-ui/scripts/tvgenres.js
View file

@ -24,7 +24,6 @@
html += LibraryBrowser.getPosterDetailViewHtml({
items: result.Items,
useAverageAspectRatio: true,
countNameSingular: "Show",
countNamePlural: "Shows",
context: "tv"

1
dashboard-ui/scripts/tvpeople.js
View file

@ -25,7 +25,6 @@
html += LibraryBrowser.getPosterDetailViewHtml({
items: result.Items,
useAverageAspectRatio: true,
countNameSingular: "Show",
countNamePlural: "Shows",
context: "tv"

1
dashboard-ui/scripts/tvstudios.js
View file

@ -24,7 +24,6 @@
html += LibraryBrowser.getPosterDetailViewHtml({
items: result.Items,
useAverageAspectRatio: true,
countNameSingular: "Show",
countNamePlural: "Shows",
context: "tv"