var AjaxPopup = new Class({
	Implements: [Events, Options],
	
	initialize: function (options) {
		var width = 600;
		var height = 250;
		var title = 'Untitled Window';
		var url = '';
		var saveTitle = 'Save';
		var closeTitle = 'Close';
		var setPanel = 1;
		
		options = options || {};
		options.width = options.width || width;
		options.height = options.height || height;
		options.title = options.title || title;
		options.url = options.url || url;
		options.saveTitle = options.saveTitle || saveTitle;
		options.saveTitle = options.closeTitle || closeTitle;
		options.setPanel = options.setPanel || setPanel;
		this.setOptions(options);
		this.addEvent('ready', this._init_form);
	},
	
	_initialize: function () {
		this.overlay = new Element('div', {
			'class': 'overlay',
			styles: {
				width: window.getScrollWidth(),
				height: window.getScrollHeight()
			}
		}).inject(document.body);
		
		window.addEvent('resize', function () {
			this.overlay.setStyles({
				width: window.getWidth(),
				height: window.getScrollHeight()
			});
		}.bind(this));
		
		this.popup = new Element('div', {
			'class': 'popup',
			styles: {
				width: this.options.width
			}
		}).inject(this.overlay);
		
		this.popup.setStyle('margin-top', parseInt(this.popup.getStyle('margin-top')) + window.getScroll().y);
		
		var title = new Element('div', {
			'class': 'title'
		}).inject(this.popup);
		
		new Element('span', {
			html: this.options.title
		}).inject(title);
		
		new Element('div', {
			html: 'X'
		}).inject(title).addEvent('click', function () {
			this.close();
		}.bind(this));

		
		this.content = new Element('div', {
			'class': 'content',
			styles: {
				//height: 300/*this.popup.getHeight() - title.getHeight() - (parseInt(this.popup.getStyle('border-bottom-width')) + parseInt(this.popup.getStyle('border-top-width')))*/
			}
		}).inject(this.popup);
		
		this.loader = new Element('div', {
			'class': 'loader'
		}).inject(this.content);
		
		this.loader.setStyles({
			left: this.content.getWidth() / 2 - this.loader.getWidth() / 2,
			top: this.content.getHeight() / 2 - this.loader.getHeight() / 2
		});

		if(this.options.setPanel != 0) {
			var panel = new Element('div', {
				'class': 'action-panel'
			}).inject(this.popup);
			
			this.closeButton = new Element('input', {
				name: 'close',
				type: 'button',
				value: this.options.closeTitle,
				'class': 'close-button'
			}).inject(panel);
			
			this.saveButton = new Element('input', {
				name: 'save',
				type: 'button',
				value: this.options.saveTitle,
				'class': 'save-button'
			}).inject(panel);
			
		}
	},
	
	_init_form: function () {
		this.saveButton.addEvent('click', function () {
			
			try
			{
			this.over = new Element('div', {
				
				
				styles: {
					position: 'absolute',
					left: 0,
					top: 0,
					width: this.popup.getWidth() - parseInt(this.popup.getStyle('border-left-width')) - parseInt(this.popup.getStyle('border-right-width')),
					height: this.popup.getHeight() - parseInt(this.popup.getStyle('border-left-width')) - parseInt(this.popup.getStyle('border-right-width')),
					zIndex: 100,
					background: 'url(/img/b/overlay_white.png)'
				}
			}).inject(this.popup);
			
			this.loader = new Element('div', {
				'class': 'loader'
			}).inject(this.over);
			
			this.loader.setStyles({
				left: this.content.getWidth() / 2 - this.loader.getWidth() / 2,
				top: this.content.getHeight() / 2 - this.loader.getHeight() / 2
			});
			
			var self = this;
			this.fireEvent('beforesubmit');
			
			if(!this.content.getElement('form')) {
				this.close(true);
				return;
			}
			
			this.content.getElement('form').set('send', {
				onSuccess: function (resp) {
					this.resp = resp;
					
					if (resp && !resp.match(/^[0-9]+$/i)) {
						self.over.destroy();
						alert(resp);
					}
					else {
						this.close(true);
					}
				}.bind(this)
			});
			
			this.content.getElement('form').send();
			}catch(e) { alert(e);} 
			
		}.bind(this));
		
		this.closeButton.addEvent('click', function () {
			this.close(false);
		}.bind(this));
	},
	
	ready: function (content) {
		this.loader.destroy();
		this.content.set('html', content);
		
		window.fireEvent('resize', {});
		
		this.fireEvent('ready', {});
	},
	
	close: function (status) {
		var e = { ok: status, _stop: false, stop: function () { this._stop = true }, resp: this.resp };
		
		this.fireEvent('close', e);
		
		if (!e._stop) {
			this.overlay.destroy();
			this.closeButton.destroy();
			this.content.destroy();
			this.popup.destroy();
			this.saveButton.destroy();
		}
	},
	
	open: function (params) {
		this.options.url = params.url;
		this.options.title = params.title;
		this.options.re_init = params.re_init || true;
		this.options.saveTitle = params.saveTitle;
		this.options.setPanel = params.setPanel;
		
		if (this.options.re_init) {
			this._initialize(null);
		}
		
		new Request({
			url: this.options.url,
			method: 'get',
			onSuccess: function (resp) {
				this.ready(resp);
			}.bind(this)
		}).send();
	}
});