// wait for the DOM to be loaded
$(document).ready(function()
{
	//if close button is clicked
	$(".window .close").click(function (e)
	{
		//Cancel the link behavior
		jQuery.each(jQuery.browser, function(i, val)
		{
			if(i == "msie" && jQuery.browser.version.substr(0, 3) == "6.0")
			{
			  $(".userInput").show();
			}
		});
	
		$("#Popup").hide();
		$("#content_box").empty();
//		$("#Popup").height(203);
		$("#Popup").width(700);
		e.preventDefault();
		$("#Mask, .window").hide();
	});
});

function showPopup(web_page)
{
    //Get the screen height and width
    var MaskHeight = $(document).height();
    var MaskWidth = $(window).width();
	
    //Set height and width to Mask to fill up the whole screen
    $("#Mask").css({'width': MaskWidth, 'height': MaskHeight});

    //transition effect
    $("#Mask").fadeIn(2000);
    $("#Mask").fadeTo("slow", 0.8);

    //Get the window height and width
    var winH = $(window).height();
    var winW = $(window).width();

    $("#Popup").show();
//    $("#loading_box").show("slow");

    //Set the popup window to center
    var top_of_popup = 100;

    $("#Popup").css('top', top_of_popup);
    $("#Popup").css('left', winW / 2 - $("#Popup").width() / 2);
    $("#Popup").css('background-color', '#ffffff');
    $("#Popup").css('z-index', '9999');

    //transition effect
    $("#Popup").fadeIn(6000);

    $.ajax(
    {
        method: "get",
        url: web_page + ".php",
        data: "",
        beforeSend: function()
        {
            $(".content_box").empty();
//            $("#loading_box").show("slow");
        },  // show loading just when link is clicked
        complete: function()
        {
//            $("#loading_box").hide("slow");
        },  // stop showing loading when the process is complete
        success: function(html)
        { //so, if data is retrieved, store it in html
            //$("#Popup").height(800);
            window.scrollTo(0, 0);

            $(".content_box").show("slow"); //animation
            $(".content_box").html(html); //show the html inside .content div
            jQuery.each(jQuery.browser, function(i, val)
            {
                if(i == "msie" && jQuery.browser.version.substr(0, 3) == "6.0")
                {
                    $(".userInput").hide();
                }
            });

            $("#Popup").height(600);
            $("#Popup").width(700);
            $("#Popup").css('left', winW / 2 - $("#Popup").width() / 2);
            $("#Mask").css({'height': $(document).height()});
            $("#new_window").show();
        }
    });
}