score and mobile

lib/chicken_egg_web/live/index_live.ex

@@ -5,7 +5,17 @@ defmodule ChickenEggWeb.IndexLive do
 
   def render(assigns) do
     ~H"""
-    <div class="board relative bg-green-700 w-screen h-screen" phx-window-keyup="boak" phx-key=" ">
+    <div
+      class="board relative bg-green-700 w-screen h-screen select-none"
+      id="chicken-egg"
+      phx-window-keyup="boak"
+      phx-key=" "
+      phx-hook="ChickenEgg"
+    >
+      <div class="score absolute right-0 z-50 text-fuchsia-50 text-4xl font-semibold p-4 text-outline">
+        <%= @score %>
+      </div>
+
       <ChickenComponents.chicken x={@chicken.x} y={@chicken.y} />
 
       <div id="chicken-eggs" phx-update="stream">
@@ -18,25 +28,24 @@ defmodule ChickenEggWeb.IndexLive do
   end
 
   def mount(_params, _session, socket) do
-    eggs = []
-
     {:ok,
      socket
      |> assign(:chicken, %{x: 42, y: 47})
-     |> stream(:eggs, eggs)}
+     |> assign(:score, 0)
+     |> stream(:eggs, [])}
   end
 
   def handle_event("boak", _params, socket) do
+    score = socket.assigns.score
     %{x: cx, y: cy} = socket.assigns.chicken
-    new_chicken = %{x: Enum.random(1..100), y: Enum.random(1..100)}
 
-    new_egg =
-      %{id: "egg#{cx}#{cy}", x: cx, y: cy}
-      |> IO.inspect()
+    new_egg = %{id: "egg#{cx}#{cy}", x: cx, y: cy}
+    new_chicken = %{x: Enum.random(1..99), y: Enum.random(1..99)}
 
     {:noreply,
      socket
      |> assign(:chicken, new_chicken)
+     |> assign(:score, score + 1)
      |> stream_insert(:eggs, new_egg)}
   end
 end