diff --git a/src/app.html b/src/app.html index e98981e..e1dde07 100644 --- a/src/app.html +++ b/src/app.html @@ -6,7 +6,7 @@ %sveltekit.head% - +
%sveltekit.body%
diff --git a/src/lib/index.ts b/src/lib/index.ts deleted file mode 100644 index 856f2b6..0000000 --- a/src/lib/index.ts +++ /dev/null @@ -1 +0,0 @@ -// place files you want to import through the `$lib` alias in this folder. diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index d793024..653d746 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -5,6 +5,7 @@ import hljs from 'highlight.js'; import 'highlight.js/styles/github-dark.css'; import { storeHighlightJs } from '@skeletonlabs/skeleton'; + import { page } from '$app/stores'; storeHighlightJs.set(hljs); // asset loading @@ -18,9 +19,11 @@ - {#each images as item} - - {/each} + {#if !page.user} + {#each images as item} + + {/each} + {/if} diff --git a/src/routes/login/+page.server.js b/src/routes/login/+page.server.js index e69de29..593ed5d 100644 --- a/src/routes/login/+page.server.js +++ b/src/routes/login/+page.server.js @@ -0,0 +1,35 @@ +import * as api from '../../lib/api'; +import { fail, redirect } from '@sveltejs/kit'; +import { MAX_COOKIE_AGE } from '../../lib/constants.ts'; + +export async function load({ locals }) { + if (locals.user) { + throw redirect(300, '/'); + } +} +export const actions = { + default: async ({ cookies, request }) => { + const data = await request.formData(); + const username = data.get('username')?.toString(); + const password = data.get('password')?.toString(); + + if (!username || !password) { + return fail(400, { username, password }); + } + const res = await api.login(username, password); + const responseData = res; + + if (responseData.error) { + const errorDetail = responseData.error.detail ? responseData.error.detail : 'Unknown error'; + return fail(400, { message: errorDetail }); + } else { + if (responseData.data) { + const value = btoa(JSON.stringify(responseData)); + cookies.set('user', value, { path: '/', maxAge: MAX_COOKIE_AGE }); + throw redirect(300, '/'); + } else { + return fail(400, { message: 'Response data is undefined' }); + } + } + } +}; diff --git a/src/routes/login/+page.svelte b/src/routes/login/+page.svelte index f6fedcd..fe7cb5b 100644 --- a/src/routes/login/+page.svelte +++ b/src/routes/login/+page.svelte @@ -8,6 +8,8 @@ // picture switching function and attributes let picture: string = 'assets/image-1.png'; let picNum: number = 1; + let username: string = ''; + let password: string = ''; function pictureSwitch(n: number): number { if (n < 5) { @@ -54,6 +56,7 @@ name="username" placeholder="Username" class=" w-full variant-form-material" + bind:value={username} required /> @@ -66,6 +69,7 @@ name="password" placeholder="*********" class=" w-full variant-form-material" + bind:value={password} required /> @@ -80,13 +84,17 @@ > {#if form?.message} -
+
Password or Username in incorrect
{/if}
- + {#if /\s/.test(username) || password.length < 8} + + {:else} + + {/if}