From 8669ef462d2a7a8e19186e2b14ce01f86aa57edc Mon Sep 17 00:00:00 2001 From: Carlos Mesquita Date: Mon, 19 Aug 2024 16:42:14 +0100 Subject: [PATCH] Commented all related to shuffle --- src/components/Exercises/FillBlanks/index.tsx | 16 +++--- src/components/Exercises/MultipleChoice.tsx | 22 ++++---- src/components/Solutions/MultipleChoice.tsx | 50 +++++++++++-------- src/exams/Level.tsx | 44 ++++++++-------- 4 files changed, 71 insertions(+), 61 deletions(-) diff --git a/src/components/Exercises/FillBlanks/index.tsx b/src/components/Exercises/FillBlanks/index.tsx index bd6a1c4c..19439791 100644 --- a/src/components/Exercises/FillBlanks/index.tsx +++ b/src/components/Exercises/FillBlanks/index.tsx @@ -20,7 +20,7 @@ const FillBlanks: React.FC = ({ onNext, onBack, }) => { - const { shuffleMaps } = useExamStore((state) => state); + //const { shuffleMaps } = useExamStore((state) => state); const [answers, setAnswers] = useState<{ id: string; solution: string }[]>(userSolutions); const hasExamEnded = useExamStore((state) => state.hasExamEnded); @@ -62,7 +62,7 @@ const FillBlanks: React.FC = ({ return solution.toLowerCase() === option.toLowerCase(); } else if ('letter' in option) { return solution.toLowerCase() === option.word.toLowerCase(); - } else if ('options' in option) { + } /*else if ('options' in option) { if (shuffleMaps.length !== 0) { const shuffleMap = shuffleMaps.find((map) => map.id == x.id) if (!shuffleMap) { @@ -73,7 +73,7 @@ const FillBlanks: React.FC = ({ } return solution.toLowerCase() === (option.options[x.solution as keyof typeof option.options] || '').toLowerCase(); - } + }*/ return false; }).length; @@ -129,7 +129,7 @@ const FillBlanks: React.FC = ({ setAnswers((prev) => [...prev.filter((x) => x.id !== id), { id: id, solution: value }]); } - const getShuffles = () => { + /*const getShuffles = () => { let shuffle = {}; if (shuffleMaps.length !== 0) { shuffle = { @@ -139,7 +139,7 @@ const FillBlanks: React.FC = ({ } } return shuffle; - } + }*/ return ( <> @@ -166,7 +166,7 @@ const FillBlanks: React.FC = ({
Options
- {currentMCSelection.selection?.options && Object.entries(currentMCSelection.selection.options).map(([key, value]) => { + {currentMCSelection.selection?.options && Object.entries(currentMCSelection.selection.options).sort((a, b) => a[0].localeCompare(b[0])).map(([key, value]) => { return diff --git a/src/components/Exercises/MultipleChoice.tsx b/src/components/Exercises/MultipleChoice.tsx index 1c07e9af..70d8a3ba 100644 --- a/src/components/Exercises/MultipleChoice.tsx +++ b/src/components/Exercises/MultipleChoice.tsx @@ -76,7 +76,7 @@ function Question({ export default function MultipleChoice({ id, prompt, type, questions, userSolutions, onNext, onBack }: MultipleChoiceExercise & CommonProps) { const [answers, setAnswers] = useState<{ question: string; option: string }[]>(userSolutions); - const { shuffleMaps } = useExamStore((state) => state); + //const { shuffleMaps } = useExamStore((state) => state); const { questionIndex, setQuestionIndex } = useExamStore((state) => state); const { userSolutions: storeUserSolutions, setUserSolutions } = useExamStore((state) => state); const hasExamEnded = useExamStore((state) => state.hasExamEnded); @@ -109,12 +109,12 @@ export default function MultipleChoice({ id, prompt, type, questions, userSoluti }); let isSolutionCorrect; - if (shuffleMaps.length == 0) { - isSolutionCorrect = matchingQuestion?.solution === x.option; - } else { - const shuffleMap = shuffleMaps.find((map) => map.id == x.question) - isSolutionCorrect = shuffleMap?.map[x.option] == matchingQuestion?.solution; - } + //if (shuffleMaps.length == 0) { + isSolutionCorrect = matchingQuestion?.solution === x.option; + //} else { + // const shuffleMap = shuffleMaps.find((map) => map.id == x.question) + // isSolutionCorrect = shuffleMap?.map[x.option] == matchingQuestion?.solution; + //} return isSolutionCorrect || false; }).length; const missing = total - correct; @@ -122,7 +122,7 @@ export default function MultipleChoice({ id, prompt, type, questions, userSoluti return { total, correct, missing }; }; - const getShuffles = () => { + /*const getShuffles = () => { let shuffle = {}; if (shuffleMaps.length !== 0) { shuffle = { @@ -132,11 +132,11 @@ export default function MultipleChoice({ id, prompt, type, questions, userSoluti } } return shuffle; - } + }*/ const next = () => { if (questionIndex === questions.length - 1) { - onNext({ exercise: id, solutions: answers, score: calculateScore(), type, ...getShuffles() }); + onNext({ exercise: id, solutions: answers, score: calculateScore(), type, });//...getShuffles() }); } else { setQuestionIndex(questionIndex + 1); } @@ -145,7 +145,7 @@ export default function MultipleChoice({ id, prompt, type, questions, userSoluti const back = () => { if (questionIndex === 0) { - onBack({ exercise: id, solutions: answers, score: calculateScore(), type, ...getShuffles() }); + onBack({ exercise: id, solutions: answers, score: calculateScore(), type, });// ...getShuffles() }); } else { setQuestionIndex(questionIndex - 1); } diff --git a/src/components/Solutions/MultipleChoice.tsx b/src/components/Solutions/MultipleChoice.tsx index 2c3f35e2..d3ecfabc 100644 --- a/src/components/Solutions/MultipleChoice.tsx +++ b/src/components/Solutions/MultipleChoice.tsx @@ -17,26 +17,36 @@ function Question({ }: MultipleChoiceQuestion & { userSolution: string | undefined; onSelectOption?: (option: string) => void; showSolution?: boolean }) { const { userSolutions } = useExamStore((state) => state); + /* + const getShuffledOptions = (options: {id: string, text: string}[], questionShuffleMap: ShuffleMap) => { + const shuffledOptions = ['A', 'B', 'C', 'D'].map(newId => { + const originalId = questionShuffleMap.map[newId]; + const originalOption = options.find(option => option.id === originalId); + return { + id: newId, + text: originalOption!.text + }; + }); + return shuffledOptions; + } + + const getShuffledSolution = (originalSolution: string, questionShuffleMap: ShuffleMap) => { + for (const [newPosition, originalPosition] of Object.entries(questionShuffleMap.map)) { + if (originalPosition === originalSolution) { + return newPosition; + } + } + return originalSolution; + } + const questionShuffleMap = userSolutions.reduce((foundMap, userSolution) => { if (foundMap) return foundMap; return userSolution.shuffleMaps?.find(map => map.id === id) || null; }, null as ShuffleMap | null); - - const shuffledOptions = new Array(options.length); - options.forEach(option => { - const newId = questionShuffleMap?.map[option.id]; - const newIndex = options.findIndex(opt => opt.id === newId); - shuffledOptions[newIndex] = option; - }); - - const lettersMap = ['A', 'B', 'C', 'D']; - const optionsWithLetters = shuffledOptions.map((option, index) => ({ - ...option, - id: lettersMap[index] - })); - - const questionOptions = questionShuffleMap ? optionsWithLetters : options; - const newQuestionSolution = questionShuffleMap ? questionShuffleMap.map[solution] : solution; + */ + + const questionOptions = options; // questionShuffleMap ? getShuffledOptions(options as {id: string, text: string}[], questionShuffleMap) : options; + const newSolution = solution; //questionShuffleMap ? getShuffledSolution(solution, questionShuffleMap) : solution; const renderPrompt = (prompt: string) => { return reactStringReplace(prompt, /(()[\w\s']+(<\/u>))/g, (match) => { @@ -46,11 +56,11 @@ function Question({ }; const optionColor = (option: string) => { - if (option === newQuestionSolution && !userSolution) { + if (option === newSolution && !userSolution) { return "!border-mti-gray-davy !text-mti-gray-davy"; } - if (option === newQuestionSolution) { + if (option === newSolution) { return "!border-mti-purple-light !text-mti-purple-light"; } @@ -77,8 +87,8 @@ function Question({ "flex flex-col items-center border border-mti-gray-platinum p-4 px-8 rounded-xl gap-4 cursor-pointer bg-white relative", optionColor(option!.id), )}> - {option?.id} - {`Option + {option?.id} + {"src" in option && {`Option}
))} {variant === "text" && diff --git a/src/exams/Level.tsx b/src/exams/Level.tsx index 2cd591f4..ea360929 100644 --- a/src/exams/Level.tsx +++ b/src/exams/Level.tsx @@ -171,7 +171,7 @@ export default function Level({ exam, showSolutions = false, onFinish, editing = const { partIndex, setPartIndex } = useExamStore((state) => state); const { exerciseIndex, setExerciseIndex } = useExamStore((state) => state); const [storeQuestionIndex, setStoreQuestionIndex] = useExamStore((state) => [state.questionIndex, state.setQuestionIndex]); - const [shuffleMaps, setShuffleMaps] = useExamStore((state) => [state.shuffleMaps, state.setShuffleMaps]) + //const [shuffleMaps, setShuffleMaps] = useExamStore((state) => [state.shuffleMaps, state.setShuffleMaps]) const [currentExercise, setCurrentExercise] = useState(); const scrollToTop = () => Array.from(document.getElementsByTagName("body")).forEach((body) => body.scrollTo(0, 0)); @@ -180,11 +180,11 @@ export default function Level({ exam, showSolutions = false, onFinish, editing = const [contextWord, setContextWord] = useState(undefined); const [contextWordLine, setContextWordLine] = useState(undefined); - useEffect(() => { + /*useEffect(() => { if (showSolutions && userSolutions[exerciseIndex].shuffleMaps) { setShuffleMaps(userSolutions[exerciseIndex].shuffleMaps as ShuffleMap[]) } - }, [showSolutions]) + }, [showSolutions])*/ useEffect(() => { if (hasExamEnded && exerciseIndex === -1) { @@ -214,8 +214,9 @@ export default function Level({ exam, showSolutions = false, onFinish, editing = userSolutions: userSolutions.find((x) => x.exercise === exercise.id)?.solutions || [], }; - if (exam.shuffle && exercise.type === "multipleChoice") { + /*if (exam.shuffle && exercise.type === "multipleChoice") { if (shuffleMaps.length == 0 && !showSolutions) { + console.log("Shuffling answers"); const newShuffleMaps: ShuffleMap[] = []; exercise.questions = exercise.questions.map(question => { @@ -242,6 +243,7 @@ export default function Level({ exam, showSolutions = false, onFinish, editing = setShuffleMaps(newShuffleMaps); } else { + console.log("Retrieving shuffles"); exercise.questions = exercise.questions.map(question => { const questionShuffleMap = shuffleMaps.find(map => map.id === question.id); if (questionShuffleMap) { @@ -261,20 +263,21 @@ export default function Level({ exam, showSolutions = false, onFinish, editing = exercise.words = exercise.words.map(word => { if ('options' in word) { const options = { ...word.options }; - const shuffledKeys = Object.keys(options).sort(() => Math.random() - 0.5); - + const originalKeys = Object.keys(options); + const shuffledKeys = [...originalKeys].sort(() => Math.random() - 0.5); + const newOptions = shuffledKeys.reduce((acc, key, index) => { - acc[key as keyof typeof options] = options[shuffledKeys[index] as keyof typeof options]; + acc[key as keyof typeof options] = options[originalKeys[index] as keyof typeof options]; return acc; }, {} as { [key in keyof typeof options]: string }); - - const optionMapping = shuffledKeys.reduce((acc, key, index) => { - acc[key as keyof typeof options] = Object.keys(options)[index] as keyof typeof options; + + const optionMapping = originalKeys.reduce((acc, key, index) => { + acc[key as keyof typeof options] = shuffledKeys[index]; return acc; }, {} as { [key in keyof typeof options]: string }); - + newShuffleMaps.push({ id: word.id, map: optionMapping }); - + return { ...word, options: newOptions }; } return word; @@ -283,20 +286,17 @@ export default function Level({ exam, showSolutions = false, onFinish, editing = setShuffleMaps(newShuffleMaps); } } - + */ return exercise; }; useEffect(() => { - const newExercise = getExercise(); - setCurrentExercise(newExercise); + //console.log("Getting another exercise"); + //setShuffleMaps([]); + setCurrentExercise(getExercise()); }, [partIndex, exerciseIndex]); - //useShuffledMultipleChoiceOptions(currentExercise, exam.shuffle, storeQuestionIndex, shuffleMaps, setShuffleMaps, setCurrentExercise); - //useShuffledFillBlanksOptions(currentExercise, exam.shuffle, storeQuestionIndex, shuffleMaps, setShuffleMaps, setCurrentExercise); - - useEffect(() => { const regex = /.*?['"](.*?)['"] in line (\d+)\?$/; if (currentExercise && currentExercise.type === "multipleChoice") { @@ -321,7 +321,7 @@ export default function Level({ exam, showSolutions = false, onFinish, editing = setContextWord(undefined); } } - }, [storeQuestionIndex, contextWordLine, exerciseIndex, partIndex, shuffleMaps]); + }, [storeQuestionIndex, contextWordLine, exerciseIndex, partIndex]); //, shuffleMaps]); const nextExercise = (solution?: UserSolution) => { scrollToTop(); @@ -362,9 +362,9 @@ export default function Level({ exam, showSolutions = false, onFinish, editing = if (solution) { let stat = { ...solution, module: "level" as Module, exam: exam.id } - if (exam.shuffle) { + /*if (exam.shuffle) { stat.shuffleMaps = shuffleMaps - } + }*/ onFinish([...userSolutions.filter((x) => x.exercise !== solution.exercise), { ...stat }]); } else { onFinish(userSolutions);