| 1 | var t=t=>{function n(n,e,o){this.ctx=n,this.runtime=e,this.cmd=o,this._hyperscript=t,this.cmdMap=[],this.bus=new EventTarget}t.addCommand("breakpoint",function(t,e,o){var i;if(o.matchToken("breakpoint"))return{op:function(t){globalThis.hdb=i=new n(t,e,this);try{return i.break(t)}catch(t){console.error(t,t.stack)}}}}),n.prototype.break=function(t){return console.log("=== HDB///_hyperscript/debugger ==="),this.ui(),new Promise((n,e)=>{this.bus.addEventListener("continue",()=>{if(this.ctx!==t){for(var e in t)delete t[e];Object.assign(t,this.ctx)}delete window.hdb,n(this.runtime.findNext(this.cmd,this.ctx))},{once:!0})})},n.prototype.continueExec=function(){this.bus.dispatchEvent(new Event("continue"))},n.prototype.stepOver=function(){if(!this.cmd)return this.continueExec();var t=this.cmd&&"breakpointCommand"===this.cmd.type?this.runtime.findNext(this.cmd,this.ctx):this.runtime.unifiedEval(this.cmd,this.ctx);return"implicitReturn"===t.type?this.stepOut():t&&t.then instanceof Function?t.then(t=>{this.cmd=t,this.bus.dispatchEvent(new Event("step")),this.logCommand()}):void(t.halt_flag?this.bus.dispatchEvent(new Event("continue")):(this.cmd=t,this.bus.dispatchEvent(new Event("step")),this.logCommand()))},n.prototype.stepOut=function(){if(!this.ctx.meta.caller)return this.continueExec();var t=this.ctx.meta.callingCommand,n=this.ctx.me;this.ctx=this.ctx.meta.caller,console.log("[hdb] stepping out into "+this.ctx.meta.feature.displayName),this.ctx.me instanceof Element&&this.ctx.me!==n&&console.log("[hdb] me: ",this.ctx.me),this.cmd=this.runtime.findNext(t,this.ctx),this.cmd=this.runtime.findNext(this.cmd,this.ctx),this.logCommand(),this.bus.dispatchEvent(new Event("step"))},n.prototype.skipTo=function(t){this.cmd=t.cmd,this.bus.dispatchEvent(new Event("skip"))},n.prototype.rewrite=function(n,e){console.log("##",n);const o=n.cmd.parent;let i;for(i of o.children)if(i.next===n.cmd)break;const r=n.next,s=t.internals.lexer.tokenize(e),a=t.internals.parser.requireElement("command",s);console.log(a),a.startToken=n.startToken,a.endToken=n.endToken,a.programSource=n.programSource,a.sourceFor=function(){return e},i.next=a,a.next=r,a.parent=o,this.bus.dispatchEvent(new Event("step"))},n.prototype.logCommand=function(){var t=this.cmd.sourceFor instanceof Function?this.cmd.sourceFor():"-- "+this.cmd.type;console.log("[hdb] current command: "+t)},n.prototype.traverse=function(t){const n=[];return function t(e){if(n.push(e),"children"in e)for(const n of e.children)t(n)}(t),n},n.prototype.ui=function(){var n=document.createElement("div"),e=n.attachShadow({mode:"open"});n.style.cssText="all: initial",e.innerHTML='\n<div class="hdb" _="\n\ton load trigger update end\n\ton step from hdb.bus trigger update end\n\ton skip from hdb.bus trigger update end\n\ton continue from hdb.bus log \'done\' then remove me.getRootNode().host">\n\n\t<script type="text/hyperscript">\n\n\tdef escapeHTML(unsafe)\n\t\tjs(unsafe) return unsafe\n\t\t\t.replace(/&/g, "&")\n\t\t\t.replace(/</g, "<")\n\t\t\t.replace(/>/g, ">")\n\t\t\t.replace(/\\x22/g, """)\n\t\t\t.replace(/\\x27/g, "'") end\n\t\treturn it\n\tend\n\n\tdef makeCommandWidget(i)\n\t\tget `<span data-cmd=${i}><button class=skip data-cmd=${i}>⤷</button>`\n\t\tif hdb.EXPERIMENTAL\n\t\t\tappend `<button class=rewrite data-cmd=${i}>Rewrite</button></span>`\n\t\tend\n\t\treturn it\n\tend\n\n\tdef renderCode\n\t\tset hdb.cmdMap to []\n\t\tset src to hdb.cmd.programSource\n\n\t\t-- Find feature\n\t\tset feat to hdb.cmd\n\t\trepeat until no feat.parent or feat.isFeature set feat to feat.parent end\n\n\t\t-- Traverse, finding starts\n\t\tfor cmd in hdb.traverse(feat)\n\t\t\tif no cmd.startToken continue end\n\t\t\tappend {\n\t\t\t\tindex: cmd.startToken.start,\n\t\t\t\twidget: makeCommandWidget(hdb.cmdMap.length),\n\t\t\t\tcmd: cmd\n\t\t\t} to hdb.cmdMap\n\t\tend\n\n\t\tset rv to src.slice(0, hdb.cmdMap[0].index)\n\t\tfor obj in hdb.cmdMap index i\n\t\t\tif obj.cmd is hdb.cmd\n\t\t\t\tappend obj.widget + \'<u class=current>\' +\n\t\t\t\t\tescapeHTML(src.slice(obj.index, hdb.cmdMap[i+1].index)) + \'</u>\' to rv\n\t\t\telse\n\t\t\t\tappend obj.widget + escapeHTML(src.slice(obj.index, hdb.cmdMap[i+1].index)) to rv\n\t\t\tend\n\t\tend\n\t\treturn rv\n\tend\n\n\tdef truncate(str, len)\n\t\tif str.length <= len return str end\n\t\treturn str.substr(0, len) + \'…\'\n\n\tdef prettyPrint(obj)\n\t\tif obj is null return \'null\' end\n\t\tif Element.prototype.isPrototypeOf(obj)\n\t\t\tset rv to \'<<span class="token tagname">\' +\n\t\t\t\tobj.tagName.toLowerCase() + "</span>"\n\t\t\tfor attr in Array.from(obj.attributes)\n\t\t\t\tif attr.specified\n\t\t\t\t\tset rv to rv +\n\t\t\t\t\t\t\' <span class="token attr">\' + attr.nodeName +\n\t\t\t\t\t\t\'</span>=<span class="token string">"\' + truncate(attr.textContent, 10) +\n\t\t\t\t\t\t\'"</span>\'\n\t\t\t\tend\n\t\t\tend\n\t\t\tset rv to rv + \'>\'\n\t\t\treturn rv\n\t\telse if obj.call\n\t\t\tif obj.hyperfunc\n\t\t\t\tget "def " + obj.hypername + \' ...\'\n\t\t\telse\n\t\t\t\tget "function "+obj.name+"(...) {...}"\n\t\t\tend\n\t\telse if obj.toString\n\t\t\tcall obj.toString()\n\t\tend\n\t\treturn escapeHTML((it or \'undefined\').trim())\n\tend\n\t<\/script>\n\n\t<header _="\n\ton pointerdown(clientX, clientY)\n\t\thalt the event\n\t\tcall event.stopPropagation()\n\t\tget first .hdb\n\t\tmeasure its x, y\n\t\tset xoff to clientX - x\n\t\tset yoff to clientY - y\n\t\trepeat until event pointerup from document\n\t\t\twait for pointermove or pointerup from document\n\t\t\tadd {\n\t\t\t\tleft: ${its clientX - xoff}px;\n\t\t\t\ttop: ${its clientY - yoff}px;\n\t\t\t} to .hdb\n\t\tend\n\t">\n\t\t<h2 class="titlebar">HDB</h2>\n\t\t<ul role="toolbar" class="toolbar" _="on pointerdown halt">\n\t\t\t<li><button _="on click call hdb.continueExec()">\n\t\t\t\t⏵ Continue\n\t\t\t</button>\n\t\t\t<li><button _="on click call hdb.stepOver()">\n\t\t\t\t↷ Step Over\n\t\t\t</button>\n\t\t</ul>\n\t</header>\n\n\t<section class="sec-code">\n\n\t\t<div class="code-container">\n\t\t\t<pre class="code language-hyperscript" _="\n\t\t\t\ton update from .hdb if hdb.cmd.programSource\n\t\t\t \tput renderCode() into me\n\t\t\t \tif Prism\n\t\t\t \t\tcall Prism.highlightAllUnder(me)\n\t\t\t \tend\n\t\t\t go to bottom of .current in me\n\t\t\t\tend\n\n\t\t\t\ton click\n\t\t\t\t\tif target matches .skip\n\t\t\t\t\t\tget (target\'s @data-cmd) as Int\n\t\t\t\t\t\tcall hdb.skipTo(hdb.cmdMap[result])\n\t\t\t\t\tend\n\t\t\t\t\tif target matches .rewrite\n\t\t\t\t\t\tset cmdNo to (target\'s @data-cmd) as Int\n\t\t\t\t\t\tset span to the first <span[data-cmd=\'${cmdNo}\'] />\n\t\t\t\t\t\tput `<form class=rewrite><input id=cmd></form>` into the span\n\t\t\t\t\tend\n\t\t\t\tend\n\n\t\t\t\ton submit\n\t\t\t\t\thalt the event\n\t\t\t\t\tget (closest @data-cmd to target) as Int\n\t\t\t\t\tcall hdb.rewrite(hdb.cmdMap[result], #cmd\'s value)\n\t\t\t\tend\n\t\t\t"><code></code></pre>\n\t\t</div>\n\t</section>\n\n\t<section class="sec-console" _="\n\t\t-- Print context at startup\n\t\tinit repeat for var in Object.keys(hdb.ctx) if var is not \'meta\'\n\t\t\tsend hdbUI:consoleEntry(input: var, output: hdb.ctx[var]) to #console">\n\n\t\t<ul id="console" role="list" _="\n\t\t\ton hdbUI:consoleEntry(input, output)\n\t\t\t\tif no hdb.consoleHistory set hdb.consoleHistory to [] end\n\t\t\t\tpush(input) on hdb.consoleHistory\n\t\t\t\tset node to #tmpl-console-entry.content.cloneNode(true)\n\t\t\t\tput the node at end of me\n\t\t\t\tset entry to my lastElementChild\n\t\t\t\tgo to bottom of the entry\n\t\t\t\tput escapeHTML(input) into .input in the entry\n\t\t\t\tif no output\n\t\t\t\t\tcall hdb._hyperscript.parse(input)\n\t\t\t\t\tif its execute is not undefined then call its execute(hdb.ctx)\n\t\t\t\t\telse call its evaluate(hdb.ctx)\n\t\t\t\t\tend\n\t\t\t\t\tset output to it\n\t\t\t\tend\n\t\t\t\tput prettyPrint(output) as Fragment into .output in the entry\n\t\t\t">\n\t\t\t<template id="tmpl-console-entry">\n\t\t\t\t<li class="console-entry">\n\t\t\t\t\t<kbd><code class="input"></code></kbd>\n\t\t\t\t\t<samp class="output"></samp>\n\t\t\t\t</li>\n\t\t\t</template>\n\t\t</ul>\n\n\t\t<form id="console-form" data-hist="0" _="on submit\n\t\t\t\tsend hdbUI:consoleEntry(input: #console-input\'s value) to #console\n\t\t\t\tset #console-input\'s value to \'\'\n\t\t\t\tset @data-hist to 0\n\t\t\t\tset element oldContent to null\n\t\t\t\thalt\n\t\t\ton keydown[key is \'ArrowUp\' or key is \'ArrowDown\']\n\t\t\t\tif no hdb.consoleHistory or exit end\n\t\t\t\tif element oldContent is null set element oldContent to #console-input.value end\n\t\t\t\tif event.key is \'ArrowUp\' and hdb.consoleHistory.length > -@data-hist\n\t\t\t\t\tdecrement @data-hist\n\t\t\t\telse if event.key is \'ArrowDown\' and @data-hist < 0\n\t\t\t\t\tincrement @data-hist\n\t\t\t\tend end\n\t\t\t\tset #console-input.value to hdb.consoleHistory[hdb.consoleHistory.length + @data-hist as Int]\n\t\t\t\t\tor oldContent\n\t\t\t\thalt default\n\t\t\ton input if @data-hist is \'0\' set element oldContent to #console-input.value">\n\t\t\t<input id="console-input" placeholder="Enter an expression…"\n\t\t\t\tautocomplete="off">\n\t\t</form>\n\t</section>\n\n\t<style>\n\t.hdb {\n\t\tborder: 1px solid #888;\n\t\tborder-radius: .3em;\n\t\tbox-shadow: 0 .2em .3em #0008;\n\t\tposition: fixed;\n\t\ttop: .5em; right: .5em;\n\t\twidth: min(40ch, calc(100% - 1em));\n\t\tmax-height: calc(100% - 1em);\n\t\tbackground-color: white;\n\t\tfont-family: sans-serif;\n\t\topacity: .9;\n\t\tz-index: 2147483647;\n\t\tcolor: black;\n\t\tdisplay: flex;\n\t\tflex-flow: column;\n\t}\n\n\t* {\n\t\tbox-sizing: border-box;\n\t}\n\n\theader {\n\t\tdisplay: flex;\n\t\tjustify-content: space-between;\n\t\talign-items: center;\n\t\tpadding: .4em;\n\t}\n\n\t.titlebar {\n\t\tmargin: 0;\n\t\tfont-size: 1em;\n\t\ttouch-action: none;\n\t}\n\n\t.toolbar {\n\t\tdisplay: flex;\n\t\tgap: .35em;\n\n\t\tlist-style: none;\n\t\tpadding-left: 0;\n\t\tmargin: 0;\n\t}\n\n\t.toolbar a, .toolbar button {\n\t\tbackground: #2183ff;\n\t\tborder: 1px solid #3465a4;\n\t\tbox-shadow: 0 1px #b3c6ff inset, 0 .06em .06em #000;\n\t\tborder-radius: .2em;\n\t\tfont: inherit;\n\t\tpadding: .2em .3em;\n\t\tcolor: white;\n\t\ttext-shadow: 0 1px black;\n\t\tfont-weight: bold;\n\t}\n\n\t.toolbar a:hover .toolbar a:focus, .toolbar button:hover, .toolbar button:focus {\n\t\tbackground: #94c8ff;\n\t}\n\n\t.toolbar a:active, .toolbar button:active {\n\t\tbackground: #3465a4;\n\t}\n\n\t.sec-code {\n\t\tborder-radius: .3em;\n\t\toverflow: hidden;\n\t\tbox-shadow: 0 1px white inset, 0 .06em .06em #0008;\n\t\tbackground: #bdf;\n\t\tmargin: 0 .4em;\n\t\tborder: 1px solid #3465a4;\n\t}\n\n\t.hdb h3 {\n\t\tmargin: 0;\n\t\tfont-size: 1em;\n\t\tpadding: .2em .4em 0 .4em;\n\t}\n\n\t.code-container {\n\t\tdisplay: grid;\n\t\tline-height: 1.2em;\n\t\theight: calc(12 * 1.2em);\n\t\tborder-radius: 0 0 .2em .2em;\n\t\toverflow: auto;\n\t\tscrollbar-width: thin;\n\t\tscrollbar-color: #0003 transparent;\n\t}\n\n\t.code, #console, #console-input {\n\t\tfont-family: Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace;\n\t}\n\n\t.code {\n\t\twidth: 0;\n\t\tmargin: 0;\n\t\tpadding-left: 1ch;\n\t\ttab-size: 2;\n\t\t-moz-tab-size: 2;\n\t\t-o-tab-size: 2;\n\t}\n\n\t.current {\n\t\tfont-weight: bold;\n\t\tbackground: #abf;\n\t}\n\n\t.skip {\n\t\tpadding: 0;\n\t\tmargin: 2px;\n\t\tborder: 1px solid #3465a4;\n\t\tborder-radius: 50%;\n\t\tcolor: #3465a4;\n\t\tbackground: none;\n\t\tfont-weight: bold;\n\t\tfont-size: 1.2em;\n\t\twidth: calc(2ch / 1.2 - 4px);\n\t\theight: calc(2ch / 1.2 - 4px);\n\t\tline-height: 0.6;\n\t}\n\n\t.skip:hover {\n\t\tbackground: #3465a4;\n\t\tcolor: #bdf;\n\t}\n\n\t#console {\n\t\toverflow-y: scroll;\n\t\tscrollbar-width: thin;\n\t\tscrollbar-color: #afc2db transparent;\n\t\theight: calc(12 * 1.2em);\n\t\tlist-style: none;\n\t\tpadding-left: 0;\n\t\tmargin: 0 .4em .4em .4em;\n\t\tposition: relative;\n\t\tword-wrap: break-word;\n\t}\n\n\t#console>*+* {\n\t\tmargin-top: .5em;\n\t}\n\n\t.console-entry>* {\n\t\tdisplay: block;\n\t}\n\n\t.console-entry .input { color: #3465a4; }\n\t.console-entry .output { color: #333; }\n\n\t.console-entry .input:before { content: \'>> \' }\n\t.console-entry .output:before { content: \'<- \' }\n\n\t#console-form {\n\t\tmargin: 0 .4em .4em .4em;\n\t}\n\n\t#console-input {\n\t\twidth: 100%;\n\t\tfont-size: inherit;\n\t}\n\n\t.token.tagname { font-weight: bold; }\n\t.token.attr, .token.builtin, .token.italic { font-style: italic; }\n\t.token.string { opacity: .8; }\n\t.token.keyword { color: #3465a4; }\n\t.token.bold, .token.punctuation, .token.operator { font-weight: bold; }\n\t</style>\n\t</div>\n\t',document.body.appendChild(n),t.processNode(e.querySelector(".hdb"))}};export{t as default};
|