toggling ability to start test to only be when system is armed

diff --git a/ui/index.html b/ui/index.html
index b968e4a845e975fb8047784a5c7497b7a8095d04..c83b36535392bea10328ae7afccee16f0a0952dd 100644 (file)
--- a/ui/index.html
+++ b/ui/index.html
@@ -31,9 +31,23 @@
 
     </script>
     <script>
-      // change system armed state
+      // manage system armed state, starting disarmed
+      let armreq = "disarm"
+      document.querySelector('#startTest').setAttribute('disabled', true);
+
       function armSystem() {
-        const jsonString = '{"request": "arm"}';
+        if (armreq == "disarm") {
+          armreq = "arm";
+          var jsonString = '{"request": "arm"}';
+          document.querySelector('#ArmButton').textContent = 'Disarm';
+          document.querySelector('#startTest').removeAttribute('disabled');
+        } else {
+          armreq = "disarm";
+          var jsonString = '{"request": "disarm"}';
+          document.querySelector('#ArmButton').textContent = 'Arm';
+          document.querySelector('#startTest').setAttribute('disabled', true);
+        }
+       console.log({ armreq });
         const fetchOptions = {
           method: "POST",
           headers: {
@@ -42,6 +56,7 @@
           },
           body: jsonString,
         };
+       console.log({ fetchOptions });
        const response = fetch("/armsystem", fetchOptions);
       }
 
@@ -111,10 +126,10 @@
           Configure Test</button>
       </div>
       <div class="w3-container w3-center">
-        <button onclick="armSystem()"
+        <button id="ArmButton" onclick="armSystem()" 
           class="w3-button w3-round-large w3-black w3-hover-red w3-large w3-opacity w3-left">
           Arm</button>
-        <button onclick="startTest()"
+        <button id="startTest" onclick="startTest()" disabled
           class="w3-button w3-round-large w3-black w3-hover-red w3-large w3-opacity w3-right">
           Start Test</button>
         </a>