Albums and playlists now loading using processes

This commit is contained in:
James Barnsley
2017-08-12 00:02:41 +12:00
parent 6d2bf7ff87
commit 884d3fdd49
11 changed files with 183 additions and 105 deletions

View File

@ -42,7 +42,7 @@ class Sidebar extends React.Component{
</Link>
</section>
<section>
{this.props.spotify_enabled ? <section>
<title>Discover</title>
<Link className={this.linkClassName('discover/recommendations')} to={global.baseURL+"discover/recommendations"}>
<Icon name="compass" />
@ -60,7 +60,7 @@ class Sidebar extends React.Component{
<Icon name="leaf" />
New releases
</Link>
</section>
</section> : null}
<section>
<title>My Music</title>

View File

@ -177,6 +177,18 @@ export function getLibraryPlaylists(){
}
}
export function getLibraryAlbums(){
return {
type: 'GET_LIBRARY_ALBUMS'
}
}
export function getLibraryArtists(){
return {
type: 'GET_LIBRARY_ARTISTS'
}
}
/**
* Assets loaded

View File

@ -264,6 +264,26 @@ const CoreMiddleware = (function(){
next(action)
break
case 'GET_LIBRARY_ALBUMS':
if (store.getState().spotify.connected){
store.dispatch(spotifyActions.getLibraryAlbums())
}
if (store.getState().mopidy.connected){
store.dispatch(mopidyActions.getLibraryAlbums())
}
next(action)
break
case 'GET_LIBRARY_ARTISTS':
if (store.getState().spotify.connected){
store.dispatch(spotifyActions.getLibraryArtists())
}
if (store.getState().mopidy.connected){
store.dispatch(mopidyActions.getLibraryArtists())
}
next(action)
break
case 'RESTART':
location.reload()
break

View File

@ -231,6 +231,16 @@ const MopidyMiddleware = (function(){
uri_schemes[i] = uri_schemes[i] +':'
}
// Enable Iris providers when the backend is available
if (uri_schemes.includes('spotify:')){
store.dispatch({
type: 'SPOTIFY_SET',
data: {
enabled: true
}
})
}
store.dispatch({ type: 'MOPIDY_URISCHEMES_FILTERED', data: uri_schemes });
break
@ -838,45 +848,37 @@ const MopidyMiddleware = (function(){
.then( response => {
if (response.length <= 0) return
var uris = helpers.arrayOf('uri',response)
store.dispatch({
type: 'LIBRARY_ALBUMS_LOADED',
uris: helpers.arrayOf('uri',response)
uris: uris
});
// Start our process to load the full album objects
store.dispatch(uiActions.startProcess('MOPIDY_LIBRARY_ALBUMS', 'Loading album library'))
store.dispatch(uiActions.runProcess('MOPIDY_LIBRARY_ALBUMS_PROCESSOR'));
store.dispatch(uiActions.startProcess('MOPIDY_LIBRARY_ALBUMS_PROCESSOR','Loading '+uris.length+' library albums', {uris: uris}))
})
break;
case 'MOPIDY_LIBRARY_ALBUMS_PROCESSOR':
console.log(action)
if (store.getState().ui.processes['MOPIDY_LIBRARY_ALBUMS'] !== undefined){
var processor = store.getState().ui.processes['MOPIDY_LIBRARY_ALBUMS']
if (store.getState().ui.processes['MOPIDY_LIBRARY_ALBUMS_PROCESSOR'] !== undefined){
var processor = store.getState().ui.processes['MOPIDY_LIBRARY_ALBUMS_PROCESSOR']
if (processor.cancelling){
store.dispatch(uiActions.processFinished('MOPIDY_LIBRARY_ALBUMS'))
store.dispatch(uiActions.processFinished('MOPIDY_LIBRARY_ALBUMS_PROCESSOR'))
return false
}
}
// Figure out the remaining items
var library_uris = store.getState().core.library_albums
var uris_not_loaded = []
for (var i = 0; i < library_uris.length; i++){
var uri = library_uris[i]
if (helpers.uriSource(uri) == 'local' && store.getState().core.albums[uri] === undefined){
uris_not_loaded.push(uri)
}
}
var uris = Object.assign([], action.data.uris)
var uris_to_load = uris.splice(0,50)
var to_load = uris_not_loaded.slice(0,50)
if (to_load.length > 0){
store.dispatch(uiActions.updateProcess('MOPIDY_LIBRARY_ALBUMS', 'Loading '+uris_not_loaded.length+' library albums'))
store.dispatch(mopidyActions.getAlbums(to_load, 'MOPIDY_LIBRARY_ALBUMS_PROCESSOR'))
if (uris_to_load.length > 0){
store.dispatch(uiActions.updateProcess('MOPIDY_LIBRARY_ALBUMS_PROCESSOR', 'Loading '+uris.length+' library albums'))
store.dispatch(mopidyActions.getAlbums(uris_to_load, {name: 'MOPIDY_LIBRARY_ALBUMS_PROCESSOR', data: {uris: uris}}))
} else {
store.dispatch(uiActions.processFinished('MOPIDY_LIBRARY_ALBUMS'))
store.dispatch(uiActions.processFinished('MOPIDY_LIBRARY_ALBUMS_PROCESSOR'))
}
break
@ -916,7 +918,7 @@ const MopidyMiddleware = (function(){
if (action.processor){
setTimeout(
function(){
store.dispatch(mopidyActions.runProcessor(action.processor))
store.dispatch(uiActions.runProcess(action.processor.name, action.processor.data))
},
100
)

View File

@ -333,7 +333,7 @@ const PusherMiddleware = (function(){
break
case 'PUSHER_CONFIG':
store.dispatch(spotifyActions.setConfig({
store.dispatch(spotifyActions.set({
locale: (action.config.locale ? action.config.locale : null),
country: (action.config.country ? action.config.country : null),
authorization_url: (action.config.authorization_url ? action.config.authorization_url : null),

View File

@ -180,10 +180,10 @@ function refreshToken( dispatch, getState ){
})
}
export function setConfig( config ){
export function set(data){
return {
type: 'SPOTIFY_SET_CONFIG',
config: config
type: 'SPOTIFY_SET',
data: data
}
}
@ -1081,21 +1081,6 @@ export function getAlbum( uri ){
}
}
export function getLibraryAlbums(){
return (dispatch, getState) => {
dispatch({ type: 'LIBRARY_ALBUMS_LOADED', uris: false });
sendRequest( dispatch, getState, 'me/albums?limit=40' )
.then( response => {
dispatch({
type: 'SPOTIFY_LIBRARY_ALBUMS_LOADED',
data: response
})
});
}
}
export function toggleAlbumInLibrary( uri, method ){
if( method == 'PUT' ) var new_state = 1
if( method == 'DELETE' ) var new_state = 0
@ -1252,43 +1237,6 @@ export function getAllPlaylistTracks(uri){
}
}
/**
* Get all of our playlists in one foul swoop
*
* Recursively gets playlists until no more .next value. Fails when user has
* a lot of playlists, and we hit the API limits
**/
function loadNextPlaylistsBatch(dispatch, getState, playlists, lastResponse){
if( lastResponse.next ){
sendRequest( dispatch, getState, lastResponse.next )
.then( response => {
playlists = [...playlists, ...response.items]
loadNextPlaylistsBatch( dispatch, getState, playlists, response )
});
}else{
dispatch(uiActions.processFinished('SPOTIFY_GET_ALL_LIBRARY_PLAYLISTS'))
dispatch({
type: 'SPOTIFY_LIBRARY_PLAYLISTS_LOADED',
playlists: playlists
});
}
}
export function getLibraryPlaylists(){
return (dispatch, getState) => {
dispatch(uiActions.startProcess('SPOTIFY_GET_ALL_LIBRARY_PLAYLISTS','Loading library playlists'))
sendRequest( dispatch, getState, 'me/playlists?limit=50' )
.then( response => {
loadNextPlaylistsBatch( dispatch, getState, response.items, response )
});
}
}
export function toggleFollowingPlaylist(uri, method){
if( method == 'PUT' ) var new_state = 1
if( method == 'DELETE' ) var new_state = 0
@ -1348,3 +1296,92 @@ export function reorderPlaylistTracks( uri, range_start, range_length, insert_be
});
}
}
/**
* =============================================================== LIBRARY ==============
* ======================================================================================
**/
/**
* ALbums
**/
export function getLibraryAlbums(){
return (dispatch, getState) => {
dispatch(uiActions.startProcess('SPOTIFY_GET_LIBRARY_ALBUMS_PROCESSOR','Loading Spotify library albums', {next: 'me/albums?limit=50'}))
}
}
export function getLibraryAlbumsProcessor(data){
return (dispatch, getState) => {
sendRequest(dispatch, getState, data.next)
.then( response => {
dispatch({
type: 'SPOTIFY_LIBRARY_ALBUMS_LOADED',
albums: response.items
})
// Check to see if we've been cancelled
if (getState().ui.processes['SPOTIFY_GET_LIBRARY_ALBUMS_PROCESSOR'] !== undefined){
var processor = getState().ui.processes['SPOTIFY_GET_LIBRARY_ALBUMS_PROCESSOR']
if (processor.cancelling){
dispatch(uiActions.processFinished('SPOTIFY_GET_LIBRARY_ALBUMS_PROCESSOR'))
return false
}
}
// We got a next link, so we've got more work to be done
if (response.next){
dispatch(uiActions.runProcess('SPOTIFY_GET_LIBRARY_ALBUMS_PROCESSOR', {next: response.next}))
} else {
dispatch(uiActions.processFinished('SPOTIFY_GET_LIBRARY_ALBUMS_PROCESSOR'))
}
});
}
}
/**
* Playlists
**/
export function getLibraryPlaylists(){
return (dispatch, getState) => {
dispatch(uiActions.startProcess('SPOTIFY_GET_LIBRARY_PLAYLISTS_PROCESSOR','Loading Spotify library playlists', {next: 'me/playlists?limit=50'}))
}
}
export function getLibraryPlaylistsProcessor(data){
return (dispatch, getState) => {
sendRequest(dispatch, getState, data.next)
.then( response => {
dispatch({
type: 'SPOTIFY_LIBRARY_PLAYLISTS_LOADED',
playlists: response.items
})
// Check to see if we've been cancelled
if (getState().ui.processes['SPOTIFY_GET_LIBRARY_PLAYLISTS_PROCESSOR'] !== undefined){
var processor = getState().ui.processes['SPOTIFY_GET_LIBRARY_PLAYLISTS_PROCESSOR']
if (processor.cancelling){
dispatch(uiActions.processFinished('SPOTIFY_GET_LIBRARY_PLAYLISTS_PROCESSOR'))
return false
}
}
// We got a next link, so we've got more work to be done
if (response.next){
dispatch(uiActions.runProcess('SPOTIFY_GET_LIBRARY_PLAYLISTS_PROCESSOR', {next: response.next}))
} else {
dispatch(uiActions.processFinished('SPOTIFY_GET_LIBRARY_PLAYLISTS_PROCESSOR'))
}
});
}
}

