Skip to content
Snippets Groups Projects
Commit 84b78aa5 authored by chris's avatar chris
Browse files

fix feedback insert

parent 459f1aa7
No related branches found
No related tags found
1 merge request!416fix feedback insert
...@@ -170,7 +170,7 @@ const Hhmi = () => { ...@@ -170,7 +170,7 @@ const Hhmi = () => {
value={content} value={content}
readonly={readOnly} readonly={readOnly}
layout={HhmiLayout} layout={HhmiLayout}
// onChange={source => console.log(source)} onChange={source => console.log(source)}
/> />
</> </>
); );
......
...@@ -37,42 +37,11 @@ export default ({ node, view, getPos, readOnly }) => { ...@@ -37,42 +37,11 @@ export default ({ node, view, getPos, readOnly }) => {
const { const {
pmViews: { main }, pmViews: { main },
} = context; } = context;
const [feedBack, setFeedBack] = useState(' '); const [feedBack, setFeedBack] = useState(node.attrs.feedback);
const [isFirstRun, setFirstRun] = useState(true);
const [typing, setTyping] = useState(false);
const feedBackRef = useRef(null); 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 = () => { const feedBackInput = () => {
setFeedBack(feedBackRef.current.value); setFeedBack(feedBackRef.current.value);
};
const saveFeedBack = () => {
const allNodes = getNodes(main); const allNodes = getNodes(main);
allNodes.forEach(singleNode => { allNodes.forEach(singleNode => {
if (singleNode.node.attrs.id === node.attrs.id) { if (singleNode.node.attrs.id === node.attrs.id) {
...@@ -82,27 +51,18 @@ export default ({ node, view, getPos, readOnly }) => { ...@@ -82,27 +51,18 @@ export default ({ node, view, getPos, readOnly }) => {
feedback: feedBack, feedback: feedBack,
}), }),
); );
setFirstRun(false);
} }
}); });
return false; return false;
}; };
const onFocus = () => {
main.dispatch(
main.state.tr.setSelection(TextSelection.create(main.state.tr.doc, null)),
);
};
return ( return (
<FeedBack> <FeedBack>
<FeedBackLabel>Feedback</FeedBackLabel> <FeedBackLabel>Feedback</FeedBackLabel>
<FeedBackInput <FeedBackInput
autoFocus="autoFocus"
disabled={readOnly} disabled={readOnly}
onBlur={saveFeedBack}
onChange={feedBackInput} onChange={feedBackInput}
onFocus={onFocus}
onKeyDown={handleKeyDown}
placeholder="Insert feedback" placeholder="Insert feedback"
ref={feedBackRef} ref={feedBackRef}
type="text" type="text"
......
/* eslint-disable react/prop-types */ /* 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 styled from 'styled-components';
import { TextSelection } from 'prosemirror-state';
import { WaxContext } from 'wax-prosemirror-core'; import { WaxContext } from 'wax-prosemirror-core';
import { DocumentHelpers } from 'wax-prosemirror-utilities'; import { DocumentHelpers } from 'wax-prosemirror-utilities';
...@@ -36,42 +35,11 @@ export default ({ node, view, getPos, readOnly }) => { ...@@ -36,42 +35,11 @@ export default ({ node, view, getPos, readOnly }) => {
const { const {
pmViews: { main }, pmViews: { main },
} = context; } = context;
const [feedBack, setFeedBack] = useState(''); const [feedBack, setFeedBack] = useState(node.attrs.feedback);
const [isFirstRun, setFirstRun] = useState(true);
const [typing, setTyping] = useState(false);
const feedBackRef = useRef(null); 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 = () => { const feedBackInput = () => {
setFeedBack(feedBackRef.current.value); setFeedBack(feedBackRef.current.value);
};
const saveFeedBack = () => {
const allNodes = getNodes(main); const allNodes = getNodes(main);
allNodes.forEach(singleNode => { allNodes.forEach(singleNode => {
if (singleNode.node.attrs.id === node.attrs.id) { if (singleNode.node.attrs.id === node.attrs.id) {
...@@ -81,27 +49,18 @@ export default ({ node, view, getPos, readOnly }) => { ...@@ -81,27 +49,18 @@ export default ({ node, view, getPos, readOnly }) => {
feedback: feedBack, feedback: feedBack,
}), }),
); );
setFirstRun(false);
} }
}); });
return false; return false;
}; };
const onFocus = () => {
main.dispatch(
main.state.tr.setSelection(TextSelection.create(main.state.tr.doc, null)),
);
};
return ( return (
<FeedBack> <FeedBack>
<FeedBackLabel>Feedback</FeedBackLabel> <FeedBackLabel>Feedback</FeedBackLabel>
<FeedBackInput <FeedBackInput
autoFocus="autoFocus"
disabled={readOnly} disabled={readOnly}
onBlur={saveFeedBack}
onChange={feedBackInput} onChange={feedBackInput}
onFocus={onFocus}
onKeyDown={handleKeyDown}
placeholder="Insert feedback" placeholder="Insert feedback"
ref={feedBackRef} ref={feedBackRef}
type="text" type="text"
......
/* eslint-disable react/prop-types */ /* 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 styled from 'styled-components';
import { TextSelection } from 'prosemirror-state';
import { WaxContext } from 'wax-prosemirror-core'; import { WaxContext } from 'wax-prosemirror-core';
import { DocumentHelpers } from 'wax-prosemirror-utilities'; import { DocumentHelpers } from 'wax-prosemirror-utilities';
...@@ -36,42 +35,11 @@ export default ({ node, view, getPos, readOnly }) => { ...@@ -36,42 +35,11 @@ export default ({ node, view, getPos, readOnly }) => {
pmViews: { main }, pmViews: { main },
} = context; } = context;
const [feedBack, setFeedBack] = useState(' '); const [feedBack, setFeedBack] = useState(node.attrs.feedback);
const [isFirstRun, setFirstRun] = useState(true);
const [typing, setTyping] = useState(false);
const feedBackRef = useRef(null); 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 = () => { const feedBackInput = () => {
setFeedBack(feedBackRef.current.value); setFeedBack(feedBackRef.current.value);
};
const saveFeedBack = () => {
const allNodes = getNodes(main); const allNodes = getNodes(main);
allNodes.forEach(singleNode => { allNodes.forEach(singleNode => {
if (singleNode.node.attrs.id === node.attrs.id) { if (singleNode.node.attrs.id === node.attrs.id) {
...@@ -81,26 +49,17 @@ export default ({ node, view, getPos, readOnly }) => { ...@@ -81,26 +49,17 @@ export default ({ node, view, getPos, readOnly }) => {
feedback: feedBack, feedback: feedBack,
}), }),
); );
setFirstRun(false);
} }
}); });
return false; return false;
}; };
const onFocus = () => {
main.dispatch(
main.state.tr.setSelection(TextSelection.create(main.state.tr.doc, null)),
);
};
return ( return (
<FeedBack> <FeedBack>
<FeedBackLabel>Feedback</FeedBackLabel> <FeedBackLabel>Feedback</FeedBackLabel>
<FeedBackInput <FeedBackInput
onBlur={saveFeedBack} autoFocus="autoFocus"
onChange={feedBackInput} onChange={feedBackInput}
onFocus={onFocus}
onKeyDown={handleKeyDown}
placeholder="Insert feedback" placeholder="Insert feedback"
readOnly={readOnly} readOnly={readOnly}
ref={feedBackRef} ref={feedBackRef}
......
...@@ -7,7 +7,7 @@ const multipleChoiceNode = { ...@@ -7,7 +7,7 @@ const multipleChoiceNode = {
feedback: { default: '' }, feedback: { default: '' },
}, },
group: 'block questions', group: 'block questions',
content: 'block+', content: 'block*',
defining: true, defining: true,
parseDOM: [ parseDOM: [
{ {
......
/* eslint-disable react/prop-types */ /* 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 styled from 'styled-components';
import { TextSelection } from 'prosemirror-state';
import { WaxContext } from 'wax-prosemirror-core'; import { WaxContext } from 'wax-prosemirror-core';
import { DocumentHelpers } from 'wax-prosemirror-utilities'; import { DocumentHelpers } from 'wax-prosemirror-utilities';
...@@ -37,42 +36,11 @@ export default ({ node, view, getPos, readOnly }) => { ...@@ -37,42 +36,11 @@ export default ({ node, view, getPos, readOnly }) => {
const { const {
pmViews: { main }, pmViews: { main },
} = context; } = context;
const [feedBack, setFeedBack] = useState(' '); const [feedBack, setFeedBack] = useState(node.attrs.feedback);
const [isFirstRun, setFirstRun] = useState(true);
const [typing, setTyping] = useState(false);
const feedBackRef = useRef(null); 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 = () => { const feedBackInput = () => {
setFeedBack(feedBackRef.current.value); setFeedBack(feedBackRef.current.value);
};
const saveFeedBack = () => {
const allNodes = getNodes(main); const allNodes = getNodes(main);
allNodes.forEach(singleNode => { allNodes.forEach(singleNode => {
if (singleNode.node.attrs.id === node.attrs.id) { if (singleNode.node.attrs.id === node.attrs.id) {
...@@ -82,27 +50,18 @@ export default ({ node, view, getPos, readOnly }) => { ...@@ -82,27 +50,18 @@ export default ({ node, view, getPos, readOnly }) => {
feedback: feedBack, feedback: feedBack,
}), }),
); );
setFirstRun(false);
} }
}); });
return false; return false;
}; };
const onFocus = () => {
main.dispatch(
main.state.tr.setSelection(TextSelection.create(main.state.tr.doc, null)),
);
};
return ( return (
<FeedBack> <FeedBack>
<FeedBackLabel>Feedback</FeedBackLabel> <FeedBackLabel>Feedback</FeedBackLabel>
<FeedBackInput <FeedBackInput
autoFocus="autoFocus"
disabled={readOnly} disabled={readOnly}
onBlur={saveFeedBack}
onChange={feedBackInput} onChange={feedBackInput}
onFocus={onFocus}
onKeyDown={handleKeyDown}
placeholder="Insert feedback" placeholder="Insert feedback"
ref={feedBackRef} ref={feedBackRef}
type="text" type="text"
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment