import { Component, OnInit, OnDestroy, ViewEncapsulation } from '@angular/core';
import { TranslateService } from '@ngx-translate/core';
import { HttpClient } from '@angular/common/http';
import { Router, ActivatedRoute, ParamMap } from '@angular/router';
import { FormBuilder, FormGroup, Validators, FormControl } from '@angular/forms';
import { CustomValidators } from "ng2-validation/dist";
import { Observable, Subscription } from 'rxjs/Rx';

@Component({
        selector: 'app-reset-password',
        templateUrl: './reset-password.component.html',
        styleUrls: ['./reset-password.component.scss'],
        encapsulation: ViewEncapsulation.None
})
export class ResetPasswordComponent implements OnInit, OnDestroy  {
        public form: FormGroup;
        private userId: string;
        private code: string;
        public busy: boolean = false;
        public success: boolean = false;
        private actionResult = undefined;
        private timer;
        // Subscription object
        private sub: Subscription;

        constructor(private fb: FormBuilder, private route: ActivatedRoute, private router: Router,
                private http: HttpClient, public translate: TranslateService) {
                this.route.queryParams.subscribe(params => {
                        if (params['userId']) {
                                this.userId = params['userId'];
                        }
                        if (params['code']) {
                                this.code = params['code'];
                        }
                });
        }

        ngOnInit() {
                this.form = this.fb.group({
                        email: [null, Validators.compose([Validators.required, CustomValidators.email])],
                        password: [null, Validators.compose([Validators.required])],
                        passwordConfirm: [null, Validators.compose([Validators.required])]
                });
                this.timer = Observable.timer(3000, 0);
        }

        onSubmit() {
                this.busy = true;
                this.http.post<any[]>('api/zebratixaccount/resetpassword', {
                        'email': this.form.value.email, 'password': this.form.value.password, 'confirmPassword': this.form.value.passwordConfirm, 'code': this.code}).subscribe(res => {
                        this.success = true;
                        this.busy = false;
                        this.translate.get("EmailConfirmSuccessfullyCompleted").subscribe(value => this.actionResult = value);
                        this.sub = this.timer.subscribe(t => { this.router.navigate(['/']); });

                },
                        error => {
                                this.busy = false;
                                this.actionResult = error.error.errorMsg;
                        });
        }

        ngOnDestroy() {
                console.log("Destroy timer");
                // unsubscribe here
                this.sub.unsubscribe();
        }
}