aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
authorkartofen <mladenovnasko0@gmail.com>2022-08-28 00:08:07 +0300
committerkartofen <mladenovnasko0@gmail.com>2022-08-28 00:08:07 +0300
commit35b06b4fc851192916e000ad5e7e2f458846448c (patch)
treef9a1536aae76a5058d26f8b82ddcf63e83f500cc /src
parent8f5278eb443864910dd9c2131c992d71e3af2d20 (diff)
working on thread uploading
Diffstat (limited to 'src')
-rw-r--r--src/components/Comment.svelte24
-rw-r--r--src/components/Thread.svelte16
-rw-r--r--src/layouts/Default.astro8
-rw-r--r--src/lib/thread.ts8
-rw-r--r--src/pages/board/[board].astro1
-rw-r--r--src/pages/create/[board].astro54
-rw-r--r--src/pages/create/thread.ts28
7 files changed, 112 insertions, 27 deletions
diff --git a/src/components/Comment.svelte b/src/components/Comment.svelte
index 09469cc..bc53f4d 100644
--- a/src/components/Comment.svelte
+++ b/src/components/Comment.svelte
@@ -8,24 +8,24 @@
<div class="commentbox" id="{comment.id}">
<span style="line-height: 2rem;">
- {comment.id}
+ <span style="font-family: mono">{comment.id}</span>
at {formatTime(comment.creationDate)} <br>
- -> <span style="{creatorColor(comment.commentCreator)}">
+ -> <span style="{creatorColor(comment.commentCreator)}; font-family: mono">
{comment.commentCreator}
</span> <br>
</span>
- {#if comment.imageId!= null && comment.imageId != undefined}
- {#if comment.fileType == 'image'}
- <a href="{comment.imageId}" target="_blank" rel="noopener noreferrer">
- <img src="{comment.imageId}" alt="{comment.imageId}" height="300px" width="300px"> <br>
- </a>
- {:else if comment.fileType == 'video'}
- <video width="320" height="240" controls muted>
- <source src="{comment.imageId}">
- </video>
- {/if}
+ {#if comment.imageId!= null && comment.imageId != undefined}
+ {#if comment.fileType == 'image'}
+ <a href="{comment.imageId}" target="_blank" rel="noopener noreferrer">
+ <img src="{comment.imageId}" alt="{comment.imageId}" height="300px" width="300px"> <br>
+ </a>
+ {:else if comment.fileType == 'video'}
+ <video width="320" height="240" controls muted>
+ <source src="{comment.imageId}">
+ </video>
{/if}
+ {/if}
<p>{@html comment.commentText}</p>
diff --git a/src/components/Thread.svelte b/src/components/Thread.svelte
index 8e07c9f..fee1a78 100644
--- a/src/components/Thread.svelte
+++ b/src/components/Thread.svelte
@@ -21,10 +21,10 @@
{#if thread.id != "rules"}
<div class="threadbox" id="{thread.id}">
<span style="line-height: 2rem;">
- <a href="/board/{board}/{thread.id}">{thread.id}</a>
+ <a href="/board/{board}/{thread.id}" style="font-family: mono">{thread.id}</a>
at {formatTime(thread.creationDate)} <br>
- -> <span style="{creatorColor(thread.threadCreator )}">
+ -> <span style="{creatorColor(thread.threadCreator )}; font-family: mono">
{thread.threadCreator}
</span > <br>
@@ -33,8 +33,8 @@
{#each replies as id}
<a href="/board/{board}/{thread.id}#{id}" onmouseover="document.getElementById('{id}').classList.add('targeted')" onmouseleave="document.getElementById('{id}').classList.remove('targeted')">>>{id}</a> &#xfeff
{/each}
- </span> <hr>
- {/if}
+ </span> <hr>
+ {/if}
</span>
@@ -60,15 +60,15 @@
{/if}
<style>
-.threadbox {
+ .threadbox {
width: 600px;
border: 10px solid green;
padding: 10px;
margin: 10px;
margin-left: 0px;
background-color: white;
-}
-:target, .targeted {
+ }
+ :target, .targeted {
background-color: #ffa;
-}
+ }
</style>
diff --git a/src/layouts/Default.astro b/src/layouts/Default.astro
index 85fd510..5a2a372 100644
--- a/src/layouts/Default.astro
+++ b/src/layouts/Default.astro
@@ -11,11 +11,11 @@
<body>
<slot />
</body>
-<html>
+</html>
<style>
html {
- font-family: sans-serif;
- padding-left: 1em;
- }
+ font-family: sans-serif;
+ padding-left: 1em;
+ }
</style>
diff --git a/src/lib/thread.ts b/src/lib/thread.ts
index d0a4fce..6bc54ce 100644
--- a/src/lib/thread.ts
+++ b/src/lib/thread.ts
@@ -2,7 +2,7 @@ import { writeFileSync, existsSync } from 'fs';
import { getImg } from './image';
import type Thread from '../models/Thread'
-export async function processThreadIn(board: string, thread: Thread, procComments?: false) {
+export async function processThreadIn(board: string, thread: Thread, comments? =false) {
if(!thread || !board) return;
let imageId: string = thread.imageId;
@@ -13,7 +13,7 @@ export async function processThreadIn(board: string, thread: Thread, procComment
thread.threadText = replaceURLs(thread.threadText, board, thread.id);
- if(!procComments) return;
+ if(!comments) return;
for(let comment of thread.comments)
{
@@ -27,6 +27,10 @@ export async function processThreadIn(board: string, thread: Thread, procComment
}
}
+export async function processThreadOUT(board: string, thread: Thread, comments? = false) {
+
+}
+
function replaceURLs(text: string, board: string, OPtid?: string): string {
if(!text) return;
diff --git a/src/pages/board/[board].astro b/src/pages/board/[board].astro
index 2624fed..23a5551 100644
--- a/src/pages/board/[board].astro
+++ b/src/pages/board/[board].astro
@@ -22,5 +22,4 @@ for(let thread of threads)
{threads.map((thread) => (
<Thread thread={thread} board={board} />
))}
-
</Default>
diff --git a/src/pages/create/[board].astro b/src/pages/create/[board].astro
new file mode 100644
index 0000000..45f8b0d
--- /dev/null
+++ b/src/pages/create/[board].astro
@@ -0,0 +1,54 @@
+---
+import Default from '../../layouts/Default.astro'
+const { board } = Astro.params;
+---
+
+<h1>{board}</h1>
+
+<Default>
+ <form id="form" method="post" action="/create/thread" onsubmit="document.getElementById('submit-button').disabled = true">
+ <textarea name="ThreadName" placeholder="Thread Name" style="height: 1.5rem; width: 350px;"></textarea> <br>
+ <textarea name="ThreadText" placeholder="Thread Contents" style="height: 150px; width: 350px;"></textarea>
+ <br> <input id="submit-button" type="submit" value="Create Thread" />
+ <input id="image" type="file" accept=".png,.jpg,.gif,.bmp,.mp4" />
+
+ </form>
+ <script define:vars={{ board }}>
+ document.forms['form'].addEventListener('submit', async (event) => {
+ event.preventDefault();
+
+ let form = new FormData(event.target);
+ let reader = new FileReader();
+
+ reader.onload = e => {
+ form.append('image',
+ (e != null) ? e.target.result.toString() : ''
+ );
+ }
+
+ reader.onloadend = () => {
+ fetch(event.target.action, {
+ method: event.target.method,
+ body: new URLSearchParams(form)
+ }).then((r) => {
+ if(r.status == 200) {
+ alert('Thread Successfuly Posted');
+ window.location.assign(`/board/${board}`);
+ }
+ else alert('An Error has Accured');
+ });
+ }
+
+ form.append('board', board);
+
+ let image = document.getElementById("image").files[0];
+ if(image) {
+ reader.readAsDataURL(image);
+ } else {
+ reader.onload(null);
+ reader.onloadend();
+ }
+
+ });
+ </script>
+</Default>
diff --git a/src/pages/create/thread.ts b/src/pages/create/thread.ts
new file mode 100644
index 0000000..0af3471
--- /dev/null
+++ b/src/pages/create/thread.ts
@@ -0,0 +1,28 @@
+import type { APIRoute } from 'astro';
+import { v4 as uuidV4 } from 'uuid';
+
+import type Thread from '../../models/Thread'
+import { api } from '../../lib/api'
+
+export async function post({ params, request }): APIRoute {
+ const form = await request.formData();
+
+ let t: Thread = {};
+ t.id = uuidV4().toString();
+ t.ThreadName = form.get('ThreadName').toString();
+ // data["ThreadCreator"] = locals.userid;
+ t.ThreadCreator = '';
+ t.ThreadText = form.get('ThreadText').toString();
+ t.Comments = [];
+ t.CreationDate = Date.now();
+ // data["ImageId"] = await post_img(base64image, writeFileSync);
+ // data["FileType"] = get_img_type(base64image);
+ t.ImageId = form.get('image').toString();
+ t.FileType = '';
+
+ // await api('post', `thread/${form.get('board')}`, JSON.stringify(data));
+
+ return new Response(null, {
+ status: 200
+ });
+}
generated by cgit v1.2.3 (git 2.25.1) at 2025-01-23 05:13:47 +0000