Add web frontend support for dhcp/dhcpd

html/system.html

@@ -23,6 +23,7 @@
 
     <div id="system-tab" class="tab-content active">
       <h1>System Settings</h1>
+    <label class="dhcpon">DHCP client endabled: <input id="dhcp" type="checkbox" onchange="dhcpClicked(this)"></label><br/><br/>
       <div class="row">
         <div class="lcol"> <label for="ip">IP address:</label></div>
         <div class="rcol"> <input id="ip" class="ip" type="text" minlength="7" maxlength="15" size="15"/></div>
@@ -55,6 +56,17 @@
       <br/>
       <input style="width:40%;" class="action" id="switch_reset" onclick="resetSwitch();" type="button" value="Reset Switch">
     </div>
+    <div class="row">
+      <div class="lcol"> <label for="gw">Gateway:</label></div>
+      <div class="rcol"><input id="gw" class="ip" type="text" minlength="7" maxlength="15" size="15"/></div>
+    </div><br/>
+    When updating the above settings, remember to point your browser to the new IP afterwards:<br/>
+    <input style="width:40%;" class="action" id="ip_sub" onclick="ipSub();" type="button" value="Update Settings"><br/>
+    <br/><br/>
+    <label class="dhcpdon">Enable DHCP Server: <input id="dhcpd" type="checkbox"></label><br/>
+    <input style="width:40%;" class="action" id="dhcpd_sub" onclick="dhcpdSub();" type="button" value="Change DHCPD State"><br/><br/><br/>
+    Save all current settings to Flash:<br/>
+    <input style="width:40%;" class="action" id="flash_sub" onclick="flashSave();" type="button" value="Save Settings to Flash">
 
     </div>
     <script src="/config.js"></script>

html/system.js

@@ -8,6 +8,20 @@ function checkIp(ip) {
 }
 
 async function ipSub() {
+  if (document.getElementById('dhcp').checked) {
+    var cmd = "ip dhcp";
+    try {
+      const response = await fetch('/cmd', {
+        method: 'POST',
+        body: cmd
+      });
+      console.log('Completed!', response);
+      systemInterval = setInterval(fetchIP, 10000);
+    } catch(err) {
+      console.error(`Error: ${err}`);
+    }
+    return;
+  }
   for (let i=0;i<3;i++) {
     if (!checkIp(document.getElementById(ips[i]).value))
       return;
@@ -26,7 +40,34 @@ async function ipSub() {
     }
   }
 }
-
+async function dhcpdSub() {
+  var dhcpd_cmd = "dhcpd off";
+  if (document.getElementById('dhcpd').checked)
+    dhcpd_cmd = "dhcpd on";
+  try {
+    const response = await fetch('/cmd', {
+      method: 'POST',
+      body: dhcpd_cmd
+    });
+    console.log('Completed!', response);
+  } catch(err) {
+    console.error(`Error: ${err}`);
+  }
+}
+function dhcpClicked(e)
+{
+  console.log("dhcpClicked called");
+  if (e.checked) {
+    for (let i=0; i<3;i++)
+      document.getElementById(ips[i]).disabled = true;
+    document.getElementById('dhcpd').disabled = true;
+  } else {
+    console.log("dhcpClicked off");
+    for (let i=0; i<3;i++)
+      document.getElementById(ips[i]).disabled = false;
+    document.getElementById('dhcpd').disabled = false;
+  }
+}
 async function sendConfig(c) {
     const form = new FormData();
   form.append("MAX_FILE_SIZE", "4096");
@@ -98,6 +139,8 @@ function fetchIP() {
       document.getElementById("ip").value=s.ip_address;
       document.getElementById("netmask").value=s.ip_netmask;
       document.getElementById("gw").value=s.ip_gateway;
+      document.getElementById('dhcp').checked = s.dhcp_client;
+      document.getElementById('dhcpd').checked = s.dhcp_server;
       clearInterval(systemInterval);
       // Fetch and populate the config textbox
       fetchConfig().then((configText) => {