How to display the timer with commas/dots?

[Martiny]

If I write game.time.events.add(Phaser.Timer.SECOND * 60, myFunction, this); and then display its duration in a text, it will display "60000", and then "59999" and so on. I'm having a hard time trying to display it like "60,0", "59,9", "59,8" and so on.

 

The closest thing I got was writing .toLocaleString() at the end of it, like: timerText.setText("Time left: " + game.time.events.duration.toLocaleString()); Then it displays: "60.000", "59.999", "59.998". 

 

I just couldn't figure a way to cut out those last two numbers! 

 

What would be the best way to handle this?

 

Edit: I guess this is the wrong forum, because it's not really phaser-related. Sorry.

[Heppell08]

I think this should work:

game.time.events.add(Math.floor(Phaser.Timer.SECOND) * 60), myFunction, this);

Math.floor rounds down so I'm assuming that should work. Give it a go and see anyway

[Martiny]

I think this should work:

game.time.events.add(Math.floor(Phaser.Timer.SECOND) * 60), myFunction, this);

Math.floor rounds down so I'm assuming that should work. Give it a go and see anyway

 

Thanks for the asnwer.

 

Using Math.floor helps if I put it like Math.floor(game.time.events.duration.toLocaleString())

 

Now it displays like: "60", "59", "58"... without the decimals.

 

I'm taking a look in RegExp (confusing!), maybe that will be cleaner than using floor + toLocaleString. But for now, I'll use floor, thanks!

[Heppell08]

Ok here's 2 decimal places in math.

Math.round(game.time.events.duration.toLocaleString()) * 100) / 100;

[Heppell08]

Math.round(game.time.events.duration.toLocaleString() * 100) / 100;

Put an extra useless bracket in... This is the working one lol

[Martiny]

Thanks for your time again!

 

That works (sort of). 

 

I tried to make a gif so you could see, but it didn't work. So I'll describe. It goes like this:

 

1.3

1.2

1.1

1           (it doesn't show the 1.0  I was hoping ): )

999

998

997

...

 

From 1 to below things start to break. But I'm pretty sure it is the toLocaleString() that is causing. I don't really know how it works properly so I'm just making my code a mess. So I'm back to square one, I guess.

 

I'll have to find another way to format the time.events.duration. I'll try some other stuff, thanks!

[Heppell08]

var timing = game.time.events.duration.toLocaleString();

timing = timing.toFixed(2);

That will always show to the second decimal.

[Heppell08]

And to prevent breaking from below 1 you'll need to recognise it below 1 and either recognise and reset or have some kind of callback.

[Martiny]

Well, what you said worked, but then I couldn't fix the problem that occurred when timing < 1

 

Then I tried something and it worked perfectly. Way simpler than putting toLocaleString()

 

It's this: 

 

var timing = game.time.events.duration / 1000

timing.toFixed(1);

 

Now it works fine! Instead of putting a comma in 60000, I actually transformed 60000 into 60, so when timing < 1 it would actually be less than 1, and not 999.

 

Thanks for helping me.

[Heppell08]

When you go below the 1 there is not fixedTo to go to. Create a callback in update:

if(timing < 2) { // reset or something in here }

It really depends on what you are timing and if there is any reason to go below one.

But nonetheless, atleast its answered and working.

[Heppell08]

You also asked specifically for 2 decimal places then changed it to no decimal places. Is there a specific reason for that because simple Math.round or Math.ceil would have sufficed without fixing to the 2nd decimal...

[Martiny]

I'm using a timer to show the players how much time they have left. And toFixed(1) gives me one value after the comma (actually dot, in this case), as I asked in the main post. Anyway, I had to change my code because toLocaleString() wasn't changing the value itself, only the display of it. So when it was shown 1 it was actually 1.000, and that's why it would go 999..998..997 after. 

 

At least that what I understood, maybe I'm incorrect.

 

So I decided to really change the value I was getting by dividing it by 1000, so it would not only look like the number I wanted, but also value the number I wanted.

 

For instance:

 

In some point the duration will be 57895, and if I divide by 1000 and then do toFixed(1):

timing = 57895 / 1000;

timing.toFixed(1);

 

It will return: 57.9

 

57.9 seconds!

 

That's the number I wanted. 

 

Thanks for the help.

[Heppell08]

Yeah Math.floor would have done the job then. Regarding the < 1 issue, that needs to be resolved in update to either reset the time or reset the value or call a kill or state change etc.

Good luck!