mirror of
https://github.com/ruuda/rcl.git
synced 2025-10-08 16:10:24 +00:00
aef82e2cfc
No Tree-sitter, no obscure linker problems! It's not as robust and the highlighting is less nice, but it's a lot easier to get working.
57 lines
1.7 KiB
HTML
57 lines
1.7 KiB
HTML
<html>
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>RCL WASM Demo</title>
|
|
<script src='/rcl.js' async></script>
|
|
<script>
|
|
window.onload = function() {
|
|
const {
|
|
rcl_evaluate_json,
|
|
rcl_evaluate_query_value,
|
|
rcl_evaluate_query,
|
|
rcl_highlight,
|
|
} = wasm_bindgen;
|
|
async function run() {
|
|
await wasm_bindgen();
|
|
const input_box = document.getElementById("input");
|
|
const output_box = document.getElementById("output");
|
|
input_box.addEventListener("input", (evt) => {
|
|
const input = evt.target.value;
|
|
const out_node = document.createElement("code");
|
|
const out_width = 60;
|
|
const max_len = 5000;
|
|
rcl_evaluate_json(input_box.textContent, out_node, out_width, max_len);
|
|
output_box.replaceChild(out_node, output_box.firstChild);
|
|
});
|
|
}
|
|
run();
|
|
}
|
|
</script>
|
|
<style>
|
|
body {
|
|
padding: 2em;
|
|
}
|
|
p {
|
|
font-family: monospace;
|
|
padding: 1em;
|
|
border: 1pt solid #ddd;
|
|
white-space: pre;
|
|
}
|
|
code .error { font-weight: bold; color: red; }
|
|
code .warning { font-weight: bold; color: darkgoldenrod; }
|
|
code .field { color: blue; }
|
|
code .string { color: cyan; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<h1>RCL Playground</h1>
|
|
<h2>Input</h2>
|
|
<p id="input" contenteditable="true" plaintext-only="true">[for x in std.range(0, 3): { id = x, name = f"item-{x}" }]</p>
|
|
<h2>Output</h2>
|
|
<p id="output"><code>[
|
|
{"id": 0, "name": "item-0"},
|
|
{"id": 1, "name": "item-1"},
|
|
{"id": 2, "name": "item-2"}
|
|
]</code></p>
|
|
</body>
|
|
</html>
|