document.observe('dom:loaded', function() {
	$$('.j-expander').each(function(el){
		autoExpandContract(el);
	})
});

function autoExpandContract(el) {
	var __heightFromElement = el.offsetHeight;
	var __heightFromCSS = parseInt(getStyleFromCSS(el, 'height'));

	if (__heightFromCSS > 0) {
		__heightFromElement = __heightFromCSS;
	}

	$(el).setStyle({overflow: 'hidden', overflowX: 'auto'});

	el.style.width = getStyleFromCSS(el, 'width')+'px';
	el.style.height = getStyleFromCSS(el, 'height')+'px';

	var dummy_id = Math.floor(Math.random()*99999) + '_dummy';
	var div = document.createElement('div');

	div.setAttribute('id',dummy_id);
	document.body.appendChild(div);
	var dummy = $(dummy_id);

	dummy.style.fontFamily = getStyleFromCSS(el, 'font-family');
	dummy.style.fontWeight = getStyleFromCSS(el, 'font-weight');
	dummy.style.fontSize = getStyleFromCSS(el, 'font-size')+'px';


	if (navigator.userAgent.indexOf('MSIE') !=-1) {
		dummy.style.width = getStyleFromCSS(el, 'width');
	} else {
		dummy.style.width = getStyleFromCSS(el, 'width')+'px';
	}
	dummy.style.padding = getStyleFromCSS(el, 'padding');
	dummy.style.margin = getStyleFromCSS(el, 'margin');
	dummy.style.overflowX = 'auto';
	dummy.style.position = 'absolute';
	dummy.style.top = '0px';
	dummy.style.left = '-9999px';
	dummy.innerHTML = ' 42';

	var __lineHeight = dummy.offsetHeight;

	var checkExpandContract = function(){
		var html = el.value;

		html = html.replace(/\n/g, '<br />');
		if (dummy.innerHTML != html) {
			dummy.innerHTML = html;
			var __dummyHeight = dummy.offsetHeight;
			var __elHeight = el.offsetHeight;

			if (__elHeight != __dummyHeight) {
				if (__dummyHeight > __heightFromElement) {
					el.style.height = (__dummyHeight+__lineHeight) + 'px';
				} else {
					el.style.height = __heightFromElement+'px';
				}
			}
		}
	}

	var expandElement = function()	{
		interval = window.setInterval(function() {checkExpandContract()}, 250);
	}

	var contractElement = function() {
		clearInterval(interval);
	}

	$(el).observe('focus', expandElement);
	$(el).observe('blur', contractElement);
	checkExpandContract();
}

function getStyleFromCSS(el, style) {
	var value = $(el).getStyle(style);

	if(!value) {
		if(document.defaultView) {
			value = document.defaultView.getComputedStyle(el, null).getPropertyValue(style);
			} else if(el.currentStyle) {
			value = el.currentStyle[style];
			if (value.substring(value.length-2,value.length) == "px") {
				alert('style' + style);
				value = value+'px';
			}
		}
	}
	if(value.length > 0){
		if (value.charAt(value.length-1) == "x") {
			value = parseInt(value.substring(0,value.length-2))
		}
	}
	return value;

}