From: Stefan Schantl <stefan.schantl@ipfire.org>
Date: Sat, 18 Apr 2015 23:04:14 +0000 (+0200)
Subject: firewall.cgi: Dynamically show/hide DNAT and SNAT configure elements.
X-Git-Url: http://git.ipfire.org/?a=commitdiff_plain;h=90d752a6b3eeb3a49abf9caeb7de5294cd8264ed;p=people%2Fstevee%2Fipfire-2.x.git

firewall.cgi: Dynamically show/hide DNAT and SNAT configure elements.

Fixes #10732.
---

diff --git a/html/cgi-bin/firewall.cgi b/html/cgi-bin/firewall.cgi
index 39b732ce36..6c60fa41be 100644
--- a/html/cgi-bin/firewall.cgi
+++ b/html/cgi-bin/firewall.cgi
@@ -154,6 +154,19 @@ print<<END;
 			\$("#actions").toggle();
 		});
 
+		// Hide SNAT items when DNAT is selected and vice versa.
+		if (\$('input[name=nat]:checked').val() == 'dnat') {
+			\$('.snat').hide();
+		} else {
+			\$('.dnat').hide();
+		}
+
+		// Show/Hide elements when SNAT/DNAT get changed.
+		\$('input[name=nat]').change(function() {
+			\$('.snat').toggle();
+			\$('.dnat').toggle();
+		});
+
 		// Time constraints
 		if(!\$("#USE_TIME_CONSTRAINTS").attr("checked")) {
 			\$("#TIME_CONSTRAINTS").hide();
@@ -1591,7 +1604,7 @@ END
 				$Lang::tr{'fwdfw use nat'}
 			</label>
 			<div class="NAT">
-				<table width='100%' border='0'>
+				<table class='fw-nat' width='100%' border='0'>
 					<tr>
 						<td width='5%'></td>
 						<td width='40%'>
@@ -1603,9 +1616,9 @@ END
 END
 
 	print <<END;
-						<td width='25%' align='right'>$Lang::tr{'dnat address'}:</td>
+						<td width='25%' align='right'><span class='dnat'>$Lang::tr{'dnat address'}:</span></td>
 						<td width='30%'>
-							<select name='dnat' style='width: 100%;'>
+							<select name='dnat' class='dnat' style='width: 100%;'>
 								<option value='AUTO' $selected{'dnat'}{'AUTO'}>- $Lang::tr{'automatic'} -</option>
 								<option value='Default IP' $selected{'dnat'}{'Default IP'}>$Lang::tr{'red1'} ($redip)</option>
 END
@@ -1636,9 +1649,9 @@ END
 								$Lang::tr{'fwdfw snat'}
 							</label>
 						</td>
-						<td width='25%' align='right'>$Lang::tr{'snat new source ip address'}:</td>
+						<td width='25%' align='right'><span class='snat'>$Lang::tr{'snat new source ip address'}:</span></td>
 						<td width='30%'>
-							<select name='snat' style='width: 100%;'>
+							<select name='snat' class='snat' style='width: 100%;'>
 END
 
 		foreach my $alias (sort keys %aliases) {
diff --git a/html/html/themes/darkdos/include/style.css b/html/html/themes/darkdos/include/style.css
index e7140cde88..cc4b3c9653 100644
--- a/html/html/themes/darkdos/include/style.css
+++ b/html/html/themes/darkdos/include/style.css
@@ -366,6 +366,10 @@ min-width: 2.0em;
 max-width: 2.5em;
 }
 
+table.fw-nat tbody tr td {
+	height: 2.25em;
+}
+
 /* LAYOUT - 3 COLUMNS */
 
 	/* Primary content */
diff --git a/html/html/themes/ipfire-legacy/include/style.css b/html/html/themes/ipfire-legacy/include/style.css
index d2c458e510..288a0feeb3 100644
--- a/html/html/themes/ipfire-legacy/include/style.css
+++ b/html/html/themes/ipfire-legacy/include/style.css
@@ -343,6 +343,10 @@ min-width: 2.0em;
 max-width: 2.5em;
 }
 
+table.fw-nat tbody tr td {
+	height: 2.25em;
+}
+
 /* LAYOUT - 3 COLUMNS */
 
 	/* Primary content */
diff --git a/html/html/themes/ipfire/include/css/style.css b/html/html/themes/ipfire/include/css/style.css
index 0e990d6811..e0ac3cd116 100644
--- a/html/html/themes/ipfire/include/css/style.css
+++ b/html/html/themes/ipfire/include/css/style.css
@@ -324,3 +324,7 @@ table {
 .tbl tr:last-child td {
 	border-bottom: 1px solid lightgrey;
 }
+
+table.fw-nat tbody tr td {
+	height: 2.25em;
+}
diff --git a/html/html/themes/maniac/include/style.css b/html/html/themes/maniac/include/style.css
index eca34cb850..3cb2741301 100644
--- a/html/html/themes/maniac/include/style.css
+++ b/html/html/themes/maniac/include/style.css
@@ -372,6 +372,10 @@ min-width: 2.0em;
 max-width: 2.5em;
 }
 
+table.fw-nat tbody tr td {
+	height: 2.25em;
+}
+
 /* LAYOUT - 3 COLUMNS */
 
 	/* Primary content */