From 58e1ffa9effc92f5ddebee4068d5931be12201b0 Mon Sep 17 00:00:00 2001
From: Maksymilian Jopek <maks@jopek.eu>
Date: Thu, 10 Mar 2022 15:39:25 +0100
Subject: Initial commit w/ v1.0.0

---
 frontend/src/Login.svelte | 74 +++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 74 insertions(+)
 create mode 100644 frontend/src/Login.svelte

(limited to 'frontend/src/Login.svelte')

diff --git a/frontend/src/Login.svelte b/frontend/src/Login.svelte
new file mode 100644
index 0000000..674ca47
--- /dev/null
+++ b/frontend/src/Login.svelte
@@ -0,0 +1,74 @@
+<script lang="ts">
+  export let whereami: string;
+  import { postToServer } from "./utils";
+
+  let pt = "";
+  let mode = "login",
+    // email = "maks@maks.pl",
+    email = "asd@asd",
+    login = "maks",
+    password = "qwerty";
+
+  async function register() {
+    const res = await postToServer(
+      "/login",
+      { email, login, password, mode },
+      true
+    );
+    console.log(res);
+    if (res === "ok") {
+      whereami = "books";
+    } else {
+      pt = "Wrong login or password";
+    }
+  }
+</script>
+
+<main>
+  {#if mode === "register"}
+    <label for="email">Email:</label>
+    <input bind:value={email} type="email" id="email" maxlength="254" /><br
+    /><br />
+  {/if}
+  <label for="login">Login:</label>
+  <input bind:value={login} type="text" id="login" maxlength="256" /><br /><br
+  />
+  <label for="password">Password:</label>
+  <input bind:value={password} type="password" id="password" /><br /><br />
+  <button type="button" on:click={register}>
+    {mode === "login" ? "Login" : "Register"}
+  </button><br /><br />
+  <label for="mode">Register:</label>
+  <input
+    type="checkbox"
+    id="mode"
+    on:click={() => (mode = mode === "login" ? "register" : "login")}
+  />
+  <p>{pt}</p>
+</main>
+
+<style>
+  :root {
+    font-family: "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell;
+  }
+
+  main {
+    text-align: center;
+    padding: 1em;
+    margin: 0 auto;
+    font-size: 2em;
+  }
+  input,
+  button {
+    font-size: 1em;
+    margin-left: 10px;
+  }
+  input[type="checkbox"] {
+    width: 25px;
+    height: 25px;
+  }
+
+  p {
+    color: red;
+  }
+</style>
-- 
cgit v1.3.1

