diff --git a/package.json b/package.json index 1e1e044e..f5cd7848 100755 --- a/package.json +++ b/package.json @@ -1,7 +1,8 @@ { "name": "iris", "version": "1.0.0", - "description": "", + "description": "Mopidy HTTP interface", + "repository": "https://github.com/jaedb/iris", "main": "app.js", "dependencies": { "babel": "^5.8.29", @@ -17,6 +18,7 @@ "redux": "*", "react-redux": "*", "redux-devtools": "*", + "redux-thunk": "*", "webpack": "^1.13.2", "webpack-strip": "*", "node-sass": "*", diff --git a/src/js/actions/mopidy.js b/src/js/actions/mopidy.js index 53ebab5f..a4f49050 100755 --- a/src/js/actions/mopidy.js +++ b/src/js/actions/mopidy.js @@ -57,4 +57,12 @@ export function updateVolume( volume ){ type: 'VOLUME', volume: volume } -} \ No newline at end of file +} + +export function changeTrack( tlid ){ + return { + type: 'CHANGE_TRACK', + tlid: tlid + } +} + diff --git a/src/js/components/App.js b/src/js/components/App.js index 6b8ba4b2..a57152d2 100755 --- a/src/js/components/App.js +++ b/src/js/components/App.js @@ -1,8 +1,4 @@ -/** - * Root level application - **/ - import React, { PropTypes } from 'react'; import ReactDOM from 'react-dom'; import { createStore, bindActionCreators } from 'redux' @@ -14,26 +10,13 @@ import Services from '../services/Services' import MopidyService from '../services/MopidyService' +/** + * Root level application + **/ class App extends React.Component{ constructor(props){ super(props); - this.handleClick = this.handleClick.bind(this); - } - - handleClick(){ - console.log('click'); - //this.props.providerActions.authorizeSpotify(); - Services.get('services.mopidy') - .then( function(MopidyService){ - MopidyService.connection.playback.getState() - .then( function(state){ - console.log('App.js > playback state', state); - }); - }) - } - - componentDidMount(){ } render(){ diff --git a/src/js/components/Queue.js b/src/js/components/Queue.js index 1f668418..30c6e21e 100755 --- a/src/js/components/Queue.js +++ b/src/js/components/Queue.js @@ -14,10 +14,6 @@ class Queue extends React.Component{ super(props); } - componentDidMount(){ - console.log('mounted'); - } - renderTrackInFocus(){ if( this.props.mopidy && this.props.mopidy.trackInFocus ){ return ( diff --git a/src/js/components/TrackList.js b/src/js/components/TrackList.js index f36bbcff..1c5767bf 100755 --- a/src/js/components/TrackList.js +++ b/src/js/components/TrackList.js @@ -1,8 +1,13 @@ import React, { PropTypes } from 'react' -import Track from './Track' +import { connect } from 'react-redux' +import { bindActionCreators } from 'redux' +import * as actions from '../actions/mopidy' -export default class TrackList extends React.Component{ +import Track from './Track' +import MopidyService from '../services/MopidyService' + +class TrackList extends React.Component{ constructor(props) { super(props); @@ -21,6 +26,7 @@ export default class TrackList extends React.Component{ playTrack( index ){ var tracks = this.state.tracks; console.log('playTrack', tracks[index].tlid) + this.props.actions.changeTrack( index ) } componentWillReceiveProps( nextProps ){ @@ -57,4 +63,23 @@ export default class TrackList extends React.Component{ } return null; } -} \ No newline at end of file +} + + +/** + * 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)(TrackList) \ No newline at end of file diff --git a/src/js/reducers/mopidy.js b/src/js/reducers/mopidy.js index 7284b0c0..e74a3d82 100755 --- a/src/js/reducers/mopidy.js +++ b/src/js/reducers/mopidy.js @@ -40,7 +40,12 @@ export default function reducer(mopidy = {}, action){ case 'VOLUME': return Object.assign({}, mopidy, { - volume: action.volume + volume: action.volume + }); + + case 'CHANGE_TRACK': + return Object.assign({}, mopidy, { + tlid: action.tlid }); default: diff --git a/src/js/services/MopidyService.js b/src/js/services/MopidyService.js index 46f0569e..6d0446dc 100755 --- a/src/js/services/MopidyService.js +++ b/src/js/services/MopidyService.js @@ -79,7 +79,7 @@ class MopidyService extends React.Component{ * @param string property the property to get (TlTracks, Consume, etc) **/ get( model, property ){ - console.log('MopidyServie: '+model+'.get'+property); + console.log('MopidyService: '+model+'.get'+property); let self = this; this.connection[model]['get'+property]() .then( @@ -115,6 +115,10 @@ class MopidyService extends React.Component{ ); } + changeTlTrack( tlid ){ + console.log('Changing track to '+ tlid) + } + render(){ console.log( this.props.mopidy );