var $bannerDialog;
var rotators = new Array();

function BuildBannerItem(banner, imgWidth, imgHeight) {
    var bannerToolTip = (banner.ToolTip) ? banner.ToolTip : "";
    var $bannerItem = $("<li><img src=\"/Banners/" + banner.Image + "\" alt=\"" + bannerToolTip + "\" title=\"" + bannerToolTip + "\" style=\"padding-bottom: 20px;\" /></li>");

    if (banner.Link) {
        $bannerItem.find("img").wrap("<a href=\"" + banner.Link + "\"></a>");
    }

    if (imgHeight) {
        $bannerItem.find("img").attr("height", imgHeight);
    }

    if (imgWidth) {
        $bannerItem.find("img").attr("width", imgWidth);
    }
    
    return $bannerItem;
}

function CloseBannerPopup() {
    $.fancybox.close();
}

function GetBanners(section) {
    $.ajax({
        url: "/ws/GlobalServices.asmx/GetBanners",
        type: "POST",
        contentType: "application/json; charset=utf-8",
        data: "{ 'page': '" + section + "' }",
        dataType: "json",
        success: function(msg) {
            var config = msg.d;

            $bannerDialog = $("#dialog");

            if ($bannerDialog.length > 0 && config.Popup) {
                var $bannerItem = BuildBannerItem(config.Popup);

                var $dialogImage = $bannerItem.find("img");

                if ($bannerItem.find("a").size() > 0) {
                    $bannerDialog.append($bannerItem.find("a"));
                }
                else {
                    $bannerDialog.append($bannerItem.find("img"));
                }

                $dialogImage.load(function() {
                    $bannerDialog.removeAttr("style");

                    $.fancybox($bannerDialog,
                    {
                        'autoDimensions': true,
                        'transitionIn': 'none',
                        'transitionOut': 'none',
                        'onClosed': function() {
                            $bannerDialog.remove();
                        }
                    });

                    setTimeout("CloseBannerPopup();", 10000);
                });
            }

            for (var i = 0; i < config.Rotators.length; i++) {
                BuildRotator(config.Rotators[i], i);
            }

            setInterval("Rotate();", 1000);
        }
    });
}

function RotateBanners(current, $bannersRotator) {
    //Get next image, when it reaches the end, rotate it back to the first image
    var next = ((current.next().length) ? ((current.next().hasClass('show')) ? $bannersRotator.find('li:first') : current.next()) : $bannersRotator.find('li:first'));

    //Set the fade in effect for the next image, the show class has higher z-index
    next.css({ opacity: 0.0 })
	    .addClass('show')
	    .animate({ opacity: 1.0 }, 1000);

    //Hide the current image
    current.animate({ opacity: 0.0 }, 1000)
	       .removeClass('show');
}

function BuildRotator(rotator, rotatorIndex) {
    rotator.$container = $("div#" + rotator.DisplayName + " ul"); //attached
    rotator.elapsed = 0; //attached

    if (rotator.$container.length > 0) {
        if (rotator.Banners[0]) {
            rotators.push(rotator);

            for (var i = 0; i < rotator.Banners.length; i++) {
                var banner = rotator.Banners[i];

                var $bannerItem = BuildBannerItem(banner, 179, ((rotatorIndex == 1) ? 222 : 163));

                if (i == 0) {
                    $bannerItem.addClass("show");
                }

                rotator.$container.append($bannerItem);
            }

            //Set the opacity of all images to 0
            rotator.$container.find('li').css({ opacity: 0.0 });

            //Get the first image and display it (gets set to full opacity)
            rotator.$container.find('li:first').css({ opacity: 1.0 });
        }

        if (rotator.Banners.length == 0) {
            rotator.$container.parent().remove();
        }
    }
}

function Rotate() {
    for (var i = 0; i < rotators.length; i++) {
        var rotator = rotators[i];
        rotator.elapsed += 1000;
        
        var current = rotator.$container.find('li.show');
        var currentIndex = rotator.$container.find("li").index(current);

        if (rotator.Banners.length > 1 && rotator.elapsed == rotator.Banners[currentIndex].Delay) {
            RotateBanners(current, rotator.$container);

            rotator.elapsed = 0;
        }
    }
}