/// <summary>
/// Templates used by popups.
/// </summary>
var PopupTemplates = {
    IFrame: "<iframe scrolling='no' frameborder=\"0\" class=\"{0}\" src=\"javascript:'';\"></iframe>",
    Popup: "<div class=\"popup {0}\"><div class=\"header\"><div class=\"block\"></div><a class=\"normalFont\" href=\"javascript:void(0);\" title=\"Normal Font\"><span>Normal Font</span></a><a class=\"largerFont\" href=\"javascript:void(0);\" title=\"Larger Font\"><span>Larger Font</span></a><a class=\"largestFont\" href=\"javascript:void(0);\" title=\"Largest Font\"><span>Largest Font</span></a><a class=\"close\" href=\"javascript:void(0);\" title=\"Close\"><span>Close</span></a></div><div class=\"message\">{1}</div><div class=\"footer\"></div></div>"
};

var PopupActive = false;

var PopupPosition = {
    /// <summary>Centered in the view port.</summary>
    CenterWindow: 0,
    /// <summary>Left of the owner element.</summary>
    OwnerLeft: 1,
    /// <summary>Below the owner element.</summary>
    OwnerBottom: 2,
    /// <summary>In a custom location, provided by a map.</summary>
    Custom: 3,
    /// <summary>Over the owner element.</summary>
    Owner: 4
};

var PopupSettings = {
    FontSize: null,
    Overlay: null,
    OverlayMetrics: null,
    Popup: null,
    PopupMetrics: null
};

String.prototype.format = function() {
    /// <summary>
    /// Formats the given string with the arguments specified.
    /// </summary>
    /// <example>
    /// var formattedString = "Hello {0}".format("Matt");
    /// </example>
    var str = this;
    for (var i = 0; i < arguments.length; i++) {
        str = str.replace("{" + i + "}", arguments[i]);
    }

    return str;
};

var PreloadImages = function() {
    for (var i = 0; i < arguments.length; i++) {
        var image = $("<img />").attr("src", arguments[i]).css({ display: "none" });
        $("body").append(image);
    }
};

var RefreshOverlay = function() {
    var metrics = PopupSettings.OverlayMetrics;
    if (metrics) {
        var offset = { top: 0, left: 0 }
        var win = $(window);
        var width = win.width();
        var height = win.height();
        if (metrics.Target != null) {
            offset = metrics.Target.offset();
            width = metrics.Target.innerWidth();
            height = metrics.Target.innerHeight();
        } else {
            width += win.scrollLeft();
            height += win.scrollTop();
        }
        if (!($.browser.msie && $.browser.version == "6.0")) {
            width = $(document).width();
            height = $(document).height();
        }

        ResizeOverlay(offset.top, offset.left, width, height, metrics.Target);
        PopupSettings.OverlayMetrics = {
            Top: offset.top,
            Left: offset.left,
            Width: width,
            Height: height,
            Target: metrics.Target
        }
    }
};

var ResizeOverlay = function(top, left, width, height, target) {
    $("iframe.controlOverlay").css({
        position: "absolute",
        top: top,
        left: left,
        width: width,
        height: height,
        backgroundColor: "#fff",
        zIndex: 100
    });

    PopupSettings.Overlay = $("iframe.controlOverlay");
    PopupSettings.OverlayMetrics = {
        Top: top,
        Left: left,
        Width: width,
        Height: height,
        Target: target
    };
};

var RePositionPopup = function() {
    var metrics = PopupSettings.PopupMetrics;
    if (metrics) {
        PositionPopup(metrics.Target, metrics.Position, metrics.PositionMap);
    }
};

