var Layer = Class.create({
	initialize: function(url) {
		// for the Ajax request
		this.ajaxUrl = url;
		this.ajaxMethod = 'get';
		this.ajaxParameters = null;
		// for the box
		this.title = '';
		this.maxHeight = null;
		this.width = null;
		this.height = null;
		this.marginLeft = null;
	},

	setMethod: function (m) {
		this.ajaxMethod = m;
	},

	setParameters: function (p) {
		this.ajaxParameters = p;
	},

	setTitle: function (t) {
		this.title = t;
	},

	setWidth: function (width) {
		this.width = width;
	},

	setHeight: function (height) {
		this.height = height;
	},

	// Math.round(document.viewport.getWidth() / 2) - ?
	setMarginLeft: function (marginLeft) {
		this.marginLeft = marginLeft;
	},

	setVerticalScrollbar: function (maxHeight) {
		this.maxHeight = maxHeight;
	},

	showLayer: function (ajaxResponse) {
		// the wrapper

		var wrapper = new Element('div', { 'id': 'mb_wrapper' }).update(ajaxResponse);
		if (this.maxHeight != null) {
			wrapper.setStyle({overflow: 'auto', height: this.maxHeight + 'px'});
		}

		// the options
		var options = {
			title: this.title,
			overlayClose: false,
			transitions: false,
			autoFocusing: false,
			overlayOpacity: .5
		};
		if (this.width != null) {
			options['width'] = this.width;
		}
		if (this.height != null) {
			options['height'] = this.height;
		}

		// show the box
		Modalbox.show(wrapper, options);

		// alter design of the box
		if (this.width != null) {
			$('MB_frame').setStyle({'width': this.width + 'px'});
		}
		var mbWindow = $('MB_window');
		mbWindow.setStyle({marginTop: '40px'});
		if (this.marginLeft != null) {
			mbWindow.setStyle({'left': this.marginLeft + 'px'});
		}
	},

	request: function() {
    var MyObject = this;
		new Ajax.Request(MyObject.ajaxUrl, {
			method: MyObject.ajaxMethod,
			parameters: MyObject.ajaxParameters,
			contentType: 'application/x-www-form-urlencoded',
			encoding: 'iso-8859-1',
			onSuccess: function(transport) {
				MyObject.showLayer(transport.responseText);
			}
		});
	}
});

// les fichiers js ŕ includre dans l'ordre
// prototype.js
// scriptaculous.js
// effects.js
// modalbox.js
// ajax_modalbox.js
// ne pas oublier modalbox.css

// effectue une requete ajax et affiche une modalbox
// la modalbox contiendra exactement le contenu retourné par l'url
// exemple:
// AjaxModalBox("page.php", "post", "var1=toto&var2=8");
// AjaxModalBox("page.php", "get", "");
function ajaxModalBox(url, method, parameters, title, maxHeight, left, width, height)
{
	new Ajax.Request(url, {
		method: method,
		parameters: parameters,
		contentType: 'application/x-www-form-urlencoded',
		encoding: 'iso-8859-1',
		onSuccess: function(transport) {
			var response = transport.responseText;
			showModalBox(response, title, maxHeight, left, width, height);
		}
	});
	return false;
}

function showModalBox(html, titleMb, maxHeight, left, width, height)
{
	var div = new Element('div', { 'id': 'mb_wrapper' }).update(html);
	if (typeof maxHeight != "undefined") {
		div.setStyle({overflow: "auto", height: maxHeight + "px"});
	}
	var options = {
		title: titleMb,
		overlayClose: false,
		transitions: false,
		autoFocusing: false,
		overlayOpacity: .5
	};
	if (typeof width != "undefined") {
		options['width'] = width;
	}
	if (typeof height != "undefined") {
		options['height'] = height;
	}
	Modalbox.show(div, options);

	if (typeof width != "undefined") {
		$('MB_frame').setStyle({'width': width + "px"});
	}
	var mbWindow = $("MB_window");
	//var widthFrame = mbWindow.down('#MB_frame').getStyle('width'); // :( au 2e affichage
	mbWindow.setStyle({marginTop: "40px"});
	if (typeof left != "undefined") {
		mbWindow.setStyle({'left': left + "px"});
	}
}