make activity editor textfields multiline. make exercise texts allow html embedding

This commit is contained in:
Hikmet 2024-02-06 15:41:20 +03:00
parent 03f0a7a406
commit 6a5d832ac9
6 changed files with 30 additions and 12 deletions

View File

@ -37,7 +37,14 @@ export function DragIntoBlanksExercise() {
{item.atoms.map((piece) => {
const { id, type } = piece;
if (type === "text") {
return <p key={id}>{piece.value}</p>;
return (
<p
key={id}
dangerouslySetInnerHTML={{
__html: piece.value,
}}
/>
);
} else if (type === "blank") {
const reply = ExerciseServices.getReply(
id,

View File

@ -30,7 +30,7 @@ export function MultipleChoiceExercise() {
}`}
>
<section aria-label="soru">
<p>{questionText}</p>
<p dangerouslySetInnerHTML={{ __html: questionText }} />
<div className={"choices"}>
{choices.map((choice, i) => {
return (
@ -51,9 +51,10 @@ export function MultipleChoiceExercise() {
id={`choice-${index}-${i}`}
name={`choice-${index}`}
/>
<label htmlFor={`choice-${index}-${i}`}>
{choice}
</label>
<label
htmlFor={`choice-${index}-${i}`}
dangerouslySetInnerHTML={{ __html: choice }}
/>
</div>
);
})}

View File

@ -38,7 +38,10 @@ export function TrueFalseExercise() {
key={id}
>
<section aria-label="soru">
<p className={styles["question"]}>{questionText}</p>
<p
className={styles["question"]}
dangerouslySetInnerHTML={{ __html: questionText }}
/>
<div className={styles["radio-buttons"]}>
<div className={styles["radio-button"]}>
<input

View File

@ -22,7 +22,12 @@ export function TypeInBlanksExercise() {
const { id, type } = piece;
if (type === "text") {
return <p key={id}>{piece.value}</p>;
return (
<p
key={id}
dangerouslySetInnerHTML={{ __html: piece.value }}
/>
);
}
const reply = ExerciseServices.getReply(id, replies);

View File

@ -2,12 +2,12 @@ import {
Fab,
FormControlLabel,
IconButton,
Input,
List,
ListItem,
Radio,
RadioGroup,
Stack,
TextField,
} from "@mui/material";
import { Add, Clear } from "@mui/icons-material";
import useViewModelContext from "@/features/activity_editor/view_model";
@ -64,7 +64,8 @@ export default function TrueFalseExerciseForm() {
</Stack>
}
>
<Input
<TextField
multiline
fullWidth
sx={{ marginRight: "13rem" }}
value={questionText}

View File

@ -1,11 +1,10 @@
import { Clear } from "@mui/icons-material";
import { IconButton, Input, List, ListItem } from "@mui/material";
import { IconButton, List, ListItem, TextField } from "@mui/material";
import useViewModelContext from "@/features/activity_editor/view_model";
import { AddFab } from "@/core/components/add_fab";
import { ActivityListItemPaper } from "@/core/components/list_item_paper";
import { nanoid } from "nanoid";
import * as AdminFIBEServices from "@/lib/exercise/fill_in_blanks_exercise/admin_fibe_services";
import { useState } from "react";
export default function TypeOrDragExerciseForm() {
const viewModel = useViewModelContext()!;
@ -31,7 +30,9 @@ export default function TypeOrDragExerciseForm() {
</IconButton>
}
>
<Input
<TextField
multiline
size="medium"
fullWidth
style={{ marginRight: "1rem" }}
value={AdminFIBEServices.formTextFromTemplate(