dummy mvp is ew

cmd/http/public/transactions.html

@@ -65,7 +65,7 @@
           result += `  <td style="width: 10em;">${t[0].Description}</td>`
           result += `  <td><table style="margin: 0;">`
           for (var delta of t) {
-            result += `  <tr>`
+            result += `  <tr delta='${btoa(JSON.stringify(delta))}' style="cursor: crosshair;" onclick="stageEdit(this); return false;">`
             result += `    <td><span style="font-variant: petite-caps;">${delta.Name.split(":")[0]}</span><span style="opacity: 0.6;"> :${delta.Name.split(":").slice(1, 100).join(":")}</span></td>`
             result += `    <td style="text-align: right; width: 2em;">${delta.Payee ? delta.Currency : ""}</td>`
             result += `    <td style="text-align: right; width: 5em;">${delta.Payee ? delta.Value : ""}</td>`
@@ -79,6 +79,13 @@
         document.getElementById("reg").innerHTML = result
       }
 
+      function stageEdit(row) {
+        const deltaJSON = atob(row.attributes.delta.value)
+        const delta = JSON.parse(deltaJSON)
+        document.getElementById("modal-textarea").value = JSON.stringify(delta, null, 2)
+        document.getElementById("modal").showModal()
+      }
+
       function stage(who, contributesToHouse) {
         var d = new Date()
         const zeroPad = (num, places) => String(num).padStart(places, '0')
@@ -128,6 +135,16 @@
       <div id="reg">
       </div>
     </details>
+    <dialog id="modal" style="width: 80%; height: 80%; margin: auto;">
+      <form method="dialog">
+        <div style="display: flex; flex-direction: row;">
+          <div style="flex-grow: 100;"></div>
+          <button type="submit">X</button>
+        </div>
+        <textarea id="modal-textarea" style="font-family: monospace;"></textarea>
+        <button type="submit" style="background-color: maroon;">Submit</button>
+      </form>
+    </dialog>
   </body>
   <footer>
   </footer>