Auto eslint fix
This commit is contained in:
James Barnsley
@ -11,145 +11,151 @@ import * as pusherActions from '../../services/pusher/actions';
|
||||
import * as mopidyActions from '../../services/mopidy/actions';
|
||||
import * as helpers from '../../helpers';
|
||||
|
||||
class InitialSetup extends React.Component{
|
||||
constructor(props){
|
||||
super(props);
|
||||
class InitialSetup extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
||||
this.state = {
|
||||
username: this.props.username,
|
||||
allow_reporting: this.props.allow_reporting,
|
||||
host: this.props.host,
|
||||
port: this.props.port
|
||||
}
|
||||
}
|
||||
this.state = {
|
||||
username: this.props.username,
|
||||
allow_reporting: this.props.allow_reporting,
|
||||
host: this.props.host,
|
||||
port: this.props.port,
|
||||
};
|
||||
}
|
||||
|
||||
componentDidMount(){
|
||||
this.props.uiActions.setWindowTitle("Welcome to Iris");
|
||||
}
|
||||
componentDidMount() {
|
||||
this.props.uiActions.setWindowTitle('Welcome to Iris');
|
||||
}
|
||||
|
||||
handleSubmit(e){
|
||||
e.preventDefault();
|
||||
var self = this;
|
||||
handleSubmit(e) {
|
||||
e.preventDefault();
|
||||
const self = this;
|
||||
|
||||
// Only if we've changed the username do we set it
|
||||
if (this.props.username !== this.state.username){
|
||||
this.props.pusherActions.setUsername(this.state.username);
|
||||
}
|
||||
// Only if we've changed the username do we set it
|
||||
if (this.props.username !== this.state.username) {
|
||||
this.props.pusherActions.setUsername(this.state.username);
|
||||
}
|
||||
|
||||
this.props.uiActions.set({
|
||||
initial_setup_complete: true,
|
||||
allow_reporting: this.state.allow_reporting
|
||||
});
|
||||
this.props.uiActions.set({
|
||||
initial_setup_complete: true,
|
||||
allow_reporting: this.state.allow_reporting,
|
||||
});
|
||||
|
||||
this.props.mopidyActions.set({
|
||||
host: this.state.host,
|
||||
port: this.state.port
|
||||
});
|
||||
this.props.mopidyActions.set({
|
||||
host: this.state.host,
|
||||
port: this.state.port,
|
||||
});
|
||||
|
||||
this.setState({saving: true});
|
||||
this.setState({ saving: true });
|
||||
|
||||
// Wait a jiffy to allow changes to apply to store
|
||||
setTimeout(() => {
|
||||
// Wait a jiffy to allow changes to apply to store
|
||||
setTimeout(() => {
|
||||
// We've changed a connection setting, so need to reload
|
||||
if (self.state.host !== self.props.host || self.state.port !== self.props.port) {
|
||||
window.location = '/';
|
||||
|
||||
// We've changed a connection setting, so need to reload
|
||||
if (self.state.host !== self.props.host || self.state.port !== self.props.port){
|
||||
window.location = '/';
|
||||
// Safe to just close modal
|
||||
} else {
|
||||
self.props.history.push('/');
|
||||
}
|
||||
},
|
||||
200);
|
||||
|
||||
// Safe to just close modal
|
||||
} else {
|
||||
self.props.history.push('/');
|
||||
}
|
||||
},
|
||||
200
|
||||
);
|
||||
return false;
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
render() {
|
||||
return (
|
||||
<Modal className="modal--initial-setup" noclose>
|
||||
<h1>Get started</h1>
|
||||
<form onSubmit={(e) => this.handleSubmit(e)}>
|
||||
|
||||
render(){
|
||||
return (
|
||||
<Modal className="modal--initial-setup" noclose>
|
||||
<h1>Get started</h1>
|
||||
<form onSubmit={(e) => this.handleSubmit(e)}>
|
||||
|
||||
<div className="field text">
|
||||
<div className="name">
|
||||
<div className="field text">
|
||||
<div className="name">
|
||||
Username
|
||||
</div>
|
||||
<div className="input">
|
||||
<input
|
||||
type="text"
|
||||
onChange={e => this.setState({username: e.target.value.replace(/\W/g, '')})}
|
||||
value={this.state.username } />
|
||||
<div className="description">
|
||||
</div>
|
||||
<div className="input">
|
||||
<input
|
||||
type="text"
|
||||
onChange={(e) => this.setState({ username: e.target.value.replace(/\W/g, '') })}
|
||||
value={this.state.username}
|
||||
/>
|
||||
<div className="description">
|
||||
A non-unique string used to identify this client (no special characters)
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="field">
|
||||
<div className="name">Host</div>
|
||||
<div className="input">
|
||||
<input
|
||||
type="text"
|
||||
onChange={ e => this.setState({host: e.target.value})}
|
||||
value={ this.state.host } />
|
||||
</div>
|
||||
</div>
|
||||
<div className="field">
|
||||
<div className="name">Port</div>
|
||||
<div className="input">
|
||||
<input
|
||||
type="text"
|
||||
onChange={ e => this.setState({port: e.target.value})}
|
||||
value={ this.state.port } />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{helpers.isHosted() ? null : <div className="field checkbox">
|
||||
<div className="input">
|
||||
<label>
|
||||
<input
|
||||
type="checkbox"
|
||||
name="allow_reporting"
|
||||
checked={ this.state.allow_reporting }
|
||||
onChange={ e => this.setState({ allow_reporting: !this.state.allow_reporting })} />
|
||||
<span className="label">
|
||||
<div className="field">
|
||||
<div className="name">Host</div>
|
||||
<div className="input">
|
||||
<input
|
||||
type="text"
|
||||
onChange={(e) => this.setState({ host: e.target.value })}
|
||||
value={this.state.host}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="field">
|
||||
<div className="name">Port</div>
|
||||
<div className="input">
|
||||
<input
|
||||
type="text"
|
||||
onChange={(e) => this.setState({ port: e.target.value })}
|
||||
value={this.state.port}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{helpers.isHosted() ? null : (
|
||||
<div className="field checkbox">
|
||||
<div className="input">
|
||||
<label>
|
||||
<input
|
||||
type="checkbox"
|
||||
name="allow_reporting"
|
||||
checked={this.state.allow_reporting}
|
||||
onChange={(e) => this.setState({ allow_reporting: !this.state.allow_reporting })}
|
||||
/>
|
||||
<span className="label">
|
||||
Allow reporting of anonymous usage statistics
|
||||
</span>
|
||||
</label>
|
||||
<p className="description">This anonymous usage data is important in identifying errors and potential features that make Iris better for everyone. Want to know more? Read the <a href="https://github.com/jaedb/Iris/wiki/Terms-of-use#privacy-policy" target="_blank">privacy policy</a>{!this.state.allow_reporting ? <span className="red-text"> Are you sure you don't want to support this?</span> : null}. </p>
|
||||
</div>
|
||||
</div>}
|
||||
</span>
|
||||
</label>
|
||||
<p className="description">
|
||||
This anonymous usage data is important in identifying errors and potential features that make Iris better for everyone. Want to know more? Read the
|
||||
<a href="https://github.com/jaedb/Iris/wiki/Terms-of-use#privacy-policy" target="_blank">privacy policy</a>
|
||||
{!this.state.allow_reporting ? <span className="red-text"> Are you sure you don't want to support this?</span> : null}
|
||||
.
|
||||
{' '}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="actions centered-text">
|
||||
<button className={"button button--primary button--large"+(this.state.saving ? " button--working" : "")} onClick={e => this.handleSubmit(e)}>
|
||||
{this.state.saving ? "Saving" : "Save"}
|
||||
</button>
|
||||
</div>
|
||||
<div className="actions centered-text">
|
||||
<button className={`button button--primary button--large${this.state.saving ? ' button--working' : ''}`} onClick={(e) => this.handleSubmit(e)}>
|
||||
{this.state.saving ? 'Saving' : 'Save'}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</form>
|
||||
</Modal>
|
||||
)
|
||||
}
|
||||
</form>
|
||||
</Modal>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
const mapStateToProps = (state, ownProps) => {
|
||||
return {
|
||||
allow_reporting: state.ui.allow_reporting,
|
||||
username: (state.pusher && state.pusher.username ? state.pusher.username : null),
|
||||
host: state.mopidy.host,
|
||||
port: state.mopidy.port
|
||||
}
|
||||
}
|
||||
const mapStateToProps = (state, ownProps) => ({
|
||||
allow_reporting: state.ui.allow_reporting,
|
||||
username: (state.pusher && state.pusher.username ? state.pusher.username : null),
|
||||
host: state.mopidy.host,
|
||||
port: state.mopidy.port,
|
||||
});
|
||||
|
||||
const mapDispatchToProps = (dispatch) => {
|
||||
return {
|
||||
coreActions: bindActionCreators(coreActions, dispatch),
|
||||
uiActions: bindActionCreators(uiActions, dispatch),
|
||||
pusherActions: bindActionCreators(pusherActions, dispatch),
|
||||
mopidyActions: bindActionCreators(mopidyActions, dispatch)
|
||||
}
|
||||
}
|
||||
const mapDispatchToProps = (dispatch) => ({
|
||||
coreActions: bindActionCreators(coreActions, dispatch),
|
||||
uiActions: bindActionCreators(uiActions, dispatch),
|
||||
pusherActions: bindActionCreators(pusherActions, dispatch),
|
||||
mopidyActions: bindActionCreators(mopidyActions, dispatch),
|
||||
});
|
||||
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(InitialSetup)
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(InitialSetup);
|
||||
|
||||
Reference in New Issue
Block a user