1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
|
// ############################################################################
// # #
// # Description: JS de la partie inscription #
// # #
// ############################################################################
// Num - N'importe quel chiffre entre 0 et 9 [0-9]
// Upper - N'importe quel lettre majuscule entre A et Z [A-Z]
// Spe - N'importe quel symbole présent entre les deux brackets [`!@#$%^&*()_+\-=\[\]{};':"\\|,.<>\/?~µ°€£]
// Email - ^ -> Debut de la ligne obligatoire, doit contenir entre premiers brackets "[a-z]" "[0-9]" ou _, -, .
// Ensuite il doit y avoir un @ et une suite de charcactère sans charactère speciaux "+@[a-zA-Z0-9-]"
// et pour finir l'extension "+.[a-z]", "+$" pour la fin de la ligne.
const regNum = new RegExp(/[0-9]/);
const regUpper = new RegExp(/[A-Z]/);
const regSpecial = new RegExp(/[`!@#$%^&*()_+\-=\[\]{};':"\\|,.<>\/?~µ°€£]/);
const regEmail = new RegExp(/^[a-z0-9._-]+@[a-z0-9-]+\.[a-z]+$/)
// Initialisation des variables
let validEmail;
let validNumb;
let validUpper;
let validSpecial;
let validLength;
function valid_all() {
let submitButton = document.getElementById("submit");
// Si tout est validé on active le button sumbit
if (validLength && validUpper && validNumb && validSpecial && validEmail) {
submitButton.classList.remove("deactivate");
submitButton.disabled = false;
} else {
submitButton.classList.add("deactivate");
submitButton.disabled = true;
}
}
function valid_reg(condition, element) {
// Si la regex est bonne on selectionne la class css pour l'afficher
if (condition) {
document.getElementById(element).classList.remove("invalid");
document.getElementById(element).classList.add("valid");
return true;
} else {
document.getElementById(element).classList.remove("valid");
document.getElementById(element).classList.add("invalid");
return false;
}
}
document.getElementById("email").addEventListener("keyup", () => {
// On récupère l'email par id dans la page et on test notre regex
let email = document.getElementById("email").value;
validEmail = valid_reg(regEmail.test(email), "mailNotice");
valid_all();
});
document.getElementById("password").addEventListener("keyup", () => {
// On récupère la valeur par id du mdp dans la page et on test nos regex
let pass = document.getElementById("password").value;
validNumb = valid_reg(regNum.test(pass), "passNumb");
validUpper = valid_reg(regUpper.test(pass), "passUpper");
validSpecial = valid_reg(regSpecial.test(pass), "passSpecial");
validLength = valid_reg((pass.length >= 8), "passLength");
valid_all();
});
|
