ker/mod/wdg.input.js
function(opts) {
    Widget.call(this);
    var input = Widget.tag("input");
    this._input = input;
    var that = this;
    this.addClass("wdg-input");
    if (typeof opts !== 'object') opts = {};
    if (typeof opts.type !== 'string') opts.type = 'text';
    input.attr("type", opts.type);
    if (typeof opts.placeholder === 'string') {
        input.attr("placeholder", opts.placeholder);
    }
    if (typeof opts.size !== 'undefined') {
        opts.size = parseInt(opts.size) || 8;
        input.attr("size", opts.size);
    }
    if (typeof opts.width !== 'undefined') {
        input.css("width", opts.width);
    }
    var onValid = opts.onValid;
    if (typeof onValid === 'object' && typeof onValid.enabled === 'function') {
        opts.onValid = function(v) {
            onValid.enabled(v);
        };
    }
    else if (typeof onValid !== 'function') opts.onValid = null;

    if (typeof opts.validator === 'object') {
        var rx = opts.validator;
        opts.validator = function(v) {
            return rx.test(v);
        };
    }
    this._valid = 0;
    if (typeof opts.validator === 'function') {
        input.addEvent(
            "keyup",
            function() {
                opts.validator.call(this);
            }
        );
    }
    input.addEvent(
        "keyup",
        function() {
            that.fireChange();
        }
    );
    if (typeof opts.onEnter === 'object' && typeof opts.onEnter.fire === 'function') {
        var onEnter = opts.onEnter;
        this.Enter(function() {
            onEnter.fire();
        });
    }
    input.addEvent(
        "keyup",
        function(evt) {
            if (that._valid > -1 && evt.keyCode == 13) {
                // On  rend l'événement  asynchrone pour  éviter les
                // problèmes de clavier virtuel qui reste affiché.
                window.setTimeout(
                    function() {
                        that.fireEnter();
                    }
                );
            } else {
                that.validate();
            }
        }
    );
    if (typeof opts.value !== 'string') {
        opts.value = "";
    }
    input.addEvent(
        "focus",
        function() {
            that.selectAll();
        }
    );
    this._opts = opts;
    this.val(opts.value);

    if (typeof opts.label !== 'undefined') {
        var label = Widget.div("label").text(opts.label).attr("title", opts.label);
        this.append(label);
    }
    this.append(input);
}
function(opts) {
    Widget.call(this);
    var input = Widget.tag("input");
    this._input = input;
    var that = this;
    this.addClass("wdg-input");
    if (typeof opts !== 'object') opts = {};
    if (typeof opts.type !== 'string') opts.type = 'text';
    input.attr("type", opts.type);
    if (typeof opts.placeholder === 'string') {
        input.attr("placeholder", opts.placeholder);
    }
    if (typeof opts.size !== 'undefined') {
        opts.size = parseInt(opts.size) || 8;
        input.attr("size", opts.size);
    }
    if (typeof opts.width !== 'undefined') {
        input.css("width", opts.width);
    }
    var onValid = opts.onValid;
    if (typeof onValid === 'object' && typeof onValid.enabled === 'function') {
        opts.onValid = function(v) {
            onValid.enabled(v);
        };
    }
    else if (typeof onValid !== 'function') opts.onValid = null;

    if (typeof opts.validator === 'object') {
        var rx = opts.validator;
        opts.validator = function(v) {
            return rx.test(v);
        };
    }
    this._valid = 0;
    if (typeof opts.validator === 'function') {
        input.addEvent(
            "keyup",
            function() {
                opts.validator.call(this);
            }
        );
    }
    input.addEvent(
        "keyup",
        function() {
            that.fireChange();
        }
    );
    if (typeof opts.onEnter === 'object' && typeof opts.onEnter.fire === 'function') {
        var onEnter = opts.onEnter;
        this.Enter(function() {
            onEnter.fire();
        });
    }
    input.addEvent(
        "keyup",
        function(evt) {
            if (that._valid > -1 && evt.keyCode == 13) {
                // On  rend l'événement  asynchrone pour  éviter les
                // problèmes de clavier virtuel qui reste affiché.
                window.setTimeout(
                    function() {
                        that.fireEnter();
                    }
                );
            } else {
                that.validate();
            }
        }
    );
    if (typeof opts.value !== 'string') {
        opts.value = "";
    }
    input.addEvent(
        "focus",
        function() {
            that.selectAll();
        }
    );
    this._opts = opts;
    this.val(opts.value);

    if (typeof opts.label !== 'undefined') {
        var label = Widget.div("label").text(opts.label).attr("title", opts.label);
        this.append(label);
    }
    this.append(input);
}
function ( opts ) { Widget . call ( this ) ; var input = Widget . tag ( "input" ) ; this . _input = input ; var that = this ; this . addClass ( "wdg-input" ) ; if ( typeof opts !== 'object' ) opts = { } ; if ( typeof opts . type !== 'string' ) opts . type = 'text' ; input . attr ( "type" , opts . type ) ; if ( typeof opts . placeholder === 'string' ) { input . attr ( "placeholder" , opts . placeholder ) ; } if ( typeof opts . size !== 'undefined' ) { opts . size = parseInt ( opts . size ) || 8 ; input . attr ( "size" , opts . size ) ; } if ( typeof opts . width !== 'undefined' ) { input . css ( "width" , opts . width ) ; } var onValid = opts . onValid ; if ( typeof onValid === 'object' && typeof onValid . enabled === 'function' ) { opts . onValid = function ( v ) { onValid . enabled ( v ) ; } ; } else if ( typeof onValid !== 'function' ) opts . onValid = null ; if ( typeof opts . validator === 'object' ) { var rx = opts . validator ; opts . validator = function ( v ) { return rx . test ( v ) ; } ; } this . _valid = 0 ; if ( typeof opts . validator === 'function' ) { input . addEvent ( "keyup" , function ( ) { opts . validator . call ( this ) ; } ) ; } input . addEvent ( "keyup" , function ( ) { that . fireChange ( ) ; } ) ; if ( typeof opts . onEnter === 'object' && typeof opts . onEnter . fire === 'function' ) { var onEnter = opts . onEnter ; this . Enter ( function ( ) { onEnter . fire ( ) ; } ) ; } input . addEvent ( "keyup" , function ( evt ) { if ( that . _valid > - 1 && evt . keyCode == 13 ) { // On  rend l'événement  asynchrone pour  éviter les
 // problèmes de clavier virtuel qui reste affiché.
 window . setTimeout ( function ( ) { that . fireEnter ( ) ; } ) ; } else { that . validate ( ) ; } } ) ; if ( typeof opts . value !== 'string' ) { opts . value = "" ; } input . addEvent ( "focus" , function ( ) { that . selectAll ( ) ; } ) ; this . _opts = opts ; this . val ( opts . value ) ; if ( typeof opts . label !== 'undefined' ) { var label = Widget . div ( "label" ) . text ( opts . label ) . attr ( "title" , opts . label ) ; this . append ( label ) ; } this . append ( input ) ; }
