Commit 1591d4c29fe097aab12f205609d376650e526fe1

Authored by Menouar AZIB
1 parent 2b1b3d60

Basic functionalities are working after Refactoring

js/app/views/PlotComponents/PlotZoomPlug copy.js 0 → 100644
@@ -0,0 +1,517 @@ @@ -0,0 +1,517 @@
  1 +/**
  2 + * Project  : AMDA-NG
  3 + * Name : PlotZoomPlug.js
  4 + * @plugin amdaPlotComp.PlotZoomPlug
  5 + * @extends Ext.util.Observable
  6 + * @ptype plotZoomPlugin
  7 + * @brief Plot Zoom UI (View)
  8 + * @author Benjamin
  9 + * @version $Id: PlotZoomPlug.js
  10 + ********************************************************************************
  11 + * FT Id : Date : Name - Description
  12 + *******************************************************************************
  13 + * :
  14 + */
  15 +
  16 +
  17 +Ext.define('amdaPlotComp.PlotZoomPlug', {
  18 + extend: 'Ext.util.Observable',
  19 + alias: 'plugin.plotZoomPlugin',
  20 + requires: ['amdaPlotComp.intervalSelection.IntervalSelection',
  21 + 'amdaPlotComp.plotFunction.ParamField', 'amdaPlotComp.plotFunction.FunctionType', 'amdaPlotComp.plotFunction.CreatePlot'],
  22 +
  23 + //id: 'plot-zoom-plug',
  24 +
  25 + ttModuleId: 'timetab-win',
  26 + catModuleId: 'catalog-win',
  27 +
  28 + win: null,
  29 + form: null,
  30 + zoomType: '',
  31 + interactiveId: '',
  32 + panelId: -1,
  33 + myChildWindow: null,
  34 +
  35 + linkedTTCatNode: null,
  36 + /**
  37 + * 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
  38 + */
  39 + plotFunctionParamField: null,
  40 + /**
  41 + * Un composant de 'PlotFunction' qui permet à l'utilisateur de séléctionner le type de fonction à appliquer : FFT, SUM, ...
  42 + */
  43 + plotFunctionType: null,
  44 +
  45 + constructor: function (config) {
  46 + Ext.apply(this, config);
  47 + this.callParent(arguments);
  48 + },
  49 +
  50 + onDestroy: function () {
  51 + this.win = null;
  52 + },
  53 +
  54 + init: function (cmp) {
  55 + this.hostCmp = cmp;
  56 + },
  57 +
  58 + /**
  59 + * Set different parameters displayed on the current panel
  60 + * @param {*} listParams_ parameters displayed on the current panel
  61 + */
  62 + /*setParameters: function (listParams_) {
  63 + this.listParams = listParams_;
  64 + //this.plotFunctionParamField = new amdaPlotComp.plotFunction.ParamField({ params: this.listParams });
  65 + this.plotFunctionType = new amdaPlotComp.plotFunction.FunctionType({});
  66 + },*/
  67 +
  68 +
  69 + setMinValue: function (min) {
  70 + if (!this.form)
  71 + return;
  72 +
  73 + this.myChildWindow.setField1Value(min);
  74 +
  75 + if (this.zoomType == 'timeAxis') {
  76 + this.form.getForm().findField('zoom-min-time').setValue(min);
  77 +
  78 + }
  79 + else
  80 + this.form.getForm().findField('zoom-min-float').setValue(min);
  81 + },
  82 +
  83 + setMaxValue: function (max) {
  84 + if (!this.form)
  85 + return;
  86 +
  87 + this.myChildWindow.setField2Value(max);
  88 +
  89 + if (this.zoomType == 'timeAxis') {
  90 + var minValue = this.form.getForm().findField('zoom-min-time').getValue();
  91 + if (minValue <= max) {
  92 + this.form.getForm().findField('zoom-max-time').setValue(max);
  93 + //if (this.isPlotFunction)
  94 + //this.plotFunctionParamField.setValues(minValue, max);
  95 + }
  96 + else {
  97 + this.form.getForm().findField('zoom-min-time').setValue(max);
  98 + this.form.getForm().findField('zoom-max-time').setValue(minValue);
  99 + // if (this.isPlotFunction)
  100 + // this.plotFunctionParamField.setValues(max, minValue);
  101 + }
  102 + }
  103 + else {
  104 + var minValue = this.form.getForm().findField('zoom-min-float').getValue();
  105 + if (minValue <= max)
  106 + this.form.getForm().findField('zoom-max-float').setValue(max);
  107 + else {
  108 + this.form.getForm().findField('zoom-min-float').setValue(max);
  109 + this.form.getForm().findField('zoom-max-float').setValue(minValue);
  110 + }
  111 + }
  112 + },
  113 +
  114 + /**
  115 + * add Interval to Time table
  116 + **/
  117 + insertInterval: function () {
  118 + if (this.zoomType != 'timeAxis')
  119 + return;
  120 +
  121 + var start = this.form.getForm().findField('zoom-min-time').getValue();
  122 + var stop = this.form.getForm().findField('zoom-max-time').getValue();
  123 +
  124 + var TTCatType = this.form.getForm().findField('ttcat-type').getValue();
  125 + var isCatalog = (TTCatType == 'catalog');
  126 +
  127 + myDesktopApp.getLoadedModule(isCatalog ? this.catModuleId : this.ttModuleId, true, function (module) {
  128 + var targetModuleUI = module.getUiContent();
  129 + if (targetModuleUI)
  130 + targetModuleUI.addInterval(start, stop);
  131 + });
  132 + },
  133 +
  134 + /**
  135 + * creation of the window
  136 + */
  137 + show: function (interactiveId, zoomType, panelId, isPlotFunction_ = false) {
  138 + this.myChildWindow = Ext.create('amdaPlotComp.intervalSelection.DateIntervalSelection', {renderTo: this.hostCmp.ownerCt.body});
  139 + // Show the window
  140 + this.myChildWindow.show();
  141 + this.myChildWindow.setPosition(100, 100);
  142 +
  143 + this.isPlotFunction = isPlotFunction_;
  144 + if (this.win) { this.close() };
  145 + this.win = new Ext.Window({
  146 + id: 'plot-zoom-win-' + this.hostCmp.ownerCt.getId(), // Plot window ID
  147 + width: 250,
  148 + x: 0, y: 0,
  149 + baseCls: 'x-panel',
  150 + title: 'Zoom',
  151 + constrain: true,
  152 + collapsible: true,
  153 + resizable: false,
  154 + ghost: false,
  155 + renderTo: this.hostCmp.ownerCt.body,
  156 + items: this.getFormConfig(),
  157 + listeners: {
  158 + scope: this,
  159 + beforeclose: function () {
  160 + this.hostCmp.panelImage.hidePanelMarker();
  161 + this.hostCmp.panelImage.stopZoom();
  162 + },
  163 + show: function(win, eOpts) {
  164 + this.hostCmp.panelImage.showPanelMarker(panelId);
  165 + }
  166 + },
  167 + getConstrainVector: function (constrainTo) {
  168 + var me = this;
  169 + if (me.constrain || me.constrainHeader) {
  170 + constrainTo = constrainTo || (me.floatParent && me.floatParent.getTargetEl()) || me.container || me.el.getScopeParent();
  171 + return (me.constrainHeader ? me.header.el : me.el).getConstrainVector(constrainTo);
  172 + }
  173 + }
  174 + });
  175 +
  176 + this.win.on('destroy', this.onDestroy, this);
  177 +
  178 + this.interactiveId = interactiveId;
  179 + this.updateWinByType(zoomType, panelId);
  180 + this.win.show();
  181 + this.win.setPosition(0, 0);
  182 + },
  183 +
  184 + close: function () {
  185 + if (this.win == null)
  186 + return;
  187 + this.win.close();
  188 + },
  189 +
  190 + updateWinByType: function (zoomType, panelId) {
  191 + if (this.win == null)
  192 + return;
  193 +
  194 + this.zoomType = zoomType;
  195 + this.panelId = panelId;
  196 +
  197 + switch (zoomType) {
  198 + case 'timeAxis':
  199 + if (this.isPlotFunction) {
  200 + const title = "Apply a Fct on Interval";
  201 + this.win.setTitle(title + '-Panel Id: ' + panelId);
  202 + } else {
  203 + this.win.setTitle('Zoom on time axis & Interval selection - Panel Id : ' + panelId);
  204 + }
  205 + break;
  206 + case 'y-left':
  207 + this.win.setTitle('Zoom on Y Left axis - Panel Id : ' + panelId);
  208 + break;
  209 + case 'y-right':
  210 + this.win.setTitle('Zoom on Y Right axis - Panel Id : ' + panelId);
  211 + break;
  212 + case 'xaxis_id':
  213 + this.win.setTitle('Zoom on X axis - Panel Id : ' + panelId);
  214 + break;
  215 + }
  216 +
  217 + this.form.getForm().findField('zoom-min-time').setVisible(this.zoomType == 'timeAxis');
  218 + this.form.getForm().findField('zoom-max-time').setVisible(this.zoomType == 'timeAxis');
  219 +
  220 + this.form.getForm().findField('zoom-min-float').setVisible(this.zoomType != 'timeAxis');
  221 + this.form.getForm().findField('zoom-max-float').setVisible(this.zoomType != 'timeAxis');
  222 +
  223 + var ttCatNameField = this.form.getForm().findField('ttcat-name');
  224 + if (ttCatNameField)
  225 + ttCatNameField.findParentByType('fieldset').setVisible(this.zoomType == 'timeAxis');
  226 + },
  227 +
  228 + resetMinMaxValue: function () {
  229 + if (this.zoomType == 'timeAxis') {
  230 + this.form.getForm().findField('zoom-min-time').setValue('');
  231 + this.form.getForm().findField('zoom-max-time').setValue('');
  232 + }
  233 + else {
  234 + this.form.getForm().findField('zoom-min-float').setValue(null);
  235 + this.form.getForm().findField('zoom-max-float').setValue(null);
  236 + }
  237 +
  238 + this.hostCmp.panelImage.resetZoom();
  239 + },
  240 + setTimePlot: function () {
  241 + var timeObj = new Object();
  242 + timeObj.start = this.form.getForm().findField('zoom-min-time').getValue();
  243 + timeObj.stop = this.form.getForm().findField('zoom-max-time').getValue();
  244 + timeObj.interactiveId = this.interactiveId;
  245 + var plotModule = myDesktopApp.getLoadedModule(myDesktopApp.dynamicModules.plot.id);
  246 + plotModule.setTimeInterval(timeObj);
  247 + },
  248 + /**
  249 + * Main form
  250 + */
  251 + getFormConfig: function () {
  252 + var intervalFieldSet = {
  253 + xtype: 'fieldset',
  254 + title: 'Interval Selection',
  255 + name: 'interval-selection-fieldset',
  256 + collapsible: false,
  257 + layout: {
  258 + type: 'vbox',
  259 + pack: 'start',
  260 + align: 'stretch'
  261 + },
  262 + items: [
  263 + {
  264 + xtype: 'datefield', name: 'zoom-min-time', fieldLabel: 'Start Time',
  265 + format: 'Y/m/d H:i:s.u',
  266 + },
  267 + {
  268 + xtype: 'datefield', name: 'zoom-max-time', fieldLabel: 'Stop Time',
  269 + format: 'Y/m/d H:i:s.u'
  270 + },
  271 + {
  272 + xtype: 'numberfield', name: 'zoom-min-float', fieldLabel: 'Min Value'
  273 + },
  274 + {
  275 + xtype: 'numberfield', name: 'zoom-max-float', fieldLabel: 'Max Value'
  276 + },
  277 + {
  278 + xtype: 'button',
  279 + width: 100,
  280 + text: 'Reset',
  281 + scope: this,
  282 + handler: function () {
  283 + this.resetMinMaxValue();
  284 + }
  285 + },
  286 + {
  287 + xtype: 'button',
  288 + width: 100,
  289 + text: 'Use in Time Selection',
  290 + scope: this,
  291 + handler: function () {
  292 + this.setTimePlot();
  293 + }
  294 + }
  295 + ]
  296 + };
  297 +
  298 + var insertTypeStore = Ext.create('Ext.data.Store', {
  299 + fields: ['key', 'name'],
  300 + data: [
  301 + { "key": "timeTable", "name": "TimeTable" },
  302 + { "key": "catalog", "name": "Catalog" }
  303 + ]
  304 + });
  305 +
  306 + var me = this;
  307 + this.insertTTFieldSet = {
  308 + xtype: 'fieldset',
  309 + title: 'Add in Time Table or Catalog',
  310 + name: 'tt-insertion-fieldset',
  311 + collapsible: false,
  312 + layout: {
  313 + type: 'vbox',
  314 + pack: 'start',
  315 + align: 'stretch'
  316 + },
  317 + items: [
  318 + {
  319 + xtype: 'combo',
  320 + fieldLabel: 'Insert In',
  321 + store: insertTypeStore,
  322 + queryMode: 'local',
  323 + displayField: 'name',
  324 + valueField: 'key',
  325 + editable: false,
  326 + value: 'timeTable',
  327 + name: 'ttcat-type'
  328 + },
  329 + {
  330 + xtype: 'textfield',
  331 + fieldLabel: 'Name',
  332 + name: 'ttcat-name',
  333 + listeners:
  334 + {
  335 + render: function (o, op) {
  336 + var field = this;
  337 + var el = this.el;
  338 + var dropTarget = Ext.create('Ext.dd.DropTarget', el, {
  339 + ddGroup: 'explorerTree',
  340 + notifyOver: function (ddSource, e, data) {
  341 + var TTCatType = me.form.getForm().findField('ttcat-type').getValue();
  342 + if (data.records[0].data.leaf && (data.records[0].data.nodeType == TTCatType)) {
  343 + this.valid = true;
  344 + return this.dropAllowed;
  345 + }
  346 + this.valid = false;
  347 + return this.dropNotAllowed;
  348 + },
  349 + notifyDrop: function (ddSource, e, data) {
  350 + if (!this.valid)
  351 + return false;
  352 + field.setValue(data.records[0].get('text'));
  353 + return true;
  354 + }
  355 + });
  356 + }
  357 + }
  358 + },
  359 + {
  360 + xtype: 'button',
  361 + width: 100,
  362 + text: 'Insert Interval',
  363 + scope: this,
  364 + handler: function () {
  365 + var me = this;
  366 +
  367 + var TTCatType = this.form.getForm().findField('ttcat-type').getValue();
  368 + var TTCatName = this.form.getForm().findField('ttcat-name').getValue();
  369 +
  370 + var isCatalog = (TTCatType == 'catalog');
  371 + myDesktopApp.getLoadedModule(isCatalog ? this.catModuleId : this.ttModuleId, true, function (module) {
  372 + var targetModuleUI = module.getUiContent();
  373 + if (me.linkedTTCatNode && (me.linkedTTCatNode.get('text') == TTCatName) && (me.linkedTTCatNode.get('nodeType') == TTCatType)) {
  374 + if (targetModuleUI)
  375 + me.insertInterval();
  376 + else {
  377 + me.linkedTTCatNode.editLeaf(function () {
  378 + me.insertInterval();
  379 + });
  380 + }
  381 + }
  382 + else {
  383 + var explorerTree = Ext.getCmp(amdaUI.ExplorerUI.RESRC_TAB.TREE_ID);
  384 + var ttCatRootNode = explorerTree.getRootNode().findChild('id', isCatalog ? 'catalog-treeRootNode' : 'timeTable-treeRootNode', true);
  385 + amdaModel.InteractiveNode.preloadNodes(ttCatRootNode, function () {
  386 + var nodeWithSameName = null;
  387 +
  388 + if (TTCatName != '')
  389 + nodeWithSameName = ttCatRootNode.findChild('text', TTCatName, true);
  390 +
  391 + if (nodeWithSameName !== null)
  392 + me.linkedTTCatNode = nodeWithSameName;
  393 + else {
  394 + module.createLinkedNode();
  395 + module.getLinkedNode().set('text', TTCatName);
  396 + me.linkedTTCatNode = module.getLinkedNode();
  397 + var obj = {
  398 + name: TTCatName,
  399 + fromPlugin: true
  400 + };
  401 + if (isCatalog) {
  402 + Ext.Msg.prompt('Define Parameters', 'Please enter parameters number for the new catalog:', function (btn, text) {
  403 + if (btn == 'ok') {
  404 + obj.nbParameters = parseInt(text, 10);
  405 + if (isNaN(obj.nbParameters)) {
  406 + obj.nbParameters = 1;
  407 + }
  408 + module.createObject(obj);
  409 + me.linkedTTCatNode.editLeaf(function () {
  410 + me.insertInterval();
  411 + });
  412 + }
  413 + });
  414 + return;
  415 + }
  416 + else {
  417 + module.createObject(obj);
  418 + }
  419 + }
  420 +
  421 + me.linkedTTCatNode.editLeaf(function () {
  422 + me.insertInterval();
  423 + });
  424 + });
  425 + }
  426 + });
  427 + }
  428 + }
  429 + ]
  430 + };
  431 +
  432 + this.plotFunctionType = new amdaPlotComp.plotFunction.FunctionType({});
  433 +
  434 + this.form = new Ext.form.FormPanel({
  435 + frame: true,
  436 + width: 255,
  437 + layout: {
  438 + type: 'vbox',
  439 + pack: 'start',
  440 + align: 'stretch'
  441 + },
  442 + fieldDefaults: {
  443 + labelWidth: 60
  444 + },
  445 + items: [
  446 + intervalFieldSet,
  447 + this.isPlotFunction ? this.plotFunctionType : this.insertTTFieldSet
  448 + ],
  449 + fbar: [
  450 + {
  451 + text: me.isPlotFunction ? "Apply The Function" : 'Apply Zoom',
  452 + width: me.isPlotFunction ? 200 : 100,
  453 + scope: this,
  454 + handler: function () {
  455 + if (this.zoomType == 'timeAxis') {
  456 + var minZoom = Ext.Date.format(this.form.getForm().findField('zoom-min-time').getValue(), 'Y-m-d\\TH:i:s.u');
  457 + var maxZoom = Ext.Date.format(this.form.getForm().findField('zoom-max-time').getValue(), 'Y-m-d\\TH:i:s.u');
  458 + }
  459 + else {
  460 + var minZoom = this.form.getForm().findField('zoom-min-float').getValue();
  461 + var maxZoom = this.form.getForm().findField('zoom-max-float').getValue();
  462 + }
  463 +
  464 + if (!maxZoom || !minZoom || !this.form.getForm().isValid()) {
  465 + myDesktopApp.warningMsg('Error in values definition');
  466 + return;
  467 + }
  468 +
  469 + if (me.isPlotFunction) {
  470 + let request_to_send = {};
  471 +
  472 + request_to_send = Object.assign({}, me.plotFunctionType.getValues()/*, me.plotFunctionParamField.getValues()*/);
  473 + request_to_send = Object.assign({}, request_to_send, {
  474 + 'action': 'plotFunction',
  475 + 'interactiveId': this.interactiveId,
  476 + 'panelId': this.panelId,
  477 + 'starttime': minZoom,
  478 + 'stoptime': maxZoom
  479 + });
  480 +
  481 + this.hostCmp.callInteractivePlot(request_to_send);
  482 + } else {
  483 + this.hostCmp.callInteractivePlot({
  484 + 'action': 'zoom',
  485 + 'interactiveId': this.interactiveId,
  486 + 'panelId': this.panelId,
  487 + 'axeId': this.zoomType,
  488 + 'min': minZoom,
  489 + 'max': maxZoom
  490 + });
  491 + }
  492 +
  493 + this.hostCmp.panelImage.resetZoom();
  494 + }
  495 + },
  496 + me.isPlotFunction ? null :
  497 + {
  498 + text: 'Undo Zoom',
  499 + width: 100,
  500 + scope: this,
  501 + handler: function () {
  502 + this.hostCmp.callInteractivePlot({
  503 + 'action': 'undozoom',
  504 + 'interactiveId': this.interactiveId,
  505 + 'panelId': this.panelId,
  506 + 'axeId': this.zoomType
  507 + });
  508 + this.hostCmp.panelImage.resetZoom();
  509 + }
  510 + }
  511 + ]
  512 + });
  513 +
  514 + return this.form;
  515 + },
  516 +
  517 +});
