diff --git a/traque-front/components/admin/mapPicker.jsx b/traque-front/components/admin/mapPicker.jsx index 24e07a5..f2af583 100644 --- a/traque-front/components/admin/mapPicker.jsx +++ b/traque-front/components/admin/mapPicker.jsx @@ -2,10 +2,18 @@ import { useLocation } from "@/hook/useLocation"; import { useEffect, useState } from "react"; import "leaflet/dist/leaflet.css"; -import { Circle, MapContainer, Marker, Popup, TileLayer, useMap } from "react-leaflet"; +import { Circle, MapContainer, Marker, TileLayer, useMap, Tooltip, Polyline } from "react-leaflet"; import { useMapCircleDraw } from "@/hook/mapDrawing"; import useAdmin from "@/hook/useAdmin"; +const positionIcon = new L.Icon({ + iconUrl: '/icons/location.png', + iconSize: [30, 30], + iconAnchor: [15, 15], + popupAnchor: [0, -15], + shadowSize: [30, 30], +}); + function MapPan(props) { const map = useMap(); const [initialized, setInitialized] = useState(false); @@ -36,24 +44,19 @@ function MapEventListener({ onClick, onMouseMove }) { return null; } -const DEFAULT_ZOOM = 17; +const DEFAULT_ZOOM = 14; export function CircularAreaPicker({ area, setArea, markerPosition, ...props }) { const location = useLocation(Infinity); const { handleClick, handleMouseMove, center, radius } = useMapCircleDraw(area, setArea); return ( - + {center && radius && } - {markerPosition && } + {markerPosition && + } ) @@ -84,7 +87,7 @@ export function ZonePicker({ minZone, setMinZone, maxZone, setMaxZone, editMode, return (
- + { @@ -128,6 +131,16 @@ export function LiveMap() { return String(minutes).padStart(2,"0") + ":" + String(seconds).padStart(2,"0"); } + function Arrow({pos1, pos2}) { + if (pos1 && pos2) { + return ( + + ) + } else { + return null; + } + } + return (

{`${isShrinking ? "Fin" : "Début"} du rétrécissement de la zone dans : ${formatTime(timeLeftNextZone)}`}

@@ -140,19 +153,12 @@ export function LiveMap() { {zone && } {zoneExtremities && } {zoneExtremities && } - {teams.map((team) => team.currentLocation && !team.captured && - - {team.name} -

Chasing : {getTeamName(team.chasing)}

-

Chased by : {getTeamName(team.chased)}

-
-
)} + {teams.map((team) => team.currentLocation && !team.captured && + + {team.name} + + + )}
) diff --git a/traque-front/components/team/map.jsx b/traque-front/components/team/map.jsx index 54fe6c0..a3db9f3 100644 --- a/traque-front/components/team/map.jsx +++ b/traque-front/components/team/map.jsx @@ -7,7 +7,7 @@ import "leaflet/dist/leaflet.css"; import useGame from '@/hook/useGame'; import { useTeamContext } from '@/context/teamContext'; -const DEFAULT_ZOOM = 17; +const DEFAULT_ZOOM = 14; // Pan to the center of the map when the position of the user is updated for the first time @@ -54,10 +54,10 @@ export function LiveMap({ ...props }) { /> {currentPosition && Votre position @@ -65,10 +65,10 @@ export function LiveMap({ ...props }) { } {enemyPosition && Position de l'ennemi @@ -91,10 +91,10 @@ export function PlacementMap({ ...props }) { /> {currentPosition && Votre position diff --git a/traque-front/jsconfig.json b/traque-front/jsconfig.json index 2a2e4b3..f29d1d8 100644 --- a/traque-front/jsconfig.json +++ b/traque-front/jsconfig.json @@ -2,6 +2,7 @@ "compilerOptions": { "paths": { "@/*": ["./*"] - } + }, + "lib": ["es2015"] } } diff --git a/traque-front/public/icons/location.png b/traque-front/public/icons/location.png index be9e2ef..31a3c48 100644 Binary files a/traque-front/public/icons/location.png and b/traque-front/public/icons/location.png differ diff --git a/traque-front/public/icons/target.png b/traque-front/public/icons/target.png index 67ba61d..a060625 100644 Binary files a/traque-front/public/icons/target.png and b/traque-front/public/icons/target.png differ