From 2908bc464fdcd350c2d4003546eff050cd766271 Mon Sep 17 00:00:00 2001
From: Delucse <46593742+Delucse@users.noreply.github.com>
Date: Wed, 9 Sep 2020 13:35:35 +0200
Subject: [PATCH] generalised BlocklyWindow

---
 src/components/Blockly/BlocklyComponent.jsx |  2 +-
 src/components/Blockly/BlocklyWindow.js     | 37 ++++++++++++++-------
 2 files changed, 26 insertions(+), 13 deletions(-)

diff --git a/src/components/Blockly/BlocklyComponent.jsx b/src/components/Blockly/BlocklyComponent.jsx
index 9d5696e..627df9a 100644
--- a/src/components/Blockly/BlocklyComponent.jsx
+++ b/src/components/Blockly/BlocklyComponent.jsx
@@ -68,7 +68,7 @@ class BlocklyComponent extends React.Component {
 
 
         return <React.Fragment>
-            <Card ref={this.blocklyDiv} id="blocklyDiv" />
+            <Card ref={this.blocklyDiv} id="blocklyDiv" style={this.props.style ? this.props.style : {}}/>
             <Toolbox toolbox={this.toolbox} />
         </React.Fragment>;
     }
diff --git a/src/components/Blockly/BlocklyWindow.js b/src/components/Blockly/BlocklyWindow.js
index f07d8f0..ca70826 100644
--- a/src/components/Blockly/BlocklyWindow.js
+++ b/src/components/Blockly/BlocklyWindow.js
@@ -28,31 +28,44 @@ class BlocklyWindow extends Component {
     });
   }
 
+  componentDidUpdate(props) {
+    if(props.initialXml !== this.props.initialXml){
+      // guarantees that the current xml-code (this.props.initialXml) is rendered
+      const workspace = Blockly.getMainWorkspace();
+      workspace.clear();
+      Blockly.Xml.domToWorkspace(Blockly.Xml.textToDom(this.props.initialXml), workspace);
+    }
+  }
+
   render() {
+    console.log(this.props.initialXml);
     return (
       <BlocklyComponent ref={this.simpleWorkspace}
-        readOnly={false}
-        trashcan={true}
+        style={this.props.blocklyCSS}
+        readOnly={this.props.readOnly !== undefined ? this.props.readOnly : false}
+        trashcan={this.props.trashcan !== undefined ? this.props.trashcan : true}
         renderer='zelos'
         zoom={{ // https://developers.google.com/blockly/guides/configure/web/zoom
-          controls: true,
+          controls: this.props.zoomControls !== undefined ? this.props.zoomControls : true,
           wheel: false,
           startScale: 0.8,
           maxScale: 3,
           minScale: 0.3,
           scaleSpeed: 1.2
         }}
-        grid={{ // https://developers.google.com/blockly/guides/configure/web/grid
-          spacing: 20,
-          length: 1,
-          colour: '#4EAF47', // senseBox-green
-          snap: false
+        grid={this.props.grid !== undefined && !this.props.grid ? {} :
+          { // https://developers.google.com/blockly/guides/configure/web/grid
+            spacing: 20,
+            length: 1,
+            colour: '#4EAF47', // senseBox-green
+            snap: false
         }}
         media={'/media/'}
-        move={{ // https://developers.google.com/blockly/guides/configure/web/move
-          scrollbars: true,
-          drag: true,
-          wheel: false
+        move={this.props.move !== undefined && !this.props.move ? {} :
+          { // https://developers.google.com/blockly/guides/configure/web/move
+            scrollbars: true,
+            drag: true,
+            wheel: false
         }}
         initialXml={this.props.initialXml ? this.props.initialXml : initialXml}
       >