[pve-devel] r6251 - in pve-manager/pve2: . lib/PVE/API2 www/manager www/manager/form www/manager/qemu www/manager/window

svn-commits at proxmox.com svn-commits at proxmox.com
Thu Jul 7 10:16:51 CEST 2011


Author: dietmar
Date: 2011-07-07 10:16:51 +0200 (Thu, 07 Jul 2011)
New Revision: 6251

Added:
   pve-manager/pve2/www/manager/form/BridgeSelector.js
Modified:
   pve-manager/pve2/ChangeLog
   pve-manager/pve2/lib/PVE/API2/Network.pm
   pve-manager/pve2/www/manager/Makefile.am
   pve-manager/pve2/www/manager/form/StorageSelector.js
   pve-manager/pve2/www/manager/qemu/CreateWizard.js
   pve-manager/pve2/www/manager/qemu/HardwareView.js
   pve-manager/pve2/www/manager/window/Edit.js
   pve-manager/pve2/www/manager/window/Wizard.js
Log:
	* www/manager/window/Wizard.js: make it easy to use two column
	layout, cleanups

	* www/manager/form/BridgeSelector.js: new impl.



Modified: pve-manager/pve2/ChangeLog
===================================================================
--- pve-manager/pve2/ChangeLog	2011-07-07 04:36:04 UTC (rev 6250)
+++ pve-manager/pve2/ChangeLog	2011-07-07 08:16:51 UTC (rev 6251)
@@ -1,3 +1,10 @@
+2011-07-07  Proxmox Support Team  <support at proxmox.com>
+
+	* www/manager/window/Wizard.js: make it easy to use two column
+	layout, cleanups
+
+	* www/manager/form/BridgeSelector.js: new impl.
+
 2011-07-06  Seth Lauzon  <seth.lauzon at gmail.com>
 
 	* www/manager/Makefile.am: add GroupEdit.js

Modified: pve-manager/pve2/lib/PVE/API2/Network.pm
===================================================================
--- pve-manager/pve2/lib/PVE/API2/Network.pm	2011-07-07 04:36:04 UTC (rev 6250)
+++ pve-manager/pve2/lib/PVE/API2/Network.pm	2011-07-07 08:16:51 UTC (rev 6251)
@@ -87,6 +87,11 @@
     	additionalProperties => 0,
 	properties => {
 	    node => get_standard_option('pve-node'),
+	    type => {
+		description => "Only list specific interface types.",
+		type => 'string',
+		enum => ['bond', 'bridge', 'alias', 'eth'],
+	    },
 	},
     },
     returns => {
@@ -104,6 +109,12 @@
 
 	delete $config->{lo}; # do not list the loopback device
 
+	if ($param->{type}) {
+	    foreach my $k (keys %$config) {
+		delete $config->{$k} if $param->{type} ne $config->{$k}->{type};
+	    }
+	}
+
 	return PVE::RESTHandler::hash_to_array($config, 'iface');
    }});
 

Modified: pve-manager/pve2/www/manager/Makefile.am
===================================================================
--- pve-manager/pve2/www/manager/Makefile.am	2011-07-07 04:36:04 UTC (rev 6250)
+++ pve-manager/pve2/www/manager/Makefile.am	2011-07-07 08:16:51 UTC (rev 6251)
@@ -27,6 +27,7 @@
 	form/NodeSelector.js				\
 	form/FileSelector.js				\
 	form/StorageSelector.js				\
+	form/BridgeSelector.js				\
 	form/CPUModelSelector.js			\
 	form/VNCKeyboardSelector.js			\
 	form/DisplaySelector.js				\

Added: pve-manager/pve2/www/manager/form/BridgeSelector.js
===================================================================
--- pve-manager/pve2/www/manager/form/BridgeSelector.js	                        (rev 0)
+++ pve-manager/pve2/www/manager/form/BridgeSelector.js	2011-07-07 08:16:51 UTC (rev 6251)
@@ -0,0 +1,64 @@
+Ext.define('PVE.form.BridgeSelector', {
+    extend: 'PVE.form.ComboGrid',
+    requires: [
+	'Ext.data.Store', 
+	'PVE.RestProxy'
+    ],
+    alias: ['widget.PVE.form.BridgeSelector'],
+
+    setNodename: function(nodename) {
+	var me = this;
+
+	if (!nodename || (me.nodename === nodename))
+	    return;
+
+	me.nodename = nodename;
+
+	me.store.setProxy({
+	    type: 'pve',
+	    url: '/api2/json/nodes/' + me.nodename + '/network?type=bridge'
+	});
+
+	me.store.load();
+    },
+
+    initComponent: function() {
+	var me = this;
+
+	var nodename = me.nodename;
+	me.nodename = undefined; 
+
+	var store = Ext.create('Ext.data.Store', {
+	    fields: [ 'iface', 'active', 'type' ],
+	    filterOnLoad: true
+	});
+
+	Ext.apply(me, {
+	    store: store,
+	    valueField: 'iface',
+	    displayField: 'iface',
+            listConfig: {
+		columns: [
+		    {
+			header: 'Bridge',
+			dataIndex: 'iface',
+			hideable: false,
+			flex: 1
+		    },
+		    {
+			header: 'Active',  
+			width: 60, 
+			dataIndex: 'active', 
+			renderer: PVE.Utils.format_boolean
+		    }
+		]
+	    }
+ 	});
+
+        me.callParent();
+
+	if (nodename)
+	    me.setNodename(nodename);
+    }
+});
+

