Phaser 3 - Tweens and Particles

[Devika Mathur]

//Using tweens and particles to simulate the smokey emissions of a rocket in Phaser 3.

var config = {
    width: 1280,
    height: 720,
    type: Phaser.AUTO,
    autoCenter: Phaser.Scale.CENTER_BOTH,
    physics: {
        default: 'arcade',
    },  

//We us the default arcade physics game engine. 
    scene: {
        preload: preload,
        create: create,
        update: update
    }
};

var player;
var cursors;
var smoke;

var game = new Phaser.Game(config);

function preload ()
{
    this.load.image('bg', 'assets/space.jpg');
    this.load.image('player', 'assets/ship.png');
    this.load.image('smoke', 'assets/smoke.png');
}

function create ()
{
    bg = this.add.image(0, 0, 'bg');
    bg.setScale(1.35);
    cursors = this.input.keyboard.createCursorKeys();

    player = this.physics.add.image(400, 300, 'player');
    player.setScale(0.2);

    player.setCollideWorldBounds(true);

    smoke = this.add.particles('smoke');
    
    var emitter = smoke.createEmitter({
        speed: 100,
        scale: { start: 0, end: 1 },
        blendMode: 'ADD'
    });

    emitter.startFollow(player, 0, 80);
    emitter.setScale(0.1);
    emitter.setGravityY(20000);
    emitter.flow(1, 5);

   //The smoke effect is created using the emitter

    var tween = this.tweens.add({

            targets: emitter,
            loop:-1,
        
    });

    tween.play();

}

//The rocket can fly up,down,left and right using arrow keys.

function update ()
{
    player.setVelocity(0);

    if (cursors.left.isDown)
    {
        player.setVelocityX(-500);
    }
    else if (cursors.right.isDown)
    {
        player.setVelocityX(500);
    }

    if (cursors.up.isDown)
    {
        player.setVelocityY(-500);

    }
    else if (cursors.down.isDown)
    {
        player.setVelocityY(500);
    }
}