Skip to content

Commit

Permalink
some backend linking for the password reset
Browse files Browse the repository at this point in the history
  • Loading branch information
@DDDrag0
DDDrag0 committed Jan 10, 2024
1 parent a8ee89a commit ce320fc
Show file tree
Hide file tree
Showing 3 changed files with 150 additions and 50 deletions.
4 changes: 2 additions & 2 deletions src/main/java/model/service/login/Authenticator.java
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ public void setEncryption(Encryption encryption) {
@Override
public String sendPin(String email) {
if(email.equals("[email protected]")) {
return "12345678";
return "1234";
}
else {
String pin = generatePin();
Expand All @@ -50,7 +50,7 @@ String generatePin() {
String digits = "0123456789";
String pin = "";

for(int i = 0; i < 8; i++) {
for(int i = 0; i < 4; i++) {
pin += digits.charAt(random.nextInt(digits.length()));
}

Expand Down
171 changes: 130 additions & 41 deletions src/main/webapp/JS/changePasswLogin.js
View file
Original file line number Diff line number Diff line change
@@ -1,56 +1,145 @@
var currentSquare = 0;
const resetEmail = $("#resetEmail");
const c1 = $("#c1");
const c2 = $("#c2");
const c3 = $("#c3");
const c4 = $('#c4');
const resetButton = $("#resetPassword");
const newPasswordError = $(".error");
const newPassword = $("#newPassword");
const repeatNewPassword = $("#repeatNewPassword");
const contextPath = window.location.pathname.substring(0, window.location.pathname.indexOf("/",2));

function focusInput(squareIndex) {
currentSquare = squareIndex;
updateSquares();
}

document.addEventListener('keydown', function(event) {
var key = event.key;
if (key >= '0' && key <= '9') {
var squareId = 'square' + currentSquare;
var square = document.getElementById(squareId);
square.textContent = key;
let THEPASSWORD;

currentSquare++;
if (currentSquare > 3) {
currentSquare = 0;
}
newPassword.on("input", validatePassword);
repeatNewPassword.on("input", validatePassword);

$(document).ready(function startUp() {

var currentSquare = 0;

function focusInput(squareIndex) {
currentSquare = squareIndex;
updateSquares();
}
});

function updateSquares() {
for (var i = 0; i < 4; i++) {
var squareId = 'square' + i;
var square = document.getElementById(squareId);
square.style.backgroundColor = (i === currentSquare) ? '#c0c0c0' : '';
document.addEventListener('keydown', function(event) {

var key = event.key;

if (key >= '0' && key <= '9') {
var squareId = 'square' + currentSquare;
var square = document.getElementById(squareId);
square.textContent = key;

currentSquare++;
if (currentSquare > 3) {
currentSquare = 0;
}
updateSquares();
}
});

function updateSquares() {
for (var i = 0; i < 4; i++) {
var squareId = 'square' + i;
var square = document.getElementById(squareId);
square.style.backgroundColor = (i === currentSquare) ? '#c0c0c0' : '';
}
}
}
$("#sendPin").click((event) => {
console.log("Send Pin button clicked");
event.preventDefault();
$.post(`${contextPath}/login/reset`, {email: resetEmail.val()}, function(response) {
response = response.trim(); // Trim the response
if(response == "NA") {
// Here, the servlet will return "NA" if it could not find the email
alert("Email non registrata nel nostro sistema. Verificane la correttezza");
} else {
sessionPin = response; // Save the response, which should be your pin
c1.hide();
c2.show();
}
});
});

function b1() {
document.querySelector("#c1").style.display = "none";
document.querySelector("#c2").style.display = "";
}
$("#confirmPin").click((event) => {
event.preventDefault();
var data = '';
for (var i = 0; i < 4; i++) {
var squareId = 'square' + i;
var square = document.getElementById(squareId);
data += square.textContent || '0';
}
if (data === sessionPin) {
// if the PIN entered matches the saved PIN, proceed to step 3
c2.hide();
c3.show();
} else {
alert('The pin is incorrect');
}
});

$("#resetPassword").click(function(event) {
event.preventDefault();
$.post(`${contextPath}/login/resetpassword`, {
email: $("#resetEmail").val(),
newPassword: $("#newPassword").val()
})
.done(function(data) {
c3.hide();
c4.show();
})
.fail(function(err) {
console.log(err);
});
});

$("#gotoLogin").click(function(event) {
event.preventDefault();
window.location.href = 'login.jsp';
});

});

function validatePassword() {
THEPASSWORD = newPassword.val();
let confirmPassword = repeatNewPassword.val();

let check1 = false;
let check2 = false;

function b2() {
var data = '';
for (var i = 0; i < 4; i++) {
var squareId = 'square' + i;
var square = document.getElementById(squareId);
data += square.textContent || '0';
let regex = new RegExp("^(?=.*[A-Z])(?=.*[a-z])(?=.*\\d)(?=.*[@$!%*?&])[A-Za-z\\d@$!%*?&]{12,}$");

if (!(regex.test(THEPASSWORD))) {
showError("Non contiene un carattere maiuscolo, minuscolo, cifra speciale e non lunga 12.");
check1 = false;
}
if (regex.test(THEPASSWORD)) {
showError("");
check1 = true;
}
alert('Dati inseriti: ' + data);
document.querySelector("#c2").style.display = "none";
document.querySelector("#c3").style.display = "";
}

function b3() {
if (THEPASSWORD !== confirmPassword) {
showError("Le password non coincidono.");
check2 = false;
}
if (THEPASSWORD === confirmPassword) {
showError("");
check2 = true;
}

document.querySelector("#c3").style.display = "none";
document.querySelector("#c4").style.display = "";
if(check1 && check2) {
resetButton.prop('disabled', false);
}
}

function b4() {
window.location.href = 'login.jsp';
function showError(message) {
newPasswordError.text(message);
newPasswordError.addClass('error active');
// Removes 'active' class when there is no error
if (!message) {
newPasswordError.removeClass('error active');
}
}
25 changes: 18 additions & 7 deletions src/main/webapp/JSP/changePasswLogin.jsp
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,16 +3,21 @@
<head>
<meta charset="utf-8" />
<link rel="stylesheet" href="../CSS/changePasswLogin.css" />
<script src="https://code.jquery.com/jquery-3.6.4.min.js"></script>
</head>
<body>
<div class="container">

<!-- Email input -->
<div class="card" id="c1">
<div class="discovering-english">Password dimenticata?</div>
<p class="chapter"> Inserisci la tua email, ti invieremo un codice di<br>
conferma e potrai procedere al reset della password</p>
<input class="box" placeholder="email" type="email" />
<button class="button" onclick="b1()"><div class="text-wrapper">Verifica</div></button>
<input class="box" placeholder="email" id="resetEmail" type="email">
<button class="button" id="sendPin">Verifica</button>
</div>

<!-- PIN input -->
<div class="card" id="c2" style="display: none;">
<div class="discovering-english">Inserisci Codice di Verifica</div>
<p class="chapter"> Se hai fornito l’email correttamente, Inserisci <br>
Expand All @@ -24,20 +29,26 @@
<div class="square" onclick="focusInput(3)" id="square3"></div>
</div>
<p class="chapter">Non hai ricevuto il codice?Rimanda</p>
<button class="button" onclick="b2()">Invia</button>
<button class="button" id="confirmPin">Conferma</button>
</div>

<!-- New password input -->
<div class="card" id="c3"style="display: none;">
<div class="discovering-english">Crea nuova Password</div>
<p class="chapter">Inserisci la nuova password per il login</p>
<input class="box" placeholder="password" type="password" pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{12,}" title="La password deve contenere almeno un numero, una lettera maiuscola e una minuscola, e deve avere almeno 12 caratteri." required/>
<input class="box" placeholder="ripeti password" type="password" pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{12,}" title="La password deve contenere almeno un numero, una lettera maiuscola e una minuscola, e deve avere almeno 12 caratteri." required/>
<button class="button" onclick="b3()"><div class="text-wrapper">Reset Password</div></button>
<input class="box" id="newPassword" placeholder="Nuova Password" type="password">
<input class="box" id="repeatNewPassword" placeholder="Ripeti Password" type="password">
<span class="error" aria-live="polite"></span>
<button class="button" id="resetPassword" disabled>Cambia Password</button>
</div>

<!-- Login Redirect -->
<div class="card" id="c4" style="display: none;"><img class="done-px" src="../images/done-24px-1.svg" />
<div class="discovering-english">Confermato</div>
<p class="chapter">Hai resettato correttamente la tua password.</p>
<button class="button" onclick="b4()"><div class="text-wrapper">Login</div></button>
<button class="button" id="gotoLogin">Login</button>
</div>

</div>
<script src="../JS/changePasswLogin.js"></script>
</body>
Expand Down

0 comments on commit ce320fc

Please sign in to comment.