diff --git a/editors/demo/src/HHMI/HHMI.js b/editors/demo/src/HHMI/HHMI.js index 2b562b31325db1591767e853b2675f6131a2025d..a232017d224a2e7f00137867d29435d4ec89bb56 100644 --- a/editors/demo/src/HHMI/HHMI.js +++ b/editors/demo/src/HHMI/HHMI.js @@ -170,7 +170,7 @@ const Hhmi = () => { value={content} readonly={readOnly} layout={HhmiLayout} - // onChange={source => console.log(source)} + onChange={source => console.log(source)} /> </> ); diff --git a/wax-prosemirror-services/src/FillTheGapQuestionService/components/FeedbackComponent.js b/wax-prosemirror-services/src/FillTheGapQuestionService/components/FeedbackComponent.js index 0928bfd37deb33ca92db14f7a45d32f2a1409b8c..71dc5a0e3aa3aaa7739fe7ceea4bf5f25d6e773b 100644 --- a/wax-prosemirror-services/src/FillTheGapQuestionService/components/FeedbackComponent.js +++ b/wax-prosemirror-services/src/FillTheGapQuestionService/components/FeedbackComponent.js @@ -37,42 +37,11 @@ export default ({ node, view, getPos, readOnly }) => { const { pmViews: { main }, } = context; - const [feedBack, setFeedBack] = useState(' '); - const [isFirstRun, setFirstRun] = useState(true); - const [typing, setTyping] = useState(false); + const [feedBack, setFeedBack] = useState(node.attrs.feedback); const feedBackRef = useRef(null); - useEffect(() => { - const allNodes = getNodes(main); - allNodes.forEach(singleNode => { - if (singleNode.node.attrs.id === node.attrs.id) { - if (!typing || context.transaction.meta.inputType === 'Redo') { - setFeedBack(singleNode.node.attrs.feedback); - } - if (!isFirstRun) { - if (singleNode.node.attrs.feedback === '') - setFeedBack(singleNode.node.attrs.feedback); - } - } - }); - }, [getNodes(main)]); - - const handleKeyDown = e => { - setTyping(true); - if (e.key === 'Backspace') { - main.dispatch( - main.state.tr.setSelection( - TextSelection.create(main.state.tr.doc, null), - ), - ); - } - }; - const feedBackInput = () => { setFeedBack(feedBackRef.current.value); - }; - - const saveFeedBack = () => { const allNodes = getNodes(main); allNodes.forEach(singleNode => { if (singleNode.node.attrs.id === node.attrs.id) { @@ -82,27 +51,18 @@ export default ({ node, view, getPos, readOnly }) => { feedback: feedBack, }), ); - setFirstRun(false); } }); return false; }; - const onFocus = () => { - main.dispatch( - main.state.tr.setSelection(TextSelection.create(main.state.tr.doc, null)), - ); - }; - return ( <FeedBack> <FeedBackLabel>Feedback</FeedBackLabel> <FeedBackInput + autoFocus="autoFocus" disabled={readOnly} - onBlur={saveFeedBack} onChange={feedBackInput} - onFocus={onFocus} - onKeyDown={handleKeyDown} placeholder="Insert feedback" ref={feedBackRef} type="text" diff --git a/wax-prosemirror-services/src/MatchingService/components/FeedbackComponent.js b/wax-prosemirror-services/src/MatchingService/components/FeedbackComponent.js index 7e95320cee5ac6c27b2b1edddd1695a306504abc..b32fba7fb4ccd1d0ea9bcdf7fae80d70c8c5c480 100644 --- a/wax-prosemirror-services/src/MatchingService/components/FeedbackComponent.js +++ b/wax-prosemirror-services/src/MatchingService/components/FeedbackComponent.js @@ -1,8 +1,7 @@ /* eslint-disable react/prop-types */ -import React, { useContext, useRef, useState, useEffect } from 'react'; +import React, { useContext, useRef, useState } from 'react'; import styled from 'styled-components'; -import { TextSelection } from 'prosemirror-state'; import { WaxContext } from 'wax-prosemirror-core'; import { DocumentHelpers } from 'wax-prosemirror-utilities'; @@ -36,42 +35,11 @@ export default ({ node, view, getPos, readOnly }) => { const { pmViews: { main }, } = context; - const [feedBack, setFeedBack] = useState(''); - const [isFirstRun, setFirstRun] = useState(true); - const [typing, setTyping] = useState(false); + const [feedBack, setFeedBack] = useState(node.attrs.feedback); const feedBackRef = useRef(null); - useEffect(() => { - const allNodes = getNodes(main); - allNodes.forEach(singleNode => { - if (singleNode.node.attrs.id === node.attrs.id) { - if (!typing || context.transaction.meta.inputType === 'Redo') { - setFeedBack(singleNode.node.attrs.feedback); - } - if (!isFirstRun) { - if (singleNode.node.attrs.feedback === '') - setFeedBack(singleNode.node.attrs.feedback); - } - } - }); - }, [getNodes(main)]); - - const handleKeyDown = e => { - setTyping(true); - if (e.key === 'Backspace') { - main.dispatch( - main.state.tr.setSelection( - TextSelection.create(main.state.tr.doc, null), - ), - ); - } - }; - const feedBackInput = () => { setFeedBack(feedBackRef.current.value); - }; - - const saveFeedBack = () => { const allNodes = getNodes(main); allNodes.forEach(singleNode => { if (singleNode.node.attrs.id === node.attrs.id) { @@ -81,27 +49,18 @@ export default ({ node, view, getPos, readOnly }) => { feedback: feedBack, }), ); - setFirstRun(false); } }); return false; }; - const onFocus = () => { - main.dispatch( - main.state.tr.setSelection(TextSelection.create(main.state.tr.doc, null)), - ); - }; - return ( <FeedBack> <FeedBackLabel>Feedback</FeedBackLabel> <FeedBackInput + autoFocus="autoFocus" disabled={readOnly} - onBlur={saveFeedBack} onChange={feedBackInput} - onFocus={onFocus} - onKeyDown={handleKeyDown} placeholder="Insert feedback" ref={feedBackRef} type="text" diff --git a/wax-prosemirror-services/src/MultipleChoiceQuestionService/components/FeedbackComponent.js b/wax-prosemirror-services/src/MultipleChoiceQuestionService/components/FeedbackComponent.js index 9de6f0ca48ca74626a494bb2448b048e05fccdd4..24fb9e3a83001105745707dbadc1ff2cc616ac91 100644 --- a/wax-prosemirror-services/src/MultipleChoiceQuestionService/components/FeedbackComponent.js +++ b/wax-prosemirror-services/src/MultipleChoiceQuestionService/components/FeedbackComponent.js @@ -1,8 +1,7 @@ /* eslint-disable react/prop-types */ -import React, { useContext, useRef, useState, useEffect } from 'react'; +import React, { useContext, useRef, useState } from 'react'; import styled from 'styled-components'; -import { TextSelection } from 'prosemirror-state'; import { WaxContext } from 'wax-prosemirror-core'; import { DocumentHelpers } from 'wax-prosemirror-utilities'; @@ -36,42 +35,11 @@ export default ({ node, view, getPos, readOnly }) => { pmViews: { main }, } = context; - const [feedBack, setFeedBack] = useState(' '); - const [isFirstRun, setFirstRun] = useState(true); - const [typing, setTyping] = useState(false); + const [feedBack, setFeedBack] = useState(node.attrs.feedback); const feedBackRef = useRef(null); - useEffect(() => { - const allNodes = getNodes(main); - allNodes.forEach(singleNode => { - if (singleNode.node.attrs.id === node.attrs.id) { - if (!typing || context.transaction.meta.inputType === 'Redo') { - setFeedBack(singleNode.node.attrs.feedback); - } - if (!isFirstRun) { - if (singleNode.node.attrs.feedback === '') - setFeedBack(singleNode.node.attrs.feedback); - } - } - }); - }, [getNodes(main)]); - - const handleKeyDown = e => { - setTyping(true); - if (e.key === 'Backspace') { - main.dispatch( - main.state.tr.setSelection( - TextSelection.create(main.state.tr.doc, null), - ), - ); - } - }; - const feedBackInput = () => { setFeedBack(feedBackRef.current.value); - }; - - const saveFeedBack = () => { const allNodes = getNodes(main); allNodes.forEach(singleNode => { if (singleNode.node.attrs.id === node.attrs.id) { @@ -81,26 +49,17 @@ export default ({ node, view, getPos, readOnly }) => { feedback: feedBack, }), ); - setFirstRun(false); } }); return false; }; - const onFocus = () => { - main.dispatch( - main.state.tr.setSelection(TextSelection.create(main.state.tr.doc, null)), - ); - }; - return ( <FeedBack> <FeedBackLabel>Feedback</FeedBackLabel> <FeedBackInput - onBlur={saveFeedBack} + autoFocus="autoFocus" onChange={feedBackInput} - onFocus={onFocus} - onKeyDown={handleKeyDown} placeholder="Insert feedback" readOnly={readOnly} ref={feedBackRef} diff --git a/wax-prosemirror-services/src/MultipleChoiceQuestionService/schema/multipleChoiceNode.js b/wax-prosemirror-services/src/MultipleChoiceQuestionService/schema/multipleChoiceNode.js index 5eea97cc09e8e5255771803c2f4cc866d3306062..daf0168fab9ba5dfdcb57788072292fa1f4c7ec3 100644 --- a/wax-prosemirror-services/src/MultipleChoiceQuestionService/schema/multipleChoiceNode.js +++ b/wax-prosemirror-services/src/MultipleChoiceQuestionService/schema/multipleChoiceNode.js @@ -7,7 +7,7 @@ const multipleChoiceNode = { feedback: { default: '' }, }, group: 'block questions', - content: 'block+', + content: 'block*', defining: true, parseDOM: [ { diff --git a/wax-prosemirror-services/src/MultipleDropDownService/components/FeedbackComponent.js b/wax-prosemirror-services/src/MultipleDropDownService/components/FeedbackComponent.js index d9a4b68f736181c504cb57f9d4d25688f50ad8ea..dcea073ae5e851e84a10f93095e1c10c62ad63fe 100644 --- a/wax-prosemirror-services/src/MultipleDropDownService/components/FeedbackComponent.js +++ b/wax-prosemirror-services/src/MultipleDropDownService/components/FeedbackComponent.js @@ -1,8 +1,7 @@ /* eslint-disable react/prop-types */ -import React, { useContext, useRef, useState, useEffect } from 'react'; +import React, { useContext, useRef, useState } from 'react'; import styled from 'styled-components'; -import { TextSelection } from 'prosemirror-state'; import { WaxContext } from 'wax-prosemirror-core'; import { DocumentHelpers } from 'wax-prosemirror-utilities'; @@ -37,42 +36,11 @@ export default ({ node, view, getPos, readOnly }) => { const { pmViews: { main }, } = context; - const [feedBack, setFeedBack] = useState(' '); - const [isFirstRun, setFirstRun] = useState(true); - const [typing, setTyping] = useState(false); + const [feedBack, setFeedBack] = useState(node.attrs.feedback); const feedBackRef = useRef(null); - useEffect(() => { - const allNodes = getNodes(main); - allNodes.forEach(singleNode => { - if (singleNode.node.attrs.id === node.attrs.id) { - if (!typing || context.transaction.meta.inputType === 'Redo') { - setFeedBack(singleNode.node.attrs.feedback); - } - if (!isFirstRun) { - if (singleNode.node.attrs.feedback === '') - setFeedBack(singleNode.node.attrs.feedback); - } - } - }); - }, [getNodes(main)]); - - const handleKeyDown = e => { - setTyping(true); - if (e.key === 'Backspace') { - main.dispatch( - main.state.tr.setSelection( - TextSelection.create(main.state.tr.doc, null), - ), - ); - } - }; - const feedBackInput = () => { setFeedBack(feedBackRef.current.value); - }; - - const saveFeedBack = () => { const allNodes = getNodes(main); allNodes.forEach(singleNode => { if (singleNode.node.attrs.id === node.attrs.id) { @@ -82,27 +50,18 @@ export default ({ node, view, getPos, readOnly }) => { feedback: feedBack, }), ); - setFirstRun(false); } }); return false; }; - const onFocus = () => { - main.dispatch( - main.state.tr.setSelection(TextSelection.create(main.state.tr.doc, null)), - ); - }; - return ( <FeedBack> <FeedBackLabel>Feedback</FeedBackLabel> <FeedBackInput + autoFocus="autoFocus" disabled={readOnly} - onBlur={saveFeedBack} onChange={feedBackInput} - onFocus={onFocus} - onKeyDown={handleKeyDown} placeholder="Insert feedback" ref={feedBackRef} type="text"