LastFM for supporting imagery; Album wiki from LastFM; fixes #369
This commit is contained in:
@ -409,6 +409,10 @@ export let formatAlbum = function(data){
|
||||
'type',
|
||||
'added_at',
|
||||
'release_date',
|
||||
'listeners',
|
||||
'play_count',
|
||||
'wiki',
|
||||
'wiki_publish_date',
|
||||
'popularity',
|
||||
'images',
|
||||
'artists_uris',
|
||||
|
||||
@ -272,20 +272,24 @@ export function getAlbum(uri, artist, album, mbid = false){
|
||||
.then(
|
||||
response => {
|
||||
if (response.album){
|
||||
|
||||
var existing_album = getState().core.albums[uri];
|
||||
|
||||
var album = {
|
||||
uri: uri,
|
||||
images: response.album.image,
|
||||
listeners: response.album.listeners,
|
||||
play_count: response.album.playcount,
|
||||
mbid: response.album.mbid
|
||||
mbid: response.album.mbid,
|
||||
wiki: (response.album.wiki ? response.album.wiki.content : null),
|
||||
wiki_publish_date: (response.album.wiki ? response.album.wiki.published : null),
|
||||
};
|
||||
|
||||
if (response.album.wiki){
|
||||
album.wiki = response.album.wiki.content;
|
||||
|
||||
if (response.album.wiki.published){
|
||||
album.wiki_publish_date = response.album.wiki.published;
|
||||
}
|
||||
// If we've already got some of this album and it has images aready, don't use our ones.
|
||||
// In *most* cases this existing image will be perfectly suffice. This prevents an ugly
|
||||
// flicker when the existing image is replaced by the LastFM one
|
||||
if (existing_album && existing_album.images){
|
||||
delete album.images;
|
||||
}
|
||||
|
||||
dispatch(coreActions.albumLoaded(album));
|
||||
|
||||
@ -1906,9 +1906,6 @@ const MopidyMiddleware = (function(){
|
||||
|
||||
var album = Object.assign(
|
||||
{},
|
||||
{
|
||||
images: []
|
||||
},
|
||||
response[0].album,
|
||||
{
|
||||
source: 'local',
|
||||
@ -1921,13 +1918,13 @@ const MopidyMiddleware = (function(){
|
||||
store.dispatch(coreActions.albumLoaded(album));
|
||||
store.dispatch(coreActions.artistsLoaded(artists));
|
||||
|
||||
// load artwork from LastFM
|
||||
if (album.images.length <= 0){
|
||||
// load artwork from LastFM
|
||||
if (!response[0].album.images){
|
||||
var mbid = helpers.getFromUri('mbid',album.uri);
|
||||
if (mbid){
|
||||
store.dispatch(lastfmActions.getAlbum(false, false, mbid));
|
||||
} else {
|
||||
store.dispatch(lastfmActions.getAlbum(album.artists[0].name, album.name));
|
||||
store.dispatch(lastfmActions.getAlbum(album.uri, false, false, mbid));
|
||||
} else if (artists && artists.length > 0){
|
||||
store.dispatch(lastfmActions.getAlbum(album.uri, artists[0].name, album.name));
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -4,23 +4,24 @@ import { connect } from 'react-redux';
|
||||
import { bindActionCreators } from 'redux';
|
||||
|
||||
import ErrorMessage from '../components/ErrorMessage';
|
||||
import Header from '../components/Header'
|
||||
import TrackList from '../components/TrackList'
|
||||
import Thumbnail from '../components/Thumbnail'
|
||||
import Parallax from '../components/Parallax'
|
||||
import ArtistSentence from '../components/ArtistSentence'
|
||||
import ArtistGrid from '../components/ArtistGrid'
|
||||
import FollowButton from '../components/Fields/FollowButton'
|
||||
import Dater from '../components/Dater'
|
||||
import LazyLoadListener from '../components/LazyLoadListener'
|
||||
import ContextMenuTrigger from '../components/ContextMenuTrigger'
|
||||
import Icon from '../components/Icon'
|
||||
import Header from '../components/Header';
|
||||
import TrackList from '../components/TrackList';
|
||||
import Thumbnail from '../components/Thumbnail';
|
||||
import Parallax from '../components/Parallax';
|
||||
import ArtistSentence from '../components/ArtistSentence';
|
||||
import ArtistGrid from '../components/ArtistGrid';
|
||||
import FollowButton from '../components/Fields/FollowButton';
|
||||
import Dater from '../components/Dater';
|
||||
import LazyLoadListener from '../components/LazyLoadListener';
|
||||
import ContextMenuTrigger from '../components/ContextMenuTrigger';
|
||||
import Icon from '../components/Icon';
|
||||
|
||||
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'
|
||||
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';
|
||||
import * as lastfmActions from '../services/lastfm/actions';
|
||||
|
||||
class Album extends React.Component{
|
||||
|
||||
@ -31,6 +32,13 @@ class Album extends React.Component{
|
||||
componentDidMount(){
|
||||
this.setWindowTitle();
|
||||
this.props.coreActions.loadAlbum(this.props.uri);
|
||||
|
||||
// We already have the album in our index, so it won't fire componentWillReceiveProps
|
||||
if (this.props.album){
|
||||
if (this.props.album.artists && this.props.album.wiki === undefined){
|
||||
this.props.lastfmActions.getAlbum(this.props.album.uri, this.props.album.artists[0].name, this.props.album.name);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
handleContextMenu(e){
|
||||
@ -52,6 +60,13 @@ class Album extends React.Component{
|
||||
}
|
||||
}
|
||||
|
||||
// We have just received our full album or our album artists
|
||||
if ((!this.props.album && nextProps.album) || (!this.props.album.artists && nextProps.album.artists)){
|
||||
if (this.props.album.wiki === undefined){
|
||||
this.props.lastfmActions.getAlbum(nextProps.album.uri, nextProps.album.artists[0].name, nextProps.album.name);
|
||||
}
|
||||
}
|
||||
|
||||
if (!this.props.album && nextProps.album){
|
||||
this.setWindowTitle(nextProps.album);
|
||||
}
|
||||
@ -170,6 +185,14 @@ class Album extends React.Component{
|
||||
/>
|
||||
</section>
|
||||
|
||||
{album.wiki ? <section className="wiki">
|
||||
<h4 className="wiki__title">About</h4>
|
||||
<div className="wiki__text">
|
||||
<p>{album.wiki}</p><br />
|
||||
<div className="mid_grey-text">Published: { album.wiki_publish_date }</div>
|
||||
</div>
|
||||
</section> : null}
|
||||
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@ -197,7 +220,8 @@ const mapDispatchToProps = (dispatch) => {
|
||||
coreActions: bindActionCreators(coreActions, dispatch),
|
||||
uiActions: bindActionCreators(uiActions, dispatch),
|
||||
mopidyActions: bindActionCreators(mopidyActions, dispatch),
|
||||
spotifyActions: bindActionCreators(spotifyActions, dispatch)
|
||||
spotifyActions: bindActionCreators(spotifyActions, dispatch),
|
||||
lastfmActions: bindActionCreators(lastfmActions, dispatch)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -1,31 +1,31 @@
|
||||
|
||||
import React from 'react'
|
||||
import { connect } from 'react-redux'
|
||||
import { bindActionCreators } from 'redux'
|
||||
import React from 'react';
|
||||
import { connect } from 'react-redux';
|
||||
import { bindActionCreators } from 'redux';
|
||||
|
||||
import Link from '../components/Link';
|
||||
import ErrorMessage from '../components/ErrorMessage';
|
||||
import Header from '../components/Header'
|
||||
import TrackList from '../components/TrackList'
|
||||
import Thumbnail from '../components/Thumbnail'
|
||||
import ArtistSentence from '../components/ArtistSentence'
|
||||
import ArtistGrid from '../components/ArtistGrid'
|
||||
import FollowButton from '../components/Fields/FollowButton'
|
||||
import LastfmLoveButton from '../components/Fields/LastfmLoveButton'
|
||||
import Dater from '../components/Dater'
|
||||
import LazyLoadListener from '../components/LazyLoadListener'
|
||||
import ContextMenuTrigger from '../components/ContextMenuTrigger'
|
||||
import URILink from '../components/URILink'
|
||||
import Icon from '../components/Icon'
|
||||
import Popularity from '../components/Popularity'
|
||||
import Header from '../components/Header';
|
||||
import TrackList from '../components/TrackList';
|
||||
import Thumbnail from '../components/Thumbnail';
|
||||
import ArtistSentence from '../components/ArtistSentence';
|
||||
import ArtistGrid from '../components/ArtistGrid';
|
||||
import FollowButton from '../components/Fields/FollowButton';
|
||||
import LastfmLoveButton from '../components/Fields/LastfmLoveButton';
|
||||
import Dater from '../components/Dater';
|
||||
import LazyLoadListener from '../components/LazyLoadListener';
|
||||
import ContextMenuTrigger from '../components/ContextMenuTrigger';
|
||||
import URILink from '../components/URILink';
|
||||
import Icon from '../components/Icon';
|
||||
import Popularity from '../components/Popularity';
|
||||
|
||||
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'
|
||||
import * as lastfmActions from '../services/lastfm/actions'
|
||||
import * as geniusActions from '../services/genius/actions'
|
||||
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';
|
||||
import * as lastfmActions from '../services/lastfm/actions';
|
||||
import * as geniusActions from '../services/genius/actions';
|
||||
|
||||
class Track extends React.Component{
|
||||
|
||||
|
||||
@ -39,6 +39,10 @@ main .album-view {
|
||||
}
|
||||
}
|
||||
|
||||
.wiki {
|
||||
padding-top: 40px;
|
||||
}
|
||||
|
||||
@include responsive(null, $bp_medium){
|
||||
.parallax {
|
||||
height: 30vh;
|
||||
|
||||
Reference in New Issue
Block a user