script.js

import init, { compile } from "./wasm_basic.js";

document.addEventListener("DOMContentLoaded", async () => {
  await init();

  document.getElementById("run").addEventListener("click", async () => {
    const source = document.getElementById("editor").value;
    const output = document.getElementById("output");
    const status = document.getElementById("status");

    status.textContent = "Compiling...";

    try {
      const wasmBytes = compile(source);

      const results = [];
      await WebAssembly.instantiate(wasmBytes, {
        env: {
          print: (x) => results.push(x),
        },
      });

      output.innerHTML = results.length
        ? results
            .map(
              (v) =>
                `<div class="output-line"><span class="arrow">→</span><span class="value">${v}</span></div>`,
            )
            .join("")
        : '<div class="output-empty">Program ran with no output.</div>';

      status.textContent = "Done";
    } catch (e) {
      const message = (e?.message ?? String(e))
        .replaceAll("&", "&amp;")
        .replaceAll("<", "&lt;")
        .replaceAll(">", "&gt;");
      output.innerHTML = `<div class="output-error">${message}</div>`;
      status.textContent = "Error";
    }
  });
});