/**
 * 
 */

var Mx = {
	urls: {
		img:		'/resources/img',
		design:	'/resources/img/design',
		ie:		'/resources/IE'
	},

	params: {
		animTime:		1.5,
		quoteTime:		7
	},

	html: {
		error:		'Une erreur du serveur est survenue'
	},

	css: {
		errorClass:		'Error',
		warningClass:	'Warning',
		msgClass:		'Message',
		stepClass:		'AnimStep'
	},

	foo: 'Internal'
};

// Key listener (key checker & callback function)
function listenKey (key, callback) {
	// Extracting optional additional parameters (from arguments) to pass to final function (listener)
	var args = $A(arguments).slice(2);
	var listener = window.document.on('keydown', function(event) {
		if (event.keyCode == key)	// Checking key pressed
		{
			// merging args in listener, if any, and call
			if (args.size() > 0)
				callback.apply(callback, args);
			callback.call();
		}
	});
	// Returning listener so we'll be able to start/stop the listener from the caller
	return listener;
}

// TODO: dégager style de la box de Generic et la mettre dans la class...
var MxBox = Class.create ({
	initialize: function (content, title, style) {
		this.icon = 'iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAADAFBMVEX+/v62AAD87fGYAAD6y9L3c3y4EAwnAAD89PPpQkzoO0X1Q0v2pqhuLEICAADmHSLaFBfjDhDTIR/2hYv4U1yljJA3AAL1DhDHAADWAgHzLDKYiYllAACoAACniYnzNDrpY2vEi4vhfpDkd4X6AQD74N7lAgDpkI7GEQvJJSjzYmzxkY7XEgz0O0S/IRvQMS7mFhfdHiMAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABghghghggAN7gAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADQ0bPOAAAAAXRSTlMAQObYZgAAAAlwSFlzAAALEgAACxIB0t1+/AAAAJdJREFUeNptT1sOwiAQ3BGr0vr4aXRR8YlYrc/7H8kzmLhA61cnhMlMZneAqAtI1FOJ+1k2aHgYeKRzXYgz1lrnE0lPIRMAviGEj9zzBbOJZ7lKS9bGCoDZpm1R2+Ds9v/agwqGVa0+SjzCNhrMXDpmIL7wJAW+PFdOanARwxrjrzXRzRlzf4RIFTWRd8UzLXnVif276+c/y8IMeYcYrDYAAAAASUVORK5CYII=';
		this.title = title;
		var hasTitle = Object.isString(title) && title.length > 0;
		this.content = content;
//		var boxStyle = {};
//		if (!Object.isUndefined(style.height))
//			boxStyle.height = style.height;
		var win = document.viewport.getDimensions();
		var maxBoxHeight = win.height - 2*15 - (hasTitle ? 25+10 : 0) - 2*5;
		var closeIconStyle = (Prototype.Browser.IE ? 'float:right;' : 'position:absolute; right: 0;') +
									' margin: 4px 4px 0 0; cursor: pointer;';
		this.tpl =
			'<table id="BoxContainer"><tr><td>' +
				'<span id="Box" style="padding: 15px;">' +
					'<div style="'+(Prototype.Browser.IE ? '' : 'position:relative;')+'">' +
							'<img src="data:image/png;base64,'+this.icon+'" onclick="closeBox();" style="'+closeIconStyle+'" />' +
						(
						hasTitle ?
						'<h2 style="margin: 0 0 10px 0; padding: 0 25px; font-size: 1.4em; text-align: center;">' +
							'#{title}' +
						'</h2>' : '') +
						'<div id="BoxContent" style="max-height: '+maxBoxHeight+'px; padding: 0 20px; overflow: auto;">#{content}</div>' +
					'</div>' +
				'</span>' +
			'</td></tr></table>';
		this.elt = null;
	},
	show: function () {
		var box = this.tpl.interpolate({title: this.title, content: ''});
		$(document.body).insert({top: box});
		// Registering variable 'elt' for closing...
		this.elt = $('BoxContainer');
		$('BoxContent').update(this.content);

		// IE Box Widh nonsense hack...
		if (Prototype.Browser.IE) {
			var boxContent = $('BoxContent');
			// Setting iFrame's Width
			var frameWidth = boxContent.childElements().first().getWidth();//.firstDescendant().getWidth(); ???
			boxContent.setStyle({width: frameWidth+'px'});
			// Setting BoxContent parent's Width
			var boxContentWidth = boxContent.getWidth();
			boxContent.up().setStyle({width: boxContentWidth+'px'});
		}
		if (Object.isUndefined(this.listener))
			this.listener = listenKey(Event.KEY_ESC, closeBox);
		else
			this.start();
	},
	close: function () {
		if (this.elt)
		{
			this.listener.stop();
			this.elt.remove();
			this.elt = null;
		}
	}
});

var box;
//Display centered Box
function showBox (content, title) {
	if (!$('BoxContainer'))
	{
		box = new MxBox(content, title);
		box.show();
	}
	return false;
}

function closeBox () {
	box.close();
	return false;
}