input-counted.js

var YDOM = YAHOO.util.Dom;
var ODOC = ORBEON.xforms.Document;

YAHOO.namespace("xbl.fr");
YAHOO.xbl.fr.InputCounted = function() {};
ORBEON.xforms.XBL.declareClass(YAHOO.xbl.fr.InputCounted, "xbl-fr-input-counted");

YAHOO.xbl.fr.InputCounted.prototype = {
		
    _instances: {},
    
    _getInstance: function(target) {
        var container = YDOM.getElementsByClassName("xbl-fr-input-counted", null, this.container)[0];
        return this._instances[container.id];
    },

    init: function() {

        var container = this.container;
		var htmlElement =  container.getElementsByTagName('input')[0];
		
		if(htmlElement.controlInitialized !== true) {
            // Create instance
            var instance = {
					id: "",
					currentCount: 0,
					maxCount: 0,
					disabled: false
            };

			// get attribute params from dom
            var maxCountEl = YDOM.getElementsByClassName("xbl-fr-input-counted-max", null, this.container)[0];    
            // This should not be 100 as I am passing the value        
            var maxCount = (maxCountEl && maxCountEl.innerHTML != "") ? maxCountEl.innerHTML : 100;

            // populate instance
			instance.container = container;
            instance.HTMLElement = htmlElement;
            instance.id = this.container.id;
            instance.minCount = 0; 
            instance.maxCount = maxCount;

			this.initInstance(this.container, instance);
			
			htmlElement.controlInitialized = true;
            this._instances[this.container.id] = instance;
		}
    },

	initInstance: function(target, instance) {
		var counterLabel = YDOM.getElementsByClassName("counter-label", null, this.container)[0];

		var field = YDOM.getElementsByClassName("fr-input-counted", null, this.container)[0];				        
		if(field.getElementsByTagName('input')[0] !== null) {
			field = field.getElementsByTagName('input')[0];
		}
		field.maxLength = instance.maxCount;
		field.ctr = counterLabel;
		
		if (field.textLength > 0)
			counterLabel.innerHTML =  field.textLength + ' / ' + instance.maxCount;
		else
			counterLabel.innerHTML =  instance.minCount + ' / ' + instance.maxCount;

		// add onchange event
		YAHOO.util.Event.on(field, 'keyup', this.count, field);
	},

	count : function(evt, el) {
	    if (el.textLength > el.maxLength) {
			YAHOO.util.Event.stopEvent(evt);
			return;
		}
        
	    YDOM.get(el.ctr).innerHTML = el.textLength + ' / ' + el.maxLength;
    }
};