password-strength-check/script.js at master · deepakaranjekar/password-strength-check · GitHub

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
68
69
70
71
72
73
74
75
76
const indicator = document.querySelector(".indicator");
const input = document.querySelector("input");
const weak = document.querySelector(".weak");
const medium = document.querySelector(".medium");
const strong = document.querySelector(".strong");
const text = document.querySelector(".text");
const hideShowBtn = document.querySelector(".hideShowBtn");

let regExpWeak = /[a-z]/;
let regExpMedium = /\d+/;
let regExpStrong = /.*[!@#$%^&*()?_~-]/;
let level = 0;

function trigger(){
	if(input.value != ""){
		indicator.style.display = "block";
		indicator.style.display = "flex";

		if(input.value.match(regExpWeak) ||
		   input.value.match(regExpMedium) ||
		   input.value.match(regExpStrong))
			level =1;

		if( ((input.value.match(regExpWeak) && input.value.match(regExpMedium)) ||
			(input.value.match(regExpMedium) && input.value.match(regExpStrong))||
			(input.value.match(regExpWeak) && input.value.match(regExpStrong))))
			level =2;

		if( input.value.match(regExpWeak) &&
			input.value.match(regExpMedium) &&
			input.value.match(regExpStrong))
			level =3;

		if(level ==1){
			weak.classList.add("active");
			text.style.display = "block";
			text.textContent = "Your password is too week";
			text.classList.add("weak");
		}

		if(level ==2){
			medium.classList.add("active");
			text.textContent = "Your password is medium";
			text.classList.add("medium");
		}else{
			medium.classList.remove("active");
			text.classList.remove("medium");
		}

		if(level ==3){
			medium.classList.add("active");
			strong.classList.add("active");
			text.textContent = "Your password is strong";
			text.classList.add("strong");
		}else{
			strong.classList.remove("active");
			text.classList.remove("strong");
		}

		hideShowBtn.style.display = "block";
		hideShowBtn.onclick = function(){
			if(input.type == "password"){
				input.type = 'text';
				hideShowBtn.textContent = "HIDE";
			} else {
				input.type = 'password';
				hideShowBtn.textContent = "SHOW";
			}
		}

	} else {
		indicator.style.display = "none";
		text.style.display = "none";
		hideShowBtn.style.display = "none";
	}
}