# How to add lives in tutorial game?

**URL:** <https://phaser.discourse.group/t/how-to-add-lives-in-tutorial-game/1729>\
**Category:** Phaser 3\
**Created:** [March 18, 2019, 7:17pm UTC](https://phaser.discourse.group/t/how-to-add-lives-in-tutorial-game/1729 "2019-03-18T19:17:21Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![pizzaroword](https://avatars.discourse-cdn.com/v4/letter/p/779978/32.png) [@pizzaroword](https://phaser.discourse.group/u/pizzaroword)\
**Post date:** [March 18, 2019, 7:17pm UTC](https://phaser.discourse.group/t/how-to-add-lives-in-tutorial-game/1729/1 "2019-03-18T19:17:21Z")

</div>

I have completed the Phaser 3 tutorial and am now trying to add lives to the game. I want the game to end once the player runs out of lives. I am a novice, so I apologize in advance for mistakes.

This is my code:

\<!doctype html\>

\<html lang=“en”\>

\<head\>

```
&lt;meta charset="UTF-8" /&gt;

&lt;title&gt;Making your first Phaser 3 Game - Page 10&lt;/title&gt;

&lt;script src="js/phaser.js"&gt;&lt;/script&gt;

&lt;style type="text/css"&gt;

    body {

        margin: 0;

    }

&lt;/style&gt;

```

\</head\>

\<body\>

\<script type=“text/javascript”\>

var config = {

```
type: Phaser.AUTO,

width: 800,

height: 600,

physics: {

    default: 'arcade',

    arcade: {

        gravity: { y: 300 },

        debug: false

    }

},

scene: {

    preload: preload,

    create: create,

    update: update

}

```

};

var player;

var stars;

var bombs;

var platforms;

var cursors;

var score = 0;

var gameOver = false;

var scoreText;

var game = new Phaser.Game(config);

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 ()

{

```
// A simple background for our game

this.add.image(400, 300, 'sky');

// The platforms group contains the ground and the 2 ledges we can jump on

platforms = this.physics.add.staticGroup();

// Here we create the ground.

// Scale it to fit the width of the game (the original sprite is 400x32 in size)

platforms.create(400, 568, 'ground').setScale(2).refreshBody();

// Now let's create some ledges

platforms.create(600, 400, 'ground');

platforms.create(50, 250, 'ground');

platforms.create(750, 220, 'ground');

// The player and its settings

player = this.physics.add.sprite(100, 450, 'dude');

// Player physics properties. Give the little guy a slight bounce.

player.setBounce(0.2);

player.setCollideWorldBounds(true);

// Our player animations, turning, walking left and walking right.

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

});

// Input Events

cursors = this.input.keyboard.createCursorKeys();

// Some stars to collect, 12 in total, evenly spaced 70 pixels apart along the x axis

stars = this.physics.add.group({

    key: 'star',

    repeat: 11,

    setXY: { x: 12, y: 0, stepX: 70 }

});

stars.children.iterate(function (child) {

    // Give each star a slightly different bounce

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

});

bombs = this.physics.add.group();

// The score

scoreText = this.add.text(16, 16, 'score: 0', { fontSize: '32px', fill: '#000' });

// Collide the player and the stars with the platforms

this.physics.add.collider(player, platforms);

this.physics.add.collider(stars, platforms);

this.physics.add.collider(bombs, platforms);

// Checks to see if the player overlaps with any of the stars, if he does call the collectStar function

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

this.physics.add.collider(player, bombs, hitBomb, null, this);

```

}

function update ()

{

```
if (gameOver)

{

    return;

}

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 &amp;&amp; player.body.touching.down)

{

    player.setVelocityY(-330);

}

```

}

function collectStar (player, star)

{

```
star.disableBody(true, true);

// Add and update the score

score += 10;

scoreText.setText('Score: ' + score);

if (stars.countActive(true) === 0)

{

    // A new batch of stars to collect

    stars.children.iterate(function (child) {

        child.enableBody(true, child.x, 0, true, true);

    });

    var x = (player.x &lt; 400) ? Phaser.Math.Between(400, 800) : Phaser.Math.Between(0, 400);

    var bomb = bombs.create(x, 16, 'bomb');

    bomb.setBounce(3);

    bomb.setCollideWorldBounds(true);

    bomb.setVelocity(Phaser.Math.Between(-500, 500), 30);

    bomb.allowGravity = true;

}

```

}

function hitBomb (player, bomb)

{

```
this.physics.pause();

player.setTint(0xff0000);

player.anims.play('turn');

gameOver = true;

```

}

\</script\>

\</body\>

\</html\>
