-
-
-
+
diff --git a/mopidy_musicbox_webclient/static/js/controls.js b/mopidy_musicbox_webclient/static/js/controls.js
index 2638886..41d5471 100644
--- a/mopidy_musicbox_webclient/static/js/controls.js
+++ b/mopidy_musicbox_webclient/static/js/controls.js
@@ -1,665 +1,658 @@
-/***********************************
- * play tracks from a browse list *
- ***********************************/
-function playBrowsedTracks(action, trackIndex) {
- $('#popupBrowse').popup('close');
- toast('Loading...');
+(function (root, factory) {
+ if (typeof define === 'function' && define.amd) {
+ define([], factory)
+ } else if (typeof module === 'object' && module.exports) {
+ module.exports = factory()
+ } else {
+ root.controls = factory()
+ }
+}(this, function () {
+ 'use strict'
- if (typeof trackIndex === 'undefined') {
- trackIndex = $('#popupBrowse').data("tlid");
- }
- if (action == PLAY_ALL) {
- mopidy.tracklist.clear();
- // Default for radio streams is to just add the selected URI.
- if (isStreamUri(browseTracks[trackIndex].uri)) {
- action = PLAY_NOW;
- }
- }
- var trackUris = [];
- switch (action) {
- case PLAY_NOW:
- case PLAY_NEXT:
- case ADD_THIS_BOTTOM:
- trackUris.push(browseTracks[trackIndex].uri);
- break;
- case PLAY_ALL:
- case ADD_ALL_BOTTOM:
- trackUris = getUris(browseTracks);
- break;
- default:
- break;
- }
- var maybePlay = function(tlTracks) {
- if (action === PLAY_NOW || action === PLAY_ALL) {
- var playIndex = (action === PLAY_ALL) ? trackIndex : 0;
- mopidy.playback.play({'tl_track': tlTracks[playIndex]});
- }
- };
-
- switch (action) {
- case PLAY_NOW:
- case PLAY_NEXT:
- mopidy.tracklist.index().then(function (currentIndex) {
- mopidy.tracklist.add({'at_position': currentIndex + 1, 'uris': trackUris}).then(maybePlay);
- });
- break;
- case ADD_THIS_BOTTOM:
- case ADD_ALL_BOTTOM:
- case PLAY_ALL:
- mopidy.tracklist.add({'uris': trackUris}).then(maybePlay);
- break;
- default:
- break;
- }
- return false;
-}
+ var controls = {
-/*********************************
- * play an uri from a tracklist *
- *********************************/
-function playTrack(action) {
- var hash = document.location.hash.split('?');
- var divid = hash[0].substr(1);
+ /**
+ * 'onClick' handler for tracks that are rendered in a list.
+ *
+ * Adds tracks to current tracklist and starts playback if necessary.
+ *
+ * @param {string} action - The action to perform. Valid actions are:
+ * PLAY_NOW: add the track at 'trackIndex' and start playback.
+ * PLAY_NEXT: insert track after currently playing track.
+ * ADD_THIS_BOTTOM: add track to bottom of tracklist.
+ * ADD_ALL_BOTTOM: add all tracks in in the list to bottom of
+ * tracklist.
+ * PLAY_ALL: clear tracklist and start playback of the track
+ * with URI provided in 'trackUri'.
+ * @param {object} mopidy - The Mopidy.js object that should be used to communicate with the
+ * Mopidy server.
+ * @param {string} trackUri - (Optional) The URI of the specific track that the action should
+ * be performed on. If no URI is provided then the 'data' attribute
+ * of the popup DIV is assumed to contain the track URI.
+ * @param {string} playlistUri - (Optional) The URI of the playlist containing the tracks
+ * to be played. If no URI is provided then the 'list' attribute
+ * of the popup DIV is assumed to contain the playlist URI.
+ */
- // Search page default click behaviour adds and plays selected track only.
- if (action == PLAY_NOW && divid == 'search') {
- action = PLAY_NOW_SEARCH;
- }
-
- $('#popupTracks').popup('close');
- $('#controlspopup').popup('close');
- toast('Loading...');
+ playTracks: function (action, mopidy, trackUri, playlistUri) {
+ $('#popupTracks').popup('close')
+ toast('Loading...')
- playlisturi = $('#popupTracks').data("list");
- uri = $('#popupTracks').data("track");
+ trackUri = trackUri || $('#popupTracks').data('track')
+ if (typeof trackUri === 'undefined') {
+ throw new Error('No track URI provided for playback.')
+ }
+ playlistUri = playlistUri || $('#popupTracks').data('list')
+ if (typeof playlistUri === 'undefined') {
+ throw new Error('No playlist URI provided for playback.')
+ }
- var trackUris = getTracksFromUri(playlisturi);
- //find track that was selected
- for (var selected = 0; selected < trackUris.length; selected++) {
- if (trackUris[selected] == uri) {
- break;
- }
- }
- switch (action) {
- case ADD_THIS_BOTTOM:
- case PLAY_NEXT:
- case PLAY_NOW_SEARCH:
- trackUris = [trackUris[selected]];
- selected = 0;
- }
- switch (action) {
- case PLAY_NOW:
- case PLAY_NOW_SEARCH:
+ action = controls.getAction(action)
+
+ if (action === PLAY_ALL) {
+ mopidy.tracklist.clear()
+ }
+
+ var trackUris = controls._getTrackURIsForAction(action, trackUri, playlistUri)
+ // Add the tracks and start playback if necessary.
+ switch (action) {
+ case PLAY_NOW:
+ case PLAY_NEXT:
+ // Find track that is currently playing.
+ mopidy.tracklist.index().then(function (currentIndex) {
+ // Add browsed track just below it.
+ mopidy.tracklist.add({at_position: currentIndex + 1, uris: trackUris}).then(function (tlTracks) {
+ if (action === PLAY_NOW) { // Start playback immediately.
+ mopidy.playback.stop().then(function () {
+ mopidy.playback.play({tlid: tlTracks[0].tlid})
+ })
+ }
+ })
+ })
+ break
+ case ADD_THIS_BOTTOM:
+ case ADD_ALL_BOTTOM:
+ case PLAY_ALL:
+ mopidy.tracklist.add({uris: trackUris}).then(function (tlTracks) {
+ if (action === PLAY_ALL) { // Start playback of selected track immediately.
+ mopidy.tracklist.filter({uri: [trackUri]}).then(function (tlTracks) {
+ mopidy.playback.stop().then(function () {
+ mopidy.playback.play({tlid: tlTracks[0].tlid})
+ })
+ })
+ }
+ })
+ break
+ default:
+ throw new Error('Unexpected tracklist action identifier: ' + action)
+ }
+
+ if (window[$(document.body).data('on-track-click')] === DYNAMIC) {
+ // Save last 'action' - will become default for future 'onClick' events
+ var previousAction = $.cookie('onTrackClick')
+ if (typeof previousAction === 'undefined' || action !== previousAction) {
+ $.cookie('onTrackClick', action, { expires: 365 })
+ updatePlayIcons('', '', controls.getIconForAction(action))
+ }
+ }
+ },
+
+ /* Getter function for 'action' variable. Also checks config settings and cookies if required. */
+ getAction: function (action) {
+ if (typeof action === 'undefined' || action.length === 0) { // Action parameter not provided, use defaults
+ action = window[$(document.body).data('on-track-click')]
+ }
+ if (action === DYNAMIC) { // Re-use last action stored in cookie.
+ action = $.cookie('onTrackClick')
+ if (typeof action === 'undefined') {
+ action = PLAY_ALL // Backwards-compatible default value.
+ }
+ }
+ return action
+ },
+
+ /* Retrieves the Font Awesome character for the given action. */
+ getIconForAction: function (action) {
+ action = controls.getAction(action)
+
+ switch (parseInt(action)) {
+ case PLAY_ALL:
+ return 'fa fa-play-circle'
+ case PLAY_NOW:
+ return 'fa fa-play-circle-o'
+ case PLAY_NEXT:
+ return 'fa fa-level-down'
+ case ADD_THIS_BOTTOM:
+ return 'fa fa-plus-square-o'
+ case ADD_ALL_BOTTOM:
+ return 'fa fa-plus-square'
+ default:
+ throw new Error('Unkown tracklist action identifier: ' + action)
+ }
+ },
+
+ /* Retrieves the relevant track URIs for the given action. */
+ _getTrackURIsForAction: function (action, trackUri, playlistUri) {
+ var trackUris = []
+ // Fill 'trackUris', by determining which tracks should be added.
+ switch (parseInt(action)) {
+ case PLAY_NOW:
+ case PLAY_NEXT:
+ case ADD_THIS_BOTTOM:
+ // Process single track
+ trackUris.push(trackUri)
+ break
+ case PLAY_ALL:
+ case ADD_ALL_BOTTOM:
+ // Process all tracks in playlist
+ trackUris = getTracksFromUri(playlistUri, false)
+ break
+ default:
+ throw new Error('Unexpected tracklist action identifier: ' + action)
+ }
+ return trackUris
+ },
+
+ /** ******************************************************
+ * play an uri from the queue
+ *********************************************************/
+
+ /** *
+ * Plays a Track from a Playlist.
+ * @param tlid
+ * @returns {boolean}
+ */
+ playQueueTrack: function (tlid) {
+ // Stop directly, for user feedback
+ mopidy.playback.stop()
+ $('#popupQueue').popup('close')
+ toast('Loading...')
+
+ tlid = tlid || $('#popupQueue').data('tlid')
+ mopidy.playback.play({'tlid': parseInt(tlid)})
+ },
+
+ /** *********************************
+ * remove a track from the queue *
+ ***********************************/
+ removeTrack: function (tlid) {
+ $('#popupQueue').popup('close')
+ toast('Deleting...')
+
+ tlid = tlid || $('#popupQueue').data('tlid')
+ mopidy.tracklist.remove({'tlid': [parseInt(tlid)]})
+ },
+
+ clearQueue: function () {
mopidy.tracklist.clear().then(
- mopidy.tracklist.add({'uris': trackUris}).then(
- function(tlTracks) {
- mopidy.playback.play({'tl_track': tlTracks[selected]});
- }
- )
- );
- break;
- case PLAY_NEXT:
- mopidy.tracklist.index().then(function(currentIndex) {
- mopidy.tracklist.add({'at_position': currentIndex + 1, 'uris': trackUris});
- });
- break;
- case ADD_THIS_BOTTOM:
- case ADD_ALL_BOTTOM:
- mopidy.tracklist.add({'uris': trackUris});
- break;
- }
- return false;
-}
+ resetSong()
+ )
+ return false
+ },
-/***
- * Plays a Track given by an URI from the given playlist URI.
- * @param track_uri, playlist_uri
- * @returns {boolean}
- */
-function playTrackByUri(track_uri, playlist_uri) {
- function findAndPlayTrack(tlTracks) {
- if (tlTracks.length > 0) {
- // Find track that was selected
- for (var selected = 0; selected < tlTracks.length; selected++) {
- if (tlTracks[selected].track.uri == track_uri) {
- mopidy.playback.play({'tl_track': tlTracks[selected]});
- return;
+ savePressed: function (key) {
+ if (key === 13) {
+ controls.saveQueue()
+ return false
+ }
+ return true
+ },
+
+ showSavePopup: function () {
+ mopidy.tracklist.getTracks().then(function (tracks) {
+ if (tracks.length > 0) {
+ $('#saveinput').val('')
+ $('#popupSave').popup('open')
}
+ })
+ },
+
+ saveQueue: function () {
+ mopidy.tracklist.getTracks().then(function (tracks) {
+ var playlistName = $('#saveinput').val().trim()
+ if (playlistName !== null && playlistName !== '') {
+ controls.getPlaylistByName(playlistName, 'm3u', false).then(function (exists) {
+ if (exists) {
+ $('#popupSave').popup('close')
+ $('#popupOverwrite').popup('open')
+ $('#overwriteConfirmBtn').click(function () {
+ controls.initSave(playlistName, tracks)
+ })
+ } else {
+ controls.initSave(playlistName, tracks)
+ }
+ })
+ }
+ })
+ return false
+ },
+
+ initSave: function (playlistName, tracks) {
+ $('#popupOverwrite').popup('close')
+ $('#popupSave').popup('close')
+ $('#saveinput').val('')
+ toast('Saving...')
+ mopidy.playlists.create({'name': playlistName, 'uri_scheme': 'm3u'}).then(function (playlist) {
+ playlist.tracks = tracks
+ mopidy.playlists.save({'playlist': playlist}).then()
+ })
+ },
+
+ refreshPlaylists: function () {
+ mopidy.playlists.refresh().then(function () {
+ playlists = {}
+ $('#playlisttracksdiv').hide()
+ $('#playlistslistdiv').show()
+ })
+ return false
+ },
+
+ /** ***********
+ * Buttons *
+ *************/
+
+ doShuffle: function () {
+ mopidy.playback.stop()
+ mopidy.tracklist.shuffle()
+ mopidy.playback.play()
+ },
+
+ /* Toggle state of play button */
+ setPlayState: function (nwplay) {
+ if (nwplay) {
+ $('#btplayNowPlaying >i').removeClass('fa-play').addClass('fa-pause')
+ $('#btplayNowPlaying').attr('title', 'Pause')
+ $('#btplay >i').removeClass('fa-play').addClass('fa-pause')
+ $('#btplay').attr('title', 'Pause')
+ mopidy.playback.getTimePosition().then(processCurrentposition, console.error)
+ syncedProgressTimer.start()
+ } else {
+ $('#btplayNowPlaying >i').removeClass('fa-pause').addClass('fa-play')
+ $('#btplayNowPlaying').attr('title', 'Play')
+ $('#btplay >i').removeClass('fa-pause').addClass('fa-play')
+ $('#btplay').attr('title', 'Play')
+ syncedProgressTimer.stop()
}
- }
- console.error('Failed to find and play selected track ', track_uri);
- return;
- }
+ play = nwplay
+ },
- // Stop directly, for user feedback
- mopidy.tracklist.clear();
-
- //this is deprecated, remove when popuptracks is removed completly
- $('#popupTracks').popup('close');
- $('#controlspopup').popup('close');
- //end of deprecated
-
- toast('Loading...');
-
- mopidy.tracklist.add({'uris': [playlist_uri]}).then(function(tlTracks) {
- // Can fail for all sorts of reasons. If so, just add individually.
- if (tlTracks.length === 0) {
- var trackUris = getTracksFromUri(playlist_uri, false);
- mopidy.tracklist.add({'uris': trackUris}).then(findAndPlayTrack);
- } else {
- findAndPlayTrack(tlTracks);
- }
- });
- return false;
-}
-
-/********************************************************
- * play an uri from the queue
- *********************************************************/
-
-/***
- * Plays a Track from a Playlist.
- * @param uri
- * @param tlid
- * @returns {boolean}
- */
-function playTrackQueueByTlid(uri, tlid) {
- //stop directly, for user feedback
- mopidy.playback.stop();
- $('#popupQueue').popup('close');
- toast('Loading...');
-
- tlid = parseInt(tlid);
- mopidy.tracklist.filter({
- 'tlid': [tlid]
- }).then(
- function(tlTracks) {
- if (tlTracks.length > 0) {
- mopidy.playback.play({'tl_track': tlTracks[0]});
- return;
- }
- console.log('Failed to play selected track ', tlid);
- }
- );
- return false;
-}
-
-/***
- * @deprecated
- * @returns {boolean}
- */
-function playTrackQueue() {
- uri = $('#popupQueue').data("track");
- tlid = $('#popupQueue').data("tlid");
- return playTrackQueueByTlid(uri, tlid);
-}
-
-/***********************************
- * remove a track from the queue *
- ***********************************/
-function removeTrack() {
- $('#popupQueue').popup('close');
- toast('Deleting...');
-
- tlid = parseInt($('#popupQueue').data("tlid"));
- console.log(tlid);
- mopidy.tracklist.remove({'tlid': [tlid]});
-}
-
-function clearQueue() {
- mopidy.tracklist.clear().then(
- resetSong()
- );
- return false;
-}
-
-function savePressed(key) {
- if (key == 13) {
- saveQueue();
- return false;
- }
- return true;
-}
-
-function showSavePopup(){
- mopidy.tracklist.getTracks().then(function(tracks) {
- if (tracks.length > 0) {
- $('#saveinput').val('');
- $('#popupSave').popup('open');
- }
- });
-
-}
-
-function saveQueue() {
- mopidy.tracklist.getTracks().then(function(tracks) {
- var playlistName = $('#saveinput').val().trim();
- if (playlistName !== null && playlistName !== "") {
- getPlaylistByName(playlistName, 'm3u', false).then(function(exists) {
- if (exists) {
- $('#popupSave').popup('close');
- $('#popupOverwrite').popup('open');
- $('#overwriteConfirmBtn').click(function() {
- initSave(playlistName, tracks);
- });
+ // play or pause
+ doPlay: function () {
+ toast('Please wait...', 250)
+ if (!play) {
+ mopidy.playback.play()
+ } else {
+ if (isStreamUri(songdata.track.uri)) {
+ mopidy.playback.stop()
} else {
- initSave(playlistName, tracks);
+ mopidy.playback.pause()
}
- });
- }
- });
- return false;
-}
-
-function initSave(playlistName, tracks) {
- $('#popupOverwrite').popup('close');
- $('#popupSave').popup('close');
- $('#saveinput').val('');
- toast('Saving...');
- mopidy.playlists.create({'name': playlistName, 'uri_scheme': "m3u"}).then(function(playlist) {
- playlist.tracks = tracks;
- mopidy.playlists.save({'playlist': playlist}).then();
- });
-}
-
-function refreshPlaylists() {
- mopidy.playlists.refresh().then(function() {
- playlists = {};
- $('#playlisttracksdiv').hide();
- $('#playlistslistdiv').show();
- });
- return false;
-}
-
-/*************
- * Buttons *
- *************/
-
-function doShuffle() {
- mopidy.playback.stop();
- mopidy.tracklist.shuffle();
- mopidy.playback.play();
-}
-
-/* Toggle state of play button */
-function setPlayState(nwplay) {
- if (nwplay) {
- $("#btplayNowPlaying >i").removeClass('fa-play').addClass('fa-pause');
- $("#btplayNowPlaying").attr('title', 'Pause');
- $("#btplay >i").removeClass('fa-play').addClass('fa-pause');
- $("#btplay").attr('title', 'Pause');
- mopidy.playback.getTimePosition().then(processCurrentposition, console.error);
- startProgressTimer();
- } else {
- $("#btplayNowPlaying >i").removeClass('fa-pause').addClass('fa-play');
- $("#btplayNowPlaying").attr('title', 'Play');
- $("#btplay >i").removeClass('fa-pause').addClass('fa-play');
- $("#btplay").attr('title', 'Play');
- progressTimer.stop();
- }
- play = nwplay;
-}
-
-//play or pause
-function doPlay() {
- toast('Please wait...', 250);
- if (!play) {
- mopidy.playback.play();
- } else {
- if(isStreamUri(songdata.track.uri)) {
- mopidy.playback.stop();
- } else {
- mopidy.playback.pause();
- }
- }
- setPlayState(!play);
-}
-
-function doPrevious() {
- toast('Playing previous track...');
- mopidy.playback.previous();
-}
-
-function doNext() {
- toast('Playing next track...');
- mopidy.playback.next();
-}
-
-function backbt() {
- history.back();
- return false;
-}
-
-/*************
- * Options *
- *************/
-function setTracklistOption(name, new_value) {
- if (!new_value) {
- $("#"+name+"bt").attr('style', 'color:#2489ce');
- } else {
- $("#"+name+"bt").attr('style', 'color:#66DD33');
- }
- return new_value;
-}
-
-function setRepeat(nwrepeat) {
- if (repeat != nwrepeat) {
- repeat = setTracklistOption("repeat", nwrepeat);
- }
-}
-
-function setRandom(nwrandom) {
- if (random != nwrandom) {
- random = setTracklistOption("random", nwrandom);
- }
-}
-
-function setConsume(nwconsume) {
- if (consume != nwconsume) {
- consume = setTracklistOption("consume", nwconsume);
- }
-}
-
-function setSingle(nwsingle) {
- if (single != nwsingle) {
- single = setTracklistOption("single", nwsingle);
- }
-}
-
-function doRandom() {
- mopidy.tracklist.setRandom({'value': !random}).then();
-}
-
-function doRepeat() {
- mopidy.tracklist.setRepeat({'value': !repeat}).then();
-}
-
-function doConsume() {
- mopidy.tracklist.setConsume({'value': !consume}).then();
-}
-
-function doSingle() {
- mopidy.tracklist.setSingle({'value': !single}).then();
-}
-
-
-/***********************************************
- * Track Slider *
- * Use a timer to prevent looping of commands *
- ***********************************************/
-function doSeekPos(value) {
- if (!positionChanging) {
- positionChanging = value;
- mopidy.playback.seek({'time_position': Math.round(value)}).then( function() {
- positionChanging = null;
- });
- }
-}
-
-function setPosition(pos) {
- if (!positionChanging && $("#trackslider").val() != pos) {
- setProgressTimer(pos);
- }
-}
-
-/***********************************************
- * Volume slider *
- * Use a timer to prevent looping of commands *
- ***********************************************/
-
-function setVolume(value) {
- if (!volumeChanging && !volumeSliding && $("#volumeslider").val() != value) {
- $( "#volumeslider" ).off( "change");
- $( "#volumeslider" ).val(value).slider('refresh');
- $( "#volumeslider" ).on( "change", function() { doVolume( $(this).val() ); } );
- }
-}
-
-function doVolume(value) {
- if (!volumeChanging) {
- volumeChanging = value;
- mopidy.playback.setVolume({'volume': parseInt(volumeChanging)}).then( function() {
- volumeChanging = null;
- });
- }
-}
-
-function setMute(nwmute) {
- if (mute != nwmute) {
- mute = nwmute;
- if (mute) {
- $("#mutebt").attr('class', 'fa fa-volume-off');
- } else {
- $("#mutebt").attr('class', 'fa fa-volume-up');
- }
- }
-}
-
-function doMute() {
- mopidy.mixer.setMute({'mute': !mute});
-}
-
-/************
- * Stream *
- ************/
-function streamPressed(key) {
- if (key == 13) {
- playStreamUri();
- return false;
- }
- return true;
-}
-
-function playStreamUri(uri) {
- //value of name is based on the passing of an uri as a parameter or not
- var nwuri = uri || $('#streamuriinput').val().trim();
- var service = $('#selectstreamservice').val();
- if (!uri && service) {
- nwuri = service + ':' + nwuri;
- }
- if (isServiceUri(nwuri) || isStreamUri(nwuri) || validUri(nwuri)) {
- toast('Playing...');
- //stop directly, for user feedback
- mopidy.playback.stop();
- //hide ios/android keyboard
- document.activeElement.blur();
- clearQueue();
- $("input").blur();
- mopidy.tracklist.add({'uris': [nwuri]});
- mopidy.playback.play();
- } else {
- toast('No valid url!');
- }
- return false;
-}
-
-function getCurrentlyPlaying() {
- $('#streamuriinput').val(songdata.track.uri);
- var name = songdata.track.name;
- if (songdata.track.artists) {
- var artistStr = artistsToString(songdata.track.artists);
- if (artistStr) {
- name = artistStr + ' - ' + name;
- }
- }
- $('#streamnameinput').val(name);
- return true;
-}
-
-function getUriSchemes() {
- uriSchemes = {};
- return mopidy.getUriSchemes().then(function(schemes) {
- for (var i = 0; i < schemes.length; i++) {
- uriSchemes[schemes[i].toLowerCase()] = true;
- }
- });
-}
-
-function getPlaylistByName(name, scheme, create) {
- var uri_scheme = scheme || '';
- var uri = '';
- if (uri_scheme && !uriSchemes[uri_scheme]) {
- return Mopidy.when(false);
- }
- return mopidy.playlists.asList().catch(console.error.bind(console)).then(function(plists) {
- for (var i = 0; i < plists.length; i++) {
- if ((plists[i].name === name) && (uri_scheme === '' || getScheme(plists[i].uri) === uri_scheme)) {
- return plists[i];
}
- }
- if (create) {
- return mopidy.playlists.create({'name': name, 'uri_scheme': uri_scheme}).done(function(plist) {
- console.log("Created playlist '%s'", plist.name);
- return plist;
- });
- }
- console.log("Can't find playist '%s", name);
- return Mopidy.when(false);
- });
-}
+ controls.setPlayState(!play)
+ },
-function getPlaylistFull(uri) {
- return mopidy.playlists.lookup({'uri': uri}).then(function(pl) {
- playlists[uri] = pl;
- return pl;
- });
-}
+ doPrevious: function () {
+ toast('Playing previous track...')
+ mopidy.playback.previous()
+ },
-function getFavourites() {
- return getPlaylistByName(STREAMS_PLAYLIST_NAME,
- STREAMS_PLAYLIST_SCHEME,
- true).then(function(playlist) {
- if (playlist) {
- return getPlaylistFull(playlist.uri);
- }
- return Mopidy.when(false);
- });
-}
+ doNext: function () {
+ toast('Playing next track...')
+ mopidy.playback.next()
+ },
-function addToFavourites(newTracks) {
- getFavourites().catch(console.error.bind(console)).then(function(favourites) {
- if (favourites) {
- if (favourites.tracks) {
- Array.prototype.push.apply(favourites.tracks, newTracks);
+ backbt: function () {
+ history.back()
+ return false
+ },
+
+ /** ***********
+ * Options *
+ *************/
+ setTracklistOption: function (name, new_value) {
+ if (!new_value) {
+ $('#' + name + 'bt').attr('style', 'color:#2489ce')
} else {
- favourites.tracks = newTracks;
+ $('#' + name + 'bt').attr('style', 'color:#66DD33')
}
- mopidy.playlists.save({'playlist': favourites}).then(function(s) {
- showFavourites();
- });
- }
- });
-}
+ return new_value
+ },
-function addFavourite(uri, name) {
- var uri = uri || $('#streamuriinput').val().trim();
- var name = name || $('#streamnameinput').val().trim();
- mopidy.library.lookup({'uris': [uri]}).then(function(results) {
- var newTracks = results[uri];
- if (newTracks.length == 1) {
- // TODO: Supporting adding an entire playlist?
- if (name) {
- newTracks[0].name = name; // User overrides name.
+ setRepeat: function (nwrepeat) {
+ if (repeat !== nwrepeat) {
+ repeat = controls.setTracklistOption('repeat', nwrepeat)
}
- addToFavourites(newTracks);
- } else {
- if (newTracks.length === 0) {
- console.log('No tracks to add');
+ },
+
+ setRandom: function (nwrandom) {
+ if (random !== nwrandom) {
+ random = controls.setTracklistOption('random', nwrandom)
+ }
+ },
+
+ setConsume: function (nwconsume) {
+ if (consume !== nwconsume) {
+ consume = controls.setTracklistOption('consume', nwconsume)
+ }
+ },
+
+ setSingle: function (nwsingle) {
+ if (single !== nwsingle) {
+ single = controls.setTracklistOption('single', nwsingle)
+ }
+ },
+
+ doRandom: function () {
+ mopidy.tracklist.setRandom({'value': !random}).then()
+ },
+
+ doRepeat: function () {
+ mopidy.tracklist.setRepeat({'value': !repeat}).then()
+ },
+
+ doConsume: function () {
+ mopidy.tracklist.setConsume({'value': !consume}).then()
+ },
+
+ doSingle: function () {
+ mopidy.tracklist.setSingle({'value': !single}).then()
+ },
+
+ /** *********************************************
+ * Track Slider *
+ * Use a timer to prevent looping of commands *
+ ***********************************************/
+ doSeekPos: function (value) {
+ if (!positionChanging) {
+ positionChanging = value
+ mopidy.playback.seek({'time_position': Math.round(value)}).then(function () {
+ positionChanging = null
+ })
+ }
+ },
+
+ setPosition: function (pos) {
+ if (!positionChanging && $('#trackslider').val() !== pos) {
+ syncedProgressTimer.set(pos)
+ }
+ },
+
+ /** *********************************************
+ * Volume slider *
+ * Use a timer to prevent looping of commands *
+ ***********************************************/
+
+ setVolume: function (value) {
+ if (!volumeChanging && !volumeSliding && $('#volumeslider').val() !== value) {
+ $('#volumeslider').off('change')
+ $('#volumeslider').val(value).slider('refresh')
+ $('#volumeslider').on('change', function () { controls.doVolume($(this).val()) })
+ }
+ },
+
+ doVolume: function (value) {
+ if (!volumeChanging) {
+ volumeChanging = value
+ mopidy.playback.setVolume({'volume': parseInt(volumeChanging)}).then(function () {
+ volumeChanging = null
+ })
+ }
+ },
+
+ setMute: function (nwmute) {
+ if (mute !== nwmute) {
+ mute = nwmute
+ if (mute) {
+ $('#mutebt').attr('class', 'fa fa-volume-off')
+ } else {
+ $('#mutebt').attr('class', 'fa fa-volume-up')
+ }
+ }
+ },
+
+ doMute: function () {
+ mopidy.mixer.setMute({'mute': !mute})
+ },
+
+ /** **********
+ * Stream *
+ ************/
+ streamPressed: function (key) {
+ if (key === 13) {
+ controls.playStreamUri()
+ return false
+ }
+ return true
+ },
+
+ playStreamUri: function (uri) {
+ // value of name is based on the passing of an uri as a parameter or not
+ var nwuri = uri || $('#streamuriinput').val().trim()
+ var service = $('#selectstreamservice').val()
+ if (!uri && service) {
+ nwuri = service + ':' + nwuri
+ }
+ if (isServiceUri(nwuri) || isStreamUri(nwuri) || validUri(nwuri)) {
+ toast('Playing...')
+ // stop directly, for user feedback
+ mopidy.playback.stop()
+ // hide ios/android keyboard
+ document.activeElement.blur()
+ controls.clearQueue()
+ $('input').blur()
+ mopidy.tracklist.add({'uris': [nwuri]})
+ mopidy.playback.play()
} else {
- console.log('Too many tracks (%d) to add', tracks.length);
+ toast('No valid url!')
}
- }
- });
-}
+ return false
+ },
-function deleteFavourite(index) {
- getFavourites().then(function(favourites) {
- if (favourites && favourites.tracks && index < favourites.tracks.length) {
- var name = favourites.tracks[index].name;
- if (confirm("Are you sure you want to remove '" + name + "'?")) {
- favourites.tracks.splice(index, 1);
- mopidy.playlists.save({'playlist': favourites}).then(function(s) {
- showFavourites();
- });
+ getCurrentlyPlaying: function () {
+ $('#streamuriinput').val(songdata.track.uri)
+ var name = songdata.track.name
+ if (songdata.track.artists) {
+ var artistStr = artistsToString(songdata.track.artists)
+ if (artistStr) {
+ name = artistStr + ' - ' + name
+ }
}
- }
- });
-}
+ $('#streamnameinput').val(name)
+ return true
+ },
-function showFavourites() {
- $('#streamuristable').empty();
- getFavourites().then(function(favourites) {
- if (!favourites) {
- return;
- }
- var tmp = '';
-
- $.cookie.json = true;
- if ($.cookie('streamUris')) {
- tmp = '';
- }
- if (favourites.tracks) {
- var child = '';
- for (var i = 0; i < favourites.tracks.length; i++) {
- child = '-
--- ---
-
-
- - Play All - -
- - Play - -
- - Play Track Next - -
- - Add Track to Bottom of Queue - -
- - Add All to Bottom of Queue - -
++ ---
-
- - Play +
- + Play -
- - Play Track Next +
- + Play All -
- - Add Track to Bottom of Queue +
- + Play Track Next -
- - Add all to Bottom of - Queue +
- + Add Track to Bottom of Queue -
- +
- + Add All to Bottom of Queue + +
- Show Album -
- +
- Show Artist @@ -182,19 +145,19 @@
+@@ -403,14 +374,10 @@--
-
- - Play +
- + Play -
- - Remove from Queue +
- + Remove from Queue -
- +
- Show Album -
- +
- Show Artist @@ -206,31 +169,29 @@
-@@ -385,7 +356,7 @@ - +@@ -454,18 +421,18 @@-
' + favourites.tracks[i].name + '
' + favourites.tracks[i].name + '
- ';
- var liId = '';
- var targetmin = target.substr(1);
- $(target).empty();
+function albumTracksToTable (pl, target, uri) {
+ var track, previousTrack, nextTrack
+ var html = ''
+ $(target).empty()
+ $(target).attr('data', uri)
for (var i = 0; i < pl.length; i++) {
- popupData[pl[i].uri] = pl[i];
- liID = targetmin + '-' + pl[i].uri;
- tmp += renderSongLi(pl[i], liID, uri);
+ previousTrack = track || undefined
+ nextTrack = i < pl.length - 1 ? pl[i + 1] : undefined
+ track = pl[i]
+ popupData[track.uri] = track
+ html += renderSongLi(previousTrack, track, nextTrack, uri, '', target, i, pl.length)
}
- tmp += '
' + track.name + ' [Stream]
' + track.name + '
' + + if (listLength === 1 || (!hasSameAlbum(previousTrack, track) && !hasSameAlbum(track, nextTrack))) { + html += renderSongLiAlbumInfo(track) + } + html += '' + track.album.name + '
' + + renderSongLiTrackArtists(track) + '
No tracks found...
Back
' + name + '
' + - '' + name + '
' + - '' + results[i].name + ' [Stream]
' + newalbum[0].name + "
"; - } else { - html += '
' + newalbum[0].name + "
"; - } - - if (newalbum[0].artists) { - for (j = 0; j < newalbum[0].artists.length; j++) { - html += newalbum[0].artists[j].name; - html += (j == newalbum[0].artists.length - 1) ? '' : ' / '; - //stop after 3 - if (j > 2) { - html += '...'; - break; - } - } - } - if (newalbum[0].album.name !== '') { - html += ' / '; - } - html += '' + newalbum[0].album.name + '
'; - html += '' + results[i].album.name + '
'; - } - if (results[i].album.artists) { - for (j = 0; j < results[i].album.artists.length; j++) { - html += results[i].album.artists[j].name; - html += (j == results[i].album.artists.length - 1) ? '' : ' / '; - //stop after 3 - if (j > 2) { - child += '...'; - break; - } - } - } - html += '
' + pl[i].name + "
"; - child += ''; - child += '' + timeFromSeconds(pl[i].length / 1000) + ''; + popupData[pl[i].uri] = pl[i] + child = '
' + pl[i].name + 'h1>' + child += '
' + child += '' + timeFromSeconds(pl[i].length / 1000) + '' for (var j = 0; j < pl[i].artists.length; j++) { if (pl[i].artists[j]) { - child += pl[i].artists[j].name; - child += (j == pl[i].artists.length - 1) ? '' : ' / '; - //stop after 3 + child += pl[i].artists[j].name + child += (j === pl[i].artists.length - 1) ? '' : ' / ' + // stop after 3 if (j > 2) { - child += '...'; - break; + child += '...' + break } } } - child += ' / ' + pl[i].album.name + '
'; - child += 'Old Browser
Sorry. Your browser isn\'t modern enough for this webapp. Modern versions of Chrome, Firefox, Safari all will do. Maybe Opera and Internet Explorer 10 also work, but it\'s not tested.
'); - exit; + switchContent('playlists') + $('#playlistspane').html('Old Browser
Sorry. Your browser isn\'t modern enough for this webapp. Modern versions of Chrome, Firefox, Safari all will do. Maybe Opera and Internet Explorer 10 also work, but it\'s not tested.
') + exit } - //workaround for a bug in jQuery Mobile, without that the panel doesn't close on mobile devices... - $('.ui-panel-dismiss').on( "tap", function() { $("#panel").panel("close"); } ); - //end of workaround + // workaround for a bug in jQuery Mobile, without that the panel doesn't close on mobile devices... + $('.ui-panel-dismiss').on('tap', function () { $('#panel').panel('close') }) + // end of workaround - $(window).hashchange(); + $(window).hashchange() // Connect to server + var websocketUrl = $(document.body).data('websocket-url') if (websocketUrl) { try { mopidy = new Mopidy({ webSocketUrl: websocketUrl, callingConvention: 'by-position-or-by-name' - }); + }) } catch (e) { - showOffline(true); + showOffline(true) } } else { try { - mopidy = new Mopidy({callingConvention: 'by-position-or-by-name'}); - } catch (e) { - showOffline(true); + mopidy = new Mopidy({callingConvention: 'by-position-or-by-name'}) + } catch (e) { + showOffline(true) } } - //initialize events - initSocketevents(); + // initialize events + initSocketevents() - progressTimer = new ProgressTimer({ - callback: timerCallback, - //updateRate: 2000, - }); + syncedProgressTimer = new SyncedProgressTimer(8, mopidy) - resetSong(); + resetSong() if (location.hash.length < 2) { - switchContent("home"); + switchContent('home') } - initgui = false; - window.onhashchange = locationHashChanged; + initgui = false + window.onhashchange = locationHashChanged - //only show backbutton if in UIWebview + // only show backbutton if in UIWebview if (window.navigator.standalone) { - $("#btback").show(); + $('#btback').show() } else { - $("#btback").hide(); + $('#btback').hide() } - $(window).resize(function() { - resizeMb(); - }); + $(window).resize(function () { + resizeMb() + }) - //navigation temporary, rewrite this! - $('#songinfo').click(function() { - return switchContent('nowPlaying'); - }); - $('#controlspopupimage').click(function() { - return switchContent('current'); - }); - $('#navToggleFullscreen').click(function() { - toggleFullscreen(); - }); + // navigation temporary, rewrite this! + $('#songinfo').click(function () { + return switchContent('nowPlaying') + }) + $('#albumCoverImg').click(function () { + return switchContent('current') + }) + $('#navToggleFullscreen').click(function () { + toggleFullscreen() + }) // event handlers for full screen mode - $(document).on('webkitfullscreenchange mozfullscreenchange fullscreenchange, MSFullscreenChange', function(e) { + $(document).on('webkitfullscreenchange mozfullscreenchange fullscreenchange, MSFullscreenChange', function (e) { if (isFullscreen()) { - document.getElementById("toggletxt").innerHTML = "Exit Fullscreen"; + document.getElementById('toggletxt').innerHTML = 'Exit Fullscreen' } else { - document.getElementById("toggletxt").innerHTML = "Fullscreen"; + document.getElementById('toggletxt').innerHTML = 'Fullscreen' } - }); + }) - // remove buttons only for MusicBox - if (!isMusicBox) { - $('#navSettings').hide(); - $('#navshutdown').hide(); - $('#homesettings').hide(); - $('#homeshutdown').hide(); + // Remove MusicBox only content (e.g. settings, system pages) + if (!$(document.body).data('is-musicbox')) { + $('#navSettings').hide() + $('#navshutdown').hide() + $('#homesettings').hide() + $('#homeshutdown').hide() } - // remove Alarm Clock if it is not present - if (!hasAlarmClock) { - $('#navAlarmClock').hide(); - $('#homeAlarmClock').hide(); - $('#homeAlarmClock').nextAll().find('.ui-block-a, .ui-block-b').toggleClass('ui-block-a').toggleClass('ui-block-b'); + // Remove Alarm Clock icons if it is not present + if (!$(document.body).data('has-alarmclock')) { + $('#navAlarmClock').hide() + $('#homeAlarmClock').hide() + $('#homeAlarmClock').nextAll().find('.ui-block-a, .ui-block-b').toggleClass('ui-block-a').toggleClass('ui-block-b') } - //navigation stuff + // navigation stuff - $(document).keypress( function (event) { - //console.log('kp: '+event); - if (event.target.tagName != 'INPUT') { - var unicode=event.keyCode? event.keyCode : event.charCode; - var actualkey=String.fromCharCode(unicode); - switch(actualkey) { - case ' ': - doPlay(); - event.preventDefault(); - break; - case '>': - doNext(); - event.preventDefault(); - break; - case '<': - doPrevious(); - event.preventDefault(); - break; - } - return true; - } - }); - + $(document).keypress(function (event) { + // console.log('kp: '+event); + if (event.target.tagName !== 'INPUT') { + var unicode = event.keyCode ? event.keyCode : event.charCode + var actualkey = String.fromCharCode(unicode) + switch (actualkey) { + case ' ': + controls.doPlay() + event.preventDefault() + break + case '>': + controls.doNext() + event.preventDefault() + break + case '<': + controls.doPrevious() + event.preventDefault() + break + } + return true + } + }) if ($(window).width() < 980) { - $("#panel").panel("close"); - }else{ - $("#panel").panel("open"); + $('#panel').panel('close') + } else { + $('#panel').panel('open') } - $.event.special.swipe.horizontalDistanceThreshold = 125; // (default: 30px) Swipe horizontal displacement must be more than this. - $.event.special.swipe.verticalDistanceThreshold = 50; // (default: 75px) Swipe vertical displacement must be less than this. - $.event.special.swipe.durationThreshold = 500; + $.event.special.swipe.horizontalDistanceThreshold = 125 // (default: 30px) Swipe horizontal displacement must be more than this. + $.event.special.swipe.verticalDistanceThreshold = 50 // (default: 75px) Swipe vertical displacement must be less than this. + $.event.special.swipe.durationThreshold = 500 // swipe songinfo and panel - $( "#normalFooter, #nowPlayingFooter" ).on( "swiperight", doPrevious ); - $( "#normalFooter, #nowPlayingFooter" ).on( "swipeleft", doNext ); - $( "#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() { - if(!$(event.target).is("#normalFooter") && !$(event.target).is("#nowPlayingFooter")) { - $("#panel").panel("close"); - event.stopImmediatePropagation(); } - } ); - - $( "#trackslider" ).on( "slidestart", function() { - progressTimer.stop(); - $( "#trackslider" ).on( "change", function() { updatePosition( $(this).val() ); } ); - } ); - - $( "#trackslider" ).on( "slidestop", function() { - $( "#trackslider" ).off( "change"); - doSeekPos( $(this).val() ); - } ); - - $( "#volumeslider" ).on( "slidestart", function() { volumeSliding = true; } ); - $( "#volumeslider" ).on( "slidestop", function() { volumeSliding = false; } ); - $( "#volumeslider" ).on( "change", function() { doVolume( $(this).val() ); } ); -}); - -function updatePlayIcons (uri, tlid) { - //update styles of listviews - $('#currenttable li').each(function() { - var eachTlid = $(this).attr('tlid'); - if (typeof eachTlid != 'undefined') { - eachTlid = parseInt(eachTlid); + $('#normalFooter, #nowPlayingFooter').on('swiperight', controls.doPrevious) + $('#normalFooter, #nowPlayingFooter').on('swipeleft', controls.doNext) + $('#nowPlayingpane, .ui-body-c, #header, #panel, .pane').on('swiperight', function (event) { + if (!$(event.target).is('#normalFooter') && !$(event.target).is('#nowPlayingFooter')) { + $('#panel').panel('open') + event.stopImmediatePropagation() } - if (this.id == 'currenttable-' + uri && eachTlid == tlid) { - $(this).addClass('currenttrack'); - } else { - $(this).removeClass("currenttrack"); - } - }); + }) + $('#nowPlayingpane, .ui-body-c, #header, #panel, .pane').on('swipeleft', function (event) { + if (!$(event.target).is('#normalFooter') && !$(event.target).is('#nowPlayingFooter')) { + $('#panel').panel('close') + event.stopImmediatePropagation() + } + }) - $('#playlisttracks li').each(function() { - if (this.id == 'playlisttracks-' + uri) { - $(this).addClass('currenttrack2'); - } else { - $(this).removeClass("currenttrack2"); - } - }); + $('#trackslider').on('slidestart', function () { + syncedProgressTimer.stop() + $('#trackslider').on('change', function () { syncedProgressTimer.updatePosition($(this).val()) }) + }) - $('#trackresulttable li').each(function() { - if (this.id == 'trackresulttable-' + uri) { - $(this).addClass('currenttrack2'); - } else { - $(this).removeClass("currenttrack2"); - } - }); + $('#trackslider').on('slidestop', function () { + $('#trackslider').off('change') + syncedProgressTimer.updatePosition($(this).val()) + controls.doSeekPos($(this).val()) + }) - $('#artiststable li').each(function() { - if (this.id == 'artiststable-' + uri) { - $(this).addClass('currenttrack2'); - } else { - $(this).removeClass("currenttrack2"); - } - }); + $('#volumeslider').on('slidestart', function () { volumeSliding = true }) + $('#volumeslider').on('slidestop', function () { volumeSliding = false }) + $('#volumeslider').on('change', function () { controls.doVolume($(this).val()) }) +}) - $('#albumstable li').each(function() { - if (this.id == 'albumstable-' + uri) { - $(this).addClass('currenttrack2'); - } else { - $(this).removeClass("currenttrack2"); - } - }); - $('#browselist li').each(function() { - if (this.id == 'browselisttracks-' + uri) { - $(this).addClass('currenttrack2'); - } else { - $(this).removeClass("currenttrack2"); - } - }); +function updatePlayIcons (uri, tlid, popupMenuIcon) { + // Update styles of listviews + if (arguments.length < 3) { + throw new Error('Missing parameters for "updatePlayIcons" function call.') + } + var listviews = [PLAYLIST_TABLE, SEARCH_TRACK_TABLE, ARTIST_TABLE, ALBUM_TABLE, BROWSE_TABLE] + var target = CURRENT_PLAYLIST_TABLE.substr(1) + if (uri && typeof tlid === 'number' && tlid >= 0) { + $(CURRENT_PLAYLIST_TABLE).children('li.song.albumli').each(function () { + var eachTlid = $(this).attr('tlid') + if (typeof eachTlid !== 'undefined') { + eachTlid = parseInt(eachTlid) + } + if (this.id === getjQueryID(target, uri) && eachTlid === tlid) { + if (!$(this).hasClass('currenttrack')) { + $(this).addClass('currenttrack') + } + } else if ($(this).hasClass('currenttrack')) { + $(this).removeClass('currenttrack') + } + }) + } + + var popupElement + + for (var i = 0; i < listviews.length; i++) { + target = listviews[i].substr(1) + $(listviews[i]).children('li.song.albumli').each(function () { + if (uri) { + if (this.id === getjQueryID(target, uri)) { + $(this).addClass('currenttrack2') + } else { + $(this).removeClass('currenttrack2') + } + } + if (popupMenuIcon) { + popupElement = $(this).children('a.moreBtn').children('i').first() + if (!popupElement.hasClass(popupMenuIcon)) { + popupElement.removeClass() + popupElement.addClass(popupMenuIcon) + } + } + }) + } } diff --git a/mopidy_musicbox_webclient/static/js/images.js b/mopidy_musicbox_webclient/static/js/images.js index 652fae3..19f0c28 100644 --- a/mopidy_musicbox_webclient/static/js/images.js +++ b/mopidy_musicbox_webclient/static/js/images.js @@ -1,92 +1,282 @@ -/** - * @author Wouter van Wijk - */ - -API_KEY = 'b6d34c3af91d62ab0ae00ab1b6fa8733'; -API_SECRET = '2c631802c2285d5d5d1502462fe42a2b'; - -var fmcache; -var lastfm; - -$(window).load(function () { - // create a Cache object - fmcache = new LastFMCache(); - // create a LastFM object - lastfm = new LastFM({ - apiKey : API_KEY, - apiSecret : API_SECRET, - cache : fmcache - }); -}); - -function getCover(uri, images, size) { - var defUrl = 'images/default_cover.png'; - $(images).attr('src', defUrl); - if (!uri) { - return; +(function (root, factory) { + if (typeof define === 'function' && define.amd) { + define([], factory) + } else if (typeof module === 'object' && module.exports) { + module.exports = factory() + } else { + root.images = factory() } +}(this, function () { + 'use strict' - mopidy.library.getImages({'uris': [uri]}).then(function(imageResults) { - var uri = Object.keys(imageResults)[0]; - if (imageResults[uri].length > 0) { - $(images).attr('src', imageResults[uri][0].uri); - } else { - // Also check deprecated 'album.images' in case backend does not - // implement mopidy.library.getImages yet... - getCoverFromAlbum(uri, images, size); - } - }); -} + var API_KEY = 'b6d34c3af91d62ab0ae00ab1b6fa8733' + var API_SECRET = '2c631802c2285d5d5d1502462fe42a2b' -// Note that this approach has been deprecated in Mopidy -// TODO: Remove when Mopidy no longer supports getting images -// with 'album.images'. -function getCoverFromAlbum(uri, images, size) { - mopidy.library.lookup({'uris': [uri]}).then(function(resultDict) { - var uri = Object.keys(resultDict)[0]; - var track = resultDict[uri][0]; - if (track.album && track.album.images && (track.album.images.length > 0) ) { - $(images).attr('src', track.album.images[0]); - } else { - // Fallback to last.fm - getCoverFromLastFm(track, images, size); - } - }); -} + var images = { -function getCoverFromLastFm(track, images, size) { - var defUrl = 'images/default_cover.png'; - if (!(track.album || track.artist)) { - return; - } - var albumname = track.album.name || ''; - var artistname = ''; - if ( track.album.artists && (track.album.artists.length > 0) ) { - // First look for the artist in the album - artistname = track.album.artists[0].name; - } else if (track.artists && (track.artists.length > 0) ) { - // Fallback to using artists for specific track - artistname = track.artists[0].name; - } + DEFAULT_ALBUM_URL: 'images/default_cover.png', + DEFAULT_ARTIST_URL: 'images/user_24x32.png', - lastfm.album.getInfo( {artist: artistname, album: albumname}, - { success: function(data) { - for (var i = 0; i < data.album.image.length; i++) { - if ( data.album.image[i].size == size) { - $(images).attr('src', data.album.image[i]['#text'] || defUrl); + lastFM: new LastFM({ + apiKey: API_KEY, + apiSecret: API_SECRET, + cache: new LastFMCache() + }), + + /* Extract artist information from Mopidy track. */ + _getArtistInfo: function (track) { + var artistName = '' + var musicBrainzID = '' + + if (track && track.artists && (track.artists.length > 0)) { + // First look for the artist info in the track + artistName = track.artists[0].name + musicBrainzID = track.artists[0].musicbrainz_id + } + + if ((!artistName || !musicBrainzID) && (track && track.album && track.album.artists && track.album.artists.length > 0)) { + // Fallback to using artist info contained in the track's album + artistName = artistName || track.album.artists[0].name + musicBrainzID = musicBrainzID || track.album.artists[0].musicbrainz_id + } + + return {mbid: musicBrainzID, name: artistName} + }, + + /* Utility function for retrieving artist informaton for the given track from last.fm */ + _getLastFmArtistInfo: function (track) { + var artist = images._getArtistInfo(track) + var artistPromise = $.Deferred() + + if (!(track && (track.musicbrainz_id || (track.name && artist && artist.name)))) { + // Avoid expensive last.fm call if tag information is missing. + return artistPromise.reject('none', 'Not enough tag information available for track to make last.fm call.') + } + + var params = {} + // Only add arguments to parameter object if values are available for them. + if (track.musicbrainz_id) { + params.mbid = track.musicbrainz_id + } + if (track.name && artist.name) { + params.track = track.name + params.artist = artist.name + } + + images.lastFM.track.getInfo(params, {success: function (data) { + artistPromise.resolve(data.track.artist) + }, error: function (code, message) { + artistPromise.reject(code, message) + }}) + + return artistPromise + }, + + /* Utility function for retrieving information for the given track from last.fm. */ + _getLastFmAlbumInfo: function (track) { + var artist = images._getArtistInfo(track) + var albumPromise = $.Deferred() + + if (!(track && track.album && (track.album.musicbrainz_id || (track.album.name && artist && artist.name)))) { + // Avoid expensive last.fm call if tag information is missing. + return albumPromise.reject('none', 'Not enough tag information available for album to make last.fm call.') + } + + var musicBrainzID = track.album.musicbrainz_id + var albumName = track.album.name + var artistName = images._getArtistInfo(track).name + + var params = {} + // Only add arguments to parameter object if values are available for them. + if (musicBrainzID) { + params.mbid = musicBrainzID + } + if (artistName && albumName) { + params.artist = artistName + params.album = albumName + } + + images.lastFM.album.getInfo(params, {success: function (data) { + albumPromise.resolve(data) + }, error: function (code, message) { + albumPromise.reject(code, message) + }}) + + return albumPromise + }, + + /** + * Sets an HTML image element to contain the album cover art of the relevant Mopidy track. + * + * Potential sources for the album image will be interrogated in the following order until + * a suitable image URI is found: + * 1.) mopidy.library.getImages + * 2.) mopidy.models.Track.album.images (DEPRECATED) + * 3.) last.fm using the album MusicBrainz ID + * 4.) last.fm using the album name and track artist name + * 5.) last.fm using the album name and album artist name + * 6.) a default image + * + * @param {string} uri - The URI of the Mopidy track to retrieve the album cover image for. + * @param {string} img_element - The identifier of the HTML image element that will be used + * to render the image. + * @param {object} mopidy - The Mopidy.js object that should be used to communicate with the + * Mopidy server. + * @param {string} size - (Optional) The preferred size of the image. This parameter is only + * used in the last.fm lookups if Mopidy does not provide the image + * directly. Can be one of 'small', 'medium', 'large', + * 'extralarge' (default), or 'mega'. + */ + setAlbumImage: function (uri, img_element, mopidy, size) { + // Set default immediately while we're busy retrieving actual image. + $(img_element).attr('src', images.DEFAULT_ALBUM_URL) + if (!uri) { + return + } + size = size || 'extralarge' + + mopidy.library.getImages({'uris': [uri]}).then(function (imageResults) { + var uri = Object.keys(imageResults)[0] + if (imageResults[uri].length > 0) { + $(img_element).attr('src', imageResults[uri][0].uri) + } else { + // Also check deprecated 'album.images' in case backend does not + // implement mopidy.library.getImages yet... + images._setDeprecatedAlbumImage(uri, img_element, mopidy, size) } - } - } - }); -} + }) + }, -function getArtistImage(nwartist, image, size) { - var defUrl = 'images/user_24x32.png'; - lastfm.artist.getInfo({artist: nwartist}, {success: function(data){ - for (var i = 0; i < data.artist.image.length; i++) { - if ( data.artist.image[i].size == size) { - $(image).attr('src', data.artist.image[i]['#text'] || defUrl); + // Note that this approach has been deprecated in Mopidy + // TODO: Remove when Mopidy no longer supports retrieving images + // from 'album.images'. + /* Set album image using mopidy.album.images. */ + _setDeprecatedAlbumImage: function (uri, img_element, mopidy, size) { + if (!uri) { + $(img_element).attr('src', images.DEFAULT_ALBUM_URL) + return } + size = size || 'extralarge' + + mopidy.library.lookup({'uris': [uri]}).then(function (resultDict) { + var uri = Object.keys(resultDict)[0] + var track = resultDict[uri][0] + if (track && track.album && track.album.images && track.album.images.length > 0) { + $(img_element).attr('src', track.album.images[0]) + } else { + // Fallback to last.fm + images._setLastFmAlbumImage(track, img_element, size) + } + }) + }, + + /* Lookup album image on last.fm using the provided Mopidy track. */ + _setLastFmAlbumImage: function (track, img_element, size) { + if (!track || !(track.album || track.artists)) { + $(img_element).attr('src', images.DEFAULT_ALBUM_URL) + return + } + size = size || 'extralarge' + + images._getLastFmAlbumInfo(track).then(function (data) { + for (var i = 0; i < data.album.image.length; i++) { + if (data.album.image[i].size === size) { + $(img_element).attr('src', data.album.image[i]['#text'] || images.DEFAULT_ALBUM_URL) + break + } + } + }, function (code, message) { + $(img_element).attr('src', images.DEFAULT_ALBUM_URL) + console.error('Error getting album info from last.fm (%s: %s)', code, message) + }) + }, + + /** + * Sets an HTML image element to contain the artist image of the relevant Mopidy track. + * + * Potential sources of the artist image will be interrogated in the following order until + * a suitable image URI is found: + * 1.) mopidy.library.getImages + * 2.) last.fm using the artist MusicBrainz ID. If no artist ID is provided, it will be + * looked up on last.fm first using the track and album details. + * 3.) a default image + * + * @param {string} artist_uri - The URI of the Mopidy artist to retrieve the image for. + * @param {string} track_uri - The URI of the Mopidy track that will be used as a fallback + * if the artist URI does not provide any image results. + * @param {string} img_element - The identifier of the HTML image element that will be used + * to render the image. + * @param {object} mopidy - The Mopidy.js object that should be used to communicate with the + * Mopidy server. + * @param {string} size - (Optional) The preferred size of the image. This parameter is only + * used in the last.fm lookups if Mopidy does not provide the image + * directly. Can be one of 'small', 'medium', 'large', + * 'extralarge' (default), or 'mega'. + */ + setArtistImage: function (artist_uri, track_uri, img_element, mopidy, size) { + // Set default immediately while we're busy retrieving actual image. + $(img_element).attr('src', images.DEFAULT_ARTIST_URL) + if (!artist_uri && !track_uri) { + return + } + size = size || 'extralarge' + + if (artist_uri) { + // Use artist as starting point for retrieving image. + mopidy.library.getImages({'uris': [artist_uri]}).then(function (imageResults) { + var uri = Object.keys(imageResults)[0] + if (imageResults[uri].length > 0) { + $(img_element).attr('src', imageResults[uri][0].uri) + } else { + // Fall back to using track as starting point for retrieving image. + images._setArtistImageFromTrack(track_uri, img_element, mopidy, size) + } + }) + } + }, + + /* Set artist image using the supplied Mopidy track URI. */ + _setArtistImageFromTrack: function (uri, img_element, mopidy, size) { + mopidy.library.lookup({'uris': [uri]}).then(function (resultDict) { + var uri = Object.keys(resultDict)[0] + var track = resultDict[uri][0] + var artist = images._getArtistInfo(track) + + if (artist.mbid) { + images._setLastFmArtistImage(artist.mbid, img_element, size) + } else { + // Look up unique MusicBrainz ID for artist first using the available track information + images._getLastFmArtistInfo(track).then(function (artist) { + images._setLastFmArtistImage(artist.mbid, img_element, size) + }, function (code, message) { + $(img_element).attr('src', images.DEFAULT_ARTIST_URL) + console.error('Error retrieving artist info from last.fm. (%s: %s)', code, message) + }) + } + }) + }, + + /* Set artist image using the supplied artist MusicBrainz ID. */ + _setLastFmArtistImage: function (mbid, img_element, size) { + if (!mbid) { + // Avoid expensive last.fm call if tag information is missing. + $(img_element).attr('src', images.DEFAULT_ARTIST_URL) + return + } + size = size || 'extralarge' + + images.lastFM.artist.getInfo({mbid: mbid}, {success: function (data) { + for (var i = 0; i < data.artist.image.length; i++) { + if (data.artist.image[i].size === size) { + $(img_element).attr('src', data.artist.image[i]['#text'] || images.DEFAULT_ARTIST_URL) + break + } + } + }, error: function (code, message) { + $(img_element).attr('src', images.DEFAULT_ARTIST_URL) + console.error('Error retrieving artist info from last.fm. (%s: %s)', code, message) + }}) } - }}); -} \ No newline at end of file + } + return images +})) diff --git a/mopidy_musicbox_webclient/static/js/library.js b/mopidy_musicbox_webclient/static/js/library.js index 3a62e05..13e63e8 100644 --- a/mopidy_musicbox_webclient/static/js/library.js +++ b/mopidy_musicbox_webclient/static/js/library.js @@ -1,344 +1,349 @@ -/********************************* - * Search - *********************************/ -function searchPressed(key) { - var value = $('#searchinput').val(); - switchContent('search'); - - if (key == 13) { - initSearch(); - return false; +(function (root, factory) { + if (typeof define === 'function' && define.amd) { + define([], factory) + } else if (typeof module === 'object' && module.exports) { + module.exports = factory() + } else { + root.library = factory() } - return true; -} +}(this, function () { + 'use strict' -//init search -function initSearch() { - var value = $('#searchinput').val(); - var searchService = $('#selectSearchService').val(); + var library = { - if ((value.length < 100) && (value.length > 0)) { - showLoading(true); - //hide ios/android keyboard - document.activeElement.blur(); - $("input").blur(); + /** ******************************* + * Search + *********************************/ + searchPressed: function (key) { + var value = $('#searchinput').val() + switchContent('search') - delete customTracklists[URI_SCHEME+':allresultscache']; - delete customTracklists[URI_SCHEME+':artistresultscache']; - delete customTracklists[URI_SCHEME+':albumresultscache']; - delete customTracklists[URI_SCHEME+':trackresultscache']; - $("#searchartists").hide(); - $("#searchalbums").hide(); - $("#searchtracks").hide(); + if (key === 13) { + library.initSearch() + return false + } + return true + }, - if (searchService != 'all') { - mopidy.library.search({'query': {any:[value]}, 'uris': [searchService + ':']}).then(processSearchResults, console.error); - } else { - mopidy.getUriSchemes().then(function (schemes) { - var query = {}, - uris = []; + // init search + initSearch: function () { + var value = $('#searchinput').val() + var searchService = $('#selectSearchService').val() + $.cookie('searchScheme', searchService, { expires: 365 }) - var regexp = $.map(schemes, function (scheme) { - return '^' + scheme + ':'; - }).join('|'); + if ((value.length < 100) && (value.length > 0)) { + showLoading(true) + // hide ios/android keyboard + document.activeElement.blur() + $('input').blur() - var match = value.match(regexp); - if (match) { - var scheme = match[0]; - query = {uri: [value]}; - uris = [scheme]; + delete customTracklists[URI_SCHEME + ':trackresultscache'] + $('#searchartists').hide() + $('#searchalbums').hide() + $('#searchtracks').hide() + + if (searchService !== 'all') { + mopidy.library.search({'query': {any: [value]}, 'uris': [searchService + ':']}).then(library.processSearchResults, console.error) } else { - query = {any: [value]}; - } - mopidy.library.search({'query': query, 'uris': uris}).then(processSearchResults, console.error); - }); - } - } -} + mopidy.getUriSchemes().then(function (schemes) { + var query = {} + var uris = [] -/******************************************************** - * process results of a search - *********************************************************/ + var regexp = $.map(schemes, function (scheme) { + return '^' + scheme + ':' + }).join('|') -//# speed clone http://jsperf.com/cloning-an-object/2 -function clone(obj) { - var target = {}; - for (var i in obj) { - if (obj.hasOwnProperty(i)) { - target[i] = obj[i]; - } - } - return target; -} - -function processSearchResults(resultArr) { - $(SEARCH_TRACK_TABLE).empty(); - $(SEARCH_ARTIST_TABLE).empty(); - $(SEARCH_ALBUM_TABLE).empty(); - - // Merge results from different backends. - // TODO should of coures have multiple tables - var results = {'tracks': [], 'artists': [], 'albums': []}; - var j, emptyResult = true; - - for (var i = 0; i < resultArr.length; i++) { - if (resultArr[i].tracks) { - for (j = 0; j < resultArr[i].tracks.length; j++) { - results.tracks.push(resultArr[i].tracks[j]); - emptyResult = false; - } - } - if (resultArr[i].artists) { - for (j = 0; j < resultArr[i].artists.length; j++) { - results.artists.push(resultArr[i].artists[j]); - emptyResult = false; - } - } - if (resultArr[i].albums) { - for (j = 0; j < resultArr[i].albums.length; j++) { - results.albums.push(resultArr[i].albums[j]); - emptyResult = false; - } - } - } - - customTracklists[URI_SCHEME+':trackresultscache'] = results.tracks; - - if (emptyResult) { - toast('No results'); - showLoading(false); - return false; - } - - if (results.artists.length > 0) { - $("#searchartists").show(); - } - - if (results.albums.length > 0) { - $("#searchalbums").show(); - } - - if (results.tracks.length > 0) { - $("#searchtracks").show(); - } - - // Returns a string where {x} in template is replaced by tokens[x]. - function theme(template, tokens) { - return template.replace(/{[^}]+}/g, function(match) { - return tokens[match.slice(1,-1)]; - }); - } - - // 'Show more' pattern - var showMorePattern = '{albumName}
'; - pattern += '{artistName}
'; - pattern += 'No tracks found...
{albumName}
' + pattern += '{artistName}
' + pattern += 'Back
' + resultArr[i].name + '
' + resultArr[i].name + '
' + resultArr[i].name + '
' +
+ '' +
+ '' +
+ '' +
+ '' +
+ '
'
+ )
+ $('#trackslider').slider() // Initialize slider
+ $('#trackslider').on('slidestart', function () {
+ syncedProgressTimer.stop()
+ $('#trackslider').on('change', function () { syncedProgressTimer.updatePosition($(this).val()) })
+ })
+
+ $('#trackslider').on('slidestop', function () {
+ $('#trackslider').off('change')
+ syncedProgressTimer.updatePosition($(this).val())
+ // Simulate doSeekPos($(this).val())
+ syncedProgressTimer.set($(this).val())
+ })
+
+ playback = {
+ getTimePosition: function () { return $.when(1000) },
+ getState: function () { return $.when('stopped') }
+ }
+ getTimePositionStub = sinon.stub(playback, 'getTimePosition')
+ // Simulate Mopidy's track position advancing 250ms between each call for 0:01 to 0:10
+ for (var i = 0; i < 10000 / 250; i++) {
+ getTimePositionStub.onCall(i).returns($.when((i + 1) * 250))
+ }
+ mopidy = sinon.stub(new Mopidy({callingConvention: 'by-position-or-by-name'}))
+ mopidy.playback = playback
+ })
+
+ beforeEach(function () {
+ syncedProgressTimer = new SyncedProgressTimer(MAX_ATTEMPTS, mopidy)
+ syncedProgressTimer._isConnected = true
+ })
+
+ afterEach(function () {
+ getTimePositionStub.reset()
+ })
+
+ describe('#SyncedTimer()', function () {
+ it('should add text nodes to DOM for position and duration indicators', function () {
+ expect($('#songelapsed')).to.have.text('')
+ expect($('#songlength')).to.have.text('')
+ })
+
+ it('should start out in unsynced state', function () {
+ assert.equal(syncedProgressTimer.syncState, SyncedProgressTimer.SYNC_STATE.NOT_SYNCED)
+ })
+ })
+
+ describe('#format()', function () {
+ it('should set value of text node', function () {
+ assert.equal(SyncedProgressTimer.format(1000), '0:01')
+ })
+
+ it('should handle Infinity', function () {
+ assert.equal(SyncedProgressTimer.format(Infinity), '')
+ })
+
+ it('should handle zero', function () {
+ assert.equal(SyncedProgressTimer.format(0), '0:00')
+ })
+ })
+
+ describe('#timerCallback()', function () {
+ beforeEach(function () {
+ setFakeTimers()
+ })
+ afterEach(function () {
+ restoreFakeTimers()
+ })
+
+ it('should not try to sync unless connected to mopidy', function () {
+ var _doSyncStub = sinon.stub(syncedProgressTimer, '_doSync')
+
+ syncedProgressTimer._isConnected = false
+ syncedProgressTimer.set(0, 1000).start()
+ clock.tick(1000)
+
+ assert.isFalse(_doSyncStub.called, '_doSync called')
+ syncedProgressTimer.stop()
+ _doSyncStub.restore()
+ })
+
+ it('should update text nodes', function () {
+ var updateStub = sinon.stub(syncedProgressTimer, '_update')
+
+ syncedProgressTimer.set(0, 1000).start()
+ assert.isTrue(updateStub.called, '_update not called')
+ syncedProgressTimer.stop()
+ updateStub.restore()
+ })
+
+ it('should attempt to perform a sync as soon as timer is started', function () {
+ var syncStub = sinon.stub(syncedProgressTimer, '_doSync')
+
+ syncedProgressTimer.set(0, 1000).start() // 'start' will immediately schedule a sync.
+ clock.tick(250)
+
+ assert.isTrue(syncStub.called, '_doSync not called')
+ syncedProgressTimer.stop()
+ syncStub.restore()
+ })
+
+ it('should not attempt to perform a sync untill scheduled', function () {
+ var syncStub = sinon.stub(syncedProgressTimer, '_doSync')
+
+ syncedProgressTimer.set(0, 5000).start()
+ syncedProgressTimer._scheduleSync(500)
+ clock.tick(250)
+ assert.isFalse(syncStub.called, 'next _doSync should only have been called after 500ms')
+
+ syncStub.reset()
+ clock.tick(500)
+ assert.isTrue(syncStub.called, 'next _doSync not called after 500ms')
+ syncedProgressTimer.stop()
+ syncStub.restore()
+ })
+
+ it('should perform sync', function () {
+ // Simulate runtime on a 5-second track
+ assert.equal(syncedProgressTimer.syncState, SyncedProgressTimer.SYNC_STATE.NOT_SYNCED, 'Timer was initialized in incorrect state')
+ syncedProgressTimer.set(0, 5000).start()
+
+ var wasSyncing = false
+ for (var i = 0; i < 4; i++) {
+ clock.tick(250)
+ wasSyncing = wasSyncing || syncedProgressTimer.syncState === SyncedProgressTimer.SYNC_STATE.SYNCING
+ }
+ syncedProgressTimer.stop()
+ assert.isTrue(wasSyncing, 'Timer never entered the "syncing" state')
+ assert.equal(syncedProgressTimer.syncState, SyncedProgressTimer.SYNC_STATE.SYNCED, 'Timer failed to sync')
+ syncedProgressTimer.stop()
+ })
+ })
+
+ describe('#_update()', function () {
+ it('should set duration to "" for tracks with infinite duration (e.g. streams)', function () {
+ syncedProgressTimer._update(1000, Infinity)
+ assert.equal(syncedProgressTimer.durationNode.nodeValue, '')
+ })
+
+ it('should show "(wait)" while untill syncing starts', function () {
+ syncedProgressTimer.syncState = SyncedProgressTimer.SYNC_STATE.NOT_SYNCED
+ syncedProgressTimer._update(1000, 2000)
+ assert.equal(syncedProgressTimer.positionNode.nodeValue, '(wait)')
+ })
+
+ it('should show "(sync)" while trying to sync up with Mopidy', function () {
+ syncedProgressTimer.syncState = SyncedProgressTimer.SYNC_STATE.SYNCING
+ syncedProgressTimer._update(1000, 2000)
+ assert.equal(syncedProgressTimer.positionNode.nodeValue, '(sync)')
+ })
+
+ it('should update position text and position track slider when synced', function () {
+ syncedProgressTimer.syncState = SyncedProgressTimer.SYNC_STATE.SYNCED
+ syncedProgressTimer._update(1000, 2000)
+ assert.equal(syncedProgressTimer.positionNode.nodeValue, '0:01')
+ assert.equal($('#trackslider').val(), 1000)
+ })
+ })
+
+ describe('#scheduleSync', function () {
+ beforeEach(function () {
+ setFakeTimers()
+ })
+ afterEach(function () {
+ restoreFakeTimers()
+ })
+
+ it('should schedule sync when scheduled time arrives', function () {
+ clock.tick(0)
+ syncedProgressTimer._scheduleSync(1000)
+ assert.isFalse(syncedProgressTimer._isSyncScheduled)
+ clock.tick(1001)
+ assert.isTrue(syncedProgressTimer._isSyncScheduled)
+ })
+
+ it('should clear schedule on each call', function () {
+ var clearSpy = sinon.spy(window, 'clearTimeout')
+
+ clock.tick(0)
+ syncedProgressTimer._isSyncScheduled = true
+ syncedProgressTimer._scheduleSync(1000)
+ assert.isFalse(syncedProgressTimer._isSyncScheduled)
+
+ var scheduleID = syncedProgressTimer._scheduleID
+ clock.tick(1001)
+ syncedProgressTimer._scheduleSync(1000)
+ assert(clearSpy.calledWith(scheduleID))
+ window.clearTimeout.restore()
+ })
+ })
+
+ describe('#_doSync', function () {
+ beforeEach(function () {
+ setFakeTimers()
+ })
+ afterEach(function () {
+ restoreFakeTimers()
+ })
+
+ it('should not try to sync until timer has been set', function () {
+ syncedProgressTimer._doSync(0, Infinity)
+ assert.isFalse(getTimePositionStub.called, 'tried to do sync even though the timer has not been set')
+ })
+
+ it('should request position from Mopidy', function () {
+ syncedProgressTimer._doSync(1000, 2000)
+ assert.isTrue(getTimePositionStub.called, 'getTimePosition not called')
+ })
+
+ it('should set state to "SYNCING" as soon as the first sync attempt is made', function () {
+ syncedProgressTimer.syncState = SyncedProgressTimer.SYNC_STATE.NOT_SYNCED
+ syncedProgressTimer._doSync(100, 2000)
+ assert.equal(syncedProgressTimer.syncState, SyncedProgressTimer.SYNC_STATE.SYNCING)
+ })
+
+ it('should set state to synced after two consecutive successful syncs (i.e. time drift < 500ms)', function () {
+ assert.equal(syncedProgressTimer.syncState, SyncedProgressTimer.SYNC_STATE.NOT_SYNCED)
+ clock.tick(250)
+ syncedProgressTimer._doSync(250, 2000)
+ assert.equal(syncedProgressTimer.syncState, SyncedProgressTimer.SYNC_STATE.SYNCING)
+ clock.tick(250)
+ syncedProgressTimer._doSync(500, 2000)
+ assert.equal(syncedProgressTimer.syncState, SyncedProgressTimer.SYNC_STATE.SYNCED)
+ })
+
+ it('should re-initialize and set state to syncing if time drift is more than 500ms', function () {
+ var scheduleStub = sinon.stub(syncedProgressTimer, '_scheduleSync')
+
+ syncedProgressTimer._doSync(1000, 2000)
+
+ assert.equal(syncedProgressTimer.syncState, SyncedProgressTimer.SYNC_STATE.SYNCING)
+ assert.equal(syncedProgressTimer._syncAttemptsRemaining, syncedProgressTimer._maxAttempts)
+ assert.isNull(syncedProgressTimer._previousSyncPosition)
+ assert(scheduleStub.calledWith(1000), 'Expected next sync to be scheduled 1s from now')
+ scheduleStub.restore()
+ })
+
+ it('should step back exponentially while syncing', function () {
+ var scheduleStub = sinon.stub(syncedProgressTimer, '_scheduleSync')
+
+ for (var i = 0; i < syncedProgressTimer._maxAttempts; i++) {
+ syncedProgressTimer._doSync(i * 250, 2000)
+ assert.equal(syncedProgressTimer._syncAttemptsRemaining, syncedProgressTimer._maxAttempts - i - 1, 'Incorrect number of sync attempts remaining')
+ assert(scheduleStub.calledWith(0.25 * (Math.pow(2, i)) * 1000), 'Incorrect sync time scheduled: ' + scheduleStub.getCall(i))
+ scheduleStub.reset()
+ }
+ scheduleStub.restore()
+ })
+
+ it('should check sync every 32s once synced', function () {
+ var scheduleStub = sinon.stub(syncedProgressTimer, '_scheduleSync')
+
+ syncedProgressTimer._syncAttemptsRemaining = 0
+ syncedProgressTimer._doSync(250, 2000)
+ assert(scheduleStub.calledWith(32000))
+ scheduleStub.restore()
+ })
+
+ it('should not sync unless track playback is progressing', function () {
+ getTimePositionStub.restore()
+
+ assert.equal(syncedProgressTimer.syncState, SyncedProgressTimer.SYNC_STATE.NOT_SYNCED)
+ clock.tick(250)
+ syncedProgressTimer._doSync(250, 2000)
+ assert.equal(syncedProgressTimer.syncState, SyncedProgressTimer.SYNC_STATE.SYNCING)
+ clock.tick(250)
+ syncedProgressTimer._doSync(250, 2000)
+ assert.equal(syncedProgressTimer.syncState, SyncedProgressTimer.SYNC_STATE.SYNCING)
+
+ // Restore getTimePositionStub to previous state
+ getTimePositionStub = sinon.stub(playback, 'getTimePosition')
+ // Simulate Mopidy's track position advancing 250ms between each call for 0:01 to 0:10
+ for (var i = 0; i < 10000 / 250; i++) {
+ getTimePositionStub.onCall(i).returns($.when((i + 1) * 250))
+ }
+ })
+ })
+
+ describe('#set()', function () {
+ it('should throw exception if no arguments are provided', function () {
+ assert.throw(function () { syncedProgressTimer.set() }, Error)
+ })
+
+ it('should set position if only one argument is provided', function () {
+ syncedProgressTimer.set(1000)
+ assert.equal(syncedProgressTimer._progressTimer._state.position, 1000)
+ })
+
+ it('should update position and track slider immediately', function () {
+ syncedProgressTimer.stop()
+ syncedProgressTimer.set(1000, 2000)
+
+ expect($('#songelapsed').text()).to.equal('0:01')
+ assert.equal($('#trackslider').val(), 1000)
+ })
+ })
+
+ describe('#start()', function () {
+ it('should start timer', function () {
+ var startStub = sinon.stub(syncedProgressTimer._progressTimer, 'start')
+ syncedProgressTimer.start()
+ assert(startStub.called)
+ syncedProgressTimer.stop()
+ startStub.restore()
+ })
+
+ it('should always start in unsynced state', function () {
+ syncedProgressTimer.syncState = SyncedProgressTimer.SYNC_STATE.SYNCED
+ syncedProgressTimer.start()
+ assert.equal(syncedProgressTimer.syncState, SyncedProgressTimer.SYNC_STATE.NOT_SYNCED)
+ syncedProgressTimer.stop()
+ })
+
+ it('should schedule a sync immediately', function () {
+ var scheduleSpy = sinon.spy(syncedProgressTimer, '_scheduleSync')
+
+ syncedProgressTimer.set(0, 1000)
+ syncedProgressTimer._isSyncScheduled = false
+ syncedProgressTimer.start()
+
+ assert(scheduleSpy.calledWith(0))
+ syncedProgressTimer.stop()
+ syncedProgressTimer._scheduleSync.restore()
+ })
+ })
+
+ describe('#stop()', function () {
+ it('should stop timer', function () {
+ var stopStub = sinon.stub(syncedProgressTimer._progressTimer, 'stop')
+ syncedProgressTimer.stop()
+
+ assert(stopStub.called)
+ syncedProgressTimer.stop()
+ stopStub.restore()
+ })
+
+ it('should show last synced position if stopped while busy syncing', function () {
+ syncedProgressTimer.set(1000, 5000)
+ syncedProgressTimer.syncState = SyncedProgressTimer.SYNC_STATE.SYNCED
+ syncedProgressTimer._previousSyncPosition = 1000
+ syncedProgressTimer.syncState = SyncedProgressTimer.SYNC_STATE.SYNCING
+ syncedProgressTimer._update(2000, 5000)
+ assert.equal(syncedProgressTimer.positionNode.nodeValue, '(sync)')
+ syncedProgressTimer.stop()
+ assert.equal(syncedProgressTimer.positionNode.nodeValue, '0:01')
+ expect($('#songelapsed').text()).to.equal('0:01')
+ })
+
+ it('should cancel any scheduled syncs', function () {
+ var cancelSpy = sinon.spy(window, 'clearTimeout')
+
+ syncedProgressTimer._isSyncScheduled = true
+ syncedProgressTimer.stop()
+
+ assert.isFalse(syncedProgressTimer._isSyncScheduled)
+ assert(cancelSpy.calledWith(syncedProgressTimer._scheduleID))
+ window.clearTimeout.restore()
+ })
+ })
+
+ describe('#reset()', function () {
+ it('should reset timer to "" - "" ', function () {
+ var stopStub = sinon.stub(syncedProgressTimer, 'stop')
+ var setStub = sinon.stub(syncedProgressTimer, 'set')
+
+ syncedProgressTimer.reset()
+
+ assert(stopStub.called)
+ assert(setStub.called)
+
+ assert.equal(syncedProgressTimer.positionNode.nodeValue, '', 'Position node was not reset')
+ assert.equal(syncedProgressTimer.durationNode.nodeValue, '', 'Duration node was not reset')
+
+ stopStub.restore()
+ setStub.restore()
+ })
+ })
+
+ describe('#updatePosition()', function () {
+ it('should format and set position node', function () {
+ var formatSpy = sinon.spy(SyncedProgressTimer, 'format')
+ assert.equal(syncedProgressTimer.positionNode.nodeValue, '')
+ syncedProgressTimer.updatePosition(1000)
+
+ assert.isTrue(formatSpy.called)
+ expect(syncedProgressTimer.positionNode.nodeValue).to.equal('0:01')
+ SyncedProgressTimer.format.restore()
+ })
+
+ it('should set position to "" if timer has not been initialized', function () {
+ syncedProgressTimer.set(1000, 2000)
+ expect(syncedProgressTimer.positionNode.nodeValue).to.equal('0:01')
+
+ syncedProgressTimer.updatePosition(0)
+ assert.equal(syncedProgressTimer.positionNode.nodeValue, '0:00', 'Position node was not reset')
+
+ syncedProgressTimer.reset()
+ syncedProgressTimer.updatePosition(0)
+ assert.equal(syncedProgressTimer.positionNode.nodeValue, '', 'Position node was not reset')
+ })
+ })
+
+ describe('integration tests', function () {
+ beforeEach(function () {
+ setFakeTimers()
+ })
+ afterEach(function () {
+ restoreFakeTimers()
+ })
+
+ it('simulate 30-second test run, ', function () {
+ // Initialize
+ syncedProgressTimer.reset()
+ expect($('#songelapsed').text()).to.equal('')
+ expect($('#songlength').text()).to.equal('')
+ assert.equal($('#trackslider').val(), 0)
+
+ // Set song info
+ syncedProgressTimer.set(0, 30000)
+ expect($('#songelapsed').text()).to.equal('0:00')
+ expect($('#songlength').text()).to.equal('0:30')
+ assert.equal($('#trackslider').val(), 0)
+
+ // Start
+ syncedProgressTimer.start()
+ clock.tick(40)
+ expect($('#songelapsed').text()).to.equal('(wait)')
+ expect($('#songlength').text()).to.equal('0:30')
+ assert.equal($('#trackslider').val(), 0)
+
+ // Syncing
+ clock.tick(250)
+ expect($('#songelapsed').text()).to.equal('(sync)')
+ expect($('#songlength').text()).to.equal('0:30')
+ assert.equal($('#trackslider').val(), 0)
+
+ // Synced
+ clock.tick(1000)
+ expect($('#songelapsed').text()).to.equal('0:01')
+ expect($('#songlength').text()).to.equal('0:30')
+ assert.isAtLeast($('#trackslider').val(), 1000)
+
+ // Move slider
+ $('#trackslider').trigger('slidestart')
+ clock.tick(250)
+ $('#trackslider').val(5000).slider('refresh')
+ $('#trackslider').trigger('change')
+ clock.tick(250)
+ $('#trackslider').trigger('slidestop')
+
+ clock.tick(1000) // Position should remain '0:05' as the timer should not be running after a slider change
+ expect($('#songelapsed').text()).to.equal('0:05')
+
+ // Start -> Sync -> Stop
+ syncedProgressTimer.start()
+ clock.tick(40)
+ expect($('#songelapsed').text()).to.equal('(sync)')
+ syncedProgressTimer._previousSyncPosition = 1000
+ syncedProgressTimer.stop()
+ expect($('#songelapsed').text()).to.equal('0:01')
+ expect($('#songlength').text()).to.equal('0:30')
+
+ syncedProgressTimer.stop()
+ })
+ })
+
+ describe('regression tests for https://github.com/adamcik/media-progress-timer/issues/3', function () {
+ it('should not be possible to set position > duration', function () {
+ syncedProgressTimer.set(1000, 2000).start()
+
+ assert.equal(syncedProgressTimer._duration, 2000)
+ syncedProgressTimer.set(3000)
+ assert.equal(syncedProgressTimer._progressTimer._state.position, 1999, 'Expected position to be less than duration')
+ syncedProgressTimer.stop()
+ })
+
+ it('should keep timer running even if an update would cause position > duration', function () {
+ setFakeTimers()
+
+ clock.tick(0)
+ clock.tick(1000)
+ syncedProgressTimer.set(0, 1000).start()
+ clock.tick(2000)
+
+ assert.isNotNull(syncedProgressTimer._progressTimer._updateId)
+ syncedProgressTimer.stop()
+
+ restoreFakeTimers()
+ })
+ })
+})
diff --git a/tests/test_extension.py b/tests/test_extension.py
index 31c685e..5ce0d43 100644
--- a/tests/test_extension.py
+++ b/tests/test_extension.py
@@ -1,22 +1,39 @@
-from __future__ import unicode_literals
+from __future__ import absolute_import, division, print_function, unicode_literals
-from mopidy_musicbox_webclient import MusicBoxExtension
+import unittest
+
+import mock
+
+from mopidy_musicbox_webclient import Extension
-def test_get_default_config():
- ext = MusicBoxExtension()
+class ExtensionTests(unittest.TestCase):
- config = ext.get_default_config()
+ def test_get_default_config(self):
+ ext = Extension()
- assert '[musicbox_webclient]' in config
- assert 'enabled = true' in config
+ config = ext.get_default_config()
+ assert '[musicbox_webclient]' in config
+ assert 'enabled = true' in config
+ assert 'websocket_host =' in config
+ assert 'websocket_port =' in config
+ assert 'on_track_click = PLAY_ALL' in config
-def test_get_config_schema():
- ext = MusicBoxExtension()
+ def test_get_config_schema(self):
+ ext = Extension()
- schema = ext.get_config_schema()
- assert 'musicbox' in schema
+ schema = ext.get_config_schema()
+ assert 'musicbox' in schema
+ assert 'websocket_host' in schema
+ assert 'websocket_port' in schema
+ assert 'on_track_click' in schema
-# TODO Write more tests
+ def test_setup(self):
+ registry = mock.Mock()
+
+ ext = Extension()
+ ext.setup(registry)
+ calls = [mock.call('http:app', {'name': ext.ext_name, 'factory': ext.factory})]
+ registry.add.assert_has_calls(calls, any_order=True)
diff --git a/tests/test_web.py b/tests/test_web.py
new file mode 100644
index 0000000..a77484c
--- /dev/null
+++ b/tests/test_web.py
@@ -0,0 +1,67 @@
+from __future__ import absolute_import, division, print_function, unicode_literals
+
+import mock
+
+import mopidy.config as config
+
+import tornado.testing
+import tornado.web
+import tornado.websocket
+
+from mopidy_musicbox_webclient import Extension
+from mopidy_musicbox_webclient.web import StaticHandler
+
+
+class BaseTest(tornado.testing.AsyncHTTPTestCase):
+
+ def get_app(self):
+ extension = Extension()
+ self.config = config.Proxy({'musicbox_webclient': {
+ 'enabled': True,
+ 'musicbox': True,
+ 'websocket_host': '',
+ 'websocket_port': '',
+ }
+ })
+ return tornado.web.Application(extension.factory(self.config, mock.Mock()))
+
+
+class StaticFileHandlerTest(BaseTest):
+
+ def test_static_handler(self):
+ response = self.fetch('/vendors/mopidy/mopidy.js', method='GET')
+
+ assert response.code == 200
+
+ def test_get_version(self):
+ assert StaticHandler.get_version(None, None) == Extension.version
+
+
+class RedirectHandlerTest(BaseTest):
+
+ def test_redirect_handler(self):
+ response = self.fetch('/', method='GET', follow_redirects=False)
+
+ assert response.code == 301
+ response.headers['Location'].endswith('index.html')
+
+
+class IndexHandlerTest(BaseTest):
+
+ def test_index_handler(self):
+ response = self.fetch('/index.html', method='GET')
+ assert response.code == 200
+
+ def test_get_title(self):
+ response = self.fetch('/index.html', method='GET')
+ body = tornado.escape.to_unicode(response.body)
+
+ assert '