[pve-devel] [PATCH manager 1/6] ui: refactor ProcessorInputPanel to declarative style

[Thomas Lamprecht]

Signed-off-by: Thomas Lamprecht <t.lamprecht at proxmox.com>
---
 www/manager6/qemu/ProcessorEdit.js | 129 ++++++++++++++++++-------------------
 1 file changed, 63 insertions(+), 66 deletions(-)

diff --git a/www/manager6/qemu/ProcessorEdit.js b/www/manager6/qemu/ProcessorEdit.js
index 01da7036..1ac6db26 100644
--- a/www/manager6/qemu/ProcessorEdit.js
+++ b/www/manager6/qemu/ProcessorEdit.js
@@ -3,6 +3,23 @@ Ext.define('PVE.qemu.ProcessorInputPanel', {
     alias: 'widget.pveQemuProcessorPanel',
     onlineHelp: 'qm_cpu',
 
+    controller: {
+	xclass: 'Ext.app.ViewController',
+	control: {
+	    'pveIntegerField[name=sockets]': {
+		change: 'setTotalCores'
+	    },
+	    'pveIntegerField[name=cores]': {
+		change: 'setTotalCores'
+	    }
+	},
+	setTotalCores: function() {
+	    var sockets = this.lookup('sockets').getValue();
+	    var cores = this.lookup('cores').getValue();
+	    this.lookup('totalcores').setValue(sockets * cores);
+	}
+    },
+
     onGetValues: function(values) {
 	var me = this;
 
@@ -35,72 +52,52 @@ Ext.define('PVE.qemu.ProcessorInputPanel', {
 	return values;
     },
 
-    initComponent : function() {
-	var me = this;
-
-	me.cpu = {};
-
-	me.column1 = [
-	    {
-		xtype: 'pveIntegerField',
-		name: 'sockets',
-		minValue: 1,
-		maxValue: 4,
-		value: '1',
-		fieldLabel: gettext('Sockets'),
-		allowBlank: false,
-		listeners: {
-		    change: function(f, value) {
-			var sockets = me.down('field[name=sockets]').getValue();
-			var cores = me.down('field[name=cores]').getValue();
-			me.down('field[name=totalcores]').setValue(sockets*cores);
-		    }
-		}
-	    },
-	    {
-		xtype: 'pveIntegerField',
-		name: 'cores',
-		minValue: 1,
-		maxValue: 128,
-		value: '1',
-		fieldLabel: gettext('Cores'),
-		allowBlank: false,
-		listeners: {
-		    change: function(f, value) {
-			var sockets = me.down('field[name=sockets]').getValue();
-			var cores = me.down('field[name=cores]').getValue();
-			me.down('field[name=totalcores]').setValue(sockets*cores);
-		    }
-		}
-	    },
-	    {
-		xtype: 'pvecheckbox',
-		fieldLabel: gettext('Enable NUMA'),
-		name: 'numa',
-		uncheckedValue: 0
-	    }
-
-	];
-
-
-	me.column2 = [
-	    {
-		xtype: 'CPUModelSelector',
-		name: 'cputype',
-		value: '__default__',
-		fieldLabel: gettext('Type')
-	    },
-	    {
-		xtype: 'displayfield',
-		fieldLabel: gettext('Total cores'),
-		name: 'totalcores',
-		value: '1'
-	    }
-
-	];
+    column1: [
+	{
+	    xtype: 'pveIntegerField',
+	    name: 'sockets',
+	    reference: 'sockets',
+	    minValue: 1,
+	    maxValue: 4,
+	    value: '1',
+	    fieldLabel: gettext('Sockets'),
+	    allowBlank: false
+	},
+	{
+	    xtype: 'pveIntegerField',
+	    name: 'cores',
+	    reference: 'cores',
+	    minValue: 1,
+	    maxValue: 128,
+	    value: '1',
+	    fieldLabel: gettext('Cores'),
+	    allowBlank: false
+	},
+	{
+	    xtype: 'pvecheckbox',
+	    fieldLabel: gettext('Enable NUMA'),
+	    name: 'numa',
+	    uncheckedValue: 0
+	}
+    ],
+
+    column2: [
+	{
+	    xtype: 'CPUModelSelector',
+	    name: 'cputype',
+	    value: '__default__',
+	    fieldLabel: gettext('Type')
+	},
+	{
+	    xtype: 'displayfield',
+	    fieldLabel: gettext('Total cores'),
+	    name: 'totalcores',
+	    reference: 'totalcores',
+	    value: '1'
+	}
+    ],
 
-	me.callParent();
-    }
+    cpu: {}
 });
 
 Ext.define('PVE.qemu.ProcessorEdit', {
@@ -108,7 +105,7 @@ Ext.define('PVE.qemu.ProcessorEdit', {
 
     initComponent : function() {
 	var me = this;
-	
+
 	var ipanel = Ext.create('PVE.qemu.ProcessorInputPanel');
 
 	Ext.apply(me, {
-- 
2.11.0