var currentPanel = 0;
var autoRotate = 1;
var highIndex = 5;
var pending = 1;

function showPanel(panelIndex, autoRequest) {
    pending = pending -1;
    if (pending < 0) {
        pending = 0;
    }
    if ((autoRotate == 1) || (autoRequest == 0)) {
        var prevPanelIndex = panelIndex - 1;
        if (prevPanelIndex < 0) {
            prevPanelIndex = highIndex;
        }
        currentPanel = panelIndex;
        document.getElementById('selector' + prevPanelIndex).className = "panelSelector";
        opacity('frontPagePanelContents', 100, 0, 400);
        setTimeout(function() { ajaxRequest("/panels/" + panelIndex + ".aspx",'frontPagePanelContents') }, 400);
        setTimeout(function() { opacity('frontPagePanelContents', 0, 100, 400) }, 500);
        document.getElementById('selector' + panelIndex).className = "panelSelectorActive";
        if (autoRotate == 1) {
            var nextPanel = currentPanel + 1;
            if (nextPanel > highIndex) {
                nextPanel = 0;
            }
            setTimeout(function() { showPanel(nextPanel, 1) }, 8000);
            pending = pending + 1;
        }
    }
}

function showPanelManual(panelIndex) {
    document.getElementById('selector' + currentPanel).className = "panelSelector";
    if (autoRotate == 1) {
        pausePlayPanels();
    }
    showPanel(panelIndex, 0);
}

function opacity(id, opacStart, opacEnd, millisec) {
    //speed for each frame
    var speed = Math.round(millisec / 100);
    var timer = 0;

    //determine the direction for the blending, if start and end are the same nothing happens
    if(opacStart > opacEnd) {
        for(i = opacStart; i >= opacEnd; i--) {
            setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed));
            timer++;
        }
    } else if(opacStart < opacEnd) {
        for(i = opacStart; i <= opacEnd; i++)
            {
            setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed));
            timer++;
        }
    }
}

//change the opacity for different browsers
function changeOpac(opacity, id) {
    var object = document.getElementById(id).style;
    object.opacity = (opacity / 100);
    object.MozOpacity = (opacity / 100);
    object.KhtmlOpacity = (opacity / 100);
    object.filter = "alpha(opacity=" + opacity + ")"; 
}

function pausePlayPanels() {
    if (autoRotate == 1) {
        autoRotate = 0;
        document.getElementById('pausePlay').style.backgroundImage = "url(/siteimages/panels/play.png)";
    } else {
        if (pending == 0) {
            autoRotate = 1;
            document.getElementById('pausePlay').style.backgroundImage = "url(/siteimages/panels/pause.png)";
            var nextPanel = currentPanel + 1;
            if (nextPanel > highIndex) {
                nextPanel = 0;
            }
            showPanel(nextPanel, 1);
        } else {
            document.getElementById('pausePlay').style.backgroundImage = "url(/siteimages/panels/play.png)";
        }
    }
}
