diff --git a/dev/debugger.js b/dev/debugger.js new file mode 100644 index 0000000..3c15c7c --- /dev/null +++ b/dev/debugger.js @@ -0,0 +1,70 @@ +"use strict"; +// CLEAR DEBUGGING FLAGS // +// line occupancy in built js source +let debug_source_line_occupancy = {}; + + +// EMPTY ERROR BUFFER FOR TIME UNTIL HTML IS AVAILABLE // +let javascript_error_buffer = []; + + +function debug_javascript_error_message(error_event){ + // TRANSLATE TO SOURCE FILE'S LINES // + // find source file occupying this line + let source_file = null; + let source_line = 0; + for(var one_source_file in debug_source_line_occupancy){ + let occupancy = debug_source_line_occupancy[one_source_file]; + if(error_event.lineno >= occupancy.start && (occupancy.end === undefined || error_event.lineno <= occupancy.end)){ + // remember source file name + source_file = one_source_file; + + // translate compiled line to source file line + source_line = error_event.lineno - debug_source_line_occupancy[source_file].start + 1; + + // stop searching + break; + } + } + + + // OUTPUT MESSAGE // + // build line info + let line_info_string; + if(source_file !== null){ + line_info_string = source_file + " line " + source_line; + } else { + line_info_string = "raw source" + " line " + error_event.lineno; + } + + // send to callback + my_error_callback("(" + line_info_string + ") " + error_event.message, "javascript"); +} + + +// EMPTY ERROR BUFFER WHEN HTML IS AVAILABLE // +document.addEventListener("DOMContentLoaded", function(){ + // print messages + for(var one_error_event of javascript_error_buffer){ + debug_javascript_error_message(one_error_event); + } + + // disable buffer + javascript_error_buffer = null; +}); + +window.addEventListener("error", function(error_event){ + // OUTPUT // + if(javascript_error_buffer !== null){ + // add to buffer + javascript_error_buffer.push(error_event); + + } else { + // output directly + debug_javascript_error_message(error_event); + } + + + // DON'T CANCEL EVENT // + return false; +}); diff --git a/dev/index.css b/dev/index.css new file mode 100644 index 0000000..fda0b60 --- /dev/null +++ b/dev/index.css @@ -0,0 +1,152 @@ +:root { + --onedark-bg: #21252b; + --onedark-bg-light: #2c313a; + --onedark-white: #c5cad3; + --onedark-gray: #828997; + --onedark-gray-dark: #5c6370; + --onedark-gray-dark-dark: #454b54; + --onedark-red: #e06c75; + --onedark-orange: #d19a66; + --onedark-yellow: #e5c07b; + --onedark-green: #98c379; + --onedark-cyan: #56b6c2; + --onedark-blue: #61afef; + --onedark-purple: #c678dd; +} +html, body { + margin: 0px; + padding: 0px; + overflow: hidden; +} +body { + background-color: var(--onedark-bg); + padding: 2em; +} + + +span.line { + display: block; + color: var(--onedark-white); +} +span.line.stderr-debug { color: var(--onedark-green); } +span.line.stderr-info { color: var(--onedark-blue); } +span.line.stderr-warning { color: var(--onedark-orange); } +span.line.stderr-error { color: var(--onedark-red); } +span.line.stderr-javascript { color: var(--onedark-purple); } + + + + + +div.collection { + display: flex; + flex-wrap: wrap; + gap: 2rem; +} + +div.collection div.item { + flex-basis: 50%; + flex: 20rem; + + height: calc(100vh - 4em); + max-width: 100%; + + position: relative; + + display: flex; + flex-flow: column nowrap; + + margin: 0rem; + padding: 0rem; +} + +@media only screen and (max-width: 1200px) { + div.collection div.item { + flex-basis: 100%; + height: auto; + } +} + + + + + + + + + + +.button { + align-items: center; + + padding: 1rem 1.5rem; + width: fit-content; + + color: var(--onedark-white); + + background-color: var(--onedark-bg-light); +} + +.button:not(.one-line) { + display: inline-flex; + margin: 1rem 1rem 0rem 0rem; +} +.button.one-line { + display: flex; + margin: 0rem 0rem 1rem 0rem; +} + +.button:hover { + cursor: pointer; + background-color: var(--onedark-gray-dark-dark); +} + +.button .text { + display: inline-flex; + flex-flow: column; + margin-left: 1rem; +} +.button img.icon { + height: 1.5rem; +} +.button .extra { + color: var(--onedark-gray); +} + + + + + + + + + + + + + + + +div.collection div.item.editor > div.prism-live { + height: 100%; +} + + + + + + +div.collection div.item.console div.controls { + padding-bottom: 1rem; +} +#console { + margin: 0px; + padding: 1rem; + overflow: auto; + font-size: 1rem; + + height: 100%; + overflow: auto; + + background-color: var(--onedark-bg-light); +} diff --git a/dev/index.js b/dev/index.js new file mode 100644 index 0000000..3e60e53 --- /dev/null +++ b/dev/index.js @@ -0,0 +1,55 @@ +"use strict"; +let my_output_callback = function(text){ + let line_list = text.split("\n"); + + for(let one_line of line_list){ + let span_one_line = document.createElement("span"); + + span_one_line.classList.add("line"); + span_one_line.textContent = one_line; + + document.getElementById("console").appendChild(span_one_line); + document.getElementById("console").scrollTop = document.getElementById("console").scrollHeight; + } +} +let my_error_callback = function(text, type){ + let span_one_line = document.createElement("span"); + + span_one_line.classList.add("line", "stderr-" + type); + span_one_line.textContent = text + "\n"; + + document.getElementById("console").appendChild(span_one_line); + document.getElementById("console").scrollTop = document.getElementById("console").scrollHeight; +} + +let juicescript = new Juicescript({ + callback: { + stdout: my_output_callback, + stderr: my_error_callback + } +}); + +function button_run(){ + // clear console + document.getElementById("console").innerHTML = ""; + + // get source code from editor + let juice_program = document.getElementById("editor").value; + + // parse source code + /**/const parse_start = performance.now(); + let parse_success = juicescript.parse(juice_program); + /**/const parse_end = performance.now(); + /**/juicescript.io.stderr.info("Parsing took " + (parse_end - parse_start) + "ms"); + + // execute program + if(parse_success){ + /**/const run_start = performance.now(); + juicescript.run(); + /**/const run_end = performance.now(); + /**/juicescript.io.stderr.info("Running took " + (run_end - run_start) + "ms"); + + } else { + juicescript.io.stderr.info("Not executing program due to parse error"); + } +} diff --git a/dev/index.php b/dev/index.php index e51c3f1..ff07259 100644 --- a/dev/index.php +++ b/dev/index.php @@ -5,126 +5,18 @@