diff --git a/src/js/components/ArtistGrid.js b/src/js/components/ArtistGrid.js
index 7c20ff07..f0859107 100755
--- a/src/js/components/ArtistGrid.js
+++ b/src/js/components/ArtistGrid.js
@@ -2,13 +2,15 @@
import React, { PropTypes } from 'react'
import { connect } from 'react-redux'
import { createStore, bindActionCreators } from 'redux'
+import { hashHistory } from 'react-router'
import FontAwesome from 'react-fontawesome'
import Thumbnail from './Thumbnail'
-import URILink from './URILink'
+import GridItem from './GridItem'
import * as helpers from '../helpers'
import * as uiActions from '../services/ui/actions'
+import * as lastfmActions from '../services/lastfm/actions'
class ArtistGrid extends React.Component{
@@ -40,22 +42,16 @@ class ArtistGrid extends React.Component{
this.props.artists.map(
(artist, index) => {
return (
- this.handleContextMenu(e,artist)}>
-
-
- {artist.name}
-
-
- {this.props.show_source_icon ? : null}
- {artist.followers ? artist.followers.total.toLocaleString()+' followers' : null}
- {artist.albums_uris && !artist.followers ? artist.albums_uris.length+' albums' : null}
-
-
+ item={artist}
+ show_source_icon={this.props.show_source_icon}
+ onClick={e => {hashHistory.push(global.baseURL+'artist/'+encodeURIComponent(artist.uri))}}
+ onLoad={() => this.handleLoad(artist.uri)}
+ lastfmActions={this.props.lastfmActions}
+ onContextMenu={e => this.handleContextMenu(e,artist)}
+ />
)
}
)
@@ -73,7 +69,8 @@ const mapStateToProps = (state, ownProps) => {
const mapDispatchToProps = (dispatch) => {
return {
- uiActions: bindActionCreators(uiActions, dispatch)
+ uiActions: bindActionCreators(uiActions, dispatch),
+ lastfmActions: bindActionCreators(lastfmActions, dispatch)
}
}
diff --git a/src/js/components/GridItem.js b/src/js/components/GridItem.js
index 9acac3cf..c6376ddd 100755
--- a/src/js/components/GridItem.js
+++ b/src/js/components/GridItem.js
@@ -14,6 +14,16 @@ export default class GridItem extends React.Component{
super(props)
}
+ componentDidMount(){
+ if (this.props.item && !this.props.item.images){
+ switch (this.props.item.type){
+ case 'artist':
+ this.props.lastfmActions.getArtist(this.props.item.uri, this.props.item.name);
+ break;
+ }
+ }
+ }
+
handleClick(e){
if (this.props.onClick && e.target.tagName.toLowerCase() !== 'a'){
this.props.onClick(e)
@@ -27,7 +37,7 @@ export default class GridItem extends React.Component{
}
shouldComponentUpdate(nextProps, nextState){
- return nextProps.item != this.props.item
+ return nextProps.item != this.props.item;
}
renderSecondary(item){
@@ -46,7 +56,8 @@ export default class GridItem extends React.Component{
case 'artist':
return (
- {item.followers ? item.followers.total.toLocaleString()+' followers' : item.albums_uris.length+' albums'}
+ {item.followers ? item.followers.total.toLocaleString()+' followers' : null}
+ {item.albums_uris ? item.albums_uris.length+' albums' : null}
)
break
diff --git a/src/js/services/mopidy/middleware.js b/src/js/services/mopidy/middleware.js
index 44589ed6..ebbebd82 100755
--- a/src/js/services/mopidy/middleware.js
+++ b/src/js/services/mopidy/middleware.js
@@ -1544,8 +1544,6 @@ const MopidyMiddleware = (function(){
* =============================================================== ARTIST(S) ============
* ======================================================================================
**/
-
- /*
case 'MOPIDY_GET_LIBRARY_ARTISTS':
instruct(socket, store, 'library.browse', { uri: 'local:directory?type=artist' } )
.then(response => {
@@ -1562,25 +1560,14 @@ const MopidyMiddleware = (function(){
type: 'MOPIDY_LIBRARY_ARTISTS_LOADED',
uris: uris
});
-
- // TODO: Load LastFM artwork?
- console.log(response);
-
- // Get artwork for first 20
- for (var i = 0; i < response.length && i < 20; i++){
- store.dispatch(lastfmActions.getArtist(response[i].uri, response[i].name));
- }
-
});
break;
- */
/**
* TODO: Fetch and process library artists
*
* We can't get specific artist artwork from Mopidy. Perhaps we fetch additional
* artist metadata via LastFM? Their API limits will make this quite slow.
- **/
case 'MOPIDY_GET_LIBRARY_ARTISTS':
var last_run = store.getState().ui.processes.MOPIDY_LIBRARY_ARTISTS_PROCESSOR
@@ -1630,6 +1617,7 @@ const MopidyMiddleware = (function(){
}
break;
+ **/
case 'MOPIDY_GET_ARTIST':
instruct(socket, store, 'library.lookup', action.data )
@@ -1672,7 +1660,7 @@ const MopidyMiddleware = (function(){
albums_uris: helpers.arrayOf('uri',albums),
tracks: response.slice(0,10)
}
- );
+ );
store.dispatch({
type: 'ARTIST_LOADED',
key: artist.uri,
@@ -1680,9 +1668,10 @@ const MopidyMiddleware = (function(){
});
// load artwork from LastFM
- if (!artist.images || artist.images.length <= 0){
+ var existing_artist = store.getState().core.artists[artist.uri];
+ if (existing_artist && !existing_artist.images){
if (artist.musicbrainz_id){
- store.dispatch(lastfmActions.getArtist(artist.uri, false, artist.musicbrainz_id ) )
+ store.dispatch(lastfmActions.getArtist(artist.uri, false, artist.musicbrainz_id))
} else {
store.dispatch(lastfmActions.getArtist(artist.uri, artist.name))
}
@@ -1707,15 +1696,6 @@ const MopidyMiddleware = (function(){
}
);
artists.push(artist);
-
- // load artwork from LastFM
- if (!artist.images || artist.images.length <= 0){
- if (artist.musicbrainz_id){
- store.dispatch(lastfmActions.getArtist(artist.uri, false, artist.musicbrainz_id ) )
- } else {
- store.dispatch(lastfmActions.getArtist(artist.uri, artist.name))
- }
- }
}
}
diff --git a/src/js/views/Artist.js b/src/js/views/Artist.js
index 1e1acfa1..de45a913 100755
--- a/src/js/views/Artist.js
+++ b/src/js/views/Artist.js
@@ -68,7 +68,7 @@ class Artist extends React.Component{
default:
if (props.mopidy_connected){
- if (props.artist && props.artist.images){
+ if (props.artist && props.artist.images && props.artist.albums_uris){
console.info('Loading local artist from index');
} else {
this.props.mopidyActions.getArtist(props.params.uri);
diff --git a/src/js/views/library/LibraryArtists.js b/src/js/views/library/LibraryArtists.js
index 7092cd79..f2b35876 100755
--- a/src/js/views/library/LibraryArtists.js
+++ b/src/js/views/library/LibraryArtists.js
@@ -29,7 +29,7 @@ class LibraryArtists extends React.Component{
}
componentDidMount(){
- if (this.props.mopidy_library_artists_status != 'finished' && this.props.mopidy_connected && (this.props.source == 'all' || this.props.source == 'local')){
+ if (!this.props.mopidy_library_artists && this.props.mopidy_connected && (this.props.source == 'all' || this.props.source == 'local')){
this.props.mopidyActions.getLibraryArtists();
}
@@ -47,7 +47,7 @@ class LibraryArtists extends React.Component{
}
// Filter changed, but we haven't got this provider's library yet
- if (this.props.source != 'all' && this.props.source != 'local' && newProps.mopidy_library_artists_status != 'finished'){
+ if (this.props.source != 'all' && this.props.source != 'local' && !newProps.mopidy_library_artists){
this.props.mopidyActions.getLibraryArtists();
}
}
@@ -77,7 +77,7 @@ class LibraryArtists extends React.Component{
}
loadMore(){
- console.log('Load more')
+ console.log('Load more');
this.setState({limit: this.state.limit + this.state.per_page});
}
@@ -89,11 +89,11 @@ class LibraryArtists extends React.Component{
library_artists_sort_reverse: reverse,
library_artists_sort: value
}
- this.props.uiActions.set(data)
+ this.props.uiActions.set(data);
}
renderView(){
- var artists = []
+ var artists = [];
// Mopidy library items
if (this.props.mopidy_library_artists && (this.props.source == 'all' || this.props.source == 'local')){