Fix password validation issue & Home page text

booking_sys/templates/booking_sys/index.html

@@ -99,8 +99,6 @@
     <h1 class="display-4">Indulge in the Flavors of Syria</h1>
     <p class="lead">Experience the richness of Syrian cuisine at House Of Damascus</p>
     <a href="{% url 'menu' %}" class="btn btn-primary btn-lg">Explore Our Menu</a>
-    <p class="mt-3">Login to make a booking and savor the best of Syrian dishes! <a href="{% url 'account_signup' %}">Or
-            Sign Up</a></p>
 </section>
 
 

booking_sys/views.py

@@ -15,8 +15,6 @@ class BookingList(generic.ListView):
 def menu(request):
     return render(request, 'menu.html')
 
-# views.py
-
 class BookFormView(generic.CreateView):
     model = Booking
     form_class = ReservationForm

restaurant_booking_system/settings.py

@@ -67,6 +67,7 @@
     'django.contrib.messages.middleware.MessageMiddleware',
     'django.middleware.clickjacking.XFrameOptionsMiddleware',
     'allauth.account.middleware.AccountMiddleware',
+    'django.middleware.locale.LocaleMiddleware'
 ]
 
 ROOT_URLCONF = 'restaurant_booking_system.urls'
@@ -142,7 +143,7 @@
 # Static files (CSS, JavaScript, Images)
 # https://docs.djangoproject.com/en/4.2/howto/static-files/
 
-STATIC_URL = 'static/'
+STATIC_URL = '/static/'
 STATICFILES_DIRS = [os.path.join(BASE_DIR, 'static'), ]
 STATIC_ROOT = os.path.join(BASE_DIR, 'staticfiles')
 

templates/account/signup.html

@@ -1,5 +1,4 @@
 {% extends "base.html" %}
-
 {% load i18n %}
 
 {% block head_title %}{% trans "Sign Up" %}{% endblock %}
@@ -33,23 +32,71 @@ <h3 class="card-title text-center">{% trans "Sign Up" %}</h3>
 
             <div class="form-group">
               {{ form.password1.label_tag }}
-              {{ form.password1 }}
+              <input type="password" class="form-control" name="password1" id="password1" required>
+              <div id="password-feedback"></div>
             </div>
 
             <div class="form-group">
               {{ form.password2.label_tag }}
-              {{ form.password2 }}
+              <input type="password" class="form-control" name="password2" id="password2" required>
+              <div id="password-match-feedback"></div>
             </div>
 
             {% if redirect_field_value %}
             <input type="hidden" name="{{ redirect_field_name }}" value="{{ redirect_field_value }}" />
             {% endif %}
 
-            <button class="btn btn-primary btn-block" type="submit">{% trans "Sign Up" %}</button>
+            <button class="btn btn-primary btn-block" type="submit" id="signup_button"
+              disabled>{% trans "Sign Up" %}</button>
           </form>
         </div>
       </div>
     </div>
   </div>
 </div>
+
+<script>
+  document.addEventListener("DOMContentLoaded", function () {
+    var password1 = document.getElementById("password1");
+    var password2 = document.getElementById("password2");
+    var passwordFeedback = document.getElementById("password-feedback");
+    var passwordMatchFeedback = document.getElementById("password-match-feedback");
+    var signupButton = document.getElementById("signup_button");
+
+    // Function to check password strength
+    function checkPasswordStrength() {
+      var password = password1.value;
+      var regex = /^(?=.*\d)(?=.*[a-z])(?=.*[A-Z])(?=.*[!@#$%^&*]).{8,}$/;
+      if (regex.test(password)) {
+        passwordFeedback.innerHTML = "Password is strong.";
+        passwordFeedback.style.color = "green";
+      } else {
+        passwordFeedback.innerHTML =
+          "Password should be at least 8 characters long and contain at least one uppercase letter, one lowercase letter, one number, and one special character.";
+        passwordFeedback.style.color = "red";
+      }
+    }
+
+    // Function to check if passwords match
+    function checkPasswordsMatch() {
+      var passwordMatch = password1.value === password2.value;
+      if (!passwordMatch) {
+        passwordMatchFeedback.innerHTML = "Passwords do not match.";
+        passwordMatchFeedback.style.color = "red";
+        signupButton.disabled = true;
+      } else {
+        passwordMatchFeedback.innerHTML = "";
+        passwordMatchFeedback.style.color = "green";
+        signupButton.disabled = false;
+      }
+    }
+
+    // Event listeners for password input fields
+    password1.addEventListener("input", function () {
+      checkPasswordStrength();
+      checkPasswordsMatch();
+    });
+    password2.addEventListener("input", checkPasswordsMatch);
+  });
+</script>
 {% endblock %}