Migrating Phaser to CocoonJS

This post to detail my journey on making a Phaser 2.0.7 game work with CocoonJS 2.0.2 (versions ARE importants here).

 

Patch Phaser

Follow this wiki page : https://github.com/photonstorm/phaser/wiki/Phaser-General-Documentation-:-CocoonJS

 

JQuery

So, first of all, JQuery doesn't load  on CocoonJS navigator.
Move on to underscorejs.

 

XML

That may be sound crazy but CocoonJS doesn't provide any XML API. I draw some texts as Phaser bitmapText requiring an XML descriptor parsing.
This code saved my life : https://github.com/videlais/xml-for-cocoonjs

 

Scaling

I never had any issue with scaling during my previous tests (desktop, cordova build on mobile...) but there problems arise : my stage where truncated with black gaps on sides.
In phaser, my game is created using safe height, with the safe width computed based on safewidth/safeheight ratio, then scaling apply

 
this.game = 
    new Phaser.Game(widthRatio, safeHeightheight, 
    Phaser.CANVAS, 'hh_canvas', null, false, false);

hh.game.scale.setScreenSize(true); 
 

With CocoonJs the code is fairly different : full window w&h have to be applied on Game creation, and disabled setScreenSize().

this.game = 
    new Phaser.Game(window.innerWidth*window.devicePixelRatio, window.innerHeight*window.devicePixelRatio, 
    Phaser.CANVAS, 'hh_canvas', null, false, false);   

 

Black background

A fun one that took me a lot of time to figure out the problem.
I render my background using a gradient filled bitmapData : black in CocoonJS
Do NOT set transparent background on new Phaser.Game creation. Works everywhere but in CocoonJS.

 

Last sprite/image not rendered

For an unknown reason, the last element I add to game in "create" function is never renderered.
I just added a dummy.png 1x1 empty image on all my State create() function...

 

Animated texts truncated

One more a time a crazy problem : the last character of my texts, when animated, is not rendered.
Had to add a suffix "_" in case of CocoonJS navigator.

if(navigator.isCocoonJS){
    _text = _text+"_"//add a dummy last character
} 

Hope I saved you some hours I wasted.

I ll try to keep this post updated.

Read More

Grails Offline mode with Maven dependency resolution

Developing with Grails 2.3.5, the maven dependency resolution is almost perfectly integrated.
It depends on the aether core engine to resolve dependencies.

A problem arises when working on offline mode, without any way to check for artifacts repositories.
The application in development runs and gets stuck on "|Configuring classpath" step... for minutes until the application finally starts!
Unfortunately, the configuration grails.offline.mode=true doesn't work with maven resolution, only with the legacy "ivy" dependency resolution.

So here is the trick, after trying loads of configurations failing (-Dsun.net.client.defaultReadTimeout, -Dsun.net.client.defaultConnectTimeout), I ended up adding the following parameters to the JVM :

-Daether.connector.connectTimeout=500 -Daether.connector.requestTimeout=500

Configuring faster timeouts, I can't even notice a latency during application boot :)

Productivity is back !

Read More