-
+
+
+ Question {questionInfos.question.id}/{questions.length}
@@ -66,31 +74,30 @@ const StudentModeQuiz: React.FC
= ({
handleOnSubmitAnswer={handleOnSubmitAnswer}
question={questionInfos.question as Question}
showAnswer={isAnswerSubmitted}
+ answer={answers[Number(questionInfos.question.id)-1]?.answer}
/>
-
-
- {/* }
- disabled={Number(questionInfos.question.id) <= 1}
- >
- Question précédente
- */}
-
-
- }
- disabled={Number(questionInfos.question.id) >= questions.length}
- >
- Question suivante
-
-
+
+
+
+
+
+
+
diff --git a/client/src/components/TeacherModeQuiz/TeacherModeQuiz.tsx b/client/src/components/TeacherModeQuiz/TeacherModeQuiz.tsx
index d4c7793..8925c09 100644
--- a/client/src/components/TeacherModeQuiz/TeacherModeQuiz.tsx
+++ b/client/src/components/TeacherModeQuiz/TeacherModeQuiz.tsx
@@ -1,55 +1,59 @@
// TeacherModeQuiz.tsx
import React, { useEffect, useState } from 'react';
-
import QuestionComponent from '../QuestionsDisplay/QuestionDisplay';
-
import '../../pages/Student/JoinRoom/joinRoom.css';
import { QuestionType } from '../../Types/QuestionType';
-// import { QuestionService } from '../../services/QuestionService';
import DisconnectButton from 'src/components/DisconnectButton/DisconnectButton';
import { Dialog, DialogTitle, DialogContent, DialogActions, Button } from '@mui/material';
import { Question } from 'gift-pegjs';
+import { AnswerSubmissionToBackendType } from 'src/services/WebsocketService';
+import { AnswerType } from 'src/pages/Student/JoinRoom/JoinRoom';
+// import { AnswerType } from 'src/pages/Student/JoinRoom/JoinRoom';
interface TeacherModeQuizProps {
questionInfos: QuestionType;
- submitAnswer: (_answer: string | number | boolean, _idQuestion: number) => void;
+ answers: AnswerSubmissionToBackendType[];
+ submitAnswer: (_answer: AnswerType, _idQuestion: number) => void;
disconnectWebSocket: () => void;
}
const TeacherModeQuiz: React.FC
= ({
questionInfos,
+ answers,
submitAnswer,
disconnectWebSocket
}) => {
const [isAnswerSubmitted, setIsAnswerSubmitted] = useState(false);
const [isFeedbackDialogOpen, setIsFeedbackDialogOpen] = useState(false);
- const [feedbackMessage, setFeedbackMessage] = useState('');
-
- const renderFeedbackMessage = (answer: string) => {
+ const [answer, setAnswer] = useState();
- if(answer === 'true' || answer === 'false'){
- return (
- Votre réponse est: {answer==="true" ? 'Vrai' : 'Faux'}
- )
- }
- else{
- return (
-
- Votre réponse est: {answer.toString()}
-
- );}
- };
+
+ // arrive here the first time after waiting for next question
useEffect(() => {
- // Close the feedback dialog when the question changes
- handleFeedbackDialogClose();
- setIsAnswerSubmitted(false);
-
- }, [questionInfos.question]);
+ console.log(`TeacherModeQuiz: useEffect: answers: ${JSON.stringify(answers)}`);
+ console.log(`TeacherModeQuiz: useEffect: questionInfos.question.id: ${questionInfos.question.id} answer: ${answer}`);
+ const oldAnswer = answers[Number(questionInfos.question.id) -1 ]?.answer;
+ console.log(`TeacherModeQuiz: useEffect: oldAnswer: ${oldAnswer}`);
+ setAnswer(oldAnswer);
+ setIsFeedbackDialogOpen(false);
+ }, [questionInfos.question, answers]);
- const handleOnSubmitAnswer = (answer: string | number | boolean) => {
+ // handle showing the feedback dialog
+ useEffect(() => {
+ console.log(`TeacherModeQuiz: useEffect: answer: ${answer}`);
+ setIsAnswerSubmitted(answer !== undefined);
+ setIsFeedbackDialogOpen(answer !== undefined);
+ }, [answer]);
+
+ useEffect(() => {
+ console.log(`TeacherModeQuiz: useEffect: isAnswerSubmitted: ${isAnswerSubmitted}`);
+ setIsFeedbackDialogOpen(isAnswerSubmitted);
+ }, [isAnswerSubmitted]);
+
+ const handleOnSubmitAnswer = (answer: AnswerType) => {
const idQuestion = Number(questionInfos.question.id) || -1;
submitAnswer(answer, idQuestion);
- setFeedbackMessage(renderFeedbackMessage(answer.toString()));
+ // setAnswer(answer);
setIsFeedbackDialogOpen(true);
};
@@ -60,21 +64,21 @@ const TeacherModeQuiz: React.FC = ({
return (
-
+
-
-
-
-
Question {questionInfos.question.id}
-
-
-
+
+
+
Question {questionInfos.question.id}
- {isAnswerSubmitted ? (
+
+
+
+
+ {isAnswerSubmitted ? (
En attente pour la prochaine question...
@@ -82,6 +86,7 @@ const TeacherModeQuiz: React.FC
= ({
)}
@@ -92,20 +97,21 @@ const TeacherModeQuiz: React.FC = ({
Rétroaction
- {feedbackMessage}
-
Question :
+ wordWrap: 'break-word',
+ whiteSpace: 'pre-wrap',
+ maxHeight: '400px',
+ overflowY: 'auto',
+ }}>
+
Question :
+