talexander/org_ownership_investigation
1
0
Fork 0
Code Issues Pull Requests Releases Activity

Rendering ast tree.

Browse Source
This commit is contained in:
Tom Alexander 2023-08-18 19:20:23 -04:00
parent ab836f2794
commit 676dffa15f
Signed by: talexander
GPG Key ID: D3A179C9A53C0EDE
3 changed files with 21 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
static/index.html
View File

@ -14,7 +14,7 @@
<div id="parse-output" class="code_block" style="counter-set: code_line_number 0;"></div> <div id="parse-output" class="code_block" style="counter-set: code_line_number 0;"></div>
</div> </div>
<div> <div>
<div id="ast-tree"></div> <div id="ast-tree" class="ast_tree"></div>
</div> </div>
</div> </div>
</body> </body>

23
static/script.js
View File

@ -40,22 +40,23 @@ function renderSourceBox(response) {
} }
function renderAstTree(response) { function renderAstTree(response) {
for (let list of response.lists) { renderAstNode(response.input, 0, response.tree);
renderAstList(response.input, 0, list);
}
} }
function renderAstList(originalSource, depth, list) { function renderAstNode(originalSource, depth, astNode) {
const listElem = document.createElement("div"); const nodeElem = document.createElement("div");
listElem.classList.add("ast_node"); nodeElem.classList.add("ast_node");
let sourceForList = originalSource.slice(list.position.start_character - 1, list.position.end_character - 1); let sourceForNode = originalSource.slice(astNode.position.start_character - 1, astNode.position.end_character - 1);
// Since sourceForList is a string, JSON.stringify will escape with backslashes and wrap the text in quotation marks, ensuring that the string ends up on a single line. Coincidentally, this is the behavior we want. // Since sourceForList is a string, JSON.stringify will escape with backslashes and wrap the text in quotation marks, ensuring that the string ends up on a single line. Coincidentally, this is the behavior we want.
let escapedSource = JSON.stringify(sourceForList); let escapedSource = JSON.stringify(sourceForNode);
listElem.innerText = `List: ${escapedSource}`; nodeElem.innerText = `${astNode.name}: ${escapedSource}`;
listElem.style.marginLeft = `${depth * 20}px`; nodeElem.style.marginLeft = `${depth * 20}px`;
astTreeElement.appendChild(listElem); astTreeElement.appendChild(nodeElem);
for (let child of astNode.children) {
renderAstNode(originalSource, depth + 1, child);
}
} }
inputElement.addEventListener("input", async () => { inputElement.addEventListener("input", async () => {

9
static/style.css
View File

@ -60,9 +60,16 @@ h7 {
} }
.output_container > * { .output_container > * {
flex: 1 0; flex: 1 0 0;
}
.ast_tree {
padding: 5px;
} }
.ast_node { .ast_node {
background: #eeeeee; background: #eeeeee;
margin-bottom: 5px;
border: 1px solid #000000;
padding: 2px;
} }