CSSRule('.theBox',{fontSize:'12px',border:'1px solid black',padding:'6px',position:'absolute',backgroundColor:'#ffffef'});
function createBox(optObj){
	optObj = optObj || {};
	var b = $(document.createElement('div'));
	b.className = 'theBox';
	var par = $(document.createElement('div'));
	par.setStyle({position:'absolute',visibility:'hidden',left:'0px',right:'0px'});
	par.appendChild(b);
	Object.extend(b,boxMethods);
	
	var shadowWidth = (optObj.shadowWidth != undefined) ? optObj.shadowWidth : 5;
	var shadowOpacity = optObj.shadowOpacity || 24;
	b.addShadow(shadowWidth,shadowOpacity);

	if (optObj.insert){
		b.inline = true;
		var elm = $(optObj.insert);
		if(elm.getStyle('position')=='static')
			elm.style.position = 'relative';
		b.parentNode.style.top = b.parentNode.style.left = '0px';
		elm.appendChild(par);
	}
	else
		document.body.appendChild(par);
		
	return b;
}

insertDivReg = function (){
	var dr = [];
	Event.observe(window,'load',function(){
		Event.observe(document,'click',function(ev){
			var a=[];
			e = ev || event;
			t = e.srcElement || e.target;
			for (var i = 0;i<dr.length;i++){
				if (dr[i].close && !$(t).descendantOf(dr[i]))
					dr[i].close();
				else
					a.push(dr[i])
			}
			dr = a;
		})
	})
	return function(div){
		if (dr.indexOf(div)==-1)
			dr.push(div)
	}
}();

