import { Component, Injector, OnInit, ViewChild, ViewEncapsulation } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
import { appModuleAnimation } from '@shared/animations/routerTransition';
import { AppComponentBase } from '@shared/common/app-component-base';
import {
    LocationServiceProxy, CreateLocationContactInput, AddressServiceProxy, CreateContactInput, ContactServiceProxy, CreateAddressInput, UpdateLocationInput, UpdateContactInput, UpdateAddressInput, TimeZoneServiceProxy, PostalCodeServiceProxy, CreateContactAddressInput, DistanceInputApi, TrafficInputApi, CreatePostalCodeInput, PostalCodeZoneRegexListDto, TimeSpan, ControllerRouteServiceProxy, LocationGenerationTypeEnum
} from '@shared/service-proxies/service-proxies';
import { LazyLoadEvent } from 'primeng/components/common/lazyloadevent';
import { Paginator } from 'primeng/components/paginator/paginator';
import { Table } from 'primeng/components/table/table';
import { finalize } from 'rxjs/operators';
import * as moment from 'moment';
import { PrimengTableHelper } from '@shared/helpers/PrimengTableHelper';
import * as _ from 'lodash';
import {Location} from '@angular/common';
import { AddressFormComponent } from '@app/shared/layout/form/address-form.component';
import { CommonLookupModalComponent } from '@app/shared/common/lookup/common-lookup-modal.component';
declare var KTWizard: any;
declare var $: any;
declare var KTApp: any;
declare let swal: any;

'use strict';

@Component({
    templateUrl: './edit-location.component.html',
    encapsulation: ViewEncapsulation.None,
    animations: [appModuleAnimation()]
})
export class EditLocationComponent extends AppComponentBase implements OnInit {
    // @ViewChild('dataTable', {static: true}) dataTable: Table;
    // @ViewChild('paginator', {static: true}) paginator: Paginator;
    // @ViewChild('createOrderModal') createOrderModal: CreateOrderModalComponent;
    @ViewChild(AddressFormComponent, {static:false}) addressForm;
    @ViewChild('generationTypeList', {static: true}) generationTypeList: CommonLookupModalComponent;
    
    options: {
        startStep: 1,
        manualStepForward: false
    };

    id: any;
    active = false;
    saving = false;



    defaultTimezone: any;
    defaultCountry: any;
    defaultState: any;
    defaultPostal: any;
    defaultCity: any;

    selectedTimezone: any;
    selectedCountry: any;
    selectedPostalCode: any;
    selectedState: any;
    selectedCity: any;
    selectedAddressType: any;

    selectedGenerationType: any;

    location: UpdateLocationInput = new UpdateLocationInput();
    contact: UpdateContactInput = new UpdateContactInput();
    address: UpdateAddressInput = new UpdateAddressInput();
    postalCodeInput: CreatePostalCodeInput = new CreatePostalCodeInput();
    
    
    distanceList: Array<DistanceInputApi> = [];
    trafficList: Array<TrafficInputApi> = [];
    
    country: any;
    filteredCountries: any;
    city: any;
    filteredCities: any;
    state: any;
    filteredStates: any;
    timeZone: any;
    filteredTimeZones: any;
    postal: any;
    filteredPostal: any;
    swal: any;
    validator: any;
    trafficStartTime: any;
    trafficEndTime: any;

    
    trafficMultiplier: any;
    maxDistance: any;
    distanceMultiplier: any;
    inactive: boolean
    postalCodeRegExList: PostalCodeZoneRegexListDto [];
    locationRegex:string;
    driverThreshold: any;
    driverThresholdId: any;
    searchLocationGenerationType: boolean;
    generationTypeId: any;
    txtLocationGenerationTypeFilter: any;
    showSearchOnStart: any;
    generationTime: any;
    locationGenerationType = LocationGenerationTypeEnum;

    constructor(
        injector: Injector,
        private _locationService: LocationServiceProxy,
        private _timeZoneService: TimeZoneServiceProxy,
        private _postalCodeService: PostalCodeServiceProxy,
        private _addressService: AddressServiceProxy,
        private _contactService: ContactServiceProxy,
        private router: Router,
        private route: ActivatedRoute,
        private _location:Location,
        private _postalCodeServiceProxy: PostalCodeServiceProxy,
        private _routeServiceProxy: ControllerRouteServiceProxy
    ) {
        super(injector);
        // $(document).ready(() => {
        //     this.default(this.id);
            // this.ktwizard();
        // });
    }

