Working on Puppeteer driven animations.

There's still some buggy behavior in there...

10 files changed, 338 insertions, 100 deletions

diff --git a/src/battle/src/Constants/DisplayEffects.elm b/src/battle/src/Constants/DisplayEffects.elm
index 366c4e5..21bdd51 100644
--- a/src/battle/src/Constants/DisplayEffects.elm
+++ b/src/battle/src/Constants/DisplayEffects.elm
@@ -15,6 +15,18 @@ enabled = "enabled"
 target : String
 target = "target"
 
+focused : String
+focused = "focused"
+
+switching_weapons : String
+switching_weapons = "switching-weapons"
+
+attacking : String
+attacking = "attacking"
+
+using_skill : String
+using_skill = "using-skill"
+
 ally : String
 ally = "ally"
 
diff --git a/src/battle/src/Struct/PuppeteerAction.elm b/src/battle/src/Struct/PuppeteerAction.elm
index cc55cee..6a131eb 100644
--- a/src/battle/src/Struct/PuppeteerAction.elm
+++ b/src/battle/src/Struct/PuppeteerAction.elm
@@ -14,6 +14,8 @@ import BattleMap.Struct.DataSet
 import BattleMap.Struct.Direction
 
 -- Local Module ----------------------------------------------------------------
+import Constants.DisplayEffects
+
 import Struct.Attack
 import Struct.Battle
 import Struct.TurnResult
@@ -29,6 +31,7 @@ type Effect =
    | Move (Int, BattleMap.Struct.Direction.Type)
    | RefreshCharacter (Bool, Int)
    | RefreshCharactersOf (Bool, Int)
+   | ToggleCharacterEffect (Int, String)
    | StartTurn Int
    | SwapWeapons Int
    | Target (Int, Int)
@@ -51,7 +54,19 @@ from_attacked attack =
             (Perform
                [
                   (RefreshCharacter (False, attacker_ix)),
-                  (RefreshCharacter (False, defender_ix))
+                  (RefreshCharacter (False, defender_ix)),
+                  (ToggleCharacterEffect
+                     (
+                        attacker_ix,
+                        Constants.DisplayEffects.attacking
+                     )
+                  ),
+                  (ToggleCharacterEffect
+                     (
+                        defender_ix,
+                        Constants.DisplayEffects.target
+                     )
+                  )
                ]
             ),
             (PerformFor
@@ -65,7 +80,19 @@ from_attacked attack =
             (Perform
                [
                   (RefreshCharacter (True, attacker_ix)),
-                  (RefreshCharacter (True, defender_ix))
+                  (RefreshCharacter (True, defender_ix)),
+                  (ToggleCharacterEffect
+                     (
+                        attacker_ix,
+                        Constants.DisplayEffects.attacking
+                     )
+                  ),
+                  (ToggleCharacterEffect
+                     (
+                        defender_ix,
+                        Constants.DisplayEffects.target
+                     )
+                  )
                ]
             )
          ]
@@ -73,18 +100,53 @@ from_attacked attack =
 
 from_targeted : Struct.TurnResult.Target -> (List Type)
 from_targeted target =
+   let
+      actor_index = (Struct.TurnResult.get_target_actor_index target)
+      target_index = (Struct.TurnResult.get_target_target_index target)
+   in
    [
       (PerformFor
          (
             2.0,
-            [(Focus (Struct.TurnResult.get_target_actor_index target))]
+            [
+               (Focus actor_index),
+               (ToggleCharacterEffect
+                  (
+                     actor_index,
+                     Constants.DisplayEffects.focused
+                  )
+               )
+            ]
          )
       ),
       (PerformFor
          (
             2.0,
-            [(Focus (Struct.TurnResult.get_target_target_index target))]
+            [
+               (Focus target_index),
+               (ToggleCharacterEffect
+                  (
+                     actor_index,
+                     Constants.DisplayEffects.focused)
+                  ),
+               (ToggleCharacterEffect
+                  (
+                     target_index,
+                     Constants.DisplayEffects.focused
+                  )
+               )
+            ]
          )
+      ),
+      (Perform
+         [
+            (ToggleCharacterEffect
+               (
+                  target_index,
+                  Constants.DisplayEffects.focused
+               )
+            )
+         ]
       )
    ]
 
