[PATCH] [Kimchi] New UI for adding network bridges

From: peterpennings <peterpnns@gmail.com> This patch adds Linux and OVS bridges. netinfo.py had to be updated to show OVS bridges in order to reflect the changes made in the UI. peterpennings (1): Issue #791: New UI for adding network bridges netinfo.py | 3 +- ui/js/src/kimchi.network.js | 2 + ui/js/src/kimchi.network_add_main.js | 146 ++++++++++++++++++++++------------- ui/pages/network-add.html.tmpl | 3 +- 4 files changed, 96 insertions(+), 58 deletions(-) -- 2.5.0

From: peterpennings <peterpnns@gmail.com> This commit adds the new UI changes for network bridges and enables OVS bridges that where temporary hidden Signed-off-by: peterpennings <peterpnns@gmail.com> --- netinfo.py | 3 +- ui/js/src/kimchi.network.js | 2 + ui/js/src/kimchi.network_add_main.js | 146 ++++++++++++++++++++++------------- ui/pages/network-add.html.tmpl | 3 +- 4 files changed, 96 insertions(+), 58 deletions(-) diff --git a/netinfo.py b/netinfo.py index 2d83466..c00f603 100644 --- a/netinfo.py +++ b/netinfo.py @@ -221,8 +221,7 @@ def is_bare_nic(iface): # a slave of bond. # The bridge will not be exposed when all it's port are tap. def all_favored_interfaces(): - return list(set(aggregated_bridges() + bare_nics() + bondings()) - - set(ovs_bridges())) + return aggregated_bridges() + bare_nics() + bondings() def get_interface_type(iface): diff --git a/ui/js/src/kimchi.network.js b/ui/js/src/kimchi.network.js index 923aeb9..96c3fea 100644 --- a/ui/js/src/kimchi.network.js +++ b/ui/js/src/kimchi.network.js @@ -17,6 +17,8 @@ */ kimchi.NETWORK_TYPE_MACVTAP = "macvtap"; +kimchi.NETWORK_TYPE_BRIDGED = "bridge"; + kimchi.initNetwork = function() { if(wok.tabMode['network'] === 'admin') { diff --git a/ui/js/src/kimchi.network_add_main.js b/ui/js/src/kimchi.network_add_main.js index 76d436f..603a5ee 100644 --- a/ui/js/src/kimchi.network_add_main.js +++ b/ui/js/src/kimchi.network_add_main.js @@ -31,20 +31,20 @@ kimchi.startNetworkCreation = function() { var network = kimchi.getNetworkDialogValues(); var data = { name : network.name, - connection: network.type + connection: network.type, + interface: network.interface, + vlan_id: network.vlan_id }; - if (network.type === kimchi.NETWORK_TYPE_MACVTAP) { - data.connection = "macvtap"; - data.interface = network.interface; - if ($("#enableVlan").prop("checked")) { + + if (network.type === kimchi.NETWORK_TYPE_BRIDGED && $("#enableVlan").prop("checked")) { data.vlan_id = network.vlan_id; if (!(data.vlan_id >=1 && data.vlan_id <= 4094)) { wok.message.error.code('KCHNET6001E'); errorCallback(); return; } - } } + kimchi.createNetwork(data, function(result) { network.state = result.state === "active" ? "up" : "down"; network.interface = result.interface ? result.interface : i18n["KCHNET6001M"]; @@ -59,30 +59,8 @@ kimchi.startNetworkCreation = function() { }; kimchi.openNetworkDialog = function(okCallback) { - kimchi.getInterfaces(function(result) { - var options = []; - $selectDestination = $('#networkDestinationID'); - var nics = {}; - var selectDestinationOptionHTML = ''; - for (var i = 0; i < result.length; i++) { - options.push({label:result[i].name,value:result[i].name}); - nics[result[i].name] = result[i]; - selectDestinationOptionHTML += '<option value="'+ result[i].name + '">' + result[i].name + '</option>'; - } - $selectDestination.append(selectDestinationOptionHTML); - $selectDestination.selectpicker(); - onChange = function() { - if (result.length>0 && $selectDestination.val() !== "") { - $("#enableVlan").prop("disabled",false); - $("#networkVlanID").val(""); - } else { - $("#enableVlan").prop("disabled",true); - } - }; - $("#networkDestinationID").on("change", onChange); - kimchi.setDefaultNetworkType(result.length!==0); - onChange(); - }); + kimchi.loadInterfaces(); + $("#networkFormOk").on("click", function() { $("#networkFormOk").button("disable"); $("#networkName").prop("readonly", "readonly"); @@ -98,28 +76,10 @@ kimchi.openNetworkDialog = function(okCallback) { }); }; -kimchi.enableBridgeOptions = function(enable) { - $("#enableVlan").prop("checked", false); - $("#networkVlanID").val(""); - if (enable) { - $('#bridgedContent').slideDown(300); - $('#enableVlan').prop("disabled", false); - $('#networkVlanID').prop("disabled", true); - } else { - $('#bridgedContent').slideUp(300); - $('#enableVlan').prop("disabled", true); - $('#networkVlanID').prop("disabled", true); - } -}; - - kimchi.setDefaultNetworkType = function(isInterfaceAvail) { - $("#networkType").val('macvtap', isInterfaceAvail); - $("#networkType option:contains('bridged')").prop("disabled", !isInterfaceAvail); - $("#networkType").val('nat', !isInterfaceAvail); $("#networkType").selectpicker(); if (!isInterfaceAvail) { - kimchi.enableBridgeOptions(false); + kimchi.enableBridgeOptions2(false); $("#networkBriDisabledLabel").removeClass('hidden'); } else { if (kimchi.capabilities && kimchi.capabilities.nm_running) { @@ -136,7 +96,12 @@ kimchi.getNetworkDialogValues = function() { }; if (network.type === kimchi.NETWORK_TYPE_MACVTAP) { network.interface = $("#networkDestinationID").val(); - network.vlan_id = parseInt($("#networkVlanID").val()); + } + if (network.type === kimchi.NETWORK_TYPE_BRIDGED) { + network.interface = $("#networkDestinationID").val(); + if (network.interface === 'nic' || network.interface === 'bonding') { + network.vlan_id = parseInt($("#networkVlanID").val()); + } } return network; }; @@ -147,14 +112,26 @@ kimchi.setupNetworkFormEvent = function() { $("#networkName").toggleClass("invalid-field", !$("#networkName").val().match(/^[^\"\/]+$/)); kimchi.updateNetworkFormButton(); }); - $('#networkType').on('change', function() { - var selectedType = $(this).val(); + + $('#networkType, #networkDestinationID').on('change', function() { + var selectedType = $("#networkType").val(); + var selectedDestination = $("#networkDestinationID").val(); if(selectedType == 'isolated' || selectedType == 'nat') { - kimchi.enableBridgeOptions(false); - } else if (selectedType == 'macvtap') { - kimchi.enableBridgeOptions(true); + kimchi.enableBridgeOptions2(false); + } else { + kimchi.enableBridgeOptions2(true, selectedType, selectedDestination); } + }); + + $('#networkType').on('change', function() { + var selectedType = $("#networkType").val(); + if(selectedType === kimchi.NETWORK_TYPE_MACVTAP) { + kimchi.loadInterfaces(new Array("nic", "bonding")); + } else { + kimchi.loadInterfaces(); + } + }); }; kimchi.updateNetworkFormButton = function() { @@ -164,3 +141,62 @@ kimchi.updateNetworkFormButton = function() { $("#networkFormOk").button("enable"); } }; + +kimchi.enableBridgeOptions2 = function(enable, networkType, networkDestination) { + $("#enableVlan").prop("checked", false); + $("#networkVlanID").val(""); + $('#vlan').hide(); + if (enable) { + $('#bridgedContent').slideDown(300); + $('#enableVlan').prop("disabled", false); + $('#networkVlanID').prop("disabled", true); + if (networkType === kimchi.NETWORK_TYPE_BRIDGED && (networkDestination === 'nic' || networkDestination === 'bonding')) { + $('#vlan').show(); + } + } else { + $('#bridgedContent').slideUp(300); + $('#enableVlan').prop("disabled", true); + $('#networkVlanID').prop("disabled", true); + }; + +}; + +kimchi.loadInterfaces = function(interfaceFilterArray) { + kimchi.getInterfaces(function(result) { + + var options = []; + $selectDestination = $('#networkDestinationID'); + var nics = {}; + $('#networkDestinationID').find('option').remove(); + var selectDestinationOptionHTML = ''; + for (var i = 0; i < result.length; i++) { + if (typeof interfaceFilterArray === 'undefined') { + options.push({label:result[i].name,value:result[i].name}); + nics[result[i].name] = result[i]; + selectDestinationOptionHTML += '<option value="'+ result[i].name + '">' + result[i].name + '</option>'; + } else { + for (var k = 0; k < interfaceFilterArray.length; k++) { + if (result[i].type == interfaceFilterArray[k]) { + options.push({label:result[i].name,value:result[i].name}); + nics[result[i].name] = result[i]; + selectDestinationOptionHTML += '<option value="'+ result[i].name + '">' + result[i].name + '</option>'; + } + } + } + + } + $selectDestination.append(selectDestinationOptionHTML); + $('#networkDestinationID').selectpicker('refresh'); + onChange = function() { + if (result.length>0 && $selectDestination.val() !== "") { + $("#enableVlan").prop("disabled",false); + $("#networkVlanID").val(""); + } else { + $("#enableVlan").prop("disabled",true); + } + }; + kimchi.setDefaultNetworkType(result.length!==0); + onChange(); + }); +}; + diff --git a/ui/pages/network-add.html.tmpl b/ui/pages/network-add.html.tmpl index 7158b75..b1f3e21 100644 --- a/ui/pages/network-add.html.tmpl +++ b/ui/pages/network-add.html.tmpl @@ -41,6 +41,7 @@ <option value="isolated">$_("Isolated: no external network connection")</option> <option value="nat">$_("NAT: outbound physical network connection only")</option> <option value="macvtap">$_("Bridged: Virtual machines are connected to physical network directly")</option> + <option value="bridge">$_("Linux bridges and OVS bridges")</option> </select> </div> <div id="networkBriDisabledLabel" class="form-group hidden"> @@ -52,7 +53,7 @@ <select id="networkDestinationID" class="selectpicker col-md-12 col-lg-12"> </select> </div> - <div class="form-group"> + <div class="form-group" id="vlan"> <input id="enableVlan" class="wok-checkbox" type="checkbox" value="" /> <label for="enableVlan" id="labelEnableVlan">$_("Enable VLAN") </label> <div id="vlan-enabled"> -- 2.5.0

