www.spaceplanner.app

commit 9157f14414ca9d3cdb1121e8b2e4f24c7775369b
parent 26c6d962ee4c104b4667369894069409ec6dbdb8
Author: Jacob R. Edwards <jacob@jacobedwards.org>
Date:   Fri, 30 Aug 2024 18:01:15 -0700

Add ui login function

This creates a login element, which can be used to login on any
page in theory.

Diffstat:
M
files/lib/ui.js
 | 
42
++++++++++++++++++++++++++++++++++++++++++

1 file changed, 42 insertions(+), 0 deletions(-)
diff --git a/files/lib/ui.js b/files/lib/ui.js
@@ -1,3 +1,6 @@
+import * as api from "/lib/api.js"
+import * as etc from "/lib/etc.js"
+
 export function input(name, memo, options) {
 	if (!name) {
 		throw new Error("No name provided")
@@ -72,6 +75,45 @@ function toggle_setup_button(a, b) {
 	}, false)
 }
 
+export function login(callback) {
+	let form = document.createElement("form")
+	form.classList.add("credentials")
+
+	let label = form.appendChild(document.createElement("label"))
+	label.appendChild(document.createTextNode("Username:"))
+	label.setAttribute("for", "username")
+	let username = form.appendChild(document.createElement("input"))
+	username.id = "username"
+	username.setAttribute("autocomplete", "username")
+	username.setAttribute("name", "username")
+
+	label = form.appendChild(document.createElement("label"))
+	label.appendChild(document.createTextNode("Password:"))
+	label.setAttribute("for", "password")
+	let password = form.appendChild(document.createElement("input"))
+	password.setAttribute("autocomplete", "current-password")
+	password.setAttribute("type", "password")
+	password.setAttribute("name", "password")
+
+	let button = form.appendChild(document.createElement("input"))
+	button.setAttribute("type", "submit")
+	button.setAttribute("value", "Login")
+
+	form.addEventListener("submit", function(event) {
+		event.preventDefault()
+		api.login(username.value, password.value)
+			.then(function() {
+				form.remove()
+				callback()
+			})
+			.catch(function(err) {
+				etc.error(err + ": Unable to login", form)
+			})
+	})
+
+	return form
+}
+
 export function prettyName(name, options) {
 	options = options ?? {}
 	options.separator = options.separator ?? /[-_]/