From e66281e575a2c233d16c5ffefc1e26c6da6b9330 Mon Sep 17 00:00:00 2001 From: Pierre Ferreira Date: Wed, 15 Nov 2023 14:35:06 +0100 Subject: [PATCH 1/8] ajout du theme tertiary pour les boutons et remplacement de l'icon alpha par une loupe. :art: --- cryptide_project/src/Pages/InGame.css | 2 +- cryptide_project/src/Pages/InGame.tsx | 16 +++++++++------- cryptide_project/src/Style/Theme.tsx | 2 +- .../src/res/icon/magnifying-glass.png | Bin 0 -> 2438 bytes 4 files changed, 11 insertions(+), 9 deletions(-) create mode 100644 cryptide_project/src/res/icon/magnifying-glass.png diff --git a/cryptide_project/src/Pages/InGame.css b/cryptide_project/src/Pages/InGame.css index 600710e..04bed07 100644 --- a/cryptide_project/src/Pages/InGame.css +++ b/cryptide_project/src/Pages/InGame.css @@ -107,7 +107,7 @@ .button{ /*background-color: #85C9C2;*/ - border: solid 2px #85C9C2; + border: solid 2px #7aa3f4; border-radius: 10px; width: 100px; diff --git a/cryptide_project/src/Pages/InGame.tsx b/cryptide_project/src/Pages/InGame.tsx index 8a90482..02341ca 100644 --- a/cryptide_project/src/Pages/InGame.tsx +++ b/cryptide_project/src/Pages/InGame.tsx @@ -19,6 +19,7 @@ import Replay from "../res/icon/replay.png"; 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"; /* nav */ import { Link } from 'react-router-dom'; @@ -34,6 +35,7 @@ import { Nav, NavDropdown } from 'react-bootstrap'; import { FormattedMessage } from 'react-intl'; import Color from '../model/Color'; import { useGame } from '../Contexts/GameContext'; +import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; //@ts-ignore const InGame = ({locale, changeLocale}) => { @@ -138,7 +140,7 @@ const InGame = ({locale, changeLocale}) => { {IsSolo ? (
Tour : {cptTour} @@ -147,7 +149,7 @@ const InGame = ({locale, changeLocale}) => {
diff --git a/cryptide_project/src/Style/Theme.tsx b/cryptide_project/src/Style/Theme.tsx index 50df20a..199ff79 100644 --- a/cryptide_project/src/Style/Theme.tsx +++ b/cryptide_project/src/Style/Theme.tsx @@ -3,7 +3,7 @@ const theme = { colors: { primary: '#0064E0', secondary: '#0052B8', - + tertiary: '#7aa3f4', //* Pour les boutons de l'interface. text: '#fff' //faire une gestion dark/light diff --git a/cryptide_project/src/res/icon/magnifying-glass.png b/cryptide_project/src/res/icon/magnifying-glass.png new file mode 100644 index 0000000000000000000000000000000000000000..7d29f82081022856b57020b73c463dff2562d3dc GIT binary patch literal 2438 zcmV;133>L3P)Mha?5+=xH$+_*9zh;cC?r^2-PSWf=_44gf0w%mXl)m+sL3&gV81z*qn!0G_&_9bK-9Z3G0eCT@j?4tW@hQ@B24^u7!S4AGplYk=4B1H;(vs z$zao+?*bkG@DwYSF95hS2gkR)0eob6_i_M-W%)fpL%*c$mc71Pguh37@2vn9IqcVD zRLYhjzGO0e&sqTc<>0%5;{=Psx0;V-Hc0#L3t(XcZN0V~m?K%PVB3TAJ8SS&FR?bx0I)3Lpx14*MdXSh7A1CO4!_HLW*a(+CdNLN=lA3#Je5V;#0IBaTP|x1 z-#IMD-{&Qx3>{SFpy_wxeKp&`ACM>cN-Tz}4oEP&1K1#R4lSQ2Tb>^s@luG+<8xS1 z8_V|qv~9G^vz*Tw-ih8Pu{>hvmzPt^mF_ydyc7B#t8tN4|xY zbNP6OfnUShOEKcXQ2;81cl|br*T^pkok5*+NEV6}O{)6Q1C*bh${{O>%mu#HH%EAQL&51WRv0=wA)@`?Cy7zt8b|eGOY7 z=?Ot{zaTV4_N1dV?~Cc4p#V>xDdxdWCmUUj2gxEq;6cLYM;b0s3griwOFj_fBQtk! z&=S8Tjj&|ZYbQMOvd}?KBMc@8@{y}raI`mg`beHV(oJDcgh4MszNH9|(*#t1>Vc`N)rgoWZ$| zOYYK_3!lF?Lq`$cSSrX#2C$%bP!M!@#LrV;M@W2UVyu{ewP$ooRS z^g&=uj(GV|%&uW|KYKTlV;nmTfpLc*=#>^NnQZ3c0Gx<0Stj%gU4aM1xP&NmQIVWO z4n<%L69i3ih}2F7-$q4i)-@OyEIA0ZDoGf-`$MGC=5)#R!zLr0jQ& zOcMHoLdk;U4MAYa(2+#G5c-3%qy)+Jg21mJd9*TQE$M_nIZhC`f<0xE#7Khz7_3gz z#GnUIp@t;!uFwzUEu6@(FzOH&iaE&gH;%I_jZp-!EBhGo8jv4E&~z09r;DB=9iA^u z^DOt5d{z-@*V zu#j0y8kFX20gU1#YT5!Q;KUct=n6sZ`A8Ud2^~T0T*Gt4JPFo$s06-jkU7qYE%HKZ z!;z2@FYkr0IL|Qn6d{yI#uz%~oq!A?`x>^q>JUAEqlAlnWtarM2Y}Yz`AcqJDK2Z1 zXpS-D4A{X1oqV3)FBt}Zbps@+^nz;*okT~&GvOyw4RTd;Z6k&EdMR~GijPixJd>x? zAWw=TrIb3f;Q~vhU(CfG^jK4_LSh>HH!`Srk_h(agw830wd{VrRgCK;&&QU*UmVjc zrm@N){Fg&@&I1rHdRQhewI2YqE%b}}a${I->C8=BowLxZK|27?IAkvOC6j4vILxsS z#PR~25}NVpMY`FmzwFmdf=T=TIsANZQNX!mKOW$eLtDZHAc`8mgne^_;?nc#?fH%Q z-|Ff$QvC#u*@s?|4v21>A*F1QW>@y z4#xbHFPmyBhtA;}IXYcz%;N7?@c_5XFkO7gv1G1q$+7ctOF-MN4{>zE1c_A&c&x)yqHbOZT$== zQQN;s^dz!{TaDn9>ry`cOj{WTZS>Ef3))c2cW!g2i>Q-8pa~mU#<4Hn*AcY&GEPW2 zlLIw7<>{P0->||AVi{@;PNwSTIte10Zb@0|%*td>PRP`mtCLe9>xQCS7|;QNPoYkN zfM{;Wg)H4~=p+b;7QzIeJ%4AzbA2qe6DvYYF&8SEGfWWSvJyx&n3Ndtj$r_8W?!8I z0WjL~E4D4=Ite_dsiholg+tP4)d@VOn;|Zu_Ecaik)xBqb1t#Clx^YqLfLKyl%q+B zu|BZFFo0VfT;FVyU|oo%XhLGB#r9w6aPw%}4rVlvEJ}t9Hzbg*y&yU}i5PTBL*A(iKlQ$6_a_6t0hn z$AxDoXMy4oeJz@ORhsH+CmNpdC99fJhu#i8kFz-=`wYw0q1VNp(u=KvsVv&67zETR zS#U;#@U$p}Iu(yNIfF2{6jyIm0->{G_ Date: Wed, 15 Nov 2023 16:50:37 +0100 Subject: [PATCH 2/8] =?UTF-8?q?mise=20en=20forme=20de=20la=20page=20info?= =?UTF-8?q?=20dynamic,=20avec=20sommaire=20=C3=A0=20encre=20et=20style.=20?= =?UTF-8?q?;bug:=20La=20navigation=20ne=20prend=20pas=20l'encre.=20:lipsti?= =?UTF-8?q?ck:?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- cryptide_project/package-lock.json | 52 + cryptide_project/package.json | 5 +- .../src/Components/IndiceList.tsx | 34 + cryptide_project/src/Pages/InGame.tsx | 2 +- cryptide_project/src/Pages/InfoPage.css | 79 + cryptide_project/src/Pages/InfoPage.tsx | 142 +- cryptide_project/src/Style/Global.css | 4 + cryptide_project/src/model/Indices/Indice.ts | 2 + .../src/model/Indices/NbEdgesIndice.ts | 1 + cryptide_project/src/model/Stub.ts | 8 +- cryptide_project/yarn.lock | 16603 ++++++++-------- 11 files changed, 8592 insertions(+), 8340 deletions(-) create mode 100644 cryptide_project/src/Components/IndiceList.tsx create mode 100644 cryptide_project/src/Pages/InfoPage.css diff --git a/cryptide_project/package-lock.json b/cryptide_project/package-lock.json index 14a8bc0..833af40 100644 --- a/cryptide_project/package-lock.json +++ b/cryptide_project/package-lock.json @@ -27,6 +27,7 @@ "react-icons": "^4.11.0", "react-intl": "^6.5.2", "react-router-dom": "^6.18.0", + "react-router-hash-link": "^2.4.3", "react-scripts": "5.0.1", "react-switch": "^7.0.0", "socket.io": "^4.7.2", @@ -36,6 +37,7 @@ "web-vitals": "^2.1.4" }, "devDependencies": { + "@types/react-router-hash-link": "^2.4.9", "@types/uuid": "^9.0.7" } }, @@ -4289,6 +4291,12 @@ "integrity": "sha512-pdGBkAh4ggfXAkiwgmTdROJe3mwvLWJYm6JiaAwCtskAU0Weh+JQyyMTbhvxjxD2n8sr8PrxVwyDzmpnK4pUrQ==", "peer": true }, + "node_modules/@types/history": { + "version": "4.7.11", + "resolved": "https://registry.npmjs.org/@types/history/-/history-4.7.11.tgz", + "integrity": "sha512-qjDJRrmvBMiTx+jyLxvLfJU7UznFuokDv4f3WRuriHKERccVpFU+8XMQUAbDzoiJCsmexxRExQeMwwCdamSKDA==", + "dev": true + }, "node_modules/@types/hoist-non-react-statics": { "version": "3.3.5", "resolved": "https://registry.npmjs.org/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.5.tgz", @@ -4459,6 +4467,38 @@ "@types/react": "*" } }, + "node_modules/@types/react-router": { + "version": "5.1.20", + "resolved": "https://registry.npmjs.org/@types/react-router/-/react-router-5.1.20.tgz", + "integrity": "sha512-jGjmu/ZqS7FjSH6owMcD5qpq19+1RS9DeVRqfl1FeBMxTDQAGwlMWOcs52NDoXaNKyG3d1cYQFMs9rCrb88o9Q==", + "dev": true, + "dependencies": { + "@types/history": "^4.7.11", + "@types/react": "*" + } + }, + "node_modules/@types/react-router-dom": { + "version": "5.3.3", + "resolved": "https://registry.npmjs.org/@types/react-router-dom/-/react-router-dom-5.3.3.tgz", + "integrity": "sha512-kpqnYK4wcdm5UaWI3fLcELopqLrHgLqNsdpHauzlQktfkHL3npOSwtj1Uz9oKBAzs7lFtVkV8j83voAz2D8fhw==", + "dev": true, + "dependencies": { + "@types/history": "^4.7.11", + "@types/react": "*", + "@types/react-router": "*" + } + }, + "node_modules/@types/react-router-hash-link": { + "version": "2.4.9", + "resolved": "https://registry.npmjs.org/@types/react-router-hash-link/-/react-router-hash-link-2.4.9.tgz", + "integrity": "sha512-zl/VMj+lfJZhvjOAQXIlBVPNKSK+/fRG8AUHhlP9++LhlA2ziLeTmbRxIMJI3PCiCTS+W/FosEoDRoNOGH0OzA==", + "dev": true, + "dependencies": { + "@types/history": "^4.7.11", + "@types/react": "*", + "@types/react-router-dom": "^5.3.0" + } + }, "node_modules/@types/react-transition-group": { "version": "4.4.8", "resolved": "https://registry.npmjs.org/@types/react-transition-group/-/react-transition-group-4.4.8.tgz", @@ -14831,6 +14871,18 @@ "react-dom": ">=16.8" } }, + "node_modules/react-router-hash-link": { + "version": "2.4.3", + "resolved": "https://registry.npmjs.org/react-router-hash-link/-/react-router-hash-link-2.4.3.tgz", + "integrity": "sha512-NU7GWc265m92xh/aYD79Vr1W+zAIXDWp3L2YZOYP4rCqPnJ6LI6vh3+rKgkidtYijozHclaEQTAHaAaMWPVI4A==", + "dependencies": { + "prop-types": "^15.7.2" + }, + "peerDependencies": { + "react": ">=15", + "react-router-dom": ">=4" + } + }, "node_modules/react-scripts": { "version": "5.0.1", "resolved": "https://registry.npmjs.org/react-scripts/-/react-scripts-5.0.1.tgz", diff --git a/cryptide_project/package.json b/cryptide_project/package.json index c3658bd..7417321 100644 --- a/cryptide_project/package.json +++ b/cryptide_project/package.json @@ -21,13 +21,11 @@ "react-icons": "^4.11.0", "react-intl": "^6.5.2", "react-router-dom": "^6.18.0", + "react-router-hash-link": "^2.4.3", "react-scripts": "5.0.1", "react-switch": "^7.0.0", "socket.io": "^4.7.2", "socket.io-client": "^4.7.2", - "socket.io": "^4.7.2", - "socket.io-client": "^4.7.2", - "react-switch": "^7.0.0", "typescript": "^5.2.2", "vis-network": "^9.1.9", "web-vitals": "^2.1.4" @@ -57,6 +55,7 @@ ] }, "devDependencies": { + "@types/react-router-hash-link": "^2.4.9", "@types/uuid": "^9.0.7" } } diff --git a/cryptide_project/src/Components/IndiceList.tsx b/cryptide_project/src/Components/IndiceList.tsx new file mode 100644 index 0000000..5b77592 --- /dev/null +++ b/cryptide_project/src/Components/IndiceList.tsx @@ -0,0 +1,34 @@ +import React from 'react'; + +/* Style */ +import '../Style/Global.css'; +//import { useTheme } from '../Style/ThemeContext'; + +/* Model */ +import Stub from '../model/Stub'; +import Indice from '../model/Indices/Indice'; + +/* lang */ +import { FormattedMessage } from 'react-intl'; + +interface IndiceListComponentProps { + instance: (new (...args: any[]) => T) | (Function & { prototype: T }); + lang: string; +} + +const IndiceList: React.FC> = ({ instance, lang }) => { + const indices = Stub.GenerateIndice(); + return ( + <> +
    + {indices + .filter((i) => i instanceof instance) + .map((indice, index) => ( +

    {indice.ToString(lang)}

    + ))} +
+ + ); +} + +export default IndiceList; diff --git a/cryptide_project/src/Pages/InGame.tsx b/cryptide_project/src/Pages/InGame.tsx index 02341ca..0d93dd0 100644 --- a/cryptide_project/src/Pages/InGame.tsx +++ b/cryptide_project/src/Pages/InGame.tsx @@ -172,7 +172,7 @@ const InGame = ({locale, changeLocale}) => {
- + +

+ Le bouton "Paramètre" permet l'affichage et la gestion de différent paramètres de la partie, comme par exemple le language, l'aide ... . +

+
+ + Attention, cette partie ne peut pas être complétée tant que tout les paramètres n'ont pas été choisis ! + + +
  • +
    + +

    + Le bouton "Information" permet de rediriger vers la page de règle du jeu (celle ci). + {/* + //! mais est ce que nous devons rediriger sur les indices possibles ? + */} +

    +
    +
    • +
  • +
    + + +

    + Le bouton "Fiche de déduction d'indice" permet l'affichage de tableau dynamic permettant, avec le déroulé de la partie, de déduire quels indices sont les plus probables. +

    +
    + + Attention, cette partie ne peut pas être complétée tant que la page et l'algorithme dédié ne sont pas fait ! + +
    • +
  • +
    + + +

    + Le bouton "Indice personnel" est le plus important, en effet il permet d'afficher quel est votre indice secret. Vous seul le connaissais ! Il va falloir ruser pour tromper vos amis et le garder secret le plus longtemps possible ! +

    +
    +
    • + + +
    +
    +

    :

    +

    + 1 : +

    +

    + +

    +

    + 2 : +

    +

    + +

    +

    + 3 : +

    +

    + +

    +
    +
    +
    +

    :

    +
    +

    + +

    + + +

    + +

    + +
    -
    -

    :

    -
    -

    - -

    - - -

    - -

    - - -
    -

    - -

    - - - - -

    - -

    - - -
    -
    - - {/* - //! Topographie présente uniquement sur Cryptide -

    Topographie

    -

    Legende des différents objet disponible sur la carte.

    - */} +

    + +

    + + + + +

    + +

    + + +
    +
    ); } From 4f79a7238e8f9d1c41dff7abcba8d43c17a9c461 Mon Sep 17 00:00:00 2001 From: Pierre Ferreira Date: Thu, 16 Nov 2023 14:39:55 +0100 Subject: [PATCH 8/8] test pour la navigation avec des encres, mais apparament impossible :test_tube: --- cryptide_project/src/Pages/InGame.tsx | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/cryptide_project/src/Pages/InGame.tsx b/cryptide_project/src/Pages/InGame.tsx index 0d93dd0..baf2d74 100644 --- a/cryptide_project/src/Pages/InGame.tsx +++ b/cryptide_project/src/Pages/InGame.tsx @@ -36,6 +36,7 @@ import { FormattedMessage } from 'react-intl'; import Color from '../model/Color'; import { useGame } from '../Contexts/GameContext'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; +import { NavLink } from 'react-router-dom'; //@ts-ignore const InGame = ({locale, changeLocale}) => { @@ -172,7 +173,10 @@ const InGame = ({locale, changeLocale}) => {
    - + {/* + //? redirection impossible apparament (securité des navigateur + */} +