Commit fdc4bb11 authored by Matej Genci's avatar Matej Genci

Highlighting code works

parent 523483a6
......@@ -38,7 +38,7 @@ body {
}
.warning-highlight {
background: rgba(255, 50, 50, 0.1);
background: rgba(255, 50, 50, 1);
position: absolute;
}
......
......@@ -56,10 +56,9 @@ class App extends React.Component {
onWaccCodeChange = (newCode) => {
this.setState({
wacc: {
code: newCode,
markers: [{startRow: 0, startCol: 2, endRow: 0, endCol: 20, className: 'warning-highlight', type: 'text'}]
},
wacc: {code: newCode, markers: []},
js: {code: "", markers: []},
arm: {code: "", markers: []},
graphData: [{}],
})
}
......@@ -68,11 +67,11 @@ class App extends React.Component {
let hl = nodeData.highlighting;
this.setState((state, props) => {
return {
wacc: {code: state.wacc.code, markers: hl.wacc},
js: {code: state.js.code, markers: hl.js},
arm: {code: state.arm.code, markers: hl.arm}
}
state.wacc.markers = hl.wacc;
state.js.markers = hl.js;
state.arm.markers = hl.arm;
return state
})
}
......@@ -174,6 +173,7 @@ class App extends React.Component {
data={this.state.graphData}
onMouseOver={this.onNodeOver}
onMouseOut={this.onNodeOut}
onClick={(n,e) => console.log(n)}
orientation="vertical"/>
</div>
</CardBody>
......
......@@ -25,12 +25,16 @@ function generateMarkerObject(start, end) {
startRow: start.lineNum - 1,
startCol: start.charNum,
endRow: end.lineNum - 1,
endCol: end.charNum - 1,
endCol: end.charNum,
className: "ast-node-highlight",
type: "text"
}
}
function generateArmMarkers(lineNums) {
return lineNums.map(ln => ({startRow: ln - 1, className: "ast-node-highlight", type: "background"}))
}
function createGraphNode(node, astMeta){
let name = node.name;
let value = node.value;
......@@ -44,14 +48,14 @@ function createGraphNode(node, astMeta){
children.push(createGraphNode(child, astMeta))
}
}
//console.log(JSON.stringify(retObj))
console.log(node)
return {
name: name,
attributes: {value: value},
highlighting: {
wacc: [generateMarkerObject(node.waccStart, node.waccEnd)],
js: typeof node.jsStart === "undefined" ? [{}] : [generateMarkerObject(node.jsStart, node.jsEnd)],
arm: []
arm: generateArmMarkers(node.armLineNums)
},
children: children
}
......
......@@ -20,9 +20,6 @@ class CodeEditor extends React.Component {
return (
<div className="ace-editor">
{this.heading()}
<p>
Highlighting {JSON.stringify(this.props.markers)}
</p>
<AceEditor
mode="java"
theme="github"
......
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