| 1 | (function(t,n){const e=n(t);if(typeof exports==="object"&&typeof exports["nodeName"]!=="string"){module.exports=e}else{if("_hyperscript"in t)t._hyperscript.use(e)}})(typeof self!=="undefined"?self:this,(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){if(!o.matchToken("breakpoint"))return;var i;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){console.log("=== HDB///_hyperscript/debugger ===");this.ui();return 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:true})}))};n.prototype.continueExec=function(){this.bus.dispatchEvent(new Event("continue"))};n.prototype.stepOver=function(){if(!this.cmd)return this.continueExec();var t=this.cmd&&this.cmd.type==="breakpointCommand"?this.runtime.findNext(this.cmd,this.ctx):this.runtime.unifiedEval(this.cmd,this.ctx);if(t.type==="implicitReturn")return this.stepOut();if(t&&t.then instanceof Function){return t.then((t=>{this.cmd=t;this.bus.dispatchEvent(new Event("step"));this.logCommand()}))}else if(t.halt_flag){this.bus.dispatchEvent(new Event("continue"))}else{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;var n=this.ctx.me;this.ctx=this.ctx.meta.caller;console.log("[hdb] stepping out into "+this.ctx.meta.feature.displayName);if(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;const s=t.internals.lexer.tokenize(e);const 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;var n=t?this.cmd.sourceFor():"-- "+this.cmd.type;console.log("[hdb] current command: "+n)};n.prototype.traverse=function(t){const n=[];(function t(e){n.push(e);if("children"in e)for(const n of e.children)t(n)})(t);return n};var e=`\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`;n.prototype.ui=function(){var n=document.createElement("div");var o=n.attachShadow({mode:"open"});n.style.cssText="all: initial";o.innerHTML=e;document.body.appendChild(n);t.processNode(o.querySelector(".hdb"))}}));
|