3 files changed, 45 insertions, 36 deletions
diff --git a/web/src/js/components/common/Button.jsx b/web/src/js/components/common/Button.jsx
index 574288df..221c6ace 100644
--- a/web/src/js/components/common/Button.jsx
+++ b/web/src/js/components/common/Button.jsx
@@ -10,8 +10,10 @@ export default function Button({ onClick, text, icon, disabled }) {
         <div className={"btn btn-default"}
              onClick={onClick}
              disabled={disabled}>
-            <i className={"fa fa-fw " + icon}/>
-            &nbsp;
+            <span hidden={!icon}>
+                <i className={"fa fa-fw " + icon}/>
+                &nbsp;
+            </span>
             {text}
         </div>
     )
diff --git a/web/src/js/components/common/CodeEditor.jsx b/web/src/js/components/common/CodeEditor.jsx
new file mode 100644
index 00000000..d7e6aabb
--- /dev/null
+++ b/web/src/js/components/common/CodeEditor.jsx
@@ -0,0 +1,41 @@
+import React, { Component, PropTypes } from 'react'
+import { render } from 'react-dom';
+import brace from 'brace';
+import AceEditor from 'react-ace';
+import Button from './Button'
+
+
+import 'brace/mode/javascript';
+import 'brace/mode/json';
+import 'brace/theme/monokai';
+
+
+
+
+export default class CodeEditor extends Component{
+    constructor( props ) {
+        super(props)
+        this.state = {value: this.props.value}
+    }
+
+    onChange(newValue) {
+        this.setState({value: newValue})
+    }
+
+    render() {
+        return (
+            <div onKeyDown={e => e.stopPropagation()}>
+                <AceEditor
+                    onChange={e => this.onChange(e)}
+                    mode="javascript"
+                    theme="monokai"
+                    value={this.state.value}
+                    width="100%"
+                    name="codeEditor"
+                    editorProps={{$blockScrolling: Infinity}}
+                />
+                <Button onClick={(e) => this.props.onSave(this.state.value)} text="Update"/>
+            </div>
+        )
+    }
+}
diff --git a/web/src/js/components/common/MonacoEditor.jsx b/web/src/js/components/common/MonacoEditor.jsx
deleted file mode 100644
index a0e8d58c..00000000
--- a/web/src/js/components/common/MonacoEditor.jsx
+++ /dev/null
@@ -1,34 +0,0 @@
-//not working
-import React, { Component, PropTypes } from 'react'
-
-export default class MonacoEditor extends Component {
-
-    constructor(props) {
-        super(props)
-    }
-
-    onLoad(){
-        window.MonacoEnvironment = {
-			getWorkerUrl: function(workerId, label) {
-				return 'worker-loader-proxy.js';
-			}
-		};
-		require.config({
-			paths: {
-				vs: '../release/min/vs'
-			}
-		});
-
-    }
-
-
-    render() {
-        return (
-            <div id="container"
-                 ref={ref => this.editor = ref}
-                 style="width:800px;height:600px;border:1px solid grey"
-                 onLoad={this.onLoad()}>
-            </div>
-        )
-    }
-}