Cannot update the game

Phaser 3
1

There is no change in the game even if I make some changes in the game.

I mean, if i changed my text or sprite position to 300,300 from 100,300 there is no change in the game even if I reload it?

What is actually happening?

2

Code please?

3

This is the index.html code,

<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="phaser.min.js"></script>
</head>
<body>
	<script type="text/javascript" src="startScene.js"></script>
    <script type="text/javascript" src="gameScene.js"></script>
    <script type="text/javascript" src="game.js"></script>

</body>
</html>

Then this is game.js code,

const gamestate ={Score: 0,};
const config = {
type: Phaser.AUTO,
height: 650,
width: 650,
autoCenter:true,
backgroundColor: "000000",//2F4F4F
physics: {
    default: 'arcade',
    arcade:{
        gravity: {y: 200},
        enableBody:true,
    }
},
scene: [startScene,gameScene]
}
const game = new Phaser.Game(config);

This is startScene.js code,

class startScene extends Phaser.Scene{
	constructor(){
		super({key: 'startScene'})
	}
	create(){
		this.add.text(300,300,'Click to Play');
		this.input.on('pointerdown',function(){
			this.scene.stop('startScene')
			this.scene.start('gameScene')
		});
	}
}

This is gameScene.js code,

class gameScene extends Phaser.Scene{
	constructor(){
		super({key: 'gameScene'})
	}
..........

What is the problem?

4

Did it ever work? Does the console show errors?

1 Like
5

Yeah, the console says this.scene.stop is not a function.

Before making separate scenes, the main game actually worked but ever since I created scenes it is not working. Scenes are not changing and if I change something in code, nothing changes when I reload the game.

Actually, console says all these:

startScene.js:8 Uncaught TypeError: this.scene.stop is not a function
at initialize. (startScene.js:8)
at initialize.h.emit (phaser.min.js:1)
at initialize.processDownEvents (phaser.min.js:1)
at initialize.update (phaser.min.js:1)
at initialize.updateInputPlugins (phaser.min.js:1)
at initialize.onTouchStart (phaser.min.js:1)
at HTMLCanvasElement.onTouchStart (phaser.min.js:1)

6

You need to fix this first.

https://github.com/samme/phaser3-faq/wiki#how-do-i-use-this-in-a-scene

1 Like
7

Exactly as @samme said. I would recommend the last point on the list linked by samme and use an arrow function in place of your actual function.

 this.input.on('pointerdown', ()=>{
     this.scene.stop('startScene')
     this.scene.start('gameScene')
    });
1 Like
8

After I used the arrow function, the scene changes to gameScene but platforms, obstacles etc are not visible.

9

Is it actually changing to the gameScene? Ensure its added to the game config and delete the stop scene line. The scene will be shutdown automatically when you call start for another scene.

10

yeah its changing to the game scene but physics do not work and only one sprite is visible. No enemies are visible.

11

Can you show the code?

12

Yeah, its shown above

13

For the game scene

14

Hi

I would try changing this function to an arrow function…

this.input.on('pointerdown',() => {
			this.scene.stop('startScene')
			this.scene.start('gameScene')
		});

or a binding to “this”

this.input.on('pointerdown',function(){
			this.scene.stop('startScene')
			this.scene.start('gameScene')
		}, this);
15

Try clearing your browser cache, I remember when I first started I had that same problem, until I learned more about node and eventually use nodemon for auto restart of the server. It drove me crazy because I kept changing code, yet nothing happened.