kitao / pyxel

A retro game engine for Python
MIT License
15.24k stars 844 forks source link

Let's exchange information to improve Pyxel's web support #404

Closed kitao closed 2 years ago

kitao commented 2 years ago

Thanks to everyone's great efforts, now Pyxel works on web browsers. Here is the test site of web features: https://kitao.github.io/pyxel/wasm/

It's working, but there are various limitations and points that could be improved. Therefore, please provide information that will lead to improvement.

Especially I would like to improve following points with priority:

Regardless of these issues, please feel free to discuss various web-related matters with me!

messense commented 2 years ago

Encountered https://github.com/Rust-SDL2/rust-sdl2/issues/1249 when try to build manylinux wheels on Linux with bundled and static-link features, https://github.com/Rust-SDL2/rust-sdl2/pull/1250 should fix it.

Make a github action to build wheels for many platforms

Progress: https://github.com/messense/pyxel/actions/runs/2903962186

kitao commented 2 years ago

@messense Excellent! This trial is really helpful. Actually I have some requests:

Thank you.

messense commented 2 years ago

Could you use make clean build command provided by Pyxel to build instead of calling Maturin directly

To do that you need to hard code manylinux docker image for each supported Linux targets. Windows and macOS targets can use make clean build.

On Mac, is it possible to make wheels both for x86_64 and arm64? But it should not be a universal binary

It's already doing that.

Feel free to copy and edit the workflow to suit your needs.

messense commented 2 years ago

I also noticed that there are some dependencies compiled with different versions, for example

   Compiling miniz_oxide v0.4.4
   Compiling miniz_oxide v0.5.3
   Compiling miniz_oxide v0.3.7
   Compiling deflate v1.0.0
   Compiling deflate v0.8.6
   Compiling png v0.16.8
   Compiling png v0.17.5
   Compiling rand v0.8.5
   Compiling rand v0.7.3
   Compiling jpeg-decoder v0.1.22
   Compiling jpeg-decoder v0.2.6
   Compiling tiff v0.6.1
   Compiling tiff v0.7.3
   Compiling image v0.23.14
   Compiling image v0.24.3
kitao commented 2 years ago

It seems that new Pyodide has been released 3 days ago. With it, the web version of Pyxel can be improved?

notbored commented 2 years ago

I just had a look at the the examples on https://kitao.github.io/pyxel/wasm/ and noticed that while controls work immediately once things have finished loading, the sound/music wont start until you click the mouse somewhere on the page.

Also pressing escape freezes the game and there's no way to return without refreshing the page.

Firefox/MacOS.

km19809 commented 2 years ago

I just had a look at the the examples on https://kitao.github.io/pyxel/wasm/ and noticed that while controls work immediately once things have finished loading, the sound/music wont start until you click the mouse somewhere on the page.

Also pressing escape freezes the game and there's no way to return without refreshing the page.

Firefox/MacOS.

  1. The browsers do not allow to play of sound without user interaction. It is not Pyxel's fault. It can be solved by creating a "play" button. Like [this].(https://km19809.github.io/pyxelodide/test_pyxel_fs.html?py=04_sound_api)
  2. About escaping, it uses sys.exit. So it would break a python session. It is one of the unresolved topics of this issue.

    Safe way to exit with pyxel::quit

notbored commented 2 years ago

I didn't realise that was the default behaviour from the browser, makes sense.

I saw the mention of sys.exit/pyxel.quit but just wanted to raise the issue/comment just in case.

Apologies for sticking my nose in without doing a thorough enough reading!

laurentabbal commented 2 years ago

Demo with pyxel-1.8.0-cp37-abi3-emscripten_3_1_14_wasm32.whl : www.pyxelstudio.net For tests...

km19809 commented 2 years ago

@notbored No need to apologize! I just wanted to inform you of the reasons for the problems.

kitao commented 2 years ago

I've separated the topic for compiling for many platforms on GitHub Actions here: #409

kitao commented 2 years ago

I separated embedding Python topic into #412.

pmp-p commented 2 years ago

if think pygbag and pygame-script codebase can help on :

but for

