From beef00e14ae061e6678a6a7ebce6e5ce4ebdf078 Mon Sep 17 00:00:00 2001
From: Alice Sedgwick <alice.sedgwick@spirirobotics.com>
Date: Mon, 11 Nov 2024 13:04:12 -0500
Subject: [PATCH] Trying to get values to appear for bootstrap dropdowns

---
 ui/general/health.html | 19 +++++++++++++++----
 ui/general/health.js   | 18 +++++++++++++++++-
 2 files changed, 32 insertions(+), 5 deletions(-)

diff --git a/ui/general/health.html b/ui/general/health.html
index 2c7510c..867dea5 100644
--- a/ui/general/health.html
+++ b/ui/general/health.html
@@ -5,6 +5,7 @@
     <title>Health Status</title>
     <meta charset="utf-8">
     <link href="../base1/bootstrap.min.css" type="text/css" rel="stylesheet">
+    <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.2/dist/umd/popper.min.js" ></script>
     <script src="../base1/cockpit.js"></script>
     <script src="../base1/jquery-3.7.1.min.js"></script>
 </head>
@@ -62,17 +63,27 @@
                         <label for="composeFile" class="form-label"><b>Drone Select</b></label>                    
                         <select id="droneSelection" class="form-select mt-2"></select>
                     </div>
+                    <ul class="nav nav-pills span7 pull-right" id="upper_username_hide">
+                        <li class= "dropdown" data-dropdown="dropdown">
+                          <a id="" class="dropdown-toggle" data-toggle="dropdown" href="#">
+                           <b class="caret dropdown-toggle"></b>
+                          </a>
+                          <ul class="dropdown-menu" >
+                           <li><a href="#">Action</a></li>
+                           <li><a href="#">Another action</a></li>
+                         </ul>
+                       </li>
+                     </ul> 
                 </div>
             </div>
         </div>
     </div>
     <select name="droneDropdown" id="droneDropdown" onLoad="handleSelect(this.value)" onChange="handleSelect(this.value)">
         <option value="View All" selected>View All</option>
-        <option value="Certificates of Deposit (CDs)">Certificates of Deposit (CDs)</option>
-        <option value="Individual Retirement Account (IRA)">Individual Retirement Account (IRA)</option>
-        <option value="Money Market">Money Market</option>
         <option value="Drone1">Drone1</option>
-        <option value="Checking">Checking</option>
+        <option value="Drone2">Drone2</option>
+        <option value="Drone3">Drone4</option>
+        <option value="Drone5">Drone5</option>
     </select>
      <div id="myTableContainer"></div>    
 
diff --git a/ui/general/health.js b/ui/general/health.js
index 36c86f9..ebb7343 100644
--- a/ui/general/health.js
+++ b/ui/general/health.js
@@ -20,12 +20,28 @@ function initPage() {
 }
 
 function handleSelect(account) {
-    var drone1Table = "<table><tr><td>test</td></tr></table>";
+    var drone1Table = "<table><tr><td>Drone1</td></tr></table>";
+    var drone2Table = "<table><tr><td>Drone2</td></tr></table>";
+    var drone3Table = "<table><tr><td>Drone3/td></tr></table>";
+    var drone4Table = "<table><tr><td>Drone4</td></tr></table>";
+    var drone5Table = "<table><tr><td>Drone5</td></tr></table>";
     switch(account)
     {
         case "Drone1":
         document.getElementById("myTableContainer").innerHTML = drone1Table
         break;
+        case "Drone2":
+        document.getElementById("myTableContainer").innerHTML = drone2Table
+        break;
+        case "Drone3":
+        document.getElementById("myTableContainer").innerHTML = drone3Table
+        break;
+        case "Drone4":
+        document.getElementById("myTableContainer").innerHTML = drone4Table
+        break;
+        case "Drone5":
+        document.getElementById("myTableContainer").innerHTML = drone5Table
+        break;
     }
 }