added play buttons to song table

This commit is contained in:
Luke Pulverenti 2013-04-30 13:21:21 -04:00
parent 3dc52fabbc
commit 7d55230e20
5 changed files with 111 additions and 50 deletions

View File

@ -1,6 +1,6 @@
.detailTableContainer {
width: 100%;
max-width: 1200px;
max-width: 1100px;
text-align: center;
margin: 0 auto;
}

View File

@ -472,7 +472,7 @@
var item = items[i];
html += '<a class="posterItem backdropPosterItem" href="#" onclick="ItemDetailPage.playById(\'' + item.Id + '\');">';
html += '<a class="posterItem backdropPosterItem" href="#" onclick="MediaPlayer.playById(\'' + item.Id + '\');">';
var imageTags = item.ImageTags || {};
@ -618,12 +618,6 @@
var self = this;
self.play = play;
self.playById = function (id) {
ApiClient.getItem(Dashboard.getCurrentUserId(), id).done(function (item) {
MediaPlayer.play([item]);
});
};
}
window.ItemDetailPage = new itemDetailPage();

View File

@ -1,4 +1,4 @@
var LibraryBrowser = (function (window, $) {
var LibraryBrowser = (function (window, document, $) {
var defaultBackground = "#999;";
@ -213,6 +213,7 @@
html += '<tr>';
html += '<th></th>';
html += '<th></th>';
html += '<th>Track</th>';
@ -236,6 +237,8 @@
html += '<tr>';
html += '<td><button data-icon="play" data-mini="true" data-iconpos="notext" onclick="LibraryBrowser.showPlayMenu(this, \'' + item.Id + '\', \'Audio\');">Options</button></td>';
var num = item.IndexNumber;
if (num && item.ParentIndexNumber) {
@ -281,6 +284,50 @@
return html;
},
showPlayMenu: function (positionTo, itemId, mediaType, resumePositionTicks) {
var isPlaying = MediaPlayer.isPlaying();
if (!isPlaying && !resumePositionTicks) {
MediaPlayer.playById(itemId);
return;
}
$('.playFlyout').popup("close").remove();
var html = '<div data-role="popup" class="playFlyout" style="max-width:300px;" data-corners="false" data-theme="c" data-history="false">';
html += '<ul data-role="listview" style="min-width: 150px;" data-theme="c">';
html += '<li data-role="list-divider" data-theme="a">Play Menu</li>';
html += '<li><a href="#" onclick="MediaPlayer.playById(\'' + itemId + '\');LibraryBrowser.closePlayMenu();">Play</a></li>';
if (resumePositionTicks) {
html += '<li><a href="#" onclick="MediaPlayer.playById(\'' + itemId + '\', resumePositionTicks);LibraryBrowser.closePlayMenu();">Play</a></li>';
}
if (isPlaying && MediaPlayer.canQueue(mediaType)) {
html += '<li><a href="#" onclick="MediaPlayer.playNext(\'' + itemId + '\');LibraryBrowser.closePlayMenu();">Play Next</a></li>';
html += '<li><a href="#" onclick="MediaPlayer.playLast(\'' + itemId + '\');LibraryBrowser.closePlayMenu();">Play Last</a></li>';
}
html += '</ul>';
html += '</div>';
$($.mobile.activePage).append(html);
$('.playFlyout').popup({ positionTo: positionTo || "window" }).trigger('create').popup("open").on("popupafterclose", function () {
$(this).off("popupafterclose").remove();
}).parents(".ui-popup-container").css("margin-left", 100);
},
closePlayMenu: function () {
$('.playFlyout').popup("close").remove();
},
getHref: function (item, itemByNameContext) {
if (item.url) {
@ -1472,4 +1519,4 @@
};
})(window, jQuery);
})(window, document, jQuery);

View File

@ -1,4 +1,4 @@
(function (document, clearTimeout, screen, localStorage, _V_, $, setInterval) {
(function (document, clearTimeout, screen, localStorage, _V_, $, setInterval, window) {
function mediaPlayer() {
var self = this;
@ -8,8 +8,7 @@
var currentMediaElement;
var currentProgressInterval;
function playAudio(items, params) {
var item = items[0];
function playAudio(item, params) {
var volume = localStorage.getItem("volume") || 0.5;
@ -84,12 +83,11 @@
}, 30000);
}
function playVideo(items, startPosition) {
function playVideo(item, startPosition) {
//stop/kill videoJS
if (currentMediaElement) self.stop();
var item = items[0];
// Account for screen rotation. Use the larger dimension as the width.
var screenWidth = Math.max(screen.height, screen.width);
var screenHeight = Math.min(screen.height, screen.width);
@ -282,10 +280,10 @@
if (item.MediaType === "Video") {
mediaElement = playVideo(items, startPosition);
mediaElement = playVideo(item, startPosition);
} else if (item.MediaType === "Audio") {
mediaElement = playAudio(items);
mediaElement = playAudio(item);
}
if (!mediaElement) {
@ -357,6 +355,28 @@
$('#mediaInfo', nowPlayingBar).html(html);
};
self.playById = function (id, startPositionTicks) {
ApiClient.getItem(Dashboard.getCurrentUserId(), id).done(function (item) {
self.play([item], startPositionTicks);
});
};
self.canQueue = function (mediaType) {
return mediaType == "Audio";
};
self.playLast = function(itemId) {
};
self.playNext = function (itemId) {
};
self.stop = function () {
var elem = currentMediaElement;
@ -411,7 +431,7 @@
if (currentProgressInterval) {
clearTimeout(currentProgressInterval);
}
}
};
self.stopAudio = function () {
var itemString = $(".itemAudio source").attr('src').match(new RegExp("Audio/[0-9a-z\-]+", "g"));
@ -427,7 +447,7 @@
if (currentProgressInterval) {
clearTimeout(currentProgressInterval);
}
}
};
self.isPlaying = function () {
return currentMediaElement;
@ -436,4 +456,4 @@
window.MediaPlayer = new mediaPlayer();
})(document, clearTimeout, screen, localStorage, _V_, $, setInterval);
})(document, clearTimeout, screen, localStorage, _V_, $, setInterval, window);

View File

@ -8,7 +8,7 @@
IncludeItemTypes: "Audio",
Recursive: true,
Fields: "ItemCounts,DateCreated,UserData,AudioInfo,ParentId",
Limit: 300,
Limit: 200,
StartIndex: 0
};