diff --git a/frontend/src/ts/controllers/account-controller.ts b/frontend/src/ts/controllers/account-controller.ts index adcc8e354..4e9303518 100644 --- a/frontend/src/ts/controllers/account-controller.ts +++ b/frontend/src/ts/controllers/account-controller.ts @@ -17,6 +17,7 @@ import * as ResultFilters from "../account/result-filters"; import * as PaceCaret from "../test/pace-caret"; import * as TagController from "./tag-controller"; import * as ResultTagsPopup from "../popups/result-tags-popup"; +import * as RegisterCaptchaPopup from "../popups/register-captcha-popup"; import * as URLHandler from "../utils/url-handler"; import * as Account from "../pages/account"; import * as Alerts from "../elements/alerts"; @@ -491,6 +492,12 @@ export function signOut(): void { } async function signUp(): Promise { + RegisterCaptchaPopup.show(); + const captcha = await RegisterCaptchaPopup.promise; + if (!captcha) { + Notifications.add("Please complete the captcha", -1); + return; + } LoginPage.disableInputs(); LoginPage.disableSignUpButton(); LoginPage.showPreloader(); @@ -576,6 +583,7 @@ async function signUp(): Promise { const signInResponse = await Ape.users.create( nname, + captcha, email, createdAuthUser.user.uid ); diff --git a/frontend/src/ts/popups/register-captcha-popup.ts b/frontend/src/ts/popups/register-captcha-popup.ts new file mode 100644 index 000000000..3af4427eb --- /dev/null +++ b/frontend/src/ts/popups/register-captcha-popup.ts @@ -0,0 +1,53 @@ +import * as CaptchaController from "../controllers/captcha-controller"; + +let resolvePromise: (data?: string) => void; + +export let promise: Promise = new Promise((resolve) => { + resolvePromise = resolve; +}); + +export function show(): void { + if ($("#registerCaptchaPopupWrapper").hasClass("hidden")) { + promise = new Promise((resolve) => { + resolvePromise = resolve; + }); + CaptchaController.reset("register"); + CaptchaController.render( + $("#registerCaptchaPopup .g-recaptcha")[0], + "register", + (data) => { + resolvePromise(data); + hide(); + } + ); + $("#registerCaptchaPopupWrapper") + .stop(true, true) + .css("opacity", 0) + .removeClass("hidden") + .animate({ opacity: 1 }, 125); + } +} + +export function hide(resolveToUndefined = false): void { + if (!$("#registerCaptchaPopupWrapper").hasClass("hidden")) { + if (resolveToUndefined) resolvePromise(); + $("#registerCaptchaPopupWrapper") + .stop(true, true) + .css("opacity", 1) + .animate( + { + opacity: 0, + }, + 100, + () => { + $("#registerCaptchaPopupWrapper").addClass("hidden"); + } + ); + } +} + +$("#registerCaptchaPopupWrapper").on("click", (e) => { + if ($(e.target).attr("id") === "registerCaptchaPopupWrapper") { + hide(true); + } +}); diff --git a/frontend/static/html/popups.html b/frontend/static/html/popups.html index b9c0da66e..d2e945c08 100644 --- a/frontend/static/html/popups.html +++ b/frontend/static/html/popups.html @@ -1,3 +1,9 @@ + +