Add recaptcha to reset password modal.

nimforum.nimble

@@ -41,14 +41,18 @@ task frontend, "Builds the necessary JS frontend (with CSS)":
 task minify, "Minifies the JS using Google's closure compiler":
   exec "closure-compiler public/js/forum.js --js_output_file public/js/forum.js.opt"
 
-task testdb, "Creates a test DB":
+task testdb, "Creates a test DB (with admin account!)":
   exec "nimble c src/setup_nimforum"
   exec "./src/setup_nimforum --test"
 
-task devdb, "Creates a test DB":
+task devdb, "Creates a test DB (with admin account!)":
   exec "nimble c src/setup_nimforum"
   exec "./src/setup_nimforum --dev"
 
+task blankdb, "Creates a blank DB":
+  exec "nimble c src/setup_nimforum"
+  exec "./src/setup_nimforum --blank"
+
 task test, "Runs tester":
   exec "nimble c -y src/forum.nim"
   exec "nimble c -y -r tests/browsertester"

src/forum.nim

@@ -1290,7 +1290,7 @@ routes:
         if "g-recaptcha-response" notin formData:
           let err = PostError(
             errorFields: @[],
-            message: "Not logged in."
+            message: "Not logged in and no recaptcha."
           )
           resp Http401, $(%err), "application/json"
 

src/frontend/header.nim

@@ -113,7 +113,6 @@ when defined(js):
               render(state.userMenu, user.get())
 
       # Modals
-      render(state.loginModal)
-
       if state.data.isSome():
+        render(state.loginModal, state.data.get().recaptchaSiteKey)
         render(state.signupModal, state.data.get().recaptchaSiteKey)

src/frontend/login.nim

@@ -53,7 +53,7 @@ when defined(js):
     if event.key == "Enter":
       onLogInClick(e, n, state)
 
-  proc render*(state: LoginModal): VNode =
+  proc render*(state: LoginModal, recaptchaSiteKey: Option[string]): VNode =
     result = buildHtml(tdiv()):
       tdiv(class=class({"active": state.shown}, "modal modal-sm"),
            id="login-modal"):
@@ -93,4 +93,4 @@ when defined(js):
                     (state.onSignUp(); state.shown = false)):
               text "Create account"
 
-      render(state.resetPasswordModal)
+      render(state.resetPasswordModal, recaptchaSiteKey)

src/frontend/resetpassword.nim

@@ -89,6 +89,8 @@ when defined(js):
     ajaxPost(uri, @[], cast[cstring](formData),
              (s: int, r: kstring) => onPost(s, r, state))
 
+    ev.preventDefault()
+
   proc onClose(ev: Event, n: VNode, state: ResetPasswordModal) =
     state.shown = false
     ev.preventDefault()
@@ -106,7 +108,8 @@ when defined(js):
     if event.key == "Enter":
       onClick(e, n, state)
 
-  proc render*(state: ResetPasswordModal): VNode =
+  proc render*(state: ResetPasswordModal,
+               recaptchaSiteKey: Option[string]): VNode =
     result = buildHtml():
       tdiv(class=class({"active": state.shown}, "modal"),
            id="resetpassword-modal"):
@@ -132,6 +135,11 @@ when defined(js):
                   true,
                   placeholder="Username or email"
                 )
+                if recaptchaSiteKey.isSome:
+                  tdiv(id="recaptcha"):
+                    tdiv(class="g-recaptcha",
+                         "data-sitekey"=recaptchaSiteKey.get())
+                    script(src="https://www.google.com/recaptcha/api.js")
           tdiv(class="modal-footer"):
             if state.sent:
               span(class="text-success"):
@@ -142,5 +150,6 @@ when defined(js):
                       {"loading": state.loading},
                       "btn btn-primary"
                      ),
+                     `type`="button",
                      onClick=(ev: Event, n: VNode) => onClick(ev, n, state)):
                 text "Reset password"