var currentFeature = 1;
var switcherIntervalID = 0;

function changeFeature(featureNum) {

    for (i = 0; i < document.getElementById('featureBar').getElementsByTagName("li").length; i++) {
        if (i + 1 == featureNum) {
            clearInterval(switcherIntervalID);
            document.getElementById('mainFeature' + (i + 1)).style.opacity = '0';
            document.getElementById('mainFeature' + (i + 1)).style.filter = 'alpha(opacity = 0)';
            document.getElementById('mainFeature' + (i + 1)).style.display = "block";
            document.getElementById('featureBar').getElementsByTagName("li")[i].className = "selected";
            fade('mainFeature' + (i + 1));
            currentFeature = i + 1;
            switcherIntervalID = setInterval("nextFeature()", 10000);
        }
        else {
            document.getElementById('mainFeature' + (i + 1)).style.opacity = '1';
            document.getElementById('mainFeature' + (i + 1)).style.filter = 'alpha(opacity = 100)';
            document.getElementById('mainFeature' + (i + 1)).style.display = "none";
            document.getElementById('featureBar').getElementsByTagName("li")[i].className = "";
        }
    }

}

function nextFeature() {

    if (currentFeature == document.getElementById('featureBar').getElementsByTagName("li").length) currentFeature = 0;
    changeFeature(currentFeature + 1);
}

switcherIntervalID = setInterval("nextFeature()", 10000);

var TimeToFade = 600.0;

function animateFade(lastTick, eid) {
    var curTick = new Date().getTime();
    var elapsedTicks = curTick - lastTick;

    var element = document.getElementById(eid);

    if (element.FadeTimeLeft <= elapsedTicks) {
        element.style.opacity = 1;
        element.style.filter = 'alpha(opacity = 100)';
        return;
    }

    element.FadeTimeLeft -= elapsedTicks;
    var newOpVal = element.FadeTimeLeft / TimeToFade;
    newOpVal = 1 - newOpVal;

    element.style.opacity = newOpVal;
    element.style.filter = 'alpha(opacity = ' + (newOpVal * 100) + ')';

    setTimeout("animateFade(" + curTick + ",'" + eid + "')", 33);
}

function fade(eid) {
    var element = document.getElementById(eid);
    if (element == null) return;
    element.FadeTimeLeft = TimeToFade;
    setTimeout("animateFade(" + new Date().getTime() + ",'" + eid + "')", 33);
}