From eae085d2b55f1779fa9bc9cf384ccf416cee7db7 Mon Sep 17 00:00:00 2001 From: James Barnsley Date: Thu, 6 Oct 2016 09:35:42 +1300 Subject: [PATCH] Reduced actions to get/set; Mopidy set needs wrapping object/array --- src/js/actions/mopidy.js | 14 +++++++ src/js/components/Track.js | 6 ++- src/js/components/TrackList.js | 6 ++- src/js/reducers/mopidy.js | 12 +++++- src/js/services/MopidyService.js | 72 +++++++++++++++++++++++++------- 5 files changed, 91 insertions(+), 19 deletions(-) diff --git a/src/js/actions/mopidy.js b/src/js/actions/mopidy.js index 4adab8e6..53ebab5f 100755 --- a/src/js/actions/mopidy.js +++ b/src/js/actions/mopidy.js @@ -24,6 +24,20 @@ export function updateConsume( consume ){ } } +export function updateRandom( random ){ + return { + type: 'RANDOM', + random: random + } +} + +export function updateRepeat( repeat ){ + return { + type: 'REPEAT', + repeat: repeat + } +} + export function updateTlTracks( tracks ){ return { type: 'TRACKLIST', diff --git a/src/js/components/Track.js b/src/js/components/Track.js index 7dc3940f..84629839 100755 --- a/src/js/components/Track.js +++ b/src/js/components/Track.js @@ -7,7 +7,11 @@ export default class Track extends React.Component{ super(props); } + handleClick( e ){ + console.log('Track clicked', this.props.track.name) + } + render(){ - return
#{this.props.track.uri}: {this.props.track.name}
+ return
this.handleClick(e)}>#{this.props.track.uri}: {this.props.track.name}
} } \ No newline at end of file diff --git a/src/js/components/TrackList.js b/src/js/components/TrackList.js index 983ec0eb..cc6b86d9 100755 --- a/src/js/components/TrackList.js +++ b/src/js/components/TrackList.js @@ -8,6 +8,10 @@ export default class TrackList extends React.Component{ super(props); } + handleClick( e ){ + console.log('Track clicked', e) + } + render(){ if( this.props.tracks ){ @@ -19,7 +23,7 @@ export default class TrackList extends React.Component{ track.track.tlid = track.tlid; track = track.track; } - return + return this.handleClick(e)} /> } ) } diff --git a/src/js/reducers/mopidy.js b/src/js/reducers/mopidy.js index f52fa120..7284b0c0 100755 --- a/src/js/reducers/mopidy.js +++ b/src/js/reducers/mopidy.js @@ -14,7 +14,17 @@ export default function reducer(mopidy = {}, action){ case 'CONSUME': return Object.assign({}, mopidy, { - consume: action.consume + consume: action.consume + }); + + case 'RANDOM': + return Object.assign({}, mopidy, { + random: action.random + }); + + case 'REPEAT': + return Object.assign({}, mopidy, { + repeat: action.repeat }); case 'TRACKLIST': diff --git a/src/js/services/MopidyService.js b/src/js/services/MopidyService.js index f70c5c06..46f0569e 100755 --- a/src/js/services/MopidyService.js +++ b/src/js/services/MopidyService.js @@ -34,10 +34,10 @@ class MopidyService extends React.Component{ this.get( 'playback', 'State' ); this.get( 'playback', 'Volume' ); this.get( 'tracklist', 'Consume' ); + this.get( 'tracklist', 'Random' ); + this.get( 'tracklist', 'Repeat' ); this.get( 'tracklist', 'TlTracks' ); this.get( 'playback', 'CurrentTlTrack' ); - //this.getShuffle(); - //this.getRandom(); break; case 'state:offline': @@ -61,8 +61,8 @@ class MopidyService extends React.Component{ case 'event:optionsChanged': this.get( 'tracklist', 'Consume' ); - //this.getShuffle(); - //this.getRandom(); + this.get( 'tracklist', 'Random' ); + this.get( 'tracklist', 'Repeat' ); break; default: @@ -70,24 +70,52 @@ class MopidyService extends React.Component{ } } + + /** + * Get something from Mopidy + * + * Sends request to Mopidy server, and updates our local storage on return + * @param string model Mopidy model (playback, tracklist, etc) + * @param string property the property to get (TlTracks, Consume, etc) + **/ get( model, property ){ - console.log('MopidyServie: getting '+model+'.'+property); + console.log('MopidyServie: '+model+'.get'+property); let self = this; this.connection[model]['get'+property]() - .then( function( response ){ - self.props.actions['update'+property]( response ); - }); + .then( + function( response ){ + self.props.actions['update'+property]( response ); + }, + function( error ){ + console.error( error ); + } + ); } - set( model, property ){ - console.log('MopidyServie: setting '+model+'.'+property); + + /** + * Set something in Mopidy + * + * Sends request to Mopidy server, and updates our local storage on return + * @param string model Mopidy model (playback, tracklist, etc) + * @param string property the property to get (TlTracks, Consume, etc) + * @param mixed value + **/ + set( model, property, value ){ + console.log('MopidyServie: '+model+'.set'+property, value); let self = this; - this.connection[model]['get'+property]() - .then( function( response ){ - self.props.actions['update'+property]( response ); - }); + this.connection[model]['set'+property]( value ) + .then( + function( response ){ + self.props.actions['update'+property]( response ); + }, + function( error ){ + console.error( error ); + } + ); } + render(){ console.log( this.props.mopidy ); var playButton = this.connection.playback.play()}> @@ -95,9 +123,19 @@ class MopidyService extends React.Component{ playButton = this.connection.playback.pause()}> } - var consumeButton = this.connection.tracklist.setConsume(true)}>Consume + var consumeButton = this.set('tracklist', 'Consume', [true])}>Consume if( this.props.mopidy.consume ){ - consumeButton = this.connection.tracklist.setConsume(false)}>Un-Consume + consumeButton = this.set('tracklist', 'Consume', [false])}>Un-Consume + } + + var randomButton = this.set('tracklist', 'Random', [true])}>Random + if( this.props.mopidy.random ){ + randomButton = this.set('tracklist', 'Random', [false])}>Un-Random + } + + var repeatButton = this.set('tracklist', 'Repeat', [true])}>Repeat + if( this.props.mopidy.repeat ){ + repeatButton = this.set('tracklist', 'Repeat', [false])}>Un-Repeat } return ( @@ -106,6 +144,8 @@ class MopidyService extends React.Component{ this.connection.playback.previous()}> this.connection.playback.next()}> { consumeButton } + { randomButton } + { repeatButton } { this.props.mopidy.volume } );