From 74ec028d95331b2a66723bf891fa28e6b47239a7 Mon Sep 17 00:00:00 2001 From: Nathanael Sensfelder Date: Wed, 23 May 2018 18:53:09 +0200 Subject: Puts some armor on the characters. Also adds a file missing from the previous commit. --- src/asset/www/armors.css | 5 + src/asset/www/svg/armor/0.svg | 258 +++++++++++++++++++++++++++++++++ src/asset/www/svg/armor/1.svg | 255 ++++++++++++++++++++++++++++++++ src/asset/www/svg/portrait/crow.svg | 43 +++--- src/battlemap/src/Struct/Armor.elm | 36 +++++ src/battlemap/src/Struct/Character.elm | 20 ++- src/battlemap/src/View/Character.elm | 222 ++++++++++++++++++++++++++++ src/battlemap/www/index.html | 1 + src/battlemap/www/style.css | 21 +++ 9 files changed, 837 insertions(+), 24 deletions(-) create mode 100644 src/asset/www/armors.css create mode 100644 src/asset/www/svg/armor/0.svg create mode 100644 src/asset/www/svg/armor/1.svg create mode 100644 src/battlemap/src/Struct/Armor.elm create mode 100644 src/battlemap/src/View/Character.elm diff --git a/src/asset/www/armors.css b/src/asset/www/armors.css new file mode 100644 index 0000000..5dca54b --- /dev/null +++ b/src/asset/www/armors.css @@ -0,0 +1,5 @@ +.asset-armor-placeholder{background-image: url(/asset/svg/armor/cat_hermine.svg);} +.asset-armor-0 {background-image: url(/asset/svg/armor/0.svg);} +.asset-armor-1 {background-image: url(/asset/svg/armor/1.svg);} +.asset-armor-variation-0 {background-position: 0 0;} +.asset-armor-variation-1 {background-position: 100% 0;} diff --git a/src/asset/www/svg/armor/0.svg b/src/asset/www/svg/armor/0.svg new file mode 100644 index 0000000..0266f4c --- /dev/null +++ b/src/asset/www/svg/armor/0.svg @@ -0,0 +1,258 @@ + + + + diff --git a/src/asset/www/svg/armor/1.svg b/src/asset/www/svg/armor/1.svg new file mode 100644 index 0000000..9157efb --- /dev/null +++ b/src/asset/www/svg/armor/1.svg @@ -0,0 +1,255 @@ + + + + diff --git a/src/asset/www/svg/portrait/crow.svg b/src/asset/www/svg/portrait/crow.svg index 8f3e4f1..7e6827c 100644 --- a/src/asset/www/svg/portrait/crow.svg +++ b/src/asset/www/svg/portrait/crow.svg @@ -25,13 +25,13 @@ borderopacity="1.0" inkscape:pageopacity="0.0" inkscape:pageshadow="2" - inkscape:zoom="4" - inkscape:cx="90.025872" - inkscape:cy="65.117843" + inkscape:zoom="1" + inkscape:cx="30.39432" + inkscape:cy="99.994134" inkscape:document-units="mm" inkscape:current-layer="layer1" showgrid="false" - inkscape:window-width="1918" + inkscape:window-width="958" inkscape:window-height="1059" inkscape:window-x="1" inkscape:window-y="20" @@ -57,8 +57,8 @@ transform="translate(0,-233)" style="display:inline;opacity:1"> @@ -69,8 +69,8 @@ inkscape:label="mask" style="display:inline"> @@ -81,14 +81,14 @@ inkscape:label="beak" style="display:inline;opacity:1"> @@ -99,22 +99,21 @@ inkscape:label="eyes" style="display:inline"> + ry="0.36823002" + rx="0.19758686" + cy="30.105455" + cx="31.959036" /> diff --git a/src/battlemap/src/Struct/Armor.elm b/src/battlemap/src/Struct/Armor.elm new file mode 100644 index 0000000..c62b0c7 --- /dev/null +++ b/src/battlemap/src/Struct/Armor.elm @@ -0,0 +1,36 @@ +module Struct.Armor exposing + ( + Type, + Ref, + new, + get_id + ) + +-- Battlemap ------------------------------------------------------------------- +import Struct.Attributes + +-------------------------------------------------------------------------------- +-- TYPES ----------------------------------------------------------------------- +-------------------------------------------------------------------------------- +type alias Type = + { + id : Int + } + +type alias Ref = Int + +-------------------------------------------------------------------------------- +-- LOCAL ----------------------------------------------------------------------- +-------------------------------------------------------------------------------- + +-------------------------------------------------------------------------------- +-- EXPORTED -------------------------------------------------------------------- +-------------------------------------------------------------------------------- +new : Int -> Type +new id = + { + id = id + } + +get_id : Type -> Ref +get_id ar = ar.id diff --git a/src/battlemap/src/Struct/Character.elm b/src/battlemap/src/Struct/Character.elm index 89b6dea..332c2fd 100644 --- a/src/battlemap/src/Struct/Character.elm +++ b/src/battlemap/src/Struct/Character.elm @@ -7,6 +7,8 @@ module Struct.Character exposing get_name, get_icon_id, get_portrait_id, + get_armor, + get_armor_variation, get_current_health, set_current_health, get_location, @@ -26,6 +28,7 @@ import Json.Decode import Json.Decode.Pipeline -- Battlemap ------------------------------------------------------------------- +import Struct.Armor import Struct.Attributes import Struct.Location import Struct.Statistics @@ -62,7 +65,8 @@ type alias Type = enabled : Bool, attributes : Struct.Attributes.Type, statistics : Struct.Statistics.Type, - weapons : Struct.WeaponSet.Type + weapons : Struct.WeaponSet.Type, + armor : Struct.Armor.Type } type alias Ref = String @@ -92,7 +96,8 @@ finish_decoding get_weapon add_char = statistics = (Struct.Statistics.new add_char.att weapon_set), player_id = add_char.pla, enabled = add_char.ena, - weapons = weapon_set + weapons = weapon_set, + armor = (Struct.Armor.new (add_char.ix % 2)) } -------------------------------------------------------------------------------- @@ -143,6 +148,17 @@ set_enabled enabled char = {char | enabled = enabled} get_weapons : Type -> Struct.WeaponSet.Type get_weapons char = char.weapons +get_armor : Type -> Struct.Armor.Type +get_armor char = char.armor + +get_armor_variation : Type -> String +get_armor_variation char = + case char.portrait of + -- Currently hardcoded to match crows from characters.css + "11" -> "1" + "4" -> "1" + _ -> "0" + set_weapons : Struct.WeaponSet.Type -> Type -> Type set_weapons weapons char = {char | diff --git a/src/battlemap/src/View/Character.elm b/src/battlemap/src/View/Character.elm new file mode 100644 index 0000000..e3ff30b --- /dev/null +++ b/src/battlemap/src/View/Character.elm @@ -0,0 +1,222 @@ +module View.Character exposing + ( + get_portrait_html, + get_icon_html + ) + +-- Elm ------------------------------------------------------------------------- +import Html +import Html.Attributes +import Html.Events + +-- Battlemap ------------------------------------------------------------------ +import Constants.UI + +import Util.Html + +import Struct.Armor +import Struct.Character +import Struct.CharacterTurn +import Struct.Event +import Struct.Model +import Struct.UI + +-------------------------------------------------------------------------------- +-- LOCAL ----------------------------------------------------------------------- +-------------------------------------------------------------------------------- +get_activation_level_class : ( + Struct.Character.Type -> + (Html.Attribute Struct.Event.Type) + ) +get_activation_level_class char = + if (Struct.Character.is_enabled char) + then + (Html.Attributes.class "battlemap-character-icon-enabled") + else + (Html.Attributes.class "battlemap-character-icon-disabled") + +get_alliance_class : ( + Struct.Model.Type -> + Struct.Character.Type -> + (Html.Attribute Struct.Event.Type) + ) +get_alliance_class model char = + if ((Struct.Character.get_player_id char) == model.player_id) + then + (Html.Attributes.class "battlemap-character-ally") + else + (Html.Attributes.class "battlemap-character-enemy") + +get_position_style : ( + Struct.Character.Type -> + (Html.Attribute Struct.Event.Type) + ) +get_position_style char = + let char_loc = (Struct.Character.get_location char) in + (Html.Attributes.style + [ + ("top", ((toString (char_loc.y * Constants.UI.tile_size)) ++ "px")), + ("left", ((toString (char_loc.x * Constants.UI.tile_size)) ++ "px")) + ] + ) + +get_focus_class : ( + Struct.Model.Type -> + Struct.Character.Type -> + (Html.Attribute Struct.Event.Type) + ) +get_focus_class model char = + if + ( + (Struct.UI.get_previous_action model.ui) + == + (Just (Struct.UI.SelectedCharacter (Struct.Character.get_ref char))) + ) + then + (Html.Attributes.class "battlemap-character-selected") + else + if + ( + (Struct.CharacterTurn.try_getting_target model.char_turn) + == + (Just (Struct.Character.get_ref char)) + ) + then + (Html.Attributes.class "battlemap-character-targeted") + else + (Html.Attributes.class "") + +get_icon_body_html : Struct.Character.Type -> (Html.Html Struct.Event.Type) +get_icon_body_html char = + (Html.div + [ + (Html.Attributes.class "battlemap-character-icon-body"), + (Html.Attributes.class + ( + "asset-character-team-body-" + ++ (Struct.Character.get_player_id char) + ) + ) + ] + [ + ] + ) + +get_icon_head_html : Struct.Character.Type -> (Html.Html Struct.Event.Type) +get_icon_head_html char = + (Html.div + [ + (Html.Attributes.class "battlemap-character-icon-head"), + (Html.Attributes.class + ("asset-character-icon-" ++ (Struct.Character.get_icon_id char)) + ) + ] + [ + ] + ) + +get_icon_actual_html : ( + Struct.Model.Type -> + Struct.Character.Type -> + (Html.Html Struct.Event.Type) + ) +get_icon_actual_html model char = + (Html.div + [ + (Html.Attributes.class "battlemap-tiled"), + (Html.Attributes.class "battlemap-character-icon"), + (get_activation_level_class char), + (get_alliance_class model char), + (get_position_style char), + (get_focus_class model char), + (Html.Attributes.class "clickable"), + (Html.Events.onClick + (Struct.Event.CharacterSelected (Struct.Character.get_ref char)) + ) + ] + [ + (get_icon_body_html char), + (get_icon_head_html char) + ] + ) + +get_portrait_body_html : Struct.Character.Type -> (Html.Html Struct.Event.Type) +get_portrait_body_html char = + (Html.div + [ + (Html.Attributes.class "battlemap-character-portrait-body"), + (Html.Attributes.class + ( + "asset-character-portrait-" + ++ (Struct.Character.get_portrait_id char) + ) + ) + ] + [ + ] + ) + +get_portrait_armor_html : Struct.Character.Type -> (Html.Html Struct.Event.Type) +get_portrait_armor_html char = + (Html.div + [ + (Html.Attributes.class "battlemap-character-portrait-armor"), + (Html.Attributes.class + ( + "asset-armor-" + ++ + (toString + (Struct.Armor.get_id (Struct.Character.get_armor char)) + ) + ) + ), + (Html.Attributes.class + ( + "asset-armor-variation-" + ++ (Struct.Character.get_armor_variation char) + ) + ) + ] + [ + ] + ) + +-------------------------------------------------------------------------------- +-- EXPORTED -------------------------------------------------------------------- +-------------------------------------------------------------------------------- +get_portrait_html : ( + String -> + Struct.Character.Type -> + (Html.Html Struct.Event.Type) + ) +get_portrait_html viewer_id char = + (Html.div + [ + (Html.Attributes.class + ( + if ((Struct.Character.get_player_id char) == viewer_id) + then + "battlemap-character-ally" + else + "battlemap-character-enemy" + ) + ), + (Html.Attributes.class "battlemap-character-portrait") + ] + [ + (get_portrait_body_html char), + (get_portrait_armor_html char) + ] + ) + +get_icon_html : ( + Struct.Model.Type -> + Struct.Character.Type -> + (Html.Html Struct.Event.Type) + ) +get_icon_html model char = + if (Struct.Character.is_alive char) + then + (get_icon_actual_html model char) + else + (Util.Html.nothing) diff --git a/src/battlemap/www/index.html b/src/battlemap/www/index.html index d019783..9b216f9 100644 --- a/src/battlemap/www/index.html +++ b/src/battlemap/www/index.html @@ -5,6 +5,7 @@ + diff --git a/src/battlemap/www/style.css b/src/battlemap/www/style.css index ffd32d5..e2b5151 100644 --- a/src/battlemap/www/style.css +++ b/src/battlemap/www/style.css @@ -224,6 +224,27 @@ height: 100px; } +.battlemap-character-portrait * +{ + box-sizing: border-box; + background-size: 100% 100%; + width: inherit; + height: inherit; +} + +.battlemap-character-portrait-body +{ + z-index: 1; +} + +.battlemap-character-portrait-armor +{ + position: relative; + z-index: 1; + top: -100%; + background-size: 200% 100%; +} + .battlemap-timeline-element, .battlemap-characters-element { -- cgit v1.2.3-70-g09d2