文本框IMEI过滤模块组件

define(['jquery'], function() {

    /**
     * IMEI过滤
     * @param {HTMLElement} param.el 包装输入框的容器元素
     * @param {Number} param.maxRow 最大行数
     * @param {Array} param.data 过滤后的IMEI数据
     * @param {Function} param.exceedMax 超过最大行数的回调
     * @param {RegExp} param.pattren 正则表达式匹配规则
     * 
     */
    function ImeiFilter(param) {
        this.$el = $(param.el);
        this.maxRow = param.maxRow || 1000;
        this.data = [];
        this.exceedMax = param.exceedMax;
        this.pattren = param.pattren || /[^\d,\n]/;

        this.init();
    }

    ImeiFilter.prototype = {
        constructor: ImeiFilter,
        /**
         * 初始化IMEI过滤容器
         * @return {Object} 实例化对象
         */
        init: function() {
            if (!this.$el.find('.textarea-imei-box').length) {
                this.addDom();
            }
            return this;

        },
        /**
         * 添加imei输入过滤组件
         */
        addDom: function() {

            var htmlStr = '<div class="textarea-imei-box">\
                        <textarea class="form-control form-control-textarea" placeholder="请输入卡号，多个按回车换行(最多可输入' + this.maxRow + '个卡号)"></textarea>\
                        <div class="textarea-imei-tools">\
                            <span class="counter">IMEI计数: <strong>' + this.data.length + '</strong>/' + this.maxRow + '</span>\
                        </div>\
                    </div>';

            /* 如果容器已有子元素，添加到第一个子元素前面，如果容器为空则直接追加 */    
            if (this.$el.children().length) {
                this.$el.children(':first').before(htmlStr);
            } else {
                this.$el.append(htmlStr);
            }
            this.$textarea = this.$el.find('textarea');
            this.focus(); //绑定聚焦事件
            this.input(); //绑定输入事件
        },
        /**
         * 绑定输入框获取焦点后的事件
         */
        focus: function() {
            var that = this;
            that.$textarea.on("focus", function() {
                $(this).parent().addClass("focus");
                $(document).bind("click.imei", function(e) {
                    var target = $(e.target);
                    if (!target.closest(".textarea-imei-box").length > 0) {
                        that.$textarea.parent().removeClass("focus");
                        $(document).unbind("click.imei");
                    }
                });
            });

        },
        /**
         * 绑定输入框获的输入事件
         */
        input: function() {
            var that = this;
            that.$textarea.on('input propertychange', function() {
                $(this).removeClass('form-control-error');
                that.update();
                that.counter();
            });

        },
        /**
         * 数据更新，输入框val发生改变后过滤更新数据到data
         */
        update: function() {
            var v = this.$textarea.val();
            var pattren = this.pattren;
            var filterValue = v.replace(pattren, ''); //过滤非数字、非逗号、非换行的字符
            this.$textarea.val(filterValue); //反显到文本框

            var imeis = filterValue.split(/\n/); //把过滤后的val值以换行符分割为数组
            var tempArr = []; //创建临时数组
            for (var i = 0; i < imeis.length; i++) {
                imeis[i] && tempArr.push(imeis[i]); //把有效的数据追加到临时数组中
            }

            /* 临时数组的长度超出设定的最大行数 */
            if (tempArr.length > this.maxRow) { 
                this.data = tempArr.splice(0, this.maxRow); //保留最大行数的值
                var curValue = this.data.join('\n'); //把数组转换为换行的字符串
                this.$textarea.val(curValue); //反显到文本框内
                this.exceedMax && this.exceedMax(this.maxRow);

            } else {
                this.data = tempArr;
            }
            
        },
        /**
         * 显示输入框当前的行数
         */
        counter: function() {
            var len = this.data.length;
            var $numEle = this.$el.find('.counter strong');
            $numEle.text(len);
            /*if (len > this.maxRow) {
                $numEle.css('color', 'red');

                var curValue = that.data.join('\n');
                this.$textarea.val(curValue);
            } else {
                $numEle.css('color', '');
            }*/
        },
        /**
         * 重载过滤
         * @param  {*} param.data 是否重置实例的data为空数组，false为不重置
         * @param  {*} param.value 是否重置输入框value为空数组，false为不重置
         * @param  {*} param.counter 是否重置计数器，false为不重置
         */
        reload: function(param) {
            !param || param.data !== false && (this.data = []); 
            !param || param.value !== false && this.$textarea.val('');
            !param || param.counter !== false && this.counter();
        }
    };

    return ImeiFilter;  //输出模块

});