/**
 * @class Ext.ux.FormValidator
 * @author Arthur Kay
 * @website http://www.akawebdesign.com
 * @extends Ext.util.Observable
 * @constructor
 * @param {object} configObj
 * @cfg {array} formInputs
 * 
 */
Ext.ns('Ext.ux');
Ext.ux.FormValidator = function(config) {
    Ext.apply(this, config);
    this.init();
};
Ext.extend(Ext.ux.FormValidator, Ext.util.Observable, {
    
    /**
     * @property
     * @type 
     */
    formInputs: null,
    
    /**
     * @private
     */
    init: function() {
        this.addInputHighlights();
    },
    
    /**
     * @method
     */
    addInputHighlights: function() {
        this.formInputs.on(
            'focus',
            function(eventObj, htmlEl, options) {
                Ext.get(htmlEl).parent().addClass('activeFormField');
            }
        );

        this.formInputs.on(
            'blur',
            function(eventObj, htmlEl, options) {
                Ext.get(htmlEl).parent().removeClass('activeFormField');
                Ext.get(htmlEl).parent().removeClass('errorFormField');
            }
        ); 
    },
    
    /**
     * @method
     */
    validateForm: function() {
        var thisObject = this;
        var errors = 0;

        this.formInputs.each(function(el, thisScope, index) {
            var element = Ext.get(el);
            
            //TODO: Find support for SELECT, DATALIST and other HTML5 tags which don't support 'required'
            if (element.getAttribute('required') == 'required') {
                if (!thisObject.validateFormField(element)) {
                    errors += 1;
                    element.parent().addClass('errorFormField');
                }
            }
        });
        
        if (errors > 0) { return false; }
        
        return true;
    },

    /**
     * @method
     */
    validateFormField: function(element) {
        var inputType = element.getAttribute('type');
        
        switch (inputType) {
            //case 'datetime':
            //case 'time':
            //case 'checkbox':
            //case 'color':
            //case 'file':
            //case 'month':
            //case 'radio':
            //case 'range':
            //case 'search':
            //case 'week':

            case 'email':
                return this.checkEmail(element.getValue());
                break;

            case 'number':
            case 'tel':
            case 'url':
            case 'text':
            case 'password':
            default:
                if (element.getValue() == '') { return false; }
                break;
        }
        
        return true;
    },

    /**
     * @method
     */
    checkEmail: function(email) {
        // there must be >= 1 character before @, so we
        // start looking at character position 1 
        // (i.e. second character)
        var i = 1;

        // look for @
        while ((i < email.length) && (email.charAt(i) != "@")) { i++; }
        if ((i >= email.length) || (email.charAt(i) != "@")) { return false; }

        // look for .
        i += 2;
        while ((i < email.length) && (email.charAt(i) != ".")) { i++; }

        // there must be at least one character after the .
        if ((i >= email.length - 1) || (email.charAt(i) != ".")) { return false; }

        return true;
    }
});