Merge branch 'lobbyDestroy' of https://codefirst.iut.uca.fr/git/Crypteam/Cryptid into lobbyfix

cryptide_project/server/server.js

@@ -14,6 +14,7 @@ const io = socketIO(server, {
 });
 
 
+let lastSocketJoined = ""
 const map = new Map()
 
 server.listen(3002, () => {
@@ -32,34 +33,63 @@ io.on('connection', (socket) => {
     io.emit("request lobbies", playerJson)
   });
 
+  socket.on("give network", (networkPerson, person, indices, start, room, nodes, playerId) => {
+    io.to(playerId).emit("join during game", networkPerson, person, indices, start, map.get(room).tab, nodes)
+  })
+
   socket.on("lobby joined", (room, player) =>{
-    console.log(player)
-    if (player.type=="User"){
-      socket.join(room)
-    }
-    if (map.get(room) == undefined){
-      map.set(room, {tab: [{type: player.type, id: socket.id, pseudo: player.pseudo, profilePicture: player.profilePicture}], started: false, actualPlayer: 0})
-    }
-    else{
-      const tab = map.get(room).tab
-      for(let i = 0; i<tab.length; i++){
-        if (tab[i].id === socket.id && player.type==="User"){
-          tab.splice(i, 1)
+    if (lastSocketJoined != player.id){
+      lastSocketJoined=player.id
+      const game = map.get(room)
+      if (game !== undefined){
+        if (game.tab.length == 6 && !game.started){
+          io.to(socket.id).emit("room full")
+          return
+        }
+        if (game.started){
+          for(const u of game.tab){
+            if(u.type !== "User" && u.pseudo===player.pseudo){
+              u.type = "User"
+              u.id=socket.id
+              io.to(game.tab[game.actualPlayer].id).emit("give network", socket.id)
+              io.to(room).emit("player joined ingame", game.tab)
+              socket.join(room)
+              return
+            }
+          }
+          io.to(socket.id).emit("game already started")
+          return
         }
       }
   
-      if (player.type!=="User"){
-        tab.push({type: player.type, id: player.id, pseudo: player.pseudo, profilePicture: player.profilePicture})
+  
+      if (game == undefined){
+        map.set(room, {tab: [{type: player.type, id: socket.id, pseudo: player.pseudo, profilePicture: player.profilePicture}], started: false, actualPlayer: 0, lastWorks: false})
+        socket.join(room)
       }
       else{
-        tab.push({type: player.type, id: socket.id, pseudo: player.pseudo, profilePicture: player.profilePicture})
+        const tab = game.tab
+        for(let i = 0; i<tab.length; i++){
+          if (tab[i].id === socket.id && player.type==="User"){
+            tab.splice(i, 1)
+          }
+        }
+  
+        if (player.type!=="User"){
+          tab.push({type: player.type, id: player.id, pseudo: player.pseudo, profilePicture: player.profilePicture})
+        }
+        else{
+          tab.push({type: player.type, id: socket.id, pseudo: player.pseudo, profilePicture: player.profilePicture})
+          socket.join(room)
+        }
       }
+      
+      io.to(room).emit("new player", map.get(room))
+      const playerArray = Array.from(map.entries()).map(([key, value]) => ({ key, value }))
+      const playerJson = JSON.stringify(playerArray);
+      io.emit("request lobbies", playerJson)
     }
     
-    io.to(room).emit("new player", map.get(room))
-    const playerArray = Array.from(map.entries()).map(([key, value]) => ({ key, value }))
-    const playerJson = JSON.stringify(playerArray);
-    io.emit("request lobbies", playerJson)
   })
 
   socket.on("request lobbies", () => {
@@ -112,7 +142,7 @@ io.on('connection', (socket) => {
       }
     }
     console.log(player)
-    io.to(room).emit("who plays", player)
+    io.to(room).emit("who plays", player, map.get(room).lastWorks)
   })
 
   socket.on("disconnect", () =>{
@@ -129,7 +159,6 @@ io.on('connection', (socket) => {
             }
             else{
               tab.tab[i].type="EasyBot"
-              tab.tab[i].pseudo="TmpBot"
               io.to(k).emit("player left ingame", tab, i)
             }
             if (tab.tab.filter((p) => p.type=="User").length == 0){
@@ -145,6 +174,7 @@ io.on('connection', (socket) => {
 
 
   socket.on("player quit", () => {
+    lastSocketJoined=""
     for (const k of map.keys()){
       const tab = map.get(k)
         for (let i = 0; i<tab.tab.length; i++){
@@ -159,7 +189,6 @@ io.on('connection', (socket) => {
             }
             else{
               tab.tab[i].type="EasyBot"
-              tab.tab[i].pseudo="TmpBot"
               io.to(k).emit("player left ingame", tab, i)
             }
             if (tab.tab.filter((p) => p.type=="User").length == 0){
@@ -175,6 +204,7 @@ io.on('connection', (socket) => {
 
   socket.on("node checked", (id, works, color, room, playerIndex) =>{
     map.get(room).actualPlayer=playerIndex
+    map.get(room).lastWorks=works
     io.to(room).emit("node checked", id, works, color, playerIndex, socket.id)
   })
   

cryptide_project/src/Components/GraphContainer.tsx

@@ -17,6 +17,7 @@ import Pair from "../model/Pair";
 import Player from "../model/Player";
 import JSONParser from "../JSONParser";
 import User from "../model/User";
+import { json } from "body-parser";
 
 interface MyGraphComponentProps {
   onNodeClick: (shouldShowChoiceBar: boolean) => void;
@@ -59,6 +60,7 @@ let cptOnAskedWrong = 0
 let cptPlayerLeft = 0
 let firstPlayer = 0
 let cptBug = 0
+let cptUseEffect = 0
 
 
 const MyGraphComponent: React.FC<MyGraphComponentProps> = ({onNodeClick, handleShowTurnBar, handleTurnBarTextChange, playerTouched, setPlayerTouched, changecptTour, solo, isDaily, isEasy, addToHistory, showLast, setNetwork, setNetworkEnigme, setPlayerIndex, askedWrong, setAskedWrong}) => {
@@ -68,7 +70,7 @@ const MyGraphComponent: React.FC<MyGraphComponentProps> = ({onNodeClick, handleS
   let initMtn = 0
 
   const {isLoggedIn, user, manager} = useAuth();
-  const { indices, indice, person, personNetwork, setNodeIdData, players, setPlayersData, askedPersons, setActualPlayerIndexData, room, actualPlayerIndex, turnPlayerIndex, setTurnPlayerIndexData, setWinnerData, dailyEnigme, setNbCoupData, settempsData, setNetworkDataData, setSeedData} = useGame();
+  const { indices, indice, person, personNetwork, setNodeIdData, players, setPlayersData, askedPersons, setActualPlayerIndexData, room, actualPlayerIndex, turnPlayerIndex, setTurnPlayerIndexData, setWinnerData, dailyEnigme, setNbCoupData, settempsData, setNetworkDataData, setSeedData, nodesC} = useGame();
   const params = new URLSearchParams(window.location.search);
 
   const navigate = useNavigate();
@@ -83,7 +85,6 @@ const MyGraphComponent: React.FC<MyGraphComponentProps> = ({onNodeClick, handleS
       settempsData(elapsedTime)
 
       cptBug ++
-      console.log(cptBug)
       if (cptBug > 10){
         cptBug = 0
         socket.emit("who plays", room)
@@ -287,19 +288,6 @@ const MyGraphComponent: React.FC<MyGraphComponentProps> = ({onNodeClick, handleS
     }
   }
 
-  //* fonction qui reinitialise le graphe 
-  const resGraph = () => { //? comment accéder au nework ??
-    const savedGraphStateString = localStorage.getItem('graphState');
-    if (savedGraphStateString !== null) {
-      const savedGraphState = JSON.parse(savedGraphStateString);
-      //network.setData(savedGraphState);
-    } else {
-      // La clé 'graphState' n'existe pas dans le localStorage, prenez une action en conséquence.
-      console.log("ayoooooo");
-    }
-
-  };
-
   useEffect(() => {
     if (personNetwork == null){
       return
@@ -319,7 +307,10 @@ const MyGraphComponent: React.FC<MyGraphComponentProps> = ({onNodeClick, handleS
       return;
     }
     // Charger les données dans le graph
-    const nodes = new DataSet(graph.nodesPerson);
+    let nodes = new DataSet(graph.nodesPerson);
+    if (nodesC.length != 0){
+      nodes = new DataSet(nodesC)
+    }
 
     // Configuration des options du Graphe
     const initialOptions = {
@@ -379,12 +370,38 @@ const MyGraphComponent: React.FC<MyGraphComponentProps> = ({onNodeClick, handleS
       }
     }
 
+    socket.on("give network", (playerId) => {
+      socket.emit("give network", JSON.stringify(personNetwork, null, 2), JSON.stringify(person), JSON.stringify(indices), playerIndex, room, JSON.stringify(nodes.get()), playerId);
+    })
+
+    socket.on("player joined ingame", (tab) => {
+      const tmpTab: Player[] = []
+      let ind =0
+      for (const p of tab){
+        if (p.type === "User"){
+          tmpTab.push(JSONParser.JSONToPlayer(p))
+        }
+        else{
+          tmpTab.push(players[ind])
+        }
+        ind ++
+      }
+      setPlayersData(tmpTab)
+    })
+
     socket.on("player left ingame", (tab, i) => {
       cptPlayerLeft ++
       if (cptPlayerLeft % 2 == 0){
         const tmpTab: Player[] = []
+        let ind =0
         for (const p of tab.tab){
+          if (ind === i || p.type === "User"){
             tmpTab.push(JSONParser.JSONToPlayer(p))
+          }
+          else{
+            tmpTab.push(players[ind])
+          }
+          ind ++
         }
         if (i==firstPlayer){
           console.log(tmpTab)
@@ -395,7 +412,6 @@ const MyGraphComponent: React.FC<MyGraphComponentProps> = ({onNodeClick, handleS
               break
             }
           }
-          console.log(firstPlayer)
           if (actualPlayerIndex==firstPlayer){
             tmpTab.forEach((p, index) =>{
               if (p instanceof Bot && personNetwork!=null){
@@ -764,6 +780,7 @@ const MyGraphComponent: React.FC<MyGraphComponentProps> = ({onNodeClick, handleS
           socket.off("put correct background")
           socket.off("put grey background")
           socket.off("put imossible grey")
+          socket.off("who plays")
     
           navigate("/endgame")
         }        

cryptide_project/src/Contexts/GameContext.tsx

@@ -1,4 +1,6 @@
 import React, { createContext, useContext, useState, ReactNode } from 'react';
+import { DataSet, Edge } from 'vis-network';
+import NodePerson from '../model/Graph/NodePerson';
 import Indice from '../model/Indices/Indice';
 import Pair from '../model/Pair';
 import Person from '../model/Person';
@@ -23,6 +25,7 @@ interface GameContextProps {
   temps : number
   networkData: any
   seed: number | string;
+  nodesC: NodePerson[]
   setIndicesData: (newIndices: Indice[]) => void;
   setIndiceData: (newIndice: Indice) => void;
   setPersonData: (newPerson: Person) => void;
@@ -41,6 +44,7 @@ interface GameContextProps {
   settempsData: (newtemps : number) => void
   setNetworkDataData: (networkData: any) => void
   setSeedData: (seed: number | string) => void
+  setNodesData: (nodes: NodePerson[]) => void
 }
 
 const GameContext = createContext<GameContextProps | undefined>(undefined);
@@ -67,6 +71,12 @@ export const GameProvider: React.FC<GameProviderProps> = ({ children }) => {
   const [temps, settemps] = useState<number>(0);
   const [networkData, setNetworkData] = useState<any>(null);
   const [seed, setSeed] = useState<number | string>(0);
+  const [nodesC, setNodes] = useState<NodePerson[]>([]);
+
+
+  const setNodesData = (nodes: NodePerson[]) => {
+    setNodes(nodes)
+  }
 
   const setNetworkDataData = (networkData: any) => {
     setNetworkData(networkData);
@@ -155,7 +165,7 @@ export const GameProvider: React.FC<GameProviderProps> = ({ children }) => {
   }
 
   return (
-    <GameContext.Provider value={{ indices, setIndicesData, indice, setIndiceData, person, setPersonData, personNetwork, setPersonNetworkData, players, setPlayersData, nodeId, setNodeIdData, askedPersons, setAskedPersonsData, actualPlayerIndex, setActualPlayerIndexData, turnPlayerIndex, setTurnPlayerIndexData, room, setRoomData, onlyFalse, setOnlyFalseData, winner, setWinnerData, reset, dailyEnigme, setDailyEnigmeData, nbCoup, setNbCoupData, temps, settempsData, setNetworkDataData, networkData, seed, setSeedData}}>
+    <GameContext.Provider value={{ indices, setIndicesData, indice, setIndiceData, person, setPersonData, personNetwork, setPersonNetworkData, players, setPlayersData, nodeId, setNodeIdData, askedPersons, setAskedPersonsData, actualPlayerIndex, setActualPlayerIndexData, turnPlayerIndex, setTurnPlayerIndexData, room, setRoomData, onlyFalse, setOnlyFalseData, winner, setWinnerData, reset, dailyEnigme, setDailyEnigmeData, nbCoup, setNbCoupData, temps, settempsData, setNetworkDataData, networkData, seed, setSeedData, nodesC, setNodesData}}>
       {children}
     </GameContext.Provider>
   );

cryptide_project/src/JSONParser.ts

@@ -11,6 +11,8 @@ import Person from "./model/Person";
 import PersonNetwork from "./model/PersonsNetwork";
 import Player from "./model/Player";
 import User from "./model/User";
+import NodePerson from "./model/Graph/NodePerson";
+import Font from "./model/Graph/Font";
 
 class JSONParser{
 
@@ -93,6 +95,15 @@ class JSONParser{
                 throw new Error("PARSER unable to parse player: " + json.type);
         }
     }
+
+
+    static JSONToNodePersons(json: any): NodePerson[]{
+        const tmpTab: NodePerson[] = []
+        json.forEach((element: any) => {
+            tmpTab.push(new NodePerson(element.id, element.label, element.color, new Font(element.font.color, element.font.size, element.font.align), element.shape))
+        });
+        return tmpTab
+    }
 }
 
 export default JSONParser

cryptide_project/src/Pages/Lobby.tsx

@@ -45,15 +45,17 @@ import SessionService from '../services/SessionService';
 import { useRef } from 'react';
 import Button from 'react-bootstrap/Button';
 import Overlay from 'react-bootstrap/Overlay';
+import { DataSet } from 'vis-network';
 
 
 let gameStarted = false
+let firstLaunch = true
 
 function Lobby() {
     const theme=useTheme();
     const navigate = useNavigate();
     
-    const { indices, setIndicesData, indice, setIndiceData, person, setPersonData, personNetwork, setPersonNetworkData, players, setPlayersData, setActualPlayerIndexData, setTurnPlayerIndexData, setRoomData } = useGame();
+    const { indices, setIndicesData, indice, setIndiceData, person, setPersonData, personNetwork, setPersonNetworkData, players, setPlayersData, setActualPlayerIndexData, setTurnPlayerIndexData, setRoomData, setNodesData } = useGame();
     
     const {user, setUserData, manager, login} = useAuth()
     let first = true
@@ -135,6 +137,42 @@ function Lobby() {
         navigate('/game?solo=false&daily=false');
     });
 
+
+    socket.on("join during game", (jsonNetwork, jsonPersonString, jsonIndicesString, playerIndex, players, nodes)=> {
+        const jsonPerson = JSON.parse(jsonPersonString)
+        const networkPerson: PersonNetwork = JSONParser.JSONToNetwork(jsonNetwork)
+        const choosenOne: Person = networkPerson.getPersons().filter((i) => i.getId() == jsonPerson.id)[0]
+        const choosenIndices : Indice[] = JSONParser.JSONToIndices(jsonIndicesString)
+        for (let i=0; i<players.length; i++){
+            const player = players[i]
+            if(player.id == socket.id){
+                setActualPlayerIndexData(i)
+                setIndiceData(choosenIndices[i])
+            }
+            if (player instanceof Bot){
+                player.indice = choosenIndices[i]
+            }
+        }
+        const tmpPlayers: Player[] = []
+        console.log(players)
+        for (const p of players){
+            tmpPlayers.push(JSONParser.JSONToPlayer(p))
+        }
+        setPlayersData(tmpPlayers)
+        if (room != null){
+            setRoomData(room)
+        }
+        const tab = JSONParser.JSONToNodePersons(JSON.parse(nodes))
+        setNodesData(tab)
+        setTurnPlayerIndexData(playerIndex)
+        setPersonData(choosenOne)
+        setPersonNetworkData(networkPerson)
+        setIndicesData(choosenIndices)
+        first = true
+        gameStarted = true
+        navigate('/game?solo=false&daily=false');
+    });
+
     socket.on("new player", (tab) =>{
         const tmpTab: Player[] = []
         for (const p of tab.tab){
@@ -144,6 +182,21 @@ function Lobby() {
         setPlayersData(tmpTab)
     })
 
+    socket.on("room full", () => {
+        //TODO POP UP pour quand la room est pleine
+        navigate("/play")
+    })
+
+    socket.on("game started", () => {
+        //TODO POP UP pour quand la room est pleine
+        navigate("/play")
+    })
+
+    socket.on("game already started", () => {
+        //TODO POP UP pour quand la room est pleine
+        navigate("/play")
+    })
+
     socket.on("player left", (tab, i) => {
         const tmpTab: Player[] = []
         for (const p of tab.tab){