Created a demo page so user can try their code online

shinglyu · shinglyu · commit 8d78c67d0b82 · 2018-12-03T20:49:26.000+01:00
diff --git a/wasm/app/index.html b/wasm/app/index.html
@@ -3,8 +3,27 @@
   <head>
     <meta charset="utf-8">
     <title>RustPython Starter Application</title>
+    <style type="text/css" media="screen">
+      #code {
+        height: 70vh;
+        width: 95vw;
+      }
+
+      #run-btn {
+        width: 10em;
+        height: 5em;
+      }
+    </style>
   </head>
   <body>
+    <h1>RustPython Demo</h1>
+    <p>Please input your python code below and click <kbd>Run</kbd>:</p>
+    <textarea id="code">x = 1
+y = 2
+print('Hello! x + y equals to ' + str(x+y))
+    </textarea>
+    <button id="run-btn">Run</button>
+    <h2>Open the browser console (<kbd>Ctrl</kbd>+<kbd>Shift</kbd>+<kbd>I</kbd> or <kbd>F12</kbd>) to see the output</h2>
     <script src="./bootstrap.js"></script>
   </body>
 </html>
diff --git a/wasm/app/index.js b/wasm/app/index.js
@@ -1,3 +1,13 @@
 import * as rp from "rustpython_wasm";
 
-rp.run_code("print('Hello Python!')\n");
+function runCodeFromTextarea(_) {
+  const code = document.getElementById('code').value;
+  if (!code.endsWith('\n')) { // HACK: if the code doesn't end with newline it crashes.
+    rp.run_code(code + '\n');
+    return;
+  }
+  rp.run_code(code);
+}
+document.getElementById('run-btn').addEventListener('click', runCodeFromTextarea);
+
+runCodeFromTextarea(); // Run once for demo
