Added current player marker

src/components/maps/AllianceKaldelienne.astro

@@ -2,15 +2,16 @@
 import type { MapMarker } from '@/types/Leaflet';
 
 interface Props {
-    markers: MapMarker;
+    markers: MapMarker[];
+    players?: MapMarker;
 }
 
-const { markers } = Astro.props
+const { markers, players } = Astro.props
 ---
 
 <div id="map"></div>
 
-<script lang="ts" define:vars={{ markers }}>
+<script lang="ts" define:vars={{ markers, players }}>
     const mapHeight = 15168;
     const mapWidth = 14658;
 
@@ -29,6 +30,7 @@ const { markers } = Astro.props
     }).addTo(map);
 
     const layerGroups = {
+        players: L.layerGroup(),
         capitals: L.layerGroup(),
         cities: L.layerGroup(),
         towns: L.layerGroup(),
@@ -38,8 +40,6 @@ const { markers } = Astro.props
     /**
      * Build all markers and their related info
      */
-
-
     for (let i = 0; i < markers.length; i++) {
         const m = markers[i];
 
@@ -53,9 +53,9 @@ const { markers } = Astro.props
                     iconUrl: `icons/castle.png`,
                     shadowUrl: `icons/castle-shadow.png`,
                     iconSize: [25, 25],
-                    shadowSize: [40, 30],
+                    shadowSize: [35, 30],
                     iconAnchor: [12.5, 8],
-                    shadowAnchor: [12.5, 12]
+                    shadowAnchor: [11, 12]
                 });
                 break;
             
@@ -104,6 +104,27 @@ const { markers } = Astro.props
         marker.addTo(layerGroups[m.group])
     }
 
+    /**
+     * Add player's position marker
+     */
+    if ( players ) {
+        const playersPosition = [players.markerCoords.y, players.markerCoords.x];
+
+        const playerIcon = L.icon({
+            iconUrl: `icons/location-pin.png`,
+            shadowUrl: `icons/location-pin-shadow.png`,
+            iconSize: [18, 24],
+            shadowSize: [20, 16],
+            iconAnchor: [11, 8],
+            shadowAnchor: [3, 0],
+        });
+
+        const playerMarker = L.marker(playersPosition, { icon: playerIcon }).addTo(map)
+        playerMarker.addTo(layerGroups['players'])
+
+        console.log(map)
+    }
+
     map.fitBounds(layer.getBounds());
 
     // L.control.layers({ "base": layer }, layerGroups).addTo(map);