Decide input management

[DavidLeoni]

onkeydown works for basic inputs but suffers from stuttering and doesn't record multiple keys.

• Building a function that records button status is easy, should we leave it to students?

Decision: YES, at worst they can copy paste or we can give them templates

• Should we follow turtle api and put on events in Screen, or directly suggest using document

Decision: let's use document, it seems best to follow browser api as much as possible.

If we want full compat with turtle maybe we can add deprecated on* method to Screen that points to the 'right' way

• Should we suggest addEventListener or single onkeydown ?

Decision: single onkeydown, allowing multiple event listeners can easily lead students to weird bugs

Findings:

Using Pyscript 2025.3.1:

svg.addEventListener click:

• cpython: doesn't work
• micropython: doesn't work

ada.svg.addEventListener(
    "click",
    handle_mouse
)

cpython error :

Uncaught Error: This borrowed proxy was automatically destroyed at the end of a function call. Try using create_proxy or create_once_callable.
For more information about the cause of this error, use `pyodide.setDebug(true)`
    at _getAttrs (pyodide.asm.js:10:60541)
    at _adjustArgs (pyodide.asm.js:10:60880)
    at Function.apply (pyodide.asm.js:10:79186)
    at Object.apply (pyodide.asm.js:10:76495)

svg.onclick

• cpython: works
• micropython: doesn't work

The problem is transparency is not recognized by the browser, even if it should but I found a workaround: create a clipped version of the vectorialized version of the image with imagetracerjs during image registration - overcomplex, but works, and it's unobstrusive for the user, you need only a a reference to the <clip-path> in the <image> definition

Other failed workarounds I attempted: draw onto a temp canvas and check click there, failed because we have [another Chrome bug]( (https://bugs.webkit.org/show_bug.cgi?id=39059) which prevents browser from recognizing <image> tags, draw onto a temp canvas with canvg 4.0.3 lib, failed because apparently it doesn't keep transform-origin

async def click_ada(e):
    print("event:", e)
    await ada.say("You clicked me...!", 2)
    await ada.say("Nice job!", 2)

ada.svg.onclick = handle_mouse

addEventListener keydown

• cpython: works
• micropython: works

from pyscript import document

document.addEventListener(
    'keydown',
     keydown)

document.addEventListener(
    'keyup',
     keyup)

document.onkeydown

``

• cpython: works
• micropython: works

keys = set()

def keydown(event):
    print("keydown", event.key)
    keys.add(event.key)

def keyup(event):
    print("keyup", event.key)
    if event.key in keys:
        keys.remove(event.key)

document.onkeydown = keydown
document.onkeyup = keyup
`