Javascript Timer Help

[l0rd]

Hello. I am a script Newbie. I want to place a timer on a page on my website. I already have a javascipt code that I want to use. But I'm afraid thats all I have at this point.

The script is:

var time
var output

function Init(){
time = 1;
StartTimer()
}

function convertOutput(){
var hours = 0
var mins = 0
var secs = time

while(secs >= 60){
secs -= 60;
mins += 1;
}

if(secs < 10){
secs = "0" + secs;
}

while(mins >= 60){
mins -= 60;
hours += 1;
}

if(mins < 10){
mins = "0" + mins;
}

output = hours + ":" + mins + ":" + secs;
}

function StartTimer(){
time += 1;
convertOutput();
document.getElementById("time").innerHTML = output;
self.setTimeout("StartTimer()", 1000);
}

I need to put this on a webpage on my website.

Help will be greatly appreciated, and thanks in advance.

[Twey]

What sort of a timer? We'll need a little more than this.

[l0rd]

Its an autostart timer that tells you how long you've been looking at a webpage (no buttons or user controls)

[Twey]

Well, that's fairly easy:
<span id="timer">&nbsp;</span>

<script type="text/javascript">
(function(start) {
function map(f, a) {
for (var i = a.length - 1, r = []; i >= 0; --i)
r[i] = f(a[i], i);

return r;
}

function pad(s, w, c) {
return (new Array(w + 1 - s.toString().length)).join(c || "0") + s;
}

function timerTick() {
var now = new Date(new Date() - start);

document.getElementById("timer").firstChild.nodeValue
= map(function(n) { return pad(n, 2); },
[now.getUTCHours(),
now.getUTCMinutes(),
now.getUTCSeconds()]).join(":");
}

setInterval(timerTick, 1000);
})(new Date());
</script>

[l0rd]

hmm, Do I just paste that into the page that I want the timer to be in? Because I just did and no timer.

[Twey]

Should do, yes. If it didn't work, show the page so I can debug it. :)

[l0rd]

the site is Forlol.com

[Twey]

There is no <span id="timer"> on that page. You haven't placed the code properly.

[l0rd]

what code do I place and where do i place it

[Twey]

Exactly the code I gave you, where you want the timer.

[boogyman]

map(function(n) { return pad(n, 2); },

In your pad function declaration, you have three arguments, however the only place you call the function is above. Can you please explain the meaning of the third argument c, and how it get assigned a value ever.

[Twey]

The third argument is the character with which to pad, defaulting to '0'. I didn't need that argument for the code to work, but it's a stock function which I typed from memory, and it never hurts to be more flexible. It will be assigned a value if a third argument is passed at calltime.

[boogyman]

Just went to test it out and it doesnt work. Tosses an error
invalid array length
on

return s + (new Array(w + 1 - s.length)).join(c || "0");

[Twey]

Yep, should be length() not length. Too much Java... or something :o Edited.

[boogyman]

you were correct the first time... the length method doesn't use parenthesis

[Twey]

Yeah, you're right, fixed again.

[boogyman]

now that it works. what ended up being the problem?

[Twey]

I goofed up pad(): it needs to call toString() on the provided values, and it should also prepend the original value rather than append it.