From 4d53aabef417e9742d9f7b29b8271521ae61a4e5 Mon Sep 17 00:00:00 2001
From: Alessio Davoli <davoli.alessio@webdeploy.it>
Date: Wed, 13 Dec 2023 19:02:00 +0100
Subject: [PATCH] Update user marker position

---
 frontend/src/lib/components/tabs/MapTab.svelte | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/frontend/src/lib/components/tabs/MapTab.svelte b/frontend/src/lib/components/tabs/MapTab.svelte
index 7c97c6e..2ab1ec4 100644
--- a/frontend/src/lib/components/tabs/MapTab.svelte
+++ b/frontend/src/lib/components/tabs/MapTab.svelte
@@ -1,6 +1,7 @@
 <script lang="ts">
 	import { onMount, onDestroy } from 'svelte';
 	import { fade } from 'svelte/transition';
+	const mapMarkerIcon = new URL('/icons/map.png', import.meta.url).href
 
 	export let route;
 	const pianelloCoordinates = [43.14, 12.53];
@@ -17,7 +18,7 @@
 	const openStreetMapTile = 'https://tile.openstreetmap.org/{z}/{x}/{y}.png';
 
 	let errored = false;
-
+	
 	const watchPosition = async () => {
         if (!("geolocation" in navigator)) {
 			errored = true;
@@ -39,7 +40,12 @@
             longitude = crd.longitude;
             accuracy = crd.accuracy;
 			
-    		const userMarker = leaflet.marker([latitude, longitude]).addTo(map);
+			const icon = leaflet.icon({
+				iconUrl: mapMarkerIcon,
+				iconSize: [38, 95], // size of the icon
+			});
+			userMarker = leaflet.marker([latitude, longitude], {icon}).addTo(map);
+
 			// move the map to have the location in its center
 			map.panTo(userMarker.getLatLng());