/* Javascript for fading logos in the FMTC website */

//SETTINGS:
//All time in milliseconds

var timeShown = 5000    //time each logo is shown
var timeFading = 1000   //time it takes for a logo to fade to the next

//CODE:
function startLogos() {
    var logoContainer = document.getElementById('logoContainer');
    var images = logoContainer.getElementsByTagName('DIV');

    if (images.length > 0) {
        images[0].style.display = '';
        window.setTimeout(function() {
            showNextlogo(images, 0);
        }, timeShown);
    }
}

function showNextlogo(images, currentIndex) {
    var nextIndex = currentIndex + 1;

    if (nextIndex >= images.length) nextIndex = 0;

    var currentLogo = images[currentIndex];
    var nextLogo = images[nextIndex];

    currentLogo.style.zIndex = '5'
    nextLogo.style.zIndex = '15'
    nextLogo.style.display = '';
    nextLogo.style.opacity = 0;
    nextLogo.style.filter = "alpha(opacity=0)";
    
    window.setTimeout(getFadeFunction(currentLogo, nextLogo, 1.0), (timeFading / 20));
    window.setTimeout(function() {
        showNextlogo(images, nextIndex);
    }, timeShown + timeFading);
}

getFadeFunction = function(currentLogo, nextLogo, percentage) {
    return function() {
        var currentOpacity = Math.floor(percentage * 100);
        var nextOpacity = 100 - currentOpacity;

        nextLogo.style.opacity = nextOpacity / 100;
        nextLogo.style.filter = "alpha(opacity=" + nextOpacity + ")";

        if (percentage > 0) {
            window.setTimeout(getFadeFunction(currentLogo, nextLogo, percentage - 0.05), (timeFading / 20));
        } else {
            currentLogo.style.display = 'none';
        }
    }
}