Claw animation

apps/bear_necessities_web/assets/css/game/game.css

@@ -34,22 +34,27 @@
   height: 100%;
   flex: 1;
 }
+
 .tile.grass-1 {
   background-color: #44d873;
   background-image: url("/images/terain/grass-1.gif");
 }
+
 .tile.grass-2 {
   background-color: #44d873;
   background-image: url("/images/terain/grass-2.gif");
 }
+
 .tile.grass-3 {
   background-color: #44d873;
   background-image: url("/images/terain/grass-3.gif");
 }
+
 .tile.grass-4 {
   background-color: #44d873;
   background-image: url("/images/terain/grass-4.gif");
 }
+
 .tile.nothing {
   background-color: gray;
   background-image: url("/images/terain/nothing.gif");
@@ -75,40 +80,64 @@ Items that are displayed inside tiles (bears, trees, etc)
 }
 
 /* Bear (player and opponents) */
-.bear.self {
-}
+.bear.self {}
+
 .bear.opponent {
   filter: grayscale(60%);
 }
 
 .bear.dead {
   background-image: url("/images/bear/dead.gif");
 }
+
 .bear.up {
   background-image: url("/images/bear/up.gif");
 }
+
 .bear.left {
   background-image: url("/images/bear/left.gif");
 }
+
 .bear.right {
   background-image: url("/images/bear/right.gif");
 }
+
 .bear.down {
   background-image: url("/images/bear/down.gif");
 }
+
 .bear.up.idle {
   background-image: url("/images/bear/up-idle.gif");
 }
+
 .bear.left.idle {
   background-image: url("/images/bear/left-idle.gif");
 }
+
 .bear.right.idle {
   background-image: url("/images/bear/right-idle.gif");
 }
+
 .bear.down.idle {
   background-image: url("/images/bear/down-idle.gif");
 }
 
+.bear.clawing.up {
+  background-image: url("/images/bear/up-claw.gif");
+}
+
+.bear.clawing.left {
+  background-image: url("/images/bear/left-claw.gif");
+}
+
+.bear.clawing.right {
+  background-image: url("/images/bear/right-claw.gif");
+}
+
+.bear.clawing.down {
+  background-image: url("/images/bear/down-claw.gif");
+}
+
 .tree {
   background-image: url("/images/trees/tree-1.gif");
 }

apps/bear_necessities_web/lib/bear_necessities_web/live/game.ex

@@ -88,12 +88,16 @@ defmodule BearNecessitiesWeb.Game do
 
   def handle_event("key_up", key, %{id: id} = socket)
       when key in @arrow_keys do
-     Bear.stop(id)
+    Bear.stop(id)
     {:noreply, socket}
   end
 
   def handle_event("key_up", " ", %{id: id} = socket) do
-    Player.claw(id)
+    socket =
+      socket
+      |> assign(:bear, Player.claw(id))
+      |> assign(:viewport, ViewPort.get_viewport(id))
+
     {:noreply, socket}
   end
 
@@ -162,7 +166,7 @@ defmodule BearNecessitiesWeb.Game do
   def set_updates(false), do: nil
 
   def set_updates(true) do
-    {:ok, {:interval, ref}} = :timer.send_interval(50, self(), :update)
+    {:ok, ref} = :timer.send_interval(50, self(), :update)
     ref
   end
 

apps/bear_necessities_web/lib/bear_necessities_web/templates/playfield/template.html.leex

@@ -67,6 +67,10 @@
     <div class="bear left idle"> </div>
     <div class="bear down idle"> </div>
     <div class="bear right idle"> </div>
+    <div class="bear up clawing"> </div>
+    <div class="bear left clawing"> </div>
+    <div class="bear down clawing"> </div>
+    <div class="bear right clawing"> </div>
     <div class="tree"> </div>
   </div>
 <% end %>

apps/bear_necessities_web/lib/bear_necessities_web/views/playfield.ex

@@ -10,17 +10,18 @@ defmodule BearNecessitiesWeb.Playfield do
 
   def item_class(item, player_id) do
     case item do
-      %Bear{id: id, direction: direction, moving: moving, dead: nil} when id == player_id ->
+      %Bear{id: id, direction: direction, moving: moving, clawing: clawing, dead: nil} = bear
+      when id == player_id ->
         ["bear", "self", direction]
-        |> bear_idle_class(moving)
+        |> bear_idle_class(moving, clawing)
         |> Enum.join(" ")
 
       %Bear{id: id, direction: direction, dead: _} when id == player_id ->
         "bear dead"
 
-      %Bear{direction: direction, moving: moving, dead: nil} ->
+      %Bear{direction: direction, moving: moving, clawing: clawing, dead: nil} ->
         ["bear", "opponent", direction]
