andpp/mopidy-musicbox-webclient
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Add more button in browse pane

Browse Source 
1. Play all (flush queue, add all tracks and play)
 2. Play track (stop current, add track to next and play next)
 3. Play next (add track to next)
 4. Add track to queue
 5. Add all tracks to queue
This commit is contained in:
wagamama 2015-03-15 21:25:12 +08:00
parent 1714970211
commit f212658597
5 changed files with 90 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
mopidy_musicbox_webclient/static/index.html
View File

@ -143,7 +143,27 @@
<a href="#" onclick="closePopups();"><img id="artistpopupimage" src=""/></a>
</div>
<div data-role="popup" data-transition="none" data-theme="c" id="popupBrowse">
<div data-role="collapsible-set">
<ul data-role="listview" data-icon="false" id="popupBrowseLv">
<li>
<a href="#" onclick="return playBrowsedTracks(PLAY_ALL);">Play All</a>
</li>
<li>
<a href="#" onclick="return playBrowsedTracks(PLAY_NOW);">Play <span class="popupTrackName"></span></a>
</li>
<li class="addqueue">
<a href="#" onclick="return playBrowsedTracks(PLAY_NEXT);">Play Track Next</a>
</li>
<li class="addqueue">
<a href="#" onclick="return playBrowsedTracks(ADD_THIS_BOTTOM);">Add Track to Bottom of Queue</a>
</li>
<li class="addqueue">
<a href="#" onclick="return playBrowsedTracks(ADD_ALL_BOTTOM);">Add All to Bottom of Queue</a>
</li>
</ul>
</div>
</div>
<div data-role="popup" data-transition="none" data-theme="c" id="popupTracks">
<div data-role="collapsible-set">

57
mopidy_musicbox_webclient/static/js/controls.js vendored
View File

