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

detail page enhancements

This commit is contained in:
Techywarrior 2013-03-26 15:53:06 -07:00
parent 7348edef90
commit 50654e4a8f
4 changed files with 43 additions and 18 deletions

View file

@ -74,6 +74,10 @@ pre, textarea.pre {
color: #1B58B8;
}
.hide {
display: none;
}
/*
Page / Base styles
*/

View file

@ -7,6 +7,7 @@
<div id="itemDetailPage" data-role="page" class="page libraryPage" data-theme="a">
<div data-role="content" style="padding-top: 0;">
<h1 id="seriesName" style="padding-left: 10px; margin: 0;" class="hide"></h1>
<h1 id="itemName" style="padding-left: 10px; margin: 0;"></h1>
<div style="padding: 10px;">
@ -36,27 +37,27 @@
</div>
</div>
<div data-role="collapsible" data-content-theme="a" id="mediaInfoCollapsible">
<div data-role="collapsible" data-content-theme="a" id="mediaInfoCollapsible" class="hide">
<h3>Media Info</h3>
<div id="mediaInfoContent"></div>
</div>
<div data-role="collapsible" data-content-theme="a" id="scenesCollapsible">
<div data-role="collapsible" data-content-theme="a" id="scenesCollapsible" class="hide">
<h3>Scenes</h3>
<div id="scenesContent"></div>
</div>
<div data-role="collapsible" data-content-theme="a" id="specialsCollapsible">
<div data-role="collapsible" data-content-theme="a" id="specialsCollapsible" class="hide">
<h3>Special Features</h3>
<div id="specialsContent"></div>
</div>
<div data-role="collapsible" data-content-theme="a" id="trailersCollapsible">
<div data-role="collapsible" data-content-theme="a" id="trailersCollapsible" class="hide">
<h3>Trailers</h3>
<div id="trailersContent"></div>
</div>
<div data-role="collapsible" data-content-theme="a" id="castCollapsible">
<div data-role="collapsible" data-content-theme="a" id="castCollapsible" class="hide">
<h3>Cast & Crew</h3>
<div id="castContent"></div>
</div>
<div data-role="collapsible" data-content-theme="a" id="galleryCollapsible">
<div data-role="collapsible" data-content-theme="a" id="galleryCollapsible" class="">
<h3>Gallery</h3>
<div id="galleryContent"></div>
</div>

View file

@ -4,11 +4,17 @@
ItemDetailPage.reload();
$('#scenesCollapsible', this).on('expand', ItemDetailPage.onScenesExpand);
$('#specialsCollapsible', this).on('expand', ItemDetailPage.onSpecialsExpand);
$('#trailersCollapsible', this).on('expand', ItemDetailPage.onTrailersExpand);
$('#galleryCollapsible', this).on('expand', ItemDetailPage.onGalleryExpand);
},
onPageHide: function () {
$('#scenesCollapsible', this).off('expand', ItemDetailPage.onScenesExpand);
$('#specialsCollapsible', this).off('expand', ItemDetailPage.onSpecialsExpand);
$('#trailersCollapsible', this).off('expand', ItemDetailPage.onTrailersExpand);
$('#galleryCollapsible', this).off('expand', ItemDetailPage.onGalleryExpand);
ItemDetailPage.item = null;
@ -35,6 +41,9 @@
if (item.IndexNumber != null) {
name = item.IndexNumber + " - " + name;
}
if (item.ParentIndexNumber != null) {
name = item.ParentIndexNumber + "." + name;
}
Dashboard.setPageTitle(name);
@ -46,21 +55,29 @@
if (!item.Chapters || !item.Chapters.length) {
$('#scenesCollapsible', page).hide();
} else {
$('#scenesCollapsible', page).show();
ItemDetailPage.renderScenes(item);
}
if (!item.LocalTrailerCount || item.LocalTrailerCount == 0) {
$('#trailersCollapsible', page).hide();
} else {
$('#trailersCollapsible', page).show();
ItemDetailPage.renderTrailers(item);
}
if (!item.SpecialFeatureCount || item.SpecialFeatureCount == 0) {
$('#specialsCollapsible', page).hide();
} else {
$('#specialsCollapsible', page).show();
ItemDetailPage.renderSpecials(item);
}
$('#itemName', page).html(name);
if (item.SeriesName || item.Album) {
var series_name = item.SeriesName || item.Album;
$('#seriesName', page).html(series_name).show();
}
Dashboard.hideLoadingMsg();
},
@ -131,7 +148,7 @@
},
renderOverviewBlock: function (item) {
console.log(item);
var page = $.mobile.activePage;
if (item.Taglines && item.Taglines.length) {
@ -140,8 +157,13 @@
$('#itemTagline', page).hide();
}
if (item.Overview) {
$('#itemOverview', page).html(item.Overview).show();
if (item.Overview || item.OverviewHtml) {
var overview = item.OverviewHtml || item.Overview;
$('#itemOverview', page).html(overview).show();
$('#itemOverview a').each(function(){
$(this).attr("target","_blank");
});
} else {
$('#itemOverview', page).hide();
}
@ -305,12 +327,8 @@
html += '<div class="posterViewItemText posterViewItemPrimaryText">' + chapter_name + '</div>';
html += '<div class="posterViewItemText">';
if (chapter.StartPositionTicks != "") {
html += ticks_to_human(chapter.StartPositionTicks);
}
else {
html += "&nbsp;";
}
html += '</div>';
html += '</a>';
@ -399,7 +417,7 @@
html += '<a href="#" data-rel="back" data-role="button" data-theme="a" data-icon="delete" data-iconpos="notext" class="ui-btn-right">Close</a>';
html += '<img class="" src="' + ApiClient.getImageUrl(itemId, {
type: type,
width: lightboxWidth,
maxwidth: lightboxWidth,
tag: tag,
index: index
}) + '" />';

View file

@ -685,13 +685,15 @@ function ticks_to_human(str) {
var in_seconds = (str / 10000000);
var hours = Math.floor(in_seconds/3600);
var minutes = '0'+Math.floor((in_seconds-(hours*3600))/60);
var minutes = Math.floor((in_seconds-(hours*3600))/60);
var seconds = '0'+Math.round(in_seconds-(hours*3600)-(minutes*60));
var time = '';
if (hours > 0) time += hours+":";
time += minutes.substr(-2) + ":" +seconds.substr(-2);
if (minutes < 10 && hours == 0) time += minutes;
else time += ('0'+minutes).substr(-2);
time += ":" + seconds.substr(-2);
return time;
};