Jump to content

Question on Phaser States


Recommended Posts

So ive been looking at the way states work and I'm still a bit worse for wear. I'm looking at the example in the source files of phaser for state. 

It has the index, preloader, mainmenu, game and js.php file within. So my question is this:


In that index we decalre the js files as standard. Now i get the concept but not the coding. I've been coding happily in one js file for my game with the update, create etc etc. What i'm wanting to do is add main menu, options and end game states. Possibly even go as far as levels etc. 

What  would like mainly is to get an idea on these states but with the style of coding i'm currently doing.

Link to comment
Share on other sites

I understand these concepts, what I'm trying to achieve is a way to incorporate this into my game. I looked at both them posts and found more in common with looking at the basic template. I've been messing around but what is catching me out is the top bit per each file where it says BasicGame.Game = (game) etc etc. Now I have tried to get a link and an adding state with mainmenu but getting an error because its not referenced. I have it set as MainGame.MainMenu but MainGame not referenced or something.

Link to comment
Share on other sites

I think, to be very accurate, the order of execution really matters, more than the <script> tag declaration order.

As you can't plan how the web server will transfer the requested files in the real world, you can't just rely on the <script src="..."> order


example :

<script src="boot.js></script><script src="mainMenu"></script>

although boot.js is first asked for, its download could be finished after mainMenu.js one's for many reasons (server delay, bad connexion, file sizes, etc) as the browser emit many parallel http requests

Javascript files are executed only milliseconds after being downloaded.

But remember the js vm is mono-threaded, so scripts are executed sequencially after their download : first downloaded, first executed


So you can either concatenate all your js files into one (grunt is your friend), respecting thus their right order, either add some listeners to the DOM to ensure a specific file is already downloaded before another one


but on a local web server, the <script> tag order will be probably be enough as recommended  by Rich


Whatever the method, you just have to consider that an object must exist before accessing it.

Link to comment
Share on other sites

Yeah sorry Rich, I posted a huge wall of code to be decyphered and it was basically just copying and pasting the files of basic template but with my extras in. The issue I had was because of 2 issues which when I did the reading was able to repair on my own:

1) Case sensitive and name change because the game.js was spelt game and not Game and was making life difficult for me.

2) Changing the preload files from game.load.image to this.load.image. Was a weird move because ofcourse I've spent most of my phaser career in one js file and never had to modify the way I add or create. This has been fixed and works perfectly.

3) The index was totally foreign. I basically copy and pasted the index from basic template. Works and that's all I need to know. The order will be an issue but at a later date after more testing and adding more states.

So for a descriptive answer on this. Use basic template as a starting point, read all errors in console to fix issues. One of my main problems was no definition because of missing functions etc. These are easily fixable if reading debug which I did. I was pretty close to posting a lot about states but seems overlooking a few bits of code is also a speciality of mine lol.

So thanks for the replies and fixes, I've now got it working as it should after a few head scratchers haha. Thank you :)

Link to comment
Share on other sites


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...