Adding a math check for logins (until we get a proper captcha).

This commit is contained in:
Dessalines 2020-07-01 21:48:29 -04:00
parent 8d49dc958e
commit d22152eefd
2 changed files with 49 additions and 3 deletions

View file

@ -20,6 +20,11 @@ interface State {
loginLoading: boolean;
registerLoading: boolean;
enable_nsfw: boolean;
mathQuestion: {
a: number;
b: number;
answer: number;
};
}
export class Login extends Component<any, State> {
@ -40,6 +45,11 @@ export class Login extends Component<any, State> {
loginLoading: false,
registerLoading: false,
enable_nsfw: undefined,
mathQuestion: {
a: Math.floor(Math.random() * 10) + 1,
b: Math.floor(Math.random() * 10) + 1,
answer: undefined,
},
};
constructor(props: any, context: any) {
@ -215,6 +225,23 @@ export class Login extends Component<any, State> {
/>
</div>
</div>
<div class="form-group row">
<label class="col-sm-10 col-form-label" htmlFor="register-math">
{i18n.t('what_is')}{' '}
{`${this.state.mathQuestion.a} + ${this.state.mathQuestion.b}?`}
</label>
<div class="col-sm-2">
<input
type="number"
id="register-math"
class="form-control"
value={this.state.mathQuestion.answer}
onInput={linkEvent(this, this.handleMathAnswerChange)}
required
/>
</div>
</div>
{this.state.enable_nsfw && (
<div class="form-group row">
<div class="col-sm-10">
@ -235,7 +262,11 @@ export class Login extends Component<any, State> {
)}
<div class="form-group row">
<div class="col-sm-10">
<button type="submit" class="btn btn-secondary">
<button
type="submit"
class="btn btn-secondary"
disabled={this.mathCheck}
>
{this.state.registerLoading ? (
<svg class="icon icon-spinner spin">
<use xlinkHref="#icon-spinner"></use>
@ -272,8 +303,10 @@ export class Login extends Component<any, State> {
i.state.registerLoading = true;
i.setState(i.state);
if (!i.mathCheck) {
WebSocketService.Instance.register(i.state.registerForm);
}
}
handleRegisterUsernameChange(i: Login, event: any) {
i.state.registerForm.username = event.target.value;
@ -303,6 +336,11 @@ export class Login extends Component<any, State> {
i.setState(i.state);
}
handleMathAnswerChange(i: Login, event: any) {
i.state.mathQuestion.answer = event.target.value;
i.setState(i.state);
}
handlePasswordReset(i: Login) {
event.preventDefault();
let resetForm: PasswordResetForm = {
@ -311,6 +349,13 @@ export class Login extends Component<any, State> {
WebSocketService.Instance.passwordReset(resetForm);
}
get mathCheck(): boolean {
return (
this.state.mathQuestion.answer !=
this.state.mathQuestion.a + this.state.mathQuestion.b
);
}
parseMessage(msg: WebSocketJsonResponse) {
let res = wsJsonToRes(msg);
if (msg.error) {

View file

@ -264,5 +264,6 @@
"time": "Time",
"action": "Action",
"emoji_picker": "Emoji Picker",
"block_leaving": "Are you sure you want to leave?"
"block_leaving": "Are you sure you want to leave?",
"what_is": "What is"
}