Skip to content

GitLab

Commit c7a5d217 authored by Raghav Khanna's avatar Raghav Khanna
Browse files
Options

Check for error before proccessing graph

parent c8a32334
Hide whitespace changes
Inline Side-by-side
Showing with 110 additions and 94 deletions
src/App.js
View file @ c7a5d217
...@@ -31,27 +31,30 @@ class App extends React.Component { ...@@ -31,27 +31,30 @@ class App extends React.Component {
name: "", name: "",
attributes: {value: ""}, attributes: {value: ""},
highlighting: { highlighting: {
wacc: [{ wacc: [{
startRow: 0, startRow: 0,
startCol: 0, startCol: 0,
endRow: 0, endRow: 0,
endCol: 0, endCol: 0,
className: "", className: "",
type: ""}], type: ""
js: [{ }],
js: [{
startRow: 0, startRow: 0,
startCol: 0, startCol: 0,
endRow: 0, endRow: 0,
endCol: 0, endCol: 0,
className: "", className: "",
type: ""}], type: ""
arm: [{ }],
arm: [{
startRow: 0, startRow: 0,
startCol: 0, startCol: 0,
endRow: 0, endRow: 0,
endCol: 0, endCol: 0,
className: "", className: "",
type: ""}] type: ""
}]
}, },
children: [{}] children: [{}]
} }
...@@ -68,15 +71,15 @@ class App extends React.Component { ...@@ -68,15 +71,15 @@ class App extends React.Component {
} }
onNodeOver = (nodeData, evt) => { onNodeOver = (nodeData, evt) => {
let hl = nodeData.highlighting; let hl = nodeData.highlighting;
this.setState((state, props) => { this.setState((state, props) => {
state.wacc.markers = hl.wacc; state.wacc.markers = hl.wacc;
state.js.markers = hl.js; state.js.markers = hl.js;
state.arm.markers = hl.arm; state.arm.markers = hl.arm;
return state return state
}) })
} }
onNodeOut = (nodeData, evt) => { onNodeOut = (nodeData, evt) => {
...@@ -84,7 +87,9 @@ class App extends React.Component { ...@@ -84,7 +87,9 @@ class App extends React.Component {
readInputCallBack = (codeToEval) => { readInputCallBack = (codeToEval) => {
eval(codeToEval); eval(codeToEval);
window.EMULATOR_CONSOLE_READ = () => { return window.prompt()}; window.EMULATOR_CONSOLE_READ = () => {
return window.prompt()
};
}; };
clearConsole = () => { clearConsole = () => {
...@@ -110,31 +115,37 @@ class App extends React.Component { ...@@ -110,31 +115,37 @@ class App extends React.Component {
}; };
proccesLine = () => { proccesLine = () => {
if(this.state.statementIndex < this.state.mainStatements.length){ if (this.state.statementIndex < this.state.mainStatements.length) {
let current = this.state.currentNode; let current = this.state.currentNode;
let jsLines = this.state.js.code.split(/;\n(?!})/); let jsLines = this.state.js.code.split(/;\n(?!})/);
// console.log(jsLines) // console.log(jsLines)
// console.log(current) // console.log(current)
let codeLine = jsLines[current.highlighting.js[0].startRow]; let codeLine = jsLines[current.highlighting.js[0].startRow];
codeLine = codeLine.replace("var ", "window."); codeLine = codeLine.replace("var ", "window.");
eval(codeLine);; eval(codeLine);
;
let newIndex = this.state.statementIndex + 1; let newIndex = this.state.statementIndex + 1;
this.setState({ this.setState({
currentNode: this.state.mainStatements[newIndex], currentNode: this.state.mainStatements[newIndex],
statementIndex: newIndex}) statementIndex: newIndex
})
} else { } else {
console.log("Finished executing code") console.log("Finished executing code")
} }
}; };
getStatements = () => { getStatements = () => {
let rootChildren = this.state.graphData.children; if (typeof this.state.graphData.children !== "undefined") {
let funcMain = rootChildren[rootChildren.length - 1]; let rootChildren = this.state.graphData.children;
let mainFuncStatementsNode = funcMain.children[0]; let funcMain = rootChildren[rootChildren.length - 1];
let mainFuncStatements = mainFuncStatementsNode.children; let mainFuncStatementsNode = funcMain.children[0];
this.setState({mainStatements: mainFuncStatements, let mainFuncStatements = mainFuncStatementsNode.children;
currentNode: mainFuncStatements[0], this.setState({
statementIndex: 0}) mainStatements: mainFuncStatements,
currentNode: mainFuncStatements[0],
statementIndex: 0
})
}
}; };
render() { render() {
...@@ -148,93 +159,98 @@ class App extends React.Component { ...@@ -148,93 +159,98 @@ class App extends React.Component {
<ButtonStrip <ButtonStrip
onCompileClick={(e) => { onCompileClick={(e) => {
this.processWaccCode(this.state.wacc.code).then(() => { this.processWaccCode(this.state.wacc.code).then(() => {
this.clearConsole() if (typeof this.state.graphData.children !== "undefined") {
this.getStatements()}) this.clearConsole()
this.getStatements()
}
}
)
}} }}
onExecuteClick={(e) => { onExecuteClick={(e) => {
eval(this.state.js.code) eval(this.state.js.code)
eval("waccPrintFinished()") eval("waccPrintFinished()")
}} }}
onStepWaccClick={(e) => { onStepWaccClick={(e) => {
this.readInputCallBack(e) this.proccesLine()
}} }}
/>
</CardBody>
</Card>
</GridItem>
<GridItem xs={12} sm={12} md={4}>
<Card>
<CardBody>
<CodeEditor
heading='WACC Code'
onCodeChange={this.onWaccCodeChange}
value={this.state.wacc.code}
markers={this.state.wacc.markers}/>
</CardBody>
</Card>
</GridItem>
<GridItem xs={12} sm={12} md={4}>
<Card> />
<CardBody> </CardBody>
<CodeEditor </Card>
heading='JavaScript' </GridItem>
value={this.state.js.code} <GridItem xs={12} sm={12} md={4}>
markers={this.state.js.markers} <Card>
readOnly={true}/> <CardBody>
</CardBody> <CodeEditor
</Card> heading='WACC Code'
</GridItem> onCodeChange={this.onWaccCodeChange}
<GridItem xs={12} sm={12} md={4}> value={this.state.wacc.code}
<Card> markers={this.state.wacc.markers}/>
<CardBody> </CardBody>
<CodeEditor </Card>
heading='ARM Assembly' </GridItem>
value={this.state.arm.code} <GridItem xs={12} sm={12} md={4}>
markers={this.state.arm.markers}
readOnly={true}/> <Card>
</CardBody> <CardBody>
</Card> <CodeEditor
</GridItem> heading='JavaScript'
<GridItem xs={12} sm={12} md={8}> value={this.state.js.code}
<Card> markers={this.state.js.markers}
<CardBody> readOnly={true}/>
<div style={{height: '50em'}}> </CardBody>
<Tree </Card>
</GridItem>
<GridItem xs={12} sm={12} md={4}>
<Card>
<CardBody>
<CodeEditor
heading='ARM Assembly'
value={this.state.arm.code}
markers={this.state.arm.markers}
readOnly={true}/>
</CardBody>
</Card>
</GridItem>
<GridItem xs={12} sm={12} md={8}>
<Card>
<CardBody>
<div style={{height: '50em'}}>
<Tree
collapsible={false} collapsible={false}
data={this.state.graphData} data={this.state.graphData}
onMouseOver={this.onNodeOver} onMouseOver={this.onNodeOver}
onMouseOut={this.onNodeOut} onMouseOut={this.onNodeOut}
orientation="vertical"/> orientation="vertical"/>
</div> </div>
</CardBody> </CardBody>
</Card> </Card>
</GridItem> </GridItem>
<GridItem xs={12} sm={12} md={4}> <GridItem xs={12} sm={12} md={4}>
<Card> <Card>
<CardBody> <CardBody>
<div <div
style={{ style={{
display: "flex", display: "flex",
justifyContent: "center", justifyContent: "center",
alignItems: "center", alignItems: "center",
height: "50em" height: "50em"
}} }}
> >
<Terminal commandPassThrough={cmd => { <Terminal commandPassThrough={cmd => {
window.EMULATOR_CONSOLE_READ = () => {return cmd[0]}; window.EMULATOR_CONSOLE_READ = () => {return cmd[0]};
window.EMULATOR_IS_INPUT = true; window.EMULATOR_IS_INPUT = true;
}} watchConsoleLogging hideTopBar allowTabs={false} key={this.state.consoleReset}/> }} watchConsoleLogging hideTopBar allowTabs={false} key={this.state.consoleReset}/>
</div> </div>
</CardBody> </CardBody>
</Card> </Card>
</GridItem> </GridItem>
</GridContainer> </GridContainer>
</div> </div>
</div> </div>
) )
} }
} }
export default App; export default App;
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment