Redmine #5994 Make DHCP advanced buttons work consistently

This is the first UI page to be changed so that the Advanced buttons work as specified in Redmine #5994
If this seems like a reasonable way to do it, then I will make similar code for the other UI pages with Advanced buttons.

1 files changed, 148 insertions, 79 deletions

diff --git a/src/usr/local/www/services_dhcp.php b/src/usr/local/www/services_dhcp.php
index 4f0eb6a..c65ccd6 100644
--- a/src/usr/local/www/services_dhcp.php
+++ b/src/usr/local/www/services_dhcp.php
@@ -999,7 +999,7 @@ if (!is_numeric($pool) && !($act == "newpool")) {
 // DDNS
 $btnadv = new Form_Button(
 	'btnadvdns',
-	'Advanced',
+	'Display Advanced',
 	null,
 	'fa-cog'
 );
@@ -1049,7 +1049,7 @@ $section->addInput(new Form_Input(
 // Advanced MAC
 $btnadv = new Form_Button(
 	'btnadvmac',
-	'Advanced',
+	'Display Advanced',
 	null,
 	'fa-cog'
 );
@@ -1078,7 +1078,7 @@ $section->addInput(new Form_Input(
 // Advanced NTP
 $btnadv = new Form_Button(
 	'btnadvntp',
-	'Advanced',
+	'Display Advanced',
 	null,
 	'fa-cog'
 );
@@ -1105,7 +1105,7 @@ $section->addInput(new Form_IpAddress(
 // Advanced TFTP
 $btnadv = new Form_Button(
 	'btnadvtftp',
-	'Advanced',
+	'Display Advanced',
 	null,
 	'fa-cog'
 );
@@ -1126,7 +1126,7 @@ $section->addInput(new Form_IpAddress(
 // Advanced LDAP
 $btnadv = new Form_Button(
 	'btnadvldap',
-	'Advanced',
+	'Display Advanced',
 	null,
 	'fa-cog'
 );
@@ -1150,7 +1150,7 @@ $form->add($section);
 // Advanced Additional options
 $btnadv = new Form_Button(
 	'btnadvopts',
-	'Advanced',
+	'Display Advanced',
 	null,
 	'fa-cog'
 );
@@ -1394,24 +1394,36 @@ events.push(function() {
 	// Show advanced DNS options ======================================================================================
 	var showadvdns = false;
 
-	function show_advdns() {
+	function show_advdns(ispageload) {
+		var text;
+		// On page load decide the initial state based on the data.
+		if (ispageload) {
 <?php
-		if (!$pconfig['ddnsupdate'] && empty($pconfig['ddnsdomain']) && empty($pconfig['ddnsdomainprimary']) &&
-		    empty($pconfig['ddnsdomainkeyname']) && empty($pconfig['ddnsdomainkey'])) {
-			$hide = false;
+			if (!$pconfig['ddnsupdate'] && empty($pconfig['ddnsdomain']) && empty($pconfig['ddnsdomainprimary']) &&
+			    empty($pconfig['ddnsdomainkeyname']) && empty($pconfig['ddnsdomainkey'])) {
+				$showadv = false;
+			} else {
+				$showadv = true;
+			}
+?>
+			showadvdns = <?php if ($showadv) {echo 'true';} else {echo 'false';} ?>;
 		} else {
-			$hide = true;
+			// It was a click, swap the state.
+			showadvdns = !showadvdns;
 		}
-?>
-		var hide = <?php if ($hide) {echo 'true';} else {echo 'false';} ?>;
-
-		hideCheckbox('ddnsupdate', !showadvdns && !hide);
-		hideInput('ddnsdomain', !showadvdns && !hide);
-		hideInput('ddnsdomainprimary', !showadvdns && !hide);
-		hideInput('ddnsdomainkeyname', !showadvdns && !hide);
-		hideInput('ddnsdomainkey', !showadvdns && !hide);
-		hideInput('btnadvdns', hide);
-		showadvdns = !showadvdns;
+
+		hideCheckbox('ddnsupdate', !showadvdns);
+		hideInput('ddnsdomain', !showadvdns);
+		hideInput('ddnsdomainprimary', !showadvdns);
+		hideInput('ddnsdomainkeyname', !showadvdns);
+		hideInput('ddnsdomainkey', !showadvdns);
+
+		if (showadvdns) {
+			text = "<?=gettext('Hide Advanced');?>";
+		} else {
+			text = "<?=gettext('Display Advanced');?>";
+		}
+		$('#btnadvdns').html('<i class="fa fa-cog"></i> ' + text);
 	}
 
 	$('#btnadvdns').prop('type', 'button');
@@ -1420,49 +1432,72 @@ events.push(function() {
 		show_advdns();
 	});
 
- // Show advanced MAC options ======================================================================================
+	// Show advanced MAC options ======================================================================================
 	var showadvmac = false;
 
-	function show_advmac() {
+	function show_advmac(ispageload) {
+		var text;
+		// On page load decide the initial state based on the data.
+		if (ispageload) {
 <?php
-		if (empty($pconfig['mac_allow']) && empty($pconfig['mac_deny'])) {
-			$hide = false;
+			if (empty($pconfig['mac_allow']) && empty($pconfig['mac_deny'])) {
+				$showadv = false;
+			} else {
+				$showadv = true;
+			}
+?>
+			showadvmac = <?php if ($showadv) {echo 'true';} else {echo 'false';} ?>;
 		} else {
-			$hide = true;
+			// It was a click, swap the state.
+			showadvmac = !showadvmac;
 		}
-?>
-		var hide = <?php if ($hide) {echo 'true';} else {echo 'false';} ?>;
 
-		hideInput('mac_allow', !showadvmac && !hide);
-		hideInput('mac_deny', !showadvmac && !hide);
+		hideInput('mac_allow', !showadvmac);
+		hideInput('mac_deny', !showadvmac);
 
-		showadvmac = !showadvmac;
+		if (showadvmac) {
+			text = "<?=gettext('Hide Advanced');?>";
+		} else {
+			text = "<?=gettext('Display Advanced');?>";
+		}
+		$('#btnadvmac').html('<i class="fa fa-cog"></i> ' + text);
 	}
 
 	$('#btnadvmac').prop('type', 'button');
 
 	$('#btnadvmac').click(function(event) {
-		show_advmac(true);
+		show_advmac();
 	});
 
-  // Show advanced NTP options ======================================================================================
+	// Show advanced NTP options ======================================================================================
 	var showadvntp = false;
 
-	function show_advntp() {
+	function show_advntp(ispageload) {
+		var text;
+		// On page load decide the initial state based on the data.
+		if (ispageload) {
 <?php
-		if (empty($pconfig['ntp1']) && empty($pconfig['ntp2'])) {
-			$hide = false;
+			if (empty($pconfig['ntp1']) && empty($pconfig['ntp2'])) {
+				$showadv = false;
+			} else {
+				$showadv = true;
+			}
+?>
+			showadvntp = <?php if ($showadv) {echo 'true';} else {echo 'false';} ?>;
 		} else {
-			$hide = true;
+			// It was a click, swap the state.
+			showadvntp = !showadvntp;
 		}
-?>
-		var hide = <?php if ($hide) {echo 'true';} else {echo 'false';} ?>;
 
-		hideInput('ntp1', !showadvntp && !hide);
-		hideInput('ntp2', !showadvntp && !hide);
-		hideInput('btnadvntp', hide);
+		hideInput('ntp1', !showadvntp);
+		hideInput('ntp2', !showadvntp);
 
-		showadvntp = !showadvntp;
+		if (showadvntp) {
+			text = "<?=gettext('Hide Advanced');?>";
+		} else {
+			text = "<?=gettext('Display Advanced');?>";
+		}
+		$('#btnadvntp').html('<i class="fa fa-cog"></i> ' + text);
 	}
 
 	$('#btnadvntp').prop('type', 'button');
@@ -1471,22 +1506,34 @@ events.push(function() {
 		show_advntp();
 	});
 
-   // Show advanced TFTP options ======================================================================================
-	var showtftp = false;
+	// Show advanced TFTP options ======================================================================================
+	var showadvtftp = false;
 
-	function show_advtftp() {
+	function show_advtftp(ispageload) {
+		var text;
+		// On page load decide the initial state based on the data.
+		if (ispageload) {
 <?php
-		if (empty($pconfig['tftp'])) {
-			$hide = false;
+			if (empty($pconfig['tftp'])) {
+				$showadv = false;
+			} else {
+				$showadv = true;
+			}
+?>
+			showadvtftp = <?php if ($showadv) {echo 'true';} else {echo 'false';} ?>;
 		} else {
-			$hide = true;
+			// It was a click, swap the state.
+			showadvtftp = !showadvtftp;
 		}
-?>
-		var hide = <?php if ($hide) {echo 'true';} else {echo 'false';} ?>;
 
-		hideInput('tftp', !showtftp & !hide);
+		hideInput('tftp', !showadvtftp);
 
-		showtftp = !showtftp;
+		if (showadvtftp) {
+			text = "<?=gettext('Hide Advanced');?>";
+		} else {
+			text = "<?=gettext('Display Advanced');?>";
+		}
+		$('#btnadvtftp').html('<i class="fa fa-cog"></i> ' + text);
 	}
 
 	$('#btnadvtftp').prop('type', 'button');
@@ -1495,23 +1542,34 @@ events.push(function() {
 		show_advtftp();
 	});
 
-   // Show advanced LDAP options ======================================================================================
+	// Show advanced LDAP options ======================================================================================
 	var showadvldap = false;
 
-	function show_advldap() {
+	function show_advldap(ispageload) {
+		var text;
+		// On page load decide the initial state based on the data.
+		if (ispageload) {
 <?php
-		if (empty($pconfig['ldap'])) {
-			$hide = false;
+			if (empty($pconfig['ldap'])) {
+				$showadv = false;
+			} else {
+				$showadv = true;
+			}
+?>
+			showadvldap = <?php if ($showadv) {echo 'true';} else {echo 'false';} ?>;
 		} else {
-			$hide = true;
+			// It was a click, swap the state.
+			showadvldap = !showadvldap;
 		}
-?>
-		var hide = <?php if ($hide) {echo 'true';} else {echo 'false';} ?>;
 
-		hideInput('ldap', !showadvldap && !hide);
-		hideInput('btnadvldap', hide);
+		hideInput('ldap', !showadvldap);
 
-		showadvldap = !showadvldap;
+		if (showadvldap) {
+			text = "<?=gettext('Hide Advanced');?>";
+		} else {
+			text = "<?=gettext('Display Advanced');?>";
+		}
+		$('#btnadvldap').html('<i class="fa fa-cog"></i> ' + text);
 	}
 
 	$('#btnadvldap').prop('type', 'button');
@@ -1523,21 +1581,32 @@ events.push(function() {
 	// Show advanced additional opts options ===========================================================================
 	var showadvopts = false;
 
-	function show_advopts() {
+	function show_advopts(ispageload) {
+		var text;
+		// On page load decide the initial state based on the data.
+		if (ispageload) {
 <?php
-		if (empty($pconfig['numberoptions']) ||
-		    (empty($pconfig['numberoptions']['item'][0]['number']) && (empty($pconfig['numberoptions']['item'][0]['value'])))) {
-			$hide = false;
+			if (empty($pconfig['numberoptions']) ||
+			    (empty($pconfig['numberoptions']['item'][0]['number']) && (empty($pconfig['numberoptions']['item'][0]['value'])))) {
+				$showadv = false;
+			} else {
+				$showadv = true;
+			}
+?>
+			showadvopts = <?php if ($showadv) {echo 'true';} else {echo 'false';} ?>;
 		} else {
-			$hide = true;
+			// It was a click, swap the state.
+			showadvopts = !showadvopts;
 		}
-?>
-		var hide = <?php if ($hide) {echo 'true';} else {echo 'false';} ?>;
 
-		hideClass('adnlopts', !showadvopts && !hide);
-		hideInput('btnadvopts', hide);
+		hideClass('adnlopts', !showadvopts);
 
-		showadvopts = !showadvopts;
+		if (showadvopts) {
+			text = "<?=gettext('Hide Advanced');?>";
+		} else {
+			text = "<?=gettext('Display Advanced');?>";
+		}
+		$('#btnadvopts').html('<i class="fa fa-cog"></i> ' + text);
 	}
 
 	$('#btnadvopts').prop('type', 'button');
@@ -1548,12 +1617,12 @@ events.push(function() {
 
 	// ---------- On initial page load ------------------------------------------------------------
 
-	show_advdns();
-	show_advmac();
-	show_advntp();
-	show_advtftp();
-	show_advldap();
-	show_advopts();
+	show_advdns(true);
+	show_advmac(true);
+	show_advntp(true);
+	show_advtftp(true);
+	show_advldap(true);
+	show_advopts(true);
 
 	// Suppress "Delete row" button if there are fewer than two rows
 	checkLastRow();