@ -4,12 +4,14 @@
function playBrowsedTracks(addtoqueue, trackid) {
//stop directly, for user feedback.
if (!addtoqueue) {
if (addtoqueue == PLAY_ALL) {
mopidy.playback.stop(true);
mopidy.tracklist.clear();
}
toast('Loading...');
trackid = typeof trackid !== 'undefined' ? trackid : $('#popupBrowse').data("track");
var selected = 0, counter = 0;
var isStream = isStreamUri(trackid);
@ -17,23 +19,48 @@ function playBrowsedTracks(addtoqueue, trackid) {
if (isStream) {
mopidy.tracklist.add(null, null, trackid);
} else {
//add selected item to the playlist
$('.browsetrack').each(function() {
if (this.id == trackid) {
selected = counter;
}
mopidy.tracklist.add(null, null, this.id);
counter++;
});
switch (addtoqueue) {
case PLAY_NOW:
case PLAY_NEXT:
//find track that is playing
for (var playing = 0; playing < currentplaylist.length; playing++) {
if (currentplaylist[playing].uri == songdata.uri) {
break;
}
}
mopidy.tracklist.add(null, playing + 1, trackid);
break;
case ADD_THIS_BOTTOM:
mopidy.tracklist.add(null, null, trackid);
break;
case ADD_ALL_BOTTOM:
case PLAY_ALL:
//add selected item to the playlist
$('.browsetrack').each(function() {
if (this.id == trackid) {
selected = counter;
}
mopidy.tracklist.add(null, null, this.id);
counter++;
});
break;
default:
break;
}
}
//play selected item
if (!addtoqueue) {
if (addtoqueue == PLAY_ALL) {
mopidy.playback.stop();
for (var i = 0; i <= selected; i++) {
mopidy.playback.next();
}
mopidy.playback.play(); //tracks[selected]);
} else if (addtoqueue == PLAY_NOW) {
mopidy.playback.stop();
mopidy.playback.next();
mopidy.playback.play();
}
//add all items, but selected to the playlist
@ -73,18 +100,18 @@ function playTrack(addtoqueue) {
mopidy.playback.stop(true);
mopidy.tracklist.clear();
}
$('#popupTracks').popup('close');
$('#controlspopup').popup('close');
toast('Loading...');
playlisturi = $('#popupTracks').data("list");
uri = $('#popupTracks').data("track");
var trackslist = new Array();
var track, tracksbefore, tracksafter;
var tracks = getTracksFromUri(playlisturi);
playlisturi = $('#popupTracks').data("list");
uri = $('#popupTracks').data("track");
//find track that was selected
for (var selected = 0; selected < tracks.length; selected++) {
if (tracks[selected].uri == uri) {
@ -140,7 +167,7 @@ function playTrack(addtoqueue) {
function playTrackByUri(track_uri, playlist_uri) {
function findAndPlayTrack(tltracks) {
// console.log('fa', tltracks, track_uri);
if (tltracks == []) { return;}
if (tltracks == []) { return;}
// Find track that was selected
for (var selected = 0; selected < tltracks.length; selected++) {
if (tltracks[selected].track.uri == track_uri) {

1
mopidy_musicbox_webclient/static/js/functionsvars.js
View File

@ -70,6 +70,7 @@ PLAY_NOW = 0;
PLAY_NEXT = 1;
ADD_THIS_BOTTOM = 2;
ADD_ALL_BOTTOM = 3;
PLAY_ALL = 4;
MAX_TABLEROWS = 50;

29
mopidy_musicbox_webclient/static/js/gui.js
View File

@ -90,7 +90,7 @@ function setSongInfo(data) {
}
};
}
songdata = data;
$("#modalname").html(data.name);
@ -109,7 +109,7 @@ function setSongInfo(data) {
}
var arttmp = '';
if(data.artists) {
for (var j = 0; j < data.artists.length; j++) {
artistshtml += '<a href="#" onclick="return showArtist(\'' + data.artists[j].uri + '\');">' + data.artists[j].name + '</a>';
@ -134,7 +134,7 @@ function setSongInfo(data) {
$("#trackslider").attr("min", 0);
$("#trackslider").attr("max", data.length);
resizeMb();
}
@ -159,7 +159,7 @@ function popupTracks(e, listuri, trackuri) {
if (popupData[trackuri].artists) {
if (popupData[trackuri].artists.length == 1) {
child = '<a href="#" onclick="showArtist(\'' + popupData[trackuri].artists[0].uri + '\');">Show Artist</a>';
child = '<a href="#" onclick="showArtist(\'' + popupData[trackuri].artists[0].uri + '\');">Show Artist</a>';
$('.popupArtistName').html(popupData[trackuri].artists[0].name);
$('.popupArtistHref').attr('onclick', 'showArtist("' + popupData[trackuri].artists[0].uri + '");' );
$('.popupArtistsDiv').hide();
@ -184,9 +184,12 @@ function popupTracks(e, listuri, trackuri) {
if (divid == 'current') {
$(".addqueue").hide();
var popupName = '#popupQueue';
} else if (divid == 'browse') {
$(".addqueue").show();
var popupName = '#popupBrowse';
} else {
$(".addqueue").show();
var popupName = '#popupTracks';
var popupName = '#popupTracks';
}
$(popupName).data("list", listuri).data("track", trackuri).popup("open", {
@ -221,7 +224,7 @@ function initSocketevents() {
resetSong();
showOffline(true);
});
mopidy.on("event:optionsChanged", updateOptions);
mopidy.on("event:trackPlaybackStarted", function(data) {
@ -487,9 +490,9 @@ $(document).ready(function(event) {
//navigation temporary, rewrite this!
$('#songinfo').click(
function()
function()
{return switchContent('nowPlaying')} );
$('#controlspopupimage').click(
$('#controlspopupimage').click(
function() {
return switchContent('current')} );
$('#navEnterFullscreen').click(function(){
@ -552,16 +555,16 @@ $(document).ready(function(event) {
// swipe songinfo and panel
$( "#normalFooter, #nowPlayingFooter" ).on( "swiperight", doPrevious );
$( "#normalFooter, #nowPlayingFooter" ).on( "swipeleft", doNext );
$( "#nowPlayingpane, .ui-body-c, #header, #panel, .pane" ).on( "swiperight", function() {
$( "#nowPlayingpane, .ui-body-c, #header, #panel, .pane" ).on( "swiperight", function() {
if(!$(event.target).is("#normalFooter") && !$(event.target).is("#nowPlayingFooter")) {
$("#panel").panel("open");
event.stopImmediatePropagation(); }
} );
$( "#nowPlayingpane, .ui-body-c, #header, #panel, .pane" ).on( "swipeleft", function() {
} );
$( "#nowPlayingpane, .ui-body-c, #header, #panel, .pane" ).on( "swipeleft", function() {
if(!$(event.target).is("#normalFooter") && !$(event.target).is("#nowPlayingFooter")) {
$("#panel").panel("close");
$("#panel").panel("close");
event.stopImmediatePropagation(); }
} );
} );
});
function updatePlayIcons (uri) {

14
mopidy_musicbox_webclient/static/js/process_ws.js
View File

@ -110,13 +110,19 @@ function processBrowseDir(resultArr) {
iconClass = getMediaClass(resultArr[i].uri);
if(resultArr[i].type == 'track' ) {
// console.log(resultArr[i]);
child += '<li id="browselisttracks-' + resultArr[i].uri + '"><a href="#" class="browsetrack" onclick="return playBrowsedTracks(0, this.id);" id="' + resultArr[i].uri +
mopidy.library.lookup(resultArr[i].uri).then(function (resultArr) {
popupData[resultArr[0].uri] = resultArr[0];
}, console.error);
child += '<li class="song albumli" id="browselisttracks-' + resultArr[i].uri + '">' +
'<a href="#" class="moreBtn" onclick="return popupTracks(event, \'' + uri + '\', \'' + resultArr[i].uri + '\');">' +
'<i class="fa fa-ellipsis-v"></i></a>' +
'<a href="#" class="browsetrack" onclick="return playBrowsedTracks(ADD_THIS_BOTTOM, this.id);" id="' + resultArr[i].uri +
'"><h1 class="trackname"><i class="' + iconClass + '"></i> ' + resultArr[i].name + '</h1></a></li>';
} else {
if (browseStack.length > 0) {
iconClass="fa fa-folder-o";
}
child += '<li><a href="#" onclick="return getBrowseDir(this.id);" id="' + resultArr[i].uri +
child += '<li><a href="#" onclick="return getBrowseDir(this.id);" id="' + resultArr[i].uri +
'""><h1 class="trackname"><i class="' + iconClass + '"></i> ' + resultArr[i].name + '</h1></a></li>';
}
};
@ -156,11 +162,11 @@ function processGetPlaylists(resultArr) {
var child, tmp = '',
starredRegex = /spotify:user:.*:starred/g,
iconClass, starred;
for (var i = 0; i < resultArr.length; i++) {
iconClass = getMediaClass(resultArr[i].uri);
// Check if this is Spotify's "Starred" playlist
if(starredRegex.test(resultArr[i].uri)) {
starred = '<li><a href="#" onclick="return showTracklist(this.id);" id="' + resultArr[i].uri + '"">&#9733; Spotify Starred Tracks</a></li>';