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

297
mopidy_iris/static/app.js
View File

@ -1721,6 +1721,7 @@
exports.getPlaylists = getPlaylists;
exports.getBrowse = getBrowse;
exports.getPlaylist = getPlaylist;
exports.getAlbum = getAlbum;
/**
* Actions and Action Creators
@ -1831,6 +1832,13 @@
data: { uri: uri }
};
}
function getAlbum(uri) {
return {
type: 'MOPIDY_ALBUM',
data: { uri: uri }
};
}
/***/ },
/* 17 */
@ -19166,6 +19174,45 @@
});
break;
case 'MOPIDY_ALBUM':
instruct(socket, store, 'library.lookup', action.data).then(function (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(function (response) {
for (var uri in response) {
if (response.hasOwnProperty(uri)) {
// find the track reference, and drop in the full track data
var getByURI = function getByURI(trackReference) {
return track.uri == trackReference.uri;
};
var track = response[uri][0];
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);
@ -19272,6 +19319,11 @@
playlist: action.data
});
case 'MOPIDY_ALBUM_LOADED':
return Object.assign({}, mopidy, {
album: action.data
});
default:
return mopidy;
}
@ -19776,6 +19828,8 @@
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var helpers = __webpack_require__(63);
var Album = function (_React$Component) {
_inherits(Album, _React$Component);
@ -19791,16 +19845,29 @@
_createClass(Album, [{
key: 'componentDidMount',
value: function componentDidMount() {
this.props.spotifyActions.getAlbum(this.props.params.uri);
this.loadAlbum();
}
// when props changed
}, {
key: 'componentWillReceiveProps',
value: function 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);
}
}
}
}, {
key: 'loadAlbum',
value: function loadAlbum() {
var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 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);
}
}
}, {
@ -19817,56 +19884,57 @@
}, {
key: 'render',
value: function render() {
if (this.props.spotify.album) {
var album = this.props.spotify.album;
return _react2.default.createElement(
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 _react2.default.createElement(
'div',
{ className: 'view album-view' },
_react2.default.createElement(
'div',
{ className: 'view album-view' },
{ className: 'intro' },
_react2.default.createElement(_Thumbnail2.default, { size: 'large', images: album.images }),
_react2.default.createElement(_ArtistGrid2.default, { artists: album.artists }),
_react2.default.createElement(
'div',
{ className: 'intro' },
_react2.default.createElement(_Thumbnail2.default, { size: 'large', images: album.images }),
_react2.default.createElement(_ArtistGrid2.default, { artists: album.artists }),
{ className: 'details' },
_react2.default.createElement(
'div',
{ className: 'details' },
_react2.default.createElement(
'div',
null,
album.tracks.total,
' tracks, ',
this.totalTime
),
_react2.default.createElement(
'div',
null,
'Released ',
_react2.default.createElement(_Dater2.default, { type: 'date', data: album.release_date })
)
null,
album.tracks.total,
' tracks, ',
this.totalTime
),
_react2.default.createElement(
'div',
null,
'Released ',
_react2.default.createElement(_Dater2.default, { type: 'date', data: album.release_date })
)
)
),
_react2.default.createElement(
'div',
{ className: 'main' },
_react2.default.createElement(
'div',
{ className: 'title' },
_react2.default.createElement(
'h1',
null,
album.name
),
_react2.default.createElement(
'h3',
null,
_react2.default.createElement(_ArtistSentence2.default, { artists: album.artists })
)
),
_react2.default.createElement(
'div',
{ className: 'main' },
_react2.default.createElement(
'div',
{ className: 'title' },
_react2.default.createElement(
'h1',
null,
album.name
),
_react2.default.createElement(
'h3',
null,
_react2.default.createElement(_ArtistSentence2.default, { artists: album.artists })
)
),
_react2.default.createElement(_TrackList2.default, { tracks: album.tracks.items })
)
);
}
return null;
_react2.default.createElement(_TrackList2.default, { tracks: album.tracks.items })
)
);
}
}]);
@ -20329,100 +20397,53 @@
this.props.mopidyActions.getPlaylist(props.params.uri);
}
}
}, {
key: 'renderSpotifyPlaylist',
value: function 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 _react2.default.createElement(
'div',
{ className: 'view playlist-view' },
_react2.default.createElement(
'div',
{ className: 'intro' },
_react2.default.createElement(_Thumbnail2.default, { size: 'large', images: playlist.images }),
_react2.default.createElement(
'div',
{ className: 'details' },
_react2.default.createElement(
'div',
null,
playlist.tracks.total,
' tracks'
)
)
),
_react2.default.createElement(
'div',
{ className: 'main' },
_react2.default.createElement(
'div',
{ className: 'title' },
_react2.default.createElement(
'h1',
null,
playlist.name
)
),
_react2.default.createElement(_TrackList2.default, { context: context, tracks: playlist.tracks.items })
)
);
}
return null;
}
}, {
key: 'renderMopidyPlaylist',
value: function renderMopidyPlaylist() {
if (this.props.mopidy.playlist) {
var playlist = this.props.mopidy.playlist;
return _react2.default.createElement(
'div',
{ className: 'view playlist-view' },
_react2.default.createElement(
'div',
{ className: 'intro' },
playlist.images ? _react2.default.createElement(_Thumbnail2.default, { size: 'large', images: playlist.images }) : null,
_react2.default.createElement(
'div',
{ className: 'details' },
_react2.default.createElement(
'div',
null,
'Last updated ',
playlist.last_modified
)
)
),
_react2.default.createElement(
'div',
{ className: 'main' },
_react2.default.createElement(
'div',
{ className: 'title' },
_react2.default.createElement(
'h1',
null,
playlist.name
)
),
_react2.default.createElement(_TrackList2.default, { tracks: playlist.tracks.items })
)
);
}
return null;
}
}, {
key: 'render',
value: function 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 _react2.default.createElement(
'div',
{ className: 'view playlist-view' },
_react2.default.createElement(
'div',
{ className: 'intro' },
playlist.images ? _react2.default.createElement(_Thumbnail2.default, { size: 'large', images: playlist.images }) : null,
_react2.default.createElement(
'div',
{ className: 'details' },
_react2.default.createElement(
'div',
null,
playlist.tracks.total,
' tracks'
),
_react2.default.createElement(
'div',
null,
'Last updated ',
playlist.last_modified
)
)
),
_react2.default.createElement(
'div',
{ className: 'main' },
_react2.default.createElement(
'div',
{ className: 'title' },
_react2.default.createElement(
'h1',
null,
playlist.name
)
),
_react2.default.createElement(_TrackList2.default, { tracks: playlist.tracks.items })
)
);
}
}]);

2
mopidy_iris/static/app.js.map
View File

File diff suppressed because one or more lines are too long

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>
)
}
}