mirror of
https://github.com/ChaiScript/ChaiScript.git
synced 2026-06-15 00:16:17 +08:00
45cbec0e41
* Fix #693: Add Emscripten/embind bindings for get_state/set_state The Emscripten wrapper exported only the eval family, leaving JS consumers with no way to snapshot or restore the singleton ChaiScript engine. The playground in chaiscript.github.io needs that to reset between runs without reloading the WASM module. Added handle-based wrappers that hide ChaiScript::State behind an int registry so JS callers don't have to manage embind object lifetimes, exported them as saveState/restoreState/releaseState, and added a native regression test that exercises capture, restore, and release through the same wrapper functions the WASM binding uses. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * Address review: snapshot top-level locals alongside engine state ChaiScript::State captures globals, functions, and types but not the top-level scripting locals created by `var x = ...`. The previous restoreState therefore left such variables behind, breaking the playground reset use case and tripping the new test's assertion in Debug builds (where assert is enabled). Pair get_state with get_locals in the snapshot so a restore brings back a clean baseline. Requested by @lefticus in PR #699 review. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * Address review: make ChaiScript engine an opaque handle, drop singleton Replace the static ChaiScript singleton in the Emscripten wrapper with a handle-based registry symmetric to the existing State registry. JS callers now create an engine with chaiscript_create(), pass the resulting handle to the eval/state helpers, and release it with chaiscript_destroy(). Multiple independent engines are now possible, and a state snapshot can be restored onto any engine. Updated the playground HTML and the three native regression tests to exercise the new API. Requested by @lefticus in PR #699 review. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> --------- Co-authored-by: leftibot <leftibot@users.noreply.github.com> Co-authored-by: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
241 lines
6.0 KiB
HTML
241 lines
6.0 KiB
HTML
<!doctype html>
|
|
<!--
|
|
ChaiScript Emscripten Frontend
|
|
Based on work by Rob Loach: https://github.com/RobLoach/ChaiScript.js
|
|
Copyright 2019, Rob Loach
|
|
Copyright 2009-2018, Jason Turner
|
|
Licensed under the BSD License. See "license.txt" for details.
|
|
-->
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>ChaiScript</title>
|
|
<style>
|
|
* { box-sizing: border-box; margin: 0; padding: 0; }
|
|
body {
|
|
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
|
|
background: #1a1a2e;
|
|
color: #e0e0e0;
|
|
min-height: 100vh;
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
header {
|
|
background: #16213e;
|
|
padding: 1rem 2rem;
|
|
border-bottom: 2px solid #0f3460;
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 1rem;
|
|
}
|
|
header h1 {
|
|
font-size: 1.5rem;
|
|
color: #e94560;
|
|
font-weight: 700;
|
|
}
|
|
header span {
|
|
font-size: 0.85rem;
|
|
color: #888;
|
|
}
|
|
#status {
|
|
margin-left: auto;
|
|
font-size: 0.85rem;
|
|
padding: 0.3rem 0.8rem;
|
|
border-radius: 4px;
|
|
background: #0f3460;
|
|
}
|
|
#status.ready { color: #4ecca3; }
|
|
#status.loading { color: #e9c46a; }
|
|
#status.error { color: #e94560; }
|
|
main {
|
|
flex: 1;
|
|
display: flex;
|
|
gap: 0;
|
|
}
|
|
.panel {
|
|
flex: 1;
|
|
display: flex;
|
|
flex-direction: column;
|
|
min-width: 0;
|
|
}
|
|
.panel-header {
|
|
background: #16213e;
|
|
padding: 0.5rem 1rem;
|
|
font-size: 0.8rem;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.1em;
|
|
color: #888;
|
|
border-bottom: 1px solid #0f3460;
|
|
}
|
|
#input {
|
|
flex: 1;
|
|
background: #0d1117;
|
|
color: #c9d1d9;
|
|
border: none;
|
|
padding: 1rem;
|
|
font-family: "SF Mono", "Fira Code", "Fira Mono", Menlo, Consolas, monospace;
|
|
font-size: 0.9rem;
|
|
line-height: 1.6;
|
|
resize: none;
|
|
outline: none;
|
|
tab-size: 2;
|
|
}
|
|
.divider {
|
|
width: 2px;
|
|
background: #0f3460;
|
|
}
|
|
#output {
|
|
flex: 1;
|
|
background: #0d1117;
|
|
padding: 1rem;
|
|
font-family: "SF Mono", "Fira Code", "Fira Mono", Menlo, Consolas, monospace;
|
|
font-size: 0.9rem;
|
|
line-height: 1.6;
|
|
overflow-y: auto;
|
|
white-space: pre-wrap;
|
|
word-break: break-all;
|
|
}
|
|
.output-line { color: #c9d1d9; }
|
|
.output-error { color: #e94560; }
|
|
footer {
|
|
background: #16213e;
|
|
padding: 0.5rem 1rem;
|
|
display: flex;
|
|
gap: 0.5rem;
|
|
align-items: center;
|
|
border-top: 2px solid #0f3460;
|
|
}
|
|
button {
|
|
background: #e94560;
|
|
color: #fff;
|
|
border: none;
|
|
padding: 0.4rem 1.2rem;
|
|
border-radius: 4px;
|
|
cursor: pointer;
|
|
font-size: 0.85rem;
|
|
font-weight: 600;
|
|
}
|
|
button:hover { background: #c73652; }
|
|
button:disabled { background: #555; cursor: not-allowed; }
|
|
#btn-clear {
|
|
background: #0f3460;
|
|
}
|
|
#btn-clear:hover { background: #1a4a8a; }
|
|
.hint {
|
|
margin-left: auto;
|
|
font-size: 0.75rem;
|
|
color: #555;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<header>
|
|
<h1>ChaiScript</h1>
|
|
<span>Interactive Playground</span>
|
|
<div id="status" class="loading">Loading...</div>
|
|
</header>
|
|
<main>
|
|
<div class="panel">
|
|
<div class="panel-header">Input</div>
|
|
<textarea id="input" spellcheck="false">// Welcome to ChaiScript!
|
|
// Write your code here and click Run (or press Ctrl+Enter).
|
|
|
|
def greet(name) {
|
|
return "Hello, " + name + "!"
|
|
}
|
|
|
|
print(greet("World"))
|
|
print(greet("ChaiScript"))
|
|
|
|
// Math example
|
|
def factorial(n) {
|
|
if (n <= 1) { return 1 }
|
|
return n * factorial(n - 1)
|
|
}
|
|
|
|
print("5! = " + to_string(factorial(5)))
|
|
print("10! = " + to_string(factorial(10)))
|
|
</textarea>
|
|
</div>
|
|
<div class="divider"></div>
|
|
<div class="panel">
|
|
<div class="panel-header">Output</div>
|
|
<div id="output"></div>
|
|
</div>
|
|
</main>
|
|
<footer>
|
|
<button id="btn-run" disabled>Run</button>
|
|
<button id="btn-clear">Clear</button>
|
|
<span class="hint">Ctrl+Enter to run</span>
|
|
</footer>
|
|
|
|
<script>
|
|
var outputEl = document.getElementById('output');
|
|
var inputEl = document.getElementById('input');
|
|
var btnRun = document.getElementById('btn-run');
|
|
var btnClear = document.getElementById('btn-clear');
|
|
var statusEl = document.getElementById('status');
|
|
|
|
function appendOutput(text, className) {
|
|
var line = document.createElement('div');
|
|
line.className = className || 'output-line';
|
|
line.textContent = text;
|
|
outputEl.appendChild(line);
|
|
outputEl.scrollTop = outputEl.scrollHeight;
|
|
}
|
|
|
|
var chaiHandle = 0;
|
|
|
|
var Module = {
|
|
print: function(text) {
|
|
appendOutput(text);
|
|
},
|
|
printErr: function(text) {
|
|
appendOutput(text, 'output-error');
|
|
},
|
|
onRuntimeInitialized: function() {
|
|
chaiHandle = Module.create();
|
|
statusEl.textContent = 'Ready';
|
|
statusEl.className = 'ready';
|
|
btnRun.disabled = false;
|
|
}
|
|
};
|
|
|
|
function runCode() {
|
|
var code = inputEl.value;
|
|
if (!code.trim()) return;
|
|
|
|
appendOutput('> Running...', 'output-line');
|
|
try {
|
|
Module.eval(chaiHandle, code);
|
|
} catch (e) {
|
|
appendOutput('Error: ' + e.message, 'output-error');
|
|
}
|
|
appendOutput('', 'output-line');
|
|
}
|
|
|
|
btnRun.addEventListener('click', runCode);
|
|
btnClear.addEventListener('click', function() {
|
|
outputEl.innerHTML = '';
|
|
});
|
|
|
|
inputEl.addEventListener('keydown', function(e) {
|
|
if (e.ctrlKey && e.key === 'Enter') {
|
|
e.preventDefault();
|
|
runCode();
|
|
}
|
|
// Tab key inserts spaces
|
|
if (e.key === 'Tab') {
|
|
e.preventDefault();
|
|
var start = this.selectionStart;
|
|
var end = this.selectionEnd;
|
|
this.value = this.value.substring(0, start) + ' ' + this.value.substring(end);
|
|
this.selectionStart = this.selectionEnd = start + 2;
|
|
}
|
|
});
|
|
</script>
|
|
<script src="chaiscript.js"></script>
|
|
</body>
|
|
</html>
|