﻿var pauseBanner = false;

jQuery(document).ready(function ($) {
    $.ajax({
        type: "GET",
        url: "/DynamicContent/home-banners.xml",
        dataType: "xml",
        processData: false,
        contentType: "text/xml",
        success: function (data, textStatus) {
            var banners = new Array();

            $(data).find('HomeBanner').each(function () {
                var banner = new Object();

                banner.ImageUrl = $(this).find('ImageUrl').text();
                banner.ImageMap = $(this).find('ImageMap').text();

                banners.push(banner);
            });

            InsertBannerElements(banners);
        }
    });
});

function InsertBannerElements(banners) {
    for (var i = 0; i < banners.length; i++) {
        var banner = banners[i];

        var html = '';
        html += '<div id="banner-container-' + i + '" style="position: absolute; top: 0; left: 0;">'

        if (banner.ImageMap.length > 0) {
            html += '<map id="banner-image-map-' + i + '" name="banner-image-map-' + i + '">';
            html += banner.ImageMap;
            html += '</map>';
            html += '<img src="' + banner.ImageUrl + '" alt="" usemap="#banner-image-map-' + i + '" />';
        }
        else {
            html += '<img src="' + banner.ImageUrl + '" alt="" />';
        }

        html += '</div>'

        jQuery("div#banner").append(html);

        jQuery("#banner-container-" + i).hide();

        html = '<li id="banner-button-' + i + '"><a href="#" onlick="return false;">' + (i + 1) + '</a></li>';

        jQuery("ol#bannerNavigation").append(html);

        jQuery("#banner-button-" + i).click(function () {
            var id = jQuery(this).attr("id");
            var index = parseInt(id.replace("banner-button-", ""));

            ShowBanner(index);
        });
    }

    RotateBanner(true, banners)
}

function RotateBanner(firstRun, banners) {
    if (!pauseBanner) {
        var timer = 5000;

        if (firstRun) {
            jQuery("#banner-container-0").addClass("active").fadeIn("slow");
            jQuery("#banner-button-0").addClass("active");
        }
        else {
            var previousId = jQuery("div#banner .active").attr("id");
            var previousIndex = parseInt(previousId.replace("banner-container-", ""));
            var nextIndex = previousIndex + 1;

            if (nextIndex >= banners.length) {
                nextIndex = 0;
            }

            jQuery("div#banner .active").removeClass("active").fadeOut("slow");
            jQuery("ol#bannerNavigation .active").removeClass("active");

            jQuery("#banner-container-" + nextIndex).addClass("active").fadeIn("slow");
            jQuery("#banner-button-" + nextIndex).addClass("active");
        }

        setTimeout(function () { RotateBanner(false, banners); }, timer);
    }
}

function ShowBanner(activeIndex) {
    pauseBanner = true;

    jQuery("div#banner .active").removeClass("active").fadeOut("slow");
    jQuery("ol#bannerNavigation .active").removeClass("active");

    jQuery("#banner-container-" + activeIndex).addClass("active").fadeIn("slow");
    jQuery("#banner-button-" + activeIndex).addClass("active");
}
