var boxMgr = {
	zIndex : 1000,
	overlay : {
		div : new Element("div", {"id": "overlay", "style":"display:none;position:absolute;z-index:1000;top:0;bottom:0;right:0;left:0;"}),
		visible : false,
		inserted : false,
		Fx : {
			show : {
				'transition' : Fx.Transitions.linear, 
				'duration' : 200,
				'styles' : {
					'opacity' : 0.75
					}
			},
			close : {
				'transition' : Fx.Transitions.linear, 
				'duration' : 100,
				'styles' : {
					'opacity' : 0
					}
			}
		},
		show : function(){
			this.visible = true;
			if(!this.inserted){
				this.div.injectInside($(document.body));
				this.div.setOpacity(0);
				this.div.style.display = "inline";
				this.div.style.zIndex = this.zIndex;
				this.div.style.height = (parseFloat(document.body.offsetHeight) >= parseFloat(window.getHeight())) ? parseFloat(document.body.offsetHeight)+"px" : parseFloat(window.getHeight())+"px";
				this.div.style.width = (parseFloat(document.body.offsetWidth) >= parseFloat(window.getWidth())) ? parseFloat(document.body.offsetWidth)+"px" : parseFloat(window.getWidth())+"px";
				this.div.addEvent("click", function(){
					boxMgr.close();
				});
			}
			
			var showFx = new Fx.Styles(this.div, {duration : this.Fx.show.duration, transition: this.Fx.show.transition});
			showFx.start(this.Fx.show.styles);
			
		},
		close : function(){
			this.visible = false;
			var closeFx = new Fx.Styles(this.div, {duration : this.Fx.close.duration, transition: this.Fx.close.transition});
			closeFx.start(this.Fx.close.styles);
		}
	},
	boxClass : 'box',
	boxes : {},
	boxCount : 0,
	method : "post",
	action : "",
	onsubmit : "",
	mayClose : true,
	Fx : {
		show : {
			'transition' : Fx.Transitions.linear, 
			'duration' : 200,
			'styles' : {
				'opacity' : 1
				}
		}, 
		close : {
			'transition' : Fx.Transitions.linear, 
			'duration' : 100,
			'styles' : {
			'opacity' : 0
			}
		}
	},
	position : {
		top : "",
		right : "",
		bottom : "",
		left : ""
	},
	getPos : function(pos, box, vertical){
		if($type(pos) == "string" && pos.contains("%")){
			var val = (vertical) ? window.getHeight() : window.getWidth();
			pos = (val / 100.0) * pos.toFloat();
			pos -= parseFloat(box.offsetWidth) / 2.0;
			pos += "px";
		}
		return pos;
	},
	showBox : function(iBox){
	
		if(!$defined(this.boxes[iBox.name])){		
			var oBox = {
				box : new Element("div", {"class" : this.boxClass}),
				form : new Element("form", {'action' : this.action, 'method' : this.method, "onsubmit" : this.onsubmit}),
				name : iBox.name
			};
			
			oBox.box.setOpacity(0);
			oBox.box.style.zIndex = this.zIndex + 1 + this.boxCount;
			oBox.box.style.display = "inline";
			oBox.box.style.position = "absolute";
			
			if($defined(iBox.head)){
				var headDiv = new Element("div", {'class' : "head"});
				headDiv.setHTML(iBox.head).injectInside(oBox.form);
			}
			
			var contentDiv = new Element("div", {'class' : "content"});
			contentDiv.setHTML(iBox.content).injectInside(oBox.form);
			
			if($defined(iBox.buttons)){	
				var bottomDiv = new Element("div", {'class' : "bottom"});
				iBox.buttons.each(function(button){
					var onClick = "";
					if($defined(button.onClick)){
						onClick = button.onClick;
						button.onClick = "";
					}
					
					var btn = new Element("input", button);
					btn.type = "button";
					btn.injectInside(bottomDiv);
					if(onClick != ""){
						btn.addEvent("click", onClick);
					}
				});
				bottomDiv.injectInside(oBox.form);
			}
			
			if(this.position.top == "" && this.position.right == "" && this.position.bottom == "" && this.position.left == ""){
				this.position.top = "50%";
				this.position.right = "50%";
			}
			
			oBox.form.injectInside(oBox.box);
			oBox.box.setOpacity(0);
			
			this.boxes[iBox.name] = oBox;
			this.boxes[iBox.name].box.injectInside($(document.body));
			this.boxes[iBox.name].box.style.top = this.getPos(this.position.top, this.boxes[iBox.name].box, 1);
			this.boxes[iBox.name].box.style.right = this.getPos(this.position.right, this.boxes[iBox.name].box, 0);
			this.boxes[iBox.name].box.style.bottom = this.getPos(this.position.bottom, this.boxes[iBox.name].box, 1);
			this.boxes[iBox.name].box.style.left = this.getPos(this.position.left, this.boxes[iBox.name].box, 0);
			
			this.boxCount++;
		}
		
		this.boxes[iBox.name].visible = true;
		var showFx = new Fx.Styles(this.boxes[iBox.name].box, {duration : this.Fx.show.duration, transition: this.Fx.show.transition});
		
		if(!this.overlay.visible){
			this.overlay.show();
		}
		showFx.start(this.Fx.show.styles);
	},
	closeBox : function(instanceName){
	
		if($defined(this.boxes[instanceName])){
			this.boxes[instanceName].visible = false;
			
			var close = true;
			for(key in this.boxes){
				if(this.boxes[key].visible){
					close = false;
					break;
				}
			}
			
			var closeFx = new Fx.Styles(this.boxes[instanceName].box, {duration : this.Fx.close.duration, transition: this.Fx.close.transition});
			closeFx.start(this.Fx.close.styles);
			
			if(close){
				this.overlay.close();
			}
		}
	},
	close : function(){
		if(this.mayClose){
			for(key in this.boxes){
				this.closeBox(this.boxes[key].name);
			}
		}
	}
}

