I don't quite get how this works

[armin-reichert]

Say I want to use webfx to build a GWT executable (and maybe others too) for an existing JavaFX application (in my case: https://github.com/armin-reichert/pacman-javafx)

Do I have to bring my Maven artifacts to some central Maven repository first to get this working, or can webfx also resolve dependencies against my local Maven repository?

[salmonb]

Nice game! But WebFX doesn't support 3D. So the first step would be to make a 2D version only of the game (otherwise GWT will complain). If you can prepare this (in a separate branch or repository), I can help you making a WebFX version of it.

FYI the Maven libraries must be listed in the webfx.xml file, but the syntax is not yet documented...

Let me know if you're happy to make that 2D version.

[armin-reichert]

The 2D and 3D views of my game are already rather well separated, so it will not take a big effort for me to create a 2D-only version. I have already started into this direction. As soon as I have finished this task I will let you know.

I really appreciate your help in creating the webfx version of my Pac-Man/Ms. Pac-Man games. Hopefully it will make your (still small but nevertheless impressive) list of demo apps even more attractive.

Regards Armin

[armin-reichert]

Salu Bruno,

in the meantime I have split the project into a 2D-only and a 2D+3D variant:

• https://github.com/armin-reichert/pacman-javafx/tree/main/pacman-ui-fx (2D only)
• https://github.com/armin-reichert/pacman-javafx/tree/main/pacman-ui-fx-3d (2D+3D, dashboard etc.)

The script build.bat in the repository root directory builds everything. The run.bat starts the full version and the run2d.bat script runs the 2D-only version. Alternatively, the "shaded" jar files in the target directories can be used.

Now I would be very happy if you could help in creating

1. A browser version of the 2D-only game (Prio 1)
2. Executables/installers for Windows/Linux/Mac for the full game (Prio 2)

What do you think?

Best regards Armin

[salmonb]

Thanks, I will have a look at it this evening after my workday.

If we achieve 1), we achieve 2) at the same time, as WebFX can create these installers by default. WebFX is also compatible with Gluon, so we will get the mobile versions at the same time (but only the Android version is easy to share as Apple makes things complicated to share ad-hoc apps).

For example here are the resulting artifacts of the JArkanoid game (just expand the assets to see them). If we manage to port it to WebFX, we will have the same for your game.

[armin-reichert]

Sounds great. So "enjoy" your work day ;-)

[salmonb]

I made the WebFX port, so now your game is playable online! https://pacman.webfx.dev 😃

I made these 2 forks in the WebFX demos space:

• https://github.com/webfx-demos/webfx-demo-pacman-core (fork of your pacman-basic)
• https://github.com/webfx-demos/webfx-demo-pacman (fork of your pacman-javafx)

I had to make quite of lot of changes (mainly a backport to java language level 11 for GWT + disabling some features such as the score file persistence - I can write a score persistence later that will work in the browser).

The main issue is that the game is on the left side of the screen. In the browser, you can't control the size of the window, so you need to update your code so the game looks centred even if the window is wider. Can you fix that in JavaFX and let me know when it's ready?

[armin-reichert]

Hello Bruno,

thank you very much for your effort to get this first version runnning!

I understand that there is still much room for improvement. In which branch/repository should I make the needed changes?

About the layout issue: I don't understand why the layout is left-aligned. In a window of the desktop version the canvas is centered if the window is wider. Do you have any idea what I should change to make the browser happy?

I see that you are working on a fix for the centering problem but it is still buggy: the subscene containing the canvas obviously is stretched until the right border of the browser. If I resize the browser vertically I can see that while dragging the blue background appears right of the subscene but when the dragging ends, it is still as describe above. Maybe one has to set maxSize and size both?

I also see that the intermission scenes and their test (Alt+Z) are still missing. Are there any specific issue with these?

(Please do not publish the game on your demo site until we have fixed the most annoying issues.)

Best regards Armin

[salmonb]

Don't worry, I won't make any announcement until you're happy with the result. It may be even better if you make the announcement 😉

The issue was actually coming from my modifications (I replaced the SubScene with a BorderPane - as SubScene is not supported yet by WebFX) but I used the wrong method to resize it... setMaxSize() is now doing the job 👍

Next issue is that the canvas is resized too much on the right (so now right is black and left is blue). Should we fix this or just change the blue to black?

[armin-reichert]

