Working on porting my waternet game (arduboy version) to Bangle JS 2

Hello,

I received my bangle (2) 2 days ago (friday), and i'm working on porting my waternet game to it.

Waternet is a multiplatform puzzle game written for old consoles and handhelds like Game Boy (Color), Game Gear, Master System, Analogue Pocket and Mega Duck (using the gbdk sdk), playdate (using playdate sdk), old gp2x and dingoo (c++), arduboy, ...

The aim of the game, in any game mode is always to connect all pipes so that water can flow through them from the water point source. How you can accomplish this depends on the game mode. The game has a help section in the main menu where people can always check up on the rules of each game mode. The game will have 375 levels, spread over 3 game mode each with 5 difficulties, so that is 25 levels per difficulty / game mode. There will be also a random difficulty which will generate never ending, random levels for the game mode you had chosen.

I had started porting the game using the emulator before i had received my watch. The game was initially written in C but luckily it seems javascript is kinda similar in syntax and i already have the game more or less running. For control i divided the (touch)screen up in a middle part, the 4 corners and the 4 different sides, so you can basically press those parts of the screen to move up / down / left / right etc in menu's and press the middle of the screen to do an action or make a selection in the menu's. Sound i have replaced with a few simple buzz statements as there is no piezo speaker inside the bangle 2. The game also only reacts or redraws (entire screen currently) when there is input on the touch screen, it does not sit in a constant frame loop. It did initially on the arduboy but this would not work on the bangle 2, so i have made some input functions that simulate the previous input based on the touchscreen input (or the side button) and runs a single frame loop and then waits on input again

Anyway here is a gif showing the game running in the emulator. It is tiny on the device itself but still playable and loading the levels is a lot slower on the device (i added a loading message but in the emulator it loads so fast that you never see it displayed).

Last week i worked some more of the game, and i added partial redrawing which made a single (game)loop after input quite a lot faster in the different sections of the game. I also added options to show the input rect so you know all the time where you are supposed to touch the screen for the directional movement in menu's or for the cursor inside the game. Further more i switched to 2bpp palette mode graphics and based on a theming option it will adapt the palette to the foreground and background color of your currently selected theme in the watch. If theming is disabled original (black & white) colors are used. I also added an option to play the game with widgets loaded or not, it does require a restart as i don't know how to undo the call to Bangle.loadWidgets but people can choose there preference now if they want widgets displayed or not. The game adapts its drawing position and input rects based on the Bangle.apprect.

The game is currently around 2600 lines of code, but there are some comments here and there, so it's rather chunky. Below you can see a gif showing the above mentioned theming, input rect and widgets options in action

if you can't wait to test the game i've got a development repo going on github

and if you like to test it on your bangle i also have a github pages going where one could download the current development version on their watch already and try it out

you can also see the code and try it out using the emulator

Sorry for the delay in replying - this looks awesome! I remember playing a similar game (but where the water keeps moving and you have to arrange the pipes fast enough) a loooong time ago.

Thanks for the GitHub pages link - that makes trying it a lot easier! Can't wait to get this in the main repository!

I think looking at the animation one thing I see is the puzzle itself looks like it could almost be rendered at twice the size and so a lot easier to look at in some cases (I guess as it gets harder it gets too big though).

I'm not sure how easy that'd be to do but it might be quite hard to make the puzzle out on the actual watch though...

Sorry for the delay in replying - this looks awesome! I remember playing a similar game (but where the water keeps moving and you have to arrange the pipes fast enough) a loooong time ago.

yeah i played that game also i think it was called pipe dream and i played that on a very old windows version
https://www.youtube.com/watch?app=desktop&v=DkV8PqlMwNc

this game is actually a reimplementation (coded from scratch) of the net and netslide games of the simon tatham puzzle's collection combined into one game

Thanks for the GitHub pages link - that makes trying it a lot easier! Can't wait to get this in the main repository!

I keep adding things, every day i think i have it finished but somehow i keep finding this to add. Yesterday i found out about the inline C compiler and i added a C counterpart for the random function and level generating part (which is actually a maze). It speeded up level generating quite a lot. I did keep the javascript versions as well so it can still work inside the emulator

I think looking at the animation one thing I see is the puzzle itself looks like it could almost be rendered at twice the size and so a lot easier to look at in some cases (I guess as it gets harder it gets too big though). I'm not sure how easy that'd be to do but it might be quite hard to make the puzzle out on the actual watch though...

Hi yes, but the animation does not show everything. The level's size depends on the difficulty and the animation did not show highest difficulty where the levels take (almost) whole width of the screen. The game (at least this version) was initially made for the gameboy which used 8x8 tilesizes, same for the arduboy port. But for the bangle2js i already made the tilesize 10x10 but i can't make it bigger anymore or i don't have enough room in width. Also all things you see are made up of tiles including the text and menu's so the whole screen is made up of different (10x10) tiles so if i increase tilesize text size increase also and i'd have less space to place text (in the options screen text takes almost whole width of screen already). I did try it already on the watch and its still doable but indeed very tiny

smallest levels:

biggest levels:

Great - thanks for all you work on this! Just for anyone else, this is now live on the main app loader: https://banglejs.com/apps/?id=waternet

I just created a little help video, explaining the game mode and usage of the game on the watch. I recorded it using OBS Studio and the emulator as doing it with the watch was probably not going to work already. The video is available on youtube

I'm working on version 0.02. It will have bigger playfield tiles and repositioned screen layout so that things are more viewable on the watch itself. The menu's (atm) will remain the same as well as the little ingame help but during gameplay the playfield will actually be a lot bigger, i went from 10x10 tiles to 16x16 tiles and it makes viewing it on the watch a lot better.
If you can't wait for the release there is a dev version available on my github pages

and here is a small gif to show what i mean