/*!
 * byo - 2008
 * overlay class v1.2
 */

// OVERLAY ////////////////////////////////////////////////////////////////////////////////
var Overlay = new Class({

	// contructor //////////////////////////////
	initialize:function(color, opacity){

		if (!opacity) opacity= 0.5;
		if (!color) color= '#fff';
		this.opacity= opacity;
		this.color= color;

		if(!$('overlay')) {

			overlay= new Element('div',{
									'id':'overlay',
									'styles': {
										'display':'none',
										'position': 'absolute',
										'top': 0,
										'left': 0,
										'z-index': 100,
										'background-color': this.color
									} // /style
								});

			$$('body').adopt(overlay);

		} // /if not exist

		this.fxOverlay = new Fx.Tween(overlay, {property:'opacity', duration: 200, wait: false});

		return true;

	},
	// /contructor //////////////////////////////

	// display the overlay
	display: function() {

		this.fxOverlay.set(0);

		var overlay= $('overlay');

		overlay.setStyles({
								'display': 'block',
								'width': window.getWidth(),
								'height': window.getHeight(),
								'top': window.getScrollTop()
								});

		// when resize or scroll
		window.onresize= function(e) {
			overlay.setStyles({
									'width': window.getWidth(),
									'height': window.getHeight(),
									'top': window.getScrollTop()
									});
		};

		window.onscroll= function(e) {
			overlay.setStyle('top', window.getScrollTop());
		};
		// /when resize or scroll

		this.fxOverlay.start(this.opacity);

		return true;

	},
	// /display //////////////////////////////

	// hide the overlay
	hide: function() {

		this.fxOverlay.start(0).chain(function(){
			// when effect is finished
			$('overlay').setStyle('display','none');
			window.onscroll= '';
		});

	},
	// /hide //////////////////////////////

	// display the overlay
	displayElement: function(element) {

		var element= $(element);

		element.inject($('overlay'), 'after');

		overlayFxElement = new Fx.Tween(element, {property:'opacity', duration: 200, wait: false}).set(0);

		element.setStyles({
							'display': 'block',
							'visibility': 'hidden',
							//'position': 'absolute',
							'z-index': 101,
							//'overflow':'hidden',
							'cursor': 'pointer'
							});

		// add the close event
		element.addEvent("click", this.hideElement); // /close

		var tp= element.getSize();
		var elWidth= tp.x;
		var elHeight= tp.y;

		var top= (window.getHeight()/2).toInt() - (elHeight/2).toInt();
		var left= (window.getWidth()/2).toInt() - (elWidth/2).toInt()

		element.setStyles({
							'visibility':'visible',
							'top': top,
							'left': left
							});

		this.display();
		overlayFxElement.start(1);

		return true;

	},
	// /displayElement //////////////////////////////

	// hide the element
	hideElement: function() {

		var overlay= new Overlay();
		overlay.hide();

		overlayFxElement.start(0).chain(function(){
			// when effect is finished
			delete overlay;
			delete overlayFxElement;
		});

	},
	// /hideElement //////////////////////////////



	// update the message //////////////////////////////
	message: function(message) {
		this.timer = $clear(this.timer);
		$('overlay-message').setStyles({
									'display': 'block',
									'top': window.getScrollTop()
									}).setText(message);

		window.onscroll= function(e) {
			$('overlay').setStyle('top', window.getScrollTop());
			$('overlay-message').setStyle('top', window.getScrollTop());
		};

	} // /messageessage

});
// /OVERLAY ////////////////////////////////////////////////////////////////////////////////