Phaser Error On First Load Of Game Undefined Variables

When I run my game in Google Chrome and Firefox, the game screen is black, once I refresh it, it runs as it should. The error I see in the console when the screen is black is: Typ

Solution 1:

The update function will start firing as soon as create completes, but in your case the paddle doesn't exist by that point, so errors will start being thrown. I would suggest you break your game down into States, a 'Boot' state could load your json + preloader assets, and then you can swap to a 'Preloader' state which pulls in all the assets you need (as read from the json). Upon completion you can move to a Game state or similar. It would help keep things cleaner (logically) for you as well.

Solution 2:

Agreed with the previous answer - you should look into breaking down your game into states. What happens when you create the game with var game = new Phaser.Game(800, 560, Phaser.AUTO, 'phaser-canvas', { preload: preload, create: create, update: update });

You are inserting an object that runs the 'preload', 'create', and 'update' functions. Your function processPaddle() is outside of that object as you are setting the functions in that object to be equal to the functions of the same name in the code below.

If you had your code set up in State objects, you'd be able to include processPaddle() and refer to with a this.processPaddle().

You could probably correct it as is by changing { preload: preload, create: create, update: update } to { preload: preload, create: create, update: update, processPaddle: processPaddle } in your first line.