kopia lustrzana https://github.com/OpenDroneMap/WebODM
116 wiersze
3.9 KiB
JavaScript
116 wiersze
3.9 KiB
JavaScript
import React from 'react';
|
|
import './Login.scss';
|
|
import ErrorMessage from 'webodm/components/ErrorMessage';
|
|
import PropTypes from 'prop-types';
|
|
import $ from 'jquery';
|
|
|
|
export default class Login extends React.Component {
|
|
static defaultProps = {
|
|
};
|
|
static propTypes = {
|
|
onLogin: PropTypes.func.isRequired
|
|
}
|
|
|
|
constructor(props){
|
|
super(props);
|
|
|
|
this.state = {
|
|
error: "",
|
|
loggingIn: false,
|
|
email: "",
|
|
password: ""
|
|
}
|
|
}
|
|
|
|
handleEmailChange = (e) => {
|
|
this.setState({email: e.target.value});
|
|
}
|
|
|
|
handlePasswordChange = (e) => {
|
|
this.setState({password: e.target.value});
|
|
}
|
|
|
|
handleLogin = () => {
|
|
this.setState({loggingIn: true});
|
|
|
|
$.post("https://webodm.net/r/auth/login",
|
|
{
|
|
username: this.state.email,
|
|
password: this.state.password
|
|
}
|
|
).done(json => {
|
|
if (json.api_key){
|
|
this.saveApiKey(json.api_key, (err) => {
|
|
this.setState({loggingIn: false});
|
|
|
|
if (!err){
|
|
this.props.onLogin(json.api_key);
|
|
}else{
|
|
this.setState({ error: err.message });
|
|
}
|
|
});
|
|
}else if (json.message){
|
|
this.setState({ loggingIn: false, error: json.message });
|
|
}else{
|
|
this.setState({ loggingIn: false, error: "Cannot login. Invalid response: " + JSON.stringify(json)});
|
|
}
|
|
})
|
|
.fail(() => {
|
|
this.setState({loggingIn: false, error: "Cannot login. Please make sure you are connected to the internet, or try again in an hour."});
|
|
});
|
|
}
|
|
|
|
handleKeyPress = (e) => {
|
|
if (e.key === 'Enter'){
|
|
this.handleLogin();
|
|
}
|
|
}
|
|
|
|
saveApiKey = (api_key, cb) => {
|
|
$.post("save_api_key", {
|
|
api_key: api_key
|
|
}).done(json => {
|
|
if (!json.success){
|
|
cb(new Error(`Cannot save API key: ${JSON.stringify(json)}`));
|
|
}else cb();
|
|
}).fail(e => {
|
|
cb(new Error(`Cannot save API key: ${JSON.stringify(e)}`));
|
|
});
|
|
}
|
|
|
|
render(){
|
|
return (<div className="lightning-login">
|
|
<div className="row">
|
|
<div className="col-md-6 col-md-offset-3 col-sm-12">
|
|
<ErrorMessage bind={[this, "error"]} />
|
|
<div className="form-group text-left">
|
|
<input id="next" name="next" type="hidden" value="" />
|
|
<p>
|
|
<label htmlFor="email">E-mail Address</label>
|
|
<input className="form-control" id="email" name="email" required=""
|
|
type="text" value={this.state.email}
|
|
onChange={this.handleEmailChange}
|
|
onKeyPress={this.handleKeyPress} />
|
|
</p>
|
|
<p>
|
|
<label htmlFor="password">Password</label>
|
|
<input className="form-control" id="password" name="password" required=""
|
|
type="password" value={this.state.password}
|
|
onChange={this.handlePasswordChange}
|
|
onKeyPress={this.handleKeyPress} />
|
|
</p>
|
|
<div style={{float: 'right'}} >
|
|
<a href="https://webodm.net/register" target="_blank">Don't have an account?</a><br/>
|
|
<a href="https://webodm.net/reset" target="_blank">Forgot password?</a>
|
|
</div>
|
|
<p><button className="btn btn-primary" onClick={this.handleLogin} disabled={this.state.loggingIn}>
|
|
{this.state.loggingIn ?
|
|
<span><i className="fa fa-spin fa-circle-notch"></i></span> :
|
|
<span><i className="fa fa-lock"></i> Login and Sync</span>}
|
|
</button></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>);
|
|
}
|
|
} |