diff --git a/cryptide_project/src/Components/ButtonImgNav.css b/cryptide_project/src/Components/ButtonImgNav.css index e625ce2..7ac29c0 100644 --- a/cryptide_project/src/Components/ButtonImgNav.css +++ b/cryptide_project/src/Components/ButtonImgNav.css @@ -1,5 +1,6 @@ .buttonNabImg{ margin: 15px 0; + padding: 10px; width: auto; height: 65px; diff --git a/cryptide_project/src/Components/GraphContainer.tsx b/cryptide_project/src/Components/GraphContainer.tsx index d84bb4e..a0d015e 100644 --- a/cryptide_project/src/Components/GraphContainer.tsx +++ b/cryptide_project/src/Components/GraphContainer.tsx @@ -75,7 +75,7 @@ let cptTour: number = 0 for(const n of lastNodes.reverse()){ if (!tab.find((node) => node.id == n.id)){ tab.push(n) - if (tab.length > players.length * 1.5) break + if (tab.length > players.length * 2) break } } lastNodes = tab diff --git a/cryptide_project/src/Components/ScoreBoard.tsx b/cryptide_project/src/Components/ScoreBoard.tsx new file mode 100644 index 0000000..b756e4a --- /dev/null +++ b/cryptide_project/src/Components/ScoreBoard.tsx @@ -0,0 +1,82 @@ +import React from 'react'; + +/* Style */ +import '../Pages/Play.css'; +import '../Style/Global.css' +import { useTheme } from '../Style/ThemeContext'; + +/* Ressources */ +import Person from '../res/img/Person.png' +import leave from '../res/img/bot.png' +import trophy from '../res/icon/trophy.png' +import share from '../res/icon/share.png'; + +/* Boostrap */ +import Tab from 'react-bootstrap/Tab'; +import Tabs from 'react-bootstrap/Tabs'; +import Container from 'react-bootstrap/Container'; +import Row from 'react-bootstrap/Row'; +import Col from 'react-bootstrap/Col'; + +/* Component */ +import ButtonImgNav from './ButtonImgNav'; + +//@ts-ignore +function ScoreBoard({Player = null}) { + const theme=useTheme(); + return ( + //
+
+ + + + Tab content for Contact + + + Person2 + + + Partie Jouées : + 10 + + + Partie gagnées : + 2 + + + Pions posés : + 2 + +
+ + Partie solo : + 21 + + + Nombre de coups moyen : + 19 + + + + + Person2 + + + + +
+ //
+ ); +} + +export default ScoreBoard; diff --git a/cryptide_project/src/Pages/InGame.tsx b/cryptide_project/src/Pages/InGame.tsx index 813e6c1..f918923 100644 --- a/cryptide_project/src/Pages/InGame.tsx +++ b/cryptide_project/src/Pages/InGame.tsx @@ -20,6 +20,8 @@ import Info from "../res/icon/infoGreen.png"; import Check from "../res/icon/checkboxGreen.png"; import Alpha from "../res/GreekLetters/alphaW.png"; import MGlass from "../res/icon/magnifying-glass.png"; +import Oeye from "../res/icon/eye.png"; +import Ceye from "../res/icon/hidden.png"; /* nav */ import { Link } from 'react-router-dom'; @@ -37,6 +39,7 @@ import Color from '../model/Color'; import { useGame } from '../Contexts/GameContext'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { NavLink } from 'react-router-dom'; +import { last } from 'lodash'; import { socket } from '../SocketConfig'; //@ts-ignore @@ -122,6 +125,9 @@ const InGame = ({locale, changeLocale}) => { const [cptTour, setcptTour] = useState(0); + const [LastVisible, setLastVisible] = useState(false); + + //@ts-ignore const changecptTour = (newcptTour) => { setcptTour(newcptTour); @@ -154,6 +160,11 @@ const InGame = ({locale, changeLocale}) => { } }; + const changeVisibility = () => { + setLastVisible(!LastVisible); + } + 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 @@ -208,17 +219,6 @@ const InGame = ({locale, changeLocale}) => { -
- -
-
+ +
{/* @@ -279,10 +287,12 @@ const InGame = ({locale, changeLocale}) => { */} -
- -
+ { !IsSolo && +
+ +
+ } { - if (room !== null) { - const nouvelleURL = `/lobby?room=${room}`; - navigate(nouvelleURL); - } - }, [room, navigate]); + useEffect(() => { + if (room !== null) { + const nouvelleURL = `/lobby?room=${room}`; + navigate(nouvelleURL); + } + }, [room, navigate]); @@ -99,33 +100,7 @@ function Play() {
-
- Person2 -
-
-

- Partie Jouées :
- Partie gagnées :
- Pions posés :
-

-
-
-

- 10
- 2
- 45
-

-
-
- {/* */} - -
+
); diff --git a/cryptide_project/src/Style/Global.css b/cryptide_project/src/Style/Global.css index 0e22e38..2ab26a6 100644 --- a/cryptide_project/src/Style/Global.css +++ b/cryptide_project/src/Style/Global.css @@ -52,4 +52,31 @@ form{ .listContainer{ columns: 2 auto; +} + +/* LeaderBoard */ +.LeaderBoardiv{ + border: solid; + border-width: 0px 1px 1px 1px; + border-color: lightgray; + border-radius: 0px 0px 20px 20px; + + display: flex; + align-items: center; + flex-direction: column; + + margin: 15px; +} + + +.textBoard{ + display: flex; + flex-wrap: column; + justify-content: space-between; + width: 300px; +} + +.leftRow{ + display: flex; + justify-content: end; } \ No newline at end of file diff --git a/cryptide_project/src/Style/Theme.tsx b/cryptide_project/src/Style/Theme.tsx index 7128043..cf65dd7 100644 --- a/cryptide_project/src/Style/Theme.tsx +++ b/cryptide_project/src/Style/Theme.tsx @@ -1,7 +1,7 @@ // theme.js const theme = { colors: { - primary: '#7AA3F4', + primary: '#0064E0', secondary: '#0052B8', tertiary: '#7aa3f4', //* Pour les boutons de l'interface. text: '#fff' diff --git a/cryptide_project/src/Translations/en.json b/cryptide_project/src/Translations/en.json index e287818..b462ccd 100644 --- a/cryptide_project/src/Translations/en.json +++ b/cryptide_project/src/Translations/en.json @@ -104,7 +104,7 @@ "info.composant.hair_col.title":"Hair's colors", "info.composant.hair_col":"The characters also have a hair colour, which can be found in the following colours :", - "hair.blanc":"Blanc", + "hair.blanc":"White", "hair.blond":"Blond", "hair.roux":"Red head", "hair.chatain":"Brown", diff --git a/cryptide_project/src/res/icon/eye.png b/cryptide_project/src/res/icon/eye.png new file mode 100644 index 0000000..929f81d Binary files /dev/null and b/cryptide_project/src/res/icon/eye.png differ diff --git a/cryptide_project/src/res/icon/hidden.png b/cryptide_project/src/res/icon/hidden.png new file mode 100644 index 0000000..43c6666 Binary files /dev/null and b/cryptide_project/src/res/icon/hidden.png differ