CODEWITHSUNDEEP
javascripteaseljscreatejs
Zishan Ahmad
Zishan Ahmad

Reputation: 13

removeChild() not working using easeljs

I am using easeljs to create a stage and then i am putting tiles on the stage on random locations. When the user clicks on a tile, the tile must be removed from the stage. There are two problems that i am facing. First was that the mouse event was not working. The code "tile.onPress = (tileOnPress).bind(this);" so i used the addEventListener method instead. Now although the function is being called as i am getting the output on the console, the tile is not being removed from the stage. Here is the code:

c99.Game = (function(){
function Count99Game() {
    console.log("Count 99 game starts");

    this.canvas = document.getElementById('game-canvas');

    this.stage = new createjs.Stage(this.canvas);

    var totalTiles = 10;

    var tileOnPress = function(event) {
        console.log("Pressed");
        this.stage.removeChild(event.target);
        this.stage.update();
    };  

    for (var i = totalTiles; i > 0; i--) {
        var tile = new c99.Tile(i);
        this.stage.addChild(tile);
        tile.x = Math.random()*(this.canvas.width - tile.width);
        tile.y = Math.random()*(this.canvas.height - tile.height);

        //tile.onPress = (tileOnPress).bind(this);
        tile.addEventListener("click", tileOnPress.bind(this));
    }

    this.stage.update();
}   

return Count99Game;
})();

I would appreciate if someone could tell me why "tile.onPress = (tileOnPress).bind(this);" isn't working and also what changes need to be done in the tileOnPress function so that the tile that is pressed can be removed from the stage.

The complete code can be found at https://github.com/ZANTGames/count99/blob/master/js/count99-game.js

Upvotes: 1

Views: 1687

Answers (1)

Parag Bhayani
Parag Bhayani

Reputation: 3330

Try this

this.stage.removeChild(event.target.parent)

This is because event.target is shape and its parent is tile and basically you want to remove the tile so this is working

For your future reference I have found it from this documentation http://www.createjs.com/docs/easeljs/classes/Stage.html

Upvotes: 2

Related Questions