1 // http://civicrm.org/licensing
5 * Adds the icons of enabled credit cards
6 * Handles clicking on a icon.
7 * Changes the icon depending on the credit card number.
8 * Removes spaces and dashes from credit card numbers.
10 function civicrm_billingblock_creditcard_helper() {
12 $.each(CRM
.config
.creditCardTypes
, function(key
, val
) {
13 var html
= '<a href="#" data-card_type=" + key + " title="' + val
+ '" class="crm-credit_card_type-icon-' + val
.css_key
+ '"><span>' + val
.label
+ '</span></a>';
14 $('.crm-credit_card_type-icons').append(html
);
16 $('.crm-credit_card_type-icon-' + val
.css_key
).click(function() {
17 $('#credit_card_type').val(key
);
18 $('.crm-container .credit_card_type-section a').css('opacity', 0.25);
19 $('.crm-container .credit_card_type-section .crm-credit_card_type-icon-' + val
.css_key
).css('opacity', 1);
24 // Hide the CC type field (redundant)
25 $('#credit_card_type, .label', '.crm-container .credit_card_type-section').hide();
27 // set the card type value as default if any found
28 var cardtype
= $('#credit_card_type').val();
30 $.each(CRM
.config
.creditCardTypes
, function(key
, val
) {
31 // highlight the selected card type icon
32 if (key
=== cardtype
) {
33 $('.crm-container .credit_card_type-section .crm-credit_card_type-icon-' + val
.css_key
).css('opacity', 1);
36 $('.crm-container .credit_card_type-section .crm-credit_card_type-icon-' + val
.css_key
).css('opacity', 0.25);
41 // Select according to the number entered
42 $('.crm-container input#credit_card_number').change(function() {
43 var ccnumber
= cj(this).val();
45 // Remove spaces and dashes
46 ccnumber
= ccnumber
.replace(/[- ]/g, '');
47 cj(this).val(ccnumber
);
49 // Semi-hide all images, we will un-hide the right one afterwards
50 $('.crm-container .credit_card_type-section a').css('opacity', 0.25);
51 $('#credit_card_type').val('');
53 civicrm_billingblock_set_card_type(ccnumber
);
58 function civicrm_billingblock_set_card_type(ccnumber
) {
59 var card_values
= CRM
.config
.creditCardTypes
;
60 $.each(card_values
, function(key
, spec
) {
61 if (ccnumber
.match('^' + spec
.pattern
+ '$')) {
62 $('.crm-container .credit_card_type-section .crm-credit_card_type-icon-' + spec
.css_key
).css('opacity', 1);
63 $('select#credit_card_type').val(key
);
69 civicrm_billingblock_creditcard_helper();