/*
----------------
04/11/2011 overlay javascript unobotrusive
by Giulio Pons
http://www.barattalo.it/2011/11/07/unobtrusive-javascript-to-add-an-overlay-banner
----------------
*/
function ov_css(cssCode) {
	var s = document.createElement("style");
	s.type = "text/css";
	if (s.styleSheet) {
		s.styleSheet.cssText = cssCode;
	} else {
		s.appendChild(document.createTextNode(cssCode));
	}
	document.getElementsByTagName("head")[0].appendChild(s);
}
function ov_event(obj, evType, fn){ 
	document.onkeydown = function(evt) { /* exit on ESC */
		evt = evt || window.event; 
		if (evt.keyCode == 27) { ovRemove(); }
	}
	if (obj.addEventListener){ 
		obj.addEventListener(evType, fn, false); 
		return true; 
	} else if (obj.attachEvent){ 
		var r = obj.attachEvent("on"+evType, fn); 
		return r; 
	} else { 
		return false; 
	}
}

function ov_add(txt) {
	// shortcut reference to the document object
	d = document;
	w = window;
	e=d.documentElement;
	g=d.getElementsByTagName('body')[0];

	// if the ovContainer object already exists in the DOM, bail out.
	if(d.getElementById("ovContainer")) return;

	// create the ovContainer div as a child of the BODY element
	mObj0 = g.appendChild(d.createElement("div"));

	mObj0.id = "ovContainer0";
	// make sure its as tall as it needs to be to overlay all the content on the page
	mObj0.style.height = e.scrollHeight + "px";

	// create the ovContainer div as a child of the BODY element
	mObj = g.appendChild(d.createElement("div"));
	mObj.id = "ovContainer";
	// make sure its as tall as it needs to be to overlay all the content on the page
	mObj.style.height = e.scrollHeight + "px";

	// create the DIV that will be the overlay 
	ovObj = mObj.appendChild(d.createElement("div"));
	ovObj.id = "ovBox";
	// MSIE doesnt treat position:fixed correctly, so this compensates for positioning the overlay
	if(d.all && !w.opera) ovObj.style.top = e.scrollTop + "px";
	// center the overlay box
	x=w.innerWidth||e.clientWidth||g.clientWidth;
	y=w.innerHeight||e.clientHeight||g.clientHeight;
	ovObj.style.left = (x - ovObj.offsetWidth)/2 + "px";
	ovObj.innerHTML = txt;
	ovObj.style.top = (y - ovObj.offsetHeight)/2 + "px";

	// create an anchor element to use as the confirmation button.
	btn = ovObj.appendChild(d.createElement("a"));
	btn.id = "ovClose";
	btn.appendChild(d.createTextNode("X"));
	btn.href = "#";
	// set up the onclick event to remove the overlay when the anchor is clicked
	btn.onclick = function() { ovRemove();return false; }
}

// removes the custom overlay from the DOM
function ovRemove() {
	d = document; g=d.getElementsByTagName('body')[0];
	g.removeChild(d.getElementById("ovContainer"));
	g.removeChild(d.getElementById("ovContainer0"));
	document.onkeydown = null
}


ov_event(window, 'load', overlay);

/*
	customize here the HTML code and the CSS for the container, for the BOX and for the close button.
*/
function overlay() {
	// CUSTOMIZE CSS
	ov_css (
		"#ovContainer0 {background-color:#000;position:absolute; width:100%; height:100%; top:0px; left:0px; z-index:10000; "+
		"opacity: .70;filter: alpha(opacity=70);-ms-filter: \"alpha(opacity=70)\";-khtml-opacity: .70;-moz-opacity: .70;}"+
		"#ovContainer {background-color:transparent;position:absolute; width:100%; height:100%; top:0px; left:0px; z-index:10000; }"+
		"#ovBox { position:relative; width:500px; min-height:150px; border:1px solid #FF9900; background:transparent url(http://www.barattalo.it/wp-content/themes/stardust/images/flowers.png) 0 0 no-repeat; }"+
		"#ovContainer > #ovBox { position:fixed; }"+
		"#ovBox #ovClose { display:block; position:absolute; top:10px;right:10px;margin:5px;  padding:3px; border:1px solid #FF9900; font:12px arial; text-transform:uppercase; text-align:center; color:#000; background-color:#FFCC66; text-decoration:none; }"
	);
	// CUSTOMIZE HTML and GO!
	ov_add(
		"This is an HTML text message.<br/>You can download this javascript <a href='http://www.barattalo.it/2011/11/07/unobtrusive-javascript-to-add-an-overlay-banner'>here</a>."
	);
}