Tutorial: How to Pause a Timer

How to pause in ActionScript 3.0

The integrated Timer class in ActionScript 3.0 has a major downside - it can't pause. So what can we do to solve this problem?
The Timer class has two functions that we usually use:

.stop() : stops the Timer and resets the delay.

.start() : begins the Timer. It will set the delay to the value passed into new Timer(delay:Number,repeat:Number).

If, let's say, a timer with a delay of 1000 milliseconds is created. We stop it when it has executed 500 milliseconds. Now, we still have 500 milliseconds left, but if we start it again it will restart with a delay of 1000. If we repeatedly stopped it half-way and started it again it would never finish.

Explanation to the movies above:
Both movies have a box moving from left to right and vice versa. Every 1,1 second the boxes change colors.

(NOTE: Keep in mind that the timer is exact and the flash player isn't. This can result in some inaccuracy)

The first movie ("Bad Timer") uses the integrated Timer class. When you hit PAUSE it throws the .stop() function and when you hit RESUME it throws the .start() function.
The point is to show that if you pause/resume repeatedly the box won't change color as it should.

The second movie ("Good Timer") uses a homemade class that I will show you how to make in a moment. The class stores the time that the timer has runned when paused and substract it from the original delay when started.


The PerfectTimer Class
I am a very humble person so I have called the class "PerfectTimer". Let's begin by taking a look at the whole class and then I will explain the idea behind and how you can use it in your own projects.

Code Snippet
package {
 
	import flash.utils.Timer;
	import flash.utils.getTimer;
 
	public class PerfectTimer {
 
		public var _delay:Number;
		public var _lastTime:Number;
		public var _repeat:Number;
		public var _thisTime:Number = 0;
		public var timer:Timer;
 
		public function PerfectTimer(delay:Number, repeat:uint=0):void {
			_delay = delay;
			_repeat = repeat;
 
			timer = new Timer(delay,repeat);
		}
 
		public function start():void {
			_lastTime = getTimer();
			timer.start();
		}
 
		public function pause():void {
			timer.stop();
			_thisTime = getTimer() - _lastTime;
		}
 
		public function repeat(new_delay:Number):void {
			_lastTime = getTimer();
			timer.delay = new_delay;
		}
 
		public function resume():void {
			if (_thisTime > timer.delay) {
				_thisTime = timer.delay;
			}
			timer.delay -= _thisTime;
			_lastTime = getTimer();
			timer.start();
 
			_thisTime = 0;
		}
	}
}

As you might have noticed is the class created as a normal Timer with 2 parameters - delay and repeat, where the repeat is optional.

line 21-24 "start()" : We store the current time in the variable "_lastTime".

line 26-29 "pause()" : The variable, "_thisTime", calculates the time difference from when the timer was started till it was paused.

line 31-34 "repeat()" : This is the tiny downside of this class. If the timer repeats more than once we will have to reset the "_lastTime". You will also have to pass in the delay once again. This can be used in our favor - if we want to change the delay everytime the timer repeats (maybe a random delay).

line 36-45 "resume()" : This is it. Now, we will use all of our stored values to calculate the already spent time and substract it from the timer.delay and then reset all the parameters (_lastTime and _thisTime). The timer will now start with the remaining delay.

The big difference is that the class creates a Timer within itself. This means that you will have to go down a layer if you will assign any event to the timer. Let's say we work in another external AS3 script and we wan't to create and work with our new and powerful Timer class. (remember to store the scripts in the same folder).

Code Snippet
var timer:PerfectTimer = new PerfectTimer(1000);
/* remember NOT to assign the listener directly to the PerfectTimer!
instead assign it to the timer inside the PerfectTimer :) */
timer.timer.addEventListener(TimerEvent.TIMER, executeAndRepeat);
timer.start();
 
pause_btn.addEventListener(MouseEvent.CLICK, pauseGame);
resume_btn.addEventListener(MouseEvent.CLICK, resumeGame);
 
function executeAndRepeat(event:TimerEvent):void {
	// do your magic
 
	timer.repeat(1000);
}
 
function pauseGame(event:MouseEvent):void {
	// pause all events
	// ex. removeEventListener(Event.ENTER_FRAME, handleEverything);
 
	timer.pause();	
}
 
function pauseGame(event:MouseEvent):void {
	// resume all events
	// ex. addEventListener(Event.ENTER_FRAME, handleEverything);
 
	timer.resume();	
}

NOTE: Notice in line 4 that we dig down a level and assign the event listener to the timer inside the PerfectTimer class. If you want to use any integrated Timer function you will have to do the same.

By Lewinzki