// jangoPopup.js
// version 2
// By Evan Merz
// Fall 2008

// GOAL: The code in this file should show a popup containing content from another url
// Note that jQuery is required for this version of the popup
// EXAMPLE USAGE:
// <link href="jangoPopup2.css" rel="stylesheet" type="text/css">
// <script src="jangoPopup2.js" language="javascript"></script>
// <script src="jQuery.js" language="javascript"></script>
// <a href="#" onClick="javascript:showPopup('test.html');">TEST!</a>


//0 means disabled; 1 means enabled;
var popupStatus = 0;

//loading popup with jQuery magic!
function loadPopup(url)
{
	//loads popup only if it is disabled
	if(popupStatus==0)
	{
		$("#popupContent").html("");
		getContent(url);
	}
}

//disabling popup with jQuery magic!
function disablePopup()
{
	//disables popup only if it is enabled
	if(popupStatus==1)
	{
		$("#backgroundPopup").fadeOut("slow");
		$("#jangoPopup2").fadeOut("slow");
		popupStatus = 0;
	}
}

//centering popup
function centerPopup()
{
	//var vscroll = (document.all ? document.scrollTop : window.pageYOffset);
	//var vscroll = document.body.scrollTop;

	var vscroll = $(window).scrollTop(); // thank god for jQuery!

	var newTop = vscroll + ($(window).height()/2) - ($("#jangoPopup2").height() / 2);

	var newLeft = ($(window).width()/2) - ($("#jangoPopup2").width() / 2);

	$("#jangoPopup2").css({
		"position": "absolute",
		"top": newTop + "px",
		"left": newLeft + "px"
	});

	// force IE to play nice
	//var pageHeight = $("body").height();
	//var pageWidth = $("body").width();
	var pageHeight = document.body.scrollHeight;
	var pageWidth = document.body.clientWidth;
	$("#backgroundPopup").css({
		"height": pageHeight + "px",
		"width": pageWidth + "px"
	});

}


//CONTROLLING EVENTS IN jQuery
$(document).ready(function()
{
	//CODE FOR CLOSING THE POPUP
	//Click the x event!
	$("#jangoPopup2Close").click(function(){
		disablePopup();
	});
	//Click out event!
	$("#backgroundPopup").click(function(){
		disablePopup();
	});
	//Press Escape event!
	$(document).keypress(function(e){
		if(e.keyCode==27 && popupStatus==1){
			disablePopup();
		}
	});
});



// ======================================
// === GET OTHER CONTENT ================
// ======================================
	// get content from another page
	function getContent(targetURL)
	{
		// run the HTTPRequest
		$.ajax({
			async: true,
			type: "GET",
			url: targetURL,
			data: "",
			dataType: "html",
			success: function(newHTML)
				{ 
					$("#popupContent").html(newHTML);
					centerPopup();
					$("#backgroundPopup").css({
						"opacity": "0.7"
					});
					$("#backgroundPopup").fadeIn("slow");
					$("#jangoPopup2").fadeIn("slow");
					popupStatus = 1;
				},
			error: function(){}
		});
	}



// show a popup underneath the element with the passed in id
function showPopup(srcURL)
{
	loadPopup(srcURL); 	// load popup content and show it
}
function showImagePopup(imageURL)
{
	//loads popup only if it is disabled
	if(popupStatus==0)
	{
		$("#popupContent").html("<img id='popupImage' src='" + imageURL + "'>");

		var default_img = document.getElementById('defaultImage');
		tmp_img = new Image();
		tmp_img.onload=function() {
			centerPopup();
			$("#backgroundPopup").css({
				"opacity": "0.7"
			});
			$("#backgroundPopup").fadeIn("slow");
			$("#jangoPopup2").fadeIn("slow");
			popupStatus = 1;
		}
		tmp_img.src = imageURL;
	}
}

function hidePopup()
{
	disablePopup();
}

document.write("<div id='jangoPopup2'><a id='jangoPopup2Close'>x</a><p id='popupContent'></p></div><div id='backgroundPopup'></div>");