Jump to content

Update functions


Recommended Posts

Hello all,


I've been tooling around with phaser 1.0 JS, and looking through all examples, I see nothing that shows a good way to have an "update" function for all of my Sprites (similar to how Flixel worked). Right now I have been adding every sprite to a group, and adding a "for each" function that calls a method on each of those sprites.


This seems like a hack though, is there a better way?

Link to comment
Share on other sites

Sure thing, I was a bit rushed with that post...


For instance, in Flixel I could create a class that extended FlxSprite, and then write a method in it like this:

override public function update() {        super.update();       //runs once per tick}

I tried for a long time to create a class that had Phaser.Sprite as its prototype, but quickly found that to be too much of a pain. But I still want my individual game objects to have their own unique update functions. My solution, thus far, has been this:


Inside of player.js:

//function to make the playerfunction makePlayer() {    var p = game.add.sprite(game.stage.width * .5 - 50, 200, "entities");        p.body.drag.x = 20;    p.anchor.setTo(0.5, 0.5);    p.animations.add('idle', [1]);    p.animations.add('walk', [ 4, 5, 6, 7, 8, 9, 10 ], 10, true, false);    p.updat = playerUpdate;        group.add(p);        return p;}//player's update functionfunction playerUpdate() { // console.log(this);    if(  game.input.keyboard.isDown(Phaser.Keyboard.RIGHT) ) {        this.body.velocity.x = 50;        this.scale.x = 1;        this.animations.play("walk");    } else if ( game.input.keyboard.isDown(Phaser.Keyboard.LEFT) ) {        this.scale.x = -1;        this.body.velocity.x = -50;    }}

Inside of main.js (these are the create and update functions for Phaser...):

 function create(){        //make the player, add to group        group = game.add.group();        makePlayer();   }        function update(){         //use that group to run a method on each sprite added         group.forEach(updateEntities);    }function updateEntities(ent) {       //run the "update" function (noticed sprites had an update function, named it different just to be safe)        ent.updat();    }

Hopefully this helps! 1. Create group 2. Add everything to it 3. Use that group to call an method every tick.

Link to comment
Share on other sites

Ok grab the latest build and then the following will work:

//  Here is a custom game objectMonsterBunny = function (game, x, y) {    Phaser.Sprite.call(this, game, x, y, 'bunny');};MonsterBunny.prototype = Phaser.Utils.extend(true, Phaser.Sprite.prototype, PIXI.Sprite.prototype);MonsterBunny.prototype.constructor = MonsterBunny;/** * Automatically called by World.update */MonsterBunny.prototype.update = function() {    this.angle++;};(function () {    var game = new Phaser.Game(800, 600, Phaser.AUTO, '', { preload: preload, create: create });    function preload() {        game.load.image('bunny', 'assets/sprites/bunny.png');    }    function create() {        var wabbit = new MonsterBunny(game, 400, 300);        wabbit.lifespan = 3000;        wabbit.anchor.setTo(0.5, 0.5);        game.add.existing(wabbit);    }})();
Link to comment
Share on other sites

Perhaps I spoke too soon... not a huge issue for what I am hacking on right now, but trying to use this new set of files with the line:

        game.load.atlasJSONHash('entities', 'assets/textures/entities.png', 'assets/textures/entities.txt');

Appears to cause some issues... perhaps I just need to sleep on it though.

Link to comment
Share on other sites

Its inside your example:

game.load.atlasJSONHash('entities', 'assets/textures/entities.png', 'assets/textures/entities.txt'); //I tried this lin        //game.load.image('bunny', 'assets/textures/entities.png'); //this was your line

I get this error when I try it:


  1. Uncaught TypeError: Cannot call method 'loadFrameData' of undefined Sprite.js:45

Was having some problems with the animationFrames as well, earlier. Still, I'm on the bleeding edge. Don't want to distract you or anything.

Link to comment
Share on other sites

Here to cause trouble again, though I think I have a fix. The sample code will have all sprites rotating around, not just monster bunny.


Something weird seems to be happening with the extend feature, where the prototype's update is not unique to the extended entitity. I think I have a fix for it though: move the update function into the constructor.

MonsterBunny = function (game, x, y) {    Phaser.Sprite.call(this, game, x, y, 'bunny');    this.body.acceleration.y = 250;       this.update = function() {        this.angle++; //now only monster bunny rotates, and normal sprites/images do no    }    };

Still, I am no javascript master. Perhaps there's a better way.

Link to comment
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.

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.


  • Recently Browsing   0 members

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