npilla

In-game Timer

Recommended Posts

Yes, just a visible timer in the upper-left corner that counts up or down while the game is running and then stops when the enemy group has been completely killed. The idea is that whoever kills the alien group the fastest wins (super basic). I'm using the shoot to pointer example to have a ship in the middle spin and kill aliens that are randomly drawn to the screen.

 

Eventually I'd like to have the aliens converge on the center and kill the ship on first collision (work in progress).

 

Thank you for the help!!!

Share this post


Link to post
Share on other sites

 This is a basic timer that displays the time since the game started.  You could modify it to suit your needs.  

var game = new Phaser.Game(800, 600, Phaser.AUTO, { preload: preload, create: create, update: update });function preload() {    game.load.bitmapFont('desyrel', '/assets/fonts/desyrel.png', '/assets/fonts/desyrel.xml');}var textStyle = { font: '64px Desyrel', align: 'center'};var timer;var milliseconds = 0;var seconds = 0;var minutes = 0;function create() {    timer = game.add.bitmapText(250, 250, '00:00:00', textStyle);}function update() {    //Calling a different function to update the timer just cleans up the update loop if you have other code.    updateTimer();}function updateTimer() {    minutes = Math.floor(game.time.time / 60000) % 60;    seconds = Math.floor(game.time.time / 1000) % 60;    milliseconds = Math.floor(game.time.time) % 100;    //If any of the digits becomes a single digit number, pad it with a zero    if (milliseconds < 10)        milliseconds = '0' + milliseconds;    if (seconds < 10)        seconds = '0' + seconds;    if (minutes < 10)        minutes = '0' + minutes;    timer.setText(minutes + ':'+ seconds + ':' + milliseconds);}

Share this post


Link to post
Share on other sites

For a timer that stops when all the sprites in a group are killed, try this:

function update() {    if (yourGroup.countLiving() > 0)        updateTimer();}

Now when everything in yourGroup is killed, the timer won't be updated any more.  Note that the timer's current minute/second/millisecond variables are globally accessible and will contain the time at last update.  

 

 

Does that all make sense?  If you have any questions about any of what I've written let me know.   

Share this post


Link to post
Share on other sites

Thanks for taking the time to reply zeterian this makes sense and is a great timer, so do we need to write our own timers for phaser? I was hoping to be able to pause the timer and also use it as a countdown, e.g. to call a function when the timer reaches 0 (to end the game if all objects have not been destroyed). Looking at the documentation i can see a class called Timer and a class called Time, i was hoping there were ready made timers we could use. There are no examples for these in use in the documentation (i can see you use game.time.time in your example), i have seen this in one of the phaser examples too but its not quite what i was looking for.

 

I was hoping there would jbe a way to just add a timer from the phaser framework, start it (and pause it when needed e.g. if the player collects an extra time power up) and then call a function when the timer is complete, rather than write my own timer function.

Share this post


Link to post
Share on other sites

There is indeed a built-in Timer, but it's not fully fledged yet so for now it might be better to use the above approach. However if you want to test it, this is how you use it:

timer = new Phaser.Timer(game);timer.add(delayInSeconds, parameter1, parameter2, ...);// Add as many events as you like here, they are popped off the stack once the time is hittimer.onEvent.add(doSomething, this);timer.start();function doSomething(parameter1, parameter2, ...){ }

You can display the time with Timer.seconds

 

It doesn't (yet) respect the game paused state, but soon will do.

Share this post


Link to post
Share on other sites

Hi, I tried to use built-in Timer but maybe i missed something, because event never triggered.

        this.timer = new Phaser.Timer(this.game);        this.timer.add(3);        this.timer.onEvent.add(this.nextMove, this);        this.timer.start(); 
    nextMove: function() {        console.log("event")        this.moveToCoords(250, 250)    },

Share this post


Link to post
Share on other sites

Are you using the dev branch?

 

You should check to see if your timer is being updated, I suspect that it is not.

I once made a timer in the same way you are, and it never updated because it was not in the games array or timers to update.

I ended up creating my timer like this:

    this.timer = this.game.time.create(this.game);    this.timer.add(this.delay, this.readyForAction, this);    this.timer.start();

Share this post


Link to post
Share on other sites

i use phaser 1.1.3 (bower version).

 

when i print seconds like this :

this.game.debug.renderText('timer:' + this.timer.seconds(), 32, 70, 'rgb(0,0,0)');

timer updates.

Your solution dont work for me: <Object> has no method 'create'.

Share this post


Link to post
Share on other sites

It won't be the dev version for much longer, so it would be a good idea to get onto it now.

There are many changes from 1.1.3 to 1.1.4, you will need to make sure everything you have doesn't break when you update.

Share this post


Link to post
Share on other sites

First time on this site, and based on this post, signed up right away. Good stuff...just what I needed as I am leaping from the world of ASP.Net web forms  into MVC, HTML, CSS and Javascript. My prohect needed a timer...and this post and related ones saved me a ton of reinventing the wheel (even if I could).

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now


  • Recently Browsing   0 members

    No registered users viewing this page.