import { Component, ViewChild, OnInit, AfterContentInit, AfterViewInit, OnDestroy, ElementRef, ComponentRef, Input, ComponentFactoryResolver, ViewContainerRef } from '@angular/core';
import { HomeScreenHeaderComponent } from '../home-screen-header/home-screen-header';

import { WindowComponent } from '../kendo-widgets/window/window.component'

import { HomeGridComponent } from '../home-grid-component/home-grid-component'

import { GridFactory } from '../factories/grid-factory'
import { HomeService } from '../services/home-service';
import { Router } from '@angular/router';
import { Mediator } from '../services/mediator';
import { CoreMediatorChannels } from '../utils/mediator-channels';
import { CoreNotificationsMessages } from '../utils/notifications-messages';
import { TranslateService } from '../services/translate-service';
import { ConfigHomeScreenOptions, HomeScreenHeaderOptions } from '../types/home-screen-types';
import { CustomGridOptions } from '../types/grid-types';

@Component({
  selector: 'config-home-screen',
  templateUrl: './config-home-screen.component.html',
  styleUrls: ['./config-home-screen.component.css'],

})
export class ConfigHomeScreenComponent implements OnInit, AfterContentInit, AfterViewInit, OnDestroy {

  @Input()
  private homeScreenOptions: ConfigHomeScreenOptions;

  @ViewChild("header_template")
  private header_template: HomeScreenHeaderComponent;

  private headerConfig: HomeScreenHeaderOptions;

  private customGridOptions: CustomGridOptions;

  private gridFactory: GridFactory;

  private gridCmpRef: ComponentRef<HomeGridComponent>;

  private kendoWindowOptions: kendo.ui.WindowOptions;

  private emptyCreationModel: {};

  private objects: any[];

  @ViewChild('creationPopup')
  private kendoWindow: WindowComponent;


  constructor(private homeService: HomeService, private componentFactoryResolver: ComponentFactoryResolver, private router: Router, private translationService: TranslateService) {
    this.gridFactory = new GridFactory(componentFactoryResolver);
  }

  ngOnInit() {
    this.createConfigGrid();
    this.readInstances();
    this.initHeaderOptions();
    this.initCreationPopup();
  }

  private readInstances() {
    this.homeService.readAll(this.homeScreenOptions.objectRemoteRestUrl, (response) => {
      this.objects = response.data;
      this.setDataToGrid(this.objects);
    });

  }

  private initConfigGridOptions() {
    this.customGridOptions = {
      objectRemoteRestUrl: this.homeScreenOptions.objectRemoteRestUrl,
      homeScreenRoutingPath: this.homeScreenOptions.objectRoutingPath,
      gridColumns: this.homeScreenOptions.gridColumns,
      customUseCases: this.homeScreenOptions.customUseCases,
      dataSource: this.initDataSource(),
      detailTemplate: this.homeScreenOptions.detailTemplate,
      detailInit: this.homeScreenOptions.detailInit
    };
  }

  private createConfigGrid() {
    this.initConfigGridOptions();
    this.gridCmpRef = this.gridFactory.createHomeGrid(this.header_template.content, this.customGridOptions);
  }

