From 960cc91168b42a9951796328f21b98073302f523 Mon Sep 17 00:00:00 2001
From: Daniel Markstedt <markstedt@gmail.com>
Date: Sun, 24 Oct 2021 19:09:35 -0700
Subject: [PATCH] Iterate on webapp config UX (#371)

* Iterate on webapp config ux

* Labels were only adding clutter

* Add confirmation modals
---
 src/web/templates/index.html | 20 +++++++++++++-------
 1 file changed, 13 insertions(+), 7 deletions(-)

diff --git a/src/web/templates/index.html b/src/web/templates/index.html
index 395fa729..610df49e 100644
--- a/src/web/templates/index.html
+++ b/src/web/templates/index.html
@@ -12,23 +12,24 @@
 
     <p>
     <form action="/config/load" method="post">
-        <select name="name" required>
+        <select name="name" width="14" required>
+            {% if config_files %}
             {% for config in config_files %}
                 <option value="{{config}}">{{config.replace(".json", '')}}</option>
             {% endfor %}
+            {% else %}
+                <option disabled>No saved configs</option>
+            {% endif %}
         </select>
-        <input type="submit" name="load" value="Load" />
-        <input type="submit" name="delete" value="Delete" />
+        <input type="submit" name="load" value="Load" onclick="return confirm('Detach all current device and Load config?')" />
+        <input type="submit" name="delete" value="Delete" onclick="return confirm('Delete config file?')" />
     </form>
     </p>
     <p>
     <form action="/config/save" method="post">
-        <input name="name" placeholder="default">
+        <input name="name" placeholder="default" size="20">
         <input type="submit" value="Save" />
     </form>
-    <form action="/scsi/detach_all" method="post" onsubmit="return confirm('Detach all SCSI Devices?')">
-        <input type="submit" value="Detach All" />
-    </form>
     </p>
 
     <table cellpadding="3" border="black">
@@ -101,6 +102,11 @@
         {% endfor %}
         </tbody>
     </table>
+    <p>
+    <form action="/scsi/detach_all" method="post" onsubmit="return confirm('Detach all SCSI Devices?')">
+        <input type="submit" value="Detach All Devices" />
+    </form>
+    </p>
 
     <hr/>