Ext.define('PageCalibration', { extend: 'Ext.panel.Panel', alias: 'widget.pageCalibration', layout: { type: 'hbox', align: 'stretch', pack: 'start', }, getValues: function() { let me = this; let values = {}; Ext.Array.each(me.query('[isFormField]'), function(field) { if (field.isValid()) { let data = field.getSubmitData(); Ext.Object.each(data, function(name, val) { let parsed = parseFloat(val, 10); values[name] = isNaN(parsed) ? val : parsed; }); } }); if (values.d_x === undefined) { return; } if (values.d_y === undefined) { return; } if (values.s_x === undefined) { return; } if (values.s_y === undefined) { return; } scalex = 100/values.d_x; scaley = 100/values.d_y; let offsetx = ((50*scalex) - values.s_x)/scalex; let offsety = ((50*scaley) - values.s_y)/scaley; return { scalex: scalex, scaley: scaley, offsetx: offsetx, offsety: offsety, }; }, controller: { xclass: 'Ext.app.ViewController', control: { 'field': { change: function() { let view = this.getView(); let param = view.getValues(); view.fireEvent("calibrationchanged", param); }, }, }, }, items: [ { border: false, layout: { type: 'vbox', align: 'stretch', pack: 'start', }, items: [ { xtype: 'displayfield', value: 'a4', fieldLabel: 'Start Offset Sx (mm)', labelWidth: 150, value: 50, }, { xtype: 'displayfield', value: 'a4', fieldLabel: 'Length Dx (mm)', labelWidth: 150, value: 100, }, { xtype: 'displayfield', value: 'a4', fieldLabel: 'Start Offset Sy (mm)', labelWidth: 150, value: 50, }, { xtype: 'displayfield', value: 'a4', fieldLabel: 'Length Dy (mm)', labelWidth: 150, value: 100, }, ], }, { border: false, margin: '0 0 0 20', layout: { type: 'vbox', align: 'stretch', pack: 'start', }, items: [ { xtype: 'numberfield', value: 'a4', name: 's_x', fieldLabel: 'Meassured Start Offset Sx (mm)', allowBlank: false, labelWidth: 200, }, { xtype: 'numberfield', value: 'a4', name: 'd_x', fieldLabel: 'Meassured Length Dx (mm)', allowBlank: false, labelWidth: 200, }, { xtype: 'numberfield', value: 'a4', name: 's_y', fieldLabel: 'Meassured Start Offset Sy (mm)', allowBlank: false, labelWidth: 200, }, { xtype: 'numberfield', value: 'a4', name: 'd_y', fieldLabel: 'Meassured Length Dy (mm)', allowBlank: false, labelWidth: 200, }, ], }, ], })