0

So I tried to implement an accurate timer in Javascript via the answer under the accepted answer in this SO post. The only change I made was to initialize an event_last_occurrence_time which occurs on some Javascript event initialization such as the opening of a lightbox. The idea is that every 4 seconds, I'll close a lightbox that is popped up when the page is first opened.

What I notice is that the lightbox actually closes in about 1-2 seconds as opposed to 4 seconds on the first instance of the browser launch. So I did console.log(elapsed-event_last_occurrence_time) and kept track on my stopwatch - it seems that the timing mechanism below moves faster than real-world time on initialization at least (I can see this via the console.log - it jumps to 5-10 seconds while my stopwatch is still around ~2 seconds.

1) Is this just the nature of the timing mechanisms in Javascript or is there an obvious flaw in the algorithm below that I'm missing?

var start = new Date().getTime(),  
    time = 0,  
    elapsed = '0.0'
    event_last_occurrence_time = elapsed;  
function instance()  
{  
    time += 100;  
    elapsed = Math.floor(time / 100) / 10;  
    if(Math.round(elapsed) == elapsed) { elapsed += '.0'; }  

    if ((elapsed-event_last_occurrence_time)%4==0) { $.lightBox.close() }      

    document.title = elapsed;  
    var diff = (new Date().getTime() - start) - time;  
    window.setTimeout(instance, (100 - diff));  
}  
window.setTimeout(instance, 100); 

$("#some_id").click(function(e) 
{

$.lightBox({ 
            onOpen: function () 
            {
              instance();
              event_last_occurrence_time = elapsed;
            }
        });

});
Community
  • 1
  • 1
Nona
  • 5,302
  • 7
  • 41
  • 79
  • 1
    4 seconds is a long time on a PC. Any inaccuracies should be in the millisecond range -- just use a normal `setTimeout(callback, 4000)`. – Cameron Aug 12 '14 at 19:04
  • Your braces aren't matched properly. What's supposed to be in the `if`? – Barmar Aug 12 '14 at 19:04
  • Can you make a jsfiddle that shows the problem? I tried copying your code, but the missing brace messed it up. Is something supposed to update `event_last_occurrence_time`? – Barmar Aug 12 '14 at 19:06
  • @Barmar: The brace is on the end of the comment. I've edited the question to fix it. – Cameron Aug 12 '14 at 19:06
  • 1
    Also, you're mixing strings, floating point, and integer computations everywhere. JS will do some conversions, sure, but it's hard to tell what's correct and what's not when you do that. The `%4` is fishy as well, since the left operand is not an integer. There should be a `>` in there somewhere, because the elapsed time won't be exact. And you never reset `event_last_occurrence_time` so you might as well use `0` in its place. And `new Date.getTime()` is fragile -- the user could change the clock, or daylight savings could happen. Finally, you should use `diff` instead of all the 100s. – Cameron Aug 12 '14 at 19:18
  • @Cameron, I edited the code to show what triggers the opening of the lightbox and where the event_last_occurrence_time is set. I realize it wasn't clear. elapsed time is incremented by 0.1 ms. – Nona Aug 12 '14 at 19:27

0 Answers0