// Special var to lock a popup.
var lockPopup=false;

$(document).ready(function () 
{
	$('.popup_close').live('click', function()
    {
		hideBox();	
    });
	
	$(window).bind('resize', centerPopup4);
	// Click on an option (popup).
    $("a.option").click(function()
    {
       // Get the url for the option.
       url = $(this).attr("url");
       
       // Ajax request and append the box after the container..
       $.get(url, function(data)
       {
           // Append the html of the popup to the template.
           $("#container").after(data);
           
           // Show the box.
           showBox();
           
           // Hide the options again.
           showOptions();
       });
    });
});
// Method to show the box.
function showBox()
{
    $('div#popupBox').bind('click', showBox);
   
    var box = $('div#popContainer');
    if (box.css('display') == 'none') 
    {
		$('div#popContainer').css('display', 'block');
		$(centerPopup4);
		$('div#popupBox').animate({ opacity: '0.8' }, 350, function()
		{
			$('div#popup').animate({ height: 'show'	}, 350);
		});
	}
	else
	{
		hideBox();
	}
}

// Method to hide the box.
function hideBox()
{
	if(lockPopup == true) return false;

	var box = $('div#popContainer');
	
	$('div#popup').animate({ height: 'hide' }, 350, function()
	{
		$('div#popupBox').animate({ opacity: '0.0' }, 350, function()
		{
			$(box).css('display', 'none');
			
			// Animation is done. remove the container from the html.
			$("#popContainer").remove();
		});
	});
}

// Method to calculate the window size.
function getWindowSize() 
{
    var myWidth = 0, myHeight = 0;
    
    if( typeof( window.innerWidth ) == 'number' )
    {
       //Non-IE
       myWidth = window.innerWidth;
       myHeight = window.innerHeight;
    } 
    else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) 
    {
        //IE 6+ in 'standards compliant mode'
        myWidth = document.documentElement.clientWidth;
        myHeight = document.documentElement.clientHeight;
    } 
    else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) 
    {
        //IE 4 compatible
        myWidth = document.body.clientWidth;
        myHeight = document.body.clientHeight;
    }
    
    return{X:myWidth, Y:myHeight}
}
    
//centering popup
function centerPopup4()
{
    var box = $('div#popContainer');
    if (box.css('display') == 'block') 
    {
        //request data for centering
        var windowDim = getWindowSize();
        var popupHeight = $("#popup").height();
        var popupWidth = $("#popup").width();
        
        //centering
        $("#popup").css({
            "position": "absolute",
            "top": windowDim.Y / 2 - popupHeight / 2 ,
            "left": windowDim.X / 2 - popupWidth / 2
        });
        
        //only need force for IE6
        $("popupBox").css({
            "height": windowDim.Y
        });
    }
}