public/traque
1
0
Fork 0
mirror of https://git.rezel.net/LudoTech/traque.git synced 2026-02-09 02:10:18 +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 [radius, setRadius] = useState(area?.radius || null);
useEffect(() => {
console.log(area)
setDrawing(false);
setCenter(area?.center || null);
setRadius(area?.radius || null);
}, [area])
function handleClick(e) {
if(!drawing) {
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 }) {
const [newTeamName, setNewTeamName] = React.useState('');
const { setTeamName, getTeamName, removeTeam, getTeam } = useAdmin();
const { updateTeam, getTeamName, removeTeam, getTeam, teams } = useAdmin();
const [team, setTeam] = useState({})
useEffect(() => {
let team = getTeam(selectedTeamId);
if (team != undefined) {
setNewTeamName(team.name);
}
}, [selectedTeamId])
useEffect(() => {
let team = getTeam(selectedTeamId);
if (team != undefined) {
setTeam(team);
}
}, [selectedTeamId])
}, [selectedTeamId, teams])
function handleSubmit(e) {
function handleRename(e) {
e.preventDefault();
setTeamName(team.id, newTeamName);
updateTeam(team.id, {name:newTeamName});
}
function handleRemove() {
@@ -45,7 +37,7 @@ export default function TeamEdit({ selectedTeamId, setSelectedTeamId }) {
<div className='flex flex-row'>
<div className='w-1/2 flex flex-col space-y-3 mx-2'>
<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'>
<TextInput name="teamName" label='Team name' value={newTeamName} onChange={(e) => setNewTeamName(e.target.value)} />
</div>
@@ -53,7 +45,7 @@ export default function TeamEdit({ selectedTeamId, setSelectedTeamId }) {
<Button type="submit">Rename</Button>
</div>
</form>
<Button onClick={handleRemove}>Eliminate</Button>
<Button onClick={handleRemove}>Remove</Button>
</div>
<div className='w-1/2 flex flex-col space-y-2 mx-2'>
<h2 className='text-2xl text-center'>Team details</h2>
@@ -68,7 +60,7 @@ export default function TeamEdit({ selectedTeamId, setSelectedTeamId }) {
</div>
<div className='m-5 h-full flex flex-col'>
<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>
)

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

@@ -30,8 +30,8 @@ export default function useAdmin(){
adminSocket.emit("remove_team", teamId);
}
function setTeamName(teamId, newName) {
adminSocket.emit("rename_team", teamId, newName);
function updateTeam(teamId, team) {
adminSocket.emit("update_team", teamId, team);
}
function startGame() {
@@ -42,6 +42,6 @@ export default function useAdmin(){
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 };
}