X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;ds=sidebyside;f=client%2Fsrc%2Fapp%2Fshared%2Fforms%2Fform-reactive.ts;h=0bb7d25e6f5c606da996ae66195930b9262f14bc;hb=e63dbd426e67672b4014c2a3ac3a227fbe26e886;hp=1e8a69771c5ffe37d563a665cb8fa026e6c38185;hpb=4b2f33f3c6d109365090b08244d7f99ad4e69025;p=github%2FChocobozzz%2FPeerTube.git diff --git a/client/src/app/shared/forms/form-reactive.ts b/client/src/app/shared/forms/form-reactive.ts index 1e8a69771..0bb7d25e6 100644 --- a/client/src/app/shared/forms/form-reactive.ts +++ b/client/src/app/shared/forms/form-reactive.ts @@ -1,24 +1,51 @@ -import { FormGroup } from '@angular/forms'; +import { FormGroup } from '@angular/forms' +import { BuildFormArgument, BuildFormDefaultValues, FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service' + +export type FormReactiveErrors = { [ id: string ]: string } +export type FormReactiveValidationMessages = { + [ id: string ]: { + [ name: string ]: string + } +} export abstract class FormReactive { - abstract form: FormGroup; - abstract formErrors: Object; - abstract validationMessages: Object; + protected abstract formValidatorService: FormValidatorService + protected formChanged = false + + form: FormGroup + formErrors: FormReactiveErrors + validationMessages: FormReactiveValidationMessages + + buildForm (obj: BuildFormArgument, defaultValues: BuildFormDefaultValues = {}) { + const { formErrors, validationMessages, form } = this.formValidatorService.buildForm(obj, defaultValues) - abstract buildForm(): void; + this.form = form + this.formErrors = formErrors + this.validationMessages = validationMessages - protected onValueChanged(data?: any) { + this.form.valueChanges.subscribe(() => this.onValueChanged(false)) + } + + protected onValueChanged (forceCheck = false) { for (const field in this.formErrors) { // clear previous error message (if any) - this.formErrors[field] = ''; - const control = this.form.get(field); + this.formErrors[ field ] = '' + const control = this.form.get(field) + + if (control.dirty) this.formChanged = true - if (control && control.dirty && !control.valid) { - const messages = this.validationMessages[field]; + // Don't care if dirty on force check + const isDirty = control.dirty || forceCheck === true + if (control && isDirty && !control.valid) { + const messages = this.validationMessages[ field ] for (const key in control.errors) { - this.formErrors[field] += messages[key] + ' '; + this.formErrors[ field ] += messages[ key ] + ' ' } } } } + + protected forceCheck () { + return this.onValueChanged(true) + } }