diff options
Diffstat (limited to 'ufund-ui/src/app/components/signup/signup.component.html')
| -rw-r--r-- | ufund-ui/src/app/components/signup/signup.component.html | 23 |
1 files changed, 10 insertions, 13 deletions
diff --git a/ufund-ui/src/app/components/signup/signup.component.html b/ufund-ui/src/app/components/signup/signup.component.html index 1b50d39..e078123 100644 --- a/ufund-ui/src/app/components/signup/signup.component.html +++ b/ufund-ui/src/app/components/signup/signup.component.html @@ -1,16 +1,13 @@ <p>Signup:</p> -<input placeholder="Username" type="text" #username> -<input placeholder="Password" type="password" (input)="checkPasswordStrength(password.value)" #password> -<button type="button" [disabled]="passwordStrongEnough | async" (click)="signup(username.value, password.value)">Create Account</button> - -<div id="requirement2" *ngIf="test"> {{test | async}} </div> - -<progress id="bar" [value]="strength | async" max="6"> </progress> - -<span *ngFor="let requirement of passwordRequirements"> - <span id="requirement" *ngIf="passwordRequirements" [style.color]="color | async"> {{requirement}} </span> +<input placeholder="Username" type="text" (input)="comparePassword(username.value, confirmPass.value, password.value)" #username> +<span id="usernameStatusText" *ngIf="usernameStatusText">{{usernameStatusText | async}}</span> +<input placeholder="Password" type="password" (input)="comparePassword(username.value, confirmPass.value, password.value)" #password> +<progress [ngClass]="'color' + strength.getValue()" id="bar" [value]="strength | async" max="6"> </progress> +<span id="statusText" *ngIf="statusText">{{statusText | async}}</span> +<span *ngFor="let requirement of Object.values(passwordRequirements)"> + <span id="requirement" *ngIf="passwordRequirements" [style.color]="requirement.value ? 'green' : 'red'"> {{requirement.title}} </span> </span> - -<span *ngIf="statusText">{{statusText | async}}</span> -<span *ngIf="strength">{{strength | async}}</span> +<input placeholder="Confirm password" type="password" (input)="comparePassword(username.value, confirmPass.value, password.value)" #confirmPass> +<span id="passwordStatusText" *ngIf="passwordStatusText">{{passwordStatusText | async}}</span> +<button type="button" [disabled]="!(ableToCreateAccount | async)" (click)="signup(username.value, password.value)">Create Account</button> <span *ngIf="showSuccessMessage | async">Account created <a routerLink="/login">Proceed to login</a></span> |