var docW;
var docH;
var winW;
var winH;
var scrollTop;

$(document).ready(function() {

	docW = $(document).width();
	docH = $(document).height();
	winW = $(window).width();
	winH = $(window).height();
	scrollTop = $(document).scrollTop();
	
	/*
	$(".btn1").click(function(event) {
		event.preventDefault();
		html5popupalert2('<h6>You will now be redirected to our payment processor.</h6><p class="accent med2">Once the transaction finalizes, you must click the <strong>CONFIRM</strong> button that appears in order to complete your purchase or YOU WILL BE CHARGED WITHOUT RECEIVING YOUR PRODUCT.</p><img src="http://nicede2.pensivo.com/styles/ede2_html5/_images/desjardins-conf-pg.jpg" /><i class="arr"></i><p style="font-size:14px;" class="accent">This transaction will appear as PENSIVO Inc. on your credit card; they are our payment processor.</p>', {"label":"Ok"}, {"label":"Cancel", "func":function() {alert("BYE BYE");}});
		return false;
	});
	*/
	
}); // end document.ready();

function fadeOutPopup2(func) {
	$("#sbalerts2").fadeOut(function() {
		//$("html").css("overflow-x", "scroll");
		$("html").css("overflow", "");
		if(func) {
			func();
		}
	});
}

function html5popupalert2(html, btn1, btn2) {

	var html = html;
	
	location.hash = "#top";
	
	// generate markup.
	if($("#sbalerts2").length!=0) {
		$("#sbalerts2").remove();
	}
	
	$("body").prepend($('<div id="sbalerts2" />').fadeIn());
	$("#sbalerts2").append($('<div class="box-wrap" />'));
	//$("#sbalerts2").append($('<div class="box-outr" />')).find(".box-outr").append($('<div class="box-wrap" />'));
	$("#sbalerts2 .box-wrap").append($(html)); // append html
	$("#sbalerts2 .box-wrap").append($('<div class="buttons" />')); // append buttons container. (div)
	
	if (btn1) {
		
		var btn1el = $('<a href="#nogo" class="btn1 '+(btn2 ? 'flat-rt' : '')+'">'+btn1.label+'</a>');
		btn1el.appendTo($("#sbalerts2 .buttons"));
		btn1el.click(function() {
			fadeOutPopup2(btn1.func);
			
		});
	}
	
	if (btn2) {
		
		var btn2el = $('<a href="#nogo" class="btn1 '+(btn1 ? 'flat-lt' : '')+'">'+btn2.label+'</a>');
		btn2el.appendTo($("#sbalerts2 .buttons"));
		btn2el.click(function() {
			fadeOutPopup2(btn2.func);
		});
		
	}
	
	if(!btn1 && !btn2) {
		
		var btndefault = $('<a href="#nogo" class="btn1">'+"OK"+'</a>');
		btndefault.appendTo($("#sbalerts2 .buttons"));
		btndefault.click(function() {
			fadeOutPopup2();
		});
		
	}
	
	// disable scroll when popup visible.
	// $("html").css("overflow", "hidden");
	$("html").css("overflow-x","hidden");

	/*
var docW = $(document).innerWidth();
	var docH = $(document).height();
	var winW = $(window).innerWidth();
	var winH = $(window).height();
*/
	
	$("#sbalerts2").css({
		"width" : docW,
		"height" : docH
	});
	
	var boxContentsH = $("#sbalerts2 .box-wrap").innerHeight();
	var boxContentsW = $("#sbalerts2 .box-wrap").outerWidth(true);
	
	$("#sbalerts2 .box-wrap").css({
		"left" : (winW/2) - Math.round(boxContentsW/2),
		//"top" : (winH/2) - Math.round(boxContentsH/2) + $(document).scrollTop()
		"top" : "40px"
	});
	
	///
	
	//var height = $(this).height(), width  = $(this).width();
	$(document).bind('DOMSubtreeModified', function() {
		fnRepositionPopupAlert2();
	}); // DOMSubtreeModified
		
	$(window).resize(function() {
		fnRepositionPopupAlert2();
	}); // window.resize();
	
	$("#sbalerts2 img").load(function() {
			docW = $(document).innerWidth();
			docH = $(document).height();
			winW = $(window).innerWidth();
			winH = $(window).height();
			scrollTop = $(document).scrollTop();
			
			// ##### //
			
			$("#sbalerts2").css({
			"width" : docW,
			"height" : docH
			});
			
			///
			
			var boxContentsH = $("#sbalerts2 .box-wrap").innerHeight(),
			boxContentsW = $("#sbalerts2 .box-wrap").outerWidth(true);
			
			$("#sbalerts2 .box-wrap").css({
			"left" : (winW/2) - Math.round(boxContentsW/2)
			//"top" : (winH/2) - Math.round(boxContentsH/2) + scrollTop
			});
			// fnRepositionPopupAlert();
	}); // DOMSubtreeModified
	
}

function fnRepositionPopupAlert2() {
	
	if(
    	docW != $(document).innerWidth()
		|| docH != $(document).height()
		|| winW != $(window).innerWidth()
		|| winH != $(window).height()
		|| scrollTop != $(document).scrollTop()
    ) {
		
		docW = $(document).innerWidth();
		docH = $(document).height();
		winW = $(window).innerWidth();
		winH = $(window).height();
		scrollTop = $(document).scrollTop();
		
		
		// ##### //
		
		$("#sbalerts2").css({
		"width" : docW,
		"height" : docH
		});
		
		///
		
		var boxContentsH = $("#sbalerts2 .box-wrap").innerHeight();
		var boxContentsW = $("#sbalerts2 .box-wrap").outerWidth(true);
		
		$("#sbalerts2 .box-wrap").css({
		"left" : (winW/2) - Math.round(boxContentsW/2)
		//"top" : (winH/2) - Math.round(boxContentsH/2)// + scrollTop
		//"top" : (winH/2) - Math.round(boxContentsH/2) + scrollTop
		});
	}
}