is anyone reading these commit msgs

client/main.js

@@ -1,10 +1,17 @@
 import Route from "../route.js";
 import auth from "../form/auth.js";
+import initDb from "../db.js";
+
+let db = await initDb();
 
 let main = new Route([auth], async function (req, res, input) {
     let { username } = input;
+    let videos = await db.all('SELECT * FROM video ORDER BY date DESC', [
+        req.query.id
+    ]);
     return res.render('main', {
-        username
+        username,
+        videos
     });
 });
 

client/upload.js

@@ -8,7 +8,7 @@ let main = new Route([auth], async function (req, res, input) {
         data: [
             { label: "Video file", type: "file", name: "file" },
             { label: "Name", type: "text", name: "title" },
-            { label: "Description", type: "text", name: "desc" }
+            { label: "Description", type: "textarea", name: "desc" }
         ],
         'route': '/api/upload/upload',
         'title': 'Upload Content',

db.js

@@ -14,7 +14,7 @@ async function initDb() {
     await db.run(`CREATE TABLE IF NOT EXISTS auth (username TEXT, password TEXT);`);
     await db.run(`CREATE TABLE IF NOT EXISTS token (username TEXT, token TEXT);`);
 
-    await db.run(`CREATE TABLE IF NOT EXISTS video (id TEXT, title TEXT, desc TEXT, username TEXT);`);
+    await db.run(`CREATE TABLE IF NOT EXISTS video (id TEXT, title TEXT, desc TEXT, username TEXT, date REAL);`);
 
     return db;
 }

form/upload.js

@@ -21,15 +21,17 @@ let main = new Route([auth], async function (req, res, input) {
 
     try {
         await execP(`ffmpeg -i ${path} videos/${id}.mp4`);
+        await execP(`ffmpeg -i videos/${id}.mp4 -frames:v 1 videos/${id}.png`);
     } catch (err) {
         return { 'success': false, 'message': 'Video is invalid'}
     }
 
-    await db.run('INSERT INTO video (id, title, desc, username) VALUES (?, ?, ?, ?)', [
+    await db.run('INSERT INTO video (id, title, desc, username, date) VALUES (?, ?, ?, ?, ?)', [
         id,
         title,
         desc,
-        username
+        username,
+        +new Date()
     ]);
 
     return { 'message': 'Video created', 'success': true, 'redirect': '/client/video?id='+id };

static/main.css

@@ -35,7 +35,8 @@ input,
 textarea,
 .button,
 .area,
-form {
+form,
+.video {
     border: solid var(--dark-2) 3px;
     border-radius: 5px;
 
@@ -114,3 +115,21 @@ form {
 video {
     width: 690px;
 }
+
+.video img {
+    width: 200px;
+}
+
+.videos {
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;
+}
+
+.videos a{
+    color: var(--dark-1);
+}
+
+textarea {
+    display: block;
+}

views/form.ejs

@@ -7,7 +7,13 @@
         <% for (let elem of data) { %>
             <span class='form-entry'> <span class='form-key'>
                     <%= elem.label %>
-                </span> <input type='<%= elem.type %>' name='<%= elem.name %>'></span>
+                </span>
+                <% if (elem.type=='textarea' ) { %>
+                    <textarea name='<%= elem.name %>'></textarea>
+                    <% } else { %>
+                        <input type='<%= elem.type %>' name='<%= elem.name %>'>
+            </span>
+            <% } %>
                 <% } %>
                     <input type='Submit' name='Submit'>
     </form>

views/main.ejs

@@ -3,12 +3,19 @@
         <h1>BiglyChat</h1>
         <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 from a young age. Following the unexpected growth
+        <p><i>I am <a href='https://zenoverse.net/'>Onez</a>, a self-taught developer from a young age. Following the
-                of <i>Video Bot Thing</i>, I made this as a home for the logo editing community. View the <a
+                unexpected growth
+                of <i>Video Bot Thing</i>, I made this as a home for the video 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>
             <% } %>
     </div>
+    <div class='area'>
+        <h1>Recent Videos</h1>
+        <div class=' videos'>
+            <%- include('videos.ejs') -%>
+        </div>
+    </div>
     <%- include('footer.ejs') -%>

views/player.ejs

@@ -9,6 +9,7 @@
         <div>by <a href="/client/user?id=<%= videoData.username %>">
                 <%= videoData.username %>
             </a></div>
+        <pre><%= videoData.desc %></pre>
         <!-- todo: custom video player-->
     </div>
     <%- include('footer.ejs') -%>

views/videos.ejs

@@ -0,0 +1,14 @@
+<%for (videoData of videos) { %>
+    <a href='/client/video?id=<%= videoData.id %>'>
+        <div class='video'>
+            <img src='/videos/<%= videoData.id %>.png'>
+            <div><b>
+                    <%= videoData.title %>
+                </b>
+            </div>
+            <div>by <a href="/client/user?id=<%= videoData.username %>">
+                    <%= videoData.username %>
+                </a></div>
+        </div>
+    </a>
+    <% } %>