feat(15): receiving form submission from step 1

15-multi-step-form/src/main/resources/templates/step1.html

@@ -39,6 +39,9 @@
       class="flex flex-col items-center w-screen h-screen md:grid md:items-start md:p-5 md:bg-white md:rounded-2xl md:grid-cols-[auto_1fr] md:w-desktop-form md:h-desktop-form md:drop-shadow-2xl"
       id="form-step"
       th:fragment="formFragment(formData)"
+      hx-post="/submit-step/1"
+      action="/submit-step/1"
+      method="post"
     >
       <summary
         class="w-full h-44 bg-no-repeat md:row-span-2 bg-sidebar-mobile marker:text-white md:bg-sidebar-desktop md:h-[568px] md:w-[274px]"
@@ -101,6 +104,7 @@
         <label for="name" class="pt-3 text-sm md:pt-5 md:pb-2 text-marine-blue">Name</label>
         <input
           id="name"
+          name="name"
           type="text"
           placeholder="e.g. Stephen King"
           class="p-1 px-4 h-10 text-sm font-semibold rounded border md:p-6 md:px-4 md:text-base md:rounded-lg placeholder:text-cool-gray"
@@ -110,6 +114,7 @@
         >
         <input
           id="email"
+          name="email"
           type="email"
           placeholder="e.g. stephenking@lorem.com"
           class="p-1 px-4 h-10 text-sm font-semibold rounded border md:p-6 md:px-4 md:text-base md:rounded-lg placeholder:text-cool-gray"
@@ -119,6 +124,7 @@
         >
         <input
           id="phone"
+          name="phone"
           type="tel"
           placeholder="e.g. +1 234 567 890"
           class="p-1 px-4 h-10 text-sm font-semibold rounded border md:p-6 md:px-4 md:text-base md:rounded-lg placeholder:text-cool-gray"
@@ -132,7 +138,13 @@
         class="flex flex-row items-center py-4 w-full bg-white md:items-end md:h-full"
       >
         <div class="grow"></div>
+        <input
+          type="submit"
+          class="grid place-content-center mr-3 w-24 h-10 text-sm font-semibold text-white rounded md:mr-24 md:w-32 md:h-12 md:text-base md:rounded-lg bg-marine-blue"
+          value="Next Step"
+          >
         <a
+          th:remove="all"
           href="step2.html"
           class="grid place-content-center mr-3 w-24 h-10 text-sm font-semibold text-white rounded md:mr-24 md:w-32 md:h-12 md:text-base md:rounded-lg bg-marine-blue"
           >Next Step</a

15-multi-step-form/src/main/scala/multistepform/Routes.scala

@@ -6,6 +6,7 @@ import org.thymeleaf.context.Context
 import cask.endpoints.ParamReader
 import java.util.UUID
 import scala.jdk.CollectionConverters._
+import multistepform.Models.Answers
 
 case class Routes()(implicit cc: castor.Context, log: cask.Logger)
     extends cask.Routes {
@@ -71,6 +72,24 @@ case class Routes()(implicit cc: castor.Context, log: cask.Logger)
     )
   }
 
+  // i guess let's make step a hidden input?
+  @cask.post("/submit-step/:stepNum")
+  def submitStep(sessionId: cask.Cookie, stepNum: Int, request: cask.Request) = {
+    val id = sessionId.value
+    println(s"got $request for $id")
+
+    val userAnswers = Sessions.sessionReplies.getOrElse(id, Answers(id))
+
+    // now i want to do what?
+    // select 'answerStep' form userAnswers
+    // delegate parsing and saving of the request.text to it
+    // set current step to next
+    // and return next rendered form step
+    // with the 'form data' caclulated from the updated answers
+
+    cask.Response(s"what i got is $request and ${request.text()}")
+  }
+
   @cask.staticResources("/public")
   def publicFiles() = "public"
 

15-multi-step-form/src/main/scala/multistepform/Sessions.scala

@@ -0,0 +1,11 @@
+package multistepform
+
+import multistepform.Models.Answers
+
+object Sessions {
+  // the simplest form of storing data
+  // i'll be relying on Render.com killing my app after 15 minutes of inactivity for GC
+  // no need to manage concurrency really, because requests for same session are really far apart
+  // and load will average to be 10req/day :shrug:
+  val sessionReplies = scala.collection.mutable.Map.empty[String, Answers]
+}