Problem with level?

Phaser 3
1

in my level-manager.js, how do I grab the passed variables in lvl-1.js?

Here’s my class.

'level-manager.js' :

class LevelManager extends Phaser.Scene {

    constructor ( __objData ) {
        super ( __objData );
        this.__level = 0;
        this.__objData = __objData;
        this.__scene = this.__objData.scene;
        this.__camera = this.__objData.camera;
        this.__map = this.__objData.map;
        this.__tiles = this.__objData.tiles;
        this.__entity = this.__objData.entity;
        this.__data = 
        [
            this.__scene, this.__camera, this.__map, 
            this.__tiles, this.__entity, 
        ];
    }

    nextLevel ( __scene, __sceneKey ) {

        this.__level++;

        this.__scene = __scene;
        this.__sceneKey = __sceneKey;

        console.error ( this.__level );
        console.error ( this.__scene );
        console.error ( this.__sceneKey );

        this.__scene.scene.start (
            this.__sceneKey, 
            this.__data
        );

        if ( this.__level ) {
            console.log ( 'SCENE' + ' :: ' + ' { ' + '\'' + ( this.__level ) + '\'' + ' } ' + 'WITH' + ' ' + 'SCENE KEY' + ' ' + '::' + ' { ' + '\'' + this.__sceneKey + '\'' + ' } ' + 'HAS BEEN STARTED!' );
            console.log ( 'Data :: ' + '\r\n', this.__data );
        }

    }

}

How I call it in 'preload-scene.js' :

this.__level = new LevelManager ({
    scene : this, 
    camera : this.cameras.main, 
    map : this.__map, 
    tiles : this.__tiles, 
    entity : this.hero, 
});

this.__level.nextLevel ( this, 'lvl-1' );

Line to look at :

this.__scene.scene.start (
    this.__sceneKey, 
    this.__data
);

it’s dumping the data correctly in console.error ( ) for this.__data, I just need a way to grab it in ‘lvl-1.js’
Here’s ‘lvl-1.js’ :
Here’s 'lvl-1.js' :

 /**
     * A class that extends Phaser.Scene & wraps up 
     * the core logic for the level
 */

class Level1 extends Phaser.Scene

{

    constructor ( ) {
        super ({ 
            key : 'lvl-1', 
        });
    }

    preload ( ) {
    }

    init ( ) {

        // Set whether or not the Player is dead { Default :: false }
        // Set whether or not the Player fell into a hole { Default :: false }
        // Set whether or not the Player has overlapped the Goal

        this.__isPlayerDead = false;
        this.__playerFallsInHole = false;
        this.__hasOverlapped = false;

    }

    create ( ) {

    }

    update ( ) {

        stats.update ( );

    }

}

Any help is greatly appreciated!

2

The data is passed to the init method. Add a data Param to your init and you should be able to print it with console.log.

3

@smjn : How?

4

In level1 class change init to

    init (data ) {
        console.log(data);
        // Set whether or not the Player is dead { Default :: false }
        // Set whether or not the Player fell into a hole { Default :: false }
        // Set whether or not the Player has overlapped the Goal

        this.__isPlayerDead = false;
        this.__playerFallsInHole = false;
        this.__hasOverlapped = false;

    }
5

So I got it to pass the data from 'preloading-scene.js' to 'lvl-1.js', but the problem is when I comment out :

this.__level.nextLevel ( this, 'lvl-1' );

in 'preloading-scene.js'inside of 'create ( )', it loads the level & all the resources just fine. Problem is I want it to only create the player{s}, asset{s} & level{s} 1 time to be used throughout all lvl class files, 'lvl-1.js', 'lvl-2.js' & so on. So when I uncomment this.__level.nextLevel ( this, 'lvl-1' ); in 'preloading-scene.js', it takes me to a blank scene in 'lvl-1.js' where the player, assets & level should already be loaded & created - which in lvl-1 scene, they are not.

