var currentvisual = 0;
var interval;

function switchimage(id)
{
    document.getElementById("VisualButton_1").removeAttribute("class")
    document.getElementById("VisualButton_2").removeAttribute("class")
    document.getElementById("VisualButton_3").removeAttribute("class")
    document.getElementById("VisualButton_1").removeAttribute("className")
    document.getElementById("VisualButton_2").removeAttribute("className")
    document.getElementById("VisualButton_3").removeAttribute("className")
    
    document.getElementById("VisualButton_" + id).setAttribute('class','Active')
    document.getElementById("VisualButton_" + id).setAttribute('className','Active')
    
    if (currentvisual != id) {
        setOpacity(100,'down', "ImageVisual_" + currentvisual);
        setOpacity(0,'up', "ImageVisual_" + id);
    }
    currentvisual = id;
    
}

function mousoverButton(id)
{
    clearInterval(interval);
    switchimage(id)
}
function mousoutButton()
{
    interval = setInterval("nextImage()", 5000 );
}

function startCarrousel()
{
    interval = setInterval("nextImage()", 5000 );
}

function nextImage()
{
    var newimage;
    if (currentvisual == 3)
        newimage = 1;
    else
        newimage = currentvisual + 1;
    
    switchimage(newimage);
}

function setOpacity(count, direction, id) {
    //set the opacity
    changeOpac(count, id);

    //recall this function
    if (direction == 'down') {
        if (count > 0) {
            setTimeout("setOpacity(" + (count - 10) + ",'" + direction + "', '" + id + "')",1);
        }
    }
    if (direction == 'up') {
        if (count < 100) {
            setTimeout("setOpacity(" + (count + 10) + ",'" + direction + "', '" + id + "')",1);
        }
    }
}

//change the opacity for different browsers
function changeOpac(opacity, id) {
    if (document.getElementById(id)) {
        var object = document.getElementById(id).style;
        object.opacity = (opacity / 100);
        object.MozOpacity = (opacity / 100);
        object.KhtmlOpacity = (opacity / 100);
        object.filter = "alpha(opacity=" + opacity + ")";
        
        if (opacity == 0) {
            hideElement(id);
        }
        else {
            displayElement(id);
        }
        
    }
}