document.observe('dom:loaded', function()
{
	if(window.XMLHttpRequest)
	{
		$$('[popup]').each(function(obj)
		{
			obj.observe('click', openPopup);
		});
	}
});


var Popup = Class.create(
{
	initialize: function(url, form)
	{
		this.isOpen = false;
		this.width = 0;
		this.url = url;

		this.closeable = true;
		
		if(url.indexOf('#noClose') != -1)
		{
			this.closeable = false;
			this.url = this.url.replace('#noClose', '');
		}
		
		formData = form == null ? null : form.serialize( { hash: true } );
		
		this.mask = new Element('div');
		this.mask.addClassName('popupMask');
		
		if(this.closeable)
		{
			this.mask.observe('click', this.close.bind(this));
		}
				
		this.mask.setOpacity(0.5);

		this.popup = new Element('div');
		this.popup.addClassName('popup');

		this.parts = Array();
		
		temp = new Element('div');
		temp.addClassName('topLeft');
		this.popup.insert(temp);

		temp = new Element('div');
		temp.addClassName(this.closeable ? 'header' : 'headerNoClose');
		temp.addClassName('png');
		this.popup.insert(temp);

		if(this.closeable)
		{
			closeButton = new Element('div');
			closeButton.addClassName('close');
			closeButton.observe('click', this.close.bind(this));
			temp.insert(closeButton);
		}
		
		this.content = new Element('div');
		this.content.addClassName('content');
		this.content.addClassName('png');
		
		this.content.update('<div id="popupContent"></div>');
		
		this.logo = new Element('div');
		this.logo.addClassName('logo');
		this.content.insert({top: this.logo});
		
		new Ajax.Request(this.url, 
		{ 
			method: 'post',
			parameters: formData,
			onComplete: function(transport)
			{
				$('popupContent').update(transport.responseText);
				this.reposition();
				
			}.bind(this)
		});
		
		this.popup.insert(this.content);

		temp = new Element('div');
		temp.addClassName('footer');
		temp.addClassName('png');
		this.popup.insert(temp);

		this.parts['frame'] = new Element('iframe');
		this.parts['frame'].src = 'about:blank';
		this.parts['frame'].addClassName('iefix');
		this.popup.insert(this.parts['frame']);
	},
	
	reposition: function()
	{
		
		this.mask.style.height = Math.max(document.viewport.getHeight(), document.body.getHeight()) + 'px';
		this.mask.style.width = Math.max(document.viewport.getWidth(), document.body.getWidth()) + 'px';
		
		offset = document.viewport.getScrollOffsets();
		
		this.popup.style.left = Math.max(0, (document.viewport.getWidth() - this.popup.getWidth()) / 2 + offset['left']) + 'px';
		this.popup.style.top = Math.max(0, (document.viewport.getHeight() - this.popup.getHeight()) / 2 + offset['top']) + 'px';
	},
	
	open: function()
	{
		this.isOpen = true;
		Element.extend(document);
		Element.extend(document.body);

		document.body.childElements().each(function(o)
		{
			o.style.filter = 'progid:DXImageTransform.Microsoft.BasicImage(grayscale=1)';
		});
		
		document.body.insert(this.mask);
		document.body.insert(this.popup);
		
		this.reposition();
		
		Event.observe(window, 'scroll', this.reposition.bind(this));
		Event.observe(window, 'resize', this.reposition.bind(this));
	},
	
	close: function()
	{
		this.isOpen = false;

		this.mask.remove();
		this.popup.remove();
		
		document.body.childElements().each(function(o)
		{
			o.style.filter = '';
		});
	}
});

var currentPopup = null;

function openPopup(e)
{
	closePopup();
	
	var form = null;
	
	if(e.element().tagName == 'BUTTON')
	{
		e.element().ancestors().each(function(o)
		{
			if(o.tagName == 'FORM')
			{
				form = o;
			}
		});
	}
	
	currentPopup = new Popup(e.element().getAttribute('popup'), form);
	currentPopup.open();
	
	e.stop();
	return false;
}

function closePopup()
{
	if(currentPopup != null && currentPopup.isOpen)
	{
		currentPopup.close();	
	}
}