import { Component, EventEmitter, Injector, Output, ViewChild } from '@angular/core';
import { AppComponentBase } from '@shared/common/app-component-base';
import {
    LocationServiceProxy, CreateLocationContactInput, CreateContactInput, CreateAddressInput, TimeZoneServiceProxy, PostalCodeServiceProxy, CreateContactAddressInput
} from '@shared/service-proxies/service-proxies';
import * as _ from 'lodash';
import { ModalDirective } from 'ngx-bootstrap';
import { finalize } from 'rxjs/operators';

@Component({
    selector: 'createLocationModal',
    templateUrl: './create-location-modal.component.html'
})
export class CreateLocationModalComponent extends AppComponentBase {

   @ViewChild('createModal', {static: false}) modal: ModalDirective;

    @Output() modalSave: EventEmitter<any> = new EventEmitter<any>();

    active = false;
    saving = false;
    location: CreateLocationContactInput = new CreateLocationContactInput();
    contact: CreateContactAddressInput = new CreateContactAddressInput();
    address: CreateAddressInput = new CreateAddressInput();
    country: any;
    filteredCountries: any;
    city: any;
    filteredCities: any;
    state: any;
    filteredStates: any;
    timeZone: any;
    filteredTimeZones: any;
    postal: any;
    filteredPostal: any;

    constructor(
        injector: Injector,
        private _locationService: LocationServiceProxy,
        private _timeZoneService: TimeZoneServiceProxy,
        private _postalCodeService: PostalCodeServiceProxy
    ) {
        super(injector);
    }

    show() {
        this.active = true;
        // this.init();
        this.modal.show();
    }

    onShown(): void {
        document.getElementById('nameInput').focus();
        this.country = null;
        this.city = null;
        this.state = null;
        this.timeZone = null;
        this.postal = null;

        this.location = new CreateLocationContactInput();;
        this.contact = new CreateContactAddressInput();
        this.address = new CreateAddressInput();;
    }

    init(): void {
      // this.location.contact = null;
    }

    save(): void {
        this.address.postalCodeId = this.postal.id;
        this.contact.address = this.address;
        this.location.timeZoneId = this.timeZone.id;
        this.location.contact = this.contact;
        this.saving = true;
        this._locationService.createLocationContact(this.location)
            .pipe(finalize(() => { this.saving = false; }))
            .subscribe(() => {
                this.notify.info(this.l('SavedSuccessfully'));
                this.close();
                this.modalSave.emit(null);
                console.log(this.location);
            });
    }

    close(): void {
        this.active = false;
        this.modal.hide();
    }


    // filterPostal(event): void {
    //   this._postalCodeService.getPostalCode(
    //       undefined,
    //       event.query,
    //       undefined,
    //       undefined,
    //       undefined
    //   ).subscribe(result => {
    //       this.filteredPostal = result.items;
    //   });
    // }

    // filterCountries(event): void {
    //   this._countryService.getCountry(
    //       undefined,
    //       event.query,
    //       undefined,
    //       undefined,
    //       undefined
    //   ).subscribe(result => {
    //       this.filteredCountries = result.items;
    //   });
    // }

    // filterCities(event): void {
    //   this._cityService.getCity(
    //       undefined,
    //       event.query,
    //       undefined,
    //       undefined,
    //       undefined
    //   ).subscribe(result => {
    //       this.filteredCities = result.items;
    //   });
    // }

    // filterStates(event): void {
    //   this._stateService.getState(
    //       undefined,
    //       event.query,
    //       undefined,
    //       undefined,
    //       undefined
    //   ).subscribe(result => {
    //       this.filteredStates = result.items;
    //   });
    // }


    filterTimeZones(event): void {
      this._timeZoneService.getTimeZone(
          undefined,
          event.query,
          undefined,
          undefined,
          undefined
      ).subscribe(result => {
          this.filteredTimeZones = result.items;
      });
    }
}