This is how I create my player by calling this.hero = new Player ( ... ); in
'preloading-scene.js' :

'player.js' :

class Player {

	create ( __objData ) {

		this.__objData = __objData;

		this.__config = this.__objData.config;

		this.__scene = this.__objData.scene;
		this.__input = this.__objData.input;
		this.__physics = this.__objData.physics;
		this.__anims = this.__objData.anims;
		this.__add = this.__objData.add;

		this.__x = this.__objData.x;
		this.__y = this.__objData.y;

		this.__keyList = {

			w : Phaser.Input.Keyboard.KeyCodes.W, 
			a : Phaser.Input.Keyboard.KeyCodes.A, 
			s : Phaser.Input.Keyboard.KeyCodes.S, 
			d : Phaser.Input.Keyboard.KeyCodes.D, 

		}

		// Get Keyboard Cursor{s} Input
		this.cursors = this.__input.keyboard.createCursorKeys ( );

		// Get Keyboard Key{s} Input
		this.keys = this.__input.keyboard.addKeys ( this.__keyList );

		// The movable character
		this.sprite = this.__physics.add.sprite (
			275, 575, "hero", 0
		);

		// Set default `facing` to `right`
		this.sprite.direction = 'right';

		// Set default `X-Position`
		this.sprite.x = this.__x;

		// Set default `Y-Position`
		this.sprite.y = this.__y;

		this.__minVelocityX = ( 1.0 );
		this.__maxVelocityX = ( 2.0 );
		this.__minVelocityY = ( 100.0 );
		this.__maxVelocityY = ( 250.0 );

		this.__minAccelerationX = ( 1.0 );
		this.__maxAccelerationX = ( 2.0 );
		this.__minAccelerationY = ( 100.0 );
		this.__maxAccelerationY = ( 250.0 );

		playerAnims.CreatePlayerAtlasAnimations ( {
			masterKey : this.__masterKey, 
			scene : this.__scene, 
			anims : this.__anims, 
			entName : 'hero', 
		} );

		// The state machine managing the hero

		this.stateMachine = new StateMachine ( 'idle', {

			idle : new IdleState ( ), 
			move : new MoveState ( ), 
			jump : new JumpState ( ), 
			movejump : new MoveJumpState ( ), 
			fall : new FallState ( ), 

		}, 

			[ {

				masterKey : this.__masterKey, 
				scene : this, 
				entity : this.sprite, 
				minVelocityX : this.__minVelocityX, 
				maxVelocityX : this.__maxVelocityX, 
				minVelocityY : this.__minVelocityY, 
				maxVelocityY : this.__maxVelocityY, 
				minAccelerationX : this.__minAccelerationX, 
				maxAccelerationX : this.__maxAccelerationX, 
				minAccelerationY : this.__minAccelerationY, 
				maxAccelerationY : this.__maxAccelerationY, 

			} ]

		);

		this.destroyed = false;

		this.__scene.events.on ( "update", this.update, this );
		this.__scene.events.once ( "shutdown", this.destroy, this );
		this.__scene.events.once ( "destroy", this.destroy, this );

	}

	// `Freeze` our `Player` in place

	freeze ( ) {

		// Sets the `Player` to not be able to move

		this.sprite.body.moves = false;

	}

	update ( ) {

		if ( this.destroyed ) { return; }

	}

	destroy ( ) {

		this.destroyed = true;

		// Event listeners

		this.__scene.events.off ( "shutdown", this.destroy, this );
		this.__scene.events.off ( "destroy", this.destroy, this );

	}

}

This is my level manager :

'level-manager.js' :

class LevelManager extends Phaser.Scene {

	constructor ( __objData ) {
		super ( __objData );
		this.__level = 0;
		this.__objData = __objData;
		this.__scene = this.__objData.scene;
		this.__camera = this.__objData.camera;
		this.__map = this.__objData.map;
		this.__tiles = this.__objData.tiles;
		this.__entity = this.__objData.entity;
		this.__data = 
		[
			this.__scene, this.__camera, this.__entity, 
			this.__map, this.__tiles, 
		];
	}

