Search code examples
javascripthtmlphaser-frameworkadobe-brackets

Javascript (with Phaser) error showing colour of game -Brackets


I am having problems in JS (and HTML) using Phaser to change a game's background colour. I'm using brackets version 1.3 and using the Live Preview feature to see my code (using Chrome). I have not had this problem before, although I have not used Phaser in brackets since upgrading to Windows 10. Also, I have just noticed that my URL in the preview has changed from being the file destination- e.g. "C:\Users\Daniel\Desktop\HTML5 Games(Phaser)\Simple Jump Game\index.html" - to a strange IP-style URL (But it is not my IPV4, IPV6 or Default Gateway). It shows - "http://127.0.0.1:55312/index.html". I am following a textbook (Although making a different game to it- I haven't used Phaser for a while so using it to remind me!) And have copied and pasted from the textbook into my files and I'm still getting an error. These are my files:

<!DOCTYPE html>
<html>

  <head>

    <title>Simple Jump game</title>
    <meta charset="utf-8"/>

    <!--Script files-->
    <script type="text/javascript" src="JS/phaser.min.js"></script>
    <script type="text/javascript" src="JS/main.js"></script>

  </head>

  <body>
     <div id="gameDiv"></div>
 </body>
 </html>

And my JS:

 //The main state of our game
var mainState = { 

    preload: function() { //A function which loads everything (e.g assets),       before the game starts


    },

    create: function() { //A function which physicly adds everything into     our game(e.g sprites)
         game.stage.backgroundColor = '#84B6F7'

         game.physics.startSystem(Phaser.Physics.ARCADE);
    },

    update: function() { //A function which is called 60 times per second and holds all of the game's logic.


    },

};


//Create a new game, using our 'gameDiv' and store it in 'game'
var game = new Phaser.Game(500, 340, Phaser.AUTO, 'gameDiv');


//Add the mainState to our game (as 'main') and start it.
game.add.state('main', mainState);
game.state.start('main');

BTW I included my code not the code from the textbook (Although they should be the same). The textbook is 'Discover Phaser' by Thomas Palef

EDIT: The background colour holds the textbooks colour, the comment next to it has my background colour in. I used the textbook's colour to make sure there isn't an issue with my colour- there isn't.


Solution

  • Fixed! Silly mistake.

    I did:

    game.add.state('main', mainState);
    

    instead of:

    game.state.add('main', mainState);
    

    Thanks for everyone's time!