Moving libraries into each provider for better granularity; Loading all artists (larger than expected)

This commit is contained in:
James Barnsley
2017-08-12 23:01:55 +12:00
parent 884d3fdd49
commit eaf86e1848
9 changed files with 302 additions and 255 deletions

View File

@ -26,17 +26,40 @@ class LibraryAlbums extends React.Component{
}
componentDidMount(){
if (!this.props.library_albums){
this.props.coreActions.getLibraryAlbums()
if (!this.props.mopidy_library_albums && this.props.mopidy_connected && (this.props.filter == 'all' || this.props.filter == 'local')){
this.props.mopidyActions.getLibraryAlbums()
}
if (!this.props.spotify_library_albums && this.props.spotify_connected && (this.props.filter == 'all' || this.props.filter == 'spotify')){
this.props.spotifyActions.getLibraryAlbums()
}
}
componentWillReceiveProps(newProps){
if (!this.props.spotify_connected && newProps.spotify_connected){
this.props.spotifyActions.getLibraryAlbums()
if (newProps.mopidy_connected && (newProps.filter == 'all' || newProps.filter == 'local')){
// We've just connected
if (!this.props.mopidy_connected){
this.props.mopidyActions.getLibraryAlbums()
}
// Filter changed, but we haven't got this provider's library yet
if (this.props.filter != 'all' && this.props.filter != 'local' && !newProps.mopidy_library_albums){
this.props.mopidyActions.getLibraryAlbums()
}
}
if (!this.props.mopidy_connected && newProps.mopidy_connected){
this.props.mopidyActions.getLibraryAlbums()
if (newProps.spotify_connected && (newProps.filter == 'all' || newProps.filter == 'spotify')){
// We've just connected
if (!this.props.spotify_connected){
this.props.spotifyActions.getLibraryAlbums()
}
// Filter changed, but we haven't got this provider's library yet
if (this.props.filter != 'all' && this.props.filter != 'spotify' && !newProps.spotify_library_albums){
this.props.spotifyActions.getLibraryAlbums()
}
}
}
@ -157,10 +180,24 @@ class LibraryAlbums extends React.Component{
render(){
var albums = []
if (this.props.library_albums && this.props.albums){
for (var i = 0; i < this.props.library_albums.length; i++){
var uri = this.props.library_albums[i]
// Spotify library items
if (this.props.spotify_library_albums && (this.props.filter == 'all' || this.props.filter == 'spotify')){
for (var i = 0; i < this.props.spotify_library_albums.length; i++){
var uri = this.props.spotify_library_albums[i]
if (this.props.albums.hasOwnProperty(uri)){
albums.push(this.props.albums[uri])
}
}
}
// Mopidy library items
if (this.props.mopidy_library_albums && (this.props.filter == 'all' || this.props.filter == 'local')){
for (var i = 0; i < this.props.mopidy_library_albums.length; i++){
// Construct item placeholder. This is used as Mopidy needs to
// lookup ref objects to get the full object which can take some time
var uri = this.props.mopidy_library_albums[i]
var source = helpers.uriSource(uri)
var album = {
uri: uri,
@ -171,29 +208,12 @@ class LibraryAlbums extends React.Component{
album = this.props.albums[uri]
}
switch (this.props.filter){
case 'spotify':
if (source == 'spotify'){
albums.push(album)
}
break
case 'local':
if (source == 'local'){
albums.push(album)
}
break
default:
albums.push(album)
break
}
albums.push(album)
}
}
if( this.props.sort ){
albums = helpers.sortItems(albums, this.props.sort, this.props.sort_reverse)
}
if (this.props.sort){
albums = helpers.sortItems(albums, this.props.sort, this.props.sort_reverse)
}
var filter_options = [
@ -259,11 +279,7 @@ class LibraryAlbums extends React.Component{
<Header icon="cd" title="My albums" options={options} uiActions={this.props.uiActions} />
<section className="content-wrapper">
{ this.renderView(albums) }
<LazyLoadListener
loading={this.props.library_albums_more && (this.props.filter == 'all' || this.props.filter == 'spotify')}
loadMore={() => this.loadMoreSpotify()}
/>
{this.renderView(albums)}
</section>
</div>
@ -284,7 +300,8 @@ const mapStateToProps = (state, ownProps) => {
spotify_connected: state.spotify.connected,
load_queue: state.ui.load_queue,
albums: state.core.albums,
library_albums: state.core.library_albums,
spotify_library_albums: state.spotify.library_albums,
mopidy_library_albums: state.mopidy.library_albums,
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'),

View File

@ -21,6 +21,22 @@ class LibraryArtists extends React.Component{
super(props);
}
componentDidMount(){
if (!this.props.spotify_library_artists && this.props.spotify_connected){
this.props.spotifyActions.getLibraryArtists()
}
}
componentWillReceiveProps(newProps){
if (newProps.spotify_connected){
// We've just connected
if (!this.props.spotify_connected){
this.props.spotifyActions.getLibraryArtists()
}
}
}
handleContextMenu(e,item){
var data = {
e: e,
@ -31,16 +47,6 @@ class LibraryArtists extends React.Component{
this.props.uiActions.showContextMenu(data)
}
componentDidMount(){
if (!this.props.library_artists_started){
this.props.spotifyActions.getLibraryArtists();
}
}
loadMore(){
this.props.spotifyActions.getURL( this.props.library_artists_more, 'SPOTIFY_LIBRARY_ARTISTS_LOADED' );
}
setSort(value){
var reverse = false
if( this.props.sort == value ) reverse = !this.props.sort_reverse
@ -90,31 +96,20 @@ class LibraryArtists extends React.Component{
}
render(){
if (helpers.isLoading(this.props.load_queue,['spotify_me/following?type=artist'])){
return (
<div className="view library-albums-view">
<Header icon="cd" title="My albums" />
<div className="body-loader">
<div className="loader"></div>
</div>
</div>
)
}
var artists = []
if (this.props.library_artists && this.props.artists){
for (var i = 0; i < this.props.library_artists.length; i++){
var uri = this.props.library_artists[i]
// Spotify library items
if (this.props.spotify_library_artists){
for (var i = 0; i < this.props.spotify_library_artists.length; i++){
var uri = this.props.spotify_library_artists[i]
if (this.props.artists.hasOwnProperty(uri)){
artists.push(this.props.artists[uri])
}
}
if( this.props.sort ){
artists = helpers.sortItems(artists, this.props.sort, this.props.sort_reverse)
}
}
artists = helpers.sortItems(artists, this.props.sort, this.props.sort_reverse)
var view_options = [
{
label: 'Thumbnails',
@ -167,12 +162,9 @@ class LibraryArtists extends React.Component{
const mapStateToProps = (state, ownProps) => {
return {
load_queue: state.ui.load_queue,
spotify_connected: state.spotify.connected,
spotify_library_artists: state.spotify.library_artists,
artists: state.core.artists,
library_artists: state.core.library_artists,
library_artists_started: state.core.library_artists_started,
library_artists_more: state.core.library_artists_more,
library_artists_started: state.core.library_artists_started,
sort: (state.ui.library_artists_sort ? state.ui.library_artists_sort : 'name'),
sort_reverse: (state.ui.library_artists_sort_reverse ? true : false),
view: state.core.library_artists_view

View File

@ -23,20 +23,40 @@ class LibraryPlaylists extends React.Component{
}
componentDidMount(){
if (!this.props.library_playlists){
if (this.props.spotify_connected){
this.props.coreActions.getLibraryPlaylists()
}
if (!this.props.mopidy_library_playlists && this.props.mopidy_connected && (this.props.filter == 'all' || this.props.filter == 'local')){
this.props.mopidyActions.getLibraryPlaylists()
}
if (!this.props.spotify_library_playlists && this.props.spotify_connected && (this.props.filter == 'all' || this.props.filter == 'spotify')){
this.props.spotifyActions.getLibraryPlaylists()
}
}
componentWillReceiveProps(newProps){
if (!this.props.spotify_connected && newProps.spotify_connected){
this.props.spotifyActions.getLibraryPlaylists()
if (newProps.mopidy_connected && (newProps.filter == 'all' || newProps.filter == 'local')){
// We've just connected
if (!this.props.mopidy_connected){
this.props.mopidyActions.getLibraryPlaylists()
}
// Filter changed, but we haven't got this provider's library yet
if (this.props.filter != 'all' && this.props.filter != 'local' && !newProps.mopidy_library_playlists){
this.props.mopidyActions.getLibraryPlaylists()
}
}
if (!this.props.mopidy_connected && newProps.mopidy_connected){
this.props.mopidyActions.getLibraryPlaylists()
if (newProps.spotify_connected && (newProps.filter == 'all' || newProps.filter == 'spotify')){
// We've just connected
if (!this.props.spotify_connected){
this.props.spotifyActions.getLibraryPlaylists()
}
// Filter changed, but we haven't got this provider's library yet
if (this.props.filter != 'all' && this.props.filter != 'spotify' && !newProps.spotify_library_playlists){
this.props.spotifyActions.getLibraryPlaylists()
}
}
}
@ -62,43 +82,32 @@ class LibraryPlaylists extends React.Component{
}
renderView(){
if (!this.props.library_playlists || !this.props.playlists ){
return null
}
var playlists = []
for (var i = 0; i < this.props.library_playlists.length; i++){
var uri = this.props.library_playlists[i]
var owner_id = helpers.getFromUri('playlistowner',uri)
if (this.props.playlists.hasOwnProperty(uri)){
switch (this.props.filter){
case 'only_mine':
if (this.props.me_id && owner_id == this.props.me_id){
playlists.push(this.props.playlists[uri])
}
break
case 'only_others':
if (!this.props.me_id || owner_id != this.props.me_id){
playlists.push(this.props.playlists[uri])
}
break
default:
playlists.push(this.props.playlists[uri])
break
// Spotify library items
if (this.props.spotify_library_playlists && (this.props.filter == 'all' || this.props.filter == 'spotify')){
for (var i = 0; i < this.props.spotify_library_playlists.length; i++){
var uri = this.props.spotify_library_playlists[i]
if (this.props.playlists.hasOwnProperty(uri)){
playlists.push(this.props.playlists[uri])
}
}
}
if( this.props.sort ){
playlists = helpers.sortItems(playlists, this.props.sort, this.props.sort_reverse)
// Mopidy library items
if (this.props.mopidy_library_playlists && (this.props.filter == 'all' || this.props.filter == 'local')){
for (var i = 0; i < this.props.mopidy_library_playlists.length; i++){
var uri = this.props.mopidy_library_playlists[i]
if (this.props.playlists.hasOwnProperty(uri)){
playlists.push(this.props.playlists[uri])
}
}
}
if( this.props.view == 'list' ){
playlists = helpers.sortItems(playlists, this.props.sort, this.props.sort_reverse)
playlists = helpers.removeDuplicates(playlists)
if (this.props.view == 'list'){
if (this.props.slim_mode){
var columns = [
{
@ -164,12 +173,12 @@ class LibraryPlaylists extends React.Component{
label: 'All'
},
{
value: 'only_mine',
label: 'Owned by me'
value: 'local',
label: 'Local'
},
{
value: 'only_others',
label: 'I\'m following'
value: 'spotify',
label: 'Spotify'
}
]
@ -239,6 +248,8 @@ const mapStateToProps = (state, ownProps) => {
return {
mopidy_connected: state.mopidy.connected,
spotify_connected: state.spotify.connected,
mopidy_library_playlists: state.mopidy.library_playlists,
spotify_library_playlists: state.spotify.library_playlists,
slim_mode: state.ui.slim_mode,
load_queue: state.ui.load_queue,
me_id: (state.spotify.me ? state.spotify.me.id : (state.ui.config && state.ui.config.spotify_username ? state.ui.config.spotify_username : false)),
@ -246,7 +257,6 @@ const mapStateToProps = (state, ownProps) => {
filter: (state.ui.library_playlists_filter ? state.ui.library_playlists_filter : 'all'),
sort: (state.ui.library_playlists_sort ? state.ui.library_playlists_sort : 'name'),
sort_reverse: (state.ui.library_playlists_sort_reverse ? true : false),
library_playlists: state.core.library_playlists,
playlists: state.core.playlists
}
}