card - npm Package Compare versions

Comparing version 2.0.6 to 2.1.0

bower.json

@@ -28,3 +28,3 @@ {
   ],
-  "version": "2.0.6"
+  "version": "2.1.0"
 }

lib/card.js

@@ -1,4 +0,5 @@
-// Generated by CoffeeScript 1.10.0
+// Generated by CoffeeScript 1.7.1
 (function() {
-  var Card, QJ, extend, payment;
+  var Card, QJ, extend, payment,
+    __bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; };
 
@@ -54,2 +55,5 @@ require('./card.css');
       },
+      masks: {
+        cardNumber: false
+      },
       classes: {
@@ -63,2 +67,3 @@ valid: 'jp-card-valid',
     function Card(opts) {
+      this.maskCardNumber = __bind(this.maskCardNumber, this);
       var toInitialize;
@@ -87,12 +92,12 @@ this.options = extend(true, this.defaults, opts);
     Card.prototype.render = function() {
-      var $cardContainer, baseWidth, name, obj, ref, ref1, selector, ua;
+      var $cardContainer, baseWidth, name, obj, selector, ua, _ref, _ref1;
       QJ.append(this.$container, this.template(this.cardTemplate, extend({}, this.options.messages, this.options.placeholders)));
-      ref = this.options.cardSelectors;
-      for (name in ref) {
-        selector = ref[name];
+      _ref = this.options.cardSelectors;
+      for (name in _ref) {
+        selector = _ref[name];
         this["$" + name] = QJ.find(this.$container, selector);
       }
-      ref1 = this.options.formSelectors;
-      for (name in ref1) {
-        selector = ref1[name];
+      _ref1 = this.options.formSelectors;
+      for (name in _ref1) {
+        selector = _ref1[name];
         selector = this.options[name] ? this.options[name] : selector;
@@ -130,6 +135,10 @@ obj = QJ.find(this.$el, selector);
     Card.prototype.attachHandlers = function() {
-      var expiryFilters;
+      var expiryFilters, numberInputFilters;
+      numberInputFilters = [this.validToggler('cardNumber')];
+      if (this.options.masks.cardNumber) {
+        numberInputFilters.push(this.maskCardNumber);
+      }
       bindVal(this.$numberInput, this.$numberDisplay, {
         fill: false,
-        filters: this.validToggler('cardNumber')
+        filters: numberInputFilters
       });
@@ -166,18 +175,18 @@ QJ.on(this.$numberInput, 'payment.cardType', this.handle('setCardType'));
     Card.prototype.handleInitialPlaceholders = function() {
-      var el, name, ref, results, selector;
-      ref = this.options.formSelectors;
-      results = [];
-      for (name in ref) {
-        selector = ref[name];
+      var el, name, selector, _ref, _results;
+      _ref = this.options.formSelectors;
+      _results = [];
+      for (name in _ref) {
+        selector = _ref[name];
         el = this["$" + name];
         if (QJ.val(el)) {
           QJ.trigger(el, 'paste');
-          results.push(setTimeout(function() {
+          _results.push(setTimeout(function() {
             return QJ.trigger(el, 'keyup');
           }));
         } else {
-          results.push(void 0);
+          _results.push(void 0);
         }
       }
-      return results;
+      return _results;
     };
@@ -235,2 +244,18 @@
 
+    Card.prototype.maskCardNumber = function(val, el, out) {
+      var mask, numbers;
+      mask = this.options.masks.cardNumber;
+      numbers = val.split(' ');
+      if (numbers.length >= 3) {
+        numbers.forEach(function(item, idx) {
+          if (idx !== numbers.length - 1) {
+            return numbers[idx] = numbers[idx].replace(/\d/g, mask);
+          }
+        });
+        return numbers.join(' ');
+      } else {
+        return val.replace(/\d/g, mask);
+      }
+    };
+
     Card.prototype.handlers = {
@@ -274,9 +299,9 @@ setCardType: function($el, e) {
       outDefaults = (function() {
-        var j, len, results;
-        results = [];
-        for (j = 0, len = out.length; j < len; j++) {
-          o = out[j];
-          results.push(o.textContent);
+        var _i, _len, _results;
+        _results = [];
+        for (_i = 0, _len = out.length; _i < _len; _i++) {
+          o = out[_i];
+          _results.push(o.textContent);
         }
-        return results;
+        return _results;
       })();
@@ -290,11 +315,11 @@ QJ.on(el, 'focus', function() {
       QJ.on(el, 'keyup change paste', function(e) {
-        var elem, filter, i, j, join, k, len, len1, outEl, outVal, ref, results, val;
+        var elem, filter, i, join, outEl, outVal, val, _i, _j, _len, _len1, _ref, _results;
         val = (function() {
-          var j, len, results;
-          results = [];
-          for (j = 0, len = el.length; j < len; j++) {
-            elem = el[j];
-            results.push(QJ.val(elem));
+          var _i, _len, _results;
+          _results = [];
+          for (_i = 0, _len = el.length; _i < _len; _i++) {
+            elem = el[_i];
+            _results.push(QJ.val(elem));
           }
-          return results;
+          return _results;
         })();
@@ -306,9 +331,9 @@ join = opts.join(val);
         }
-        ref = opts.filters;
-        for (j = 0, len = ref.length; j < len; j++) {
-          filter = ref[j];
+        _ref = opts.filters;
+        for (_i = 0, _len = _ref.length; _i < _len; _i++) {
+          filter = _ref[_i];
           val = filter(val, el, out);
         }
-        results = [];
-        for (i = k = 0, len1 = out.length; k < len1; i = ++k) {
+        _results = [];
+        for (i = _j = 0, _len1 = out.length; _j < _len1; i = ++_j) {
           outEl = out[i];
@@ -320,5 +345,5 @@ if (opts.fill) {
           }
-          results.push(outEl.textContent = outVal);
+          _results.push(outEl.textContent = outVal);
         }
-        return results;
+        return _results;
       });
@@ -325,0 +350,0 @@ return el;

package.json

 {
   "name": "card",
-  "version": "2.0.6",
+  "version": "2.1.0",
   "author": "Jesse Pollak <[e-mail]>",
@@ -5,0 +5,0 @@ "description": "Card lets you add an interactive, CSS3 credit card animation to your credit card form to help your users through the process.",

README.md

@@ -54,2 +54,6 @@ # Card - check out the **[demo](https://jessepollak.github.io/card)**
 
+    masks: {
+        cardNumber: '•' // optional - mask card number
+    }
+
     // if true, will log helpful messages for setting up Card
@@ -56,0 +60,0 @@ debug: false // optional - default false

No alert changes

Improved metrics

Total package byte prevSize

2599577

increased by0.11%

Lines of code

23544

increased by0.31%

Number of lines in readme file

255

increased by1.59%

No dependency changes