Hi!
I’m currently working on an idle game prototype and even though there are still thousands of stuff to add, I wanted to have a html5 version.
Here is the WIP prototype (nothing to do except clicking the green buttons to create/upgrade the rooms… That’s all):
http://idle-dungeon.orgfree.com/
As you can see, since the window is (automatically) slightly resized in this html5 version (which is another issue but not the main one here), more important “coordinate”-related issues are revealed.
Here is a video recorded in the editor that make it clearer:
Many coordinate-related problems here, but the first one (that may help me fix the others once I’ll understand how it works) is that the cursor and mouse positions are unsynchronized.
Looks like cursor and mouse positions are resynchronized at the very bottom left of the scene (see the video), which seems to be the origin of both “coordinate systems” (GUI for the mouse, world for the cursor?).
Until now, I only converted my mouse coordinates (gui) to interact with the tiles and the green button (world), it worked fine but when the window is resized… Everything seems broken and I’m lost.
1/ Is there an “easy” way to manage this issue (through a known trick or an extension) or do I have to “manually” convert the coordinates? (how? based on the screen/window ratio?)
2/ Is there a clear/simple documentation about different type of coordinates I could start with before toying with these coordinates and ask more precise/smart questions? To be honest I don’t know where to start… Not even sure to see the difference between screen and viewport etc. (let’s be honest, I just don’t master the basics)
I assume I’m not the only one here to create games with mouse controls and resizable windows
Note: I’m using defold-input for the cursor and rendercam for the camera.
Thank you