var Count = 0;
var Intervalup;
var Intervalupdate;
var Reqest;

window.onload = function(){
    changeColor(0);
    countSet();
    Intervalup     = setInterval( countUp, 500 );
    Intervalupdate = setInterval( countUpdate, 1000 * 45);
}

function countUp(){
    var num = document.getElementById('count').innerHTML;
    if( (Count - num) > 0 ){
        num++;
        document.getElementById('count').innerHTML = num;
    }
    else {
        clearInterval( Intervalup );
        Intervalup = null;
    }
}

function countSet(){
    Reqest = createXmlHttp();
    if( Reqest == null ){
        throw('Cannot create XMLHttpRequest object.');
    }
    Reqest.onreadystatechange =  function (){
        if ( Reqest.readyState == 4 ) {
            if ( Reqest.status == 200 ) {
                document.getElementById('count').innerHTML = Reqest.responseText;
                Reqest = null;
            }
        }
    }
    Reqest.open("GET", "./count/index.cgi?countup", true);
    Reqest.setRequestHeader("If-Modified-Since", "Thu, 01 Jun 1970 00:00:00 GMT");
    Reqest.send('');
}

function countUpdate(){
    Reqest = createXmlHttp();
    Reqest.onreadystatechange =  function (){
        if ( Reqest.readyState == 4 ) {
            if ( Reqest.status == 200 ) {
                Count = Reqest.responseText;
                Reqest = null;
            }
        }
    }
    Reqest.open("GET", "./count", true);
    Reqest.setRequestHeader("If-Modified-Since", "Thu, 01 Jun 1970 00:00:00 GMT");
    Reqest.send('');
    if( !Intervalup ){
        Intervalup = setInterval( countUp, 500 );
    }
}

function createXmlHttp() {
    if ( window.XMLHttpRequest ) {
        return new XMLHttpRequest();
    }
    else if ( window.ActiveXObject ) {
        try {
            return new ActiveXObject("Msxml2.XMLHTTP");
        } catch(e) {
            return new ActiveXObject("Microsoft.XMLHTTP");
        }
    }
    else {
        return null;
    }
}

function changeColor(i){
    var color = new Array();
    color[0] = "#336699";
    color[1] = "#376a9d";
    color[2] = "#3b6ea1";
    color[3] = "#3f72a5";
    color[4] = "#4376a9";
    color[5] = "#477aad";
    color[6] = "#4b7eb1";
    color[7] = "#4f82b5";
    color[8] = "#5386b9";
    color[9] = "#578abd";
    color[10] = "#5b8ec1";
    color[11] = "#6699cc";

    document.getElementById('count').style.color = color[i];

    i++;

    if( i < color.length ) {
        setTimeout( "changeColor(" + i + ")", 60 );
    }
}