/* We need to know if we are dealing with IE or another browser */
var ie5=(document.getElementById && document.all);

var nPlus = 5;          //the % of fading for each step
var speed = 50;         //the speed
var waitTime = 5000;

var nOpac = 0;

/* This code should be replaced by PHP code which creates the
DIV elements and the eventList array */
var eventList = new Array;
eventList[0] = 'event1';
eventList[1] = 'event2';

var lastEvent = 0;
var nextEvent = 0;
var fadeEventId;

function FadeEvent(eventId) {
    if (!(eventId === undefined)) fadeEventId = eventId;
    var obj = document.getElementById(fadeEventId);
    if (!obj) return;

    nOpac += nPlus;
    /* Reverse the opacity if needed */
    if (nOpac == 100 || nOpac == 0) {
        nPlus *= -1;

    }
    if(ie5){
       obj.style.filter="alpha(opacity=" + nOpac + ")";
	   obj.filters.alpha.opacity = nOpac;
    } else {
	    obj.style.MozOpacity = (nOpac / 100);
        obj.style.KhtmlOpacity = (nOpac / 100);
    }

    if (nOpac < 100 && nOpac > 0) {
        setTimeout('FadeEvent()',speed);
    } else if (nOpac == 100) {
        setTimeout('ShowEvents()', waitTime);
    } else {
        ShowEvents();
    }
}

function ShowEvents() {
    /* Fade out the last Event */
    var lastObj = document.getElementById(eventList[lastEvent]);
    var nextObj = document.getElementById(eventList[nextEvent]);
    if (nOpac == 100) {
        FadeEvent(eventList[lastEvent]);
        nextEvent++;
        if (nextEvent >= eventList.length) nextEvent = 0;
    }
    if (nOpac == 0) {
        if (lastObj) lastObj.style.display = 'none';
        if (nextObj) nextObj.style.display = 'block';
        FadeEvent(eventList[nextEvent]);
        lastEvent = nextEvent;
    }
}

/* Start showing the events */
ShowEvents();