/*
	Blockui and modal mixed togather...
	Small code to get things going... 
	
	//http://jqueryjs.googlecode.com/svn/trunk/plugins/blockUI/jquery.blockUI.js
	//http://www.wildbit.com/labs/modalbox/
*/
if(typeof Effect == 'undefined')
  throw("blockUi.js requires including script.aculo.us' effects.js library!");
  
var AJBlockUI = Class.create();
AJBlockUI.prototype = {
	initialize : function(options) {
	
	},
	options: {
		 // message displayed when blocking (use null for no message)
	    message:  '<h1>Please wait...</h1>',
	    
	    // styles for the message when blocking; if you wish to disable
	    css: { 
	        padding:        0,
	        margin:         0,
	        width:          '30%', 
	        top:            '40%', 
	        left:           '35%', 
	        textAlign:      'center', 
	        color:          '#000', 
	        border:         '3px solid #aaa',
	        backgroundColor:'#fff',
	        cursor:         'wait',
			position:		'absolute'
	    },
	    
	    // styles for the overlay
	    overlayCSS:  { 
	        opacity:        '0.8',
			width:          '100%',
			height:        	'100%',
			position:		'absolute',
			top:	'0',
			left: '0',
			zindex: '999'
	    },
	    
	    // z-index for the blocking overlay
	    baseZ: 1000,
		
	    appearDuration: '0.5',
		fadeDuration: '0.5',
		animationDuration: '0.5'
	},
	show : function(options) {
		
		var msg = options && options.message !== undefined ? options.message : undefined;
		Object.extend(this.options, options || {});
		Object.extend(this.options.overlayCSS, options.overlayCSS || {});
		css = Object.extend({}, this.options.css, options.css || {});
		msg = msg === undefined ? this.options.message : msg;
		this.options.overlayCSS.height = $$('body').reduce().getHeight() +'px';
		var overLay = new Element('div', {id: 'overlay'});
		overLay.setOpacity(0.0);
		
		overLay.setStyle(this.options.overlayCSS);
						  
        document.body.insert({bottom: overLay});
		new Effect.Appear('overlay', { duration: this.options.appearDuration, from: 0.0, to: this.options.overlayCSS.opacity });
		
		var blockUI = new Element("div", {id: "blockUI"}).setStyle(css).hide();
		var hiddenDiv = new Element("div", {id: "blockUI_content_hidden"}).setStyle(css).hide();
		overLay.insert({after: blockUI});
		blockUI.insert({after: hiddenDiv});
		new Effect.Appear('blockUI', { duration: this.options.appearDuration, from: 0.0, to: 1.0});
		this.updateContent (msg, true, .5);
	},
	destroy: function() {
		 new Effect.Fade('overlay', {
		 							duration: this.options.fadeDuration, 
									from: this.options.overlayCSS.opacity, 
									to: 0.0
									}
						 );
       	 new Effect.Fade('blockUI', {
		 							duration: this.options.fadeDuration, 
									from: 1.0, 
									to: 0.0, 
									afterFinish: function(){
                											$('overlay').remove();
                											$('blockUI').remove();
        													}
									}
						);
	},
	updateContent: function(content, resize, duration)
	{
		
		$('blockUI_content_hidden').update(content);
		if(typeof resize == 'undefined')
		{
			var resize = true;
		}
		if(typeof duration == 'undefined')
		{
			var duration = this.options.animationDuration;
		}
		if (!resize)
		{
			var dimensions = $('blockUI_content_hidden').getDimensions();
			this.resizeByWidthHeight(dimensions.width, dimensions.height, duration);
		}
		$('blockUI').update(content);
	},
	resizeByWidthHeight: function(width,height,morphTime)
	{
		if(typeof morphTime == 'undefined')
		{
			var morphTime = this.options.animationDuration;
		}
		var h = 'height:' + height +'px';
		var w = 'width:' + width +'px';
		new Effect.Morph('blockUI', {style:h, duration: morphTime});
		new Effect.Morph('blockUI', {style:w, duration: morphTime, delay: .3});
		
	},
	animateBlockUI: function(style, time)
	{
		new Effect.Morph('blockUI', {style:style, duration: time});
	}
};

Event.observe(window, 'load', ajblockuiinit, false);

//
//	Set up all of our links
//
var myAJBlockUI = null;
function ajblockuiinit() {
	myAJBlockUI = new AJBlockUI();
}