Question

Through jQuery and the use of an ajax get I have a working model of a javascript process that polls a url and will either timeout or return successfully. The url is serviced by a small embedded box with a local httpd on it.

A php script issues a restart, waits a second, and then we go into the javascript code.

Before we can start our ajax get, we need to wait a while (about 90 seconds) to be assured that the server httpd has actually shut down. Otherwise our poll will work – and then our web page will crash when the server dies.

So to wait I have tried a number of ideas. Unfortunately the wait must be modal, that is nothing should happen until we timeout. What seems to work is a simple sleep() abstraction:

function sleep(milliseconds)
{
    var start = new Date().getTime();
    for (var i = 0; i < 1e7; i++)
    {
        if ((new Date().getTime() - start) > milliseconds)
        {
            break;
         }
     }
}

i = 0;
var cText='';
for (i = 0; i < 90; i++)
{
    sleep(1000);
    cText=cText+'.';
    $("#waitmessage").html(MakeFlushable(cText));
}
$.ajaxSetup( ...

Unfortunately this operates differently across browsers. After 30 seconds or so IE crashes. Mozilla (8) becomes apoplectic and eventually recovers when the ajax completes.

Thinking that the browser needs some response (in the form of anything) I tried writing a dot to a div. There is no browser output until the ajax event completes. I then tried appending a bunch of \n characters (4000 of them) for each dot (MakeFlushable() does this). Still, the dots don’t appear until ajax is done.

Thinking back to the old days there was a 4gl called CA Visual Objects which provided a method for handing control back to the “engine” in order that other housekeeping tasks be attended to. Perhaps this is what’s needed in this case? Is there a javascript call that says “do any housekeeping and then give me back control”? My guess is that the div html is not sent to the browser because javascript is stuck in my tight loop, waiting…

Answer 1

Why not use setTimeout or setInterval to handle the timing for you?
Do the ajax handling in the callback method.

Something like:

var SecondsToWait = 90;

var secInterval = setInterval(oneSecIntervalHandler,1000);

function oneSecIntervalHandler() {
    if (--SecondsToWait > 0) {
       $("#waitmessage").html( $("#waitmessage").html() + '.');
    } else {
        clearInterval(secInterval);
        //doAjaxStuffNow
        $("#waitmessage").html("doAjaxStuffNow...<br/>$.ajaxSetup( ...");
    }

}

jsfiddle: http://jsfiddle.net/qSwyQ/