var charCounter = Class.create();
charCounter.prototype = {
	initialize: 	function (field, maxsize, show_text) {
		
    this.field = field;
    this.maxsize = maxsize;
    if (show_text)
     this.show_text = show_text;
    else
     this.show_text = '';
    var p = document.createElement("p");
            p.className = "char_counter";
            p.id = field + '_p';
    $(this.field).insert({ after: p})
        // $(this.field).parentNode.appendChild(p);
    this.p = p;
    this.p.innerHTML = this.show_text + " " + (this.maxsize - $(this.field).value.length) + '/' + this.maxsize;  
    this.makeItCount ();
	},
	
	counter: 	function () {
      if( $(this.field).value.length >= this.maxsize){
       $(this.field).value = $(this.field).value.substring(0, this.maxsize);
       Element.addClassName( this.p, 'char_counter_limit');
      } else { 
       Element.removeClassName( this.p, 'char_counter_limit');
      }
      this.p.innerHTML = this.show_text + " " + (this.maxsize - $(this.field).value.length) + '/' + this.maxsize;  
	},
	
	makeItCount: function () {
		if ($(this.field))
		{
			Event.observe (this.field, 'keyup', this.counter.bindAsEventListener(this), true);
			Event.observe (this.field, 'keydown', this.counter.bindAsEventListener(this), true);
		}
		this.counter ();
		
	}
}