var Elastic = Class.create();
Elastic.prototype =
{
  initialize: function(inputElement)
	{
		this.textarea = $(inputElement);

		this.textarea.setStyle({'overflow':'hidden'});
    this.initialHeight = this.textarea.getHeight();
    this.currentHeight = -1;

		this.fakeText = new Element('div',
					{'display'       : 'none',
            'width'         : this.textarea.getWidth() ?
															(this.textarea.getWidth() + "px") :
															this.textarea.getStyle('width'),
//                  'whiteSpace'    : 'pre-wrap',
//						'fontFamily'    : this.textarea.getStyle('fontFamily'),
//						'fontSize'      : this.textarea.getStyle('fontSize'),
//						'lineHeight'    : this.textarea.getStyle('lineHeight'),
						'paddingTop'    : this.textarea.getStyle('paddingTop'),
						'paddingLeft'   : this.textarea.getStyle('paddingLeft'),
						'paddingRight'  : this.textarea.getStyle('paddingRight'),
						'paddingBottom' : this.textarea.getStyle('paddingBottom'),
						'marginTop'     : this.textarea.getStyle('marginTop'),
						'marginLeft'    : this.textarea.getStyle('marginLeft'),
						'marginRight'   : this.textarea.getStyle('marginRight'),
						'marginBottom'  : this.textarea.getStyle('marginBottom'),
						'borderTop'     : this.textarea.getStyle('borderTop'),
						'borderLeft'    : this.textarea.getStyle('borderLeft'),
						'borderRight'   : this.textarea.getStyle('borderRight'),
						'borderBottom'  : this.textarea.getStyle('borderBottom')
					 });

    this.textarea.insert({'after': this.fakeText});


		this.eventTextAreaChange 	= this.autoGrown.bindAsEventListener(this);
		this.eventSetFakeStyle 	= this.setFakeStyle.bindAsEventListener(this);
		Event.observe(this.textarea, "change", this.eventTextAreaChange);
		Event.observe(this.textarea, "keyup", this.eventTextAreaChange);



		setTimeout(this.eventSetFakeStyle, 150);
	},

	isIE: function()
	{
		return /msie/i.test(navigator.userAgent) && !/opera/i.test(navigator.userAgent);
	},

	setFakeStyle: function()
	{
		this.fakeText.hide();
		if (!this.isIE())
		{
			this.fakeText.setStyle({'display'       : 'none',
            'width'         : this.textarea.getWidth() ?
															(this.textarea.getWidth() + "px") :
															this.textarea.getStyle('width'),
            'whiteSpace'    : 'pre-wrap',
						'fontFamily'    : this.textarea.getStyle('fontFamily'),
						'fontSize'      : this.textarea.getStyle('fontSize'),
						'lineHeight'    : this.textarea.getStyle('lineHeight'),
						'paddingTop'    : this.textarea.getStyle('paddingTop'),
						'paddingLeft'   : this.textarea.getStyle('paddingLeft'),
						'paddingRight'  : this.textarea.getStyle('paddingRight'),
						'paddingBottom' : this.textarea.getStyle('paddingBottom'),
						'marginTop'     : this.textarea.getStyle('marginTop'),
						'marginLeft'    : this.textarea.getStyle('marginLeft'),
						'marginRight'   : this.textarea.getStyle('marginRight'),
						'marginBottom'  : this.textarea.getStyle('marginBottom'),
						'borderTop'     : this.textarea.getStyle('borderTop'),
						'borderLeft'    : this.textarea.getStyle('borderLeft'),
						'borderRight'   : this.textarea.getStyle('borderRight'),
						'borderBottom'  : this.textarea.getStyle('borderBottom')
					 });
		}


		this.autoGrown();
	},

	autoGrown : function()
	{
		if(this.initialHeight == 0)
			this.initialHeight = textarea.getHeight();

		this.fakeText.innerHTML = $F(this.textarea).replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/\n/g, '<br />') + '<br />z';

		var newHeight = Math.max(this.initialHeight, this.fakeText.getHeight());
		if (this.isIE())
		{
			newHeight = newHeight*1.2;
			newHeight += 25;
		}
		if(newHeight != this.currentHeight && newHeight != 0)
		{
			this.textarea.setStyle({ 'height': newHeight + 'px' });
			this.currentHeight = newHeight;
		}
	}
};

function addAutoGrown()
{
	$$('.autogrown').each(function(text)
	{
		new Elastic(text);
		$(text).removeClassName('autogrown');
  });
}
// Event.observe(window, 'load',addAutoGrown);