Compare commits
3 Commits
Author | SHA1 | Date |
---|---|---|
![]() |
210b6cd0df | 1 year ago |
![]() |
fefa576d54 | 1 year ago |
![]() |
69c18e5233 | 1 year ago |
@ -1,209 +0,0 @@
|
|||||||
const path = require('path');
|
|
||||||
const DatabaseService = require(path.resolve(__dirname, '../services/DatabaseService'));
|
|
||||||
|
|
||||||
const ENIGME_FACILE = "enigme_facile";
|
|
||||||
const ENIGME_MOYEN = "enigme_moyenne";
|
|
||||||
const ENIGME_DIFFICILE = "enigme_difficile";
|
|
||||||
|
|
||||||
class SessionController {
|
|
||||||
// ---------------------------------------------------
|
|
||||||
// ----------------- GET DAILY STATS -----------------
|
|
||||||
// ---------------------------------------------------
|
|
||||||
|
|
||||||
static async getDailyMastermind(req, res){
|
|
||||||
const db = new DatabaseService();
|
|
||||||
|
|
||||||
try{
|
|
||||||
await db.connect();
|
|
||||||
|
|
||||||
const dailyMastermindStats = await db.getDailyMastermindStats();
|
|
||||||
|
|
||||||
res.status(200).json({ tab : dailyMastermindStats });
|
|
||||||
}
|
|
||||||
catch(error){
|
|
||||||
console.error(error);
|
|
||||||
res.status(500).json({ error: 'Erreur lors de la récupération des stats dailyMastermind.' });
|
|
||||||
}
|
|
||||||
finally{
|
|
||||||
await db.disconnect();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
static async getDailyEasyEnigma(req, res){
|
|
||||||
const db = new DatabaseService();
|
|
||||||
|
|
||||||
try{
|
|
||||||
await db.connect();
|
|
||||||
|
|
||||||
const dailyEasyEnigmaStats = await db.getDailyEnigmaStats(ENIGME_FACILE);
|
|
||||||
|
|
||||||
res.status(200).json({ tab : dailyEasyEnigmaStats });
|
|
||||||
}
|
|
||||||
catch(error){
|
|
||||||
console.error(error);
|
|
||||||
res.status(500).json({ error: 'Erreur lors de la récupération des stats dailyEasyEnigma.' });
|
|
||||||
}
|
|
||||||
finally{
|
|
||||||
await db.disconnect();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
static async getDailyMediumEnigma(req, res){
|
|
||||||
const db = new DatabaseService();
|
|
||||||
|
|
||||||
try{
|
|
||||||
await db.connect();
|
|
||||||
|
|
||||||
const dailyMediumEnigmaStats = await db.getDailyEnigmaStats(ENIGME_MOYEN);
|
|
||||||
|
|
||||||
res.status(200).json({ tab : dailyMediumEnigmaStats });
|
|
||||||
}
|
|
||||||
catch(error){
|
|
||||||
console.error(error);
|
|
||||||
res.status(500).json({ error: 'Erreur lors de la récupération des stats dailyMediumEnigma.' });
|
|
||||||
}
|
|
||||||
finally{
|
|
||||||
await db.disconnect();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
static async getDailyHardEnigma(req, res){
|
|
||||||
const db = new DatabaseService();
|
|
||||||
|
|
||||||
try{
|
|
||||||
await db.connect();
|
|
||||||
|
|
||||||
const dailyHardEnigmaStats = await db.getDailyEnigmaStats(ENIGME_DIFFICILE);
|
|
||||||
|
|
||||||
res.status(200).json({ tab : dailyHardEnigmaStats });
|
|
||||||
}
|
|
||||||
catch(error){
|
|
||||||
console.error(error);
|
|
||||||
res.status(500).json({ error: 'Erreur lors de la récupération des stats dailyHardEnigma.' });
|
|
||||||
}
|
|
||||||
finally{
|
|
||||||
await db.disconnect();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
static async getDailyOnline(req, res){
|
|
||||||
const db = new DatabaseService();
|
|
||||||
|
|
||||||
try{
|
|
||||||
await db.connect();
|
|
||||||
|
|
||||||
const dailyOnlineStats = await db.getDailyOnlineStats();
|
|
||||||
|
|
||||||
res.status(200).json({ tab : dailyOnlineStats });
|
|
||||||
}
|
|
||||||
catch(error){
|
|
||||||
console.error(error);
|
|
||||||
res.status(500).json({ error: 'Erreur lors de la récupération des stats dailyOnline' });
|
|
||||||
}
|
|
||||||
finally{
|
|
||||||
await db.disconnect();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// ---------------------------------------------------
|
|
||||||
// ---------------- GET WEEKLY STATS -----------------
|
|
||||||
// ---------------------------------------------------
|
|
||||||
|
|
||||||
static async getWeeklyMastermind(req, res){
|
|
||||||
const db = new DatabaseService();
|
|
||||||
|
|
||||||
try{
|
|
||||||
await db.connect();
|
|
||||||
|
|
||||||
const weeklyMastermindStats = await db.getWeeklyMastermindStats();
|
|
||||||
|
|
||||||
res.status(200).json({ tab : weeklyMastermindStats });
|
|
||||||
}
|
|
||||||
catch(error){
|
|
||||||
console.error(error);
|
|
||||||
res.status(500).json({ error: 'Erreur lors de la récupération des stats weeklyMastermind.' });
|
|
||||||
}
|
|
||||||
finally{
|
|
||||||
await db.disconnect();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
static async getWeeklyEasyEnigma(req, res){
|
|
||||||
const db = new DatabaseService();
|
|
||||||
|
|
||||||
try{
|
|
||||||
await db.connect();
|
|
||||||
|
|
||||||
const weeklyEasyEnigmaStats = await db.getWeeklyEnigmaStats(ENIGME_FACILE);
|
|
||||||
|
|
||||||
res.status(200).json({ tab : weeklyEasyEnigmaStats });
|
|
||||||
}
|
|
||||||
catch(error){
|
|
||||||
console.error(error);
|
|
||||||
res.status(500).json({ error: 'Erreur lors de la récupération des stats weeklyEasyEnigma.' });
|
|
||||||
}
|
|
||||||
finally{
|
|
||||||
await db.disconnect();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
static async getWeeklyMediumEnigma(req, res){
|
|
||||||
const db = new DatabaseService();
|
|
||||||
|
|
||||||
try{
|
|
||||||
await db.connect();
|
|
||||||
|
|
||||||
const weeklyMediumEnigmaStats = await db.getWeeklyEnigmaStats(ENIGME_MOYEN);
|
|
||||||
|
|
||||||
res.status(200).json({ tab : weeklyMediumEnigmaStats });
|
|
||||||
}
|
|
||||||
catch(error){
|
|
||||||
console.error(error);
|
|
||||||
res.status(500).json({ error: 'Erreur lors de la récupération des stats weeklyMediumEnigma.' });
|
|
||||||
}
|
|
||||||
finally{
|
|
||||||
await db.disconnect();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
static async getWeeklyHardEnigma(req, res){
|
|
||||||
const db = new DatabaseService();
|
|
||||||
|
|
||||||
try{
|
|
||||||
await db.connect();
|
|
||||||
|
|
||||||
const weeklyHardEnigmaStats = await db.getWeeklyEnigmaStats(ENIGME_DIFFICILE);
|
|
||||||
|
|
||||||
res.status(200).json({ tab : weeklyHardEnigmaStats });
|
|
||||||
}
|
|
||||||
catch(error){
|
|
||||||
console.error(error);
|
|
||||||
res.status(500).json({ error: 'Erreur lors de la récupération des stats weeklyHardEnigma.' });
|
|
||||||
}
|
|
||||||
finally{
|
|
||||||
await db.disconnect();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
static async getWeeklyOnline(req, res){
|
|
||||||
const db = new DatabaseService();
|
|
||||||
|
|
||||||
try{
|
|
||||||
await db.connect();
|
|
||||||
|
|
||||||
const weeklyOnlineStats = await db.getWeeklyOnlineStats();
|
|
||||||
|
|
||||||
res.status(200).json({ tab : weeklyOnlineStats });
|
|
||||||
}
|
|
||||||
catch(error){
|
|
||||||
console.error(error);
|
|
||||||
res.status(500).json({ error: 'Erreur lors de la récupération des stats weeklyOnline' });
|
|
||||||
}
|
|
||||||
finally{
|
|
||||||
await db.disconnect();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
module.exports = SessionController;
|
|
@ -1,28 +0,0 @@
|
|||||||
/* Ajoutez ces styles dans votre fichier CSS ou utilisez un préprocesseur comme SCSS */
|
|
||||||
.tabsStats {
|
|
||||||
padding: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.stats {
|
|
||||||
background-color: #f0f0f0;
|
|
||||||
padding: 20px;
|
|
||||||
border-radius: 8px;
|
|
||||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Personnalisez davantage selon vos préférences */
|
|
||||||
|
|
||||||
.carousselButton{
|
|
||||||
border:none;
|
|
||||||
background-color:darkgray;
|
|
||||||
color:white;
|
|
||||||
opacity: 60%;
|
|
||||||
width: 50px;
|
|
||||||
height: 70px;
|
|
||||||
font-size: 40px;
|
|
||||||
border-radius: 5px;
|
|
||||||
padding: 5px;
|
|
||||||
margin: 5px;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
@ -1,335 +0,0 @@
|
|||||||
import React, { useEffect, useState } from "react";
|
|
||||||
import { DataSet, Network} from "vis-network/standalone/esm/vis-network";
|
|
||||||
import GraphCreator from "../model/Graph/GraphCreator";
|
|
||||||
import "./GraphContainer.css";
|
|
||||||
import IndiceTesterFactory from "../model/Factory/IndiceTesterFactory";
|
|
||||||
import Person from "../model/Person";
|
|
||||||
import { useNavigate } from "react-router-dom";
|
|
||||||
import { useGame } from "../Contexts/GameContext";
|
|
||||||
import { socket } from "../SocketConfig"
|
|
||||||
import { colorToEmoji, positionToColor, positionToEmoji } from "../ColorHelper";
|
|
||||||
import { ColorToHexa } from "../model/EnumExtender";
|
|
||||||
import Bot from "../model/Bot";
|
|
||||||
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";
|
|
||||||
import { json } from "body-parser";
|
|
||||||
import html2canvas from 'html2canvas';
|
|
||||||
import jsPDF from 'jspdf';
|
|
||||||
import {basePath} from "../AdressSetup"
|
|
||||||
import PersonNetwork from "../model/PersonsNetwork";
|
|
||||||
import { useIntl } from "react-intl";
|
|
||||||
|
|
||||||
interface TutorialGraphProps {
|
|
||||||
setNetwork: (network: Network) => void
|
|
||||||
showLast: boolean
|
|
||||||
setPlayerIndex: (playerIndex: number) => void
|
|
||||||
handleShowTurnBar: (bool: boolean) => void
|
|
||||||
handleTurnBarTextChange: (text: string) => void
|
|
||||||
addToHistory: (text: string) => void
|
|
||||||
setPlayerTouched: (playerIndex: number) => void
|
|
||||||
playerTouched: number
|
|
||||||
tutoStep: number
|
|
||||||
setTutoStep: (step: number) => void
|
|
||||||
setGreyForEveryone: (func: () => void) => void
|
|
||||||
displayModalstep: (step: number) => void;
|
|
||||||
}
|
|
||||||
|
|
||||||
let lastNodes: NodePerson[] = []
|
|
||||||
let firstIndex = true
|
|
||||||
let first = true
|
|
||||||
let touchedPlayer = -1
|
|
||||||
let stepTuto = -1
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
const TutorialGraph: React.FC<TutorialGraphProps> = ({showLast, setNetwork, setPlayerIndex, handleShowTurnBar, handleTurnBarTextChange, addToHistory, setPlayerTouched, playerTouched, tutoStep, setTutoStep, setGreyForEveryone, displayModalstep}) => {
|
|
||||||
let cptTour: number = 0
|
|
||||||
|
|
||||||
//* Gestion du temps :
|
|
||||||
let initMtn = 0
|
|
||||||
|
|
||||||
//* traduction
|
|
||||||
const intl = useIntl();
|
|
||||||
|
|
||||||
const {isLoggedIn, user, manager} = useAuth();
|
|
||||||
const {setIndiceData, setIndicesData, setActualPlayerIndexData, setWinnerData, setPlayersData, setNetworkDataData, setPersonData} = useGame();
|
|
||||||
const params = new URLSearchParams(window.location.search);
|
|
||||||
|
|
||||||
const navigate = useNavigate();
|
|
||||||
const [lastIndex, setLastIndex] = useState(-1)
|
|
||||||
|
|
||||||
if (first){
|
|
||||||
first = false
|
|
||||||
setActualPlayerIndexData(0)
|
|
||||||
handleTurnBarTextChange(intl.formatMessage({ id: 'game.yourTurn' }))
|
|
||||||
handleShowTurnBar(true)
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
useEffect(() =>{
|
|
||||||
touchedPlayer=playerTouched
|
|
||||||
}, [playerTouched])
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
stepTuto = tutoStep
|
|
||||||
if(stepTuto===1){
|
|
||||||
handleShowTurnBar(true)
|
|
||||||
}
|
|
||||||
}, [tutoStep])
|
|
||||||
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
const tab: NodePerson[] = []
|
|
||||||
for(const n of lastNodes.reverse()){
|
|
||||||
|
|
||||||
}
|
|
||||||
lastNodes = tab
|
|
||||||
if (showLast){
|
|
||||||
socket.emit("opacity activated", socket.id)
|
|
||||||
}
|
|
||||||
else{
|
|
||||||
socket.emit("opacity deactivated", socket.id)
|
|
||||||
}
|
|
||||||
|
|
||||||
}, [showLast])
|
|
||||||
|
|
||||||
let playerIndex: number = 0
|
|
||||||
|
|
||||||
if (firstIndex){
|
|
||||||
firstIndex=false
|
|
||||||
setPlayerIndex(playerIndex)
|
|
||||||
}
|
|
||||||
let index = 0
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
|
|
||||||
|
|
||||||
let jsonGraph = require("../tuto/graph.json")
|
|
||||||
let jsonIndice = require("../tuto/indices.json")
|
|
||||||
|
|
||||||
const personNetwork = JSONParser.JSONToNetwork(JSON.stringify(jsonGraph))
|
|
||||||
const indices = JSONParser.JSONToIndices(jsonIndice)
|
|
||||||
|
|
||||||
setIndiceData(indices[0])
|
|
||||||
if (personNetwork == null){
|
|
||||||
return
|
|
||||||
}
|
|
||||||
const graph = GraphCreator.CreateGraph(personNetwork)
|
|
||||||
|
|
||||||
const nodes = new DataSet(graph.nodesPerson);
|
|
||||||
|
|
||||||
setIndicesData(indices)
|
|
||||||
setPersonData(personNetwork.getPersons()[4])
|
|
||||||
|
|
||||||
let n = graph.nodesPerson;
|
|
||||||
let e = graph.edges;
|
|
||||||
const graphState = { n, e };
|
|
||||||
|
|
||||||
// Sauvegarder l'état dans localStorage
|
|
||||||
localStorage.setItem('graphState', JSON.stringify(graphState));
|
|
||||||
|
|
||||||
const container = document.getElementById('graph-container');
|
|
||||||
if (!container) {
|
|
||||||
console.error("Container not found");
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
// Charger les données dans le graph
|
|
||||||
|
|
||||||
// Configuration des options du Graphe
|
|
||||||
const initialOptions = {
|
|
||||||
|
|
||||||
layout: {
|
|
||||||
improvedLayout: true,
|
|
||||||
hierarchical: {
|
|
||||||
enabled: false,
|
|
||||||
direction: 'LR', // LR (Left to Right) ou autre selon votre préférence
|
|
||||||
sortMethod: 'hubsize'
|
|
||||||
},
|
|
||||||
randomSeed: 3
|
|
||||||
},
|
|
||||||
physics: {
|
|
||||||
enabled: true,
|
|
||||||
barnesHut: {
|
|
||||||
gravitationalConstant: -1000,
|
|
||||||
springConstant: 0.001,
|
|
||||||
springLength: 100
|
|
||||||
},
|
|
||||||
solver: "repulsion",
|
|
||||||
repulsion: {
|
|
||||||
nodeDistance: 100 // Put more distance between the nodes.
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const networkData = { nodes: nodes, edges: graph.edges };
|
|
||||||
const network = new Network(container, networkData, initialOptions);
|
|
||||||
network.stabilize();
|
|
||||||
setNetwork(network)
|
|
||||||
|
|
||||||
const myFunctionInsideEffect = () => {
|
|
||||||
if (stepTuto === 3){
|
|
||||||
const tabGrey = [0, 1, 2, 3, 5, 6, 7, 8, 9]
|
|
||||||
for (const i of tabGrey){
|
|
||||||
nodes.update({id: i, color: "#808080"})
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
setGreyForEveryone(() => myFunctionInsideEffect);
|
|
||||||
|
|
||||||
|
|
||||||
network.on("click", async (params) => {
|
|
||||||
|
|
||||||
if(params.nodes.length > 0){
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
network.on("dragging", (params) => {
|
|
||||||
if (params.nodes.length > 0) {
|
|
||||||
// Un nœud a été cliqué
|
|
||||||
initialOptions.physics.enabled = false;
|
|
||||||
network.setOptions(initialOptions);
|
|
||||||
setNetwork(network)
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
network.on("click", async (params) => {
|
|
||||||
if(params.nodes.length > 0){
|
|
||||||
if (stepTuto === 0 && touchedPlayer === 1){
|
|
||||||
const node = nodes.get().find((n: NodePerson) => n.id === params.nodes[0])
|
|
||||||
|
|
||||||
if (node === undefined)return;
|
|
||||||
if (node.id === 7){
|
|
||||||
nodes.update({id: node.id, label: node.label + positionToEmoji(1, true)})
|
|
||||||
handleShowTurnBar(false)
|
|
||||||
setPlayerIndex(1)
|
|
||||||
setPlayerTouched(-1)
|
|
||||||
await delay(500)
|
|
||||||
const node2 = nodes.get().find((n: NodePerson) => n.id === params.nodes[0])
|
|
||||||
if (node2 === undefined)return;
|
|
||||||
nodes.update({id: node.id, label: node2.label + positionToEmoji(2, false)})
|
|
||||||
await delay(500)
|
|
||||||
const node3 = nodes.get().find((n: NodePerson) => n.id === 8)
|
|
||||||
if (node3 === undefined)return;
|
|
||||||
nodes.update({id: node3.id, label: node3.label + positionToEmoji(1, false)})
|
|
||||||
setPlayerIndex(2)
|
|
||||||
await delay(500)
|
|
||||||
const node4 = nodes.get().find((n: NodePerson) => n.id === 0)
|
|
||||||
if (node4 === undefined)return;
|
|
||||||
nodes.update({id: node4.id, label: node4.label + positionToEmoji(1, true)})
|
|
||||||
setPlayerIndex(0)
|
|
||||||
setTutoStep(1)
|
|
||||||
|
|
||||||
displayModalstep(1);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
else if(stepTuto === 1 && touchedPlayer === 2){
|
|
||||||
const node = nodes.get().find((n: NodePerson) => n.id === params.nodes[0])
|
|
||||||
if (node === undefined){
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
if (node.id === 0){
|
|
||||||
nodes.update({id: node.id, label: node.label + positionToEmoji(2, false)})
|
|
||||||
setPlayerTouched(-1)
|
|
||||||
displayModalstep(2);
|
|
||||||
handleTurnBarTextChange(intl.formatMessage({ id: 'game.wrong' }))
|
|
||||||
const tabGrey = [7, 0, 4, 1, 8]
|
|
||||||
for (const id of tabGrey){
|
|
||||||
const node = nodes.get().find((n: NodePerson) => n.id === id)
|
|
||||||
if (node === undefined)return;
|
|
||||||
nodes.update({id: node.id, color: "#808080"})
|
|
||||||
}
|
|
||||||
setTutoStep(2)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
else if(stepTuto === 2){
|
|
||||||
const node = nodes.get().find((n: NodePerson) => n.id === params.nodes[0])
|
|
||||||
if (node === undefined)return;
|
|
||||||
if (node.id === 9){
|
|
||||||
const tabColor = [7, 0, 4, 1, 8]
|
|
||||||
nodes.update({id: node.id, label: node.label + positionToEmoji(0, false)})
|
|
||||||
for(const id of tabColor){
|
|
||||||
const pers = personNetwork.getPersons().find((p: Person) => p.getId() === id)
|
|
||||||
if (pers !== undefined){
|
|
||||||
nodes.update({id: id, color: ColorToHexa(pers.getColor())})
|
|
||||||
}
|
|
||||||
}
|
|
||||||
handleShowTurnBar(false)
|
|
||||||
setPlayerIndex(1)
|
|
||||||
await delay(500)
|
|
||||||
const node2 = nodes.get().find((n: NodePerson) => n.id === 4)
|
|
||||||
if (node2 === undefined)return;
|
|
||||||
nodes.update({id: node2.id, label: node2.label + positionToEmoji(2, true)})
|
|
||||||
setPlayerIndex(2)
|
|
||||||
await delay(500)
|
|
||||||
const node3 = nodes.get().find((n: NodePerson) => n.id === 3)
|
|
||||||
if (node3 === undefined)return;
|
|
||||||
nodes.update({id: node3.id, label: node3.label + positionToEmoji(0, false)})
|
|
||||||
await delay(500)
|
|
||||||
const node4 = nodes.get().find((n: NodePerson) => n.id === 1)
|
|
||||||
if (node4 === undefined)return;
|
|
||||||
nodes.update({id: node4.id, label: node4.label + positionToEmoji(2, false)})
|
|
||||||
setPlayerIndex(0)
|
|
||||||
handleTurnBarTextChange(intl.formatMessage({ id: 'game.yourTurn' }))
|
|
||||||
handleShowTurnBar(true)
|
|
||||||
setTutoStep(3)
|
|
||||||
displayModalstep(3);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
else if(stepTuto === 3 && touchedPlayer === 3){
|
|
||||||
const node = nodes.get().find((n: NodePerson) => n.id === params.nodes[0])
|
|
||||||
if (node === undefined)return;
|
|
||||||
if (node.id === 4){
|
|
||||||
nodes.update({id: node.id, label: node.label + positionToEmoji(0, true)})
|
|
||||||
setPlayerTouched(-1)
|
|
||||||
await delay(500)
|
|
||||||
const node2 = nodes.get().find((n: NodePerson) => n.id === 4)
|
|
||||||
if (node2 === undefined)return;
|
|
||||||
nodes.update({id: node2.id, label: node2.label + positionToEmoji(1, true)})
|
|
||||||
await delay(500)
|
|
||||||
|
|
||||||
for(const person of personNetwork.getPersons()){
|
|
||||||
nodes.update({id: person.getId(), color: ColorToHexa(person.getColor())})
|
|
||||||
}
|
|
||||||
if (user != null){
|
|
||||||
const winner = user;
|
|
||||||
setNetworkDataData(networkData)
|
|
||||||
setActualPlayerIndexData(-1)
|
|
||||||
setLastIndex(-1)
|
|
||||||
setPlayerTouched(-1)
|
|
||||||
setWinnerData(winner)
|
|
||||||
first = true
|
|
||||||
navigate(`${basePath}/endgame`)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
else{
|
|
||||||
setPlayerTouched(-1)
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
|
|
||||||
}, []); // Le tableau vide signifie que cela ne s'exécutera qu'une fois après le premier rendu
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<div id="graph-container"/>
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
|
|
||||||
function delay(ms: number): Promise<void> {
|
|
||||||
return new Promise(resolve => setTimeout(resolve, ms));
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
export default TutorialGraph;
|
|
@ -1,90 +1,124 @@
|
|||||||
/* Styles for the Winner and Indice section */
|
|
||||||
.head {
|
.head{
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
flex-direction: column;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.leaderboard-header {
|
.leaderboard-header{
|
||||||
border: 2px solid;
|
|
||||||
border-color: #0064E0;
|
|
||||||
padding: 20px;
|
|
||||||
text-align: center;
|
|
||||||
border-radius: 0px 0px 10px 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Styles for the Winner's details */
|
|
||||||
.winner-details {
|
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
}
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
.winner-details img {
|
|
||||||
width: 75px;
|
width: fit-content;
|
||||||
height: 75px;
|
|
||||||
border-radius: 50%;
|
border-radius: 0px 0px 30px 30px;
|
||||||
margin-right: 10px;
|
border: solid;
|
||||||
}
|
border-width: 0 5px;
|
||||||
|
|
||||||
/* Styles for the Indice Display */
|
padding: 20px;
|
||||||
.indiceDisplay {
|
}
|
||||||
border: 2px solid whitesmoke;
|
|
||||||
border-radius: 10px;
|
.bottomEnd{
|
||||||
margin: 5px; /* Réduire la marge */
|
|
||||||
padding: 8px; /* Réduire le rembourrage */
|
|
||||||
box-shadow: 3px 3px 3px rgb(246, 246, 246); /* Réduire l'ombre */
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Styles for the Losing Players Container */
|
|
||||||
.losingPlayersContainer {
|
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: wrap;
|
justify-content: space-around;
|
||||||
justify-content: space-evenly;
|
}
|
||||||
margin: 5px;
|
|
||||||
}
|
.winner{
|
||||||
|
|
||||||
/* Styles for individual Player Containers */
|
|
||||||
.playerContainer {
|
|
||||||
display: flex;
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
margin-top: 30px;
|
}
|
||||||
margin-bottom: 30px;
|
|
||||||
border: 1px solid whitesmoke;
|
|
||||||
border-radius: 15px;
|
|
||||||
background-color: white;
|
|
||||||
}
|
|
||||||
|
|
||||||
.soloContainer {
|
.playersContainer {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
flex-direction: column;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
width: 100%; /* Ajoutez cette ligne pour occuper toute la largeur */
|
/* padding-left: "5px"; */
|
||||||
}
|
|
||||||
|
width: 100px;
|
||||||
.solostat{
|
background-color: red;
|
||||||
|
}
|
||||||
|
|
||||||
|
.playerContainer{
|
||||||
|
/* display: flex;
|
||||||
|
align-items: center; */
|
||||||
|
/* flex-direction: column; */
|
||||||
|
|
||||||
|
/* width: 300px; */
|
||||||
|
width: 30%;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
/* margin-bottom: 10px; */
|
||||||
|
|
||||||
border: solid 1px whitesmoke;
|
border: solid 1px whitesmoke;
|
||||||
border-radius: 15px;
|
border-radius: 15px;
|
||||||
|
|
||||||
background-color: white;
|
background-color: white;
|
||||||
padding: 10px;
|
}
|
||||||
margin: 5px;
|
|
||||||
width: fit-content; /* Ajoutez cette ligne pour ajuster la largeur au contenu */
|
|
||||||
}
|
|
||||||
|
|
||||||
.center {
|
.losingPlayersContainer{
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
justify-content: space-evenly;
|
||||||
|
|
||||||
|
margin: 10px 0;
|
||||||
|
|
||||||
|
max-width: 50%;
|
||||||
|
|
||||||
|
overflow-y: scroll;
|
||||||
|
max-height: 200px;
|
||||||
|
/* background-color: yellow; */
|
||||||
|
}
|
||||||
|
|
||||||
|
.indiceDisplay{
|
||||||
|
border: solid 2px whitesmoke;
|
||||||
|
border-radius: 10px;
|
||||||
|
margin: 0 15px 0 15px;
|
||||||
|
padding: 10px;
|
||||||
|
box-shadow: 5px 5px 5px rgb(246, 246, 246);
|
||||||
|
}
|
||||||
|
|
||||||
|
.SoloContainer{
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
align-items: center;
|
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;
|
||||||
|
}
|
||||||
|
|
||||||
/* Styles for the Graph Container */
|
#vis-graph {
|
||||||
#vis-graph {
|
|
||||||
height: 500px;
|
height: 500px;
|
||||||
margin: 5px;
|
margin: 50px;
|
||||||
border: 2px solid #ccc;
|
border: 2px solid #ccc;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -1,754 +0,0 @@
|
|||||||
import React, { useState, useEffect } from 'react';
|
|
||||||
import Switch from "react-switch";
|
|
||||||
import {saveAs} from "file-saver"
|
|
||||||
|
|
||||||
/* Style */
|
|
||||||
import "./InGame.css"
|
|
||||||
import {useTheme} from '../Style/ThemeContext'
|
|
||||||
/* Component */
|
|
||||||
import GraphContainer from '../Components/GraphContainer';
|
|
||||||
import PlayerList from '../Components/PlayerList';
|
|
||||||
import TurnBar from '../Components/TurnBar';
|
|
||||||
|
|
||||||
/* Icon */
|
|
||||||
import Param from "../res/icon/param.png";
|
|
||||||
import Info from "../res/icon/infoGreen.png";
|
|
||||||
import Check from "../res/icon/checkboxGreen.png";
|
|
||||||
import MGlass from "../res/icon/magnifying-glass.png";
|
|
||||||
import Reset from "../res/icon/reset.png";
|
|
||||||
import Oeye from "../res/icon/eye.png";
|
|
||||||
import Ceye from "../res/icon/hidden.png";
|
|
||||||
import ImgBot from "../res/img/bot.png";
|
|
||||||
|
|
||||||
import detective from "../res/img/tuto/tuto-detective.jpg";
|
|
||||||
import ava from "../res/img/tuto/tuto-ava2.png";
|
|
||||||
import indicetxt from "../res/img/tuto/tuto-indiceTxt.png"
|
|
||||||
import rep from "../res/img/tuto/tuto-rep.png";
|
|
||||||
import joueurs from "../res/img/tuto/tuto-joueurs.png";
|
|
||||||
import graph from "../res/img/tuto/tuto-graph.png";
|
|
||||||
|
|
||||||
import step1 from "../res/img/tuto/tuto2-1.png";
|
|
||||||
import step2 from "../res/img/tuto/tuto2-2.png";
|
|
||||||
import step3 from "../res/img/tuto/tuto2-3.png";
|
|
||||||
import step4 from "../res/img/tuto/tuto2-4.png";
|
|
||||||
import step5 from "../res/img/tuto/tuto2-5.png";
|
|
||||||
import step6 from "../res/img/tuto/tuto2-6.png";
|
|
||||||
|
|
||||||
/* nav */
|
|
||||||
import { Link, Navigate, useNavigate, useNavigationType } from 'react-router-dom';
|
|
||||||
|
|
||||||
/* Boostrap */
|
|
||||||
import Offcanvas from 'react-bootstrap/Offcanvas';
|
|
||||||
import Modal from 'react-bootstrap/Modal';
|
|
||||||
import Card from 'react-bootstrap/Card';
|
|
||||||
import Button from 'react-bootstrap/Button';
|
|
||||||
|
|
||||||
/* Model */
|
|
||||||
import Stub from '../model/Stub';
|
|
||||||
import { useGame } from '../Contexts/GameContext';
|
|
||||||
import { socket } from '../SocketConfig';
|
|
||||||
import { Network } from 'vis-network';
|
|
||||||
import {generateLatexCode, generateLatexCodeEnigme} from '../Script/LatexScript';
|
|
||||||
import Pair from '../model/Pair';
|
|
||||||
import Indice from '../model/Indices/Indice';
|
|
||||||
import {basePath} from "../AdressSetup"
|
|
||||||
import TutorialGraph from '../Components/TutorialGraph';
|
|
||||||
import { useAuth } from '../Contexts/AuthContext';
|
|
||||||
import EasyBot from '../model/EasyBot';
|
|
||||||
import { set } from 'lodash';
|
|
||||||
import { FormattedMessage } from 'react-intl';
|
|
||||||
|
|
||||||
|
|
||||||
let cptNavigation = 0
|
|
||||||
|
|
||||||
//@ts-ignore
|
|
||||||
const Tutorial = ({locale, changeLocale}) => {
|
|
||||||
const {personNetwork, person, indices, players, setPlayersData, indice, actualPlayerIndex} = useGame()
|
|
||||||
const {user} = useAuth()
|
|
||||||
|
|
||||||
|
|
||||||
const theme = useTheme();
|
|
||||||
|
|
||||||
const navigate = useNavigate()
|
|
||||||
|
|
||||||
const [greyForEveryone, setGreyForEveryone] = useState<() => void>(() => {});
|
|
||||||
|
|
||||||
const setGreyForEveryoneData = (func: () => void) => {
|
|
||||||
setGreyForEveryone(func)
|
|
||||||
}
|
|
||||||
|
|
||||||
const navigationType = useNavigationType()
|
|
||||||
cptNavigation++
|
|
||||||
if (cptNavigation % 2 == 0){
|
|
||||||
if (navigationType.toString() == "POP"){
|
|
||||||
socket.emit("player quit")
|
|
||||||
navigate(`${basePath}/`)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
//* Historique
|
|
||||||
const [history, setHistory] = useState<string[]>([]);
|
|
||||||
const [showLast, setShowLast] = useState(false)
|
|
||||||
const [askedWrong, setAskedWrong] = useState(false)
|
|
||||||
const [importToPdf, setImportToPdf] = useState(false)
|
|
||||||
const [importToJSON, setImportToJSON] = useState(false)
|
|
||||||
const [tutoStep, setTutoStep] = useState(0)
|
|
||||||
|
|
||||||
const setTutoStepData = (step: number) => {
|
|
||||||
setTutoStep(step)
|
|
||||||
}
|
|
||||||
|
|
||||||
const setImportToJSONData = (imp: boolean) => {
|
|
||||||
setImportToJSON(imp)
|
|
||||||
}
|
|
||||||
|
|
||||||
const setImportToPdfData = (imp: boolean) => {
|
|
||||||
setImportToPdf(imp)
|
|
||||||
}
|
|
||||||
|
|
||||||
// Fonction pour ajouter un élément à l'historique
|
|
||||||
const addToHistory = (message: string) => {
|
|
||||||
setHistory(prevHistory => [...prevHistory, message]);
|
|
||||||
};
|
|
||||||
|
|
||||||
const setShowLastData = () =>{
|
|
||||||
setLastVisible(!showLast);
|
|
||||||
setShowLast(!showLast);
|
|
||||||
}
|
|
||||||
|
|
||||||
const setAskedWrongData = (askedWrong: boolean) => {
|
|
||||||
setAskedWrong(askedWrong)
|
|
||||||
}
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
const historyContainer = document.getElementById('history-container');
|
|
||||||
if (historyContainer) {
|
|
||||||
historyContainer.scrollTop = historyContainer.scrollHeight;
|
|
||||||
}
|
|
||||||
}, [history]);
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
if (user == null){
|
|
||||||
return
|
|
||||||
}
|
|
||||||
setPlayersData([user, new EasyBot("Scooby-Doo", "Scooby-Doo", ImgBot), new EasyBot("Batman", "Batman", ImgBot)])
|
|
||||||
}, [])
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
const [showChoiceBar, setShowChoiceBar] = useState(false);
|
|
||||||
const [showTurnBar, setShowTurnBar] = useState(false);
|
|
||||||
const [turnBarText, setTurnBarText] = useState("");
|
|
||||||
const [playerTouched, setPlayerTouched] = useState(-2)
|
|
||||||
const [playerIndex, setPlayerIndex] = useState(-2)
|
|
||||||
|
|
||||||
|
|
||||||
const [network, setNetwork] = useState<Network | null>(null)
|
|
||||||
const [networkEnigme, setNetworkEnigme] = useState<Map<number, Pair<Indice, boolean>[]> | null>(null)
|
|
||||||
|
|
||||||
const setNetworkData = (network: Network) => {
|
|
||||||
setNetwork(network)
|
|
||||||
}
|
|
||||||
|
|
||||||
const setNetworkEnigmeData = (networkEnigme: Map<number, Pair<Indice, boolean>[]>) => {
|
|
||||||
setNetworkEnigme(networkEnigme)
|
|
||||||
}
|
|
||||||
|
|
||||||
const handleNodeClick = (shouldShowChoiceBar: boolean) => {
|
|
||||||
setShowChoiceBar(shouldShowChoiceBar);
|
|
||||||
};
|
|
||||||
|
|
||||||
const handleSetPlayerTouched = (newPlayerTouched: number) => {
|
|
||||||
setPlayerTouched(newPlayerTouched);
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
const handleShowTurnBar = (shouldShowTurnBar: boolean) => {
|
|
||||||
setShowTurnBar(shouldShowTurnBar);
|
|
||||||
};
|
|
||||||
|
|
||||||
const handleTurnBarTextChange = (newTurnBarText: string) =>{
|
|
||||||
setTurnBarText(newTurnBarText)
|
|
||||||
}
|
|
||||||
|
|
||||||
const setPlayerIndexData = (playerIndex: number) => {
|
|
||||||
setPlayerIndex(playerIndex)
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
const resetGraph = () => {
|
|
||||||
setisLoading(true);
|
|
||||||
socket.emit("reset graph", socket.id)
|
|
||||||
setTimeout(() => {
|
|
||||||
setisLoading(false);
|
|
||||||
}, 2000);
|
|
||||||
}
|
|
||||||
|
|
||||||
/* offcanvas */
|
|
||||||
//? faire une fonction pour close et show en fonction de l'etat du canva ?
|
|
||||||
//? comment faire pour eviter la recopie de tout le code a chaque canvas boostrap ?
|
|
||||||
const [show, setShow] = useState(false);
|
|
||||||
const handleClose = () => setShow(false);
|
|
||||||
const handleShow = () => setShow(true);
|
|
||||||
|
|
||||||
const [showP, setShowP] = useState(false);
|
|
||||||
const handleCloseP = () => setShowP(false);
|
|
||||||
const handleShowP = () => setShowP(true);
|
|
||||||
|
|
||||||
const [showS, setShowS] = useState(false);
|
|
||||||
const handleCloseS = () => setShowS(false);
|
|
||||||
const handleShowS = () => setShowS(true);
|
|
||||||
|
|
||||||
const [cptTour, setcptTour] = useState(0);
|
|
||||||
|
|
||||||
const [LastVisible, setLastVisible] = useState(false);
|
|
||||||
|
|
||||||
const [isLoading, setisLoading] = useState(false);
|
|
||||||
|
|
||||||
|
|
||||||
//@ts-ignore
|
|
||||||
const changecptTour = (newcptTour) => {
|
|
||||||
setcptTour(newcptTour);
|
|
||||||
};
|
|
||||||
|
|
||||||
const handleChange = () => {
|
|
||||||
if (show){
|
|
||||||
handleClose()
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
handleShow()
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const handleChangeS = () => {
|
|
||||||
if (showS){
|
|
||||||
handleCloseS()
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
handleShowS()
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const eye = LastVisible ? Oeye : Ceye; //icon que l'on affiche pour l'oeil : fermé ou ouvert.
|
|
||||||
|
|
||||||
/* Windows open */
|
|
||||||
//@ts-ignore
|
|
||||||
const openInNewTab = (url) => { //! avec url ==> dangereux
|
|
||||||
window.open(url);
|
|
||||||
};
|
|
||||||
|
|
||||||
const [SwitchEnabled, setSwitchEnabled] = useState(false)
|
|
||||||
const allIndices = Stub.GenerateIndice()
|
|
||||||
|
|
||||||
const nbPlayer = players.length;
|
|
||||||
const navdeduc = 'deduc?actualId=' + actualPlayerIndex + '&nbPlayer=' + nbPlayer;
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
//* gestion demo */
|
|
||||||
const [showM, setShowM] = useState(false);
|
|
||||||
const [showTuto2, setShowTuto2] = useState(false);
|
|
||||||
const [showTuto21, setShowTuto21] = useState(false);
|
|
||||||
const [showTuto22, setShowTuto22] = useState(false);
|
|
||||||
const [showTuto3, setShowTuto3] = useState(false);
|
|
||||||
|
|
||||||
const handleCloseM = () => {
|
|
||||||
setShowM(false);
|
|
||||||
handleShowHelp()
|
|
||||||
}
|
|
||||||
const handleShowM = () => setShowM(true);
|
|
||||||
|
|
||||||
const handleCloseHelp = () => {
|
|
||||||
switch(tutoStep){
|
|
||||||
case 0:
|
|
||||||
setShowTuto2(false);
|
|
||||||
break;
|
|
||||||
case 1:
|
|
||||||
setShowTuto21(false);
|
|
||||||
break;
|
|
||||||
case 2:
|
|
||||||
setShowTuto22(false);
|
|
||||||
break;
|
|
||||||
case 3:
|
|
||||||
setShowTuto3(false);
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
const handleShowHelp = () => {
|
|
||||||
switch(tutoStep){
|
|
||||||
case 0:
|
|
||||||
setShowTuto2(true);
|
|
||||||
break;
|
|
||||||
case 1:
|
|
||||||
setShowTuto21(true);
|
|
||||||
break;
|
|
||||||
case 2:
|
|
||||||
setShowTuto22(true);
|
|
||||||
break;
|
|
||||||
case 3:
|
|
||||||
setShowTuto3(true);
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
const handleCloseTuto2 = () => setShowTuto2(false);
|
|
||||||
const handleShowTuto2 = () => setShowTuto2(true);
|
|
||||||
|
|
||||||
const handleCloseTuto21 = () => setShowTuto21(false);
|
|
||||||
const handleShowTuto21 = () => setShowTuto21(true);
|
|
||||||
|
|
||||||
const handleCloseTuto22 = () => setShowTuto22(false);
|
|
||||||
const handleShowTuto22 = () => setShowTuto22(true);
|
|
||||||
|
|
||||||
const handleCloseTuto3 = () => setShowTuto3(false);
|
|
||||||
const handleShowTuto3 = () => setShowTuto3(true);
|
|
||||||
|
|
||||||
|
|
||||||
const [step, setStep] = useState(-1);
|
|
||||||
|
|
||||||
//@ts-ignore
|
|
||||||
const displayModalstep = (step: number) => {
|
|
||||||
//* for step 2
|
|
||||||
setStep(0); // remise a 0 de step
|
|
||||||
switch(step) {
|
|
||||||
case 1:
|
|
||||||
setShowTuto21(true);
|
|
||||||
break;
|
|
||||||
case 2:
|
|
||||||
setShowTuto22(true);
|
|
||||||
break;
|
|
||||||
case 3:
|
|
||||||
setShowTuto3(true);
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
handleShowM();
|
|
||||||
}, [])
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div id="mainDiv">
|
|
||||||
{showTurnBar && <TurnBar text={turnBarText}/>}
|
|
||||||
<div id='graphDiv'>
|
|
||||||
<TutorialGraph tutoStep={tutoStep}
|
|
||||||
setTutoStep={setTutoStepData}
|
|
||||||
handleShowTurnBar={handleShowTurnBar}
|
|
||||||
handleTurnBarTextChange={handleTurnBarTextChange}
|
|
||||||
addToHistory={addToHistory}
|
|
||||||
setPlayerTouched={handleSetPlayerTouched}
|
|
||||||
playerTouched={playerTouched}
|
|
||||||
setNetwork={setNetworkData}
|
|
||||||
showLast={showLast}
|
|
||||||
setPlayerIndex={setPlayerIndexData}
|
|
||||||
setGreyForEveryone={setGreyForEveryoneData}
|
|
||||||
displayModalstep={displayModalstep}/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className='historique' id="history-container">
|
|
||||||
{history.map((item, index) => (
|
|
||||||
<div key={index}>{item}</div>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<div className='menuGame'>
|
|
||||||
{/* <Button variant="primary" onClick={handleShowM}>
|
|
||||||
tuto 1
|
|
||||||
</Button>
|
|
||||||
<Button variant="primary" onClick={handleShowTuto2} disabled={tuto1disable}>
|
|
||||||
tuto 2
|
|
||||||
</Button> */}
|
|
||||||
|
|
||||||
<Button variant="primary" onClick={handleShowHelp}>
|
|
||||||
<FormattedMessage id='aide'/>
|
|
||||||
</Button>
|
|
||||||
<Link to={`${basePath}/info`} target='_blank'>
|
|
||||||
<button className='button'
|
|
||||||
style={{
|
|
||||||
backgroundColor: theme.colors.tertiary,
|
|
||||||
borderColor: theme.colors.secondary
|
|
||||||
}}>
|
|
||||||
<img src={Info} alt="info" height="40"/>
|
|
||||||
</button>
|
|
||||||
</Link>
|
|
||||||
|
|
||||||
<button className='button' onClick={handleChange}
|
|
||||||
style={{
|
|
||||||
backgroundColor: theme.colors.tertiary,
|
|
||||||
borderColor: theme.colors.secondary
|
|
||||||
}}>
|
|
||||||
<img src={MGlass} alt="indice" height="40"/>
|
|
||||||
</button>
|
|
||||||
|
|
||||||
<button className='button' onClick={setShowLastData}
|
|
||||||
style={{
|
|
||||||
backgroundColor: theme.colors.tertiary,
|
|
||||||
borderColor: theme.colors.secondary
|
|
||||||
}}>
|
|
||||||
<img src={ eye } alt="indice" height="40"/>
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<div className='playerlistDiv'>
|
|
||||||
<PlayerList players={players} setPlayerTouched={handleSetPlayerTouched} playerTouched={playerTouched} playerIndex={playerIndex} askedWrong={askedWrong} greyForEveryone={greyForEveryone}/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<Offcanvas show={show}
|
|
||||||
onHide={handleClose}
|
|
||||||
placement='end'
|
|
||||||
scroll={true}
|
|
||||||
backdrop={false}
|
|
||||||
style={{ height: '20%', width: '25%', top: '60vh' }}>
|
|
||||||
<Offcanvas.Header closeButton>
|
|
||||||
<Offcanvas.Title><FormattedMessage id='indice'/></Offcanvas.Title>
|
|
||||||
</Offcanvas.Header>
|
|
||||||
<Offcanvas.Body>
|
|
||||||
{indice?.ToString(locale)}
|
|
||||||
</Offcanvas.Body>
|
|
||||||
</Offcanvas>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<Modal
|
|
||||||
show={showM}
|
|
||||||
onHide={handleCloseM}
|
|
||||||
backdrop="static"
|
|
||||||
keyboard={false}
|
|
||||||
size="lg"
|
|
||||||
style={{ maxHeight: '100vh'}}>
|
|
||||||
<Modal.Header>
|
|
||||||
<Modal.Title><FormattedMessage id='tutorial.title'/></Modal.Title>
|
|
||||||
</Modal.Header>
|
|
||||||
<Modal.Body style={{ display:'flex', justifyContent:'center', alignItems:'center', flexDirection:'column'}}>
|
|
||||||
|
|
||||||
{step === -1 && (
|
|
||||||
<Card style={{ width: '90%', display:'flex', justifyContent:'center', alignItems:'center', flexDirection:'column'}}>
|
|
||||||
<Card.Img variant="top" src={detective} style={{width:'300px', height:'300px'}}/>
|
|
||||||
<Card.Body>
|
|
||||||
<Card.Title> <FormattedMessage id='tuto.title.1'/> </Card.Title>
|
|
||||||
<Card.Text>
|
|
||||||
<FormattedMessage id='tuto.txt.1.1'/> <br/>
|
|
||||||
<FormattedMessage id='tuto.txt.1.2'/> <br/>
|
|
||||||
<FormattedMessage id='tuto.txt.1.3'/> <br/>
|
|
||||||
<FormattedMessage id='tuto.txt.1.4'/> <br/>
|
|
||||||
<FormattedMessage id='tuto.txt.1.5'/> <br/>
|
|
||||||
<i><FormattedMessage id='tuto.txt.1.6'/></i>
|
|
||||||
</Card.Text>
|
|
||||||
</Card.Body>
|
|
||||||
</Card>
|
|
||||||
)}
|
|
||||||
{step === 0 && (
|
|
||||||
<Card style={{ width: '90%', display:'flex', justifyContent:'center', alignItems:'center', flexDirection:'column'}}>
|
|
||||||
<Card.Img variant="top" src={ava} style={{width:'300px', height:'300px'}}/>
|
|
||||||
<Card.Body>
|
|
||||||
<Card.Title> <FormattedMessage id='tuto.title.2'/> </Card.Title>
|
|
||||||
<Card.Text>
|
|
||||||
<FormattedMessage id='tuto.txt.2.1'/>
|
|
||||||
<br />
|
|
||||||
<FormattedMessage id='tuto.txt.2.2' /><b>Ava</b><FormattedMessage id='tuto.txt.2.2.1'/><b>40 <FormattedMessage id='age_indice_end'/></b><FormattedMessage id='tuto.txt.2.2.2'/><b><FormattedMessage id='basketball'/></b><FormattedMessage id='tuto.txt.2.2.3'/><b><FormattedMessage id='tennis'/></b><FormattedMessage id='tuto.txt.2.2.4'/><b><FormattedMessage id='redhead'/></b><FormattedMessage id='tuto.txt.2.2.5'/><b>2 <FormattedMessage id='nb_friends_indice_end'/></b> : Carter <FormattedMessage id='and'/> Liam.
|
|
||||||
</Card.Text>
|
|
||||||
</Card.Body>
|
|
||||||
</Card>
|
|
||||||
)}
|
|
||||||
|
|
||||||
{step === 1 && (
|
|
||||||
<Card style={{ width: '90%', display:'flex', justifyContent:'center', alignItems:'center', flexDirection:'column'}}>
|
|
||||||
<Card.Img variant="top" src={indicetxt} style={{width:'300px', height:'auto'}}/>
|
|
||||||
<Card.Body>
|
|
||||||
<Card.Title><FormattedMessage id='tuto.title.3'/></Card.Title>
|
|
||||||
<Card.Text>
|
|
||||||
<FormattedMessage id='tuto.txt.3.1'/>
|
|
||||||
<br />
|
|
||||||
"<u><FormattedMessage id='tuto.txt.3.2'/></u>".
|
|
||||||
</Card.Text>
|
|
||||||
</Card.Body>
|
|
||||||
</Card>
|
|
||||||
)}
|
|
||||||
|
|
||||||
{step === 3 && (
|
|
||||||
<Card style={{ width: '90%', display:'flex', justifyContent:'center', alignItems:'center', flexDirection:'column'}}>
|
|
||||||
<Card.Img variant="top" src={joueurs} style={{width:'auto', height:'300px'}}/>
|
|
||||||
<Card.Body>
|
|
||||||
<Card.Title><FormattedMessage id='tuto.title.4'/></Card.Title>
|
|
||||||
<Card.Text>
|
|
||||||
<FormattedMessage id='tuto.txt.4.1'/>
|
|
||||||
<br />
|
|
||||||
<FormattedMessage id='tuto.txt.4.2'/>
|
|
||||||
</Card.Text>
|
|
||||||
</Card.Body>
|
|
||||||
</Card>
|
|
||||||
)}
|
|
||||||
|
|
||||||
{step === 4 && (
|
|
||||||
<Card style={{ width: '90%', display:'flex', justifyContent:'center', alignItems:'center', flexDirection:'column'}}>
|
|
||||||
<Card.Img variant="top" src={rep} style={{width:'300px', height:'300px'}}/>
|
|
||||||
<Card.Body>
|
|
||||||
<Card.Title><FormattedMessage id='tuto.title.5'/></Card.Title>
|
|
||||||
<Card.Text>
|
|
||||||
<FormattedMessage id='tuto.txt.5.1'/>
|
|
||||||
<br />
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
<FormattedMessage id='majUn'/> <u><FormattedMessage id='square'/></u> <FormattedMessage id='tuto.txt.5.2'/>.
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<FormattedMessage id='majUn'/> <u><FormattedMessage id='round'/></u> <FormattedMessage id='tuto.txt.5.3'/>.
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
<FormattedMessage id='tuto.txt.5.4'/><br />
|
|
||||||
<FormattedMessage id='tuto.txt.5.5.1'/>(<u><FormattedMessage id='color.green'/></u>) <FormattedMessage id='tuto.txt.5.5.2'/>.
|
|
||||||
<br/><FormattedMessage id='tuto.txt.5.6'/> (<u><FormattedMessage id='color.yellow'/></u>).
|
|
||||||
<br/><FormattedMessage id='tuto.txt.5.7.1'/><u><FormattedMessage id='tuto.txt.5.7.2'/></u>.
|
|
||||||
</Card.Text>
|
|
||||||
</Card.Body>
|
|
||||||
</Card>
|
|
||||||
)}
|
|
||||||
|
|
||||||
{step === 5 && (
|
|
||||||
<Card style={{ width: '90%', display:'flex', justifyContent:'center', alignItems:'center', flexDirection:'column'}}>
|
|
||||||
<Card.Header>
|
|
||||||
<button className='button'
|
|
||||||
style={{
|
|
||||||
backgroundColor: theme.colors.tertiary,
|
|
||||||
borderColor: theme.colors.secondary
|
|
||||||
}}>
|
|
||||||
<img src={Info} alt="info" height="40"/>
|
|
||||||
</button>
|
|
||||||
</Card.Header>
|
|
||||||
<Card.Body>
|
|
||||||
<Card.Title><FormattedMessage id='tuto.title.6'/></Card.Title>
|
|
||||||
<Card.Text>
|
|
||||||
<FormattedMessage id='tuto.txt.6.1.1'/><b><FormattedMessage id='tuto.txt.6.1.2'/></b><FormattedMessage id='tuto.txt.6.1.3'/>
|
|
||||||
</Card.Text>
|
|
||||||
</Card.Body>
|
|
||||||
</Card>
|
|
||||||
)}
|
|
||||||
|
|
||||||
{step === 2 && (
|
|
||||||
<Card style={{ width: '90%', display:'flex', justifyContent:'center', alignItems:'center', flexDirection:'column'}}>
|
|
||||||
<Card.Header>
|
|
||||||
<button className='button'
|
|
||||||
style={{
|
|
||||||
backgroundColor: theme.colors.tertiary,
|
|
||||||
borderColor: theme.colors.secondary
|
|
||||||
}}>
|
|
||||||
<img src={MGlass} alt="info" height="40"/>
|
|
||||||
</button>
|
|
||||||
</Card.Header>
|
|
||||||
<Card.Body>
|
|
||||||
<Card.Title><FormattedMessage id='tuto.title.7'/></Card.Title>
|
|
||||||
<Card.Text>
|
|
||||||
<FormattedMessage id='tuto.txt.7.1'/>
|
|
||||||
</Card.Text>
|
|
||||||
</Card.Body>
|
|
||||||
</Card>
|
|
||||||
)}
|
|
||||||
|
|
||||||
{step === 6 && (
|
|
||||||
<Card style={{ width: '90%', display:'flex', justifyContent:'center', alignItems:'center', flexDirection:'column'}}>
|
|
||||||
<Card.Img variant="top" src={graph} style={{width:'auto', height:'300px'}}/>
|
|
||||||
<Card.Body>
|
|
||||||
<Card.Title><FormattedMessage id='tuto.title.8'/></Card.Title>
|
|
||||||
<Card.Text>
|
|
||||||
<FormattedMessage id='tuto.txt.8.1'/>
|
|
||||||
<br/>
|
|
||||||
<FormattedMessage id='tuto.txt.8.2'/>
|
|
||||||
<br/>
|
|
||||||
<FormattedMessage id='tuto.txt.8.3'/>
|
|
||||||
</Card.Text>
|
|
||||||
</Card.Body>
|
|
||||||
</Card>
|
|
||||||
)}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</Modal.Body>
|
|
||||||
<Modal.Footer style={{display:'flex'}}>
|
|
||||||
<div style={{ width:'100%', display:'flex', justifyContent:'start'}}>
|
|
||||||
<label style={{ color:'gray'}}><FormattedMessage id='step'/> {step+1}/7</label>
|
|
||||||
</div>
|
|
||||||
{ step != -1 && (<Button variant="primary" onClick={() => setStep(step - 1)}><FormattedMessage id='previous'/></Button>)}
|
|
||||||
{ step === 6 ? (<Button variant="primary" onClick={handleCloseM}><FormattedMessage id='continue'/></Button>) :
|
|
||||||
<Button variant="primary" onClick={() => setStep(step + 1)}><FormattedMessage id='next'/></Button>}
|
|
||||||
|
|
||||||
</Modal.Footer>
|
|
||||||
</Modal>
|
|
||||||
|
|
||||||
<Modal
|
|
||||||
show={showTuto2}
|
|
||||||
onHide={handleCloseTuto2}
|
|
||||||
backdrop="static"
|
|
||||||
keyboard={false}
|
|
||||||
size="lg"
|
|
||||||
style={{ maxHeight: '100vh'}}>
|
|
||||||
<Modal.Header>
|
|
||||||
<Modal.Title><FormattedMessage id='tutorial.title'/></Modal.Title>
|
|
||||||
</Modal.Header>
|
|
||||||
<Modal.Body style={{ display:'flex', justifyContent:'center', alignItems:'center', flexDirection:'column'}}>
|
|
||||||
|
|
||||||
<Card style={{ width: '100%', display:'flex', justifyContent:'center', alignItems:'center', flexDirection:'column'}}>
|
|
||||||
<Card.Img variant="top" src={step1} style={{width:'auto', height:'300px'}}/>
|
|
||||||
<Card.Body>
|
|
||||||
<Card.Title><FormattedMessage id='tuto.title.9'/></Card.Title>
|
|
||||||
<Card.Text>
|
|
||||||
<FormattedMessage id='tuto.txt.9.1'/>
|
|
||||||
<br/>
|
|
||||||
<FormattedMessage id='tuto.txt.9.2.1'/><b>Scooby-Doo</b><FormattedMessage id='tuto.txt.9.2.2'/><b>Violet</b><FormattedMessage id='tuto.txt.9.2.3'/>
|
|
||||||
</Card.Text>
|
|
||||||
</Card.Body>
|
|
||||||
</Card>
|
|
||||||
|
|
||||||
</Modal.Body>
|
|
||||||
<Modal.Footer style={{display:'flex'}}>
|
|
||||||
<Button variant="primary" onClick={handleCloseTuto2}><FormattedMessage id='compris'/></Button>
|
|
||||||
</Modal.Footer>
|
|
||||||
</Modal>
|
|
||||||
|
|
||||||
<Modal
|
|
||||||
show={showTuto21}
|
|
||||||
onHide={handleCloseTuto21}
|
|
||||||
backdrop="static"
|
|
||||||
keyboard={false}
|
|
||||||
size="lg"
|
|
||||||
style={{ maxHeight: '100vh'}}>
|
|
||||||
<Modal.Header>
|
|
||||||
<Modal.Title><FormattedMessage id='tutorial.title'/></Modal.Title>
|
|
||||||
</Modal.Header>
|
|
||||||
<Modal.Body style={{ display:'flex', justifyContent:'center', alignItems:'center', flexDirection:'column'}}>
|
|
||||||
{step === 0 && (
|
|
||||||
<Card style={{ width: '100%', display:'flex', justifyContent:'center', alignItems:'center', flexDirection:'column'}}>
|
|
||||||
<Card.Img variant="top" src={step2} style={{width:'300px', height:'auto'}}/>
|
|
||||||
<Card.Body>
|
|
||||||
<Card.Title><FormattedMessage id='tuto.title.10'/></Card.Title>
|
|
||||||
<Card.Text>
|
|
||||||
<FormattedMessage id='tuto.txt.10.1.1'/> <u><FormattedMessage id='tuto.txt.10.1.2'/></u><FormattedMessage id='tuto.txt.10.1.3'/><i><FormattedMessage id='tuto.txt.10.1.4'/></i><FormattedMessage id='tuto.txt.10.1.5'/>
|
|
||||||
<br/>
|
|
||||||
<FormattedMessage id='tuto.txt.10.2'/>
|
|
||||||
</Card.Text>
|
|
||||||
</Card.Body>
|
|
||||||
</Card>
|
|
||||||
)}
|
|
||||||
|
|
||||||
{step === 1 && (
|
|
||||||
<Card style={{ width: '100%', display:'flex', justifyContent:'center', alignItems:'center', flexDirection:'column'}}>
|
|
||||||
<Card.Img variant="top" src={step3} style={{width:'200px', height:'auto'}}/>
|
|
||||||
<Card.Body>
|
|
||||||
<Card.Title><FormattedMessage id='tuto.title.11'/></Card.Title>
|
|
||||||
<Card.Text>
|
|
||||||
<FormattedMessage id='tuto.txt.11.1.1'/><b><FormattedMessage id='non'/></b><FormattedMessage id='tuto.txt.11.1.2'/>
|
|
||||||
<br/>
|
|
||||||
<FormattedMessage id='tuto.txt.11.2.1'/><b><FormattedMessage id='tuto.txt.11.2.2'/></b><FormattedMessage id='tuto.txt.11.2.3'/>
|
|
||||||
<br/>
|
|
||||||
<FormattedMessage id='tuto.txt.11.3'/>
|
|
||||||
</Card.Text>
|
|
||||||
</Card.Body>
|
|
||||||
</Card>
|
|
||||||
)}
|
|
||||||
|
|
||||||
{step === 2 && (
|
|
||||||
<Card style={{ width: '100%', display:'flex', justifyContent:'center', alignItems:'center', flexDirection:'column'}}>
|
|
||||||
<Card.Img variant="top" src={step4} style={{width:'300px', height:'auto'}}/>
|
|
||||||
<Card.Body>
|
|
||||||
<Card.Title><FormattedMessage id='tuto.title.12'/></Card.Title>
|
|
||||||
<Card.Text>
|
|
||||||
<FormattedMessage id='tuto.txt.12.1.1'/><u><FormattedMessage id='tuto.txt.12.1.2'/></u><FormattedMessage id='tuto.txt.12.1.3'/>
|
|
||||||
<br/>
|
|
||||||
<FormattedMessage id='tuto.txt.12.2'/>
|
|
||||||
</Card.Text>
|
|
||||||
</Card.Body>
|
|
||||||
</Card>
|
|
||||||
)}
|
|
||||||
|
|
||||||
|
|
||||||
</Modal.Body>
|
|
||||||
<Modal.Footer style={{display:'flex'}}>
|
|
||||||
<div style={{ width:'100%', display:'flex', justifyContent:'start'}}>
|
|
||||||
<label style={{ color:'gray'}}><FormattedMessage id='step'/> {step+1}/3</label>
|
|
||||||
</div>
|
|
||||||
{ step != 0 && (<Button variant="primary" onClick={() => setStep(step - 1)}><FormattedMessage id='previous'/></Button>)}
|
|
||||||
{ step === 2 ? (<Button variant="primary" onClick={handleCloseTuto21}><FormattedMessage id='close'/></Button>) :
|
|
||||||
<Button variant="primary" onClick={() => setStep(step + 1)}><FormattedMessage id='next'/></Button>}
|
|
||||||
</Modal.Footer>
|
|
||||||
</Modal>
|
|
||||||
|
|
||||||
<Modal
|
|
||||||
show={showTuto22}
|
|
||||||
onHide={handleCloseTuto22}
|
|
||||||
backdrop="static"
|
|
||||||
keyboard={false}
|
|
||||||
size="lg"
|
|
||||||
style={{ maxHeight: '100vh'}}>
|
|
||||||
<Modal.Header>
|
|
||||||
<Modal.Title><FormattedMessage id='tutorial.title'/></Modal.Title>
|
|
||||||
</Modal.Header>
|
|
||||||
<Modal.Body style={{ display:'flex', justifyContent:'center', alignItems:'center', flexDirection:'column'}}>
|
|
||||||
|
|
||||||
<Card style={{ width: '100%', display:'flex', justifyContent:'center', alignItems:'center', flexDirection:'column'}}>
|
|
||||||
<Card.Img variant="top" src={step5} style={{width:'300px', height:'auto'}}/>
|
|
||||||
<Card.Body>
|
|
||||||
<Card.Title><FormattedMessage id='tuto.title.13'/></Card.Title>
|
|
||||||
<Card.Text>
|
|
||||||
<FormattedMessage id='tuto.txt.13.1.1'/><b><FormattedMessage id='tuto.txt.13.1.2'/></b><FormattedMessage id='tuto.txt.13.1.3'/>
|
|
||||||
<br/>
|
|
||||||
<FormattedMessage id='tuto.txt.13.2.1'/><u><FormattedMessage id='tuto.txt.13.2.2'/></u><FormattedMessage id='tuto.txt.13.2.3'/>
|
|
||||||
<br/>
|
|
||||||
<FormattedMessage id='tuto.txt.13.3.1'/><b>Liam</b> <FormattedMessage id='tuto.txt.13.3.2'/>
|
|
||||||
</Card.Text>
|
|
||||||
</Card.Body>
|
|
||||||
</Card>
|
|
||||||
</Modal.Body>
|
|
||||||
<Modal.Footer style={{display:'flex'}}>
|
|
||||||
<Button variant="primary" onClick={handleCloseTuto22}><FormattedMessage id='compris'/></Button>
|
|
||||||
</Modal.Footer>
|
|
||||||
</Modal>
|
|
||||||
|
|
||||||
<Modal
|
|
||||||
show={showTuto3}
|
|
||||||
onHide={handleCloseTuto3}
|
|
||||||
backdrop="static"
|
|
||||||
keyboard={false}
|
|
||||||
size="lg"
|
|
||||||
style={{ maxHeight: '100vh'}}>
|
|
||||||
<Modal.Header>
|
|
||||||
<Modal.Title>The End Game</Modal.Title>
|
|
||||||
</Modal.Header>
|
|
||||||
<Modal.Body style={{ display:'flex', justifyContent:'center', alignItems:'center', flexDirection:'column'}}>
|
|
||||||
<Card style={{ width: '100%', display:'flex', justifyContent:'center', alignItems:'center', flexDirection:'column'}}>
|
|
||||||
<Card.Img variant="top" src={step6} style={{width:'250px', height:'auto'}}/>
|
|
||||||
<Card.Body>
|
|
||||||
<Card.Title><FormattedMessage id='tuto.title.14'/></Card.Title>
|
|
||||||
<Card.Text>
|
|
||||||
<FormattedMessage id='tuto.txt.14.1'/>
|
|
||||||
<br/>
|
|
||||||
<FormattedMessage id='tuto.txt.14.2'/>
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
<FormattedMessage id='tuto.txt.14.3'/><i>{indices[1]?.ToString(locale)}</i>.
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<FormattedMessage id='tuto.txt.14.4'/><i>{indices[2]?.ToString(locale)}</i>.
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<FormattedMessage id='tuto.txt.14.5'/><i>{indices[0]?.ToString(locale)}</i>.
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
<FormattedMessage id='tuto.txt.14.6.1'/><b><FormattedMessage id='tuto.txt.14.6.2'/></b><FormattedMessage id='tuto.txt.14.6.3'/><b><FormattedMessage id='tuto.txt.14.6.4'/></b><FormattedMessage id='tuto.txt.14.6.5'/>
|
|
||||||
</Card.Text>
|
|
||||||
</Card.Body>
|
|
||||||
</Card>
|
|
||||||
</Modal.Body>
|
|
||||||
<Modal.Footer style={{display:'flex'}}>
|
|
||||||
<Button variant="primary" onClick={handleCloseTuto3}><FormattedMessage id='compris'/></Button>
|
|
||||||
</Modal.Footer>
|
|
||||||
</Modal>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
export default Tutorial;
|
|
@ -1,163 +0,0 @@
|
|||||||
{
|
|
||||||
"languageSelector.french": "Francés",
|
|
||||||
"languageSelector.english": "Inglés",
|
|
||||||
"languageSelector.espagnol": "Español",
|
|
||||||
"languageSelector.portuguese": "Portugués",
|
|
||||||
"languageSelector.russian": "Ruso",
|
|
||||||
|
|
||||||
"home.histoire.title": "HISTORIA",
|
|
||||||
"home.histoire": "La criptozoología estudia las huellas de monstruos legendarios: criptidos. Yetis, Chupacabra, bestia de Gévaudan, Dahut, etc. son temas muy serios para ti... Cruza las pistas y sé el primero en descubrirlos.",
|
|
||||||
|
|
||||||
"home.jeu.title": "EL JUEGO",
|
|
||||||
"home.jeu": "Cada jugador tiene una pista en el campo donde se encuentra la criatura. Cruzando tu información, solo puede haber una casilla. Pero el objetivo es ser el primero en encontrarla. Pregunta a tus colegas y, sin embargo, competidores. Solo pueden responderte con un 'no' o un 'quizás', con mucha lógica y un poco de audacia, ¡puedes entrar en la leyenda!",
|
|
||||||
|
|
||||||
"home.plus.title": "FORTALEZAS",
|
|
||||||
"home.plus.1": "Un mecanismo de deducción asombroso.",
|
|
||||||
"home.plus.2": "Una inmensa rejugabilidad.",
|
|
||||||
"home.plus.3": "Un tema sorprendente y fuerte.",
|
|
||||||
|
|
||||||
"game.time": "Tiempo: 45 minutos",
|
|
||||||
"game.players": "Jugadores: de 3 a 5 jugadores",
|
|
||||||
"game.age": "Edad: 10 años en adelante",
|
|
||||||
"game.createdBy": "Creado por:",
|
|
||||||
"game.illustratedBy": "Ilustrado por:",
|
|
||||||
|
|
||||||
"log_in": "Iniciar sesión",
|
|
||||||
"sign_up": "Registrarse",
|
|
||||||
"log_out": "Cerrar sesión",
|
|
||||||
|
|
||||||
"join": "Unirse",
|
|
||||||
"create_room": "Crear sala",
|
|
||||||
"play_solo": "Jugador individual",
|
|
||||||
|
|
||||||
"play": "JUGAR",
|
|
||||||
|
|
||||||
"football": "Fútbol",
|
|
||||||
"basketball": "Baloncesto",
|
|
||||||
"baseball": "Béisbol",
|
|
||||||
"tennis": "Tenis",
|
|
||||||
"bowling": "Bolos",
|
|
||||||
|
|
||||||
"white": "Blanco",
|
|
||||||
"black": "Negro",
|
|
||||||
"blond": "Rubio",
|
|
||||||
"redhead": "Pelirrojo",
|
|
||||||
"brown": "Marrón",
|
|
||||||
|
|
||||||
"and": "y",
|
|
||||||
"or": "o",
|
|
||||||
"or_sport": "o",
|
|
||||||
|
|
||||||
"age_indice_start": "El sospechoso tiene entre",
|
|
||||||
"age_indice_more_start": "El sospechoso tiene al menos",
|
|
||||||
"age_indice_end": "años",
|
|
||||||
|
|
||||||
"color_edges_start": "El sospechoso tiene al menos un amigo con cabello",
|
|
||||||
"color_edges_end": "",
|
|
||||||
|
|
||||||
"color_start": "El sospechoso tiene cabello",
|
|
||||||
"color_end": "",
|
|
||||||
|
|
||||||
"nb_friends_indice_start": "El sospechoso tiene",
|
|
||||||
"nb_friends_indice_end": "amigos",
|
|
||||||
|
|
||||||
"nb_sports_indice_start": "El sospechoso juega",
|
|
||||||
"nb_sports_indice_end": "deporte(s)",
|
|
||||||
|
|
||||||
"sport_start": "El sospechoso juega al menos",
|
|
||||||
"sport_end": "",
|
|
||||||
|
|
||||||
"navbar.play" : "Jugar",
|
|
||||||
"navbar.presentation":"Presentación",
|
|
||||||
"navbar.info":"Información",
|
|
||||||
|
|
||||||
"round":"Vuelta",
|
|
||||||
|
|
||||||
"informations": "Información",
|
|
||||||
"info.intro.title": "Introducción al juego:",
|
|
||||||
"info.intro.text": "¡Bienvenido a nuestro emocionante juego de deducción, donde la intriga y la travesura se combinan en una emocionante aventura! Sumérgete en un mundo de misterio e intriga, donde cada interacción cuenta y cada pista te acerca a la verdad. Imagina un gráfico complejo donde cada vértice representa a una persona, cada eje una relación, y cada detalle cuenta. Te sumerges en un desafiante reto para descubrir quién entre estas personas es el misterioso asesino. Cada jugador tiene una pista crucial y solo el intercambio estratégico de estas pistas te llevará a resolver el misterio. Explora nuestra página de reglas para entender las complejidades del juego, descubre pistas que pueden guiarte y desarrolla estrategias inteligentes para identificar al culpable. ¡Manipula a tus amigos para ser el primero en descubrir quién es el asesino oculto en el gráfico! ¿Estás listo para aceptar el desafío y desenmascarar al asesino oculto en el gráfico? ¡Que comience la investigación!",
|
|
||||||
|
|
||||||
"info.sommaire": "Contenidos",
|
|
||||||
|
|
||||||
"info.title.composant": "Componentes del juego",
|
|
||||||
"info.title.objectif": "Objetivo del juego",
|
|
||||||
"info.title.deroulement": "Desarrollo del juego",
|
|
||||||
"info.title.indice_possible": "Posible pista del juego",
|
|
||||||
|
|
||||||
"info.pions": "Peones",
|
|
||||||
"info.composant.text": "A cada jugador se le asignará un color específico que distinguirá las acciones representadas por los peones de la siguiente manera:",
|
|
||||||
|
|
||||||
"info.composant.carre.title": "Fichas cuadradas",
|
|
||||||
"info.composant.carre": "Estas fichas indican una negación. Cuando un jugador coloca una ficha cuadrada, significa que su pista elimina a la persona designada.",
|
|
||||||
|
|
||||||
"info.composant.rond.title": "Fichas redondas",
|
|
||||||
"info.composant.rond": "Estas fichas representan un 'quizás'. El jugador que deposita esta ficha afirma que la persona es sospechosa, pero esto no garantiza su culpabilidad. ¡Solo hay un sospechoso que lleva una ficha redonda para todos los jugadores en el juego, y ese es el culpable!",
|
|
||||||
|
|
||||||
"info.car_perso": "Características",
|
|
||||||
"info.composant.textcar": "Además de sus nombres, los personajes están representados con otras características:",
|
|
||||||
|
|
||||||
"info.composant.age.title": "Edades",
|
|
||||||
"info.composant.age": "Cada persona tiene una edad para autenticarlos, que varía entre 0 y 60 años. La edad es una característica que se confirmará con pistas en forma de ",
|
|
||||||
"info.composant.age.link": "grupos de edad",
|
|
||||||
|
|
||||||
"info.composant.hair_col.title": "Colores de cabello",
|
|
||||||
"info.composant.hair_col": "Los personajes también tienen un color de cabello, que puede ser de los siguientes colores:",
|
|
||||||
|
|
||||||
"hair.blanc": "Blanco",
|
|
||||||
"hair.blond": "Rubio",
|
|
||||||
"hair.roux": "Pelirrojo",
|
|
||||||
"hair.chatain": "Marrón",
|
|
||||||
"hair.noir": "Negro",
|
|
||||||
|
|
||||||
"info.composant.sport.title": "Deportes",
|
|
||||||
"info.composant.sport": "Los hobbies de los personajes están representados por cinco deportes respectivamente:",
|
|
||||||
"info.composant.baseball": "Béisbol",
|
|
||||||
"info.composant.basketball": "Baloncesto",
|
|
||||||
"info.composant.bowling": "Bowling",
|
|
||||||
"info.composant.football": "Fútbol",
|
|
||||||
"info.composant.tennis": "Tenis",
|
|
||||||
"info.composant.sport.bis": "Entre estos deportes, cada personaje puede tener entre 0 y 3 deportes, lo que facilita su identificación utilizando las pistas que tienes.",
|
|
||||||
|
|
||||||
"info.objectif.intro": "Bienvenido al ingenioso universo de nuestro juego de deducción, donde el engaño y la astucia son las claves del éxito. Tu misión es desentrañar el misterio detrás de cada interacción del complejo gráfico que representa las relaciones entre individuos.",
|
|
||||||
"info.objectif.t1": "Manipulación Sutil",
|
|
||||||
"info.objectif.t1.text": "El objetivo final es descubrir quién entre los individuos es el asesino, pero no a través de una colaboración abierta. Por el contrario, utilizarás una manipulación sutil para difuminar las líneas y distraer a tus oponentes. Haz preguntas estratégicas, responde con malicia y siembra pistas engañosas para acercarte al resultado.",
|
|
||||||
"info.objectif.t2": "Trucos",
|
|
||||||
"info.objectif.t2.text": "Cada ronda ofrece la oportunidad de sembrar dudas entre tus oponentes. Cuando un jugador te hace preguntas, responde colocando inteligentemente un token cuadrado para indicar que 'según tu pista, esa persona no puede ser el culpable' o un token redondo para sugerir que permanezcan en la lista de sospechosos. Ten cuidado, porque cada gesto puede interpretarse, y la verdad a menudo está oculta detrás de una fachada de pistas engañosas.",
|
|
||||||
"info.objectif.t3": "Contramanipulación",
|
|
||||||
"info.objectif.t3.text": "Si un jugador coloca un token cuadrado, el que hace la pregunta también debe jugar su juego colocando un token cuadrado de su color en un nodo del gráfico. La contramanipulación se convierte en un arma formidable para desviar la acusación y sembrar la confusión.",
|
|
||||||
|
|
||||||
"info.interface": "Interfaz de juego",
|
|
||||||
"info.interface.text": "Para cada juego, tendrás disponibles ciertos elementos de interfaz:",
|
|
||||||
"info.interface.param": "El botón 'Configuración' permite mostrar y gestionar varias configuraciones del juego, como activar o desactivar efectos de sonido. También es posible elegir el número de nodos para el modo de juego 'Enigma' con este botón.",
|
|
||||||
"info.interface.reset": "El botón 'Restablecer' restablece el estado actual del gráfico. Si lo has movido demasiado o quieres que su visualización sea más ordenada, ¡este botón es para ti!",
|
|
||||||
"info.interface.info": "El botón 'Información' redirige a la página de reglas del juego (esta).",
|
|
||||||
"info.interface.fiche": "El botón 'Hoja de Deducción de Pistas' muestra una tabla que, junto con el progreso del juego, permite deducir qué pistas son más probables para cada jugador.",
|
|
||||||
"info.interface.indice": "El botón 'Pista Personal' es el más importante; muestra tu pista secreta. ¡Solo tú lo sabes! Tendrás que ser astuto para engañar a tus amigos y mantenerlo en secreto el mayor tiempo posible!",
|
|
||||||
"info.interface.vision": "El botón 'Visión de los Últimos Movimientos' permite al usuario visualizar los últimos 5 movimientos realizados. Actúa como una herramienta visual.",
|
|
||||||
|
|
||||||
"etape": "Paso",
|
|
||||||
"info.deroulement.e1": "Hacer preguntas estratégicas",
|
|
||||||
"info.deroulement.e1.text": "Cada ronda comienza con un jugador haciendo preguntas a otro jugador sobre una persona en el gráfico. Las respuestas se formulan colocando fichas cuadradas o redondas para indicar certeza o duda sobre la participación de esa persona.",
|
|
||||||
"info.deroulement.e2": "Contramanipulación y Contra-pregunta",
|
|
||||||
"info.deroulement.e2.text": "Si un jugador coloca una ficha cuadrada, el que hace la pregunta también debe colocar una ficha cuadrada en un nodo del gráfico. Las contra-preguntas son una forma de confundir a los jugadores y desviar la acusación.",
|
|
||||||
"info.deroulement.e3": "La Adivinanza Final",
|
|
||||||
"info.deroulement.e3.text": "El juego alcanza su clímax cuando un jugador intenta la 'Adivinanza' final, afirmando que tal persona es el asesino. Otros jugadores",
|
|
||||||
|
|
||||||
"info.indice-possible.age": "Edad de la persona",
|
|
||||||
"info.indice-possible.hair": "Color de pelo de una persona",
|
|
||||||
"info.indice-possible.sport": "Deporte(s) de una persona",
|
|
||||||
"info.indice-possible.voisin": "Personaje de los vecinos",
|
|
||||||
|
|
||||||
"info.mdj": "Modos de juego",
|
|
||||||
"info.mdj.text": "Existen varios modos de juego que te permiten agregar variedad y hacer el juego más o menos complejo.",
|
|
||||||
"info.mdj.mastermind": "Mastermind",
|
|
||||||
"info.mdj.mastermind.text": "El modo de juego 'Mastermind' es un modo para un solo jugador donde debes ser capaz de adivinar al culpable utilizando el menor número de suposiciones. En este modo, no tendrás ninguna pista, pero deberás adivinarlas durante el juego. Seleccionar a un sospechoso revela el estado de todas las pistas para ese sospechoso. ¡Se vuelve posible adivinar las pistas y luego identificar al culpable!",
|
|
||||||
"info.mdj.enigme": "Enigma",
|
|
||||||
"info.mdj.enigme.text": "Este es un modo para un solo jugador con tres niveles de dificultad:",
|
|
||||||
"info.mdj.enigme.easy": "Enigma Fácil",
|
|
||||||
"info.mdj.enigme.easy.txt": "En este modo de juego, tienes acceso a todas las pistas y debes adivinar al culpable que coincide con todas estas pistas. Puedes practicar adivinando al culpable en este modo.",
|
|
||||||
"info.mdj.enigme.medium": "Enigma Intermedio",
|
|
||||||
"info.mdj.enigme.medium.txt": "En este modo de juego, no tienes acceso a pistas, pero tienes información suficiente sobre algunos sospechosos para poder adivinar al culpable. Esta información te ayudará a adivinar las pistas, y el culpable es el sospechoso para el cual todas las pistas coinciden. Si seleccionas al sospechoso equivocado, ¡no te preocupes! Tendrás información sobre ese sospechoso, lo que facilitará encontrar al culpable. El objetivo es encontrar al culpable en el menor número de suposiciones.",
|
|
||||||
"info.mdj.enigme.hard": "Enigma Difícil",
|
|
||||||
"info.mdj.enigme.hard.txt": "Esta variante final es similar al enigma intermedio; sin embargo, ¡debes encontrar al culpable en el primer intento, o pierdes! ¡Depende de ti jugar! El objetivo es encontrar al culpable en el menor tiempo posible."
|
|
||||||
}
|
|
@ -1,167 +0,0 @@
|
|||||||
{
|
|
||||||
"languageSelector.french": "Francês",
|
|
||||||
"languageSelector.english": "Inglês",
|
|
||||||
"languageSelector.espagnol": "Espanhol",
|
|
||||||
"languageSelector.portuguese": "Português",
|
|
||||||
"languageSelector.russian": "Russo",
|
|
||||||
|
|
||||||
"home.histoire.title": "HISTÓRIA",
|
|
||||||
"home.histoire": "A criptozoologia estuda as pegadas de monstros lendários: criptídeos. Yetis, Chupacabra, a besta de Gévaudan, Dahut, etc., são tópicos muito sérios para você... Cruze as pistas e seja o primeiro a descobri-los!",
|
|
||||||
|
|
||||||
"home.jeu.title": "O JOGO",
|
|
||||||
"home.jeu": "Cada jogador tem uma pista no campo onde a criatura está localizada. Ao cruzar suas informações, só pode haver uma caixa. Mas o objetivo é ser o primeiro a encontrá-la. Pergunte aos seus colegas, e ainda assim aos concorrentes. Eles só podem responder com 'não' ou 'talvez', com muita lógica e um pouco de audácia, você pode entrar na lenda!",
|
|
||||||
|
|
||||||
"home.plus.title": "FORÇA",
|
|
||||||
"home.plus.1": "Um mecanismo de dedução incrível.",
|
|
||||||
"home.plus.2": "Uma imensa rejogabilidade.",
|
|
||||||
"home.plus.3": "Um tema surpreendente e forte.",
|
|
||||||
|
|
||||||
"game.time": "Tempo: 45 minutos",
|
|
||||||
"game.players": "Jogadores: 3 a 5 jogadores",
|
|
||||||
"game.age": "Idade: 10 anos ou mais",
|
|
||||||
"game.createdBy": "Criado por:",
|
|
||||||
"game.illustratedBy": "Ilustrado por:",
|
|
||||||
|
|
||||||
"log_in":" Entrar ",
|
|
||||||
"sign_up":" Inscrever-se ",
|
|
||||||
"log_out":" Sair ",
|
|
||||||
|
|
||||||
"join" : "Participar",
|
|
||||||
"create_room" : "Criar sala",
|
|
||||||
"play_solo" : "Jogador único",
|
|
||||||
|
|
||||||
"play" : "JOGAR",
|
|
||||||
|
|
||||||
"football": "Futebol",
|
|
||||||
"basketball": "Basquete",
|
|
||||||
"baseball": "Beisebol",
|
|
||||||
"tennis": "Tênis",
|
|
||||||
"bowling": "Boliche",
|
|
||||||
|
|
||||||
"white": "Branco",
|
|
||||||
"black": "Preto",
|
|
||||||
"blond": "Loiro",
|
|
||||||
"redhead": "Ruivo",
|
|
||||||
"brown": "Castanho",
|
|
||||||
|
|
||||||
"and": "e",
|
|
||||||
"or": "ou",
|
|
||||||
"or_sport": "ou",
|
|
||||||
|
|
||||||
|
|
||||||
"age_indice_start": "O suspeito tem entre",
|
|
||||||
"age_indice_more_start": "O suspeito tem pelo menos",
|
|
||||||
"age_indice_end": "anos",
|
|
||||||
|
|
||||||
"color_edges_start": "O suspeito tem pelo menos um amigo com",
|
|
||||||
"color_edges_end": "cabelo",
|
|
||||||
|
|
||||||
"color_start": "O suspeito tem",
|
|
||||||
"color_end": "cabelo",
|
|
||||||
|
|
||||||
"nb_friends_indice_start": "O suspeito tem",
|
|
||||||
"nb_friends_indice_end": "amigos",
|
|
||||||
|
|
||||||
"nb_sports_indice_start": "O suspeito pratica",
|
|
||||||
"nb_sports_indice_end": "esporte(s)",
|
|
||||||
|
|
||||||
"sport_start": "O suspeito joga pelo menos",
|
|
||||||
"sport_end": "",
|
|
||||||
|
|
||||||
"navbar.play" : "Jogar",
|
|
||||||
"navbar.presentation":"Apresentação",
|
|
||||||
"navbar.info":"Informação",
|
|
||||||
|
|
||||||
"round":"ronda",
|
|
||||||
|
|
||||||
|
|
||||||
"informations" : "Informação",
|
|
||||||
"info.intro.title":"Introdução ao jogo:",
|
|
||||||
"info.intro.text":"Bem-vindo ao nosso empolgante jogo de dedução, onde intriga e malícia se unem em uma aventura emocionante! Mergulhe em um mundo de mistério e intriga, onde cada interação conta, e cada pista o aproxima da verdade. Imagine um gráfico complexo onde cada vértice representa uma pessoa, cada eixo uma relação, e cada detalhe conta. Você está imerso em um desafio desafiador para descobrir quem, entre esses indivíduos, é o misterioso assassino. Cada jogador tem uma pista crucial, e apenas o compartilhamento estratégico dessas pistas o levará a resolver o mistério. Explore nossa página de regras para entender as complexidades do jogo, descobrir pistas que podem orientá-lo e desenvolver estratégias inteligentes para identificar o culpado. Manipule seus amigos para ser o primeiro a descobrir quem é o assassino escondido no gráfico. Você está pronto para aceitar o desafio e desmascarar o assassino oculto no gráfico? Que a investigação comece!",
|
|
||||||
|
|
||||||
"info.sommaire":"Conteúdo",
|
|
||||||
|
|
||||||
"info.title.composant":"Componentes do Jogo",
|
|
||||||
"info.title.objectif":"Objetivo do Jogo",
|
|
||||||
"info.title.deroulement":"Desenvolvimento do Jogo",
|
|
||||||
"info.title.indice_possible":"Possíveis Pistas do Jogo",
|
|
||||||
|
|
||||||
"info.pions" : "Peões",
|
|
||||||
"info.composant.text" : "Cada jogador será associado a uma cor específica que distinguirá as ações representadas pelos peões da seguinte forma:",
|
|
||||||
|
|
||||||
"info.composant.carre.title":"Fichas quadradas",
|
|
||||||
"info.composant.carre":"Essas fichas indicam uma negação. Quando um jogador coloca uma ficha quadrada, significa que sua pista elimina a pessoa designada.",
|
|
||||||
|
|
||||||
"info.composant.rond.title":"Fichas redondas",
|
|
||||||
"info.composant.rond":"Essas fichas representam um 'talvez'. O jogador que deposita esta ficha afirma que a pessoa é suspeita, mas isso não garante sua culpa. Há apenas um suspeito com uma ficha redonda para todos os jogadores no jogo, e este é o culpado!",
|
|
||||||
|
|
||||||
"info.car_perso":"Características",
|
|
||||||
"info.composant.textcar":"Além de seus nomes, os personagens são representados com outras características:",
|
|
||||||
|
|
||||||
"info.composant.age.title":"Idades",
|
|
||||||
"info.composant.age":"Cada pessoa tem uma idade para autenticá-la, variando entre 0 e 60 anos. A idade é uma característica que será confirmada por pistas na forma de ",
|
|
||||||
"info.composant.age.link":"grupos etários",
|
|
||||||
|
|
||||||
"info.composant.hair_col.title":"Cores de cabelo",
|
|
||||||
"info.composant.hair_col":"Os personagens também têm uma cor de cabelo, que pode ser encontrada nas seguintes cores:",
|
|
||||||
|
|
||||||
"hair.blanc":"Branco",
|
|
||||||
"hair.blond":"Loiro",
|
|
||||||
"hair.roux":"Ruivo",
|
|
||||||
"hair.chatain":"Castanho",
|
|
||||||
"hair.noir":"Preto",
|
|
||||||
|
|
||||||
"info.composant.sport.title":"Esportes",
|
|
||||||
"info.composant.sport":"Os hobbies dos personagens são representados por cinco esportes, respectivamente:",
|
|
||||||
|
|
||||||
"info.composant.baseball":"Beisebol",
|
|
||||||
"info.composant.basketball":"Basquete",
|
|
||||||
"info.composant.bowling":"Boliche",
|
|
||||||
"info.composant.football":"Futebol",
|
|
||||||
"info.composant.tennis":"Tênis",
|
|
||||||
"info.composant.sport.bis":"Entre esses esportes, cada personagem pode ter entre 0 e 3 esportes, o que facilita sua identificação usando as pistas que você possui.",
|
|
||||||
|
|
||||||
"info.objectif.intro":"Bem-vindo ao universo inteligente do nosso jogo de dedução, onde a decepção e a astúcia são as chaves para o sucesso. Sua missão é desvendar o mistério por trás de cada interação do gráfico complexo que representa as relações entre os indivíduos.",
|
|
||||||
"info.objectif.t1":"Manipulação Sutil",
|
|
||||||
"info.objectif.t1.text":"O objetivo final é descobrir quem, entre os indivíduos, é o assassino, mas não por meio de colaboração aberta. Pelo contrário, você usará manipulação sutil para turvar as linhas e distrair seus oponentes. Faça perguntas estratégicas, responda com malícia e plante pistas enganosas para se aproximar do resultado.",
|
|
||||||
"info.objectif.t2":"Trapaça",
|
|
||||||
"info.objectif.t2.text":"Cada rodada oferece a oportunidade de semear dúvidas entre seus oponentes. Quando um jogador faz perguntas a você, responda colocando astutamente uma ficha quadrada para indicar que 'dependendo da sua pista, essa pessoa não pode ser o culpado' ou uma ficha redonda para sugerir que eles permanecem na lista de suspeitos. Cuidado, porque cada gesto pode ser interpretado, e a verdade muitas vezes está escondida por trás de uma fachada de pistas enganosas.",
|
|
||||||
"info.objectif.t3":"Contra-manipulação",
|
|
||||||
"info.objectif.t3.text":"Se um jogador colocar uma ficha quadrada, o questionador também deve jogar seu jogo colocando uma ficha quadrada de sua cor em um nó do gráfico. A contra-manipulação se torna uma arma formidável para desviar a acusação e semear confusão.",
|
|
||||||
|
|
||||||
"info.interface": "Interface do Jogo",
|
|
||||||
"info.interface.text": "Para cada jogo, você terá certos elementos de interface disponíveis:",
|
|
||||||
"info.interface.param": "O botão 'Configurações' permite exibir e gerenciar várias configurações do jogo, como ativar ou desativar efeitos sonoros. Também é possível escolher o número de nós para o modo de jogo 'Enigma' usando este botão.",
|
|
||||||
"info.interface.reset": "O botão 'Redefinir' redefine o estado atual do gráfico. Se você o moveu demais ou deseja que sua exibição fique mais organizada, este botão é para você!",
|
|
||||||
"info.interface.info": "O botão 'Informações' redireciona para a página de regras do jogo (esta aqui).",
|
|
||||||
"info.interface.fiche": "O botão 'Folha de Dedução de Pistas' exibe uma tabela que, junto com o progresso do jogo, permite deduzir quais pistas são mais prováveis para cada jogador.",
|
|
||||||
"info.interface.indice": "O botão 'Pista Pessoal' é o mais importante; ele exibe sua pista secreta. Só você a conhece! Você terá que ser esperto para enganar seus amigos e mantê-la em segredo o máximo possível!",
|
|
||||||
"info.interface.vision": "O botão 'Últimas Jogadas' permite ao usuário visualizar as últimas 5 jogadas feitas. Ele age como uma ferramenta visual.",
|
|
||||||
|
|
||||||
"etape":"Etapa",
|
|
||||||
"info.deroulement.e1":"Faça Perguntas Estratégicas",
|
|
||||||
"info.deroulement.e1.text":"Cada rodada começa com um jogador fazendo perguntas a outro jogador sobre uma pessoa no gráfico. As respostas são formuladas colocando fichas quadradas ou redondas para indicar certeza ou dúvida quanto ao envolvimento dessa pessoa.",
|
|
||||||
"info.deroulement.e2":"Contra-manipulação e Contra-perguntas",
|
|
||||||
"info.deroulement.e2.text":"Se um jogador colocar uma ficha quadrada, o questionador também deve colocar uma ficha quadrada em um nó no gráfico. Contra-perguntas são uma maneira de confundir os jogadores e desviar a acusação.",
|
|
||||||
"info.deroulement.e3":"O Palpite Final",
|
|
||||||
"info.deroulement.e3.text":"O jogo atinge seu clímax quando um jogador tenta o 'Palpite' final, alegando que tal pessoa é o assassino. Outros jogadores podem contradizer essa declaração colocando suas próprias fichas quadradas. Se nenhuma refutação for feita, o jogador que fez o 'Palpite' vence o jogo, demonstrando sua maestria na arte da manipulação.",
|
|
||||||
|
|
||||||
"info.indice-possible.age":"Idade da Pessoa",
|
|
||||||
"info.indice-possible.hair":"Cor do cabelo de uma pessoa",
|
|
||||||
"info.indice-possible.sport":"Esporte(s) de uma pessoa",
|
|
||||||
"info.indice-possible.voisin":"Personagem dos vizinhos",
|
|
||||||
|
|
||||||
"info.mdj": "Modos de Jogo",
|
|
||||||
"info.mdj.text": "Existem vários outros modos de jogo que permitem adicionar variedade e tornar o jogo mais ou menos complexo.",
|
|
||||||
"info.mdj.mastermind": "Mestre das Pistas",
|
|
||||||
"info.mdj.mastermind.text": "O modo de jogo 'Mestre das Pistas' é um modo solo onde você deve ser capaz de adivinhar o culpado usando o número mínimo de palpites. Neste modo, você não terá pistas, mas precisará adivinhá-las durante o jogo. Selecionar um suspeito revela o estado de todas as pistas para esse suspeito. Torna-se possível adivinhar as pistas e depois identificar o culpado!",
|
|
||||||
"info.mdj.enigme": "Enigma",
|
|
||||||
"info.mdj.enigme.text": "Este é um modo solo com três níveis de dificuldade:",
|
|
||||||
"info.mdj.enigme.easy": "Enigma Fácil",
|
|
||||||
"info.mdj.enigme.easy.txt": "Neste modo de jogo, você tem acesso a todas as pistas e deve adivinhar o culpado que corresponde a todas essas pistas. Você pode praticar adivinhando o culpado neste modo.",
|
|
||||||
"info.mdj.enigme.medium": "Enigma Intermediário",
|
|
||||||
"info.mdj.enigme.medium.txt": "Neste modo de jogo, você não tem acesso a pistas, mas tem informações suficientes sobre alguns suspeitos para poder adivinhar o culpado. Essas informações o ajudarão a adivinhar as pistas, e o culpado é o suspeito para quem todas as pistas correspondem. Se você selecionar o suspeito errado, não se preocupe! Você terá informações sobre aquele suspeito, o que facilitará encontrar o culpado. O objetivo é encontrar o culpado no mínimo de palpites.",
|
|
||||||
"info.mdj.enigme.hard": "Enigma Difícil",
|
|
||||||
"info.mdj.enigme.hard.txt": "Esta variante final é semelhante ao enigma intermediário; no entanto, você deve encontrar o culpado na primeira tentativa, ou você perde! Depende de você jogar! O objetivo é encontrar o culpado no mínimo de tempo."
|
|
||||||
|
|
||||||
}
|
|
@ -1,22 +0,0 @@
|
|||||||
{
|
|
||||||
"names": [
|
|
||||||
"Sherlock Holmes",
|
|
||||||
"Inspecteur Gadget",
|
|
||||||
"Scooby-Doo",
|
|
||||||
"Marple",
|
|
||||||
"Spocky",
|
|
||||||
"Phoenix",
|
|
||||||
"Batman",
|
|
||||||
"James Bond",
|
|
||||||
"Sherlockio",
|
|
||||||
"Verra",
|
|
||||||
"Hercule Poirot",
|
|
||||||
"Colombo",
|
|
||||||
"MacGyver",
|
|
||||||
"Lupin",
|
|
||||||
"D. Conan",
|
|
||||||
"Pr. Layton",
|
|
||||||
"Dr. Watson"
|
|
||||||
]
|
|
||||||
}
|
|
||||||
|
|
Before Width: | Height: | Size: 1.2 KiB |
Before Width: | Height: | Size: 822 B |
Before Width: | Height: | Size: 10 KiB |
Before Width: | Height: | Size: 15 KiB |
Before Width: | Height: | Size: 189 KiB |
Before Width: | Height: | Size: 66 KiB |
Before Width: | Height: | Size: 3.7 KiB |
Before Width: | Height: | Size: 7.2 KiB |
Before Width: | Height: | Size: 3.6 KiB |
Before Width: | Height: | Size: 34 KiB |
Before Width: | Height: | Size: 18 KiB |
Before Width: | Height: | Size: 42 KiB |
Before Width: | Height: | Size: 14 KiB |
Before Width: | Height: | Size: 6.9 KiB |
Before Width: | Height: | Size: 25 KiB |
Before Width: | Height: | Size: 14 KiB |
Before Width: | Height: | Size: 9.2 KiB |
Before Width: | Height: | Size: 64 KiB |
@ -1,244 +0,0 @@
|
|||||||
import {ADRESSE_DBSERVER} from '../AdressSetup';
|
|
||||||
|
|
||||||
class ScoreboardService {
|
|
||||||
|
|
||||||
// ------------------------------ GET ------------------------------
|
|
||||||
// ----------------------------- DAILY -----------------------------
|
|
||||||
// ----------------------------- STATS -----------------------------
|
|
||||||
|
|
||||||
static async getDailyMastermindStats() {
|
|
||||||
try {
|
|
||||||
const response = await fetch(ADRESSE_DBSERVER + '/scoreboard/getDailyMastermind', {
|
|
||||||
method: 'GET',
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/json',
|
|
||||||
},
|
|
||||||
credentials: 'include',
|
|
||||||
});
|
|
||||||
|
|
||||||
if (response.ok) {
|
|
||||||
const result = await response.json();
|
|
||||||
return result;
|
|
||||||
} else {
|
|
||||||
const errorResponse = await response.json();
|
|
||||||
throw new Error(errorResponse.error);
|
|
||||||
}
|
|
||||||
} catch (error) {
|
|
||||||
console.error(error);
|
|
||||||
throw error;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
static async getDailyEasyEnigmaStats() {
|
|
||||||
try {
|
|
||||||
const response = await fetch(ADRESSE_DBSERVER + '/scoreboard/getDailyEasyEnigma', {
|
|
||||||
method: 'GET',
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/json',
|
|
||||||
},
|
|
||||||
credentials: 'include',
|
|
||||||
});
|
|
||||||
|
|
||||||
if (response.ok) {
|
|
||||||
const result = await response.json();
|
|
||||||
return result;
|
|
||||||
} else {
|
|
||||||
const errorResponse = await response.json();
|
|
||||||
throw new Error(errorResponse.error);
|
|
||||||
}
|
|
||||||
} catch (error) {
|
|
||||||
console.error(error);
|
|
||||||
throw error;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
static async getDailyMediumEnigmaStats() {
|
|
||||||
try {
|
|
||||||
const response = await fetch(ADRESSE_DBSERVER + '/scoreboard/getDailyMediumEnigma', {
|
|
||||||
method: 'GET',
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/json',
|
|
||||||
},
|
|
||||||
credentials: 'include',
|
|
||||||
});
|
|
||||||
|
|
||||||
if (response.ok) {
|
|
||||||
const result = await response.json();
|
|
||||||
return result;
|
|
||||||
} else {
|
|
||||||
const errorResponse = await response.json();
|
|
||||||
throw new Error(errorResponse.error);
|
|
||||||
}
|
|
||||||
} catch (error) {
|
|
||||||
console.error(error);
|
|
||||||
throw error;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
static async getDailyHardEnigmaStats() {
|
|
||||||
try {
|
|
||||||
const response = await fetch(ADRESSE_DBSERVER + '/scoreboard/getDailyHardEnigma', {
|
|
||||||
method: 'GET',
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/json',
|
|
||||||
},
|
|
||||||
credentials: 'include',
|
|
||||||
});
|
|
||||||
|
|
||||||
if (response.ok) {
|
|
||||||
const result = await response.json();
|
|
||||||
return result;
|
|
||||||
} else {
|
|
||||||
const errorResponse = await response.json();
|
|
||||||
throw new Error(errorResponse.error);
|
|
||||||
}
|
|
||||||
} catch (error) {
|
|
||||||
console.error(error);
|
|
||||||
throw error;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
static async getDailyOnlineStats() {
|
|
||||||
try {
|
|
||||||
const response = await fetch(ADRESSE_DBSERVER + '/scoreboard/getDailyOnline', {
|
|
||||||
method: 'GET',
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/json',
|
|
||||||
},
|
|
||||||
credentials: 'include',
|
|
||||||
});
|
|
||||||
|
|
||||||
if (response.ok) {
|
|
||||||
const result = await response.json();
|
|
||||||
return result;
|
|
||||||
} else {
|
|
||||||
const errorResponse = await response.json();
|
|
||||||
throw new Error(errorResponse.error);
|
|
||||||
}
|
|
||||||
} catch (error) {
|
|
||||||
console.error(error);
|
|
||||||
throw error;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// ------------------------------ GET ------------------------------
|
|
||||||
// ----------------------------- WEEKLY ----------------------------
|
|
||||||
// ----------------------------- STATS -----------------------------
|
|
||||||
|
|
||||||
static async getWeeklyMastermindStats() {
|
|
||||||
try {
|
|
||||||
const response = await fetch(ADRESSE_DBSERVER + '/scoreboard/getWeeklyMastermind', {
|
|
||||||
method: 'GET',
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/json',
|
|
||||||
},
|
|
||||||
credentials: 'include',
|
|
||||||
});
|
|
||||||
|
|
||||||
if (response.ok) {
|
|
||||||
const result = await response.json();
|
|
||||||
return result;
|
|
||||||
} else {
|
|
||||||
const errorResponse = await response.json();
|
|
||||||
throw new Error(errorResponse.error);
|
|
||||||
}
|
|
||||||
} catch (error) {
|
|
||||||
console.error(error);
|
|
||||||
throw error;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
static async getWeeklyEasyEnigmaStats() {
|
|
||||||
try {
|
|
||||||
const response = await fetch(ADRESSE_DBSERVER + '/scoreboard/getWeeklyEasyEnigma', {
|
|
||||||
method: 'GET',
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/json',
|
|
||||||
},
|
|
||||||
credentials: 'include',
|
|
||||||
});
|
|
||||||
|
|
||||||
if (response.ok) {
|
|
||||||
const result = await response.json();
|
|
||||||
return result;
|
|
||||||
} else {
|
|
||||||
const errorResponse = await response.json();
|
|
||||||
throw new Error(errorResponse.error);
|
|
||||||
}
|
|
||||||
} catch (error) {
|
|
||||||
console.error(error);
|
|
||||||
throw error;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
static async getWeeklyMediumEnigmaStats() {
|
|
||||||
try {
|
|
||||||
const response = await fetch(ADRESSE_DBSERVER + '/scoreboard/getWeeklyMediumEnigma', {
|
|
||||||
method: 'GET',
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/json',
|
|
||||||
},
|
|
||||||
credentials: 'include',
|
|
||||||
});
|
|
||||||
|
|
||||||
if (response.ok) {
|
|
||||||
const result = await response.json();
|
|
||||||
return result;
|
|
||||||
} else {
|
|
||||||
const errorResponse = await response.json();
|
|
||||||
throw new Error(errorResponse.error);
|
|
||||||
}
|
|
||||||
} catch (error) {
|
|
||||||
console.error(error);
|
|
||||||
throw error;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
static async getWeeklyHardEnigmaStats() {
|
|
||||||
try {
|
|
||||||
const response = await fetch(ADRESSE_DBSERVER + '/scoreboard/getWeeklyHardEnigma', {
|
|
||||||
method: 'GET',
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/json',
|
|
||||||
},
|
|
||||||
credentials: 'include',
|
|
||||||
});
|
|
||||||
|
|
||||||
if (response.ok) {
|
|
||||||
const result = await response.json();
|
|
||||||
return result;
|
|
||||||
} else {
|
|
||||||
const errorResponse = await response.json();
|
|
||||||
throw new Error(errorResponse.error);
|
|
||||||
}
|
|
||||||
} catch (error) {
|
|
||||||
console.error(error);
|
|
||||||
throw error;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
static async getWeeklyOnlineStats() {
|
|
||||||
try {
|
|
||||||
const response = await fetch(ADRESSE_DBSERVER + '/scoreboard/getWeeklyOnline', {
|
|
||||||
method: 'GET',
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/json',
|
|
||||||
},
|
|
||||||
credentials: 'include',
|
|
||||||
});
|
|
||||||
|
|
||||||
if (response.ok) {
|
|
||||||
const result = await response.json();
|
|
||||||
return result;
|
|
||||||
} else {
|
|
||||||
const errorResponse = await response.json();
|
|
||||||
throw new Error(errorResponse.error);
|
|
||||||
}
|
|
||||||
} catch (error) {
|
|
||||||
console.error(error);
|
|
||||||
throw error;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
export default ScoreboardService;
|
|
@ -1 +0,0 @@
|
|||||||
{"persons":[{"id":0,"name":"Charlotte","age":25,"color":2,"sports":[4],"friends":[{"id":4,"name":"Sophia","age":20,"color":4,"sports":[1,3]},{"id":3,"name":"Aurora","age":19,"color":0,"sports":[4,2]},{"id":7,"name":"Violet","age":24,"color":2,"sports":[3]},{"id":5,"name":"Alice","age":68,"color":3,"sports":[0]}]},{"id":1,"name":"Carter","age":20,"color":1,"sports":[1,0],"friends":[{"id":4,"name":"Sophia","age":20,"color":4,"sports":[1,3]},{"id":2,"name":"Ava","age":40,"color":3,"sports":[2,3]}]},{"id":2,"name":"Ava","age":40,"color":3,"sports":[2,3],"friends":[{"id":1,"name":"Carter","age":20,"color":1,"sports":[1,0]},{"id":9,"name":"Liam","age":19,"color":4,"sports":[0]}]},{"id":3,"name":"Aurora","age":19,"color":0,"sports":[4,2],"friends":[{"id":4,"name":"Sophia","age":20,"color":4,"sports":[1,3]},{"id":0,"name":"Charlotte","age":25,"color":2,"sports":[4]},{"id":8,"name":"Sebastian","age":13,"color":0,"sports":[1]},{"id":9,"name":"Liam","age":19,"color":4,"sports":[0]},{"id":6,"name":"Benjamin","age":52,"color":1,"sports":[0,2,4]}]},{"id":4,"name":"Sophia","age":20,"color":4,"sports":[1,3],"friends":[{"id":3,"name":"Aurora","age":19,"color":0,"sports":[4,2]},{"id":0,"name":"Charlotte","age":25,"color":2,"sports":[4]},{"id":1,"name":"Carter","age":20,"color":1,"sports":[1,0]}]},{"id":5,"name":"Alice","age":68,"color":3,"sports":[0],"friends":[{"id":0,"name":"Charlotte","age":25,"color":2,"sports":[4]},{"id":6,"name":"Benjamin","age":52,"color":1,"sports":[0,2,4]}]},{"id":6,"name":"Benjamin","age":52,"color":1,"sports":[0,2,4],"friends":[{"id":3,"name":"Aurora","age":19,"color":0,"sports":[4,2]},{"id":5,"name":"Alice","age":68,"color":3,"sports":[0]}]},{"id":7,"name":"Violet","age":24,"color":2,"sports":[3],"friends":[{"id":0,"name":"Charlotte","age":25,"color":2,"sports":[4]}]},{"id":8,"name":"Sebastian","age":13,"color":0,"sports":[1],"friends":[{"id":3,"name":"Aurora","age":19,"color":0,"sports":[4,2]}]},{"id":9,"name":"Liam","age":19,"color":4,"sports":[0],"friends":[{"id":2,"name":"Ava","age":40,"color":3,"sports":[2,3]},{"id":3,"name":"Aurora","age":19,"color":0,"sports":[4,2]}]}]}
|
|
@ -1 +0,0 @@
|
|||||||
"[{\"type\":\"AgeIndice\",\"id\":5,\"minimum\":20,\"maximum\":29},{\"type\":\"SportIndice\",\"id\":24,\"sports\":[2,3]},{\"type\":\"ColorEdgesIndice\",\"id\":27,\"neighborsColors\":[0]}]"
|
|