/** * 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', catModuleId: 'catalog-win', win: null, form: null, zoomType: '', tabId: '', panelId: -1, linkedTTCatNode: 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(); 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 (tabId, zoomType, panelId) { 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.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 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(); }, /** * 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 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: 'Intervals Insertion', 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: 250, 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; } });