Abstract payment js to work in webform context

diff --git a/CRM/Contribute/Form/Contribution/Main.php b/CRM/Contribute/Form/Contribution/Main.php
index 59d1ebf111cbc6c3d91bb3227e18d89b26b1254c..56a0718e72c7db6a5a9f546ea0670152db4c2b0f 100644 (file)
--- a/CRM/Contribute/Form/Contribution/Main.php
+++ b/CRM/Contribute/Form/Contribution/Main.php
@@ -34,7 +34,7 @@
  */
 
 /**
- * This class generates form components for processing a ontribution
+ * This class generates form components for processing a Contribution
  *
  */
 class CRM_Contribute_Form_Contribution_Main extends CRM_Contribute_Form_ContributionBase {
@@ -1369,6 +1369,13 @@ class CRM_Contribute_Form_Contribution_Main extends CRM_Contribute_Form_Contribu
           break;
         }
       }
+      if (!$form->_snippet) {
+        // Add JS to show icons for the accepted credit cards
+        $creditCardTypes = CRM_Core_Payment_Form::getCreditCardCSSNames();
+        CRM_Core_Resources::singleton()
+          ->addSetting(array('config' => array('creditCardTypes' => $creditCardTypes)))
+          ->addScriptFile('civicrm', 'templates/CRM/Core/BillingBlock.js');
+      }
     }
     $form->assign('ppType', $form->_ppType);
   }

diff --git a/CRM/Core/Payment/Form.php b/CRM/Core/Payment/Form.php
index 9f61ac2276d0db6106e6beb5a319f38f3a047384..0905d3a9c1eb26e998b339d73b03bc09bd47784a 100644 (file)
--- a/CRM/Core/Payment/Form.php
+++ b/CRM/Core/Payment/Form.php
@@ -272,24 +272,6 @@ class CRM_Core_Payment_Form {
           'state_province' => "billing_state_province_id-{$form->_bltID}",
         ));
       CRM_Core_BAO_Address::addStateCountryMap($stateCountryMap);
-
-      // Add JS to show icons for the accepted credit cards
-      // the credit card pseudo constant results only the CC label, not the key ID
-      // so we normalize the name to use it as a CSS class.
-      $creditCardTypes = array();
-      foreach (CRM_Contribute_PseudoConstant::creditCard() as $key => $name) {
-        // Replace anything not css-friendly by an underscore
-        // Non-latin names will not like this, but so many things are wrong with
-        // the credit-card type configurations already.
-        $key = str_replace(' ', '', $key);
-        $key = preg_replace('/[^a-zA-Z0-9]/', '_', $key);
-        $key = strtolower($key);
-        $creditCardTypes[$key] = $name;
-      }
-
-      CRM_Core_Resources::singleton()
-        ->addSetting(array('config' => array('creditCardTypes' => $creditCardTypes)))
-        ->addScriptFile('civicrm', 'templates/CRM/Core/BillingBlock.js', 10, 'billing-block');
     }
 
     if ($form->_paymentProcessor['billing_mode'] & CRM_Core_Payment::BILLING_MODE_BUTTON) {
@@ -303,6 +285,24 @@ class CRM_Core_Payment_Form {
     }
   }
 
+  /**
+   * The credit card pseudo constant results only the CC label, not the key ID
+   * So we normalize the name to use it as a CSS class.
+   */
+  static function getCreditCardCSSNames() {
+    $creditCardTypes = array();
+    foreach (CRM_Contribute_PseudoConstant::creditCard() as $key => $name) {
+      // Replace anything not css-friendly by an underscore
+      // Non-latin names will not like this, but so many things are wrong with
+      // the credit-card type configurations already.
+      $key = str_replace(' ', '', $key);
+      $key = preg_replace('/[^a-zA-Z0-9]/', '_', $key);
+      $key = strtolower($key);
+      $creditCardTypes[$key] = $name;
+    }
+    return $creditCardTypes;
+  }
+
   /**
    * Function to add all the direct debit fields
    *

diff --git a/css/civicrm.css b/css/civicrm.css
index fe110951b863613f64a7e507d21622d2b56cc9a7..6f02a2b94b547ff177919ddeacfc9b86e8514393 100644 (file)
--- a/css/civicrm.css
+++ b/css/civicrm.css
@@ -3962,7 +3962,7 @@ span.crm-status-icon {
 }
 
 /* Styles for credit card payment logos */
