Submission for the Js13kGames competition 2019
I always wanted to write a bubble shooter in the 99-balls-style, so I did that, and made it fit with the theme "back" afterwards.
There are several versions of the game:
- Development version is on https://schnark.github.io/js13kgames-2019/game.html
- Minified version is on https://schnark.github.io/js13kgames-2019/min/index.html
- Official version submitted for the competition is on https://2019.js13kgames.com/entries/the-martians-are-back
- Perhaps I will create a variant of this game as hybrid FFOS app/PWA, like my other apps. This will probably live in a different repository.
Instead of a proper post-mortem, some Q and A:
Q: Why doesn't this use modern JS and includes prefixed stuff that hasn't been necessary for years?
A: Because in my everyday programming I have to be compatible with these old browsers. I also might want to turn the game into a Firefox OS app (which is no longer developped, so requires compatibility with Firefox 32, though this sounds worse than it actually is). And due to this, my linter configuration enforces ES 5. There is also no real need to use modern JS. Why should I deliberately break old browsers when I simply can support them?
Q: Why is the code one big chunk with lots of global variables?
A: I tried to write it with more structure, but this just didn't work. Almost all functions need to know about almost all variables. E.g. almost every function needs to draw the game (either directly or inderectly), and to draw the game we need almost everything from items to the flag whether sound is on or off.
Q: Why is there no automated build system?
A: I built the ZIP more or less by hand. I just did this a few times at the end before releasing it, and this was faster than automating it. While I wrote the game, I just minified the JS (it is handy to have a shell script wrapper to do so), concatenated all files and zip the result. That gives a pretty good estimate of the size of the final game.
Q: Where comes the idea for this game from?
A: The game is heavily inspired by "99 balls", though I don't know whether that game is the original or inspired by other games based on the same idea. I added the different layouts (all other games I know of use a square grid only), the special items, and many details around the game.
Q: How did the theme "back" come in?
A: Unlike the previous years, this year the game idea came first, and I put in the theme afterwards. Those spaceships could actually have been anything else. But the theme inspired the "back" item, and the story about the Martians had an influence on the form of the "destroy ball" and "random direction" item.
Q: How are the collisions calculated?
A: For every small ball additional to its position and velocity some extra data is stored, especially the time until the velocity might change. Initiately this is the time until the ball is ejected, later it is the time until it will hit an item or a wall. Now the animation is easy: Get the smallest of these times. Move the small balls undisturbed according to their velocity for that time, subtract it from all times. Handle the collision (or whatever happens with the ball that had that smallest time). Calculate the next collision for that ball. Repeat until the total time equals the time since the game was last drawn to screen. Draw it. This means that only a few collisions have to be calculated for every animation frame, most of the time the balls are justed moved on straight lines.
Q: Will there be a second version after the contest?
A: Probably yes. Since the story was only added for the theme, I might remove it again and make it just an abstract game. I also have to do something else with the stars. For a short game it's okay to use them to unlock more levels, but once you unlocked all, they are currently just useless.
Q: Which libraries etc. did you use?
A: The sound is generated by https://github.com/foumart/JS.13kGames/blob/master/lib/SoundFX.js (with some minor modifications), which has a nice editor on http://www.foumartgames.com/dev/js13kGames/js_libraries/SoundFXGenerator/. Most of the icons are from Google's Material Design Icons (I had to modify the note icon, because for some reason the two icons didn't match in the rounded form), which is a nice collection for minimalistic icons. Everything else I wrote myself, and I like the fact that the contest gives me a good reason to program without relying on libraries.
Q: What did you learn?
A: HSL colors are great, they are much easier to choose than RGB.
Q: What are your records?
A: Ah, the only real interesting question:
- 1: 225
- 2: 116
- 3: 243
- 4: 147
- 5: 133