diff --git a/traque-front/app/admin/layout.js b/traque-front/app/admin/layout.js index 9ff7fa6..c75d592 100644 --- a/traque-front/app/admin/layout.js +++ b/traque-front/app/admin/layout.js @@ -11,6 +11,7 @@ export default function AdminLayout({ children}) {
diff --git a/traque-front/app/admin/map/page.js b/traque-front/app/admin/map/page.js new file mode 100644 index 0000000..8dfecf8 --- /dev/null +++ b/traque-front/app/admin/map/page.js @@ -0,0 +1,9 @@ +"use client"; +import dynamic from 'next/dynamic'; + +const LiveMap = dynamic(() => import('@/components/admin/maps').then((mod) => mod.LiveMap), { + ssr: false +}); +export default function LiveMapPage() { + return +} \ No newline at end of file diff --git a/traque-front/app/admin/page.js b/traque-front/app/admin/page.js index 1159612..6e0ff72 100644 --- a/traque-front/app/admin/page.js +++ b/traque-front/app/admin/page.js @@ -11,7 +11,7 @@ import dynamic from "next/dynamic"; const ZoneSelector = dynamic(() => import('@/components/admin/zoneSelector').then((mod) => mod.ZoneSelector), { ssr: false }); -const LiveMap = dynamic(() => import('@/components/admin/maps').then((mod) => mod.ZoneEditor), { +const ZoneEditor = dynamic(() => import('@/components/admin/maps').then((mod) => mod.ZoneEditor), { ssr: false }); export default function AdminPage() { @@ -36,7 +36,7 @@ export default function AdminPage() { {(gameState == GameState.SETUP || gameState == GameState.PLACEMENT) && } {(gameState == GameState.SETUP || gameState == GameState.PLACEMENT) && } {gameState == GameState.PLAYING &&
- +
}
) diff --git a/traque-front/components/admin/maps.jsx b/traque-front/components/admin/maps.jsx index 7135b19..1c0aff6 100644 --- a/traque-front/components/admin/maps.jsx +++ b/traque-front/components/admin/maps.jsx @@ -107,7 +107,7 @@ export function ZoneEditor() { const { zone, teams, getTeamName, removeZone } = useAdmin(); const [zonesToDelete, setZonesToDelete] = useState([]); const [tilesColor, setTilesColor] = useState([]); - const [timeBeforeDeletion, setTimeBeforeDeletion] = useState(0); + const [timeBeforeDeletion, setTimeBeforeDeletion] = useState(null); function handleClickTile(tile) { if (!zone.some(t => t.x === tile.x && t.y === tile.y)) return; @@ -127,6 +127,7 @@ export function ZoneEditor() { ...zone .filter(t => !zonesToDelete.some(t2 => t.x == t2.x && t.y == t2.y)) .map(t => { + console.log(t) if (t.removeDate == null) { return { x: t.x, y: t.y, color: 'rgba(0, 0, 255, 0.5)' } } else { @@ -137,44 +138,107 @@ export function ZoneEditor() { }, [zone, zonesToDelete]); const handleSubmit = (e) => { + if (timeBeforeDeletion == null) { + return; + } e.preventDefault(); removeZone(zonesToDelete, timeBeforeDeletion); setZonesToDelete([]); - setTimeBeforeDeletion(0); + setTimeBeforeDeletion(null); } return (
- - - - {teams.map((team) => team.currentLocation && !team.captured && - - {team.name} -

Chasing : {getTeamName(team.chasing)}

-

Chased by : {getTeamName(team.chased)}

-
-
)} - - - - - - - -
- setTimeBeforeDeletion(Number(e.target.value))}> - Delete selected zones +
+ + + + {teams.map((team) => team.currentLocation && !team.captured && + + {team.name} +

Chasing : {getTeamName(team.chasing)}

+

Chased by : {getTeamName(team.chased)}

+
+
)} + + + + + + + +
+
+
+ + setTimeBeforeDeletion(Number(e.target.value))}> + Delete selected zones +
) +} + +export function LiveMap({ ...props }) { + const location = useLocation(Infinity); + const { zone, teams, getTeamName } = useAdmin(); + const tilesColor = useTilesColor(zone); + + return ( + + + + + + + { }} tileSize={16} /> + + + + + {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 && + + Last position of {team.name} + + )} + + +
+
+ ) } \ No newline at end of file diff --git a/traque-front/components/util/map.jsx b/traque-front/components/util/map.jsx index 39ca395..bf19533 100644 --- a/traque-front/components/util/map.jsx +++ b/traque-front/components/util/map.jsx @@ -2,6 +2,7 @@ export class TileNumber { constructor(x, y) { this.x = x; this.y = y; + this.removeDate = null; } equals(other) { return this.x === other.x && this.y === other.y; diff --git a/traque-front/context/adminContext.jsx b/traque-front/context/adminContext.jsx index d7f6511..25f1e51 100644 --- a/traque-front/context/adminContext.jsx +++ b/traque-front/context/adminContext.jsx @@ -28,7 +28,11 @@ function AdminProvider({ children }) { useSocketListener(adminSocket, "teams", setTeams); useSocketListener(adminSocket, "game_settings", setGameSettings); useSocketListener(adminSocket, "penalty_settings", setPenaltySettings); - useSocketListener(adminSocket, "zone", (zone) => setZone(zone.map(t => new TileNumber(t.x, t.y)))); + useSocketListener(adminSocket, "zone", (zone) => setZone(zone.map(t => { + let tile = new TileNumber(t.x, t.y); + tile.removeDate = t.removeDate; + return tile; + }))); useSocketListener(adminSocket, "new_zone", setZoneExtremities); const value = useMemo(() => ({ zone, zoneExtremities, teams, penaltySettings, gameSettings, gameState }), [teams, gameState, zone, zoneExtremities, penaltySettings, gameSettings]); diff --git a/traque-front/public/icons/clock.png b/traque-front/public/icons/clock.png new file mode 100644 index 0000000..6097257 Binary files /dev/null and b/traque-front/public/icons/clock.png differ