HTML5 text input with many options.

@param {string} opts.value Initial value.
@param {string} opts.type Input's type. Can be `text`, `password`, ...
@param {string} opts.name The name can be used by the browser to give a help combo.
@param {string} opts.placeholder Text to display when input is empty.
@param  {function|regexp}  opts.validator  function  to  check  the
validity  of this  input. Takes  the  input value  as argument  and
returns a boolean. `onEnter` is not fired until input is valid. You
can use a RegExp instead of a function to check validity.
@param {function|object}  opts.onEnter function  to call  when user
hits  `enter` key.  `function(this)`. It  can be  an object  with a
function called `fire()`.
@param  {function|object}   opts.onValid  function  to   call  when
validator has been called. `function(validity, this)`. It can be an
object  with  a  function   `enabled({boolean})`.  For  instance  a
`wdg.Button`.

@example
var Input = require("wdg.input");
var opts = {
placeholder: 'email address';
validator: /[^@]+@([^@\.]+\.)*[^@\.]+/,
onEnter: function(wdg) {
console.log("Enter has been hitten!");
},
onValid: function(validity, wdg) {
console.log("Validity: ", validity);
}
}
var instance = new Input(opts);
@example
var I = require("wdg.input").create;
var btnNext = B(_("next")).Tap(
function() {
alert("Youpi!");
}
);
var login = I(
{
type: "email",
name: "email",
placeholder: _("email"),
validator: /^[^@]+@[^@]+$/,
onEnter: btnNext,
onValid: btnNext
}
);

@class Input
HTML5 text input with many options .