Added "remember me" to the signup and signin page connecting it to the local storage database for user authentication.

SignUp/signup.html

@@ -88,7 +88,12 @@ <h1>Create Your Account</h1>
                 <input type="password" id="confirm-password" name="confirm-password" placeholder="Re-enter password" required>
                 <i class="bi bi-eye" id="toggleConfirmPassword" aria-label="Toggle confirm password visibility"></i>
             </div>
-            <div id="password-error" class="error-message"></div>
+            <div id="password-error" class="error-message"></div> <!-- Password error container -->
+            <div class="input-group">
+                <label for="remember-me">
+                    <input type="checkbox" id="remember-me" name="remember-me"> Remember Me
+                </label>
+            </div>
             <button type="submit" class="signup-button">Sign Up</button>
         </form>
         <div class="or-divider">

SignUp/signup.js

@@ -22,6 +22,45 @@ document.addEventListener("DOMContentLoaded", () => {
         registerUser(userdata);
     });
 
+    document.addEventListener("DOMContentLoaded", function () {
+        const rememberMeCheckbox = document.getElementById("remember-me");
+
+        // Load the Remember Me state from local storage
+        rememberMeCheckbox.checked = localStorage.getItem("rememberMe") === "true";
+
+        // Handle form submission
+        document.querySelector("form").addEventListener("submit", function (event) {
+            event.preventDefault();
+
+            // Save Remember Me state in local storage
+            localStorage.setItem("rememberMe", rememberMeCheckbox.checked);
+
+            // Retrieve form data
+            const formData = {
+                username: document.getElementById("username").value,
+                email: document.getElementById("email").value,
+                password: document.getElementById("password").value,
+                rememberMe: rememberMeCheckbox.checked
+            };
+
+            // Send form data to the server (example AJAX call, replace URL with your endpoint)
+            fetch('/signup', {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json',
+                },
+                body: JSON.stringify(formData),
+            })
+            .then(response => response.json())
+            .then(data => {
+                console.log('Success:', data);
+            })
+            .catch((error) => {
+                console.error('Error:', error);
+            });
+        });
+    });    
+
     const registerUser = async (user) => {
         try {
             const res = await fetch("http://localhost:5000/auth/signup", {

login/login.html

@@ -29,7 +29,11 @@ <h1 class="login-title">Welcome to Gaming Tools Store!</h1>
                     <input type="password" id="password" placeholder="Enter your password" required>
                     <i class="bi bi-eye" id="togglePassword" aria-label="Toggle password visibility"></i>
                 </div>
-
+                <div>
+                    <label for="remember-me">
+                        <input type="checkbox" id="remember-me" name="remember-me"> Remember Me
+                    </label>
+                </div>
                 <button type="submit" class="login-button">Login</button>
                 <button id='google-login-btn' type="button">Login with Google</button>
             </form>