diff --git a/traque-front/app/admin/layout.js b/traque-front/app/admin/layout.js index b2097d4..18f1d8e 100644 --- a/traque-front/app/admin/layout.js +++ b/traque-front/app/admin/layout.js @@ -6,17 +6,8 @@ export default function AdminLayout({ children}) { return ( -
-
-
    -
  • Admin
    • -
  • Teams
    • -
  • Parameters
    • -
-
-
- {children} -
+
+ {children}
diff --git a/traque-front/app/admin/page.js b/traque-front/app/admin/page.js index 5def44c..6b74993 100644 --- a/traque-front/app/admin/page.js +++ b/traque-front/app/admin/page.js @@ -3,18 +3,19 @@ import { useAdminConnexion } from "@/context/adminConnexionContext"; import useAdmin from "@/hook/useAdmin"; import dynamic from "next/dynamic"; import TeamList from '@/components/admin/teamList'; -import TeamAddForm from '@/components/admin/teamAdd'; import React, { useState } from 'react' import TeamEdit from '@/components/admin/teamEdit'; +import TeamAddForm from '@/components/admin/teamAdd'; +import Link from "next/link"; const LiveMap = dynamic(() => import('@/components/admin/mapPicker').then((mod) => mod.LiveMap), { ssr: false }); + export default function AdminPage() { const { useProtect } = useAdminConnexion(); - const { gameState, changeState } = useAdmin(); - const { addTeam } = useAdmin(); const [selectedTeamId, setSelectedTeamId] = useState(null); + const { addTeam, gameState, changeState, teams } = useAdmin(); useProtect(); return (
@@ -27,19 +28,30 @@ export default function AdminPage() {

Contrôle

- - - - -
@@ -54,28 +66,45 @@ export default function AdminPage() {
-
+
-
- - - - - - +
diff --git a/traque-front/app/admin/parameters/page.js b/traque-front/app/admin/parameters/page.js index 3d5f318..503fe91 100644 --- a/traque-front/app/admin/parameters/page.js +++ b/traque-front/app/admin/parameters/page.js @@ -3,16 +3,20 @@ import { GameSettings } from "@/components/admin/gameSettings"; import { PenaltySettings } from "@/components/admin/penaltySettings"; import { useAdminConnexion } from "@/context/adminConnexionContext"; import dynamic from "next/dynamic"; +import TeamAddForm from '@/components/admin/teamAdd'; +import useAdmin from '@/hook/useAdmin'; const ZoneSelector = dynamic(() => import('@/components/admin/zoneSelector').then((mod) => mod.ZoneSelector), { ssr: false }); export default function AdminPage() { + const { addTeam } = useAdmin(); const { useProtect } = useAdminConnexion(); useProtect(); return (
+
diff --git a/traque-front/components/admin/mapPicker.jsx b/traque-front/components/admin/mapPicker.jsx index 7cfbc7c..177db2f 100644 --- a/traque-front/components/admin/mapPicker.jsx +++ b/traque-front/components/admin/mapPicker.jsx @@ -1,11 +1,41 @@ "use client"; import { useLocation } from "@/hook/useLocation"; -import { useEffect, useState } from "react"; +import { useEffect, useState, useRef, useCallback } from "react"; import "leaflet/dist/leaflet.css"; import { Circle, MapContainer, Marker, TileLayer, useMap, Tooltip, Polyline } from "react-leaflet"; import { useMapCircleDraw } from "@/hook/mapDrawing"; import useAdmin from "@/hook/useAdmin"; import { GameState } from "@/util/gameState"; +import L from "leaflet"; + + +function MapActionControl({ onClick, children }) { + const map = useMap(); + + useEffect(() => { + const controlDiv = L.DomUtil.create('div', 'leaflet-bar leaflet-control leaflet-control-custom'); + controlDiv.style.background = 'rgba(0,0,0,0.5)'; + controlDiv.style.borderRadius = '9999px'; + controlDiv.style.padding = '8px'; + controlDiv.title = "Plein écran"; + controlDiv.style.display = "flex"; + controlDiv.style.alignItems = "center"; + controlDiv.style.justifyContent = "center"; + controlDiv.style.width = "56px"; + controlDiv.style.height = "56px"; + controlDiv.onclick = onClick; + controlDiv.innerHTML = ``; + const customControl = L.control({ position: 'bottomleft' }); + customControl.onAdd = () => controlDiv; + customControl.addTo(map); + + return () => { + customControl.remove(); + }; + }, [map, onClick, children]); + + return null; +} const positionIcon = new L.Icon({ iconUrl: '/icons/location.png', @@ -112,6 +142,18 @@ export function LiveMap() { const [timeLeftNextZone, setTimeLeftNextZone] = useState(null); const { zone, zoneExtremities, teams, nextZoneDate, isShrinking , getTeam, gameState } = useAdmin(); + const mapWrapperRef = useRef(null); + + const handleFullscreen = useCallback(() => { + const el = mapWrapperRef.current; + if (!el) return; + if (!document.fullscreenElement) { + el.requestFullscreen(); + } else { + document.exitFullscreen(); + } + }, []); + // Remaining time before sending position useEffect(() => { const updateTime = () => { @@ -143,7 +185,7 @@ export function LiveMap() { } return ( -
+
{gameState == GameState.PLAYING &&

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

} )} +
) diff --git a/traque-front/public/icons/arrows.png b/traque-front/public/icons/arrows.png index 2550032..b5bcba3 100644 Binary files a/traque-front/public/icons/arrows.png and b/traque-front/public/icons/arrows.png differ diff --git a/traque-front/public/icons/fullscreen.png b/traque-front/public/icons/fullscreen.png new file mode 100644 index 0000000..4a7fa7c Binary files /dev/null and b/traque-front/public/icons/fullscreen.png differ diff --git a/traque-front/public/icons/informations.png b/traque-front/public/icons/informations.png index 1841b75..af75c7a 100644 Binary files a/traque-front/public/icons/informations.png and b/traque-front/public/icons/informations.png differ diff --git a/traque-front/public/icons/mapstyle.png b/traque-front/public/icons/mapstyle.png index 73e1ff2..28a3e36 100644 Binary files a/traque-front/public/icons/mapstyle.png and b/traque-front/public/icons/mapstyle.png differ diff --git a/traque-front/public/icons/names.png b/traque-front/public/icons/names.png index 5b7e8f8..bae60e2 100644 Binary files a/traque-front/public/icons/names.png and b/traque-front/public/icons/names.png differ