Timer on webpages

[David]

Hi,

Im not sure where to find all the documentation i need for this? I need
to timer since a start button has been pushed, and show a counter on a
page. If they click stop i want to keep the time, and carry on
incrementing it if they click start again.

Any suggestions on code, or reference material for this?

Thanks for all the help

David

 

[Ben C]

Hi,

Im not sure where to find all the documentation i need for this? I need
to timer since a start button has been pushed, and show a counter on a
page. If they click stop i want to keep the time, and carry on
incrementing it if they click start again.

Any suggestions on code, or reference material for this?

Tricky one. I can't think of a way except using setInterval, with an
interval of about a second. In the callback you update the counter,
animation, etc., and increment a variable that counts how many seconds have
elapsed.

 

[Randy Webb]

Ben C said the following on 4/29/2006 11:53 AM:

Tricky one.

Not really.

I can't think of a way except using setInterval,

There are other ways but setInterval would be the best way to update the
page itself. Not necessarily the best way to increment the counter though.

with an interval of about a second.

The resolution you used for setInterval would depend on how much
resource you would be willing to use and how accurate you wanted the
counter time wise.

In the callback you update the counter, animation, etc.,
and increment a variable that counts how many seconds have elapsed.

I don't agree with that one. Incrementing a variable would lead to
inaccuracies in the total. Just start with a Date object and compare the
current time, get the difference, and display it.

The only difference in this question and any other "running counter"
question is the Start/Stop buttons. And how you handled those would
depend, directly, on whether the OP wanted the timer to include the
Stopped time or not.

 

[Dr John Stockton]

JRS: In article <[email protected]>, dated
Sat, 29 Apr 2006 14:34:28 remote, seen in

I don't agree with that one. Incrementing a variable would lead to
inaccuracies in the total. Just start with a Date object and compare the
current time, get the difference, and display it.

Using a Date Object to indicate duration will be unreliable in systems
where the clock is being automatically synchronised from time to time.

Using a Date Object naively to indicate duration will be unreliable when
the season changes between Summer and Winter.

 

[Randy Webb]

Dr John Stockton said the following on 4/29/2006 5:25 PM:

JRS: In article <[email protected]>, dated
Sat, 29 Apr 2006 14:34:28 remote, seen in

Using a Date Object to indicate duration will be unreliable in systems
where the clock is being automatically synchronised from time to time.

If your app is that time critical, then you would know whether that was
happening or not and if you didn't allow for it then you get what you
deserve.

Using a Date Object naively to indicate duration will be unreliable when
the season changes between Summer and Winter.

And naively assuming that most business applications are being used on a
Saturday night at 2AM is indeed naive.

 

[RobG]

Dr John Stockton said the following on 4/29/2006 5:25 PM:

If your app is that time critical, then you would know whether that was
happening or not and if you didn't allow for it then you get what you
deserve.

Absolutely, so worth mentioning.

And naively assuming that most business applications are being used on a
Saturday night at 2AM is indeed naive.

That is not naive at all - many businesses that have a production
process have shift work. I've frequently been involved in projects with
24hr shifts, 7 days per week over many months. That is common on
projects such as those that use very expensive CAD equipment, say a
major construction project.

 

[Dr John Stockton]

JRS: In article <[email protected]>, dated
Sat, 29 Apr 2006 20:56:16 remote, seen in

Dr John Stockton said the following on 4/29/2006 5:25 PM:

And naively assuming that most business applications are being used on a
Saturday night at 2AM is indeed naive.

It would be; but we should not be concerned just with "most" here; and
it is naive to assume that the clock necessarily changes at 2AM.

Then just consider all the Muslim and Jewish businessmen; the businesses
that run 24/7/366; the travellers who keep there portables set to Home
Time, ...

 

[Randy Webb]

Dr John Stockton said the following on 4/30/2006 5:50 PM:

JRS: In article <[email protected]>, dated
Sat, 29 Apr 2006 20:56:16 remote, seen in

It would be; but we should not be concerned just with "most" here; and
it is naive to assume that the clock necessarily changes at 2AM.

And this entire scenario falls into the part of my reply that you snipped:

<quote>
If your app is that time critical, then you would know whether that was
happening or not and if you didn't allow for it then you get what you
deserve.

Then just consider all the Muslim and Jewish businessmen; the businesses
that run 24/7/366; the travellers who keep there portables set to Home
Time, ...

I am not sure what being Muslim or Jewish has to do with that.

But, it still falls into the first category.

 

[Dr John Stockton]

JRS: In article <[email protected]>, dated
Sun, 30 Apr 2006 22:37:29 remote, seen in

Dr John Stockton said the following on 4/30/2006 5:50 PM:

And this entire scenario falls into the part of my reply that you snipped:

<quote>
If your app is that time critical, then you would know whether that was
happening or not and if you didn't allow for it then you get what you
deserve.
</quote>

Don't assume that questioners and readers are as intelligent as you
think you are.

I am not sure what being Muslim or Jewish has to do with that.

Knowing nothing about other cultures is part of being a WASP, no doubt.
FYI, those people do not regard Sunday as the ordained Day of Rest.

 

[Bart Van der Donck]