boxMethods = {
	show : function(){
		var oThis = this;
		clearTimeout(oThis.showTimeout)
		oThis.showTimeout = window.setTimeout(function(){oThis.parentNode.style.visibility = 'visible'},25);
		this.positionShadow();
		if (!oThis.inline && !oThis.pushed && !oThis.disableClose){
			setTimeout(function(){insertDivReg(oThis)},50);
		}
		return this;
	}
	,close : function(){
		this.parentNode.style.visibility = 'hidden';
		return this;
	}
	,position : function(elm,optObj){
		var p, jA, kA, i, x, fits, top, otop, ttop, left, oleft, tleft, tElm, eWidth, eHeight, shadow;
		var validPlacements = ['below/right','above/left','above/right','right/top','right/bottom','left/top','left/bottom']

		if (!optObj)
			optObj = {};

		tElm = elm;
		tleft = ttop = 0;
		while (tElm && tElm.tagName != 'HTML' ){
			ttop += tElm.offsetTop;
			tleft += tElm.offsetLeft;
			tElm = tElm.offsetParent;
		}
		shadow = this.parentNode.getElementsByClassName('vShadow')[0]
		if (shadow){
			eWidth = this.offsetWidth + shadow.offsetWidth 
			eHeight = this.offsetHeight  + shadow.offsetWidth 
		}
		else {
			eWidth = this.offsetWidth 
			eHeight = this.offsetHeight 
		} 
		getScroll();
		if (optObj.placement == 'pointer'){
			var x = optObj.x;
			var y = optObj.y;
			
			if (x>windowWidth/2)
				left = (x-this.offsetWidth)+scrollLeft-3;
			else
				left = x+scrollLeft+3;
				
			if (y>windowHeight/2)
				top = (y-this.offsetHeight)+scrollTop-3;
			else
				top = y+scrollTop+3;
				
			if (y>windowHeight/2 && x>windowWidth/2){
				top-=4;
				left-=4;
			}
				
			top = Math.max(top,0);
			left = Math.max(left,0);
			this.parentNode.style.top = top+'px';
			this.parentNode.style.left = left+'px';
			this.positionShadow()
			return;
		}
			
		if (optObj.placement == 'below' || optObj.placement == 'above')
			optObj.placement += '/left'
		else if (optObj.placement == 'left' || optObj.placement == 'right')
			optObj.placement += '/top'
		
		if (!optObj.placement || validPlacements.indexOf(optObj.placement) == -1)
			optObj.placement = 'below/left'
		
		var p = optObj.placement.split('/')
		if (p[0] == 'below')
			jA = ['below','above','right','left']
		else if (p[0] == 'above')
			jA = ['above','below','right','left']
		else if (p[0] == 'right')
			jA = ['right','left','below','above']
		else if (p[0] == 'left')
			jA = ['left','right','below','above']
			
		//while (jArray[0].toLowerCase() != dir.toLowerCase()) 
			//jArray.push(jArray.shift())
		
		outer_loop:
		for (i=0; i<jA.length; i++){
			if (jA[i] == 'above' || jA[i] == 'below')
				kA = (p[1] == 'left') ? ['left','right'] : ['right','left']
			else
				kA = (p[1] == 'top') ? ['top','bottom'] : ['bottom','top']

				
			if (optObj.cover) {
				if ( jA[i] == 'above') 
					otop = -eHeight;
				else if (jA[i] == 'below')
					otop = 0;
				else if (jA[i] == 'left')
					oleft = -eWidth;
				else if (jA[i] == 'right')
					oleft = elm.offsetWidth;
			}
			else {
				if ( jA[i] == 'above') 
					otop = -eHeight;
				else if (jA[i] == 'below')
					otop = elm.offsetHeight;
				else if (jA[i] == 'left')
					oleft = -eWidth;
				else if (jA[i] == 'right')
					oleft = elm.offsetWidth;
			}
			for (x=0;x<kA.length;x++){
				left = oleft;
				top = otop;
				if (kA[x] == 'left')
					left =  0;
				else if (kA[x] == 'right')
					left = (eWidth - elm.offsetWidth)*-1
				else if (kA[x] == 'top')
					top = 0
				else if (kA[x] == 'bottom')
					top = (eHeight - elm.offsetHeight)*-1
				
				top += ttop;
				left += tleft;
				
				fits = true;
				if (optObj.force)
					break outer_loop;
					
				if (((left + eWidth) - scrollLeft > windowWidth)
				|| ((top + eHeight) - scrollTop > windowHeight)
				|| (top - scrollTop < 0)
				|| (left - scrollLeft < 0)){
					fits = false;
				}
				else
					break outer_loop;
			}
				
		}
		if (!fits){
			for (var i=0;i<jA.length; i++){
				if ( jA[i] == 'above'){
					top = -eHeight+ttop;
					left = scrollLeft;
				}
				else if (jA[i] == 'below'){
					top = elm.offsetHeight+ttop;
					left = scrollLeft;
				}
				else if (jA[i] == 'left'){
					left = -eWidth+tleft;
					top = scrollTop;
				}
				else if (jA[i] == 'right'){
					left = elm.offsetWidth+tleft;
					top = scrollTop;
				}
				//top += ttop;
				//left += tleft;
				
				fits = true;
				if (((left + eWidth) - scrollLeft > windowWidth)
				|| ((top + eHeight) - scrollTop > windowHeight)
				|| (top - scrollTop < 0)
				|| (left - scrollLeft < 0)){
					fits = false;
				}
				else
					break;
			}
		}
		top = Math.max(top,0);
		left = Math.max(left,0);
		this.parentNode.style.top = top+'px';
		this.parentNode.style.left= left+'px';
		this.positionShadow()
		return this;
	},
	center : function(){
		var par = this.parentNode;
		if (par.style.position != 'absolute')
			return;
		getScroll();
		var divTop = Math.round(scrollTop+((windowHeight - this.clientHeight)/2))
		var divLeft = Math.round(scrollLeft+((windowWidth - this.clientWidth)/2))
		par.style.top = Math.max(divTop,0)+'px'
		par.style.left = Math.max(divLeft,0)+'px'
		this.positionShadow()
		return this
	},
	addShadow : function(width,opacity){
		//alert(this.parentNode.innerHTML)
		//alert(width+':'+opacity)
		if (width==0)
			return this;
		var par = this.parentNode
		var width = width || 3;
		var opacity = opacity || 28;
		var vShadow = $(document.createElement('div'))
		var hShadow = $(document.createElement('div'))
  
  		vShadow.className = 'vShadow';
  		hShadow.className = 'hShadow';
		var bb = parseInt(this.getStyle('borderBottomWidth')) || 0;
		var br = parseInt(this.getStyle('borderRightWidth')) || 0;
		var bt = parseInt(this.getStyle('borderTopWidth')) || 0;
		var bl = parseInt(this.getStyle('borderLeftWidth')) || 0;
  
		vShadow.setStyle({position:'absolute',backgroundColor:'black',opacity:opacity/100,filter:'alpha(opacity='+opacity+')'})
		hShadow.setStyle({position:'absolute',backgroundColor:'black',opacity:opacity/100,filter:'alpha(opacity='+opacity+')'})
		hShadow.style.height = vShadow.style.width = width+'px';
		vShadow.style.top = ((2*width))+'px'
		hShadow.style.left = ((2*width))+'px';
		par.appendChild(vShadow);
		par.appendChild(hShadow);
		//this.positionShadow()
		return this;
	}
	,positionShadow : function(){
		var shadowWidth = 0;
		if (vShadow = this.parentNode.getElementsByClassName('vShadow')[0]){
			var hShadow = this.parentNode.getElementsByClassName('hShadow')[0]
			shadowWidth = vShadow.offsetWidth;
			
			vShadow.style.height = (((this.offsetHeight)+shadowWidth)-2*shadowWidth)+'px';
			hShadow.style.width = ((this.offsetWidth)-2*shadowWidth)+'px';
			vShadow.style.left = (this.offsetWidth)+'px';
			hShadow.style.top = (this.offsetHeight)+'px';
		}
		if (this.inline){
			var offsetHeight = this.offsetHeight + shadowWidth;
			var offsetWidth = this.offsetWidth + shadowWidth;
			var par = this.parentNode.parentNode;
			var dims = par.getDimensions();
			par.style.height = Math.max(dims.height,offsetHeight)+'px';
			par.style.width = Math.max(dims.width,offsetWidth)+'px';
		}
		return this;
	}
	,adjLeft	: function(v){
		this.parentNode.style.left = (parseInt(this.parentNode.style.left)+v)+'px';
		return this
	}
	,adjTop	: function(v){
		this.parentNode.style.top = (parseInt(this.parentNode.style.top)+v)+'px';
		return;
	}
	/*,sizeChange	: function(){
		if (!this.inline)
			return
		var shadowWidth = this.parentNode.getElementsByClassName('vShadow')[0].offsetWidth;
		var offsetWidth = this.offsetWidth+shadowWidth;
		var parDims = 
	}*/
	//,onresize : function(){this.positionShadow()}
	//,onresize : this.positionShadow;
}