cocoon js problem with phaser

[Ryuuke]

Hello,

I'm new inthe forum I started with phaser a few days ago, and i really like it.

 

I am having some trouble to build it with cocoon js.

 

Im using typescript its the same code which is in here http://www.photonstorm.com/phaser/advanced-phaser-and-typescript-projects

 

I tested it with cordova on android and web browser, everything works fine, but I get white screen when I use cocoon js, it seems that the preload and create functions On Boot class is not executed.

window.onload = function () {    var myGame = new Game();};var __extends = this.__extends || function (d,  {    for (var p in  if (b.hasOwnProperty(p)) d[p] = b[p];    function __() { this.constructor = d; }    __.prototype = b.prototype;    d.prototype = new __();};var Boot = (function (_super) {    __extends(Boot, _super);    function Boot() {        _super.apply(this, arguments);    }    Boot.prototype.preload = function () {        this.load.image("preloadBar", "img/loader.png");    };    Boot.prototype.create = function () {        this.stage.scale.pageAlignHorizontally = true;        if (this.game.device.desktop) {        } else {            this.stage.scaleMode = Phaser.StageScaleMode.SHOW_ALL;            this.stage.scale.minWidth = 480;            this.stage.scale.minHeight = 260;            this.stage.scale.maxWidth = 1024;            this.stage.scale.maxHeight = 768;            this.stage.scale.forceLandscape = true;            this.stage.scale.setScreenSize(true);        }        this.game.state.start("Preloader");    };    return Boot;})(Phaser.State);var Game = (function (_super) {    __extends(Game, _super);    function Game() {        _super.call(this, 800, 600, Phaser.AUTO, '', null);        this.state.add("Boot", Boot, false);        this.state.add("Preloader", Preloader, false);        this.state.add("MainMenu", MainMenu, false);        this.state.add("Stage1", Stage1, false);        this.state.start("Boot");    }    return Game;})(Phaser.Game);var MainMenu = (function (_super) {    __extends(MainMenu, _super);    function MainMenu() {        _super.apply(this, arguments);    }    MainMenu.prototype.create = function () {        var _this = this;        this.background = this.add.sprite(0, 0, "titlePage");        this.background.alpha = 0;        this.logo = this.add.sprite(this.world.centerX, -300, "logo");        this.logo.anchor.x = this.logo.anchor.y = 0.5;        console.log(this.background);        this.add.tween(this.background).to({ alpha: 1 }, 2000, Phaser.Easing.Bounce.InOut, true);        var tween = this.add.tween(this.logo).to({ y: 220 }, 2000, Phaser.Easing.Elastic.Out, true, 2000);        tween.onComplete.add(function () {            return _this.input.onDown.addOnce(_this.FadeOut, _this);        }, this);    };    MainMenu.prototype.FadeOut = function () {        var _this = this;        this.add.tween(this.background).to({ alpha: 0 }, 2000, Phaser.Easing.Linear.None, true);        var tween = this.add.tween(this.logo).to({ y: 800 }, 2000, Phaser.Easing.Linear.bind, true, 2000);        tween.onComplete.add(function () {            return _this.game.state.start("Stage1", true, false);        }, this);    };    return MainMenu;})(Phaser.State);var Player = (function (_super) {    __extends(Player, _super);    function Player(game, x, y) {        _super.call(this, game, x, y, "simon", 0);        this.anchor.setTo(0.5, 0);        this.animations.add("walk", [0, 1, 2, 3, 4], 10, true);        this.game.add.existing(this);        this.body.collideWorldBounds = true;    }    Player.prototype.update = function () {        this.body.velocity.x = 0;        this.body.velocity.y = 0;        if (this.game.input.keyboard.isDown(Phaser.Keyboard.RIGHT)) {            this.body.velocity.x += 150;            this.animations.play("walk");            if (this.scale.x == -1) {                this.scale.x = 1;            }        } else if (this.game.input.keyboard.isDown(Phaser.Keyboard.LEFT)) {            this.body.velocity.x -= 150;            this.animations.play("walk");            if (this.scale.x == 1) {                this.scale.x = -1;            }        } else {            this.animations.stop("walk");            this.animations.frame = 0;        }    };    return Player;})(Phaser.Sprite);var Preloader = (function (_super) {    __extends(Preloader, _super);    function Preloader() {        _super.apply(this, arguments);    }    Preloader.prototype.preload = function () {        this.PreloadBar = this.game.add.sprite(200, 250, "preloadBar");        this.load.setPreloadSprite(this.PreloadBar);        this.load.image("titlePage", "img/titlepage.jpg");        this.load.image("logo", "img/logo.png");        this.load.image("background", "img/level1.png");        this.load.spritesheet("simon", "img/simon.png", 58, 96, 5);    };    Preloader.prototype.create = function () {        var _this = this;        var tween = this.add.tween(this.PreloadBar).to({ alpha: 0 }, 1000, Phaser.Easing.Linear.bind, true);        tween.onComplete.add(function () {            _this.game.state.start("MainMenu", true, false);        }, this);    };    return Preloader;})(Phaser.State);var Stage1 = (function (_super) {    __extends(Stage1, _super);    function Stage1() {        _super.apply(this, arguments);    }    Stage1.prototype.create = function () {        this.background = this.add.sprite(0, 0, "background");        this.player = new Player(this.game, 130, 284);    };    return Stage1;})(Phaser.State);