DarkenBackground = Class.create();
DarkenBackground.prototype = {
	initialize: function(id, aobj) {
		var self = this;

		var id = id;
		var style = {
			'opacity': 		0.45
		};

		this.element = new Element('div', {'id': id, 'class': 'modal_background'});
		this.element.setStyle(style);

		if (aobj)
		{
			this.obj = aobj;
		}

		this.element.observe('click', function() {
				self.element.remove();

				if (self.obj)
				{
					self.obj.hide();
				}
			}
		);

		this.show();
	},

	show: function() {
		var body = $(body);
		if (! body)
			body = $('body').up();
		if (! body)
			body = $('#body').up();
		if (body)
			body.insert(this.element);
	}
};

ShowModal = Class.create();
ShowModal.prototype = {
	initialize: function (id) {

		var obj = $(id);
		obj.addClassName('modal-dialog');

		var odims = obj.getDimensions();
		var dims = document.viewport.getDimensions();
		var offset = document.viewport.getScrollOffsets();
		
		new DarkenBackground('modal_bg' + id, obj);
		
		obj.setStyle( { 'top': '160px', 'position': 'absolute' } );
		
		jQuery('html,body').animate( { scrollTop: 160 }, 1000 );

		if ( odims.width < dims.width )
		{
			var val = ( dims.width - odims.width + offset.left ) / 2;
			
			obj.setStyle( { 'left': val + 'px' } );
		}
		else
		{
			var val = offset.left;
			
			obj.setStyle( { 'left': offset.left + 'px' } );
		}

		var body = $(body);
		if (! body)
			body = $('body').up();

		var el = obj.remove();
		body.insert(el);
		el.show();
	}
};

jQuery(window).resize
(
	function() 
	{
		jQuery('.modal-dialog:visible:first').each
		(
			function()
			{
				var viewportWidth 	= jQuery(window).width();
				
				var objectWidth		= jQuery(this).width();
				
				var offsetLeft		= jQuery(window).scrollLeft();
				
				if ( objectWidth < viewportWidth )
				{
					var val = ( viewportWidth - objectWidth + offsetLeft ) / 2;
					
					jQuery(this).css( { 'left': val + 'px' } );
				}
				else
				{
					jQuery(this).css( { 'left': offsetLeft + 'px' } );
				}
			}
		)
		;
	}
)
;