Added file uploads

src/routes/+layout.svelte

@@ -83,6 +83,9 @@
             <a href='/new_post'>
                 Create
             </a>
+            <a href='/new_file'>
+                Create file
+            </a>
         {:else}
             <a href='/account'>
                 Log in / Register

src/routes/api/[route]/+server.js

@@ -27,7 +27,7 @@ async function handleReq({ cookies, params, route }) {
     var backendParams = {cookies};
 
     for (const [key, value] of params) {
-        backendParams[key] = value;
+        backendParams[key] = value + '';
     }
 
     return await mainApi({backendParams, route: route});

src/routes/img/[img]/+server.js

@@ -0,0 +1,14 @@
+import { backend, backendProxy } from '../../../lib/db/db.js';
+
+import { readFile, writeFile } from 'node:fs/promises';
+
+/** @type {import('./$types').RequestHandler} */
+export async function GET({ url, cookies, params }) {
+    var imgName = params['img'];
+
+    imgName = imgName.replace(/(\s+)/g, '\\$1');
+
+    var res = await readFile(`${process.cwd()}/db/post-${imgName}`);
+
+    return new Response(res);
+}

src/routes/new_file/+page.svelte

@@ -0,0 +1,75 @@
+<script>
+    import Area from '$lib/components/Area.svelte';
+
+    /** @type {import('./$types').ActionData} */
+    export let form;
+
+    let fileInput;
+    let files;
+    let preview;
+
+    function getBase64(image) {
+        const reader = new FileReader();
+        reader.readAsDataURL(image);
+        reader.onload = e => {
+            preview = e.target.result;
+            uploadFunction(e.target.result);
+        };
+    };
+
+    async function uploadFunction(imgBase64) {
+        const imgData = imgBase64.split(',').pop();
+
+        var fData = (new FormData());
+
+        fData.append('img',imgData);
+        fData.append('extension',fileInput.value.split('.').pop());
+
+        form = await fetch(`/api/fileCreate`, {
+            method: 'POST',
+            body: fData
+        }).then(x => x.json());
+    };
+</script>
+
+<style>
+    textarea {
+        width: 10rem;
+        height: 10rem;
+    }
+
+    .hidden {
+        display: none;
+    }
+
+    img {
+        max-width: 250px;
+    }
+</style>
+
+<Area>
+    <p slot="header">
+        Upload File
+    </p>
+    <form slot="main" action='/api/postCreate' method='POST' >
+        {#if preview}
+            <img src={preview} alt="Image preview"/>
+        {:else}
+            <img src='/icon_sanifae.svg' alt="Image preview"/>
+        {/if}
+        <input class="hidden" id="file-to-upload" type="file" bind:files bind:this={fileInput} on:change={() => getBase64(files[0])}/>
+        <p> 
+            <a href='#' class="upload-btn" on:click={ () => fileInput.click() }>Upload</a>
+        </p>
+    </form>
+    <p slot="footer">
+        {#if form?.success}
+            {#if form?.href}
+                <a href='{form?.href}'>{form?.success}</a>
+            {:else}
+                {form?.success}
+            {/if}
+        {/if}
+        Create an image for the world to see.
+    </p>
+</Area>

src/routes/new_post/+page.server.js

@@ -1,19 +0,0 @@
-import { backend } from '../../lib/db/db.js';
-import { checkLength, checkRegex } from '../../lib/util.js';
-
-/** @type {import('./$types').Actions} */
-export const actions = {
-    create: async ({ request, cookies }) => {
-        const data = await request.formData();
-        const content = data.get('content') + '';
-
-        var lengthCheck = checkLength(content,'Post content',1,10240);
-
-        if (lengthCheck)
-            return lengthCheck;
-
-        await backend.postCreate({user, content});
-
-        return {'success': 'Successfully posted.'};
-    }
-};

src/routes/new_post/+page.svelte

@@ -26,10 +26,20 @@
             <input formaction="?/create" type='submit' value='Post'>
         </p>
     </form>
-    <p slot="footer">
-        {#if form?.success}
-            <p>{form?.success}</p>
-        {/if}
-        Create a post for the world to see.
-    </p>
+    <span slot="footer">
+        <p>
+            {#if form?.success}
+                {#if form?.href}
+                    <a href='{form?.href}'>{form?.success}</a>
+                {:else}
+                    {form?.success}
+                {/if}
+            {/if}
+        </p>
+        <p>Create a post for the world to see.</p>
+        <h2>Post syntax</h2>
+        <p>
+            <b>img||filename.blah</b> embeds a user-uploaded file in this site
+        </p>
+    </span>
 </Area>

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

@@ -7,13 +7,7 @@ export async function load({ fetch, params, url }) {
 
     await new Promise(resolve => setTimeout(resolve, 100));
 
-    var f = (new FormData());
-
-    f.append('id',id);
-    const res = await fetch(`/api/postGet`, {
-        method: 'POST',
-        body: f
-    });
+    const res = await fetch(`/api/postGet?id=${id}`);
     const postJson = (await res.json()).data;
 
     console.log(postJson);