-        |> bear_idle_class(moving)
+        |> bear_idle_class(moving, clawing)
         |> Enum.join(" ")
 
       %Bear{direction: direction, dead: _dead} ->
@@ -37,6 +38,7 @@ defmodule BearNecessitiesWeb.Playfield do
     end
   end
 
-  defp bear_idle_class(classes, false), do: ["idle" | classes]
-  defp bear_idle_class(classes, _), do: classes
+  defp bear_idle_class(classes, false, false), do: ["idle" | classes]
+  defp bear_idle_class(classes, _, true), do: ["clawing" | classes]
+  defp bear_idle_class(classes, _, _), do: classes
 end

apps/game/lib/bear.ex

@@ -7,7 +7,8 @@ defmodule Bear do
             display_name: nil,
             started: false,
             direction: :down,
-            moving: false
+            moving: false,
+            clawing: false
 
   def create_bear(%{height: height, width: width}, id, display_name, started) do
     pos_x = Enum.random(0..height)

apps/game/lib/game.ex → apps/game/lib/game_server.ex

@@ -112,7 +112,7 @@ defmodule Game do
   @impl true
   def handle_call({:stop, id}, _pid, %{bears: bears} = state) do
     bear = get_bear_from_list(id, bears)
-    bear = %{bear | moving: false}
+    bear = %{bear | moving: false, clawing: false}
     state = update_state_with(state, bear)
 
     {:reply, bear, state}
@@ -124,6 +124,8 @@ defmodule Game do
         _pid,
         state
       ) do
+    bear = %{bear | clawing: true}
+
     {bear, state} =
       case target(direction, x, y, state) do
         %Tree{honey: tree_honey} = tree when tree_honey > 0 ->
@@ -153,13 +155,13 @@ defmodule Game do
           {new_bear, new_state}
 
         %Tree{honey: 0} ->
-          {bear, state}
+          {bear, update_state_with(state, bear)}
 
         %Bear{honey: 0} ->
-          {bear, state}
+          {bear, update_state_with(state, bear)}
 
         _ ->
-          {bear, state}
+          {bear, update_state_with(state, bear)}
       end
 
     {:reply, bear, state}

apps/game/lib/player.ex

@@ -2,19 +2,22 @@ defmodule Player do
   use GenServer
   require Logger
 
-  defstruct [:display_name, :score, :bear]
+  @claw_time_ms 1000
+
+  @enforce_keys [:id]
+  defstruct [:id, :claw, :timer_pid]
 
   def start_link(default) when is_list(default) do
     GenServer.start_link(__MODULE__, default, name: __MODULE__)
   end
 
   @impl true
-  def init([]) do
-    {:ok, []}
+  def init(id: id) do
+    {:ok, %Player{id: id}}
   end
 
   @impl true
-  def handle_call({:action, user_input, id}, _pid, _) do
+  def handle_call({:action, user_input, id}, _pid, state) do
     bear =
       case user_input do
         :up_arrow ->
@@ -30,14 +33,43 @@ defmodule Player do
           Bear.move(id, :right)
       end
 
-    {:reply, bear, []}
+    {:reply, bear, state}
   end
 
-  @imp true
-  def handle_call({:claw, id}, _pid, _) do
+  @impl true
+  def handle_call({:claw, id}, _pid, state) do
     bear = Bear.claw(id)
+    {:ok, timer_pid} = :timer.send_interval(50, self(), :update_claw)
+    state = %{state | claw: @claw_time_ms, timer_pid: timer_pid}
+
+    {:reply, bear, state}
+  end
+
+  @impl true
+  def handle_info(:update_claw, %{claw: nil} = state) do
+    {:noreply, state}
+  end
+
+  @impl true
+  def handle_info(:update_claw, %{claw: claw_time} = state) when claw_time > 0 do
+    state = %{state | claw: claw_time - 50}
+
+    {:noreply, state}
+  end
+
+  @impl true
+  def handle_info(:update_claw, %{id: id, claw: claw_time, timer_pid: timer_pid} = state)
+      when claw_time < 1 do
+    :timer.cancel(timer_pid)
+    state = %{state | claw: nil, timer_pid: nil}
+    Bear.stop(id)
+
+    {:noreply, state}
+  end
 
-    {:reply, bear, []}
+  @impl true
+  def handle_info(:update_claw, state) do
+    {:noreply, state}
   end
 
   def move(player_id, way) do
@@ -49,7 +81,7 @@ defmodule Player do
   end
 
   def start(display_name, id) do
-    Player.start_link([])
+    Player.start_link(id: id)
     Game.create_bear(display_name: display_name, id: id, started: true)
   end
 end