/** * 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', id: 'plot-zoom-plug', ttModuleId: 'timetab-win', win: null, form: null, zoomType: '', tabId: '', panelId: -1, linkedTTNode: null, constructor: function (config) { Ext.apply(this, config); this.callParent(arguments); }, onDestroy: function () { this.win = null; }, init: function (cmp) { this.hostCmp = cmp; }, 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); else { this.form.getForm().findField('zoom-min-time').setValue(max); this.form.getForm().findField('zoom-max-time').setValue(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(); myDesktopApp.getLoadedModule(this.ttModuleId, true, function (module) { var targetModuleUI = module.getUiContent(); if (targetModuleUI) targetModuleUI.addInterval(start, stop); }); }, /** * creation of the window */ show: function (tabId, zoomType, panelId) { if (!this.win) { this.win = new Ext.Window({ id: 'plot-zoom-win-' + this.hostCmp.ownerCt.getId(), // Plot window ID 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.tabId = tabId; 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': 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 ttNameField = this.form.getForm().findField('tt-name'); if (ttNameField) ttNameField.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(); }, /** * 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\\TH:i:s' }, { xtype: 'datefield', name: 'zoom-max-time', fieldLabel: 'Stop Time', format: 'Y-m-d\\TH:i:s' }, { xtype: 'numberfield', name: 'zoom-min-float', fieldLabel: 'Min Value' }, { xtype: 'numberfield', name: 'zoom-max-float', fieldLabel: 'Max Value' }, { xtype: 'button', width: 100, text: 'Reset interval', scope: this, handler: function () { this.resetMinMaxValue(); } } ] }; var insertTTFieldSet = { xtype: 'fieldset', title: 'TimeTable Insertion', name: 'tt-insertion-fieldset', collapsible: false, layout: { type: 'vbox', pack: 'start', align: 'stretch' }, items: [ { xtype: 'textfield', fieldLabel: 'TimeTable Name', name: 'tt-name', listeners: { render: function (o, op) { var me = this; var el = me.el; var dropTarget = Ext.create('Ext.dd.DropTarget', el, { ddGroup: 'explorerTree', notifyOver: function (ddSource, e, data) { if ((data.records[0].data.nodeType == 'timeTable') && (data.records[0].data.leaf)) { this.valid = true; return this.dropAllowed; } this.valid = false; return this.dropNotAllowed; }, notifyDrop: function (ddSource, e, data) { if (!this.valid) return false; me.setValue(data.records[0].get('text')); return true; } }); } } }, { xtype: 'button', width: 100, text: 'Insert Interval', scope: this, handler: function () { var me = this; var TTname = this.form.getForm().findField('tt-name').getValue(); myDesktopApp.getLoadedModule(this.ttModuleId, true, function (module) { var targetModuleUI = module.getUiContent(); if (me.linkedTTNode && (me.linkedTTNode.get('text') == TTname)) { if (targetModuleUI) me.insertInterval(); else { me.linkedTTNode.editLeaf(function () { me.insertInterval(); }); } } else { if (TTname == '') { me.linkedTTNode.editLeaf(function () { me.insertInterval(); }); } var explorerTree = Ext.getCmp(amdaUI.ExplorerUI.RESRC_TAB.TREE_ID); var ttRootNode = explorerTree.getRootNode().findChild('id', 'timeTable-treeRootNode', true); amdaModel.InteractiveNode.preloadNodes(ttRootNode, function () { var nodeWithSameName = null; if (TTname != '') nodeWithSameName = ttRootNode.findChild('text', TTname, true); if (nodeWithSameName !== null) me.linkedTTNode = nodeWithSameName; else { var obj = Ext.create('amdaModel.TimeTable', {name: TTname, fromPlugin: true}); me.linkedTTNode = Ext.create('amdaModel.TimeTableNode', { leaf: true, text: TTname, nodeType: 'timeTable', object: obj }); } me.linkedTTNode.editLeaf(function () { me.insertInterval(); }); }); } }); } } ] }; this.form = new Ext.form.FormPanel({ frame: true, layout: { type: 'vbox', pack: 'start', align: 'stretch' }, fieldDefaults: { labelWidth: 60 }, items: [ intervalFieldSet, insertTTFieldSet ], fbar: [ { text: 'Apply Zoom', width: 100, scope: this, handler: function () { if (this.zoomType == 'timeAxis') { var minZoom = this.form.getForm().findField('zoom-min-time').getValue(); var maxZoom = this.form.getForm().findField('zoom-max-time').getValue(); } 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; } this.hostCmp.callInteractivePlot({ 'action': 'zoom', 'tabId': this.tabId, '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', 'tabId': this.tabId, 'panelId': this.panelId, 'axeId': this.zoomType }); this.hostCmp.panelImage.resetZoom(); } } ] }); return this.form; } });