Trying to be object oriented

[Robert Rapplean]

Yea, I know that JavaScript isn't terribly effectual at being object oriented, but I'd like to create a dialog box that, should I say "show yourself here" would know how to do it.

I'm basing my implementation on the Dialog box example:

https://brython.info/gallery/simulate_input.html

The problem I'm having is figuring out how to bind the object's functions to button clicks. I can't bind them on class definition because the dialog box doesn't exist yet. Any clues? Here's my implementation:

class UserIdDialog:
    def __init__(self, container, callback):
        self.container = container
        self.callback = callback
        self.dialogbox = html.DIV(id="zone", style = {"text-align": "center", "border-style": "double"})
        self.dialogbox.left = int((window.innerWidth -                                 self.dialogbox.offsetWidth) / 2)

        self.dialogbox.top = int(window.innerHeight / 10)
        self.messagebox = html.DIV("Please enter your username",                         id='useridprompt')

        self.input = html.INPUT()
        self.okbutton = html.BUTTON("Ok")
        self.cancelbutton = html.BUTTON("Nevermind")
        self.buttonbox = html.DIV(style={"text-align": "center"})
        self.buttonbox <= self.okbutton + self.cancelbutton
        self.dialogbox <= self.messagebox + self.input + html.BR() +                 self.buttonbox

    def show(self, container=None):
        if container is not None:
            self.container = container
        self.container <= self.dialogbox
        self.input.bind(self.keyup, 'keyup')
        self.okbutton.bind(self.okbutton, 'click')
        self.cancelbutton.bind(self.click_cancel, 'click')
        self.input.focus()

    def click_ok(self, event):
        if self.validate():
            self.dialogbox.clear()
            self.callback(self.input.value)

    def click_cancel(self, ev):
        username = storage['signature_verification_username']
        if not validate(username):
            self.messagebox.text = f'A user name is required to continue'
            return
        self.dialogbox.clear()

    def keyup(self, ev):
        if ev.key == "Enter":
            click_ok(ev)

    def validate(self, content=None):
        if content is None:
            content = self.input.value
        if len(content) < 5:
            self.messagebox.text = f'"{content}" is not a valid username'
                return False

        return True

[Pierre Quentel]

I'm not 100% sure to understand what the code should do, but you can set the bindings inside the class __init__ method. Here is a slightly reduced version of your example:

from browser import document, html, window

class UserIdDialog:
    def __init__(self, container, callback=None):

        self.container = container
        self.callback = callback
        self.dialogbox = html.DIV(id="zone", style = {"text-align": "center", "border-style": "double"})
        self.dialogbox.left = int((window.innerWidth - self.dialogbox.offsetWidth) / 2)
        self.dialogbox.top = int(window.innerHeight / 10)
        self.messagebox = html.DIV("Please enter your username", id='useridprompt')
        self.input = html.INPUT()
        self.okbutton = html.BUTTON("Ok")

        self.buttonbox = html.DIV(style={"text-align": "center"})
        self.buttonbox <= self.okbutton

        self.dialogbox <= self.messagebox + self.input + html.BR() + self.buttonbox

        # define bindings
        self.okbutton.bind('click', self.click_ok)
        self.input.bind('keyup', self.keyup)

    def show(self, container=None):
        if container is not None:
            self.container = container
        self.container <= self.dialogbox
        self.input.bind(self.keyup, 'keyup')
        self.okbutton.bind(self.okbutton, 'click')

        self.input.focus()

    def click_ok(self, event):
        if self.validate():
            self.dialogbox.clear()

            self.dialogbox <= html.DIV(f'Welcome, {self.input.value}')

    def keyup(self, ev):
        if ev.key == "Enter":

            self.click_ok(ev)

    def validate(self, content=None):
        if content is None:
            content = self.input.value
        if len(content) < 5:
            self.messagebox.text = f'"{content}" is not a valid username'
            return False
        return True

UserIdDialog(document).show()