cotugno/jellyfin-web
2
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web.git synced 2024-11-17 19:08:18 -07:00
Code Issues Packages Projects Releases Wiki Activity

added play buttons to song table

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
dashboard-ui/css/detailtable.css
View File

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

8
dashboard-ui/scripts/Itemdetailpage.js
View File

@ -472,7 +472,7 @@
var item = items[i]; 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 || {}; var imageTags = item.ImageTags || {};
@ -618,12 +618,6 @@
var self = this; var self = this;
self.play = play; self.play = play;
self.playById = function (id) {
ApiClient.getItem(Dashboard.getCurrentUserId(), id).done(function (item) {
MediaPlayer.play([item]);
});
};
} }
window.ItemDetailPage = new itemDetailPage(); window.ItemDetailPage = new itemDetailPage();

51
dashboard-ui/scripts/librarybrowser.js
View File

@ -1,4 +1,4 @@
var LibraryBrowser = (function (window, $) { var LibraryBrowser = (function (window, document, $) {
var defaultBackground = "#999;"; var defaultBackground = "#999;";
@ -213,6 +213,7 @@
html += '<tr>'; html += '<tr>';
html += '<th></th>';
html += '<th></th>'; html += '<th></th>';
html += '<th>Track</th>'; html += '<th>Track</th>';
@ -236,6 +237,8 @@
html += '<tr>'; 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; var num = item.IndexNumber;
if (num && item.ParentIndexNumber) { if (num && item.ParentIndexNumber) {
@ -281,6 +284,50 @@
return html; 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) { getHref: function (item, itemByNameContext) {
if (item.url) { if (item.url) {
@ -1472,4 +1519,4 @@
}; };
})(window, jQuery); })(window, document, jQuery);

98
dashboard-ui/scripts/mediaplayer.js
View File

@ -1,4 +1,4 @@
(function (document, clearTimeout, screen, localStorage, _V_, $, setInterval) { (function (document, clearTimeout, screen, localStorage, _V_, $, setInterval, window) {
function mediaPlayer() { function mediaPlayer() {
var self = this; var self = this;
@ -8,8 +8,7 @@
var currentMediaElement; var currentMediaElement;
var currentProgressInterval; var currentProgressInterval;
function playAudio(items, params) { function playAudio(item, params) {
var item = items[0];
var volume = localStorage.getItem("volume") || 0.5; var volume = localStorage.getItem("volume") || 0.5;
@ -57,7 +56,7 @@
}); });
$(".itemAudio").on("ended", function () { $(".itemAudio").on("ended", function () {
MediaPlayer.stopAudio(item.Id); MediaPlayer.stopAudio(item.Id);
Playlist.playNext(); Playlist.playNext();
}); });
@ -66,30 +65,29 @@
localStorage.setItem("volume", this.volume); localStorage.setItem("volume", this.volume);
}); });
$(".itemAudio").on("play", updateAudioProgress(item.Id)); $(".itemAudio").on("play", updateAudioProgress(item.Id));
return $('audio', nowPlayingBar)[0]; return $('audio', nowPlayingBar)[0];
} }
function updateAudioProgress(itemId) { function updateAudioProgress(itemId) {
ApiClient.reportPlaybackStart(Dashboard.getCurrentUserId(), itemId); ApiClient.reportPlaybackStart(Dashboard.getCurrentUserId(), itemId);
currentProgressInterval = setInterval(function () { currentProgressInterval = setInterval(function () {
var position; var position;
$(".itemAudio").each(function () { $(".itemAudio").each(function () {
position = Math.floor(10000000 * this.currentTime); position = Math.floor(10000000 * this.currentTime);
}); });
ApiClient.reportPlaybackProgress(Dashboard.getCurrentUserId(), itemId, position); ApiClient.reportPlaybackProgress(Dashboard.getCurrentUserId(), itemId, position);
}, 30000); }, 30000);
} }
function playVideo(item, startPosition) {
function playVideo(items, startPosition) {
//stop/kill videoJS //stop/kill videoJS
if (currentMediaElement) self.stop(); if (currentMediaElement) self.stop();
var item = items[0];
// Account for screen rotation. Use the larger dimension as the width. // Account for screen rotation. Use the larger dimension as the width.
var screenWidth = Math.max(screen.height, screen.width); var screenWidth = Math.max(screen.height, screen.width);
var screenHeight = Math.min(screen.height, screen.width); var screenHeight = Math.min(screen.height, screen.width);
@ -223,11 +221,11 @@
} }
function updateProgress() { function updateProgress() {
var player = _V_("videoWindow"); var player = _V_("videoWindow");
var itemString = player.tag.src.match(new RegExp("Videos/[0-9a-z\-]+", "g")); var itemString = player.tag.src.match(new RegExp("Videos/[0-9a-z\-]+", "g"));
var itemId = itemString[0].replace("Videos/", ""); var itemId = itemString[0].replace("Videos/", "");
ApiClient.reportPlaybackStart(Dashboard.getCurrentUserId(), itemId); ApiClient.reportPlaybackStart(Dashboard.getCurrentUserId(), itemId);
currentProgressInterval = setInterval(function () { currentProgressInterval = setInterval(function () {
var player = _V_("videoWindow"); var player = _V_("videoWindow");
@ -282,10 +280,10 @@
if (item.MediaType === "Video") { if (item.MediaType === "Video") {
mediaElement = playVideo(items, startPosition); mediaElement = playVideo(item, startPosition);
} else if (item.MediaType === "Audio") { } else if (item.MediaType === "Audio") {
mediaElement = playAudio(items); mediaElement = playAudio(item);
} }
if (!mediaElement) { if (!mediaElement) {
@ -357,6 +355,28 @@
$('#mediaInfo', nowPlayingBar).html(html); $('#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 () { self.stop = function () {
var elem = currentMediaElement; var elem = currentMediaElement;
@ -382,7 +402,7 @@
//player.tech.destroy(); //player.tech.destroy();
player.destroy(); player.destroy();
} else { } else {
self.stopAudio(); self.stopAudio();
elem.pause(); elem.pause();
elem.src = ""; elem.src = "";
@ -411,23 +431,23 @@
if (currentProgressInterval) { if (currentProgressInterval) {
clearTimeout(currentProgressInterval); clearTimeout(currentProgressInterval);
} }
} };
self.stopAudio = function () { self.stopAudio = function () {
var itemString = $(".itemAudio source").attr('src').match(new RegExp("Audio/[0-9a-z\-]+", "g")); var itemString = $(".itemAudio source").attr('src').match(new RegExp("Audio/[0-9a-z\-]+", "g"));
var itemId = itemString[0].replace("Audio/", ""); var itemId = itemString[0].replace("Audio/", "");
var position; var position;
$(".itemAudio").each(function () { $(".itemAudio").each(function () {
position = Math.floor(10000000 * this.currentTime); position = Math.floor(10000000 * this.currentTime);
}); });
ApiClient.reportPlaybackStopped(Dashboard.getCurrentUserId(), itemId, position); ApiClient.reportPlaybackStopped(Dashboard.getCurrentUserId(), itemId, position);
if (currentProgressInterval) { if (currentProgressInterval) {
clearTimeout(currentProgressInterval); clearTimeout(currentProgressInterval);
} }
} };
self.isPlaying = function () { self.isPlaying = function () {
return currentMediaElement; return currentMediaElement;
@ -436,4 +456,4 @@
window.MediaPlayer = new mediaPlayer(); window.MediaPlayer = new mediaPlayer();
})(document, clearTimeout, screen, localStorage, _V_, $, setInterval); })(document, clearTimeout, screen, localStorage, _V_, $, setInterval, window);

2
dashboard-ui/scripts/songs.js
View File

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