import { MainStateManager } from '../../MainStateManager';
import { BasePageData, PropsOfPage } from '../BasePageData';
import { ModalPageData } from './ModalData';
import { PopupPageData } from './ModalPopup';
import { TabPageData } from '../Tab/TabData';
import { IControlsElementType } from '../TabbingControl';
import { IArmisaPageKey } from '../../ArmisaImportPage';
import { Fill1To100 } from '../../Types';

export class Modaling {
  private modalsAndPopupOrder: BasePageData[] = [];

  private _modalsAndPopups: BasePageData[] = [];

  get activeModal() {
    return this._modalsAndPopups.find((i) => i.isActive);
  }
  get modals() {
    return this._modalsAndPopups;
  }

  constructor(private mainStateManager: MainStateManager) { }

  public isShowModalWating = false;

  helpModeState: boolean = false;
  toggelHelpMode = () => {
    this.helpModeState = !this.helpModeState;
    this.helpElementRef = undefined;
    // this.mainStateManager.Eventing.trigger('helpState');
  }
  helpElementRef?: IControlsElementType;
  setHelpElementRef = (element: IControlsElementType) => {
    this.helpElementRef = element;
    // this.mainStateManager.Eventing.trigger('helpState');
  }

  showWaitingModal = (parentPage: BasePageData) => {
    this.isShowModalWating = true;
    // this.mainStateManager.focusPosition = 'modals';
    // this.mainStateManager.Eventing.trigger('showWaitingModal', parentPage);
  };
  closeWaitingModal = (parentPage: BasePageData) => {
    if (this.isShowModalWating) {
      this.isShowModalWating = false;
      const currentPage = parentPage;
      if (currentPage instanceof ModalPageData) {
        // this.mainStateManager.focusPosition = 'modals';
      } else if (currentPage instanceof TabPageData) {
        // this.mainStateManager.focusPosition = 'tabs';
      } else {
        // this.mainStateManager.focusPosition = 'filterMenu';
      }
      // this.mainStateManager.Eventing.trigger('closeWaitingModal', parentPage);
    }
  };



  addModal(modalPageData: ModalPageData): void {
    this._modalsAndPopups.push(modalPageData);
    this.modalsAndPopupOrder.push(modalPageData);
    // this.mainStateManager.focusPosition = 'modals';
    // this.mainStateManager.Eventing.trigger('addNewModal', modalPageData.parent, modalPageData);
  }

  addModalPage: {
    (pageKey: IArmisaPageKey, props?: PropsOfPage): void;
    (pageKey: IArmisaPageKey, width?: Fill1To100 | string, height?: Fill1To100 | string, props?: PropsOfPage): void;
    (modalPageData: ModalPageData): void;
    (modalPageData: ModalPageData, width?: Fill1To100 | string, height?: Fill1To100 | string): void;
  } = (...params: any): void => {
    const [param1, param2, param3, param4] = params;

    if (param1 instanceof ModalPageData) {
      param1.widthPecent = param2;
      param1.heightPecent = param3;
      param1.UpdateWidthAndHeightSize();
      this._modalsAndPopups.push(param1);
      this.modalsAndPopupOrder.push(param1);
      // this.mainStateManager.focusPosition = 'modals';
      // this.mainStateManager.Eventing.trigger('addNewModalPage', param1.parent, param1);
    } else if (typeof param1 === 'string') {
      const pageData = new TabPageData(this.mainStateManager);
      const modalPage = new ModalPageData(this.mainStateManager, pageData);
      modalPage.pageKey = param1 as any;
      if (param2 instanceof PropsOfPage) {
        modalPage.props = param2;
        modalPage.widthPecent = param3;
        modalPage.heightPecent = param4;
      } else {
        modalPage.widthPecent = param2;
        modalPage.heightPecent = param3;
        modalPage.props = param4;
      }
      modalPage.UpdateWidthAndHeightSize();
      this.addModalPage(modalPage);
    }
  }

  addPopup(popupPageData: PopupPageData) {
    this._modalsAndPopups.push(popupPageData);
    this.modalsAndPopupOrder.push(popupPageData);
    // this.mainStateManager.focusPosition = 'popup';
    // this.mainStateManager.Eventing.trigger('addNewPopup', popupPageData.parent, popupPageData);
  }

  addPopupPage(popupPageData: PopupPageData) {
    this._modalsAndPopups.push(popupPageData);
    this.modalsAndPopupOrder.push(popupPageData);
    // this.mainStateManager.focusPosition = 'popup';
    // this.mainStateManager.Eventing.trigger('addNewPopupPage', popupPageData.parent, popupPageData);
  }

  closeThisModal = (modalPageData: ModalPageData) => {
    modalPageData.Eventing.removeOn('form.disabled');
    modalPageData.Eventing.removeOn('form.getActive');

    // this.mainStateManager.Eventing.removeAllForThisPage(modalPageData.id);

    this._modalsAndPopups = this._modalsAndPopups.filter((t) => t !== modalPageData);
    this.modalsAndPopupOrder = this.modalsAndPopupOrder.filter((t) => t !== modalPageData);

    const currentPage = modalPageData.parent;
    if (currentPage instanceof ModalPageData) {
      currentPage.modal = undefined;
      // this.mainStateManager.focusPosition = 'modals';
    } else if (currentPage instanceof TabPageData) {
      currentPage.modal = undefined;
      // this.mainStateManager.focusPosition = 'tabs';
    } else {
      // this.mainStateManager.focusPosition = 'filterMenu';
    }

    // this.mainStateManager.Eventing.trigger('closeModal', currentPage);
  };

  closeThisPopup = (popupPageData: PopupPageData) => {
    popupPageData.Eventing.removeOn('form.disabled');
    popupPageData.Eventing.removeOn('form.getActive');

    // this.mainStateManager.Eventing.removeAllForThisPage(popupPageData.id);

    this._modalsAndPopups = this._modalsAndPopups.filter((t) => t !== popupPageData);
    this.modalsAndPopupOrder = this.modalsAndPopupOrder.filter((t) => t !== popupPageData);

    const currentPage = popupPageData.parent;
    if (currentPage instanceof PopupPageData) {
      currentPage.popup = undefined;
      // this.mainStateManager.focusPosition = 'popup';
    } else if (currentPage instanceof TabPageData) {
      currentPage.popup = undefined;
      // this.mainStateManager.focusPosition = 'tabs';
    } else {
      // this.mainStateManager.focusPosition = 'filterMenu';
    }

    // this.mainStateManager.Eventing.trigger('closePopup', currentPage);
  };
}
