Add Pyodide integration

Author: vishnupsatish

_layouts/bootstrap.html

@@ -7,10 +7,10 @@
         <link rel="icon" href="/assets/img/logo.png" type="image/x-icon">
         <!-- Bootstrap CSS -->
         <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.4/css/all.css" integrity="sha384-DyZ88mC6Up2uqS4h/KRgHuoeGwBcD4Ng9SiP4dIRy0EXTlnuz47vAwmeGwVChigm" crossorigin="anonymous">
-        <script type="text/javascript">
+        <!-- <script type="text/javascript">
             // set the pyodide files URL (packages.json, pyodide.asm.data etc)
             window.languagePluginUrl = 'https://cdn.jsdelivr.net/pyodide/v0.18.1/full/';
-      </script>
+      </script> -->
         <script src="https://cdn.jsdelivr.net/pyodide/v0.18.1/full/pyodide.js"></script>
         <link rel="stylesheet" href="/assets/css/main.css">
         <link rel="stylesheet" href="/assets/css/code-editor.css">

assets/js/code-editor.js

@@ -3,30 +3,17 @@ editor.setTheme("ace/theme/monokai");
 editor.session.setMode("ace/mode/python");
 
 
-// async function main() {
-//     let pyodide = await loadPyodide({
-//       indexURL: "https://cdn.jsdelivr.net/pyodide/v0.18.1/full/",
-//       stdin: document.getElementById('input-tmp').value
-//     });
-//     return pyodide;
-//   }
-// let pyodideReadyPromise = main();
-
-// async function run_python() {
-//     let pyodide = await pyodideReadyPromise;
-//     console.log(pyodide.runPython(`
-//         input()
-//     `));
-// }
-
-function setup_pyodide() {
+async function setup_pyodide() {
   // setup pyodide environment to run code blocks as needed
+  let pyodide = await pyodideReadyPromise;
   var setup_code = `
 import sys, io, traceback
+from js import document, console
 namespace = {}  # use separate namespace to hide run_code, modules, etc.
 def run_code(code):
   """run specified code and return stdout and stderr"""
   out = io.StringIO()
+  sys.stdin = io.StringIO(document.getElementById('input-tmp').value)
   oldout = sys.stdout
   olderr = sys.stderr
   sys.stdout = sys.stderr = out
@@ -43,12 +30,21 @@ def run_code(code):
   pyodide.runPython(setup_code)
 }
 
-function runPython() {
+async function runPython() {
   // run code currently stored in editor
-  console.log(editor.getValue())
+  let pyodide = await pyodideReadyPromise;
   pyodide.globals.code_to_run = editor.getValue()
   document.getElementById("output").innerText = pyodide.runPython('run_code(code_to_run)')
 }
 
-// run setup_pyodide() when pyodide finishes loading
-languagePluginLoader.then(setup_pyodide)
+async function get_pyodide() {
+    let pyodide = await loadPyodide({
+        indexURL: "https://cdn.jsdelivr.net/pyodide/v0.18.1/full/",
+      });
+    return pyodide;
+    
+}
+
+let pyodideReadyPromise = get_pyodide();
+
+pyodideReadyPromise.then(setup_pyodide)