I think just changing the background will not help: if you have a close look at the intro scene, the ghosts come from the right into the visible area. But as they would normally not be visible when outside of the subscene and now they are, this looks strange (hope you understand what I mean). Of course I could also change the intro scene code such that the ghosts become visible only when they enter the subscene area.

Is this code still used:

// keep canvas always the same size as the subscene
        canvas.widthProperty().bind(fxSubScene.widthProperty());
        canvas.heightProperty().bind(fxSubScene.heightProperty());

Maybe it is sufficient to set the canvas size here instead of binding to the (unsupported) subscene size?

[armin-reichert]

Another finding; The cutscenes have no sound.

[armin-reichert]

Wow! Canvas scales correctly! ;-) Cutscenes still silent :-(

Tips for testing: Alt+N enters next level, Alt+T plays each level for several seconds.

[salmonb]

Yes, I fixed the issue by giving the canvas a constant size (WIDTH, HEIGHT) and replacing 1) canvas.getTransform().add(scale) with just 2) canvas.setScaleX/Y(scaling). You don't need to resize the canvas as you just scale it. And 1) and 2) are not doing the same regarding the pivot. 2) is always taking the centre as the pivot, which is what we want.

For the sound are you talking about the application start? Because in the browser sandbox, it's not possible to play sound before the user interacted.

[armin-reichert]

Hi,

no I mean the cutscene sound, They are played after completing level 2, 5, 9, 13 etc. They have no sound yet.

There is also a key combination Alt+Z that when pressed on the intro screen should play all cutscenes. Any idea why this shortcut is not working?

Another one: Flash messages do not appear. Is StackPane not supported in GWT/JavaFX?

[salmonb]

Try Alt-W instead (a keyboard mapping issue, will try to fix that in WebFX).

Can you tell me where is that code that plays the cutscenes sound?

Yes, StackPane is supported, but I will have a look at the flash messages.

[armin-reichert]

Alt+W does not work for me (Chrome Version 112.0.5615.138). Maybe I should rethink the keyboard combinations such that they do not collide with predefined browser keys. In the desktop version they felt ok to me.

The cutscene sound is triggered e.g in class PacManCutscene1:93 with the call GameEvents.publishSoundEvent("start_intermission_1"). (this should use the constant GameModel.SE_START_INTERMISSION_1 but that is no problem).

The sound event is handled in class SoundHandler where it is mapped to playing an audio clip.

[salmonb]

I fixed the sound issue: it was caused by some missing breaks in switch cases when I did the backport to java 11 -> GameModel.SE_STOP_ALL_SOUNDS case was executed just after the cutscene sound...

For the keyboard, this page displays all the info we can get from JavaScript: https://www.toptal.com/developers/keycode (just type the key combination you want)

[armin-reichert]

Merveilleux :-)

However, the sound in PacMan cutscenes 1 and 3 is still not ok, the sound in that scenes should be repeated twice. Flash messages work now too (ok, I would like a sans-serif font better :-).

Alt+PLUS (Code 187) and Alt-MINUS (Code 189) however do not work, they are used to increase/decrease the game loop speed and this feature is important (I saw a question on Reddit where someone asked exactly for this feature for a handicapped friend of him).

I will test further and let you know of my findings.

Thanks again very much for your work!

Regards Armin

[salmonb]

Sounds for cutscenes 1 & 3 are fixed.

I can't make Alt+PLUS work on my computer, even when running the game in JavaFX, as my keyboard has a numpad, and I receive a JavaFX KeyCode.ADD / KeyCode.SUBSTRACT and not KeyCode.PLUS / KeyCode.MINUS when I hit those keys...

Maybe the keyEvent.getText() would provide the most generic information about the key pressed without worrying too much about the keyboard layout?

[armin-reichert]

We could just change the keys for changing the simulation speed to MINUS, PLUS and DIGIT0 (reset) instead of Alt+...

It is all in class Keys, see

    public static final KeyCodeCombination SIMULATION_FASTER = alt(KeyCode.PLUS);
    public static final KeyCodeCombination SIMULATION_SLOWER = alt(KeyCode.MINUS);
    public static final KeyCodeCombination SIMULATION_NORMAL = alt(KeyCode.DIGIT0);

Replacing alt(...) by just(...) would do the job.

[armin-reichert]

Formatting of locale dependent texts from text resource bundle does not work. Press Alt+L (cheat: add 3 lives) during game play, then the flash message text is not formatted.

[salmonb]

