]> git.proxmox.com Git - pve-manager.git/commitdiff
Use a View Controller for making components react to each other
authorEmmanuel Kasper <e.kasper@proxmox.com>
Mon, 10 Jul 2017 14:35:03 +0000 (16:35 +0200)
committerDietmar Maurer <dietmar@proxmox.com>
Tue, 11 Jul 2017 11:24:48 +0000 (13:24 +0200)
This allow to declare all the components inside the same items
array, and separate behaviour from view better.

No functional changes.

www/manager6/qemu/CreateWizard.js

index 42de6ce0aa398a06e4df9a54d1ce17e4dd54ff0a..57d90be8366bdf35bae7e4a25c5979772e4c4116 100644 (file)
@@ -3,6 +3,22 @@ Ext.define('PVE.qemu.CreateWizard', {
     alias: 'widget.pveQemuCreateWizard',
     qemuScsiController: undefined,
 
+    controller: {
+
+       xclass: 'Ext.app.ViewController',
+
+       control: {
+           'field[name=nodename]': {
+               change: function(f, value) {
+                   var me = this;
+                   ['networkpanel', 'hdpanel', 'cdpanel'].forEach(function(reference) {
+                       me.lookup(reference).setNodename(value);
+                   });
+               }
+           }
+       }
+    },
+
     initComponent: function() {
        var me = this;
 
@@ -16,26 +32,6 @@ Ext.define('PVE.qemu.CreateWizard', {
            ]
        });
 
-       var cdpanel = Ext.create('PVE.qemu.CDInputPanel', {
-           title: gettext('CD/DVD'),
-           confid: 'ide2',
-           fieldDefaults: {
-               labelWidth: 160
-           },
-           insideWizard: true
-       });
-
-       var hdpanel = Ext.create('PVE.qemu.HDInputPanel', {
-           title: gettext('Hard Disk'),
-           isCreate: true,
-           insideWizard: true
-       });
-
-       var networkpanel =  Ext.create('PVE.qemu.NetworkInputPanel', {
-           title: gettext('Network'),
-           insideWizard: true
-       });
-
        Ext.applyIf(me, {
            subject: gettext('Virtual Machine'),
            items: [
@@ -51,14 +47,7 @@ Ext.define('PVE.qemu.CreateWizard', {
                            preferredValue: me.nodename,
                            fieldLabel: gettext('Node'),
                            allowBlank: false,
-                           onlineValidator: true,
-                           listeners: {
-                               change: function(f, value) {
-                                   networkpanel.setNodename(value);
-                                   hdpanel.setNodename(value);
-                                   cdpanel.setNodename(value);
-                               }
-                           }
+                           onlineValidator: true
                        },
                        {
                            xtype: 'pveGuestIDSelector',
@@ -101,8 +90,23 @@ Ext.define('PVE.qemu.CreateWizard', {
                    xtype: 'pveQemuOSTypePanel',
                    insideWizard: true
                },
-               cdpanel,
-               hdpanel,
+               {
+                   xtype: 'pveQemuCDInputPanel',
+                   reference: 'cdpanel',
+                   title: gettext('CD/DVD'),
+                   confid: 'ide2',
+                   fieldDefaults: {
+                       labelWidth: 160
+                   },
+                   insideWizard: true
+               },
+               {
+                   xtype: 'pveQemuHDInputPanel',
+                   reference: 'hdpanel',
+                   title: gettext('Hard Disk'),
+                   isCreate: true,
+                   insideWizard: true
+               },
                {
                    xtype: 'pveQemuProcessorPanel',
                    title: gettext('CPU')
@@ -112,7 +116,12 @@ Ext.define('PVE.qemu.CreateWizard', {
                    insideWizard: true,
                    title: gettext('Memory')
                },
-               networkpanel,
+               {
+                   xtype: 'pveQemuNetworkInputPanel',
+                   reference: 'networkpanel',
+                   title: gettext('Network'),
+                   insideWizard: true
+               },
                {
                    title: gettext('Confirm'),
                    layout: 'fit',