Playlist and Users data storage overhaul

This commit is contained in:
James Barnsley
2018-08-31 16:04:55 +12:00
parent 02ab0616fa
commit dbb5effbb9
21 changed files with 15035 additions and 11241 deletions

View File

@ -29,16 +29,16 @@ class Playlist extends React.Component{
}
componentDidMount(){
this.loadPlaylist();
this.setWindowTitle();
this.props.coreActions.loadPlaylist(this.props.params.uri);
}
componentWillReceiveProps(nextProps){
if (nextProps.params.uri != this.props.params.uri){
this.loadPlaylist(nextProps);
this.props.coreActions.loadPlaylist(nextProps.params.uri);
} else if (!this.props.mopidy_connected && nextProps.mopidy_connected){
if (helpers.uriSource(this.props.params.uri) != 'spotify'){
this.loadPlaylist(nextProps);
this.props.coreActions.loadPlaylist(nextProps.params.uri);
}
}
@ -59,28 +59,6 @@ class Playlist extends React.Component{
}
}
loadPlaylist(props = this.props){
if (props.playlist && props.playlist.is_completely_loaded){
console.info('Loading playlist from index')
} else {
switch (helpers.uriSource(props.params.uri)){
case 'spotify':
this.props.spotifyActions.getPlaylist(props.params.uri);
this.props.spotifyActions.following(props.params.uri);
break
default:
if (props.mopidy_connected){
this.props.mopidyActions.getPlaylist(props.params.uri);
}
break
}
}
}
loadMore(){
this.props.spotifyActions.getMore(
this.props.playlist.tracks_more,
@ -140,7 +118,7 @@ class Playlist extends React.Component{
}
renderActions(){
switch(helpers.uriSource(this.props.playlist.uri )){
switch(helpers.uriSource(this.props.playlist.uri)){
case 'm3u':
return (
@ -196,22 +174,14 @@ class Playlist extends React.Component{
}
}
var playlist = helpers.collate(this.props.playlist, {tracks: this.props.tracks, users: this.props.users});
var context = 'playlist';
if (this.props.playlist.can_edit){
if (playlist.can_edit){
context = 'editable-playlist';
}
var tracks = [];
if (this.props.playlist.tracks_uris && this.props.tracks){
for (var i = 0; i < this.props.playlist.tracks_uris.length; i++){
var uri = this.props.playlist.tracks_uris[i]
if (this.props.tracks.hasOwnProperty(uri)){
tracks.push(this.props.tracks[uri])
}
}
}
if (tracks.length <= 0 && helpers.isLoading(this.props.load_queue,['spotify_users/'+user_id+'/playlists/'+playlist_id, 'spotify_users/'+user_id+'/playlists/'+playlist_id+'/tracks'])){
if (playlist.tracks && playlist.tracks.length <= 0 && helpers.isLoading(this.props.load_queue,['spotify_users/'+user_id+'/playlists/'+playlist_id, 'spotify_users/'+user_id+'/playlists/'+playlist_id+'/tracks'])){
var is_loading_tracks = true;
} else {
var is_loading_tracks = false;
@ -220,21 +190,21 @@ class Playlist extends React.Component{
return (
<div className="view playlist-view content-wrapper">
<div className="thumbnail-wrapper">
<Thumbnail size="large" canZoom images={ this.props.playlist.images } />
<Thumbnail size="large" canZoom images={playlist.images} />
</div>
<div className="title">
<h1>{ this.props.playlist.name }</h1>
{ this.props.playlist.description ? <h2 className="description grey-text" dangerouslySetInnerHTML={{__html: this.props.playlist.description}}></h2> : null }
<h1>{playlist.name}</h1>
{playlist.description ? <h2 className="description grey-text" dangerouslySetInnerHTML={{__html: playlist.description}}></h2> : null }
<ul className="details">
{ !this.props.slim_mode ? <li className="has-tooltip"><Icon type="fontawesome" name={helpers.sourceIcon(this.props.params.uri )} /><span className="tooltip">{helpers.uriSource(this.props.params.uri)} playlist</span></li> : null }
{ this.props.playlist.owner && !this.props.slim_mode ? <li><URILink type="user" uri={this.props.playlist.owner.uri}>{this.props.playlist.owner.id}</URILink></li> : null }
{ this.props.playlist.followers ? <li>{this.props.playlist.followers.total.toLocaleString()} followers</li> : null }
{ this.props.playlist.last_modified ? <li>Edited <Dater type="ago" data={this.props.playlist.last_modified} /></li> : null }
{!this.props.slim_mode ? <li className="has-tooltip"><Icon type="fontawesome" name={helpers.sourceIcon(playlist.uri)} /><span className="tooltip">{helpers.uriSource(playlist.uri)} playlist</span></li> : null }
{playlist.user_uri && !this.props.slim_mode ? <li><URILink type="user" uri={playlist.user_uri}>{playlist.user ? playlist.user.name : helpers.getFromUri('userid',playlist.user_uri)}</URILink></li> : null }
{playlist.followers ? <li>{playlist.followers.toLocaleString()} followers</li> : null }
{playlist.last_modified_date ? <li>Edited <Dater type="ago" data={playlist.last_modified_date} /></li> : null }
<li>
{ this.props.playlist.tracks_total ? this.props.playlist.tracks_total : tracks.length} tracks,&nbsp;
<Dater type="total-time" data={tracks} />
{playlist.tracks_total ? playlist.tracks_total : (playlist.tracks ? playlist.tracks.length : '0')} tracks,&nbsp;
<Dater type="total-time" data={playlist.tracks} />
</li>
</ul>
</div>
@ -242,8 +212,8 @@ class Playlist extends React.Component{
{ this.renderActions() }
<section className="list-wrapper">
<TrackList uri={this.props.params.uri} className="playlist-track-list" context={context} tracks={tracks} removeTracks={ tracks_indexes => this.removeTracks(tracks_indexes) } reorderTracks={ (indexes, index) => this.reorderTracks(indexes, index) } />
<LazyLoadListener loading={this.props.playlist.tracks_more} forceLoader={is_loading_tracks} loadMore={() => this.loadMore()}/>
<TrackList uri={playlist.uri} className="playlist-track-list" context={context} tracks={playlist.tracks} removeTracks={ tracks_indexes => this.removeTracks(tracks_indexes) } reorderTracks={ (indexes, index) => this.reorderTracks(indexes, index) } />
<LazyLoadListener loading={playlist.tracks_more} forceLoader={is_loading_tracks} loadMore={() => this.loadMore()}/>
</section>
</div>
)
@ -263,6 +233,7 @@ const mapStateToProps = (state, ownProps) => {
allow_reporting: state.ui.allow_reporting,
slim_mode: state.ui.slim_mode,
load_queue: state.ui.load_queue,
users: state.core.users,
tracks: state.core.tracks,
playlist: (state.core.playlists[uri] !== undefined ? state.core.playlists[uri] : false ),
spotify_library_playlists: state.spotify.library_playlists,