Be my fan on FacebookFlash simple timer/countdown
Sometimes you need a timer or a countdown... for a page, in a game or whatsoever.
So I am going to show you how to create a timer or a countdown. Or both.
And, in next tutorials, how to use it in the games we are creating, of course...
Look at this movie:
On the left we have a timer, on the right a countdown.
Let's see how to do it.
First, I created two dynamic text items, the one on the left instanced as count and the one on the right instanced as count_down.
Then, in the first frame there is this simple actionscript:
-
start_time = getTimer();
-
countdown = 7200000;
-
onEnterFrame = function () {
-
elapsed_time = getTimer()-start_time;
-
_root.count.text = time_to_string(elapsed_time);
-
_root.count_down.text = time_to_string(_root.countdown-elapsed_time);
-
};
-
function time_to_string(time_to_convert) {
-
elapsed_hours = Math.floor(time_to_convert/3600000);
-
remaining = time_to_convert-(elapsed_hours*3600000);
-
elapsed_minutes = Math.floor(remaining/60000);
-
remaining = remaining-(elapsed_minutes*60000);
-
elapsed_seconds = Math.floor(remaining/1000);
-
remaining = remaining-(elapsed_seconds*1000);
-
elapsed_fs = Math.floor(remaining/10);
-
if (elapsed_hours<10) {
-
hours = "0"+elapsed_hours.toString();
-
} else {
-
hours = elapsed_hours.toString();
-
}
-
if (elapsed_minutes<10) {
-
minutes = "0"+elapsed_minutes.toString();
-
} else {
-
minutes = elapsed_minutes.toString();
-
}
-
if (elapsed_seconds<10) {
-
seconds = "0"+elapsed_seconds.toString();
-
} else {
-
seconds = elapsed_seconds.toString();
-
}
-
if (elapsed_fs<10) {
-
hundredths = "0"+elapsed_fs.toString();
-
} else {
-
hundredths = elapsed_fs.toString();
-
}
-
return hours+":"+minutes+":"+seconds+":"+hundredths;
-
}
Line 1: Initialize the variable start_time with the current time value
Line 2: Initialize the variable countdown with the amount of milliseconds I want to start the countdown. In this case, since an hour has 3600 seconds or 3600000 milliseconds, the countdown will start from 2 hours
Line 3: Function to be executed at every frame
Line 4: Calculate the difference between the actual time and the start_time value. This is actually the elapsed time.
Lines 5-6: count and count_down text values are updated with the result of a the function time_to_string (a function I created). count will be the elapsed time, while count_down will be the difference from the countdown variable and the elapsed time. Please note that every time explained here is intended to be in milliseconds.
Let's examine the main function:
Line 9: Calculate elapsed hours dividing the time to convert (function's argument) by 3600000, the number of milliseconds in an hour
Line 10: Calculate remaining time without the elapsed hours
Lines 11-12: Some thing with the minutes, dividing the remaining time by 60000, the number of milliseconds in a minute
In the same way I calculate the seconds and the 1/100 of seconds. Lines from 16 to 35 just format the string showing the time.
This is a very simple function we will use in the games we are going to create, such as "line rider".
Download the source code and give me feedback.
(14 votes, average: 4.64 out of 5)
Loading ...They can be easily customized to meet the unique requirements of your project.
72 Responses to “Flash simple timer/countdown”
Leave a Reply
Trackbacks
-
Flash game creation tutorial - part 5.3 at Emanuele Feronato on
March 14th, 2007 12:51 pm
[...] If you plan to make a racing game, the timer is very important. Some of the topics covered in this example are taken from the Flash simple timer/countdown tutorial. [...]
-
Understanding AS3 Timer Class : Emanuele Feronato on
November 18th, 2008 6:46 pm
[...] lot of time ago I wrote about AS2 time management in Flash simple timer/countdown. Now it’s time to see how to manage time with [...]
Posts
- Rick Triqui: my first PlayCrafter game
- Prototype of a Flash game like Meeblings
- Games for the game developers!
- The art of debugging
- How to embed a text file in Flash
- Create a Flash game in minutes with PlayCrafter
- Upgrade your Flash CS4 to 10.0.2
- Play Mazeroll, my latest Box2D game
- Triqui MochiAds Arcade plugin for WordPress Released!!
- The MochiAds funnel
- Flash game creation tutorial - part 1
- Create a Lightbox effect only with CSS - no javascript needed
- Flash game creation tutorial - part 2
- Make a Flash game like Flash Element Tower Defense - Part 2
- Flash game creation tutorial - part 3
- Create a flash draw game like Line Rider or others - part 1
- Create a Flash Racing Game Tutorial
- Make a Flash game like Flash Element Tower Defense - Part 1
- Create a flash artillery game - step 1
- Create a flash draw game like Line Rider or others - part 5
- Flash game creation tutorial – part 5.2 (4.9 out of 5)
- Flash game creation tutorial – part 3 (4.86 out of 5)
- Creation of a platform game with Flash – step 2 (4.84 out of 5)
- Create a survival horror game in Flash tutorial – part 1 (4.82 out of 5)
- Create a flash artillery game – step 1 (4.82 out of 5)
- Create a Flash Racing Game Tutorial (4.8 out of 5)
- Create a flash artillery game – step 2 (4.75 out of 5)
- New tile based platform engine – part 6 – ladders (4.74 out of 5)
- Flash game creation tutorial – part 2 (4.73 out of 5)
- The experiment – one year later (4.7 out of 5)
Still using AS 1.0 ?
Great Timers, quite handy however i’ve tried to put the following code into and can’t get it to work.It just keeps on counting down. Can anyone help please?
if (_root.count_down
That should be –
if(_root.count_down
Cool, really easy and really fun >!
How do you goto another frame when the countdown reaches 0?
btw Have problems posting.
nice, i used it in one of my games
Hi. Im Making a linerider game. its basicly finished. ive made it so that you can draw a line, the ball bounces perfectly off it. but i still dont get something. when you’ve finished drawing:
onMouseUp = function () {
imdrawing = false;
};
that code doesnt want to work :S any tips
Richard
PS: this code is RIGHT at the end of the code. is that right or should it be elseware
Thanks for posting this. I used part of the code to fix my counter and it works perfect.
Nice work:)
Brisa
nice tutorial
That’s great!
Is there a simple way to make a start/stop & reset button for this?
im in the same situation as big bill.
how can you set a limit, so it terminated when it hits a certain time, i cant get it to work.
to those who were having problems with going to another frame after the timer hits zero, try adding this…
if (_root.countdown-elapsed_time
or instead of using “gotoAndPlay()”, maybe try using “gotoAndStop”.
seems to work better for me.
- tom
ive been puzzled about it going to another frame after zero too ive tried many different ways of doing it and none hav worked anyone got a solution please?
how do I get it to stop on O? I’ve tried everything I can think of but can’t get it working…
Is there an easy way to have the counter start at a certain time. Example: 06:44:33
6 hours, 44 minutes, 33 seconds
Thanks
if(hours == 0 && minutes == 0 && seconds == 0) {
delete this.onEnterFrame;
gotoAndPlay(2);
}
\\ stops the countdown at 0
\\goes to frame 2
setting line 2 to:
countdown = 24273000 ;
would start the countdown clock at 6 hours 44 minutes 33 seconds
hey i just wonder why the code that u give is different from the downloaded file. The code that u give is not working but then the downloaded file is working fine.
thanx 4 the codes. It’s useful. =)
have a nice day!
How could this be converted into a Two minute timer? Any help is much appreciated. Thank you in advance.
This is really great. I am a newbie and can’t customize the code for what I would like to accomplish: a simple seconds countdown from 10 to 0 seconds. The countdown should stop at 0. Any easy way to accomplsih this without a lot of code (head spinning);-)
Thanks!
i was wondering how you could get the color of the numbers to change color as you get closer to zero. Almost as if your time was running out.
Also i cant seem to get the timer to stop. Can anyone help me with this?
A simple solution to stop the ticker would be:
if (_root.count_down.text == “00:00″){
gotoAndStop(2);
}
And if you want the ticker to stop when reaching all zeros just put a static text containing zeros in frame 2.
Note: if (_root.count_down.text == “00:00″){
the zeros must be equal to what you want to display, my example is based on minutes and seconds showing in the count down.
Hope this will help…
so if i wanted to make a countdown that started @ 2 min would i clear out the elasped hours code and replace the 60000 seconds with 120 and the 6000 min with 2 min?…code is all new to me…sorry if this seems dumb…
Hi
Thanks it is working fine.
Regards
Sunil kumar
I’m having problems with script for stopping the countdown as well.
I’m using this script for a 2 digit timer with only seconds:
if (_root.count_down.text=”00″) {
gotoAndPlay(3);
}
With this code in place, my movie entirely skips the countdown, and instead immediately jumps to frame 3. Any advice?
you must place the code like this ……..
//The Code…..firs Frame….
function time_to_string(time_to_convert)
{
elapsed_hours = Math.floor(time_to_convert / 3600000);
remaining = time_to_convert – elapsed_hours * 3600000;
elapsed_minutes = Math.floor(remaining / 60000);
remaining = remaining – elapsed_minutes * 60000;
elapsed_seconds = Math.floor(remaining / 1000);
remaining = remaining – elapsed_seconds * 1000;
elapsedH = Math.floor(remaining / 10);
if (elapsed_hours
//in firs frame search for —>>on EnterFrame and replace the code with //this..
onEnterFrame = function ()
{
elapsed_time = getTimer() – start_time;
_root.count.text = time_to_string(elapsed_time);
_root.count_down.text = time_to_string(_root.countdown – elapsed_time);
if (_root.count_down.text == “00:00:00:00″) {
play();
};
};
stop();
i’m not much with codes. i can’t stop the ticker, i already tried all the suggestions here. perhaps the counter author might figure out a way to make the ticker stop at zero and jump to next scene.
somehow, this code doesn’t work, doesn’t stop the ticker and doesn’t make the flash jump into a new scene. what seems to be the problem here sir?
if (_root.count_down.text==”00:00″) {
gotoAndStop(”start”, 1);
}
thanks for this counter. I will put in a website that i have in mind
I want the timer to count down from example 16 min 41 sec, I don´t get how to do it?? Someone know how to do it?
I got it.
Hi!
Im using this timer for a game, so the point of the game is to move your cursor through a labyrinth without touching the walls and I want to have a timer on this to see how fast people can do that, but then I need to stop it and view their final time (its in another frame) how do I do that, and if possible I would like to restart that timer again when I get to the next level and again when they finish it view they final overall time. I could work like the once on your Race game (round times and a overall time.
please guys, i want to stop timer from reading or counting, guys i want you to give me the codes or by sending it to my email box. thanks guys.
Also i cant stop, to get the timer to stop. Can anyone help me with this? this is my email box hassan4allofus@yahoo.com
Also i cant stop, to get the timer to stop. Can anyone help me with this? this is my email box muhammedhassan4islam@yahoo.com
please guys how can i remove timer from counting or reading,i meant by using shutdown, to broswe.please guys this is my email box hassan4allofus@yahoo.com. thanks.
please tom how can i apply the code,as you just saide early.please tom, this is my email box hassan4allofus@yahoo.com. thanks
To stop on zero you must enter this code in onEnterFrame = function
if (elapsed_time >= countdown) {
gotoAndStop(2);
};
thanks for the code!
How do you incorporate days into this? like a 30 day countdown…?
I’m trying to incorporate this into a game where you go to the “game over” frame after a hitTest. How do I get the timer to freeze when you go to the next frame, so people can see their finishing time?
I have the same question as Jose: How can I incorporate days into this?
i need help… how can i make it so that on a certain time something happens? here is my code so far
onClipEvent (enterframe){
if (timer_txt == “00:00:00:10″){
_root.object.gotoAndPlay(6){
}
}
why doesnt this work?
email me at soggyoats@gmail.com
For days I added this code:
in the function time_to_string(time_to_convert)
elapsed_days = Math.floor
time_to_convert/86400000);
remaining = time_to_convert-(elapsed_days*86400000);
The wher the if statments begin this was added:
if (elapsed_days<10) {
days = “0″+elapsed_days.toString();
} else {
days = elapsed_days.toString();
}
then the “return” was adjusted to read:
return days+” Days: “+hours+” Hrs: “+minutes+” Min: “+seconds+” Sec “+hundredths;
So I have the days but now I want to limit the hous to only 24 instead of the total minutes remaining in say 10 days.
for example my readout says:
10 Days: 249 Hrs: so many Min: etc.. Sec:
any suggestions?
e-mail me at cslmke2000@yahoo.com
great tut, but is there a way that i can get the timer to stop when a object crosses a certian point.
Hey man, this is awesome. I love all the flash stuff you make!
put if.0>i++{gotoAndPlay(ur frame)}
that should work
thx juan … your advice on stopping the timer REALLY helped alot … thx
Great countdown code. I’ve modified it to work for my purposes and it’s great. The only thing I can’t seem to figure out is how to pause it and restart it from where I’ve left off.
I’ve created a Pause button that when clicked, grabs the current time displayed in the count_down textbox stores it in a textbox called pausedtime, hides the count_down text box, unhides the pausedtime textbox showing the time when the Pause button was clicked. Works great. The pause button also creates a var and stores the getTimer when the button is clicked.
This also hides the Pause button and shows a play button in it’s place. In the Play button I have …
countdown = (roundtime * 60000) + (getTimer() – pause);
(I forget how I got that formula, but …)
This works the first time I click play, the count_down display continues from where it left off, so I thought I’d figured it out. But, if you hit pause again, the next time you unpause it’s wrong.
I’m having trouble getting my head around the getTimer counting up but the count_down is counting down, and what needs to be subtracted from what to get the count_down to start from where it left off.
I feel like I’ve tried everything, so anyone who’s got an idea of how to get this workin’, I’d be interested in any ideas you have.
Thanks
Oh, the var in the pause button is called …
pause
which is in the formula in the play btn.
Oh, and “roundtime” is input by the user in a previous screen and replaces the 7200000 in line 2 of the original script.
Obviously no one frequents this page … but, if you ever come across this and want to pause the countdown portion of Emanuele’s script, I’ve put this code into my play button and it seems to work …
============================================
on (release) {
start_time = getTimer() – elapsed_time + pause_time;
var go = getTimer();
pause_time = go – pause;
countdown = (roundtime * 60000) + pause_time;
count_down._visible = 1;
paustime._visible = 0;
}
============================================
It took alot of guessing and I’m not sure exactly how I ended up with it or exactly why it works, but it does.
If anyone wants it and can’t make out my method, I have no problem sending you my working version.
cant make it stop on “0″
and go nextframe :(
any of your suggestion worked for me
i just have seconds
its a countdown of 5 seconds and i want it to stop on 0
and go next frame which say GAME OVER :(
hey man thank’s for tut, i like your flash stuff
Thankyou very much for your code!
I noticed that when the count finishes it starts again. So i added this to the end before the “return hours+”:” etc part.
if (time_elapsed>=7200000) {
gotoAndStop (2);
}
This makes sure that when the count reaches 0 it stops and does not repeat. Obviously you would have to change the gotoAndStop to whichever frame applies to you and the 7200000 changes depending on your certain time and should match the number on line 2 of the code.
Thanks again,
Jeremy
Hi, I was wondering if anyone here knows how to restart the counter again, once it reaches 0.
hello
please Ter can i have the code for you play\pause timer, i really really need him
hello, Can someone help me please? I want to load an external XML or TXT file and get from the external file a number to countdown = (external file number);
thank you
Hello, i have a question…
countdown = 7200000;<< this number”7200000″ how to load from external file?
Thanks so much! It would have taken me hours to figure this out ;)
Hi, Ter
I am working on the pause btn aswell.
Can you send you working version to vayphu1982@yahoo.com so I can play with my version.
Thanks
Steve
Just wanted to say that Jeremy’s post works, just make it elapsed_time instead of time_elapsed. Thanks all.
Hi i need to setup for 5 min then i need to show susplay on the game that “you have lost already in game” after 5min over
Hi i need to setup for 5 min then i need to show Display on the game that “you have lost already in game†after 5min over
What about when somthing pops up how do i do that
ad when you click somthing it stops
Hi Ter, sorry to bother ya.
Would you mind sending me your working version of the pause timer?
My email is yew_yong@hotmail.com
Thanks and happy new year.
hello every one,
how to pause the count down?
hello,
how to make action if after times is over then will go to another frame.
please send me tutorial via email
i want make quiz for my student
thanks
trydantry@yahoo.co.id
question, when i insert the time in my html and upload both to the web (they are in the same folder)
i dont see the timer, please advice
So do I have to add another frame so the time would stop.
If so how do you add the second frame?