    private getDriverInactiveThreshold(): void {
        this._routeServiceProxy.getDriverInactiveThreshold().subscribe(result =>{
            this.driverThreshold = result;
        });
    }

    ngOnInit() {
        this.getDriverInactiveThreshold();
        this.getPostalCodeRegEx();
        this.route.paramMap.subscribe(params => {
            this.id = params.get("id")
        })
        // console.log(this.id)
        this.default(this.id);

        $("#timeZoneSelectInput").change(function () {
            this.selectedTimezone = $("#timeZoneSelectInput option:selected").text();
            $("#selectedTimezone").text(this.selectedTimezone);
        });

        $("#countrySelectInput").change(function () {
            this.selectedCountry = $("#countrySelectInput option:selected").text();
            $("#selectedCountry").text(this.selectedCountry +", ");
        });

        $("#postalSelectInput").change(function () {
            this.selectedPostalCode = $("#postalSelectInput option:selected").text();

            $("#selectedPostalCode").text(this.selectedPostalCode +", ");
        });

        $("#stateSelectInput").change(function () {
            this.selectedState = $("#stateSelectInput option:selected").text();
            $("#selectedState").text(this.selectedState +", ");
        });
        $("#citySelectInput").change(function () {
            this.selectedCity = $("#citySelectInput option:selected").text();
            $("#selectedCity").text(this.selectedCity +", ");
        });
        $("#addressTypeSelectInput").change(function () {
            this.selectedAddressType = $("#addressTypeSelectInput option:selected").text();
            $("#selectedAddressType").text(this.selectedAddressType);
        });

        var KTWizard2=function(){
            var e,r,i;
            return{init:function(){var t;KTUtil.get("kt_wizard_v2"),e=$("#kt_form"),
            (i=new KTWizard("kt_wizard_v2",
            {startStep:1,clickableSteps:!0})).on("beforeNext",function(e){!0!==r.form()&&e.stop()}),
            i.on("beforePrev",function(e){!0!==r.form()&&e.stop()}),i.on("change",function(e){KTUtil.scrollTop()}),
                r=e.validate({ignore:":hidden",
                rules:{
                name:{required:!0},
                minutesPerMileInput:{required:!0},
                minutesPerStopInput:{required:!0},
                timeZoneSelectInput:{required:!0},
                firstNameInput:{required:!0},
                lastNameInput:{required:!0},
                Address1:{required:!0},
                postalSelectInput:{required:!0},
                countrySelectInput:{required:!0},
                defaultGenerationTypeId: { required: true},
                // stateSelectInput:{required:!0},
                citySelectInput:{required:!0}},
                invalidHandler:function(e,r){KTUtil.scrollTop(),swal.fire({title:"",text:"There are some errors in your submission. Please correct them.",
                type:"error",confirmButtonClass:"btn btn-secondary"})},
                submitHandler:function(e){}})
            }}}();
            jQuery(document).ready(function(){KTWizard2.init()});
            setTimeout(function(){ 
                $('.kt-select2').select2();
                // console.log('trigerred')
             }, 1500); 

        this.getGenerationTypesInit();

    }

    ngAfterViewInit() {
        setTimeout(function(){ 
            $('.kt-select2').select2();
            // console.log('trigerred')
         }, 1500); 
        // $('.kt-select2').select2();
        //this.ktwizard();
    }

    isNumeric = (val: string) : boolean => {
        return !isNaN(Number(val));
     }

