Add support for draft/account-registration
A new UI to register and verify accounts is added.
This commit is contained in:
parent
b1d5f1436e
commit
be08302c1f
6 changed files with 278 additions and 13 deletions
54
components/register-form.js
Normal file
54
components/register-form.js
Normal file
|
@ -0,0 +1,54 @@
|
|||
import { html, Component } from "../lib/index.js";
|
||||
|
||||
export default class RegisterForm extends Component {
|
||||
state = {
|
||||
email: "",
|
||||
password: "",
|
||||
};
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
||||
this.handleChange = this.handleChange.bind(this);
|
||||
this.handleSubmit = this.handleSubmit.bind(this);
|
||||
}
|
||||
|
||||
handleChange(event) {
|
||||
let target = event.target;
|
||||
let value = target.type == "checkbox" ? target.checked : target.value;
|
||||
this.setState({ [target.name]: value });
|
||||
}
|
||||
|
||||
handleSubmit(event) {
|
||||
event.preventDefault();
|
||||
|
||||
this.props.onSubmit(this.state.email, this.state.password);
|
||||
}
|
||||
|
||||
render() {
|
||||
return html`
|
||||
<form onChange=${this.handleChange} onSubmit=${this.handleSubmit}>
|
||||
<label>
|
||||
E-mail:<br/>
|
||||
<input
|
||||
type="email"
|
||||
name="email"
|
||||
value=${this.state.email}
|
||||
required=${this.props.emailRequired}
|
||||
placeholder=${this.props.emailRequired ? null : "(optional)"}
|
||||
autofocus
|
||||
/>
|
||||
</label>
|
||||
<br/><br/>
|
||||
|
||||
<label>
|
||||
Password:<br/>
|
||||
<input type="password" name="password" value=${this.state.password} required/>
|
||||
</label>
|
||||
<br/><br/>
|
||||
|
||||
<button>Register</button>
|
||||
</form>
|
||||
`;
|
||||
}
|
||||
}
|
Loading…
Add table
Add a link
Reference in a new issue