var mooPopCoords = {x: 0, y: 0};


var MooPop = new Class({
	
	Implements: Options,
	
	header: 'Powiadomienie',
	message: '',
	screen: {x:0, y:0},
	scroll: {x:0, y:0},
	window: {x:0, y:0},
	types: ['ok','error','notice','info','help','confirm'],
	scrollTimer: null,
	prev: {x: 0, y: 0},
	options: {
		css: 'grey',
		text: 'Ok',
		confirm: {status: false, action: '', text: 'Ok'},
		action: '',
		drag: true,
		opacity: .5,
		type: 'ok', // podstawowy 'ok'
		header: ''
	},
	
	initialize: function(header,message,options) {
		
		if (header=='' || message=='') return false;
		
		this.header = header;
		this.message = message;
		
		this.setOptions(options);
		
		if (this.options.confirm.action!='' && this.options.confirm.text!='') {
			this.options.confirm.status = true;
		}
		
		this.build();
	},
	dimensions: function() {
		this.screen = getScrollSize();
		this.scroll = getScroll();
		this.window = getSize();
	},
	destroy: function() {
		this.stopScrolling();
		if ($('popup-bg')) $('popup-bg').destroy();
		if ($('popup')) $('popup').destroy();
		if ($('popup-shadow')) $('popup-shadow').destroy();
	},
	build: function() {

		// Usuwamy popupa jeśli juĹź jakis jest
		this.destroy();
		// Wymiary
		this.dimensions();
		
		var background = new Element('div',{
			'id': 'popup-bg',
			'class': 'popup-bg-'+this.options.css,
			'styles': {
				'height': this.screen.y+'px',
				'width': this.screen.x+'px'
			}
		}).injectInside(document.body);
		
		$(window).addEvent('resize', function() {
			if ($('popup-bg')) {
				this.dimensions();
				$('popup-bg').setStyles({
					'height': this.screen.y+'px',
					'width': this.screen.x+'px'
				});
			}
		}.bind(this));
		
		var popup = new Element('div',{
			'id': 'popup',
			'class': 'popup-'+this.options.css
		}).injectAfter(background);
		
		var shadow = new Element('div',{
			'id': 'popup-shadow',
			'class': 'popup-shadow-'+this.options.css
		}).injectAfter(popup);
		
		var header = new Element('div',{
			'class': 'header'
		}).injectInside(popup);
		
		var title = new Element('div',{
			'class': 'title',
			'html': this.options.header && this.options.header!=''?this.options.header:this.header
		}).injectInside(header);
		
		/**
		 * Przycisk 'x' do zamykania okienka
		 */
		new Element('a',{
			'href': '',
			'id': 'moopop-x',
			'class': 'close',
			'events': {
				'click': function(e) {
					new Event(e).stop();
					
					this.destroy();
					
					if (!this.options.confirm.status) {
						if (this.options.action) {						
							switch($type(this.options.action)) {
								case 'string':
									goUrl(this.options.action);
									break;
									
								case 'function':
									this.options.action();
									break;
									
								case 'boolean':
									formConfirmed = false;
									formCanceled = true;
									break;
							}
						}
					} else {
						formCanceled = true;
					}
				}.bind(this),
				'keydown': function(event) {
					var e = new Event(event);
					if (this.options.confirm.status) {
						if (e.code==37) $('moopop-confirm').focus();
						if (e.code==9 || e.code==39) $('moopop-ok').focus();
					} else {
						if (e.code==37) $('moopop-ok').focus();
						if (e.code==9 || e.code==39) $('moopop-ok').focus();
					}
				}.bind(this)
			}
		}).injectInside(header);
		
		/**
		 * Zawartość
		 */
		var content = new Element('div',{
			'class': 'content'
		}).injectInside(popup);
		
		var table = new Element('table',{
			'cellspacing': 0
		}).injectInside(content);
		
		var tbody = new Element('tbody').injectInside(table);
		
		var tr = new Element('tr').injectInside(tbody);
		
		if (this.options.type!='' && this.types.indexOf(this.options.type)>-1) {
			var td = new Element('td',{
				'class': 'icon'
			}).injectInside(tr);
			
			new Element('div',{
				'class': 'popup-icon-'+this.options.type
			}).injectInside(td);
		}

		var tdMessage = new Element('td').injectInside(tr);
		
		var divMessage = new Element('div',{
			'class': 'message',
			'html': this.message
		}).injectInside(tdMessage);
		
		var button = new Element('div',{
			'class': 'button-con'
		}).injectInside(popup);
		
		var innerB = new Element('div').injectInside(button);
		
		/**
		 * Przycisk 'Ok'
		 */
		var ok = new Element('input',{
			'type': 'button',
			'id': 'moopop-ok',
			'class': 'button',
			'value': this.options.confirm.status?"Anuluj":this.options.text,
			'events': {
				'click': function(e) {
					new Event(e).stop();
					
					this.destroy();
					
					if (!this.options.confirm.status) {
						if (this.options.action) {						
							switch($type(this.options.action)) {
								case 'string':
									goUrl(this.options.action);
									break;
									
								case 'function':
									this.options.action();
									break;
									
								case 'boolean':
									formConfirmed = false;
									formCanceled = true;
									break;
							}
						}
					} else {
						formCanceled = true;
					}
				}.bind(this),
				'mouseenter': function() {
					this.addClass('button-over');
				},
				'mouseleave': function() {
					this.removeClass('button-over');
				},
				'keydown': function(event) {
					var e = new Event(event);
					if (this.options.confirm.status) {
						if (e.code==37) $('moopop-x').focus();
						if (e.code==9 || e.code==39) $('moopop-confirm').focus();
					} else {
						if (e.code==37) $('moopop-x').focus();
						if (e.code==9 || e.code==39) $('moopop-x').focus();
					}
				}.bind(this)
			}
		});
		ok.injectInside(innerB);
		//ok.focus();
		
		/**
		 * Dodatkowy przycisk potwierdzenia
		 */
		if (this.options.confirm.status && this.options.confirm.status==true) {
			
			var confirm = new Element('input',{
				'type': 'button',
				'id': 'moopop-confirm',
				'class': 'button-over',
				'value': this.options.confirm.text,
				'styles': {
					'margin-left': '5px'
				},
				'events': {
					'click': function() {
						switch($type(this.options.confirm.action)) {
							case 'string':
								goUrl(this.options.confirm.action);
								break;
								
							case 'function':
								this.destroy();
								this.options.confirm.action();
								break;
								
							case 'boolean':
								this.destroy();
								formConfirmed = true;
								formCanceled = true;
								break;
						}
					}.bind(this),
					'keydown': function(event) {
						var e = new Event(event);
						if (e.code==37) $('moopop-ok').focus();
						if (e.code==9 || e.code==39) $('moopop-x').focus();
					}
				}
			});
			confirm.injectInside(innerB);
			//confirm.focus();
		}
		
		var size = popup.getSize();
		
		var top = this.scroll.y+this.window.y/2-size.y/2;
		top = top<this.scroll.y?this.scroll.y+5:top;
		top = top<=5?5:top;
		var left = this.scroll.x+this.window.x/2-size.x/2;
		
		mooPopCoords= {y: this.window.y/2-size.y/2, x: this.window.x/2-size.x/2};
		
		popup.setStyles({
			'top': top+'px',
			'left': left+'px'
		});
		
		shadow.setStyles({
			'height': (size.y+10)+'px',
			'width': (size.x+10)+'px',
			'top': (top-5)+'px',
			'left': (left-5)+'px'
		});
		
		if (size.y>this.window.y) {
			divMessage.setStyles({
				'height': (this.window.y-130)+'px'
			});
			popup.setStyles({
				'height': (this.window.y-40)+'px'
			});
			shadow.setStyles({
				'height': (this.window.y-22)+'px'
			});
		}
		
		if (this.options.confirm.status && this.options.confirm.status==true) {
			confirm.focus();
		} else {
			ok.focus();
		}
		
		/**
		 * Obsługa przeciągania po ekranie
		 */
		if (this.options.drag) {
			
			header.setStyle('cursor','move');
			
			new Drag.Move(popup,{
				handle: header,
				container: background,
				onSnap: function(el) {
					this.stopScrolling();
					
					if (this.options.opacity>0) {
						el.setOpacity(this.options.opacity);
					}
				}.bind(this),
				onComplete: function(el) {
					
					var scroll = getScroll();
					var pos = $('popup').getPosition();
					
					this.prev.y = pos.y-scroll.y;
					this.prev.x = pos.x-scroll.x;
					
					this.startScrolling();
					
					var coords = $('popup').getPosition();
					
					mooPopCoords.y = coords.y;
					mooPopCoords.x = coords.x;
					
					if (this.options.opacity>0) {
						el.setOpacity(1);
					}
				}.bind(this)
			});
			
			new Drag.Move(shadow,{
				handle: header,
				container: background,
				onSnap: function(el) {
					if (this.options.opacity>0) {}
				}.bind(this),
				onComplete: function(el) {
					if (this.options.opacity>0) {}
				}.bind(this)
			});
		}
		
		this.startScrolling();
	},
	startScrolling: function() {
		
		this.scrollTimer = (function() {
			
			var morphPop = new Fx.Morph('popup',{transition: Fx.Transitions.Cubic.easeOut});
			var morphShadow = new Fx.Morph('popup-shadow',{transition: Fx.Transitions.Cubic.easeOut});
			
			var scroll = getScroll();
			var window = getSize();
			var size = $('popup').getSize();
			
			var top = scroll.y+window.y/2-size.y/2;
			top = top>=0?top:0;
			var left = scroll.x+window.x/2-size.x/2;
			left = left>=0?left:0;
			
			morphPop.start({
				'top': top+'px',
				'left': left+'px'
			});
			
			morphShadow.start({
				'top': (top-5)+'px',
				'left': (left-5)+'px'
			});
			
		}).periodical(500);
	},
	startScrollingOrg: function() {
		
		this.scrollTimer = (function() {
			
			var morphPop = new Fx.Morph('popup',{transition: Fx.Transitions.Cubic.easeOut});
			var morphShadow = new Fx.Morph('popup-shadow',{transition: Fx.Transitions.Cubic.easeOut});

			var scrolls = getScrollSize();
			var scroll = getScroll();
			var pos = $('popup').getPosition();
			
			if (this.prev.y<=0) this.prev.y = pos.y-scroll.y;
			if (this.prev.x<=0) this.prev.x = pos.x-scroll.x;
			
			var top = scroll.y+this.prev.y;
			top = top>=0?top:0;
			var left = scroll.x+this.prev.x;
			left = left>=0?left:0;
			
			this.prev.y = top-scroll.y;			
			this.prev.x = left-scroll.x;
			
			morphPop.start({
				'top': top+'px',
				'left': left+'px'
			});
			
			var sSize = $('popup-shadow').getSize();
			
			top = top+sSize.y>scrolls.y?scrolls.y-sSize.y:top-5;
			left = left+sSize.x>scrolls.x?scrolls.x-sSize.x:left-5;
			
			morphShadow.start({
				'top': top+'px',
				'left': left+'px'
			});
			
		}.bind(this)).periodical(500);
	},
	stopScrolling: function() {
		$clear(this.scrollTimer);
	}
});