The issue I was talking about was not with Alt, but with what code will represent the + or - keys. I did a test by changing alt(KeyCode.PLUS) to alt(KeyCode.ADD) & alt(KeyCode.MINUS) to alt(KeyCode.SUBSTRACT) and it's working on my computer, but if I commit that, it will stop working for people who don't have a numpad... The KeyCode is quite specific to the keyboard layout, that's why I was suggesting you could keyEvent.getText() instead, or eventually allow several key combination (PLUS or ADD, MINUS or SUBSTRACT, etc...) to solve this issue.

[salmonb]

Yes, I disabled text formatting, as it's not supported by GWT. I will see what I can do.

[armin-reichert]

I see. As mentioned, we can just change the Alt+PLUS, Alt-MINUS, Alt-DIGIT0 to anything less troublesome.

Text formatting is completely unimportant, I can just format the text with String.formatted() instead of using the resource bundle patterns like {0,number,integer}.

I will also think about adding some entry menu to select the game variant to play. This would also solve the issue with the sound that can only be played after the first user interaction (saw the warnings in the Javascript console of the browser).

In the browser console I see also several hundreds of warnings of the kind pacman_ui_fx_gwt-0.js:2150 Can't resolve system default zone Europe/Berlin: No time-zone data files registered. Fallback to zone offset null. Is this a known issue?

[salmonb]

String.formatted() is not supported by GWT neither. But don't worry, I will find a quick fix for this case

[armin-reichert]

Ok, we are in Java 11. Well there are StringBuilder, StringBuffer, MessageFormat or good old string concatenation :-)

[salmonb]

Format issue fixed. I will have a look at the warning.

Yes, your idea is good to offer an alternative to the sound as we can't play it from the beginning in the browser. Maybe it can be just a background image, a bit like they did for SpaceFX https://spacefx.webfx.dev

[salmonb]

Warnings fixed.

[armin-reichert]

Yes, I need a start screen explaining the most important key combinations and offering a menu for selecting which game to play.

Maybe in the browser version one should also add some black padding around the game area, like here: https://www.novumgames.com/spiel/ms-pacman/ (seems to be based on Shaun Williams Javascript implementation https://github.com/masonicGIT/pacman)

There should also be a key combination to activate the cheats.

Aside from all these little things, I have to say that I am really impressed by your project!

Regards Armin

[salmonb]

Thanks. I was myself impressed by the good results I could get when I was developing WebFX. GWT is amazing. And OpenJFX as well. A good marriage!

I just applied an additional 0.95 factor to the canvas scale to create the padding. Does that look ok?

[armin-reichert]

Good morning Bruno,

yes, the margin around the canvas looks fine to me, however a black padding around the canvas on each side would even look better. But this has no high priority. I think we could just set the complete window background to black because in the 2D-only version, there is no semi-transparent dashboard and picture-in-picture view where the blue background makes sense.

What is more important to me is the "signature" saying "A Fan Tribute...". I intentionally placed this "handwritten" signature in both games right above the original copyright notice to clearly express that this clone is not meant to be a copyright violation.

If there is any technical restriction hampering the signature being shown like this, I could replace the text by an image and place that image exactly there (I use an overlay pane over the canvas to place the signature to avoid the text getting blurred).

Another general question: If I add additional fixes or features like the mentioned start screen, how will these changes be merged into your fork/branch?

(Just found that the flash messages use a sans-serif font now. You are really impeccable)

(Just tried to compile with Java/JavaFX 11 and I feel the pain: no records, no switch expressions, no String.formatted(), no instanceof downcast etc. If I had known before about these restrictions, I would have downported first to avoid all this unnecessary work for you)

[salmonb]

Guten Morgen Armin,

The previous games I ported to WebFX were finished, so I didn't have this problem. But we can try and see how easy or difficult it will be to resync the WebFX version from your version.

So just continue the development in your repository as normal (you can continue using recent Java features) and let me know when you reach a stage you would like to move to the WebFX version. Then I will resync my fork and get your modifications in the main branch of the fork, the WebFX version is in a separate webfx branch. Then I will see if a Git rebase can do miracles or not...

[armin-reichert]

Salu Bruno,

I don't want to bother you too much with this (and I think you have more than enough real work to do). Would it be possible that I create a fork(?) of your repositories and integrate my future changes in my local copy, run the toolchain and check if everything works? And when I have finished everything I want to have in the showcase version, we could reintegrate the changes into your repository again?

[salmonb]

That's another possible option indeed, and it will work for sure. It's just more work for you (and less for me! 😉). You can fork my fork(s), make the changes, and submit them to me as a pull request. Let me know if you have difficulties to build the webfx version on your local machine.

