Non-standard zoom property and click offset

[Tisaac]

Hi everyone!

I was experiencing some offsets when clicking on some space on the board of my game Santorini on the app : the wrong space was selected or no space selected at all.
Since I'm using a 3D rendered scene, I cannot use classic eventListener on DOM object but instead I have to compute the position of the click on the scene to then use raycasting. It's when I try to compute the position of the scene container on the page that some weird numbers pop out. After using the mobile-simulation of chrome, I found out that this was due to the fact that BGA framework use the non-standard css property "zoom" to make their website "responsive". I found out it was one of the reason why the bga app is not working on firefox, since ff doesn't support this property.
Has anyone experienced same kind of things before ? Any idea how to solve this ?
(related bug report on chromium : https://bugs.chromium.org/p/chromium/is ... =429140#c8)

Thanks,
Tim

[Een]

Hi Tim,
Yes, there has been an issue of this kind with the game NXS (using canvas): clicks didn't worked when zoomed.
Solution found has been to reset the zoom to normal in the onScreenWidthChange function.

Code: Select all

onScreenWidthChange: function() {
          dojo.style('page-content', 'zoom', 'normal' );
...
}

So it may work in your case.

Also, yes, the framework should use transform instead of zoom. We have to fix that at some point.

[Tisaac]

I am not alone ! Thanks for the anwser Een.
I also tried to reset the zoom level to 1 but this screwed up the display so much (lot of other stuff seems to be computed depending on this : the margin-top of left-side, the side of player-board, ...) that I just abandoned this idea.
Did they manage to fix this in NXS ?

[Een]

I don't remember any trouble with something else with NXS. You can check out the game, it's in prod and in the studio.

[Tisaac]

Thanks! It actually worked easily!
When I was testing myself before posting here, I didn't know about the onScreenWidthChange hook so I had some trouble launching the zoom-removal at the right time, and I was trying to remove the zoom also on the player board, which is not mandatory for making the game work and was breaking the UI a lot.
Thanks again !

[Een]

Thanks! It actually worked easily!
When I was testing myself before posting here, I didn't know about the onScreenWidthChange hook so I had some trouble launching the zoom-removal at the right time, and I was trying to remove the zoom also on the player board, which is not mandatory for making the game work and was breaking the UI a lot.
Thanks again !

Great to know that it worked!