import React, { PropTypes } from 'react'
import { connect } from 'react-redux'
import { bindActionCreators } from 'redux'
import FontAwesome from 'react-fontawesome'
import TrackList from '../components/TrackList'
import Track from '../components/Track'
import Player from '../components/Player'
import ArtistSentence from '../components/ArtistSentence'
import AlbumLink from '../components/AlbumLink'
import Header from '../components/Header'
import * as actions from '../services/mopidy/actions'
class Queue extends React.Component{
constructor(props) {
super(props);
}
renderTrackInFocus(){
if( this.props.mopidy && this.props.mopidy.trackInFocus ){
return (
{ this.props.mopidy.trackInFocus.track.name }
);
}
return null;
}
renderTrackList(){
if( this.props.mopidy && this.props.mopidy.tracks ){
return (
this.removeTracks( tracks ) }
playTracks={ null }
playTrack={ track => this.playTrack( track ) }
/>
);
}
return null;
}
removeTracks( tracks ){
var tlids = [];
for( var i = 0; i < tracks.length; i++ ){
tlids.push( tracks[i].tlid )
}
this.props.actions.removeTracks( tlids )
}
playTrack( track ){
this.props.actions.changeTrack( track.tlid )
}
render(){
return (
{ this.renderTrackInFocus() }
{ this.renderTrackList() }
);
}
}
/**
* Export our component
*
* We also integrate our global store, using connect()
**/
const mapStateToProps = (state, ownProps) => {
return state;
}
const mapDispatchToProps = (dispatch) => {
return {
actions: bindActionCreators(actions, dispatch)
}
}
export default connect(mapStateToProps, mapDispatchToProps)(Queue)