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

trailers and special features display/play

This commit is contained in:
Techywarrior 2013-03-26 11:51:52 -07:00
parent 9cafa17580
commit 053bb8bde5
2 changed files with 147 additions and 7 deletions

View file

@ -44,17 +44,17 @@
<h3>Scenes</h3> <h3>Scenes</h3>
<div id="scenesContent"></div> <div id="scenesContent"></div>
</div> </div>
<div data-role="collapsible" data-content-theme="a"> <div data-role="collapsible" data-content-theme="a" id="specialsCollapsible">
<h3>Special Features</h3> <h3>Special Features</h3>
<p>I'm the collapsible content. By default I'm closed, but you can click the header to open me.</p> <div id="specialsContent"></div>
</div> </div>
<div data-role="collapsible" data-content-theme="a"> <div data-role="collapsible" data-content-theme="a" id="trailersCollapsible">
<h3>Trailers</h3> <h3>Trailers</h3>
<p>I'm the collapsible content. By default I'm closed, but you can click the header to open me.</p> <div id="trailersContent"></div>
</div> </div>
<div data-role="collapsible" data-content-theme="a"> <div data-role="collapsible" data-content-theme="a" id="castCollapsible">
<h3>Cast & Crew</h3> <h3>Cast & Crew</h3>
<p>I'm the collapsible content. By default I'm closed, but you can click the header to open me.</p> <div id="castContent"></div>
</div> </div>
<div data-role="collapsible" data-content-theme="a" id="galleryCollapsible"> <div data-role="collapsible" data-content-theme="a" id="galleryCollapsible">
<h3>Gallery</h3> <h3>Gallery</h3>

View file

@ -41,7 +41,6 @@
ItemDetailPage.renderImage(item); ItemDetailPage.renderImage(item);
ItemDetailPage.renderOverviewBlock(item); ItemDetailPage.renderOverviewBlock(item);
ItemDetailPage.renderMediaInfo(item); ItemDetailPage.renderMediaInfo(item);
ItemDetailPage.renderGallery(item); ItemDetailPage.renderGallery(item);
if (!item.Chapters || !item.Chapters.length) { if (!item.Chapters || !item.Chapters.length) {
@ -49,6 +48,16 @@
}else { }else {
ItemDetailPage.renderScenes(item); ItemDetailPage.renderScenes(item);
} }
if (!item.LocalTrailerCount || item.LocalTrailerCount == 0) {
$('#trailersCollapsible', page).remove();
}else {
ItemDetailPage.renderTrailers(item);
}
if (!item.SpecialFeatureCount || item.SpecialFeatureCount == 0) {
$('#specialsCollapsible', page).remove();
}else {
ItemDetailPage.renderSpecials(item);
}
$('#itemName', page).html(name); $('#itemName', page).html(name);
@ -409,6 +418,137 @@
} }
$('#mediaInfoCollapsible', page).show(); $('#mediaInfoCollapsible', page).show();
},
playTrailer: function (index) {
ApiClient.getLocalTrailers(Dashboard.getCurrentUserId(), ItemDetailPage.item.Id).done(function (trailers) {
MediaPlayer.play([trailers[index]]);
});
},
onTrailersExpand: function() {
if (ItemDetailPage.item) {
ItemDetailPage.renderTrailers(ItemDetailPage.item);
$(this).off('expand', ItemDetailPage.onTrailersExpand);
}
},
renderTrailers: function (item) {
var html = '';
var page = $.mobile.activePage;
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+');">';
if (trailer.ImageTag) {
var imgUrl = ApiClient.getImageUrl(item.Id, {
width: 500,
tag: trailer.ImageTag,
type: "Trailer",
index: i
});
html += '<img src="' + imgUrl + '" />';
} else {
html += '<img src="css/images/itemDetails/videoDefault.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);
});
},
playSpecial: function (index) {
ApiClient.getSpecialFeatures(Dashboard.getCurrentUserId(), ItemDetailPage.item.Id).done(function (specials) {
MediaPlayer.play([specials[index]]);
});
},
onSpecialsExpand: function() {
if (ItemDetailPage.item) {
ItemDetailPage.renderSpecials(ItemDetailPage.item);
$(this).off('expand', ItemDetailPage.onSpecialsExpand);
}
},
renderSpecials: function (item) {
var html = '';
var page = $.mobile.activePage;
ApiClient.getSpecialFeatures(Dashboard.getCurrentUserId(), item.Id).done(function (specials) {
for (var i = 0, length = specials.length; i < length; i++) {
var special = specials[i];
html += '<div class="posterViewItem posterViewItemWithDualText">';
html += '<a href="#play-Special-' + i + '" onclick="ItemDetailPage.playSpecial('+i+');">';
if (special.ImageTag) {
var imgUrl = ApiClient.getImageUrl(item.Id, {
width: 500,
tag: special.ImageTag,
type: "Special",
index: i
});
html += '<img src="' + imgUrl + '" />';
} else {
html += '<img src="css/images/itemDetails/videoDefault.png"/>';
}
html += '<div class="posterViewItemText posterViewItemPrimaryText">' + special.Name + '</div>';
html += '<div class="posterViewItemText">';
if (special.RunTimeTicks != "") {
html += ticks_to_human(special.RunTimeTicks);
}
else {
html += "&nbsp;";
}
html += '</div>';
html += '</a>';
html += '</div>';
}
$('#specialsContent', page).html(html);
});
} }
}; };