469,327 Members | 1,226 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,327 developers. It's quick & easy.

Countdown Timer problems

I have been creating a generic countdown timer (source code below), counting
the seconds, minutes, hours and days till an event, but I have having
trouble with it finding out how many hours are left. When i get it to
display a complete countdown (days hours mins seconds left) it is one hour
short when counting dates that fall in the following time brackets:
2004,2,29 -> 2004,9,31
2005,2,28 -> 2005,9,30
2006,2,27 -> 2006,9,29
etc..

I have tested this on mozilla firebird 0.7, and internet explorer 5.5 + 6
and the problem always occurs. Is this a bug in javascript, or just my bad
mathematics in finding the modulo value.
Source code:

<HTML>
<HEAD>
<TITLE>JavaScript Countdown</TITLE>
<SCRIPT LANGUAGE=JAVASCRIPT TYPE="TEXT/JAVASCRIPT">
<!--
<!-- Basic Countdown Timer//-->
<!-- By Peter Bonnett (Pe**********@hotmail.com) //-->
<!-- http://uk.geocities.com/peterbonnett //-->
var theTime="";
var type = "theLot"//Default is the lot

function getType(){
if (document.theForm.changeType[0].checked) {
type = "seconds"
}
else if (document.theForm.changeType[1].checked) {
type = "mins"
}
else if (document.theForm.changeType[2].checked) {
type = "hours"
}
else if (document.theForm.changeType[3].checked) {
type = "days"
}
else if (document.theForm.changeType[4].checked) {
type = "theLot"
}
}

function showTheTime() {
getType();//See what radio button is checked
now = new Date
next = new Date(2004,2,8); //Date you are counting down to
if(type=="seconds"){
document.getElementById("countdown").innerHTML =
parseInt((next.getTime() - now.getTime())/1000)+" seconds"; //Set text to
show seconds left
}
else if(type=="mins"){
document.getElementById("countdown").innerHTML =
parseInt((next.getTime() - now.getTime())/(1000*60))+" mins"; //Set text to
show minutes left
}
else if(type=="hours"){
document.getElementById("countdown").innerHTML =
parseInt((next.getTime() - now.getTime())/(1000*60*60))+" hours"; //Set text
to show hours left
}
else if(type=="days"){
document.getElementById("countdown").innerHTML =
parseInt((next.getTime() - now.getTime())/(1000*60*60*24))+" days"; //Set
text to show days left
}
else if(type=="theLot"){
days = parseInt((next.getTime() - now.getTime())/(1000*60*60*24));
//Calculation to get the days
hrsLeft = parseInt((next.getTime() -
now.getTime())/(1000*60*60))%24;//Calculation to get the hours left
minsLeft = parseInt((next.getTime() -
now.getTime())/(1000*60))%60;//Calculation to get the minutes left
secsLeft = parseInt((next.getTime() -
now.getTime())/(1000))%60;//Calculation to get the seconds left
document.getElementById("countdown").innerHTML = days + " days " + hrsLeft
+ " hours " + minsLeft + " minutes " + secsLeft +" seconds. ";
}
setTimeout("showTheTime()",1000)

}

//-->
</SCRIPT>
</HEAD>
<BODY BGCOLOR=WHITE onLoad="showTheTime()">
<DIV ID="countdown"><!-- Where the time left is displayed//--></DIV>
<FORM NAME="theForm">
Choose type:
<INPUT TYPE=RADIO NAME="changeType">Seconds
<INPUT TYPE=RADIO NAME="changeType">Minutes
<INPUT TYPE=RADIO NAME="changeType">Hours
<INPUT TYPE=RADIO NAME="changeType">Days
<INPUT TYPE=RADIO NAME="changeType" CHECKED>The Lot
</FORM>
</BODY>
</HTML>

Jul 20 '05 #1
3 2441
Lee
Bonnett said:

I have been creating a generic countdown timer (source code below), counting
the seconds, minutes, hours and days till an event, but I have having
trouble with it finding out how many hours are left. When i get it to
display a complete countdown (days hours mins seconds left) it is one hour
short when counting dates that fall in the following time brackets:
2004,2,29 -> 2004,9,31
2005,2,28 -> 2005,9,30
2006,2,27 -> 2006,9,29
etc..

I have tested this on mozilla firebird 0.7, and internet explorer 5.5 + 6
and the problem always occurs. Is this a bug in javascript, or just my bad
mathematics in finding the modulo value.


