starting on disconnection part

Back-End/server.js

@@ -28,9 +28,9 @@ const io = socketIo(server, {
 class GameQueue {
   constructor(gameName) {
     this.gameName = gameName;
-    this.queue = []; // Array to maintain the order of players
-    this.playerMap = new Map(); // Map for quick access to player data
-    this.queueTimer = null; // Timer for resetting the queue due to inactivity
+    this.queue = []; 
+    this.playerMap = new Map(); 
+    this.queueTimer = null; 
   }
 
   addPlayer(player) {
@@ -52,6 +52,7 @@ class GameQueue {
     const player = this.playerMap.get(playerId);
     this.queue = this.queue.filter(p => p.id !== playerId);
     this.playerMap.delete(playerId);
+
     console.log(`${player.name} has been removed from the ${this.gameName} queue.`);
     if (this.queue.length > 0) {
       this.startQueueResetTimer();
@@ -89,15 +90,14 @@ class GameQueue {
     clearTimeout(this.queueTimer);
     this.queueTimer = setTimeout(() => {
       this.reset();
-    }, 60000); // Reset the queue after 60 seconds of inactivity
+    }, 60000); 
   }
 
   stopQueueResetTimer() {
     clearTimeout(this.queueTimer);
   }
 }
 
-// Initialize queues for each game
 let queues = {
   valorant: new GameQueue('valorant'),
   league: new GameQueue('league'),
@@ -119,13 +119,27 @@ io.on("connection", (socket) => {
     }
   });
 
-  socket.on("disconnectPlayer", () => {
+  socket.on("disconnectPlayerQueue", () => {
     Object.keys(queues).forEach(gameName => {
       if (queues[gameName].removePlayer(socket.id)) {
         queues[gameName].matchPlayers(); 
       }
     });
   });
+
+  // socket.on("playerDisconnection", () => {
+  //   console.log(`Player ${socket.id} has left the game.`);
+
+  //   // Retrieve the game or queue the player is part of
+  //   const gameDetails = findGameByPlayerId(socket.id); // Implement this function based on your application logic
+
+  //   if (gameDetails) {
+  //     // Determine and declare the winner
+  //     const winnerId = determineWinner(gameDetails, socket.id); // Adjust implementation as needed
+  //     io.to(winnerId).emit("gameOver", { winner: true });
+
+  //   }
+  // });
 });
 
 

Front-End/src/Components/Multiplayer/Loadingpage.jsx

@@ -62,7 +62,7 @@ const Loadingpage = () => {
 
   useEffect(() => {
     if (timeLeft <= 0) {
-      socket.emit('disconnectPlayer');
+      socket.emit('disconnectPlayerQueue');
       const Toast = Swal.mixin({
         toast: true,
         position: 'top-end',
@@ -94,12 +94,17 @@ const Loadingpage = () => {
   };
 
   const handleLeaveQueueClick = () => {
-    socket.emit('disconnectPlayer');
+    socket.emit('disconnectPlayerQueue');
     dispatch(multiplayerActions.setLoading(true));
     dispatch(multiplayerActions.setOpponent(''));
     navigate('/multiplayer/gameSelect');
   };
 
+  window.addEventListener("beforeunload", (event) => {
+    event.preventDefault();
+    socket.emit('disconnectPlayerQueue')
+  });
+
   return (
     <div>
       {loading ? (

Front-End/src/Components/SocketContext.jsx

@@ -9,8 +9,8 @@ export const SocketProvider = ({ children }) => {
   const [socket, setSocket] = useState(null);
 
   useEffect(() => {
-    const newSocket = io(process.env.REACT_APP_SOCKET_URL);
-    // const newSocket = io('http://localhost:3001');
+    // const newSocket = io(process.env.REACT_APP_SOCKET_URL);
+    const newSocket = io('http://localhost:3001');
     setSocket(newSocket);
 
     return () => newSocket.close();

Front-End/src/api.js

@@ -1,8 +1,8 @@
 // Server Testt
-const root = process.env.REACT_APP_SOCKET_URL
+// const root = process.env.REACT_APP_SOCKET_URL
 
 // Development
-  // const root = 'http://localhost:3001';
+  const root = 'http://localhost:3001';
 
 const API = {
   BugSubmit: `${root}/form/bug`,