Modified: pve-manager/pve2/www/manager/form/StorageSelector.js
===================================================================
--- pve-manager/pve2/www/manager/form/StorageSelector.js	2011-07-07 04:36:04 UTC (rev 6250)
+++ pve-manager/pve2/www/manager/form/StorageSelector.js	2011-07-07 08:16:51 UTC (rev 6251)
@@ -33,8 +33,7 @@
 	me.nodename = undefined; 
 
 	var store = Ext.create('Ext.data.Store', {
-	    fields: [ 'storage', 'active', 'type', 'used', 'total' ],
-	    autoDestory: true
+	    fields: [ 'storage', 'active', 'type', 'used', 'total' ]
 	});
 
 	Ext.apply(me, {

Modified: pve-manager/pve2/www/manager/qemu/CreateWizard.js
===================================================================
--- pve-manager/pve2/www/manager/qemu/CreateWizard.js	2011-07-07 04:36:04 UTC (rev 6250)
+++ pve-manager/pve2/www/manager/qemu/CreateWizard.js	2011-07-07 08:16:51 UTC (rev 6251)
@@ -49,6 +49,14 @@
 	    allowBlank: false
 	});
 
+	var bridgesel = Ext.create('PVE.form.BridgeSelector', {
+	    name: 'bridge',
+	    value: 'vmbr0',
+	    fieldLabel: 'Bridge',
+	    labelAlign: 'right',
+	    allowBlank: false
+	});
+
 	Ext.applyIf(me, {
 	    title: 'Create new virtual machine',
 	    items: [
@@ -63,6 +71,7 @@
 			    allowBlank: false,
 			    listeners: {
 				change: function(f, value) {
+				    bridgesel.setNodename(value);
 				    hdstoragesel.setNodename(value);
 				    cdstoragesel.setNodename(value);
 				    cdfilesel.setStorage(undefined, value);
@@ -98,74 +107,71 @@
 		},
 		{
 		    title: 'OS Type',
-		    layout: 'fit',
-		    items: {
-			xtype: 'radiogroup',
-			allowBlank: false,
-			layout: 'column',
-			defaultType: 'container',
-			items: [{
-			    columnWidth: .5,
-			    items: [
-				{
-				    xtype: 'component', 
-				    html: 'Microsoft Windows', 
-				    cls:'x-form-check-group-label'
-				},
-				{
-				    xtype: 'radiofield',
-				    name: 'ostype',
-				    inputValue: 'win7',
-				    boxLabel: 'Microsoft Windows 7/2008r2'
-				},
-				{
-				    xtype: 'radiofield',
-				    name: 'ostype',
-				    inputValue: 'w2k8',
-				    boxLabel: 'Microsoft Windows Vista/2008'
-				},
-				{
-				    xtype: 'radiofield',
-				    name: 'ostype',
-				    inputValue: 'wxp',
-				    boxLabel: 'Microsoft Windows XP/2003'
-				},
-				{
-				    xtype: 'radiofield',
-				    name: 'ostype',
-				    inputValue: 'w2k',
-				    boxLabel: 'Microsoft Windows 2000'
-				}
-			    ]
-			},{
-			    columnWidth: .5,
-			    items: [
-				{
-				    xtype: 'component', 
-				    html: 'Linux/Other', 
-				    cls:'x-form-check-group-label'
-				},
-				{
-				    xtype: 'radiofield',
-				    name: 'ostype',
-				    inputValue: 'l26',
-				    boxLabel: 'Linux 2.6 Kernel'
-				},
-				{
-				    xtype: 'radiofield',
-				    name: 'ostype',
-				    inputValue: 'l24',
-				    boxLabel: 'Linux 2.4 Kernel'
-				},
-				{
-				    xtype: 'radiofield',
-				    name: 'ostype',
-				    inputValue: 'other',
-				    boxLabel: 'Other'
-				}
-			    ]
-			}]
-		    }
+		    xtype: 'radiogroup',
+		    allowBlank: false,
+		    layout: 'column',
+		    defaultType: 'container',
+		    items: [{
+			columnWidth: .5,
+			items: [
+			    {
+				xtype: 'component', 
+				html: 'Microsoft Windows', 
+				cls:'x-form-check-group-label'
+			    },
+			    {
+				xtype: 'radiofield',
+				name: 'ostype',
+				inputValue: 'win7',
+				boxLabel: 'Microsoft Windows 7/2008r2'
+			    },
+			    {
+				xtype: 'radiofield',
+				name: 'ostype',
+				inputValue: 'w2k8',
+				boxLabel: 'Microsoft Windows Vista/2008'
+			    },
+			    {
+				xtype: 'radiofield',
+				name: 'ostype',
+				inputValue: 'wxp',
+				boxLabel: 'Microsoft Windows XP/2003'
+			    },
+			    {
+				xtype: 'radiofield',
+				name: 'ostype',
+				inputValue: 'w2k',
+				boxLabel: 'Microsoft Windows 2000'
+			    }
+			]
+		    },{
+			columnWidth: .5,
+			items: [
+			    {
+				xtype: 'component', 
+				html: 'Linux/Other', 
+				cls:'x-form-check-group-label'
+			    },
+			    {
+				xtype: 'radiofield',
+				name: 'ostype',
+				inputValue: 'l26',
+				boxLabel: 'Linux 2.6 Kernel'
+			    },
+			    {
+				xtype: 'radiofield',
+				name: 'ostype',
+				inputValue: 'l24',
+				boxLabel: 'Linux 2.4 Kernel'
+			    },
+			    {
+				xtype: 'radiofield',
+				name: 'ostype',
+				inputValue: 'other',
+				boxLabel: 'Other'
+			    }
+			]
+		    }]
 		},
 		{
 		    xtype: 'inputpanel',
@@ -181,6 +187,7 @@
 				change: function(f, value) {
 				    me.down('field[name=cdstorage]').setDisabled(!value);
 				    me.down('field[name=cdimage]').setDisabled(!value);
+				    me.down('field[name=cdimage]').validate();
 				}
 			    }
 			},
@@ -226,6 +233,14 @@
 				}
 			    }
 			},
