@@ -7,7 +7,7 @@ hex: hex.c
 	$(CC) $(CFLAGS) $(LDFLAGS) $< -o $@
 
 wasm: hex.c
-	 emcc hex.c -o web/assets/hex.js
+	 emcc hex.c -o web/assets/hex.js --pre-js web/assets/hex-playground.js
 
 .PHONY: clean
 clean:

@@ -3992,12 +3992,14 @@ return 0;
             }
         }
     }
+#ifndef EMSCRIPTEN
     if (!isatty(fileno(stdin)))
     {
         ctx.settings.stack_trace_enabled = 0;
         // Process piped input from stdin
         hex_process_stdin(&ctx);
     }
+#endif
     else
     {
         ctx.settings.stack_trace_enabled = 0;

@@ -0,0 +1,21 @@ 
+let stdinBuffer = [];
+const inputBox = document.querySelector("article input")
+inputBox.addEventListener("keydown", (event) => {
+    if (event.key === "Enter" && !event.shiftKey) {
+        event.preventDefault();
+        const input = inputBox.value;
+        inputBox.value = ""; // Clear the textarea
+        stdinBuffer.push(...input + "\n"); // Add input to the buffer
+      }
+});
+
+Module.print = (text) => {
+    document.querySelector("article section").textContent += text + "\n";
+};
+Module.printErr = (text) => {
+    document.querySelector("article section").textContent += text + "\n";
+};
+Module.stdin = () => {
+    return stdinBuffer.length > 0 ? stdinBuffer.shift().charCodeAt(0) : null;
+};
+

@@ -64,3 +64,9 @@ 
 li {
     margin: 0.5rem 0;
 }
+
+article section {
+    height: 40vh;
+    white-space: pre-wrap;
+
+}

@@ -1,7 +1,6 @@ 
 <article>
     <h2>Playground</h2>
-
-    <blockquote>
-        Under construction.
-    </blockquote>
+    <section></section>
+    <input type="text" />
 </article>
+<script src="/assets/hex.js"></script>