| summaryrefslogtreecommitdiff |
diff options
| -rw-r--r-- | src/battlemap/src/Constants/IO.elm | 3 | ||||
| -rw-r--r-- | src/battlemap/src/Struct/Tile.elm | 4 | ||||
| -rw-r--r-- | src/battlemap/src/View/Battlemap/Tile.elm | 23 | ||||
| -rw-r--r-- | src/battlemap/www/style.css | 12 |
4 files changed, 39 insertions, 3 deletions
diff --git a/src/battlemap/src/Constants/IO.elm b/src/battlemap/src/Constants/IO.elm index ba8701d..fe62a6f 100644 --- a/src/battlemap/src/Constants/IO.elm +++ b/src/battlemap/src/Constants/IO.elm @@ -12,3 +12,6 @@ character_turn_handler = (battlemap_handler_url ++ "/character_turn") battlemap_loading_handler : String battlemap_loading_handler = (battlemap_handler_url ++ "/load_state") + +tile_assets_url : String +tile_assets_url = (base_url ++ "/asset/svg/tile/") diff --git a/src/battlemap/src/Struct/Tile.elm b/src/battlemap/src/Struct/Tile.elm index d75e74e..6063cb8 100644 --- a/src/battlemap/src/Struct/Tile.elm +++ b/src/battlemap/src/Struct/Tile.elm @@ -48,7 +48,9 @@ get_location : Type -> Struct.Location.Type get_location tile = tile.location get_icon_id : Type -> String -get_icon_id tile = tile.icon_id +get_icon_id tile = + -- Just to see how it looks with SVG + (toString (rem tile.crossing_cost 2)) get_cost : Type -> Int get_cost tile = tile.crossing_cost diff --git a/src/battlemap/src/View/Battlemap/Tile.elm b/src/battlemap/src/View/Battlemap/Tile.elm index 1c3628c..3286394 100644 --- a/src/battlemap/src/View/Battlemap/Tile.elm +++ b/src/battlemap/src/View/Battlemap/Tile.elm @@ -7,6 +7,7 @@ import Html.Events -- Battlemap ------------------------------------------------------------------- import Constants.UI +import Constants.IO import Struct.Event import Struct.Location @@ -32,7 +33,18 @@ get_html tile = (Html.Attributes.class "battlemap-tile-icon"), (Html.Attributes.class "battlemap-tiled"), (Html.Attributes.class - ("asset-tile-" ++ (Struct.Tile.get_icon_id tile)) + ( + "battlemap-tile-variant-" + ++ + (toString + -- I don't like how Elm does random, let's get some noisy + -- function instead. + (rem + ((-1 * (tile_loc.x + tile_loc.y))^2) + 9 + ) + ) + ) ), (Html.Attributes.class "clickable"), (Html.Events.onClick @@ -47,6 +59,15 @@ get_html tile = ( "left", ((toString (tile_loc.x * Constants.UI.tile_size)) ++ "px") + ), + ( + "background-image", + ( + "url(" + ++ Constants.IO.tile_assets_url + ++ (Struct.Tile.get_icon_id tile) + ++".svg)" + ) ) ] ) diff --git a/src/battlemap/www/style.css b/src/battlemap/www/style.css index b4e744a..4ba0dc5 100644 --- a/src/battlemap/www/style.css +++ b/src/battlemap/www/style.css @@ -195,7 +195,17 @@ /* max-width: 32px; */ } -.battlemap-tile-icon {z-index: 0; position: absolute;} +.battlemap-tile-variant-0 {background-position: 0 0;} +.battlemap-tile-variant-1 {background-position: 32px 0;} +.battlemap-tile-variant-2 {background-position: 64px 0;} +.battlemap-tile-variant-3 {background-position: 0 32px;} +.battlemap-tile-variant-4 {background-position: 32px 32px;} +.battlemap-tile-variant-5 {background-position: 64px 32px;} +.battlemap-tile-variant-6 {background-position: 0 64px;} +.battlemap-tile-variant-7 {background-position: 32px 64px;} +.battlemap-tile-variant-8 {background-position: 64px 64px;} + +.battlemap-tile-icon {z-index: 0; position: absolute; background-size: 96px 96px;} .battlemap-marker-icon {z-index: 1;} .battlemap-character-icon {z-index: 2;} .battlemap-path-icon {z-index: 3; color: white;} |