On 02/03/2016 02:41 PM, peterpnns@gmail.com wrote:
From: peterpennings <peterpnns@gmail.com>
This commit adds the new UI changes for network bridges and enables OVS bridges that where temporary hidden
Signed-off-by: peterpennings <peterpnns@gmail.com> --- netinfo.py | 3 +- ui/js/src/kimchi.network.js | 2 + ui/js/src/kimchi.network_add_main.js | 146 ++++++++++++++++++++++------------- ui/pages/network-add.html.tmpl | 3 +- 4 files changed, 96 insertions(+), 58 deletions(-)
diff --git a/netinfo.py b/netinfo.py index 2d83466..c00f603 100644 --- a/netinfo.py +++ b/netinfo.py @@ -221,8 +221,7 @@ def is_bare_nic(iface): # a slave of bond. # The bridge will not be exposed when all it's port are tap. def all_favored_interfaces(): - return list(set(aggregated_bridges() + bare_nics() + bondings()) - - set(ovs_bridges())) + return aggregated_bridges() + bare_nics() + bondings()
def get_interface_type(iface): diff --git a/ui/js/src/kimchi.network.js b/ui/js/src/kimchi.network.js index 923aeb9..96c3fea 100644 --- a/ui/js/src/kimchi.network.js +++ b/ui/js/src/kimchi.network.js @@ -17,6 +17,8 @@ */
kimchi.NETWORK_TYPE_MACVTAP = "macvtap"; +kimchi.NETWORK_TYPE_BRIDGED = "bridge"; +
kimchi.initNetwork = function() { if(wok.tabMode['network'] === 'admin') { diff --git a/ui/js/src/kimchi.network_add_main.js b/ui/js/src/kimchi.network_add_main.js index 76d436f..603a5ee 100644 --- a/ui/js/src/kimchi.network_add_main.js +++ b/ui/js/src/kimchi.network_add_main.js @@ -31,20 +31,20 @@ kimchi.startNetworkCreation = function() { var network = kimchi.getNetworkDialogValues(); var data = { name : network.name, - connection: network.type + connection: network.type, + interface: network.interface, + vlan_id: network.vlan_id }; - if (network.type === kimchi.NETWORK_TYPE_MACVTAP) { - data.connection = "macvtap"; - data.interface = network.interface; - if ($("#enableVlan").prop("checked")) { + + if (network.type === kimchi.NETWORK_TYPE_BRIDGED && $("#enableVlan").prop("checked")) { data.vlan_id = network.vlan_id; if (!(data.vlan_id >=1 && data.vlan_id <= 4094)) { wok.message.error.code('KCHNET6001E'); errorCallback(); return; } - } } + kimchi.createNetwork(data, function(result) { network.state = result.state === "active" ? "up" : "down"; network.interface = result.interface ? result.interface : i18n["KCHNET6001M"]; @@ -59,30 +59,8 @@ kimchi.startNetworkCreation = function() { };
kimchi.openNetworkDialog = function(okCallback) { - kimchi.getInterfaces(function(result) { - var options = []; - $selectDestination = $('#networkDestinationID'); - var nics = {}; - var selectDestinationOptionHTML = ''; - for (var i = 0; i < result.length; i++) { - options.push({label:result[i].name,value:result[i].name}); - nics[result[i].name] = result[i]; - selectDestinationOptionHTML += '<option value="'+ result[i].name + '">' + result[i].name + '</option>'; - } - $selectDestination.append(selectDestinationOptionHTML); - $selectDestination.selectpicker(); - onChange = function() { - if (result.length>0 && $selectDestination.val() !== "") { - $("#enableVlan").prop("disabled",false); - $("#networkVlanID").val(""); - } else { - $("#enableVlan").prop("disabled",true); - } - }; - $("#networkDestinationID").on("change", onChange); - kimchi.setDefaultNetworkType(result.length!==0); - onChange(); - }); + kimchi.loadInterfaces(); + $("#networkFormOk").on("click", function() { $("#networkFormOk").button("disable"); $("#networkName").prop("readonly", "readonly"); @@ -98,28 +76,10 @@ kimchi.openNetworkDialog = function(okCallback) { }); };
-kimchi.enableBridgeOptions = function(enable) { - $("#enableVlan").prop("checked", false); - $("#networkVlanID").val(""); - if (enable) { - $('#bridgedContent').slideDown(300); - $('#enableVlan').prop("disabled", false); - $('#networkVlanID').prop("disabled", true); - } else { - $('#bridgedContent').slideUp(300); - $('#enableVlan').prop("disabled", true); - $('#networkVlanID').prop("disabled", true); - } -}; - - kimchi.setDefaultNetworkType = function(isInterfaceAvail) { - $("#networkType").val('macvtap', isInterfaceAvail); - $("#networkType option:contains('bridged')").prop("disabled", !isInterfaceAvail); - $("#networkType").val('nat', !isInterfaceAvail); $("#networkType").selectpicker(); if (!isInterfaceAvail) {
- kimchi.enableBridgeOptions(false); + kimchi.enableBridgeOptions2(false);
Why did you rename the function name to 'enableBridgedOptions*2*' ?
$("#networkBriDisabledLabel").removeClass('hidden'); } else { if (kimchi.capabilities && kimchi.capabilities.nm_running) { @@ -136,7 +96,12 @@ kimchi.getNetworkDialogValues = function() { }; if (network.type === kimchi.NETWORK_TYPE_MACVTAP) { network.interface = $("#networkDestinationID").val(); - network.vlan_id = parseInt($("#networkVlanID").val()); + } + if (network.type === kimchi.NETWORK_TYPE_BRIDGED) { + network.interface = $("#networkDestinationID").val(); + if (network.interface === 'nic' || network.interface === 'bonding') { + network.vlan_id = parseInt($("#networkVlanID").val()); + } }
The VLAN information is associated with a macvtap bridge not with a Linux brigde. The current bridged UI (ie, macvtap) needs to keep the same. We will only add a new option "Linux bridged" which will also list the interface combo box but without the VLAN configuration.
return network; }; @@ -147,14 +112,26 @@ kimchi.setupNetworkFormEvent = function() { $("#networkName").toggleClass("invalid-field", !$("#networkName").val().match(/^[^\"\/]+$/)); kimchi.updateNetworkFormButton(); }); - $('#networkType').on('change', function() { - var selectedType = $(this).val(); + + $('#networkType, #networkDestinationID').on('change', function() { + var selectedType = $("#networkType").val(); + var selectedDestination = $("#networkDestinationID").val(); if(selectedType == 'isolated' || selectedType == 'nat') { - kimchi.enableBridgeOptions(false); - } else if (selectedType == 'macvtap') { - kimchi.enableBridgeOptions(true); + kimchi.enableBridgeOptions2(false); + } else { + kimchi.enableBridgeOptions2(true, selectedType, selectedDestination); } + }); + + $('#networkType').on('change', function() { + var selectedType = $("#networkType").val(); + if(selectedType === kimchi.NETWORK_TYPE_MACVTAP) { + kimchi.loadInterfaces(new Array("nic", "bonding")); + } else { + kimchi.loadInterfaces(); + } + }); };
kimchi.updateNetworkFormButton = function() { @@ -164,3 +141,62 @@ kimchi.updateNetworkFormButton = function() { $("#networkFormOk").button("enable"); } }; + +kimchi.enableBridgeOptions2 = function(enable, networkType, networkDestination) { + $("#enableVlan").prop("checked", false); + $("#networkVlanID").val(""); + $('#vlan').hide(); + if (enable) { + $('#bridgedContent').slideDown(300); + $('#enableVlan').prop("disabled", false); + $('#networkVlanID').prop("disabled", true); + if (networkType === kimchi.NETWORK_TYPE_BRIDGED && (networkDestination === 'nic' || networkDestination === 'bonding')) { + $('#vlan').show(); + } + } else { + $('#bridgedContent').slideUp(300); + $('#enableVlan').prop("disabled", true); + $('#networkVlanID').prop("disabled", true); + }; + +}; + +kimchi.loadInterfaces = function(interfaceFilterArray) { + kimchi.getInterfaces(function(result) { + + var options = []; + $selectDestination = $('#networkDestinationID'); + var nics = {}; + $('#networkDestinationID').find('option').remove(); + var selectDestinationOptionHTML = ''; + for (var i = 0; i < result.length; i++) { + if (typeof interfaceFilterArray === 'undefined') { + options.push({label:result[i].name,value:result[i].name}); + nics[result[i].name] = result[i]; + selectDestinationOptionHTML += '<option value="'+ result[i].name + '">' + result[i].name + '</option>'; + } else { + for (var k = 0; k < interfaceFilterArray.length; k++) { + if (result[i].type == interfaceFilterArray[k]) { + options.push({label:result[i].name,value:result[i].name}); + nics[result[i].name] = result[i]; + selectDestinationOptionHTML += '<option value="'+ result[i].name + '">' + result[i].name + '</option>'; + } + } + } + + } + $selectDestination.append(selectDestinationOptionHTML); + $('#networkDestinationID').selectpicker('refresh'); + onChange = function() { + if (result.length>0 && $selectDestination.val() !== "") { + $("#enableVlan").prop("disabled",false); + $("#networkVlanID").val(""); + } else { + $("#enableVlan").prop("disabled",true); + } + }; + kimchi.setDefaultNetworkType(result.length!==0); + onChange(); + }); +}; + diff --git a/ui/pages/network-add.html.tmpl b/ui/pages/network-add.html.tmpl index 7158b75..b1f3e21 100644 --- a/ui/pages/network-add.html.tmpl +++ b/ui/pages/network-add.html.tmpl @@ -41,6 +41,7 @@ <option value="isolated">$_("Isolated: no external network connection")</option> <option value="nat">$_("NAT: outbound physical network connection only")</option> <option value="macvtap">$_("Bridged: Virtual machines are connected to physical network directly")</option>
+ <option value="bridge">$_("Linux bridges and OVS bridges")</option>
Please, use: "Linux bridged: Virtual machines are connected through a network bridge"
</select> </div> <div id="networkBriDisabledLabel" class="form-group hidden"> @@ -52,7 +53,7 @@ <select id="networkDestinationID" class="selectpicker col-md-12 col-lg-12"> </select> </div> - <div class="form-group"> + <div class="form-group" id="vlan"> <input id="enableVlan" class="wok-checkbox" type="checkbox" value="" /> <label for="enableVlan" id="labelEnableVlan">$_("Enable VLAN") </label> <div id="vlan-enabled">
Also every time, I change the network type on combo box a new warning message about the Network Manager is appended in the dialog. It happened to have 4 messages in a time.

Hi Aline, *- Why did you rename the function name to 'enableBridgedOptions2' ?* Sorry, my mistake, I will replace the name of this function. *- The VLAN information is associated with a macvtap bridge not with a Linux brigde.* *- We will only add a new option "Linux bridged" which will also list the interface combo box but without the VLAN configuration.* I followed this specification: https://github.com/kimchi-project/kimchi/issues/791. Maybe I understood something wrong. Should I show de VLAN information for macvtap? *- Please, use: "Linux bridged: Virtual machines are connected through a network bridge"* Ok, I will do it. 2016-02-04 11:18 GMT-02:00 Aline Manera <alinefm@linux.vnet.ibm.com>:
On 02/03/2016 02:41 PM, peterpnns@gmail.com wrote:
From: peterpennings <peterpnns@gmail.com> <peterpnns@gmail.com>
This commit adds the new UI changes for network bridges and enables OVS bridges that where temporary hidden
Signed-off-by: peterpennings <peterpnns@gmail.com> <peterpnns@gmail.com> --- netinfo.py | 3 +- ui/js/src/kimchi.network.js | 2 + ui/js/src/kimchi.network_add_main.js | 146 ++++++++++++++++++++++------------- ui/pages/network-add.html.tmpl | 3 +- 4 files changed, 96 insertions(+), 58 deletions(-)
diff --git a/netinfo.py b/netinfo.py index 2d83466..c00f603 100644 --- a/netinfo.py +++ b/netinfo.py @@ -221,8 +221,7 @@ def is_bare_nic(iface): # a slave of bond. # The bridge will not be exposed when all it's port are tap. def all_favored_interfaces(): - return list(set(aggregated_bridges() + bare_nics() + bondings()) - - set(ovs_bridges())) + return aggregated_bridges() + bare_nics() + bondings()
def get_interface_type(iface): diff --git a/ui/js/src/kimchi.network.js b/ui/js/src/kimchi.network.js index 923aeb9..96c3fea 100644 --- a/ui/js/src/kimchi.network.js +++ b/ui/js/src/kimchi.network.js @@ -17,6 +17,8 @@ */
kimchi.NETWORK_TYPE_MACVTAP = "macvtap"; +kimchi.NETWORK_TYPE_BRIDGED = "bridge"; +
kimchi.initNetwork = function() { if(wok.tabMode['network'] === 'admin') { diff --git a/ui/js/src/kimchi.network_add_main.js b/ui/js/src/kimchi.network_add_main.js index 76d436f..603a5ee 100644 --- a/ui/js/src/kimchi.network_add_main.js +++ b/ui/js/src/kimchi.network_add_main.js @@ -31,20 +31,20 @@ kimchi.startNetworkCreation = function() { var network = kimchi.getNetworkDialogValues(); var data = { name : network.name, - connection: network.type + connection: network.type, + interface: network.interface, + vlan_id: network.vlan_id }; - if (network.type === kimchi.NETWORK_TYPE_MACVTAP) { - data.connection = "macvtap"; - data.interface = network.interface; - if ($("#enableVlan").prop("checked")) { + + if (network.type === kimchi.NETWORK_TYPE_BRIDGED && $("#enableVlan").prop("checked")) { data.vlan_id = network.vlan_id; if (!(data.vlan_id >=1 && data.vlan_id <= 4094)) { wok.message.error.code('KCHNET6001E'); errorCallback(); return; } - } } + kimchi.createNetwork(data, function(result) { network.state = result.state === "active" ? "up" : "down"; network.interface = result.interface ? result.interface : i18n["KCHNET6001M"]; @@ -59,30 +59,8 @@ kimchi.startNetworkCreation = function() { };
kimchi.openNetworkDialog = function(okCallback) { - kimchi.getInterfaces(function(result) { - var options = []; - $selectDestination = $('#networkDestinationID'); - var nics = {}; - var selectDestinationOptionHTML = ''; - for (var i = 0; i < result.length; i++) { - options.push({label:result[i].name,value:result[i].name}); - nics[result[i].name] = result[i]; - selectDestinationOptionHTML += '<option value="'+ result[i].name + '">' + result[i].name + '</option>'; - } - $selectDestination.append(selectDestinationOptionHTML); - $selectDestination.selectpicker(); - onChange = function() { - if (result.length>0 && $selectDestination.val() !== "") { - $("#enableVlan").prop("disabled",false); - $("#networkVlanID").val(""); - } else { - $("#enableVlan").prop("disabled",true); - } - }; - $("#networkDestinationID").on("change", onChange); - kimchi.setDefaultNetworkType(result.length!==0); - onChange(); - }); + kimchi.loadInterfaces(); + $("#networkFormOk").on("click", function() { $("#networkFormOk").button("disable"); $("#networkName").prop("readonly", "readonly"); @@ -98,28 +76,10 @@ kimchi.openNetworkDialog = function(okCallback) { }); };
-kimchi.enableBridgeOptions = function(enable) { - $(" <);@@-98,28+76,10@@kimchi.openNetworkDialog=function(okCallback)%7B%7D);%7D;-kimchi.enableBridgeOptions=function(enable)%7B-$(>#enableVlan").prop("checked", false); - $("#networkVlanID").val(""); - if (enable) { - $('#bridgedContent').slideDown(300); - $('#enableVlan').prop("disabled", false); - $('#networkVlanID').prop("disabled", true); - } else { - $('#bridgedContent').slideUp(300); - $('#enableVlan').prop("disabled", true); - $('#networkVlanID').prop("disabled", true); - } -}; - - kimchi.setDefaultNetworkType = function(isInterfaceAvail) { - $("#networkType").val('macvtap', isInterfaceAvail); - $("#networkType option:contains('bridged')").prop("disabled", !isInterfaceAvail); - $("#networkType").val('nat', !isInterfaceAvail); $("#networkType").selectpicker(); if (!isInterfaceAvail) {
- kimchi.enableBridgeOptions(false); + kimchi.enableBridgeOptions2(false);
Why did you rename the function name to 'enableBridgedOptions*2*' ?
$("#networkBriDisabledLabel").removeClass('hidden'); } else { if (kimchi.capabilities && kimchi.capabilities.nm_running) { @@ -136,7 +96,12 @@ kimchi.getNetworkDialogValues = function() { }; if (network.type === kimchi.NETWORK_TYPE_MACVTAP) { network.interface = $("#networkDestinationID").val(); - network.vlan_id = parseInt($("#networkVlanID").val()); + } + if (network.type === kimchi.NETWORK_TYPE_BRIDGED) { + network.interface = $("#networkDestinationID").val(); + if (network.interface === 'nic' || network.interface === 'bonding') { + network.vlan_id = parseInt($("#networkVlanID").val()); + } }
The VLAN information is associated with a macvtap bridge not with a Linux brigde.
The current bridged UI (ie, macvtap) needs to keep the same.
We will only add a new option "Linux bridged" which will also list the interface combo box but without the VLAN configuration.
return network; }; @@ -147,14 +112,26 @@ kimchi.setupNetworkFormEvent = function() { $("#networkName").toggleClass("invalid-field", !$("#networkName").val().match(/^[^\"\/]+$/)); kimchi.updateNetworkFormButton(); }); - $('#networkType').on('change', function() { - var selectedType = $(this).val(); + + $('#networkType, #networkDestinationID').on('change', function() { + var selectedType = $("#networkType").val(); + var selectedDestination = $("#networkDestinationID").val(); if(selectedType == 'isolated' || selectedType == 'nat') { - kimchi.enableBridgeOptions(false); - } else if (selectedType == 'macvtap') { - kimchi.enableBridgeOptions(true); + kimchi.enableBridgeOptions2(false); + } else { + kimchi.enableBridgeOptions2(true, selectedType, selectedDestination); } + }); + + $('#networkType').on('change', function() { + var selectedType = $("#networkType").val(); + if(selectedType === kimchi.NETWORK_TYPE_MACVTAP) { + kimchi.loadInterfaces(new Array("nic", "bonding")); + } else { + kimchi.loadInterfaces(); + } + }); };
kimchi.updateNetworkFormButton = function() { @@ -164,3 +141,62 @@ kimchi.updateNetworkFormButton = function() { $("#networkFormOk").button("enable"); } }; + +kimchi.enableBridgeOptions2 = function(enable, networkType, networkDestination) { + $("#enableVlan").prop("checked", false); + $("#networkVlanID").val(""); + $('#vlan').hide(); + if (enable) { + $('#bridgedContent').slideDown(300); + $('#enableVlan').prop("disabled", false); + $('#networkVlanID').prop("disabled", true); + if (networkType === kimchi.NETWORK_TYPE_BRIDGED && (networkDestination === 'nic' || networkDestination === 'bonding')) { + $('#vlan').show(); + } + } else { + $('#bridgedContent').slideUp(300); + $('#enableVlan').prop("disabled", true); + $('#networkVlanID').prop("disabled", true); + }; + +}; + +kimchi.loadInterfaces = function(interfaceFilterArray) { + kimchi.getInterfaces(function(result) { + + var options = []; + $selectDestination = $('#networkDestinationID'); + var nics = {}; + $('#networkDestinationID').find('option').remove(); + var selectDestinationOptionHTML = ''; + for (var i = 0; i < result.length; i++) { + if (typeof interfaceFilterArray === 'undefined') { + options.push({label:result[i].name,value:result[i].name}); + nics[result[i].name] = result[i]; + selectDestinationOptionHTML += '<option value="'+ result[i].name + '">' + result[i].name + '</option>'; + } else { + for (var k = 0; k < interfaceFilterArray.length; k++) { + if (result[i].type == interfaceFilterArray[k]) { + options.push({label:result[i].name,value:result[i].name}); + nics[result[i].name] = result[i]; + selectDestinationOptionHTML += '<option value="'+ result[i].name + '">' + result[i].name + '</option>'; + } + } + } + + } + $selectDestination.append(selectDestinationOptionHTML); + $('#networkDestinationID').selectpicker('refresh'); + onChange = function() { + if (result.length>0 && $selectDestination.val() !== "") { + $("#enableVlan").prop("disabled",false); + $("#networkVlanID").val(""); + } else { + $("#enableVlan").prop("disabled",true); + } + }; + kimchi.setDefaultNetworkType(result.length!==0); + onChange(); + }); +}; + diff --git a/ui/pages/network-add.html.tmpl b/ui/pages/network-add.html.tmpl index 7158b75..b1f3e21 100644 --- a/ui/pages/network-add.html.tmpl +++ b/ui/pages/network-add.html.tmpl @@ -41,6 +41,7 @@ <option value="isolated">$_("Isolated: no external network connection")</option> <option value="nat">$_("NAT: outbound physical network connection only")</option> <option value="macvtap">$_("Bridged: Virtual machines are connected to physical network directly")</option>
+ <option value="bridge">$_("Linux bridges and OVS bridges")</option>
Please, use: "Linux bridged: Virtual machines are connected through a network bridge"
</select> </div> <div id="networkBriDisabledLabel" class="form-group hidden"> @@ -52,7 +53,7 @@ <select id="networkDestinationID" class="selectpicker col-md-12 col-lg-12"> </select> </div> - <div class="form-group"> + <div class="form-group" id="vlan"> <input id="enableVlan" class="wok-checkbox" type="checkbox" value="" /> <label for="enableVlan" id="labelEnableVlan">$_("Enable VLAN") </label> <div id="vlan-enabled">
Also every time, I change the network type on combo box a new warning message about the Network Manager is appended in the dialog. It happened to have 4 messages in a time.

On 02/04/2016 12:38 PM, Peter Pennings wrote:
Hi Aline,
*- Why did you rename the function name to 'enableBridgedOptions2' ?*
Sorry, my mistake, I will replace the name of this function.
*- The VLAN information is associated with a macvtap bridge not with a Linux brigde.* *- We will only add a new option "Linux bridged" which will also list the interface combo box but without the VLAN configuration.* * * I followed this specification: https://github.com/kimchi-project/kimchi/issues/791. Maybe I understood something wrong. Should I show de VLAN information for macvtap?
Sorry, you are correct! But either way, I am not able to set a VLAN when selecting the Linux bridge option.
*- Please, use: "Linux bridged: Virtual machines are connected through a network bridge"* * * Ok, I will do it.
2016-02-04 11:18 GMT-02:00 Aline Manera <alinefm@linux.vnet.ibm.com <mailto:alinefm@linux.vnet.ibm.com>>:
On 02/03/2016 02:41 PM, peterpnns@gmail.com <mailto:peterpnns@gmail.com> wrote:
From: peterpennings<peterpnns@gmail.com> <mailto:peterpnns@gmail.com>
This commit adds the new UI changes for network bridges and enables OVS bridges that where temporary hidden
Signed-off-by: peterpennings<peterpnns@gmail.com> <mailto:peterpnns@gmail.com> --- netinfo.py | 3 +- ui/js/src/kimchi.network.js | 2 + ui/js/src/kimchi.network_add_main.js | 146 ++++++++++++++++++++++------------- ui/pages/network-add.html.tmpl | 3 +- 4 files changed, 96 insertions(+), 58 deletions(-)
diff --git a/netinfo.py b/netinfo.py index 2d83466..c00f603 100644 --- a/netinfo.py +++ b/netinfo.py @@ -221,8 +221,7 @@ def is_bare_nic(iface): # a slave of bond. # The bridge will not be exposed when all it's port are tap. def all_favored_interfaces(): - return list(set(aggregated_bridges() + bare_nics() + bondings()) - - set(ovs_bridges())) + return aggregated_bridges() + bare_nics() + bondings()
def get_interface_type(iface): diff --git a/ui/js/src/kimchi.network.js b/ui/js/src/kimchi.network.js index 923aeb9..96c3fea 100644 --- a/ui/js/src/kimchi.network.js +++ b/ui/js/src/kimchi.network.js @@ -17,6 +17,8 @@ */
kimchi.NETWORK_TYPE_MACVTAP = "macvtap"; +kimchi.NETWORK_TYPE_BRIDGED = "bridge"; +
kimchi.initNetwork = function() { if(wok.tabMode['network'] === 'admin') { diff --git a/ui/js/src/kimchi.network_add_main.js b/ui/js/src/kimchi.network_add_main.js index 76d436f..603a5ee 100644 --- a/ui/js/src/kimchi.network_add_main.js +++ b/ui/js/src/kimchi.network_add_main.js @@ -31,20 +31,20 @@ kimchi.startNetworkCreation = function() { var network = kimchi.getNetworkDialogValues(); var data = { name :network.name <http://network.name>, - connection: network.type + connection: network.type, + interface: network.interface, + vlan_id: network.vlan_id }; - if (network.type === kimchi.NETWORK_TYPE_MACVTAP) { - data.connection = "macvtap"; - data.interface = network.interface; - if ($("#enableVlan").prop("checked")) { + + if (network.type === kimchi.NETWORK_TYPE_BRIDGED && $("#enableVlan").prop("checked")) { data.vlan_id = network.vlan_id; if (!(data.vlan_id >=1 && data.vlan_id <= 4094)) { wok.message.error.code('KCHNET6001E'); errorCallback(); return; } - } } + kimchi.createNetwork(data, function(result) { network.state = result.state === "active" ? "up" : "down"; network.interface = result.interface ? result.interface : i18n["KCHNET6001M"]; @@ -59,30 +59,8 @@ kimchi.startNetworkCreation = function() { };
kimchi.openNetworkDialog = function(okCallback) { - kimchi.getInterfaces(function(result) { - var options = []; - $selectDestination = $('#networkDestinationID'); - var nics = {}; - var selectDestinationOptionHTML = ''; - for (var i = 0; i < result.length; i++) { - options.push({label:result[i].name,value:result[i].name}); - nics[result[i].name] = result[i]; - selectDestinationOptionHTML += '<option value="'+ result[i].name + '">' + result[i].name + '</option>'; - } - $selectDestination.append(selectDestinationOptionHTML); - $selectDestination.selectpicker(); - onChange = function() { - if (result.length>0 && $selectDestination.val() !== "") { - $("#enableVlan").prop("disabled",false); - $("#networkVlanID").val(""); - } else { - $("#enableVlan").prop("disabled",true); - } - }; - $("#networkDestinationID").on("change", onChange); - kimchi.setDefaultNetworkType(result.length!==0); - onChange(); - }); + kimchi.loadInterfaces(); + $("#networkFormOk").on("click", function() { $("#networkFormOk").button("disable"); $("#networkName").prop("readonly", "readonly"); @@ -98,28 +76,10 @@ kimchi.openNetworkDialog = function(okCallback) { }); }; -kimchi.enableBridgeOptions = function(enable) { - $(" <mailto:%29;@@-98,28+76,10@@kimchi.openNetworkDialog=function%28okCallback%29%7B%7D%29;%7D;-kimchi.enableBridgeOptions=function%28enable%29%7B-$%28>#enableVlan").prop("checked", false); - $("#networkVlanID").val(""); - if (enable) { - $('#bridgedContent').slideDown(300); - $('#enableVlan').prop("disabled", false); - $('#networkVlanID').prop("disabled", true); - } else { - $('#bridgedContent').slideUp(300); - $('#enableVlan').prop("disabled", true); - $('#networkVlanID').prop("disabled", true); - } -}; - - kimchi.setDefaultNetworkType = function(isInterfaceAvail) { - $("#networkType").val('macvtap', isInterfaceAvail); - $("#networkType option:contains('bridged')").prop("disabled", !isInterfaceAvail); - $("#networkType").val('nat', !isInterfaceAvail); $("#networkType").selectpicker(); if (!isInterfaceAvail) {
- kimchi.enableBridgeOptions(false); + kimchi.enableBridgeOptions2(false);
Why did you rename the function name to 'enableBridgedOptions*2*' ?
$("#networkBriDisabledLabel").removeClass('hidden'); } else { if (kimchi.capabilities && kimchi.capabilities.nm_running) { @@ -136,7 +96,12 @@ kimchi.getNetworkDialogValues = function() { }; if (network.type === kimchi.NETWORK_TYPE_MACVTAP) { network.interface = $("#networkDestinationID").val(); - network.vlan_id = parseInt($("#networkVlanID").val()); + } + if (network.type === kimchi.NETWORK_TYPE_BRIDGED) { + network.interface = $("#networkDestinationID").val(); + if (network.interface === 'nic' || network.interface === 'bonding') { + network.vlan_id = parseInt($("#networkVlanID").val()); + } }
The VLAN information is associated with a macvtap bridge not with a Linux brigde.
The current bridged UI (ie, macvtap) needs to keep the same.
We will only add a new option "Linux bridged" which will also list the interface combo box but without the VLAN configuration.
return network; }; @@ -147,14 +112,26 @@ kimchi.setupNetworkFormEvent = function() { $("#networkName").toggleClass("invalid-field", !$("#networkName").val().match(/^[^\"\/]+$/)); kimchi.updateNetworkFormButton(); }); - $('#networkType').on('change', function() { - var selectedType = $(this).val(); + + $('#networkType, #networkDestinationID').on('change', function() { + var selectedType = $("#networkType").val(); + var selectedDestination = $("#networkDestinationID").val(); if(selectedType == 'isolated' || selectedType == 'nat') { - kimchi.enableBridgeOptions(false); - } else if (selectedType == 'macvtap') { - kimchi.enableBridgeOptions(true); + kimchi.enableBridgeOptions2(false); + } else { + kimchi.enableBridgeOptions2(true, selectedType, selectedDestination); } + }); + + $('#networkType').on('change', function() { + var selectedType = $("#networkType").val(); + if(selectedType === kimchi.NETWORK_TYPE_MACVTAP) { + kimchi.loadInterfaces(new Array("nic", "bonding")); + } else { + kimchi.loadInterfaces(); + } + }); };
kimchi.updateNetworkFormButton = function() { @@ -164,3 +141,62 @@ kimchi.updateNetworkFormButton = function() { $("#networkFormOk").button("enable"); } }; + +kimchi.enableBridgeOptions2 = function(enable, networkType, networkDestination) { + $("#enableVlan").prop("checked", false); + $("#networkVlanID").val(""); + $('#vlan').hide(); + if (enable) { + $('#bridgedContent').slideDown(300); + $('#enableVlan').prop("disabled", false); + $('#networkVlanID').prop("disabled", true); + if (networkType === kimchi.NETWORK_TYPE_BRIDGED && (networkDestination === 'nic' || networkDestination === 'bonding')) { + $('#vlan').show(); + } + } else { + $('#bridgedContent').slideUp(300); + $('#enableVlan').prop("disabled", true); + $('#networkVlanID').prop("disabled", true); + }; + +}; + +kimchi.loadInterfaces = function(interfaceFilterArray) { + kimchi.getInterfaces(function(result) { + + var options = []; + $selectDestination = $('#networkDestinationID'); + var nics = {}; + $('#networkDestinationID').find('option').remove(); + var selectDestinationOptionHTML = ''; + for (var i = 0; i < result.length; i++) { + if (typeof interfaceFilterArray === 'undefined') { + options.push({label:result[i].name,value:result[i].name}); + nics[result[i].name] = result[i]; + selectDestinationOptionHTML += '<option value="'+ result[i].name + '">' + result[i].name + '</option>'; + } else { + for (var k = 0; k < interfaceFilterArray.length; k++) { + if (result[i].type == interfaceFilterArray[k]) { + options.push({label:result[i].name,value:result[i].name}); + nics[result[i].name] = result[i]; + selectDestinationOptionHTML += '<option value="'+ result[i].name + '">' + result[i].name + '</option>'; + } + } + } + + } + $selectDestination.append(selectDestinationOptionHTML); + $('#networkDestinationID').selectpicker('refresh'); + onChange = function() { + if (result.length>0 && $selectDestination.val() !== "") { + $("#enableVlan").prop("disabled",false); + $("#networkVlanID").val(""); + } else { + $("#enableVlan").prop("disabled",true); + } + }; + kimchi.setDefaultNetworkType(result.length!==0); + onChange(); + }); +}; + diff --git a/ui/pages/network-add.html.tmpl b/ui/pages/network-add.html.tmpl index 7158b75..b1f3e21 100644 --- a/ui/pages/network-add.html.tmpl +++ b/ui/pages/network-add.html.tmpl @@ -41,6 +41,7 @@ <option value="isolated">$_("Isolated: no external network connection")</option> <option value="nat">$_("NAT: outbound physical network connection only")</option> <option value="macvtap">$_("Bridged: Virtual machines are connected to physical network directly")</option>
+ <option value="bridge">$_("Linux bridges and OVS bridges")</option>
Please, use: "Linux bridged: Virtual machines are connected through a network bridge"
</select> </div> <div id="networkBriDisabledLabel" class="form-group hidden"> @@ -52,7 +53,7 @@ <select id="networkDestinationID" class="selectpicker col-md-12 col-lg-12"> </select> </div> - <div class="form-group"> + <div class="form-group" id="vlan"> <input id="enableVlan" class="wok-checkbox" type="checkbox" value="" /> <label for="enableVlan" id="labelEnableVlan">$_("Enable VLAN") </label> <div id="vlan-enabled">
Also every time, I change the network type on combo box a new warning message about the Network Manager is appended in the dialog. It happened to have 4 messages in a time.

On 04-02-2016 12:38, Peter Pennings wrote:
*- Please, use: "Linux bridged: Virtual machines are connected through a network bridge"* * * Ok, I will do it.
Since bridged will also be used for OVS bridges, I believe it's better to use: "Bridged: Virtual machines are connected through a network bridge" -- Lucio Correia Software Engineer IBM LTC Brazil

I will run some tests now with this and send more comments afterwards. Here are my review comments. Additional comments in the code. There are some whitespace errors appliying this patch: /home/lucio/ibm/projects/kimchi-ginger/src/public/wok/.git/modules/src/wok/plugins/kimchi/rebase-apply/patch:159: trailing whitespace. kimchi.enableBridgeOptions2(true, selectedType, selectedDestination); /home/lucio/ibm/projects/kimchi-ginger/src/public/wok/.git/modules/src/wok/plugins/kimchi/rebase-apply/patch:161: trailing whitespace. /home/lucio/ibm/projects/kimchi-ginger/src/public/wok/.git/modules/src/wok/plugins/kimchi/rebase-apply/patch:171: trailing whitespace. }); /home/lucio/ibm/projects/kimchi-ginger/src/public/wok/.git/modules/src/wok/plugins/kimchi/rebase-apply/patch:183: trailing whitespace. $('#vlan').hide(); /home/lucio/ibm/projects/kimchi-ginger/src/public/wok/.git/modules/src/wok/plugins/kimchi/rebase-apply/patch:190: trailing whitespace. } warning: squelched 5 whitespace errors warning: 10 lines add whitespace errors. On 03-02-2016 14:41, peterpnns@gmail.com wrote:
From: peterpennings <peterpnns@gmail.com>
This commit adds the new UI changes for network bridges and enables OVS bridges that where temporary hidden
Signed-off-by: peterpennings <peterpnns@gmail.com> --- netinfo.py | 3 +- ui/js/src/kimchi.network.js | 2 + ui/js/src/kimchi.network_add_main.js | 146 ++++++++++++++++++++++------------- ui/pages/network-add.html.tmpl | 3 +- 4 files changed, 96 insertions(+), 58 deletions(-)
diff --git a/netinfo.py b/netinfo.py index 2d83466..c00f603 100644 --- a/netinfo.py +++ b/netinfo.py @@ -221,8 +221,7 @@ def is_bare_nic(iface): # a slave of bond. # The bridge will not be exposed when all it's port are tap. def all_favored_interfaces(): - return list(set(aggregated_bridges() + bare_nics() + bondings()) - - set(ovs_bridges())) + return aggregated_bridges() + bare_nics() + bondings()
def get_interface_type(iface): diff --git a/ui/js/src/kimchi.network.js b/ui/js/src/kimchi.network.js index 923aeb9..96c3fea 100644 --- a/ui/js/src/kimchi.network.js +++ b/ui/js/src/kimchi.network.js @@ -17,6 +17,8 @@ */
kimchi.NETWORK_TYPE_MACVTAP = "macvtap"; +kimchi.NETWORK_TYPE_BRIDGED = "bridge"; "bridged" would be better here
+
kimchi.initNetwork = function() { if(wok.tabMode['network'] === 'admin') { diff --git a/ui/js/src/kimchi.network_add_main.js b/ui/js/src/kimchi.network_add_main.js index 76d436f..603a5ee 100644 --- a/ui/js/src/kimchi.network_add_main.js +++ b/ui/js/src/kimchi.network_add_main.js @@ -31,20 +31,20 @@ kimchi.startNetworkCreation = function() { var network = kimchi.getNetworkDialogValues(); var data = { name : network.name, - connection: network.type + connection: network.type, + interface: network.interface, + vlan_id: network.vlan_id }; - if (network.type === kimchi.NETWORK_TYPE_MACVTAP) { - data.connection = "macvtap"; - data.interface = network.interface; - if ($("#enableVlan").prop("checked")) { + + if (network.type === kimchi.NETWORK_TYPE_BRIDGED && $("#enableVlan").prop("checked")) { data.vlan_id = network.vlan_id; 2 levels of indentation here... please reduce to 1
if (!(data.vlan_id >=1 && data.vlan_id <= 4094)) { wok.message.error.code('KCHNET6001E'); errorCallback(); return; } - } } + kimchi.createNetwork(data, function(result) { network.state = result.state === "active" ? "up" : "down"; network.interface = result.interface ? result.interface : i18n["KCHNET6001M"]; @@ -59,30 +59,8 @@ kimchi.startNetworkCreation = function() { };
kimchi.openNetworkDialog = function(okCallback) { - kimchi.getInterfaces(function(result) { - var options = []; - $selectDestination = $('#networkDestinationID'); - var nics = {}; - var selectDestinationOptionHTML = ''; - for (var i = 0; i < result.length; i++) { - options.push({label:result[i].name,value:result[i].name}); - nics[result[i].name] = result[i]; - selectDestinationOptionHTML += '<option value="'+ result[i].name + '">' + result[i].name + '</option>'; - } - $selectDestination.append(selectDestinationOptionHTML); - $selectDestination.selectpicker(); - onChange = function() { - if (result.length>0 && $selectDestination.val() !== "") { - $("#enableVlan").prop("disabled",false); - $("#networkVlanID").val(""); - } else { - $("#enableVlan").prop("disabled",true); - } - }; - $("#networkDestinationID").on("change", onChange); - kimchi.setDefaultNetworkType(result.length!==0); - onChange(); - }); + kimchi.loadInterfaces(); + $("#networkFormOk").on("click", function() { $("#networkFormOk").button("disable"); $("#networkName").prop("readonly", "readonly"); @@ -98,28 +76,10 @@ kimchi.openNetworkDialog = function(okCallback) { }); };
-kimchi.enableBridgeOptions = function(enable) { - $("#enableVlan").prop("checked", false); - $("#networkVlanID").val(""); - if (enable) { - $('#bridgedContent').slideDown(300); - $('#enableVlan').prop("disabled", false); - $('#networkVlanID').prop("disabled", true); - } else { - $('#bridgedContent').slideUp(300); - $('#enableVlan').prop("disabled", true); - $('#networkVlanID').prop("disabled", true); - } -}; - - kimchi.setDefaultNetworkType = function(isInterfaceAvail) { - $("#networkType").val('macvtap', isInterfaceAvail); - $("#networkType option:contains('bridged')").prop("disabled", !isInterfaceAvail); - $("#networkType").val('nat', !isInterfaceAvail); $("#networkType").selectpicker(); if (!isInterfaceAvail) { - kimchi.enableBridgeOptions(false); + kimchi.enableBridgeOptions2(false); $("#networkBriDisabledLabel").removeClass('hidden'); } else { if (kimchi.capabilities && kimchi.capabilities.nm_running) { @@ -136,7 +96,12 @@ kimchi.getNetworkDialogValues = function() { }; if (network.type === kimchi.NETWORK_TYPE_MACVTAP) { network.interface = $("#networkDestinationID").val(); - network.vlan_id = parseInt($("#networkVlanID").val()); + } + if (network.type === kimchi.NETWORK_TYPE_BRIDGED) { + network.interface = $("#networkDestinationID").val(); + if (network.interface === 'nic' || network.interface === 'bonding') { + network.vlan_id = parseInt($("#networkVlanID").val()); + } } return network; }; @@ -147,14 +112,26 @@ kimchi.setupNetworkFormEvent = function() { $("#networkName").toggleClass("invalid-field", !$("#networkName").val().match(/^[^\"\/]+$/)); kimchi.updateNetworkFormButton(); }); - $('#networkType').on('change', function() { - var selectedType = $(this).val(); + + $('#networkType, #networkDestinationID').on('change', function() { + var selectedType = $("#networkType").val(); + var selectedDestination = $("#networkDestinationID").val(); if(selectedType == 'isolated' || selectedType == 'nat') { - kimchi.enableBridgeOptions(false); - } else if (selectedType == 'macvtap') { - kimchi.enableBridgeOptions(true); + kimchi.enableBridgeOptions2(false); + } else { + kimchi.enableBridgeOptions2(true, selectedType, selectedDestination); } + }); + + $('#networkType').on('change', function() { + var selectedType = $("#networkType").val(); + if(selectedType === kimchi.NETWORK_TYPE_MACVTAP) { + kimchi.loadInterfaces(new Array("nic", "bonding")); + } else { + kimchi.loadInterfaces(); + } + }); };
kimchi.updateNetworkFormButton = function() { @@ -164,3 +141,62 @@ kimchi.updateNetworkFormButton = function() { $("#networkFormOk").button("enable"); } }; + +kimchi.enableBridgeOptions2 = function(enable, networkType, networkDestination) { + $("#enableVlan").prop("checked", false); + $("#networkVlanID").val(""); + $('#vlan').hide(); + if (enable) { + $('#bridgedContent').slideDown(300); + $('#enableVlan').prop("disabled", false); + $('#networkVlanID').prop("disabled", true); + if (networkType === kimchi.NETWORK_TYPE_BRIDGED && (networkDestination === 'nic' || networkDestination === 'bonding')) { + $('#vlan').show(); + } + } else { + $('#bridgedContent').slideUp(300); + $('#enableVlan').prop("disabled", true); + $('#networkVlanID').prop("disabled", true); + }; + +}; + +kimchi.loadInterfaces = function(interfaceFilterArray) { + kimchi.getInterfaces(function(result) { + + var options = []; + $selectDestination = $('#networkDestinationID'); + var nics = {}; + $('#networkDestinationID').find('option').remove(); + var selectDestinationOptionHTML = ''; + for (var i = 0; i < result.length; i++) { + if (typeof interfaceFilterArray === 'undefined') { + options.push({label:result[i].name,value:result[i].name}); + nics[result[i].name] = result[i]; + selectDestinationOptionHTML += '<option value="'+ result[i].name + '">' + result[i].name + '</option>'; + } else { + for (var k = 0; k < interfaceFilterArray.length; k++) { + if (result[i].type == interfaceFilterArray[k]) { + options.push({label:result[i].name,value:result[i].name}); + nics[result[i].name] = result[i]; + selectDestinationOptionHTML += '<option value="'+ result[i].name + '">' + result[i].name + '</option>'; + } + } + } + + } + $selectDestination.append(selectDestinationOptionHTML); + $('#networkDestinationID').selectpicker('refresh'); + onChange = function() { + if (result.length>0 && $selectDestination.val() !== "") { + $("#enableVlan").prop("disabled",false); + $("#networkVlanID").val(""); + } else { + $("#enableVlan").prop("disabled",true); + } + }; + kimchi.setDefaultNetworkType(result.length!==0); + onChange(); + }); +}; + diff --git a/ui/pages/network-add.html.tmpl b/ui/pages/network-add.html.tmpl index 7158b75..b1f3e21 100644 --- a/ui/pages/network-add.html.tmpl +++ b/ui/pages/network-add.html.tmpl @@ -41,6 +41,7 @@ <option value="isolated">$_("Isolated: no external network connection")</option> <option value="nat">$_("NAT: outbound physical network connection only")</option> <option value="macvtap">$_("Bridged: Virtual machines are connected to physical network directly")</option> + <option value="bridge">$_("Linux bridges and OVS bridges")</option>
Please update descriptions here and use "bridged" for last option value=
</select> </div> <div id="networkBriDisabledLabel" class="form-group hidden"> @@ -52,7 +53,7 @@ <select id="networkDestinationID" class="selectpicker col-md-12 col-lg-12"> </select> </div> - <div class="form-group"> + <div class="form-group" id="vlan"> <input id="enableVlan" class="wok-checkbox" type="checkbox" value="" /> <label for="enableVlan" id="labelEnableVlan">$_("Enable VLAN") </label> <div id="vlan-enabled">
-- Lucio Correia Software Engineer IBM LTC Brazil

On 04-02-2016 15:38, Lucio Correia wrote:
<option value="isolated">$_("Isolated: no external network connection")</option> <option value="nat">$_("NAT: outbound physical network connection only")</option> <option value="macvtap">$_("Bridged: Virtual machines are connected to physical network directly")</option> + <option value="bridge">$_("Linux bridges and OVS bridges")</option>
Please update descriptions here and use "bridged" for last option value=
For clarification: "macvtap: Virtual machines are connected to physical network directly" "bridged: Virtual machines are connected through a network bridge" -- Lucio Correia Software Engineer IBM LTC Brazil

On 04-02-2016 15:38, Lucio Correia wrote:
I will run some tests now with this and send more comments afterwards. Here are my review comments. Additional comments in the code.
The only problem I noticed is that VLAN form is not being showed when I select Linux and OVS bridges. -- Lucio Correia Software Engineer IBM LTC Brazil

I followed bellow specifications, the VLAN form should be showed when a NIC or bonding is selected. Is that not being showed? https://github.com/kimchi-project/kimchi/issues/791 *Bridged option new behaviour:* 1) Change description of "Bridged" option to refer to Linux bridges and OVS bridges (no more direct connections) 2) When "Bridged" is selected, "Destination" will show all the interfaces it currently shows plus OVS bridges *3) "Enable VLAN" will only be showed if user selects a NIC or bonding from "Destination" pop-up* (alternatively, we can show it always and block the usage of VLAN with NIC or bonding selected) 4) "Bridged" option will call network_create API with "bridge" as value for "connection" parameter *New macvtap option:* 5) Add a new option "macvtap" to Network Type, with same current description of today's Bridged option 6) When macvtap option is selected, "Destination" will show only NICs and bondings. It will NOT show any kind of bridges anymore. *7) "Enable VLAN" option is NOT showed* 8) macvtap option will call network create API with "macvtap" as "connection" parameter value. I will send a V2 patch with the others corrections (function name and alert messages). If V1 patch is not according with the above specifications, please, let me know, then I can fix it. Thanks Peter 2016-02-04 16:50 GMT-02:00 Lucio Correia <luciojhc@linux.vnet.ibm.com>:
On 04-02-2016 15:38, Lucio Correia wrote:
I will run some tests now with this and send more comments afterwards. Here are my review comments. Additional comments in the code.
The only problem I noticed is that VLAN form is not being showed when I select Linux and OVS bridges.
-- Lucio Correia Software Engineer IBM LTC Brazil
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org http://lists.ovirt.org/mailman/listinfo/kimchi-devel

Hi Peter, Even selecting a NIC interface, the VLAN option is not being displayed for a Bridged network. You can try it by yourself too. On 02/05/2016 09:18 AM, Peter Pennings wrote:
I followed bellow specifications, the VLAN form should be showed when a NIC or bonding is selected. Is that not being showed?
https://github.com/kimchi-project/kimchi/issues/791
*Bridged option new behaviour:* 1) Change description of "Bridged" option to refer to Linux bridges and OVS bridges (no more direct connections) 2) When "Bridged" is selected, "Destination" will show all the interfaces it currently shows plus OVS bridges *3) "Enable VLAN" will only be showed if user selects a NIC or bonding from "Destination" pop-up*(alternatively, we can show it always and block the usage of VLAN with NIC or bonding selected) 4) "Bridged" option will call network_create API with "bridge" as value for "connection" parameter
*New macvtap option:* 5) Add a new option "macvtap" to Network Type, with same current description of today's Bridged option 6) When macvtap option is selected, "Destination" will show only NICs and bondings. It will NOT show any kind of bridges anymore. *7) "Enable VLAN" option is NOT showed* 8) macvtap option will call network create API with "macvtap" as "connection" parameter value.
I will send a V2 patch with the others corrections (function name and alert messages). If V1 patch is not according with the above specifications, please, let me know, then I can fix it.
Thanks
Peter
2016-02-04 16:50 GMT-02:00 Lucio Correia <luciojhc@linux.vnet.ibm.com <mailto:luciojhc@linux.vnet.ibm.com>>:
On 04-02-2016 15:38, Lucio Correia wrote:
I will run some tests now with this and send more comments afterwards. Here are my review comments. Additional comments in the code.
The only problem I noticed is that VLAN form is not being showed when I select Linux and OVS bridges.
-- Lucio Correia Software Engineer IBM LTC Brazil
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org <mailto:Kimchi-devel@ovirt.org> http://lists.ovirt.org/mailman/listinfo/kimchi-devel
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org http://lists.ovirt.org/mailman/listinfo/kimchi-devel

Hi I'm working on a V2 patch for this issue and I have one doubt. Now, I'm showing the VLAN option when a bridged is selected with a NIC or bonding interface. In this case, the VLAN ID is required or can be empty? I guess backend is validating this and turned this field obrigatory. Thanks Peter 2016-02-05 10:01 GMT-02:00 Aline Manera <alinefm@linux.vnet.ibm.com>:
Hi Peter,
Even selecting a NIC interface, the VLAN option is not being displayed for a Bridged network.
You can try it by yourself too.
On 02/05/2016 09:18 AM, Peter Pennings wrote:
I followed bellow specifications, the VLAN form should be showed when a NIC or bonding is selected. Is that not being showed?
https://github.com/kimchi-project/kimchi/issues/791
*Bridged option new behaviour:* 1) Change description of "Bridged" option to refer to Linux bridges and OVS bridges (no more direct connections) 2) When "Bridged" is selected, "Destination" will show all the interfaces it currently shows plus OVS bridges *3) "Enable VLAN" will only be showed if user selects a NIC or bonding from "Destination" pop-up* (alternatively, we can show it always and block the usage of VLAN with NIC or bonding selected) 4) "Bridged" option will call network_create API with "bridge" as value for "connection" parameter
*New macvtap option:* 5) Add a new option "macvtap" to Network Type, with same current description of today's Bridged option 6) When macvtap option is selected, "Destination" will show only NICs and bondings. It will NOT show any kind of bridges anymore. *7) "Enable VLAN" option is NOT showed* 8) macvtap option will call network create API with "macvtap" as "connection" parameter value.
I will send a V2 patch with the others corrections (function name and alert messages). If V1 patch is not according with the above specifications, please, let me know, then I can fix it.
Thanks
Peter
2016-02-04 16:50 GMT-02:00 Lucio Correia <luciojhc@linux.vnet.ibm.com>:
On 04-02-2016 15:38, Lucio Correia wrote:
I will run some tests now with this and send more comments afterwards. Here are my review comments. Additional comments in the code.
The only problem I noticed is that VLAN form is not being showed when I select Linux and OVS bridges.
-- Lucio Correia Software Engineer IBM LTC Brazil
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org http://lists.ovirt.org/mailman/listinfo/kimchi-devel
_______________________________________________ Kimchi-devel mailing listKimchi-devel@ovirt.orghttp://lists.ovirt.org/mailman/listinfo/kimchi-devel

On 02/05/2016 03:12 PM, Peter Pennings wrote:
Hi
I'm working on a V2 patch for this issue and I have one doubt. Now, I'm showing the VLAN option when a bridged is selected with a NIC or bonding interface. In this case, the VLAN ID is required or can be empty? I guess backend is validating this and turned this field obrigatory.
When VLAN is selected, a VLAN tag is required.
Thanks
Peter
2016-02-05 10:01 GMT-02:00 Aline Manera <alinefm@linux.vnet.ibm.com <mailto:alinefm@linux.vnet.ibm.com>>:
Hi Peter,
Even selecting a NIC interface, the VLAN option is not being displayed for a Bridged network.
You can try it by yourself too.
On 02/05/2016 09:18 AM, Peter Pennings wrote:
I followed bellow specifications, the VLAN form should be showed when a NIC or bonding is selected. Is that not being showed?
https://github.com/kimchi-project/kimchi/issues/791
*Bridged option new behaviour:* 1) Change description of "Bridged" option to refer to Linux bridges and OVS bridges (no more direct connections) 2) When "Bridged" is selected, "Destination" will show all the interfaces it currently shows plus OVS bridges *3) "Enable VLAN" will only be showed if user selects a NIC or bonding from "Destination" pop-up*(alternatively, we can show it always and block the usage of VLAN with NIC or bonding selected) 4) "Bridged" option will call network_create API with "bridge" as value for "connection" parameter
*New macvtap option:* 5) Add a new option "macvtap" to Network Type, with same current description of today's Bridged option 6) When macvtap option is selected, "Destination" will show only NICs and bondings. It will NOT show any kind of bridges anymore. *7) "Enable VLAN" option is NOT showed* 8) macvtap option will call network create API with "macvtap" as "connection" parameter value.
I will send a V2 patch with the others corrections (function name and alert messages). If V1 patch is not according with the above specifications, please, let me know, then I can fix it.
Thanks
Peter
2016-02-04 16:50 GMT-02:00 Lucio Correia <luciojhc@linux.vnet.ibm.com <mailto:luciojhc@linux.vnet.ibm.com>>:
On 04-02-2016 15:38, Lucio Correia wrote:
I will run some tests now with this and send more comments afterwards. Here are my review comments. Additional comments in the code.
The only problem I noticed is that VLAN form is not being showed when I select Linux and OVS bridges.
-- Lucio Correia Software Engineer IBM LTC Brazil
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org <mailto:Kimchi-devel@ovirt.org> http://lists.ovirt.org/mailman/listinfo/kimchi-devel
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org <mailto:Kimchi-devel@ovirt.org> http://lists.ovirt.org/mailman/listinfo/kimchi-devel

Aline, Even when the VLAN checkbox is not selected, the backend is validating the VLAN ID field. If the VLAN ID is required for bridged with nic or bonding interface, I don't see a reason for a checkbox in the UI. 2016-02-05 15:36 GMT-02:00 Aline Manera <alinefm@linux.vnet.ibm.com>:
On 02/05/2016 03:12 PM, Peter Pennings wrote:
Hi
I'm working on a V2 patch for this issue and I have one doubt. Now, I'm showing the VLAN option when a bridged is selected with a NIC or bonding interface. In this case, the VLAN ID is required or can be empty? I guess backend is validating this and turned this field obrigatory.
When VLAN is selected, a VLAN tag is required.
Thanks
Peter
2016-02-05 10:01 GMT-02:00 Aline Manera <alinefm@linux.vnet.ibm.com>:
Hi Peter,
Even selecting a NIC interface, the VLAN option is not being displayed for a Bridged network.
You can try it by yourself too.
On 02/05/2016 09:18 AM, Peter Pennings wrote:
I followed bellow specifications, the VLAN form should be showed when a NIC or bonding is selected. Is that not being showed?
https://github.com/kimchi-project/kimchi/issues/791
*Bridged option new behaviour:* 1) Change description of "Bridged" option to refer to Linux bridges and OVS bridges (no more direct connections) 2) When "Bridged" is selected, "Destination" will show all the interfaces it currently shows plus OVS bridges *3) "Enable VLAN" will only be showed if user selects a NIC or bonding from "Destination" pop-up* (alternatively, we can show it always and block the usage of VLAN with NIC or bonding selected) 4) "Bridged" option will call network_create API with "bridge" as value for "connection" parameter
*New macvtap option:* 5) Add a new option "macvtap" to Network Type, with same current description of today's Bridged option 6) When macvtap option is selected, "Destination" will show only NICs and bondings. It will NOT show any kind of bridges anymore. *7) "Enable VLAN" option is NOT showed* 8) macvtap option will call network create API with "macvtap" as "connection" parameter value.
I will send a V2 patch with the others corrections (function name and alert messages). If V1 patch is not according with the above specifications, please, let me know, then I can fix it.
Thanks
Peter
2016-02-04 16:50 GMT-02:00 Lucio Correia < <luciojhc@linux.vnet.ibm.com> luciojhc@linux.vnet.ibm.com>:
On 04-02-2016 15:38, Lucio Correia wrote:
I will run some tests now with this and send more comments afterwards. Here are my review comments. Additional comments in the code.
The only problem I noticed is that VLAN form is not being showed when I select Linux and OVS bridges.
-- Lucio Correia Software Engineer IBM LTC Brazil
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org http://lists.ovirt.org/mailman/listinfo/kimchi-devel
_______________________________________________ Kimchi-devel mailing listKimchi-devel@ovirt.orghttp://lists.ovirt.org/mailman/listinfo/kimchi-devel

On 02/05/2016 03:57 PM, Peter Pennings wrote:
Aline,
Even when the VLAN checkbox is not selected, the backend is validating the VLAN ID field.
It should not be true! The VLAN ID is not required to create a bridged network.
If the VLAN ID is required for bridged with nic or bonding interface, I don't see a reason for a checkbox in the UI.
2016-02-05 15:36 GMT-02:00 Aline Manera <alinefm@linux.vnet.ibm.com <mailto:alinefm@linux.vnet.ibm.com>>:
On 02/05/2016 03:12 PM, Peter Pennings wrote:
Hi
I'm working on a V2 patch for this issue and I have one doubt. Now, I'm showing the VLAN option when a bridged is selected with a NIC or bonding interface. In this case, the VLAN ID is required or can be empty? I guess backend is validating this and turned this field obrigatory.
When VLAN is selected, a VLAN tag is required.
Thanks
Peter
2016-02-05 10:01 GMT-02:00 Aline Manera <alinefm@linux.vnet.ibm.com <mailto:alinefm@linux.vnet.ibm.com>>:
Hi Peter,
Even selecting a NIC interface, the VLAN option is not being displayed for a Bridged network.
You can try it by yourself too.
On 02/05/2016 09:18 AM, Peter Pennings wrote:
I followed bellow specifications, the VLAN form should be showed when a NIC or bonding is selected. Is that not being showed?
https://github.com/kimchi-project/kimchi/issues/791
*Bridged option new behaviour:* 1) Change description of "Bridged" option to refer to Linux bridges and OVS bridges (no more direct connections) 2) When "Bridged" is selected, "Destination" will show all the interfaces it currently shows plus OVS bridges *3) "Enable VLAN" will only be showed if user selects a NIC or bonding from "Destination" pop-up*(alternatively, we can show it always and block the usage of VLAN with NIC or bonding selected) 4) "Bridged" option will call network_create API with "bridge" as value for "connection" parameter
*New macvtap option:* 5) Add a new option "macvtap" to Network Type, with same current description of today's Bridged option 6) When macvtap option is selected, "Destination" will show only NICs and bondings. It will NOT show any kind of bridges anymore. *7) "Enable VLAN" option is NOT showed* 8) macvtap option will call network create API with "macvtap" as "connection" parameter value.
I will send a V2 patch with the others corrections (function name and alert messages). If V1 patch is not according with the above specifications, please, let me know, then I can fix it.
Thanks
Peter
2016-02-04 16:50 GMT-02:00 Lucio Correia <luciojhc@linux.vnet.ibm.com <mailto:luciojhc@linux.vnet.ibm.com>>:
On 04-02-2016 15:38, Lucio Correia wrote:
I will run some tests now with this and send more comments afterwards. Here are my review comments. Additional comments in the code.
The only problem I noticed is that VLAN form is not being showed when I select Linux and OVS bridges.
-- Lucio Correia Software Engineer IBM LTC Brazil
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org <mailto:Kimchi-devel@ovirt.org> http://lists.ovirt.org/mailman/listinfo/kimchi-devel
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org <mailto:Kimchi-devel@ovirt.org> http://lists.ovirt.org/mailman/listinfo/kimchi-devel

Applied. Thanks. Regards, Aline Manera
participants (4)
-
Aline Manera
-
Lucio Correia
-
Peter Pennings
-
peterpnns@gmail.com