[armin-reichert]

Less work for you sounds very good to me :-) So l will try to go that way and ask for help whenever needed (will happen for sure). Please keep in mind: I am already retired from my professional career and if there is one thing I have plenty: time.

Again: Thank you very much for the work done so far.

[salmonb]

Lucky one!

I'm sure this doesn't happen, but let me know if you get bored, I can give you some jobs! 😄

Ex: a backport tool that can transform java code back to 11 (unless that already exists and I don't know...)

[armin-reichert]

Concerning the backport tool: IIRC, In the 90s, phone books on CD were sold in the millions. In Germany however, it was illegal to sell CDs with a backwards search, i.e. provide the phone number and find the owner of that number (it is legal now). Some clever company outsourced the job to China, let some poor(?) Chinese people type all the German phone books into a database and create CDs with inverse search from that. At least that is my recall of the story. That should give you an idea for such a "tool" ;-)

[salmonb]

If you start from scratch, that would be a huge task indeed, but there are some generic tools available now to analyse and transform Java code, such as Spoon (someone mentioned it in this issue).

[armin-reichert]

Why is backporting to version 11 necessary at all? Is GWT legacy code?

[salmonb]

Yes, Google now focuses on J2CL, the future replacer of GWT. As mentioned in the roadmap, I will move to J2CL when it will be officially out. But things take time, so in the meantime, I have to stay with GWT, which is stuck to Java 11.

[armin-reichert]

Good morning Bruno,

when I try to fork your fork https://github.com/webfx-demos/webfx-demo-pacman, GitHub complains and claims that my original repository already is a fork of your fork and no more forks are allowed.

This does not match my mental model of a fork, but I am far from understanding git. So do you have any idea what the problem is?

Maybe we should "cut the connection" of your forked repositories to the original ones? Then I probably could fork them and create pull requests for the handful of changes I want to make before publishing the game on your website.

Does that make any sense? Armin

[salmonb]

Weird, but no worries, I gave you a direct write access to the repo. The port is located in the webfx branch. Be aware that each time you will push your work into that branch, this will automatically update https://pacman.webfx.dev (after about 5 min, thanks to a GitHub workflow)

[armin-reichert]

Thanks! So I cloned the webfx-demo-pacman repository to my local machine and checked-out the webfx branch. Local build with the webfx cli works.

I will then work locally and from time to time push to your repository.

[salmonb]

You can run the demo with webfx run -g but this will just open the html file in the browser (you can locate the html file with webfx run -gl), but sound is not allowed by the browser in this case. I usually open the html file in IntelliJ IDEA (my Java IDE), as it serves it through its internal web server, and then sound is working in this case.

[armin-reichert]

Sorry, just as I wrote the comment I saw it in the webfx documentation.

I have now everything locally in my IDE (Eclipse). I see an error in the -gwt subproject (which I can probably ignore), everything else is ok.

Some first findings: Eclipse shows warnings because of missing requires transitive in the generated module-info.java. Not sure if this is an issue but maybe your code generator should generate them wherever they make sense?

(I'm in business now: Editing in my IDE and running webfx build -gr works like a charm)

[salmonb]

Great.

Not sure about the Eclipse warning, the essential is that it compiles ok with the Maven build chain.

During the development phase, you can run and debug the OpenJFX version in your IDE. The module to run is pacman-ui-fx-openjfx and the main class is dev.webfx.platform.boot.ApplicationBooter (as always with WebFX)

[armin-reichert]

One question: I pushed now 2 commits to the webfx branch of webfx-demos/webfx-demo-pacman. Do I additionally have to create a pull request to start the central build and update the demo website?

[salmonb]

Nothing to do, it's all automatic 😄

You can see if the GitHub workflow ran ok here: https://github.com/webfx-demos/webfx-demo-pacman/actions

This workflow regenerates the demo website + all artifacts in the release https://github.com/webfx-demos/webfx-demo-pacman/releases

[armin-reichert]

Hm, I see a message "webfx had recent pushes 14 minutes ago" on the GitHub page of "webfx-demos/webfx-demo-pacman". And a button "Compare & pull request" so I would think there is manual interaction needed?

[salmonb]

Just ignore this message, as our case is a bit specific: we don't want the webfx branch to be merged back to the main branch.

[armin-reichert]

Thanks. On https://github.com/webfx-demos/webfx-demo-pacman/actions I see now that my two commits have been processed. So I will not bother you further as you are the one who has real work to do ;-)