-> i can help too but only after pyodide reach 3.11, because loading SDL2 dynamically is tricky and i will do it for pygame only at that moment. ( SDL2 is not meant to be a side module because it's full of JS calls )

-> need serious benchmarking before taking any decision so imho after 3.11 pyodide too.

kitao commented 2 years ago

Pyxel for WASM builds MEMFS from the specified files like this now.

Is there any good way to remove this table? If possible, I'd like to copy necessary files by checking files under the specified origin directory automatically or mount real file system.

Current:

let pyxel = await loadPyxel("canvas");
await pyxel.loadFiles("../python/pyxel/examples", [
    "02_jump_game.py",
    "assets/jump_game.pyxres",
]);
pyxel.run("02_jump_game.py");

Ideal:

let pyxel = await loadPyxel("canvas");
await pyxel.mount("../python/pyxel/examples");
pyxel.run("02_jump_game.py");
pmp-p commented 2 years ago

mount real file system

pygbag uses zip format (<gamename>.apk) as a real file system and assets are in /assets as they would be in a android apk. the zip in mounted at path /data/data/<gamename>/ in MEMFS and is writeable ( it's an overlayFS )

checking files under the specified origin directory automatically

checking files one by one is not possible on webserver where index is disallowed :( so it is not a bullet proof solution

kitao commented 2 years ago

@messense Toward easier web support, I'm planning to release sdist as well as bdist_wheels. But when I tried the options for sdist in Maturin, it doesn't work because Pyxel's pyproject.toml is located in the top of the project. Do you know how to handle this file structure?

https://github.com/kitao/pyxel/blob/main/pyproject.toml

📡 Using build options manifest-path from pyproject.toml
💥 maturin failed
  Caused by: Failed to build source distribution
  Caused by: pyproject.toml was not included by `cargo package`. Please make sure pyproject.toml is not excluded or build without `--sdist`

In addition to the above, Maturin looks Cargo.toml-centered design and if the pyptorject.toml is not placed there, some paths such as readme and license also looks strange. For examples, pyproject.toml and license file are in the same directory, but I should wirte

license = { file = "../../LICENSE" }

in the pyproject.toml

messense commented 2 years ago

@kitao I'm aware of the these unpolished parts of maturin and plan to address them in the upcoming v0.13.3 release.

Ideally the current file structure should just work.

kitao commented 2 years ago

@messense Great. I look forward to new version of Maturin.

messense commented 2 years ago

@kitao Please try maturin v0.13.3-beta.6, you can install it by running pip install maturin==0.13.3b6.

kitao commented 2 years ago

@messense Thank you for your support! I tried the new Maturin. Path for readme and license in the pyproject.toml worked as I expected. It it right result that the sdist doesn't include the python module folder specified by python-source with Maturin sdist command?

messense commented 2 years ago

It it right result that the sdist doesn't include the python module folder specified by python-source with Maturin sdist command?

Fixed in https://github.com/PyO3/maturin/pull/1102, please try maturin v0.13.3-beta.7.

kitao commented 2 years ago

@messense I confirmed the python directories are included. Now I tried to include other files like this:

sdist-include = [
    "Makefile",
    "crates/rustfmt.toml",
    "docs/**/*",
    "requirements.txt",
    "scripts/*",
    "setup.cfg",
]

But they aren't included though the output said:

 Including files matching "Makefile"
📦 Including files matching "crates/rustfmt.toml"
📦 Including files matching "docs/**/*"
📦 Including files matching "requirements.txt"
📦 Including files matching "scripts/*"
📦 Including files matching "setup.cfg"
kitao commented 2 years ago

@messense Though sdist-include doen't work, I confirmed the wheel can be built and installed from the generated sdist. Thank you!

kitao commented 2 years ago

Now every example of Pyxel, a retro game engine for Python, works on web browsers!

https://kitao.github.io/pyxel/wasm/

messense commented 2 years ago

@kitao sdist-include issue fixed in https://github.com/PyO3/maturin/pull/1103, please try maturin v0.13.3-beta.8.

If everything goes well, v0.13.3 will be released this week.

kitao commented 2 years ago

@messense Thank you. I confirmed it works. I look forward to the next official release!

messense commented 2 years ago

@kitao maturin v0.13.3 is out.

kitao commented 2 years ago

@messense Great news! I'll change the latest Maturin to build.

laurentabbal commented 2 years ago

I'm still having Pyodide has suffered a fatal error. And, because Pyodide craches I cannot read the file system with pyodide.FS.readFile.

pyodide.asm.js:10
Pyodide has suffered a fatal error. Please report this to the Pyodide maintainers.
    API.fatal_error @ pyodide.asm.js:10
    Module.callPyObjectKwargs @ pyodide.asm.js:10
    Module.callPyObject @ pyodide.asm.js:10
    apply @ pyodide.asm.js:10
    apply @ pyodide.asm.js:10
    runPython @ pyodide.asm.js:10
    run @ pyxel.js:37
    (anonymous) @ 01_hello_pyxel.html:22
    await in (anonymous) (async)
    (anonymous) @ 01_hello_pyxel.html:23
    pyodide.asm.js:10
The cause of the fatal error was:
    API.fatal_error @ pyodide.asm.js:10
    Module.callPyObjectKwargs @ pyodide.asm.js:10
    Module.callPyObject @ pyodide.asm.js:10
    apply @ pyodide.asm.js:10
    apply @ pyodide.asm.js:10
    runPython @ pyodide.asm.js:10
    run @ pyxel.js:37
    (anonymous) @ 01_hello_pyxel.html:22
    await in (anonymous) (async)
    (anonymous) @ 01_hello_pyxel.html:23
pyodide.asm.js:10 Error: unwind
    at ensureCaughtObjectIsError (pyodide.asm.js:10:144954)
    at API.fatal_error (pyodide.asm.js:10:146175)
    at Module.callPyObjectKwargs (pyodide.asm.js:10:119134)
    at Module.callPyObject (pyodide.asm.js:10:119434)
    at PyProxyClass.apply (pyodide.asm.js:10:126878)
    at Object.apply (pyodide.asm.js:10:125906)
    at Object.runPython (pyodide.asm.js:10:149846)
    at Pyxel.run (pyxel.js:37:23)
    at 01_hello_pyxel.html:22:19
kitao commented 2 years ago

I moved this topic to #418

kitao commented 2 years ago

Now Pyxel Web works stably. So please let me close this issue. Thank you.