document.observe('dom:loaded', function()
{
	if(window.XMLHttpRequest)
	{
		$$('[popup]').each(function(obj)
		{
			obj.observe('click', openPopup);
		});
	}
});


var Popup = Class.create(
{
	initialize: function(url)
	{
		this.isOpen = false;
		this.width = 0;
		this.url = url;

		this.mask = new Element('div');
		this.mask.addClassName('popupMask');
		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('header');
		temp.addClassName('png');
		this.popup.insert(temp);

		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('<p style="text-align: center;"><a href="javascript:void(0);" onclick="closePopup();">Close this window</a></p>');
		
		this.logo = new Element('div');
		this.logo.addClassName('logo');
		this.content.insert({top: this.logo});
		
		new Ajax.Request(url, 
		{ 
			method: 'get',
			onSuccess: function(transport)
			{
				this.logo.insert({after: transport.responseText});
				this.resize();
				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']);
	},
	
	resize: function()
	{
		// This appears to be a useless function, so I got rid - Stu :�)
		
		//this.content.style.height = this.content.getHeight() + 'px'; 
		//this.parts['frame'].style.width = this.popup.getWidth() + 'px';
		//this.parts['frame'].style.height = this.popup.getHeight() + 'px';
	},
	
	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.resize();
		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();
		$('page').style.filter = '';
	}
});

var currentPopup = null;

function openPopup(e)
{
	closePopup();
	currentPopup = new Popup(e.element().getAttribute('popup'));
	currentPopup.open();
	e.stop();
}

function closePopup()
{
	if(currentPopup != null && currentPopup.isOpen)
	{
		currentPopup.close();	
	}
}







