Skip to content

Commit 175fddf

Browse files
vntcorevntcore
committed
Add signup page
1 parent 4cb2fc1 commit 175fddf

1 file changed

Lines changed: 106 additions & 0 deletions

File tree

‎signup.html‎

Lines changed: 106 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,106 @@
1+
<!DOCTYPE html>
2+
<html lang="it">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>Sign up</title>
7+
8+
<link href="assets/css/bootstrap.min.css" rel="stylesheet">
9+
<link href="assets/css/style.css" rel="stylesheet">
10+
11+
<script type="text/javascript" src="assets/js/jquery.min.js"></script>
12+
<script type="text/javascript" src="assets/js/qrcode.js"></script>
13+
</head>
14+
15+
<body>
16+
<!-- Modal -->
17+
<div class="modal fade" id="wModal" tabindex="-1" aria-labelledby="wModalLabel" aria-hidden="true">
18+
<div class="modal-dialog">
19+
<div class="modal-content">
20+
<div class="modal-header">
21+
<h5 class="modal-title" id="wModalLabel">TOTP secret key</h5>
22+
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
23+
</div>
24+
<div class="modal-body">
25+
<center>
26+
<div id="qrcode" style="width:200px; height:200px;margin-bottom:25px;"></div>
27+
Scan this QR code in your authenticator app or enter the code manually:<br>
28+
<b id="secretTOTPkey"></b>
29+
</center>
30+
</div>
31+
<div class="modal-footer">
32+
<button type="button" class="btn btn-primary" data-bs-dismiss="modal" onclick="window.location.href = 'login.html'">Close</button>
33+
</div>
34+
</div>
35+
</div>
36+
</div>
37+
38+
<div class="login-container">
39+
<h2>Sign Up</h2>
40+
<form>
41+
<input id="username_txt" type="text" placeholder="Username" required>
42+
<input id="password_txt" type="password" placeholder="Password" required>
43+
<input id="confirmPassword_txt" type="password" placeholder="Confirm password" required>
44+
<button id="signupBtn" type="button">Sign Up</button>
45+
</form>
46+
<a href="login.html">Already have an account? Log in</a>
47+
</div>
48+
49+
<script>
50+
const signupBtn = document.getElementById("signupBtn");
51+
52+
const username_txt = document.getElementById("username_txt");
53+
const password_txt = document.getElementById("password_txt");
54+
const confirmPassword_txt = document.getElementById("confirmPassword_txt");
55+
56+
signupBtn.addEventListener("click", function() {
57+
if(password_txt.value != confirmPassword_txt.value) {
58+
alert("The passwords you entered do not match, please check and try again");
59+
}
60+
61+
else
62+
{
63+
const data = {
64+
"username": username_txt.value,
65+
"password": password_txt.value
66+
};
67+
68+
fetch("http://localhost:3000/api/signup",
69+
{
70+
method: "POST",
71+
headers: {
72+
"Content-Type": "application/json"
73+
},
74+
body: JSON.stringify(data)
75+
})
76+
.then(response => response.json())
77+
.then(data => {
78+
let stat_code = data["STATUS_CODE"];
79+
80+
if(stat_code == 201) {
81+
document.getElementById("secretTOTPkey").innerText = data["TOTP_SECRET_KEY"];
82+
83+
qrcode.makeCode("otpauth://totp/0xVent:" + username_txt.value + "?secret=" + data["TOTP_SECRET_KEY"] + "&issuer=0xVent");
84+
var modal = new bootstrap.Modal(document.getElementById('wModal'));
85+
modal.show();
86+
87+
username_txt.value = "";
88+
password_txt.value = "";
89+
confirmPassword_txt.value = "";
90+
}
91+
92+
else {
93+
alert("An error occurred:\nSTATUS CODE: " + stat_code + "\n\n" + data["MESSAGE"]);
94+
}
95+
});
96+
}
97+
});
98+
99+
var qrcode = new QRCode(document.getElementById("qrcode"), {
100+
width : 200,
101+
height : 200
102+
});
103+
</script>
104+
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
105+
</body>
106+
</html>

0 commit comments

Comments
 (0)