feature request: mobile joystick controls on web

[meadowingc]

hi! first of I want to express how grateful I am for this project! I've been a long time fan of Pico8, but always find myself yearning for the safety of a typed language. Also, having access to Go's other libraries is really excellent 😄

This issue is more of a feature request. I tend to play most of my pico8 games on mobile. I don't know if you've noticed but the pico web player comes with joystick buttons at the bottom of the page. Here's a screenshot.

Do you think this is something that could be easily added to this project? I'm thinking they can be buttons in the standard index.json (the one you provide in the docs) that call some go routines via wasm to provide their input. What do you think?

I could look into implementing this if you want.

[meadowingc]

I actually had some time to work on this yesterday. I spent a while checking how pico8 does it and it didn't end up being so complex so I adopted the same logic. The idea is that we keep a window.pigo8BtnBits on the browser side that tells us the states of the buttons. Then we just need periodically check this bitmap from Go.

Here's my current code: https://github.com/drpaneas/pigo8/compare/main...meadowingc:pigo8:mobile-web-controls?expand=1

The main issue I'm having (and maybe you know how to solve) is that the "game viewport" always gets centered in the middle of the screen. This works fine in landscape, but in portrait causes the viewport to appear directly underneath the buttons

I tried looking around but I don't see any way for us to ask Ebiten to not render the frame in the center, and instead render it at the top of the screen. An idea would for us to handle it from within pigo8 by using the whole screen size passed to Layout(outsideWidth, outsideHeight), and just ensuring that we render the 'viewport' at the top. Though this sounds overly complicated for something that could be simple.

Also, right now I'm using pretty much the same index.html that pico8 uses, with some minor changes to support pigo8. Considering pigo8 is a sort of fan made imitation I thought this was fine, especially as we're reusing the same buttons. But on the other hand I could see how this could be considered copyright infringement. Maybe we can use the same logic and just change the button sprites?

[drpaneas]

Sorry for the late reply, yes this is something I have nearly completed, just didn't have the time to push the new changes for it. I am little busy atm with some family matters, but I will priotize this to be the next big feature ;)

In the meantime, feel free to send a PR if you like and I can take a look.

PS: Thank you very much for your kind words and your detailed feedback with screenshots and everything. Very much appreciated, really <3