var BlackBox;
var WhiteBox;
function blackBox(escapable){
	BlackBox = new Object();
	BlackBox.flush = function(){
		var el = document.getElementById('blackBox');
		el.parentNode.removeChild(el);	
		BlackBox = null;
	}
	var el = document.createElement('div');
	el.id="blackBox";
	el.style.width=getClientWidth()+"px";
	el.style.height=getClientHeight()+"px";
	el.style.left=0+"px";
	el.style.top=0+"px";
	document.body.appendChild(el);
	//alert('woot');
	if(escapable==true){
		el.style.cursor='hand';
		el.onclick = function(){
			if(WhiteBox){
				WhiteBox.flush();//this.parentNode.removeChild(whitebox);
			} else {
				BlackBox.flush();
			}
		}
	}
	window.onresize = function(){
		if( el = document.getElementById('blackBox')){	
		el.style.width=getClientWidth();
		el.style.height=getClientHeight();
		}
	}
	
	return el;
}

function whiteBox(argObj){
	WhiteBox = this;
	//object,content,class,curtain,escapable){
	//alert('woot');
	//if(argObj['object']==undefined) argObj['object'] = document.body;
	//alert(anObj.offsetTop);
	if(argObj['curtain']){
		if(argObj['escapable']==undefined){
				argObj['escapable']=true;
			}
		this.bbox = blackBox(argObj['escapable']);
		}
	this.el = document.createElement('div');
	el.id="whiteBox";
	jscss('add',el,"overlay-Content");
	if(argObj['class']!=undefined){jscss('add',el,argObj['class']);}
	//el.className="overlay-Content";
	
	document.body.appendChild(el);
	if(argObj['object']){
		var Left = getAbsCoordinates(argObj['object'])['offsetLeft']-el.offsetWidth/2+argObj['object'].offsetWidth/2;
		if(argObj['offset'] && argObj['offset']['x']) Left += argObj['offset'].x;
		if(Left <0) Left = 35;
		var Top = getAbsCoordinates(argObj['object'])['offsetTop'];
		if(argObj['offset'] && argObj['offset']['y']) Top += argObj['offset'].y;
		if(Top <0) Top = 35;
		el.style.left=Left+"px";
		el.style.top=Top+"px";
	}//+argObj['object'].offsetHeight/2-el.offsetHeight/2;
	else
	{
		var Left = getClientWidth()/2-el.offsetWidth/2;
		if(argObj['offset'] && argObj['offset']['x']) Left += argObj['offset'].x;
		if(Left <0) Left = 35;
		var Top = getClientHeight()/2-el.offsetHeight/2; 
		if(argObj['offset'] && argObj['offset']['y']) Top += argObj['offset'].y;
		if(Top <0) Top = 35;
		el.style.left=Left+"px";
		el.style.top=Top+"px";
	}
	if(argObj['content']!=undefined)
	{
		el.innerHTML=argObj['content'];//+"<a href=\"#\" onclick=\"WhiteBox.flush()\">OuiOuiOui</a>";
	}
	
	//el.top=0;
	el.focus();
	this.flush = function(){
		if (BlackBox != null) BlackBox.flush();
		el.parentNode.removeChild(el);
		WhiteBox = null;
	}
	
}
function getClientWidth(){
	if(document.documentElement.clientWidth) return document.documentElement.clientWidth;
	if(document.body.clientWidth) return document.body.clientWidth;
}
function getClientHeight(){
	if(document.documentElement.clientHeight) return document.documentElement.clientHeight;
	if(document.body.clientHeight) return document.body.clientHeight;
}
function getAbsCoordinates(thisObj){
		var obj = thisObj;
		var offsetLeft=0;
		var offsetTop=0;
		while(obj.tagName != 'BODY'){
			offsetLeft += obj.offsetLeft;
			offsetTop += obj.offsetTop;
			obj = obj.offsetParent;
		}
		var result = new Object();
		result['offsetLeft'] = offsetLeft;
		result['offsetTop']= offsetTop;
		return result;
	}
	
function jscss(a,o,c1,c2)
{
  switch (a){
    case 'swap':
      o.className= (!jscss('check',o,c1))?o.className.replace(c2,c1):o.className.replace(c1,c2);
    break;
    case 'add':
      if(!jscss('check',o,c1)){o.className+=o.className?' '+c1:c1;}
    break;
    case 'remove':
      var rep=o.className.match(' '+c1)?' '+c1:c1;
      o.className=o.className.replace(rep,'');
    break;
    case 'check':
      return new RegExp('\\b'+c1+'\\b').test(o.className)
    break;
  }
}