    save(): void {
        this.saving = true;
        this.location.timeZoneId = Number((<HTMLInputElement>document.getElementById('timeZoneSelectInput')).value);
        // this.address.postalCodeId = Number((<HTMLInputElement>document.getElementById('postalSelectInput')).value);
        if (Number((<HTMLInputElement>document.getElementById('addressTypeSelectInput')).value) == 0) {
            this.address.addressTypeId = null;
        } else {
            this.address.addressTypeId = Number((<HTMLInputElement>document.getElementById('addressTypeSelectInput')).value);
        }
        this.location.timeZoneId = Number((<HTMLInputElement>document.getElementById('timeZoneSelectInput')).value);
        this.location.postalCodeRegEx = $("#regExSelectInput").val();
        this.location.trafficAdjustment = this.trafficList;
        this.location.distanceAdjustment = this.distanceList;
        this.location.inActive = !this.inactive
        this.location.generationTime = new Date(this.generationTime).toLocaleTimeString('en-US', { hour12: true, 
            hour: "numeric", 
            minute: "numeric",
            second: "numeric"
            }) as any;
        this.location.generationType = this.generationTypeId;
        this.postalCodeInput.city = this.addressForm.city;
        this.postalCodeInput.state = this.addressForm.state;
        this.postalCodeInput.value = this.addressForm.value;
        this.postalCodeInput.country = this.addressForm.country;
        this.address.latitude = this.addressForm.latitude == '' || this.addressForm.latitude === undefined || this.addressForm.latitude == null ? 0 : this.addressForm.latitude;
        this.address.longitude = this.addressForm.longitude == '' || this.addressForm.longitude === undefined || this.addressForm.longitude == null ? 0 : this.addressForm.longitude;
        this.address.formattedAddress = this.addressForm.formattedAddress;
        this.location.etaRoundUp = $('#etaRoundUp').val()
        this.location.driverInActiveThreshold = this.isNumeric($("#driverInactive").val()) ? $("#driverInactive").val() : undefined;

        // console.log(this.location.trafficAdjustment)
                this._postalCodeServiceProxy.createPostalCode(this.postalCodeInput)
                                            .pipe()
                                            .subscribe(result => {
                                                this.address.postalCodeId = result
                    this._addressService.updateAddress(this.address).subscribe(result => {
                        // console.log(result)
                        this.contact.addressId = result
                        this._contactService.updateContact(this.contact).subscribe(result => {
                            this.location.contactId = result
                            this._locationService.updateLocation(
                                this.location
                            ).pipe(finalize(() => { this.saving = false; }))
                            // finalize(() => { this.saving = false; })
                                .subscribe(success => {
                                    // this.saving = false;
                                    this.notify.info(this.l('SavedSuccessfully'));
                                    this.router.navigate(['/app/sprintship/locations']);
                                }),
                                error => {
                                    this.saving=false;
                                }
                        }),
                        error => {
                            this.saving=false;
                        }
                    }),
                    error => {
                        this.saving=false;
                    }
                }),
                error => {
                    this.saving=false;
                }
           
    }


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

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

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

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


    filterTimeZones(maxcount): void {
        this._timeZoneService.getTimeZone(
            undefined,
            undefined,
            undefined,
            undefined,
            maxcount,
            undefined
        ).subscribe(result => {
            this.filteredTimeZones = result.items;
            //$(".kt-content").show();

        });
    }

