secstate/Iris
Public Access
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

More general detection for uri type

Browse Source
This commit is contained in:
James Barnsley
2017-02-26 18:33:20 +13:00
parent 25d572e391
commit 6156b06a0a
6 changed files with 109 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
src/js/helpers.js
View File

@ -158,23 +158,47 @@ export let sourceIcon = function(uri,source = null){
**/
export let getFromUri = function(element,uri){
var exploded = uri.split(':');
var namespace = exploded[0]
if( element == 'mbid'){
var index = exploded.indexOf('mbid')
if( index > -1 ) return exploded[index+1]
switch (element){
case 'mbid':
var index = exploded.indexOf('mbid')
if( index > -1 ) return exploded[index+1]
break
case 'artistid':
if (exploded[1] == 'artist'){
return exploded[2]
}
break
case 'albumid':
if (exploded[1] == 'album'){
return exploded[2]
}
break
case 'playlistid':
if (exploded[1] == 'playlist'){
return exploded[2]
} else if (exploded[1] == 'user' && exploded[3] == 'playlist'){
return exploded[4]
}
break
case 'trackid':
if (exploded[1] == 'track'){
return exploded[2]
}
break
case 'userid':
if (exploded[1] == 'user'){
return exploded[2]
}
break
}
if( exploded[0] == 'spotify' ){
if( element == 'userid' && exploded[1] == 'user' ) return exploded[2];
if( element == 'playlistid' && exploded[3] == 'playlist' ) return exploded[4];
if( element == 'artistid' && exploded[1] == 'artist' ) return exploded[2];
if( element == 'artistid' && exploded[3] == 'playlist' ) return exploded[2];
if( element == 'albumid' && exploded[1] == 'album' ) return exploded[2];
if( element == 'trackid' && exploded[1] == 'track' ) return exploded[2];
return null;
}
return null
return null
}
/**

4
src/js/views/Album.js
View File

@ -43,7 +43,7 @@ class Album extends React.Component{
// if mopidy has just connected AND we're a local album, go get
}else if( !this.props.mopidy_connected && nextProps.mopidy_connected ){
if( helpers.uriSource( this.props.params.uri ) == 'local' ){
if( helpers.uriSource( this.props.params.uri ) != 'spotify' ){
this.loadAlbum( nextProps )
}
}
@ -56,6 +56,7 @@ class Album extends React.Component{
if (props.album && props.album.tracks && props.album.artists_uris){
console.info('Loading album from index')
}else{
console.log(props.params.uri)
this.props.spotifyActions.getAlbum( props.params.uri );
}
break;
@ -91,6 +92,7 @@ class Album extends React.Component{
}
}
}
return (
<div className="view album-view">
<SidebarToggleButton />

2
src/js/views/Artist.js
View File

@ -40,7 +40,7 @@ class Artist extends React.Component{
if( nextProps.params.uri != this.props.params.uri ){
this.loadArtist( nextProps )
}else if( !this.props.mopidy_connected && nextProps.mopidy_connected ){
if( helpers.uriSource( this.props.params.uri ) == 'local' ){
if( helpers.uriSource( this.props.params.uri ) != 'spotify' ){
this.loadArtist( nextProps )
}
}

2
src/js/views/Playlist.js
View File

@ -33,7 +33,7 @@ class Playlist extends React.Component{
if( nextProps.params.uri != this.props.params.uri ){
this.loadPlaylist( nextProps )
}else if( !this.props.mopidy_connected && nextProps.mopidy_connected ){
if( helpers.uriSource( this.props.params.uri ) == 'm3u' ){
if( helpers.uriSource( this.props.params.uri ) != 'spotify' ){
this.loadPlaylist( nextProps )
}
}

91
src/js/views/User.js
View File

@ -42,48 +42,77 @@ class User extends React.Component{
}
render(){
if( !this.props.user ) return null
var playlists = []
if (this.props.user.playlists_uris){
for (var i = 0; i < this.props.user.playlists_uris.length; i++){
var uri = this.props.user.playlists_uris[i]
if (this.props.playlists.hasOwnProperty(uri)){
playlists.push(this.props.playlists[uri])
if (this.props.user){
var playlists = []
if (this.props.user.playlists_uris){
for (var i = 0; i < this.props.user.playlists_uris.length; i++){
var uri = this.props.user.playlists_uris[i]
if (this.props.playlists.hasOwnProperty(uri)){
playlists.push(this.props.playlists[uri])
}
}
}
}
return (
<div className="view user-view">
<Header icon="play" title="User" />
return (
<div className="view user-view">
<Header icon="play" title="User" />
<div className="intro">
<Thumbnail circle={true} size="medium" images={ this.props.user.images } />
<div className="intro">
<Thumbnail circle={true} size="medium" images={ this.props.user.images } />
<h1>{ this.props.user.display_name ? this.props.user.display_name : this.props.user.id }</h1>
<h1>{ this.props.user.display_name ? this.props.user.display_name : this.props.user.id }</h1>
<ul className="details">
{this.isMe() ? <li>You</li> : null}
<li>{this.props.user.playlists_total ? this.props.user.playlists_total.toLocaleString() : 0} playlists</li>
<li>{this.props.user.followers.total.toLocaleString()} followers</li>
</ul>
<ul className="details">
{this.isMe() ? <li>You</li> : null}
<li>{this.props.user.playlists_total ? this.props.user.playlists_total.toLocaleString() : 0} playlists</li>
<li>{this.props.user.followers.total.toLocaleString()} followers</li>
</ul>
<div className="actions">
<FollowButton className="secondary" uri={this.props.params.uri} addText="Follow" removeText="Unfollow" />
<div className="actions">
<FollowButton className="secondary" uri={this.props.params.uri} addText="Follow" removeText="Unfollow" />
</div>
</div>
<div className="main">
<section className="grid-wrapper">
<PlaylistGrid playlists={playlists} />
<LazyLoadListener enabled={this.props.user.playlists_more} loadMore={ () => this.loadMore() }/>
</section>
</div>
</div>
<div className="main">
)
} else {
<section className="grid-wrapper">
<PlaylistGrid playlists={playlists} />
<LazyLoadListener enabled={this.props.user.playlists_more} loadMore={ () => this.loadMore() }/>
</section>
return (
<div className="view user-view">
<Header icon="play" title="User" />
<div className="intro">
<Thumbnail circle size="medium" images={[]} />
<h1><span className="playlist"></span></h1>
<ul className="details">
<li>
<span className="placeholder"></span>
</li>
</ul>
<div className="actions">
<button className="placeholder"></button>
</div>
</div>
<div className="main">
<section className="grid-wrapper">
<div className="grid">
<span className="grid-item placeholder"></span>
<span className="grid-item placeholder"></span>
<span className="grid-item placeholder"></span>
</div>
</section>
</div>
</div>
</div>
);
);
}
}
}

5
src/scss/global/_core.scss
View File

@ -141,6 +141,11 @@ button.placeholder {
width: auto;
margin: 25px 40px;
height: 10px;
@include responsive( $bp_medium ){
margin-left: 20px;
margin-right: 20px;
}
}
.grid-wrapper .placeholder {