mindstorm8191 / settlerswarlords

A MMO factory-builder game created with React and PHP
10 stars 0 forks source link

Bug: Tutorial box not separated from map - only in production #107

Open mindstorm8191 opened 1 year ago

mindstorm8191 commented 1 year ago

I have this bug, that only shows up in production, where the tutorial box is on the same layer as the scrolling map, instead of with the container for the scrolling map. The result is that the tutorial doesn't stay on screen when scrolling around the map, and instead blocks the top left tiles from the player's use. And this only happens in production; in development the tutorial behaves just fine.

The tutorial's content is defined in src/game.jsx as a tutorialModes attribute of game. Display is handled in src/comp_localMap.jsx, near the bottom of the LocalMap function. It is wrapped inside a FixedPositionChild component. This is defined in src/libs/DraggableMap.jsx, which only renders its children. Now, the way that DraggableMap uses this is where the magic happens. With all of its children, I create two lists: one for regular components, and one for any components labeled as FixedPositionChild. The normal components are rendered as part of the map, like normal. All the FixedPositionChild components are rendered outside the scrolling div, thus remaining in a fixed location.

This works quite well, but I can't figure out why it doesn't work in production mode. I think it has to do with filtering out FixedPositionChild. I do know that in production mode, the FixedPositionChild is appearing in the same div as the map tiles, but in development mode it is in the same div with the scrolling div (as it should be). I don't know how to correct this

Any help with this bug will be much appreciated

mindstorm8191 commented 1 year ago

This bug needs to be verified as existing or removed with the new version of the project