parent.form.ts 4.56 KB
Newer Older
1
import { Component, OnInit, OnDestroy, Injectable, ViewChild, ElementRef, Renderer } from '@angular/core';
2
3
import { Router } from '@angular/router';
import { BehaviorSubject, Subscription } from 'rxjs/Rx';
4
import { VALID_EMAIL_PATTERN, VALID_NAMES_PATTERN } from '../../constants';
5
6
7
8
9
10
11
12
13
14
15
16
17
import { HelperDataService } from '../../services/helper-data-service';

import {
    FormBuilder,
    FormGroup,
    FormControl,
    FormArray,
    Validators,
} from '@angular/forms';
import {AppSettings} from '../../app.settings';

@Component({
    selector: 'parent-form',
18
    templateUrl: 'parent.form.html'
19
20
})

21
@Injectable() export default class ParentForm implements OnInit, OnDestroy {
22
23
24
25
26

    public formGroup: FormGroup;
    private respond: any;
    private epalUserData$: BehaviorSubject<any>;
    private epalUserDataSub: Subscription;
27
28
29
30
31
32
    private userEmailSub: Subscription;
    private showSendVerification: BehaviorSubject<boolean>;
    private verificationCodeSent: BehaviorSubject<boolean>;
    private verificationCodeVerified: BehaviorSubject<boolean>;
    private userEmailEnabled: BehaviorSubject<boolean>;
    @ViewChild('userEmail') userEmail: ElementRef;
33
34
35

       constructor(private fb: FormBuilder,
                private router: Router,
36
37
38
39
40
                private hds: HelperDataService,
                private rd: Renderer) {
            this.showSendVerification = new BehaviorSubject(false);
            this.verificationCodeSent = new BehaviorSubject(false);
            this.verificationCodeVerified = new BehaviorSubject(false);
41

42
43
44
45
46
47
48
49
50
51
52
            this.userEmailEnabled = new BehaviorSubject(false);
            this.formGroup = this.fb.group({
                 userName: ['', [Validators.pattern(VALID_NAMES_PATTERN),Validators.required]],
                 userSurname: ['', [Validators.pattern(VALID_NAMES_PATTERN),Validators.required]],
                 userFathername: ['', [Validators.pattern(VALID_NAMES_PATTERN),Validators.required]],
                 userMothername: ['', [Validators.pattern(VALID_NAMES_PATTERN),Validators.required]],
                 userEmail: [{value: '', disabled: true}, [Validators.pattern(VALID_EMAIL_PATTERN),Validators.required]],
                 verificationCode: ['', [Validators.required]]
                 });
            this.epalUserData$ = new BehaviorSubject({});
        }
53
    ngOnInit() {
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
        // this.epalUserDataSub = this.hds.getEpalUserData().subscribe(this.epalUserData$);

        this.epalUserDataSub = this.hds.getEpalUserData().subscribe(
            x => {
                this.epalUserData$.next(x);

                if (typeof(x.verificationCodeVerified) !== 'undefined' && x.verificationCodeVerified === "1") {
                    this.verificationCodeVerified.next(true);
                }

                if (typeof(x.userEmail) !== 'undefined' && x.userEmail.length > 0)
                    this.userEmailEnabled.next(false);
                else
                    this.userEmailEnabled.next(true);
            }
        );


        this.userEmailSub = this.formGroup.controls['userEmail'].valueChanges.subscribe(
            x => {
                if (this.formGroup.controls['userEmail'].value === '') {
                    this.enableUserEmail();
                }
            }
        );
    }

    ngOnDestroy() {
        if (this.epalUserDataSub) this.epalUserDataSub.unsubscribe();
        if (this.userEmailSub) this.epalUserDataSub.unsubscribe();
    }

    sendVerificationCode() {
        this.hds.sendVerificationCode(this.formGroup.value.userEmail)
            .then(res => {this.verificationCodeSent.next(true); this.showSendVerification.next(false);})
            .catch(err => {console.log(err)});
    }


    verifyVerificationCode() {
        this.hds.verifyVerificationCode(this.formGroup.value.verificationCode)
            .then(res => {this.verificationCodeSent.next(true); this.showSendVerification.next(false); this.verificationCodeVerified.next((<any>res).verificationCodeVerified === "1" ? true : false); this.formGroup.value.userEmail=(<any>res).userEmail;})
            .catch(err => {console.log(err)});
97
98
99
100
101
    }

    verifyCodeAndContinue() {
        this.router.navigate(['/epal-class-select']);
    }
102
103
104
105
106
107
108
109
110
111
112
113

    enableUserEmail() {
        this.userEmailEnabled.next(true);
        this.formGroup.controls["userEmail"].enable({emitEvent: false});
        this.rd.invokeElementMethod(this.userEmail.nativeElement,'focus');
    }

    disableUserEmail() {
        this.userEmailEnabled.next(false);
        this.formGroup.controls["userEmail"].setValue(this.epalUserData$.getValue().userEmail);
        this.formGroup.controls["userEmail"].disable({emitEvent: false});
    }
114
}