From mboxrd@z Thu Jan  1 00:00:00 1970
From: Leo Hofmann <hofmann@leo-andres.de>
To: development@lists.ipfire.org
Subject: Re: [PATCH 4/4] zoneconf.cgi: Add Javascript for new GUI elements
Date: Tue, 22 Dec 2020 21:15:04 +0100
Message-ID: <29c6ba21-d0ac-afbb-7fe1-b4ffef67b0b7@leo-andres.de>
In-Reply-To: <20201222200646.1609-4-hofmann@leo-andres.de>
MIME-Version: 1.0
Content-Type: multipart/mixed; boundary="===============8679379742931340652=="
List-Id: <development.lists.ipfire.org>

--===============8679379742931340652==
Content-Type: text/plain; charset="utf-8"
Content-Transfer-Encoding: quoted-printable

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 ri=
ght. 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(a)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) {
>  =20
>   	print <<END
>   		<td class=3D'heading bold $_'>$uc<br>
> -			<select name=3D"MODE $uc">
> +			<select name=3D"MODE $uc" data-zone=3D"$uc" onchange=3D"changeZoneMode(=
this)">
>   				<option value=3D"DEFAULT" $mode_selected{"DEFAULT"}>$Lang::tr{"zoneco=
nf nicmode default"}</option>
>   				<option value=3D"BRIDGE" $mode_selected{"BRIDGE"}>$Lang::tr{"zoneconf=
 nicmode bridge"}</option>
>   				<option value=3D"MACVTAP" $mode_selected{"MACVTAP"}>$Lang::tr{"zoneco=
nf nicmode macvtap"}</option>
> @@ -544,7 +544,7 @@ foreach (@zones) { # load settings and prepare form ele=
ments for each zone
>   	# enable checkbox HTML
>   	my $row_1 =3D <<END
>   		<td>
> -			<input type=3D"checkbox" name=3D"STP-$uc" $disabled $checked>
> +			<input type=3D"checkbox" id=3D"STP-$uc" name=3D"STP-$uc" data-zone=3D"$=
uc" onchange=3D"changeEnableSTP(this)" $disabled $checked>
>   		</td>
>   END
>   ;
> @@ -553,7 +553,7 @@ END
>   	# priority input box HTML
>   	my $row_2 =3D <<END
>   		<td>
> -			<input type=3D"number" class=3D"stp-priority" name=3D"STP-PRIORITY-$uc"=
 min=3D"1" max=3D"65535" value=3D"$stp_priority" $disabled>
> +			<input type=3D"number" class=3D"stp-priority" id=3D"STP-PRIORITY-$uc" n=
ame=3D"STP-PRIORITY-$uc" min=3D"1" max=3D"65535" value=3D"$stp_priority" $dis=
abled>
>   		</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 !=3D=3D 'NONE'));
>   }
> +
> +//update zone mode
> +function changeZoneMode(selectObj) {
> +	if(!(selectObj && ('zone' in selectObj.dataset))) {
> +		return; //required parameters are missing
> +	}
> +
> +	// STP enable checkbox
> +	let stpEnable =3D document.getElementById('STP-' + selectObj.dataset.zone=
);
> +	if(stpEnable) {
> +		stpEnable.disabled =3D (selectObj.value !=3D=3D 'BRIDGE'); //STP is avai=
lable if zone is in bridge mode
> +		stpEnable.checked =3D 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 =3D document.getElementById('STP-PRIORITY-' + inputObj.datas=
et.zone);
> +	if(priority) {
> +		priority.disabled =3D inputObj.disabled || (! inputObj.checked);
> +	}
> +}

--===============8679379742931340652==--