-#crm-container .credit_card_type-section .crm-credit_card_type-icons a {
+.crm-container .credit_card_type-section .crm-credit_card_type-icons a {
   display: block;
   float: left;
   width: 50px;
@@ -3975,31 +3975,31 @@ span.crm-status-icon {
   border: 1px solid #FFFFFF;
 }
 
-#crm-container .credit_card_type-section .crm-credit_card_type-icons .crm-credit_card_type-icon-visa {
+.crm-container .credit_card_type-section .crm-credit_card_type-icons .crm-credit_card_type-icon-visa {
   background-position: -50px 0;
 }
 
-#crm-container .credit_card_type-section .crm-credit_card_type-icons .crm-credit_card_type-icon-mastercard {
+.crm-container .credit_card_type-section .crm-credit_card_type-icons .crm-credit_card_type-icon-mastercard {
   background-position: -100px 0;
 }
 
-#crm-container .credit_card_type-section .crm-credit_card_type-icons .crm-credit_card_type-icon-amex {
+.crm-container .credit_card_type-section .crm-credit_card_type-icons .crm-credit_card_type-icon-amex {
   background-position: -150px 0;
 }
 
-#crm-container .credit_card_type-section .crm-credit_card_type-icons .crm-credit_card_type-icon-discover {
+.crm-container .credit_card_type-section .crm-credit_card_type-icons .crm-credit_card_type-icon-discover {
   background-position: -200px 0;
 }
 
-#crm-container .credit_card_type-section .crm-credit_card_type-icons .crm-credit_card_type-icon-jcb {
+.crm-container .credit_card_type-section .crm-credit_card_type-icons .crm-credit_card_type-icon-jcb {
   background-position: -250px 0;
 }
 
-#crm-container .credit_card_type-section .crm-credit_card_type-icons .crm-credit_card_type-icon-unionpay {
+.crm-container .credit_card_type-section .crm-credit_card_type-icons .crm-credit_card_type-icon-unionpay {
   background-position: -300px 0;
 }
 
-#crm-container .cvv2-icon {
+.crm-container .cvv2-icon {
   display: inline-block;
   width: 50px;
   height: 30px;

diff --git a/templates/CRM/Core/BillingBlock.js b/templates/CRM/Core/BillingBlock.js
index 6b8c23ca6a48d85a4a7852ed590004be30619db0..c78932b1a30b7d8b937f76d716c05bb185b02074 100644 (file)
--- a/templates/CRM/Core/BillingBlock.js
+++ b/templates/CRM/Core/BillingBlock.js
@@ -1,10 +1,5 @@
 // http://civicrm.org/licensing
 (function($) {
-  civicrm_billingblock_creditcard_helper();
-
-  $('#crm-container .credit_card_type-section').on('crmFormLoad', '*', function() {
-    civicrm_billingblock_creditcard_helper();
-  });
 
   /**
    * Adds the icons of enabled credit cards
@@ -18,19 +13,18 @@
       $('.crm-credit_card_type-icons').append(html);
 
       $('.crm-credit_card_type-icon-' + key).click(function() {
-        $('#crm-container .credit_card_type-section #credit_card_type').val(val);
-        $('#crm-container .credit_card_type-section a').css('opacity', 0.25);
-        $('#crm-container .credit_card_type-section .crm-credit_card_type-icon-' + key).css('opacity', 1);
+        $('#credit_card_type').val(val);
+        $('.crm-container .credit_card_type-section a').css('opacity', 0.25);
+        $('.crm-container .credit_card_type-section .crm-credit_card_type-icon-' + key).css('opacity', 1);
         return false;
       });
     });
 
     // Hide the CC type field (redundant)
-    $('#crm-container .credit_card_type-section select#credit_card_type').hide();
-    $('#crm-container .credit_card_type-section .label').hide();
+    $('#credit_card_type, .label', '.crm-container .credit_card_type-section').hide();
 
     // Select according to the number entered
-    $('#crm-container input#credit_card_number').change(function() {
+    $('.crm-container input#credit_card_number').change(function() {
       var ccnumber = cj(this).val();
 
       // Remove spaces and dashes
@@ -38,7 +32,7 @@
       cj(this).val(ccnumber);
 
       // Semi-hide all images, we will un-hide the right one afterwards
-      $('#crm-container .credit_card_type-section a').css('opacity', 0.25);
+      $('.crm-container .credit_card_type-section a').css('opacity', 0.25);
       $('#credit_card_type').val('');
 
       civicrm_billingblock_set_card_type(ccnumber);
@@ -73,10 +67,16 @@
     $.each(card_types, function(key, pattern) {
       if (ccnumber.match('^' + pattern + '$')) {
         var value = card_values[key];
-        $('#crm-container .credit_card_type-section .crm-credit_card_type-icon-' + key).css('opacity', 1);
+        $('.crm-container .credit_card_type-section .crm-credit_card_type-icon-' + key).css('opacity', 1);
         $('select#credit_card_type').val(value);
         return false;
       }
     });
   }
+
+  civicrm_billingblock_creditcard_helper();
+
+  $(function() {
+    $('#billing-payment-block').on('crmFormLoad', civicrm_billingblock_creditcard_helper);
+  });
 })(cj);

diff --git a/templates/CRM/common/paymentBlock.tpl b/templates/CRM/common/paymentBlock.tpl
index 6d75285acbbae4fe638f50276e738584fcfe3f01..b48d75db05cb4df56ea4c2384d7c063cb2104c1b 100644 (file)
--- a/templates/CRM/common/paymentBlock.tpl
+++ b/templates/CRM/common/paymentBlock.tpl
@@ -50,13 +50,12 @@ function buildPaymentBlock( type ) {
     {/if}
   {literal}
 
-  var fname = '#billing-payment-block';
   var response = cj.ajax({
                         url: dataUrl,
                         async: false
                         }).responseText;
 
-    cj( fname ).html( response );
+  cj('#billing-payment-block').html(response).trigger('crmFormLoad');
 }
 
 cj( function() {