From 4b0ecfac59d3dba3f4e18c6507667ac37651414a Mon Sep 17 00:00:00 2001 From: Thomas Chazot Date: Thu, 30 Nov 2023 17:04:01 +0100 Subject: [PATCH] =?UTF-8?q?Bot=20prend=20la=20place=20des=20joueurs=20qui?= =?UTF-8?q?=20quittent=20+=20quand=20bot=20bug=20timer=20de=205=20sc=20et?= =?UTF-8?q?=20demande=20au=20serveur=20=C3=A0=20qui=20c'est=20de=20jouer?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- cryptide_project/server/server.js | 79 ++++++++++++++-- .../src/Components/GraphContainer.tsx | 94 +++++++++++++++++-- cryptide_project/src/Pages/InGame.tsx | 14 ++- cryptide_project/src/Pages/Lobbies.tsx | 2 +- cryptide_project/src/Pages/Lobby.tsx | 10 +- cryptide_project/src/Pages/Play.tsx | 17 +++- 6 files changed, 195 insertions(+), 21 deletions(-) diff --git a/cryptide_project/server/server.js b/cryptide_project/server/server.js index aaf6865..d5d80ed 100644 --- a/cryptide_project/server/server.js +++ b/cryptide_project/server/server.js @@ -26,6 +26,7 @@ io.on('connection', (socket) => { socket.on('network created', (network, person, indices, room, start) =>{ io.to(room).emit("game created", network, person, indices, start) map.get(room).started = true + map.get(room).actualPlayer=start const playerArray = Array.from(map.entries()).map(([key, value]) => ({ key, value })) const playerJson = JSON.stringify(playerArray); io.emit("request lobbies", playerJson) @@ -37,7 +38,7 @@ io.on('connection', (socket) => { 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}) + 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 @@ -102,14 +103,66 @@ io.on('connection', (socket) => { io.to(askingPlayer.id).emit("asked wrong") }) + socket.on("who plays", (room) => { + let player = map.get(room).actualPlayer + if (map.get(room).tab[player].type != "User"){ + player = player + 1 + if (player == map.get(room).tab.length){ + player=0 + } + } + console.log(player) + io.to(room).emit("who plays", player) + }) + socket.on("disconnect", () =>{ for (const k of map.keys()){ - const tab = map.get(k).tab - for (let i = 0; i p.type=="User").length == 0){ + const tab = map.get(k) + for (let i = 0; i p.type=="User").length == 0){ + map.delete(k) + } + } + } + } + const playerArray = Array.from(map.entries()).map(([key, value]) => ({ key, value })) + const playerJson = JSON.stringify(playerArray); + io.emit("request lobbies", playerJson) + }) + + + socket.on("player quit", () => { + for (const k of map.keys()){ + const tab = map.get(k) + for (let i = 0; i p.type=="User").length == 0){ map.delete(k) } } @@ -121,6 +174,7 @@ io.on('connection', (socket) => { }) socket.on("node checked", (id, works, color, room, playerIndex) =>{ + map.get(room).actualPlayer=playerIndex io.to(room).emit("node checked", id, works, color, playerIndex, socket.id) }) @@ -157,3 +211,14 @@ io.on('connection', (socket) => { map.delete(room) }) }); + + +function comparePlayersByType(a, b) { + if (a.type < b.type) { + return -1; + } else if (a.type > b.type) { + return 1; + } else { + return 0; + } +} diff --git a/cryptide_project/src/Components/GraphContainer.tsx b/cryptide_project/src/Components/GraphContainer.tsx index 17e588e..58362de 100644 --- a/cryptide_project/src/Components/GraphContainer.tsx +++ b/cryptide_project/src/Components/GraphContainer.tsx @@ -14,6 +14,9 @@ import NodePerson from "../model/Graph/NodePerson"; import { useAuth } from "../Contexts/AuthContext"; import Indice from "../model/Indices/Indice"; import Pair from "../model/Pair"; +import Player from "../model/Player"; +import JSONParser from "../JSONParser"; +import User from "../model/User"; interface MyGraphComponentProps { onNodeClick: (shouldShowChoiceBar: boolean) => void; @@ -53,6 +56,9 @@ let endgame= false let firstHistory = true let cptSquare = 0 let cptOnAskedWrong = 0 +let cptPlayerLeft = 0 +let firstPlayer = 0 +let cptBug = 0 const MyGraphComponent: React.FC = ({onNodeClick, handleShowTurnBar, handleTurnBarTextChange, playerTouched, setPlayerTouched, changecptTour, solo, isDaily, isEasy, addToHistory, showLast, setNetwork, setNetworkEnigme, setPlayerIndex, askedWrong, setAskedWrong}) => { @@ -62,7 +68,7 @@ const MyGraphComponent: React.FC = ({onNodeClick, handleS let initMtn = 0 const {isLoggedIn, user, manager} = useAuth(); - const { indices, indice, person, personNetwork, setNodeIdData, players, 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} = useGame(); const params = new URLSearchParams(window.location.search); const navigate = useNavigate(); @@ -76,6 +82,14 @@ const MyGraphComponent: React.FC = ({onNodeClick, handleS setElapsedTime((prevElapsedTime) => prevElapsedTime + 0.5); settempsData(elapsedTime) + cptBug ++ + console.log(cptBug) + if (cptBug > 10){ + cptBug = 0 + socket.emit("who plays", room) + } + + // Vérifiez si la durée est écoulée, puis arrêtez le timer if (endgame) { clearInterval(intervalId); @@ -140,7 +154,8 @@ const MyGraphComponent: React.FC = ({onNodeClick, handleS } useEffect(() =>{ - if (actualPlayerIndex==0){ + cptBug=0 + if (actualPlayerIndex==firstPlayer){ const bot = players[lastIndex] if(bot instanceof Bot && botIndex != lastIndex){ botIndex = lastIndex @@ -176,7 +191,6 @@ const MyGraphComponent: React.FC = ({onNodeClick, handleS socket.emit("node checked", personIndex, works, playerIndex, room, nextPlayerIndex) const ind = bot.placeSquare(personNetwork, players) if (ind == -1 ){ - addToHistory(lastIndex.toString() + "177") socket.emit("can't put square", lastIndex, room) return } @@ -211,7 +225,6 @@ const MyGraphComponent: React.FC = ({onNodeClick, handleS socket.emit("node checked", personIndex, false, choosedPlayerIndex, room, lastIndex) const ind = bot.placeSquare(personNetwork, players) if (ind == -1 ){ - addToHistory(lastIndex.toString() + "212") socket.emit("can't put square", playerIndex, room) return } @@ -231,7 +244,6 @@ const MyGraphComponent: React.FC = ({onNodeClick, handleS if (!tester.Works(person)){ const ind = bot.placeSquare(personNetwork, players) if (ind == -1 ){ - addToHistory(lastIndex.toString() + "232") socket.emit("can't put square", playerIndex, room) return } @@ -319,7 +331,6 @@ const MyGraphComponent: React.FC = ({onNodeClick, handleS direction: 'LR', // LR (Left to Right) ou autre selon votre préférence sortMethod: 'hubsize' }, - distanceMin: 500, // Set the minimum distance between nodes //randomSeed: 2 }, physics: { @@ -368,6 +379,59 @@ const MyGraphComponent: React.FC = ({onNodeClick, handleS } } + socket.on("player left ingame", (tab, i) => { + cptPlayerLeft ++ + if (cptPlayerLeft % 2 == 0){ + const tmpTab: Player[] = [] + for (const p of tab.tab){ + tmpTab.push(JSONParser.JSONToPlayer(p)) + } + if (i==firstPlayer){ + console.log(tmpTab) + for(let index = 0; index < tmpTab.length; index++){ + const test = tmpTab[index] + if (test instanceof User){ + firstPlayer=index + break + } + } + console.log(firstPlayer) + if (actualPlayerIndex==firstPlayer){ + tmpTab.forEach((p, index) =>{ + if (p instanceof Bot && personNetwork!=null){ + p.indice=indices[index] + p.index=index + p.initiateMap(personNetwork) + console.log(p.indice.ToString("fr")) + } + }) + } + } + else{ + const bot = tmpTab[i] + if (bot instanceof Bot && personNetwork != null){ + bot.indice=indices[i] + bot.index=index + bot.initiateMap(personNetwork) + console.log(bot.indice.ToString("fr")) + } + } + if (i==playerIndex){ + playerIndex = lastIndex + 1 + if(playerIndex == players.length){ + playerIndex = 0 + } + setPlayerIndex(playerIndex) + setLastIndex(playerIndex) + if (playerIndex===actualPlayerIndex){ + handleTurnBarTextChange("À vous de jouer") + handleShowTurnBar(true) + } + } + setPlayersData(tmpTab) + } + }) + socket.on("reset graph", () => { console.log("reset graph") initialOptions.physics.enabled = true @@ -375,6 +439,16 @@ const MyGraphComponent: React.FC = ({onNodeClick, handleS }) if (!solo){ + + socket.on("who plays", (index) => { + playerIndex=index + setPlayerIndex(index) + setLastIndex(index) + if (actualPlayerIndex==index){ + handleShowTurnBar(true) + } + }) + socket.on("asked all", (id) =>{ //@ts-ignore const pers = personNetwork.getPersons().find((p) => p.getId() == id) @@ -401,12 +475,15 @@ const MyGraphComponent: React.FC = ({onNodeClick, handleS }) socket.on("node checked",(id, works, askedIndex, newPlayerIndex, socketId) => { + cptBug=0 //@ts-ignore const node = nodes.get().find((n) => id == n.id) if (node!=undefined){ onNodeClick(false) playerIndex = newPlayerIndex setPlayerIndex(playerIndex) + setLastIndex(newPlayerIndex) + console.log(newPlayerIndex) //@ts-ignore if (mapIndexPersons.get(askedIndex)?.find((p) => p.getId() == id) == undefined){ //@ts-ignore @@ -488,6 +565,7 @@ const MyGraphComponent: React.FC = ({onNodeClick, handleS }) socket.on("can't put square", (askingPlayer) => { + cptBug=0 cptOnAskedWrong ++ if (cptOnAskedWrong % 2 == 0){ addToHistory(players[askingPlayer].pseudo + " ne peut plus poser de carré") @@ -510,6 +588,7 @@ const MyGraphComponent: React.FC = ({onNodeClick, handleS socket.on("asked", (nodeId, askingPlayer) => { + if (askingPlayer.id !== lastAskingPlayer || nodeId !== lastNodeId ){ lastAskingPlayer = askingPlayer.id lastNodeId = nodeId @@ -645,6 +724,7 @@ const MyGraphComponent: React.FC = ({onNodeClick, handleS askedWrongBot=false endgame = true firstHistory=true + cptBug=0 try{ if(isLoggedIn){ if(!solo){ @@ -719,6 +799,8 @@ const MyGraphComponent: React.FC = ({onNodeClick, handleS network.on("click", async (params) => { if(params.nodes.length > 0){ + console.log(actualPlayerIndex + " => " + playerIndex) + console.log(playerTouched) setNodeIdData(params.nodes[0]) // addToHistory("Le joueur a cliqué") //! TEST DEBUG if (!solo){ diff --git a/cryptide_project/src/Pages/InGame.tsx b/cryptide_project/src/Pages/InGame.tsx index 422bca8..a578db4 100644 --- a/cryptide_project/src/Pages/InGame.tsx +++ b/cryptide_project/src/Pages/InGame.tsx @@ -28,7 +28,7 @@ import Ceye from "../res/icon/hidden.png"; import JSZip from 'jszip'; /* nav */ -import { Link } from 'react-router-dom'; +import { Link, Navigate, useNavigate, useNavigationType } from 'react-router-dom'; /* Boostrap */ import Button from 'react-bootstrap/Button'; @@ -50,13 +50,25 @@ import {generateLatexCode, generateLatexCodeEnigme} from '../Script/LatexScript' import Pair from '../model/Pair'; import Indice from '../model/Indices/Indice'; +let cptNavigation = 0 + //@ts-ignore const InGame = ({locale, changeLocale}) => { const theme = useTheme(); + const navigate = useNavigate() const params = new URLSearchParams(window.location.search); + + const navigationType = useNavigationType() + cptNavigation++ + if (cptNavigation % 2 == 0){ + if (navigationType.toString() == "POP"){ + socket.emit("player quit") + navigate("/play") + } + } //* Gestion solo let IsSolo: boolean = true diff --git a/cryptide_project/src/Pages/Lobbies.tsx b/cryptide_project/src/Pages/Lobbies.tsx index ed11e0d..58895a6 100644 --- a/cryptide_project/src/Pages/Lobbies.tsx +++ b/cryptide_project/src/Pages/Lobbies.tsx @@ -61,7 +61,7 @@ function Lobbies() { } setLobbyData(tmpTab) }) - }) + }, []) diff --git a/cryptide_project/src/Pages/Lobby.tsx b/cryptide_project/src/Pages/Lobby.tsx index 3241675..75ac642 100644 --- a/cryptide_project/src/Pages/Lobby.tsx +++ b/cryptide_project/src/Pages/Lobby.tsx @@ -130,8 +130,8 @@ function Lobby() { setIndicesData(choosenIndices) first = true gameStarted = true - socket.off("player left") - socket.off("new player") + //socket.off("player left") + //socket.off("new player") navigate('/game?solo=false&daily=false'); }); @@ -146,9 +146,10 @@ function Lobby() { socket.on("player left", (tab, i) => { const tmpTab: Player[] = [] - for (const p of tab){ + for (const p of tab.tab){ tmpTab.push(JSONParser.JSONToPlayer(p)) } + console.log(tmpTab) setPlayersData(tmpTab) }) @@ -214,7 +215,7 @@ function Lobby() { // ))} -
+ {(players.length < 6) &&
+ }
diff --git a/cryptide_project/src/Pages/Play.tsx b/cryptide_project/src/Pages/Play.tsx index 5c28831..a0fc893 100644 --- a/cryptide_project/src/Pages/Play.tsx +++ b/cryptide_project/src/Pages/Play.tsx @@ -2,7 +2,6 @@ import React, { useEffect, useRef, useState } from 'react'; /* Context */ import { useAuth } from '../Contexts/AuthContext'; - /* Style */ import './Play.css'; import { useTheme } from '../Style/ThemeContext'; @@ -13,7 +12,7 @@ import ButtonImgNav from "../Components/ButtonImgNav"; /* Img */ /* Icon */ import { socket } from '../SocketConfig'; -import { useNavigate } from 'react-router-dom'; +import { NavigationType, useNavigate, useNavigationType } from 'react-router-dom'; import GameCreator from '../model/GameCreator'; import { useGame } from '../Contexts/GameContext'; import ScoreBoard from '../Components/ScoreBoard'; @@ -32,6 +31,9 @@ import Button from 'react-bootstrap/Button'; import ButtonGroup from 'react-bootstrap/ButtonGroup'; +let cptNavigation = 0 + + function Play() { let first = true @@ -41,6 +43,16 @@ function Play() { const target = useRef(null); + const navigationType = useNavigationType() + cptNavigation++ + if (cptNavigation % 2 == 0){ + if (navigationType.toString() == "POP"){ + socket.emit("player quit") + } + } + + + useEffect(() => { const fetchUserInformation = async () => { try { @@ -108,6 +120,7 @@ function Play() { } }, [isLoggedIn]); + const [room, setRoom] = useState(null); const navigate = useNavigate();