Im not sure where to find all the documentation i need for this? I need
to timer since a start button has been pushed, and show a counter on a
page. If they click stop i want to keep the time, and carry on
incrementing it if they click start again.

<html>

<head>
<meta http-equiv="Content-Type"
content="text/html; charset=iso-8859-1">
<style type="text/css" media="all">
.clock {
text-align:center;
font-family: Courier, Courier New;
font-size: 30px;
font-weight: bold;
background-color: white;
border: 0px;
border-style: solid;
border-color: white;
}

body {
background-color: white;
}
</style>
<script language="javascript" type="text/javascript">

// 1000 = 1 second.
// A reliable 'real seconds' timer is only 1000 (or above)
// on nowadays machines, because CPU will slowdown the
// timer if it are small intervals.
// The lower the value, the longer your 'seconds' will become.
// If the real time is not important for you (you wrote about
// 'a counter'), you can set this value as low as you like.
var interval = 1000;

// These should be left as they are
var tijdID = null;
var tijdLoopt = false;

function stop_klok() {
if (tijdLoopt)
clearTimeout(tijdID);
tijdLoopt = false;
}

function toon_tijd() {
var now = new Date();
seconden = parseFloat(document.counterform.cf.value);
seconden = seconden + 1;
huidigeTijd = '';
if (seconden < 10)
huidigeTijd='00000'+seconden;
if (seconden < 100 && seconden >= 10)
huidigeTijd='0000'+seconden;
if (seconden < 1000 && seconden >= 100)
huidigeTijd='000'+seconden;
if (seconden < 10000 && seconden >= 1000)
huidigeTijd='00'+seconden;
if (seconden < 100000 && seconden >= 10000)
huidigeTijd='0'+seconden;
document.counterform.cf.value = huidigeTijd;
tijdID = setTimeout("toon_tijd()", interval);
tijdLoopt=true;
}

function start_klok() {
stop_klok();
toon_tijd();
}
</script>
</head>

<body>

<form name="counterform">
<center>
<input onFocus="blur();" type="text" name="cf"
size="13" class="clock" value="000000">
<br/>
<input type="button" value="Start" onClick="start_klok();">
<input type="button" value="Stop" onClick="stop_klok();">

</center>
</form>

</body>
</html>

 

[Bart Van der Donck]

[...]
var now = new Date();
[...]

No need for that line.

 

[Randy Webb]

Dr John Stockton said the following on 5/1/2006 2:11 PM:

JRS: In article <[email protected]>, dated
Sun, 30 Apr 2006 22:37:29 remote, seen in

Don't assume that questioners and readers are as intelligent as you
think you are.

Coming from someone that is as pedantic as you are, that doesn't bother
me. Try harder.

Knowing nothing about other cultures is part of being a WASP, no doubt.

Muslim and Jewish is not a "culture", it is a religion. The culture you
are referring to would be Arab (Muslim) and Israeli (Jewish). Practice
what you preach. And, for someone who composes off-line and then posts,
you seem to be pretty lazy and overly fond of unknown acronyms.

FYI, those people do not regard Sunday as the ordained Day of Rest.

Your mastery of the obvious is starting to approach that of TL. Having
lived in an Arab culture for about 2 years, I am well aware of the Holy
Day (It is not an "ordained Day of Rest" to Muslims, it is the Holy Day)
being on Friday (In both cultures). Still, it has nothing to do with
time changing at 2AM in Daylight Savings Time (where practiced).

As in the past, I have told you, stick to Dates and Times, you suck at
common sense John.

 

[Dr John Stockton]

JRS: In article <[email protected]>
, dated Tue, 2 May 2006 02:35:36 remote, seen in

var interval = 1000;

function toon_tijd() {
var now = new Date();
seconden = parseFloat(document.counterform.cf.value);
seconden = seconden + 1;

Maybe seconden = +document.counterform.cf.value + 1

huidigeTijd = '';
if (seconden < 10)
huidigeTijd='00000'+seconden;
if (seconden < 100 && seconden >= 10)
huidigeTijd='0000'+seconden;
if (seconden < 1000 && seconden >= 100)
huidigeTijd='000'+seconden;
if (seconden < 10000 && seconden >= 1000)
huidigeTijd='00'+seconden;
if (seconden < 100000 && seconden >= 10000)
huidigeTijd='0'+seconden;
document.counterform.cf.value = huidigeTijd;
tijdID = setTimeout("toon_tijd()", interval);
tijdLoopt=true;
}

It is perhaps better not to use seconden as the name of what is
counted in a VAR interval; I'd use Ticks to be more general, or hard-
code 1000 throughout.

In at least some systems, repeating setTimeout(..., 1000) gives an
average interval of longer than a second, because of overheads and
waiting for the next check. See <URL:http://www.merlyn.demon.co.uk/js-
date0.htm#TaI>.

Consider whether the computer's clock may be adjusted during the
interval, and whether it will matter.

By using new Date() results at the beginning and end of the interval,
you can check your counting (if the clock is not adjusted).

Consider huidigeTijd = String(1e6+seconden).substring(1)
and
huidigeTijd = seconden + ""
while (huidigeTijd.length<6) huidigeTijd = "0" + huidigeTijd