| summaryrefslogtreecommitdiff |
diff options
| author | nsensfel <SpamShield0@noot-noot.org> | 2017-10-19 15:33:41 +0200 |
|---|---|---|
| committer | nsensfel <SpamShield0@noot-noot.org> | 2017-10-19 15:33:41 +0200 |
| commit | 4ca4778bad6f586b38e41df9e571a9331e73b2f1 (patch) | |
| tree | c8b49d84045c43cd16047335d746725ea223d4b8 /src/battlemap | |
| parent | e008855086d124f0de14eacc858ecb57d23e371c (diff) | |
Adds colors to see the battlemap.
Navigator seems borked, though.
Diffstat (limited to 'src/battlemap')
| -rw-r--r-- | src/battlemap/src/View/Battlemap.elm | 1 | ||||
| -rw-r--r-- | src/battlemap/src/View/Battlemap/Navigator.elm | 48 | ||||
| -rw-r--r-- | src/battlemap/src/View/Battlemap/Tile.elm | 1 | ||||
| -rw-r--r-- | src/battlemap/www/index.html | 67 |
4 files changed, 113 insertions, 4 deletions
diff --git a/src/battlemap/src/View/Battlemap.elm b/src/battlemap/src/View/Battlemap.elm index efe4d1e..94acf25 100644 --- a/src/battlemap/src/View/Battlemap.elm +++ b/src/battlemap/src/View/Battlemap.elm @@ -27,6 +27,7 @@ char_on_map tile_size char = (Html.div [ (Html.Attributes.class "battlemap-character-icon"), + (Html.Attributes.class "battlemap-tiled"), (Html.Attributes.class ("asset-character-icon-" ++ (Character.get_icon_id char)) ), diff --git a/src/battlemap/src/View/Battlemap/Navigator.elm b/src/battlemap/src/View/Battlemap/Navigator.elm index 4180e6d..a138a19 100644 --- a/src/battlemap/src/View/Battlemap/Navigator.elm +++ b/src/battlemap/src/View/Battlemap/Navigator.elm @@ -1,10 +1,12 @@ module View.Battlemap.Navigator exposing (get_html) +import List import Html ---import Html.Attributes ---import Html.Events +import Html.Attributes +import Html.Events ---import Battlemap.Location +import Battlemap.Location +import Battlemap.Marker import Battlemap.Navigator import Event @@ -14,4 +16,42 @@ get_html : ( Battlemap.Navigator.Summary -> (List (Html.Html Event.Type)) ) -get_html tile_size nav_summary = [] +get_html tile_size nav_summary = + (List.map + (\(loc_ref, marker) -> + (Html.div + [ + (Html.Attributes.class "battlemap-marker-icon"), + (Html.Attributes.class "battlemap-tiled"), + (Html.Attributes.class + ( + "asset-marker-icon-" + ++ + if (marker == Battlemap.Marker.CanGoTo) + then + "can-go-to" + else + "can-attack" + ) + ), + (Html.Events.onClick + (Event.TileSelected loc_ref) + ), + (Html.Attributes.style + ( + let + loc = (Battlemap.Location.from_ref loc_ref) + in + [ + ("top", ((toString (loc.y * tile_size)) ++ "px")), + ("left", ((toString (loc.x * tile_size)) ++ "px")) + ] + ) + ) + ] + [ + ] + ) + ) + nav_summary.markers + ) diff --git a/src/battlemap/src/View/Battlemap/Tile.elm b/src/battlemap/src/View/Battlemap/Tile.elm index d38d84e..d4b4cc8 100644 --- a/src/battlemap/src/View/Battlemap/Tile.elm +++ b/src/battlemap/src/View/Battlemap/Tile.elm @@ -21,6 +21,7 @@ get_html tile_size tile = (Html.div [ (Html.Attributes.class "battlemap-tile-icon"), + (Html.Attributes.class "battlemap-tiled"), (Html.Attributes.class ("asset-tile-" ++ (toString (Battlemap.Tile.get_icon_id tile))) ), diff --git a/src/battlemap/www/index.html b/src/battlemap/www/index.html index f630b80..e8bff19 100644 --- a/src/battlemap/www/index.html +++ b/src/battlemap/www/index.html @@ -1,6 +1,73 @@ <!DOCTYPE html> <html> <head> + <style> + .battlemap-container + { + position: relative; + } + + .battlemap-tiled + { + position: absolute; + height: 32px; + width: 32px; + } + + .battlemap-tile-icon + { + z-index: 0; + } + + .asset-tile-\"0\" + { + background-color: green; + } + + .asset-tile-\"1\" + { + background-color: yellow; + } + + .asset-tile-\"2\" + { + background-color: red; + } + + .battlemap-character-icon + { + z-index: 2; + } + + .asset-character-icon-Icon0 + { + background-color: cyan; + } + + .asset-character-icon-Icon1 + { + background-color: blue; + } + + .asset-character-icon-Icon2 + { + background-color: darkblue; + } + + .battlemap-marker-icon + { + z-index: 1; + } + .asset-marker-icon-can-go-to + { + background-color:rgba(0,0,0,0.5); + } + + .asset-marker-icon-can-attack + { + background-color:rgba(0,0,0,0.7); + } + </style> </head> <body> <script src="script/main.js"></script> |