import { Component, OnInit, Input } from '@angular/core';
import { FormBuilder, FormGroup } from '@angular/forms';

import {ValidationMessageOptionType, PrefilledParameters} from '@bpost/bp-address-auto-complete-by-component';

@Component({
  selector: 'app-widget',
  templateUrl: './widget.component.html',
  styleUrls: ['./widget.component.scss']
})
export class WidgetComponent implements OnInit {

  // In principle, no need to define any url here, using the default provided by the library is enough.
  // But in case of any critical incident, we provide the possibility to reroute the requests
  
  //private baseUrl = "<see documentation>";

  @Input()
  selectedLanguage: string="fr";

  @Input()
  defaultLanguage: string="fr";

  

  clearInput: { setFocus: boolean, timestamp: Date } = null; // { setFocus: true, timestamp: new Date() };

  selectedAddress: any = null;
  completeAddress: string = null;
  isInternal: boolean=false;
  prefilledParameters: PrefilledParameters;
  unstructuredAddress: string;
  streetName: string;
  streetNumber: string;
  boxNumber: string;
  postalCode: string;
  municipalityName: string;
  state = false;
  //localityUrl = this.baseUrl + 'locality';
  localityUrl=undefined;
  //streetUrl = this.baseUrl + 'street';
  streetUrl=undefined;
  //streetNumberUrl = this.baseUrl + 'streetNumber';
  streetNumberUrl=undefined;
  //boxNumberUrl = this.baseUrl + 'boxNumber';
  boxNumberUrl=undefined;
  notInListAllowed: boolean=false;

  minLevel: number;
  prefillLevel: number;
  prefillShowSuggestions = false;

  form: FormGroup;
  formSubmitted = false;

  defaultValidationMessageOptionType = ValidationMessageOptionType.SHOW;
  validationMessageOption = {validationType: this.defaultValidationMessageOptionType, timestamp: new Date() };
  selectedValidationMessageOption = this.defaultValidationMessageOptionType;

  validationMessageOptions /*: [{key: ValidationMessageOptionType, val: string}]*/ = [
    {key: ValidationMessageOptionType.SHOW, val: 'Show'},
    {key: ValidationMessageOptionType.EMIT, val: 'Emit'}
  ];

  messageOptions: Array<object> = [
    { id: 'Y', name: 'ON' },
    { id: 'P', name: 'ON(P)' },
    { id: 'N', name: 'OFF' }
  ];

  maxSuggestions: Array<object> = [
    { id: 5, name: 'Default(5)' },
    { id: 10, name: '10' },
    { id: 20, name: '20' },
    { id: 50, name: '50' },
    { id: 100, name: '100' },
    { id: 99999, name: '99999' }
  ];

  visibleSuggestions: Array<object> = [
    { id: 5, name: 'Default(5)' },
    { id: 10, name: '10' },
    { id: 15, name: '15' },
    { id: 20, name: '20' }
  ];

  localitySortCriterias: Array<object> = [
    { id: '', name: 'Server Decides' },
    { id: 'P', name: 'Postal Codes' },
    { id: 'L', name: 'Locality' },
  ];

  streetSortCriterias: Array<object> = [
    { id: '', name: 'Server Decides' },
    { id: 'S', name: 'Street Names' }
  ];

  streetNbSortCriterias: Array<object> = [
    { id: '', name: 'Server Decides' },
    { id: 'S', name: 'Street Numbers' }
  ];

  boxNbSortCriterias: Array<object> = [
    { id: '', name: 'Server Decides' },
    { id: 'B', name: 'Box Numbers' }
  ];

  selectedMessage = {};

  maxSuggestionLocality: object;
  visibleSuggestionLocality: object;
  sortCriteriaLocality: object;

  maxSuggestionStreet: object;
  visibleSuggestionStreet: object;
  sortCriteriaStreet: object;

  maxSuggestionStreetNb: object;
  visibleSuggestionStreetNb: object;
  sortCriteriaStreetNb: object;

  maxSuggestionBoxNb: object;
  visibleSuggestionBoxNb: object;
  sortCriteriaBoxNb: object;

  apiKey: string = undefined;
  //apiKey: string = '';
  environment: string;

  showSelectedAddress = false;
  showDebugMessageToConsole = false;

