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

Pusher username management; Spotify vs mopidy middleware glitching

Browse Source
This commit is contained in:
James Barnsley
2016-10-28 09:14:29 +13:00
parent 7be39dc4d4
commit 696e385b7e
10 changed files with 199 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

70
src/js/views/Settings.js
View File

@ -6,8 +6,10 @@ import { bindActionCreators } from 'redux'
import FontAwesome from 'react-fontawesome'
import SpotifyAuthenticationFrame from '../components/SpotifyAuthenticationFrame'
import ConfirmationButton from '../components/ConfirmationButton'
import PusherConnectionList from '../components/PusherConnectionList'
import Header from '../components/Header'
import * as pusherActions from '../services/pusher/actions'
import * as mopidyActions from '../services/mopidy/actions'
import * as spotifyActions from '../services/spotify/actions'
@ -15,16 +17,27 @@ class Settings extends React.Component{
constructor(props) {
super(props);
this.state = {
mopidy_host: this.props.mopidy.host,
mopidy_port: this.props.mopidy.port,
pusher_username: '',
pusher_port: this.props.pusher.port,
spotify_country: this.props.spotify.country,
spotify_locale: this.props.spotify.locale
};
}
componentWillReceiveProps( newProps ){
if( this.props.pusher.connectionid != newProps.pusher.connectionid ){
function isCurrentConnection(connection){
return connection.connectionid == newProps.pusher.connectionid;
}
var currentConnection = newProps.pusher.connections.find(isCurrentConnection);
this.setState({ pusher_username: currentConnection.username })
}
}
resetAllSettings(){
localStorage.clear();
window.location.reload(true);
@ -35,12 +48,13 @@ class Settings extends React.Component{
window.location.reload(true);
}
setSpotifyConfig(){
this.props.spotifyActions.setConfig({ country: this.state.spotify_country, locale: this.state.spotify_locale });
}
setPusherConfig(){
this.props.pusherActions.setConfig({ port: this.state.pusher_port });
this.props.pusherActions.setUsername( this.state.pusher_username );
}
setSpotifyConfig(){
this.props.spotifyActions.setConfig({ country: this.state.spotify_country, locale: this.state.spotify_locale });
}
render(){
@ -56,18 +70,22 @@ class Settings extends React.Component{
<h3 className="underline">Mopidy</h3>
<form onSubmit={() => this.setMopidyConfig()}>
<label>
<span className="label">Host</span>
<div className="label">Host</div>
<div className="input">
<input
type="text"
onChange={ e => this.setState({ mopidy_host: e.target.value })}
value={ this.state.mopidy_host } />
</div>
</label>
<label>
<span className="label">Port</span>
<div className="label">Port</div>
<div className="input">
<input
type="text"
onChange={ e => this.setState({ mopidy_port: e.target.value })}
value={ this.state.mopidy_port } />
</div>
</label>
<button type="submit" className="secondary">Apply</button>
</form>
@ -75,11 +93,22 @@ class Settings extends React.Component{
<h3 className="underline">Pusher</h3>
<form onSubmit={() => this.setPusherConfig()}>
<label>
<span className="label">Port</span>
<div className="label">Username</div>
<div className="input">
<input
type="text"
onChange={ e => this.setState({ pusher_username: e.target.value })}
value={ this.state.pusher_username } />
</div>
</label>
<label>
<div className="label">Port</div>
<div className="input">
<input
type="text"
onChange={ e => this.setState({ pusher_port: e.target.value })}
value={ this.state.pusher_port } />
</div>
</label>
<button type="submit" className="secondary">Apply</button>
</form>
@ -87,18 +116,22 @@ class Settings extends React.Component{
<h3 className="underline">Spotify</h3>
<form onSubmit={() => this.setSpotifyConfig()}>
<label>
<span className="label">Country</span>
<div className="label">Country</div>
<div className="input">
<input
type="text"
onChange={ e => this.setState({ spotify_country: e.target.value })}
value={ this.state.spotify_country } />
</div>
</label>
<label>
<span className="label">Locale</span>
<input
type="text"
onChange={ e => this.setState({ spotify_locale: e.target.value })}
value={ this.state.spotify_locale } />
<div className="label">Locale</div>
<div className="input">
<input
type="text"
onChange={ e => this.setState({ spotify_locale: e.target.value })}
value={ this.state.spotify_locale } />
</div>
</label>
<button type="submit" className="secondary">Apply</button>
</form>
@ -107,6 +140,14 @@ class Settings extends React.Component{
<ConfirmationButton content="Reset all settings" confirmingContent="Are you sure?" onConfirm={() => this.resetAllSettings()} />
<h3 className="underline">Advanced</h3>
<label>
<div className="label">Connections</div>
<div className="input">
<PusherConnectionList />
</div>
</label>
</section>
</div>
);
@ -126,6 +167,7 @@ const mapStateToProps = (state, ownProps) => {
const mapDispatchToProps = (dispatch) => {
return {
pusherActions: bindActionCreators(pusherActions, dispatch),
mopidyActions: bindActionCreators(mopidyActions, dispatch),
spotifyActions: bindActionCreators(spotifyActions, dispatch)
}