/**************
Modal Popup
**************/
/*  Reusable modal popup object using jQuery.

    Example use:
        var modal = new ModalPopup({
            popupSelector: "#modal1", 
            triggerSelector: ".openModel",
            closeSelector:".closeModal"
        });
        
        All the options parameters are used as jQuery selectors. So all CSS3 selectors + jQuery extensions can be used.
        
        popupSelector - element containing the modal popup
        triggerselector - element(s) that will trigger the popup
        closeSelector - element(s) that will cause popup to close    
*/

//Set options for Modal Popup

var ModalPopup = function(options)        
{
    var popupSelector = options.popupSelector,
        closeSelector = options.closeSelector,
        triggerSelector = options.triggerSelector,
        opacity = options.opacity || 0.55,
        dynamic = options.dynamic || false,
        urlContent = options.urlContent || "",
        modalHeadline = options.modalHeadline || "",
        fadeSpeed = options.fadeSpeed || "slow",
        leftPopout = options.leftPopout || false,   
        smallPopup = popupSelector,
        center = (options.center === undefined) ? true : options.center,
        allSelectBoxes = $("select"),
        popupSelectBoxes = $("select", popupSelector);

    var overlayContent = '<div id="modalBackground">&nbsp;</div>';  //modal background code
    var overlay = '#modalBackground';    //Modal background ID
    var dynamicModalBox = '#modalBox';
    var modalClass = '.modalBox';
	// set up the events
    $(triggerSelector).click(showModal);
    $(triggerSelector).live('click', showModal);
    //$(window).resize(AdjustOverlay);
    if(center === true)
    {
        $(window).resize(Center);           
        $(window).scroll(Center);    
    }
    
    // methods
    function showModal()
    {
		//Create Modal Background
		createModalBackground();
		$('body').append($(smallPopup)); 
		
		if(center) { Center(); } // If center option is set, center modal     
        
        /* IE6 fix to select zindex bug */
        if(($.browser.msie === true) && ($.browser.version == '6.0'))        
        {   
            allSelectBoxes.css("visibility", "hidden");                  
            popupSelectBoxes.css("visibility", "visible");
        }        
        
		$(overlay).fadeIn(fadeSpeed, function(){ // Fade in modal background and show modal
			
			if(dynamic)
			{
			    loadDynamicModal();
			    //Bind closing event
			    $(closeSelector).live('click', function(event){hideModal()});    
			}
			else
			{
			    if(leftPopout)
			    {
			        $('#modalBackground').css('z-index', '100');
                    var popupWidth = $(smallPopup).width();
                    $(triggerSelector).hide()
			        $(smallPopup).show().animate({
			            left : 0
			        }, 500);
			        $(closeSelector).click(function(){
			            $(smallPopup).animate({
			                left : '-' + popupWidth
			            }, 500, function(){
			                $(smallPopup).hide();
			                $(triggerSelector).show()
			            });
			            $(overlay).remove();
			        }); 
			    }
			    else
			    {
			        $('#modalBackground').css('z-index', '1001');
			        $(smallPopup).show();            
			        $(closeSelector).click(hideModal); 
			        //Bind closing event
			    }
			}
        });                                                                                     
        return false;                
    }
                    
    function hideModal()
    {
        /* IE6 fix to select zindex bug */              
		if(($.browser.msie === true) && ($.browser.version == '6.0'))        
        {
            allSelectBoxes.css("visibility", "visible"); 
        }
        
        $(overlay).fadeOut(fadeSpeed);
        if(dynamic)
        {
            closeDynamicModal();
        }
        else
        {                                    
            $(modalClass).hide();
            $(overlay).remove();
            $(smallPopup).hide();          
        }
    return false;
    }        
    
    function Center()
    {
        var popups = $(smallPopup + ', ' + dynamicModalBox);        
        var windowWidth = $(window).width();
        var windowHeight = $(window).height();
        var scrollLeft = $(window).scrollLeft();
        var scrollTop = $(window).scrollTop();
        
        var popupWidth = popups.width();
        var popupHeight = popups.height();
        if($.browser.safari)
        {

              windowHeight = document.documentElement.clientHeight; 

        }
        var leftPos = (windowWidth - popupWidth) / 2 + scrollLeft;
        var topPos = (windowHeight - popupHeight) / 2 + scrollTop;         
        
        $(smallPopup + ', ' + dynamicModalBox).css({
            "left" : leftPos,
            "top" : topPos                    
        });
    }
    
    function createModalBackground()
    {
        // If modal background does not exist, build modal
		if(!$('#modalBox').length)
		{
		    $('body').append(overlayContent);
		}

		if (typeof document.body.style.maxHeight === "undefined") { //if IE 6 calculate height of window
			$("body","html").css({height: "100%", width: "100%"});
		}
		$(overlay).css({ opacity:0.0}).animate({opacity:opacity}, 0); // Set overlay		
    }
    
    function createModal()
    {
        // if dynamic modal box does not exist, build out
        if(!$('#modalBox').length)
        {
            //Add generic modal box to body
            $('body').append('<div id="modalBox" class="modalBox"></div>');
        }
    }

    function loadDynamicModal()
    {
        createModal();
       	$.ajax({
   		    type: "POST",
   		    url: urlContent,
   		    data: "",
   		    success: function(msg) {
   			    var contentInsert = $(msg).find('.modalDynamicContent').html();
   			    $("#modalBox").html(contentInsert);
   			    if(center) { Center(); }
  		    }
   	    });
        

   	    $(dynamicModalBox).show();
   	    
   	    //if dynamic, and if refreshing same window
   	    $('#modalBox .modalContent').animate({scrollTop: 0}, 500);
    }
 
    function closeDynamicModal()
    {
        $(dynamicModalBox).remove();
        $(overlay).remove();
    }
 
}