arthur/cel-rust-wasm
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

allow including context

Browse Source 
https://claude.ai/chat/a6df04ed-85dd-46b9-a3bd-26b5ae3c78f5
This commit is contained in:
Arthur Schuster
2025-08-08 06:56:49 +02:00
parent 05f19de969
commit 6ccf7dce24
4 changed files with 209 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

126
index.html
View File

@@ -3,20 +3,72 @@
<head>
<meta charset="utf-8" />
<title>Starlark evaluator</title>
<title>CEL evaluator</title>
<style type="text/css">
body {
font-family: sans-serif;
max-width: 1200px;
margin: 0 auto;
padding: 20px;
}
.container {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 20px;
margin-bottom: 20px;
}
.full-width {
grid-column: 1 / -1;
}
textarea {
width: calc(100% - 20px);
height: 20em;
width: 100%;
height: 15em;
box-sizing: border-box;
margin: 5px;
border-radius: 3px;
padding: 5px;
border-color: lightgray;
border-radius: 5px;
padding: 10px;
border: 2px solid lightgray;
font-family: 'Courier New', monospace;
font-size: 14px;
resize: vertical;
}
#output {
background-color: #f8f9fa;
height: 10em;
}
label {
font-weight: bold;
display: block;
margin-bottom: 5px;
color: #333;
}
.error {
color: #d32f2f;
background-color: #ffebee;
}
.success {
color: #2e7d32;
background-color: #e8f5e9;
}
h1 {
color: #1976d2;
margin-bottom: 10px;
}
p {
color: #666;
line-height: 1.4;
}
a {
color: #1976d2;
}
</style>
</head>
@@ -39,7 +91,6 @@
const writeString = (s) => {
const encoded = new TextEncoder().encode(s.trim());
const offset = instance.exports.allocation(4 + encoded.byteLength);
// TODO(april): this probably isn't guaranteed to be 4-byte aligned? Might need to fix.
const memory = instance.exports.memory.buffer;
const uint32s = new Uint32Array(memory, offset, 1);
uint32s[0] = encoded.byteLength;
@@ -48,29 +99,62 @@
return offset;
};
const content = document.getElementById("input").value;
const offset = instance.exports.evaluate(writeString(content));
// Combine CEL expression and JSON context
const expression = document.getElementById("input").value;
const context = document.getElementById("context").value;
// Create a combined input with expression and context separated by a delimiter
const combinedInput = expression + "\n---CONTEXT---\n" + context;
const offset = instance.exports.evaluate(writeString(combinedInput));
const ok = readU8(offset) != 0;
const result = readString(offset + 4);
const output = document.getElementById("output");
output.value = (ok ? "" : "ERROR\n") + result;
// Style the output based on success/error
if (ok) {
output.className = "success";
output.value = result;
} else {
output.className = "error";
output.value = "ERROR\n" + result;
}
}).catch(error => {
const output = document.getElementById("output");
output.className = "error";
output.value = "WASM Loading Error: " + error.message;
});
}
window.addEventListener("load", function () {
document.getElementById("input").addEventListener("input", run, false);
run()
})
document.getElementById("context").addEventListener("input", run, false);
run();
});
</script>
<h1>Starlark evaluator</h1>
<h1>CEL evaluator</h1>
<p>
Using <a href="https://github.com/cel-rust/cel-rust">cel-rust</a> compiled to web assembly.
Change the input to see it update.
Using <a href="https://github.com/cel-rust/cel-rust">cel-rust</a> compiled to WebAssembly.
Change the CEL expression or JSON context to see it update in real-time.
</p>
<textarea id="input">
"Hello " + "world!"</textarea>
<textarea id="output" readonly="readonly" style="background-color: lightgray;">
</textarea>
<div class="container">
<div>
<label for="input">CEL Expression:</label>
<textarea id="input" placeholder="Enter your CEL expression here...">name + " is " + string(age) + " years old"</textarea>
</div>
<div>
<label for="context">JSON Context:</label>
<textarea id="context" placeholder="Enter JSON context here...">{"name": "Alice", "age": 30, "active": true}</textarea>
</div>
</div>
<div class="full-width">
<label for="output">Result:</label>
<textarea id="output" readonly="readonly"></textarea>
</div>
</body>
</html>
</html>