Better formatting

src/lib/components/PostBody.svelte

@@ -1,7 +1,15 @@
 <style>
     img {
+        max-width: 100px;
+        margin: 5px;
+    }
+
+    img.only-img {
         max-width: 450px;
-        display: block;
+    }
+
+    p {
+        white-space: pre-wrap;
     }
 </style>
 
@@ -18,10 +26,20 @@
 
 <span>
     {#each contentSplit as line}
-        {#if line && line.type == 'img'}
+        <p>
-            <img src={line.url} alt='Image preview'>
+            {#each line as elem}
+                {#if elem && elem.type == 'img'}
+                    {#if line.filter(x => x.type == 'img').length < 2}
+                        <img src={elem.url} class='only-img' alt='Image preview'>
                     {:else}
-            <p>{line}</p>
+                        <img src={elem.url} alt='Image preview'>
+                    {/if}
+                {:else if elem.type == 'link'}
+                    <a href={elem.url}>{elem.display + ' '}</a>
+                {:else}
+                    {elem + ' '}
                 {/if}
             {/each}
+        </p>
+    {/each}
 </span>

src/lib/db/db.js

@@ -30,6 +30,7 @@ async function initDb() {
     await db.run('CREATE TABLE IF NOT EXISTS post (username CHAR(64), id CHAR(64), content CHAR(10240), upvotes INTEGER, downvotes INTEGER, rating REAL)');
     await db.run('CREATE TABLE IF NOT EXISTS vote (id CHAR(64), username CHAR(64), type INTEGER)');  
     await db.run('CREATE TABLE IF NOT EXISTS user (username CHAR(64), followers INTEGER, following INTEGER, upvotes INTEGER, downvotes INTEGER, reputation REAL)'); 
+    await db.run('CREATE TABLE IF NOT EXISTS bio (username CHAR(64), content CHAR(10240), roles INTEGER)');  
 }
 
 let backendProxy = async ({route, backendParams}) => {
@@ -189,7 +190,19 @@ backend.userGet = async ({user}) => {
     ])
 
     if (!posts || posts.length < 1) {
-        return {'success': 'Post does not exist.'}
+        return {'success': 'User does not exist.'}
+    }
+
+    return {data: posts[0]};
+}
+
+backend.userBio = async ({user}) => {
+    var posts = await db.all('SELECT * from bio WHERE username = ?', [
+        user
+    ])
+
+    if (!posts || posts.length < 1) {
+        return {'success': 'Bio does not exist.'}
     }
 
     return {data: posts[0]};

src/lib/util.js

@@ -63,6 +63,11 @@ let formatPost = function(post) {
     post = post.split('\n');
 
     post = post.map(subPost => {
+        return subPost.split(' ');
+    });
+
+    post = post.map(line => {
+        line = line.map(subPost => {
             var splitPost = subPost.split('||');
 
             if (splitPost.length > 1) {
@@ -74,8 +79,24 @@ let formatPost = function(post) {
     
                     return splitPost;
                 }
+            } else if (subPost[0] == '@') {
+                var subPostIn = subPost.substring(0).replaceAll(/[^A-Za-z0-9\-\_]/g, '');
+
+                splitPost = {'type': 'link', 'display': subPost, 'url': `/user/${subPostIn}`};
+
+                return splitPost;
+
+            } else if (subPost[0] == '#') {
+                var subPostIn = subPost.substring(0).replaceAll(/[^A-Za-z0-9]/g, '');
+
+                splitPost = {'type': 'link', 'display': subPost, 'url': `/post/${subPostIn}`};
+
+                return splitPost;
             }
+
             return subPost;
+        })
+        return line;
     });
 
     return post;

src/routes/new_post/+page.svelte

@@ -82,5 +82,11 @@
         <p>
             <b>img||filename.blah</b> embeds a user-uploaded file in this site
         </p>
+        <p>
+            <b>@user</b> mentions a user
+        </p>
+        <p>
+            <b>#post</b> replies to a post by ID
+        </p>
     </span>
 </Area>

src/routes/user/[user]/+page.js

@@ -14,7 +14,7 @@ export async function load({ fetch, params, url }) {
     const postJson = await res.json();
 
     const resUser = await fetch(`/api/userGet?user=${user}`);
-    const postJsonUser = await resUser.json();
+    const postJsonUser = (await resUser.json()) || {};
 
     return { postJson, id, postJsonUser };
 }

src/routes/user/[user]/+page.svelte

@@ -8,6 +8,7 @@
     let userData = data.postJsonUser.data;
 </script>
 
+{#if userData}
     <Area>
         <span slot="header">
             <a href='/users/{userData.username}'>
@@ -29,6 +30,20 @@
             
         </span>
     </Area>
+{:else}
+    <Area>
+        <span slot="header">
+            <b>
+                Error
+            </b>
+        </span>
+        <span slot="main">
+        </span>
+        <span slot="footer">
+            This user does not exist.
+        </span>
+    </Area>
+{/if}
 
 <h2>Posts</h2>