var preBox = 
{
	scrollTop: 0,
	scrollLeft: 0,
	
	disable: function(element)
	{
		// Get the element dimensions
		var el_dimensions = Element.getDimensions(element);
		
		// Create the background html
		background = "<div id=\"preBox-bg\" onclick='javascript:preBox.hideMessage(document.body);'></div>";
		
		// Insert the background html into the element
		Element.insert(element, {top: background});
		
		// Get the actual background object in the DOM
		background = Element.firstDescendant(element);
		
		// Make the container positioned
		if ( element.tagName.toLowerCase() != "body" )
		{
			element.makePositioned();
		}
		
		// Set all the background styles
		Element.setStyle(background, {
			position: 'absolute',
			display: 'block',
			top: '0px',
			left: '0px',
			width: el_dimensions.width + 'px',
			height: el_dimensions.height + 'px',
			background: '#000000',
			opacity: 0.2,
			zIndex: 999
		});	

        
	},
	
	disableWindow: function(_window)
	{
		_window = _window || window;
		
		var body = _window.document.body;
		
		preBox.maximize(body, _window);
		preBox.disable(body);
	},
	
	enable: function(element)
	{
		var background = Element.firstDescendant(element) || false;
		
		// Make sure you have the background
		if ( background && Element.identify(background) == "preBox-bg" )
			Element.remove(background);
	},
	
	enableWindow: function(_window)
	{
		_window = _window || window;
		
		var body = _window.document.body;
			
		preBox.enable(body);
	},
	
	showMessage: function(element, html)
	{
		var scroll_offset = Util.getScrollOffset();
		
		preBox.scrollTop = scroll_offset.top;
		preBox.scrollLeft = scroll_offset.left;
		
		Element.observe(window, 'scroll', preBox.stopScroll);
		
		element = $(element);
		
		// The the element's minimum height
		Element.setStyle(element, {
			minHeight: "70px"
		});
		
		// Get the element dimensions
		var el_dimensions = Element.getDimensions(element);
		
		// Create the background and message box HTML
		var background = "<div id=\"preBox-bg\" onclick='javascript:preBox.hideMessage(document.body);' style=\"position: absolute; visibility: hidden;\"></div>";
		var box = "<div id=\"preBox-box\" onclick='javascript:preBox.hideMessage(document.body);' style=\"position: absolute; visibility: hidden; float: left;\"></div>";
		
		// Insert the background and message box in reverse order to put the
		// background before the message box in the DOM
		Element.insert(element, {top: box});
		Element.insert(element, {top: background});
		
		// Get the actual background and message box objects in the DOM
		background = Element.firstDescendant(element);//.down('#preBox-bg');
		box = background.next();//element.down('#preBox-box');
		
		// Make the container positioned
		Element.makePositioned(element);
		
		// Insert the message into the message box
		box.insert({top: html});
		
		// Get the message box dimensions
		var box_dimensions = box.getDimensions();
		
		// Set all the background styles
		background.setStyle({
			visibility: 'visible',
			top: '0px',
			left: '0px',
			width: el_dimensions.width + 'px',
			height: el_dimensions.height + 'px',
			background: '#000000',
			opacity: 0.2,
			zIndex: 999
		});
		
		var v_dim = document.viewport.getDimensions();
		
		var box_top = Math.floor((v_dim.height - box_dimensions.height) / 2) + preBox.scrollTop;
		var box_left = Math.floor((v_dim.width - box_dimensions.width) / 2) + preBox.scrollLeft;
		
		// Set all the message box styles
		box.setStyle({
			visibility: 'visible',
			display: 'inline',
			float: 'none',
			top: box_top + 'px',
			left: box_left + 'px',
			maxWidth: Math.floor(el_dimensions.width / 2) + 'px',
			maxHeight: Math.floor(el_dimensions.height * 0.6) + 'px',
			zIndex: 999
		});
        
        
        
        
	},
	
	showLoading: function(element)
	{
		preBox.showMessage(element, 'Loading');
	},
	
	hideMessage: function(element)
	{
		Element.stopObserving(window, 'scroll', preBox.stopScroll);
		
		element = $(element);
		
		var bg = $('preBox-bg');
		var box = $('preBox-box');
		
		// Make sure you have the background
	   if ( bg )
	   {
	       bg.remove();
	   }
	   
	   // Make sure you have the box
	   if ( box )
	   {
		   box.remove();
	   }//element.down('#preBox-box') )
	       //element.down('#preBox-box').remove();
			
	},
	
	hideLoading: function(element)
	{
		preBox.hideMessage(element);
	},
	
	stopScroll: function()
	{
        
        
		//window.scrollTo(preBox.scrollLeft, preBox.scrollTop);
	},
	
	maximize: function(element, _window)
	{
		element = $(element);
		
		_window = _window || window;
		
		var doc = _window.document;
		
		element.setStyle({
			width: "100%",
			height: doc.viewport.getHeight() + "px"
		});
	},
	
	_createMessage: function(msg)
	{
        
    
		return "<div style='padding: 8px;'>" +
				"<div style='text-align: right;height: 8px;'><a href='javascript:void(0);' " +
				"onclick='javascript:preBox.hideMessage(document.body);' " +
				"style='margin-right: -8px;margin-top: 8px;'><img src='/images/mw/black_x.png' " +
				"width='16' height='16' border='0' alt='Close' title='Close' /></a></div>" +
				"<div style='padding:8px;background-color: #000000;text-transform: uppercase;'>" + type + "</div>" +
				"<div style='text-align: center;padding: 10px;background-color: #000000;'>" + msg +"</div></div>";
	}
}