Merge branch 'true-false-single' into 'master'

true false single

See merge request !357

editors/demo/src/HHMI/HHMI.js

@@ -15,16 +15,7 @@ const renderImage = file => {
   });
 };
 
-const t = `<p class="paragraph">Based on the equation below</p>
-<math-display class="math-node">x + y = 5</math-display><p class="paragraph">Which ones are correct?</p>
-<p class="paragraph"></p>
-<div id="" class="multiple-choice"><div class="multiple-choice-option" id="d7b65415-ff82-446f-afa4-accaa3837f4a" correct="false" feedback="">
-<p class="paragraph">answer 1</p><p class="paragraph"><math-inline class="math-node">x+y=1</math-inline></p></div>
-<div class="multiple-choice-option" id="e7d6bb2f-7cd7-44f1-92a0-281e72157538" correct="true" feedback="">
-<p class="paragraph">answer 2</p></div><div class="multiple-choice-option" id="d6fc749f-afae-4203-9562-d68c380a86e5" correct="false" feedback="1111111">
-<p class="paragraph">answer 3</p></div></div>
-
-<div id="" class="fill-the-gap"><p class="paragraph">A <span id="bfd4376c-4424-455e-9187-f53282fa1024" class="fill-the-gap">DNA</span> molecule is very long and usually consists of hundreds or thousands of genes.</p><p class="paragraph">An electron having a certain discrete amount of <span id="14dedf44-728f-4384-835f-e3af82b25623" class="fill-the-gap">energy</span> is something like a ball on a staircase.</p></div><p class="paragraph"></p>`;
+const t = `<p class="paragraph"></p><div id="84db3734-94ed-4dd0-82bb-15404854df0f" class="multiple-choice"><div class="multiple-choice-question" id="38de8538-647a-489d-8474-f92d0d256c32"><p class="paragraph">question</p></div><div class="multiple-choice-option" id="debb868e-bbfe-4ba2-bf93-c963153ff791" correct="false" feedback=""><p class="paragraph">answer 1</p></div><div class="multiple-choice-option" id="810bcf10-4fcb-4d1e-9dab-ce35cbd28527" correct="false" feedback=""><p class="paragraph">answer 2</p></div></div>`;
 
 const Hhmi = () => {
   return (

wax-prosemirror-services/src/MultipleChoiceQuestionService/TrueFalseQuestionService/QuestionTrueFalseNodeView.js

 import AbstractNodeView from '../../PortalService/AbstractNodeView';
 
-export default class QuestionNodeView extends AbstractNodeView {
+export default class QuestionTrueFalseNodeView extends AbstractNodeView {
   constructor(
     node,
     view,

wax-prosemirror-services/src/MultipleChoiceQuestionService/TrueFalseSingleCorrectQuestionService/QuestionTrueFalseSingleNodeView.js

+import AbstractNodeView from '../../PortalService/AbstractNodeView';
+
+export default class QuestionTrueFalseSingleNodeView extends AbstractNodeView {
+  constructor(
+    node,
+    view,
+    getPos,
+    decorations,
+    createPortal,
+    Component,
+    context,
+  ) {
+    super(node, view, getPos, decorations, createPortal, Component, context);
+
+    this.node = node;
+    this.outerView = view;
+    this.getPos = getPos;
+    this.context = context;
+  }
+
+  static name() {
+    return 'question_node_true_false_single';
+  }
+
+  update(node) {
+    this.node = node;
+    if (this.context.view[node.attrs.id]) {
+      const { state } = this.context.view[node.attrs.id];
+      const start = node.content.findDiffStart(state.doc.content);
+      if (start != null) {
+        let { a: endA, b: endB } = node.content.findDiffEnd(state.doc.content);
+        const overlap = start - Math.min(endA, endB);
+        if (overlap > 0) {
+          endA += overlap;
+          endB += overlap;
+        }
+        this.context.view[node.attrs.id].dispatch(
+          state.tr
+            .replace(start, endB, node.slice(start, endA))
+            .setMeta('fromOutside', true),
+        );
+      }
+    }
+
+    return true;
+  }
+
+  stopEvent(event) {
+    if (event.target.type === 'text') {
+      return true;
+    }
+    const innerView = this.context.view[this.node.attrs.id];
+    return innerView && innerView.dom.contains(event.target);
+  }
+}

wax-prosemirror-services/src/MultipleChoiceQuestionService/TrueFalseSingleCorrectQuestionService/TrueFalseSingleCorrectQuestion.js

@@ -19,8 +19,9 @@ class TrueFalseSingleCorrectQuestion extends Tools {
       helpers.createOptions(
         view,
         context,
-        view.state.config.schema.nodes.true_false_single_correct,
         view.state.config.schema.nodes.true_false_single_correct_container,
+        view.state.config.schema.nodes.question_node_true_false_single,
+        view.state.config.schema.nodes.true_false_single_correct,
       );
     };
   }

wax-prosemirror-services/src/MultipleChoiceQuestionService/TrueFalseSingleCorrectQuestionService/TrueFalseSingleCorrectQuestionService.js

@@ -2,8 +2,11 @@ import Service from '../../Service';
 import TrueFalseSingleCorrectQuestion from './TrueFalseSingleCorrectQuestion';
 import trueFalseSingleCorrectNode from './schema/trueFalseSingleCorrectNode';
 import trueFalseSingleCorrectContainerNode from './schema/trueFalseSingleCorrectContainerNode';
-import QuestionComponent from './components/QuestionComponent';
+import questionTrueFalseSingleNode from './schema/questionTrueFalseSingleNode';
+import AnswerComponent from './components/AnswerComponent';
 import TrueFalseSingleCorrectNodeView from './TrueFalseSingleCorrectNodeView';
+import QuestionTrueFalseSingleNodeView from './QuestionTrueFalseSingleNodeView';
+import QuestionComponent from '../components/QuestionComponent';
 
 class TrueFalseSingleCorrectQuestionService extends Service {
   register() {
@@ -21,11 +24,21 @@ class TrueFalseSingleCorrectQuestionService extends Service {
       true_false_single_correct_container: trueFalseSingleCorrectContainerNode,
     });
 
+    createNode({
+      question_node_true_false_single: questionTrueFalseSingleNode,
+    });
+
     addPortal({
-      nodeView: TrueFalseSingleCorrectNodeView,
+      nodeView: QuestionTrueFalseSingleNodeView,
       component: QuestionComponent,
       context: this.app,
     });
+
+    addPortal({
+      nodeView: TrueFalseSingleCorrectNodeView,
+      component: AnswerComponent,
+      context: this.app,
+    });
   }
 }
 

wax-prosemirror-services/src/MultipleChoiceQuestionService/TrueFalseSingleCorrectQuestionService/components/SwitchComponent.js

@@ -82,11 +82,11 @@ const CustomSwitch = ({ node, getPos }) => {
   return (
     <StyledSwitch
       checked={checked}
-      checkedChildren="YES"
-      label="Correct?"
+      checkedChildren="True"
+      label="True/false?"
       labelPosition="left"
       onChange={handleChange}
-      unCheckedChildren="NO"
+      unCheckedChildren="False"
     />
   );
 };

wax-prosemirror-services/src/MultipleChoiceQuestionService/TrueFalseSingleCorrectQuestionService/schema/questionTrueFalseSingleNode.js

+import { v4 as uuidv4 } from 'uuid';
+
+const questionTrueFalseNode = {
+  attrs: {
+    class: { default: 'true-false-question-single' },
+    id: { default: uuidv4() },
+  },
+  group: 'block questions',
+  content: 'block*',
+  defining: true,
+
+  // atom: true,
+  parseDOM: [
+    {
+      tag: 'div.true-false-question-single',
+      getAttrs(dom) {
+        return {
+          id: dom.getAttribute('id'),
+          class: dom.getAttribute('class'),
+        };
+      },
+    },
+  ],
+  toDOM: node => ['div', node.attrs, 0],
+};
+
+export default questionTrueFalseNode;

wax-prosemirror-services/src/MultipleChoiceQuestionService/helpers/helpers.js

@@ -46,13 +46,7 @@ const checkifEmpty = view => {
   }
 };
 
-const createOptions = (
-  main,
-  context,
-  parentType,
-  questionType,
-  answerTtype,
-) => {
+const createOptions = (main, context, parentType, questionType, answerType) => {
   checkifEmpty(main);
   const { state, dispatch } = main;
   /* Create Wrapping */
@@ -60,7 +54,7 @@ const createOptions = (
   const range = $from.blockRange($to);
   const { tr } = main.state;
 
-  const wrapping = range && findWrapping(range, parentType, { id: uuidv4 });
+  const wrapping = range && findWrapping(range, parentType, { id: uuidv4() });
   if (!wrapping) return false;
   tr.wrap(range, wrapping);
 
@@ -75,10 +69,10 @@ const createOptions = (
   const question = questionType.create({ id: uuidv4() }, Fragment.empty);
 
   /* create First Option */
-  const firstOption = answerTtype.create({ id: uuidv4() }, Fragment.empty);
+  const firstOption = answerType.create({ id: uuidv4() }, Fragment.empty);
 
   /* create Second Option */
-  const secondOption = answerTtype.create({ id: uuidv4() }, Fragment.empty);
+  const secondOption = answerType.create({ id: uuidv4() }, Fragment.empty);
   tr.replaceSelectionWith(question);
   tr.replaceSelectionWith(firstOption);
   tr.setSelection(TextSelection.create(tr.doc, newPos + 1));

wax-prosemirror-services/src/MultipleChoiceQuestionService/schema/questionNode.js

@@ -9,7 +9,6 @@ const questionNode = {
   content: 'block*',
   defining: true,
 
-  // atom: true,
   parseDOM: [
     {
       tag: 'div.multiple-choice-question',