function animateMeFirst() {
    var currentImage = $('#animation-image-' + Index);
    currentImage.css('opacity', 0);
    currentImage.show();
    currentImage.load(imageLoaded);
}

function imageLoaded(event) {
    animation(event.target);
};

function animateMe() {
    var currentSlide = Slides[Index];
    var currentImage = $('#animation-image-' + Index);
    currentImage.css('opacity', 0);
    currentImage.show();
    animation(currentImage);
}

function animation(currentImage) {
    var currentSlide = Slides[Index];
    $(currentImage).animate({ opacity: 1 }, { queue: false, duration: BlendTime * 1000,
        complete: function () {
            if (currentSlide.SlideCaption != "") {
                $('#animation').append(
				$('<div/>', {
				    text: currentSlide.SlideCaption
				})
				  .addClass('imageCaption')
				)
                $('.imageCaption').css({ 'top': '100px', 'position': 'absolute', 'opacity': '0', 'z-index': '99', 'color': '#ffffff', 'font-size': '24px', 'line-height': '60px', 'font-weight': 'bold', 'padding-left': '20px', 'background': 'url(fileadmin/images/transparent.png)', 'height': '60px', 'width': Width });
                $('.imageCaption').show();
                $('.imageCaption').animate({ opacity: 1 }, { queue: false, duration: 1500 });
                $('.imageCaption').animate({ top: 190 }, 1000);
            }

        }
    });

    switch (currentSlide.SlideDirection) {
        case "Top":
            $(currentImage).css({ 'top': '0', 'left': '0' });
            $(currentImage).css({ 'top': -$(currentImage).innerHeight() + Height });
            $(currentImage).animate({ "top": "0" }, currentSlide.SlideTime * 1000, slideFadeOut);
            break;
        case "Left":
            $(currentImage).css({ 'top': '0', 'left': '0' });
            $(currentImage).css({ 'margin-left': -$(currentImage).innerWidth() + Width });
            $(currentImage).animate({ left: $(currentImage).innerWidth() - Width }, currentSlide.SlideTime * 1000, slideFadeOut);
            break;
        case "Right":
            $(currentImage).css({ 'top': '0', 'left': '0' });
            $(currentImage).animate({ left: -$(currentImage).innerWidth() + Width }, currentSlide.SlideTime * 1000, slideFadeOut);
            break;
        case "Bottom":
            $(currentImage).css({ 'top': '0', 'left': '0' });
            $(currentImage).animate({ top: -$(currentImage).innerHeight() + Height }, currentSlide.SlideTime * 1000, slideFadeOut);
            break;
    }

}




function slideFadeOut() {
    var currentSlide = Slides[Index];
    var currentImage = $('#animation-image-' + Index);

    $('.imageCaption').fadeOut(BlendTime * 1000, function () {
        $('.imageCaption').remove();
    });

    currentImage.fadeOut(BlendTime * 1000, function () {
        if (Index < Slides.length - 1) {
            Index++;
            animateMe();
        }
        else {
            if (Repeat == true) {
                Index = 0;
                animateMe();
            }
        }
    });
}

function checkBrowserName(name) {
    var agent = navigator.userAgent.toLowerCase();
    if (agent.indexOf(name.toLowerCase()) > -1)
        return true;

    return false;
}

$(document).ready(function () {

    $('#animation').css({ 'background-color': BlendColor, 'width': Width, 'height': Height, 'overflow': 'hidden', 'position': 'relative' });
    $('#animation img').css({ 'position': 'absolute', 'display': 'none'});
    if (checkBrowserName('MSIE')) {
        animateMe();
    }
    else {
        animateMeFirst();
    }

});