I just wanted to write down my initial experiences porting Partypillars to OUYA using CocoonJS.
Partypillars is a 4-player local multiplayer game built using ImpactJS and Box2D. It also supports controllers using the Gamepad API defined in the W3C spec.
Around a month ago I made it available on itch.io
, and a couple of days ago I took a stab at porting it to OUYA with CocoonJS. There were just a couple of hurdles I had to jump, one of which was a especially annoying to debug.
Getting the game to run was surprisingly easy, the only hitches I had were due to my own inexperience with Android and OUYA, but basically it’s very easy. First you have to make a zip-file that includes the index.html file, the media folder, the game.min.js file and any other external .js files you’re using (I always use TweenMax.js for my projects for example). Then you go to CocoonJS, make an account and start a new project. When you choose “compile project” you check off OUYA and throw your zip-file in there, and after a couple of minutes you should have a fully functioning OUYA-ready .apk. Just put it on your webserver, browse to it using your OUYA browser, download the signed debug file and then you can install and run it from manage->storage->downloads.
Controllers with CocoonJS
My first real problem appeared here when the game was already up and running. None of the buttons on the controller worked. The only response I got was from the analogues (which I had thankfully mapped to the same as the d-pad). After trying some different configs of buttons I started to realize that it wasn’t that the buttons were mapped differently, I was not getting any button presses from any of the controllers whatsoever.
I started browsing the documentation of CocoonJS, already suspecting that someone had fucked up the implementation of the Gamepad spec, and after a small dead end I found the problem.
The W3C spec is pretty clear on how you’re supposed to implement controllers: each controller object contains an array of buttons, and each button is an object that holds two variables, on bool called ‘pressed’, and a float called ‘value’. The ‘pressed’ variable is true if the button is pressed (duh!) and false if not. The ‘value’ variable holds a number between 0 and 1 which shows how hard the button is being pressed, with 0 being not at all, and 1 being all the way in. CocoonJS however has opted to not implement the ‘pressed’ variable at all, and letting the button object instead BE a float that is between 1 and 0. Essentially, I was checking variables that didn’t exist.
After I figured that out, I wrote an OUYA exception in my controller code, and I could finally interact properly.
Now for my other problem: my bitmap fonts weren’t working properly. I assumed this had something to do with the way Impact implements bitmap fonts, and again after a couple of dead ends I just asked Dominic (@phoboslabs) who wrote the engine what he thought the problem was.
Dominic answered right away as per usual, and he seemed to know exactly what the problem was:
After setting a breakpoint, copying the two arrays into a separate file in Sublime, doing some creative multicursor editing and essentially hardcoding the width and indices of the font, everything worked perfectly!
Play the game on itch.io in the browser or download the OUYA compatible .apk from there! OUYA version works well most of the time but is not optimized and I have noticed some crash bugs at times.