Crypteam
/
Cryptid
4
0
Fork 0
Code Issues 10 Pull Requests Packages Projects 9 Releases Wiki Activity

début tuto2

Browse Source
pull/103/head
Thomas Chazot 7 months ago
parent 355ef62f7f
commit 49f4beb205
2 changed files with 44 additions and 109 deletions
Show Stats Download Patch File Download Diff File

26
cryptide_project/src/Components/TutorialGraph.tsx
Unescape View File

@ -24,26 +24,16 @@ import {basePath} from "../AdressSetup"
import PersonNetwork from "../model/PersonsNetwork";
interface TutorialGraphProps {
onNodeClick: (shouldShowChoiceBar: boolean) => void;
handleShowTurnBar: (shouldShowTurnBar: boolean) => void
handleTurnBarTextChange: (newTurnBarText: string) => void
setPlayerTouched: (newPlayerTouch: number) => void;
playerTouched: number
changecptTour: (newcptTour : number) => void
addToHistory: (message : string) => void
solo : boolean
isDaily : boolean
isEasy: boolean
setNetwork: (network: Network) => void
showLast: boolean
setNetworkEnigme: (networkEnigme: Map<number, Pair<Indice, boolean>[]>) => void
askedWrong: boolean
setAskedWrong: (askedWrong: boolean) => void
setPlayerIndex: (playerIndex: number) => void
importToPdf: boolean
setImportToPdf: (imp: boolean) => void
importToJSON: boolean
setImportToJSON: (imp: boolean) => 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
}
let lastNodes: NodePerson[] = []
@ -51,7 +41,7 @@ let firstIndex = true
const TutorialGraph: React.FC<TutorialGraphProps> = ({onNodeClick, handleShowTurnBar, handleTurnBarTextChange, playerTouched, setPlayerTouched, changecptTour, solo, isDaily, isEasy, addToHistory, showLast, setNetwork, setNetworkEnigme, setPlayerIndex, askedWrong, setAskedWrong, importToPdf, setImportToPdf, importToJSON, setImportToJSON}) => {
const TutorialGraph: React.FC<TutorialGraphProps> = ({showLast, setNetwork, setPlayerIndex, handleShowTurnBar, handleTurnBarTextChange, addToHistory, setPlayerTouched, playerTouched, tutoStep, setTutoStep}) => {
let cptTour: number = 0
//* Gestion du temps :

127
cryptide_project/src/Pages/Tutorial.tsx
Unescape View File

@ -18,6 +18,8 @@ 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 JSZip from 'jszip';
/* nav */
@ -39,18 +41,22 @@ 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';
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 params = new URLSearchParams(window.location.search);
const navigationType = useNavigationType()
cptNavigation++
@ -61,32 +67,17 @@ const Tutorial = ({locale, changeLocale}) => {
}
}
//* Gestion solo
let IsSolo: boolean = true
const solotmp = params.get('solo');
if (solotmp == "false"){
IsSolo=false
}
//* Gestion daily
let isDaily: boolean = true
const isDailytmp = params.get('daily');
if (isDailytmp == "false"){
isDaily=false
}
let isEasy: boolean = true
const isEasytmp = params.get('easy');
if (isEasytmp == "false"){
isEasy=false
}
//* 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)
@ -117,8 +108,14 @@ const Tutorial = ({locale, changeLocale}) => {
}
}, [history]);
useEffect(() => {
if (user == null){
return
}
setPlayersData([user, new EasyBot("Bot1", "Bot1", ImgBot), new EasyBot("Bot2", "Bot2", ImgBot)])
}, [])
const {personNetwork, person, indices} = useGame()
const [showChoiceBar, setShowChoiceBar] = useState(false);
const [showTurnBar, setShowTurnBar] = useState(false);
@ -159,46 +156,7 @@ const Tutorial = ({locale, changeLocale}) => {
setPlayerIndex(playerIndex)
}
const generateTEX = async () => {
if (network != null && personNetwork != null && person != null){
const zip = new JSZip();
if (isDaily && networkEnigme != null){
const tex = generateLatexCodeEnigme(personNetwork, person, indices, network, networkEnigme)
const blob = new Blob([tex], { type: 'application/x-latex;charset=utf-8' });
zip.file('socialGraph.tex', tex);
}
else{
const tex = generateLatexCode(personNetwork, person, indices, network)
const blob = new Blob([tex], { type: 'application/x-latex;charset=utf-8' });
zip.file('socialGraph.tex', tex);
}
const imageNames = ['ballon-de-basket.png', 'ballon-de-foot.png', "baseball.png", "bowling.png", "tennis.png"]; // Liste des noms de fichiers d'images
const imagesFolder = 'Script';
for (const imageName of imageNames) {
const imageUrl = process.env.PUBLIC_URL + `/${imagesFolder}/${imageName}`;
const response = await fetch(imageUrl);
if (response.ok) {
const imageBlob = await response.blob();
zip.file(`${imageName}`, imageBlob);
} else {
console.error(`Erreur de chargement de l'image ${imageName}`);
}
}
const content = await zip.generateAsync({ type: 'blob' });
// Enregistre l'archive en tant que fichier
saveAs(content, 'social_graph.zip');
// Utiliser FileSaver pour télécharger le fichier
}
}
const resetGraph = () => {
setisLoading(true);
socket.emit("reset graph", socket.id)
@ -263,7 +221,6 @@ const Tutorial = ({locale, changeLocale}) => {
const [SwitchEnabled, setSwitchEnabled] = useState(false)
const allIndices = Stub.GenerateIndice()
const { indice, players, actualPlayerIndex} = useGame();
const nbPlayer = players.length;
const navdeduc = 'deduc?actualId=' + actualPlayerIndex + '&nbPlayer=' + nbPlayer;
@ -272,36 +229,24 @@ const Tutorial = ({locale, changeLocale}) => {
<div id="mainDiv">
{showTurnBar && <TurnBar text={turnBarText}/>}
<div id='graphDiv'>
<TutorialGraph onNodeClick={handleNodeClick}
<TutorialGraph tutoStep={tutoStep}
setTutoStep={setTutoStepData}
handleShowTurnBar={handleShowTurnBar}
handleTurnBarTextChange={handleTurnBarTextChange}
changecptTour={changecptTour}
addToHistory={addToHistory}
solo={IsSolo}
isDaily={isDaily}
isEasy={isEasy}
setPlayerTouched={handleSetPlayerTouched}
playerTouched={playerTouched}
setNetwork={setNetworkData}
setNetworkEnigme={setNetworkEnigmeData}
showLast={showLast}
setPlayerIndex={setPlayerIndexData}
askedWrong={askedWrong}
setAskedWrong={setAskedWrongData}
importToPdf={importToPdf}
setImportToPdf={setImportToPdfData}
importToJSON={importToJSON}
setImportToJSON={setImportToJSONData}/>
setPlayerIndex={setPlayerIndexData}/>
</div>
{(!isDaily || (isDaily && isEasy)) &&
<div className='historique' id="history-container">
{history.map((item, index) => (
<div key={index}>{item}</div>
))}
</div>
}
<div className='historique' id="history-container">
{history.map((item, index) => (
<div key={index}>{item}</div>
))}
</div>
<div className='paramDiv'>
<button className='button'
@ -372,13 +317,13 @@ const Tutorial = ({locale, changeLocale}) => {
<img src={MGlass} alt="indice" height="40"/>
</button>
{!IsSolo && <button className='button' onClick={setShowLastData}
<button className='button' onClick={setShowLastData}
style={{
backgroundColor: theme.colors.tertiary,
borderColor: theme.colors.secondary
}}>
<img src={ eye } alt="indice" height="40"/>
</button>}
</button>
</div>
{/*
@ -394,11 +339,11 @@ const Tutorial = ({locale, changeLocale}) => {
</Offcanvas>
*/}
{ !IsSolo &&
<div className='playerlistDiv'>
<PlayerList players={players} setPlayerTouched={handleSetPlayerTouched} playerTouched={playerTouched} playerIndex={playerIndex} askedWrong={askedWrong}/>
</div>
}
<div className='playerlistDiv'>
<PlayerList players={players} setPlayerTouched={handleSetPlayerTouched} playerTouched={playerTouched} playerIndex={playerIndex} askedWrong={askedWrong}/>
</div>
<Offcanvas show={show}
onHide={handleClose}

Write Preview
Loading…
Cancel
Save