// AjaxControls.js
var AjaxControls = new Class({
	initialize: function(el) {
		this.el = $(el);
	},
	disableArea: function() {
		this.disablebox = new Element('div', {
			'styles': {
				'position':'absolute',
				'top':0, 'left':0,
				'width':'100%', 'height':'100%',
				'background':'#FFFFFF',
				'opacity':.6
			}
		});
		this.disablebox.injectInside(this.el);
	},
	enableArea: function() {
		if ($defined(this.disablebox)) this.disablebox.remove();
	},
	loadProgressBox: function(loadingMessage, offsetX, offsetY) {
		this.progressbox = new Element('div').addClass('ajax-loading').setHTML(loadingMessage).injectInside(this.el);
		var c_el = this.el.getCoordinates();
		var c_lb = this.progressbox.getCoordinates();
		// center loading box
		this.progressbox.setStyles({
			position: 'absolute',
			top: (c_el.height/2)-(c_lb.height/2)+offsetY,
			left: (c_el.width/2)-(c_lb.width/2)+offsetX
		});	
	},
	removeProgressBox: function() {
		if ($defined(this.progressbox)) this.progressbox.remove();
	},
	loadCompleteBox: function(loadingMessage, offsetX, offsetY) {
		this.completebox = new Element('div').addClass('ajax-complete').setHTML(loadingMessage).injectInside(this.el);
		var c_el = this.el.getCoordinates();
		var c_lb = this.completebox.getCoordinates();
		// center loading box
		this.completebox.setStyles({
			position: 'absolute',
			top: (c_el.height/2)-(c_lb.height/2)+offsetY,
			left: (c_el.width/2)-(c_lb.width/2)+offsetX
		});	
	},
	removeCompleteBox: function() {
		if ($defined(this.completebox)) this.completebox.remove();
	},
	loadAlertBox: function(message) {
		this.alertbox = new Element('div').addClass('form-message').setOpacity(0).setHTML(message).injectInside(this.el);
		// set close link
		this.closelink = new Element('a').setProperty('href', '#').addClass('close-btn').injectInside(this.alertbox);
		function fn() {
			this.alertbox.remove();
			this.disablebox.remove();
		}
		var bindfn = fn.bind(this);
		this.closelink.addEvent('click', function(e) {
			new Event(e).stop();
			bindfn();
		});
		// Popout Effect
		var c_el = this.el.getCoordinates();
		var c_ab = this.alertbox.getCoordinates();
		new Fx.Styles(this.alertbox, {duration: 300,transition: Fx.Transitions.linear}).start({
			'top': [c_el.height/2, (c_el.height/2)-(c_ab.height/2)-35],
			'left': [c_el.width/2, (c_el.width/2)-(c_ab.width/2)-7],
			'height': [0, c_ab.height],
			'width': [0, c_ab.width],
			'opacity': [0, 1]
		});
	}
});