Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Event functions for p5.Element elements possibly not working? #165

Open
misolietavec opened this issue Apr 19, 2021 · 4 comments
Open

Event functions for p5.Element elements possibly not working? #165

misolietavec opened this issue Apr 19, 2021 · 4 comments
Milestone

Comments

@misolietavec
Copy link
Contributor

I successfully compiled and tested examples sketch_000 - sketch 009 with pyodide (some with minor changes). Also I have a running example of simple Arkanoid (breakout) game. But there is a problem with sketch_010. I think this minimal code from p5.js reference shows it (not sure if draw() is needed, I tried with and without it):

button = None

def setup():
    createCanvas(100, 100)
    background(0)
    button = createButton('click me')
    button.position(0, 0)
    button.mousePressed(changeBG)

def changeBG():
    val = random(255)
    background(val)

def draw():
    pass

In Firefox development console there is an error each time the mouse button is pressed:
Uncaught TypeError: t.call is not a function mousePressed http://0.0.0.0:8000/static/p5.js:3

sketch_010 works with transcrypt, so maybe, there are some (as yet) not implemented features in pyodide compilation?

I like the concept of pyp5js with pyodide. In Slovakia high schools, many are using pygame (or pygame zero) for teaching with game programming. I think, web approach is better suited for the future, especially in connection with Jupyter (and holoviz panel?).

Last commits (apr. 17-th) were great, I use 0.5.2 version.

@berinhard
Copy link
Owner

Hi @misolietavec! Thanks for opening this issue. Porting the examples to pyodide is something that I wanted to do for a while but didn't have time. If you're ok with that, feel free to open a PR with the new examples. I'll only ask you to organize it in a way we have 2 final working versions: one for transcrypt and another for pyodide. We could structure it as docs/examples/transcrypt and docs/examples/pyodide, what do you think?

Anyway, this issue with the sketch_010 is something to review, for sure.

@misolietavec
Copy link
Contributor Author

@berinhard , thanks for comment. I think, the subdirectories in /docs/examples are OK. For now, I can make PR for pyodide versions of sketch_000 - sketch_009.

@misolietavec misolietavec changed the title Converting example sketches to pyodide Event functions for p5.Element elements possibly not working? Apr 23, 2021
@misolietavec
Copy link
Contributor Author

As I wrote in first comment, there are error messages from browser Javascript console if using mouse event functions (e.g. mousePressed) with canvas elements (eg. buttons, even with canvas itself). What works for now is to define event function "globally" and check manually if mouse position is inside element, as in following code:

val = 0
b_width = 100
b_height = 30

def setup():
    createCanvas(b_width, 100)
    background(0)
    button = createButton('Click')
    button.position(0, 0)
    button.size(b_width,b_height)

def inButton(x,y):
    return (0 < x < b_width) and (0 < y < b_height)
    
def mousePressed():
    global val
    x, y = mouseX, mouseY
    if inButton(x,y):
        val = random(255)
        background(val)

def draw():
    pass

@berinhard, hope this will help with debugging :-)

@misolietavec
Copy link
Contributor Author

Using the (not so clever) strategy from previous comment I was able to compile sketch_010 with pyodide. See PR #167.

@berinhard berinhard added this to the pyp5js 1.0.0 milestone Nov 2, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants