Files
Iris/src/js/views/Queue.js

93 lines
2.1 KiB
JavaScript
Raw Normal View History

2016-10-03 14:44:27 +13:00
import React, { PropTypes } from 'react'
import { connect } from 'react-redux'
import { bindActionCreators } from 'redux'
import FontAwesome from 'react-fontawesome'
2016-10-03 15:22:15 +13:00
import TrackList from '../components/TrackList'
2016-10-03 21:21:14 +13:00
import Track from '../components/Track'
import Player from '../components/Player'
2016-10-25 21:36:33 +13:00
import ArtistSentence from '../components/ArtistSentence'
import AlbumLink from '../components/AlbumLink'
import Header from '../components/Header'
import * as actions from '../services/mopidy/actions'
2016-10-03 14:44:27 +13:00
2016-10-03 20:05:44 +13:00
class Queue extends React.Component{
2016-10-03 14:44:27 +13:00
constructor(props) {
super(props);
}
2016-10-03 21:21:14 +13:00
renderTrackInFocus(){
if( this.props.mopidy && this.props.mopidy.trackInFocus ){
return (
<div>
<div>{ this.props.mopidy.trackInFocus.track.name }</div>
2016-10-25 21:36:33 +13:00
<div><ArtistSentence artists={ this.props.mopidy.trackInFocus.track.artists } /></div>
<div><AlbumLink album={ this.props.mopidy.trackInFocus.track.album } /></div>
</div>
2016-10-03 21:21:14 +13:00
);
}
return null;
}
renderTrackList(){
2016-10-03 20:05:44 +13:00
if( this.props.mopidy && this.props.mopidy.tracks ){
2016-10-03 14:44:27 +13:00
return (
2016-10-19 14:09:34 +13:00
<TrackList
2016-10-22 19:13:06 +13:00
type="tltrack"
2016-10-19 14:09:34 +13:00
tracks={this.props.mopidy.tracks}
removeTracks={ tracks => this.removeTracks( tracks ) }
playTracks={ null }
playTrack={ track => this.playTrack( track ) }
/>
2016-10-03 14:44:27 +13:00
);
}
return null;
}
2016-10-19 14:09:34 +13:00
removeTracks( tracks ){
var tlids = [];
for( var i = 0; i < tracks.length; i++ ){
tlids.push( tracks[i].tlid )
}
this.props.actions.removeTracks( tlids )
}
playTrack( track ){
2016-10-19 14:09:34 +13:00
this.props.actions.changeTrack( track.tlid )
}
2016-10-03 14:44:27 +13:00
render(){
return (
<div>
<Header
icon="play"
title="Now playing"
/>
2016-10-03 21:21:14 +13:00
{ this.renderTrackInFocus() }
{ this.renderTrackList() }
2016-10-03 14:44:27 +13:00
</div>
);
}
}
/**
* Export our component
*
* We also integrate our global store, using connect()
**/
const mapStateToProps = (state, ownProps) => {
return state;
}
const mapDispatchToProps = (dispatch) => {
return {
2016-10-03 20:05:44 +13:00
actions: bindActionCreators(actions, dispatch)
2016-10-03 14:44:27 +13:00
}
}
2016-10-03 20:05:44 +13:00
export default connect(mapStateToProps, mapDispatchToProps)(Queue)