onSelected(team.id)}>
-
0 ? "/icons/greendude.png" : "/icons/reddude.png"} className="w-4 h-4" />
-
20 ? "/icons/greenbattery.png" : "/icons/redbattery.png"} className="w-4 h-4" />
-
+
0 ? "green" : "red"}.png`} className="w-4 h-4" />
+
= 20 ? "green" : "red"}.png`} className="w-4 h-4" />
+
{team.name}
@@ -44,16 +45,14 @@ function TeamListItem({ itemSelected, team }) {
);
}
-export default function TeamList({selectedTeamId, onSelected}) {
+export default function TeamViewer({selectedTeamId, onSelected}) {
const { teams } = useAdmin();
return (
-
- {teams.map((team) => (
- - onSelected(team.id)}>
-
-
- ))}
-
+
+ {(team) => (
+
+ )}
+
);
}
diff --git a/traque-front/app/admin/layout.js b/traque-front/app/admin/layout.js
index f20789a..6e252a3 100644
--- a/traque-front/app/admin/layout.js
+++ b/traque-front/app/admin/layout.js
@@ -5,9 +5,7 @@ export default function AdminLayout({ children }) {
return (
-
- {children}
-
+ {children}
);
diff --git a/traque-front/app/admin/page.js b/traque-front/app/admin/page.js
index 63c694b..6c5db05 100644
--- a/traque-front/app/admin/page.js
+++ b/traque-front/app/admin/page.js
@@ -4,16 +4,34 @@ import dynamic from "next/dynamic";
import Link from "next/link";
import { Section } from "@/components/section";
import { useAdminConnexion } from "@/context/adminConnexionContext";
+import useAdmin from "@/hook/useAdmin";
+import { GameState } from "@/util/gameState";
import TeamSidePanel from "./components/teamSidePanel";
-import TeamList from './components/teamViewer';
+import TeamViewer from './components/teamViewer';
import { MapButton, ControlButton } from './components/buttons';
// Imported at runtime and not at compile time
const LiveMap = dynamic(() => import('./components/liveMap'), { ssr: false });
+const mapStyles = {
+ default: {
+ url: "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png",
+ attribution: '©
OpenStreetMap'
+ },
+ satellite: {
+ url: "https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}",
+ attribution: 'Tiles © Esri'
+ },
+}
+
export default function AdminPage() {
const { useProtect } = useAdminConnexion();
const [selectedTeamId, setSelectedTeamId] = useState(null);
+ const { changeState } = useAdmin();
+ const [mapStyle, setMapStyle] = useState(mapStyles.default);
+ const [showZones, setShowZones] = useState(true);
+ const [showNames, setShowNames] = useState(true);
+ const [showArrows, setShowArrows] = useState(false);
useProtect();
@@ -24,6 +42,22 @@ export default function AdminPage() {
setSelectedTeamId(id);
}
}
+
+ function switchMapStyle() {
+ setMapStyle(mapStyle == mapStyles.default ? mapStyles.satellite : mapStyles.default);
+ }
+
+ function switchZones() {
+ setShowZones(!showZones);
+ }
+
+ function switchNames() {
+ setShowNames(!showNames);
+ }
+
+ function switchArrows() {
+ setShowArrows(!showArrows);
+ }
return (
@@ -32,36 +66,38 @@ export default function AdminPage() {
Page principale
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+ {false && {}} />}
+ changeState(GameState.SETUP)} />
+ changeState(GameState.PLACEMENT)} />
+ changeState(GameState.PLAYING)} />
-