commit 6bc0610db7b823dcafcd2076354648c11bd6354d
parent e4ddee6b7fb504fa68c51ee47ed76fe1fa5197b6
Author: Jacob R. Edwards <jacob@jacobedwards.org>
Date: Fri, 30 Aug 2024 18:21:31 -0700
Add settings/verify_email page
This page just facilitates the email verification process by telling
the api to send the verification email, providing an input for the
code, and giving that code to the server.
Diffstat:
3 files changed, 112 insertions(+), 0 deletions(-)
diff --git a/files/settings/verify-email/index.html b/files/settings/verify-email/index.html
@@ -0,0 +1,12 @@
+<!DOCTYPE HTML>
+<html>
+ <head>
+ <script type="module" src="./main.js"></script>
+ <link rel="stylesheet" type="text/css" href="/css/main.css">
+ <body>
+ <a href="/settings">Go to settings.<a>
+ <h1>Verify Your Email</h1>
+
+ <p id="wait">Wait while we send a verification code to your email...</p>
+ </body>
+</html>
diff --git a/files/settings/verify-email/main.css b/files/settings/verify-email/main.css
@@ -0,0 +1,3 @@
+label {
+ display: inline-block;
+}
diff --git a/files/settings/verify-email/main.js b/files/settings/verify-email/main.js
@@ -0,0 +1,97 @@
+import * as api from "/lib/api.js"
+import * as etc from "/lib/etc.js"
+
+function main() {
+ api.fetch("GET", "users/" + localStorage.getItem("username") + "/email/code")
+ .then(function() {
+ document.getElementById("wait").remove()
+ document.body.appendChild(codeForm())
+ document.body.appendChild(document.createElement("br"))
+ document.body.appendChild(resendForm())
+ })
+ .catch(function(err) {
+ etc.error(err + ": Unable to send code")
+ })
+
+}
+
+function codeForm() {
+ let form = document.createElement("form")
+ form.id = "code_form"
+
+ let label = form.appendChild(
+ document.createElement("label")
+ )
+ label.setAttribute("for", "code")
+ label.classList.add("break")
+
+ label.appendChild(
+ document.createTextNode("Please enter the code sent to your email:")
+ )
+ let input = form.appendChild(
+ document.createElement("input")
+ )
+ input.id = "code"
+ input.setAttribute("autofocus", true)
+
+ let submit = form.appendChild(
+ document.createElement("input")
+ )
+ submit.setAttribute("type", "submit")
+
+ form.addEventListener("submit", function(event) {
+ event.preventDefault()
+ api.fetch("POST", "users/" + localStorage.getItem("username") + "/email/code", { code: code.value })
+ .then(function(body) {
+ if (!body.valid) {
+ etc.error("That was not the correct code, please try again.", form)
+ } else {
+ // redirect somewhere better
+ window.location.href = "/services"
+ }
+ })
+ .catch(function(err) {
+ etc.error(err + ": Could not verify code", form)
+ })
+ })
+
+ return form
+}
+
+function resendForm() {
+ let form = document.createElement("form")
+ form.id = "resend"
+
+ let label = form.appendChild(
+ document.createElement("label")
+ )
+ label.setAttribute("for", "resend")
+ label.appendChild(
+ document.createTextNode("Don't see the code? Click here to resend it: ")
+ )
+
+ let resend = form.appendChild(
+ document.createElement("input")
+ )
+ resend.setAttribute("type", "submit")
+ resend.setAttribute("value", "Resend")
+
+ form.addEventListener("submit", function(event) {
+ event.preventDefault()
+ api.fetch("GET", "users/" + localStorage.getItem("username") + "/email/code")
+ .then(function(body) {
+ console.log(body)
+ let msg = document.createElement("p")
+ msg.appendChild(document.createTextNode("Code resent."))
+ form.before(msg)
+ setTimeout(function() { msg.remove() }, 5500)
+ })
+ .catch(function(err) {
+ etc.error(err + ": Unable to resend code", form)
+ })
+ })
+
+ return form
+}
+
+main()