

Overlay = new Class({
	Implements: [Options, Events, Chain],
	
	options: {
		color: "#000",
		opacity: .75,
		zIndex: 900,
		fx: {
			duration: 800,
			transition: Fx.Transitions.Linear
		}
	},
	
	initialize: function(_options) {
		this.setOptions(_options);
		this.el = new Element("div");
		this.el.setStyles({
			position: "absolute",
			top: "0px",
			left: "0px",
			display: "none",
			backgroundColor: this.options.color,
			opacity: 0,
			cursor: "default",
			zIndex: this.options.zIndex
		});
		this.inject(document.getElement("body"));
	},
	
	setColor: function(color) {
		this.options.color = color;
		this.getMorph().start({
			backgroundColor: color
		}).chain(function() {
			this.callChain();
		}.bind(this));
		return this;
	},
	
	setOpacity: function(opacity) {
		this.options.opacity = opacity;
		this.getMorph().start({
			opacity: opacity
		}).chain(function() {
			this.callChain();
		}.bind(this));
		return this;
	},
	
	resize: function(w, h) {
		if (((w == null) || (h == null)) && (this.injected == true)) {
			var parent = this.el.getParent();
			if (parent.tagName.toLowerCase() == "body") {
				w = (w == null) ? window.getSize().x : w;
				h = (h == null) ? window.getSize().y : h;			
			} else {
				w = (w == null) ? parent.getSizeSansBorder().x : w;
				h = (h == null) ? parent.getSizeSansBorder().y : h;
			}
		}
		if ((w != null) && (h != null)) {
			this.el.setStyles({
				width: w,
				height: h
			});
		}
		if ((this.el.getParent().tagName.toLowerCase() == "body") && (this.el.getStyle("position") == "absolute")) {
			this.el.setStyles({
				top: this.el.getParent().getScroll().y,
				left: this.el.getParent().getScroll().x
			});
		}
		return this;
	},
	
	inject: function(element, where) {
		element = (element == null) ? document.getElement("body") : element;
		if (this.injected == true) {
			if (this.el.getParent().tagName.toLowerCase() == "body") {
				window.removeEvent("resize", this.resize.bind(this));
			} else {
				this.el.getParent().removeEvent("resize", this.resize.bind(this));
			}			
		} 
		this.injected = true;
		this.el.inject(element, where);
		if ((this.el.getParent().getStyle("position") != "absolute") || (this.el.getParent().getStyle("position") != "fixed")) {
			this.el.getParent().setStyle("position", "relative");
		}
		if ((this.el.getParent().tagName.toLowerCase() == "body") && (!Browser.Engine.trident)) {
			this.el.setStyle("position", "fixed");
		} else {
			this.el.setStyle("position", "absolute");
		}
		if (this.el.getParent().tagName.toLowerCase() == "body") {
			window.addEvent("resize", this.resize.bind(this));
		}
		this.resize();
		return this;
	},
	
	remove: function() {
		this.el.remove();
		return this;
	},
	
	show: function() {
		this.el.setStyle("display", "block");
		this.getMorph().start({
			opacity: this.options.opacity
		}).chain(function() {
			if (this.options.opacity == 0) {
				this.el.setStyles({
					opacity: 1,
					backgroundColor: "transparent"
				});
			}
			this.callChain();
		}.bind(this));
		return this;
	},
	
	hide: function() {
		this.getMorph().start({
			opacity: 0
		}).chain(function() {
			this.el.setStyle("display", "none");
			this.callChain();
		}.bind(this));
		return this;
	},
	
	addEvent: function(event, func) {
		this.el.addEvent(event, func);
	},
	
	getMorph: function(el) {
		if (!this.fx) {
			this.fx = new Fx.Morph(this.el, {duration: this.options.fx.duration, transition: this.options.fx.transition});
		}
		return this.fx;
	}
});
