public/traque
1
0
Fork 0
mirror of https://git.rezel.net/LudoTech/traque.git synced 2026-02-09 10:20:16 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

implemented backend for storing starting area

Browse Source
This commit is contained in:
Quentin Roussel
2024-03-28 22:48:55 +01:00
parent 1a5405b4e8
commit 0aa42f26d2
3 changed files with 17 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
traque-front/components/admin/mapPicker.jsx
View File

@@ -41,6 +41,13 @@ export function CircularAreaPicker({area, setArea, ...props}) {
const [center, setCenter] = useState(area?.center || null); const [center, setCenter] = useState(area?.center || null);
const [radius, setRadius] = useState(area?.radius || null); const [radius, setRadius] = useState(area?.radius || null);
useEffect(() => {
console.log(area)
setDrawing(false);
setCenter(area?.center || null);
setRadius(area?.radius || null);
}, [area])
function handleClick(e) { function handleClick(e) {
if(!drawing) { if(!drawing) {
setCenter(e.latlng); setCenter(e.latlng);

22
traque-front/components/admin/teamEdit.jsx
View File

@@ -10,28 +10,20 @@ const CircularAreaPicker = dynamic(() => import('./mapPicker').then((mod) => mod
export default function TeamEdit({ selectedTeamId, setSelectedTeamId }) { export default function TeamEdit({ selectedTeamId, setSelectedTeamId }) {
const [newTeamName, setNewTeamName] = React.useState(''); const [newTeamName, setNewTeamName] = React.useState('');
const { setTeamName, getTeamName, removeTeam, getTeam } = useAdmin(); const { updateTeam, getTeamName, removeTeam, getTeam, teams } = useAdmin();
const [team, setTeam] = useState({}) const [team, setTeam] = useState({})
useEffect(() => { useEffect(() => {
let team = getTeam(selectedTeamId); let team = getTeam(selectedTeamId);
if (team != undefined) { if (team != undefined) {
setNewTeamName(team.name); setNewTeamName(team.name);
}
}, [selectedTeamId])
useEffect(() => {
let team = getTeam(selectedTeamId);
if (team != undefined) {
setTeam(team); setTeam(team);
} }
}, [selectedTeamId]) }, [selectedTeamId, teams])
function handleRename(e) {
function handleSubmit(e) {
e.preventDefault(); e.preventDefault();
setTeamName(team.id, newTeamName); updateTeam(team.id, {name:newTeamName});
} }
function handleRemove() { function handleRemove() {
@@ -45,7 +37,7 @@ export default function TeamEdit({ selectedTeamId, setSelectedTeamId }) {
<div className='flex flex-row'> <div className='flex flex-row'>
<div className='w-1/2 flex flex-col space-y-3 mx-2'> <div className='w-1/2 flex flex-col space-y-3 mx-2'>
<h2 className='text-2xl text-center'>Actions</h2> <h2 className='text-2xl text-center'>Actions</h2>
<form className='flex flex-row' onSubmit={handleSubmit}> <form className='flex flex-row' onSubmit={handleRename}>
<div className='w-4/5'> <div className='w-4/5'>
<TextInput name="teamName" label='Team name' value={newTeamName} onChange={(e) => setNewTeamName(e.target.value)} /> <TextInput name="teamName" label='Team name' value={newTeamName} onChange={(e) => setNewTeamName(e.target.value)} />
</div> </div>
@@ -53,7 +45,7 @@ export default function TeamEdit({ selectedTeamId, setSelectedTeamId }) {
<Button type="submit">Rename</Button> <Button type="submit">Rename</Button>
</div> </div>
</form> </form>
<Button onClick={handleRemove}>Eliminate</Button> <Button onClick={handleRemove}>Remove</Button>
</div> </div>
<div className='w-1/2 flex flex-col space-y-2 mx-2'> <div className='w-1/2 flex flex-col space-y-2 mx-2'>
<h2 className='text-2xl text-center'>Team details</h2> <h2 className='text-2xl text-center'>Team details</h2>
@@ -68,7 +60,7 @@ export default function TeamEdit({ selectedTeamId, setSelectedTeamId }) {
</div> </div>
<div className='m-5 h-full flex flex-col'> <div className='m-5 h-full flex flex-col'>
<h2 className='text-2xl text-center'>Starting area</h2> <h2 className='text-2xl text-center'>Starting area</h2>
<CircularAreaPicker area={team.startingArea} setArea={(startingArea) => setTeam({ ...team, startingArea })} /> <CircularAreaPicker area={team.startingArea} setArea={(startingArea) => updateTeam(team.id, {startingArea})} />
</div> </div>
</div> </div>
) )

6
traque-front/hook/useAdmin.jsx
View File

@@ -30,8 +30,8 @@ export default function useAdmin(){
adminSocket.emit("remove_team", teamId); adminSocket.emit("remove_team", teamId);
} }
function setTeamName(teamId, newName) { function updateTeam(teamId, team) {
adminSocket.emit("rename_team", teamId, newName); adminSocket.emit("update_team", teamId, team);
} }
function startGame() { function startGame() {
@@ -42,6 +42,6 @@ export default function useAdmin(){
adminSocket.emit("stop_game"); adminSocket.emit("stop_game");
} }
return {teams, started, pollTeams, getTeam, getTeamName, reorderTeams, addTeam, removeTeam, startGame, stopGame, setTeamName }; return {teams, started, pollTeams, getTeam, getTeamName, reorderTeams, addTeam, removeTeam, startGame, stopGame, updateTeam };
} }