blink/frontend/vanilla/html/login.html

62 lines
1.7 KiB
HTML
Raw Normal View History

2023-09-27 12:18:29 +02:00
<!DOCTYPE html>
<html lang="en" >
2023-10-18 15:36:43 +02:00
<head>
<meta charset="UTF-8">
<title>HTML5 Login Form with validation Example</title>
<link rel="stylesheet" href="../css/login-register.css">
</head>
<body>
<!-- partial:index.partial.html -->
<div id="login-form-wrap">
<h2>Login</h2>
<form id="login-form" method="POST">
<p>
<input type="email" id="email" name="email" placeholder="Email Address" required><i class="validation"><span></span><span></span></i>
</p>
<p>
<input type="password" id="password" name="password" placeholder="Password" required><i class="validation"><span></span><span></span></i>
</p>
<p>
<button type="button" onclick="login()">Login</button>
</p>
</form>
<div id="create-account-wrap">
<p>Not a member? <a href="./register.html">Create Account</a><p>
</div>
</div>
<script>
function login() {
const email = document.getElementById("email").value;
const password = document.getElementById("password").value;
if(!email || !password){
return;
}
const options = {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({ email, password }),
};
fetch('http://localhost:3000/blinkapi/login', options)
.then(response => {})
.then(data => {
document.cookie = `token=${data.token};`;
})
.catch(err => {
alert("An error has occurred :-( please try again later")
console.error(err);
});
}
</script>
</body>
2023-09-27 12:18:29 +02:00
</html>