/*Insert HTML into layout page*/
/*

<!-- Popup Window Start -->
<link rel="stylesheet" type="text/css" href="scripts/popup-window/popup.css" />
<script type="text/javascript" src="scripts/popup-window/popup.js"></script>
<!-- End Popuop Window -->

*/

//Popup window script start
$(document).ready(function(){
	var popupStatus = 0;
	//Add window content
		$('body').append('<div id="fade"></div>'); //Add the fade layer to bottom of the body tag.
	$('body').append('<div id="popupblock"></div>'); //Add the fade layer to bottom of the body tag.	
	$('#popupblock').append('<h1>Website Layout Proof</h1>');
	$('#popupblock').append('<h2>These pages will be created once this layout design has been approved.</h2>');
	$('#popupblock').append('<p>This page will determine the design structure of your website.</p>');
	$('#popupblock').append('<p>Once you have approved this layout design, the rest of the pages and links will be completed for your website.</p>');
	$('#popupblock').append('<p>Please email us to let us know of any design layout changes that you would like to make before moving forward with your site.</p>');
	$('#popupblock').append('<a href="#link" class="close">Close Window</a>');
	
	//Click link event!
	$('a[href^=#link]').click(function(){
		if(popupStatus==0){ 
		//Center variables
	var windowWidth = document.documentElement.clientWidth;
	var windowHeight = document.documentElement.clientHeight;
	var popupHeight = $("#popupblock").height();
	var popupWidth = $("#popupblock").width();
	//Center Box
	$("#popupblock").css({"top": (windowHeight/2) - 200, "left": (windowWidth/2) - 250
	});
	//Fade out window
		$("#fade").fadeIn("slow");
		$("#popupblock").fadeIn("slow");
		popupStatus = 1;  
		return false;
		} else {
	$('#fade').fadeOut("slow");
	$('#popupblock').fadeOut("slow");
	popupStatus = 0;  
	return false;
		}
	});
	
});