Merge pull request #23 from bergware/master

Enhanced network settings - allow multiple interfaces in bridge
2026-01-17 15:10:02 -06:00 · 2016-06-05 12:31:31 -07:00
parent b60a878ca5 b1d2169a08
commit 36ec2bcfdf
4 changed files with 304 additions and 98 deletions
--- a/plugins/dynamix/Eth0.page
+++ b/plugins/dynamix/Eth0.page
@@ -53,7 +53,7 @@ $vlan_eth0 = [0];
 if (isset($eth0)) foreach ($eth0 as $key => $val) if (substr($key,0,6)=='VLANID') $vlan_eth0[] = substr($key,7);
 ?>
 <style>
-span.pin{margin:0;padding:0;font-size:16px;cursor:pointer;}
+span.pin i{font-size:16px;cursor:pointer;}
 span.no-int{color:#E68A00;}
 div.shade-white{background-color:#F8F8F8;}
 div.shade-black{background-color:#0C0C0C;}
@@ -65,8 +65,7 @@ refresh(); // automatically include new ethernet ports
 Array.prototype.dups = function(){return this.sort().filter(function(v,i,o){return i&&v===o[i-1]?v:0;}).length;}

 function prepareSettings(form) {
-  var bonding = form.BONDING !== undefined;
-  if (bonding) {
+  if (form.BONDING !== undefined) {
    var member = '';
    for (var i=0,item; item=form.BONDNICS.options[i]; i++) {
      if (item.selected) {
@@ -79,8 +78,19 @@ function prepareSettings(form) {
    item.value = member;
    item.selected = true;
    item.disabled = false;
-    form.BONDNICS.disabled = false;
-    if (form.BONDING.value=='yes') form.BRNICS.value = form.BONDNAME.value;
+    var member = '';
+    for (var i=0,item; item=form.BRNICS.options[i]; i++) {
+      if (item.selected) {
+        if (member.length) member += ',';
+        member += item.value;
+        item.selected = false;
+      }
+    }
+    item = form.BRNICS.options[0];
+    item.value = form.BONDING.value=='yes' ? form.BONDNAME.value : member;
+    item.selected = true;
+    item.disabled = false;
+    if (member.indexOf(',')>0) form.BRSTP.value = 'yes';
  }
  if (form.TYPE.value == 'access') {
    $(form).find('input[name^="VLANID:"]').prop('disabled',true);
@@ -143,13 +153,27 @@ function checkDNSSettings(form) {
 function checkBondingSettings(form,ctrl) {
  var disabled = form.BONDING.value=='no';
  var mode = form.BONDING_MODE.value;
-  if (ctrl) {
-    form.BONDING_MODE.disabled = disabled;
-    form.BONDNICS.disabled = disabled;
-    $('#bond0').dropdownchecklist(disabled?'disable':'enable');
+  if (ctrl>=0) {
+    var me = ctrl==0 ? null : 'slow';
+    if (disabled) {
+      $('#bond-members').hide(me);
+    } else {
+      $('#bond-members').show(me);
+      $('#bond0').dropdownchecklist('destroy').dropdownchecklist({emptyText:'None', width:131});
+    }
+    if (ctrl==1) checkBridgingSettings(form,1);
  }
  if (mode==1 || mode>4 || disabled) {$('#attention0').hide();} else {$('#attention0').show();}
 }
+function checkBridgingSettings(form,ctrl) {
+  var me = ctrl==0 ? null : 'slow';
+  if (form.BRIDGING.value=='yes' && form.BONDING.value=='no') {
+    $('#bridge-members').show(me);
+    $('#bridge0').dropdownchecklist('destroy').dropdownchecklist({emptyText:'None', width:131});
+  } else {
+    $('#bridge-members').hide(me);
+  }
+}
 function checkNetworkAccess(form,port) {
  if (form.TYPE.value=='access') {
    $('.access-'+port).hide();
@@ -190,23 +214,26 @@ function exitCode(form,key) {
  }
 }
 $(function() {
+  var ctrl = "<span id='wait_eth0' class='status red' style='display:none;font-size:small;font-style:italic'>Please wait... configuring interfaces</span>";
  var form = document.eth0_settings;
-<?if ($tabbed && !$disabled):?>
-  $('#tab1').bind({click:function(){
-    $('#bond0').dropdownchecklist('destroy').dropdownchecklist({emptyText:'None', width:131});
-    checkBondingSettings(form,true);
-  }});
-<?endif;?>
  $('#bond0').dropdownchecklist({emptyText:'None', width:130});
-  checkBondingSettings(form,true);
+  $('#bridge0').dropdownchecklist({emptyText:'None', width:130});
+  checkBondingSettings(form,0);
+  checkBridgingSettings(form,0);
  checkNetworkAccess(form,'eth0');
  checkNetworkSettings(form);
 <?if ($disabled):?>
  disableForm(form);
  $('#bond0').dropdownchecklist('disable');
+  $('#bridge0').dropdownchecklist('disable');
 <?else:?>
  checkDNSSettings(form);
 <?endif;?>
+<?if ($tabbed):?>
+  $('.tabs').append(ctrl);
+<?else:?>
+  $('div[id=title]').append(ctrl);
+<?endif;?>
 });
 </script>
 <form markdown="1" name="eth0_settings" method="POST" action="/update.php" target="progressFrame" onchange="exitCode(this,false)" onsubmit="return prepareSettings(this)">
@@ -218,7 +245,6 @@ $(function() {
 <input type="hidden" name="BONDNAME" value="bond0">
 <input type="hidden" name="BONDING_MIIMON" value="100">
 <input type="hidden" name="BRNAME" value="">
-<input type="hidden" name="BRNICS" value="eth0">
 <input type="hidden" name="BRSTP" value="no">
 <input type="hidden" name="BRFD" value="0">
 <?foreach ($vlan_eth0 as $i):?>
@@ -231,7 +257,7 @@ MAC address:
 > When tagging is enabled all VLANs on this interface will share the same hardware address.

 Enable bonding:
-: <select name="BONDING" size="1" onchange="checkBondingSettings(this.form,true)">
+: <select name="BONDING" size="1" onchange="checkBondingSettings(this.form,1)">
  <?=mk_option($eth0['BONDING'], "no", "No");?>
  <?=mk_option($eth0['BONDING'], "yes", "Yes");?>
  </select>
@@ -240,8 +266,9 @@ Enable bonding:
 > This can be used to improve the connection redundancy and/or throughput of the system.
 > Different bonding modes are supported (see below), but some modes require proper switch support.

+<div id="bond-members" style="display:none" markdown="1">
 Bonding mode:
-: <select name="BONDING_MODE" size="1" onchange="checkBondingSettings(this.form,false)">
+: <select name="BONDING_MODE" size="1" onchange="checkBondingSettings(this.form,-1)">
  <?=mk_option($eth0['BONDING_MODE'], "0", "balance-rr (0)");?>
  <?=mk_option($eth0['BONDING_MODE'], "1", "active-backup (1)",isset($eth0['BONDING_MODE'])?'':'selected');?>
  <?=mk_option($eth0['BONDING_MODE'], "2", "balance-xor (2)");?>
@@ -249,7 +276,8 @@ Bonding mode:
  <?=mk_option($eth0['BONDING_MODE'], "4", "802.3ad (4)");?>
  <?=mk_option($eth0['BONDING_MODE'], "5", "balance-tlb (5)");?>
  <?=mk_option($eth0['BONDING_MODE'], "6", "balance-alb (6)");?>
-  </select><span id="attention0" style="display:none"><b>Attention:</b> this mode requires a network switch with proper setup and support...</span>
+  </select>
+  <span id="attention0" style="display:none"><b>Attention:</b> this mode requires a network switch with proper setup and support...</span>

 > Mode 1 (active-backup) is the recommended default. Other modes allow you to set up a specific environment, but may require proper switch support.
 > Choosing a unsupported mode can result in a disrupted communication. Use with caution.
@@ -264,8 +292,9 @@ Bonding members:

 > Select which interfaces are member of the *bonded* interface. By default eth0 is a member, while other interfaces are optional.

+</div>
 Enable bridging:
-: <select name="BRIDGING" size="1">
+: <select name="BRIDGING" size="1" onchange="checkBridgingSettings(this.form,1)">
  <?=mk_option($eth0['BRIDGING'], "no", "No");?>
  <?=mk_option($eth0['BRIDGING'], "yes", "Yes");?>
  </select>
@@ -273,17 +302,108 @@ Enable bridging:
 > Bridging is a feature which creates a virtual bridge and allows VMs to communicate directly with the physical Ethernet port.
 > Both bonding and bridging can be combined to let VMs communicate over a *bonded* interface.

-Type of access:
+<div id="bridge-members" style="display:none" markdown="1">
+Bridging members:
+: <select id="bridge0" name="BRNICS" size="1" multiple="multiple" style="display:none">
+  <?=mk_option($eth0['BRNICS'],'eth0','Eth0','selected disabled')?>
+  <?foreach ($ports as $port):?>
+  <?=mk_option_check($eth0['BRNICS'],strtolower($port),$port)?>
+  <?endforeach;?>
+  </select>
+
+> Select which interfaces are member of the *bridged* interface. By default eth0 is a member, while other interfaces are optional.
+
+</div>
+Interface description:
+: <input type="text" name="DESCRIPTION:<?=$i?>" maxlength="40" value="<?=$eth0["DESCRIPTION:$i"]?>" onchange="exitCode(this.form,true)">
+
+> Use this optional field to provide addditional information about the purpose of the connection.
+
+IP address assignment:
+: <select name="USE_DHCP:<?=$i?>" size="1" onchange="checkNetworkSettings(this.form,<?=$i?>)">
+  <?=mk_option($eth0["USE_DHCP:$i"], 'yes', 'Automatic');?>
+  <?=mk_option($eth0["USE_DHCP:$i"], 'no', 'Static');?>
+  </select>
+
+> The following settings are possible:
+>
+> *Automatic* - the server will attempt to obtain its IP address from the local DHCP server<br>
+> *Static* - the IP address is manually set for this interface<br>
+> *None* - no IP address is assigned to the interface (only available for VLANs)
+
+IP address:
+: <input type="text" name="IPADDR:<?=$i?>" maxlength="40" value="<?=$eth0["IPADDR:$i"]?>" class="narrow" pattern="<?=$validIP?>" title="IP address A.B.C.D">
+
+> Greyed out when using DHCP server. Otherwise specify here the IP address of the system.
+
+Network mask:
+: <select name="NETMASK:<?=$i?>" size="1">
+  <?=mk_option($eth0["NETMASK:$i"], "255.255.0.0", "255.255.0.0");?>
+  <?=mk_option($eth0["NETMASK:$i"], "255.255.252.0", "255.255.252.0");?>
+  <?=mk_option($eth0["NETMASK:$i"], "255.255.254.0", "255.255.254.0");?>
+  <?=mk_option($eth0["NETMASK:$i"], "255.255.255.0", "255.255.255.0");?>
+  <?=mk_option($eth0["NETMASK:$i"], "255.255.255.128", "255.255.255.128");?>
+  <?=mk_option($eth0["NETMASK:$i"], "255.255.255.192", "255.255.255.192");?>
+  <?=mk_option($eth0["NETMASK:$i"], "255.255.255.224", "255.255.255.224");?>
+  <?=mk_option($eth0["NETMASK:$i"], "255.255.255.240", "255.255.255.240");?>
+  <?=mk_option($eth0["NETMASK:$i"], "255.255.255.248", "255.255.255.248");?>
+  <?=mk_option($eth0["NETMASK:$i"], "255.255.255.252", "255.255.255.252");?>
+  </select>
+
+> Greyed out when using DHCP server. Otherwise specify here the associated network mask, by default 255.255.255.0 is selected.
+
+Default gateway:
+: <input type="text" name="GATEWAY" maxlength="40" value="<?=$eth0['GATEWAY']?>" class="narrow" pattern="<?=$validIP?>" title="IP address A.B.C.D">
+
+> Greyed out when using DHCP server. Otherwise specify here the IP address of your router.
+
+DNS server assignment:
+: <select name="DHCP_KEEPRESOLV" size="1" onchange="checkDNSSettings(this.form)">
+  <?=mk_option($eth0['DHCP_KEEPRESOLV'], "no", "Automatic");?>
+  <?=mk_option($eth0['DHCP_KEEPRESOLV'], "yes", "Static");?>
+  </select>
+
+> If set to *Automatic* the server will use DNS server IP address returned by the local DHCP server.<br>
+> If set to *Static* you may enter your own list.
+>
+> This is useful in Active Directory configurations where you need to set the first DNS Server entry to the IP address of your AD Domain server.
+
+DNS server 1:
+: <input type="text" name="DNS_SERVER1" maxlength="80" value="<?=$eth0['DNS_SERVER1'];?>" class="narrow" pattern="<?=$validIP?>" title="IP address A.B.C.D">
+
+> This is the primary DNS server to use. Enter a FQDN or an IP address.
+>
+> Note: for *Active Directory* you **must** ensure this is set to the IP address of your AD Domain server.
+
+DNS server 2:
+: <input type="text" name="DNS_SERVER2" maxlength="80" value="<?=$eth0['DNS_SERVER2'];?>" class="narrow" pattern="<?=$validIP?>" title="IP address A.B.C.D">
+
+> This is the DNS server to use when DNS Server 1 is down.
+
+DNS server 3:
+: <input type="text" name="DNS_SERVER3" maxlength="80" value="<?=$eth0['DNS_SERVER3'];?>" class="narrow" pattern="<?=$validIP?>" title="IP address A.B.C.D">
+
+> This is the DNS server to use when DNS Servers 1 and 2 are both down.
+
+Desired MTU:
+: <input type="number" name="MTU" min="68" max="9198" value="<?=$eth0['MTU']?>" class="narrow">
+
+> This is the MTU size to use on the physical Ethernet interface.
+> If left blank, the MTU will automatically be determined (by default 1500 bytes).
+
+Enable VLANs:
 : <select name="TYPE" size="1" onchange="checkNetworkAccess(this.form,'eth0')">
-  <?=mk_option($eth0['TYPE'], 'access', 'Untagged');?>
-  <?=mk_option($eth0['TYPE'], 'trunk', 'Tagged');?>
-  </select><span class="access-eth0 pin" title="Add VLAN" style="display:none" onclick="addVLAN('eth0',<?=$disabled?'true':'false'?>)"><i class="fa fa-plus-circle green"></i></span>
+  <?=mk_option($eth0['TYPE'], 'access', 'No');?>
+  <?=mk_option($eth0['TYPE'], 'trunk', 'Yes');?>
+  </select>
+  <span class="access-eth0 pin" title="Add VLAN" style="display:none" onclick="addVLAN('eth0',<?=$disabled?'true':'false'?>)"><i class="fa fa-plus-circle green"></i><em>press to add VLAN</em></span>
 <?else:?>
 <div class="access-eth0 shade-<?=$display['theme']?>" style="display:none" markdown="1">
 VLAN number:
 : <input type="number" name="VLANID:<?=$i?>" min="1" max="4095" value="<?=$eth0["VLANID:$i"]?>" class="narrow" required>
-  <span class="pin" title="Remove VLAN" onclick="removeVLAN($('#index-eth0-<?=$i?>'),<?=$disabled?'true':'false'?>)"><i class="fa fa-minus-circle red"></i></span>
-<?endif;?>
+  <span class="pin" title="Remove VLAN" onclick="removeVLAN($('#index-eth0-<?=$i?>'),<?=$disabled?'true':'false'?>)"><i class="fa fa-minus-circle red"></i><em>press to remove VLAN</em></span>
+
+> Give each VLAN a unique identifier. Numbers range from 1 to 4095.

 Interface description:
 : <input type="text" name="DESCRIPTION:<?=$i?>" maxlength="40" value="<?=$eth0["DESCRIPTION:$i"]?>" onchange="exitCode(this.form,true)">
@@ -326,47 +446,6 @@ Network mask:

 > Greyed out when using DHCP server. Otherwise specify here the associated network mask, by default 255.255.255.0 is selected.

-<?if ($i==0):?>
-Default gateway:
-: <input type="text" name="GATEWAY" maxlength="40" value="<?=$eth0['GATEWAY']?>" class="narrow" pattern="<?=$validIP?>" title="IP address A.B.C.D">
-
-> Greyed out when using DHCP server. Otherwise specify here the IP address of your router.
-
-DNS server assignment:
-: <select name="DHCP_KEEPRESOLV" size="1" onchange="checkDNSSettings(this.form)">
-  <?=mk_option($eth0['DHCP_KEEPRESOLV'], "no", "Automatic");?>
-  <?=mk_option($eth0['DHCP_KEEPRESOLV'], "yes", "Static");?>
-  </select>
-
-> If set to *Automatic* the server will use DNS server IP address returned by the local DHCP server.<br>
-> If set to *Static* you may enter your own list.
->
-> This is useful in Active Directory configurations where you need to set the first DNS Server entry to the IP address of your AD Domain server.
-
-DNS server 1:
-: <input type="text" name="DNS_SERVER1" maxlength="80" value="<?=$eth0['DNS_SERVER1'];?>" class="narrow" pattern="<?=$validIP?>" title="IP address A.B.C.D">
-
-> This is the primary DNS server to use. Enter a FQDN or an IP address.
->
-> Note: for *Active Directory* you **must** ensure this is set to the IP address of your AD Domain server.
-
-DNS server 2:
-: <input type="text" name="DNS_SERVER2" maxlength="80" value="<?=$eth0['DNS_SERVER2'];?>" class="narrow" pattern="<?=$validIP?>" title="IP address A.B.C.D">
-
-> This is the DNS server to use when DNS Server 1 is down.
-
-DNS server 3:
-: <input type="text" name="DNS_SERVER3" maxlength="80" value="<?=$eth0['DNS_SERVER3'];?>" class="narrow" pattern="<?=$validIP?>" title="IP address A.B.C.D">
-
-> This is the DNS server to use when DNS Servers 1 and 2 are both down.
-
-Desired MTU:
-: <input type="number" name="MTU" min="68" max="9198" value="<?=$eth0['MTU']?>" class="narrow">
-
-> This is the MTU size to use on the physical Ethernet interface.
-> If left blank, the MTU will automatically be determined (by default 1500 bytes).
-
-<?else:?>
 </div>
 <?endif;?>
 </div>
@@ -375,11 +454,16 @@ Desired MTU:
 <script type="text/html" id="network-template-eth0" markdown="1">
 <div id="index-eth0-INDEX" class="access-eth0 shade-<?=$display['theme']?>" markdown="1">
 VLAN number:
-: <input type="number" name="VLANID:INDEX" min="1" max="4095" value="<?=$eth0["VLANID:INDEX"]?>" class="narrow" required><span class="pin" title="Remove VLAN" onclick="removeVLAN($('#index-eth0-INDEX'),false)"><i class="fa fa-minus-circle red"></i></span>
+: <input type="number" name="VLANID:INDEX" min="1" max="4095" value="<?=$eth0["VLANID:INDEX"]?>" class="narrow" required>
+  <span class="pin" title="Remove VLAN" onclick="removeVLAN($('#index-eth0-INDEX'),false)"><i class="fa fa-minus-circle red"></i><em>press to remove VLAN</em></span>
+
+> Give each VLAN a unique identifier. Numbers range from 1 to 4095.

 Interface description:
 : <input type="text" name="DESCRIPTION:INDEX" maxlength="40" value="<?=$eth0["DESCRIPTION:INDEX"]?>" onchange="exitCode(this.form,true)">

+> Use this optional field to provide addditional information about the purpose of the connection.
+
 IP address assignment:
 : <select name="USE_DHCP:INDEX" size="1" onchange="checkNetworkSettings(this.form,INDEX)">
  <?=mk_option($eth0["USE_DHCP:INDEX"], 'yes', 'Automatic');?>
@@ -387,9 +471,17 @@ IP address assignment:
  <?=mk_option($eth0["USE_DHCP:INDEX"], '', 'None');?>
  </select>

+> The following settings are possible:
+>
+> *Automatic* - the server will attempt to obtain its IP address from the local DHCP server<br>
+> *Static* - the IP address is manually set for this interface<br>
+> *None* - no IP address is assigned to the interface (only available for VLANs)
+
 IP address:
 : <input type="text" name="IPADDR:INDEX" maxlength="40" value="<?=$eth0["IPADDR:INDEX"]?>" class="narrow" pattern="<?=$validIP?>" title="IP address A.B.C.D">

+> Greyed out when using DHCP server or NONE assignment. Otherwise specify here the IP address of the system.
+
 Network mask:
 : <select name="NETMASK:INDEX" size="1">
  <?=mk_option($eth0["NETMASK:INDEX"], "255.255.0.0", "255.255.0.0");?>
@@ -403,9 +495,12 @@ Network mask:
  <?=mk_option($eth0["NETMASK:INDEX"], "255.255.255.248", "255.255.255.248");?>
  <?=mk_option($eth0["NETMASK:INDEX"], "255.255.255.252", "255.255.255.252");?>
  </select>
+
+> Greyed out when using DHCP server or NONE assignment. Otherwise specify here the associated network mask, by default 255.255.255.0 is selected.
+
 </div>
 </script>

 &nbsp;
-: <input type="submit" value="Apply"><input type="button" value="Done" onclick="done()"><?=$disabled ? "VMs must be <b>Stopped</b> to change" : ""?>
+: <input type="submit" value="Apply" onclick="$('#wait_eth0').show()"><input type="button" value="Done" onclick="done()"><?=$disabled ? "VMs must be <b>STOPPED</b> to change" : ""?>
 </form>
--- a/plugins/dynamix/EthX.page
+++ b/plugins/dynamix/EthX.page
@@ -16,7 +16,7 @@ Png="ethernet.png"
 ?>
 <?
 // get interface configuration state
-$down = strlen(exec("ip link show ethX|grep -om1 ',UP[,>]'"))==0;
+$down = empty($ethX) || strlen(exec("ip link show ethX|grep -om1 ',UP[,>]'"))==0;

 // get VLAN interfaces
 $vlan_ethX = [0];
@@ -24,15 +24,37 @@ if (isset($ethX)) foreach ($ethX as $key => $val) if (substr($key,0,6)=='VLANID'

 // get bond membership
 $bond_ethX = $eth0['BONDING']=='yes' ? in_array('ethX',explode(',',$eth0['BONDNICS'])) : false;
+
+// get bridge membership
+$bridge_ethX = $eth0['BRIDGING']=='yes' ? in_array('ethX',explode(',',$eth0['BRNICS'])) : false;
+
+if ($disabled)
+  $locked = "VMs must be <b>STOPPED</b> to change";
+elseif ($bond_ethX)
+  $locked = "Interface must be <i>removed</i> as <b>Bonding member</b> to change";
+elseif ($bridge_ethX)
+  $locked = "Interface must be <i>removed</i> as <b>Bridging member</b> to change";
+else
+  $locked = "";
 ?>
 <script>
+<?if ($tabbed):?>
+  var waitid = '#wait_eth0';
+<?else:?>
+  var waitid = '#wait_ethX';
+<?endif;?>
 $(function() {
  var form = document.ethX_settings;
  checkNetworkAccess(form,'ethX');
  checkNetworkSettings(form);
-<?if ($disabled || $bond_ethX):?>
+<?if ($locked):?>
  disableForm(form);
 <?endif;?>
+<?if (!$tabbed):?>
+  $('div[id=title]').each(function(){
+    if ($(this).text().indexOf('Interface ethX')==0) $(this).append("<span id='wait_ethX' class='status red' style='display:none;font-size:small;font-style:italic'>Please wait... configuring interfaces</span>");
+  });
+<?endif;?>
 });
 </script>
 <form markdown="1" name="ethX_settings" method="POST" action="/update.php" target="progressFrame" onchange="exitCode(this,false)" onsubmit="return prepareSettings(this)">
@@ -62,18 +84,6 @@ Enable bridging:

 > Bridging is a feature which creates a virtual bridge and allows VMs to communicate directly with the physical Ethernet port.

-Type of access:
-: <select name="TYPE" size="1" onchange="checkNetworkAccess(this.form,'ethX')">
-  <?=mk_option($ethX['TYPE'], 'access', 'Untagged');?>
-  <?=mk_option($ethX['TYPE'], 'trunk', 'Tagged');?>
-  </select><span class="access-ethX pin" title="Add VLAN" style="display:none" onclick="addVLAN('ethX',<?=$disabled?'true':'false'?>)"><i class="fa fa-plus-circle green"></i></span>
-<?else:?>
-<div class="access-ethX shade-<?=$display['theme']?>" style="display:none" markdown="1">
-VLAN number:
-: <input type="number" name="VLANID:<?=$i?>" min="1" max="4095" value="<?=$ethX["VLANID:$i"]?>" class="narrow" required>
-  <span class="pin" title="Remove VLAN" onclick="removeVLAN($('#index-ethX-<?=$i?>'),<?=$disabled?'true':'false'?>)"><i class="fa fa-minus-circle red"></i></span>
-<?endif;?>
-
 Interface description:
 : <input type="text" name="DESCRIPTION:<?=$i?>" maxlength="40" value="<?=$ethX["DESCRIPTION:$i"]?>" onchange="exitCode(this.form,true)">

@@ -113,14 +123,65 @@ Network mask:

 > Greyed out when using DHCP server. Otherwise specify here the associated network mask, by default 255.255.255.0 is selected.

-<?if ($i==0):?>
 Desired MTU:
 : <input type="number" name="MTU" min="68" max="9198" value="<?=$ethX['MTU']?>" class="narrow">

 > This is the MTU size to use on the physical Ethernet interface.
 > If left blank, the MTU will automatically be determined (by default 1500 bytes).

-<?else:;?>
+Enable VLANs:
+: <select name="TYPE" size="1" onchange="checkNetworkAccess(this.form,'ethX')">
+  <?=mk_option($ethX['TYPE'], 'access', 'No');?>
+  <?=mk_option($ethX['TYPE'], 'trunk', 'Yes');?>
+  </select>
+  <span class="pin access-ethX" title="Add VLAN" style="display:none" onclick="addVLAN('ethX',<?=$disabled?'true':'false'?>)"><i class="fa fa-plus-circle green"></i><em>press to add VLAN</em></span>
+<?else:?>
+<div class="access-ethX shade-<?=$display['theme']?>" style="display:none" markdown="1">
+VLAN number:
+: <input type="number" name="VLANID:<?=$i?>" min="1" max="4095" value="<?=$ethX["VLANID:$i"]?>" class="narrow" required>
+  <span class="pin" title="Remove VLAN" onclick="removeVLAN($('#index-ethX-<?=$i?>'),<?=$disabled?'true':'false'?>)"><i class="fa fa-minus-circle red"></i><em>press to remove VLAN</em></span>
+
+> Give each VLAN a unique identifier. Numbers range from 1 to 4095.
+
+Interface description:
+: <input type="text" name="DESCRIPTION:<?=$i?>" maxlength="40" value="<?=$ethX["DESCRIPTION:$i"]?>" onchange="exitCode(this.form,true)">
+
+> Use this field to give addditional information about the purpose of the connection.
+
+IP address assignment:
+: <select name="USE_DHCP:<?=$i?>" size="1" onchange="checkNetworkSettings(this.form,<?=$i?>)">
+  <?=mk_option($ethX["USE_DHCP:$i"], 'yes', 'Automatic');?>
+  <?=mk_option($ethX["USE_DHCP:$i"], 'no', 'Static');?>
+  <?=mk_option($ethX["USE_DHCP:$i"], '', 'None');?>
+  </select>
+
+> The following settings are possible:
+>
+> *Automatic* - the server will attempt to obtain its IP address from the local DHCP server<br>
+> *Static* - the IP address is manually set for this interface<br>
+> *None* - no IP address is assigned to the interface
+
+IP address:
+: <input type="text" name="IPADDR:<?=$i?>" maxlength="40" value="<?=$ethX["IPADDR:$i"]?>" class="narrow" pattern="<?=$validIP?>" title="IP address A.B.C.D">
+
+> Greyed out when using DHCP server or NONE assignment. Otherwise specify here the IP address of the interface.
+
+Network mask:
+: <select name="NETMASK:<?=$i?>" size="1">
+  <?=mk_option($ethX["NETMASK:$i"], "255.255.0.0", "255.255.0.0");?>
+  <?=mk_option($ethX["NETMASK:$i"], "255.255.252.0", "255.255.252.0");?>
+  <?=mk_option($ethX["NETMASK:$i"], "255.255.254.0", "255.255.254.0");?>
+  <?=mk_option($ethX["NETMASK:$i"], "255.255.255.0", "255.255.255.0");?>
+  <?=mk_option($ethX["NETMASK:$i"], "255.255.255.128", "255.255.255.128");?>
+  <?=mk_option($ethX["NETMASK:$i"], "255.255.255.192", "255.255.255.192");?>
+  <?=mk_option($ethX["NETMASK:$i"], "255.255.255.224", "255.255.255.224");?>
+  <?=mk_option($ethX["NETMASK:$i"], "255.255.255.240", "255.255.255.240");?>
+  <?=mk_option($ethX["NETMASK:$i"], "255.255.255.248", "255.255.255.248");?>
+  <?=mk_option($ethX["NETMASK:$i"], "255.255.255.252", "255.255.255.252");?>
+  </select>
+
+> Greyed out when using DHCP server or NONE assignment. Otherwise specify here the associated network mask, by default 255.255.255.0 is selected.
+
 </div>
 <?endif;?>
 </div>
@@ -129,11 +190,16 @@ Desired MTU:
 <script type="text/html" id="network-template-ethX" markdown="1">
 <div id="index-ethX-INDEX" class="access-ethX shade-<?=$display['theme']?>" markdown="1">
 VLAN number:
-: <input type="number" name="VLANID:INDEX" min="1" max="4095" value="<?=$ethX["VLANID:INDEX"]?>" class="narrow" required><span class="pin" title="Remove VLAN" onclick="removeVLAN($('#index-ethX-INDEX'),false)"><i class="fa fa-minus-circle red"></i></span>
+: <input type="number" name="VLANID:INDEX" min="1" max="4095" value="<?=$ethX["VLANID:INDEX"]?>" class="narrow" required>
+  <span class="pin" title="Remove VLAN" onclick="removeVLAN($('#index-ethX-INDEX'),false)"><i class="fa fa-minus-circle red"></i><em>press to remove VLAN</em></span>
+
+> Give each VLAN a unique identifier. Numbers range from 1 to 4095.

 Interface description:
 : <input type="text" name="DESCRIPTION:INDEX" maxlength="40" value="<?=$ethX["DESCRIPTION:INDEX"]?>" onchange="exitCode(this.form,true)">

+> Use this field to give addditional information about the purpose of the connection.
+
 IP address assignment:
 : <select name="USE_DHCP:INDEX" size="1" onchange="checkNetworkSettings(this.form,INDEX)">
  <?=mk_option($ethX["USE_DHCP:INDEX"], 'yes', 'Automatic');?>
@@ -141,9 +207,17 @@ IP address assignment:
  <?=mk_option($ethX["USE_DHCP:INDEX"], '', 'None');?>
  </select>

+> The following settings are possible:
+>
+> *Automatic* - the server will attempt to obtain its IP address from the local DHCP server<br>
+> *Static* - the IP address is manually set for this interface<br>
+> *None* - no IP address is assigned to the interface
+
 IP address:
 : <input type="text" name="IPADDR:INDEX" maxlength="40" value="<?=$ethX["IPADDR:INDEX"]?>" class="narrow" pattern="<?=$validIP?>" title="IP address A.B.C.D">

+> Greyed out when using DHCP server or NONE assignment. Otherwise specify here the IP address of the interface.
+
 Network mask:
 : <select name="NETMASK:INDEX" size="1">
  <?=mk_option($ethX["NETMASK:INDEX"], "255.255.0.0", "255.255.0.0");?>
@@ -157,9 +231,12 @@ Network mask:
  <?=mk_option($ethX["NETMASK:INDEX"], "255.255.255.248", "255.255.255.248");?>
  <?=mk_option($ethX["NETMASK:INDEX"], "255.255.255.252", "255.255.255.252");?>
  </select>
+
+> Greyed out when using DHCP server or NONE assignment. Otherwise specify here the associated network mask, by default 255.255.255.0 is selected.
+
 </div>
 </script>

 &nbsp;
-: <input type="submit" value="Apply"><input type="button" value="Done" onclick="done()"><?=$bond_ethX ? "Interface must be <b>Unbonded</b> to change" : ($disabled ? "VMs must be <b>Stopped</b> to change" : "")?>
+: <input type="submit" value="Apply" onclick="$(waitid).show()"><input type="button" value="Done" onclick="done()"><?=$locked?>
 </form>
--- a/plugins/dynamix/include/update.ethernet.php
+++ b/plugins/dynamix/include/update.ethernet.php
@@ -11,5 +11,15 @@
 */
 ?>
 <?
-if ($_POST['#arg'][1] != 'none') unset($keys[$_POST['#section']]); // do nothing when only description has changed
+if ($_POST['#arg'][1] != 'none') {
+  if ($_POST['BONDING']=='yes') {
+    $nics = explode(',',str_replace('eth0','',$_POST['BONDNICS']));
+    foreach ($nics as $nic) if ($nic) unset($keys[$nic]);
+  }
+  if ($_POST['BRIDGING']=='yes') {
+    $nics = explode(',',str_replace('eth0','',$_POST['BRNICS']));
+    foreach ($nics as $nic) if ($nic) unset($keys[$nic]);
+  }
+  unset($keys[$_POST['#section']]);
+}
 ?>
--- a/plugins/dynamix/scripts/netconfig
+++ b/plugins/dynamix/scripts/netconfig
@@ -17,15 +17,23 @@ $run = $set != 'none';
 $ini = parse_ini_file('/var/local/emhttp/network.ini',true); ksort($ini,SORT_NATURAL);
 $cfg = '/boot/config/network.cfg';

+function ifname($name) {
+  global $old;
+  for ($i=0; $i<$old['SYSNICS']; $i++) {
+    $nics = $old['BONDNICS'][$i] ?: $old['BRNICS'][$i];
+    if (strpos("$nics ","$name ")!==false) return $old['IFNAME'][$i];
+  }
+  return $name;
+}
+
 if ($run && file_exists($cfg)) {
  $old = parse_ini_file($cfg);
-  $i = preg_replace('/[^\d]/','',$set);
  if (isset($old['SYSNICS'])) {
    // new syntax
-    $ifname = isset($old['IFNAME'][$i]) ? $old['IFNAME'][$i] : $set;
+    $ifname = ifname($set);
  } else {
    // legacy syntax
-    if ($i==0) $ifname = $old['BRIDGING']=='yes' ? $old['BRNAME'] : ($old['BONDING']=='yes' ? $old['BONDNAME'] : $set);
+    if ($set=='eth0') $ifname = $old['BRIDGING']=='yes' ? $old['BRNAME'] : ($old['BONDING']=='yes' ? $old['BONDNAME'] : $set);
  }
 }

@@ -33,25 +41,41 @@ if ($run && file_exists($cfg)) {
 // don't execute when only interface description has changed
 if ($run) exec("/etc/rc.d/rc.inet1 {$ifname}_stop >/dev/null");

-if ($bonding = isset($ini['eth0']) && $ini['eth0']['BONDING']=='yes') {
+if ($bonding = $ini['eth0']['BONDING']=='yes') {
  $ini['eth0']['BONDNICS'] = str_replace(',',' ',$ini['eth0']['BONDNICS']);
-  $members = explode(' ',trim(str_replace('eth0','',$ini['eth0']['BONDNICS'])));
+  $bond0 = explode(' ',trim(str_replace('eth0','',$ini['eth0']['BONDNICS'])));
+// ensure additional NICs in bond are set free
+  if ($run && $set=='eth0') foreach ($bond0 as $nic) {
+    if (isset($old['SYSNICS'])) $nic = ifname($nic);
+    if ($nic) exec("/etc/rc.d/rc.inet1 {$nic}_stop >/dev/null");
+  }
+}
+
+if ($bridging = $ini['eth0']['BRIDGING']=='yes') {
+  $ini['eth0']['BRNICS'] = str_replace(',',' ',$ini['eth0']['BRNICS']);
+  $br0 = explode(' ',trim(str_replace('eth0','',$ini['eth0']['BRNICS'])));
+// ensure additional NICs in bridge are set free
+  if ($run && $set=='eth0') foreach ($br0 as $nic) {
+    if (isset($old['SYSNICS'])) $nic = ifname($nic);
+    if ($nic) exec("/etc/rc.d/rc.inet1 {$nic}_stop >/dev/null");
+  }
 }

 // create configuration file for all available interfaces
 $i = 0; $new = []; $new[] = "# Generated settings:";
 foreach ($ini as $name => $port) {
-  if ($bonding && in_array($name,$members)) continue;
-  $bridging = $port['BRIDGING']=='yes';
+  if ($bonding && in_array($name,$bond0)) continue;
+  if ($bridging && in_array($name,$br0)) continue;
+  $bridge = $port['BRIDGING']=='yes';
  $trunk = $port['TYPE']=='trunk';
  $j = 0; $x0 = 0;
-  $iface = $bridging ? $port['BRNAME'] : ($bonding && $name=='eth0' ? $port['BONDNAME'] : $name);
+  $iface = $bridge ? $port['BRNAME'] : ($bonding && $name=='eth0' ? $port['BONDNAME'] : $name);
  $new[] = "IFNAME[$i]=\"$iface\"";
  if ($set==$name) $ifname = $iface;
  foreach ($port as $key => $val) {
    if (preg_match('/^(TYPE|BONDING$|BRIDGING)/',$key)) continue;
    if (!$bonding && preg_match('/^(BONDING_MODE|BONDING_MIIMON|BONDNICS|BONDNAME)/',$key)) continue;
-    if (!$bridging && preg_match('/^(BRSTP|BRFD|BRNICS|BRNAME)/',$key)) continue;
+    if (!$bridge && preg_match('/^(BRSTP|BRFD|BRNICS|BRNAME)/',$key)) continue;
    list($item,$x) = explode(':',$key,2);
    if ($trunk && $x>0 && preg_match('/^(VLANID|USE_DHCP|IPADDR|NETMASK|DESCRIPTION)/',$key)) {
      if ($x0 != $x) {$x0 = $x; $j++;}