    default(locationId: any): void {
        this.active = true;
        //$(".kt-content").hide();
        let maxcount = 1000;
        this.spinnerService.show()
        this._locationService.getLocationInActiveBoolean(locationId)
                             .subscribe(result=> {
            this._locationService.getLocation(locationId, undefined, undefined, undefined, result, undefined, undefined, undefined, undefined)
            .subscribe(result => {
                // console.log(result.items);
                // this.locations = result.items;
                if (result.items[0]['contact'] != undefined) {
                    // console.log("inif")
                    this.addressForm.country = result.items[0]['contact']['address']['postalCode']['country'];
                    this.defaultState = result.items[0]['contact']['address']['postalCode']['state'];
                    this.defaultCity = result.items[0]['contact']['address']['postalCode']['city'];
                    this.defaultPostal = result.items[0]['contact']['address']['postalCode']['value'];

                    this.addressForm.country = result.items[0]['contact']['address']['postalCode']['country'];
                    this.addressForm.value = result.items[0]['contact']['address']['postalCode']['value'];
                    this.addressForm.state = result.items[0]['contact']['address']['postalCode']['state'] == null ? '' :  this.selectedState = result.items[0]['contact']['address']['postalCode']['state'];
                    this.addressForm.city = result.items[0]['contact']['address']['postalCode']['city'];
                    this.addressForm.latitude = result.items[0]['contact']['address']['geocode']['latitude'];
                    this.addressForm.longitude = result.items[0]['contact']['address']['geocode']['longitude'];

                    this.addressForm.formattedAddress = result.items[0]['contact']['address']['formattedAddress'];

                    this.selectedAddressType = result.items[0]['contact']['address']['addressType'] === undefined ? '' : this.selectedAddressType = result.items[0]['contact']['address']['addressType']['name'];
                    // console.log(this.selectedPostalCode)
                    // console.log(this.selectedState)
                    //contact input
                    this.contact.firstName = result.items[0]['contact']['firstName'];
                    this.contact.lastName = result.items[0]['contact']['lastName'];
                    this.contact.addressId = result.items[0]['contact']['address']['id'];

                    //address input
                    this.address.addressLine1 = result.items[0]['contact']['address']['addressLine1'];
                    this.address.addressLine2 = result.items[0]['contact']['address']['addressLine2'];
                    this.address.postalCodeId = result.items[0]['contact']['address']['postalCode']['id'];
                    this.address.id = result.items[0]['contact']['address']['id'];
                    this.address.addressTypeId = result.items[0]['contact']['address']['addressType'] === undefined ? 0 : result.items[0]['contact']['address']['addressType']['id'];
                    this.address.geocodeId=result.items[0]['contact']['address']['geocode'] == undefined ? undefined : result.items[0]['contact']['address']['geocode']['id'];
                    this.contact.id = result.items[0]['contactId'];
                    this.contact.userId = result.items[0]['userId'] == 0 || result.items[0]['userId'] == null ? null : result.items[0]['userId'];

                    this.distanceList = result.items[0].distanceAdjustment;
                    this.trafficList = result.items[0].trafficAdjustment;
                    

                }
                
                this.defaultTimezone = result.items[0]['timeZoneId'];
                this.inactive = !result.items[0].inActive
                //location Input
                this.location.id = locationId;
                this.location.name = result.items[0]['name'];
                this.location.code = result.items[0]['code'];
                this.location.minutesPerMile = result.items[0]['minutesPerMile'];
                this.location.minutesPerStop = result.items[0]['minutesPerStop'];
                this.location.loadLimit = result.items[0]['loadLimit'];
                this.location.contactId = result.items[0]['contactId'];
                this.location.leadTime = result.items[0]['leadTime'];
                this.location.etaRoundUp = result.items[0]['etaRoundUp'];
                this.location.goBackTimeWindow = result.items[0]['goBackTimeWindow'];
                this.selectedTimezone = result.items[0]['timeZone']['value'];
                this.filterTimeZones(maxcount);
                this.locationRegex = result.items[0].postalCodeRegEx;
                this.txtLocationGenerationTypeFilter = this.locationGenerationType[result.items[0].generationType]
                this.selectedGenerationType = this.txtLocationGenerationTypeFilter;
                this.generationTypeId = result.items[0].generationType;
                this.generationTime = new Date(moment().format('YYYY-MM-DD') + ' ' + result.items[0].generationTime);
                this.driverThresholdId = result.items[0].driverInactiveThreshold;
                this.spinnerService.hide();
                this.showSearchOnStart = this.generationTypeId != null ? false : true;
                $('#etaRoundUp').val(this.location.etaRoundUp).trigger('change')

            });
        });
        
    }


    navigate(url: any, id?: number) {
        if (id != null) {
            var myurl = `${url}/${id}`;
        } else {
            var myurl = `${url}`;
        }
        // console.log(myurl);
        this.router.navigateByUrl(myurl);
    }

