2018-11-13 04:54:40 +01:00
|
|
|
import {
|
|
|
|
Component,
|
|
|
|
Input,
|
|
|
|
OnChanges,
|
|
|
|
} from '@angular/core';
|
|
|
|
|
2021-06-07 20:13:58 +02:00
|
|
|
import { I18nService } from 'jslib-common/abstractions/i18n.service';
|
2018-11-13 04:54:40 +01:00
|
|
|
|
|
|
|
@Component({
|
|
|
|
selector: 'app-password-strength',
|
|
|
|
templateUrl: 'password-strength.component.html',
|
|
|
|
})
|
|
|
|
export class PasswordStrengthComponent implements OnChanges {
|
|
|
|
@Input() score?: number;
|
|
|
|
@Input() showText = false;
|
|
|
|
|
|
|
|
scoreWidth = 0;
|
|
|
|
color = 'bg-danger';
|
|
|
|
text: string;
|
|
|
|
|
|
|
|
constructor(private i18nService: I18nService) { }
|
|
|
|
|
|
|
|
ngOnChanges(): void {
|
|
|
|
this.scoreWidth = this.score == null ? 0 : (this.score + 1) * 20;
|
|
|
|
switch (this.score) {
|
|
|
|
case 4:
|
|
|
|
this.color = 'bg-success';
|
|
|
|
this.text = this.i18nService.t('strong');
|
|
|
|
break;
|
|
|
|
case 3:
|
2018-11-13 15:10:44 +01:00
|
|
|
this.color = 'bg-primary';
|
|
|
|
this.text = this.i18nService.t('good');
|
2018-11-13 04:54:40 +01:00
|
|
|
break;
|
|
|
|
case 2:
|
|
|
|
this.color = 'bg-warning';
|
|
|
|
this.text = this.i18nService.t('weak');
|
|
|
|
break;
|
|
|
|
default:
|
|
|
|
this.color = 'bg-danger';
|
|
|
|
this.text = this.score != null ? this.i18nService.t('weak') : null;
|
|
|
|
break;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|