import { Component, AfterViewInit, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { ApplicationService } from '../services/application.service';
import { FormGroup, FormControl, FormBuilder, Validators } from '@angular/forms';
//import { patternValidator } from 'app/shared/pattern-validator';
import { State, Country } from '../model/db-tables'; //, AccountNumber
//import {UpdateLicenseeProfile} from '../model/update-profile.interface';


declare var jQuery: any;

@Component({
    templateUrl: '../components/view-update-profile.component.html'
})
export class ViewUpdateProfileComponent implements AfterViewInit, OnInit {
    //public updateProfile: UpdateLicenseeProfile;
    //viewUpdateProfileForm: FormGroup;
    allStates: State[];
    allCountries: Country[];
    //allAccountNumbers: AccountNumber[];

    //viewUpdateProfileForm = new FormGroup({
    
    //    accountNo: new FormControl(),
    //    licenseeFirstName: new FormControl(),
    //    licenseeLastName: new FormControl(),
    //    institutionName: new FormControl(),
    //    email: new FormControl(),
    //    address1: new FormControl(),
    //    address2: new FormControl(),
    //    city: new FormControl(),
    //    zip: new FormControl(),
    //    state: new FormControl(),
    //    country: new FormControl(),    
    //    phone: new FormControl()    
    //});

    constructor(private application: ApplicationService, private router: Router) { //, private formBuilder: FormBuilder
        //this.updateProfile = {
        //    accountNumber: '',
        //    licenseeFirstName: '',
        //    licenseeLastName: '',
        //    institutionName: '',
        //    email: '',
        //    address1: '',
        //    address2: '',
        //    city: '',
        //    zip: 0,
        //    state: '',
        //    country: '',
        //    phone: 0            
        //}
    }

    ngAfterViewInit(): void {
        this.initializeUIElements();
    }

    initializeUIElements(): void {
        
    }

    ngOnInit(): void {
        /*if (this.application.currentUser == null) {
            this.router.navigate(['/login']);
        }*/
        //this.createForm();
    }

    //private createForm() {        
    //        this.viewUpdateProfileForm = this.formBuilder.group({
    //            accountNo: ['', Validators.compose([Validators.required, Validators.maxLength(50)])],
    //            licenseeFirstName: ['', Validators.compose([Validators.required, Validators.maxLength(50)])],
    //            licenseeLastName: ['', Validators.compose([Validators.required, Validators.maxLength(50)])],
    //            institutionName: ['', Validators.compose([Validators.required, Validators.maxLength(100)])],
    //            email: ['', Validators.compose([Validators.required, Validators.pattern(/^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/)])],
    //            address1: ['', Validators.compose([Validators.required, Validators.maxLength(100)])],
    //            address2: ['', Validators.compose([Validators.required, Validators.maxLength(100)])],  
    //            city: ['', Validators.compose([Validators.required, Validators.maxLength(50)])],
    //            zip: ['', Validators.compose([(Validators.required, Validators.pattern(/^\d{5}$/))])],  // -- Working (5) numbers
    //            state: ['', Validators.required],
    //            country: ['', Validators.required],                
    //            phone: ['', Validators.compose([(Validators.required, Validators.pattern(/^(\()?\d{3}(\))?(-|\s)?\d{3}(-|\s)\d{4}$/))])]               
    //        });

    //        //this.viewUpdateProfileForm.getRawValue()
    //        //    .subscribe(data => this.onValueChanged(data));

    //        //this.onValueChanged(); // (re)set validation messages now
    //}

    showAlert(id: string): void {
        jQuery('#' + id).modal('show');
    }

    //onValueChanged(data ?: any) {
    //    if (!this.viewUpdateProfileForm) { return; }
    //    const form = this.viewUpdateProfileForm;

    //    for (const field in this.formErrors) {
    //        // clear previous error message (if any)
    //        this.formErrors[field] = '';
    //        const control = form.get(field);

    //        if (control && control.dirty && !control.valid) {
    //            const messages = this.validationMessages[field];
    //            for (const key in control.errors) {
    //                this.formErrors[field] += messages[key] + ' ';
    //            }
    //        }
    //    }
    //}

    formErrors = {
        'accountNo': '',
        'licenseeFirstName': '',
        'licenseeLastName': '',
        'institutionName': '',
        'email': '',
        'address1': '',
        'address2': '',
        'city': '',
        'state': '',
        'country': '',
        'zip': '',
        'phone': ''
    };

    validationMessages = {
        'accountNo': {
            'required': 'Account Number is required.'
        },
        'licenseeFirstName': {
            'required': 'LicenseeFirstName is required.'
        },
        'licenseeLastName': {
            'required': 'LicenseeLastName is required.'
        },
        'institutionName': {
            'required': 'InstitutionName is required.'
        },
        'address1': {
            'required': 'Address1 is required.'
        },
        'address2': {
            'required': 'Address2 is required.'
        },
        'city': {
            'required': 'City is required.'
        },
        'state': {
            'required': 'State is required.'
        },
        'country': {
            'required': 'Country is required.'
        },
        'zip': {
            'required': 'Zip is required.',
            'pattern': 'Only 5 digited numbers (US zip) are allowed.'
        },
        'phone': {
            'required': 'Phone is required.',
            'pattern': 'Not a valid US pattern.'
        },
        'email': {
            'required': 'Email is required.',
            'pattern': 'Email pattern is not valid.'
        }
    };
}