blink/frontend/vanilla/html/register.html

86 lines
2.2 KiB
HTML
Raw Normal View History

2023-10-18 13:03:41 +02:00
<!DOCTYPE html>
2024-03-04 16:49:36 +01:00
<html lang="en">
2023-10-18 13:03:41 +02:00
2024-03-04 16:49:36 +01:00
<head>
<meta charset="UTF-8">
<title>Sign Up to Blink</title>
<link rel="stylesheet" href="../css/login-register.css">
<script src=""></script>
</head>
2023-10-18 13:03:41 +02:00
2024-03-04 16:49:36 +01:00
<body>
<!-- partial:index.partial.html -->
<div id="login-form-wrap">
<h2>Sign Up</h2>
<form id="login-form">
2023-10-18 13:03:41 +02:00
2024-03-04 16:49:36 +01:00
<p>
<input type="text" id="displayname" name="displayname" placeholder="Your name" required><i
class="validation"><span></span><span></span></i>
</p>
2023-10-18 13:03:41 +02:00
2024-03-04 16:49:36 +01:00
<p>
<input type="email" id="email" name="email" placeholder="Email Address" required><i
class="validation"><span></span><span></span></i>
</p>
2023-10-18 13:03:41 +02:00
2024-03-04 16:49:36 +01:00
<p>
<input type="password" id="password" name="password" placeholder="Password" required><i
class="validation"><span></span><span></span></i>
</p>
2024-03-04 09:09:11 +01:00
2024-03-04 16:49:36 +01:00
<p>
<button type="button" onclick="register()">Register</button>
</p>
</form>
<div id="create-account-wrap">
<p>Already a member? <a href="./login.html">Login</a>
<p>
</div>
</div>
2023-10-18 15:02:34 +02:00
2024-03-04 16:49:36 +01:00
<script src="../js/constants.js"></script>
<script src="../js/utils.js"></script>
<script>
function register() {
const display_name = document.getElementById('displayname').value;
const email = document.getElementById('email').value;
const password = document.getElementById('password').value;
if (!display_name || !email || !password) {
alert('Please fill in all fields');
return;
}
2023-10-18 13:03:41 +02:00
2024-03-04 16:49:36 +01:00
const options = {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({
display_name,
email,
password
}),
};
2024-03-06 10:19:37 +01:00
fetch(`${API_URL}/persons`, options)
2024-03-04 16:49:36 +01:00
.then(response => {
if (response.ok) {
alert("Congratulations! You've successfully registered to Blink." +
" Please click on the e-mail we sent you to confirm your account");
window.location.href = '/login.html';
}
})
.catch(err => {
alert("An error has occurred :-( please try again later")
console.error(err);
});
}
</script>
2023-10-18 15:17:04 +02:00
2024-03-04 16:49:36 +01:00
</body>
2023-10-18 13:03:41 +02:00
2024-03-04 16:49:36 +01:00
</html>