import { Component, Injector, OnInit, ViewChild, ViewEncapsulation, Output, EventEmitter, Input, Inject } from '@angular/core';
import { ActivatedRoute,Router } from '@angular/router';
import { appModuleAnimation } from '@shared/animations/routerTransition';
import { AppComponentBase } from '@shared/common/app-component-base';
import { ControllerRouteDetailServiceProxy, OrderServiceProxy, UpdateOrderSortingInput, UpdateOrderSorting } from '@shared/service-proxies/service-proxies';
import { AppSessionService } from '@shared/common/session/app-session.service';
import { Table } from "primeng/table";
import { LazyLoadEvent } from "primeng/primeng";
import { Paginator } from 'primeng/components/paginator/paginator';
import { finalize } from 'rxjs/operators';
import * as _ from 'lodash';
import { DOCUMENT } from '@angular/common';
declare var $: any;
declare var jquery: any;
@Component({
    selector: 'hf-route-detail',
    templateUrl: 'hf-route-detail.component.html',
    encapsulation: ViewEncapsulation.None,
    styleUrls: ['./route-detail.component.less'],
    animations: [appModuleAnimation()]
})

export class HFRouteDetailComponent extends AppComponentBase implements OnInit {

    routeId: number = null;
    filterText = '';
    sprintIds: Array<{}> = new Array();
    sprintIdsList: any[];
    orderList: Array<any> = [];

    orderListInput: UpdateOrderSortingInput = new UpdateOrderSortingInput();
    checkAll: boolean;
    evaluator = false;
    tbodyHolder: any;
    records: any;

    @ViewChild("dataTable", { static: true }) dataTable: Table;
    @ViewChild("paginator", {static: true}) paginator: Paginator;
    @Input() refresh: any;

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

    // updateTable: Function;
    constructor(
        injector: Injector,
        private id: ActivatedRoute,
        private _controllerRouteDetails: ControllerRouteDetailServiceProxy,
        private _appSessionService: AppSessionService,
        private _orderAppService: OrderServiceProxy,
        private router: Router,
    ) {
        super(injector);
        //  tableDragger(document.querySelector("#dragTable"), { mode: "row", onlyBody: true })
        this.id.paramMap.subscribe(params => {
            this.routeId = Number(params.get('id'));
        });
       
    }

    ngOnInit() {
        setInterval(()=>{
            this.getRouteDetails()
            // console.log("refreshed")
        }, 180000);
        this.primengTableHelper.showLoadingIndicator();
        // this.spinnerService.show();
    }
    tableRow() {
        this.tbodyHolder = document.getElementsByTagName('tbody')[0].rows;
    }

    getRouteDetails(event?: LazyLoadEvent) {
        // 
        
        // if (this.primengTableHelper.shouldResetPaging(event)) {
        //     this.paginator.changePage(0);
        //     return;
        // }
        // this.spinnerService.show();
        // this._controllerRouteDetails
        //     .getControllerRouteDetailList(
        //         undefined,
        //         this.routeId,
        //         this.filterText,
        //         // this.primengTableHelper.getSorting(this.dataTable),
        //         undefined,
        //         700,
        //         undefined).pipe(finalize(() => this.spinnerService.hide()))
        //     .subscribe(result => {
        //         this.primengTableHelper.totalRecordsCount = result.totalCount;
        //         this.primengTableHelper.records = result.items;
                
        //     });
        //     this.spinnerService.hide();
          this._controllerRouteDetails
            .getControllerRouteDetailList(
                this.routeId,
                this.filterText)
            .subscribe(result => {
                this.primengTableHelper.totalRecordsCount = result.items.length;
                this.primengTableHelper.records = result.items;
                // this.spinnerService.hide();
                this.primengTableHelper.isLoading = false;
            });
    }



    rowReorder() {
        this.tbodyHolder = null
        this.tableRow();

        this.orderList = [];
        for (let index = 0; index < this.primengTableHelper.records.length; index++) {
            var element = this.primengTableHelper.records[index];

            // console.log(element)
            let a = new UpdateOrderSorting({
                id: parseInt(element.id),
                sortOrder: index
            })
            this.orderList.push(a);
        }
        let input = new UpdateOrderSortingInput({
            sortingOrderInput: this.orderList,
        })

        this._orderAppService.updateOrderSorting(
            input
        ).pipe().subscribe(result => {
            this.notify.info(this.l('SavedSuccessfully'));
        })
    }

    toggleMoreInfo(event) {
        var element = event.currentTarget.nextSibling;
        var selector = document.querySelectorAll('.more-info-container.active');
        var hover = document.querySelectorAll('.more-btn.hover');

        if (element.classList.contains('active')) {
            event.currentTarget.classList.remove('hover');
            element.classList.remove('active');
        } else {
            if (selector.length > 0) {
                selector[0].classList.remove('active');
                hover[0].classList.remove('hover');
                // event.currentTarget.classList.remove('hover');
            }
            element.classList.add('active');
            event.currentTarget.classList.add('hover');
        }

    }
    moveOrders(id: number) {
        if (this.sprintIds.indexOf(id) == -1) {
            this.sprintIds.push(id);
        } else {
            this.sprintIds.splice(this.sprintIds.indexOf(id), 1);
        }

        this.sprintIdsList = this.sprintIds;
        this.passOrderIds.emit(this.sprintIdsList)
        console.log(this.sprintIdsList);
        
    }


    selectAllOrders() {
        this.sprintIdsList = null;
        this.records = this.primengTableHelper.records

        for (var i = 0; i < this.records.length; i++) {
            if (this.checkAll == true) {
                this.sprintIds.push(this.records[i].id);
                this.records[i].selected = this.checkAll;
            }
            else {
                this.sprintIds.splice(this.sprintIds.indexOf(this.records[i].id), 1);
                this.records[i].selected = this.checkAll;
            }

            //console.log(this.records[i].selected);    


        }



        this.sprintIdsList = this.sprintIds;
        this.passOrderIds.emit(this.sprintIdsList)
        console.log(this.sprintIdsList);

          

        // let checkbox = document.getElementsByClassName('move-order-check');


        // if(this.checkAll){
        //     for (let index = 0; index < checkbox.length; index++) {
        //         let element = checkbox[index];

        //         // this.moveOrders(parseInt(element.attributes.getNamedItem('id').value));


        //     };
        // } else {

        // }

        // console.log(this.sprintIdsList);

    }

    // passData(){
    //     this.passOrderIds.emit(this.sprintIdsList)
    // }

    //checkIfAllSelected(id: number) {

    //this.checkAll = this.records.every(function (item: any) {
    //return item.selected == true;
    //})
    //console.log(id)

    //}

    navOrder(id){
        this.router.navigate(['/app/sprintship/controller-order-details/', id]);
    }
    onShown() {
    }


}