mirror of
https://github.com/monkeytypegame/monkeytype.git
synced 2025-10-26 16:57:07 +08:00
added functions to disable certain components instead of all at once
This commit is contained in:
parent
80d05a186f
commit
2fcea65d68
2 changed files with 46 additions and 24 deletions
|
|
@ -301,6 +301,8 @@ export function signIn(): void {
|
|||
authListener();
|
||||
LoginPage.showPreloader();
|
||||
LoginPage.disableInputs();
|
||||
LoginPage.disableSignUpButton();
|
||||
LoginPage.disableSignInButton();
|
||||
const email = ($(".pageLogin .login input")[0] as HTMLInputElement).value;
|
||||
const password = ($(".pageLogin .login input")[1] as HTMLInputElement).value;
|
||||
|
||||
|
|
@ -343,6 +345,8 @@ export function signIn(): void {
|
|||
Notifications.add(message, -1);
|
||||
LoginPage.hidePreloader();
|
||||
LoginPage.enableInputs();
|
||||
LoginPage.enableSignInButton();
|
||||
LoginPage.updateSignupButton();
|
||||
});
|
||||
});
|
||||
}
|
||||
|
|
@ -351,6 +355,8 @@ export async function signInWithGoogle(): Promise<void> {
|
|||
UpdateConfig.setChangedBeforeDb(false);
|
||||
LoginPage.showPreloader();
|
||||
LoginPage.disableInputs();
|
||||
LoginPage.disableSignUpButton();
|
||||
LoginPage.disableSignInButton();
|
||||
authListener();
|
||||
const persistence = $(".pageLogin .login #rememberMe input").prop("checked")
|
||||
? browserLocalPersistence
|
||||
|
|
@ -380,6 +386,8 @@ export async function signInWithGoogle(): Promise<void> {
|
|||
Notifications.add(message, -1);
|
||||
LoginPage.hidePreloader();
|
||||
LoginPage.enableInputs();
|
||||
LoginPage.enableSignInButton();
|
||||
LoginPage.updateSignupButton();
|
||||
});
|
||||
}
|
||||
|
||||
|
|
@ -509,6 +517,7 @@ export function signOut(): void {
|
|||
|
||||
async function signUp(): Promise<void> {
|
||||
LoginPage.disableInputs();
|
||||
LoginPage.disableSignUpButton();
|
||||
LoginPage.showPreloader();
|
||||
const nname = ($(".pageLogin .register input")[0] as HTMLInputElement).value;
|
||||
const email = ($(".pageLogin .register input")[1] as HTMLInputElement).value;
|
||||
|
|
@ -523,6 +532,7 @@ async function signUp(): Promise<void> {
|
|||
if (nname === "" || email === "" || emailVerify === "" || password === "") {
|
||||
LoginPage.hidePreloader();
|
||||
LoginPage.enableInputs();
|
||||
LoginPage.updateSignupButton();
|
||||
Notifications.add("Please fill in all fields", 0);
|
||||
return;
|
||||
}
|
||||
|
|
@ -534,16 +544,16 @@ async function signUp(): Promise<void> {
|
|||
) {
|
||||
Notifications.add("Invalid email", 0, 3);
|
||||
LoginPage.hidePreloader();
|
||||
$(".pageLogin .button").removeClass("disabled");
|
||||
$(".pageLogin input").prop("disabled", false);
|
||||
LoginPage.enableInputs();
|
||||
LoginPage.updateSignupButton();
|
||||
return;
|
||||
}
|
||||
|
||||
if (email !== emailVerify) {
|
||||
Notifications.add("Emails do not match", 0, 3);
|
||||
LoginPage.hidePreloader();
|
||||
$(".pageLogin .button").removeClass("disabled");
|
||||
$(".pageLogin input").prop("disabled", false);
|
||||
LoginPage.enableInputs();
|
||||
LoginPage.updateSignupButton();
|
||||
return;
|
||||
}
|
||||
|
||||
|
|
@ -551,8 +561,8 @@ async function signUp(): Promise<void> {
|
|||
if (password.length < 8) {
|
||||
Notifications.add("Password must be at least 8 characters", 0, 3);
|
||||
LoginPage.hidePreloader();
|
||||
$(".pageLogin .button").removeClass("disabled");
|
||||
$(".pageLogin input").prop("disabled", false);
|
||||
LoginPage.enableInputs();
|
||||
LoginPage.updateSignupButton();
|
||||
return;
|
||||
}
|
||||
|
||||
|
|
@ -566,16 +576,16 @@ async function signUp(): Promise<void> {
|
|||
3
|
||||
);
|
||||
LoginPage.hidePreloader();
|
||||
$(".pageLogin .button").removeClass("disabled");
|
||||
$(".pageLogin input").prop("disabled", false);
|
||||
LoginPage.enableInputs();
|
||||
LoginPage.updateSignupButton();
|
||||
return;
|
||||
}
|
||||
|
||||
if (password !== passwordVerify) {
|
||||
Notifications.add("Passwords do not match", 0, 3);
|
||||
LoginPage.hidePreloader();
|
||||
$(".pageLogin .button").removeClass("disabled");
|
||||
$(".pageLogin input").prop("disabled", false);
|
||||
LoginPage.enableInputs();
|
||||
LoginPage.updateSignupButton();
|
||||
return;
|
||||
}
|
||||
|
||||
|
|
@ -634,8 +644,8 @@ async function signUp(): Promise<void> {
|
|||
const message = Misc.createErrorMessage(e, "Failed to create account");
|
||||
Notifications.add(message, -1);
|
||||
LoginPage.hidePreloader();
|
||||
$(".pageLogin .button").removeClass("disabled");
|
||||
$(".pageLogin input").prop("disabled", false);
|
||||
LoginPage.enableInputs();
|
||||
LoginPage.updateSignupButton();
|
||||
signOut();
|
||||
return;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -4,13 +4,27 @@ import Page from "./page";
|
|||
import * as Notifications from "../elements/notifications";
|
||||
import { InputIndicator } from "../elements/input-indicator";
|
||||
|
||||
export function enableSignUpButton(): void {
|
||||
$(".page.pageLogin .register.side .button").removeClass("disabled");
|
||||
}
|
||||
|
||||
export function disableSignUpButton(): void {
|
||||
$(".page.pageLogin .register.side .button").addClass("disabled");
|
||||
}
|
||||
|
||||
export function enableSignInButton(): void {
|
||||
$(".page.pageLogin .login.side .button").removeClass("disabled");
|
||||
}
|
||||
|
||||
export function disableSignInButton(): void {
|
||||
$(".page.pageLogin .login.side .button").addClass("disabled");
|
||||
}
|
||||
|
||||
export function enableInputs(): void {
|
||||
$(".pageLogin .button").removeClass("disabled");
|
||||
$(".pageLogin input").prop("disabled", false);
|
||||
}
|
||||
|
||||
export function disableInputs(): void {
|
||||
$(".pageLogin .button").addClass("disabled");
|
||||
$(".pageLogin input").prop("disabled", true);
|
||||
}
|
||||
|
||||
|
|
@ -22,9 +36,7 @@ export function hidePreloader(): void {
|
|||
$(".pageLogin .preloader").addClass("hidden");
|
||||
}
|
||||
|
||||
const updateSignupButton = (): void => {
|
||||
const $button = $(".page.pageLogin .register.side .button");
|
||||
|
||||
export const updateSignupButton = (): void => {
|
||||
if (
|
||||
nameIndicator.get() !== "available" ||
|
||||
emailIndicator.get() !== "valid" ||
|
||||
|
|
@ -32,9 +44,9 @@ const updateSignupButton = (): void => {
|
|||
passwordIndicator.get() !== "good" ||
|
||||
verifyPasswordIndicator.get() !== "match"
|
||||
) {
|
||||
$button.addClass("disabled");
|
||||
disableSignUpButton();
|
||||
} else {
|
||||
$button.removeClass("disabled");
|
||||
enableSignUpButton();
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -134,7 +146,7 @@ const checkPasswordsMatch = (): void => {
|
|||
};
|
||||
|
||||
const nameIndicator = new InputIndicator(
|
||||
$(".page.pageLogin .register.side .username.inputAndIndicator"),
|
||||
$(".page.pageLogin .register.side input.usernameInput"),
|
||||
{
|
||||
available: {
|
||||
icon: "fa-check",
|
||||
|
|
@ -157,7 +169,7 @@ const nameIndicator = new InputIndicator(
|
|||
);
|
||||
|
||||
const emailIndicator = new InputIndicator(
|
||||
$(".page.pageLogin .register.side .email.inputAndIndicator"),
|
||||
$(".page.pageLogin .register.side input.emailInput"),
|
||||
{
|
||||
valid: {
|
||||
icon: "fa-check",
|
||||
|
|
@ -171,7 +183,7 @@ const emailIndicator = new InputIndicator(
|
|||
);
|
||||
|
||||
const verifyEmailIndicator = new InputIndicator(
|
||||
$(".page.pageLogin .register.side .verifyEmail.inputAndIndicator"),
|
||||
$(".page.pageLogin .register.side input.verifyEmailInput"),
|
||||
{
|
||||
match: {
|
||||
icon: "fa-check",
|
||||
|
|
@ -185,7 +197,7 @@ const verifyEmailIndicator = new InputIndicator(
|
|||
);
|
||||
|
||||
const passwordIndicator = new InputIndicator(
|
||||
$(".page.pageLogin .register.side .password.inputAndIndicator"),
|
||||
$(".page.pageLogin .register.side input.passwordInput"),
|
||||
{
|
||||
good: {
|
||||
icon: "fa-check",
|
||||
|
|
@ -203,7 +215,7 @@ const passwordIndicator = new InputIndicator(
|
|||
);
|
||||
|
||||
const verifyPasswordIndicator = new InputIndicator(
|
||||
$(".page.pageLogin .register.side .verifyPassword.inputAndIndicator"),
|
||||
$(".page.pageLogin .register.side input.verifyPasswordInput"),
|
||||
{
|
||||
match: {
|
||||
icon: "fa-check",
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue