From d2c2cc62a4c2e1ac10f8434bea7bb834da820869 Mon Sep 17 00:00:00 2001
From: lonkaars <l.leblansch@gmail.com>
Date: Sat, 16 Jan 2021 11:40:36 +0100
Subject: semi working next project

---
 pages/login.tsx | 71 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 71 insertions(+)
 create mode 100644 pages/login.tsx

(limited to 'pages/login.tsx')

diff --git a/pages/login.tsx b/pages/login.tsx
new file mode 100644
index 0000000..8528a39
--- /dev/null
+++ b/pages/login.tsx
@@ -0,0 +1,71 @@
+import { v4 as uuidv4 } from 'uuid';
+import axios from 'axios';
+
+import { NavBar } from '../components/navbar';
+import { CenteredPage } from '../components/page';
+import { Vierkant, Input, Button } from '../components/ui';
+
+var ids = {
+	email: uuidv4(),
+	password: uuidv4()
+}
+
+function submitLogin() {
+	var formData = {
+		email: (document.getElementById(ids.email) as HTMLInputElement).value,
+		password: (document.getElementById(ids.password) as HTMLInputElement).value
+	}
+
+	if ( !formData.email ||
+		 !formData.password ) {
+		alert("Vul alsjeblieft alle velden in!");
+		return;
+	}
+
+	axios({
+		method: "post",
+		url: `${window.location.origin}/api/auth/login`,
+		headers: {"content-type": "application/json"},
+		data: formData
+	})
+	.then(() => window.location.pathname = "/")
+	.catch(error => {
+		if (error.response.status === 401) {
+			alert("Verkeerde gebruikersnaam/wachtwoord combinatie!")
+			return;
+		}
+		alert("Er is iets fout gegaan!");
+	});
+}
+
+export default function LoginPage() {
+	return (
+		<div>
+			<NavBar/>
+			<CenteredPage width={500} style={{ height: "100vh" }}>
+				<div style={{
+					position: "relative",
+					top: "50%",
+					transform: "translateY(-50%)",
+					margin: "0 auto",
+					textAlign: "center"
+				}}>
+					<Vierkant>
+						<Input id={ids.email} label="email of gebruikersnaam" style={{ marginBottom: 12 }}></Input>
+						<Input id={ids.password} label="wachtwoord" type="password"></Input>
+						<div style={{
+							marginTop: 24,
+							gridGap: 24,
+							display: "grid",
+							gridTemplateColumns: "1fr 1fr"
+						}}>
+							<Button href="/register" text="Registreren" style={{ backgroundColor: "var(--background-alt)"}}></Button>
+							<Button text="Inloggen" onclick={submitLogin}></Button>
+						</div>
+					</Vierkant>
+				</div>
+			</CenteredPage>
+		</div>
+	);
+}
+
-- 
cgit v1.2.3


From f1d88fef2107f0d62ed0ab9d01bc97cb057e1d39 Mon Sep 17 00:00:00 2001
From: lonkaars <l.leblansch@gmail.com>
Date: Tue, 26 Jan 2021 21:06:15 +0100
Subject: fixed login page id's

---
 pages/login.tsx | 13 ++++---------
 1 file changed, 4 insertions(+), 9 deletions(-)

(limited to 'pages/login.tsx')

diff --git a/pages/login.tsx b/pages/login.tsx
index 8528a39..0061c70 100644
--- a/pages/login.tsx
+++ b/pages/login.tsx
@@ -5,15 +5,10 @@ import { NavBar } from '../components/navbar';
 import { CenteredPage } from '../components/page';
 import { Vierkant, Input, Button } from '../components/ui';
 
-var ids = {
-	email: uuidv4(),
-	password: uuidv4()
-}
-
 function submitLogin() {
 	var formData = {
-		email: (document.getElementById(ids.email) as HTMLInputElement).value,
-		password: (document.getElementById(ids.password) as HTMLInputElement).value
+		email: (document.getElementById("email") as HTMLInputElement).value,
+		password: (document.getElementById("password") as HTMLInputElement).value
 	}
 
 	if ( !formData.email ||
@@ -51,8 +46,8 @@ export default function LoginPage() {
 					textAlign: "center"
 				}}>
 					<Vierkant>
-						<Input id={ids.email} label="email of gebruikersnaam" style={{ marginBottom: 12 }}></Input>
-						<Input id={ids.password} label="wachtwoord" type="password"></Input>
+						<Input id="email" label="email of gebruikersnaam" style={{ marginBottom: 12 }}></Input>
+						<Input id="password" label="wachtwoord" type="password"></Input>
 						<div style={{
 							marginTop: 24,
 							gridGap: 24,
-- 
cgit v1.2.3