var Popup = new Class({

	Implements: [Options, Events],

	options: {
		zIndex: 50,
		opacity: 1,

		inlayClick: true,
		popClass: 'popClass',
		inlayId: 'el_inlay'
	},

	initialize : function(options) {
		this.setOptions(options);

		if (this.options.el_target){
			this.el_target = this.options.el_target;
		}

		if ($('this.options.el_pop')){
			this.el_pop = this.options.el_pop;
		} else {
			this.el_pop = new Element('div', {});
			this.el_pop.inject(document.body);
		}

		if (!Browser.Engine.trident){
			this.fx = new Fx.Tween(this.el_pop);
			this.fx.addEvent('complete', function(el){
				el.setStyles({
					'visability': (!this.visible) ? 'visible' : 'hidden',
					'display': (!this.visible) ? 'none' : 'block'
				});
			}.bind(this));
		}

		this.splash = new Splasher();
		var el_inlay = $(this.options.inlayId); 
		if(el_inlay){
			this.el_inlay = el_inlay;
			this.el_inlay.setStyles({
				zIndex: this.options.zIndex - 1
			});
		} else {
			this.el_inlay = new Element('div', {
				'id': this.options.inlayId,
				'styles': {
				backgroundColor : '#000',
				position : 'absolute',
				zIndex: this.options.zIndex - 1,
				left    : 0,
				top     : 0,
				width   : '100%', /*parseInt(($(window).getWidth()-$(window).getScrollLeft())) - 15*/
				height  : parseInt($(window).getScrollSize().y),
				filter  : 'progid:DXImageTransform.Microsoft.Alpha(opacity=0.5)',
				opacity : 0.5,
				'-moz-opacity' : 0.5,
				display : 'none'
			}});
			this.el_inlay.inject(document.body);
		}
		this.el_pop.setStyles({
			position: 'absolute',
			zIndex: this.options.zIndex,
			'background-color': '#fff',
			left    : 0,
			top     : 0
		}).addClass(this.options.popClass);
		
		if(this.options.el_target){
			this.attach_to_el(this.options.el_target);
		}
	},

	attach: function(){
		if (!this.$attaching){
			this.$attaching = true;
			document.addEvent((Browser.Engine.presto) ? 'keypress' : 'keydown', function(e){
				if (e.key == 'esc') {
					this.clear();
				}
			}.bind(this));
			if (this.options.inlayClick){
				this.el_inlay.addEvent('click', function(){
	 				this.hide();
				}.bind(this));
			}
		}
 		return true;
	},

	detach: function(){
		if (this.$attaching){
			this.$attaching = false;
			document.removeEvent((Browser.Engine.presto) ? 'keypress' : 'keydown', $empty);
			if (this.options.inlayClick){
				this.el_inlay.removeEvent('click', $empty);
			}
		}
		return false;
	},

	attach_to_el: function(el){
		if ( el ){
			el.addEvents({
				'mousedown': function(e){
					if(e.rightClick) return;
					if(!this.visible){
						if (!this.$attaching) this.attach();
						this.show();
					} else {
 						this.hide();
					}
					e.stop();
				}.bind(this),

				'mouseup': function(e){
					this.detach();
					e.stop();
				}.bind(this)
			});
		}
	},

	show: function(){
		if ( this.visible ) return;
		this.visible = true;

		if (this.options.url){
			var req = new Request.HTML({
				url: this.options.url,
				evalScripts: false,
				evalResponse: false,
				onRequest: function(){
					this.splash.show();
				}.bind(this),
				onSuccess: function(tree, elements, html, js){
					this.splash.hide();
                                        this.el_pop.empty().setStyles({
						'z-index': this.options.zIndex,
						'visibility': 'hidden',
						'display': (!this.visible) ? 'none' : 'block'
					});
					this.el_pop.set('html', html.replace(/xcript/g, 'script'));
					this.el_inlay.setStyles({
						'z-index': this.options.zIndex - 1,
						'opacity': 0.5,
						'width'  : '100%',
						'height' : parseInt($(window).getScrollSize().y),
						'display': 'block'
					});
					if (Browser.Engine.trident) this.el_inlay.setStyles({
						'filter': 'progid:DXImageTransform.Microsoft.Alpha(opacity=0.5)'
					});

					$exec(js);

					var cordinates = this.el_pop.getCoordinates();
					var position = {
						left: (!this.options.width) ? cordinates.width : this.options.width,
						top: (!this.options.height) ? cordinates.height : this.options.height
					};
					
					var max = document.getCoordinates(), scroll = document.getScroll();
			        max.left += scroll.x;
			        max.right += scroll.x;
			        max.top += scroll.y;
			        max.bottom += scroll.y;
			        
			        if (scroll.y > this.el_pop.getSize().y){
						$(document.body).setStyle('overflow', 'hidden');
			        }
					
					ttop = (Math.max($(window).getScroll().y + ($(window).getSize().y - position.top) / 2, max.top) );
					
					this.el_pop.setStyles({
						'z-index': this.options.zIndex,
						'left': parseInt(($(window).getScroll().x + $(window).getSize().x) / 2) - parseInt(position.left / 2),
						'top': ttop > 2 ? ttop:2,
						'visibility': 'visible',
						'opacity': this.options.opacity
					});
//					
//			 		if (!Browser.Engine.trident) {
//			 			this.fx.start('opacity', 0, this.options.opacity);
//			 		}
//			 		
			 		$A($$('.pop_close')).each(function(el){
						el.addEvent('click', this.clear.bind(this));
					}.bind(this));
			 		this.fireEvent('popupReady');

				}.bind(this),
				onFailure: function(){
					this.splash.hide();
				}.bind(this)
			});
			req.get();
		}
	},
    clear: function(){
        this.hide();
        this.el_pop.empty();
    },
	hide: function(){
		if ( !this.visible ) return;
		this.visible = false;
		this.splash.hide();
		this.el_inlay.setStyle('display', this.visible ? 'block' : 'none');
		if(!Browser.Engine.trident){
			this.fx.start('opacity', this.options.opacity, 0);
			$(document.body).setStyle('overflow', '');
		}else {
			this.el_pop.empty();
			this.el_pop.setStyle('visibility', 'hidden');
			$(document.body).setStyle('overflow', 'auto');
		}
	}
});

