Hello, everyone I am trying to learn Phaser 3 by creating a small game following the official tutorial and I have a problem with the final chapter. The main character collects money and if they are all collected a new batch should appear, I am doing it by following the tutorial and when my character picks up the money the entire game freezes and I get this error in the console:
money.countActive is not a function
how come it is not a function? What am I doing wrong here? Here is how my code works:
var config = {
type: Phaser.AUTO,
width: 900,
height: 600,
physics: {
default: 'arcade',
arcade: {
gravity: { y: 300 }
}
},
scene: {
preload: preload,
create: create,
update: update
}
};
var game = new Phaser.Game(config);
var score = 0;
var scoreText;
var dynamite;
function preload() {
this.load.image('sky', 'assets/world/sky.png');
this.load.image('ground', 'assets/world/ground.png');
this.load.image('platform', 'assets/world/platform.png');
this.load.image('money', 'assets/world/money.PNG');
this.load.image('dynamite', 'assets/world/dynamite.png');
this.load.spritesheet('player', 'assets/characters/player.png', { frameWidth: 32, frameHeight: 48 });
}
function create() {
this.add.image(400, 300, 'sky');
platforms = this.physics.add.staticGroup();
ground = this.physics.add.staticGroup();
platforms.create(600, 350, 'platform');
platforms.create(50, 250, 'platform');
platforms.create(650, 220, 'platform');
ground.create(500, 550, 'ground');
// Creating the player
player = this.physics.add.sprite(50, 350, 'player');
player.setBounce(0.2);
player.setCollideWorldBounds(true);
player.body.setGravityY(300)
this.physics.add.collider(player, ground);
this.physics.add.collider(player, platforms);
this.anims.create({
key: 'left',
frames: this.anims.generateFrameNumbers('player', { start: 0, end: 3 }),
frameRate: 10,
repeat: -1
});
this.anims.create({
key: 'turn',
frames: [{ key: 'player', frame: 4 }],
frameRate: 20
});
this.anims.create({
key: 'right',
frames: this.anims.generateFrameNumbers('player', { start: 5, end: 8 }),
frameRate: 10,
repeat: -1
});
// Creating money
moneyStack = this.physics.add.group({
key: 'money',
repeat: 11,
setXY: { x: 12, y: 0, stepX: 70 }
});
moneyStack.children.iterate(function (child) {
child.setBounceY(Phaser.Math.FloatBetween(0.4, 0.8));
});
dynamites = this.physics.add.group();
this.physics.add.collider(moneyStack, platforms);
this.physics.add.collider(dynamites, platforms);
this.physics.add.collider(moneyStack, ground);
function collectMoney(player, money) {
money.disableBody(true, true);
score += 10;
scoreText.setText('Score: ' + score);
if (money.countActive(true) === 0) {
// A new batch of money to collect
money.children.iterate(function (child) {
child.enableBody(true, child.x, 0, true, true);
});
var x = (player.x < 400) ? Phaser.Math.Between(400, 800) : Phaser.Math.Between(0, 400);
var bomb = bombs.create(x, 16, 'bomb');
bomb.setBounce(1);
bomb.setCollideWorldBounds(true);
bomb.setVelocity(Phaser.Math.Between(-200, 200), 20);
bomb.allowGravity = false;
}
}
this.physics.add.overlap(player, moneyStack, collectMoney, null, this)
this.physics.add.collider(player, dynamites, hitDynamite, null, this);
// Creating score field
scoreText = this.add.text(16, 16, 'score: 0', { fontSize: '32px', fill: '#000' });
function hitDynamite(player, dynamite) {
this.physics.pause();
player.setTint(0xff0000);
player.anims.play('turn');
gameOver = true;
}
}
function update() {
cursors = this.input.keyboard.createCursorKeys();
if (cursors.left.isDown) {
player.setVelocityX(-160);
player.anims.play('left', true);
}
else if (cursors.right.isDown) {
player.setVelocityX(160);
player.anims.play('right', true);
}
else {
player.setVelocityX(0);
player.anims.play('turn');
}
if (cursors.up.isDown && player.body.touching.down) {
player.setVelocityY(-450);
}
}