kosh/unnamed-password-manager
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add all other pages

Browse Source
This commit is contained in:
Modo 2023-10-15 21:14:26 +05:30
parent 08c11d4f6e
commit c03a80c66d
9 changed files with 233 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

47
frontend/dashboard.css Normal file
View File

@ -0,0 +1,47 @@
* {
box-sizing: border-box;
margin: none;
}
body {
background-color: rgb(255, 255, 255);
display: flex;
margin-top: 25px;
align-items: center;
justify-content: center;
background-image: url("bg.jpg");
background-size: cover;
background-position: center;
background-repeat: no-repeat;
}
.wrapper {
display: flex;
width: 90vw;
height: 90vh;
align-items: center;
justify-content: center;
}
.container {
display: flex;
background-color: rgb(255, 255, 255,0.2);
backdrop-filter: blur(15px);
border-radius: 30px;
width: 90vw;
height: 80vh;
box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.8);
}
footer{
position: fixed;
bottom: 0px;
background-color: rgb(12, 12, 12);
height: 50px;
width: 100vw;
}
footer p{
color: white;
text-align: center;
}

20
frontend/dashboard.html Normal file
View File

@ -0,0 +1,20 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="CONTENT-TYPE" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>DashBoard</title>
<link rel="stylesheet" href="dashboard.css"/>
</head>
<body>
<div class="wrapper">
<div class="container">
</div>
</div>
<script src="index.js"></script>
</body>
<footer><p>© 2023 Password Manager</p></footer>
</html>

0
frontend/dashboard.js Normal file
View File

0
frontend/style.css → frontend/index.css
View File

6
frontend/index.html
View File

@ -3,7 +3,7 @@
<html> <html>
<head> <head>
<meta http-equiv="CONTENT-TYPE" content="text/html; charset=UTF-8"> <meta http-equiv="CONTENT-TYPE" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="style.css"/> <link rel="stylesheet" href="index.css"/>
<title>Login</title> <title>Login</title>
<link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
@ -24,10 +24,10 @@
<div class="help"> <div class="help">
<div> <div>
<a href="">Forgot Password</a> <a href="" id="forgot_password">Forgot Password</a>
</div> </div>
<div> <div>
<a href="">Register</a> <a href="register.html" id="register">Register</a>
</div> </div>
</div> </div>

39
frontend/index.js
View File

@ -5,14 +5,12 @@ loginb.addEventListener("click", validateLogin);
function validateName() { function validateName() {
var name = document.getElementById("username").value; var name = document.getElementById("username").value;
if(name=='' || name==null){ if(name=='' || name==null){
// console.log("falsevn");
document.getElementById("errlabel").innerHTML = "Enter Username!"; document.getElementById("errlabel").innerHTML = "Enter Username!";
setTimeout(()=> { setTimeout(()=> {
document.getElementById("errlabel").innerHTML = ""; document.getElementById("errlabel").innerHTML = "";
},3000) },3000)
return false; return false;
} else { } else {
// console.log("truevn");
return true; return true;
} }
} }
@ -20,14 +18,12 @@ var name = document.getElementById("username").value;
function validatePass() { function validatePass() {
var pass = document.getElementById("password").value; var pass = document.getElementById("password").value;
if(pass=='' || pass==null){ if(pass=='' || pass==null){
// console.log("falsevp");
document.getElementById("errlabel").innerHTML = "Enter Password!"; document.getElementById("errlabel").innerHTML = "Enter Password!";
setTimeout(()=> { setTimeout(()=> {
document.getElementById("errlabel").innerHTML = ""; document.getElementById("errlabel").innerHTML = "";
},3000) },3000)
return false; return false;
} else { } else {
// console.log("truevp");
return true; return true;
} }
} }
@ -51,14 +47,14 @@ console.log(formData)
try { try {
const response = await fetch('/login', { const response = await fetch('/login', {
method: "post", method: "post",
/*headers: { /* headers: {
'Content-Type': 'application/json' 'Content-Type': 'application/json'
}*/ }*/
body: formData body: formData
}); });
if(response.ok) { if(response.ok) {
//next page window.location.href = "dashboard.html";
} else if(!response.ok) { } else if(!response.ok) {
if (response.status === 403) { if (response.status === 403) {
const error = new Error('Access denied: You do not have permission to access this resource.'); const error = new Error('Access denied: You do not have permission to access this resource.');
@ -66,17 +62,18 @@ console.log(formData)
setTimeout(()=> { setTimeout(()=> {
document.getElementById("errlabel").innerHTML = ""; document.getElementById("errlabel").innerHTML = "";
},3000) },3000)
console.log(response)
throw error; throw error;
} }
} }
//error //error
/*const errorData = await response.json(); const errorData = await response.json();
if (response.status === 401) { if (response.status === 401) {
throw new Error('Invalid username or password') throw new Error('Invalid username or password')
} else { } else {
throw new Error(errorData.error) throw new Error(errorData.error)
}*/ }
// const data = await response.json(); // const data = await response.json();
// const token = data.token; // const token = data.token;
@ -91,9 +88,33 @@ console.log(formData)
console.log("Failed Server") console.log("Failed Server")
} }
} }
} }
const register = document.getElementById("register");
register.addEventListener("click", function(event) {
event.preventDefault();
window.location.href = "register.html";
});
// function handleAuthRes(data) { // function handleAuthRes(data) {
// if(data.token){ // if(data.token){
// localStorage.setItem('token', data.token); // localStorage.setItem('token', data.token);

