[Newbie]Need help with timed count-down script

arrque

05-10-2009, 08:47 AM

I'm trying to make a clock that will count up in timed intervals, i.e. start counting to 10 seconds, stop for 1 minute, continue counting to 20 seconds, stop for 1 minute, etc.

I have an idea of a basic clock:

function updateClock ( )
{
var currentTime = new Date ( );

var currentHours = currentTime.getHours ( );
var currentMinutes = currentTime.getMinutes ( );
var currentSeconds = currentTime.getSeconds ( );

currentMinutes = ( currentMinutes < 10 ? "0" : "" ) + currentMinutes;
currentSeconds = ( currentSeconds < 10 ? "0" : "" ) + currentSeconds;

var currentTimeString = currentHours + ":" + currentMinutes + ":" + currentSeconds;

}

I tried combining the above code with "setTimeout" and "setInterval" functions, but I was unsuccessful. I just started learning JavaScript today and I don't know what I'm doing.

Thanks for the help
-arrque

Philip M

05-10-2009, 09:48 AM

Is this homework? :(

<body onload = "updateClock()">
<div id = "dispClock"></div>

<script type = "text/javascript">

var ss = 0;
function updateClock() {
ss++;
document.getElementById("dispClock").innerHTML = ss;

if (ss%10 == 0) {
tim = window.setTimeout("updateClock()", 60000); // after 60 seconds
}

else {
tim = window.setTimeout("updateClock()", 1000); // after 1 second
}
}

</script>
“A man ceases to be a beginner in any given science and becomes a master in that science when he has learned that he is going to be a beginner all his life.” - Robin G. Collingwood (English Philosopher, 1889-1943)

JUD

05-10-2009, 11:17 AM

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript">
// <![CDATA[
// Set hours, minutes and seconds to 0
var hrs = 0;
var mins = 0;
var secs = 0;

// Declare interval timings in seconds
var stdInt = 1; // Standard 1 second interval
var pseInt = 60; // Pause interval

function updateClock()
{
// Add 1 second to time
secs++;

// Split seconds into 60 second blocks (resets to 0 every 60 seconds)
var secs60 = secs % 60;

// Split seconds into 10 second blocks so we can stop clock every 10 seconds
var secs10 = secs % 10;

// Add 1 minute every 60 seconds, 1 hour every 60 minutes and reset minutes to 0 every 60 minutes
if(secs60 == 0) mins++;
if(mins > 59)
{
mins = 0;
hrs++;
}

// Write time string to clock element
document.getElementById('clock').innerHTML = (hrs <= 9 ? "0" + hrs : hrs) + ":" + (mins <= 9 ? "0" + mins : mins) + ":" + (secs60 <= 9 ? "0" + secs60 : secs60);

// Pause clock every 10 seconds (set interval time above)
if(secs10 == 0)
{
window.setTimeout(updateClock, pseInt * 1000);
}
else
{
window.setTimeout(updateClock, stdInt * 1000);
}
}

window.onload = updateClock;
// ]]>
</script>
</head>

<body>
<div id="clock" style="font-size:40pt;"></div>
</body>
</html>

adios

05-10-2009, 10:31 PM

I just started learning JavaScript today and I don't know what I'm doing. Ever thought of 1) buying a JS book so you'll 2) "know what you're doing"?

Why are you starting on Day 1 with timers? That's asking for trouble.

venegal

05-10-2009, 10:48 PM

Regarding the code in the first post:
There's probably nothing wrong with trying different things while learning a language, but you should be aware that Date objects have a toTimeString method.

arrque

05-11-2009, 06:01 AM

1) Thank you all for the help
2) No. I don't ask other people to do my homework. I am an enthusiast and find it useful to learn bits of languages.
3) Yes. I have checked out JS books from my library. I'm still only learning though.

Thanks again for the help :)

adios

05-11-2009, 08:11 AM

Hang in there arrque. :thumbsup:

I just started learning JavaScript today and I don't know what I'm doing.

Have a beer or two while you pore over it. You may not understand timers any better, but you won't care as much ...