@@ -93,16 +155,42 @@ from_moved movement =
    let actor_ix = (Struct.TurnResult.get_movement_actor_index movement) in
       (
          [
-            (PerformFor (1.0, [(Focus actor_ix)])),
-            (Perform [(RefreshCharacter (False, actor_ix))])
+            (PerformFor
+               (
+                  1.0,
+                  [
+                     (Focus actor_ix),
+                     (ToggleCharacterEffect
+                        (
+                           actor_ix,
+                           Constants.DisplayEffects.focused
+                        )
+                     )
+                  ]
+               )
+            ),
+            (Perform
+               [
+                  (RefreshCharacter (False, actor_ix)),
+                  (ToggleCharacterEffect
+                     (
+                        actor_ix,
+                        Constants.DisplayEffects.focused
+                     )
+                  )
+               ]
+            )
          ]
          ++
          (List.map
             (\dir ->
                (PerformFor
                   (
-                     0.5,
-                     [(Move (actor_ix, dir))]
+                     0.4,
+                     [
+                        (Focus actor_ix),
+                        (Move (actor_ix, dir))
+                     ]
                   )
                )
             )
@@ -118,16 +206,51 @@ from_switched_weapon weapon_switch =
       actor_ix = (Struct.TurnResult.get_weapon_switch_actor_index weapon_switch)
    in
       [
-         (PerformFor (1.0, [(Focus actor_ix)])),
+         (PerformFor
+            (
+               1.0,
+               [
+                  (Focus actor_ix),
+                  (ToggleCharacterEffect
+                     (
+                        actor_ix,
+                        Constants.DisplayEffects.focused
+                     )
+                  )
+               ]
+            )
+         ),
          (PerformFor
             (
                2.0,
                [
+                  (ToggleCharacterEffect
+                     (
+                        actor_ix,
+                        Constants.DisplayEffects.focused
+                     )
+                  ),
+                  (ToggleCharacterEffect
+                     (
+                        actor_ix,
+                        Constants.DisplayEffects.switching_weapons
+                     )
+                  ),
                   (RefreshCharacter (False, actor_ix)),
                   (SwapWeapons actor_ix),
                   (RefreshCharacter (True, actor_ix))
                ]
             )
+         ),
+         (Perform
+            [
+               (ToggleCharacterEffect
+                  (
+                     actor_ix,
+                     Constants.DisplayEffects.switching_weapons
+                  )
+               )
+            ]
          )
       ]
 
diff --git a/src/battle/src/Update/Puppeteer.elm b/src/battle/src/Update/Puppeteer.elm
index b21584f..b2527e8 100644
--- a/src/battle/src/Update/Puppeteer.elm
+++ b/src/battle/src/Update/Puppeteer.elm
@@ -19,6 +19,7 @@ import Update.Puppeteer.RefreshCharactersOf
 import Update.Puppeteer.StartTurn
 import Update.Puppeteer.SwapWeapons
 import Update.Puppeteer.Target
+import Update.Puppeteer.ToggleCharacterEffect
 
 --------------------------------------------------------------------------------
 -- LOCAL -----------------------------------------------------------------------
@@ -39,6 +40,13 @@ forward effect model =
       (Struct.PuppeteerAction.Focus character_ix) ->
          (Update.Puppeteer.Focus.forward character_ix model)
 
+      (Struct.PuppeteerAction.ToggleCharacterEffect (character_ix, deffect)) ->
+         (Update.Puppeteer.ToggleCharacterEffect.forward
+            character_ix
+            deffect
+            model
+         )
+
       (Struct.PuppeteerAction.Hit attack) ->
          (Update.Puppeteer.Hit.forward attack model)
 
@@ -87,6 +95,13 @@ backward effect model =
       (Struct.PuppeteerAction.Hit attack) ->
          (Update.Puppeteer.Hit.backward attack model)
 
+      (Struct.PuppeteerAction.ToggleCharacterEffect (character_ix, deffect)) ->
+         (Update.Puppeteer.ToggleCharacterEffect.backward
+            character_ix
+            deffect
+            model
+         )
+
       (Struct.PuppeteerAction.Move (character_ix, direction)) ->
          (Update.Puppeteer.Move.backward character_ix direction model)
 
@@ -119,24 +134,28 @@ apply_effects_forward : (
       (Struct.Model.Type, (List (Cmd Struct.Event.Type)))
    )
 apply_effects_forward effects model =
-   (List.foldl
-      (\effect (current_model, current_cmds) ->
-         let
-            (updated_model, new_commands) = (forward effect current_model)
-         in
-            (
-               {updated_model|
-                  puppeteer =
-                     (Struct.Puppeteer.forward
-                        updated_model.puppeteer
-                     )
-               },
-               (new_commands ++ current_cmds)
+   let
+      (last_model, cmd_list) =
+         (List.foldl
+            (\effect (current_model, current_cmds) ->
+               let
+                  (updated_model, new_commands) = (forward effect current_model)
+               in
+                  (
+                     updated_model,
+                     (new_commands ++ current_cmds)
+                  )
             )
+            (model, [])
+            effects
+         )
+   in
+      (
+         {last_model |
+            puppeteer = (Struct.Puppeteer.forward last_model.puppeteer)
+         },
+         cmd_list
       )
-      (model, [])
-      effects
-   )
 
 apply_effects_backward : (
       (List Struct.PuppeteerAction.Effect) ->
@@ -144,24 +163,29 @@ apply_effects_backward : (
       (Struct.Model.Type, (List (Cmd Struct.Event.Type)))
    )
 apply_effects_backward effects model =
-   (List.foldr
-      (\effect (current_model, current_cmds) ->
-         let
-            (updated_model, new_commands) = (backward effect current_model)
-         in
-            (
-               {updated_model|
-                  puppeteer =
-                     (Struct.Puppeteer.backward
-                        updated_model.puppeteer
-                     )
-               },
-               (current_cmds ++ new_commands)
+   let
+      (last_model, cmd_list) =
+         (List.foldr
+            (\effect (current_model, current_cmds) ->
+               let
+                  (updated_model, new_commands) =
+                     (backward effect current_model)
+               in
+                  (
+                     updated_model,
+                     (current_cmds ++ new_commands)
+                  )
             )
+            (model, [])
+            effects
+         )
+   in
+      (
+         {last_model |
+            puppeteer = (Struct.Puppeteer.backward last_model.puppeteer)
+         },
+         cmd_list
       )
-      (model, [])
-      effects
-   )
 
 apply_to_rec : (
       Struct.Model.Type ->
diff --git a/src/battle/src/Update/Puppeteer/Focus.elm b/src/battle/src/Update/Puppeteer/Focus.elm
index 4e72a53..c502af9 100644
--- a/src/battle/src/Update/Puppeteer/Focus.elm
+++ b/src/battle/src/Update/Puppeteer/Focus.elm
@@ -46,4 +46,4 @@ backward : (
       Struct.Model.Type ->
       (Struct.Model.Type, (List (Cmd Struct.Event.Type)))
    )
-backward actor_ix model = (model, [])
+backward actor_ix model = (forward actor_ix model)
diff --git a/src/battle/src/Update/Puppeteer/ToggleCharacterEffect.elm b/src/battle/src/Update/Puppeteer/ToggleCharacterEffect.elm
new file mode 100644
index 0000000..b89362e
--- /dev/null
+++ b/src/battle/src/Update/Puppeteer/ToggleCharacterEffect.elm
@@ -0,0 +1,50 @@
+module Update.Puppeteer.ToggleCharacterEffect exposing (forward, backward)
+
+-- Local Module ----------------------------------------------------------------
+import Struct.Character
+import Struct.Battle
+import Struct.Event
+import Struct.Model
+
+--------------------------------------------------------------------------------
+-- LOCAL -----------------------------------------------------------------------
+--------------------------------------------------------------------------------
+perform : (
+      Int ->
+      String ->
+      Struct.Model.Type ->
+      (Struct.Model.Type, (List (Cmd Struct.Event.Type)))
+   )
+perform char_ix effect model =
+   (
+      {model |
+         battle =
+            (Struct.Battle.update_character
+               char_ix
+               (Struct.Character.toggle_extra_display_effect effect)
+               model.battle
+            )
+      },
+      []
+   )
+--------------------------------------------------------------------------------
+-- EXPORTED --------------------------------------------------------------------
+--------------------------------------------------------------------------------
+forward : (
+      Int ->
+      String ->
+      Struct.Model.Type ->
+      (Struct.Model.Type, (List (Cmd Struct.Event.Type)))
+   )
+forward char_ix effect model =
+   (perform char_ix effect model)
+
+
+backward : (
+      Int ->
+      String ->
+      Struct.Model.Type ->
+      (Struct.Model.Type, (List (Cmd Struct.Event.Type)))
+   )
+backward char_ix effect model =
+   (perform char_ix effect model)
diff --git a/src/battle/src/View/Map/Character.elm b/src/battle/src/View/Map/Character.elm
index 67a165b..b865816 100644
--- a/src/battle/src/View/Map/Character.elm
+++ b/src/battle/src/View/Map/Character.elm
@@ -78,10 +78,15 @@ get_head_html char =
       ]
    )
 
-get_banner_html : Struct.Character.Type -> (Html.Html Struct.Event.Type)
-get_banner_html char =
-   -- TODO: Banner from some status indicator
-   (Shared.Util.Html.nothing)
+get_above_effect_html : Struct.Character.Type -> (Html.Html Struct.Event.Type)
+get_above_effect_html char =
+      (Html.div
+         [
+            (Html.Attributes.class "character-icon-above-effect")
+         ]
+         [
+         ]
+      )
 
 get_actual_html : Struct.Character.Type -> (Html.Html Struct.Event.Type)
 get_actual_html char =
@@ -116,7 +121,7 @@ get_actual_html char =
          [
             (get_body_html char),
             (get_head_html char),
-            (get_banner_html char)
+            (get_above_effect_html char)
          ]
       )
 
diff --git a/src/css/src/battle/keyframes.scss b/src/css/src/battle/keyframes.scss
index 049e9d5..b6229cb 100644
--- a/src/css/src/battle/keyframes.scss
+++ b/src/css/src/battle/keyframes.scss
@@ -19,6 +19,12 @@
     100% { opacity: 1.0; transform: scale(1);}
 }
 
+@keyframes strongly-pulsating-full-opacity {
+    0% { transform: scale(1);}
+    50% { transform: scale(1.5);}
+    100% { transform: scale(1);}
+}
+
 @keyframes brown-alarm-bg {
     0% {background-color: #917C6F;}
     25% {background-color: #AC9D93}
diff --git a/src/css/src/battle/map.scss b/src/css/src/battle/map.scss
index 1501ca1..2fb3581 100644
--- a/src/css/src/battle/map.scss
+++ b/src/css/src/battle/map.scss
@@ -54,5 +54,6 @@
 
 @import 'map/animation.scss';
 @import 'map/character.scss';
+@import 'map/character-effects.scss';
 @import 'map/marker.scss';
 @import 'map/path.scss';
diff --git a/src/css/src/battle/map/character-effects.scss b/src/css/src/battle/map/character-effects.scss
new file mode 100644
index 0000000..e2902f0
--- /dev/null
+++ b/src/css/src/battle/map/character-effects.scss
@@ -0,0 +1,69 @@
+.character-icon.display-effect-ally
+{
+}
+
+.character-icon.display-effect-enemy
+{
+   transform: scale(-1, 1);
+}
+
+.character-icon.display-effect-ally.character-icon-effect-disabled,
+{
+   filter: contrast(35%);
+}
+
+.character-icon.display-effect-target
+{
+   background-color: rgba(255,0,0,0.7);
+   animation-name: red-alarm-bg;
+   animation-duration: 5s;
+   animation-iteration-count: infinite;
+}
+
+.character-icon.display-effect-active,
+.character-icon.display-effect-focused
+{
+   animation-name: strongly-pulsating;
+   animation-duration: 1.5s;
+   animation-iteration-count: infinite;
+}
+
+.display-effect-team-0 .character-icon-body{background-image: url(/asset/svg/icon/body_team_0.svg);}
+.display-effect-team-1 .character-icon-body{background-image: url(/asset/svg/icon/body_team_1.svg);}
+.display-effect-team-2 .character-icon-body{background-image: url(/asset/svg/icon/body_team_2.svg);}
+.display-effect-team-3 .character-icon-body{background-image: url(/asset/svg/icon/body_team_3.svg);}
+.display-effect-team-4 .character-icon-body{background-image: url(/asset/svg/icon/body_team_4.svg);}
+.display-effect-team-5 .character-icon-body{background-image: url(/asset/svg/icon/body_team_5.svg);}
+.display-effect-team-6 .character-icon-body{background-image: url(/asset/svg/icon/body_team_6.svg);}
+.display-effect-team-7 .character-icon-body{background-image: url(/asset/svg/icon/body_team_7.svg);}
+
+.character-icon.display-effect-enabled
+{
+   animation-name: pulsating;
+   animation-duration: 1.5s;
+   animation-iteration-count: infinite;
+   transform-origin: center;
+}
+
+.character-icon.display-effect-switching-weapons > .character-icon-above-effect,
+.character-icon.display-effect-attacking > .character-icon-above-effect
+{
+   animation-name: strongly-pulsating-full-opacity;
+   animation-duration: 2s;
+   animation-iteration-count: infinite;
+}
+
+.character-icon.display-effect-switching-weapons > .character-icon-above-effect
+{
+   background-image: url(/asset/svg/damage_type/swapwp.svg);
+}
+
+.character-icon.display-effect-attacking > .character-icon-above-effect
+{
+   background-image: url(/asset/svg/damage_type/attack.svg);
+}
+
+.character-icon.display-effect-using-skill > .character-icon-above-effect
+{
+   background-image: url(/asset/svg/damage_type/skill.svg);
+}
diff --git a/src/css/src/battle/map/character.scss b/src/css/src/battle/map/character.scss
index 2ba519b..2090a32 100644
--- a/src/css/src/battle/map/character.scss
+++ b/src/css/src/battle/map/character.scss
@@ -15,58 +15,6 @@
    height: inherit;
 }
 
-.character-icon.display-effect-enabled,
-.character-icon-enabled
-{
-   animation-name: pulsating;
-   animation-duration: 1.5s;
-   animation-iteration-count: infinite;
-   transform-origin: center;
-}
-
-.character-icon-banner { z-index: 2; }
+.character-icon-above-effect { z-index: 2; }
 .character-icon-head { z-index: 1; }
 .character-icon-body { z-index: 0; }
-
-.character-icon.display-effect-ally,
-.character-ally
-{
-}
-
-.character-icon.display-effect-enemy,
-.character-enemy
-{
-   transform: scale(-1, 1);
-}
-
-.character-icon.display-effect-ally.character-icon-effect-disabled,
-.character-ally.character-icon-disabled
-{
-   filter: contrast(35%);
-}
-
-.character-icon.display-effect-target,
-.character-targeted
-{
-   background-color: rgba(255,0,0,0.7);
-   animation-name: red-alarm-bg;
-   animation-duration: 5s;
-   animation-iteration-count: infinite;
-}
-
-.character-icon.display-effect-active,
-.character-selected
-{
-   animation-name: strongly-pulsating;
-   animation-duration: 1.5s;
-   animation-iteration-count: infinite;
-}
-
-.display-effect-team-0 .character-icon-body{background-image: url(/asset/svg/icon/body_team_0.svg);}
-.display-effect-team-1 .character-icon-body{background-image: url(/asset/svg/icon/body_team_1.svg);}
-.display-effect-team-2 .character-icon-body{background-image: url(/asset/svg/icon/body_team_2.svg);}
-.display-effect-team-3 .character-icon-body{background-image: url(/asset/svg/icon/body_team_3.svg);}
-.display-effect-team-4 .character-icon-body{background-image: url(/asset/svg/icon/body_team_4.svg);}
-.display-effect-team-5 .character-icon-body{background-image: url(/asset/svg/icon/body_team_5.svg);}
-.display-effect-team-6 .character-icon-body{background-image: url(/asset/svg/icon/body_team_6.svg);}
-.display-effect-team-7 .character-icon-body{background-image: url(/asset/svg/icon/body_team_7.svg);}