A lot of stuff
This commit is contained in:
parent
a1c9b30cf6
commit
ad969e5807
13 changed files with 227 additions and 167 deletions
|
@ -34,7 +34,10 @@
|
|||
:global(input, textarea) {
|
||||
border: 0;
|
||||
border-radius: 0.2rem;
|
||||
box-shadow: 0px 2px 2.5px 0px var(--dark-2);
|
||||
box-shadow: 0px 0px 2px 2px var(--dark-2);
|
||||
|
||||
font-size: 1rem;
|
||||
padding: 0.5rem;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
|
@ -1,34 +1,15 @@
|
|||
<script>
|
||||
import Area from '$lib/components/Area.svelte';
|
||||
import { handleSubmit } from '$lib/util.js';
|
||||
|
||||
export let form = {};
|
||||
|
||||
let submitFunc = async e => form = JSON.parse(await handleSubmit(e))
|
||||
import Form from '$lib/components/Form.svelte';
|
||||
</script>
|
||||
|
||||
<Area handleSubmit=''>
|
||||
<span slot="header">
|
||||
Log in
|
||||
</span>
|
||||
|
||||
<span slot='main'>
|
||||
<h2>Login</h2>
|
||||
<form action='/api/login' on:submit|preventDefault={submitFunc} method='POST'>
|
||||
<p>
|
||||
Username: <input name='user'>
|
||||
</p>
|
||||
<p>
|
||||
Password: <input type='password' name='pass'>
|
||||
</p>
|
||||
<p>
|
||||
<input type='submit' value='Log in'>
|
||||
</p>
|
||||
</form>
|
||||
</span>
|
||||
<p slot="footer">
|
||||
{#if form?.success}
|
||||
<p>{form?.success}</p>
|
||||
{/if}
|
||||
<Form action='/api/login' name='Log in'>
|
||||
<p>
|
||||
<input name='user' placeholder='Username'>
|
||||
</p>
|
||||
</Area>
|
||||
<p>
|
||||
<input type='password' name='pass' placeholder='Password'>
|
||||
</p>
|
||||
<p>
|
||||
<input type='submit' value='Log in'>
|
||||
</p>
|
||||
</Form>
|
|
@ -1,38 +1,18 @@
|
|||
<script>
|
||||
import Area from '$lib/components/Area.svelte';
|
||||
import { handleSubmit } from '$lib/util.js';
|
||||
|
||||
export let form = {};
|
||||
|
||||
let submitFunc = async e => form = JSON.parse(await handleSubmit(e))
|
||||
import Form from '$lib/components/Form.svelte';
|
||||
</script>
|
||||
|
||||
<Area handleSubmit=''>
|
||||
<span slot="header">
|
||||
Register
|
||||
</span>
|
||||
|
||||
<span slot='main'>
|
||||
<h2>Register</h2>
|
||||
<form action='/api/register' on:submit|preventDefault={submitFunc} method='POST'>
|
||||
<p>
|
||||
Username: <input name='user'>
|
||||
</p>
|
||||
<p>
|
||||
Password: <input type='password' name='pass'>
|
||||
</p>
|
||||
<p>
|
||||
Confirm Password: <input type='password' name='pass2'>
|
||||
</p>
|
||||
<p>
|
||||
<input type='submit' value='Register'>
|
||||
</p>
|
||||
</form>
|
||||
</span>
|
||||
<p slot="footer">
|
||||
{#if form?.success}
|
||||
<p>{form?.success}</p>
|
||||
{/if}
|
||||
By using the Sanifae service, you agree to the <a href='/tos'>Terms of Service</a>.
|
||||
<Form action='/api/register' name='Register'>
|
||||
<p>
|
||||
<input name='user' placeholder='Username'>
|
||||
</p>
|
||||
</Area>
|
||||
<p>
|
||||
<input type='password' name='pass' placeholder='Password'>
|
||||
</p>
|
||||
<p>
|
||||
<input type='password' name='pass2' placeholder='Password (confirm)'>
|
||||
</p>
|
||||
<p>
|
||||
<input type='submit' value='Register'>
|
||||
</p>
|
||||
</Form>
|
|
@ -1,14 +1,23 @@
|
|||
import { backend, backendProxy } from '../../../lib/db/db.js';
|
||||
import { backend, backendProxy } from '../../../../lib/db/db.js';
|
||||
|
||||
import { readFile, writeFile } from 'node:fs/promises';
|
||||
|
||||
const FILE_DIRS = [
|
||||
'upload',
|
||||
'pfp'
|
||||
]
|
||||
|
||||
/** @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}`);
|
||||
var dir = params['dir'];
|
||||
|
||||
if (FILE_DIRS.indexOf(dir) == -1) dir = FILE_DIRS[0];
|
||||
|
||||
var res = await readFile(`${process.cwd()}/db/files/${dir}/${imgName}`);
|
||||
|
||||
var response = new Response(res);
|
||||
var extension = imgName.split('.').pop();
|
|
@ -1,24 +0,0 @@
|
|||
import { VALID_EXTENSIONS } from '../../../lib/db/db.js';
|
||||
|
||||
import { readFile } 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;
|
||||
|
||||
var res = await readFile(`${process.cwd()}/db/pfp-${imgName}`);
|
||||
|
||||
var response = new Response(res);
|
||||
var extension = imgName.split('.').pop();
|
||||
|
||||
if (extension == 'svg') {
|
||||
response = new Response(res, {'headers': {
|
||||
'Content-Type': 'image/png'
|
||||
}});
|
||||
}
|
||||
return response;
|
||||
}
|
|
@ -10,7 +10,6 @@
|
|||
let uploadForm = {};
|
||||
|
||||
let userData = data.postJsonUser.data;
|
||||
let userBio = data.postJsonUserBio.data;
|
||||
|
||||
let following = data.postJsonUser.following;
|
||||
let followers = data.postJsonUser.followers;
|
||||
|
@ -37,67 +36,106 @@
|
|||
}
|
||||
|
||||
.pfp {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
margin-right: 10px;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
border-radius: 100%;
|
||||
}
|
||||
|
||||
.pfp-small {
|
||||
width: 45px;
|
||||
height: 45px;
|
||||
border-radius: 100%;
|
||||
}
|
||||
|
||||
#header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.sections {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
}
|
||||
|
||||
.sections div {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.sections div:nth-child(1) {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.profile {
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
display: flex;
|
||||
}
|
||||
</style>
|
||||
|
||||
{#if userData}
|
||||
<Area>
|
||||
<span slot="header" id='header'>
|
||||
<img class='pfp' src='/pfp/{userData.username}.png'/>
|
||||
<a href='/users/{userData.username}'>
|
||||
{userData.username}
|
||||
</a>
|
||||
<div class='profile'>
|
||||
<img class='pfp' src='/img/pfp/{userData.username}.png'/>
|
||||
<a href='/users/{userData.username}'>
|
||||
{userData.username}
|
||||
</a>
|
||||
</div>
|
||||
<div>
|
||||
<Button clickFunc={follow}>
|
||||
Follow
|
||||
</Button>
|
||||
</div>
|
||||
</span>
|
||||
<span slot="main">
|
||||
<div class='left'></div>
|
||||
<p>
|
||||
<b>Reputation:</b> {userData.reputation}
|
||||
<p class='data'>
|
||||
<span class='follower'>
|
||||
<b>{userData.reputation}</b> Reputation
|
||||
</span>
|
||||
<span class='follower'>
|
||||
<b>{userData.upvotes}</b> Upvotes
|
||||
</span>
|
||||
<span class='follower'>
|
||||
<b>{userData.downvotes}</b> Downvotes
|
||||
</span>
|
||||
</p>
|
||||
<p>
|
||||
<b>Upvotes:</b> {userData.upvotes}
|
||||
</p>
|
||||
<p>
|
||||
<b>Downvotes:</b> {userData.downvotes}
|
||||
</p>
|
||||
<h2>Roles</h2>
|
||||
<p>
|
||||
{#if userBio && userBio.rolesArr}
|
||||
{#each userBio.rolesArr as role}
|
||||
<i class='follower'>{role}</i>
|
||||
|
||||
{#if userData.rolesArr}
|
||||
<p>
|
||||
{#each userData.rolesArr as role}
|
||||
<b class='follower'>{role}</b>
|
||||
{/each}
|
||||
{/if}
|
||||
</p>
|
||||
</p>
|
||||
{/if}
|
||||
|
||||
<h2>Following</h2>
|
||||
{#each following as user}
|
||||
<a class='follower' href='/users/{user.following}'>
|
||||
<img class='pfp' src='/pfp/{user.following}.png'/>
|
||||
</a>
|
||||
{/each}
|
||||
<div class='sections'>
|
||||
<div>
|
||||
<h2>{following.length} followers</h2>
|
||||
{#each following as user}
|
||||
<a class='follower' href='/users/{user.following}'>
|
||||
<img class='pfp-small' src='/img/pfp/{user.following}.png'/>
|
||||
</a>
|
||||
{/each}
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h2>{followers.length} following</h2>
|
||||
{#each followers as user}
|
||||
<a class='follower' href='/users/{user.username}'>
|
||||
<img class='pfp-small' src='/img/pfp/{user.username}.png'/>
|
||||
</a>
|
||||
{/each}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h2>Followers</h2>
|
||||
{#each followers as user}
|
||||
<a class='follower' href='/users/{user.username}'>
|
||||
<img class='pfp' src='/pfp/{user.username}.png'/>
|
||||
</a>
|
||||
{/each}
|
||||
{#if data.resAcc.data == userData.username}
|
||||
<h2>Set PFP</h2>
|
||||
<FileUpload bind:form={uploadForm} type='small' apiUrl={'/api/pfp'}/>
|
||||
{/if}
|
||||
</span>
|
||||
<span slot="footer">
|
||||
<Button clickFunc={follow}>
|
||||
Follow
|
||||
</Button>
|
||||
|
||||
</span>
|
||||
</Area>
|
||||
{:else}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue