diff --git a/pyscriptjs/examples/todo-pylist.html b/pyscriptjs/examples/todo-pylist.html index 11d54fa..a43b104 100644 --- a/pyscriptjs/examples/todo-pylist.html +++ b/pyscriptjs/examples/todo-pylist.html @@ -20,7 +20,11 @@ To Do List - + + def on_keypress(e): + if (e.code == "Enter"): + add_task() + def on_click(evt): task = { "content": new_task_content.value, "done": False, "created_at": dt.now() } @@ -30,7 +34,6 @@ - diff --git a/pyscriptjs/src/components/pyinputbox.ts b/pyscriptjs/src/components/pyinputbox.ts index 0bdbd51..492bdc6 100644 --- a/pyscriptjs/src/components/pyinputbox.ts +++ b/pyscriptjs/src/components/pyinputbox.ts @@ -23,7 +23,7 @@ export class PyInputBox extends BaseEvalElement { connectedCallback() { - this.label = htmlDecode(this.innerHTML); + this.code = htmlDecode(this.innerHTML); this.mount_name = this.id.split("-").join("_"); this.innerHTML = ''; @@ -37,14 +37,23 @@ export class PyInputBox extends BaseEvalElement { // now that we appended and the element is attached, lets connect with the event handlers // defined for this widget - this.code = `${this.mount_name} = Element("${ mainDiv.id }")`; + this.appendChild(mainDiv); + this.code = this.code.split("self").join(this.mount_name); + let registrationCode = `${this.mount_name} = Element("${ mainDiv.id }")`; + if (this.code.includes("def on_keypress")){ + this.code = this.code.replace("def on_keypress", `def on_keypress_${this.mount_name}`); + registrationCode += `\n${this.mount_name}.element.onkeypress = on_keypress_${this.mount_name}` + } + setTimeout(() => { this.eval(this.code).then(() => { - console.log('registered handlers'); + this.eval(registrationCode).then(() => { + console.log('registered handlers'); + }); }); }, 4000); - - console.log('py-title connected'); + + console.log('py-inputbox connected'); } } diff --git a/pyscriptjs/src/interpreter.ts b/pyscriptjs/src/interpreter.ts index 3aedd3f..99886de 100644 --- a/pyscriptjs/src/interpreter.ts +++ b/pyscriptjs/src/interpreter.ts @@ -140,7 +140,7 @@ class PyWidgetTheme: class PyListTemplate: - theme = PyWidgetTheme("flex flex-col-reverse mt-4") + theme = PyWidgetTheme("flex flex-col-reverse mt-8 mx-4") def __init__(self, parent):