Fall back in Fall. Spring forward in Spring.

Jul 20 '05 #2
"Lee" <RE**************@cox.net> wrote in message
news:bu*********@drn.newsguy.com...
Bonnett said:

I have been creating a generic countdown timer (source code below), countingthe seconds, minutes, hours and days till an event, but I have having
trouble with it finding out how many hours are left. When i get it to
display a complete countdown (days hours mins seconds left) it is one hourshort when counting dates that fall in the following time brackets:
2004,2,29 -> 2004,9,31
2005,2,28 -> 2005,9,30
2006,2,27 -> 2006,9,29
etc..

I have tested this on mozilla firebird 0.7, and internet explorer 5.5 + 6
and the problem always occurs. Is this a bug in javascript, or just my badmathematics in finding the modulo value.


Fall back in Fall. Spring forward in Spring.


*groans*

Thank you, i shall have to remember to put a little message on the page
informing anyone who uses it

Bonnett
Jul 20 '05 #3
JRS: In article <bu************@ID-150632.news.uni-berlin.de>, seen in
news:comp.lang.javascript, Bonnett <Pe****************@hotmail.com>
posted at Wed, 14 Jan 2004 21:41:05 :-
"Lee" <RE**************@cox.net> wrote in message
news:bu*********@drn.newsguy.com...
Bonnett said:
>
>I have been creating a generic countdown timer (source code below),counting >the seconds, minutes, hours and days till an event, but I have having
>trouble with it finding out how many hours are left. When i get it to
>display a complete countdown (days hours mins seconds left) it is onehour >short when counting dates that fall in the following time brackets:
>2004,2,29 -> 2004,9,31
>2005,2,28 -> 2005,9,30
>2006,2,27 -> 2006,9,29
>etc..
>
>I have tested this on mozilla firebird 0.7, and internet explorer 5.5 + 6
>and the problem always occurs. Is this a bug in javascript, or just mybad >mathematics in finding the modulo value.


Fall back in Fall. Spring forward in Spring.


Thank you, i shall have to remember to put a little message on the page
informing anyone who uses it

Obviously you did not read the newsgroup FAQ carefully enough; nor
articles posted here within the last few days.

There is no need for a little message; just code it right.

You have a choice: assuming you are counting to midwinter, and it is now
summer, do you or do you not want to show the extra hour?

To show it, just use the UTC functions throughout.

To avoid it, do not use getTime, but do long-arithmetic subtraction of
the fields of the current civil time from those of the target. This
becomes almost trivial if the target is a midnight - but first, convert
from Y M D to days.
One should not use parseInt to make a number an integer; Math.floor is
provided for that.

You have next = new Date(2004,2,8) ;
next = new Date("2004/03/08")
while longer is less likely to be in error.

Don't put 1000 as the second parameter of setTimeout; one can easily do
better - see below.

Much of the text of showTheTime is repeated, and could be outside the
conditionals: e.g. use one var T = document.getElementById("countdown")
and several T.innerHTML = ... ; use one
var DT = (next.getTime() - now.getTime()) and several DT.

..innerHTML does not work on all browsers; see FAQ discussion in this
newsgroup.

Don't let your newsreader wrap long lines; do it yourself, where best
for legibility. Those who wish to test your code, or modifications to
it, should not be forced to repair it first.

--
© John Stockton, Surrey, UK. ?@merlyn.demon.co.uk Turnpike v4.00 IE 4 ©
<URL:http://jibbering.com/faq/> Jim Ley's FAQ for news:comp.lang.javascript
<URL:http://www.merlyn.demon.co.uk/js-index.htm> jscr maths, dates, sources.
<URL:http://www.merlyn.demon.co.uk/> TP/BP/Delphi/jscr/&c, FAQ items, links.
Jul 20 '05 #4

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

4 posts views Thread by Christine | last post: by
8 posts views Thread by Michael | last post: by
3 posts views Thread by JimJam | last post: by
1 post views Thread by Dirk Hagemann | last post: by
1 post views Thread by DennyLoi | last post: by
9 posts views Thread by MC | last post: by
mageswar005
5 posts views Thread by mageswar005 | last post: by
1 post views Thread by CARIGAR | last post: by
reply views Thread by zhoujie | last post: by
reply views Thread by suresh191 | last post: by
reply views Thread by listenups61195 | last post: by
reply views Thread by haryvincent176 | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.