web: load/save/delete plots

1 files changed, 15 insertions, 10 deletions

diff --git a/web/index.html b/web/index.html
index 7e37ab7..5e8bd6a 100644
--- a/web/index.html
+++ b/web/index.html
@@ -14,6 +14,7 @@
         <path id="i-no-eye" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round" d="M3.98 8.223A10.477 10.477 0 0 0 1.934 12C3.226 16.338 7.244 19.5 12 19.5c.993 0 1.953-.138 2.863-.395M6.228 6.228A10.451 10.451 0 0 1 12 4.5c4.756 0 8.773 3.162 10.065 7.498a10.522 10.522 0 0 1-4.293 5.774M6.228 6.228 3 3m3.228 3.228 3.65 3.65m7.894 7.894L21 21m-3.228-3.228-3.65-3.65m0 0a3 3 0 1 0-4.243-4.243m4.242 4.242L9.88 9.88" />
         <path id="i-pencil" fill="currentColor" d="M21.731 2.269a2.625 2.625 0 0 0-3.712 0l-1.157 1.157 3.712 3.712 1.157-1.157a2.625 2.625 0 0 0 0-3.712ZM19.513 8.199l-3.712-3.712-12.15 12.15a5.25 5.25 0 0 0-1.32 2.214l-.8 2.685a.75.75 0 0 0 .933.933l2.685-.8a5.25 5.25 0 0 0 2.214-1.32L19.513 8.2Z" />
         <path id="i-no-pencil" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round" d="m16.862 4.487 1.687-1.688a1.875 1.875 0 1 1 2.652 2.652L6.832 19.82a4.5 4.5 0 0 1-1.897 1.13l-2.685.8.8-2.685a4.5 4.5 0 0 1 1.13-1.897L16.863 4.487Zm0 0L19.5 7.125" />
+        <path id="i-cross" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round" d="M4 20 20 4M4 4l16 16" />
       </defs>
     </svg>
     <aside>
@@ -32,7 +33,7 @@
           <label id="temps_controller">-</label>
         </div>
         <div>
-          <select id="profile" value="">
+          <select id="profile" value="" class="grow">
             <option value="">none / manual</option>
             <option value="0">profile 1</option>
             <option value="1">profile 2</option>
@@ -54,13 +55,13 @@
         <h1>manual control</h1>
         <div>
           <label for="heat">heat</label>
-          <input type="range" min="0" max="255" id="heat" value="0" />
-          <input type="checkbox" id="heat_mode" />
+          <input id="heat" class="grow" type="range" min="0" max="255" value="0" />
+          <input id="heat_mode" type="checkbox" />
         </div>
         <div>
           <label for="cool">cool</label>
-          <input type="range" min="0" max="255" id="cool" value="0" />
-          <input type="checkbox" id="cool_mode" />
+          <input id="cool" class="grow" type="range" min="0" max="255" value="0" />
+          <input id="cool_mode" type="checkbox" />
         </div>
       </section>
       <section class="grow">
@@ -69,30 +70,34 @@
           <span>
             <button id="profile_show" class="icon"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><use href="#i-eye" /></svg></button>
             <button id="profile_edit" class="icon"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><use href="#i-pencil" /></svg></button>
+            <button id="profile_clear" class="icon"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><use href="#i-cross" /></svg></button>
           </span>
         </h1>
         <div>
           <button id="profile_load" class="grow">load</button>
           <button id="profile_save" class="grow">save</button>
-          <button id="profile_create" class="grow">create</button>
+          <button id="profile_delete" class="grow">delete</button>
         </div>
-        <select id="storedprofile" multiple class="grow">
+        <select id="profile_stored" multiple class="grow">
+          <option value="" class="new">(new profile)</option>
         </select>
       </section>
       <section class="grow">
         <h1>
-          <span class="grow">paste specification</span>
+          <span class="grow">paste spec</span>
           <span>
             <button id="paste_show" class="icon"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><use href="#i-eye" /></svg></button>
             <button id="paste_edit" class="icon"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><use href="#i-pencil" /></svg></button>
+            <button id="paste_clear" class="icon"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><use href="#i-cross" /></svg></button>
           </span>
         </h1>
         <div>
           <button id="paste_load" class="grow">load</button>
           <button id="paste_save" class="grow">save</button>
-          <button id="paste_create" class="grow">create</button>
+          <button id="paste_delete" class="grow">delete</button>
         </div>
-        <select id="storedprofile" multiple class="grow">
+        <select id="paste_stored" multiple class="grow">
+          <option value="" class="new">(new paste)</option>
         </select>
       </section>
     </aside>