display time in seconds . milliseconds to the 3rd decimal

[crffty]

I would like a timer to display in the top right of the game window. the time to be counting up in seconds . milliseconds to the 3rd decimal (   00.000 ).  i've found lots of examples to show an event on timer but not to just keep track of the game time and display. I'm assuming I need something in the update function to keep the time updating but not sure what. 

vaultage.game = function() {};

vaultage.game.prototype = {
  
create : function() {

    // timer
    this.timer = game.time.create();
    this.game.add.text(20, 700, this.timer,{ font: "10px Raleway"} );
    this.timer.start();
  },

  update : function() {
  },

  shutdown : function() {
  },
}

 

[stupot]

you'll need to keep a reference to your text and then in your update function you'll need to update it with setText()

you might find that to update the displayed value every frame draw is costly in terms of performance as the canvas has to render the font to a new texture each time, a bitmap font will most likely be quicker here, or even only update every 'n' frames.

[crffty]

I'm still not having any luck. I'm now using a bitmap font though... so thats good. I've tried so many variation but can't get a simple second counter to start at the beggining of the game state and to stop if the player collides with an 'obstacle'. 

so to start with I just need a second counter and then i'll work on stoping it on a collision. The bones of what I'm trying is below 

*edit. I have a separate preload  

 

vaultage.game = function() {};

  this.time = 0;

vaultage.game.prototype = {
  create : function() {
  
    // score text
    this.score = this.game.add.bitmapText(750, 10, 'courier', "0", 20);
   
  },
  update : function() {

    // time every 1000ms time ++

    // update the text 
    this.score.setText(this.time);

  },

  shutdown : function() {
  }

 

[crffty]

vaultage.game = function() {};


vaultage.game.prototype = {
  create : function() {


    // score text
    this.score = this.game.add.bitmapText(700, 10, 'courier', this.game.time.totalElapsedSeconds(), 20);
    this.startingTime = new Date();



  },
  update : function() {


    var thisTime = new Date();             
    var diff = (thisTime.getTime() - this.startingTime.getTime())/1000*60;   
    this.score.text = diff;


  },

  shutdown : function() {
  }

}

 

[samme]

this.timer = this.time.create();
this.timer.start();
        
this.timerText = this.add.text(0, 0, "");

// …

this.timerText.text = this.timer.seconds.toFixed(1);