Strange sprite lost issue

[PixelPicoSean]

Hi guys,

 

I'm reading the book "HTML5 shootemup in an afternoon" and trying to build the game with Panda.js instead of Phaser. But when I shoot bullets, a "TypeError" occurs each time after shooting for a while.

 

Here's the code:

game.createClass('Bullet', {        sprite: null,        body: null,        speed: 200,        staticInit: function(x, y) {            var inst = game.scene.pool.get('Bullet');            return inst && inst.reset(x, y);        },        init: function(x, y) {            this.collide = this.collide.bind(this);            // Sprite            this.sprite = new game.Sprite('bullet', x, y, {                anchor: { x: 0.5, y: 0.5 }            });            game.scene.stage.addChild(this.sprite);            // Body            this.body = new game.Body({                position: { x: x, y: y },                shape: new game.Circle(this.sprite.width),                collisionGroup: GROUP.PLAYER_BULLET,                collideAgainst: [GROUP.ENEMY],                collide: this.collide,                velocity: { y: -this.speed }            });            this.body.owner = this;            game.scene.world.addBody(this.body);        },        reset: function(x, y) {            this.sprite.position.set(x, y);            game.scene.stage.addChild(this.sprite);            this.body.position.set(x, y);            this.body.velocity.set(0, -this.speed);            game.scene.world.addBody(this.body);            return this;        },        update: function() {            this.sprite.position.set(                this.body.position.x,                this.body.position.y            );            // Kill self when out of screen            if (this.body.position.y  < this.sprite.height) {                this.kill();            }        },        collide: function(body) {            body.owner.receiveDamage(1, this);            this.body.velocity.set(0, 0);            this.kill();            return false; // Overlap        },        kill: function() {            game.scene.removeObject(this);            game.scene.world.removeBody(this.body);            game.scene.stage.removeChild(this.sprite);            game.scene.pool.put('Bullet', this);        }    });

I thought it was something wrong with pooling, but it still exists after disable recycling.

 

The console gives me this: 

Uncaught TypeError: Cannot read property 'updateTransform' of undefined

Link to the demo here

 

Regards,

Sean

[martinez]

Hi Sean,

 

It looks like the issue is not about the Bullet class. You should get a closer look at the Explosion class and it's kill() function. When Explosion's are disabled in Enemy class it works well:

        kill: function() {            // Explosion on killing            //new game.Explosion(this.sprite.position.x, this.sprite.position.y);   // COMMENTED THIS OUT!            // Revive to random position            var x = Math.random().map(0, 1, 20, 780);            this.body.position.set(x, -this.sprite.height/* * 0.5*/);            this.body.velocity.y = Math.random().map(0, 1, 30, 60);        }

[PixelPicoSean]

You should get a closer look at the Explosion class and it's kill() function. When Explosion's are disabled in Enemy class it works well.

 

Thanks man, it does work well if no `Explosion` is going to be created. But I just find another problem, some bullets are moving faster than the others, it happens even I reset velocity in `update` method.