interesting
/
PeerTube
mirror of https://github.com/Chocobozzz/PeerTube.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Making password change erroring more friendly 

If you leave the form but the 2 password is different a big red
boxappears to warn you (no need to click on the button).The submit
buttonis desactivated if the 2 password isn't the same.
This commit is contained in:
Jorropo 2018-09-04 16:34:01 +02:00 committed by Chocobozzz
parent c75937d04f
commit a94419a604
2 changed files with 24 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
client/src/app/+my-account/my-account-settings/my-account-change-password/my-account-change-password.component.html
View File

@ -6,6 +6,7 @@
<input <input
type="password" id="new-password" i18n-placeholder placeholder="New password" type="password" id="new-password" i18n-placeholder placeholder="New password"
formControlName="new-password" [ngClass]="{ 'input-error': formErrors['new-password'] }" formControlName="new-password" [ngClass]="{ 'input-error': formErrors['new-password'] }"
(change)="validateNewPassword()" (blur)="printAnError()"
> >
<div *ngIf="formErrors['new-password']" class="form-error"> <div *ngIf="formErrors['new-password']" class="form-error">
{{ formErrors['new-password'] }} {{ formErrors['new-password'] }}
@ -13,8 +14,8 @@
<input <input
type="password" id="new-confirmed-password" i18n-placeholder placeholder="Confirm new password" type="password" id="new-confirmed-password" i18n-placeholder placeholder="Confirm new password"
formControlName="new-confirmed-password" formControlName="new-confirmed-password" (change)="validateNewPassword()" (blur)="printAnError()"
> >
<input type="submit" i18n-value value="Change password" [disabled]="!form.valid"> <input type="submit" i18n-value value="Change password" [disabled]="!form.valid || unsendable">
</form> </form>

28
client/src/app/+my-account/my-account-settings/my-account-change-password/my-account-change-password.component.ts
View File

@ -12,6 +12,7 @@ import { UserValidatorsService } from '@app/shared/forms/form-validators/user-va
}) })
export class MyAccountChangePasswordComponent extends FormReactive implements OnInit { export class MyAccountChangePasswordComponent extends FormReactive implements OnInit {
error: string = null error: string = null
unsendable = true // default to true to not have to not the if in change password
constructor ( constructor (
protected formValidatorService: FormValidatorService, protected formValidatorService: FormValidatorService,
@ -30,18 +31,31 @@ export class MyAccountChangePasswordComponent extends FormReactive implements On
}) })
} }
changePassword () { validateNewPassword () {
const newPassword = this.form.value['new-password'] if (this.form.value['new-password'] && this.form.value['new-confirmed-password']) {
const newConfirmedPassword = this.form.value['new-confirmed-password'] if (this.form.value['new-password'] === this.form.value['new-confirmed-password']) {
this.error = null
this.unsendable = false
return
}
}
this.unsendable = true
}
this.error = null printAnError () {
console.log(this.unsendable)
if (newPassword !== newConfirmedPassword) { this.validateNewPassword()
if (this.unsendable) {
this.error = this.i18n('The new password and the confirmed password do not correspond.') this.error = this.i18n('The new password and the confirmed password do not correspond.')
}
}
changePassword () {
if (this.unsendable) {
return return
} }
this.userService.changePassword(newPassword).subscribe( this.userService.changePassword(this.form.value['new-password']).subscribe(
() => this.notificationsService.success(this.i18n('Success'), this.i18n('Password updated.')), () => this.notificationsService.success(this.i18n('Success'), this.i18n('Password updated.')),
err => this.error = err.message err => this.error = err.message