  private initHeaderOptions() {
    let batchUseCases = []
    for (let useCase of this.homeScreenOptions.customUseCases) {
      if (useCase.isBatchAction) {
        batchUseCases.push(useCase)
      }
    }

    this.headerConfig = {
      objectName: this.homeScreenOptions.objectName,
      objectIcon: "fa fa-home",
      headerViewsNav: [
        {
          iconClass: "fa fa-th-list",
          actionName: "list-view",
          actionFunction: (e) => {
            e.preventDefault();
          }
        },
        {
          iconClass: "fa fa-file-text",
          actionName: "doc-view",
          actionFunction: (e) => {
            e.preventDefault();
            this.router.navigate([this.router.url, this.objects[0].id]);
          }
        },
        {
          iconClass: "fa fa-th-large",
          actionName: "3rd-view",
          actionFunction: (e) => { e.preventDefault(); }
        },
        {
          iconClass: "fa fa-calendar",
          actionName: "canban-view",
          actionFunction: (e) => { e.preventDefault(); }
        },
        {
          iconClass: "fa fa-sitemap",
          actionName: "hirerchy-view",
          actionFunction: (e) => { e.preventDefault(); }
        }
      ],
      headerMainActions: [
        {
          iconClass: "fa fa-bookmark",
          actionName: "bookmark",
          actionFunction: (e) => {
            e.preventDefault();
          }
        },
        {
          iconClass: "fa fa-bookmark-o",
          actionName: "un-bookmark",
          actionFunction: (e) => {
            e.preventDefault();
          }
        },
        {
          iconClass: "fa fa-toggle-on",
          actionName: "activate",
          actionFunction: (e) => {
            e.preventDefault();
            let selectedObjects = this.gridCmpRef.instance.getSelectedRows();
            let myGrid = $('.k-grid').data('kendoGrid');
            if (!selectedObjects || selectedObjects.length == 0) {
              console.warn('there are not selected rows');
              return;
            }
            this.homeService.activateBatchInstances(this.homeScreenOptions.objectRemoteRestUrl, selectedObjects, (response) => {
              Mediator.emit(CoreMediatorChannels.SUCCESS_ALERT, {
                message: this.translationService.instant(CoreNotificationsMessages.MULTIPLE_INSTANCES_SUCCESS_ACTIVATE_MSG)
              });
              this.refreshGridDataSource();
            }, (responseBody) => { // in case of error
              for (let obj of responseBody.data) {
                this.bindErrorsOnGridObjects(myGrid, obj)
              }
            });
          }
        },
        {
          iconClass: "fa fa-toggle-off",
          actionName: "de-activate",
          actionFunction: (e) => {
            e.preventDefault();
            let selectedObjects = this.gridCmpRef.instance.getSelectedRows();
            let myGrid = $('.k-grid').data('kendoGrid');
            if (!selectedObjects || selectedObjects.length == 0) {
              console.warn('there are not selected rows');
              return;
            }
            this.homeService.deactivateBatchInstances(this.homeScreenOptions.objectRemoteRestUrl, selectedObjects, (response) => {
              Mediator.emit(CoreMediatorChannels.SUCCESS_ALERT, {
                message: this.translationService.instant(CoreNotificationsMessages.MULTIPLE_INSTANCES_SUCCESS_DEACTIVATE_MSG)
              });

              this.refreshGridDataSource();
            }, (responseBody) => { // in case of error
              for (let obj of responseBody.data) {
                this.bindErrorsOnGridObjects(myGrid, obj)
              }
            });
          }
        },
        {
          iconClass: "fa fa-check-circle-o",
          actionName: "verify",
          actionFunction: (e) => { e.preventDefault(); }
        },
        {
          iconClass: "fa fa-trash",
          actionName: "delete",
          actionFunction: (e) => {
            e.preventDefault();
            let selectedObjects = this.gridCmpRef.instance.getSelectedRows();
            let myGrid = $('.k-grid').data('kendoGrid');

            var idsToDelete = [];
            if (!selectedObjects || selectedObjects.length == 0) {
              console.warn('there are not selected rows');
              return;
            }
            for (let obj of selectedObjects) {
              idsToDelete.push(obj.id.toString());
            }

            Mediator.emit(CoreMediatorChannels.CONFIRMATION_DIALOG, {
              message: CoreNotificationsMessages.formatMsg(this.translationService.instant(CoreNotificationsMessages.DELETE_MULTIPLE_INSTANCES_MSG), idsToDelete.length.toString())
              , confirm: () => {
                this.homeService.deleteInstances(this.homeScreenOptions.objectRemoteRestUrl, idsToDelete, (response) => {
                  this.refreshGridDataSource();
                }, (responseBody) => { // in case of error
                  for (let obj of responseBody.data) {
                    this.bindErrorsOnGridObjects(myGrid, obj)
                    idsToDelete.splice(idsToDelete.indexOf(obj.id.toString()), 1);
                  }
                  for (let item of idsToDelete) {
                    var rowToDelete = myGrid.dataSource.get(item);
                    myGrid.dataSource.remove(rowToDelete); //removes it actually from the grid
                  }
                });

              }
              , cancel: () => {

              }
            });
          }
        }
      ],
      customUseCases: batchUseCases,
      craetionBtnActionFunction: (e: any) => {
        e.preventDefault();
        this.kendoWindow.ProtoType.open();
        this.kendoWindow.ProtoType.center();
      }
    };
  }

