skeuocard-rails 0.0.1 → 0.0.2.alpha
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/README.md +4 -1
- data/vendor/assets/images/card-flip-arrow.png +0 -0
- data/vendor/assets/images/card-invalid-indicator.png +0 -0
- data/vendor/assets/images/card-valid-anim.gif +0 -0
- data/vendor/assets/images/card-valid-indicator.png +0 -0
- data/vendor/assets/images/issuers/amex-blackcard-front.png +0 -0
- data/vendor/assets/images/issuers/visa-chase-sapphire.png +0 -0
- data/vendor/assets/images/issuers/visa-simple-front.png +0 -0
- data/vendor/assets/images/products/amex-front.png +0 -0
- data/vendor/assets/images/products/dinersclubintl-front.png +0 -0
- data/vendor/assets/images/products/discover-front.png +0 -0
- data/vendor/assets/images/products/generic-back.png +0 -0
- data/vendor/assets/images/products/generic-front.png +0 -0
- data/vendor/assets/images/products/mastercard-front.png +0 -0
- data/vendor/assets/images/products/visa-back.png +0 -0
- data/vendor/assets/images/products/visa-front.png +0 -0
- data/vendor/assets/javascripts/skeuocard.js +302 -177
- data/vendor/assets/stylesheets/src/_browser_hacks.scss +0 -0
- data/vendor/assets/stylesheets/src/_cards.scss +50 -22
- data/vendor/assets/stylesheets/src/_util.scss +0 -0
- data/vendor/assets/stylesheets/src/skeuocard.reset.scss +0 -0
- data/vendor/assets/stylesheets/src/skeuocard.scss +6 -0
- metadata +6 -10
- data/vendor/assets/javascripts/src/skeuocard.coffee +0 -1072
- data/vendor/assets/javascripts/vendor/css_browser_selector.js +0 -154
- data/vendor/assets/javascripts/vendor/demo.fix.js +0 -17
- data/vendor/assets/javascripts/vendor/jquery-2.0.3.min.js +0 -5
- data/vendor/assets/stylesheets/src/demo.scss +0 -265
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 4f9145480cd2f59859b877288ff0b225d70a5508
|
4
|
+
data.tar.gz: 009cd906c292294b6e7ed64d9e93ce91f68d397a
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: fd2ce45f6e00ff470b7e58ed54772a2b8913973c421af420c5cc091d74d6c33743fe138dfd29491b2d9ae3bfa18c3445d99f4e5808465a5c6ee7f4cd3bffdd40
|
7
|
+
data.tar.gz: fe72cffd4dac66543689729bf81644ee2e94d1bd7dafc3a5070d48abeec5b4f785cb1ff2c1e630f0c7abb148bab248a090729182ca98fa1337bd53473fa676ec
|
data/README.md
CHANGED
@@ -1,4 +1,4 @@
|
|
1
|
-
#
|
1
|
+
# skeuocard-rails
|
2
2
|
|
3
3
|
Use [skeuocard](http://kenkeiter.com/skeuocard/) with rails 3.1+ asset pipeline.
|
4
4
|
|
@@ -42,6 +42,9 @@ Simply call the card with javascript after implementing the correct html.
|
|
42
42
|
window.card = new Skeuocard($("#skeuocard"));
|
43
43
|
```
|
44
44
|
|
45
|
+
Everything is better explained her :
|
46
|
+
https://github.com/kenkeiter/skeuocard
|
47
|
+
|
45
48
|
## Contributing
|
46
49
|
|
47
50
|
1. Fork it
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
@@ -212,8 +212,8 @@
|
|
212
212
|
this._inputViews.exp.el.addClass('cc-exp');
|
213
213
|
this._inputViews.exp.el.appendTo(this.el.surfaceFront);
|
214
214
|
this._inputViews.cvc.el.appendTo(this.el.surfaceBack);
|
215
|
-
this._inputViews.number.bind("
|
216
|
-
_this._setUnderlyingValue('number', input.
|
215
|
+
this._inputViews.number.bind("change", function(e, input) {
|
216
|
+
_this._setUnderlyingValue('number', input.getValue());
|
217
217
|
_this._updateValidationStateForInputView('number');
|
218
218
|
return _this._updateProductIfNeeded();
|
219
219
|
});
|
@@ -279,10 +279,7 @@
|
|
279
279
|
this.el.container.addClass("issuer-" + this.product.issuerShortname);
|
280
280
|
}
|
281
281
|
this._setUnderlyingCardType(this.product.companyShortname);
|
282
|
-
this._inputViews.number.
|
283
|
-
groupings: this.product.cardNumberGrouping,
|
284
|
-
placeholderChar: this.options.cardNumberPlaceholderChar
|
285
|
-
});
|
282
|
+
this._inputViews.number.setGroupings(this.product.cardNumberGrouping);
|
286
283
|
this._inputViews.exp.show();
|
287
284
|
this._inputViews.name.show();
|
288
285
|
this._inputViews.exp.reconfigure({
|
@@ -312,10 +309,13 @@
|
|
312
309
|
this._inputViews.exp.hide();
|
313
310
|
this._inputViews.name.hide();
|
314
311
|
this._inputViews.cvc.hide();
|
315
|
-
this._inputViews.number.
|
316
|
-
|
317
|
-
|
318
|
-
|
312
|
+
this._inputViews.number.setGroupings([this.options.genericPlaceholder.length]);
|
313
|
+
/*
|
314
|
+
@_inputViews.number.reconfigure
|
315
|
+
groupings: [@options.genericPlaceholder.length],
|
316
|
+
placeholder: @options.genericPlaceholder
|
317
|
+
*/
|
318
|
+
|
319
319
|
this.el.container.removeClass(function(index, css) {
|
320
320
|
return (css.match(/\bproduct-\S+/g) || []).join(' ');
|
321
321
|
});
|
@@ -502,12 +502,14 @@
|
|
502
502
|
};
|
503
503
|
|
504
504
|
Skeuocard.prototype.flip = function() {
|
505
|
-
var targetFace;
|
505
|
+
var surfaceName, targetFace;
|
506
506
|
targetFace = this.visibleFace === 'front' ? 'back' : 'front';
|
507
507
|
this.trigger('faceWillBecomeVisible.skeuocard', [this, targetFace]);
|
508
508
|
this.visibleFace = targetFace;
|
509
509
|
this.render();
|
510
510
|
this.el.cardBody.toggleClass('flip');
|
511
|
+
surfaceName = this.visibleFace === 'front' ? 'surfaceFront' : 'surfaceBack';
|
512
|
+
this.el[surfaceName].find('input').first().focus();
|
511
513
|
return this.trigger('faceDidBecomeVisible.skeuocard', [this, targetFace]);
|
512
514
|
};
|
513
515
|
|
@@ -570,6 +572,8 @@
|
|
570
572
|
Skeuocard::FlipTabView
|
571
573
|
Handles rendering of the "flip button" control and its various warning and
|
572
574
|
prompt states.
|
575
|
+
|
576
|
+
TODO: Rebuild this so that it observes events and contains its own logic.
|
573
577
|
*/
|
574
578
|
|
575
579
|
|
@@ -712,211 +716,299 @@
|
|
712
716
|
|
713
717
|
})();
|
714
718
|
|
715
|
-
Skeuocard.prototype.SegmentedCardNumberInputView = (function(
|
719
|
+
Skeuocard.prototype.SegmentedCardNumberInputView = (function() {
|
720
|
+
|
721
|
+
SegmentedCardNumberInputView.prototype._digits = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9'];
|
722
|
+
|
723
|
+
SegmentedCardNumberInputView.prototype._arrowKeys = {
|
724
|
+
left: 37,
|
725
|
+
up: 38,
|
726
|
+
right: 39,
|
727
|
+
down: 40
|
728
|
+
};
|
716
729
|
|
717
|
-
|
730
|
+
SegmentedCardNumberInputView.prototype._specialKeys = [8, 9, 16, 17, 18, 19, 20, 27, 33, 34, 35, 36, 37, 38, 39, 40, 45, 46, 91, 93, 144, 145, 224];
|
718
731
|
|
719
732
|
function SegmentedCardNumberInputView(opts) {
|
720
|
-
var _this = this;
|
721
733
|
if (opts == null) {
|
722
734
|
opts = {};
|
723
735
|
}
|
724
|
-
|
725
|
-
|
726
|
-
|
727
|
-
|
728
|
-
|
729
|
-
this.
|
730
|
-
this.
|
731
|
-
|
732
|
-
}
|
733
|
-
this.
|
734
|
-
|
735
|
-
});
|
736
|
-
this.groupEls = $();
|
736
|
+
this.optDefaults = {
|
737
|
+
value: "",
|
738
|
+
groupings: [19],
|
739
|
+
placeholderChar: "X"
|
740
|
+
};
|
741
|
+
this.options = $.extend({}, this.optDefaults, opts);
|
742
|
+
this._state = {
|
743
|
+
selectingAll: false
|
744
|
+
};
|
745
|
+
this._buildDOM();
|
746
|
+
this.setGroupings(this.options.groupings);
|
737
747
|
}
|
738
748
|
|
739
|
-
SegmentedCardNumberInputView.prototype.
|
740
|
-
|
741
|
-
|
742
|
-
|
743
|
-
|
744
|
-
|
745
|
-
|
746
|
-
|
747
|
-
|
748
|
-
|
749
|
+
SegmentedCardNumberInputView.prototype._buildDOM = function() {
|
750
|
+
this.el = $('<fieldset>');
|
751
|
+
this.el.delegate("input", "keypress", this._handleGroupKeyPress.bind(this));
|
752
|
+
this.el.delegate("input", "keydown", this._handleGroupKeyDown.bind(this));
|
753
|
+
this.el.delegate("input", "keyup", this._handleGroupKeyUp.bind(this));
|
754
|
+
this.el.delegate("input", "paste", this._handleGroupPaste.bind(this));
|
755
|
+
return this.el.delegate("input", "change", this._handleGroupChange.bind(this));
|
756
|
+
};
|
757
|
+
|
758
|
+
SegmentedCardNumberInputView.prototype._handleGroupKeyDown = function(e) {
|
759
|
+
var currentTarget, inputGroupEl, inputMaxLength, nextInputEl, prevInputEl, selectionEnd;
|
760
|
+
if (e.ctrlKey || e.metaKey) {
|
761
|
+
return this._handleModifiedKeyDown(e);
|
749
762
|
}
|
750
|
-
|
751
|
-
|
752
|
-
|
753
|
-
|
754
|
-
|
755
|
-
|
756
|
-
|
757
|
-
|
758
|
-
|
759
|
-
|
760
|
-
|
761
|
-
|
762
|
-
|
763
|
-
|
764
|
-
|
765
|
-
|
766
|
-
|
767
|
-
|
768
|
-
|
769
|
-
|
763
|
+
inputGroupEl = $(e.currentTarget);
|
764
|
+
currentTarget = e.currentTarget;
|
765
|
+
selectionEnd = currentTarget.selectionEnd;
|
766
|
+
inputMaxLength = currentTarget.maxLength;
|
767
|
+
prevInputEl = inputGroupEl.prevAll('input');
|
768
|
+
nextInputEl = inputGroupEl.nextAll('input');
|
769
|
+
if (e.which === 8 && prevInputEl.length > 0) {
|
770
|
+
if (selectionEnd === 0) {
|
771
|
+
this._focusField(prevInputEl.first(), 'end');
|
772
|
+
}
|
773
|
+
}
|
774
|
+
return true;
|
775
|
+
};
|
776
|
+
|
777
|
+
SegmentedCardNumberInputView.prototype._handleGroupKeyUp = function(e) {
|
778
|
+
var currentTarget, inputGroupEl, inputMaxLength, nextInputEl, selectionEnd, _ref;
|
779
|
+
inputGroupEl = $(e.currentTarget);
|
780
|
+
currentTarget = e.currentTarget;
|
781
|
+
selectionEnd = currentTarget.selectionEnd;
|
782
|
+
inputMaxLength = currentTarget.maxLength;
|
783
|
+
nextInputEl = inputGroupEl.nextAll('input');
|
784
|
+
if (e.ctrlKey || e.metaKey) {
|
785
|
+
return false;
|
786
|
+
}
|
787
|
+
if ((_ref = e.which) === 37 || _ref === 38 || _ref === 39 || _ref === 40) {
|
788
|
+
if (this._state.selectingAll) {
|
789
|
+
this._endSelectAll();
|
790
|
+
}
|
791
|
+
}
|
792
|
+
switch (e.which) {
|
793
|
+
case this._arrowKeys.left:
|
794
|
+
if (selectionEnd === 0) {
|
795
|
+
this._focusField(inputGroupEl.prev(), 'end');
|
796
|
+
}
|
797
|
+
break;
|
798
|
+
case this._arrowKeys.right:
|
799
|
+
if (selectionEnd === inputMaxLength) {
|
800
|
+
this._focusField(inputGroupEl.next(), 'start');
|
801
|
+
}
|
802
|
+
break;
|
803
|
+
case this._arrowKeys.up:
|
804
|
+
this._focusField(inputGroupEl.next(), 'start');
|
805
|
+
e.preventDefault();
|
806
|
+
break;
|
807
|
+
case this._arrowKeys.down:
|
808
|
+
this._focusField(inputGroupEl.prev(), 'start');
|
809
|
+
e.preventDefault();
|
810
|
+
break;
|
811
|
+
default:
|
812
|
+
if (selectionEnd === inputMaxLength) {
|
813
|
+
if (nextInputEl.length !== 0) {
|
814
|
+
this._focusField(nextInputEl.first(), 'start');
|
815
|
+
} else {
|
816
|
+
e.preventDefault();
|
770
817
|
}
|
818
|
+
}
|
819
|
+
}
|
820
|
+
this.trigger('change', [this]);
|
821
|
+
return true;
|
822
|
+
};
|
823
|
+
|
824
|
+
SegmentedCardNumberInputView.prototype._handleGroupKeyPress = function(e) {
|
825
|
+
var currentTarget, inputGroupEl, inputMaxLength, isDigit, nextInputEl, selectionEnd, _ref, _ref1;
|
826
|
+
inputGroupEl = $(e.currentTarget);
|
827
|
+
currentTarget = e.currentTarget;
|
828
|
+
selectionEnd = currentTarget.selectionEnd;
|
829
|
+
inputMaxLength = currentTarget.maxLength;
|
830
|
+
isDigit = (_ref = String.fromCharCode(e.which), __indexOf.call(this._digits, _ref) >= 0);
|
831
|
+
nextInputEl = inputGroupEl.nextAll('input');
|
832
|
+
if (e.ctrlKey || e.metaKey || (_ref1 = e.which, __indexOf.call(this._specialKeys, _ref1) >= 0) || isDigit) {
|
833
|
+
return true;
|
834
|
+
} else {
|
835
|
+
e.preventDefault();
|
836
|
+
return false;
|
837
|
+
}
|
838
|
+
};
|
839
|
+
|
840
|
+
SegmentedCardNumberInputView.prototype._handleGroupPaste = function(e) {
|
841
|
+
var _this = this;
|
842
|
+
return setTimeout(function() {
|
843
|
+
var newValue;
|
844
|
+
newValue = _this.getValue().replace(/[^0-9]+/g, '');
|
845
|
+
if (_this._state.selectingAll) {
|
846
|
+
_this._endSelectAll();
|
771
847
|
}
|
848
|
+
_this.setValue(newValue);
|
849
|
+
return _this.trigger('change', [_this]);
|
850
|
+
}, 50);
|
851
|
+
};
|
852
|
+
|
853
|
+
SegmentedCardNumberInputView.prototype._handleModifiedKeyDown = function(e) {
|
854
|
+
var char;
|
855
|
+
char = String.fromCharCode(e.which);
|
856
|
+
switch (char) {
|
857
|
+
case 'A':
|
858
|
+
this._beginSelectAll();
|
859
|
+
return e.preventDefault();
|
772
860
|
}
|
773
861
|
};
|
774
862
|
|
775
|
-
SegmentedCardNumberInputView.prototype.
|
776
|
-
|
777
|
-
|
778
|
-
|
779
|
-
|
780
|
-
|
781
|
-
|
782
|
-
|
783
|
-
|
784
|
-
|
785
|
-
|
786
|
-
|
787
|
-
|
863
|
+
SegmentedCardNumberInputView.prototype._handleGroupChange = function(e) {
|
864
|
+
return e.stopPropagation();
|
865
|
+
};
|
866
|
+
|
867
|
+
SegmentedCardNumberInputView.prototype._getFocusedField = function() {
|
868
|
+
return this.el.find("input:focus");
|
869
|
+
};
|
870
|
+
|
871
|
+
SegmentedCardNumberInputView.prototype._beginSelectAll = function() {
|
872
|
+
var fieldEl;
|
873
|
+
if (this._state.selectingAll === false) {
|
874
|
+
this._state.selectingAll = true;
|
875
|
+
this._state.lastGrouping = this.options.groupings;
|
876
|
+
this._state.lastValue = this.getValue();
|
877
|
+
this.setGroupings(this.optDefaults.groupings);
|
878
|
+
this.el.addClass('selecting-all');
|
879
|
+
fieldEl = this.el.find("input");
|
880
|
+
return fieldEl[0].setSelectionRange(0, fieldEl.val().length);
|
881
|
+
} else {
|
882
|
+
fieldEl = this.el.find("input");
|
883
|
+
return fieldEl[0].setSelectionRange(0, fieldEl.val().length);
|
884
|
+
}
|
885
|
+
};
|
886
|
+
|
887
|
+
SegmentedCardNumberInputView.prototype._endSelectAll = function() {
|
888
|
+
if (this._state.selectingAll) {
|
889
|
+
if (this._state.lastValue === this.getValue()) {
|
890
|
+
this.setGroupings(this._state.lastGrouping);
|
788
891
|
} else {
|
789
|
-
this.
|
892
|
+
this._focusField(this.el.find('input').last(), 'end');
|
790
893
|
}
|
894
|
+
this.el.removeClass('selecting-all');
|
895
|
+
return this._state.selectingAll = false;
|
791
896
|
}
|
792
|
-
|
793
|
-
|
897
|
+
};
|
898
|
+
|
899
|
+
SegmentedCardNumberInputView.prototype._indexInValueAtFieldSelection = function(field) {
|
900
|
+
var groupingIndex, i, len, offset, _i, _len, _ref;
|
901
|
+
groupingIndex = this.el.find('input').index(field);
|
902
|
+
offset = 0;
|
903
|
+
_ref = this.options.groupings;
|
904
|
+
for (i = _i = 0, _len = _ref.length; _i < _len; i = ++_i) {
|
905
|
+
len = _ref[i];
|
906
|
+
if (i < groupingIndex) {
|
907
|
+
offset += len;
|
908
|
+
}
|
794
909
|
}
|
795
|
-
|
796
|
-
this.groupEls.each(function() {
|
797
|
-
return newValue += $(this).val();
|
798
|
-
});
|
799
|
-
this.value = newValue;
|
800
|
-
this.trigger("keyup", [this]);
|
801
|
-
return false;
|
910
|
+
return offset + field[0].selectionEnd;
|
802
911
|
};
|
803
912
|
|
804
913
|
SegmentedCardNumberInputView.prototype.setGroupings = function(groupings) {
|
805
|
-
var
|
806
|
-
|
914
|
+
var groupEl, groupLength, _caretPosition, _currentField, _i, _len, _value;
|
915
|
+
_currentField = this._getFocusedField();
|
916
|
+
_value = this.getValue();
|
917
|
+
_caretPosition = 0;
|
918
|
+
if (_currentField.length > 0) {
|
919
|
+
_caretPosition = this._indexInValueAtFieldSelection(_currentField);
|
920
|
+
}
|
807
921
|
this.el.empty();
|
808
|
-
_startLength = 0;
|
809
922
|
for (_i = 0, _len = groupings.length; _i < _len; _i++) {
|
810
923
|
groupLength = groupings[_i];
|
811
924
|
groupEl = $("<input>").attr({
|
812
925
|
type: 'text',
|
926
|
+
pattern: '[0-9]*',
|
813
927
|
size: groupLength,
|
814
928
|
maxlength: groupLength,
|
815
|
-
"class": "group" + groupLength
|
929
|
+
"class": "group" + groupLength,
|
930
|
+
placeholder: new Array(groupLength + 1).join(this.options.placeholderChar)
|
816
931
|
});
|
817
|
-
if (this.value.length > _startLength) {
|
818
|
-
groupEl.val(this.value.substr(_startLength, groupLength));
|
819
|
-
_startLength += groupLength;
|
820
|
-
}
|
821
932
|
this.el.append(groupEl);
|
822
933
|
}
|
823
934
|
this.options.groupings = groupings;
|
824
|
-
this.
|
825
|
-
this.
|
826
|
-
if (
|
827
|
-
this.
|
935
|
+
this.setValue(_value);
|
936
|
+
_currentField = this._focusFieldForValue([_caretPosition, _caretPosition]);
|
937
|
+
if ((_currentField != null) && _currentField[0].selectionEnd === _currentField[0].maxLength) {
|
938
|
+
return this._focusField(_currentField.next(), 'start');
|
828
939
|
}
|
829
|
-
if (this.options.placeholder !== void 0) {
|
830
|
-
return this.setPlaceholder(this.options.placeholder);
|
831
|
-
}
|
832
|
-
};
|
833
|
-
|
834
|
-
SegmentedCardNumberInputView.prototype.setPlaceholderChar = function(ch) {
|
835
|
-
this.groupEls.each(function() {
|
836
|
-
var el;
|
837
|
-
el = $(this);
|
838
|
-
return el.attr('placeholder', new Array(parseInt(el.attr('maxlength')) + 1).join(ch));
|
839
|
-
});
|
840
|
-
this.options.placeholder = void 0;
|
841
|
-
return this.options.placeholderChar = ch;
|
842
940
|
};
|
843
941
|
|
844
|
-
SegmentedCardNumberInputView.prototype.
|
845
|
-
|
846
|
-
|
847
|
-
|
848
|
-
|
849
|
-
|
942
|
+
SegmentedCardNumberInputView.prototype._focusFieldForValue = function(place) {
|
943
|
+
var field, fieldOffset, fieldPosition, groupIndex, groupLength, value, _i, _lastStartPos, _len, _ref;
|
944
|
+
value = this.getValue();
|
945
|
+
if (place === 'start') {
|
946
|
+
field = this.el.find('input').first();
|
947
|
+
this._focusField(field, place);
|
948
|
+
} else if (place === 'end') {
|
949
|
+
field = this.el.find('input').last();
|
950
|
+
this._focusField(field, place);
|
951
|
+
} else {
|
952
|
+
field = void 0;
|
953
|
+
fieldOffset = void 0;
|
954
|
+
_lastStartPos = 0;
|
955
|
+
_ref = this.options.groupings;
|
956
|
+
for (groupIndex = _i = 0, _len = _ref.length; _i < _len; groupIndex = ++_i) {
|
957
|
+
groupLength = _ref[groupIndex];
|
958
|
+
if (place[1] > _lastStartPos && place[1] <= _lastStartPos + groupLength) {
|
959
|
+
field = $(this.el.find('input')[groupIndex]);
|
960
|
+
fieldPosition = place[1] - _lastStartPos;
|
961
|
+
}
|
962
|
+
_lastStartPos += groupLength;
|
963
|
+
}
|
964
|
+
if ((field != null) && (fieldPosition != null)) {
|
965
|
+
this._focusField(field, [fieldPosition, fieldPosition]);
|
966
|
+
} else {
|
967
|
+
this._focusField(this.el.find('input'), 'end');
|
968
|
+
}
|
969
|
+
}
|
970
|
+
return field;
|
971
|
+
};
|
972
|
+
|
973
|
+
SegmentedCardNumberInputView.prototype._focusField = function(field, place) {
|
974
|
+
var fieldLen;
|
975
|
+
if (field.length !== 0) {
|
976
|
+
field.focus();
|
977
|
+
if (place === 'start') {
|
978
|
+
return field[0].setSelectionRange(0, 0);
|
979
|
+
} else if (place === 'end') {
|
980
|
+
fieldLen = field[0].maxLength;
|
981
|
+
return field[0].setSelectionRange(fieldLen, fieldLen);
|
982
|
+
} else {
|
983
|
+
return field[0].setSelectionRange(place[0], place[1]);
|
984
|
+
}
|
985
|
+
}
|
850
986
|
};
|
851
987
|
|
852
988
|
SegmentedCardNumberInputView.prototype.setValue = function(newValue) {
|
853
|
-
var
|
854
|
-
|
855
|
-
this.
|
856
|
-
|
857
|
-
|
858
|
-
|
859
|
-
el.
|
860
|
-
|
861
|
-
|
862
|
-
|
989
|
+
var el, groupIndex, groupLength, groupVal, _i, _lastStartPos, _len, _ref, _results;
|
990
|
+
_lastStartPos = 0;
|
991
|
+
_ref = this.options.groupings;
|
992
|
+
_results = [];
|
993
|
+
for (groupIndex = _i = 0, _len = _ref.length; _i < _len; groupIndex = ++_i) {
|
994
|
+
groupLength = _ref[groupIndex];
|
995
|
+
el = $(this.el.find('input').get(groupIndex));
|
996
|
+
groupVal = newValue.substr(_lastStartPos, groupLength);
|
997
|
+
el.val(groupVal);
|
998
|
+
_results.push(_lastStartPos += groupLength);
|
999
|
+
}
|
1000
|
+
return _results;
|
863
1001
|
};
|
864
1002
|
|
865
1003
|
SegmentedCardNumberInputView.prototype.getValue = function() {
|
866
|
-
|
867
|
-
|
868
|
-
|
869
|
-
|
870
|
-
|
871
|
-
|
872
|
-
}
|
873
|
-
if (changes.groupings != null) {
|
874
|
-
this.setGroupings(changes.groupings);
|
875
|
-
}
|
876
|
-
if (changes.placeholderChar != null) {
|
877
|
-
this.setPlaceholderChar(changes.placeholderChar);
|
878
|
-
}
|
879
|
-
if (changes.placeholder != null) {
|
880
|
-
this.setPlaceholder(changes.placeholder);
|
881
|
-
}
|
882
|
-
if (changes.value != null) {
|
883
|
-
return this.setValue(changes.value);
|
1004
|
+
var buffer, el, _i, _len, _ref;
|
1005
|
+
buffer = "";
|
1006
|
+
_ref = this.el.find('input');
|
1007
|
+
for (_i = 0, _len = _ref.length; _i < _len; _i++) {
|
1008
|
+
el = _ref[_i];
|
1009
|
+
buffer += $(el).val();
|
884
1010
|
}
|
885
|
-
|
886
|
-
|
887
|
-
SegmentedCardNumberInputView.prototype._caretTo = function(index) {
|
888
|
-
var inputEl, inputElIndex, pos,
|
889
|
-
_this = this;
|
890
|
-
pos = 0;
|
891
|
-
inputEl = void 0;
|
892
|
-
inputElIndex = 0;
|
893
|
-
this.groupEls.each(function(i, e) {
|
894
|
-
var el, elLength;
|
895
|
-
el = $(e);
|
896
|
-
elLength = parseInt(el.attr('maxlength'));
|
897
|
-
if (index <= elLength + pos && index >= pos) {
|
898
|
-
inputEl = el;
|
899
|
-
inputElIndex = index - pos;
|
900
|
-
}
|
901
|
-
return pos += elLength;
|
902
|
-
});
|
903
|
-
return this._setFieldCaretPosition(inputEl, inputElIndex);
|
904
|
-
};
|
905
|
-
|
906
|
-
SegmentedCardNumberInputView.prototype._caretPosition = function() {
|
907
|
-
var finalPos, iPos,
|
908
|
-
_this = this;
|
909
|
-
iPos = 0;
|
910
|
-
finalPos = 0;
|
911
|
-
this.groupEls.each(function(i, e) {
|
912
|
-
var el;
|
913
|
-
el = $(e);
|
914
|
-
if (el.is(':focus')) {
|
915
|
-
finalPos = iPos + _this._getFieldCaretPosition(el);
|
916
|
-
}
|
917
|
-
return iPos += parseInt(el.attr('maxlength'));
|
918
|
-
});
|
919
|
-
return finalPos;
|
1011
|
+
return buffer;
|
920
1012
|
};
|
921
1013
|
|
922
1014
|
SegmentedCardNumberInputView.prototype.maxLength = function() {
|
@@ -926,11 +1018,11 @@
|
|
926
1018
|
};
|
927
1019
|
|
928
1020
|
SegmentedCardNumberInputView.prototype.isFilled = function() {
|
929
|
-
return this.
|
1021
|
+
return this.getValue().length === this.maxLength();
|
930
1022
|
};
|
931
1023
|
|
932
1024
|
SegmentedCardNumberInputView.prototype.isValid = function() {
|
933
|
-
return this.isFilled() && this.isValidLuhn(this.
|
1025
|
+
return this.isFilled() && this.isValidLuhn(this.getValue());
|
934
1026
|
};
|
935
1027
|
|
936
1028
|
SegmentedCardNumberInputView.prototype.isValidLuhn = function(identifier) {
|
@@ -954,9 +1046,41 @@
|
|
954
1046
|
return sum % 10 === 0;
|
955
1047
|
};
|
956
1048
|
|
1049
|
+
SegmentedCardNumberInputView.prototype.bind = function() {
|
1050
|
+
var args, _ref;
|
1051
|
+
args = 1 <= arguments.length ? __slice.call(arguments, 0) : [];
|
1052
|
+
return (_ref = this.el).bind.apply(_ref, args);
|
1053
|
+
};
|
1054
|
+
|
1055
|
+
SegmentedCardNumberInputView.prototype.trigger = function() {
|
1056
|
+
var args, _ref;
|
1057
|
+
args = 1 <= arguments.length ? __slice.call(arguments, 0) : [];
|
1058
|
+
return (_ref = this.el).trigger.apply(_ref, args);
|
1059
|
+
};
|
1060
|
+
|
1061
|
+
SegmentedCardNumberInputView.prototype.show = function() {
|
1062
|
+
return this.el.show();
|
1063
|
+
};
|
1064
|
+
|
1065
|
+
SegmentedCardNumberInputView.prototype.hide = function() {
|
1066
|
+
return this.el.hide();
|
1067
|
+
};
|
1068
|
+
|
1069
|
+
SegmentedCardNumberInputView.prototype.addClass = function() {
|
1070
|
+
var args, _ref;
|
1071
|
+
args = 1 <= arguments.length ? __slice.call(arguments, 0) : [];
|
1072
|
+
return (_ref = this.el).addClass.apply(_ref, args);
|
1073
|
+
};
|
1074
|
+
|
1075
|
+
SegmentedCardNumberInputView.prototype.removeClass = function() {
|
1076
|
+
var args, _ref;
|
1077
|
+
args = 1 <= arguments.length ? __slice.call(arguments, 0) : [];
|
1078
|
+
return (_ref = this.el).removeClass.apply(_ref, args);
|
1079
|
+
};
|
1080
|
+
|
957
1081
|
return SegmentedCardNumberInputView;
|
958
1082
|
|
959
|
-
})(
|
1083
|
+
})();
|
960
1084
|
|
961
1085
|
/*
|
962
1086
|
Skeuocard::ExpirationInputView
|
@@ -1050,6 +1174,7 @@
|
|
1050
1174
|
if (__indexOf.call(fieldChars, groupChar) >= 0) {
|
1051
1175
|
input = $('<input>').attr({
|
1052
1176
|
type: 'text',
|
1177
|
+
pattern: '[0-9]*',
|
1053
1178
|
placeholder: new Array(groupLength + 1).join(groupChar),
|
1054
1179
|
maxlength: groupLength,
|
1055
1180
|
"class": 'cc-exp-field-' + groupChar.toLowerCase() + ' group' + groupLength
|
File without changes
|