+			{
+			    xtype: 'PVE.form.BusTypeSelector',
+			    name: 'controller',
+			    labelAlign: 'right',
+			    fieldLabel: 'Controller',
+			    value: 'ide',
+			    allowBlank: false
+			},
 			hdstoragesel,
 			{
 			    xtype: 'numberfield',
@@ -238,14 +253,6 @@
 			    allowBlank: false
 			},
 			{
-			    xtype: 'PVE.form.BusTypeSelector',
-			    name: 'controller',
-			    labelAlign: 'right',
-			    fieldLabel: 'Controller',
-			    value: 'ide',
-			    allowBlank: false
-			},
-			{
 			    xtype: 'PVE.form.DiskFormatSelector',
 			    name: 'diskformat',
 			    labelAlign: 'right',
@@ -274,8 +281,9 @@
 		    }
 		},	
 		{
+		    xtype: 'inputpanel',
 		    title: 'CPU',
-		    items: [
+		    column1: [
 			{
 			    xtype: 'numberfield',
 			    name: 'sockets',
@@ -307,7 +315,9 @@
 				    me.down('field[name=totalcores]').setValue(sockets*cores);
 				}
 			    }
-			},
+			}
+		    ],
+		    column2: [
 			{
 			    xtype: 'displayfield',
 			    fieldLabel: 'Total cores',
@@ -317,6 +327,7 @@
 		    ]
 		},
 		{
+		    xtype: 'inputpanel',
 		    title: 'Memory',
 		    items: [
 			{
@@ -334,15 +345,41 @@
 		{
 		    xtype: 'inputpanel',
 		    title: 'Network',
-		    items: [
+		    column1: [
 			{
-			    xtype: 'textfield',
-			    name: 'bridge',
-			    value: 'vmbr0',
-			    fieldLabel: 'Bridge',
-			    allowBlank: false
+			    xtype: 'radiofield',
+			    name: 'networkmode',
+			    height: 22, // hack: set same height as text fields
+			    inputValue: 'bridge',
+			    boxLabel: 'Bridged mode',
+			    checked: true,
+			    listeners: {
+				change: function(f, value) {
+				    if (!me.rendered)
+					return;
+				    me.down('field[name=bridge]').setDisabled(!value);
+				    me.down('field[name=bridge]').validate();
+				}
+			    }
 			},
+			bridgesel,
 			{
+			    xtype: 'radiofield',
+			    name: 'networkmode',
+			    height: 22, // hack: set same height as text fields
+			    inputValue: 'nat',
+			    boxLabel: 'NAT mode'
+			},
+			{
+			    xtype: 'radiofield',
+			    name: 'networkmode',
+			    height: 22, // hack: set same height as text fields
+			    inputValue: 'none',
+			    boxLabel: 'No network device'
+			}
+		    ],
+		    column2: [
+			{
 			    xtype: 'PVE.form.NetworkCardSelector',
 			    name: 'netcard',
 			    fieldLabel: 'Network card',
@@ -357,12 +394,18 @@
 			    emptyText: 'auto'
 			}
 		    ],
+
 		    onGetValues: function(values) {
+			if (values.networkmode === 'none')
+			    return {};
+
 			var str = values.netcard;
 			if (values.mac)
 			    str += '=' + values.mac;
-			str += ',bridge=' + values.bridge;
 
+			if (values.networkmode === 'bridge')
+			    str += ',bridge=' + values.bridge;
+
 			return { net0: str };
 		    }
 		},

Modified: pve-manager/pve2/www/manager/qemu/HardwareView.js
===================================================================
--- pve-manager/pve2/www/manager/qemu/HardwareView.js	2011-07-07 04:36:04 UTC (rev 6250)
+++ pve-manager/pve2/www/manager/qemu/HardwareView.js	2011-07-07 08:16:51 UTC (rev 6251)
@@ -177,10 +177,11 @@
 		}
 	    },
 	    {
-		xtype: 'textfield',
+		xtype: 'PVE.form.BridgeSelector',
 		name: 'bridge',
-		value: 'vmbr0',
 		fieldLabel: 'Bridge',
+		nodename: nodename,
+		autoSelect: true,
 		labelAlign: 'right',
 		allowBlank: false
 	    },

Modified: pve-manager/pve2/www/manager/window/Edit.js
===================================================================
--- pve-manager/pve2/www/manager/window/Edit.js	2011-07-07 04:36:04 UTC (rev 6250)
+++ pve-manager/pve2/www/manager/window/Edit.js	2011-07-07 08:16:51 UTC (rev 6251)
@@ -71,7 +71,6 @@
 	    items = [
 		{
 		    columnWidth: 1,
-		    padding: 5,
 		    layout: 'anchor',
 		    items: me.items
 		}

Modified: pve-manager/pve2/www/manager/window/Wizard.js
===================================================================
--- pve-manager/pve2/www/manager/window/Wizard.js	2011-07-07 04:36:04 UTC (rev 6250)
+++ pve-manager/pve2/www/manager/window/Wizard.js	2011-07-07 08:16:51 UTC (rev 6251)
@@ -28,7 +28,40 @@
     initComponent: function() {
 	var me = this;
 
-	Ext.applyIf(me, {
+	var items;
+	
+	if (me.items) {
+	    items = [
+		{
+		    columnWidth: 0.5,
+		    layout: 'anchor',
+		    items: me.items
+		}
+	    ];
+	    me.items = undefined;
+	} else if (me.column1 && me.column2) {
+	    items = [
+		{
+		    columnWidth: 0.5,
+		    padding: '0 10 0 0',
+		    layout: 'anchor',
+		    items: me.column1
+		},
+		{
+		    columnWidth: 0.5,
+		    padding: '0 0 0 10',
+		    layout: 'anchor',
+		    items: me.column2
+		}
+	    ];
+	} else {
+	    throw "unsupported config"
+	}
+
+	Ext.apply(me, {
+	    layout: 'column',
+	    defaultType: 'container',
+	    items: items
 	});
 
 	me.callParent();
@@ -200,7 +233,7 @@
 	};
 
 	Ext.applyIf(me, {
-	    width: 600,
+	    width: 620,
 	    height: 400,
 	    modal: true,
 	    border: false,
@@ -228,16 +261,13 @@
 		    margins: '5 5 0 5',
 		    fieldDefaults: {
 			labelWidth: 100,
-			width: 300
+			anchor: '100%'
 		    },
 		    items: {
 			itemId: 'wizcontent',
 			xtype: 'tabpanel',
 			activeItem: 0,
 			bodyPadding: 10,
-			defaults: {
-			    layout: 'vbox'
-			},
  			listeners: {
 			    afterrender: function(tp) {
 				var atab = this.getActiveTab();



More information about the pve-devel mailing list