  private initCreationPopup() {
    $('#configHomeScreen_creationPopupBody').html(this.homeScreenOptions.creationPopupWindow.popupTplRef.nativeElement);
    this.emptyCreationModel = $.extend(true, this.emptyCreationModel, this.homeScreenOptions.creationModel);

    this.kendoWindowOptions = {
      visible: false,
      modal: true,
      width: '40%',
      title: false,
      resizable: false,
      draggable: true
    };
  }

  private initDataSource(): kendo.data.DataSource {
    let defaultDSOptions: kendo.data.DataSourceOptions = {
      data: [],
      pageSize: 10
    };
    defaultDSOptions = $.extend(true, defaultDSOptions, this.homeScreenOptions.dataSourceOptions);

    return new kendo.data.DataSource(defaultDSOptions);
  }

  private setDataToGrid(data: any[]) {
    let dataSource = this.customGridOptions.dataSource;
    dataSource.data(dataSource.options.schema.parse(data));
  }

  private refreshGridDataSource() {
    this.homeService.readAll(this.homeScreenOptions.objectRemoteRestUrl, (response) => {
      this.setDataToGrid(response.data);
    });
  }

  private popupCreate(e: any) {
    e.preventDefault();
    if (this.homeScreenOptions.creationCallback) {
      this.homeScreenOptions.creationCallback();
    }
    this.homeService.createInstance(this.homeScreenOptions.objectRemoteRestUrl, this.homeScreenOptions.creationModel,
      (response) => { // success
        this.homeScreenOptions.creationModel = this.emptyCreationModel;
        this.refreshGridDataSource();
        if (this.homeScreenOptions.onSuccessCreation) {
          this.homeScreenOptions.onSuccessCreation();
        }
        this.kendoWindow.ProtoType.close();
      }, (response) => { // failure
        this.homeScreenOptions.creationModel = response; // bound errors and warnings
      });
  }

  private popupCreateAndOpen(e: any) {
    e.preventDefault();
    if (this.homeScreenOptions.creationCallback) {
      this.homeScreenOptions.creationCallback();
    }
    this.homeService.createInstance(this.homeScreenOptions.objectRemoteRestUrl, this.homeScreenOptions.creationModel,
      (response) => {
        this.homeScreenOptions.creationModel = this.emptyCreationModel;
        if (this.homeScreenOptions.onSuccessCreation) {
          this.homeScreenOptions.onSuccessCreation();
        }
        this.kendoWindow.ProtoType.close();
        this.router.navigate([this.router.url, response.id]);
      }, (response) => { // failure
        this.homeScreenOptions.creationModel = response;
      });
  }

  private popupCancelCreation(e: any) {
    e.preventDefault();
    if (this.homeScreenOptions.onCancelpopup) {
      this.homeScreenOptions.onCancelpopup();
    }
    this.kendoWindow.ProtoType.close();
    this.homeScreenOptions.creationModel = this.emptyCreationModel;
  }

  private bindErrorsOnGridObjects(myGrid, obj) {
    var currentRow = myGrid.dataSource.get(obj.id);
    var data = myGrid.dataItem(currentRow)
    var responseErrors = obj.__errors__;
    var responseGeneralErrors = obj.__general_errors__;
    var responseState = obj.currentStates[0];
    currentRow.currentStatesStr = responseState;
    currentRow.set("responseErrors", responseErrors);
    currentRow.set("responseGeneralErrors", responseGeneralErrors);
    currentRow.set("actionFlag", true);
  }

  ngAfterContentInit() {
  }

  ngAfterViewInit() {
  }

  ngOnDestroy() {
    this.kendoWindow.ProtoType.destroy();
    this.gridCmpRef.destroy();
  }

}