Merge pull request #1671 from benetech/frontend_v2

#1634 - fix painterro usage
benetech · Feb 5, 2021 · bab36fe · bab36fe
2 parents 70f1880 + 4f8c5c4
commit bab36fe
Show file tree

Hide file tree

Showing 4 changed files with 27 additions and 11 deletions.
diff --git a/src/components/Editor/components/MyWork/index.js b/src/components/Editor/components/MyWork/index.js
@@ -40,6 +40,16 @@ class MyWork extends Component {
     }
 
     componentDidMount() {
+        document.getElementById('mathEditorActive').addEventListener('keydown', this.HandleKeyDown);
+        const { problem } = this.props;
+        const { scratchpadMode } = problem.work;
+        if (scratchpadMode) {
+            setTimeout(this.openScratchpad, 0);
+        }
+        this.bindingHelper();
+    }
+
+    bindingHelper = () => {
         if (this.props.bindDisplayFunction) {
             this.props.bindDisplayFunction((scratchpadContent) => {
                 this.props.updateWork({
@@ -49,12 +59,6 @@ class MyWork extends Component {
                 this.displayScratchpadImage();
             });
         }
-        document.getElementById('mathEditorActive').addEventListener('keydown', this.HandleKeyDown);
-        const { problem } = this.props;
-        const { scratchpadMode } = problem.work;
-        if (scratchpadMode) {
-            setTimeout(this.openScratchpad, 0);
-        }
     }
 
     getScratchPadValue = () => {
@@ -204,9 +208,9 @@ class MyWork extends Component {
 
     displayScratchpadImage() {
         const { work } = this.props.problem;
-        if (work.scratchpadContent) {
+        if (work.scratchpadContent || work.isScratchpadUsed) {
+            this.clearAndResizeScratchPad(work.scratchpadContent);
             setTimeout(() => {
-                this.clearAndResizeScratchPad(work.scratchpadContent);
                 this.scratchPadPainterro.show(work.scratchpadContent || '');
             }, 500);
         }

diff --git a/src/components/Editor/index.js b/src/components/Editor/index.js
@@ -267,7 +267,7 @@ class Editor extends Component {
                 deleteStepsCallback={() => clearAll(this)}
                 updateCallback={img => updateStep(this, img)}
                 bindDisplayFunction={
-                    f => this.props.updateProblemStore({ displayScratchpad: (f || (() => {})) })
+                    f => this.props.updateProblemStore({ displayScratchpad: f })
                 }
                 showDelete={problemStore.actionsStack.length > 0}
                 newProblem={this.id === 'newEditor'}

diff --git a/src/components/Editor/stepsOperations.js b/src/components/Editor/stepsOperations.js
@@ -81,7 +81,6 @@ function editStep(context, stepNumber) {
     const mathStep = problemStore.solution.steps[stepNumber - 1];
     const updatedMathField = problemList.theActiveMathField;
     updatedMathField.$latex(mathStep.stepValue);
-    problemStore.displayScratchpad(mathStep.scratchpad);
     const solution = Object.assign({}, problemStore.solution);
     const steps = problemStore.solution.steps.filter(step => !step.inProgress);
     solution.steps = steps;
@@ -99,6 +98,9 @@ function editStep(context, stepNumber) {
         isUpdated: true,
     });
     context.moveEditorBelowSpecificStep(stepNumber);
+    setTimeout(() => {
+        problemStore.displayScratchpad(mathStep.scratchpad);
+    }, 500);
 }
 
 function updateStep(context, img) {
@@ -130,6 +132,7 @@ function updateStep(context, img) {
         const problemSteps = problemStore.solution.problem.steps.filter(step => !step.inProgress);
         problemStore.solution.problem.steps = problemSteps;
     }
+    problemStore.displayScratchpad();
     updateProblemStore({
         isUpdated: true,
         solution,

diff --git a/src/redux/problem/reducer.js b/src/redux/problem/reducer.js
@@ -54,6 +54,7 @@ const problem = (state = initialState, {
     case 'RESET_PROBLEM':
         return {
             ...initialState,
+            displayScratchpad: state.displayScratchpad,
             work: {
                 ...initialState.work,
                 scratchpadMode: state.work.scratchpadMode,
@@ -157,12 +158,18 @@ const problem = (state = initialState, {
     }
     case 'SET_EDIT_PROBLEM': {
         let textAreaValue = initialState.textAreaValue;
+        let scratchpadContent = initialState.work.scratchpadContent;
         if (payload.action === 'edit') {
             textAreaValue = payload.textAreaValue;
+            scratchpadContent = payload.scratchpadContent;
         }
         return {
             ...state,
             textAreaValue,
+            work: {
+                ...state.work,
+                scratchpadContent,
+            },
         };
     }
     case 'PROCESS_FETCHED_PROBLEM': {
@@ -182,6 +189,7 @@ const problem = (state = initialState, {
                 ...state,
                 textAreaValue: initialState.textAreaValue,
                 stepsFromLastSave: initialState.stepsFromLastSave,
+                work: initialState.work,
                 solution: initialState.solution,
             };
         }
@@ -190,7 +198,8 @@ const problem = (state = initialState, {
         if (payload.modals.includes('addProblems')) {
             return {
                 ...state,
-                textAreaValue: initialState.textAreaValue,
+                work: initialState.work,
+                scratchpadContent: initialState.scratchpadContent,
             };
         }
         return state;