import {
    Component,
    Injector,
    OnInit,
    OnDestroy,
    ViewChild,
    AfterViewChecked,
    AfterViewInit,
    AfterContentInit,
    ViewEncapsulation,
    ElementRef,
    Directive,
    Input,
    EventEmitter,
    Output,
} from "@angular/core";
import { AppComponentBase } from "@shared/common/app-component-base";
import {
    TenantDashboardServiceProxy,
    GetLocationDataOutput,
    GetRouteTypeDataOutput,
    GetLocationRouteDataCompletedOutput,
    LocationServiceProxy,
    LocationListDto,
    LocationNameDto,
    GetLocationNamesInputPage,
    NameValueDto,
} from "@shared/service-proxies/service-proxies";
import { WidgetComponentBase } from "../widget-component-base";
import { appModuleAnimation } from "@shared/animations/routerTransition";
import { ModalDirective } from "ngx-bootstrap";
import { ActivatedRoute, Router } from "@angular/router";
import * as jquery from "jquery";
import { CommonLookupModalComponent } from "@app/shared/common/lookup/common-lookup-modal.component";
import { timeout } from "rxjs/operators";
import { CommonLookupCheckboxModalComponent } from "@app/shared/common/lookup/common-lookup-checkbox-modal.component";
declare var $: any;

@Component({
    selector: "app-widget-route-location",
    templateUrl: "./widget-route-location.component.html",
    animations: [appModuleAnimation()],
    styleUrls: ["./widget-route-location.component.css"],
})
export class WidgetRouteLocationComponent
    extends WidgetComponentBase
    implements OnInit, OnDestroy
{
    @ViewChild("fullScreen", { static: false }) divRef;
    @ViewChild("locationLists", { static: true })
    locationsList: CommonLookupModalComponent;
    @ViewChild("laboratoryLists", { static: true })
    laboratoryLists: CommonLookupModalComponent;
    @ViewChild("routeTypeLists", { static: true })
    routeTypeLists: CommonLookupModalComponent;
/*    @ViewChild("autoRefreshLists", { static: true })
    autoRefreshLists: CommonLookupModalComponent;
    @ViewChild("completedRoute", { static: true })
    completedRoute: CommonLookupModalComponent;
    @ViewChild("runningRoute", { static: true })
    runningRoute: CommonLookupModalComponent;*/
    @ViewChild("multipleRouteTypeLists", { static: true })
    multipleRouteTypeLists: CommonLookupCheckboxModalComponent;

    locationResponse: any;
    routeCompleted: any[] = [];
    locationRouteResponse: GetLocationDataOutput = new GetLocationDataOutput();
    locationRouteResponseCompleted: any;
    routeTypes: any;
    locationTime: any;
    locaitonAmPm: any;
    lastSchedAmPm: any;
    lastSched: any;
    lastschedTime: any;
    nextArrivalTime: any;
    nextArrivalTimeAmPm: any;
    nextArrivalSample: any;
    nextArrivalRoute: any;
    isHidden = true;

    nextArrivalTimeDef: any;
    nextArrivalTimeAmPmDef: any;

    initialVal: any;
    initialDate = "";
    isfullscreen = false;
    routeTypeId = undefined;
    routeTypeIds: any;

    routeTypeName: any;

    interval: any;

    completion: any;
    completedRoutes = 0;
    routesPending: any;

    timerId: 300000;

    minutesFilter = 0;

    refrehText = "5 mins";
    refreshDefaultVal = 0;

    RouteDate = new Date();

    showSettings = true;
    showTypes = false;
    cfHeight: any;

    dateInput: any;

    loading = false;

    locations: LocationNameDto[] = [];
    txtLocation: any;
    laboratories: any;
    txtLaboratory: any;
    labTxt: any;
    labAddress: any;
    labId: any;
    actionType: any;
    actionTxt: any;
    hideType = true;
    showAfter = false;
    showAfterLastSched = false;

    locationId: number;
    locationName: string;
    laboratoryId: number;
    laboratoryName: string;
    dashboardRouteTypeId: number;
    dashboardRouteTypeName: string = '';
    autoRefreshId: number = 0;
    autoRefreshValue: string;
    completedRouteId: number = 0;
    completedRouteValue: string = '';
    runningRouteId: number = 0;
    runningRouteValue: string = '';
    routeType = [];
    routeTypeArray = [];
    routeTypeMap: NameValueDto[] = [];

    routeTypeIds2 = [];
    routeTypeNames2 = [];

    totalOnRoute = 0;
    totalCompleted = 0;

    constructor(
        injector: Injector,
        private _tenantDashboardService: TenantDashboardServiceProxy,
        private _locationServiceProxy: LocationServiceProxy,
        private _router: Router,
        private route: ActivatedRoute
    ) {
        super(injector);

        $("nav").attr("style", "display: none !important");
        $("#fs").hide();

        document.addEventListener("fullscreenchange", exitHandler);

        function exitHandler() {
            if (!document.fullscreenElement) {
                ///fire your event
                this.cfHeight = {
                    "padding-top": "20px",
                };
                this.showTypes = false;

                this.isfullscreen = false;
                this.isHidden = true;
                this.locationResponse = null;
                this.locationRouteResponseCompleted = null;
                this.nextArrivalTime = null;
                this.nextArrivalTimeAmPm = null;
                this.nextArrivalSample = null;
                this.nextArrivalRoute = null;
                clearInterval(this.interval);
                $("#fs").hide();
                this.showAfter = false;
                this.showAfterLastSched = false;
            }
        }
    }

    onShown(): void {
        $(".kt-select2").select2();
    }

    ngOnInit() {
        $("nav").attr("style", "display: flex !important");
        $("#fs").hide();

        //this.openFullscreen();

        //this.subLocationFilter();
        //this.subDateFilter();
        if (this.routeTypeId == undefined) {
            this.routeTypeId = 0;
        }
        this.autoRefreshValue = "5 mins";
        this.autoRefreshId = 0;

        if (this.initialVal == undefined) {
            if (localStorage.getItem("operatingLocationId") != undefined) {
                if (
                    localStorage.getItem("operatingLocationId").search(",") > 0
                ) {
                    var array = localStorage
                        .getItem("operatingLocationId")
                        .split(",");
                    this.initialVal = array[0];
                } else {
                    this.initialVal = localStorage.getItem(
                        "operatingLocationId"
                    );
                }
            } else {
            }
        }

        if (this.routeTypeName == undefined) {
            this.routeTypeName = "All";
        }
        this.getLocations();
        this.getRouteTypes();
        this.getLaboratories(this.initialVal);

        $(".kt-select2").select2();
    }

    showSetting() {
        this.showSettings = true;
    }

    showRouteTypes() {
        this.showTypes = true;
        this.cfHeight = {
            "padding-top": "20px",
        };
    }

    hideRouteTypes() {
        this.cfHeight = {
            "padding-top": "20px",
        };
        this.showTypes = false;
    }

    hideSetting() {
        this.showSettings = false;
    }

    setDate(newDate) {
        //console.log(newDate);
        this.dateInput = newDate;
    }

    getLocations() {
        //var result = document.getElementsByClassName("bs-datepicker-container");
        //console.log(result);
        let defaultLoc = localStorage.getItem("operatingLocationId");
        let that = this;
        this._locationServiceProxy
            .getLocationNames(
                undefined,
                undefined,
                undefined,
                undefined,
                undefined,
                undefined
            )
            .subscribe(
                //function(response) { console.log("Success Response" + response)},
                //function(error) { console.log("Error happened" + error)},
                (result) => {
                    that.locations = result;
                    if (result != null) {
                        if (this.txtLocation == undefined) {
                            if (
                                localStorage.getItem("operatingLocationId") !=
                                undefined
                            ) {
                                if (
                                    localStorage
                                        .getItem("operatingLocationId")
                                        .search(",") > 0
                                ) {
                                    var array = localStorage
                                        .getItem("operatingLocationId")
                                        .split(",");
                                    this.initialVal = array[0];
                                } else {
                                    this.initialVal = localStorage.getItem(
                                        "operatingLocationId"
                                    );
                                }
                            } else {
                                this.txtLocation = result[0].id.toString();
                            }
                        }
                    }
                }
            );
    }

    getLaboratories(locationId: any): void {
        this._tenantDashboardService
            .getLaboratoryData(locationId)
            .subscribe((data) => {
                this.laboratories = data;

                if (this.txtLaboratory == undefined) {
                    if (data.length != 0) {
                        this.txtLaboratory = data[0].contactId;
                    }
                }
            });
    }

    onOptionsSelected(value: string) {
        let locId = Number(value);

        this.getLaboratories(locId);
    }

    onOptionsSelectType(value: string) {
        let typeId = Number(value);

        if (typeId != 0) {
            this.hideType = false;
        } else {
            this.hideType = true;
        }
    }

    getRouteTypes(): void {
        this._tenantDashboardService.getRouteTypeData().subscribe((data) => {
            this.routeTypes = data;
        });
    }

    openFullscreen(): void {
        //this.showFullScreen = true;
        // Use this.divRef.nativeElement here to request fullscreen
        const elem = this.divRef.nativeElement;
        //var result = document.getElementsByClassName("bs-datepicker-container");

        if (elem.requestFullscreen) {
            elem.requestFullscreen();
        } else if (elem.msRequestFullscreen) {
            elem.msRequestFullscreen();
        } else if (elem.mozRequestFullScreen) {
            elem.mozRequestFullScreen();
        } else if (elem.webkitRequestFullscreen) {
            elem.webkitRequestFullscreen();
        }
        this.isfullscreen = true;
    }

    closeFullscreen(): void {
        const docWithBrowsersExitFunctions = document as Document & {
            mozCancelFullScreen(): Promise<void>;
            webkitExitFullscreen(): Promise<void>;
            msExitFullscreen(): Promise<void>;
        };
        if (docWithBrowsersExitFunctions.exitFullscreen) {
            docWithBrowsersExitFunctions.exitFullscreen();
        } else if (docWithBrowsersExitFunctions.mozCancelFullScreen) {
            /* Firefox */
            docWithBrowsersExitFunctions.mozCancelFullScreen();
        } else if (docWithBrowsersExitFunctions.webkitExitFullscreen) {
            /* Chrome, Safari and Opera */
            docWithBrowsersExitFunctions.webkitExitFullscreen();
        } else if (docWithBrowsersExitFunctions.msExitFullscreen) {
            /* IE/Edge */
            docWithBrowsersExitFunctions.msExitFullscreen();
        }

        this.cfHeight = {
            "padding-top": "20px",
        };
        this.showTypes = false;
        this.locationResponse = null;
        this.nextArrivalTime = null;
        this.nextArrivalTimeAmPm = null;
        this.nextArrivalSample = null;
        this.nextArrivalRoute = null;
        this.isfullscreen = false;
        this.isHidden = true;
        $("#fs").hide();
        this.showAfter = false;
        this.showAfterLastSched = false;
    }

    ngAfterViewInit() {
        //this.openFullscreen();
        $(".kt-select2").select2();
        $("nav").attr("style", "display: flex !important");
        this.locationsList.configure({
            title: this.l("Select Location"),
            dataSource: (
                skipCount: number,
                maxResultCount: number,
                filter: string,
                tenantId?: number,
                locationId?: number
            ) => {
                let input = new GetLocationNamesInputPage();
                input.filter = filter;
                input.maxResultCount = maxResultCount;
                input.skipCount = skipCount;
                return this._locationServiceProxy.assignLocationList(input);
            },
        });
        this.laboratoryLists.configure({
            title: this.l("Select Laboratory"),
            dataSource: (
                skipCount: number,
                maxResultCount: number,
                filter: string,
                locationId: number
            ) => {
                // let input = new PagedAndFilteredInputDto();
                // input.filter = filter;
                // input.maxResultCount = maxResultCount;
                // input.skipCount = skipCount;
                return this._tenantDashboardService.getPagedLaboratoryData(
                    (maxResultCount = maxResultCount),
                    (skipCount = skipCount),
                    (filter = filter),
                    (locationId = this.locationId)
                );
            },
        });
        this.routeTypeLists.configure({
            title: this.l("Select Route Type"),
            dataSource: () => {
                return this._tenantDashboardService.getRouteType();
            },
        });
        /*this.autoRefreshLists.configure({
            title: this.l("Select Minute"),
            dataSource: () => {
                return this._tenantDashboardService.getAutoRefreshMins();
            },
        });

        this.completedRoute.configure({
            title: this.l("Completed Route Visibility"),
            dataSource: () => {
                return this._tenantDashboardService.getCompletedRoute();
            },
        });

        this.runningRoute.configure({
            title: this.l("Running  Route Visibility"),
            dataSource: () => {
                return this._tenantDashboardService.getRunningRoute();
            },
        });*/

        this.multipleRouteTypeLists.configure({
            title: this.l("Select Route Type"),
            dataSource: (
                skipCount: number,
                maxResultCount: number,
                filter: string
            ) => {
                return this._tenantDashboardService.getPagedRouteTypeData(
                    (maxResultCount = maxResultCount),
                    (skipCount = skipCount),
                    (filter = filter)
                );
            },
        });
        this.routeTypeArray = this.routeType.map((c) => c.id);
    }

    getLocation = (
        id: any,
        typeId: any,
        date: any,
        contactId: any,
        actionType: any,
        runningVisibility: any
    ) => {
        this.interval;
        this.completedRoutes = 0;
        this.routeCompleted = [];
        this.locationResponse = null;
        this.locationRouteResponseCompleted = null;
        this.showAfter = false;
        this.showAfterLastSched = false;
        //console.log(this.initialDate);

        //this.spinnerService.show();
        
        this.loading = true;

        this._tenantDashboardService
            .getLocationRouteData(id, typeId, date, contactId, actionType, runningVisibility)
            .subscribe((data) => {
                if (data) {
                    this.hideloaderGrid();
                }
                console.log(data);
                this.locationResponse = data;
                //console.log(this.locationResponse.length);
                this.lastSched = 0;
                this.lastschedTime = "TBD";
                this.lastSchedAmPm = "";
                //this.nextArrivalTime = '12:00';
                //this.nextArrivalTimeAmPm = 'AM';
                let total = this.locationResponse.length;
                this.totalOnRoute = this.locationResponse.length;
                if (this.locationResponse.length != 0) {
                    let last: any =
                        this.locationResponse[this.locationResponse.length - 1];

                    //let first:any = this.locationResponse[0];

                    this.lastSched = last.samples;
                    //this.lastschedTime   = last.target;

                    var splitted = last.target.split(" ", 2);
                    this.lastschedTime = splitted[0];
                    this.lastSchedAmPm = splitted[1];



                    
                    for (let i = 0; i < this.locationResponse.length; i++) {

                           if(runningVisibility != 0) {
                        
                                    if(this.locationResponse[i].isLinehaul == true) {
                                        this.locationResponse.splice(i, 1);
                                    }
                           }


                        if (this.locationResponse[i].samples != 0) {
                            if (
                                this.locationResponse[i].samples ==
                                this.locationResponse[i].samplesPickedUp
                            ) {
                                this.locationResponse[i].sampleTextColor =
                                    "#48eb9a";
                            }
                        }

                        if (this.locationResponse[i].completionMinutes != 0) {
                            let diffCompletionEta =
                                this.locationResponse[i].completionMinutes -
                                this.locationResponse[i].etaMinutes;
                            let diffEtaCompletion =
                                this.locationResponse[i].etaMinutes -
                                this.locationResponse[i].completionMinutes;

                            if (diffCompletionEta <= 15) {
                                this.locationResponse[i].gridFillColor =
                                    "rgba(72,235,154,0.5)";
                            } else if (diffCompletionEta > 15) {
                                this.locationResponse[i].gridFillColor =
                                    "rgba(249,102,121,0.7)";
                                this.locationResponse[i].gridTextColor =
                                    "#f96679";
                                this.locationResponse[i].sampleTextColor =
                                    "#f96679";
                            }
                        } else {
                            let diffLiveCurrent =
                                this.locationResponse[i].liveEtaMinutes -
                                this.locationResponse[i].currentTimeMinutes;
                            let diffCurrentLive =
                                this.locationResponse[i].currentTimeMinutes -
                                this.locationResponse[i].liveEtaMinutes;

                            if (!this.locationResponse[i].tommorow) {
                                if (diffCurrentLive > 0) {
                                    if (diffCurrentLive <= 3) {
                                        this.locationResponse[i].gridFillColor =
                                            "rgba(250,205,138,0.7)";
                                    } else if (
                                        diffCurrentLive > 3 &&
                                        diffCurrentLive <= 15
                                    ) {
                                        this.locationResponse[i].gridFillColor =
                                            "rgba(255,250,158,0.7)";
                                    }
                                }

                                if (
                                    this.locationResponse[i].liveEtaMinutes >
                                    this.locationResponse[i].targetMinutes
                                ) {
                                    this.locationResponse[i].gridTextColor =
                                        "#f96679";
                                }
                            }
                        }
                    }
                    // this.locationResponse = this.locationResponse.sort((a,b) => b.liveEtaTime.localeCompare(b.liveEtaTime));
                    this.locationResponse = this.locationResponse.sort((a,b) => b.liveEtaTime - a.liveEtaTime);
                }

				if(this.completedRouteId != 0){
					this._tenantDashboardService
                    .getLocationRouteDataCompleted(
                        id,
                        typeId,
                        date,
                        contactId,
                        actionType,
                        runningVisibility
                    )
                    .subscribe((a) => {
                        this.locationRouteResponseCompleted = a;
                        this.totalCompleted =
                            this.locationRouteResponseCompleted.length;
                        if (this.locationRouteResponseCompleted.length != 0) {
                            for (
                                let i = 0;
                                i < this.locationRouteResponseCompleted.length;
                                i++
                            ) {
                                if (
                                    this.locationRouteResponseCompleted[i]
                                        .samples != 0
                                ) {
                                    if (
                                        this.locationRouteResponseCompleted[i]
                                            .samples ==
                                        this.locationRouteResponseCompleted[i]
                                            .samplesPickedUp
                                    ) {
                                        this.locationRouteResponseCompleted[
                                            i
                                        ].sampleTextColor = "#48eb9a";
                                    }
                                }

                                if (
                                    this.locationRouteResponseCompleted[i]
                                        .completionMinutes != 0
                                ) {
                                    let diffCompletionEta =
                                        this.locationRouteResponseCompleted[i]
                                            .completionMinutes -
                                        this.locationRouteResponseCompleted[i]
                                            .etaMinutes;
                                    let diffEtaCompletion =
                                        this.locationRouteResponseCompleted[i]
                                            .etaMinutes -
                                        this.locationRouteResponseCompleted[i]
                                            .completionMinutes;

                                    if (diffCompletionEta <= 15) {
                                        this.locationRouteResponseCompleted[
                                            i
                                        ].gridFillColor =
                                            "rgba(72,235,154,0.5)";
                                    } else if (diffCompletionEta > 15) {
                                        this.locationRouteResponseCompleted[
                                            i
                                        ].gridFillColor =
                                            "rgba(249,102,121,0.7)";
                                        this.locationRouteResponseCompleted[
                                            i
                                        ].gridTextColor = "#fff";
                                        this.locationRouteResponseCompleted[
                                            i
                                        ].sampleTextColor = "#fff";
                                    }
                                } else {
                                    let diffLiveCurrent =
                                        this.locationRouteResponseCompleted[i]
                                            .liveEtaMinutes -
                                        this.locationRouteResponseCompleted[i]
                                            .currentTimeMinutes;
                                    let diffCurrentLive =
                                        this.locationRouteResponseCompleted[i]
                                            .currentTimeMinutes -
                                        this.locationRouteResponseCompleted[i]
                                            .liveEtaMinutes;

                                    if (
                                        !this.locationRouteResponseCompleted[i]
                                            .tommorow
                                    ) {
                                        if (diffCurrentLive > 0) {
                                            if (diffCurrentLive <= 3) {
                                                this.locationRouteResponseCompleted[
                                                    i
                                                ].gridFillColor =
                                                    "rgba(250,205,138,0.7)";
                                            } else if (
                                                diffCurrentLive > 3 &&
                                                diffCurrentLive <= 15
                                            ) {
                                                this.locationRouteResponseCompleted[
                                                    i
                                                ].gridFillColor =
                                                    "rgba(255,250,158,0.7)";
                                            }
                                        }

                                        if (
                                            this.locationRouteResponseCompleted[
                                                i
                                            ].liveEtaMinutes >
                                            this.locationRouteResponseCompleted[
                                                i
                                            ].targetMinutes
                                        ) {
                                            this.locationRouteResponseCompleted[
                                                i
                                            ].gridTextColor = "#f96679";
                                        }
                                    }
                                }
                            }
                        }

                        //Percentage

                        let get = this;
                        /*get.locationResponse.forEach(function(v, i) {
                    if (v.completionMinutes != 0) {//test to see if the id is 3
                     
                      get.completedRoutes++;
                        
                      get.routeCompleted.push(get.locationResponse[i]);
                    
                      

                    
                    }
                    


                    
                  });*/
                        let totalRoutes =
                            this.totalOnRoute + this.totalCompleted;
                        let percent = (this.totalCompleted / totalRoutes) * 100;
                        let percentPending = 0;

                        if (totalRoutes != 0) {
                            if (percent % 1 != 0) {
                                this.completion = percent.toFixed(2);
                                percentPending = 100 - percent;

                                this.routesPending = percentPending.toFixed(2);
                            } else {
                                this.completion = percent;
                                percentPending = 100 - percent;
                                this.routesPending = percentPending;
                            }
                        } else {
                            this.completion = 0;
                            this.routesPending = 0;
                        }
                    });
				}
               

                this._tenantDashboardService
                    .getLocationData(id, typeId, date, contactId, actionType)
                    .subscribe((data) => {
                        if (data) {
                            this.hideloader();
                        }

                        this.locationRouteResponse = data;

                        var splitted =
                            this.locationRouteResponse.locationCurrentTime.split(
                                " ",
                                2
                            );
                        this.locationTime = splitted[0];
                        this.locaitonAmPm = splitted[1];

                        if (this.locationRouteResponse.nextArrivalTime == "") {
                            this.nextArrivalTime = "";
                            this.nextArrivalTimeAmPm = "";
                            this.nextArrivalSample = null;
                            this.nextArrivalRoute = null;
                        } else {
                            var splitNextArrival =
                                this.locationRouteResponse.nextArrivalTime.split(
                                    " ",
                                    2
                                );

                            this.nextArrivalTime = splitNextArrival[0];
                            this.nextArrivalTimeAmPm = splitNextArrival[1];
                            this.nextArrivalSample =
                                this.locationRouteResponse.nextArrival;
                            this.nextArrivalRoute = this.locationResponse.nextArrivalRoute
                        }
                    });

                this.runDelayed(() => {
                    this.loading = false;
                    $("nav").attr("style", "display: flex !important");
                });
            });
    };

    /*onNameChange = (id) => {
   this.runDelayed(()=>{
        if(this.routeTypeId == undefined) {
          this.routeTypeId = 0
        }
        this.initialVal = id;
        this.getLocation(id, this.routeTypeId, this.initialDate);  
    });
  }
  
  onDateChange = (date) => {
   this.runDelayed(()=>{
        if(this.routeTypeId == undefined) {
          this.routeTypeId = 0
        }
        this.initialDate = date;
        this.getLocation(this.initialVal, this.routeTypeId, date);  
    });
  }*/

    submitSettings(): void {
        this.labId = this.laboratoryId;
        this.cfHeight = {
            "padding-top": "20px",
        };

        if (this.labId == 0) {
            this.message.warn("", "Please select laboratory");
        } else {
            $("nav").attr("style", "display: none !important");
            $("#fs").show();

            //  this.minutesFilter = Number((<HTMLInputElement>document.getElementById('refreshMin')).value) != 0 ? Number((<HTMLInputElement>document.getElementById('refreshMin')).value) : undefined;
            this.minutesFilter =
                this.autoRefreshId != undefined
                    ? this.autoRefreshId
                    : undefined;
            //  this.initialVal = Number((<HTMLInputElement>document.getElementById('txtLocation')).value);
            this.initialVal = this.locationId;
            //  this.actionType = Number((<HTMLInputElement>document.getElementById('type')).value);
            this.actionType = this.dashboardRouteTypeId;
            this.routeTypeIds2 = [];
            this.routeTypeNames2 = [];
                
            this.routeType.forEach((element) => {
                this.routeTypeIds2.push(element.id);
                this.routeTypeNames2.push(element.name);
            });

            //  let routeTypeTxt = $( "#routeType option:selected" ).text();
            //  this.routeTypeName = routeTypeTxt.split('  ').join(', ')
            this.routeTypeName = this.routeTypeNames2.toString();



            //  this.routeTypeIds = $("#routeType").val();
            this.routeTypeIds = this.routeTypeIds2;

            if (this.routeTypeIds.length == 0) {
                this.routeTypeName = "All";
            }
            //  this.actionTxt =  $( "#type option:selected" ).text();
            this.actionTxt = this.dashboardRouteTypeName;
            //$(your selector).attr('value2')

            let value = this.laboratories.find(
                (i) => i.contactId === this.labId
            );
            this.labTxt = value.name;
            this.labAddress = value.address;

            if (this.labTxt.length > 40) {
                this.labTxt = this.labTxt.substring(0, 40) + "...";
            }

            //console.log(this.labTxt);
            this.initialDate = this.dateInput;
            this.refreshDefaultVal = this.minutesFilter;
            this.locationResponse = null;
            this.nextArrivalTime = null;
            this.nextArrivalTimeAmPm = null;
            this.nextArrivalSample = null;
            this.nextArrivalRoute = null;

            this.runDelayed(() => {
                this.getLocation(
                    this.initialVal,
                    this.routeTypeIds,
                    this.initialDate,
                    this.labId,
                    this.actionType,
                    this.runningRouteId
                );
            });

            clearInterval(this.interval);

            if (this.interval == undefined) {
                this.interval = setInterval(() => {
                    this.runDelayed(() => {
                        this.getLocation(
                            this.initialVal,
                            this.routeTypeIds,
                            this.initialDate,
                            this.labId,
                            this.actionType,
                            this.runningRouteId
                        );
                    });
                }, 300000);
            }

            if (this.minutesFilter == undefined) {
                this.refreshDefaultVal = 0;
                this.refrehText = "5 mins";
                this.interval = setInterval(() => {
                    this.runDelayed(() => {
                        this.getLocation(
                            this.initialVal,
                            this.routeTypeIds,
                            this.initialDate,
                            this.labId,
                            this.actionType,
                            this.runningRouteId
                        );
                    });
                }, 300000);
            } else if (this.minutesFilter == 1) {
                this.refrehText = "10 mins";
                this.interval = setInterval(() => {
                    this.runDelayed(() => {
                        this.getLocation(
                            this.initialVal,
                            this.routeTypeIds,
                            this.initialDate,
                            this.labId,
                            this.actionType,
                            this.runningRouteId
                        );
                    });
                }, 600000);
            } else if (this.minutesFilter == 2) {
                this.refrehText = "20 mins";
                this.interval = setInterval(() => {
                    this.runDelayed(() => {
                        this.getLocation(
                            this.initialVal,
                            this.routeTypeIds,
                            this.initialDate,
                            this.labId,
                            this.actionType,
                            this.runningRouteId
                        );
                    });
                }, 1200000);
            } else if (this.minutesFilter == 3) {
                this.refrehText = "25 mins";
                this.interval = setInterval(() => {
                    this.runDelayed(() => {
                        this.getLocation(
                            this.initialVal,
                            this.routeTypeIds,
                            this.initialDate,
                            this.labId,
                            this.actionType,
                            this.runningRouteId
                        );
                    });
                }, 1500000);
            } else if (this.minutesFilter == 4) {
                this.refrehText = "30 mins";
                this.interval = setInterval(() => {
                    this.runDelayed(() => {
                        this.getLocation(
                            this.initialVal,
                            this.routeTypeIds,
                            this.initialDate,
                            this.labId,
                            this.actionType,
                            this.runningRouteId
                        );
                    });
                }, 1800000);
            }

            //this.getLocation(this.initialVal, this.routeTypeId, this.dateInput);

            //this.openFullscreen();
            this.isHidden = false;
            this.isfullscreen == true;
            const elem = this.divRef.nativeElement;
            //var result = document.getElementsByClassName("bs-datepicker-container");
            //console.log(elem.requestFullscreen);

            if (elem.requestFullscreen) {
                elem.requestFullscreen();
                $("nav").attr("style", "display: none !important");
            } else if (elem.msRequestFullscreen) {
                elem.msRequestFullscreen();
                $("nav").attr("style", "display: none !important");
            } else if (elem.mozRequestFullScreen) {
                elem.mozRequestFullScreen();
                $("nav").attr("style", "display: none !important");
            } else if (elem.webkitRequestFullscreen) {
                elem.webkitRequestFullscreen();
                $("nav").attr("style", "display: none !important");
            }
            //this.isfullscreen = true;
        }

        //this.showSettings = false;
    }

    /*refresh() {
    this.ngOnInit();
    //this.dashboardControl.reloadData();
    this.minutesFilter = Number((<HTMLInputElement>document.getElementById('refreshMin')).value) != 0 ? Number((<HTMLInputElement>document.getElementById('refreshMin')).value) : undefined;
    clearInterval(this.interval);
    if(this.minutesFilter == undefined) {
          this.refrehText = '5 mins';
          this.interval = setInterval(() => { 
             this.ngOnInit();

          }, 300000);
      }
      else if(this.minutesFilter == 1) {
          this.refrehText = '10 mins';
          this.interval = setInterval(() => { 
              this.ngOnInit();
              
          }, 600000);
      }
      else if(this.minutesFilter == 2) {
        this.refrehText = '20 mins';
          this.interval = setInterval(() => { 
              this.ngOnInit();
              
          }, 1200000);
      }
       else if(this.minutesFilter == 3) {
        this.refrehText = '25 mins';
          this.interval = setInterval(() => { 
              this.ngOnInit();
              
          }, 1500000);
      }
      else if(this.minutesFilter == 4) {
          this.refrehText = '30 mins';
          this.interval = setInterval(() => { 
              this.ngOnInit();
              
          }, 1800000);
      }
  }*/
    refreshPage() {
        //this.spinnerService.show();
        //console.log(this.spinnerService);
        this.locationResponse = null;
        this.locationRouteResponseCompleted = null;
        this.nextArrivalTime = null;
        this.nextArrivalTimeAmPm = null;
        this.nextArrivalSample = null;
        this.nextArrivalRoute = null;
        this.showAfter = false;
        this.showAfterLastSched = false;

        this.runDelayed(() => {
            this.getLocation(
                this.initialVal,
                this.routeTypeIds,
                this.initialDate,
                this.labId,
                this.actionType,
                this.runningRouteId
            );
        });
    }

    filterRouteType() {
        this.ngOnInit();
    }

    /*subLocationFilter() {
    abp.event.on('app.dashboardFilters.locationFilter.onNameChange', this.onNameChange);
  }

  unSubLocationFilter() {
    abp.event.off('app.dashboardFilters.locationFilter.onNameChange', this.onNameChange);
  }

  subDateFilter() {
    abp.event.on('app.dashboardFilters.dateFilter.onNameChange', this.onDateChange);

  }

  unSubDateFilter() {
    abp.event.off('app.dashboardFilters.dateFilter.onNameChange', this.onDateChange);
  }*/

    hideloader() {
        /*document.getElementById('currentTime') 
                    .style.display = 'none';

    document.getElementById('inboundTotal') 
                    .style.display = 'none';

    document.getElementById('totalInHouse') 
                    .style.display = 'none'; 

    document.getElementById('grandTotal') 
                    .style.display = 'none';

    document.getElementById('completion') 
                    .style.display = 'none';
    document.getElementById('routesPending') 
                    .style.display = 'none';
    document.getElementById('nextArrival') 
                   .style.display = 'none';*/

        this.showAfter = true;
    }

    /*hideloaderLastSched() {
    document.getElementById('loadingLastSched') 
                    .style.display = 'none'; 
  }*/

    hideloaderGrid() {
        /*document.getElementById('lastSched') 
                    .style.display = 'none';*/

        this.showAfterLastSched = true;
    }

    ngOnDestroy(): void {
        //this.unSubLocationFilter();
        //this.unSubDateFilter();
        clearInterval(this.interval);
    }

    selectLocation(item: NameValueDto): void {
        this.locationId = parseInt(item.value);
        this.locationName = item.name;
        this.getLaboratories(parseInt(item.value));
    }

    clearLocation() {
        this.locationId = null;
        this.locationName = "";
        this.laboratoryId = null;
        this.laboratoryName = "";
        this.clearLaboratories;
    }

    showLocation(): void {
        setTimeout(() => {
            var element = document.querySelectorAll(".modal-backdrop ");
            element[0].classList.remove("modal-backdrop");
        }, 1000);

        this.locationsList.show();
    }

    selectLaboratory(item: NameValueDto): void {
        this.laboratoryId = parseInt(item.value);
        this.laboratoryName = item.name;
    }

    clearLaboratories() {
        this.laboratoryId = null;
        this.laboratoryName = "";
        this.clearLaboratories;
    }

    showLaboratory(): void {
        setTimeout(() => {
            var element = document.querySelectorAll(".modal-backdrop ");
            element[0].classList.remove("modal-backdrop");
        }, 1000);

        this.laboratoryLists.show();
    }

    selectRouteType(item: NameValueDto): void {
        this.dashboardRouteTypeId = parseInt(item.value);
        this.dashboardRouteTypeName = item.name;
        if (parseInt(item.value) != 0) {
            this.hideType = false;
        } else {
            this.hideType = true;
        }

        this.routeType = this.routeTypes;
    }

    clearRouteType() {
        this.dashboardRouteTypeId = null;
        this.dashboardRouteTypeName = "";
        this.hideType = true;
    }

    showRouteType(): void {
        setTimeout(() => {
            var element = document.querySelectorAll(".modal-backdrop ");
            element[0].classList.remove("modal-backdrop");
        }, 1000);
        this.routeTypeLists.show();
    }

    selectAutoRefresh(item: NameValueDto): void {
        this.autoRefreshId = parseInt(item.value);
        this.autoRefreshValue = item.name;
    }

    selectCompletedRoute(item: NameValueDto): void {
        this.completedRouteId = parseInt(item.value);
        this.completedRouteValue = item.name;

        
    }

    selectRunningRoute(item: NameValueDto): void {
        this.runningRouteId = parseInt(item.value);
        this.runningRouteValue = item.name;
    }

    /*clearAutoRefresh() {
        this.autoRefreshId = null;
        this.autoRefreshValue = "";
    }

    clearCompletedRoute() {
        this.completedRouteId = null;
        this.completedRouteValue = "";
    }

    clearRunningRoute() {
        this.runningRouteId = null;
        this.runningRouteValue = "";
    }*/

   /* showAutoRefresh(): void {
        setTimeout(() => {
            var element = document.querySelectorAll(".modal-backdrop ");
            element[0].classList.remove("modal-backdrop");
        }, 1000);

        this.autoRefreshLists.show();
    }

    showCompletedRoute(): void {
        setTimeout(() => {
            var element = document.querySelectorAll(".modal-backdrop ");
            element[0].classList.remove("modal-backdrop");
        }, 1000);

        this.completedRoute.show();
    }

    showRunningRoute(): void {
        setTimeout(() => {
            var element = document.querySelectorAll(".modal-backdrop ");
            element[0].classList.remove("modal-backdrop");
        }, 1000);

        this.runningRoute.show();
    }*/

    removeRouteTypes(item) {
        this.routeType = this.routeType.filter((c) => c.id != item.id);
        this.routeTypeArray = this.routeType.map((c) => c.id);
    }

    addNewRouteType() {
        setTimeout(() => {
            var element = document.querySelectorAll(".modal-backdrop ");
            element[0].classList.remove("modal-backdrop");
        }, 1000);
        this.multipleRouteTypeLists.show(this.routeTypeArray);
        // this.categoryTypesList.show(this.categoryTypeArray);
    }

    addRouteType(routeTypes: any) {
        routeTypes.map((c) => {
            let a = new GetRouteTypeDataOutput();
            a.id = parseInt(c.value);
            a.name = c.name;
            let ck = this.routeType.some((x) => x.id == a.id);
            if(!ck) {
                this.routeType.push(a);
            }
            
        });
        this.routeTypeArray = this.routeType.map((c) => c.id);
       
    }
}