Emanuele Feronato

Talking about Flash.

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.