1: UI works, receiving location updates

2025-10-31 19:51:09 -05:00
commit 152faaecee
13 changed files with 1253 additions and 0 deletions
--- a/ui/auth/auth.html
+++ b/ui/auth/auth.html
@@ -0,0 +1,59 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <title>Login</title>
+    <link rel="icon" href="/_/icons/logo.svg">
+    <script type="module">
+      document.addEventListener('DOMContentLoaded', () => {
+        const loginInput = document.getElementById('login');
+        
+        // Listen for the Enter key to submit the login
+        loginInput.addEventListener('keydown', async (event) => {
+          if (event.key === 'Enter') { // Check if the key pressed is Enter
+            event.preventDefault(); // Prevent any default form submission behavior
+
+            // Get the value from the input field
+            const loginValue = loginInput.value;
+
+            // Send the login data to the backend using fetch
+            try {
+              const response = await fetch('/login', {
+                method: 'POST',
+                headers: {
+                  'Content-Type': 'application/json',
+                },
+                body: JSON.stringify({ login: loginValue }),
+              });
+
+              const result = await response;
+
+              // Handle the response from the backend
+              if (response.ok) {
+                document.getElementById("login").style.borderBottom = "2px solid black"
+                window.location.reload()          
+              } else {
+                document.getElementById("login").style.borderBottom = "2px solid red"              
+              }
+            } catch (error) {
+              console.error('Error during login:', error);
+              document.getElementById("login").style.borderBottom = "2px solid red"
+            }
+          }
+        });
+      });
+    </script>
+  </head>
+  <body style="background-color: bisque">
+    <input id="login" type="text" style="
+        position: absolute;
+        top: 50vh;
+        left: 50vw;
+        transform: translate(-50%, -50%);
+        background-color: transparent;
+        border: 0px;
+        border-bottom: 2px solid black;
+        text-decoration: none;
+        outline: none;
+    ">
+  </body>
+</html>