View File

@ -180,6 +180,10 @@ const SpotifyMiddleware = (function(){
});
break
case 'SPOTIFY_GET_LIBRARY_PLAYLISTS_PROCESSOR':
store.dispatch(spotifyActions.getLibraryPlaylistsProcessor(action.data))
break
case 'SPOTIFY_LIBRARY_PLAYLISTS_LOADED':
var playlists = []
for( var i = 0; i < action.playlists.length; i++ ){
@ -236,20 +240,24 @@ const SpotifyMiddleware = (function(){
});
break
case 'SPOTIFY_GET_LIBRARY_ALBUMS_PROCESSOR':
store.dispatch(spotifyActions.getLibraryAlbumsProcessor(action.data))
break
case 'SPOTIFY_LIBRARY_ALBUMS_LOADED':
var albums = []
for (var i = 0; i < action.data.items.length; i++){
for (var i = 0; i < action.albums.length; i++){
albums.push(
Object.assign(
{},
action.data.items[i].album,
action.albums[i].album,
{
in_library: true, // assumed because we asked for library items
source: 'spotify',
added_at: action.data.items[i].added_at,
tracks: action.data.items[i].album.tracks.items,
tracks_more: action.data.items[i].album.tracks.next,
tracks_total: action.data.items[i].album.tracks.total
added_at: action.albums[i].added_at,
tracks: action.albums[i].album.tracks.items,
tracks_more: action.albums[i].album.tracks.next,
tracks_total: action.albums[i].album.tracks.total
}
)
)
@ -262,9 +270,7 @@ const SpotifyMiddleware = (function(){
store.dispatch({
type: 'LIBRARY_ALBUMS_LOADED',
uris: helpers.arrayOf('uri',albums),
more: action.data.next,
total: action.data.total
uris: helpers.arrayOf('uri',albums)
});
break

View File

@ -14,8 +14,8 @@ export default function reducer(spotify = {}, action){
case 'SPOTIFY_DISCONNECTED':
return Object.assign({}, spotify, { connected: false, connecting: false })
case 'SPOTIFY_SET_CONFIG':
return Object.assign({},spotify,action.config)
case 'SPOTIFY_SET':
return Object.assign({},spotify,action.data)
case 'PUSHER_SPOTIFY_TOKEN':
if (spotify.authorization) return spotify;

View File

@ -188,7 +188,8 @@ export function updateProcess(key,message,data = {}){
export function runProcess(key,data = {}){
return {
type: key
type: key,
data: data
}
}

View File

@ -128,10 +128,15 @@ export default function reducer(ui = {}, action){
case 'START_PROCESS':
case 'UPDATE_PROCESS':
var processes = Object.assign({}, (ui.processes ? ui.processes : []))
if (processes[action.key]){
var data = Object.assign({}, processes[action.key].data, action.data)
} else {
var data = action.data
}
processes[action.key] = {
key: action.key,
message: action.message,
data: action.data
data: data
}
return Object.assign({}, ui, {processes: processes})

View File

@ -14,6 +14,7 @@ import DropdownField from '../../components/DropdownField'
import LazyLoadListener from '../../components/LazyLoadListener'
import * as helpers from '../../helpers'
import * as coreActions from '../../services/core/actions'
import * as uiActions from '../../services/ui/actions'
import * as mopidyActions from '../../services/mopidy/actions'
import * as spotifyActions from '../../services/spotify/actions'
@ -25,21 +26,16 @@ class LibraryAlbums extends React.Component{
}
componentDidMount(){
if (this.props.spotify_connected && !this.props.library_albums_spotify_started){
this.props.spotifyActions.getLibraryAlbums()
}
if (this.props.mopidy_connected && !this.props.local_albums){
this.props.mopidyActions.getLibraryAlbums()
if (!this.props.library_albums){
this.props.coreActions.getLibraryAlbums()
}
}
componentWillReceiveProps(newProps){
if (!this.props.spotify_connected && newProps.spotify_connected && !this.props.library_albums_started){
if (!this.props.spotify_connected && newProps.spotify_connected){
this.props.spotifyActions.getLibraryAlbums()
}
if (!this.props.mopidy_connected && newProps.mopidy_connected && !newProps.local_albums){
if (!this.props.mopidy_connected && newProps.mopidy_connected){
this.props.mopidyActions.getLibraryAlbums()
}
}
@ -289,8 +285,6 @@ const mapStateToProps = (state, ownProps) => {
load_queue: state.ui.load_queue,
albums: state.core.albums,
library_albums: state.core.library_albums,
library_albums_started: state.core.library_albums_started,
library_albums_more: state.core.library_albums_more,
view: state.ui.library_albums_view,
filter: (state.ui.library_albums_filter ? state.ui.library_albums_filter : 'all'),
sort: (state.ui.library_albums_sort ? state.ui.library_albums_sort : 'name'),
@ -300,6 +294,7 @@ const mapStateToProps = (state, ownProps) => {
const mapDispatchToProps = (dispatch) => {
return {
coreActions: bindActionCreators(coreActions, dispatch),
uiActions: bindActionCreators(uiActions, dispatch),
mopidyActions: bindActionCreators(mopidyActions, dispatch),
spotifyActions: bindActionCreators(spotifyActions, dispatch)