uni-days/ittech
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

W5 done

Browse source
This commit is contained in:
Andrew 2022-02-23 02:37:30 +07:00
parent 0e2c114a84
commit 2c5995be3f
13 changed files with 632 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

13
w5/templates/dashboard.html Normal file
View file

@ -0,0 +1,13 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Dashboard</title>
</head>
<body>
<h2>Hello, {{user.name}} you are {{user.status}}</h2>
<button onclick="javascript:(location += '/logout')">Log out</button>
</body>
</html>

52
w5/templates/login.html Normal file
View file

@ -0,0 +1,52 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Login page</title>
</head>
<body>
<div id="errors"></div>
<h3>Login page</h3>
<form action="/login" method="post" name="login">
<label for="login">Login</label>
<input type="text" name="login" id="login" required />
<br />
<label for="password">Password</label>
<input type="password" name="password" id="password" required />
</form>
<br />
<button id="login">Login</button>
<br />
<a href="/register">No accoount? Register here!</a>
</body>
<script>
const init = function () {
const btn = document.querySelector("button#login");
btn.addEventListener("click", async () => {
btn.textContent = "Loading...";
let formData = Array.from(document.forms.login, e => [e.name, encodeURIComponent(e.value)].join("=")).join("&");
try {
const jsonData = await (
await fetch("/login", {
method: "post",
body: formData,
})
).json();
if (jsonData.ok) {
location = "/dashboard";
} else {
alert(jsonData.message);
btn.textContent = "Login";
}
} catch (e) {
alert(e.message);
btn.textContent = "Login";
}
});
};
document.addEventListener("DOMContentLoaded", init);
</script>
</html>

60
w5/templates/register.html Normal file
View file

@ -0,0 +1,60 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Registration page</title>
</head>
<body>
<div id="errors"></div>
<h3>Registration page</h3>
<form action="/register" method="post" name="register">
<label for="login">Login</label>
<input type="text" name="login" id="login" required />
<br />
<label for="password">Password</label>
<input type="password" name="password" id="password" required />
<label for="passwordRepeated">Repeat password</label>
<input
type="password"
name="passwordRepeated"
id="passwordRepeated"
required
/>
</form>
<br />
<button id="register">Register</button>
<br />
<a href="/login">Already have an accoount? Login here!</a>
</body>
<script>
const init = function () {
const btn = document.querySelector("button#register");
btn.addEventListener("click", async () => {
btn.textContent = "Loading...";
let formData = Array.from(document.forms.register, e => [e.name, encodeURIComponent(e.value)].join("=")).join("&");
try {
const jsonData = await (
await fetch("/register", {
body: formData,
method: "post",
})
).json();
if (jsonData.ok) {
location = "/login";
} else {
alert(jsonData.message);
btn.textContent = "Register";
}
} catch (e) {
alert(e.message);
btn.textContent = "Register";
}
});
};
document.addEventListener("DOMContentLoaded", init);
</script>
</html>