Phaser tutorial, no star overlap after "first round"

robatt · March 29, 2020

I'm going through the tutorial, and added some tweaks. After all the stars are collected, the new stars and bombs appear, but collisions with the player and stars are not registered any longer. This is my code:

<!DOCTYPE html>
<html>
<head>
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/phaser-arcade-physics.min.js"></script>
</head>
<body>

    <script>
    var config = {
        type: Phaser.AUTO,
        width: 800,
        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;

    function preload ()
    {
        this.load.image('sky', 'assets/sky.png');
        this.load.image('ground', 'assets/platform.png');
        this.load.image('star', 'assets/star.png');
        this.load.image('bomb', 'assets/bomb.png');
        this.load.spritesheet('dude', 
        'assets/dude.png',
        { frameWidth: 32, frameHeight: 48 }
    );  }

    function create ()
    {
        this.add.image(400, 300, 'sky');
        scoreText = this.add.text(16, 16, 'score: 0', { fontSize: '32px', fill: '#000' });

        platforms = this.physics.add.staticGroup();
        platforms.create(400, 568, 'ground').setScale(2).refreshBody();
        platforms.create(600, 400, 'ground');       
        platforms.create(50, 250, 'ground');
        platforms.create(750, 220, 'ground');   

        player = this.physics.add.sprite(100, 450, 'dude');
        player.setBounce(0.2);
        player.setCollideWorldBounds(true);
        this.physics.add.collider(player, platforms);
        
        this.anims.create({
            key: 'left',
            frames: this.anims.generateFrameNumbers('dude', { start: 0, end: 3 }),
            frameRate: 10,
            repeat: -1
        });

        this.anims.create({
            key: 'turn',
            frames: [ { key: 'dude', frame: 4 } ],
            frameRate: 20
        });

        this.anims.create({
            key: 'right',
            frames: this.anims.generateFrameNumbers('dude', { start: 5, end: 8 }),
            frameRate: 10,
            repeat: -1
        });    
        stars = this.physics.add.group({
            key: 'star',
            repeat: 11,
            setXY: { x: 12, y: 0, stepX: 70 }
        });

        stars.children.iterate(function (child) {

            child.setBounceY(Phaser.Math.FloatBetween(0.4, 0.8));

        });
        this.physics.add.collider(stars, platforms);
        this.physics.add.overlap(player, stars, collectStar, null, this);

        bombs = this.physics.add.group();
        this.physics.add.collider(bombs, platforms);
        this.physics.add.collider(player, bombs, hitBomb, null, this);
    }
    function hitBomb(player, bomb) {
        this.physics.pause();
        player.setTint(0xff0000);
        player.anims.play('turn');
        gameOver = true;
    }

    function collectStar(player, star)
    {
        if (star.dying) {
            return;
        }
        star.dying = true;
        var cnt = 0;
        star.setBounceY(0);
        var ph = this.physics;
        var timer = this.time.addEvent({
            delay: 50,                // ms
            callback: function () {
                cnt++;
                scoreText.setText('Score: ' + (score + cnt));
                star.setScale(1.0-cnt/10);
                if (cnt === 10) {
                    timer.remove();
                    score += 10;                    
                    star.disableBody(true, true);
                    if (stars.countActive(true) === 0)
                    {
                        stars.children.iterate(function (child) {
                            child.setScale(1.0);
                            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);
                    }
                }
            },
            loop: 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(-330);
        }
    }
    </script>

</body>
</html>

Sign In

Phaser tutorial, no star overlap after "first round"

Recommended Posts

robatt

Link to comment

Share on other sites

Recently Browsing 0 members

Browse

Activity