Event.observe(window, 'load', init);

function init(){
	makeItCount('message', 1000);
/*this textarea doesn't exist in the demo, but you see adding in the init does not return an error */
}

function charCounter(id, maxlimit){
	if (!$('counter-'+id)){
		$(id).insert({after: '<div id="counter-'+id+'"></div>'});
	}
	if($F(id).length >= maxlimit){
		$(id).value = $F(id).substring(0, maxlimit);
		$('counter-'+id).addClassName('charcount-limit');
		$('counter-'+id).removeClassName('charcount-safe');
	} else {	
		$('counter-'+id).removeClassName('charcount-limit');
		$('counter-'+id).addClassName('charcount-safe');
	}
	$('counter-'+id).update( $F(id).length + '/' + maxlimit );	
		
}

function makeItCount(id, maxsize){
	if ($(id)){
		Event.observe($(id), 'keyup', function(){charCounter(id, maxsize);}, false);
		Event.observe($(id), 'keydown', function(){charCounter(id, maxsize);}, false);
		charCounter(id,maxsize);
	}
}