var Sitepoint_MagicPopup = function(wrapEl, config) {
    this.config = config;

    var popup = function(el) {
        var initialHeight = 10;
        
        var a = $("#" + $(el).attr("rel"));
        $(el).parent().append(a);

        // screen dimensions:
        var wh = $(window).height();
        var ww = $(window).width();
        var th = $(a).height() || $(a).attr("initialHeight");
        var tw = $(a).width() || $(a).attr("initialWidth");   
        var ol = $(el).position()['left'];
        var ot = $(el).position()['top'];

        var shim = $("<div class='magicpopup_shim'></div>").css({
            height: $(document).height() + "px",
            width: $(document).width() + "px"
        });
        $("body").append(shim);


        $(a).css({
            left: ol + "px",
            top: ot + "px",
            width: $(el).width() + "px",
            height: initialHeight + "px"
        });
        
        $(a).animate({
            height: th,
            width: tw,
            left: Math.ceil((ww - tw) / 2),
            top: Math.ceil((wh - th) / 2 + (window.scrollY || document.documentElement.scrollTop))
        });
        $(shim).click(function(){
            $(a).stop().animate({
                height: initialHeight,
                width: $(el).width(),
                left: ol,
                top: ot
            }, function() {
                 $(a).css({
                    display: "none",
                    height: th + "px",
                    width: tw + "px"
                });
            });    
            $(shim).animate({
                opacity: 0
            }, function() {
                $(shim).remove();
            });

            return false;
        }).animate({
            opacity: 0.7
        });
    };

    $(wrapEl).click(function() {
        popup($(this));
        return false;
    });
};

// jquery plugin declaration:
// @example $("#someMenu").makeCarousel(config);
//new Carousel(document.getElementById(""), config);

jQuery.fn.spPopup = function(config) {
    return this.each(function(){
        new Sitepoint_MagicPopup(this, config);
    });
};