feat(14): update and persist scores

14-rock-paper-scissors/src/main/resources/templates/index.html

@@ -52,8 +52,32 @@
         <h2
           class="flex flex-col justify-around items-center py-2 mr-3 bg-white rounded-md w-[80px] h-[70px] text-score-text rouned-md"
         >
-          <span class="text-xs uppercase">Score</span
+          <span class="text-xs uppercase">Score</span>
-          ><span class="text-4xl font-extrabold">12</span>
+          <span id="the-score-number" class="text-4xl font-extrabold">12</span>
+          <script type="text/javascript">
+            document.body.addEventListener("updateScore", function (evt) {
+              let scoreElement = document.querySelector("#the-score-number");
+              let newScore =
+                parseInt(scoreElement.textContent) + evt.detail.value;
+              console.log(
+                `the score will update by ${evt.detail.value} to ${newScore}`
+              );
+              localStorage.setItem("score", newScore);
+              scoreElement.textContent = newScore;
+            });
+          </script>
+          <script type="text/javascript">
+            document.addEventListener("DOMContentLoaded", (event) => {
+              let scoreElement = document.querySelector("#the-score-number");
+              let storedScore = localStorage.getItem("score");
+              if (storedScore !== null) {
+                scoreElement.textContent = storedScore;
+              } else {
+                scoreElement.textContent = 0;
+                localStorage.setItem("score", 0);
+              }
+            });
+          </script>
         </h2>
       </section>
 

14-rock-paper-scissors/src/main/scala/rockpaperscissors/Main.scala

@@ -97,7 +97,8 @@ object Main {
           val badge = playersChoiceBadge.copy()
           badge.p =
             Positioning.Relative // this probably should be set in enclosing html tag
-          val houseChoice = Models.choiceSelectionItems(Random.nextInt(3)).copy()
+          val houseChoice =
+            Models.choiceSelectionItems(Random.nextInt(3)).copy()
           houseChoice.p = Positioning.Relative
           println(s"getting house choice $houseChoice")
           val showdownState = ShowdownState(badge, Some(houseChoice), false)
@@ -109,7 +110,10 @@ object Main {
           )
           cask.Response(
             result,
-            headers = Seq("Content-Type" -> "text/html;charset=UTF-8")
+            headers = Seq(
+              "Content-Type" -> "text/html;charset=UTF-8",
+              "HX-Trigger-After-Settle" -> s"""{"updateScore": ${showdownState.scoreChange}}"""
+            )
           )
         case None =>
           cask.Response(s"Unknown choice: '${playersChoice}'", 400)

14-rock-paper-scissors/src/main/scala/rockpaperscissors/Models.scala

@@ -124,5 +124,16 @@ position: absolute;
         } else "lose"
       })
     }
+    def scoreChange: Int = {
+      houseChoice.map(houseSelectedChoice => {
+        val player = playersChoice.c
+        val house = houseSelectedChoice.c
+        if (player == house) {
+          0
+        } else if (player.isBeating(house)) {
+          1
+        } else -1
+      }).getOrElse(0)
+    }
   }
 }