Demonstration of using a timer on a webpage






2.95/5 (16 votes)
Nov 23, 2002
2 min read

133435

1379
Demonstration of using a timer on a webpage.
Introduction
ASP is commonly used on Microsoft Servers and other compatible platforms to build dynamic web pages and also to retrieve data from databases. ASP supports various scripting languages like VBScript, JScript, etc. These scripting languages provide the business logic to the web pages while ASP is used to provide dynamic content to the webpage.
Briefing About The Problem
I came across a problem when I was building an Online Examination System for my Institute. The problem was to restrict the student's time, i.e., the student must answer all the questions in the exam in a specific time. For that, I had to attach a timer to the web page. I made use of VBScript inside the ASP page. I assume here that the reader is conversant in VBScript, if not, it is not a problem, just mail me at email@gauravsonline.com if you have any queries related to the subject. I would definitely reply.
Example
Now comes the explanation of how it's done. I am trying to simulate a "count down clock". This is explained as follows with the help of the following ASP example:
'*************************************************************
'This program makes use of a recursive procedure HandleTime.
'The important aspects of the code are "Status" and "setTimeOut".
'Status is an attribute of the Window object in VBScript and is used to
'change the status message of the active window.
'setTimeOut is a VBScript function that tells after how much time the timer
'would stop and accordingly it calls a function passed into it to take some
'action when the time is up.
'This procedure calls its self after every 1 sec (I have taken 1sec = 950ms
' here) and accordingly the variables hr, min and sec are decremented.
'*************************************************************
Sub HandleTime
if hr=0 and min=0 and sec=0 then
EndTime
'**When hr, min and sec are all 0, this means that the time is up
'**and EndTime procedure is 'called.
elseif min>=0 and sec>0 then
sec=sec-1
status=hr & ":" & min & ":" & sec
'**Whenever the second changes the Status of the window has to
'be changed.
intTimerID=setTimeOut("HandleTime",950, "VBScript")
'**setTimeOut function returns a unique timer id that is used to
'keep track of the time.
'**When the time is up the timer id is destroyed automatically.
elseif min>0 and sec=0 then
min=min-1
sec=59
status=hr & ":" & min & ":" & sec
intTimerID=setTimeOut("HandleTime",950, "VBScript")
elseif hr>=0 and min=0 then
hr=hr-1
min=59
sec=59
status=hr & ":" & min & ":" & sec
intTimerID=setTimeOut("HandleTime",950, "VBScript")
end if
End Sub
Sub EndTime
clearTimeOut intTimerID
'**clearTimeOut is a built in procedure of VBScript which is used to
'**clear and destroy the timer id explicitly
status = "Your Time Ended"
'**When the time ends the status bar displays this message.
msgbox "Time Up"
End Sub
How To Use The Source Code
To run the ASP code, you must have an ASP enabled web server such as Microsoft Personal Web Server or IIS installed on your system and select the publishing directory. This code could also be executed from a simple .htm file without requiring PWS or IIS installed.
When you run the program, you would see that the clock starts from 0:2:0 and ends at 00:00:00. You can use the variables hr
, min
and sec
in the program to change the time. Moreover, you can also connect a form from which you can specify inputs to these variables and hence you can have your own time constraints.
Warning
This code could only be executed inside browsers with VBScript built in. For example: IE 4.0 or higher.
Screenshots of the Program
Here, you can see that the time starts at 0:2:0. The time ends after two minutes and then the message is displayed like this: