Skip to content

Commit 3aa8314

Browse files
authored
Merge pull request #5 from jaganbishoyi/feature
Feature
2 parents e5679f6 + 81fbc42 commit 3aa8314

13 files changed

+164
-84
lines changed

ngx-password-validator/package-lock.json

Lines changed: 3 additions & 3 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

ngx-password-validator/package.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "ngx-password-validator",
3-
"version": "0.0.4",
3+
"version": "0.0.5",
44
"scripts": {
55
"ng": "ng",
66
"start": "ng serve",
@@ -23,7 +23,7 @@
2323
"@angular/platform-browser": "~9.0.6",
2424
"@angular/platform-browser-dynamic": "~9.0.6",
2525
"@angular/router": "~9.0.6",
26-
"ng-password-validator": "0.0.3",
26+
"ng-password-validator": "0.0.4",
2727
"rxjs": "~6.5.4",
2828
"tslib": "^1.10.0",
2929
"zone.js": "~0.10.2"

ngx-password-validator/projects/ng-password-validator/README.md

Lines changed: 18 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -38,9 +38,27 @@ You may pass as an object:
3838
<input type="text" id="password" name="password" placeholder="Password.."
3939
NgPasswordValidator [options]="myOptions">
4040
```
41+
Password type as 'range':
4142
```ts
4243
myOptions = {
4344
'placement': 'top',
45+
'password': {
46+
'type': "range";
47+
'min': 6;
48+
'max': 10;
49+
},
50+
'shadow': false,
51+
'offset': 15,
52+
}
53+
```
54+
Password type as 'number':
55+
```ts
56+
myOptions = {
57+
'placement': 'top',
58+
'password': {
59+
'type': "number";
60+
'length': 8;
61+
},
4462
'shadow': false,
4563
'offset': 15,
4664
}
@@ -67,7 +85,6 @@ import { NgPasswordValidatorModule, NgPasswordValidatorOptions } from "ng-passwo
6785
export const MyDefaultOptions: NgPasswordValidatorOptions = {
6886
placement: "right",
6987
rules: {
70-
"password-length": 10,
7188
"include-symbol": true,
7289
"include-number": true,
7390
"include-lowercase-characters": true,

ngx-password-validator/projects/ng-password-validator/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "ng-password-validator",
3-
"version": "0.0.4",
3+
"version": "0.0.5",
44
"description": "The password validator is a pop-up window that appears when you start typing in input box. Here you can configure the password acceptance criteria, once your enter characters fullfil the requirement you will get a success message.",
55
"author": "Jagan Mohan Bishoyi",
66
"license": "MIT",

ngx-password-validator/projects/ng-password-validator/src/lib/ng-password-validator.component.html

Lines changed: 14 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,30 @@
11
<div class="popup-window">
22
<div class="heading">Password Requirement</div>
3-
<div class="rule" [hidden]="!rules['password-length']"
4-
[ngClass]="{'rule-pass':passwordStatus.passwordLength}">
5-
Password length should be {{rules['password-length']}}.
3+
<div *ngIf="rules['password']">
4+
<div class="rule" [hidden]="rules['password'].type !== 'number'"
5+
[ngClass]="{'rule-pass':passwordStatus['password']}">
6+
Password length should be {{rules['password'].length}} characters.
7+
</div>
8+
<div class="rule" [hidden]="rules['password'].type !== 'range'"
9+
[ngClass]="{'rule-pass':passwordStatus['password']}">
10+
Password length should be {{rules['password'].min}} - {{rules['password'].max}}
11+
characters.
12+
</div>
613
</div>
714
<div class="rule" [hidden]="!rules['include-symbol']"
8-
[ngClass]="{'rule-pass':passwordStatus.includeSymbol}">
15+
[ngClass]="{'rule-pass':passwordStatus['include-symbol']}">
916
Include Symbols:( e.g. @#$% )
1017
</div>
1118
<div class="rule" [hidden]="!rules['include-number']"
12-
[ngClass]="{'rule-pass':passwordStatus.includeNumber}">
19+
[ngClass]="{'rule-pass':passwordStatus['include-number']}">
1320
Include Numbers:( e.g.123456 )
1421
</div>
1522
<div class="rule" [hidden]="!rules['include-lowercase-characters']"
16-
[ngClass]="{'rule-pass':passwordStatus.includeLowercaseCharacters}">
23+
[ngClass]="{'rule-pass':passwordStatus['include-lowercase-characters']}">
1724
Include Lowercase Characters:(e.g. abcdefgh )
1825
</div>
1926
<div class="rule" [hidden]="!rules['include-uppercase-characters']"
20-
[ngClass]="{'rule-pass':passwordStatus.includeUppercaseCharacters}">
27+
[ngClass]="{'rule-pass':passwordStatus['include-uppercase-characters']}">
2128
Include Uppercase Characters:(e.g. ABCDEFGH )
2229
</div>
2330
<div class="success-message" [hidden]="!isSecure">

ngx-password-validator/projects/ng-password-validator/src/lib/ng-password-validator.component.ts

Lines changed: 12 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -11,25 +11,25 @@ import {
1111

1212
import { DataService } from "./data.service";
1313
import { IElementPosition, IRules, IStatus, NgPasswordValidatorOptions } from "./ng-password-validator.interface";
14+
import { defaultOptions } from "./options";
1415
@Component({
15-
// tslint:disable-next-line: component-selector
1616
selector: "NgPasswordValidator",
1717
templateUrl: "./ng-password-validator.component.html",
18-
// tslint:disable-next-line: no-host-metadata-property
1918
host: { class: "popup" },
2019
styleUrls: ["./ng-password-validator.component.scss"]
2120
})
2221
export class NgPasswordValidatorComponent implements OnInit {
2322
passwordStatus = {
24-
passwordLength: false,
25-
includeSymbol: false,
26-
includeNumber: false,
27-
includeLowercaseCharacters: false,
28-
includeUppercaseCharacters: false,
23+
"password": false,
24+
"include-symbol": false,
25+
"include-number": false,
26+
"include-lowercase-characters": false,
27+
"include-uppercase-characters": false,
2928
};
3029
isSecure = false;
3130
Show = false;
3231
events = new EventEmitter();
32+
passwordOptions: NgPasswordValidatorOptions = defaultOptions;
3333

3434
@Input() data: any;
3535

@@ -72,7 +72,6 @@ export class NgPasswordValidatorComponent implements OnInit {
7272
return this.data.options.placement;
7373
}
7474

75-
// tslint:disable-next-line: typedef
7675
get element() {
7776
return this.data.element;
7877
}
@@ -109,6 +108,11 @@ export class NgPasswordValidatorComponent implements OnInit {
109108
this.setStyles();
110109
this.dataService.updatedValue.subscribe((data: IStatus) => {
111110
this.passwordStatus = { ... this.passwordStatus, ...data };
111+
for (const propName in this.passwordOptions.rules) {
112+
if (!this.passwordOptions.rules[propName]) {
113+
delete this.passwordStatus[propName];
114+
}
115+
}
112116
this.isSecure = Object.values(this.passwordStatus).every((value: boolean) => value);
113117
});
114118
}

ngx-password-validator/projects/ng-password-validator/src/lib/ng-password-validator.directive.ts

Lines changed: 38 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -21,13 +21,12 @@ export interface HostComponent {
2121
}
2222

2323
@Directive({
24-
// tslint:disable-next-line: directive-selector
2524
selector: "[NgPasswordValidator]",
2625
exportAs: "NgPasswordValidator",
2726
})
2827

2928
export class NgPasswordValidatorDirective implements OnDestroy, OnChanges {
30-
regExpForLength = /^(.){6}$/;
29+
regExpForLength = /^(.){8}$/;
3130
regExpForOneUpper = /^(?=.*[A-Z])(.*)$/;
3231
regExpForOneLower = /^(?=.*[a-z])(.*)$/;
3332
regExpForOneDigit = /^(?=.*[0-9])(.*)$/;
@@ -41,8 +40,33 @@ export class NgPasswordValidatorDirective implements OnDestroy, OnChanges {
4140

4241
@Input("options") set options(value: NgPasswordValidatorOptions) {
4342
if (value && defaultOptions) {
44-
this.passwordOptions = value;
45-
this.regExpForLength = new RegExp("^(.){" + this.passwordOptions.rules["password-length"] + "}$");
43+
44+
// Merge a `source` object to a `target` recursively
45+
const merge = (target: NgPasswordValidatorOptions, source: NgPasswordValidatorOptions): NgPasswordValidatorOptions => {
46+
// Iterate through `source` properties and if an `Object` set property to merge of `target` and `source` properties
47+
for (const key of Object.keys(source)) {
48+
if (source[key] instanceof Object) { Object.assign(source[key], merge(target[key], source[key])); }
49+
}
50+
51+
// Join `target` and modified `source`
52+
Object.assign(target || {}, source);
53+
54+
return target;
55+
};
56+
57+
this.passwordOptions = merge(defaultOptions, value);
58+
if (this.passwordOptions.rules.password) {
59+
switch (this.passwordOptions.rules["password"].type) {
60+
case "number":
61+
this.regExpForLength = new RegExp(`^(.){${this.passwordOptions.rules["password"].length}}$`);
62+
break;
63+
64+
case "range":
65+
this.regExpForLength =
66+
new RegExp(`^(.){${this.passwordOptions.rules["password"].min},${this.passwordOptions.rules["password"].max}}$`);
67+
}
68+
}
69+
4670
}
4771
}
4872
@Input("NgPasswordValidator") popup: string;
@@ -155,13 +179,18 @@ export class NgPasswordValidatorDirective implements OnDestroy, OnChanges {
155179
*/
156180
checkPassword(inputValue: string): void {
157181
const data = {
158-
passwordLength: inputValue.match(this.regExpForLength) ? true : false,
159-
includeSymbol: inputValue.match(this.regExpForSpecialCharacters) ? true : false,
160-
includeNumber: inputValue.match(this.regExpForOneDigit) ? true : false,
161-
includeLowercaseCharacters: inputValue.match(this.regExpForOneLower) ? true : false,
162-
includeUppercaseCharacters: inputValue.match(this.regExpForOneUpper) ? true : false,
182+
password: inputValue.match(this.regExpForLength) ? true : false,
183+
"include-symbol": inputValue.match(this.regExpForSpecialCharacters) ? true : false,
184+
"include-number": inputValue.match(this.regExpForOneDigit) ? true : false,
185+
"include-lowercase-characters": inputValue.match(this.regExpForOneLower) ? true : false,
186+
"include-uppercase-characters": inputValue.match(this.regExpForOneUpper) ? true : false,
163187
};
164188

189+
for (const propName in this.passwordOptions.rules) {
190+
if (!this.passwordOptions.rules[propName]) {
191+
delete data[propName];
192+
}
193+
}
165194
this.isValid = Object.values(data).every((value: boolean) => value);
166195
this.dataService.updateValue(data);
167196
}

ngx-password-validator/projects/ng-password-validator/src/lib/ng-password-validator.interface.ts

Lines changed: 12 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -24,17 +24,23 @@ export interface IElementPosition {
2424
}
2525

2626
export interface IRules {
27-
"password-length"?: number | boolean;
27+
"password"?: false | IPassword;
2828
"include-symbol"?: boolean;
2929
"include-number"?: boolean;
3030
"include-lowercase-characters"?: boolean;
3131
"include-uppercase-characters"?: boolean;
3232
}
3333

3434
export interface IStatus {
35-
passwordLength: boolean;
36-
includeSymbol: boolean;
37-
includeNumber: boolean;
38-
includeLowercaseCharacters: boolean;
39-
includeUppercaseCharacters: boolean;
35+
"password": boolean;
36+
"include-symbol": boolean;
37+
"include-number": boolean;
38+
"include-lowercase-characters": boolean;
39+
"include-uppercase-characters": boolean;
40+
}
41+
export interface IPassword {
42+
type?: "number" | "range";
43+
length?: number;
44+
min?: number;
45+
max?: number;
4046
}

ngx-password-validator/projects/ng-password-validator/src/lib/options.ts

Lines changed: 11 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,12 @@ export const defaultOptions: NgPasswordValidatorOptions = {
88
theme: "basic",
99
offset: 8,
1010
rules: {
11-
"password-length": 8,
11+
password: {
12+
type: "range",
13+
length: 8,
14+
min: 6,
15+
max: 10,
16+
},
1217
"include-symbol": true,
1318
"include-number": true,
1419
"include-lowercase-characters": true,
@@ -17,9 +22,9 @@ export const defaultOptions: NgPasswordValidatorOptions = {
1722
};
1823

1924
export const initializeStage: IStatus = {
20-
passwordLength: false,
21-
includeSymbol: false,
22-
includeNumber: false,
23-
includeLowercaseCharacters: false,
24-
includeUppercaseCharacters: false,
25+
password: false,
26+
"include-symbol": false,
27+
"include-number": false,
28+
"include-lowercase-characters": false,
29+
"include-uppercase-characters": false,
2530
};
Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,9 @@
1-
import { NgModule } from '@angular/core';
2-
import { Routes, RouterModule } from '@angular/router';
3-
1+
import { NgModule } from "@angular/core";
2+
import { RouterModule, Routes } from "@angular/router";
43

54
const routes: Routes = [];
6-
75
@NgModule({
8-
imports: [RouterModule.forRoot(routes)],
9-
exports: [RouterModule]
6+
imports: [RouterModule.forRoot(routes)],
7+
exports: [RouterModule]
108
})
119
export class AppRoutingModule { }

0 commit comments

Comments
 (0)