Added placement zones

This commit is contained in:
Sebastien Riviere
2025-09-07 17:24:29 +02:00
parent 93f9a05b1a
commit 75f8b10ecd
17 changed files with 436 additions and 201 deletions

View File

@@ -68,6 +68,11 @@ export default function LiveMap({ selectedTeamId, onSelected, isFocusing, setIsF
{isFocusing && <MapPan center={getTeam(selectedTeamId)?.currentLocation} zoom={mapZooms.high} animate />}
<MapEventListener onDragStart={() => setIsFocusing(false)}/>
<Zones/>
{teams.map((team) => gameState == GameState.PLACEMENT && team.startingArea &&
<Circle key={team.id} center={team.startingArea.center} radius={team.startingArea.radius} color="blue" fillColor="blue">
<Tooltip permanent direction="top" offset={[0.5, -15]} className="custom-tooltip">{team.name}</Tooltip>
</Circle>
)}
{teams.map((team) => team.currentLocation && !team.captured && <>
<Marker key={team.id} position={team.currentLocation} icon={positionIcon} eventHandlers={{click: () => onSelected(team.id)}}>
{showNames && <Tooltip permanent direction="top" offset={[0.5, -15]} className="custom-tooltip">{team.name}</Tooltip>}

View File

@@ -2,12 +2,12 @@ import { List } from '@/components/list';
import useAdmin from '@/hook/useAdmin';
import { getStatus } from '@/util/functions';
function TeamViewerItem({ team, itemSelected, onSelected }) {
function TeamViewerItem({ team }) {
const { gameState } = useAdmin();
const status = getStatus(team, gameState);
return (
<div className={'w-full flex flex-row gap-3 p-2 bg-white justify-between cursor-pointer ' + (itemSelected ? "outline outline-4 outline-black" : "")} onClick={() => onSelected(team.id)}>
<div className={'w-full flex flex-row gap-3 p-2 bg-white justify-between'}>
<div className='flex flex-row items-center gap-3'>
<div className='flex flex-row gap-1'>
<img src={`/icons/user/${team.sockets.length > 0 ? "green" : "red"}.png`} className="w-4 h-4" />
@@ -27,9 +27,9 @@ export default function TeamViewer({selectedTeamId, onSelected}) {
const { teams } = useAdmin();
return (
<List array={teams}>
<List array={teams} selectedId={selectedTeamId} onSelected={onSelected} >
{(team) => (
<TeamViewerItem team={team} itemSelected={selectedTeamId === team.id} onSelected={onSelected}/>
<TeamViewerItem team={team}/>
)}
</List>
);