I need a Javascript timer that starts at 0:00:00 and counts up. I started with a clock script but I can’t figure out how to reset it so it starts counting from 0:00:00. This is what I have:
function start_clock () {
var d=new Date()
var h= d.getHours()
var m= d.getMinutes() + ""
var s= d.getSeconds() + ""
if (m.length==1) { m="0" + m } // 2 decimal spaces.
if (s.length==1) { s="0" + m } // 2 decimal spaces.
myTimer.innerHTML=h + ":" + m + ":" + s
}
That starts the clock at whatever time now is and dynamically keeps on counting up. I trided modifying it like this:
function start_clock () {
var d=new Date()
[B] d.setHours(0,0,0)[/B] // <--------------
var h= d.getHours()
var m= d.getMinutes() + ""
var s= d.getSeconds() + ""
if (m.length==1) { m="0" + m } // 2 decimal spaces.
if (s.length==1) { s="0" + m } // 2 decimal spaces.
myTimer.innerHTML=h + ":" + m + ":" + s
}
So now it prints the 0:00:00 but it doesn’t count anymore.
So the thing is, shouldn’t adding d.setHours(0,0,0) right under var d=new Date() set the clock to 0:00:00? Without it, time is set to whatever time is right now and the clock works. With it, time is set to 0:00:00 but the clock doesn’t count the time.
I don’t know what I’m doing in the javascript forum but your logic seems floored to me.
If you set the date to zero each time through the loop then you will get zero each time you run through because that’s what you are setting it to.
It seems to me that first time through you want to record the time and save a copy then on subsequent visits you want to compare the current time with the time you saved to find the time elapsed.
Something like this but needs an expert to tidy it up as my skills are very basic in JS.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.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">
var firstPass = 0;
function start_int() {
intval=window.setInterval("start_clock()",1000)
}
function start_clock () {
var myTimer = document.getElementById('myTimer');
if (firstPass == 0) {
firstPass = 1;
then = new Date();
}
now = new Date();
var d = now.getTime() - then.getTime();
var d = Math.round(d/1000);
var timeDisplay = findtime(d);
myTimer.innerHTML = timeDisplay;
}
function findtime(theSeconds) {
var hr = Math.floor(theSeconds / 3600);
var mins = Math.floor((theSeconds - (hr * 3600))/60);
theSeconds -= ((hr * 3600) + (mins * 60));
theSeconds += ''; mins += '';
while (mins.length < 2) {mins = '0' + mins;}
while (theSeconds.length < 2) {theSeconds = '0' + theSeconds;}
while (hr.length < 2) {hr = '0' + hr;}
return hr + ':'+ mins + ':' + theSeconds;
}
</script>
</head>
<body>
<div id="myTimer">Interval Stopped
<input type="button" value="Start" onClick="start_int()">
</div>
</body>
</html>
One more thing; is there an easy way to seed it so it starts at a different time? Say, with 330 seconds on the clock, which would be 5 minutes?
I’m writing a small application to keep track of time worked. The funny thing is that I don’t need the JavaScript to pass anything to my PHP or the database, just to display the clocks. I’m quite good with PHP and MySql but I never managed to get past a rudimentary knowledge of JavaScript
Basically, the database will keep track of the time worked (in seconds). If somebody hits the pause button, the timer becomes a static display of total time (from the database). If somebody then pushes the ‘track time’ button, from the database I can feed the JavaScript how much time (in seconds) to start counting from, until the person hits the pause button again. At that point I can calculate the time via PHP based on how many seconds elapsed from hitting start (recorded on the database) to hitting pause (the time now).
I realize I could pass from the JavaScript to the PHP the amount of seconds, but I rather calculate it separately to stop the users from HTML hacking
