init

2025-11-21 12:50:29 -06:00 · 2025-11-21 12:50:29 -06:00 · 1e11c8ca5e
commit 1e11c8ca5e
12 changed files with 579 additions and 0 deletions
--- a/site/login.html
+++ b/site/login.html
@ -0,0 +1,63 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>Login</title>
+    <style>
+        body { font-family: sans-serif; margin: 2em; }
+        form { max-width: 300px; margin: 2em auto; padding: 1.5em; border: 1px solid #ccc; background: #fafafa; border-radius: 8px;}
+        label { display: block; margin-top: 1em; }
+        input[type="text"], input[type="password"] {
+            width: 100%; padding: 0.5em; box-sizing: border-box;
+        }
+        .error { color: red; margin-top: 1em;}
+        button { margin-top: 1.2em; width: 100%; padding: 0.7em; background: #007bff; color: #fff; border: none; border-radius: 4px;}
+    </style>
+</head>
+<body>
+    <h2>Login</h2>
+    <form id="login-form">
+        <label>
+            Username:
+            <input type="text" name="username" id="username" autocomplete="username" required autofocus />
+        </label>
+        <label>
+            Password:
+            <input type="password" name="password" id="password" autocomplete="current-password" required />
+        </label>
+        <button type="submit">Log In</button>
+        <div class="error" id="error" style="display:none;"></div>
+    </form>
+    <script>
+        document.getElementById('login-form').onsubmit = async function(e) {
+            e.preventDefault();
+            const username = document.getElementById('username').value.trim();
+            const password = document.getElementById('password').value.trim();
+            const errorDiv = document.getElementById('error');
+            errorDiv.style.display = "none";
+
+            const headers = new Headers();
+            headers.set('Authorization', 'Basic ' + btoa(username + ":" + password));
+
+            try {
+                const resp = await fetch('/login', {
+                    method: 'POST',
+                    headers,
+                });
+                if (resp.ok) {
+                    window.location.href = '/';
+                } else if (resp.status === 401) {
+                    errorDiv.textContent = "Invalid username or password.";
+                    errorDiv.style.display = "block";
+                } else {
+                    errorDiv.textContent = "Unknown error (" + resp.status + ").";
+                    errorDiv.style.display = "block";
+                }
+            } catch (err) {
+                errorDiv.textContent = "Network error.";
+                errorDiv.style.display = "block";
+            }
+        };
+    </script>
+</body>
+</html>