	nextLevel ( __scene, __sceneKey ) {

		this.__level++;

		this.__scene = __scene;
		this.__sceneKey = __sceneKey;

		console.error ( this.__level );
		console.error ( this.__scene );
		console.error ( this.__sceneKey );

		this.__scene.scene.start (
			this.__sceneKey, 
			this.__data
		);

		if ( this.__level ) {
			console.log ( 'SCENE' + ' :: ' + ' { ' + '\'' + ( this.__level ) + '\'' + ' } ' + 'WITH' + ' ' + 'SCENE KEY' + ' ' + '::' + ' { ' + '\'' + this.__sceneKey + '\'' + ' } ' + 'HAS BEEN STARTED!' );
			console.log ( 'Data :: ' + '\r\n', this.__data );
		}

	}

}

This is how I preload all my scene{s} & assets :

'preload-scene.js' :

/**
  * A class that extends Phaser.Scene & wraps up 
  * the core logic for the preloader
  */

class PreloadingScene extends Phaser.Scene

{

	constructor ( ) {
		super ({ 
			key : 'preloader', 
		});
	}

	__LoadAllAssets ( ) {

		// Load our Player's Texture Atlas

		this.load.atlas (
			'hero', 
			'assets/characters/character-atlas.png', 
			'assets/characters/character-atlas.json'
		);

		// Load Tileset for Level{s} { 1 }

		this.load.image (
			'lvl-1-1', 
			'assets/tilesets/platformPack_tilesheet.png'
		);

		// Load Level { 1 } JSON

		this.load.tilemapTiledJSON (
			'map-1-1', 
			'assets/tilemaps/levels/lvl-1.json'
		);

	}

	SceneSetup ( __objData )

	{

		console.time ( 'setup' );

		this.__objData = __objData;

		this.__map = [ ];

		this.__scene = this.__objData.scene;
		this.__camera = this.__objData.camera;
		this.__make = this.__objData.make;
		this.__input = this.__objData.input;
		this.__physics = this.__objData.physics;
		this.__anims = this.__objData.anims;
		this.__add = this.__objData.add;

		// Create our Tilemap for Level { 1 }

		this.__tileMap = this.__make.tilemap ({
			// Set the Map's `ID key`
			key : 'map-1-1', 
		});

		// Add Tileset to Tilemap for Level { 1 }

		this.__tiles = this.__map.addTilesetImage (
			'platformPack_tilesheet', 'lvl-1-1', 66, 
			66, 1, 2, 
			0, 
		);

		// Create `Dynamic` `ground` Layer for Level{s} { 1 }

		this.__groundLayer = this.__map.createDynamicLayer (
			'ground', this.__tiles
		);

		// Grab the `Spawn Point` Object from the Tiled map

		this.__playerSpawnPoint = this.__map.findObject ( 
			"player-spawn-point", obj => obj.name === "player-spawn-point"
		);

		// Create Player{s}

		this.hero = new Player ( );

		this.hero.create ({
			scene : this.__scene, input : this.__input, physics : this.__physics, 
			anims : this.__anims, add : this.__add, x : this.__playerSpawnPoint.x, 
			y : this.__playerSpawnPoint.y, 
		});

		// Collide the player against the ground layer - here we are grabbing the sprite property from
		// the player ( since the Player class is not a Phaser.Sprite )

		this.__groundLayer.setCollisionByExclusion ( -1, true );

		// Add Physics Collision between the `player` 
		// & the `groundLayer`

		this.__physics.world.addCollider ( this.hero.sprite, this.__groundLayer );

		// Setup Entity

		this.__entity = this.hero.sprite;

		// Make the `camera` follow the `entity`
		// Set the `camera` Zoom Level
		// Set the `camera` Viewport

		this.__camera.startFollow ( this.__entity, true, 1, 1 );
		this.__camera.setZoom ( 1, 1 );

		this.__camera.setViewport (
			0, 0, window.innerWidth, window.innerHeight
		);

		// Get World Bounds X
		// Get World Bounds Y
		// Get World Bounds Width
		// Get World Bounds Height

		this.tileWidth = ( 66 );
		this.tileHeight = ( 66 );

		this.__boundsX = ( this.__tileWidth );
		this.__boundsY = ( 0 );
		this.__boundsWidth = ( this.__map.widthInPixels - ( 2.0 * this.__tileWidth ) );
		this.__boundsHeight = ( this.__map.heightInPixels - ( 2.0 * this.__tileHeight ) );

		// Set the `camera` to stay within the Game bounds

		this.__camera.setBounds (
			this.__boundsX, this.__boundsY, this.__boundsWidth, 
			this.__boundsHeight
		);

		// Set the `physics` to stay within the Game bounds

		this.__physics.world.setBounds (
			this.__boundsX, this.__boundsY, this.__boundsWidth, 
			this.__boundsHeight, true, true, 
			true, false
		);

		console.timeEnd ( 'setup' );

	}

