﻿/*******************************************************
Author: Ruben Canton
Website: www.rubencanton.com
Date: 04/11/2011
*******************************************/

//Consts:
var POPUP_CLOSEBTN = ".popupCloseBTN"; // You can use this to set some object as the close button using a style.
//Global
var popup_pnls = []; // array with the popups

$(document).ready(function () {
    $(".launchAsPopup").launchAsPopup();
});

(function ($) {
    $.fn.launchAsPopup = function (options) {
        var settings = {
            showDuration: 800,
            closeDuration: 200,
            width: 0,
            height: 0,
            top: 200,
            border: '2px solid #cecece',
            padding: 20,
            backgroundProp: '#FFF', //Note this refers to the popup css background property, not to the background panel

            //background ops:
            useBG: true,
            bgColor: "#000",
            bgOpacity: 0.7,
            hideBGOnClick: true,

            //To add
            hidePreviousPopups: false,
            hidePreviousBackgrounds: true
        };

        $(POPUP_CLOSEBTN).click(function () { hide_popup(); });

        return this.each(function () {
            if (options) { $.extend(settings, options); }

            //Setting properties:
            $(this).attr("style", "display:none;position:absolute;z-index:100;"); // basic styles
            if (settings.width > 0) { $(this).width(settings.width); }
            if (settings.height > 0) { $(this).height(settings.height); }
            $(this).css("background", settings.backgroundProp);
            $(this).css("border", settings.border);
            $(this).css("padding", settings.padding + "px");
            $(this).css("_position", "absolute"); //ie6 hack

            //Setting background:
            var popup_bg = getBackground(); //I need to push something in the array.
            if (settings.useBG) {
                $(popup_bg).css({ "opacity": settings.bgOpacity });
                $(popup_bg).fadeIn(settings.showDuration);
            }
            if (settings.hidePreviousBackgrounds) { hidePreviousBGs(); }

            //Showing popup:
            centerPopup(this,popup_bg);
            $(this).fadeIn(settings.showDuration);
            if (settings.hidePreviousPopups) { hidePreviousPopups(); }

            //Pushing to array:
            popup_pnls.push({ popup: this, bg: popup_bg }); //, settings: this.settings
        });


        function getBackground() {
            var bg = $(document.createElement('div'));
            $("body").append(bg);
            if (settings.hideBGOnClick) { bg.click(function () { hide_popup(); }); }
            if (!settings.useBG) { settings.bgColor = "transparent"; }

            // Styles (display:none by default):
            bg.attr("style", "display:none; position:fixed;height:100%;width:100%;top:0;left:0;background:" + settings.bgColor + ";border:1px solid #cecece;z-index:99;");
            bg.css("_position", "absolute"); //ie6 hack.

            return $(bg);
        }

        function centerPopup(popup_pnl, bg) {
            var windowWidth = document.documentElement.clientWidth;
            var windowHeight = document.documentElement.clientHeight;
            var popupWidth = $(popup_pnl).width();

            $(popup_pnl).css("left", (windowWidth / 2) - (popupWidth / 2));
            if ($(popup_pnl).css("top") == 'auto') { $(popup_pnl).css({ "top": settings.top + "px" }); } //If there is a hacked top, it will respect it.
            $(bg).css("height", windowHeight); // hack for IE6
        }

        function hidePreviousBGs() {
            for (x in popup_pnls) {
                $(popup_pnls[x].bg).hide(0);
            }
        }

        function hidePreviousPopups() {
            for (x in popup_pnls) {
                $(popup_pnls[x].popup).hide(0);
            }
        }

        function hide_popup() {
            pop = popup_pnls.pop();

            $(pop.bg).fadeOut(settings.closeDuration);
            if (settings.hidePreviousBackgrounds && popup_pnls.length > 0) {
                $(popup_pnls[popup_pnls.length - 1].bg).show(0);
            }

            $(pop.popup).fadeOut(settings.closeDuration);
            if (settings.hidePreviousPopups && popup_pnls.length > 0) {
                $(popup_pnls[popup_pnls.length - 1].popup).show(0);
            }
        }
    };
})(jQuery);
