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

Loading artwork with getImages

Browse Source
This commit is contained in:
James Barnsley
2017-01-25 08:55:18 +13:00
parent e01e444e70
commit 57c8a75df1
4 changed files with 125 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src/js/helpers.js
View File

@ -12,9 +12,17 @@ export let sizedImages = function( images ){
if( images.length <= 0 ) return sizes;
for( var i = 0; i < images.length; i++ ){
// Mopidy image object
if (typeof(images[i].__model__) !== 'undefined' && images[i].__model__ == 'Image'){
sizes.small = images[i].uri
// Mopidy image string
} else if (typeof(images[i]) == 'string'){
sizes.small = images[i]
// spotify-styled images
if( typeof(images[i].width) !== 'undefined' ){
} else if (typeof(images[i].width) !== 'undefined'){
if( images[i].width < 400 ){
sizes.small = images[i].url;
}else if( images[i].width < 800 ){
@ -26,7 +34,7 @@ export let sizedImages = function( images ){
}
// lastfm-styled images
}else if( typeof(images[i].size) !== 'undefined' ){
} else if (typeof(images[i].size) !== 'undefined'){
switch( images[i].size ){
case 'mega':
case 'extralarge':
@ -42,10 +50,6 @@ export let sizedImages = function( images ){
sizes.small = images[i]['#text']
break
}
// Mopidy-Images styled images
}else if( typeof(images[i]) == 'string' ){
sizes.small = images[i]
}
}

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

@ -547,14 +547,39 @@ const MopidyMiddleware = (function(){
case 'MOPIDY_GET_ALBUMS':
instruct( socket, store, 'library.browse', { uri: 'local:directory?type=album' } )
.then( response => {
store.dispatch({
type: 'ALBUMS_LOADED',
albums: response
});
store.dispatch({
type: 'LOCAL_ALBUMS_LOADED',
uris: helpers.asURIs(response)
});
// fetch album artwork
instruct( socket, store, 'library.getImages', { uris: helpers.asURIs(response) } )
.then(response => {
var albums = []
for (var uri in response){
if (response.hasOwnProperty(uri)){
albums.push({
uri: uri,
images: response[uri]
})
}
}
console.log(albums)
store.dispatch({
type: 'ALBUMS_LOADED',
albums: albums
});
})
})
break;

2
src/js/services/ui/reducer.js
View File

@ -198,7 +198,7 @@ export default function reducer(ui = {}, action){
for (var i = 0; i < action.albums.length; i++){
var album = action.albums[i]
if (albums[album.uri]){
artist = Object.assign({}, albums[album.uri], album)
album = Object.assign({}, albums[album.uri], album)
}
albums[album.uri] = album
}

97
src/js/views/library/LibraryLocalAlbums.js
View File

@ -3,9 +3,13 @@ import React, { PropTypes } from 'react'
import { connect } from 'react-redux'
import { bindActionCreators } from 'redux'
import AlbumGrid from '../../components/AlbumGrid'
import Header from '../../components/Header'
import DropdownField from '../../components/DropdownField'
import List from '../../components/List'
import * as helpers from '../../helpers'
import * as uiActions from '../../services/ui/actions'
import * as mopidyActions from '../../services/mopidy/actions'
import * as spotifyActions from '../../services/spotify/actions'
@ -20,17 +24,63 @@ class LibraryLocalAlbums extends React.Component{
}
componentWillReceiveProps( nextProps ){
if( !this.props.mopidy_connected && nextProps.mopidy_connected ){
if (!this.props.mopidy_connected && nextProps.mopidy_connected){
this.loadAlbums(nextProps);
}
}
loadAlbums(props = this.props){
if( props.mopidy_connected ){
if (props.mopidy_connected && !this.props.local_albums){
this.props.mopidyActions.getAlbums();
}
}
setSort(value){
var reverse = false
if( this.props.sort == value ) reverse = !this.props.sort_reverse
var data = {
library_local_albums_sort_reverse: reverse,
library_local_albums_sort: value
}
this.props.uiActions.set(data)
}
renderView(albums){
if( this.props.view == 'list' ){
var columns = [
{
label: 'Name',
name: 'name',
width: 40
},
{
label: 'Artists',
name: 'artists',
width: 30
},
{
label: 'Tracks',
name: 'tracks_total',
width: 15
}
]
return (
<section className="list-wrapper">
<List columns={columns} rows={albums} link_prefix={global.baseURL+"album/"} />
</section>
)
}else{
return (
<section className="grid-wrapper">
<AlbumGrid albums={albums} />
</section>
)
}
}
render(){
var albums = []
if (this.props.albums && this.props.local_albums){
@ -40,16 +90,43 @@ class LibraryLocalAlbums extends React.Component{
albums.push(this.props.albums[uri])
}
}
if( this.props.sort ){
albums = helpers.sortItems(albums, this.props.sort, this.props.sort_reverse)
}
}
var view_options = [
{
value: 'thumbnails',
label: 'Thumbnails'
},
{
value: 'list',
label: 'List'
}
]
var sort_options = [
{
value: 'name',
label: 'Name'
}
]
var actions = (
<span>
<DropdownField icon="sort" name="Sort" value={this.props.sort} options={sort_options} reverse={this.props.sort_reverse} handleChange={val => this.setSort(val)} />
<DropdownField icon="eye" name="View" value={this.props.view} options={view_options} handleChange={val => this.props.uiActions.set({ library_local_albums_view: val })} />
</span>
)
return (
<div className="view library-local-view">
<Header icon="music" title="Local albums" />
<div>
<List columns={[{ name: 'name', width: '100'}]} rows={albums} link_prefix={global.baseURL+"album/"} />
</div>
<Header icon="music" title="Local albums" actions={actions} />
{this.renderView(albums)}
</div>
);
)
}
}
@ -63,13 +140,17 @@ class LibraryLocalAlbums extends React.Component{
const mapStateToProps = (state, ownProps) => {
return {
mopidy_connected: state.mopidy.connected,
albums: state.ui.albums,
local_albums: state.ui.local_albums,
albums: state.ui.albums
view: state.ui.library_local_albums_view,
sort: state.ui.library_local_albums_sort,
sort_reverse: state.ui.library_local_albums_sort_reverse
}
}
const mapDispatchToProps = (dispatch) => {
return {
uiActions: bindActionCreators(uiActions, dispatch),
mopidyActions: bindActionCreators(mopidyActions, dispatch),
spotifyActions: bindActionCreators(spotifyActions, dispatch)
}