0

Every time I run any pygame code in Jupyter Notebook (the online demo) it just crashes, giving an error that I've looked for everywhere, to no avail. I'm using the Pyodide Kernel, which apparently supports pygame-ce. However, best I can tell, every time I try to make a screen, it just doesn't recognize where the screen should be.

Here is my code (the pip command is just some testing I was doing to attempt to make it work):

%pip install pygame-ce
import sys
import types
import importlib.machinery
import pygame
from pygame import Color

pygame-ce.init()
screen_width = 640
screen_height = 480
screen = pygame-ce.display.set_mode((screen_width, screen_height))
pygame-ce.display.set_caption("Mixer 1.0")

The error details:

Pyodide has suffered a fatal error. Please report this to the Pyodide maintainers.
The cause of the error was: ReferenceError
screen is not defined
Stack trace:
ReferenceError: screen is not defined
    at _emscripten_get_screen_size (https://cdn.jsdelivr.net/pyodide/v0.27.6/full/pyodide.asm.js:10:524884)
    at wasm://wasm/01ab0eda:wasm-function[1850]:0xcf1ce
    at wasm://wasm/01ab0eda:wasm-function[2749]:0x103b66
    at wasm://wasm/01ab0eda:wasm-function[1353]:0x78456
    at wasm://wasm/01ab0eda:wasm-function[8690]:0x401676
    at https://cdn.jsdelivr.net/pyodide/v0.27.6/full/pyodide.asm.wasm:wasm-function[4590]:0x3288a1
    at https://cdn.jsdelivr.net/pyodide/v0.27.6/full/pyodide.asm.wasm:wasm-function[2189]:0x20c68d
    at https://cdn.jsdelivr.net/pyodide/v0.27.6/full/pyodide.asm.wasm:wasm-function[1172]:0x1c5415
    at https://cdn.jsdelivr.net/pyodide/v0.27.6/full/pyodide.asm.wasm:wasm-function[1171]:0x1c5393
    at wasm://wasm/01ab0eda:wasm-function[8108]:0x3b13f3
10
  • Before we even get to what you you are trying to run...Do you mean the first two offerings on the 'Try Jupyter' at jupyter.org/try that use JupyterLite? That is clearly stated as 'Experimental' right above there as it is uses JupyterLite with the pyodide kernel (as your error messages seem to correspond with). You can get an online demo with the typical Jupyter instance with the Notebook interface by going here and clicking on the 'launch binder' badge. That temporary session runs on a remote computer & not in the browser. ... Commented Oct 26 at 15:49
  • <continued> Both are 'online' and don't involve installing anything. So it is important to be specific. (I should have said earlier with that suggested session you get from 'launch binder' that you need to choose the 'ipykernel' when you start a new notebook. It will offer some other kernels, too.) If you start the session that way, it will run the first six lines of your example code. So it sort of works. (And it works for typical Jupyter in general. If you wanted JupyterLab you can go to the JupyterLab repo on GitHub and 'launch binder' from there.) So let's move on to what you are trying... Commented Oct 26 at 16:03
  • <continued> to run specifically here. Pygame is a graphics thing that runs in its own GUI. Jupyter is a GUI itself. And unless the software has been set up to be recognize the different GUIs and accomodate running in others, it won't work. Pygame needs graphics card driver on your machine and so it won't work within JupyterLite running in your browser and it won't work on typical Jupyter served on a remote system via MyBinder offerings. However, there is a way to get a linux desktop like experience via MyBinder and that is what I'll put in my answer. Commented Oct 26 at 16:08
  • Sorry for the late comment; jupyter.org/try-jupyter/notebooks is what I'm using. I don't know exactly what to call it. If it's not possible to use Pygame through that, that's ok. I just wanted to know if it was possible and what the fix would be through it. Thanks for the answer as well. Commented Oct 26 at 16:44
  • That 'Try Jupyter' was switched to offer that JupyterLite with the idea being a lot of people just want to see the interface and get a basic demo tour. (So it does that and takes pressure off the MyBinder offerings that cost real money to provide.) I try to point out in mentions of JupyterLite that because JupyterLite has some rough edges signaled by the 'Experimental' warning, most novices are better served using the typical ipykernel still at this time. So if you are new, I'd keep this advice how to get such a kernel in mind for more standard Python work, i.e., not pygame. Commented Oct 26 at 16:53

1 Answer 1

2

(The post title said 'in the Jupyter Notebook Demo' and so this at first addresses that with the most online Jupyter-associated offering, that will also have the added bonus that it is closest to classic pygame development; however, some pygame utilization is possible with pyodide served other ways, see options #2a & 2b below.)

Option #1: Online Jupyter-associated/MyBinder served Jupyter Desktop for pygame use

In my comments, I detailed why you are expecting something that isn't really possible at this time. Eventually there may be a trick to get it (or some derivative or variation) to work in JupyterLite; however, even the basics of JupyterLite are still coming into place. JupyterLite is very much 'Experimental' and won't support something meant to be installed on your local machine and use your graphics card.

In my comments, I do detail a way to get a typical ipykernel to test things in the Jupyter ecosystem and at this time you are encouraged to actually do that when you want a more standard Jupyter experience. However, even the MyBinder-served temporary Jupyter sessions won't support Pygame as you are trying to run it in that offered block as that is meant to make it's own GUI and the standard Jupyter instance through the MyBinder service is it's own GUI and they typically don't play well together.

However, you can use an online offering to sort of get some pygame stuff with a lot of caveats. There's no sound is a biggie. Here's how:

Go here and click on 'launch binder'. I have configured this session to already have pygame installed. So when the session comes up you want to open a terminal and kick running a pygame example.
To do that:

  1. Open a terminal window by clicking on 'Applications' in the upper left of the linux desktop you'll see, and then click 'Terminal Emulator' from the choices to open a terminal window on the remote desktop.

  2. At the prompt in the terminal window on the remote desktop, you'll need to type this command below because this version doesn't have a way to pass in text from your local machine to the remote desktop:

python -m pygame.examples.aliens

That should kick off run the example on remote system you are accessing in your browser. You can use the arrow keys to move left and right and shoot with the spacebar.
Now you have pygame running in an online, Jupyter-associated offering as your title seemed to indicate you want. It isn't perfect; there's no sound. However, it is farther than you can currently get with JupyterLite.


Note this example above is an older version of the jupyter-dekstop. It has improved since then, but I haven't made one where I configured it to have Pygame installed on it because as you saw it isn't really satisfactory to use Pygame in such sessions.
Here are some example MyBinder-served desktop experiences with better implementations (none of these are configured for pygame at that time):

  • Spyder-IDE in Jupyter-desktop MyBinder-served session. Click the 'launch latest release' badge to start the session up and use the Spyder-IDE by clicking on the 'Spyder' icon on the left side of the linux desktop you'll see. You can learn more about Spyder Python development software here. (You'll see that SPyder-IDE is another program meant to run on a desktop, like Pygame. So imagein)
  • https://github.com/fomightez/Jupyter-desktop_with_pymol/ . Follow what it says under 'How to start a remote computing session and open & use PyMOL on the remote desktop' to try out the better, more modern jupyter-desktop offering available. (see here if you are curious about more technical details. Importantly, this version of the desktop adds a Remote Clipboard tool in the upper right corner that makes it possible to pass text into and out of the remote virtual machine.)
  • The basics the Spyder folks provide that I used as basis for updating the above bullet point, namely https://github.com/fomightez/Jupyter-desktop_with_pymol/ . (In addition to other improvements, this version of the desktop adds a Remote Clipboard tool in the upper right corner that makes it possible to pass text into and out of the remote virtual machine.)


Alternative #2a: Possibility with Pyodide/Javascript using Py.Cafe

(Pyodide is the kernel being used in JupyterLite, but you may be able to use Pyodide in a browser to run Pygame. This details the best lead I have found so far to do that.)

In a flash of inspiration, I remembered py.cafe also uses pyodide and has amazing offerings that wouldn't have been possible a few years ago.
I searched 'py.cafe pygame' and found this amazing example offered by Maarten Breddels:

This is probably more close to what you were originally trying with your offered code bock as it is indeed Python code; however, again you'll see it needs a lot of very particular special handling to get it working there that your code wasn't close to doing.
You'll see by reading the page here in it's entirety, even way down at the bottom Py.cafe offers various frameworks with Jupyter-related potentially being one because under 'Vote for the next', there are currently three Jupyter-related offerings as options. But this again makes it clear that the pygame with pyodide would be separate, or more easily separate, from JupyterLite at this time.

I'll point out that Pygame seems have been developed in the last few years to look and see if in pyodide-based environment, see sys.platform == 'emscripten' used in github.com/pygame-web/archives/blob/… . And see Pyodide FAQ:'How to detect that code is run with Pyodide?'. And so it being possible with Pyodide makes sense, it's just not the classic way.

Alternative #2b: Possibility with Javascript/Pyodide using pyodide and static hosting(?)

(Pyodide is the kernel being used in JupyterLite but you may be able to use Pyodide with javascript a browser to run pygame-ce(?).)

Also, I had seen that with pyodide you may be able to use pygame in a browser directly from a server without JupyterLite involved? There was a StackOverflow post that got closed but I recorded the example at github.com/IEYT/Mayor-Rush/blob/… . Note it says 'Thanks to Furas for helping me import pygame successfully.' here. The deleted post is at https://stackoverflow.com/questions/79593483/how-to-use-pygame-ce-in-pyscript#comment140382075_79593483 .

If you can see the deleted post see the 'Edit' section at the end and the last comment there. IEYT was hosting it at Github Pages. I never saw it do anything active and I note the mature version now offered at ieyt.github.io/Mayor-Rush (via github pages) doesn't seem to use pygame anymore in the current code. I don't know for sure, but I don't think it is possible to access older versions of the github pages versions so you can only get GitHub pages to run the current one.

Anyway, the code is in JAVASCRIPT and very async-heavy and makes me think different approaches are needed to make pygame work with pyodide but it may be possible in browser html with javascript and css. Your code block you shared looks nothing though like https://github.com/IEYT/Mayor-Rush/blob/908b1cb1170477e11cc841fb1ec5b81d25b19497/game.js . (Indeed yours, is Python and that is Javascript.) And so you may need to use that as an example and try to adapt it to what you were trying to do? Maybe using Github's static site offering, Github Pages, to serve the content allows the browser to use the graphics card? So that is how it works??

Pygame seems have been developed in the last few years to look and see if in pyodide-based environment, see sys.platform == 'emscripten' used in github.com/pygame-web/archives/blob/… . And see Pyodide FAQ:'How to detect that code is run with Pyodide?'. So as I said under option #2a, it make sense there's other routes , but it's definitely not the classic way though to use Pygame.

Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.