Debug = {
	_element: null,
	_tm: null,

	clear: function() {
		this._element.update('');
	},
	error: function(err) {
		return Debug.write(Builder.node('div', { 'class': 'error' }, [
				Builder.node('strong', err.fileName + ':' + err.lineNumber),
				Builder.node('br'),
				Builder.node('span', err.message)
			]), true);
	},
	write: function(str, force) {
		if (!force) return true;

		if (this._tm != null) clearTimeout(this._tm);

		try {
			var el = this._getElement();
			this._getElement().insertBefore(Builder.node('div', [str, Builder.node('hr')]), el.firstChild);
			new Effect.Opacity(this._getElement(), { duration: 0.2, from: 0, to: 1});
		} catch(e) { alert(e); };

		new Effect.Highlight(this._getElement(), { duration: 1});

		this._tm = setTimeout(function() {
			new Effect.Opacity(this._getElement(), { duration: 1, from: 1, to: 0});
		}.bind(this), 10*1000);

		return this._getElement();
	},
	_getElement: function() {
		
		return this._element == null ? this._create() : this._element;

	},
	_create: function() {

		this._element = $(Builder.node('div', { id: 'debug' }));
		document.body.appendChild(this._element);

		this._element.style.position 	= 'absolute';
		this._element.style.top			= '5px';
		this._element.style.right		= '5px';
		this._element.style.width		= '400px';
		this._element.style.height		= '400px';
		this._element.style.overflow	= 'auto';

		this._element.style.backgroundColor = '#ffffff';
		this._element.style.borderColor = 'red';
		this._element.style.borderStyle = 'solid';
		this._element.style.borderWidth = '1px';
		this._element.style.padding = '5px';
		return this._element;
	}
};