can i get some help with a loop?

muldaria · 01-20-2013, 12:47 AM

I need to loop this timer. can i get some help with that?

Code:

<script> 
<!-- 
// 
 var milisec=0 
 var seconds=60 
 document.counter.d2.value='30' 

function display(){ 
 if (milisec<=0){ 
    milisec=9 
    seconds-=1 
 } 
 if (seconds<=-1){ 
    milisec=0 
    seconds+=1 
 } 
 else 
    milisec-=1 
    document.counter.d2.value=seconds+"."+milisec 
    setTimeout("display()",100) 
} 
display() 
--> 
</script>

jmrker · 01-20-2013, 02:40 AM

Other than what looks to be an older script, what is it doing or not doing to your satisfaction?

Note: It is recommended to use the ';' at the end of each line.
Not mandatory, but will help keep things clear in the future.

Also note the addition of some braces " { } " to clarify the if...else part of the logic.

Code:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title> Untitled </title>
</head>
<body>
<form name="counter" action="#" method="post" onsubmit="return false">
<input type="text" name="d2" value="">
</form>

<script> 
 var milisec=0; 
 var seconds=60; 
// document.counter.d2.value='30'; // can't see purpose when seconds set to 60 ???

function display(){ 
  if (milisec<=0){ milisec=9; seconds-=1; } 
  if (seconds<=-1){ milisec=0; seconds+=1; } else { milisec-=1; } 
  document.counter.d2.value=seconds+"."+milisec; 
  setTimeout("display()",100); 
} 
display() 
</script>

</body>
</html>

Airblader · 01-20-2013, 02:51 AM

Slightly Off-Topic: Standard JavaScript timers are horribly inaccurate – see the very left example here. The timer on the right is much more accurate, an explanation can be found here.

muldaria · 01-20-2013, 03:12 AM

Im an intern for a website startup and my "boss" asked me to make a time that goes to 60 seconds infinitely. so can you somehow show me the code for that?

Logic Ali · 01-20-2013, 03:18 AM

If by "loop" you mean execute each iteration of a loop at delayed intervals, then that isn't possible in JavaScript, nor should it be.

That's why setTimeout and setInterval exist and your type of implementation must be used.

Of course it could be improved, not least by ensuring that the function ceases to be called after it is no longer required.

Airblader · 01-20-2013, 04:21 AM

Going completely off-topic now:

When I started as an intern, the first thing they gave me was the book "Clean Code" – and at that point I already had ten years of programming experience. If you're going for making this your profession you really wanna read similar books ... even if you have to do it in your free time. The sooner you learn how to write quality code the easier it will be to take it in.

As for your task: What exactly is your task? A timer that goes from 0 to 60 or from 60 to 0? Does it have to have tenths of seconds? Should it just repeat itself when it reached the end?

Old Pedant · 01-20-2013, 06:18 AM

And a little on the side.

Keeping in mind Airblader's warning about timer accuracy, at least you can simplify the code.

There is no reason for separate variables for seconds and tenths-of-seconds.

Oh, and your use of document.counter.d2.value would indicate you are using a named <form>, which is considered obsolete. So assuming you have a <form> with, properly, an id such as <form id="counter">:

Code:

var ticker = 0;
var countField = document.getElementById("counter").d2;
function tick( )
{
    if ( (ticker-=0.1) <= 0 ) { ticker = 60; }
    countField.value = ticker.toFixed(1);
}
tick( );
setInterval( tick, 100 );

That counts DOWN from 60 to 0.1 before resetting to 60.

If you wanted to go UP, from 0 to 59.9 before resetting to 0:

Code:

var ticker = 60;
var countField = document.getElementById("counter").d2;
function tick( )
{
    if ( (ticker+=0.1) >= 60 ) { ticker = 0; }
    countField.value = ticker.toFixed(1);
}
tick( );
setInterval( tick, 100 );