Player class help

Phaser 3
1

Hi Guys.

So I’m busy trying to convert my game into classes. I’d really appreciate some help.
I now have multiple scene classes, and a player class all in
separate files which is great and I can switch between scenes.

I am trying to fleshing out my player class, with only basic knowledge of es6 classes, so sorry for any stupid questions.

player.js

export default class Player extends Phaser.Physics.Matter.Image {
constructor(scene, x, y, key) {
super(scene.matter.world, x, y, key);

    scene.add.existing(this)
    this.scene = scene
}

preUpdate () {

}

}

level1.js

var player1 = new Player(this, 200, 400, ‘ship’)

Q1. Player Properties
Where do i store current player properties e.g. totalhealth, healthremaining, fuel etc

  • within my Player class on this?
    e.g. this.health = 100;
    I was told this was not the best idea and previously i spent several days creating objects to avoid doing this. However i’ve seen a video and several other people suggesting to do it that way.

  • using the data manager ?

  • Somewhere else ?

Q2. Containers
Before i started converting to classes - Player was built up using a container which contained several parts. e.g. a ship and a turret (which rotates independently of the player, but is always fixed to the player).

var player_container = this.add.container(PlayerStartX, PlayerStartY);

ship = this.add.image(0, 0, ‘ship’);
ship.setOrigin(0.415,0.5);
player_container.add(ship)

turret = this.add.image(3,0, ‘turret’)
turret.setOrigin(0.12,0.5);
player_container.add(turret)

var Player = this.matter.add.gameObject(player_container, { shape: shapes.ship, restitution:0.8 });

How would i do this in the class way ?
export default class Player extends Phaser.Container ???

Q3. Variables
What’s the best way of adding variables to my class that are only used within that class by multiple method functions.
Currently i have them defined outside of the class which works, but i dont think it’s right.

var RotationTargetAngle_RADS
var counter
var etc etc

export default class Player extends Phaser.Physics.Matter.Image {
…

preUpdate () {

    counter ++;
}

}
For example my RotationTargetAngle_RADS variable gets worked out in my setAngle method, but is also needed in my MoveForward method.

As soon as I start trying to move the variables into the class they end up
on the Player Game Object Itself.
I have been reading about private class variables and the # syntax, which i have tried but i notice that
these also end up on the Player Obj.

export default class Player extends Phaser.Physics.Matter.Image {
#somevar - <<< this is immediately added to the player gameobject
}

Q4. No create?
Where do i define a tween in the player class?
Currently i have it in constructor which seems to work.
I tried adding a create block to my class, but noticed that it wasn’t called.

Q5. Gamecycle
Before classes i had one update loop. I used a gamecycle counter to keep track of the current frame which is used to spawn enemies at certain times etc. If I have multiple classes with preUpdate () { loops how would i have a single gamecycle variable count++?

Thanks so much for any advice.
Really trying to do things the right way and not just hack it.

2

1 - As a class property, definitely. So this.health within your constructor.

2 - Only use a Container if they need to be parented on the display list. If they do, extend Container and use that. Otherwise, just have your class not extend anything, but create Sprite instances as part of its constructor.

3 - If you define them like this, they’ll be global for the class, meaning any instance of the class will all use the same variables, which is almost certainly not what you want. Define them as properties.

See https://exploringjs.com/es6/ch_classes.html for details on classes, private properties, methods, etc.

4 - I wouldn’t have it in a constructor. I would have a method that creates your tween and just call it from your Scene.

5 - Have a method in your Scene called getGameCycle or similar and then call it from your classes, so they all get the correct value from a single source of truth (the Scene).

1 Like