High Five Trading is a narrative action stock trading game created for Repl.it Game Jam 2019. It includes 25+ varied levels built around an original mechanic and a story about a stock trading family.
Your progress is saved in local storage. Don't feel pressured to finish it in one sitting. Also you can press ESC to get back to the menu, where you can skip the current level if you find it too tedious. (It's hard for me to judge the difficulty at this point.)
If you return to the menu you can also play in party mode on the current level. A party mode game lasts 2 minutes and you can compete for a high score. Play either alone or with as many local friends as you can fit on a keyboard.
Design, story, and programming by Daniel Darabos.
All music by Spinningmerkaba, graciously licensed under Creative Commons Attribution (3.0).
See the in-game credits screen for more details.
It's still in development of course, but I'm finally at a point where it's starting to look like a game. My TODO list:
- Check the layout and FOV on portrait screens.
- Add sound effects.
- Gamepad controls.
- Local multiplayer if I have the time.
@XavierDD Thank you! Those screenshots are so useful! It's also not perfect for me on mobile, but I see completely different issues. :)
The dialog boxes are plain HTML, but with "rotate3d()" CSS transforms. Looks like combined with the WebGL canvas they end up clipping into something. I've added a "translateZ(-20px)" now to try to bring them closer to the camera. It would be fantastic if you could check if this has helped.
@XavierDD Thanks again! This doesn't seem to have made a difference. (Except I had accidentally disabled the rotation animation...)
I've added "transform-style: flat" now in hopes it does something good. (Though I think "flat" is supposed to be the default.)
If it doesn't help, it would be interesting if you could check the example in https://developer.mozilla.org/en-US/docs/Web/CSS/transform-style. In the "flat" example I see no clipping, and in the "preserve-3d" example there is clipping, kind of like in your screenshots. Thanks!
@XavierDD Thank you so much for the continued perseverance! I'm very optimistic now. Can you please try again?
The screenshots are from Chrome on an iPad and I just remembered that this means the page is rendered with Safari. And this is an issue with Safari that has been reported a few times. (E.g., https://stackoverflow.com/questions/15366756/clipping-issue-during-3d-transform-in-safari-only)
When I tried the simple fix (translateZ(-100px)) earlier, I messed it up and just caused the dialog to get stuck on one side. Sorry. I've double checked my change now. Fingers crossed!