Password validation
MyApp
Asmat Qatea
1.0
Desktop
False
640
480
False
False
False
False
WebApp
False
C:\Users\asmat\Documents\VisualNeoWeb\Libraries\img\default-icon.png
#validation .valid{
color:rgba(255,255,255,0.5);
}
#validation svg{
fill:white;
}
#validation .valid svg{
fill:#19ff0d;
}
.inputBox input{
position:relative;
width:100%;
outline:none;
border:none;
padding: 5px 10px;
height:100%;
}
#togglebtn{
position:absolute;
background:rgba(0,0,0,0.05);
top:0px!important;
bottom:0px!important;
margin:auto!important;
width:34px;
height:34px;
right:10px;
border-radius:50%;
color:black;
}
.flexCenter{
display:flex;
justify-content:center;
align-items:center;
}
.flexTop{
display:flex;
flex-direction:column;
align-items:center;
justify-content:flex-start;
}
.flexLeft{
display:flex;
align-items:center;
justify-content:flex-start;
}
en
standalone
Offline page
#000000
[AndroidOS,iOS,WindowsPhoneOS]
normal
True
True
False
True
True
False
False
True
False
False
NeoScriptToJS
let lower = new RegExp('(?=.*[a-z])');
let upper = new RegExp('(?=.*[A-Z])');
let number = new RegExp('(?=.*[0-9])');
let special = new RegExp('(?=.*[!@#\$%\^&\*])');
let minLength = new RegExp('(?=.{8,})');
function valid(obj){
$('#'+obj).addClass('valid');
$('#'+obj+' svg').html($('#tick svg').html());
}
function unValid(obj){
$('#'+obj).removeClass('valid');
$('#'+obj+' svg').html($('#circle svg').html());
}
//lowerCase validation check
if(lower.test(data)){
valid('lower');
}else{
unValid('lower')
}
//upperCase validation check
if(upper.test(data)){
valid('upper');
}else{
unValid('upper');
}
//Number validation check
if(number.test(data)){
valid('number');
}else{
unValid('number');
}
//Special character validation check
if(special.test(data)){
valid('special');
}else{
unValid('special');
}
if(minLength.test(data)){
valid('minLength');
}else{
unValid('minLength');
}
data|STRING|
JavaScript
if($('#pswrd').attr('type') == "password"){
$('#pswrd').attr('type','text');
$(obj).html($('#eyeClose').html());
}else{
$('#pswrd').attr('type','password');
$(obj).html($('#eyeOpen').html());
}
obj|STRING|
JavaScript
. The value of input will save in [password] variable...
144px
67px
352px
52px
inputBox
<input type="password" ng-model="$root.password" id="pswrd" placeholder="Password" onkeyup="neosubroutine.checkPassword(this.value)">
<span id="togglebtn" class="flexCenter" onclick="neosubroutine.toggleButton(this)">
<svg style="width:24px;height:24px" viewBox="0 0 24 24">
<path fill="currentColor" d="M12,9A3,3 0 0,0 9,12A3,3 0 0,0 12,15A3,3 0 0,0 15,12A3,3 0 0,0 12,9M12,17A5,5 0 0,1 7,12A5,5 0 0,1 12,7A5,5 0 0,1 17,12A5,5 0 0,1 12,17M12,4.5C7,4.5 2.73,7.61 1,12C2.73,16.39 7,19.5 12,19.5C17,19.5 21.27,16.39 23,12C21.27,7.61 17,4.5 12,4.5Z"></path>
</svg>
</span>
-146px
4px
39px
37px
<svg style="width:24px;height:24px" viewBox="0 0 24 24">
<path fill="currentColor" d="M11.83,9L15,12.16C15,12.11 15,12.05 15,12A3,3 0 0,0 12,9C11.94,9 11.89,9 11.83,9M7.53,9.8L9.08,11.35C9.03,11.56 9,11.77 9,12A3,3 0 0,0 12,15C12.22,15 12.44,14.97 12.65,14.92L14.2,16.47C13.53,16.8 12.79,17 12,17A5,5 0 0,1 7,12C7,11.21 7.2,10.47 7.53,9.8M2,4.27L4.28,6.55L4.73,7C3.08,8.3 1.78,10 1,12C2.73,16.39 7,19.5 12,19.5C13.55,19.5 15.03,19.2 16.38,18.66L16.81,19.08L19.73,22L21,20.73L3.27,3M12,7A5,5 0 0,1 17,12C17,12.64 16.87,13.26 16.64,13.82L19.57,16.75C21.07,15.5 22.27,13.86 23,12C21.27,7.61 17,4.5 12,4.5C10.6,4.5 9.26,4.75 8,5.2L10.17,7.35C10.74,7.13 11.35,7 12,7Z" />
</svg>
138px
144px
364px
196px
flexTop
18px
0px
96%
50px
top
5px
flexLeft
icon="asmat"
<svg style="width:24px;height:24px" viewBox="0 0 24 24">
<path fill="white" d="M12,20A8,8 0 0,1 4,12A8,8 0 0,1 12,4A8,8 0 0,1 20,12A8,8 0 0,1 12,20M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M12,7A5,5 0 0,0 7,12A5,5 0 0,0 12,17A5,5 0 0,0 17,12A5,5 0 0,0 12,7Z"></path>
</svg>
At least one lowercase character
15px
13px
96%
50px
top
5px
flexLeft
<svg style="width:24px;height:24px" viewBox="0 0 24 24">
<path fill="currentColor" d="M12,20A8,8 0 0,1 4,12A8,8 0 0,1 12,4A8,8 0 0,1 20,12A8,8 0 0,1 12,20M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M12,7A5,5 0 0,0 7,12A5,5 0 0,0 12,17A5,5 0 0,0 17,12A5,5 0 0,0 12,7Z"></path>
</svg>
At least one uppercase character
15px
59px
96%
50px
top
5px
flexLeft
<svg style="width:24px;height:24px" viewBox="0 0 24 24">
<path fill="currentColor" d="M12,20A8,8 0 0,1 4,12A8,8 0 0,1 12,4A8,8 0 0,1 20,12A8,8 0 0,1 12,20M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M12,7A5,5 0 0,0 7,12A5,5 0 0,0 12,17A5,5 0 0,0 17,12A5,5 0 0,0 12,7Z"></path>
</svg>
At least one number
15px
105px
96%
50px
top
5px
flexLeft
<svg style="width:24px;height:24px" viewBox="0 0 24 24">
<path fill="currentColor" d="M12,20A8,8 0 0,1 4,12A8,8 0 0,1 12,4A8,8 0 0,1 20,12A8,8 0 0,1 12,20M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M12,7A5,5 0 0,0 7,12A5,5 0 0,0 12,17A5,5 0 0,0 17,12A5,5 0 0,0 12,7Z"></path>
</svg>
At least one special character
15px
151px
96%
50px
top
5px
5px
flexLeft
<svg style="width:24px;height:24px" viewBox="0 0 24 24">
<path fill="currentColor" d="M12,20A8,8 0 0,1 4,12A8,8 0 0,1 12,4A8,8 0 0,1 20,12A8,8 0 0,1 12,20M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M12,7A5,5 0 0,0 7,12A5,5 0 0,0 12,17A5,5 0 0,0 17,12A5,5 0 0,0 12,7Z"></path>
</svg>
At least 8 character
-144px
53px
56px
32px
<svg style="width:24px;height:24px" viewBox="0 0 24 24">
<path d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path>
</svg>
-143px
89px
56px
32px
<svg style="width:24px;height:24px" viewBox="0 0 24 24">
<path d="M12,20A8,8 0 0,1 4,12A8,8 0 0,1 12,4A8,8 0 0,1 20,12A8,8 0 0,1 12,20M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M12,7A5,5 0 0,0 7,12A5,5 0 0,0 12,17A5,5 0 0,0 17,12A5,5 0 0,0 12,7Z"></path>
</svg>
-99px
5px
39px
37px
<svg style="width:24px;height:24px" viewBox="0 0 24 24">
<path fill="currentColor" d="M12,9A3,3 0 0,0 9,12A3,3 0 0,0 12,15A3,3 0 0,0 15,12A3,3 0 0,0 12,9M12,17A5,5 0 0,1 7,12A5,5 0 0,1 12,7A5,5 0 0,1 17,12A5,5 0 0,1 12,17M12,4.5C7,4.5 2.73,7.61 1,12C2.73,16.39 7,19.5 12,19.5C17,19.5 21.27,16.39 23,12C21.27,7.61 17,4.5 12,4.5Z"></path>
</svg>
170px
438px
300px
36px
flexCenter
Author: Asmat Qatea
0px
0px
640px
480px
False
custom