${textType({ - text: stem - })}
`, - ``, - GlobalFeedback({ feedback: globalFeedback }) - ] - })}`; -} diff --git a/client/src/components/GiftTemplate/templates/EssayTemplate.ts b/client/src/components/GiftTemplate/templates/EssayTemplate.ts new file mode 100644 index 0000000..5697846 --- /dev/null +++ b/client/src/components/GiftTemplate/templates/EssayTemplate.ts @@ -0,0 +1,27 @@ +import { TemplateOptions } from './types'; +import QuestionContainer from './QuestionContainerTemplate'; +import Title from './TitleTemplate'; +import {textType} from './TextTypeTemplate'; +import GlobalFeedbackTemplate from './GlobalFeedbackTemplate'; +import { ParagraphStyle, TextAreaStyle } from '../constants'; +import { state } from '.'; +import { EssayQuestion } from 'gift-pegjs'; + +type EssayOptions = TemplateOptions & EssayQuestion; + +export default function EssayTemplate({ title, formattedStem, formattedGlobalFeedback }: EssayOptions): string { + return `${QuestionContainer({ + children: [ + Title({ + type: 'Développement', + title: title + }), + `${textType(formattedStem)}
`, + ``, + (formattedGlobalFeedback && formattedGlobalFeedback.text) ? + GlobalFeedbackTemplate(formattedGlobalFeedback) : `` + ] + })}`; +} diff --git a/client/src/components/GiftTemplate/templates/GlobalFeedback.ts b/client/src/components/GiftTemplate/templates/GlobalFeedbackTemplate.ts similarity index 59% rename from client/src/components/GiftTemplate/templates/GlobalFeedback.ts rename to client/src/components/GiftTemplate/templates/GlobalFeedbackTemplate.ts index 6826c7c..2c5b6d4 100644 --- a/client/src/components/GiftTemplate/templates/GlobalFeedback.ts +++ b/client/src/components/GiftTemplate/templates/GlobalFeedbackTemplate.ts @@ -1,13 +1,12 @@ -import { TemplateOptions, Question } from './types'; -import textType from './TextType'; +import { TemplateOptions } from './types'; +import {textType} from './TextTypeTemplate'; import { state } from '.'; import { theme } from '../constants'; +import { TextFormat } from 'gift-pegjs'; -interface GlobalFeedbackOptions extends TemplateOptions { - feedback: Question['globalFeedback']; -} +type GlobalFeedbackOptions = TemplateOptions & TextFormat; -export default function GlobalFeedback({ feedback }: GlobalFeedbackOptions): string { +export default function GlobalFeedbackTemplate({ format, text }: GlobalFeedbackOptions): string { const Container = ` position: relative; margin-top: 1rem; @@ -19,9 +18,9 @@ export default function GlobalFeedback({ feedback }: GlobalFeedbackOptions): str box-shadow: 0px 2px 5px ${theme(state.theme, 'gray400', 'black800')}; `; - return feedback !== null + return (format && text) ? `${textType({ text: feedback })}
+${textType({format: format, text: text})}
${textType({ - text: stem - })}
`, + `${textType(formattedStem)}
`, MatchAnswers({ choices: matchPairs }), - GlobalFeedback({ feedback: globalFeedback }) + formattedGlobalFeedback ? GlobalFeedback(formattedGlobalFeedback) : '' ] })}`; } @@ -64,10 +63,10 @@ function MatchAnswers({ choices }: MatchAnswerOptions): string { const uniqueMatchOptions = Array.from(new Set(choices.map(({ subanswer }) => subanswer))); const result = choices - .map(({ subquestion }) => { + .map(({ formattedSubquestion }) => { return `${textType(formattedStem)}
`, + MultipleChoiceAnswers({ choices: choices }), + formattedGlobalFeedback ? GlobalFeedback(formattedGlobalFeedback) : '' + ] + })}`; +} diff --git a/client/src/components/GiftTemplate/templates/Numerical.ts b/client/src/components/GiftTemplate/templates/Numerical.ts deleted file mode 100644 index 08567a2..0000000 --- a/client/src/components/GiftTemplate/templates/Numerical.ts +++ /dev/null @@ -1,60 +0,0 @@ -import { TemplateOptions, Numerical as NumericalType, NumericalFormat } from './types'; -import QuestionContainer from './QuestionContainer'; -import Title from './Title'; -import textType from './TextType'; -import GlobalFeedback from './GlobalFeedback'; -import { ParagraphStyle, InputStyle } from '../constants'; -import { state } from '.'; - -type NumericalOptions = TemplateOptions & NumericalType; -type NumericalAnswerOptions = TemplateOptions & Pick${textType({ - text: stem - })}
`, - NumericalAnswers({ choices: choices }), - GlobalFeedback({ feedback: globalFeedback }) - ] - })}`; -} - -function NumericalAnswers({ choices }: NumericalAnswerOptions): string { - const placeholder = Array.isArray(choices) - ? choices.map(({ text }) => Answer(text)).join(', ') - : Answer(choices); - - return ` -${textType(formattedStem)}
`, + NumericalAnswers({ choices: choices }), + formattedGlobalFeedback ? GlobalFeedback(formattedGlobalFeedback) : '' + ] + })}`; +} + +function NumericalAnswers({ choices }: NumericalAnswerOptions): string { + const placeholder = choices.length > 1 + ? choices.map(choice => {Answer(choice)}).join(', ') + : Answer(choices[0]); + + return ` +${textType({ - text: stem - })}
`, + `${textType(formattedStem)}
`, Answers({ choices: choices }), - GlobalFeedback({ feedback: globalFeedback }) + formattedGlobalFeedback ? GlobalFeedback(formattedGlobalFeedback) : '' ] })}`; } function Answers({ choices }: AnswerOptions): string { const placeholder = choices - .map(({ text }) => textType({ text: text as TextFormat })) + .map(({ text }) => textType({ format: '', text: text })) .join(', '); return `${textType({ - text: stem - })}
`, - MultipleChoiceAnswers({ choices: choices }), - GlobalFeedback({ feedback: globalFeedback }) - ] - })}`; -} diff --git a/client/src/components/GiftTemplate/templates/TrueFalseTemplate.ts b/client/src/components/GiftTemplate/templates/TrueFalseTemplate.ts new file mode 100644 index 0000000..4effb4f --- /dev/null +++ b/client/src/components/GiftTemplate/templates/TrueFalseTemplate.ts @@ -0,0 +1,48 @@ +import { TemplateOptions } from './types'; +import QuestionContainer from './QuestionContainerTemplate'; +import {textType} from './TextTypeTemplate'; +import GlobalFeedback from './GlobalFeedbackTemplate'; +import MultipleChoiceAnswersTemplate from './MultipleChoiceAnswersTemplate'; +import Title from './TitleTemplate'; +import { TextChoice, TrueFalseQuestion } from 'gift-pegjs'; +import DOMPurify from 'dompurify'; + +type TrueFalseOptions = TemplateOptions & TrueFalseQuestion; + +export default function TrueFalseTemplate({ + isTrue, + title, + formattedStem, + trueFormattedFeedback, falseFormattedFeedback, + formattedGlobalFeedback +}: TrueFalseOptions): string { + const choices: TextChoice[] = [ + { + formattedText: { + format: 'moodle', + text: 'Vrai' + }, + isCorrect: isTrue, + formattedFeedback: trueFormattedFeedback + }, + { + formattedText: { + format: 'moodle', + text: 'Faux' + }, + isCorrect: !isTrue, + formattedFeedback: falseFormattedFeedback + } + ]; + return `${QuestionContainer({ + children: [ + Title({ + type: 'Vrai/Faux', + title: title + }), + ``, + MultipleChoiceAnswersTemplate({ choices: choices }), + formattedGlobalFeedback ? GlobalFeedback(formattedGlobalFeedback) : `` + ] + })}`; +} diff --git a/client/src/components/GiftTemplate/templates/index.ts b/client/src/components/GiftTemplate/templates/index.ts index 555b99d..0ed65e0 100644 --- a/client/src/components/GiftTemplate/templates/index.ts +++ b/client/src/components/GiftTemplate/templates/index.ts @@ -1,24 +1,25 @@ -import Category from './Category'; -import DescriptionTemplate from './Description'; -import Essay from './Essay'; -import Matching from './Matching'; -import MultipleChoice from './MultipleChoice'; -import Numerical from './Numerical'; -import ShortAnswer from './ShortAnswer'; -import TrueFalse from './TrueFalse'; -import Error from './Error'; + import { - GIFTQuestion, + ParsedGIFTQuestion as GIFTQuestion, // Category as CategoryType, // Description as DescriptionType, - MultipleChoice as MultipleChoiceType, - Numerical as NumericalType, - ShortAnswer as ShortAnswerType, + MultipleChoiceQuestion as MultipleChoiceType, + NumericalQuestion as NumericalType, + ShortAnswerQuestion as ShortAnswerType, // Essay as EssayType, - TrueFalse as TrueFalseType, - Matching as MatchingType, - DisplayOptions -} from './types'; + TrueFalseQuestion as TrueFalseType, + // MatchingQuestion as MatchingType, +} from 'gift-pegjs'; +import { DisplayOptions } from './types'; +import DescriptionTemplate from './DescriptionTemplate'; +import EssayTemplate from './EssayTemplate'; +import MatchingTemplate from './MatchingTemplate'; +import MultipleChoiceTemplate from './MultipleChoiceTemplate'; +import NumericalTemplate from './NumericalTemplate'; +import ShortAnswerTemplate from './ShortAnswerTemplate'; +import TrueFalseTemplate from './TrueFalseTemplate'; +import Error from './ErrorTemplate'; +import CategoryTemplate from './CategoryTemplate'; export const state: DisplayOptions = { preview: true, theme: 'light' }; @@ -37,21 +38,21 @@ export default function Template( // ...(keys as DescriptionType) // }); case 'MC': - return MultipleChoice({ + return MultipleChoiceTemplate({ ...(keys as MultipleChoiceType) }); case 'Numerical': - return Numerical({ ...(keys as NumericalType) }); + return NumericalTemplate({ ...(keys as NumericalType) }); case 'Short': - return ShortAnswer({ + return ShortAnswerTemplate({ ...(keys as ShortAnswerType) }); // case 'Essay': // return Essay({ ...(keys as EssayType) }); case 'TF': - return TrueFalse({ ...(keys as TrueFalseType) }); - case 'Matching': - return Matching({ ...(keys as MatchingType) }); + return TrueFalseTemplate({ ...(keys as TrueFalseType) }); + // case 'Matching': + // return Matching({ ...(keys as MatchingType) }); default: // TODO: throw error for unsupported question types? // throw new Error(`Unsupported question type: ${type}`); @@ -66,13 +67,13 @@ export function ErrorTemplate(text: string, options?: Partial${textType({ text: question.formattedGlobalFeedback })}
-