js/app/views/PlotComponents/PlotZoomPlug.js
@@ -55,60 +55,17 @@ Ext.define(&#39;amdaPlotComp.PlotZoomPlug&#39;, { @@ -55,60 +55,17 @@ Ext.define(&#39;amdaPlotComp.PlotZoomPlug&#39;, {
55 this.hostCmp = cmp; 55 this.hostCmp = cmp;
56 }, 56 },
57 57
58 - /**  
59 - * Set different parameters displayed on the current panel  
60 - * @param {*} listParams_ parameters displayed on the current panel  
61 - */  
62 - /*setParameters: function (listParams_) {  
63 - this.listParams = listParams_;  
64 - //this.plotFunctionParamField = new amdaPlotComp.plotFunction.ParamField({ params: this.listParams });  
65 - this.plotFunctionType = new amdaPlotComp.plotFunction.FunctionType({});  
66 - },*/  
67 -  
68 -  
69 setMinValue: function (min) { 58 setMinValue: function (min) {
70 - if (!this.form) 59 + if (!this.win)
71 return; 60 return;
72 -  
73 - this.myChildWindow.setField1Value(min);  
74 -  
75 - if (this.zoomType == 'timeAxis') {  
76 - this.form.getForm().findField('zoom-min-time').setValue(min);  
77 -  
78 - }  
79 - else  
80 - this.form.getForm().findField('zoom-min-float').setValue(min); 61 + console.log(min);
  62 + this.win.setField1Value(min);
81 }, 63 },
82 64
83 setMaxValue: function (max) { 65 setMaxValue: function (max) {
84 - if (!this.form) 66 + if (!this.win)
85 return; 67 return;
86 -  
87 - this.myChildWindow.setField2Value(max);  
88 -  
89 - if (this.zoomType == 'timeAxis') {  
90 - var minValue = this.form.getForm().findField('zoom-min-time').getValue();  
91 - if (minValue <= max) {  
92 - this.form.getForm().findField('zoom-max-time').setValue(max);  
93 - //if (this.isPlotFunction)  
94 - //this.plotFunctionParamField.setValues(minValue, max);  
95 - }  
96 - else {  
97 - this.form.getForm().findField('zoom-min-time').setValue(max);  
98 - this.form.getForm().findField('zoom-max-time').setValue(minValue);  
99 - // if (this.isPlotFunction)  
100 - // this.plotFunctionParamField.setValues(max, minValue);  
101 - }  
102 - }  
103 - else {  
104 - var minValue = this.form.getForm().findField('zoom-min-float').getValue();  
105 - if (minValue <= max)  
106 - this.form.getForm().findField('zoom-max-float').setValue(max);  
107 - else {  
108 - this.form.getForm().findField('zoom-min-float').setValue(max);  
109 - this.form.getForm().findField('zoom-max-float').setValue(minValue);  
110 - }  
111 - } 68 + this.win.setField2Value(max);
112 }, 69 },
113 70
114 /** 71 /**
@@ -134,51 +91,63 @@ Ext.define(&#39;amdaPlotComp.PlotZoomPlug&#39;, { @@ -134,51 +91,63 @@ Ext.define(&#39;amdaPlotComp.PlotZoomPlug&#39;, {
134 /** 91 /**
135 * creation of the window 92 * creation of the window
136 */ 93 */
137 - show: function (interactiveId, zoomType, panelId, isPlotFunction_ = false) {  
138 - this.myChildWindow = Ext.create('amdaPlotComp.intervalSelection.DateIntervalSelection');  
139 - // Show the window  
140 - this.myChildWindow.show();  
141 - this.myChildWindow.setPosition(100, 100);  
142 -  
143 - this.isPlotFunction = isPlotFunction_;  
144 - if (this.win) { this.close() };  
145 - this.win = new Ext.Window({  
146 - id: 'plot-zoom-win-' + this.hostCmp.ownerCt.getId(), // Plot window ID  
147 - width: 250,  
148 - x: 0, y: 0,  
149 - baseCls: 'x-panel',  
150 - title: 'Zoom',  
151 - constrain: true,  
152 - collapsible: true,  
153 - resizable: false,  
154 - ghost: false,  
155 - renderTo: this.hostCmp.ownerCt.body,  
156 - items: this.getFormConfig(),  
157 - listeners: {  
158 - scope: this,  
159 - beforeclose: function () {  
160 - this.hostCmp.panelImage.hidePanelMarker();  
161 - this.hostCmp.panelImage.stopZoom();  
162 - },  
163 - show: function(win, eOpts) {  
164 - this.hostCmp.panelImage.showPanelMarker(panelId);  
165 - } 94 + show: function (interactiveId, zoomType, panelId) {
  95 + this.zoomType = zoomType;
  96 + this.panelId = panelId;
  97 + this.interactiveId = interactiveId;
  98 +
  99 + let config = {
  100 + id: 'plot-zoom-win-' + this.hostCmp.ownerCt.getId(), // Plot window ID
  101 + interactiveId: interactiveId,
  102 + panelId: panelId,
  103 + hostCmp: this.hostCmp,
  104 + renderTo: this.hostCmp.ownerCt.body,
  105 + listeners: {
  106 + scope: this,
  107 + beforeclose: function () {
  108 + this.hostCmp.panelImage.hidePanelMarker();
  109 + this.hostCmp.panelImage.stopZoom();
166 }, 110 },
167 - getConstrainVector: function (constrainTo) {  
168 - var me = this;  
169 - if (me.constrain || me.constrainHeader) {  
170 - constrainTo = constrainTo || (me.floatParent && me.floatParent.getTargetEl()) || me.container || me.el.getScopeParent();  
171 - return (me.constrainHeader ? me.header.el : me.el).getConstrainVector(constrainTo);  
172 - } 111 + show: function (win, eOpts) {
  112 + this.hostCmp.panelImage.showPanelMarker(panelId);
173 } 113 }
174 - }); 114 + },
  115 + getConstrainVector: function (constrainTo) {
  116 + var me = this;
  117 + if (me.constrain || me.constrainHeader) {
  118 + constrainTo = constrainTo || (me.floatParent && me.floatParent.getTargetEl()) || me.container || me.el.getScopeParent();
  119 + return (me.constrainHeader ? me.header.el : me.el).getConstrainVector(constrainTo);
  120 + }
  121 + }
  122 + };
  123 +
  124 + if (this.win) { this.close() };
175 125
176 - this.win.on('destroy', this.onDestroy, this); 126 + let winType;
177 127
178 - this.interactiveId = interactiveId;  
179 - this.updateWinByType(zoomType, panelId); 128 + switch (this.zoomType) {
  129 + case 'timeAxis':
  130 + winType = 'amdaPlotComp.intervalSelection.DateZoomIntervalSelection';
  131 + break;
  132 + case 'y-left':
  133 + case 'y-right':
  134 + winType = 'amdaPlotComp.intervalSelection.NumberZoomIntervalSelection';
  135 + const title = this.zoomType === 'y-left' ? 'Zoom on Y Left axis' : 'Zoom on Y Right axis';
  136 + config["type"] = this.zoomType;
  137 + config["title"] = title;
  138 + break;
  139 + case 'xaxis_id':
  140 + winType = 'amdaPlotComp.intervalSelection.NumberZoomIntervalSelection';
  141 + title = 'Zoom on X axis';
  142 + break;
  143 + case 'plotFunction':
  144 + winType = 'amdaPlotComp.intervalSelection.PlotFunctionIntervalSelection';
  145 + break;
  146 + }
  147 +
  148 + this.win = Ext.create(winType, config);
  149 + this.win.on('destroy', this.onDestroy, this);
180 this.win.show(); 150 this.win.show();
181 - this.win.setPosition(0, 0);  
182 }, 151 },
183 152
184 close: function () { 153 close: function () {
@@ -226,6 +195,7 @@ Ext.define(&#39;amdaPlotComp.PlotZoomPlug&#39;, { @@ -226,6 +195,7 @@ Ext.define(&#39;amdaPlotComp.PlotZoomPlug&#39;, {
226 }, 195 },
227 196
228 resetMinMaxValue: function () { 197 resetMinMaxValue: function () {
  198 + /*
229 if (this.zoomType == 'timeAxis') { 199 if (this.zoomType == 'timeAxis') {
230 this.form.getForm().findField('zoom-min-time').setValue(''); 200 this.form.getForm().findField('zoom-min-time').setValue('');
231 this.form.getForm().findField('zoom-max-time').setValue(''); 201 this.form.getForm().findField('zoom-max-time').setValue('');
@@ -233,7 +203,7 @@ Ext.define(&#39;amdaPlotComp.PlotZoomPlug&#39;, { @@ -233,7 +203,7 @@ Ext.define(&#39;amdaPlotComp.PlotZoomPlug&#39;, {
233 else { 203 else {
234 this.form.getForm().findField('zoom-min-float').setValue(null); 204 this.form.getForm().findField('zoom-min-float').setValue(null);
235 this.form.getForm().findField('zoom-max-float').setValue(null); 205 this.form.getForm().findField('zoom-max-float').setValue(null);
236 - } 206 + }*/
237 207
238 this.hostCmp.panelImage.resetZoom(); 208 this.hostCmp.panelImage.resetZoom();
239 }, 209 },
@@ -449,7 +419,7 @@ Ext.define(&#39;amdaPlotComp.PlotZoomPlug&#39;, { @@ -449,7 +419,7 @@ Ext.define(&#39;amdaPlotComp.PlotZoomPlug&#39;, {
449 fbar: [ 419 fbar: [
450 { 420 {
451 text: me.isPlotFunction ? "Apply The Function" : 'Apply Zoom', 421 text: me.isPlotFunction ? "Apply The Function" : 'Apply Zoom',
452 - width: me.isPlotFunction ? 200 : 100, 422 + width: me.isPlotFunction ? 200 : 100,
453 scope: this, 423 scope: this,
454 handler: function () { 424 handler: function () {
455 if (this.zoomType == 'timeAxis') { 425 if (this.zoomType == 'timeAxis') {
@@ -468,7 +438,7 @@ Ext.define(&#39;amdaPlotComp.PlotZoomPlug&#39;, { @@ -468,7 +438,7 @@ Ext.define(&#39;amdaPlotComp.PlotZoomPlug&#39;, {
468 438
469 if (me.isPlotFunction) { 439 if (me.isPlotFunction) {
470 let request_to_send = {}; 440 let request_to_send = {};
471 - 441 +
472 request_to_send = Object.assign({}, me.plotFunctionType.getValues()/*, me.plotFunctionParamField.getValues()*/); 442 request_to_send = Object.assign({}, me.plotFunctionType.getValues()/*, me.plotFunctionParamField.getValues()*/);
473 request_to_send = Object.assign({}, request_to_send, { 443 request_to_send = Object.assign({}, request_to_send, {
474 'action': 'plotFunction', 444 'action': 'plotFunction',
@@ -494,20 +464,20 @@ Ext.define(&#39;amdaPlotComp.PlotZoomPlug&#39;, { @@ -494,20 +464,20 @@ Ext.define(&#39;amdaPlotComp.PlotZoomPlug&#39;, {
494 } 464 }
495 }, 465 },
496 me.isPlotFunction ? null : 466 me.isPlotFunction ? null :
497 - {  
498 - text: 'Undo Zoom',  
499 - width: 100,  
500 - scope: this,  
501 - handler: function () {  
502 - this.hostCmp.callInteractivePlot({  
503 - 'action': 'undozoom',  
504 - 'interactiveId': this.interactiveId,  
505 - 'panelId': this.panelId,  
506 - 'axeId': this.zoomType  
507 - });  
508 - this.hostCmp.panelImage.resetZoom(); 467 + {
  468 + text: 'Undo Zoom',
  469 + width: 100,
  470 + scope: this,
  471 + handler: function () {
  472 + this.hostCmp.callInteractivePlot({
  473 + 'action': 'undozoom',
  474 + 'interactiveId': this.interactiveId,
  475 + 'panelId': this.panelId,
  476 + 'axeId': this.zoomType
  477 + });
  478 + this.hostCmp.panelImage.resetZoom();
  479 + }
509 } 480 }
510 - }  
511 ] 481 ]
512 }); 482 });
513 483
js/app/views/PlotComponents/intervalSelection/DateIntervalSelection.js deleted
@@ -1,30 +0,0 @@ @@ -1,30 +0,0 @@
1 -Ext.define('amdaPlotComp.intervalSelection.DateIntervalSelection', {  
2 - extend: 'amdaPlotComp.intervalSelection.IntervalSelection', // This class extends from amdaPlotComp.intervalSelection.IntervalSelection  
3 -  
4 - field1Type: 'datefield',  
5 - field1Label: 'Start Time',  
6 - field1Format: 'Y/m/d H:i:s.u',  
7 - field2Type: 'datefield',  
8 - field2Label: 'Stop Time',  
9 - field2Format: 'Y/m/d H:i:s.u',  
10 -  
11 - /*  
12 - setField1Value: function (value) {  
13 - var field2Value = this.getField2Value();  
14 - value = new Date(value);  
15 - field2Value = new Date(field2Value);  
16 - if (value > field2Value) {  
17 - value = field2Value;  
18 - }  
19 - this.parent.down('#' + FIELD1_ITEM_ID).setValue(value);  
20 - },  
21 -  
22 - setField2Value: function (value) {  
23 - value = new Date(value);  
24 - field1Value = new Date(field1Value);  
25 - if (value < field1Value) {  
26 - value = field1Value;  
27 - }  
28 - this.parent.down('#' + FIELD2_ITEM_ID).setValue(value);  
29 - }*/  
30 -});  
js/app/views/PlotComponents/intervalSelection/DateZoomIntervalSelection.js 0 → 100644
@@ -0,0 +1,7 @@ @@ -0,0 +1,7 @@
  1 +Ext.define('amdaPlotComp.intervalSelection.DateZoomIntervalSelection', {
  2 + extend: 'amdaPlotComp.intervalSelection.ZoomIntervalSelection',
  3 +
  4 + type: 'timeAxis',
  5 + title: "Zoom on time axis & Interval selection"
  6 +
  7 +});
js/app/views/PlotComponents/intervalSelection/IntervalSelection.js
@@ -22,14 +22,18 @@ Ext.define(&#39;amdaPlotComp.intervalSelection.IntervalSelection&#39;, { @@ -22,14 +22,18 @@ Ext.define(&#39;amdaPlotComp.intervalSelection.IntervalSelection&#39;, {
22 ghost: false, // Disables "ghosting" (semi-transparent representation of the window body) when moving or resizing 22 ghost: false, // Disables "ghosting" (semi-transparent representation of the window body) when moving or resizing
23 23
24 parent: null, // Initialize parent to null 24 parent: null, // Initialize parent to null
  25 + hostCmp: null,
  26 + interactiveId: '',
  27 + panelId: -1,
25 28
26 config: { 29 config: {
27 - field1Type: 'numberfield', // The xtype of field1. By default is numberfield.  
28 - field1Label: 'Min Value', // The label of field1.  
29 - field1Format: null,  
30 - field2Type: 'numberfield', // The xtype of field2. By default is numberfield.  
31 - field2Label: 'Max Value', // The label of field2.  
32 - field2Format: null 30 + field1Type: 'datefield', // The xtype of field1. By default is datefield because we are working with time series.
  31 + field1Label: 'Start Time', // The label of field1.
  32 + field1Format: 'Y/m/d H:i:s.u',
  33 + field2Type: 'datefield', // The xtype of field2. By default is datefield.
  34 + field2Label: 'Stop Time', // The label of field2.
  35 + field2Format: 'Y/m/d H:i:s.u',
  36 + buttonApply: 'Apply'
33 }, 37 },
34 38
35 initComponent: function () { 39 initComponent: function () {
@@ -66,7 +70,7 @@ Ext.define(&#39;amdaPlotComp.intervalSelection.IntervalSelection&#39;, { @@ -66,7 +70,7 @@ Ext.define(&#39;amdaPlotComp.intervalSelection.IntervalSelection&#39;, {
66 const value1 = field1.getValue(); 70 const value1 = field1.getValue();
67 if (value1 !== null && value1 !== undefined && value1 !== '') { 71 if (value1 !== null && value1 !== undefined && value1 !== '') {
68 if (newValue < value1) { 72 if (newValue < value1) {
69 - // Update both field1 and field2 to the new value 73 + // Update both field1 and field2 to the new values
70 field1.setValue(newValue); 74 field1.setValue(newValue);
71 field.setValue(value1); 75 field.setValue(value1);
72 } 76 }
@@ -87,16 +91,34 @@ Ext.define(&#39;amdaPlotComp.intervalSelection.IntervalSelection&#39;, { @@ -87,16 +91,34 @@ Ext.define(&#39;amdaPlotComp.intervalSelection.IntervalSelection&#39;, {
87 alert('Button 2 clicked'); 91 alert('Button 2 clicked');
88 } 92 }
89 }] 93 }]
90 - }] 94 + }],
  95 + fbar: [
  96 + {
  97 + xtype: 'button',
  98 + width: 100,
  99 + text: this.buttonApply,
  100 + handler: function () {
  101 + me._apply();
  102 + }
  103 + }
  104 + ]
91 }) 105 })
92 106
93 Ext.apply(this, { 107 Ext.apply(this, {
94 items: this.parent 108 items: this.parent
95 }); 109 });
96 110
  111 + this.setTitle(this.title + " - Panel Id : " + this.panelId);
97 this.callParent(arguments); 112 this.callParent(arguments);
98 }, 113 },
99 114
  115 +
  116 + _apply: function () { },
  117 +
  118 + _notValidValues: function () {
  119 + return !this.getField1Value() || !this.getField2Value() || !this.parent.getForm().isValid();
  120 + },
  121 +
