move debugger to sidebar; fix config issue

embark-ui/src/components/ContractDebugger.js

@@ -57,28 +57,32 @@ class ContractDebugger extends Component {
 
   render() {
     return (
-      <Row>
-        <Col>
-          <Input name="txHash" id="txHash" onChange={(e) => this.handleChange(e)}/>
-          <Button color="primary" onClick={(e) => this.debug(e)}>Debug Tx</Button>
-        </Col>
-
-        <Col>
-          <Button color="light" className="btn-square debugButton jumpBack" alt="jump to previous breakpoint" onClick={(e) => this.debugJumpBack(e)}></Button>
-          <Button color="light" className="btn-square debugButton jumpForward" alt="jump to revious breakpoint" onClick={(e) => this.debugJumpForward(e)}></Button>
-          <Button color="light" className="btn-square debugButton stepOverBack" alt="step back" onClick={(e) => this.debugStepOverBackward(e)}></Button>
-          <Button color="light" className="btn-square debugButton stepOverForward" alt="step over" onClick={(e) => this.debugStepOverForward(e)}></Button>
-          <Button color="light" className="btn-square debugButton stepIntoForward" alt="step into" onClick={(e) => this.debugStepIntoForward(e)}></Button>
-          <Button color="light" className="btn-square debugButton stepIntoBack" alt="step out" onClick={(e) => this.debugStepIntoBackward(e)}></Button>
-        </Col>
-
-        <Col>
-          <br /><strong>Scopes</strong>
-          <div>
-            <ReactJson src={{locals: this.props.debuggerInfo.locals, contract: this.props.debuggerInfo.globals}} theme="monokai" sortKeys={true} name={false} collapse={1} />
-          </div>
-        </Col>
-      </Row>
+      <div>
+        <Row>
+          <Col>
+            <Input name="txHash" id="txHash" onChange={(e) => this.handleChange(e)}/>
+            <Button color="primary" onClick={(e) => this.debug(e)}>Debug Tx</Button>
+          </Col>
+        </Row>
+        <Row>
+          <Col>
+            <Button color="light" className="btn-square debugButton jumpBack" alt="jump to previous breakpoint" onClick={(e) => this.debugJumpBack(e)}></Button>
+            <Button color="light" className="btn-square debugButton jumpForward" alt="jump to revious breakpoint" onClick={(e) => this.debugJumpForward(e)}></Button>
+            <Button color="light" className="btn-square debugButton stepOverBack" alt="step back" onClick={(e) => this.debugStepOverBackward(e)}></Button>
+            <Button color="light" className="btn-square debugButton stepOverForward" alt="step over" onClick={(e) => this.debugStepOverForward(e)}></Button>
+            <Button color="light" className="btn-square debugButton stepIntoForward" alt="step into" onClick={(e) => this.debugStepIntoForward(e)}></Button>
+            <Button color="light" className="btn-square debugButton stepIntoBack" alt="step out" onClick={(e) => this.debugStepIntoBackward(e)}></Button>
+          </Col>
+        </Row>
+        <Row>
+          <Col>
+            <br /><strong>Scopes</strong>
+            <div>
+              <ReactJson src={{locals: this.props.debuggerInfo.locals, contract: this.props.debuggerInfo.globals}} theme="monokai" sortKeys={true} name={false} collapse={1} />
+            </div>
+          </Col>
+        </Row>
+      </div>
     );
   }
 }

embark-ui/src/components/TextEditorToolbar.js

@@ -41,6 +41,9 @@ const TextEditorToolbar = (props) => (
               Logger
             </Button>
             <span className="mx-2">|</span>
+            <Button size="sm" color="primary" onClick={() => props.openAsideTab('debugger')}>
+              Debugger
+            </Button>
           </React.Fragment>
         }
         <Button size="sm" color="primary" onClick={() => props.openAsideTab('browser')}>

embark-ui/src/containers/TextEditorAsideContainer.js

@@ -9,6 +9,7 @@ import {getContractsByPath} from "../reducers/selectors";
 import ContractDetail from '../components/ContractDetail';
 import ContractLoggerContainer from '../containers/ContractLoggerContainer';
 import ContractOverviewContainer from '../containers/ContractOverviewContainer';
+import ContractDebuggerContainer from '../containers/ContractDebuggerContainer';
 
 class TextEditorAsideContainer extends Component {
   componentDidMount() {
@@ -19,6 +20,17 @@ class TextEditorAsideContainer extends Component {
     switch(this.props.currentAsideTab) {
       case 'browser':
         return <Preview />
+      case 'debugger':
+        return this.props.contracts.map((contract, index) => {
+          return (
+            <Card>
+              <CardBody>
+                <CardTitle style={{"font-size": "2em"}}>{contract.className} - Details</CardTitle>
+                <ContractDebuggerContainer key={index} contract={contract} />
+              </CardBody>
+            </Card>
+          )
+        })
       case 'detail':
         return this.props.contracts.map((contract, index) => {
           return (

embark-ui/src/containers/TextEditorContainer.js

@@ -12,12 +12,14 @@ const TextEditorContainer = (props) => (
   <TextEditor file={props.currentFile}
               breakpoints={props.breakpoints}
               toggleBreakpoint={props.toggleBreakpoint}
+              debuggerLine={props.debuggerLine}
               onFileContentChange={props.onFileContentChange} />
 )
 
 function mapStateToProps(state, props) {
   const breakpoints = getBreakpointsByFilename(state, props.currentFile.name);
-  return {breakpoints};
+  const debuggerLine = getDebuggerLine(state);
+  return {breakpoints, debuggerLine};
 }
 
 TextEditorContainer.propTypes = {

test_apps/test_app/app/contracts/simple_storage.sol

@@ -11,7 +11,7 @@ contract SimpleStorage {
 
   function set(uint x) public {
     storedData = x;
-    require(msg.sender != owner);
+    require(msg.sender == 0x0);
     storedData = x + 2;
   }
 

test_apps/test_app/app/js/index.js

@@ -4,7 +4,7 @@ import React, { Component } from 'react';
 import EmbarkJS from 'Embark/EmbarkJS';
 import SimpleStorage from 'Embark/contracts/SimpleStorage';
 import Test from 'Embark/contracts/Test';
-import Assert from 'Embark/contracts/Assert';
+//import Assert from 'Embark/contracts/Assert';
 
 import SimpleStorageTest from 'Embark/contracts/SimpleStorageTest';
 window.SimpleStorageTest = SimpleStorageTest
@@ -26,7 +26,7 @@ import { Navbar, Jumbotron, Button } from 'react-bootstrap';
 window.EmbarkJS = EmbarkJS;
 window.SimpleStorage = SimpleStorage;
 window.Test = Test;
-window.Assert = Assert;
+//window.Assert = Assert;
 
 window.React = React;
 

test_apps/test_app/config/blockchain.json

@@ -18,11 +18,6 @@
     "nodiscover": true,
     "maxpeers": 0,
     "targetGasLimit": 8000000,
-    "account": {
-      "numAccounts": 3,
-      "balance": "5 ether",
-      "password": "config/privatenet/password"
-    },
     "proxy": true
   },
   "privatenet": {