Merge pull request #4 from sensebox/compile

Compile

.env

@@ -0,0 +1,2 @@
+REACT_APP_COMPILER_URL=https://compiler.sensebox.de
+REACT_APP_BOARD=sensebox-mcu

src/components/WorkspaceFunc.js

@@ -30,6 +30,29 @@ class WorkspaceFunc extends Component {
     this.setState({ open: !this.state });
   }
 
+  compile = () => {
+    const data = {
+      "board": process.env.REACT_APP_BOARD,
+      "sketch": this.props.arduino
+    };
+
+    fetch(`${process.env.REACT_APP_COMPILER_URL}/compile`, {
+      method: "POST",
+      headers: {'Content-Type': 'application/json'},
+      body: JSON.stringify(data)
+    })
+      .then(response => response.json())
+      .then(data => {
+        console.log(data)
+        this.download(data.data.id)
+      });
+  }
+
+  download = (id) => {
+    const filename = 'sketch'
+    window.open(`${process.env.REACT_APP_COMPILER_URL}/download?id=${id}&board=${process.env.REACT_APP_BOARD}&filename=${filename}`, '_self');
+  }
+
   render() {
     return (
       <div style={{ marginTop: '20px' }}>
@@ -51,6 +74,9 @@ class WorkspaceFunc extends Component {
           Get XML Code
         </Button>
         <MaxBlocks />
+        <Button style={{ float: 'right', color: 'white' }} variant="contained" color="primary" onClick={() => this.compile()}>
+          Compile
+        </Button>
       </div>
     );
   };

src/components/WorkspaceStats.js

@@ -33,16 +33,14 @@ class WorkspaceStats extends Component {
           <Chip
             style={{ marginRight: '1rem' }}
             color="primary"
-            title="Anzahl aktueller Blöcke"
             avatar={<Avatar><FontAwesomeIcon icon={faPuzzlePiece} /></Avatar>}
             label={workspace ? workspace.getAllBlocks().length : 0}>
           </Chip>
         </Tooltip>
-        <Tooltip title="Anzahl aktueller Blöcke" >
+        <Tooltip title="Anzahl neuer Blöcke" >
           <Chip
             style={{ marginRight: '1rem' }}
             color="primary"
-            title="Anzahl neuer Blöcke"
             avatar={<Avatar><FontAwesomeIcon icon={faPlus} /></Avatar>}
             label={this.props.create}>
           </Chip>
@@ -51,7 +49,6 @@ class WorkspaceStats extends Component {
           <Chip
             style={{ marginRight: '1rem' }}
             color="primary"
-            title="Anzahl neuer Blöcke"
             avatar={<Avatar><FontAwesomeIcon icon={faPen} /></Avatar>}
             label={this.props.change}>
           </Chip>