102
frontend/register.css Normal file
View File

@ -0,0 +1,102 @@
* {
box-sizing: border-box;
}
body {
background-color: dimgrey;
display: flex;
margin-top: 25px;
align-items: center;
justify-content: center;
background-image: url("bg.jpg");
background-size: cover;
background-position: center;
background-repeat: no-repeat;
}
.wrapper {
display: flex;
width: 90vw;
height: 90vh;
align-items: center;
justify-content: center;
}
.container {
display: flex;
background-color: transparent;
backdrop-filter: blur(20px);
justify-content: center;
align-items: center;
width: 450px;
height: 400px;
flex-direction: column;
padding: 70px;
padding-bottom: 90px;
box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.6);
row-gap: 8px;
border-radius: 50px;
}
.input {
width: 300px;
height: 30px;
background-color: transparent;
color: rgb(255, 255, 255, 0.8);
box-shadow: 2px 2px 3px rgb(0, 0, 0, 0.5);
border: none;
border-top: rgba(255, 255, 255, 0.2) 2px solid;
border-left: rgb(255, 255, 255, 0.2) 2px solid;
border-radius: 10px;
padding-left: 5px;
}
.idiv p {
color: white;
font-family: 'Pixelify Sans', cursive;
margin-left: 5px;
}
#username::placeholder {
color: rgb(255, 255, 255, 0.5);
padding-left: 5px;
}
#password::placeholder {
color: rgb(255, 255, 255, 0.5);
padding-left: 5px;
}
.idiv {
display: flex;
flex-direction: column;
row-gap: 10px;
justify-content: center;
padding: 7px;
}
.idiv p{
padding: none;
margin: none;
display: absolute;
translate: 0px 12px;
}
#loginb {
background-color: transparent;
color: rgb(255, 255, 255, 0.8);
padding: 7px;
margin-top: 20px;
margin-bottom: 20px;
width: 150px;
box-shadow: 2px 2px 5px rgb(0, 0, 0, 0.5);
translate: 0px -5px;
font-family: 'Pixelify Sans', cursive;
font-size: 20px;
border-radius: 10px;
}
#loginb:active {
background-color: rgb(155, 155, 155, 0.3);
}

31
frontend/register.html Normal file
View File

@ -0,0 +1,31 @@
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="CONTENT-TYPE" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="register.css"/>
<title>Register</title>
<body>
<div class="wrapper">
<div class="container">
<div>
<p id="login">Register</p>
</div>
<div class="idiv">
<input class="input" id="username" type="text" placeholder="Username">
<input class="input" id="password" type="password" placeholder="Pasword">
</div>
<div class="buttons">
<button id="loginb">Login</button>
</div>
</div>
</div>
<script src="register.js"></script>
</body>
<footer><p>© 2023 Password Manager</p></footer>
</html>

0
frontend/register.js Normal file
View File