treehouse/template/sandbox.hbs
2024-02-18 23:37:31 +01:00

63 lines
1.7 KiB
Handlebars

<!DOCTYPE html>
<html>
<head>
<title>treehouse iframe sandbox</title>
<style>
body {
margin: 0;
overflow: hidden;
width: fit-content;
height: fit-content;
}
canvas {
display: block;
}
</style>
<script type="importmap">{
"imports": {
"treehouse/": "{{ config.site }}/static/js/",
"tairu/": "{{ config.site }}/static/js/components/tairu/"
}
}</script>
<script type="module">
import { evaluate, domConsole, jsConsole } from "treehouse/components/literate-programming/eval.js";
import { internals as sandboxInternals } from "treehouse/sandbox.js";
globalThis.console = domConsole;
addEventListener("message", async event => {
let message = event.data;
if (message.action == "eval") {
evaluate(message.input, {
error() {
sandboxInternals.body.replaceChildren();
},
newOutput(currentOutputIndex) {
if (currentOutputIndex == window.treehouseSandboxInternals.outputIndex) {
document.body.replaceChildren(...sandboxInternals.body.childNodes);
postMessage({
kind: "resize",
outputIndex: currentOutputIndex,
});
}
sandboxInternals.resetBody();
},
});
}
});
postMessage({ kind: "ready" });
</script>
</head>
<body></body>
</html>