// simple textarea resizing script for prototype

resizing_text_area.js

// simple textarea resizing script for prototype
var ResizingTextArea = Class.create({
	min_height: 40,
	rowHeight: 16,
	padding: 4,
	unit: "px",
	
	initialize: function(field,options){
		Object.extend(this,(options||{}));
		this.element = $(field);
		this.min_height = [this.element.getHeight(), this.min_height].max();
		
		this.element.setStyle({
			height: this.min_height + this.unit, 
			overflow: "hidden"
		});
		this.element.observe("keyup", this._resize.bindAsEventListener(this));
		this._resize();
	},
	_resize: function() {
		this.rows = this._calcRows();
		this.height = this.rows * this.rowHeight - this.padding;
		if (this.height < this.min_height) this.height = this.min_height;
		this.element.morph({height: (this.height + this.unit)}, {duration: .2});
	},
	_calcRows: function() {
		this.cols = this.element.getWidth() / 8;
		this.rows = Math.floor(this.element.value.length / this.cols) + this.element.value.split("\n").length;
		return this.rows
	}
});

$(document).observe("dom:loaded", function(){
	$$("textarea.resizeable").each(function(textarea){
		new ResizingTextArea(textarea,{rowHeight:15});
	});
});