detect whitespaces and return readable filename

src/components/Compile.js

@@ -3,6 +3,8 @@ import PropTypes from 'prop-types';
 import { connect } from 'react-redux';
 import { workspaceName } from '../actions/workspaceActions';
 
+import { detectWhitespacesAndReturnReadableResult } from '../helpers/whitespace';
+
 import { withStyles } from '@material-ui/core/styles';
 import Button from '@material-ui/core/Button';
 import Backdrop from '@material-ui/core/Backdrop';
@@ -83,9 +85,9 @@ class Compile extends Component {
 
   download = () => {
     const id = this.state.id;
-    const filename = this.state.name;
+    const filename = detectWhitespacesAndReturnReadableResult(this.state.name);
     this.toggleDialog();
-    this.props.workspaceName(filename);
+    this.props.workspaceName(this.state.name);
     window.open(`${process.env.REACT_APP_COMPILER_URL}/download?id=${id}&board=${process.env.REACT_APP_BOARD}&filename=${filename}`, '_self');
     this.setState({ progress: false });
   }

src/components/Tutorial/SolutionCheck.js

@@ -8,7 +8,7 @@ import { withRouter } from 'react-router-dom';
 import Compile from '../Compile';
 
 import tutorials from './tutorials.json';
-import { checkXml } from './compareXml';
+import { checkXml } from '../../helpers/compareXml';
 
 import { withStyles } from '@material-ui/core/styles';
 import IconButton from '@material-ui/core/IconButton';

src/components/Tutorial/Tutorial.js

@@ -11,6 +11,8 @@ import Instruction from './Instruction';
 import Assessment from './Assessment';
 import NotFound from '../NotFound';
 
+import { detectWhitespacesAndReturnReadableResult } from '../../helpers/whitespace';
+
 import tutorials from './tutorials.json';
 
 import Card from '@material-ui/core/Card';
@@ -38,7 +40,7 @@ class Tutorial extends Component {
     var tutorial = tutorials.filter(tutorial => tutorial.id === currentTutorialId)[0];
     var steps = tutorial ? tutorial.steps : null;
     var step = steps ? steps[this.props.activeStep] : null;
-    var name = step ? `${tutorial.title.replace(/\s/g,'')}_${step.headline.replace(/\s/g,'')}` : null;
+    var name = step ? `${detectWhitespacesAndReturnReadableResult(tutorial.title)}_${detectWhitespacesAndReturnReadableResult(step.headline)}` : null;
     return (
       !Number.isInteger(currentTutorialId) || currentTutorialId < 1 || currentTutorialId > tutorials.length ?
         <NotFound button={{title: 'Zurück zur Tutorials-Übersicht', link: '/tutorial'}}/>

src/components/WorkspaceFunc.js

@@ -7,6 +7,7 @@ import * as Blockly from 'blockly/core';
 
 import { saveAs } from 'file-saver';
 
+import { detectWhitespacesAndReturnReadableResult } from '../helpers/whitespace';
 import { initialXml } from './Blockly/initialXml.js';
 
 import Compile from './Compile';
@@ -78,8 +79,8 @@ class WorkspaceFunc extends Component {
   saveXmlFile = () => {
     var code = this.props.xml;
     this.toggleDialog();
-    var fileName = this.state.name;
-    this.props.workspaceName(fileName);
+    var fileName = detectWhitespacesAndReturnReadableResult(this.state.name);
+    this.props.workspaceName(this.state.name);
     fileName = `${fileName}.xml`
     var blob = new Blob([code], { type: 'text/xml' });
     saveAs(blob, fileName);

src/helpers/whitespace.js

@@ -0,0 +1,15 @@
+export const detectWhitespacesAndReturnReadableResult = (word) => {
+  var readableResult = '';
+  var space = false;
+  for(var i = 0; i < word.length; i++){
+    var letter = word[i];
+    if(/\s/g.test(letter)){
+      space = true;
+    }
+    else {
+      readableResult += space ? letter.toUpperCase() : letter;
+      space = false;
+    }
+  }
+  return readableResult;
+};