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

Local artist

Browse Source
This commit is contained in:
James Barnsley
2016-11-01 13:19:51 +13:00
parent 569121c71d
commit 5ccd9b48a0
7 changed files with 273 additions and 218 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src/js/services/mopidy/actions.js
View File

@ -110,3 +110,10 @@ export function getPlaylist( uri ){
}
}
export function getAlbum( uri ){
return {
type: 'MOPIDY_ALBUM',
data: { uri: uri }
}
}

41
src/js/services/mopidy/middleware.js
View File

@ -195,6 +195,47 @@ const MopidyMiddleware = (function(){
})
break;
case 'MOPIDY_ALBUM':
instruct( socket, store, 'library.lookup', action.data )
.then( response => {
var album = response[0].album;
album.tracks = {
items: response,
total: response.length
}
var uris = [];
for( var i = 0; i < album.tracks.items.length; i++ ){
uris.push( album.tracks.items[i].uri );
}
instruct( socket, store, 'library.lookup', { uris: uris } )
.then( response => {
for(var uri in response){
if (response.hasOwnProperty(uri)) {
var track = response[uri][0];
// find the track reference, and drop in the full track data
function getByURI( trackReference ){
return track.uri == trackReference.uri
}
var trackReferences = album.tracks.items.filter(getByURI);
// there could be multiple instances of this track, so accommodate this
for( var j = 0; j < trackReferences.length; j++){
var key = album.tracks.items.indexOf( trackReferences[j] );
album.tracks.items[ key ] = track;
}
}
}
store.dispatch({ type: 'MOPIDY_ALBUM_LOADED', data: album });
})
})
break;
// This action is irrelevant to us, pass it on to the next middleware
default:
return next(action);

5
src/js/services/mopidy/reducer.js
View File

@ -82,6 +82,11 @@ export default function reducer(mopidy = {}, action){
playlist: action.data
});
case 'MOPIDY_ALBUM_LOADED':
return Object.assign({}, mopidy, {
album: action.data
});
default:
return mopidy
}

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

@ -2,6 +2,7 @@
import React, { PropTypes } from 'react'
import { connect } from 'react-redux'
import { bindActionCreators } from 'redux'
let helpers = require('../helpers.js')
import TrackList from '../components/TrackList'
import Thumbnail from '../components/Thumbnail'
@ -21,13 +22,25 @@ class Album extends React.Component{
// on render
componentDidMount(){
this.props.spotifyActions.getAlbum( this.props.params.uri );
this.loadAlbum();
}
// when props changed
componentWillReceiveProps( nextProps ){
if( nextProps.params.uri != this.props.params.uri ){
this.props.spotifyActions.getAlbum( nextProps.params.uri );
this.loadAlbum( nextProps )
}else if( !this.props.mopidy.connected && nextProps.mopidy.connected ){
if( helpers.uriSource( this.props.params.uri ) == 'local' ){
this.loadAlbum( nextProps )
}
}
}
loadAlbum( props = this.props ){
var source = helpers.uriSource( props.params.uri );
if( source == 'spotify' ){
this.props.spotifyActions.getAlbum( props.params.uri );
}else if( source == 'local' && props.mopidy.connected ){
this.props.mopidyActions.getAlbum( props.params.uri );
}
}
@ -42,29 +55,30 @@ class Album extends React.Component{
}
render(){
if( this.props.spotify.album ){
var album = this.props.spotify.album;
return (
<div className="view album-view">
<div className="intro">
<Thumbnail size="large" images={ album.images } />
<ArtistGrid artists={ album.artists } />
<div className="details">
<div>{ album.tracks.total } tracks, { this.totalTime }</div>
<div>Released <Dater type="date" data={ album.release_date } /></div>
</div>
</div>
<div className="main">
<div className="title">
<h1>{ album.name }</h1>
<h3><ArtistSentence artists={ album.artists } /></h3>
</div>
<TrackList tracks={ album.tracks.items } />
var source = helpers.uriSource( this.props.params.uri );
if( source == 'spotify' ) var album = this.props.spotify.album
if( source == 'local' ) var album = this.props.mopidy.album
if( !album ) return null;
return (
<div className="view album-view">
<div className="intro">
<Thumbnail size="large" images={ album.images } />
<ArtistGrid artists={ album.artists } />
<div className="details">
<div>{ album.tracks.total } tracks, { this.totalTime }</div>
<div>Released <Dater type="date" data={ album.release_date } /></div>
</div>
</div>
);
}
return null;
<div className="main">
<div className="title">
<h1>{ album.name }</h1>
<h3><ArtistSentence artists={ album.artists } /></h3>
</div>
<TrackList tracks={ album.tracks.items } />
</div>
</div>
);
}
}

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

@ -2,6 +2,7 @@
import React, { PropTypes } from 'react'
import { connect } from 'react-redux'
import { bindActionCreators } from 'redux'
let helpers = require('../helpers.js')
import TrackList from '../components/TrackList'
import Thumbnail from '../components/Thumbnail'
@ -9,7 +10,6 @@ import Dater from '../components/Dater'
import * as spotifyActions from '../services/spotify/actions'
import * as mopidyActions from '../services/mopidy/actions'
let helpers = require('../helpers.js')
class Playlist extends React.Component{
@ -40,62 +40,29 @@ class Playlist extends React.Component{
}
}
renderSpotifyPlaylist(){
if( this.props.spotify.playlist ){
var playlist = this.props.spotify.playlist;
var context = null;
if( playlist.owner.id == this.props.spotify.me.id ) context = 'editable-playlist'
return (
<div className="view playlist-view">
<div className="intro">
<Thumbnail size="large" images={ playlist.images } />
<div className="details">
<div>{ playlist.tracks.total } tracks</div>
</div>
</div>
<div className="main">
<div className="title">
<h1>{ playlist.name }</h1>
</div>
<TrackList context={context} tracks={ playlist.tracks.items } />
</div>
</div>
);
}
return null;
}
renderMopidyPlaylist(){
if( this.props.mopidy.playlist ){
var playlist = this.props.mopidy.playlist;
return (
<div className="view playlist-view">
<div className="intro">
{ playlist.images ? <Thumbnail size="large" images={ playlist.images } /> : null }
<div className="details">
<div>Last updated { playlist.last_modified }</div>
</div>
</div>
<div className="main">
<div className="title">
<h1>{ playlist.name }</h1>
</div>
<TrackList tracks={ playlist.tracks.items } />
</div>
</div>
);
}
return null;
}
render(){
var source = helpers.uriSource( this.props.params.uri );
if( source == 'spotify' ) return this.renderSpotifyPlaylist();
if( source == 'm3u' ) return this.renderMopidyPlaylist();
return null;
if( source == 'spotify' ) var playlist = this.props.spotify.playlist
if( source == 'm3u' ) var playlist = this.props.mopidy.playlist
if( !playlist ) return null;
return (
<div className="view playlist-view">
<div className="intro">
{ playlist.images ? <Thumbnail size="large" images={ playlist.images } /> : null }
<div className="details">
<div>{ playlist.tracks.total } tracks</div>
<div>Last updated { playlist.last_modified }</div>
</div>
</div>
<div className="main">
<div className="title">
<h1>{ playlist.name }</h1>
</div>
<TrackList tracks={ playlist.tracks.items } />
</div>
</div>
)
}
}