  nis9InResponse=false;
  isReadonly=false;
  suggestionLevel=2;
  allowNoValidation=false;
  validatedByBackend=true;
  numberOfExceptions:number;

  constructor(
    private formBuilder: FormBuilder
  ) { }

  ngOnInit() {
    this.numberOfExceptions=0;
    this.selectedMessage = this.messageOptions[0];

    this.maxSuggestionLocality = this.maxSuggestionStreet = this.maxSuggestionStreetNb = this.maxSuggestionBoxNb =  this.maxSuggestions[0];
    this.visibleSuggestionLocality = this.visibleSuggestionStreet = this.visibleSuggestionStreetNb = this.visibleSuggestionBoxNb =
    this.visibleSuggestions[0];
    // tslint:disable-next-line:max-line-length
    this.sortCriteriaLocality = this.sortCriteriaStreet = this.sortCriteriaStreetNb = this.sortCriteriaBoxNb = this.localitySortCriterias[0];


    this.selectedAddress = null; // $$ {};
    this.isInternal = false;
    this.notInListAllowed = false;
    this.unstructuredAddress = '';
    this.streetName = '';
    this.streetNumber = '';
    this.boxNumber = '';
    this.postalCode = '';
    this.municipalityName = '';
    this.minLevel = 4;
    this.prefillLevel = 4;
    //this.setToSt2();
    //this.setToInternal();
    this.prefilledParameters = new PrefilledParameters();
    this.buildForm();
    // this.prefillParams();
  }

  buildForm() {
    this.form = this.formBuilder.group({
      postalCode: [null],
      municipalityName: [null],
      streetName: [null],
      streetNumber: [null],
      boxNumber: [null],
    });
  }

  onSubmit(event) {
    event.preventDefault();
    this.formSubmitted = true;

    if (this.form.valid) {
      this.prefillParams(this.form.value); // Process form

    }
  }

  inputChange() {
    const boxNumber = this.form.value.boxNumber;
    const streetNumber = this.form.value.streetNumber;
    const streetName = this.form.value.streetName;
    if (boxNumber && boxNumber.trim().length > 0) {
      this.prefillLevel = 1;
    } else if (streetNumber && streetNumber.trim().length > 0) {
      this.prefillLevel = 2;
    } else if (streetName && streetName.trim().length > 0) {
      this.prefillLevel = 3;
    } else {
      this.prefillLevel = 4;
    }
  }

  prefillParams(formData) {
    const prefilledParameters = new PrefilledParameters({
      streetName: formData.streetName ? formData.streetName : '',
      streetNumber: formData.streetNumber ? formData.streetNumber : '',
      boxNumber: formData.boxNumber ? formData.boxNumber : '',
      postalCode: formData.postalCode ? formData.postalCode : '',
      municipalityName: formData.municipalityName ? formData.municipalityName : '',
      state: !this.state
    });
    prefilledParameters.onFocusShowSuggestionsAfterPrefill = this.prefillShowSuggestions;

    // this.minLevel = this.prefilledParameters.minLevel;
    this.minLevel = 4;

    this.prefilledParameters = prefilledParameters;
  }
/*
  prefillUnstructuredParams() {
    this.prefilledParameters = new PrefilledParameters({
      unstructuredAddress: this.unstructuredAddress
    });
    this.resetMinLevelToLocality();
  } */

  fillForm(event) {
    switch (event.which) {
      // enter pressed
      case 13:
        // this.prefillUnstructuredParams();
        event.preventDefault();
        break;
      default:
        break;
    }
  }

  resetMinLevelToLocality() {
    this.minLevel = 4;
  }

  clearPrefilledUnstructuredParams() {
    this.unstructuredAddress = '';
  }

  setMessageOption(option, event?) {
    this.selectedMessage = option;
    if (event) { event.preventDefault(); }
  }

  setNotInListOption(option, event?) {
    this.notInListAllowed = option;
    if (event) { event.preventDefault(); }
  }

  setMaxSuggestion(option: object, level: number, event?) {
    if (event) { event.preventDefault(); }
    switch (level) {
      case 1:
        this.maxSuggestionBoxNb = option;
        break;

      case 2:
        this.maxSuggestionStreetNb = option;
        break;

      case 3:
        this.maxSuggestionStreet = option;
        break;

      case 4:
          this.maxSuggestionLocality = option;
          break;
      default:
        break;
    }
  }

