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}
-        {:else}
+                {#if elem && elem.type == 'img'}
-            <p>{line}</p>
+                    {#if line.filter(x => x.type == 'img').length < 2}
-        {/if}
+                        <img src={elem.url} class='only-img' alt='Image preview'>
+                    {:else}
+                        <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,19 +63,40 @@ let formatPost = function(post) {
     post = post.split('\n');
 
     post = post.map(subPost => {
-        var splitPost = subPost.split('||');
+        return subPost.split(' ');
+    });
 
-        if (splitPost.length > 1) {
+    post = post.map(line => {
-            var cap1 = splitPost[0];
+        line = line.map(subPost => {
+            var splitPost = subPost.split('||');
 
-            if (cap1 == 'img') {
+            if (splitPost.length > 1) {
-                var matchCleaned = splitPost[1].replace(/(\s+)/g, '\\$1');
+                var cap1 = splitPost[0];
-                splitPost = {'type': 'img', 'url': `/img/${matchCleaned}`};
+    
+                if (cap1 == 'img') {
+                    var matchCleaned = splitPost[1].replace(/(\s+)/g, '\\$1');
+                    splitPost = {'type': 'img', 'url': `/img/${matchCleaned}`};
+    
+                    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 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,27 +8,42 @@
     let userData = data.postJsonUser.data;
 </script>
 
-<Area>
+{#if userData}
-    <span slot="header">
+    <Area>
-        <a href='/users/{userData.username}'>
+        <span slot="header">
-            {userData.username}
+            <a href='/users/{userData.username}'>
-        </a>
+                {userData.username}
-    </span>
+            </a>
-    <span slot="main">
+        </span>
-        <p>
+        <span slot="main">
-            <b>Reputation:</b> {userData.reputation}
+            <p>
-        </p>
+                <b>Reputation:</b> {userData.reputation}
-        <p>
+            </p>
-            <b>Upvotes:</b> {userData.upvotes}
+            <p>
-        </p>
+                <b>Upvotes:</b> {userData.upvotes}
-        <p>
+            </p>
-            <b>Downvotes:</b> {userData.downvotes}
+            <p>
-        </p>
+                <b>Downvotes:</b> {userData.downvotes}
-    </span>
+            </p>
-    <span slot="footer">
+        </span>
+        <span slot="footer">
             
-    </span>
+        </span>
-</Area>
+    </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>