🐞[bug]: Without login accessing the cart page #321

Html-files/cart.html

@@ -591,8 +591,20 @@ <h4 style="color: hsl(203, 30%,26%);font-family: var(--ff-philosopher);">Follow
         }, 3000);
       });
     });
-
   </script>
+  <script>
+    // Check if the user is logged in
+    const isLoggedIn = localStorage.getItem('isLoggedIn');
+
+    if (isLoggedIn !== 'true') {
+        // If the user is not logged in, redirect to the login page
+        alert('You must be logged in to access the cart.');
+        window.location.href = 'login.html';
+    } else {
+        // Render the cart or any other content as normal
+        document.body.innerHTML += '<p>Here is your cart content.</p>';
+    }
+</script>
 </body>
 
 </html>

Html-files/login.html

@@ -260,7 +260,10 @@ <h1 style="color: hsl(203, 30%,26%);font-family: var(--ff-philosopher);">LOGIN</
         // Display an error message if the password is too short
         document.getElementById('error-message').textContent = 'Password must be at least 8 characters.';
     } else {
-        // If both are valid, redirect to logged.html
+      // Save the login status in the local storage
+      localStorage.setItem('isLoggedIn', 'true');
+
+      // If both are valid, redirect to logged.html
         window.location.assign('logged.html');
     }
 });

Html-files/signup.html

@@ -236,7 +236,7 @@
         </div>
         <div class="right-login">
           <div class="card-login">
-            <h1 style="font-family: var(--ff-philosopher);color: hsl(203, 30%, 26%);">SIGN UP</h1>
+            <h1 style="font-family: var(--ff-philosopher); color: hsl(203, 30%, 26%);">SIGN UP</h1>
             <form id="signup-form">
               <div class="textfield">
                 <label for="name" style="font-family:var(--ff-philosopher);color: black;">Name</label>
@@ -248,20 +248,19 @@ <h1 style="font-family: var(--ff-philosopher);color: hsl(203, 30%, 26%);">SIGN U
                 <input type="email" id="email" name="email" placeholder="Enter Email / UserName" required style="font-family: var(--ff-philosopher);">
                 <span id="email-error" class="error-message"></span>
               </div>
-
-              <div class="textfield ">
+              <div class="textfield">
                 <label for="password">Password</label>
                 <input type="password" id="password" name="password" placeholder="Enter Password" title="Special characters are not allowed" required>
                 <span id="password-error" class="error-message"></span>
-                <span class="tooltiptext">Special characters such as /[<>"/]/  are not allowed</span>
-            </div>
-
-
+                <span class="tooltiptext">Special characters such as /[<>"/]/ are not allowed</span>
+              </div>
+              <div class="btnNext">
+                <button type="submit" class="btn-login" style="font-family: var(--ff-philosopher);color: #ddd;">Register</button>
+                <button id="google-login" style="font-family: var(--ff-philosopher);color: #ddd;">Signup with Google</button>
+              </div>
             </form>
-            <div class="btnNext"><button type="submit" class="btn-login" style="font-family: var(--ff-philosopher);color: #ddd;">Register</button>
-              <button id="google-login" style="font-family: var(--ff-philosopher);color: #ddd;">Signup with Google</button></div>
           </div>
-
+    
           <p class="switch-link">Already have an account? <a href="login.html">Login</a></p>
         </div>
       </div>
@@ -330,5 +329,57 @@ <h1 style="font-family: var(--ff-philosopher);color: hsl(203, 30%, 26%);">SIGN U
 
         animateCircles();
       </script>
+      <script>
+        // Form validation for signup page
+        document.getElementById('signup-form').addEventListener('submit', function(event) {
+          // Prevent form submission
+          event.preventDefault();
+
+          // Get input values
+          const nameInput = document.getElementById('name').value;
+          const emailInput = document.getElementById('email').value;
+          const passwordInput = document.getElementById('password').value;
+
+          // Regular expression for email validation (simple check)
+          const emailPattern = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+
+          // Password validation (at least 8 characters)
+          const isValidPassword = passwordInput.length >= 8;
+
+          // Clear previous error messages
+          document.getElementById('name-error').textContent = '';
+          document.getElementById('email-error').textContent = '';
+          document.getElementById('password-error').textContent = '';
+
+          let isValid = true;
+
+          // Validate name
+          if (!nameInput.trim()) {
+            document.getElementById('name-error').textContent = 'Name cannot be empty.';
+            isValid = false;
+          }
+
+          // Validate email format
+          if (!emailPattern.test(emailInput)) {
+            document.getElementById('email-error').textContent = 'Invalid email format.';
+            isValid = false;
+          }
+
+          // Validate password length
+          if (!isValidPassword) {
+            document.getElementById('password-error').textContent = 'Password must be at least 8 characters.';
+            isValid = false;
+          }
+
+          // If everything is valid, proceed (for now we just log the result)
+          if (isValid) {
+            // Save the login status in the local storage
+            localStorage.setItem('isLoggedIn', 'true');
+
+            // If both are valid, redirect to logged.html
+              window.location.assign('signed.html');
+          }
+        });
+      </script>
 </body>
 </html>