/**************************************************************

	Script		: Overlay
	Version		: 1.2
	Authors		: Samuel birch
	Desc		: Covers the window with a semi-transparent layer.
	Licence		: Open Source MIT Licence
	Modified	: Liam Smart (liam_smart@hotmail.com) - MooTools 1.2 support

**************************************************************/

//start overlay class
var Overlay = new Class({
	
	getOptions: function(){
		return {
			colour: '#000',
			opacity: 0.8,
			zIndex: 1000,
			container: $(document.body),
			onClick: new Class()
		};
	},

	initialize:function(options)
	{
		this.setOptions(this.getOptions(),options);
		
		this.container = new Element('div').setProperty('id','OverlayContainer').setStyles({
			position: 'absolute',
			left: 0,
			top: 0,
			width: '100%',
            height: document.body.getSize().y,
			display: 'none',
			zIndex: this.options.zIndex
		}).inject(this.options.container,'inside');
		
		
		
		this.overlay = new Element('div').setProperty('id','Overlay').setStyles({
			position: 'absolute',
			left: 0,
			top: 0,
			width: '100%',
			height: '100%',
			zIndex: 1002,
			backgroundColor: this.options.colour
		}).inject(this.container,'inside');
		
		this.container.addEvent('click',function(){
			this.options.onClick();
		}.bind(this));
		
		this.fade = new Fx.Morph(this.container);
		this.position();
		
		
	},
	
	position: function(){
		this.container.setStyle('height','0');//reset container height ready for resize( removes scrollbar so new calc is true - liam)
		if(this.options.container == document.body){
			if(this.options.container.getSize().y >= this.options.container.getScrollSize().y){
                this.container.setStyles({
					width: window.getSize().x,
					height: window.getSize().y
				});
			}else{
                var myCoord = $(document.body).getScrollSize().y;
                this.container.setStyles({
					width: window.getSize().x,
					height: myCoord
				});
                //alert(myCoord);
			}
		}else{ 
			var myCoords = this.options.container.getCoordinates(); 
			this.container.setStyles({
				top: myCoords.top,
				height: myCoords.height,
				left: myCoords.left,
				width: myCoords.width
			});
		};
	},
	
	show: function(){
		this.fade.start({
			opacity: this.options.opacity,
            display: 'block'
		//	visibility: 'visible'
		});
	},
	
	hide: function(){
		this.fade.start({
			opacity: 0,
            display: 'none'
			//visibility: 'hidden'
		});
	}
});

Overlay.implement(new Options);