From 1dd6892231b8b81fe59491a9baa9409bcc60cc1a Mon Sep 17 00:00:00 2001
From: Bradley Shellnut <bradleyshellnut@protonmail.com>
Date: Fri, 2 Apr 2021 10:45:52 -0700
Subject: [PATCH] Moving UI and API to domain and subdomain.

---
 Caddyfile     |  4 +++
 ui/index.html | 94 +++++++++++++++++++++++++++++++++++++++++++++++++++
 2 files changed, 98 insertions(+)
 create mode 100644 ui/index.html
diff --git a/Caddyfile b/Caddyfile
index ee5b1c0..5b26440 100644
--- a/Caddyfile
+++ b/Caddyfile
@@ -3,5 +3,9 @@
 }
 
 nodeauth.dev {
+  reverse_proxy 127.0.0.1:5000
+}
+
+api.nodeauth.dev {
   reverse_proxy 127.0.0.1:3000
 }
\ No newline at end of file
diff --git a/ui/index.html b/ui/index.html
new file mode 100644
index 0000000..a99d03c
--- /dev/null
+++ b/ui/index.html
@@ -0,0 +1,94 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Document</title>
+  </head>
+  <body>
+    <h1>Hello</h1>
+    <h3>Register Form</h3>
+    <form id="register-form">
+      <input type="email" name="email" />
+      <input type="password" name="password" />
+      <button type="submit">Register</button>
+    </form>
+    <br />
+    <hr />
+    <br />
+    <h3>Login Form</h3>
+    <form id="login-form">
+      <input type="email" name="email" />
+      <input type="password" name="password" />
+      <button type="submit">Login</button>
+    </form>
+
+    <br />
+    <hr />
+    <br />
+
+    <button onclick="logout()">Logout</button>
+
+    <script>
+      async function logout() {
+        try {
+          const res = await fetch('https://api.nodeauth.dev/api/logout', {
+            method: 'POST',
+          });
+        } catch (e) {
+          console.error(e);
+        }
+      }
+
+      (() => {
+        const registerForm = document.getElementById('register-form');
+
+        registerForm.addEventListener('submit', async (e) => {
+          e.preventDefault();
+          try {
+            const values = Object.values(registerForm).reduce((obj, field) => {
+              if (field.name) {
+                obj[field.name] = field.value;
+              }
+              return obj;
+            }, {});
+            const res = await fetch('https://api.nodeauth.dev/api/register', {
+              method: 'POST',
+              body: JSON.stringify(values),
+              headers: { 'Content-type': 'application/json; charset=UTF-8' },
+            });
+            console.log('values', values);
+          } catch (e) {
+            console.error(e);
+          }
+        });
+
+        // Find form element
+        const loginForm = document.getElementById('login-form');
+        // Wait for event
+        loginForm.addEventListener('submit', async (e) => {
+          e.preventDefault();
+          try {
+            // Get form values
+            const values = Object.values(loginForm).reduce((obj, field) => {
+              if (field.name) {
+                obj[field.name] = field.value;
+              }
+              return obj;
+            }, {});
+            // Submit
+            const res = await fetch('https://api.nodeauth.dev/api/authorize', {
+              method: 'POST',
+              body: JSON.stringify(values),
+              headers: { 'Content-type': 'application/json; charset=UTF-8' },
+            });
+            console.log('values', values);
+          } catch (e) {
+            console.error(e);
+          }
+        });
+      })();
+    </script>
+  </body>
+</html>
