rungo73

How does game structure differ from Flixel AS3?

Recommended Posts

When using Flixel I would have a gamestate, a player, enemy, perhaps coins etc as separate classes. Maybe a registry that stored assets etc.

 

I had been tooling around with ImpactJS and that framework uses a similar  structure.

 

How do I implement a structure like this with a Phaser game? 

 

I only want the the index.html  to  set the css etc and load the game.

Share this post


Link to post
Share on other sites

@Rich I'm trying to follow the example on wip/example/state but I keep getting the error:

 

  1. Uncaught TypeError: Type error phaser.js:2969
    1. PIXI.CanvasRenderer.renderDisplayObjectphaser.js:2969
    2. PIXI.CanvasRenderer.renderphaser.js:2885
    3. Phaser.Game.updatephaser.js:10334
    4. Phaser.RequestAnimationFrame.updateRAFphaser.js:16157
    5. _onLoop
 
 
I have just a simple state:
var SoccerGame = {};SoccerGame.MenuScreen = function (game) {    this.game = game;};SoccerGame.MenuScreen.prototype = {    preload: function ()     {        this.game.load.image('bet', 'assets/bet_50x20.png');        //this.game.load.image('nocooper', '../assets/pics/1984-nocooper-space.png');        //this.game.load.image('touhou', '../assets/pics/aya_touhou_teng_soldier.png');        //this.game.load.image('cougar', '../assets/pics/cougar_ihsf.png');        //this.game.load.spritesheet('button', '../assets/buttons/button_sprite_sheet.png', 193, 71);    },    create: function ()     {         this.ball = this.game.add.sprite(10, 10, 'ball');        console.log('Preloade finished, lets go to the main menu automatically');       // this.game.state.start('GameScreen');    }}

Any ideas? 

 

I changed from Phaser.CANVAS to Phaser.AUTO and it worked... Funny cause when I had everything directly on the index.html I didn't have any problem with Phaser.Canvas. Btw I'm having all this on Chrome. 

Edited by isfuturebright

Share this post


Link to post
Share on other sites

I've just uploaded a Basic Project Template for Phaser. It shows how to use Boot, Preloader, MainMenu and Game states and swap between them, all fully commented.

 

It's in the dev branch of Phaser: https://github.com/photonstorm/phaser/tree/dev

 

(in resources/Project Templates)

 

But you can grab the files now and use them.

 

Also make sure you upgrade to 1.1.1 master.

Share this post


Link to post
Share on other sites

Thanks @rich! I was checking it out and came across this:

BasicGame.Preloader = function (game) {	this.background = null;	this.preloadBar = null;	this.ready = false;};

I saw you pass a reference to "game" in all states and then reference as this.game. I was just wondering if it's necessary to do since the "game" variable is global, right? Also you're never doing this.game = game, how come this.game works later on the state functions?

Share this post


Link to post
Share on other sites

Thanks @rich! I was checking it out and came across this:

BasicGame.Preloader = function (game) {	this.background = null;	this.preloadBar = null;	this.ready = false;};

I saw you pass a reference to "game" in all states and then reference as this.game. I was just wondering if it's necessary to do since the "game" variable is global, right? Also you're never doing this.game = game, how come this.game works later on the state functions?

 

The game variable isn't global (it's local to an anonymous function) which is why I do it, however you could make it global and not need to do this yes.

 

States have a variable called 'game' set in them automatically, which is why it works later on without declaring it in the constructor. I guess I just put it there to remind you that that is what's actually being passed in.

Share this post


Link to post
Share on other sites

 

I am getting the following error:

Uncaught TypeError: Cannot call method 'image' of undefined

In this line:

BasicGame.Boot.prototype = {	preload: function () {		this.load.image('preloaderBackground', 'images/preloader_background.jpg');

My bad, I was using an old version of Phaser  :P Working fine now.

Share this post


Link to post
Share on other sites

For that I would just use the global object, i.e.: 

BasicGame = {  startParam: 0}

Then in your MainMenu just set BasicGame.startParam = x, and in your Game state you can check the value of it. You can use it like a global storage area. I use it for things like persisting a  games score, level reached, have they seen the tutorial, that kind of thing.

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

  • Recently Browsing   0 members

    No registered users viewing this page.