Saturday, 2 May 2009

How to: add count down timer



Modifying the GuiClockHud in engine

Torque engine comes with a timer function. In order to use this function, we need to create a Gui Hud in our play screen. The component which we going to use named as GuiClockHud. However there are some problems we need to consider.
GuiClockHud only used for counting upwards. It doesn’t have the functionality of count down timer. Also it doesn’t have a function for pausing the time while loading the mission areas. In order to fix this tiny problems we need to modify the actual C++ file used for GuiClockHud.

In garage games there is a tutorial already covering how to do this. http://www.garagegames.com/community/resources/view/4978
Basicly all of the code which we need for modification of the engine provided in above link.

So our first job is compiling the torque engine with a new GuiClockHud which provides a countdown , pause and unpause functionality.


Adding GuiClockHud in to Play screen

After we compiled our code we can display our countdown timer by adding a new Hud object in to our play screen gui. Our play screen named as CloakGui.All we need to do add the following lines for creating GuiClockHud.





Displaying the countdown timer

First think we need to do is to set the countdown time by calling the setReverseTime function. In this case our CountDown gui named as Timer. We
can set the Time by adding “Timer.setReverseTime(600)” .

Now, we should be able to see the count down starting from 10 minutes.
However there is a design issue which we should consider. The Count down timer is more suited for games which takes place in modern times. More precisely, the count down timer doesn’t suite for ancient games like ours.

Modifying Countdown timer further with Torque Scripting
.

The way I approach this problem is not the best way . however with the limited knowledge I could only think of this for time being.

In order to make more ancient looking timer, I created 10 roman numerals which was suggested by Mike. All these numerals stored as jpg files in client/ui/romanNum.

Now all I need to do;
- create a GuiBitmap control which used for displaying the jpg files which been created .
- create function which reads the current time from the actual GuiClockHud which we previously created and change the bitmap of the GuiBitmap control with a correct jpg file.


Creating GuiBitmap Control

Again, we need to display the jpg files in Play screen therefore we need to add a
guibitmap control in Clock.gui.
















Creating a TimerImageList.cs file for our functions

The first function which I will be creating used for selecting correct jpg file and assigning to the GuiBitmapCtrl. The following snapshot displays the code for this function.



All those if statements are used for checking the current time and changing the bitmap image of the GuiBitmapCtrl which we created previously.


Keeping track of the countdown timer for ending the game and changing the bitmap Image
There are two thinks we need consider. The first thing we have to consider is keeping the track of the time so that when the countdown timer gets in to the next minute, it changes the current image of the Guibitmap control to the correct image.

The second thing we have to consider is ending the game if the timer reaches zero.



repeatTillQuit function keep repeats by calling itself. This function calls the setTimerImage function in it’s body.

I also add additional functionality which is used for ending the game. if the countdown reaches under one second, endgame function will be called to end the game.

Ending the game was a bit tricky task. Since the repeatTillQuit function will execute before the actual game starts, the count time will be equal to zero. Therefore, the game would end before even starts. In order to fix this problem, I created a global Boolean variable which used for tracking whether if the game is running or not running. If the game is not running, the endgame function will be skipped until the game starts.


Pausing and Unpausing the Timer.

Additionaly I created two funtions to pause and unpause timer. This is an important function which we could use when we loading the mission.












Setting up the executions and function calls

- add timerImageList.cs in to the execution list of the init.cs file located at client/scripts folder. We have to make sure that timerImageList.cs executes before the CloakGui. Other wise cloakGui won’t be able to find the function since it is not compiled yet.

- need to set the value of isCountStarted global variable to “True” after player enters the game. We can set the value in GameConnection::onClientEnterGame method.

- need to set the time limit and pause it at the same time when the mainMenuGui loads. We can use this gui for required function calls.

- need to unpause the timer right after missiondownload. Therefore, we need to call unpauseCountDown function in missionDonwloadComplete function which is defined in missionDownload.cs. Located at client/scripts folder.

- need to pause the timer when we enter in to teleportation triggers. Therefore we need to call pauseCountDown function in every function used for teleportation. All the teleportation functions placed in teleportTriggers.cs file located at server/scripts folder.

- need to reset the time and pause it if the game ends. This is important because if the game reloads after a while it will continue from old time.

No comments:

Post a Comment