var Splasher = new Class({

	Implements: Options,

	options: {
		zIndex: 100,

		splashClass: 'splash',
		image: '/images/loading.gif'
	},

	initialize: function(options){
		this.setOptions(options);
		this.splash = new Element('img',{'src': this.options.image})
			.inject(document.body)
			.addClass(this.options.splashClass)
			.setStyles({
				'position': 'absolute',
				'display': 'none'
			});
		this.size = {
			width: this.splash.getSize().x,
			heiht: this.splash.getSize().y
		}

	},

	show: function(){
		if (this.visible) return;
		if (this.splash){
			var max = document.getCoordinates(), scroll = document.getScroll();
	        max.left += scroll.x;
	        max.right += scroll.x;
	        max.top += scroll.y;
	        max.bottom += scroll.y;
	        ttop = (Math.max($(window).getScroll().y + ($(window).getSize().y - $(window).getHeight()/2), max.top) );
	        
			this.visible = true;
			this.splash.setStyles({
				zIndex: this.options.zIndex,
				display: (!this.visible) ? 'none' : 'block',
				left: parseInt(($(window).getScrollLeft() + $(window).getWidth()) / 2) - parseInt( 160 / 2),
				top: ttop//parseInt(($(window).getScrollTop() + $(window).getHeight()) / 2) - parseInt( 24 / 2)
			});
		}
	},

	hide: function(){
 		if (!this.visible) return;
		if (this.splash){
			this.visible = false;
			this.splash.setStyles({
				display: (!this.visible) ? 'none' : 'block'
			});
		}
	}
});