100 _getField1: function () { 122 _getField1: function () {
101 return this.parent.down('#' + FIELD1_ITEM_ID); 123 return this.parent.down('#' + FIELD1_ITEM_ID);
102 }, 124 },
js/app/views/PlotComponents/intervalSelection/NumberZoomIntervalSelection.js 0 → 100644
@@ -0,0 +1,13 @@ @@ -0,0 +1,13 @@
  1 +Ext.define('amdaPlotComp.intervalSelection.NumberZoomIntervalSelection', {
  2 + extend: 'amdaPlotComp.intervalSelection.ZoomIntervalSelection', // This class extends from amdaPlotComp.intervalSelection.IntervalSelection
  3 +
  4 + field1Type: 'numberfield',
  5 + field1Label: 'Min Value',
  6 + field1Format: null,
  7 + field2Type: 'numberfield',
  8 + field2Label: 'Max value',
  9 + field2Format: null,
  10 +
  11 + type: null,
  12 +
  13 +});
js/app/views/PlotComponents/intervalSelection/PlotFunctionIntervalSelection.js 0 → 100644
@@ -0,0 +1,32 @@ @@ -0,0 +1,32 @@
  1 +Ext.define('amdaPlotComp.intervalSelection.PlotFunctionIntervalSelection', {
  2 + extend: 'amdaPlotComp.intervalSelection.IntervalSelection',
  3 + requires: ['amdaPlotComp.plotFunction.FunctionType'],
  4 +
  5 + title: "Plot Function",
  6 + plotFunctionType: null,
  7 +
  8 + initComponent: function () {
  9 + this.callParent(arguments);
  10 + this.plotFunctionType = new amdaPlotComp.plotFunction.FunctionType();
  11 + this.parent.add(this.plotFunctionType);
  12 + },
  13 +
  14 + _apply: function () {
  15 + if (this._notValidValues()) {
  16 + myDesktopApp.warningMsg('The Input Values are not defined');
  17 + } else {
  18 + let request_to_send = {};
  19 + request_to_send = Object.assign({}, this.plotFunctionType.getValues());
  20 + request_to_send = Object.assign({}, request_to_send, {
  21 + 'action': 'plotFunction',
  22 + 'interactiveId': this.interactiveId,
  23 + 'panelId': this.panelId,
  24 + 'starttime': this.getField1Value(),
  25 + 'stoptime': this.getField2Value(),
  26 + });
  27 +
  28 + this.hostCmp.callInteractivePlot(request_to_send);
  29 + }
  30 + },
  31 +
  32 +});
