[pve-devel] [PATCH proxmox-widget-toolkit] add vlan interface support

[Alexandre DERUMIER]

Any comment about this patch ?

----- Mail original -----
De: "aderumier" <aderumier at odiso.com>
À: "pve-devel" <pve-devel at pve.proxmox.com>
Cc: "aderumier" <aderumier at odiso.com>
Envoyé: Mardi 28 Janvier 2020 11:24:45
Objet: [PATCH proxmox-widget-toolkit] add vlan interface support

vlan-raw-device && vlan-id field are only 
enabled if interface name is different than interfaceX.Y 

I have added a listener on iface, 
to enable them live if user want a custom name for vlan interface 

Signed-off-by: Alexandre Derumier <aderumier at odiso.com> 
--- 
Toolkit.js | 8 ++++++ 
Utils.js | 2 ++ 
node/NetworkEdit.js | 67 +++++++++++++++++++++++++++++++++++++++++++-- 
node/NetworkView.js | 17 +++++++++++- 
4 files changed, 90 insertions(+), 4 deletions(-) 

diff --git a/Toolkit.js b/Toolkit.js 
index 538db3a..d837890 100644 
--- a/Toolkit.js 
+++ b/Toolkit.js 
@@ -83,6 +83,14 @@ Ext.apply(Ext.form.field.VTypes, { 
BridgeName: function(v) { 
return (/^vmbr\d{1,4}$/).test(v); 
}, 
+ VlanName: function(v) { 
+ if (Proxmox.Utils.VlanInterface_match.test(v)) { 
+ return true; 
+ } else if (Proxmox.Utils.Vlan_match.test(v)) { 
+ return true; 
+ } 
+ return true; 
+ }, 
BridgeNameText: gettext('Format') + ': vmbr<b>N</b>, where 0 <= <b>N</b> <= 9999', 

BondName: function(v) { 
diff --git a/Utils.js b/Utils.js 
index 6d1b24c..e9dcd79 100644 
--- a/Utils.js 
+++ b/Utils.js 
@@ -696,5 +696,7 @@ Ext.define('Proxmox.Utils', { utilities: { 
me.HostPort_match = new RegExp("^(" + IPV4_REGEXP + "|" + DnsName_REGEXP + ")(:\\d+)?$"); 
me.HostPortBrackets_match = new RegExp("^\\[(?:" + IPV6_REGEXP + "|" + IPV4_REGEXP + "|" + DnsName_REGEXP + ")\\](:\\d+)?$"); 
me.IP6_dotnotation_match = new RegExp("^" + IPV6_REGEXP + "(\\.\\d+)?$"); 
+ me.Vlan_match = new RegExp('^vlan(\\d+)'); 
+ me.VlanInterface_match = new RegExp('(\\w+)\\.(\\d+)'); 
} 
}); 
diff --git a/node/NetworkEdit.js b/node/NetworkEdit.js 
index ce7e7ae..33fee75 100644 
--- a/node/NetworkEdit.js 
+++ b/node/NetworkEdit.js 
@@ -23,8 +23,8 @@ Ext.define('Proxmox.node.NetworkEdit', { 
iface_vtype = 'BondName'; 
} else if (me.iftype === 'eth' && !me.isCreate) { 
iface_vtype = 'InterfaceName'; 
- } else if (me.iftype === 'vlan' && !me.isCreate) { 
- iface_vtype = 'InterfaceName'; 
+ } else if (me.iftype === 'vlan') { 
+ iface_vtype = 'VlanName'; 
} else if (me.iftype === 'OVSBridge') { 
iface_vtype = 'BridgeName'; 
} else if (me.iftype === 'OVSBond') { 
@@ -96,6 +96,49 @@ Ext.define('Proxmox.node.NetworkEdit', { 
fieldLabel: gettext('OVS options'), 
name: 'ovs_options' 
}); 
+ } else if (me.iftype === 'vlan') { 
+ 
+ if(!me.isCreate) { 
+ 
+ me.disablevlanid = false; 
+ me.disablevlanrawdevice = false; 
+ me.vlanrawdevicevalue = ''; 
+ me.vlanidvalue = ''; 
+ 
+ if (Proxmox.Utils.VlanInterface_match.test(me.iface)) { 
+ me.disablevlanid = true; 
+ me.disablevlanrawdevice = true; 
+ var arr = Proxmox.Utils.VlanInterface_match.exec(me.iface); 
+ me.vlanrawdevicevalue = arr[1]; 
+ me.vlanidvalue = arr[2]; 
+ 
+ } else if (Proxmox.Utils.Vlan_match.test(me.iface)) { 
+ me.disablevlanid = true; 
+ var arr = Proxmox.Utils.Vlan_match.exec(me.iface); 
+ me.vlanidvalue = arr[1]; 
+ } 
+ } else { 
+ 
+ me.disablevlanid = true; 
+ me.disablevlanrawdevice = true; 
+ } 
+ 
+ column2.push({ 
+ xtype: 'textfield', 
+ fieldLabel: gettext('Vlan raw device'), 
+ name: 'vlan-raw-device', 
+ value: me.vlanrawdevicevalue, 
+ disabled: me.disablevlanrawdevice 
+ }); 
+ 
+ column2.push({ 
+ xtype: 'pveVlanField', 
+ name: 'vlan-id', 
+ value: me.vlanidvalue, 
+ disabled: me.disablevlanid 
+ 
+ }); 
+ 
} else if (me.iftype === 'bond') { 
column2.push({ 
xtype: 'textfield', 
@@ -200,7 +243,25 @@ Ext.define('Proxmox.node.NetworkEdit', { 
name: 'iface', 
value: me.iface, 
vtype: iface_vtype, 
- allowBlank: false 
+ allowBlank: false, 
+ listeners: { 
+ change: function(f, value) { 
+ if (me.isCreate && iface_vtype === 'VlanName') { 
+ var vlanidField = me.down('field[name=vlan-id]'); 
+ var vlanrawdeviceField = me.down('field[name=vlan-raw-device]'); 
+ if (Proxmox.Utils.VlanInterface_match.test(value)) { 
+ vlanidField.setDisabled(true); 
+ vlanrawdeviceField.setDisabled(true); 
+ } else if (Proxmox.Utils.Vlan_match.test(value)) { 
+ vlanidField.setDisabled(true); 
+ vlanrawdeviceField.setDisabled(false); 
+ } else { 
+ vlanidField.setDisabled(false); 
+ vlanrawdeviceField.setDisabled(false); 
+ } 
+ } 
+ } 
+ } 
} 
]; 

diff --git a/node/NetworkView.js b/node/NetworkView.js 
index 9b3845d..92d7eb8 100644 
--- a/node/NetworkView.js 
+++ b/node/NetworkView.js 
@@ -18,7 +18,7 @@ Ext.define('Proxmox.node.NetworkView', { 

// defines what types of network devices we want to create 
// order is always the same 
- types: ['bridge', 'bond', 'ovs'], 
+ types: ['bridge', 'bond', 'vlan', 'ovs'], 

showApplyBtn: false, 

@@ -216,6 +216,21 @@ Ext.define('Proxmox.node.NetworkView', { 
}); 
} 

+ if (me.types.indexOf('vlan') !== -1) { 
+ menu_items.push({ 
+ text: Proxmox.Utils.render_network_iface_type('vlan'), 
+ handler: function() { 
+ var win = Ext.create('Proxmox.node.NetworkEdit', { 
+ nodename: me.nodename, 
+ iftype: 'vlan', 
+ iface_default: 'interfaceX.1' 
+ }); 
+ win.on('destroy', reload); 
+ win.show(); 
+ } 
+ }); 
+ } 
+ 
if (me.types.indexOf('ovs') !== -1) { 
if (menu_items.length > 0) { 
menu_items.push({ xtype: 'menuseparator' }); 
-- 
2.20.1