/************************************
*	Overlay handler		June 2010   *
*	By George						*
************************************/
/*
// 	INSERT INTO HEAD SECTION STYLE TAG OR CSS FILE
#overlay	{ width:100%; height:100%; display: none; position:absolute; top: 0px; left: 0px;filter:alpha(opacity=50);-moz-opacity: 0.5;opacity: 0.5;background-color: #DDDDDD; }
.formlayer	{  width:100%; display: none;  position: absolute; left:0; }
#innerlayer	{ margin:0 auto; border:thin solid black;background-color: #FFFFFF; border: 6px ridge #586BAA; position:relative; }
#layer_header	{ padding: 2px 10px; background-color:#586BAA; color:#FFFFFF; }
.closebutton	{ position: absolute; top:0; right:0; }
.closebutton a	{ padding: 2px 10px; background-color:#FF0000; color:#FFFFFF; text-decoration:none; font-weight:bold; border:1px solid #586BAA; }
#layer_content	{ padding:10px; }

//	INSERT ON TOP OF BODY SECTION
<div id='overlay'></div>

<div id='DEL' class='formlayer'>
  <div id='innerlayer'>
	<div class='closebutton'>
		<a href="#" onclick='return Ebene.hideOverlay()'>X</a>
	</div>
	<div id="layer_header">&nbsp;</div>
	<div id='layer_content'>
		<img src='<?=ICON?>/loading.gif' alt='loading...' />
	</div>
  </div>
</div>

//	INSERT BELOW
<script type="text/javascript">
REMOVE SPACE ->  /* <![CDATA[ * /
	var Ebene = new layerHandler();
	//Ebene.movebox = true;
	window.onscroll = movebox;
REMOVE SPACE ->  /* ]]> * /
</script>
*/
var layerTopMargin = 40;
var divWidth = 600;
function layerHandler() {
	var d = document;
	var formUp = false;
	var id, top, left;
	var origin = false;
	this.movebox = false;
	
	this.showOverlay = function(id, w) {
		// apply visibility
		this.origin = d.getElementById("layer_content").innerHTML;
		d.getElementById("overlay").style.display = "block";
		d.getElementById("overlay").style.zIndex=999; 
		d.getElementById(id).style.display = "block";
		d.getElementById(id).style.zIndex=1000; 
		// apply position
		this.width = w || divWidth;
		d.getElementById("innerlayer").style.width = this.width + "px";

		this.top = window.pageYOffset || d.body.scrollTop || d.documentElement.scrollTop;
		var top_pos = this.top + layerTopMargin;   
		d.getElementById("overlay").style.top = this.top+"px";
		d.getElementById(id).style.top = top_pos+"px";	
		
		this.left = window.pageXOffset || d.body.scrollLeft || d.documentElement.scrollLeft;
		document.getElementById("overlay").style.left = this.left+"px";
		
		this.formUp = id;
		return false;
	}

	this.hideOverlay = function() {
		d.getElementById("overlay").style.display = "none";
		d.getElementById(this.formUp).style.display = "none";
		d.getElementById("overlay").style.left = null;
		d.getElementById(this.formUp).style.left = null;
		if (this.origin) d.getElementById("layer_content").innerHTML = this.origin; 
		this.origin = false;
		this.fromUp = false;
		this.setHeader("&nbsp;");
		return false;
	}
	
	this.loadOverlay = function(id, file, w) {
		this.showOverlay(id, w);
		var xmlhttp=false;
		try {xmlhttp = new ActiveXObject('Msxml2.XMLHTTP');
		} catch (e) { try {	xmlhttp = new ActiveXObject('Microsoft.XMLHTTP');
			} catch (E) { xmlhttp = false;	}
		}
		if (!xmlhttp && typeof XMLHttpRequest!='undefined') { xmlhttp = new XMLHttpRequest(); }
		
		xmlhttp.open('GET', file , true);
		xmlhttp.onreadystatechange=function() {
		  if (xmlhttp.readyState==4) { 
			var content = xmlhttp.responseText; 
			d.getElementById("layer_content").innerHTML = content;
		  }
		}
		xmlhttp.send(null)
		return false;
	}
	
	this.setHeader = function(text) {
		d.getElementById("layer_header").innerHTML = text;
	}
} 

movebox = function (box) {
	if (Ebene.formUp) {
		var currtop = window.pageYOffset || document.body.scrollTop || document.documentElement.scrollTop;
		document.getElementById("overlay").style.top = currtop+"px";
		
		var max_left = window.innerWidth || document.body.clientWidth || document.documentElement.clientWidth;
		if (max_left<divWidth) max_left = divWidth;
		var currleft = window.pageXOffset || document.body.scrollLeft || document.documentElement.scrollLeft;
		var left = Math.min(max_left, currleft);
		document.getElementById("overlay").style.left = left+"px";
		
		if (Ebene.movebox == true) {
			var max_top = window.innerHeight || document.body.clientHeight || document.documentElement.clientHeight;
			var top = Math.min(max_top, currtop);
			var top_pos = top + layerTopMargin;   

			document.getElementById(Ebene.formUp).style.top = top_pos+"px";	
			document.getElementById(Ebene.formUp).style.left = left +"px";	
		}
	}
}