Re: [PATCH 4/4] zoneconf.cgi: Add Javascript for new GUI elements

Hi Michael,

thank you very much for reviewing my patches! I agree, we should test this thoroughly. I would rather submit new patches than break someones network :)

Regarding your other mail, I looked into moving the "is_zone_active"... functions to the general-functions.pl file. I still need to make sure that these functions are universally applicable, then I will submit them.

Regards, Leo

Am 27.12.2020 um 12:05 schrieb Michael Tremer:

Hi,

This patchset looks good to me, but I would like to hear back from Daniel for some test results :)

Breaking people’s networks would be really bad. So let’s give this a good test.

-Michael

...

On 22 Dec 2020, at 21:15, Leo Hofmann hofmann@leo-andres.de wrote:

Hi Daniel,

just in time for the holidays, I finished my work on the zoneconf.cgi STP GUI. I'm not sure how to test STP in my development setup, but I think I got it right. I would appreciate if you could test these patches, thank you :)

Best regards & happy holidays Leo

Am 22.12.2020 um 21:06 schrieb Leo-Andres Hofmann:

...

Signed-off-by: Leo-Andres Hofmann hofmann@leo-andres.de

html/cgi-bin/zoneconf.cgi | 6 +++--- html/html/include/zoneconf.js | 27 +++++++++++++++++++++++++++ 2 files changed, 30 insertions(+), 3 deletions(-)

diff --git a/html/cgi-bin/zoneconf.cgi b/html/cgi-bin/zoneconf.cgi index 1d30450ed..eb6cd0e66 100644 --- a/html/cgi-bin/zoneconf.cgi +++ b/html/cgi-bin/zoneconf.cgi @@ -410,7 +410,7 @@ foreach (@zones) { print <<END <td class='heading bold $_'>$uc<br>

• 	<select name="MODE $uc">
  

• 	<select name="MODE $uc" data-zone="$uc" onchange="changeZoneMode(this)">
  	<option value="DEFAULT" $mode_selected{"DEFAULT"}>$Lang::tr{"zoneconf nicmode default"}</option>
  	<option value="BRIDGE" $mode_selected{"BRIDGE"}>$Lang::tr{"zoneconf nicmode bridge"}</option>
  	<option value="MACVTAP" $mode_selected{"MACVTAP"}>$Lang::tr{"zoneconf nicmode macvtap"}</option>
  

@@ -544,7 +544,7 @@ foreach (@zones) { # load settings and prepare form elements for each zone # enable checkbox HTML my $row_1 = <<END <td>

• 	<input type="checkbox" name="STP-$uc" $disabled $checked>
  

• 	<input type="checkbox" id="STP-$uc" name="STP-$uc" data-zone="$uc" onchange="changeEnableSTP(this)" $disabled $checked>
  

  </td> END ;

@@ -553,7 +553,7 @@ END # priority input box HTML my $row_2 = <<END <td>

• 	<input type="number" class="stp-priority" name="STP-PRIORITY-$uc" min="1" max="65535" value="$stp_priority" $disabled>
  

• 	<input type="number" class="stp-priority" id="STP-PRIORITY-$uc" name="STP-PRIORITY-$uc" min="1" max="65535" value="$stp_priority" $disabled>
  

  </td> END ;

diff --git a/html/html/include/zoneconf.js b/html/html/include/zoneconf.js index d76f0ab68..d27a79bc8 100644 --- a/html/html/include/zoneconf.js +++ b/html/html/include/zoneconf.js @@ -54,3 +54,30 @@ function highlightAccess(selectObj) { //if interface is assigned, highlight table cell in zone color colorParentCell(selectObj, zoneColor, (selectObj.value !== 'NONE')); }

+//update zone mode +function changeZoneMode(selectObj) {

• if(!(selectObj && ('zone' in selectObj.dataset))) {

• return; //required parameters are missing
  

• }
• // STP enable checkbox
• let stpEnable = document.getElementById('STP-' + selectObj.dataset.zone);
• if(stpEnable) {

• stpEnable.disabled = (selectObj.value !== 'BRIDGE'); //STP is available if zone is in bridge mode
  

• stpEnable.checked = stpEnable.checked && (! stpEnable.disabled); //un-check if disabled
  

• stpEnable.dispatchEvent(new Event('change'));
  

• }

+}

+//STP enable checkbox change toggles priority input +function changeEnableSTP(inputObj) {

• if(!(inputObj && ('zone' in inputObj.dataset))) {

• return; //required parameters are missing
  

• }
• let priority = document.getElementById('STP-PRIORITY-' + inputObj.dataset.zone);
• if(priority) {

• priority.disabled = inputObj.disabled || (! inputObj.checked);
  

• }

+}