diff --git a/dingus/dingus.html b/dingus/dingus.html index 1fb60f0..e15ccca 100644 --- a/dingus/dingus.html +++ b/dingus/dingus.html @@ -27,7 +27,7 @@
- +
diff --git a/dingus/dingus.js b/dingus/dingus.js index 01aa3e0..1d84c03 100644 --- a/dingus/dingus.js +++ b/dingus/dingus.js @@ -12,7 +12,8 @@ function chain_document_submit(kind, editor, on_success) { let pending = null; let next = null; - function do_submit(document) { + function do_submit() { + const document = editor.doc.getValue(); if (window.localStorage) { window.localStorage.setItem(kind, document); } @@ -36,7 +37,8 @@ function chain_document_submit(kind, editor, on_success) { worker.postMessage({kind, data: document}); console.log("Posted another document"); } - if (message.kind === "ok" && on_success) { + + if (message.status === "ok" && on_success) { on_success(message); } } @@ -47,7 +49,7 @@ function chain_document_submit(kind, editor, on_success) { clearTimeout(change_timer_id); change_timer_id = setTimeout(() => { change_timer_id = null; - do_submit(editor.doc.getValue()); + do_submit(); }, 100); }); @@ -57,6 +59,8 @@ function chain_document_submit(kind, editor, on_success) { editor.doc.setValue(value); } } + + return do_submit; } const worker = new Worker('worker.js'); @@ -71,28 +75,66 @@ worker.onmessage = (e) => { STATUS.innerText = message.message; }; +let grammar_editor = null; +let input_editor = null; + function render_parse_results(message) { - // What + console.log("WHAT?"); + + function render_tree_node(parent, node) { + const tree_div = document.createElement("div"); + tree_div.classList.add("parsed-node"); + + const node_label = document.createElement("a"); + node_label.innerText = node.name; + node_label.setAttribute("href", "#"); + node_label.onclick = () => { + const doc = input_editor.doc; + doc.setSelection( + doc.posFromIndex(node.start), + doc.posFromIndex(node.end), + {scroll: true}, + ); + }; + tree_div.appendChild(node_label); + + if (node.kind === "tree") { + tree_div.classList.add("parsed-tree"); + for (const child of node.children) { + render_tree_node(tree_div, child); + } + } else { + tree_div.classList.add("parsed-token"); + } + parent.appendChild(tree_div); + } + + const root = document.getElementById("output-root"); + root.innerHTML = ""; + render_tree_node(root, message.tree); } function setup_editors() { - const grammar_editor = CodeMirror.fromTextArea( + grammar_editor = CodeMirror.fromTextArea( document.getElementById("grammar"), { lineNumbers: true, mode: "python", - value: "from parser import Grammar\n\nclass MyGrammar(Grammar):\n pass\n", }, ); - chain_document_submit("grammar", grammar_editor); - const input_editor = CodeMirror.fromTextArea( + input_editor = CodeMirror.fromTextArea( document.getElementById("input"), { lineNumbers: true, }, ); - chain_document_submit("input", input_editor, render_parse_results); + + const submit_input = chain_document_submit( + "input", input_editor, render_parse_results); + + chain_document_submit( + "grammar", grammar_editor, submit_input); } setup_editors(); diff --git a/dingus/style.css b/dingus/style.css index 3c24144..0b9426f 100644 --- a/dingus/style.css +++ b/dingus/style.css @@ -49,6 +49,12 @@ body { grid-column: 3; grid-row: 2; padding: 0.25rem; + + overflow-y: scroll; +} + +.parsed-node { + margin-left: 1rem; } .main-textarea { diff --git a/dingus/worker.js b/dingus/worker.js index 9b30b29..d9dc326 100644 --- a/dingus/worker.js +++ b/dingus/worker.js @@ -118,6 +118,7 @@ def eval_grammar(code): LEXER = grammar.compile_lexer() dingus.post_grammar_loaded(grammar.name) + except Exception as e: traceback.print_exc() dingus.post_grammar_error(f"{e}") @@ -125,6 +126,7 @@ def eval_grammar(code): def tree_to_js(tree): if tree is None: return None + elif isinstance(tree, runtime.Tree): return { "kind": "tree", @@ -133,9 +135,11 @@ def tree_to_js(tree): "end": tree.end, "children": [tree_to_js(child) for child in tree.children], } + else: return { "kind": "token", + "name": tree.kind, "start": tree.start, "end": tree.end, }