/**
 * Project      :  AMDA-NG
 * Name         : PlotZoomPlug.js
 * @plugin    amdaPlotComp.PlotZoomPlug
 * @extends    Ext.util.Observable
 * @ptype      plotZoomPlugin
 * @brief     Plot Zoom UI (View)
 * @author Benjamin
 * @version $Id: PlotZoomPlug.js
 ********************************************************************************
 *    FT Id     :   Date   : Name - Description
 *******************************************************************************
 *  :
 */


Ext.define('amdaPlotComp.PlotZoomPlug', {
  extend: 'Ext.util.Observable',
  alias: 'plugin.plotZoomPlugin',
  requires: [
    'amdaPlotComp.plotFunction.ParamField', 'amdaPlotComp.plotFunction.FunctionType', 'amdaPlotComp.plotFunction.CreatePlot'],

  id: 'plot-zoom-plug',

  ttModuleId: 'timetab-win',
  catModuleId: 'catalog-win',

  win: null,
  form: null,
  zoomType: '',
  interactiveId: '',
  panelId: -1,
  path_context_file: "",

  linkedTTCatNode: null,
  /**
   * Un composant de 'PlotFunction' qui permet d'afficher le min samplig de chaque paramètre et le nombre de points théoriques entre un start time et stop time
   */
  plotFunctionParamField: null,
  /**
   * Un composant de 'PlotFunction' qui permet à l'utilisateur de séléctionner le type de fonction à appliquer : FFT, SUM, ...
   */
  plotFunctionType: null,

  constructor: function (config) {
    Ext.apply(this, config);
    this.callParent(arguments);
  },

  onDestroy: function () {
    this.win = null;
  },

  init: function (cmp) {
    this.hostCmp = cmp;
  },

  /**
   * Set different parameters displayed on the current panel
   * @param {*} listParams_  parameters displayed on the current panel
   */
  setParameters: function (listParams_) {
    console.log(this.path_context_file);
    this.listParams = listParams_;
    //this.plotFunctionParamField = new amdaPlotComp.plotFunction.ParamField({ params: this.listParams });
    this.plotFunctionType = new amdaPlotComp.plotFunction.FunctionType({});
  },


  setMinValue: function (min) {
    if (!this.form)
      return;

    if (this.zoomType == 'timeAxis') {
      this.form.getForm().findField('zoom-min-time').setValue(min);

    }
    else
      this.form.getForm().findField('zoom-min-float').setValue(min);
  },

  setMaxValue: function (max) {
    if (!this.form)
      return;

    if (this.zoomType == 'timeAxis') {
      var minValue = this.form.getForm().findField('zoom-min-time').getValue();
      if (minValue <= max) {
        this.form.getForm().findField('zoom-max-time').setValue(max);
        //if (this.isPlotFunction)
        //this.plotFunctionParamField.setValues(minValue, max);
      }
      else {
        this.form.getForm().findField('zoom-min-time').setValue(max);
        this.form.getForm().findField('zoom-max-time').setValue(minValue);
        // if (this.isPlotFunction)
        // this.plotFunctionParamField.setValues(max, minValue);
      }
    }
    else {
      var minValue = this.form.getForm().findField('zoom-min-float').getValue();
      if (minValue <= max)
        this.form.getForm().findField('zoom-max-float').setValue(max);
      else {
        this.form.getForm().findField('zoom-min-float').setValue(max);
        this.form.getForm().findField('zoom-max-float').setValue(minValue);
      }
    }
  },

  /**
   *  add Interval to Time table
   **/
  insertInterval: function () {
    if (this.zoomType != 'timeAxis')
      return;

    var start = this.form.getForm().findField('zoom-min-time').getValue();
    var stop = this.form.getForm().findField('zoom-max-time').getValue();

    var TTCatType = this.form.getForm().findField('ttcat-type').getValue();
    var isCatalog = (TTCatType == 'catalog');

    myDesktopApp.getLoadedModule(isCatalog ? this.catModuleId : this.ttModuleId, true, function (module) {
      var targetModuleUI = module.getUiContent();
      if (targetModuleUI)
        targetModuleUI.addInterval(start, stop);
    });
  },

  /**
   *  creation of the window
   */
  show: function (interactiveId, zoomType, panelId, isPlotFunction_ = false) {
    this.isPlotFunction = isPlotFunction_;
    if (!this.win) {
      this.win = new Ext.Window({
        id: 'plot-zoom-win-' + this.hostCmp.ownerCt.getId(), // Plot window ID
        width: 250,
        x: 0, y: 0,
        baseCls: 'x-panel',
        title: 'Zoom',
        constrain: true,
        collapsible: true,
        resizable: false,
        ghost: false,
        renderTo: this.hostCmp.ownerCt.body,
        items: this.getFormConfig(),
        listeners: {
          scope: this,
          beforeclose: function () {
            this.hostCmp.panelImage.stopZoom();
            Ext.PluginManager.unregister(this);
          }
        },
        getConstrainVector: function (constrainTo) {
          var me = this;
          if (me.constrain || me.constrainHeader) {
            constrainTo = constrainTo || (me.floatParent && me.floatParent.getTargetEl()) || me.container || me.el.getScopeParent();
            return (me.constrainHeader ? me.header.el : me.el).getConstrainVector(constrainTo);
          }
        }
      });

      this.win.on('destroy', this.onDestroy, this);

      Ext.PluginManager.register(this);
    }
    this.interactiveId = interactiveId;
    this.updateWinByType(zoomType, panelId);
    this.win.show();
    this.win.setPosition(0, 0);
  },

  close: function () {
    if (this.win == null)
      return;
    this.win.close();
  },

  updateWinByType: function (zoomType, panelId) {
    if (this.win == null)
      return;

    this.zoomType = zoomType;
    this.panelId = panelId;

    switch (zoomType) {
      case 'timeAxis':
        if (this.isPlotFunction) {
          const title = "Apply a Function on Interval";
          this.win.setTitle(title + '-Panel Id: ' + panelId);
        } else {
          this.win.setTitle('Zoom on time axis & Interval selection - Panel Id : ' + panelId);
        }
        break;
      case 'y-left':
        this.win.setTitle('Zoom on Y Left axis - Panel Id : ' + panelId);
        break;
      case 'y-right':
        this.win.setTitle('Zoom on Y Right axis - Panel Id : ' + panelId);
        break;
      case 'xaxis_id':
        this.win.setTitle('Zoom on X axis - Panel Id : ' + panelId);
        break;
    }

    this.form.getForm().findField('zoom-min-time').setVisible(this.zoomType == 'timeAxis');
    this.form.getForm().findField('zoom-max-time').setVisible(this.zoomType == 'timeAxis');

    this.form.getForm().findField('zoom-min-float').setVisible(this.zoomType != 'timeAxis');
    this.form.getForm().findField('zoom-max-float').setVisible(this.zoomType != 'timeAxis');

    var ttCatNameField = this.form.getForm().findField('ttcat-name');
    if (ttCatNameField)
      ttCatNameField.findParentByType('fieldset').setVisible(this.zoomType == 'timeAxis');
  },

  resetMinMaxValue: function () {
    if (this.zoomType == 'timeAxis') {
      this.form.getForm().findField('zoom-min-time').setValue('');
      this.form.getForm().findField('zoom-max-time').setValue('');
    }
    else {
      this.form.getForm().findField('zoom-min-float').setValue(null);
      this.form.getForm().findField('zoom-max-float').setValue(null);
    }

    this.hostCmp.panelImage.resetZoom();
  },
  setTimePlot: function () {
    var timeObj = new Object();
    timeObj.start = this.form.getForm().findField('zoom-min-time').getValue();
    timeObj.stop = this.form.getForm().findField('zoom-max-time').getValue();
    timeObj.interactiveId = this.interactiveId;
    var plotModule = myDesktopApp.getLoadedModule(myDesktopApp.dynamicModules.plot.id);
    plotModule.setTimeInterval(timeObj);
  },
  /**
   *        Main form
   */
  getFormConfig: function () {
    var intervalFieldSet = {
      xtype: 'fieldset',
      title: 'Interval Selection',
      name: 'interval-selection-fieldset',
      collapsible: false,
      layout: {
        type: 'vbox',
        pack: 'start',
        align: 'stretch'
      },
      items: [
        {
          xtype: 'datefield', name: 'zoom-min-time', fieldLabel: 'Start Time',
          format: 'Y/m/d H:i:s.u',
        },
        {
          xtype: 'datefield', name: 'zoom-max-time', fieldLabel: 'Stop Time',
          format: 'Y/m/d H:i:s.u'
        },
        {
          xtype: 'numberfield', name: 'zoom-min-float', fieldLabel: 'Min Value'
        },
        {
          xtype: 'numberfield', name: 'zoom-max-float', fieldLabel: 'Max Value'
        },
        {
          xtype: 'button',
          width: 100,
          text: 'Reset',
          scope: this,
          handler: function () {
            this.resetMinMaxValue();
          }
        },
        {
          xtype: 'button',
          width: 100,
          text: 'Use in Time Selection',
          scope: this,
          handler: function () {
            this.setTimePlot();
          }
        }
      ]
    };

    var insertTypeStore = Ext.create('Ext.data.Store', {
      fields: ['key', 'name'],
      data: [
        { "key": "timeTable", "name": "TimeTable" },
        { "key": "catalog", "name": "Catalog" }
      ]
    });

    var me = this;
    var insertTTFieldSet = {
      xtype: 'fieldset',
      title: 'Add in Time Table or Catalog',
      name: 'tt-insertion-fieldset',
      collapsible: false,
      layout: {
        type: 'vbox',
        pack: 'start',
        align: 'stretch'
      },
      items: [
        {
          xtype: 'combo',
          fieldLabel: 'Insert In',
          store: insertTypeStore,
          queryMode: 'local',
          displayField: 'name',
          valueField: 'key',
          editable: false,
          value: 'timeTable',
          name: 'ttcat-type'
        },
        {
          xtype: 'textfield',
          fieldLabel: 'Name',
          name: 'ttcat-name',
          listeners:
          {
            render: function (o, op) {
              var field = this;
              var el = this.el;
              var dropTarget = Ext.create('Ext.dd.DropTarget', el, {
                ddGroup: 'explorerTree',
                notifyOver: function (ddSource, e, data) {
                  var TTCatType = me.form.getForm().findField('ttcat-type').getValue();
                  if (data.records[0].data.leaf && (data.records[0].data.nodeType == TTCatType)) {
                    this.valid = true;
                    return this.dropAllowed;
                  }
                  this.valid = false;
                  return this.dropNotAllowed;
                },
                notifyDrop: function (ddSource, e, data) {
                  if (!this.valid)
                    return false;
                  field.setValue(data.records[0].get('text'));
                  return true;
                }
              });
            }
          }
        },
        {
          xtype: 'button',
          width: 100,
          text: 'Insert Interval',
          scope: this,
          handler: function () {
            var me = this;

            var TTCatType = this.form.getForm().findField('ttcat-type').getValue();
            var TTCatName = this.form.getForm().findField('ttcat-name').getValue();

            var isCatalog = (TTCatType == 'catalog');
            myDesktopApp.getLoadedModule(isCatalog ? this.catModuleId : this.ttModuleId, true, function (module) {
              var targetModuleUI = module.getUiContent();
              if (me.linkedTTCatNode && (me.linkedTTCatNode.get('text') == TTCatName) && (me.linkedTTCatNode.get('nodeType') == TTCatType)) {
                if (targetModuleUI)
                  me.insertInterval();
                else {
                  me.linkedTTCatNode.editLeaf(function () {
                    me.insertInterval();
                  });
                }
              }
              else {
                var explorerTree = Ext.getCmp(amdaUI.ExplorerUI.RESRC_TAB.TREE_ID);
                var ttCatRootNode = explorerTree.getRootNode().findChild('id', isCatalog ? 'catalog-treeRootNode' : 'timeTable-treeRootNode', true);
                amdaModel.InteractiveNode.preloadNodes(ttCatRootNode, function () {
                  var nodeWithSameName = null;

                  if (TTCatName != '')
                    nodeWithSameName = ttCatRootNode.findChild('text', TTCatName, true);

                  if (nodeWithSameName !== null)
                    me.linkedTTCatNode = nodeWithSameName;
                  else {
                    module.createLinkedNode();
                    module.getLinkedNode().set('text', TTCatName);
                    me.linkedTTCatNode = module.getLinkedNode();
                    var obj = {
                      name: TTCatName,
                      fromPlugin: true
                    };
                    if (isCatalog) {
                      Ext.Msg.prompt('Define Parameters', 'Please enter parameters number for the new catalog:', function (btn, text) {
                        if (btn == 'ok') {
                          obj.nbParameters = parseInt(text, 10);
                          if (isNaN(obj.nbParameters)) {
                            obj.nbParameters = 1;
                          }
                          module.createObject(obj);
                          me.linkedTTCatNode.editLeaf(function () {
                            me.insertInterval();
                          });
                        }
                      });
                      return;
                    }
                    else {
                      module.createObject(obj);
                    }
                  }

                  me.linkedTTCatNode.editLeaf(function () {
                    me.insertInterval();
                  });
                });
              }
            });
          }
        }
      ]
    };

    this.form = new Ext.form.FormPanel({
      frame: true,
      width: 255,
      layout: {
        type: 'vbox',
        pack: 'start',
        align: 'stretch'
      },
      fieldDefaults: {
        labelWidth: 60
      },
      items: [
        intervalFieldSet,
        //Ici on rajoute les composants associés à la fonctionnalité 'PlotFunction'
        me.isPlotFunction ? this.plotFunctionType : insertTTFieldSet,
        // me.isPlotFunction ? this.plotFunctionParamField : null,
      ],
      fbar: [
        {
          text: me.isPlotFunction ? "Apply" : 'Apply Zoom',
          width: 100,
          scope: this,
          handler: function () {
            if (this.zoomType == 'timeAxis') {
              var minZoom = Ext.Date.format(this.form.getForm().findField('zoom-min-time').getValue(), 'Y-m-d\\TH:i:s.u');
              var maxZoom = Ext.Date.format(this.form.getForm().findField('zoom-max-time').getValue(), 'Y-m-d\\TH:i:s.u');
            }
            else {
              var minZoom = this.form.getForm().findField('zoom-min-float').getValue();
              var maxZoom = this.form.getForm().findField('zoom-max-float').getValue();
            }

            if (!maxZoom || !minZoom || !this.form.getForm().isValid()) {
              myDesktopApp.warningMsg('Error in values definition');
              return;
            }

            if (me.isPlotFunction) {
              const start_time = this.form.getForm().findField('zoom-min-time').getValue();
              const stop_time = this.form.getForm().findField('zoom-max-time').getValue();

              let request_to_send = {};
              request_to_send = Object.assign({}, me.plotFunctionType.getValues()/*, me.plotFunctionParamField.getValues()*/);
              request_to_send = Object.assign({}, request_to_send, {
                'action': 'plotFunction',
                'interactiveId': this.interactiveId,
                'panelId': this.panelId,
                'starttime': start_time,
                'stoptime': stop_time
              });

              console.log(request_to_send);
              // const parent = this;
              this.hostCmp.callInteractivePlot(request_to_send);/*, function () {
                Ext.Ajax.request({
                  url: parent.path_context_file,
                  success: function (response, options) {
                    var xmlDoc = response.responseXML;
                    const wind = new amdaPlotComp.plotFunction.CreatePlot({
                      xmlDoc: xmlDoc, plotFunctionType: me.plotFunctionType,
                      plotFunctionParamField: me.plotFunctionParamField
                    });
                    wind.show();
                    wind.plot();
                  }
                });
              });*/

            } else {
              this.hostCmp.callInteractivePlot({
                'action': 'zoom',
                'interactiveId': this.interactiveId,
                'panelId': this.panelId,
                'axeId': this.zoomType,
                'min': minZoom,
                'max': maxZoom
              });
            }

            this.hostCmp.panelImage.resetZoom();
          }
        },
        {
          text: 'Undo Zoom',
          width: 100,
          scope: this,
          handler: function () {
            this.hostCmp.callInteractivePlot({
              'action': 'undozoom',
              'interactiveId': this.interactiveId,
              'panelId': this.panelId,
              'axeId': this.zoomType
            });
            this.hostCmp.panelImage.resetZoom();
          }
        }
      ]
    });

    this.plotFunctionType.setParent(this.form.getForm());
    // this.plotFunctionParamField.setParent(this.form.getForm());
    return this.form;
  },

});