Files
sols.dev/playground/index.html
2026-01-27 14:32:05 +11:00

88 lines
3.4 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Solstice Playground</title>
<link rel="stylesheet" href="https://sols.dev/index.css">
<style>
textarea {
width: 100%;
}
</style>
</head>
<body>
<div class="box">
<h1>Solstice Playground</h1>
<h2>Broken right now. Sorry!</h2>
<textarea class="code" id="editor" spellcheck="false" placeholder="Enter Solstice code here..." rows="20">
puts "Hello from Solstice via WebAssembly!"
puts "Let's do some math:"
puts 10 + 20 + 12</textarea>
<div id="controls">
<button id="runBtn" style="font-size: 20px;">Loading WASM...</button>
</div>
<h3>Output:</h3>
<pre class="code" id="output">Output will appear here. Click "Run Code" to run!</pre>
<script type="module">
import createSolsticeModule from './playground.js';
let solsticeModule = null;
const outputDiv = document.getElementById('output');
const runBtn = document.getElementById('runBtn');
const editor = document.getElementById('editor');
// Initialize the Emscripten module
createSolsticeModule({
// Redirect stdout to our output div
print: (text) => {
outputDiv.textContent += text + "\n";
console.log(text);
},
// Redirect stderr to our output div (and console)
printErr: (text) => {
outputDiv.textContent += "[stderr] " + text + "\n";
console.error(text);
}
}).then((instance) => {
solsticeModule = instance;
runBtn.textContent = "Run Code";
runBtn.disabled = false;
console.log("Solstice WASM module loaded successfully");
}).catch(err => {
console.error("Failed to load WASM module:", err);
outputDiv.innerHTML = '<span class="error">Error loading WASM module. See console for details.</span>';
runBtn.textContent = "Load Failed";
});
runBtn.addEventListener('click', () => {
if (!solsticeModule) return;
outputDiv.textContent = ""; // Clear previous output
const code = editor.value;
try {
// Call the C++ function 'run_source' exported via EMSCRIPTEN_KEEPALIVE
// int run_source(char* code)
solsticeModule.ccall(
'run_source', // function name
'number', // return type
['string'], // argument types
[code] // arguments
);
} catch (e) {
outputDiv.innerHTML += `\n<span class="error">[Runtime Error] ${e}</span>`;
console.error(e);
}
});
</script>
</div>
</body>
</html>