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

added play/resume menu to detail page

This commit is contained in:
Luke Pulverenti 2013-04-09 22:28:24 -04:00
parent ddb5a7f595
commit 3232dc1403
2 changed files with 54 additions and 6 deletions

View file

@ -16,10 +16,11 @@
<div id="itemImage"></div>
<div id="playButtonShadow" style="display: none; height: 48px; position: absolute; bottom: 0; left: 0; right: 0; background: black; opacity: .75;">
</div>
<button id="btnPlay" type="button" class="imageButton" style="display: none; position: absolute; bottom: 5px; left: 10px;" data-role="none" title="Play" onclick="ItemDetailPage.play();">
<button id="btnPlay" type="button" class="imageButton" style="display: none; position: absolute; bottom: 5px; left: 10px;" data-role="none" title="Play" onclick="ItemDetailPage.onPlayButtonClick();">
<img src="css/images/media/playCircle.png" style="height: 28px;" />
</button>
</div>
<div id="playMenuAnchor"></div>
</div>
<div class="itemDetailBlock">
@ -32,7 +33,7 @@
<p id="itemGenres"></p>
<p id="itemStudios"></p>
<p id="itemLinks"></p>
<p id="itemLinks"></p>
</div>
</div>
@ -60,6 +61,16 @@
<h3>Gallery</h3>
<div id="galleryContent"></div>
</div>
<div data-role="popup" id="playMenu" data-corners="false" data-theme="c">
<ul data-role="listview" style="min-width: 150px;" data-theme="c">
<li data-role="list-divider" data-theme="a">Play Menu</li>
<li><a href="#" onclick="ItemDetailPage.play();">Play</a></li>
<li><a href="#" onclick="ItemDetailPage.resume();">Resume</a>
</li>
</ul>
</div>
</div>
</div>
</body>

View file

@ -353,10 +353,47 @@
$('#scenesContent', page).html(html);
},
onPlayButtonClick: function () {
var item = ItemDetailPage.item;
var userdata = item.UserData || {};
if (userdata.PlaybackPositionTicks) {
var page = $.mobile.activePage;
var pos = $('#playMenuAnchor', page).offset();
$('#playMenu', page).popup("open", {
x: pos.left + 125,
y: pos.top + 20
});
} else {
ItemDetailPage.play();
}
},
play: function (startPosition) {
var page = $.mobile.activePage;
$('#playMenu', page).popup("close");
MediaPlayer.play([ItemDetailPage.item], startPosition);
},
resume: function() {
var item = ItemDetailPage.item;
var userdata = item.UserData || {};
ItemDetailPage.play(userdata.PlaybackPositionTicks);
},
onGalleryExpand: function () {
if (ItemDetailPage.item) {