var divsArray = new Array(4);
divsArray[0] = "div-img-header-PW";
divsArray[1] = "div-img-header-energy";
divsArray[2] = "div-img-header-telecom";
divsArray[3] = "div-img-header-auto";

var btnArray = new Array(4);
btnArray[0] = "btnPW";
btnArray[1] = "btnEnergy";
btnArray[2] = "btnTelecom";
btnArray[3] = "btnAuto";

var rollon = 1;
var timer;
var opTimer;
var crtDiv = 0;
var divsFrecv = 6000; //6 sec
var fromOpacity = 0;
var toOpacity = 100;
var time = 2000; //2 sec
var fps = 10;
var crtZindex = 4000;
var nextZindex = 4001;
var crtDiv_op = 0;
var nextDiv_op = 0;


InitializeDivs();


function SetOpacity(elem, opacityAsInt) {
    var opacityAsDecimal = opacityAsInt;

    if (opacityAsInt > 100)
        opacityAsInt = opacityAsDecimal = 100;
    else if (opacityAsInt < 0)
        opacityAsInt = opacityAsDecimal = 0;

    opacityAsDecimal /= 100;
    if (opacityAsInt < 1)
        opacityAsInt = 1; // IE7 bug, text smoothing cuts out if 0

    if (elem != null) {
        elem.style.opacity = opacityAsDecimal;
        elem.style.filter = "alpha(opacity=" + opacityAsInt + ")";
    }
}

function FadeOpacity(currentDiv, nextDiv, fromOpacity, toOpacity, time, fps) {
    var steps = Math.ceil(fps * (time / 1000));
    var delta = (toOpacity - fromOpacity) / steps;

    FadeOpacityStep(currentDiv, nextDiv, 0, steps, fromOpacity, delta, (time / steps));
}

function FadeOpacityStep(currentDiv, nextDiv, stepNum, steps, fromOpacity, delta, timePerStep) {
    var objNextDiv = document.getElementById(nextDiv);
    if (objNextDiv != null) objNextDiv.style.visibility = '';
    var objCurrentDiv = document.getElementById(currentDiv);
    if (objCurrentDiv != null) objCurrentDiv.style.zIndex = crtZindex;
    if (objNextDiv != null) objNextDiv.style.zIndex = nextZindex;
    SetOpacity(document.getElementById(nextDiv), Math.round(parseInt(fromOpacity) + (delta * stepNum)));
    if (stepNum <= steps) {
        opTimer = setTimeout("FadeOpacityStep('" + currentDiv + "', '" + nextDiv + "', " + (stepNum + 1) + ", " + steps + ", " + fromOpacity + ", " + delta + ", " + timePerStep + ");", timePerStep);
    }
    else {
        if (currentDiv != nextDiv) {
            document.getElementById(currentDiv).style.visibility = 'hidden';
        }
    }
}

function InitializeDivs() {
    if (divsArray.length > 0) {
        var firstDiv = document.getElementById(divsArray[0]);

        if (firstDiv != null) {
            firstDiv.style.visibility = ''; //display first div
            ChangeButtons(0); //set on first button
            var objDiv;
            for (var i = 1; i < divsArray.length; i++) {
                objDiv = document.getElementById(divsArray[i]);
                if (objDiv != null) objDiv.style.visibility = 'hidden';
            }

            timer = setTimeout("ChangeDiv()", divsFrecv);
        }
        else {
            //page is not loaded yet
            timer = setTimeout("InitializeDivs()", 30);
        }
    }
}

function ChangeDiv() {
    if (rollon == 1) {
        var nextDiv = crtDiv + 1;
        if (nextDiv >= divsArray.length) {
            nextDiv = 0;
        }
        ChangeButtons(nextDiv);

        crtDiv_op = crtDiv;
        nextDiv_op = nextDiv;
        FadeOpacity(divsArray[crtDiv], divsArray[nextDiv], fromOpacity, toOpacity, time, fps)

        crtDiv = nextDiv;

        timer = setTimeout(" ChangeDiv()", divsFrecv);
    }
}

function StopShow() {
    rollon = 0;
    clearTimeout(timer);
}

function SetCurrentStep(nextDiv) {
    if (nextDiv != crtDiv) {
        rollon = 0;
        clearTimeout(timer);
        StopOpacityTimer();
        ChangeButtons(nextDiv);
        crtDiv_op = crtDiv;
        nextDiv_op = nextDiv;
        FadeOpacity(divsArray[crtDiv], divsArray[nextDiv], fromOpacity, toOpacity, time, fps)

        crtDiv = nextDiv;

        StopShow();
    }
}

function ChangeButtons(nextDiv) {
    var crtBtn = document.getElementById(btnArray[crtDiv]);
    var newCss = "";
    if (crtBtn != null) {
        var crtBtnCss = crtBtn.attributes["class"].value;
        newCss = crtBtnCss.replace("img-header-button-on", "img-header-button")
        crtBtn.setAttribute("class", newCss);
    }
    var nextBtn = document.getElementById(btnArray[nextDiv]);
    if (nextBtn != null) {
        var nextBtnCss = nextBtn.attributes["class"].value;
        newCss = nextBtnCss.replace("img-header-button", "img-header-button-on")
        nextBtn.setAttribute("class", newCss);
    }
}

function StopOpacityTimer() {
    clearTimeout(opTimer);
    //document.getElementById(divsArray[crtDiv_op]).style.visibility = 'hidden';
    //var elem = document.getElementById(divsArray[nextDiv_op]);
    //SetOpacity(elem, 1);
}