var PositionPopup = function(target, position, positionMap) {
    var offset = target.offset();
    var win = $(window);
    var el = $("div.popup").css({
        position: "absolute",
        top: 0,
        left: 0,
        zIndex: 102
    });

    var top = 0;
    var left = 0;
    if (position == PopupPosition.CenterWindow) {
        top = (win.height() / 2) + win.scrollTop() - (el.height() / 2);
        left = (win.width() / 2) + win.scrollLeft() - (el.width() / 2);
    } else if (position == PopupPosition.OwnerLeft) {
        top = offset.top;
        left = offset.left + target.width() + 10;
    } else if (position == PopupPosition.Owner) {
        top = offset.top;
        left = offset.left;
    } else if (position == PopupPosition.OwnerBottom) {
        top = offset.top + target.height() + 10;
        left = offset.left;
    } else if (position == PopupPosition.Custom) {
        top = positionMap.top;
        left = positionMap.left;
    }

    var maxTop = win.height() + win.scrollTop();
    var maxLeft = win.width() + win.scrollLeft();

    var testTop = top + el.height();
    if (testTop > maxTop) { top = (maxTop - (el.height() + 5)); }

    var testLeft = left + el.width();
    if (testLeft > maxLeft) { left = (maxLeft - (el.width() + 5)); }

    el.css({
        top: top,
        left: left
    });

    PopupSettings.Popup = el;
    PopupSettings.PopupMetrics = {
        Top: top,
        Left: left,
        Width: el.width(),
        Height: el.height(),
        Target: target,
        Position: position,
        PositionMap: positionMap
    };
};

var CreateOverlay = function(target, fade) {
    /// <summary>Creates an overlay above the target element.</summary>
    /// <param name="target">The target element.</param>

    PopupActive = true;

    var offset = { top: 0, left: 0 }
    var win = $(window);
    var width = win.width();
    var height = win.height();
    if (target != null) {
        offset = target.offset();
        width = target.width();
        height = target.height();
    } else {
        width += win.scrollLeft();
        height += win.scrollTop();
    }
    if (!($.browser.msie && $.browser.version == "6.0")) {
        width = $(document).width();
        height = $(document).height();
    }

    var html = PopupTemplates.IFrame.format("controlOverlay");
    $("body").append(html);
    ResizeOverlay(offset.top, offset.left, width, height, target == null ? null : target);

    if (fade) {
        $("iframe.controlOverlay").css("opacity", 0.75);
    }
};

var DestroyOverlays = function() {
    /// <summary>Removes all existing overlays.</summary>
    $("iframe.controlOverlay").remove();

    PopupSettings.Overlay = null;
    PopupSettings.OverlayMetrics = null;
    PopupSettings.Popup = null;
    PopupSettings.PopupMetrics = null;

    PopupActive = false;
};

var CreatePopup = function(cssClass, message, target, position, positionMap) {
    var win = $(window);
    CreateOverlay(null, true);
    
    var html = PopupTemplates.Popup.format(cssClass, message);
    $("body").append(html);
    PositionPopup(target, position, positionMap);

    $("div.popup .close, div.popup .goBack").live("click", function() {
        $("div.popup").remove();
        DestroyOverlays();
    });

    $("div.popup .normalFont").click(function() {
        $("div.popup .message").removeClass("largerFont largestFont").addClass("normalFont");
        PopupSettings.FontSize = "normalFont";
    });

    $("div.popup .largerFont").click(function() {
        $("div.popup .message").removeClass("normalFont largestFont").addClass("largerFont");
        PopupSettings.FontSize = "largerFont";
    });

    $("div.popup .largestFont").click(function() {
        $("div.popup .message").removeClass("normalFont largerFont").addClass("largestFont");
        PopupSettings.FontSize = "largestFont";
    });

    if (PopupSettings.FontSize != null) {
        $("div.popup .message").addClass(PopupSettings.FontSize);
    }
};

var CreateHelpPopup = function(message, target, position, positionMap) {
    CreatePopup("popupHelp", message, target, position, positionMap);
};

var CreateErrorPopup = function(message, target, position, positionMap) {
    CreatePopup("popupError", message, target, position, positionMap);
};

var CreateModalPopup = function(message, target, position, positionMap) {
    CreatePopup("popupModal", message, target, position, positionMap);
};

$(function() {
    PreloadImages("/Images/SmallControl/PopupSprite.png");
    $(window).resize(function() {
        if (PopupSettings.Overlay != null) {
            RefreshOverlay();
            RePositionPopup();
        }
    });
    $(window).scroll(function() {
        if (PopupSettings.Overlay != null) {
            RePositionPopup();
        }
    });
});