Baptiste MARCEL 1 year ago
commit f55db09007

5
.gitignore vendored

@ -42,3 +42,8 @@ bower_components
psd psd
thumb thumb
sketch sketch
# db
socialgraph.db

@ -15,7 +15,6 @@ const io = socketIO(server, {
const map = new Map() const map = new Map()
// ... le reste de votre configuration du serveur
server.listen(3002, () => { server.listen(3002, () => {
console.log('Serveur Socket.IO écoutant sur le port 3002'); console.log('Serveur Socket.IO écoutant sur le port 3002');
@ -29,25 +28,26 @@ io.on('connection', (socket) => {
}); });
socket.on("lobby joined", (room, player) =>{ socket.on("lobby joined", (room, player) =>{
if (player.type=="Human"){ console.log(player)
if (player.type=="User"){
socket.join(room) socket.join(room)
} }
if (map.get(room) == undefined){ if (map.get(room) == undefined){
map.set(room, [{type: player.type, id: socket.id, name: player.name}]) map.set(room, [{type: player.type, id: socket.id, pseudo: player.pseudo, profilePicture: player.profilePicture}])
} }
else{ else{
const tab = map.get(room) const tab = map.get(room)
for(let i = 0; i<tab.length; i++){ for(let i = 0; i<tab.length; i++){
if (tab[i].id === socket.id && player.type==="Human"){ if (tab[i].id === socket.id && player.type==="User"){
tab.splice(i, 1) tab.splice(i, 1)
} }
} }
if (player.type!=="Human"){ if (player.type!=="User"){
map.get(room).push({type: player.type, id: player.id, name: player.name}) map.get(room).push({type: player.type, id: player.id, pseudo: player.pseudo, profilePicture: player.profilePicture})
} }
else{ else{
map.get(room).push({type: player.type, id: socket.id, name: player.name}) map.get(room).push({type: player.type, id: socket.id, pseudo: player.pseudo, profilePicture: player.profilePicture})
} }
} }
@ -56,7 +56,6 @@ io.on('connection', (socket) => {
socket.on("bot deleted", (bot, room) =>{ socket.on("bot deleted", (bot, room) =>{
// map.set(room, map.get(room).filter(player => player.id !== bot.id));
const tab = map.get(room) const tab = map.get(room)
for(let i = 0; i<tab.length; i++){ for(let i = 0; i<tab.length; i++){
if (tab[i].id === bot.id){ if (tab[i].id === bot.id){

@ -61,7 +61,7 @@ const ChoiceBar = () => {
{players.map((player, index) => ( {players.map((player, index) => (
player.id !== socket.id && player.id !== socket.id &&
<button key={index} className="choice-bar-button" onClick={() => askPlayer(player.id)} style={{ backgroundColor: theme.colors.primary }}> <button key={index} className="choice-bar-button" onClick={() => askPlayer(player.id)} style={{ backgroundColor: theme.colors.primary }}>
{player.name} {player.pseudo}
</button> </button>
))} ))}
</div> </div>

@ -11,6 +11,7 @@ import { colorToEmoji, positionToColor, positionToEmoji } from "../ColorHelper";
import { ColorToHexa } from "../model/EnumExtender"; 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";
interface MyGraphComponentProps { interface MyGraphComponentProps {
@ -22,6 +23,7 @@ interface MyGraphComponentProps {
changecptTour: (newcptTour : number) => void changecptTour: (newcptTour : number) => void
addToHistory: (message : string) => void addToHistory: (message : string) => void
solo : boolean solo : boolean
isDaily : boolean
setNetwork: (network: Network) => void setNetwork: (network: Network) => void
showLast: boolean showLast: boolean
} }
@ -38,12 +40,17 @@ let lastSocketId= ""
let firstLap = true let firstLap = true
let cptHistory = 0 let cptHistory = 0
let lastNodes: NodePerson[] = [] let lastNodes: NodePerson[] = []
let firstEnigme = true
const MyGraphComponent: React.FC<MyGraphComponentProps> = ({onNodeClick, handleShowTurnBar, handleTurnBarTextChange, playerTouched, setPlayerTouched, changecptTour, solo, addToHistory, showLast, setNetwork}) => { const MyGraphComponent: React.FC<MyGraphComponentProps> = ({onNodeClick, handleShowTurnBar, handleTurnBarTextChange, playerTouched, setPlayerTouched, changecptTour, solo, isDaily, addToHistory, showLast, setNetwork}) => {
let cptTour: number = 0 let cptTour: number = 0
const { indices, indice, person, personNetwork, setNodeIdData, players, askedPersons, setActualPlayerIndexData, room, actualPlayerIndex, turnPlayerIndex, setTurnPlayerIndexData, setWinnerData } = useGame(); //* Gestion du temps :
const initMtn = new Date().getSeconds()
const {user} = useAuth()
const { indices, indice, person, personNetwork, setNodeIdData, players, askedPersons, setActualPlayerIndexData, room, actualPlayerIndex, turnPlayerIndex, setTurnPlayerIndexData, setWinnerData, dailyEnigme, setNbCoupData, settempsData} = useGame();
const params = new URLSearchParams(window.location.search); const params = new URLSearchParams(window.location.search);
const navigate = useNavigate(); const navigate = useNavigate();
@ -256,6 +263,28 @@ let cptTour: number = 0
setNetwork(network) setNetwork(network)
if (isDaily){
dailyEnigme.forEach((pairs, index) => {
pairs.forEach((pair) => {
const i = indices.findIndex((indice) => pair.first.getId() === indice.getId())
console.log(index)
const node = networkData.nodes.get().find((n) => index == n.id)
if (node != undefined){
networkData.nodes.update({id: node.id, label: node.label + positionToEmoji(i, pair.second)})
const test = networkData.nodes.get().find((n) => index == n.id)
if (test!=undefined){
console.log(test.label)
}
}
})
});
}
indices.forEach((i, index) => {
console.log(i.ToString("fr") + " => " + positionToEmoji(index, true))
})
if (!solo){ if (!solo){
socket.on("asked all", (id) =>{ socket.on("asked all", (id) =>{
const pers = personNetwork.getPersons().find((p) => p.getId() == id) const pers = personNetwork.getPersons().find((p) => p.getId() == id)
@ -309,7 +338,7 @@ let cptTour: number = 0
cptHistory++ cptHistory++
if (cptHistory % 2 == 0){ if (cptHistory % 2 == 0){
lastNodes.push(node) lastNodes.push(node)
addToHistory(players[askedIndex].name + " à mis un " + positionToEmoji(askedIndex, works) + " à " + personNetwork.getPersons()[id].getName()) addToHistory(players[askedIndex].pseudo + " à mis un " + positionToEmoji(askedIndex, works) + " à " + personNetwork.getPersons()[id].getName())
} }
} }
@ -622,7 +651,13 @@ let cptTour: number = 0
works = false works = false
} }
if (index == indices.length - 1 && works){ if (index == indices.length - 1 && works){
navigate("/endgame") const Mtn = new Date().getSeconds()
settempsData(Mtn - initMtn)
cptTour ++;
setNbCoupData(cptTour)
navigate("/endgame?solo=true&daily=" + isDaily)
} }
} }
@ -631,7 +666,6 @@ let cptTour: number = 0
} }
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 tueur !"); //TODO préciser le nombre d'indice qu'il a de juste
//TODO METTRE LA WIN CONDITION ICI AVEC LE MERGE
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;
addToHistory("<----- [Tour " + tour +"/"+networkData.nodes.length + "] ----->"); addToHistory("<----- [Tour " + tour +"/"+networkData.nodes.length + "] ----->");

@ -47,7 +47,7 @@ const PlayerItemList:React.FC<MyPlayerItemListProps> =({ player, room }) => {
<div className='item-horizontal-div'> <div className='item-horizontal-div'>
<div> <div>
<img src={pdp} alt='player-image' height='100' width='100' /> <img src={pdp} alt='player-image' height='100' width='100' />
<h4>{player.name}</h4> <h4>{player.pseudo}</h4>
</div> </div>
{isBot && ( {isBot && (
<Button className='suprButton' onClick={delBot} variant="danger"> <Button className='suprButton' onClick={delBot} variant="danger">

@ -25,7 +25,7 @@ const PlayerList: React.FC<PlayerListProps> = ({ players, playerTouched, setPlay
{ {
//@ts-ignore //@ts-ignore
players.map((player, index) => ( players.map((player, index) => (
player.id!=socket.id && <PersonStatus img={Person} state={Person} key={index} name={player.name + " " + colorToEmoji(positionToColor(index), true)} playerTouched={playerTouched} setPlayerTouched={setPlayerTouched} index={index} showCircle={true}/> player.id!=socket.id && <PersonStatus img={Person} state={Person} key={index} name={player.pseudo + " " + colorToEmoji(positionToColor(index), true)} playerTouched={playerTouched} setPlayerTouched={setPlayerTouched} index={index} showCircle={true}/>
)) ))
} }
</div> </div>

@ -20,12 +20,12 @@ import Col from 'react-bootstrap/Col';
/* Component */ /* Component */
import ButtonImgNav from './ButtonImgNav'; import ButtonImgNav from './ButtonImgNav';
import User from '../model/User';
/* Types */ /* Types */
import { PlayerProps } from '../types/Player';
//@ts-ignore //@ts-ignore
const ScoreBoard: React.FC<{ Player: PlayerProps }> = ({ Player }) => { const ScoreBoard: React.FC<{ Player: User }> = ({ Player }) => {
const theme=useTheme(); const theme=useTheme();
return ( return (

@ -1,22 +1,31 @@
// AuthContext.js // AuthContext.js
import React, { createContext, useContext, useState, ReactNode } from 'react'; import React, { createContext, useContext, useState, ReactNode } from 'react';
import Player from '../model/Player';
import User from '../model/User';
import AuthService from '../services/AuthService'; import AuthService from '../services/AuthService';
interface AuthContextProps { interface AuthContextProps {
isLoggedIn: boolean; isLoggedIn: boolean;
login: () => void; login: () => void;
logout: () => void; logout: () => void;
user: User | null
setUserData: (newPlayer: User) => void
} }
const AuthContext = createContext<AuthContextProps | undefined>(undefined); const AuthContext = createContext<AuthContextProps | undefined>(undefined);
const AuthProvider: React.FC<{ children: ReactNode }> = ({ children }) => { const AuthProvider: React.FC<{ children: ReactNode }> = ({ children }) => {
const [isLoggedIn, setIsLoggedIn] = useState<boolean>(false); const [isLoggedIn, setIsLoggedIn] = useState<boolean>(false);
const [user, setUser] = useState<User| null>(null)
const login = () => { const login = () => {
setIsLoggedIn(true); setIsLoggedIn(true);
}; };
const setUserData = (player: User | null) => {
setUser(player)
}
const logout = async() => { const logout = async() => {
try { try {
await AuthService.logout(); await AuthService.logout();
@ -28,7 +37,7 @@ const AuthProvider: React.FC<{ children: ReactNode }> = ({ children }) => {
}; };
return ( return (
<AuthContext.Provider value={{ isLoggedIn, login, logout }}> <AuthContext.Provider value={{ isLoggedIn, login, logout, user, setUserData }}>
{children} {children}
</AuthContext.Provider> </AuthContext.Provider>
); );

@ -1,5 +1,6 @@
import React, { createContext, useContext, useState, ReactNode } from 'react'; import React, { createContext, useContext, useState, ReactNode } from 'react';
import Indice from '../model/Indices/Indice'; import Indice from '../model/Indices/Indice';
import Pair from '../model/Pair';
import Person from '../model/Person'; import Person from '../model/Person';
import PersonNetwork from '../model/PersonsNetwork'; import PersonNetwork from '../model/PersonsNetwork';
import Player from '../model/Player'; import Player from '../model/Player';
@ -17,6 +18,9 @@ interface GameContextProps {
room: string; room: string;
onlyFalse: boolean onlyFalse: boolean
winner: Player | null winner: Player | null
dailyEnigme: Map<number, Pair<Indice, boolean>[]>
nbCoup : number
temps : number
setIndicesData: (newIndices: Indice[]) => void; setIndicesData: (newIndices: Indice[]) => void;
setIndiceData: (newIndice: Indice) => void; setIndiceData: (newIndice: Indice) => void;
setPersonData: (newPerson: Person) => void; setPersonData: (newPerson: Person) => void;
@ -30,6 +34,9 @@ interface GameContextProps {
setOnlyFalseData: (newOnlyFalse: boolean) => void setOnlyFalseData: (newOnlyFalse: boolean) => void
setWinnerData: (winner: Player) => void setWinnerData: (winner: Player) => void
reset: () => void reset: () => void
setDailyEnigmeData: (map: Map<number, Pair<Indice, boolean>[]>) => void
setNbCoupData: (newNbCoup : number) => void
settempsData: (newtemps : number) => void
} }
const GameContext = createContext<GameContextProps | undefined>(undefined); const GameContext = createContext<GameContextProps | undefined>(undefined);
@ -51,6 +58,9 @@ export const GameProvider: React.FC<GameProviderProps> = ({ children }) => {
const [room, setRoom] = useState<string>("") const [room, setRoom] = useState<string>("")
const [onlyFalse, setOnlyFalse] = useState<boolean>(false) const [onlyFalse, setOnlyFalse] = useState<boolean>(false)
const [winner, setWinner] = useState<Player | null>(null) const [winner, setWinner] = useState<Player | null>(null)
const [dailyEnigme, setDailyEnigme] = useState<Map<number, Pair<Indice, boolean>[]>>(new Map())
const [nbCoup, setNbCoup] = useState<number>(0);
const [temps, settemps] = useState<number>(0);
const setIndicesData = (newIndices: Indice[]) => { const setIndicesData = (newIndices: Indice[]) => {
@ -102,6 +112,19 @@ export const GameProvider: React.FC<GameProviderProps> = ({ children }) => {
setWinner(winner) setWinner(winner)
} }
const setDailyEnigmeData = (map: Map<number, Pair<Indice, boolean>[]>) => {
setDailyEnigme(map)
}
const setNbCoupData = (newNbCoup : number) => {
setNbCoup(newNbCoup);
}
const settempsData = (newtemps : number) => {
settemps(newtemps);
}
const reset = () => { const reset = () => {
setIndices([]) setIndices([])
setActualPlayerIndex(-1) setActualPlayerIndex(-1)
@ -114,10 +137,12 @@ export const GameProvider: React.FC<GameProviderProps> = ({ children }) => {
setTurnPlayerIndex(-1) setTurnPlayerIndex(-1)
setNodeId(-1) setNodeId(-1)
setIndice(null) setIndice(null)
setNbCoup(0)
settemps(0)
} }
return ( 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 }}> <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}}>
{children} {children}
</GameContext.Provider> </GameContext.Provider>
); );

@ -1,5 +1,5 @@
import EasyBot from "./model/EasyBot"; import EasyBot from "./model/EasyBot";
import Human from "./model/Human"; import Human from "./model/User";
import AgeIndice from "./model/Indices/AgeIndice"; import AgeIndice from "./model/Indices/AgeIndice";
import ColorEdgesIndice from "./model/Indices/ColorEdgesIndice"; import ColorEdgesIndice from "./model/Indices/ColorEdgesIndice";
import ColorIndice from "./model/Indices/ColorIndice"; import ColorIndice from "./model/Indices/ColorIndice";
@ -10,6 +10,7 @@ import SportIndice from "./model/Indices/SportIndice";
import Person from "./model/Person"; import Person from "./model/Person";
import PersonNetwork from "./model/PersonsNetwork"; import PersonNetwork from "./model/PersonsNetwork";
import Player from "./model/Player"; import Player from "./model/Player";
import User from "./model/User";
class JSONParser{ class JSONParser{
@ -84,10 +85,10 @@ class JSONParser{
static JSONToPlayer(json: any): Player{ static JSONToPlayer(json: any): Player{
switch (json.type){ switch (json.type){
case "Human": case "User":
return new Human(json.id, json.name) return new User(json.id, json.pseudo, json.profilePicture, json.soloStats, json.onlineStats)
case "EasyBot": case "EasyBot":
return new EasyBot(json.id, json.name) return new EasyBot(json.id, json.pseudo, json.profilePicture)
default: default:
throw new Error("PARSER unable to parse player: " + json.type); throw new Error("PARSER unable to parse player: " + json.type);
} }

@ -80,3 +80,38 @@
padding: 10px; padding: 10px;
box-shadow: 5px 5px 5px rgb(246, 246, 246); box-shadow: 5px 5px 5px rgb(246, 246, 246);
} }
.SoloContainer{
display: flex;
flex-direction: column;
align-items: center;
border: solid 1px whitesmoke;
border-radius: 15px;
background-color: white;
max-width: 50%;
}
.indicesolo{
display: flex;
flex-wrap: wrap;
justify-content: space-evenly;
/* margin: 10px 0; */
/* max-height: 200px; */
}
.solostat{
display: flex;
justify-content: space-between;
width: 70%;
}
.solostat p {
border: solid 1px whitesmoke;
border-radius: 15px;
background-color: white;
padding: 10px;
}

@ -22,40 +22,67 @@ import { Link } from 'react-router-dom';
/* lang */ /* lang */
import { FormattedMessage } from 'react-intl'; import { FormattedMessage } from 'react-intl';
import { useGame } from '../Contexts/GameContext'; import { useGame } from '../Contexts/GameContext';
import { map } from 'lodash';
import Player from '../model/Player';
function EndGame() { function EndGame() {
const params = new URLSearchParams(window.location.search);
//* Gestion solo
let IsSolo: boolean = false
const solotmp = params.get('solo');
if (solotmp == "true"){
IsSolo=true
}
//* Gestion daily
let IsDaily: boolean = false
const dailytmp = params.get('daily');
if (dailytmp == "true"){
IsDaily=true
}
const {reset} = useGame() const {reset} = useGame()
const resetAll = () => { const resetAll = () => {
reset() reset()
} }
const {winner, person, players, indices} =useGame() const {winner, person, players, indices, nbCoup, temps} =useGame()
console.log(winner) console.log(winner)
let indice = indices[0] let indice = indices[0]
let losingPlayers : Player[];
if(!IsSolo){
const index = players.findIndex((p) => p.id == winner?.id) const index = players.findIndex((p) => p.id == winner?.id)
if (index != -1) { if (index != -1) {
indice = indices[index] indice = indices[index]
} }
let losingPlayers;
if (winner != null) { if (winner != null) {
losingPlayers = players.filter(player => player.id !== winner.id); losingPlayers = players.filter(player => player.id !== winner.id);
} else { } else {
losingPlayers = players; losingPlayers = players;
} }
}
else{
losingPlayers = [];
}
const theme = useTheme(); const theme = useTheme();
return ( return (
<div>
{!IsSolo &&
<div> <div>
<div className="head"> <div className="head">
<header className='leaderboard-header' style={{ borderColor: theme.colors.primary }}> <header className='leaderboard-header' style={{ borderColor: theme.colors.primary }}>
<h1>{winner?.name} a gagné !</h1> <h1>{winner?.pseudo} a gagné !</h1>
<h3>Le tueur était <u>{person?.getName()}</u></h3> <h3>Le tueur était <u>{person?.getName()}</u></h3>
</header> </header>
</div> </div>
@ -72,7 +99,7 @@ function EndGame() {
<div className="playerContainer" key={index}> <div className="playerContainer" key={index}>
{player.id !== winner?.id && ( {player.id !== winner?.id && (
<div> <div>
<PersonStatus img={Person} state={Person} key={index} name={player.name} playerTouched={1} setPlayerTouched={() => {}} index={index} showCircle={false}/> <PersonStatus img={Person} state={Person} key={index} name={player.pseudo} playerTouched={1} setPlayerTouched={() => {}} index={index} showCircle={false}/>
<h6 className='indiceDisplay'>{indices[players.findIndex((p) => p.id == player?.id)].ToString("fr")}</h6> <h6 className='indiceDisplay'>{indices[players.findIndex((p) => p.id == player?.id)].ToString("fr")}</h6>
</div> </div>
)} )}
@ -84,6 +111,43 @@ function EndGame() {
</div> </div>
</div> </div>
</div> </div>
}
<div className="head">
<header className='leaderboard-header' style={{ borderColor: theme.colors.primary }}>
<h1>Vous avez gagné !</h1>
<h3>Le tueur était <u>{person?.getName()}</u></h3>
</header>
</div>
<div className='winner'>
<img src={Person} width='250' height='250'/>
<h1>[ {winner?.pseudo} ]</h1>
</div>
<div className='bottom'>
<div className='centerDivH' onClick={resetAll}>
<BigButtonNav dest="/play" img={Leave}/>
</div>
<div className="SoloContainer">
<div className='solostat'>
{!IsDaily && <p>Nombre de coups : {nbCoup}</p> }
<p>Temps : {temps}s</p>
</div>
<div className='indicesolo'>
{indices.map((indice, index) => (
// <div className="playerContainer" key={index}>
<div>
<h6 className='indiceDisplay'> <u>Indice {index+1}</u> : {indice.ToString("fr")}</h6>
</div>
//</div>
))
}
</div>
</div>
<div className='centerDivH'>
<BigButtonNav dest="/lobby" img={Replay}/>
</div>
</div>
</div>
); );
} }

@ -62,6 +62,13 @@ const InGame = ({locale, changeLocale}) => {
IsSolo=false IsSolo=false
} }
//* Gestion daily
let isDaily: boolean = true
const isDailytmp = params.get('daily');
if (isDailytmp == "false"){
isDaily=false
}
//* Historique //* Historique
const [history, setHistory] = useState<string[]>([]); const [history, setHistory] = useState<string[]>([]);
const [showLast, setShowLast] = useState(false) const [showLast, setShowLast] = useState(false)
@ -212,6 +219,7 @@ const InGame = ({locale, changeLocale}) => {
changecptTour={changecptTour} changecptTour={changecptTour}
addToHistory={addToHistory} addToHistory={addToHistory}
solo={IsSolo} solo={IsSolo}
isDaily={isDaily}
setPlayerTouched={handleSetPlayerTouched} setPlayerTouched={handleSetPlayerTouched}
playerTouched={playerTouched} playerTouched={playerTouched}
setNetwork={setNetworkData} setNetwork={setNetworkData}
@ -219,7 +227,7 @@ const InGame = ({locale, changeLocale}) => {
</div> </div>
{IsSolo && {IsSolo && !isDaily &&
<div className='nbLaps' style={{ <div className='nbLaps' style={{
backgroundColor: theme.colors.primary, backgroundColor: theme.colors.primary,
borderColor: theme.colors.secondary borderColor: theme.colors.secondary
@ -228,12 +236,13 @@ const InGame = ({locale, changeLocale}) => {
</div> </div>
} }
{!isDaily &&
<div className='historique' id="history-container"> <div className='historique' id="history-container">
{history.map((item, index) => ( {history.map((item, index) => (
<div key={index}>{item}</div> <div key={index}>{item}</div>
))} ))}
</div> </div>
}
<div className='paramDiv'> <div className='paramDiv'>
<button className='button' <button className='button'
@ -289,7 +298,8 @@ const InGame = ({locale, changeLocale}) => {
<img src={Check} alt="check" height="40"/> <img src={Check} alt="check" height="40"/>
</button> */} </button> */}
{!IsSolo && <Link to='/info' target='_blank'> {!IsSolo &&
<Link to='/info' target='_blank'>
<button className='button' <button className='button'
style={{ style={{
backgroundColor: theme.colors.tertiary, backgroundColor: theme.colors.tertiary,
@ -315,7 +325,9 @@ const InGame = ({locale, changeLocale}) => {
<img src={ eye } alt="indice" height="40"/> <img src={ eye } alt="indice" height="40"/>
</button>} </button>}
{IsSolo && <button className='button' onClick={generateTEX} {IsSolo &&
<button className='button' onClick={generateTEX}
style={{ style={{
backgroundColor: theme.colors.tertiary, backgroundColor: theme.colors.tertiary,
borderColor: theme.colors.secondary borderColor: theme.colors.secondary
@ -390,9 +402,6 @@ const InGame = ({locale, changeLocale}) => {
</Offcanvas.Body> </Offcanvas.Body>
</Offcanvas> </Offcanvas>
<div id="bottom-container">
{showChoiceBar && <ChoiceBar />}
</div>
{/* {/*
<div id="endgamebutton" > {/* tmp <div id="endgamebutton" > {/* tmp
<ButtonImgNav dest="/endgame" img={Leave} text='endgame'/> <ButtonImgNav dest="/endgame" img={Leave} text='endgame'/>

@ -22,9 +22,11 @@ import { useNavigate } from 'react-router-dom';
import { socket } from "../SocketConfig"; import { socket } from "../SocketConfig";
import { random } from 'lodash'; import { random } from 'lodash';
import Player from '../model/Player'; import Player from '../model/Player';
import Human from '../model/Human';
import EasyBot from '../model/EasyBot'; import EasyBot from '../model/EasyBot';
import Bot from '../model/Bot'; import Bot from '../model/Bot';
import User from '../model/User';
import { useAuth } from '../Contexts/AuthContext';
import SessionService from '../services/SessionService';
let gameStarted = false let gameStarted = false
@ -36,23 +38,64 @@ function Lobby() {
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 } = useGame();
const {user, setUserData} = useAuth()
let first = true let first = true
const params = new URLSearchParams(window.location.search); const params = new URLSearchParams(window.location.search);
const room = params.get('room'); const room = params.get('room');
function addBot(){ function addBot(){
socket.emit("lobby joined", room, new EasyBot("botId" + Math.floor(Math.random() * 1000), "Bot" + Math.floor(Math.random() * 100)).toJson()) socket.emit("lobby joined", room, new EasyBot("botId" + Math.floor(Math.random() * 1000), "Bot" + Math.floor(Math.random() * 100), "").toJson())
} }
// function delBot(selectedBot: Bot){
// }
useEffect(() => { useEffect(() => {
if (first){ if (first){
first=false first=false
socket.emit("lobby joined", room, new Human("test", "Test" + Math.floor(Math.random() * 100)).toJson())
if (user == null){
try {
const sessionData = SessionService.getSession();
sessionData.then((s) => {
if (s.user) {
// Il y a une session on récupère les infos du joueur
const updatedPlayer: User = new User(socket.id, s.user.pseudo, s.user.profilePicture, {
nbGames: s.user.soloStats.nbGames,
bestScore: s.user.soloStats.bestScore,
avgNbTry: s.user.soloStats.avgNbTry,
},
{
nbGames: s.user.onlineStats.nbGames,
nbWins: s.user.onlineStats.nbWins,
ratio: s.user.onlineStats.ratio,
})
setUserData(updatedPlayer);
socket.emit("lobby joined", room, updatedPlayer.toJson())
} else {
// Pas de session on génère un guest random
const guestPlayer: User = new User(socket.id, 'Guest_' + Math.floor(Math.random() * 1000000), '',
{
nbGames: 0,
bestScore: 0,
avgNbTry: 0,
},
{
nbGames: 0,
nbWins: 0,
ratio: 0,
})
setUserData(guestPlayer);
socket.emit("lobby joined", room, guestPlayer.toJson())
}
})
}
catch (error) {
console.error(error);
}
}
else{
socket.emit("lobby joined", room, user.toJson())
}
return () => { return () => {
socket.off('game created'); socket.off('game created');
@ -114,7 +157,12 @@ function Lobby() {
setPersonData(choosenPerson) setPersonData(choosenPerson)
setPersonNetworkData(networkPerson) setPersonNetworkData(networkPerson)
setIndicesData(choosenIndices) setIndicesData(choosenIndices)
let start = 0 let users = players.filter((p) => p instanceof User)
let u = users[Math.floor(Math.random() * users.length)]
let start = players.findIndex((p) => p.id == u.id)
if (start == -1){
start = 0
}
socket.emit('network created', JSON.stringify(networkPerson, null, 2), JSON.stringify(choosenPerson), JSON.stringify(choosenIndices), room, start); socket.emit('network created', JSON.stringify(networkPerson, null, 2), JSON.stringify(choosenPerson), JSON.stringify(choosenIndices), room, start);
} }

@ -23,12 +23,18 @@ import ScoreBoard from '../Components/ScoreBoard';
/* Types */ /* Types */
import { PlayerProps } from '../types/Player'; import { PlayerProps } from '../types/Player';
import Player from '../model/Player';
import Human from '../model/User';
import User from '../model/User';
import EnigmeDuJourCreator from '../model/EnigmeDuJourCreator';
import Stub from '../model/Stub';
let first = true
function Play() { function Play() {
const theme=useTheme() const theme=useTheme()
const {isLoggedIn, login} = useAuth(); const {isLoggedIn, login, user, setUserData } = useAuth();
const [player, setPlayer] = useState<PlayerProps | null>(null); const {setDailyEnigmeData} = useGame()
useEffect(() => { useEffect(() => {
const fetchUserInformation = async () => { const fetchUserInformation = async () => {
@ -38,39 +44,32 @@ function Play() {
// Vérifie si il y a une session // Vérifie si il y a une session
if (sessionData.user) { if (sessionData.user) {
// Il y a une session on récupère les infos du joueur // Il y a une session on récupère les infos du joueur
const updatedPlayer: PlayerProps = { const updatedPlayer: User = new User(socket.id, sessionData.user.pseudo, sessionData.user.profilePicture, {
pseudo: sessionData.user.pseudo,
profilePicture: sessionData.user.profilePicture,
soloStats: {
nbGames: sessionData.user.soloStats.nbGames, nbGames: sessionData.user.soloStats.nbGames,
bestScore: sessionData.user.soloStats.bestScore, bestScore: sessionData.user.soloStats.bestScore,
avgNbTry: sessionData.user.soloStats.avgNbTry, avgNbTry: sessionData.user.soloStats.avgNbTry,
}, },
onlineStats: { {
nbGames: sessionData.user.onlineStats.nbGames, nbGames: sessionData.user.onlineStats.nbGames,
nbWins: sessionData.user.onlineStats.nbWins, nbWins: sessionData.user.onlineStats.nbWins,
ratio: sessionData.user.onlineStats.ratio, ratio: sessionData.user.onlineStats.ratio,
}, })
};
login(); login();
setPlayer(updatedPlayer); setUserData(updatedPlayer);
} else { } else {
// Pas de session on génère un guest random // Pas de session on génère un guest random
const guestPlayer: PlayerProps = { const guestPlayer: User = new User(socket.id, 'Guest_' + Math.floor(Math.random() * 1000000), '',
pseudo: 'Guest_' + Math.floor(Math.random() * 1000000), {
profilePicture: '',
soloStats: {
nbGames: 0, nbGames: 0,
bestScore: 0, bestScore: 0,
avgNbTry: 0, avgNbTry: 0,
}, },
onlineStats: { {
nbGames: 0, nbGames: 0,
nbWins: 0, nbWins: 0,
ratio: 0, ratio: 0,
}, })
}; setUserData(guestPlayer);
setPlayer(guestPlayer);
} }
} catch (error) { } catch (error) {
console.error(error); console.error(error);
@ -97,10 +96,24 @@ function Play() {
setPersonNetworkData(networkPerson) setPersonNetworkData(networkPerson)
setIndicesData(choosenIndices) setIndicesData(choosenIndices)
setIndicesData(choosenIndices) setIndicesData(choosenIndices)
navigate('/game?solo=true'); navigate('/game?solo=true&daily=false');
} }
function launchEngimeJour(){
const [networkPerson, choosenPerson, choosenIndices] = GameCreator.CreateGame(3, 30)
setPersonData(choosenPerson)
setPersonNetworkData(networkPerson)
setIndicesData(choosenIndices)
setIndicesData(choosenIndices)
if (first){
first = false
const map = EnigmeDuJourCreator.createEnigme(networkPerson, choosenIndices, choosenPerson, Stub.GenerateIndice())
setDailyEnigmeData(map)
}
navigate('/game?solo=true&daily=true');
}
useEffect(() => { useEffect(() => {
const handleLobbyCreated = (newRoom: any) => { const handleLobbyCreated = (newRoom: any) => {
@ -136,7 +149,7 @@ function Play() {
<div className="MidContainer"> <div className="MidContainer">
<div> <div>
<h2> <h2>
{player && player.pseudo} {user && user.pseudo}
</h2> </h2>
<img src={Person} <img src={Person}
height='300' height='300'
@ -146,13 +159,14 @@ function Play() {
</div> </div>
<div className='buttonGroupVertical'> <div className='buttonGroupVertical'>
<button onClick={launchMastermind} className="ButtonNav" style={{backgroundColor: theme.colors.primary, borderColor: theme.colors.secondary}}> Jouer seul </button> <button onClick={launchMastermind} className="ButtonNav" style={{backgroundColor: theme.colors.primary, borderColor: theme.colors.secondary}}> Jouer seul </button>
<button onClick={launchEngimeJour} className="ButtonNav" style={{backgroundColor: theme.colors.primary, borderColor: theme.colors.secondary}}> Jouer seul mais aujourd'hui</button>
<button onClick={createLobby} className="ButtonNav" style={{backgroundColor: theme.colors.primary, borderColor: theme.colors.secondary}}> Créer une partie </button> <button onClick={createLobby} className="ButtonNav" style={{backgroundColor: theme.colors.primary, borderColor: theme.colors.secondary}}> Créer une partie </button>
<button className="ButtonNav" style={{backgroundColor: theme.colors.primary, borderColor: theme.colors.secondary}}> Rejoindre </button> <button className="ButtonNav" style={{backgroundColor: theme.colors.primary, borderColor: theme.colors.secondary}}> Rejoindre </button>
</div> </div>
</div> </div>
<div className='rightContainer'> <div className='rightContainer'>
{player && (<ScoreBoard Player={player}/>)} {user && (<ScoreBoard Player={user}/>)}
</div> </div>
</div> </div>
); );

@ -1,6 +1,6 @@
import { io } from "socket.io-client"; import { io } from "socket.io-client";
const socket = io("http://localhost:3002"); const socket = io("http://172.20.10.4:3002");
export {socket} export {socket}

@ -55,7 +55,7 @@
"color_start": "Le suspect a les cheveux", "color_start": "Le suspect a les cheveux",
"color_end": "", "color_end": "",
"nb_friends_indice_start": "Le suspect", "nb_friends_indice_start": "Le suspect a",
"nb_friends_indice_end": "amis", "nb_friends_indice_end": "amis",
"nb_sports_indice_start": "Le suspect pratique", "nb_sports_indice_start": "Le suspect pratique",

@ -13,8 +13,8 @@ abstract class Bot extends Player{
public actualNetwork: Map<Person, Pair<number, boolean>[]> public actualNetwork: Map<Person, Pair<number, boolean>[]>
constructor( id: string, name: string){ constructor( id: string, name: string, profilePicture: string){
super(id, name); super(id, name, profilePicture);
this.actualNetwork = new Map<Person, Pair<number, boolean>[]>() this.actualNetwork = new Map<Person, Pair<number, boolean>[]>()
this.index = -1 this.index = -1

@ -11,15 +11,16 @@ import Player from "./Player";
class EasyBot extends Bot{ class EasyBot extends Bot{
constructor(id: string, name: string){ constructor(id: string, name: string, profilePicture: string){
super(id, name) super(id, name, profilePicture)
} }
toJson() { toJson() {
return { return {
type: "EasyBot", type: "EasyBot",
id: this.id, id: this.id,
name: this.name, pseudo: this.pseudo,
profilePicture: this.profilePicture
}; };
} }

@ -0,0 +1,74 @@
import IndiceTesterFactory from "./Factory/IndiceTesterFactory";
import Indice from "./Indices/Indice";
import Pair from "./Pair";
import Person from "./Person";
import PersonNetwork from "./PersonsNetwork";
class EnigmeDuJourCreator{
static createEnigme(personNetwork: PersonNetwork, choosenIndices: Indice[], choosenPerson: Person, allIndices: Indice[]): Map<number, Pair<Indice, boolean>[]>{
const map = new Map<number, Pair<Indice, boolean>[]>()
personNetwork.getPersons().forEach((p) =>{
map.set(p.getId(), [])
})
console.log("START ENIGME")
choosenIndices.forEach((choosenIndice) => {
const choosenIndiceTester = IndiceTesterFactory.Create(choosenIndice)
const modifiedPersons: Pair<Person, boolean>[] = []
let possibleIndices: Indice[] = [...allIndices]
let i = 0
while (possibleIndices.length != 1){
let tmpPossibleIndices: Indice[] = [...possibleIndices]
let choosenPair : Pair<Person, boolean> = new Pair(personNetwork.getPersons()[0], true)
for(const person of personNetwork.getPersons().filter((p) => p.getId() !== choosenPerson.getId())){
const veryTmpIndice = [...possibleIndices]
if (!choosenIndiceTester.Works(person)){
possibleIndices.forEach((possibleIndice, index) =>{
const tester = IndiceTesterFactory.Create(possibleIndice)
if (tester.Works(person)){
const t = veryTmpIndice.findIndex((tmpIndice) => tmpIndice.getId() == possibleIndice.getId())
if (t != -1){
veryTmpIndice.splice(t, 1)
}
}
})
if (veryTmpIndice.length<tmpPossibleIndices.length){
tmpPossibleIndices = veryTmpIndice
choosenPair = new Pair(person, false)
}
}
else{
possibleIndices.forEach((possibleIndice, index) =>{
const tester = IndiceTesterFactory.Create(possibleIndice)
if (!tester.Works(person)){
const t = veryTmpIndice.findIndex((tmpIndice) => tmpIndice.getId() == possibleIndice.getId())
if (t != -1){
veryTmpIndice.splice(t, 1)
}
}
})
if (veryTmpIndice.length<tmpPossibleIndices.length){
tmpPossibleIndices = veryTmpIndice
choosenPair = new Pair(person, true)
}
}
}
possibleIndices = [...tmpPossibleIndices]
modifiedPersons.push(choosenPair)
console.log(possibleIndices)
}
console.log("choosenIndice => " + choosenIndice.ToString("fr"))
console.log("possibleIndices => " + possibleIndices[0].ToString("fr"))
modifiedPersons.forEach((pair) =>{
map.get(pair.first.getId())?.push(new Pair(choosenIndice, pair.second))
})
})
return map
}
}
export default EnigmeDuJourCreator

@ -1,18 +0,0 @@
import Player from "./Player";
class Human extends Player{
constructor(id: string, name: string){
super(id, name)
}
toJson() {
return {
type: "Human",
id: this.id,
name: this.name,
};
}
}
export default Human

@ -1,10 +1,13 @@
abstract class Player{ abstract class Player{
public id: string public id: string
public name: string; public pseudo: string;
public profilePicture: string
constructor(id: string, name: string){
constructor(id: string, pseudo: string, profilePicture: string){
this.id=id this.id=id
this.name=name this.pseudo=pseudo
this.profilePicture=profilePicture
} }
abstract toJson(): any abstract toJson(): any

@ -22,20 +22,14 @@ class Stub{
let test = 7 let test = 7
for (let i: Color=0; i<5; i++){ for (let i: Color=0; i<5; i++){
for (let j: Color=0; j<5; j++){ for (let j: Color=i + 1; j<5; j++){
if (j==i){
continue
}
indices.push(new ColorIndice(test, [i, j])) indices.push(new ColorIndice(test, [i, j]))
test++ test++
} }
} }
for (let i: Sport=0; i<5; i++){ for (let i: Sport=0; i<5; i++){
for (let j: Sport=0; j<5; j++){ for (let j: Sport=i + 1; j<5; j++){
if (j==i){
continue
}
indices.push(new SportIndice(test, [i, j])) indices.push(new SportIndice(test, [i, j]))
test++ test++
} }

@ -0,0 +1,25 @@
import Player from "./Player";
class User extends Player{
public soloStats: any
public onlineStats: any
constructor(id: string, name: string, profilePicture: string, soloStats: any, onlineStats: any){
super(id, name, profilePicture)
this.soloStats=soloStats
this.onlineStats=onlineStats
}
toJson() {
return {
type: "User",
id: this.id,
pseudo: this.pseudo,
soloStats: this.soloStats,
onlineStats: this.onlineStats
};
}
}
export default User

@ -22,7 +22,6 @@
"Riley", "Riley",
"Layla", "Layla",
"Stella", "Stella",
"Aurora",
"Natalie", "Natalie",
"Zoe", "Zoe",
"Lucy", "Lucy",
@ -48,7 +47,6 @@
"Bella", "Bella",
"Sadie", "Sadie",
"Hailey", "Hailey",
"Aurora",
"Liam", "Liam",
"Noah", "Noah",
"Oliver", "Oliver",
@ -69,7 +67,6 @@
"Jack", "Jack",
"Jayden", "Jayden",
"Owen", "Owen",
"Noah",
"Ethan", "Ethan",
"Mason", "Mason",
"Logan", "Logan",
@ -93,4 +90,3 @@
"Julian" "Julian"
] ]
} }

@ -71,6 +71,7 @@ class AuthController {
} }
// Stocker l'utilisateur dans la session){ // Stocker l'utilisateur dans la session){
console.log("SESSION")
console.log(req.session); console.log(req.session);
req.session.user = user; req.session.user = user;

@ -12,7 +12,7 @@ const port = 3003;
// Middleware // Middleware
app.use(cors( app.use(cors(
{ {
origin: 'http://localhost:3000', origin: ['http://localhost:3000', "http://172.20.10.4:3000"],
credentials: true credentials: true
} }
)); // Autoriser les requêtes cross-origin )); // Autoriser les requêtes cross-origin

@ -12,7 +12,7 @@ class AuthService{
static async signUp(data: any) { static async signUp(data: any) {
try { try {
const response = await fetch('http://localhost:3003/auth/signup', { const response = await fetch('http://172.20.10.4:3003/auth/signup', {
method: 'POST', method: 'POST',
headers: { headers: {
'Content-Type': 'application/json', 'Content-Type': 'application/json',
@ -36,7 +36,7 @@ class AuthService{
static async signIn(data: any) { static async signIn(data: any) {
try { try {
const response = await fetch('http://localhost:3003/auth/signin', { const response = await fetch('http://172.20.10.4:3003/auth/signin', {
method: 'POST', method: 'POST',
headers: { headers: {
'Content-Type': 'application/json', 'Content-Type': 'application/json',
@ -61,7 +61,7 @@ class AuthService{
static async logout() { static async logout() {
try { try {
const response = await fetch('http://localhost:3003/auth/logout', { const response = await fetch('http://172.20.10.4:3003/auth/logout', {
method: 'DELETE', method: 'DELETE',
headers: { headers: {
'Content-Type': 'application/json', 'Content-Type': 'application/json',

@ -1,7 +1,7 @@
class SessionService { class SessionService {
static async getSession() { static async getSession() {
try { try {
const response = await fetch('http://localhost:3003/session', { const response = await fetch('http://172.20.10.4:3003/session', {
method: 'GET', method: 'GET',
headers: { headers: {
'Content-Type': 'application/json', 'Content-Type': 'application/json',

File diff suppressed because it is too large Load Diff
Loading…
Cancel
Save