@ -4,7 +4,7 @@ import GraphCreator from "../model/Graph/GraphCreator";
import "./GraphContainer.css" ;
import "./GraphContainer.css" ;
import IndiceTesterFactory from "../model/Factory/IndiceTesterFactory" ;
import IndiceTesterFactory from "../model/Factory/IndiceTesterFactory" ;
import Person from "../model/Person" ;
import Person from "../model/Person" ;
import { Navigate, useLocation , useNavigate } from "react-router-dom" ;
import { useNavigate } from "react-router-dom" ;
import { useGame } from "../Contexts/GameContext" ;
import { useGame } from "../Contexts/GameContext" ;
import { socket } from "../SocketConfig"
import { socket } from "../SocketConfig"
import { colorToEmoji , positionToColor , positionToEmoji } from "../ColorHelper" ;
import { colorToEmoji , positionToColor , positionToEmoji } from "../ColorHelper" ;
@ -12,6 +12,9 @@ import { ColorToHexa } from "../model/EnumExtender";
import Bot from "../model/Bot" ;
import Bot from "../model/Bot" ;
import NodePerson from "../model/Graph/NodePerson" ;
import NodePerson from "../model/Graph/NodePerson" ;
import { useAuth } from "../Contexts/AuthContext" ;
import { useAuth } from "../Contexts/AuthContext" ;
import Indice from "../model/Indices/Indice" ;
import Pair from "../model/Pair" ;
import { tab } from "@testing-library/user-event/dist/tab" ;
interface MyGraphComponentProps {
interface MyGraphComponentProps {
onNodeClick : ( shouldShowChoiceBar : boolean ) = > void ;
onNodeClick : ( shouldShowChoiceBar : boolean ) = > void ;
@ -27,12 +30,15 @@ interface MyGraphComponentProps {
setNetwork : ( network : Network ) = > void
setNetwork : ( network : Network ) = > void
showLast : boolean
showLast : boolean
setPlayerIndex : ( playerIndex : number ) = > void
setPlayerIndex : ( playerIndex : number ) = > void
setNetworkEnigme : ( networkEnigme : Map < number , Pair < Indice , boolean > [ ] > ) = > void
askedWrong : boolean
setAskedWrong : ( askedWrong : boolean ) = > void
}
}
let lastAskingPlayer = 0
let lastAskingPlayer = 0
let lastNodeId = - 1
let lastNodeId = - 1
let first = true
let first = true
let askedWrong = false
let askedWrong Local = false
let mapIndexPersons : Map < number , Person [ ] > = new Map < number , Person [ ] > ( )
let mapIndexPersons : Map < number , Person [ ] > = new Map < number , Person [ ] > ( )
let touchedPlayer = - 1
let touchedPlayer = - 1
let botIndex = - 1
let botIndex = - 1
@ -46,16 +52,18 @@ let firstEnigme = true
let firstIndex = true
let firstIndex = true
let endgame = false
let endgame = false
let firstHistory = true
let firstHistory = true
let cptSquare = 0
let cptOnAskedWrong = 0
const MyGraphComponent : React.FC < MyGraphComponentProps > = ( { onNodeClick , handleShowTurnBar , handleTurnBarTextChange , playerTouched , setPlayerTouched , changecptTour , solo , isDaily , isEasy , addToHistory , showLast , setNetwork , setPlayerIndex }) = > {
const MyGraphComponent : React.FC < MyGraphComponentProps > = ( { onNodeClick , handleShowTurnBar , handleTurnBarTextChange , playerTouched , setPlayerTouched , changecptTour , solo , isDaily , isEasy , addToHistory , showLast , setNetwork , setPlayerIndex , setNetworkEnigme , askedWrong , setAskedWrong }) = > {
let cptTour : number = 0
let cptTour : number = 0
//* Gestion du temps :
//* Gestion du temps :
let initMtn = 0
let initMtn = 0
const { isLoggedIn , user , manager } = useAuth ( ) ;
const { isLoggedIn , user , manager } = useAuth ( ) ;
const { indices , indice , person , personNetwork , setNodeIdData , players , askedPersons , setActualPlayerIndexData , room , actualPlayerIndex , turnPlayerIndex , setTurnPlayerIndexData , setWinnerData , dailyEnigme , setNbCoupData , settempsData } = useGame ( ) ;
const { indices , indice , person , personNetwork , setNodeIdData , players , askedPersons , setActualPlayerIndexData , room , actualPlayerIndex , turnPlayerIndex , setTurnPlayerIndexData , setWinnerData , dailyEnigme , setNbCoupData , settempsData , setNetworkDataData , setSeedData } = useGame ( ) ;
const params = new URLSearchParams ( window . location . search ) ;
const params = new URLSearchParams ( window . location . search ) ;
const navigate = useNavigate ( ) ;
const navigate = useNavigate ( ) ;
@ -83,12 +91,12 @@ const MyGraphComponent: React.FC<MyGraphComponentProps> = ({onNodeClick, handleS
useEffect ( ( ) = > {
useEffect ( ( ) = > {
touchedPlayer = playerTouched
touchedPlayer = playerTouched
if ( touchedPlayer == - 1 ) {
if ( touchedPlayer == - 1 ) {
if ( ! askedWrong ) {
if ( ! askedWrong Local ) {
socket . emit ( "put correct background" , socket . id )
socket . emit ( "put correct background" , socket . id )
}
}
}
}
else if ( touchedPlayer < players . length && touchedPlayer >= 0 ) {
else if ( touchedPlayer < players . length && touchedPlayer >= 0 ) {
if ( ! askedWrong ) {
if ( ! askedWrong Local ) {
socket . emit ( "put correct background" , socket . id )
socket . emit ( "put correct background" , socket . id )
socket . emit ( "put grey background" , socket . id , touchedPlayer )
socket . emit ( "put grey background" , socket . id , touchedPlayer )
}
}
@ -165,6 +173,11 @@ const MyGraphComponent: React.FC<MyGraphComponentProps> = ({onNodeClick, handleS
if ( ! works ) {
if ( ! works ) {
socket . emit ( "node checked" , personIndex , works , playerIndex , room , nextPlayerIndex )
socket . emit ( "node checked" , personIndex , works , playerIndex , room , nextPlayerIndex )
const ind = bot . placeSquare ( personNetwork , players )
const ind = bot . placeSquare ( personNetwork , players )
if ( ind == - 1 ) {
addToHistory ( lastIndex . toString ( ) + "177" )
socket . emit ( "can't put square" , lastIndex , room )
return
}
console . log ( lastIndex + " pose carré sur " + personNetwork . getPersons ( ) [ ind ] . getName ( ) )
console . log ( lastIndex + " pose carré sur " + personNetwork . getPersons ( ) [ ind ] . getName ( ) )
playerIndex = lastIndex + 1
playerIndex = lastIndex + 1
if ( playerIndex == players . length ) {
if ( playerIndex == players . length ) {
@ -195,6 +208,11 @@ const MyGraphComponent: React.FC<MyGraphComponentProps> = ({onNodeClick, handleS
console . log ( lastIndex + " interroge " + choosedPlayerIndex + " a propos de " + person . getName ( ) + " et dit non" )
console . log ( lastIndex + " interroge " + choosedPlayerIndex + " a propos de " + person . getName ( ) + " et dit non" )
socket . emit ( "node checked" , personIndex , false , choosedPlayerIndex , room , lastIndex )
socket . emit ( "node checked" , personIndex , false , choosedPlayerIndex , room , lastIndex )
const ind = bot . placeSquare ( personNetwork , players )
const ind = bot . placeSquare ( personNetwork , players )
if ( ind == - 1 ) {
addToHistory ( lastIndex . toString ( ) + "212" )
socket . emit ( "can't put square" , playerIndex , room )
return
}
console . log ( lastIndex + " pose carré sur " + personNetwork . getPersons ( ) [ ind ] . getName ( ) )
console . log ( lastIndex + " pose carré sur " + personNetwork . getPersons ( ) [ ind ] . getName ( ) )
playerIndex = lastIndex + 1
playerIndex = lastIndex + 1
if ( playerIndex == players . length ) {
if ( playerIndex == players . length ) {
@ -210,6 +228,11 @@ const MyGraphComponent: React.FC<MyGraphComponentProps> = ({onNodeClick, handleS
const tester = IndiceTesterFactory . Create ( indices [ choosedPlayerIndex ] )
const tester = IndiceTesterFactory . Create ( indices [ choosedPlayerIndex ] )
if ( ! tester . Works ( person ) ) {
if ( ! tester . Works ( person ) ) {
const ind = bot . placeSquare ( personNetwork , players )
const ind = bot . placeSquare ( personNetwork , players )
if ( ind == - 1 ) {
addToHistory ( lastIndex . toString ( ) + "232" )
socket . emit ( "can't put square" , playerIndex , room )
return
}
console . log ( lastIndex + " pose carré sur " + personNetwork . getPersons ( ) [ ind ] . getName ( ) )
console . log ( lastIndex + " pose carré sur " + personNetwork . getPersons ( ) [ ind ] . getName ( ) )
playerIndex = lastIndex + 1
playerIndex = lastIndex + 1
if ( playerIndex == players . length ) {
if ( playerIndex == players . length ) {
@ -282,16 +305,22 @@ const MyGraphComponent: React.FC<MyGraphComponentProps> = ({onNodeClick, handleS
gravitationalConstant : - 1000 ,
gravitationalConstant : - 1000 ,
springConstant : 0.001 ,
springConstant : 0.001 ,
springLength : 100
springLength : 100
} ,
solver : "repulsion" ,
repulsion : {
nodeDistance : 100 // Put more distance between the nodes.
}
}
}
}
} ;
} ;
const networkData = { nodes : nodes , edges : graph.edges } ;
const networkData = { nodes : nodes , edges : graph.edges } ;
const network = new Network ( container , networkData , initialOptions ) ;
const network = new Network ( container , networkData , initialOptions ) ;
network . stabilize ( ) ;
setNetwork ( network )
setNetwork ( network )
setSeedData ( network . getSeed ( ) )
if ( isDaily ) {
if ( isDaily ) {
setNetworkEnigme ( dailyEnigme )
if ( ! isEasy ) {
if ( ! isEasy ) {
dailyEnigme . forEach ( ( pairs , index ) = > {
dailyEnigme . forEach ( ( pairs , index ) = > {
pairs . forEach ( ( pair ) = > {
pairs . forEach ( ( pair ) = > {
@ -391,11 +420,60 @@ const MyGraphComponent: React.FC<MyGraphComponentProps> = ({onNodeClick, handleS
} )
} )
socket . on ( "asked wrong" , ( ) = > {
socket . on ( "asked wrong" , ( ) = > {
askedWrong = true
cptSquare ++
if ( cptSquare % 2 == 0 ) {
if ( indice == null ) {
return
}
const tester = IndiceTesterFactory . Create ( indice )
const tabPossible : Person [ ] = [ ]
for ( const person of personNetwork . getPersons ( ) ) {
const node = nodes . get ( ) . find ( ( n ) = > n . id == person . getId ( ) )
if ( node != undefined ) {
let isSquare = false
players . forEach ( ( p , index ) = > {
if ( node . label . includes ( positionToEmoji ( index , false ) ) ) {
isSquare = true
}
} )
if ( ! tester . Works ( person ) && ! isSquare ) {
tabPossible . push ( person )
}
}
}
if ( tabPossible . length > 0 ) {
askedWrongLocal = true
setAskedWrong ( true )
askedWrongBot = true
askedWrongBot = true
handleShowTurnBar ( true )
handleShowTurnBar ( true )
handleTurnBarTextChange ( "Mauvais choix, posez un carré !" )
handleTurnBarTextChange ( "Mauvais choix, posez un carré !" )
socket . emit ( "put grey background" , socket . id , actualPlayerIndex )
socket . emit ( "put grey background" , socket . id , actualPlayerIndex )
}
else {
socket . emit ( "can't put square" , actualPlayerIndex , room )
}
}
} )
socket . on ( "can't put square" , ( askingPlayer ) = > {
cptOnAskedWrong ++
if ( cptOnAskedWrong % 2 == 0 ) {
addToHistory ( players [ askingPlayer ] . pseudo + " ne peut plus poser de carré" )
playerIndex = askingPlayer + 1
if ( playerIndex == players . length ) {
playerIndex = 0
}
setPlayerIndex ( playerIndex )
setLastIndex ( playerIndex )
if ( playerIndex === actualPlayerIndex ) {
handleTurnBarTextChange ( "À vous de jouer" )
handleShowTurnBar ( true )
}
else {
handleShowTurnBar ( false )
socket . emit ( "put correct background" , socket . id )
}
}
} )
} )
@ -414,7 +492,6 @@ const MyGraphComponent: React.FC<MyGraphComponentProps> = ({onNodeClick, handleS
const node = nodes . get ( ) . find ( ( n ) = > nodeId == n . id )
const node = nodes . get ( ) . find ( ( n ) = > nodeId == n . id )
if ( node != undefined && indice != null ) {
if ( node != undefined && indice != null ) {
var tester = IndiceTesterFactory . Create ( indice )
var tester = IndiceTesterFactory . Create ( indice )
let maybe = actualPlayerIndex
if ( tester . Works ( pers ) ) {
if ( tester . Works ( pers ) ) {
playerIndex = playerIndex + 1
playerIndex = playerIndex + 1
if ( playerIndex == players . length ) {
if ( playerIndex == players . length ) {
@ -423,10 +500,6 @@ const MyGraphComponent: React.FC<MyGraphComponentProps> = ({onNodeClick, handleS
socket . emit ( "node checked" , nodeId , true , actualPlayerIndex , room , playerIndex )
socket . emit ( "node checked" , nodeId , true , actualPlayerIndex , room , playerIndex )
}
}
else {
else {
maybe = actualPlayerIndex - 1
if ( maybe == 0 ) {
maybe = players . length - 1
}
let index = players . findIndex ( ( p ) = > p . id == askingPlayer . id )
let index = players . findIndex ( ( p ) = > p . id == askingPlayer . id )
if ( players [ index ] instanceof Bot ) {
if ( players [ index ] instanceof Bot ) {
index = playerIndex + 1
index = playerIndex + 1
@ -474,13 +547,24 @@ const MyGraphComponent: React.FC<MyGraphComponentProps> = ({onNodeClick, handleS
}
}
}
}
else if ( indice != null ) {
else if ( indice != null ) {
//Pour poser un carré
const tester = IndiceTesterFactory . Create ( indice )
const tester = IndiceTesterFactory . Create ( indice )
for ( const person of personNetwork . getPersons ( ) . filter ( ( p ) = > tab . includes ( p ) || tester . Works ( p ) ) ) {
for ( const person of personNetwork . getPersons ( ) ) {
const node = nodes . get ( ) . find ( ( n ) = > n . id == person . getId ( ) )
if ( node == undefined ) continue
let isSquare = false
players . forEach ( ( p , index ) = > {
if ( node . label . includes ( positionToEmoji ( index , false ) ) ) {
isSquare = true
}
} )
if ( tab . includes ( person ) || tester . Works ( person ) || isSquare ) {
networkData . nodes . update ( { id : person.getId ( ) , color : "#808080" } )
networkData . nodes . update ( { id : person.getId ( ) , color : "#808080" } )
}
}
}
}
}
}
}
}
}
} )
} )
socket . on ( "put imossible grey" , ( ) = > {
socket . on ( "put imossible grey" , ( ) = > {
@ -510,7 +594,7 @@ const MyGraphComponent: React.FC<MyGraphComponentProps> = ({onNodeClick, handleS
cptEndgame ++ ;
cptEndgame ++ ;
const currentPlayer = players [ actualPlayerIndex ] ;
const currentPlayer = players [ actualPlayerIndex ] ;
const winner = players [ winnerIndex ] ;
const winner = players [ winnerIndex ] ;
setNetworkDataData ( networkData )
setNodeIdData ( - 1 )
setNodeIdData ( - 1 )
setActualPlayerIndexData ( - 1 )
setActualPlayerIndexData ( - 1 )
setLastIndex ( - 1 )
setLastIndex ( - 1 )
@ -520,7 +604,8 @@ const MyGraphComponent: React.FC<MyGraphComponentProps> = ({onNodeClick, handleS
first = true
first = true
cptHistory = 0
cptHistory = 0
askedWrong = false
askedWrongLocal = false
setAskedWrong ( false )
askedWrongBot = false
askedWrongBot = false
endgame = true
endgame = true
firstHistory = true
firstHistory = true
@ -579,7 +664,7 @@ const MyGraphComponent: React.FC<MyGraphComponentProps> = ({onNodeClick, handleS
}
}
if ( a == indices . length ) {
if ( a == indices . length ) {
//networkData.nodes.update({id: p.getId(), label: p.getName() + "\n🔵"})
//networkData.nodes.update({id: p.getId(), label: p.getName() + "\n🔵"})
console . log ( p )
//console.log(p)
}
}
} ) ;
} ) ;
@ -601,11 +686,18 @@ const MyGraphComponent: React.FC<MyGraphComponentProps> = ({onNodeClick, handleS
setNodeIdData ( params . nodes [ 0 ] )
setNodeIdData ( params . nodes [ 0 ] )
// addToHistory("Le joueur a cliqué") //! TEST DEBUG
// addToHistory("Le joueur a cliqué") //! TEST DEBUG
if ( ! solo ) {
if ( ! solo ) {
if ( askedWrong ) {
if ( askedWrong Local ) {
const person = personNetwork ? . getPersons ( ) . find ( ( p ) = > p . getId ( ) == params . nodes [ 0 ] )
const person = personNetwork ? . getPersons ( ) . find ( ( p ) = > p . getId ( ) == params . nodes [ 0 ] )
if ( person !== undefined && indice !== null ) {
const node = nodes . get ( ) . find ( ( n ) = > n . id == params . nodes [ 0 ] )
if ( person !== undefined && indice !== null && node != undefined ) {
const tester = IndiceTesterFactory . Create ( indice )
const tester = IndiceTesterFactory . Create ( indice )
if ( ! tester . Works ( person ) && ! askedPersons . includes ( person ) ) {
let isSquare = false
players . forEach ( ( p , index ) = > {
if ( node . label . includes ( positionToEmoji ( index , false ) ) ) {
isSquare = true
}
} )
if ( ! tester . Works ( person ) && ! askedPersons . includes ( person ) && ! isSquare ) {
playerIndex = actualPlayerIndex + 1
playerIndex = actualPlayerIndex + 1
if ( playerIndex == players . length ) {
if ( playerIndex == players . length ) {
playerIndex = 0
playerIndex = 0
@ -614,7 +706,8 @@ const MyGraphComponent: React.FC<MyGraphComponentProps> = ({onNodeClick, handleS
socket . emit ( "put correct background" , socket . id )
socket . emit ( "put correct background" , socket . id )
touchedPlayer = - 1
touchedPlayer = - 1
askedPersons . push ( person )
askedPersons . push ( person )
askedWrong = false
askedWrongLocal = false
setAskedWrong ( false )
}
}
}
}
}
}
@ -641,7 +734,7 @@ const MyGraphComponent: React.FC<MyGraphComponentProps> = ({onNodeClick, handleS
}
}
}
}
else {
else {
if ( touchedPlayer > 0 ) {
if ( touchedPlayer > = 0 ) {
console . log ( touchedPlayer )
console . log ( touchedPlayer )
socket . emit ( "ask player" , params . nodes [ 0 ] , players [ touchedPlayer ] . id , players . find ( ( p ) = > p . id === socket . id , actualPlayerIndex ) )
socket . emit ( "ask player" , params . nodes [ 0 ] , players [ touchedPlayer ] . id , players . find ( ( p ) = > p . id === socket . id , actualPlayerIndex ) )
socket . emit ( "put correct background" , socket . id )
socket . emit ( "put correct background" , socket . id )
@ -721,6 +814,7 @@ const MyGraphComponent: React.FC<MyGraphComponentProps> = ({onNodeClick, handleS
if ( user != null ) {
if ( user != null ) {
setWinnerData ( user )
setWinnerData ( user )
setNetworkDataData ( networkData )
}
}
cptTour ++ ;
cptTour ++ ;
setNbCoupData ( cptTour )
setNbCoupData ( cptTour )
@ -749,7 +843,7 @@ const MyGraphComponent: React.FC<MyGraphComponentProps> = ({onNodeClick, handleS
}
}
index ++
index ++
}
}
addToHistory ( person . getName ( ) + " n'est pas le tueur !") ; //TODO préciser le nombre d'indice qu'il a de juste
addToHistory ( person . getName ( ) + " n'est pas le coupable !") ; //TODO préciser le nombre d'indice qu'il a de juste
cptTour ++ ; // On Incrémente le nombre de tour du joueur
cptTour ++ ; // On Incrémente le nombre de tour du joueur
const tour = cptTour + 1 ;
const tour = cptTour + 1 ;