From 54f63188f05c23a2aee3d431e43559c58e92e8b9 Mon Sep 17 00:00:00 2001 From: Pierre Ferreira Date: Tue, 5 Dec 2023 10:43:26 +0100 Subject: [PATCH 1/3] ajout de la page avec la nouvelle grille de deduction :boom: --- cryptide_project/src/App.tsx | 4 +- cryptide_project/src/Pages/DeducCheck.tsx | 107 ++++++++++++++++++++++ 2 files changed, 110 insertions(+), 1 deletion(-) create mode 100644 cryptide_project/src/Pages/DeducCheck.tsx diff --git a/cryptide_project/src/App.tsx b/cryptide_project/src/App.tsx index 40cf7ee..9cdc801 100644 --- a/cryptide_project/src/App.tsx +++ b/cryptide_project/src/App.tsx @@ -45,6 +45,7 @@ import messagesEn from './Translations/en.json'; import ErrorBoundary from './Error/ErrorBoundary'; import ErrorPage from './Error/ErrorPage'; import NewPlay from './Pages/NewPlay'; +import DeducCheck from './Pages/DeducCheck'; const messages = { fr: messagesFr, @@ -85,7 +86,8 @@ function App() { } /> }/> } /> - } /> + } /> + } /> } /> }/> {/* }/> */} diff --git a/cryptide_project/src/Pages/DeducCheck.tsx b/cryptide_project/src/Pages/DeducCheck.tsx new file mode 100644 index 0000000..646d77b --- /dev/null +++ b/cryptide_project/src/Pages/DeducCheck.tsx @@ -0,0 +1,107 @@ +import React from 'react'; + +/* Style */ +import './DeducGrid.css'; +import { useTheme } from '../Style/ThemeContext'; + +/* Component */ + +/* Boostrap */ +import Table from 'react-bootstrap/Table'; +import Form from 'react-bootstrap/Form'; + +/* lang */ +import { FormattedMessage } from 'react-intl'; + +/* model */ +import Stub from '../model/Stub'; + +import { useGame } from '../Contexts/GameContext'; + +function DeducCheck() { + const theme = useTheme(); + //const indices = Stub.GenerateIndice(); + + + // const { players } = useGame(); + + const indices = Stub.GenerateIndice(); + + const halfLength = Math.ceil(indices.length / 2); + const firstHalfIndices = indices.slice(0, halfLength); + const secondHalfIndices = indices.slice(halfLength); + + const players = [ + "πŸ”΅", + "🟒", + "🟑", + "🟣", + "πŸ”΄"] + + // const players = [ + // "bla", + // "bli", + // "blou", + // "blu", + // "ble", + // ] + + console.log(players) + return ( +
+
+ {/* Premier tableau */} + + + + + {players.map((player, index) => ( + + ))} + + + + {firstHalfIndices.map((indice, rowIndex) => ( + + + {players.map((player, colIndex) => ( + + ))} + + ))} + +
Indices{player}
{indice.ToString("fr")} + {/* */} + +
+ + {/* Deuxième tableau */} + + + + + {players.map((player, index) => ( + + ))} + + + + {secondHalfIndices.map((indice, rowIndex) => ( + + + {players.map((player, colIndex) => ( + + ))} + + ))} + +
Indices{player}
{indice.ToString("fr")} + {/* */} + +
+
+
+ ); +} + +export default DeducCheck; From d4e1f28c641924ef4a7539a8578cd9493072c66a Mon Sep 17 00:00:00 2001 From: Pierre Ferreira Date: Tue, 5 Dec 2023 11:45:03 +0100 Subject: [PATCH 2/3] tentative de passage par lien --- cryptide_project/src/Pages/DeducCheck.tsx | 55 ++++++++++++++--------- cryptide_project/src/Pages/InGame.tsx | 9 ++-- 2 files changed, 39 insertions(+), 25 deletions(-) diff --git a/cryptide_project/src/Pages/DeducCheck.tsx b/cryptide_project/src/Pages/DeducCheck.tsx index 646d77b..0feb90a 100644 --- a/cryptide_project/src/Pages/DeducCheck.tsx +++ b/cryptide_project/src/Pages/DeducCheck.tsx @@ -17,36 +17,51 @@ import { FormattedMessage } from 'react-intl'; import Stub from '../model/Stub'; import { useGame } from '../Contexts/GameContext'; +import { positionToEmoji } from '../ColorHelper'; function DeducCheck() { const theme = useTheme(); //const indices = Stub.GenerateIndice(); + const params = new URLSearchParams(window.location.search); + + const NbPlayer = params.get('NbPlayer'); + const actualPlayerIndex = params.get('actualId') ?? '0'; + + console.log(parseInt(NbPlayer ?? 'nnnnnnnnnnuuuuuuuuuuuuulllllll')) + console.log(parseInt(actualPlayerIndex ?? 'nnnnnnnnnnuuuuuuuuuuuuulllllllooooooooosssssssss')) + //const { actualPlayerIndex, players } = useGame(); + + // let playerstmp + // if (players.length == 0) playerstmp = ["1", "2", "3", "4", "5", "4"]; + // else { playerstmp = players} - // const { players } = useGame(); + //* Gestion players + const playerList = Array.from({ length: parseInt(NbPlayer ?? '1') }, (_, index) => (index + 1).toString()); + const playerColors = playerList.map((_, index) => positionToEmoji(index, true)); + const players = playerColors.filter((_, index) => index !== parseInt(actualPlayerIndex ?? '0')); + + + // const players = [ + // "πŸ”΅", + // "🟒", + // "🟑", + // "🟣", + // "πŸ”΄" + //] + //console.log(players) + // console.log(playerColors) + // console.log(actualPlayerIndex) + + //* Gestion indices const indices = Stub.GenerateIndice(); const halfLength = Math.ceil(indices.length / 2); const firstHalfIndices = indices.slice(0, halfLength); const secondHalfIndices = indices.slice(halfLength); - - const players = [ - "πŸ”΅", - "🟒", - "🟑", - "🟣", - "πŸ”΄"] - // const players = [ - // "bla", - // "bli", - // "blou", - // "blu", - // "ble", - // ] - console.log(players) return (
@@ -55,7 +70,7 @@ function DeducCheck() { Indices - {players.map((player, index) => ( + {playerColors.map((player, index) => ( {player} ))} @@ -64,7 +79,7 @@ function DeducCheck() { {firstHalfIndices.map((indice, rowIndex) => ( {indice.ToString("fr")} - {players.map((player, colIndex) => ( + {playerColors.map((player, colIndex) => ( {/* */} @@ -80,7 +95,7 @@ function DeducCheck() { Indices - {players.map((player, index) => ( + {playerColors.map((player, index) => ( {player} ))} @@ -89,7 +104,7 @@ function DeducCheck() { {secondHalfIndices.map((indice, rowIndex) => ( {indice.ToString("fr")} - {players.map((player, colIndex) => ( + {playerColors.map((player, colIndex) => ( {/* */} diff --git a/cryptide_project/src/Pages/InGame.tsx b/cryptide_project/src/Pages/InGame.tsx index f90c73f..ee285fa 100644 --- a/cryptide_project/src/Pages/InGame.tsx +++ b/cryptide_project/src/Pages/InGame.tsx @@ -278,8 +278,10 @@ const InGame = ({locale, changeLocale}) => { const [SwitchEnabled, setSwitchEnabled] = useState(false) const allIndices = Stub.GenerateIndice() - const { indice, players } = useGame(); + const { indice, players, actualPlayerIndex} = useGame(); + const nbPlayer = players.length; + const navdeduc = '/deduc?actualId=' + actualPlayerIndex + '&nbPlayer=' + nbPlayer; return (
@@ -373,12 +375,9 @@ const InGame = ({locale, changeLocale}) => { info - {/* */} {!IsSolo && - +