+
+/* View Logic */
+window.onload = () => {
+ let forthdiv = document.getElementById("forth")
+ if (forthdiv === null) {
+ forthdiv = document.createElement("div")
+ forthdiv.setAttribute("style","height:100%;margin:auto;width:100%;max-width:640px;overflow-x:hidden;")
+ document.body.appendChild(forthdiv)
+ }
+ const outframe = document.createElement("div")
+ outframe.setAttribute("style", "background-color:black;padding-left:6px;padding-right:6px;color:chartreuse;height:268px;resize:vertical;display:flex;align-items:flex-end;flex-flow:row;")
+ const stackview = document.createElement("pre")
+ stackview.setAttribute("style", "white-space:pre-wrap;flex:0 0 6%;")
+ outframe.appendChild(stackview)
+ const txtoutput = document.createElement("pre")
+ txtoutput.setAttribute("style", "white-space:pre-wrap;max-height:256px;overflow-y:scroll;flex:1 0 342px;")
+ outframe.appendChild(txtoutput)
+ /* const rstackview = document.createElement("pre")
+ rstackview.setAttribute("style", "white-space:pre-wrap;flex:0 1 8%;")
+ outframe.appendChild(rstackview) */
+ const memview = document.createElement("pre")
+ memview.setAttribute("style", "padding-left: 8px; white-space:pre-wrap;flex:0 0 88px;")
+ outframe.appendChild(memview)
+ const txtinput = document.createElement("textarea")
+ txtinput.setAttribute("autofocus", "true")
+ txtinput.setAttribute("wrap", "hard")
+ txtinput.setAttribute("style", "resize:none;white-space:pre;margin-left:6%;width:77%;")
+ txtinput.oninput = () => txtinput.setAttribute("rows", ((txtinput.value.match(/[\n]/g) || [1]).length + 1).toString());
+ txtinput.oninput()
+ txtinput.onkeydown = (event) => {
+ switch (event.key) {
+ case "Enter":
+ if (event.ctrlKey) {
+ const endPos = txtinput.selectionStart + 1
+ txtinput.value =
+ txtinput.value.substring(0, txtinput.selectionStart) +
+ '\n' +
+ txtinput.value.substring(txtinput.selectionEnd, txtinput.value.length)
+ txtinput.setSelectionRange(endPos, endPos)
+ txtinput.oninput()
+ }
+ else {
+ if (txtinput.value.length && !/\s/.test(txtinput.value.slice(-1)))
+ txtinput.value += " "
+ event.preventDefault()
+ event.stopPropagation()
+ getChannel(0).write(strToArrayBuffer(txtinput.value))
+ txtinput.value = ""
+ }
+ break
+ case "Backspace":
+ break
+ default:
+ break
+ }
+ }
+ forthdiv.appendChild(outframe)
+ forthdiv.appendChild(txtinput)
+ /* Set up output functions */
+ output.print = (string) => txtoutput.textContent += string,
+ output.updateViews = () => {
+ const base = wasmBase()
+ stackview.textContent = simstack.map((v) => v.toString(base)).join('\n')
+ // rstackview.textContent = rstack.join('\n')
+ let cnt = 0;
+ const maxBytes = 64
+ let here = new DataView(wasmMem, 14340 /* here */, 4).getUint32(0,true)
+ memview.textContent = Array.from(new Uint8Array(wasmMem, here - maxBytes, maxBytes), (v) => {
+ cnt++;
+ v = ('0' + (v & 0xFF).toString(16)).slice(-2)
+ if (cnt === maxBytes)
+ return v
+ if ((cnt % 16) === 0)
+ return `${v}\n=> ${(here -maxBytes + cnt).toString(base)}\n`
+ if ((cnt % 4) === 0)
+ return `${v}\n`
+ return `${v} `
+ }).join('')
+ outframe.scrollTop = outframe.scrollHeight
+ txtoutput.scrollTop = txtoutput.scrollHeight
+ }
+}