Upstream/bitwarden-browser
1
0
Fork 0
mirror of https://github.com/bitwarden/browser.git synced 2024-12-26 17:08:33 +01:00
Code Issues Projects Releases Wiki Activity

input event, not change

Browse Source
This commit is contained in:
Kyle Spearrin 2018-02-24 15:19:16 -05:00
parent 39e1d0865b
commit e32b01edc9
2 changed files with 21 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/app/vault/password-generator.component.html
View File

@ -27,7 +27,7 @@
<div class="box-content-row box-content-row-slider" appBoxRow> <div class="box-content-row box-content-row-slider" appBoxRow>
<label for="length">{{'length' | i18n}}</label> <label for="length">{{'length' | i18n}}</label>
<input id="length" type="number" min="5" max="128" [(ngModel)]="options.length" <input id="length" type="number" min="5" max="128" [(ngModel)]="options.length"
(change)="saveOptions()"> (input)="saveOptions()">
<input id="lengthRange" type="range" min="5" max="128" step="1" <input id="lengthRange" type="range" min="5" max="128" step="1"
[(ngModel)]="options.length"> [(ngModel)]="options.length">
</div> </div>
@ -57,12 +57,12 @@
<div class="box-content condensed"> <div class="box-content condensed">
<div class="box-content-row box-content-row-input" appBoxRow> <div class="box-content-row box-content-row-input" appBoxRow>
<label for="min-number">{{'minNumbers' | i18n}}</label> <label for="min-number">{{'minNumbers' | i18n}}</label>
<input id="min-number" type="number" min="0" max="9" (change)="saveOptions()" <input id="min-number" type="number" min="0" max="9" (input)="saveOptions()"
[(ngModel)]="options.minNumber"> [(ngModel)]="options.minNumber">
</div> </div>
<div class="box-content-row box-content-row-input" appBoxRow> <div class="box-content-row box-content-row-input" appBoxRow>
<label for="min-special">{{'minSpecial' | i18n}}</label> <label for="min-special">{{'minSpecial' | i18n}}</label>
<input id="min-special" type="number" min="0" max="9" (change)="saveOptions()" <input id="min-special" type="number" min="0" max="9" (input)="saveOptions()"
[(ngModel)]="options.minSpecial"> [(ngModel)]="options.minSpecial">
</div> </div>
<div class="box-content-row box-content-row-checkbox" appBoxRow> <div class="box-content-row box-content-row-checkbox" appBoxRow>

22
src/app/vault/password-generator.component.ts
View File

@ -4,8 +4,10 @@ import { ToasterService } from 'angular2-toaster';
import { Angulartics2 } from 'angulartics2'; import { Angulartics2 } from 'angulartics2';
import { import {
ChangeDetectorRef,
Component, Component,
EventEmitter, EventEmitter,
NgZone,
Input, Input,
OnInit, OnInit,
Output, Output,
@ -30,7 +32,8 @@ export class PasswordGeneratorComponent implements OnInit {
constructor(private passwordGenerationService: PasswordGenerationService, private analytics: Angulartics2, constructor(private passwordGenerationService: PasswordGenerationService, private analytics: Angulartics2,
private platformUtilsService: PlatformUtilsService, private i18nService: I18nService, private platformUtilsService: PlatformUtilsService, private i18nService: I18nService,
private toasterService: ToasterService) { } private toasterService: ToasterService, private ngZone: NgZone,
private changeDetectorRef: ChangeDetectorRef) { }
async ngOnInit() { async ngOnInit() {
this.options = await this.passwordGenerationService.getOptions(); this.options = await this.passwordGenerationService.getOptions();
@ -44,15 +47,19 @@ export class PasswordGeneratorComponent implements OnInit {
// Save password once the slider stop moving. // Save password once the slider stop moving.
slider.addEventListener('change', async (e) => { slider.addEventListener('change', async (e) => {
e.preventDefault(); e.preventDefault();
this.saveOptions(false); this.functionWithChangeDetection(() => {
this.saveOptions(false);
});
await this.passwordGenerationService.addHistory(this.password); await this.passwordGenerationService.addHistory(this.password);
this.analytics.eventTrack.next({ action: 'Regenerated Password' }); this.analytics.eventTrack.next({ action: 'Regenerated Password' });
}); });
// Regenerate while slider moving // Regenerate while slider moving
slider.addEventListener('input', (e) => { slider.addEventListener('input', (e) => {
e.preventDefault(); e.preventDefault();
this.normalizeOptions(); this.functionWithChangeDetection(() => {
this.password = this.passwordGenerationService.generatePassword(this.options); this.normalizeOptions();
this.password = this.passwordGenerationService.generatePassword(this.options);
});
}); });
} }
} }
@ -126,4 +133,11 @@ export class PasswordGeneratorComponent implements OnInit {
this.options.minSpecial = this.options.length - this.options.minNumber; this.options.minSpecial = this.options.length - this.options.minNumber;
} }
} }
private functionWithChangeDetection(func: Function) {
this.ngZone.run(async () => {
func();
this.changeDetectorRef.detectChanges();
});
}
} }