diff --git a/js/password.js b/js/password.js new file mode 100644 index 0000000..f503852 --- /dev/null +++ b/js/password.js @@ -0,0 +1,92 @@ +/** + * Verification et gestion du mot de passe lors de la réinitialisation + */ + + +const PASSWORD_LENGTH = 8; +const PASSWORD_CONTENT = ['[A-Z]', '[a-z]', '[0-9]']; + +const passwordElt = document.getElementById('password'); +const confirmPasswordElt = document.getElementById('passwordConfirm'); + + +const min8Elt = document.getElementById('min8'); +const uppercaseElt = document.getElementById('uppercase'); +const lowercaseElt = document.getElementById('lowercase'); +const digitElt = document.getElementById('digit'); +const specialElt = document.getElementById('special'); + + +//Pattern du mot de passe +passwordElt.addEventListener('input', function() { + const password = passwordElt.value; + + // Vérification de la longueur + if (password.length >= PASSWORD_LENGTH) { + min8Elt.style.color = 'green'; + } else { + min8Elt.style.color = 'red'; + } + + // Vérification du contenu + PASSWORD_CONTENT.forEach((pattern, index) => { + const regex = new RegExp(pattern); + const element = [uppercaseElt, lowercaseElt, digitElt, specialElt][index]; + + if (regex.test(password)) { + element.style.color = 'green'; + } else { + element.style.color = 'red'; + } + }); +}); + + +// Vérification de la confirmation du mot de passe +confirmPasswordElt.addEventListener('input', function() { + const password = passwordElt.value; + const confirmPassword = confirmPasswordElt.value; + if (password === confirmPassword) { + confirmPasswordElt.style.borderColor = 'green'; + } else { + confirmPasswordElt.style.borderColor = 'red'; + } +}); + + +// Afficher ou masquer le mot de passe +const showPasswordElt = document.getElementById('showPassword'); +showPasswordElt.addEventListener('change', function() { + if (showPasswordElt.checked) { + passwordElt.type = 'text'; + confirmPasswordElt.type = 'text'; + } else { + passwordElt.type = 'password'; + confirmPasswordElt.type = 'password'; + } +}); + + +// Gestion de la soumission du formulaire +const passwordForm = document.getElementById('password-form'); +passwordForm.addEventListener('submit', function(event) { + const password = passwordElt.value; + const confirmPassword = confirmPasswordElt.value; + + // Empêcher la soumission si les critères ne sont pas remplis + if (password.length < PASSWORD_LENGTH || + !/[A-Z]/.test(password) || + !/[a-z]/.test(password) || + !/[0-9]/.test(password) || + password !== confirmPassword) { + + event.preventDefault(); + const alertElt = document.createElement('div'); + alertElt.className = 'alert alert-danger text-center'; + alertElt.textContent = "Le mot de passe ne respecte pas les critères requis ou la confirmation ne correspond pas."; + document.querySelector('main').prepend(alertElt); + + window.scrollTo(0, 0); + + } +}); diff --git a/profil/html/profil.html b/profil/html/profil.html new file mode 100644 index 0000000..3bc4b60 --- /dev/null +++ b/profil/html/profil.html @@ -0,0 +1,126 @@ + + + + + + Profil - L'Il'eau chiens - Admin + + + + + + + +
+ +
+ +
+
+
+

Mon profil

+
+
+
+

Informations personnelles

+
+
+ + +
+
+ + +
+
+ + +
+
+ +
+
+
+ +
+

Mot de passe

+ +
+
+ Laissez ces champs vides pour ne pas modifier votre mot de passe. +
+
+ + +
+
+ + +
+ +
+ +
+ +
+ +
+
+
+
+
+
+ + + + + + + + + + + \ No newline at end of file