From 0477e1e60ddda1a6b431e956229cda6920cc0628 Mon Sep 17 00:00:00 2001
From: Alessandro Ferro <49845537+xfarrow@users.noreply.github.com>
Date: Tue, 26 Mar 2024 23:27:52 +0100
Subject: [PATCH] Update reset-password.html

---
 frontend/vanilla/html/reset-password.html | 35 ++++++++++++++++++++---
 1 file changed, 31 insertions(+), 4 deletions(-)

diff --git a/frontend/vanilla/html/reset-password.html b/frontend/vanilla/html/reset-password.html
index acf022f..5ef75b2 100644
--- a/frontend/vanilla/html/reset-password.html
+++ b/frontend/vanilla/html/reset-password.html
@@ -54,10 +54,9 @@
     <script>
         window.addEventListener("load", function () {
             const secret = new URLSearchParams(window.location.search).get('secret');
-            if(!secret){
+            if (!secret) {
                 alert('Invalid URL');
-            }
-            else{
+            } else {
                 document.body.style.display = "block"; // Show page
             }
         });
@@ -80,16 +79,44 @@
             if (response.ok) {
                 showSuccessAlert('Your password has been changed. You can now <a href="/login.html">log in</a>');
             } else {
-                showErrorAlert('URL either not valid or the link has expired. Please require another <a href="forgot-password.html">password reset</a>');
+                showErrorAlert(
+                    'URL either not valid or the link has expired. Please require another <a href="forgot-password.html">password reset</a>'
+                    );
             }
         }
 
         function passwordLosesFocus() {
+            const passwordField = document.getElementById("password");
 
+            if(!passwordField.value){
+                passwordField.classList.add("is-invalid");
+                document.getElementById('password-invalid-feedback').innerHTML = 'Please fill out this field';
+            }
+            else if(passwordField.value.length < 5){
+                passwordField.classList.add("is-invalid");
+                document.getElementById('password-invalid-feedback').innerHTML =
+                    'Password must be at least 5 characters';
+            }
+            else{
+                passwordField.classList.remove("is-invalid");
+            }
         }
 
         function confirmPasswordLosesFocus() {
+            const confirmPasswordField = document.getElementById("confirmPassword");
 
+            if(!passwordField.value){
+                confirmPasswordField.classList.add("is-invalid");
+                document.getElementById('confirmpassword-invalid-feedback').innerHTML = 'Please fill out this field';
+            }
+            else if(passwordField.value.length < 5){
+                confirmPasswordField.classList.add("is-invalid");
+                document.getElementById('confirmpassword-invalid-feedback').innerHTML =
+                    'Password must be at least 5 characters';
+            }
+            else{
+                confirmPasswordField.classList.remove("is-invalid");
+            }
         }
 
         function validateFields() {