/**
 * MyWindow.js
 *
 * @author Iván Rodríguez
 * @date 2009-04-15
 * @brief Clase útil para generar ventanas emergentes.
 * @version 0.1
 */

Element.Events.clickout = {
	base : 'click',
	condition : function(event) {
		if (event.target.href) return true;  
		event.stop(); 
		return false;
	},
	
	onAdd : function(fn) {
		$(this.getDocument().body).addEvent('click', fn);
	},

	onRemove : function(fn) {
		$(this.getDocument().body).removeEvent('click', fn);
	}
};

var MyWindow = new Class({
	backgroundOpacity : 0.2,
	
	initialize: function(options){
		this.options = options;		
		this.show();
	},
	
	show: function() {
		var _d 		= $(document.body);
		var _coords     = _d.getCoordinates();
		var _dimensions = _d.getScrollSize();
		
		//var _left 	= _d.getPosition().x + ((_dimensions.x - ((this.options.width.toInt() * _dimensions.x ) / 100)) / 2);
		var scroll = window.getScroll();
		var size = window.getSize();		
	
		//var _top = scroll.y + ((size.y - ((this.options.height.toInt() * size.y ) / 100 )) / 2);	

		//var _left = _d.getPosition().x + ((_coords.width - this.options.width.toInt()) / 2);

		var _left = scroll.x + ((_coords.width - this.options.width.toInt()) / 2)
	
	    if(this.options.height.toInt() > _coords.height) {
	       var _top = _d.getPosition().y - 50;
	    } else {
			var _top = scroll.y + ((_coords.height - this.options.height.toInt()) / 2);
        }

						
		var _back = new Element('div');
		_back.setStyles({
			'position' : 'absolute',
			'top' : _coords.top,
			'left' : _coords.left,
			'width'  : _dimensions.x,
			'height' : _dimensions.y,
			'background' : '#000',
			'opacity' : this.backgroundOpacity
		});
		if (typeof(this.options.class2)=='string'){
			var _w = new Element('div', {'class': this.options.class2,
			'html' : this.options.msg,
			'id' : 'popup'}
			);

		}else{
			var _w = new Element('div', {'id' : 'popup','html' : this.options.msg});
		}
		_w.setStyles({
			'position' : 'absolute',
			'top' : _top,
			'left' : _left,
			'width'  : this.options.width,
			'height' : this.options.height,
			'background' : '#fff',
			//'overflow' : 'auto',
			'border-top' : '1px solid #555',
			'border-left' : '1px solid #555',
			'border-right' : '1px solid #555',
			'padding' : '0px',
			'text-align' : 'left'
		});
		
		/*
		var _msg = new Element('div').set({
			'html' : this.options.msg,
			'style' : 'margin: 1em;'
		});
				
		var _main = new Element('div').set({
			'style' : 'text-align:center;'
		});
				
		_main.adopt(_msg);
		
		
		_w.adopt(_main);
		*/

		var title = '';
		if(this.options.title)
			title = this.options.title;
			

		var _titulo =  new Element('div').set({
			'class' : 'TituloCerrar',
			'html' : '<h2>' + title + '</h2>'
		});

		var _close =  new Element('div').set({
			'class' : '',
		});

		_close.setStyles({
			'position' : 'absolute',
			'top' : (_top+281),
			'left' : (_left),
			'width'  : this.options.width,
			'height' : '25px',
			'background' : '#fff',
			'overflow' : 'auto',
			'border-bottom' : '1px solid #555',
			'border-left' : '1px solid #555',
			'border-right' : '1px solid #555',
			'text-align' : 'right'
		});

		var _imgcerrar =  new Element('img').set({
			'src' : '/imgs/close.gif',
			'id': 'closebutton'
		});

		_imgcerrar.setStyles({
			'margin-right':'5px'
			
		});

		_titulo.setStyles({
			'position' : 'absolute',
			'top' : (_top-40),
			'left' : _left,
			'overflow' : 'auto',
			'width'  : (this.options.width.toInt()),
			'height'  : 50,
			'border' : '1px solid #555'		
		});

			_close.adopt(_imgcerrar);

		

								
		_d.adopt(_back);

		
		_d.adopt(_titulo);
		//_d.adopt(_cerrar);
		

		_d.adopt(_w);

		_d.adopt(_close);
		
		//var elements = [_back, _w, _main, _msg];
		//var elements = [_back, _w, _cerrar];
		var elements = [_back, _close,_titulo, _w];
		var self = this;
	
		_w.addEvent('clickout', function() {
			self.hide.delay(self.options.duration * 0, self, [elements])
		});
		
		if(self.options.notification)
			this.hide.delay(this.options.duration * 1000, this, [elements]);
		else {
			// Tenemos que añadir botón de cerrar ventana
		}
	},
	
	hide : function(elements) {
		var effects = new Fx.Elements(elements, {duration:200, onComplete: function() {
			elements.each(function(el) {
				el.dispose();
			});
		}}).start({
			'0': { 'opacity': [this.backgroundOpacity, 0] }, 
			'1': { 'opacity': [this.backgroundOpacity, 0] } 
		});
	}
});