admin interface basic functionalities

traque-front/hook/useAdmin.jsx

@@ -0,0 +1,68 @@
+import { useAdminContext } from "@/context/adminContext";
+import { useSocket } from "@/context/socketContext";
+import { Underdog } from "next/font/google";
+
+const { useEffect, useState } = require("react");
+
+export default function useAdmin(){
+    const {teams, setTeams, started, setStarted} = useAdminContext();
+    const {adminSocket} = useSocket();
+
+    function pollTeams() {
+        adminSocket.emit("get_teams");
+    }
+
+    useEffect(() => {
+        pollTeams();
+    }, []);
+    useEffect(() => {
+        adminSocket.emit("get_teams");
+        adminSocket.on("teams", setTeams);
+        return () => {
+            adminSocket.off("teams", setTeams);
+        }
+    }, []);
+
+    function getTeam(teamId) {
+        return teams.find(team => team.id === teamId);
+    }
+
+    function getTeamName(teamId) {
+        let team = getTeam(teamId);
+        return team ? team.name : "";
+    }
+
+    function reorderTeams(newOrder) {
+        adminSocket.emit("reorder_teams", newOrder);
+    }
+
+    function addTeam(teamName) {
+        adminSocket.emit("add_team", teamName);
+    }
+
+    function removeTeam(teamId) {
+        adminSocket.emit("remove_team", teamId);
+    }
+
+    function setTeamName(teamId, newName) {
+        adminSocket.emit("rename_team", teamId, newName);
+    }
+
+    function startGame() {
+        adminSocket.emit("start_game");
+    }
+
+    function stopGame() {
+        adminSocket.emit("stop_game");
+    }
+
+    useState(() => {
+        adminSocket.on("game_started", setStarted);
+        return () => {
+            adminSocket.off("game_started", setStarted);
+        }
+    }, []);
+
+    return { teams, started, pollTeams, getTeam, getTeamName, reorderTeams, addTeam, removeTeam, startGame, stopGame, setTeamName };
+
+}

traque-front/hook/useGame.jsx

@@ -0,0 +1,61 @@
+"use client";
+
+import { useSocket } from "@/context/socketContext";
+import { useEffect, useState } from "react";
+
+export default function useGame() {
+    const {userSocket} = useSocket();
+    const [loggedIn, setLoggedIn] = useState(false);
+    const [teamId, setTeamId] = useState(null);
+    const [enemyPosition, setEnemyPosition] = useState([0, 0]);
+    const [currentPosition, setCurrentPosition] = useState([0, 0]);
+
+    function updateCurrentPosition(position) {
+        setCurrentPosition(position);
+        userSocket.emit("update_position", position);
+    }
+
+    function sendCurrentPosition() {
+        userSocket.emit("send_position", currentPosition);
+    }
+    useEffect(() => {
+        function updateEnemyPosition(position) {
+            setEnemyPosition(position);
+        }
+        userSocket.on("enemy_position", updateEnemyPosition);
+
+        return () => {
+            userSocket.off("enemy_position", updateEnemyPosition);
+        }
+    }, []);
+
+    function login(teamId) {
+        setTeamId(teamId);
+        userSocket.emit("login", teamId);
+    }
+    useEffect(() => {
+        function updateLoginStatus(status) {
+            setLoggedIn(status);
+        }
+        userSocket.on("login_reponse", updateLoginStatus);
+
+        return () => {
+            userSocket.off("login_response", updateLoginStatus);
+        }
+    }, []);
+
+    useEffect(() => {
+        function udpate() {
+                console.log("update")
+                const position = navigator.geolocation.getCurrentPosition((position) => {
+                updateCurrentPosition([position.coords.latitude, position.coords.longitude]);
+            }, () => { }, { enableHighAccuracy: true, timeout: Infinity, maximumAge: 0 });
+        }
+        setInterval(udpate, 1000);
+        return () => {
+            clearInterval(udpate);
+        }
+    }, []);
+
+    return { updateCurrentPosition, sendCurrentPosition, login, enemyPosition, currentPosition, loggedIn, teamId };
+}