    // Class definition
    ktwizard(): void {
        // Base elements
        var wizardEl;
        var formEl;
        var validator;
        var wizard;

        var wizardElem = document.querySelector('#kt_wizard_v2');
        // Private functions
        var initWizard = function () {
            // Initialize form wizard
            wizard = new KTWizard(wizardElem, {
                startStep: 1,
                clickableSteps: false
            });

            // Validation before going to next page
            wizard.on('beforeNext', (wizardObj) => {
                if (wizardObj.currentStep == 1) {
                    if ($('#nameInput').val() == ''
                        || $('#minutesPerMileInput').val() == ''
                        || $('#minutesPerStopInput').val() == ''
                        || $('#timeZoneSelectInput').val() == '') {
                        wizardObj.stop();  // don't go to the next step
                    }
                }
                else if (wizardObj.currentStep == 3) {
                    if ($('#address1Input').val() == '' || $('#countrySelectInput').val() == '' || $('#postalSelectInput').val() == '' || $('#stateSelectInput').val() == '' || $('#citySelectInput').val() == '') {
                        wizardObj.stop();
                    }
                }
                else if (wizardObj.currentStep == 4) {
                    if ($('#defaultGenerationTypeId').val() == '') {
                        wizardObj.stop();
                    }
                }
                //    console.log(wizardObj.currentStep);
                //console.log($(#nameInput).val());
            });
            // Change event
            wizard.on('change', function (wizard) {
                KTUtil.scrollTop();
            });

            // nextButton.addEventListener('click', function() {
            //     var validation = false;
            
            //     // do some validation here
            
            //     // Go to the next step only if validation is success
            //     if (validation === true) {
            //         wizardObj.goNext();
            //     }
            // });
        }
        wizardEl = KTUtil.get('kt_wizard_v2');
        formEl = $('#kt_form').serialize();

        return initWizard();
        //return initValidation();
        //return initSubmit();
    }
    goBack(){
        this._location.back();
    }

    addDistance(){
        let key, distance, value;
        distance = Number((<HTMLInputElement>document.getElementById('maxDistance')).value);
        value = Number((<HTMLInputElement>document.getElementById('distanceMultiplier')).value);
        let distInput = new DistanceInputApi();
        distInput.maxDistance = distance;
        distInput.multiplier =  value;
        this.distanceList.push(distInput);
    }

    addTimeTraffic(){
        let key, start, end, value;
        start = moment(this.trafficStartTime).local().format("HH:mm:ss");
        end = moment(this.trafficEndTime).local().format("HH:mm:ss");
        // console.log(start);
        // console.log(end);
        value = Number((<HTMLInputElement>document.getElementById('trafficMultiplier')).value);
        let traffictInput = new TrafficInputApi();
        traffictInput.trafficStartTime = start;
        traffictInput.trafficEndTime =  end;
        traffictInput.multiplier =  value;
        this.trafficList.push(traffictInput);
    }
    
    removeDistance(distanceItem){
        let key;
        for (key in this.distanceList) {
            if (distanceItem.maxDistance == this.distanceList[key].maxDistance && distanceItem.multiplier == this.distanceList[key].multiplier ) {
                this.distanceList.splice(key, 1)
            }
        }
    }

    removeTimeTraffic(trafficItem){
        let key;
        for (key in this.trafficList) {
            if (trafficItem.trafficStartTime == this.trafficList[key].trafficStartTime && trafficItem.trafficEndTime == this.trafficList[key].trafficEndTime && trafficItem.multiplier == this.trafficList[key].multiplier ) {
                this.trafficList.splice(key, 1)
            }
        }
    }

    getPostalCodeRegEx():void{
        this._locationService.getPostalCodeRegExList().subscribe(result =>{
            this.postalCodeRegExList = result;
        });
    }

    getGenerationTypesInit() {
        this.generationTypeList.configure({
            title: this.l('Select Type'),
            dataSource: (skipCount: number, maxResultCount: number, filter: string, tenantId?: number, locationId?:number) => {
                return this._locationService.getLocationGenerationType(filter);
            }
        });
    }
    
    getLocationGenerationTypeList(filter : any) {
        this.searchLocationGenerationType = false;
        this.generationTypeList.show();
        this.generationTypeList.filterText = filter;
    }

    clearLocationGenerationTypeList(){
        this.txtLocationGenerationTypeFilter = '';
        this.generationTypeId = null;
        this.showSearchOnStart = true;
    }

    selectGenerationType(item) {
        var resultId = item.value;
        var name = item.name
        if(this.searchLocationGenerationType){
            this.generationTypeId = resultId;
            this.txtLocationGenerationTypeFilter = name;
            this.searchLocationGenerationType = false;
            this.selectedGenerationType = name;
            this.generationTypeId = false;
        }
        else{
            this.generationTypeId = resultId;
            this.txtLocationGenerationTypeFilter = name;
            this.selectedGenerationType = name;
            this.showSearchOnStart = false;
      }
    }

}