js/app/views/PlotComponents/intervalSelection/ZoomIntervalSelection.js 0 → 100644
@@ -0,0 +1,44 @@ @@ -0,0 +1,44 @@
  1 +Ext.define('amdaPlotComp.intervalSelection.ZoomIntervalSelection', {
  2 + extend: 'amdaPlotComp.intervalSelection.IntervalSelection', // This class extends from amdaPlotComp.intervalSelection.IntervalSelection
  3 +
  4 + buttonApply: "Apply Zoom",
  5 + type: null,
  6 +
  7 + initComponent: function () {
  8 + const me = this;
  9 + this.callParent(arguments);
  10 + this.parent.getDockedItems('toolbar[dock="bottom"]')[0].add({
  11 + xtype: 'button',
  12 + width: 100,
  13 + text: 'Undo Zoom',
  14 + handler: function () {
  15 + me._undoZoom();
  16 + }
  17 + });
  18 + },
  19 +
  20 + _apply: function () {
  21 + if (this._notValidValues()) {
  22 + myDesktopApp.warningMsg('The Input Values are not defined');
  23 + } else {
  24 + this.hostCmp.callInteractivePlot({
  25 + 'action': 'zoom',
  26 + 'interactiveId': this.interactiveId,
  27 + 'panelId': this.panelId,
  28 + 'axeId': this.type,
  29 + 'min': this.getField1Value(),
  30 + 'max': this.getField2Value()
  31 + });
  32 + }
  33 + },
  34 +
  35 + _undoZoom: function () {
  36 + this.hostCmp.callInteractivePlot({
  37 + 'action': 'undozoom',
  38 + 'interactiveId': this.interactiveId,
  39 + 'panelId': this.panelId,
  40 + 'axeId': this.type
  41 + });
  42 + }
  43 +
  44 +});
js/app/views/PlotTabResultUI.js
@@ -163,7 +163,7 @@ Ext.define(&#39;amdaUI.PlotTabResultUI&#39;, { @@ -163,7 +163,7 @@ Ext.define(&#39;amdaUI.PlotTabResultUI&#39;, {
163 plotFunctionItem = { 163 plotFunctionItem = {
164 text: 'Apply a Function on Interval', 164 text: 'Apply a Function on Interval',
165 handler: function (item, e) { 165 handler: function (item, e) {
166 - zoomPlugin.show(me.interactiveId, axis.id, panelContext.id, true); 166 + zoomPlugin.show(me.interactiveId, "plotFunction", panelContext.id);
167 zoomPlugin.resetMinMaxValue(); 167 zoomPlugin.resetMinMaxValue();
168 me.panelImage.startZoom(true, 0, size.height, onMinTimeSelection, onMaxTimeSelection); 168 me.panelImage.startZoom(true, 0, size.height, onMinTimeSelection, onMaxTimeSelection);
169 }, 169 },