  setVisibleSuggestion(option: object, level: number, event?) {
    if (event) { event.preventDefault(); }
    switch (level) {
      case 1:
        this.visibleSuggestionBoxNb = option;
        break;

      case 2:
        this.visibleSuggestionStreetNb = option;
        break;

      case 3:
        this.visibleSuggestionStreet = option;
        break;

      case 4:
          this.visibleSuggestionLocality = option;
          break;
      default:
        break;
    }
  }

  setSortCriteria(option: object, level: number, event?) {
    if (event) { event.preventDefault(); }
    switch (level) {
      case 1:
        this.sortCriteriaBoxNb = option;
        break;

      case 2:
        this.sortCriteriaStreetNb = option;
        break;

      case 3:
        this.sortCriteriaStreet = option;
        break;

      case 4:
          this.sortCriteriaLocality = option;
          break;
      default:
        break;
    }
  }

  onClearInput(focus: boolean) {
    this.clearInput = { setFocus: focus, timestamp: new Date() };
    // this.selectedAddress = null;
  }

  onAddressComplete(event) {
    console.log('address complete:', event);
    
    this.showSelectedAddress = false;
    this.selectedAddress = event;
    this.updateCompleteAddress();
    this.showSelectedAddress = true;
  
  }

  updateCompleteAddress() {
    if (this.selectedAddress) {
      let concatStr = '';
      concatStr += this.selectedAddress.streetName ? `${this.selectedAddress.streetName} ` : '';
      concatStr += this.selectedAddress.houseNumber ? `${this.selectedAddress.houseNumber} ` : '';
      concatStr += this.selectedAddress.boxNumber ? `${this.getBoxPrefix()} ${this.selectedAddress.boxNumber} ` : '';
      concatStr += this.selectedAddress.postalCode ? `${this.selectedAddress.postalCode} ` : '';
      concatStr += this.selectedAddress.municipalityName ? `${this.selectedAddress.municipalityName} ` : '';
      this.completeAddress = concatStr;
    } else {
      this.completeAddress = '';
    }
  }

  getBoxPrefix(): string {
    let prefix = '';
    switch (this.selectedLanguage) {
      case 'fr':
        prefix = 'BTE';
        break;
      case 'nl':
          prefix = 'BUS';
          break;
      default:
        prefix = 'BOX';
        break;
    }
    return prefix;
  }

  isAddressComplete(): boolean {
    if (this.selectedAddress && this.selectedAddress.isComplete === true ) {
      return true;
    }
    return false;
  }

  onAddressValidationMessage(event) {
    console.log('Validation message:', event);
  }

  onSetValidationMessageOption(option, $event) {
    this.selectedValidationMessageOption = option;
    switch (option) {
      case 'EMIT':
        this.validationMessageOption = {validationType: ValidationMessageOptionType.EMIT, timestamp: new Date() };
        break;
      case 'SHOW':
        this.validationMessageOption = {validationType: ValidationMessageOptionType.SHOW, timestamp: new Date() };
        break;
    }
  }

  isSelectedAddressPresent(): boolean {
    return this.selectedAddress && this.selectedAddress !== null && this.selectedAddress !== undefined;
  }

  onClearInputEventEmitter(event: any) {
    console.log('clear input done: ', event);
    this.showSelectedAddress = false;
  }

  onPrefillShowSuggestions(show: boolean) {
    this.prefillShowSuggestions = show;
  }

  onSetLoggingMessageOption(show: boolean, event: any) {
    this.showDebugMessageToConsole = show;
  }

  onSetNis9InResponse(includeNis9: boolean, event: any): void {
    this.nis9InResponse = includeNis9;
  }

  onSetReadOnly(readonly: boolean, event: any): void {
    this.isReadonly = readonly;
  }

  onSetSuggestionType(level: number, $event) {
    this.suggestionLevel = level;
  }
  onSetAllowNoValidation(allowNoValidation: boolean, event: any): void {
    this.allowNoValidation = allowNoValidation;
    if(!allowNoValidation){
      this.validatedByBackend=true;
      this.numberOfExceptions=0;
    }
  }

  setValidatedByBackend(event){
    this.validatedByBackend=event;
  }

  setNumberOfExceptions(event){
    this.numberOfExceptions=event;
  }

}