A lot of stuff

This commit is contained in:
tdgmdev 2023-03-09 19:12:17 -05:00
parent a1c9b30cf6
commit ad969e5807
13 changed files with 227 additions and 167 deletions

View file

@ -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>

View file

@ -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>

View file

@ -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>

View file

@ -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();

View file

@ -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;
}

View file

@ -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}