Beginnings of HTMX frontend interaction, able to request particular PWs by link names and patch the DOM appropriately

2022-07-02 18:37:30 -05:00
parent d15b40a339
commit f088ff3690
12 changed files with 120 additions and 65 deletions
--- a/views/index.hamlet
+++ b/views/index.hamlet
@ -1,8 +1,14 @@
 <html>
  <head>
    <title>Purr
+    <script src="https://unpkg.com/htmx.org@1.7.0" integrity="sha384-EzBXYPt0/T6gxNp0nuPtLkmRpmDBbjg6WmCUZRLXBBwYYmwAUxzlSGej0ARHX0Bo" crossorigin="anonymous">
  <body>
-    $maybe pw <- password
-      <p>Here's the password for #{link}: #{pw}
-    $nothing
-      <p>No password available at https://purr.eversole.co/#{link}
+    <h1>Welcome to Purr!
+    <p #requestedPw>No password currently requested.
+    <p>Ask for the <input name="userLink" type="text"/> password
+    <button hx-post="/pw" 
+      hx-target="#requestedPw" 
+      hx-swap="outerHTML" 
+      hx-include="[name='userLink']"
+    />
+      Get Password!
--- a/views/pw.hamlet
+++ b/views/pw.hamlet
@ -0,0 +1,5 @@
+  <div #requestedPw>
+    $maybe pw <- password
+      <p>Here's the password for #{link}: #{pw}
+    $nothing
+      <p>No password available at https://purr.eversole.co/#{link}