	preload ( ) {

		var progress = this.add.graphics ( );

		this.load.on ( 'progress', function ( value ) {
			progress.clear ( );
			progress.fillStyle ( 0xffffff, 1 );
			progress.fillRect ( 0, 270, 800 * value, 60 );
		} );

		this.load.on ( 'complete', function ( ) {
			progress.destroy ( );
		} );

		this.__LoadAllAssets ( );

	}

	input ( ) {

	}

	create ( ) {

		// Setup Scene{s}

		this.SceneSetup ({
			scene : this, 
			camera : this.cameras.main, 
			make : this.make, 
			input : this.input, 
			physics : this.physics, 
			anims : this.anims,  
			add : this.add, 
		});

		this.__level = new LevelManager ({
			scene : this, 
			camera : this.cameras.main, 
			entity : this.hero, 
			map : this.__map, 
		});

		this.__level.nextLevel ( this, 'lvl-1' );

	}

	update ( ) {

		stats.update ( );

	}

}

This is where I attempt to have a player / all level assets already loaded from preloading-scene.js :

'lvl-1.js' :

/**
  * A class that extends Phaser.Scene & wraps up 
  * the core logic for the level
  */

class Level1 extends Phaser.Scene {

	constructor ( ) {
		super ({ 
			key : 'lvl-1', 
		});
	}

	preload ( ) {
	}

	init ( ) {

		// Set whether or not the Player is dead { Default :: false }
		// Set whether or not the Player fell into a hole { Default :: false }
		// Set whether or not the Player has overlapped the Goal

		this.__isPlayerDead = false;
		this.__playerFallsInHole = false;
		this.__hasOverlapped = false;

	}

	create ( __objData ) {

		this.__objData = __objData;
		console.log ( this.__objData );

		// ALTERNATE METHOD
		// this.__data = this.scene.systems.settings.data [ 0 ];

		this.__scene = this.__objData [ 0 ];
		this.__camera = this.__objData [ 1 ];
		this.__entity = this.__objData [ 2 ];
		this.__map = this.__objData [ 3 ];
		this.__tiles = this.__objData [ 4 ];

	}

	update ( ) {

		stats.update ( );

	}

}

Any help is greatly appreciated!

6

someone can help me?

7

hello?..

8

Assets, textures, and animations are global but game objects (sprites, tilemap layers, etc.) belong to exactly one scene. Game objects need to be created/added in each scene you want to use them in. If you shutdown a scene then its game objects are cleared.

If you want to use a Player instance in multiple scenes then you probably need to create a new sprite and reset its scene references (scene, input, physics) each time.

Try phaser-plugin-scene-watcher for scene help.