kludges on event handlers

Author: dragoncoder047

index.html

@@ -75,7 +75,11 @@ <h2>More Information</h2>
         // cSpell:ignore pyodide pyproject
         var pyodide;
         var console = document.getElementById("console");
-        var errors = document.getElementById("errors")
+        var errors = document.getElementById("errors");
+        var css_box = document.getElementById("css");
+        var source = document.getElementById("schemascii");
+        var download_button = document.getElementById("download");
+        var ver_switcher = document.getElementById("version");
 
         async function main() {
             try {
@@ -85,6 +89,13 @@ <h2>More Information</h2>
                 await pyodide.loadPackage("micropip", { errorCallback: error, messageCallback: () => { } });
                 info("done\n");
                 await pyodide.runPythonAsync(await fetch("scripts/web_startup.py").then(r => r.text()));
+                css_box.addEventListener("input", debounce(pyodide.globals.get("sync_css")));
+                source.addEventListener("input", debounce(pyodide.globals.get("render_catch_warnings")));
+                download_button.addEventListener("click", pyodide.globals.get("download_svg"));
+                ver_switcher.addEventListener("change", pyodide.globals.get("switch_version"));
+                source.removeAttribute("disabled");
+                css_box.removeAttribute("disabled");
+                console.textContent = "Ready";
             } catch (e) {
                 error(`\nFATAL ERROR:\n${e.stack}\n`);
                 throw e;
@@ -96,6 +107,13 @@ <h2>More Information</h2>
         function error(text) {
             errors.textContent += text;
         }
+        function debounce(fun) {
+            var timeout;
+            return function() {
+                if (timeout) clearTimeout(timeout);
+                timeout = setTimeout(fun, 100);
+            }
+        }
         main();
     </script>
 

scripts/web_startup.py

@@ -1,43 +1,17 @@
-import asyncio
 import functools
 import sys
 import re
 import js
 import json
 import warnings
-from pyodide.http import pyfetch as fetch, open_url as get
-from pyodide.ffi import create_proxy as event_handler
+from pyodide.http import open_url as get
 import micropip
 
 
-def debounced(fun):
-    timeout = None
-
-    @functools.wraps(fun)
-    def inner():
-        nonlocal timeout
-        if timeout:
-            js.clearTimeout(timeout)
-        timeout = js.setTimeout(fun, 100)
-
-    return inner
-
-
-def syncify(fun):
-    @functools.wraps(fun)
-    def inner(e):
-        return asyncio.ensure_future(fun(e))
-    return inner
-
-
-@event_handler
-@debounced
 def sync_css():
     style_elem.innerHTML = css_box.value
 
 
-@event_handler
-@debounced
 def render_catch_warnings(*args, **kwargs):
     import schemascii
     console.textContent = ""
@@ -49,21 +23,23 @@ def render_catch_warnings(*args, **kwargs):
     return out
 
 
-@event_handler
-@syncify
-async def switch_version():
+def switch_version():
     if "schemascii" in sys.modules:
         del sys.modules["schemascii"]  # Invalidate cache
     version = ver_switcher.value
-    await micropip.install(versions_to_wheel_map[version])
+    js.eval(
+        f'''(async () => await pyodide.globals.get("micropip").install({versions_to_wheel_map[version]!r}))();''')
+
 
-@event_handler
 def download_svg():
     a = js.document.createElement("a")
-    a.setAttribute("href", js.URL.createObjectURL(js.Blob.new([output.innerHTML], {"type": "application/svg+xml"})))
-    a.setAttribute("download", f"schemascii_playground_{js.Date.new.toISOString()}_no_css.svg")
+    a.setAttribute("href", js.URL.createObjectURL(js.Blob.new(
+        [output.innerHTML], {"type": "application/svg+xml"})))
+    a.setAttribute(
+        "download", f"schemascii_playground_{js.Date.new.toISOString()}_no_css.svg")
     a.click()
 
+
 output = js.document.getElementById("output")
 css_box = js.document.getElementById("css")
 console = js.document.getElementById("console")
@@ -98,11 +74,3 @@ def download_svg():
 css_source = get("schemascii_example.css").read()
 style_elem.textContent = css_source
 css_box.value = css_source
-
-css_box.addEventListener("input", sync_css)
-source.addEventListener("input", render_catch_warnings)
-download_button.addEventListener("click", download_svg)
-
-source.removeAttribute("disabled")
-css_box.removeAttribute("disabled")
-console.textContent = "ready\n"