r2410 - Refactored code for allowing init with no options and changing the mask and placeholder o...

r2410 - Refactored code for allowing init with no options and changing the mask and placeholder o...


Author: powella
Date: Mon Mar 30 08:53:28 2009
New Revision: 2410
Modified:
branches/dev/mask/ui/ui.mask.js
Log:
Refactored code for allowing init with no options and changing the mask and
placeholder options on the fly.
Modified: branches/dev/mask/ui/ui.mask.js
==============================================================================
--- branches/dev/mask/ui/ui.mask.js    (original)
+++ branches/dev/mask/ui/ui.mask.js    Mon Mar 30 08:53:28 2009
@@ -17,42 +17,62 @@
var pasteEventName = ($.browser.msie ? 'paste' : 'input') + ".mask";
$.widget("ui.mask", {
+    
+    _init: function() {
-    _escapeMask: function(){
-        var mask = this.options.mask,
-            literals = [],
-            replacements = [];
-        
-        for(var i = 0; i < mask.length; i++){
-            var c, temp = mask[i];
-            if(temp != "\\" || mask[i-1] == "\\"){
-                if(mask[i-1] == "\\"){
-                    c = "\t";
-                    replacements[literals.length] = temp;
-                }
-                else{
-                    c = temp;
-                }
-                literals[literals.length] = c;
-            }
-        }
-        
-        this.options.mask = literals.join('');
-        
-        for(var i = 0; i < literals.length; i++){
-            if(replacements[i] !== undefined){
-                literals[i] = replacements[i];
-            }
-        }
-        
-        this.maskEscaped = literals.join('');
+        var options = this.options, self = this;
+
+        $.extend(this, { caret: function(begin, end){ return
$.ui.mask.caret(self.element, begin, end); } });
+
+        if(!options.mask || !options.mask.length) return; //no mask pattern
defined. no point in continuing.
+        if(!options.placeholder || !options.placeholder.length)
options.placeholder = '_'; //in case the user decided to nix a placeholder.
+
+        this._prepareBuffer();
+        this._bindEvents();
+        this._checkVal((this.element.val().length && options.allowPartials));
//Perform initial check for existing values
+    },
+
+    destroy: function() {
+        this.element
+            .unbind('.mask')
+            .removeData('mask');
+    },
+
+    value: function() {
+        var input = this.element,
+            self = this,
+            res = $.map(self.buffer, function(c, i){ return self.tests[i] ? c :
null; }).join(''),
+            r = new RegExp('\\'+this.options.placeholder, 'gi');
+        return res.replace(r, '');
    },
    
-    _init: function() {
+    formatted: function(){
+        var r = new RegExp('\\'+this.options.placeholder, 'gi'),
+            res = this.element.val();
+        return res.replace(r, '');
+    },
+    
+    apply: function(){
+        this.element.trigger('apply.mask');
+    },
+    
+    _setData: function(key, value) {
-        if(!this.options.mask || !this.options.mask.length) return; //no mask
pattern defined. no point in continuing.
-        if(!this.options.placeholder || !this.options.placeholder.length)
this.options.placeholder = '_'; //in case the user decided to nix a
placeholder.
+        $.widget.prototype._setData.apply(this, arguments);
+
+        switch (key) {
+            case 'mask':
+            case 'placeholder':
+                this.element.val('');
+                this._prepareBuffer();
+                !this.eventsBound && this._bindEvents();
+                break;
+        }
+    },
+
+    _prepareBuffer: function(){
+        
        this._escapeMask();
        var self = this,
@@ -91,8 +111,7 @@
            }),
            tests: tests,
            firstNonMaskPos: firstNonMaskPos,
-            partialPosition: partialPosition,
-            caret: function(begin, end){ return $.ui.mask.caret(input, begin, end);
}
+            partialPosition: partialPosition
        });
        this.buffer = $.map(this.buffer, function(c, i){
@@ -102,11 +121,16 @@
            return c;
        });
-        this.options.mask = mask = this.maskEscaped;
+        this.options.mask = mask = this.maskEscaped;        
+    },    
-        var ignore = false,             //Variable for ignoring control keys
+    _bindEvents: function(){
+        
+        var self = this,
+            input = this.element,
+            ignore = false,             //Variable for ignoring control keys
            focusText = input.val();
-
+            
        function keydownEvent(e) {
            var pos = self.caret(),
                k = e.keyCode,
@@ -133,7 +157,8 @@
        function keypressEvent(e) {
            var k = e.charCode || e.keyCode || e.which,
-                keyCode = $.ui.keyCode;
+                keyCode = $.ui.keyCode,
+                len = self.options.mask.length;
            if (ignore) {
                ignore = false;
@@ -150,28 +175,27 @@
                var p = self._seekNext(pos.begin - 1);
                if (p < len) {
                    var c = String.fromCharCode(k);
-                    if (tests[p].test(c)) {
+                    if (self.tests[p] && self.tests[p].test(c)) {
                        self._shiftR(p);
                        self.buffer[p] = c;
                        self._writeBuffer();
                        var next = self._seekNext(p);
                        self.caret(next);
-                        if (options.completed && next == len)
-                            options.completed.call(input);
+                        self.options.completed && next == len &&
self.options.completed.call(input);
                    }
                }
            }
            return false;
        };
-        if (!input.attr("readonly"))
+        if (!input.attr("readonly")){
            input
                .bind("focus.mask", function() {
                    focusText = input.val();
                    var pos = self._checkVal();
                    self._writeBuffer();
                    setTimeout(function() {
-                        if (pos == mask.length)
+                        if (pos == self.options.mask.length)
                            self.caret(0, pos);
                        else
                            self.caret(pos);
@@ -192,33 +216,8 @@
                .bind(pasteEventName, function() {
                    setTimeout(function() { self.caret(self._checkVal(true)); }, 0);
                });
-
-        this._checkVal((input.val().length && options.allowPartials)); //Perform
initial check for existing values
-
-    },
-
-    destroy: function() {
-        this.element
-            .unbind('.mask')
-            .removeData('mask');
-    },
-
-    value: function() {
-        var input = this.element,
-            self = this,
-            res = $.map(self.buffer, function(c, i){ return self.tests[i] ? c :
null; }).join(''),
-            r = new RegExp('\\'+this.options.placeholder, 'gi');
-        return res.replace(r, '');
-    },
-    
-    formatted: function(){
-        var r = new RegExp('\\'+this.options.placeholder, 'gi'),
-            res = this.element.val();
-        return res.replace(r, '');
-    },
-    
-    apply: function(){
-        this.element.trigger('apply.mask');
+            this.eventsBound = true;
+        }
    },
    
    _writeBuffer: function(){
@@ -320,7 +319,37 @@
            if (!allow) input.val(input.val().substring(0, lastMatch + 1));
        }
        return (this.partialPosition ? i : this.firstNonMaskPos);
-    }
+    },
+    
+    _escapeMask: function(){
+        var mask = this.options.mask,
+            literals = [],
+            replacements = [];
+        
+        for(var i = 0; i < mask.length; i++){
+            var c, temp = mask[i];
+            if(temp != "\\" || mask[i-1] == "\\"){
+                if(mask[i-1] == "\\"){
+                    c = "\t";
+                    replacements[literals.length] = temp;
+                }
+                else{
+                    c = temp;
+                }
+                literals[literals.length] = c;
+            }
+        }
+        
+        this.options.mask = literals.join('');
+        
+        for(var i = 0; i < literals.length; i++){
+            if(replacements[i] !== undefined){
+                literals[i] = replacements[i];
+            }
+        }
+        
+        this.maskEscaped = literals.join('');
+    }    
    
});