stuff

client/login.js

@@ -1,13 +1,17 @@
 import Route from "../route.js";
+import auth from "../form/auth.js";
 
 // TODO: rewrite
-let main = new Route([], async function (req, res, input) {
+let main = new Route([auth], async function (req, res, input) {
+    let { username } = input;
     return res.render('form', {
         data: [
             { label: "Username", type: "text", name: "user" },
             { label: "Password", type: "password", name: "pass" }
         ],
-        'route': '/api/form/login'
+        'route': '/api/form/login',
+        'title': 'Login',
+        username
     });
 });
 

client/register.js

@@ -1,14 +1,18 @@
 import Route from "../route.js";
+import auth from "../form/auth.js";
 
 // TODO: rewrite
-let main = new Route([], async function (req, res, input) {
+let main = new Route([auth], async function (req, res, input) {
+    let { username } = input;
     return res.render('form', {
         data: [
             { label: "Username", type: "text", name: "user" },
             { label: "Password", type: "password", name: "pass" },
             { label: "Password (again)", type: "password", name: "pass2" }
         ],
-        'route': '/api/form/register'
+        'route': '/api/form/register',
+        'title': 'Join',
+        username
     });
 });
 

index.js

@@ -20,8 +20,7 @@ app.get('/', (req, res) => {
 })
 
 app.get('/client/:route', async (req, res) => {
-    let dat = await iterate(req, res, 'client');
-    //res.send(dat);
+    await iterate(req, res, 'client');
 })
 
 app.get('/api/get/:route', async (req, res) => {

routes.js

@@ -29,7 +29,10 @@ async function iterate(req, res, index) {
     let keys = Object.keys(routesI);
 
     let cmd = req.params.route;
-    if (keys.indexOf(cmd) == -1) return '404 not found';
+    if (keys.indexOf(cmd) == -1) {
+        res.status(404).send('fail');
+        return;
+    }
 
     return await routesI[cmd].run(req, res, {});
 }

static/main.css

@@ -12,14 +12,14 @@ body {
 }
 
 :root {
-    --dark-1: #2b2f36;
+    --dark-1: #362b2b;
     --dark-2: #d8d8d8;
-    --dark-3: rgb(73, 138, 236);
+    --dark-3: rgb(236, 73, 73);
 
     --light-1: #ffffff;
-    --light-2: #f8f8f8;
+    --light-2: #ffa9a9;
 
-    --hyperlink: rgb(139, 171, 219);
+    --hyperlink: rgb(255, 72, 72);
 
     --shadow-1: 0px 0px 2px 2px var(--dark-2);
 
@@ -33,16 +33,21 @@ a {
 
 input,
 textarea,
-.button {
-    border: 0;
-    border-radius: 0.2rem;
-    box-shadow: var(--shadow-1);
+.button,
+.area,
+form {
+    border: solid var(--dark-2) 3px;
+    border-radius: 5px;
 
     font-size: 1rem;
     padding: 0.5rem;
     margin-bottom: 0.5rem;
 }
 
+form span {
+    font-weight: bold;
+}
+
 .button a {
     text-decoration: none;
     color: var(--light-1);
@@ -51,11 +56,6 @@ textarea,
 .area,
 form {
     width: 700px;
-
-    box-shadow: var(--shadow-1);
-
-    padding: 10px;
-    margin-top: 10px;
 }
 
 form {
@@ -94,14 +94,19 @@ form {
     margin: 0;
     font-size: 1.2em;
     align-items: center;
+    margin-bottom: 10px;
+    position: sticky;
+    top: 0;
 }
 
 .header a {
     font-weight: bold;
-    color: white;
+    color: var(--light-1);
+    margin-left: 0.5em;
+    padding-left: 0.5em;
+    border-left: solid var(--light-2) 2px;
 }
 
 .header img {
     height: 2em;
-    margin-right: 1em;
 }

views/form.ejs

@@ -1,11 +1,14 @@
 <%- include('header.ejs') -%>
     <form enctype='multipart/form-data' method='POST' action='<%= route %>'>
+        <h1>
+            <%= title %>
+        </h1>
         <div class='form-message'></div>
         <% for (let elem of data) { %>
             <span class='form-entry'> <span class='form-key'>
                     <%= elem.label %>
                 </span> <input type='<%= elem.type %>' name='<%= elem.name %>'></span>
             <% } %>
-            <input type='Submit' name='Submit'>
+                <input type='Submit' name='Submit'>
     </form>
     <%- include('footer.ejs') -%>

views/header_block.ejs

@@ -1,4 +1,11 @@
 <div class='header'>
     <img src='/static/img/logo.svg'>
     <a href='/'>BiglyChat</a>
+    <%if (username=='!nobody' ) { %>
+        <div class="button"><a href="/client/login">Login</a></div>
+        <% } else { %>
+            <a href="/client/user?user=<%= username %>">
+                <%= username %>
+            </a>
+            <% } %>
 </div>

views/main.ejs

@@ -1,7 +1,12 @@
 <%- include('header.ejs') -%>
     <div class='area'>
         <h1>BiglyChat</h1>
-        <p>A community for video editing</p>
+        <p><b>Collab on videos... make creative animations... and more!</b></p>
+        <h2>About</h2>
+        <p><i>I am <a href='https://zenoverse.net/'>Onez</a>, a self-taught developer since the age of 12. Following the unexpected growth
+                of <i>Video Bot Thing</i>, I made this as a home for the logo editing community. View the <a
+                    href='https://codeberg.org/onezDerv/bigly-chat'>source</a> if you want to contribute or make a
+                fork.</i></p>
         <%if (username=='!nobody' ) { %>
             <div class="button"><a href="/client/register">Join</a></div>
             <% } %>