CODEWITHSUNDEEP
javascriptphaser-framework
SeriousLee
SeriousLee

Reputation: 1371

Phaser.js - passing game variable to custom object's update function

so the issue I'm having is that I'm trying to create a Player object and pass the game variable to it, which works fine unless I try to access the game variable (specifically game.time) in the player's update function. I'm using Phaser version 6.2.6 and I used this example to create my custom player object: https://phaser.io/examples/v2/sprites/extending-sprite-demo-2

I did cut out irrelevant code but feel free to ask if you need more (like the load state, where I loaded the player asset). But without further ado, here's the code.

index.html (head):

<script type="text/javascript" src="asset/js/phaser.min.js"></script>
<script type="text/javascript" src="asset/js/Player.js"></script>
<script type="text/javascript" src="asset/js/Level1.js"></script>

index.html (body):

<script type="text/javascript">

    window.onload = function() {
        var game = new Phaser.Game(800, 600, Phaser.CANVAS, '');

        game.state.add('Level1', Game.Level1);

        game.state.start('Level1');
    };
</script>

Level1.js: 

var Game = {};  // This line is actually only in my Boot.js file but it for this question I put it here

Game.Level1 = function(game) {};

Game.Level1.prototype = {
    preload : function() {

    },

    create : function(game) {

        game.stage.backgroundColor = '#42f4d9';

        this.physics.arcade.gravity.y = 1400;

        game.player = new Player(game, 'henri', 100, 100);
    },

    update : function(game) {
        console.log(game);  // here the game object gets printed like it should
    },
};

Player.js:

Player = function (game, name, x, y) {

    // accessing 'game' in here works fine.

    Phaser.Sprite.call(this, game, x, y, 'player');
    this.anchor.setTo(0.5, 0.5);

    this.speed = 100;
    this.jumpVelocity = -600;
    this.jumpTimer = 0;

    this.animations.add('idle', [0], 1, false);
    this.animations.add('jump', [0, 1, 2, 3, 4, 5, 6, 7, 8, 9], 20, true);

    game.physics.arcade.enable(this);
    this.body.collideWorldBounds = true;

    this.controls = {
        jump: game.input.keyboard.addKey(Phaser.Keyboard.W)
    };

    game.add.existing(this);
};

Player.prototype = Object.create(Phaser.Sprite.prototype);
Player.prototype.constructor = Player;

Player.prototype.update = function(game) {

    console.log(game) // here it prints 'undefined'

    this.body.velocity.x = 0;

    // this is where I actually get the problem, trying to do game.time.now throws the error "Uncaught TypeError: Cannot read property 'time' of undefined"
    if(this.controls.jump.isDown && (this.body.onFloor() || this.body.touching.down) && game.time.now > this.jumpTimer) {
        this.body.velocity.y = this.jumpVelocity;
        this.jumpTimer = this.time.now +750;
        this.animations.play('jump');
    }

    if(this.body.velocity.x == 0 && this.body.velocity.y == 0) {
        this.animations.play('idle');
    }
};

Upvotes: 0

Views: 2634

Answers (1)

Juli&#225;n
Juli&#225;n

Reputation: 1396

In Player.js I do not know when to use the parameter name, but I assume that it is the key of the resource loaded with Preload:

Phaser.Sprite.call(this, game, x, y, name);

I understand that Update does not receive parameters, to refer to the 'game' object from the Update function would use 'this' in Player.js:

Player.prototype.update = function() {

    console.log(this.game);

    this.body.velocity.x = 0;

   if (this.controls.jump.isDown && (this.body.onFloor() || this.body.touching.down) && this.game.time.now > this.jumpTimer) {
        //Code
    }
}

Upvotes: 1

Related Questions