var Overlay = new Class({
	
	Implements: [Options],
	
	options: {
		id:'overlay',
		displayElement:null,
		displayClass:'overlay'
	},
	
	initialize: function(options){
		this.setOptions(options);
		this.display = false;
		this.element = new Element('div',{
			id:this.options.id,
			styles:{
				display:'none',
				left:0,
				position:'absolute',
				top:0,
				'z-index':10000
			}
		}).inject(document.body);
		this.options.displayElement.inject(document.body);
	},
	
	toggle: function(){
		if(this.display) this.hide();
		else this.show();
	},
	
	show: function(){
		this.display=true;
		this.element.setStyles({
			display:'block',
			height:$(document.body).getScrollSize().y+'px',
			width:$(document.body).getScrollSize().x+'px'
		});
		this.options.displayElement.setStyle('display','block');
		
		this.options.displayElement.addClass(this.options.displayClass).setStyles({
			'z-index':10001,
			position:'absolute',
			top:($(document.body).getScroll().y+($(document.body).getSize().y-this.options.displayElement.getSize().y.toInt())/2)+'px',
			left:(($(document.body).getSize().x-this.options.displayElement.getSize().x.toInt())/2)+'px'
		});
	},
	
	hide: function(){
		this.display=false;
		this.element.setStyles({
			display:'none'
		});
		this.options.displayElement.setStyle('display','');
		
		this.options.displayElement.removeClass(this.options.displayClass).setStyles({
			'z-index':'',
			position:'',
			top:'',
			left:''
		});
	}	
});