﻿var TimeToFade = 650.0, ImgDisplayTime = 4000.0, TimeoutDelay = 50;
var CurrentImageIndex = 0, LastImageIndex = 4;
var DivImg1Id = 'divFP1', DivImg2Id = 'divFP2', DivImg3Id = 'divFP3', DivImg4Id = 'divFP4', DivImg5Id = 'divFP5';

function ChangeImage()
{
    var div1 = document.getElementById(DivImg1Id);
    var div2 = document.getElementById(DivImg2Id);
    var div3 = document.getElementById(DivImg3Id);
    var div4 = document.getElementById(DivImg4Id);
    var div5 = document.getElementById(DivImg5Id);
    if (div1 && div2 && div3 && div4 && div5)
    {
        var prevImgIndex = CurrentImageIndex;
        var prevImgDivId = '', nextImgDivId = '';
        CurrentImageIndex += 1;
        if (CurrentImageIndex > LastImageIndex)
        {
            CurrentImageIndex = 0;
        }
        switch (prevImgIndex)
        {
            case 0:
                {
                    prevImgDivId = DivImg1Id;
                    break;
                }
            case 1:
                {
                    prevImgDivId = DivImg2Id;
                    break;
                }
            case 2:
                {
                    prevImgDivId = DivImg3Id;
                    break;
                }
            case 3:
                {
                    prevImgDivId = DivImg4Id;
                    break;
                }
            case 4:
                {
                    prevImgDivId = DivImg5Id;
                    break;
                }
        }
        switch (CurrentImageIndex)
        {
            case 0:
                {
                    nextImgDivId = DivImg1Id;
                    break;
                }
            case 1:
                {
                    nextImgDivId = DivImg2Id;
                    break;
                }
            case 2:
                {
                    nextImgDivId = DivImg3Id;
                    break;
                }
            case 3:
                {
                    nextImgDivId = DivImg4Id;
                    break;
                }
            case 4:
                {
                    nextImgDivId = DivImg5Id;
                    break;
                }
        }
        HideUnusedImage(DivImg1Id, prevImgDivId, nextImgDivId);
        HideUnusedImage(DivImg2Id, prevImgDivId, nextImgDivId);
        HideUnusedImage(DivImg3Id, prevImgDivId, nextImgDivId);
        HideUnusedImage(DivImg4Id, prevImgDivId, nextImgDivId);
        HideUnusedImage(DivImg5Id, prevImgDivId, nextImgDivId);
        FadeElement(prevImgDivId, nextImgDivId);
    }
}

function HideUnusedImage(divId, prevImgDivId, nextImgDivId)
{
    if ((divId != prevImgDivId) && (divId != nextImgDivId))
    {
        document.getElementById(divId).style.display = 'none';
    }
}

function FadeElement(elmId, nextElmId)
{
    var element = document.getElementById(elmId);
    if (element == null)
    {
        return;
    }
    if (element.FadeState == null)
    {
        if (element.style.opacity == null || element.style.opacity == '' || element.style.opacity == '1')
        {
            element.FadeState = 2;
        }
        else
        {
            element.FadeState = -2;
        }
    }
    if (element.FadeState == 1 || element.FadeState == -1)
    {
        element.FadeState = element.FadeState == 1 ? -1 : 1;
        element.FadeTimeLeft = TimeToFade - element.FadeTimeLeft;
    }
    else
    {
        element.FadeState = element.FadeState == 2 ? -1 : 1;
        element.FadeTimeLeft = TimeToFade;
        setTimeout("ExecFade(" + new Date().getTime() + ",'" + elmId + "','" + nextElmId + "')", TimeoutDelay);
    }
}

function ExecFade(lastTick, elmId, nextElmId)
{
    var curTick = new Date().getTime();
    var elapsedTicks = curTick - lastTick;
    var element = document.getElementById(elmId);
    if (element.FadeTimeLeft <= elapsedTicks)
    {
        element.style.opacity = element.FadeState == 1 ? '1' : '0';
        element.style.filter = 'alpha(opacity = ' + (element.FadeState == 1 ? '100' : '0') + ')';
        element.FadeState = element.FadeState == 1 ? 2 : -2;
        if ((element.FadeState == -2) && (nextElmId != ''))
        {
            document.getElementById(nextElmId).style.opacity = '0';
            document.getElementById(nextElmId).style.filter = 'alpha(opacity = 0)';
            document.getElementById(nextElmId).style.display = 'block';
            document.getElementById(elmId).style.display = 'none';
            FadeElement(nextElmId, '', '');
        }
        else if ((element.FadeState == 2))
        {
            setTimeout("ChangeImage()", ImgDisplayTime);
        }
        return;
    }
    element.FadeTimeLeft -= elapsedTicks;
    var newOpVal = element.FadeTimeLeft / TimeToFade;
    if (element.FadeState == 1)
    {
        newOpVal = 1 - newOpVal;
    }
    element.style.opacity = newOpVal;
    element.style.filter = 'alpha(opacity = ' + (newOpVal * 100) + ')';
    setTimeout("ExecFade(" + curTick + ",'" + elmId + "','" + nextElmId + "')", TimeoutDelay);
}


