TR-68: BNPL integration

assets/admin/css/globalpayments-admin.css

@@ -2,7 +2,8 @@
     margin:0;
 }
 
-.woocommerce-globalpayments-checkout-error {
+.woocommerce-globalpayments-checkout-error,
+.wc-globalpayments-transaction-info-error {
     background-color:#e2401c;
     margin-left:0;
     margin-bottom:10px;
@@ -21,3 +22,25 @@
     min-height:32px;
     width:auto;
 }
+
+.wc-transaction-info table {
+    border-collapse: collapse;
+    width: 100%;
+}
+
+.wc-transaction-info td {
+    text-align: left;
+    padding: 8px;
+}
+
+.wc-transaction-info tr:nth-child(odd) {
+    background-color: #f2f2f2;
+}
+
+.wc-transaction-info td:first-child {
+    float: left;
+}
+
+.wc-transaction-info td:last-child {
+    float: right;
+}

assets/admin/js/globalpayments-admin.js

@@ -1,10 +1,11 @@
 /* global globalpayments_admin_params */
 
-( function(
+(function (
     $,
-    globalpayments_admin_params
+    globalpayments_admin_params,
+    globalpayments_admin_txn_params
 ) {
-    function GlobalPaymentsAdmin( globalpayments_admin_params ) {
+    function GlobalPaymentsAdmin( globalpayments_admin_params, globalpayments_admin_txn_params ) {
         this.id = globalpayments_admin_params.gateway_id;
         this.toggleCredentialsSettings();
         this.toggleValidations();
@@ -21,10 +22,12 @@
             $( document ).on( 'change', this.getLiveModeSelector(), this.toggleCredentialsSettings.bind( this ) );
             $( document ).on( 'change', this.getEnabledGatewaySelector(), this.toggleValidations.bind( this ) );
             $( document ).on( 'change', $( '.accepted_cards.required' ), this.validate_cc_types.bind( this ) );
-            
+
             // Admin Pay for Order
             $( '#customer_user' ).on( 'change', this.updatePaymentMethods );
             $( '.wc-globalpayments-pay-order' ).on( 'click', this.payForOrder );
+            // Admin View Transaction Details
+            $( '.wc-globalpayments-transaction-info' ).on( 'click', this.viewTransactionStatus );
             $( document.body ).on('wc_backbone_modal_loaded', this.modalLoaded.bind( this ) );
         },
 
@@ -61,6 +64,57 @@
             });
         },
 
+        /**
+         * Enable modal template.
+         *
+         * @param e
+         */
+        viewTransactionStatus: function ( e ) {
+            e.preventDefault();
+            const transactionInfo = GlobalPaymentsAdmin.transactionInfo = $(this);
+            if ( transactionInfo.data( 'transaction-info' ) ) {
+                $( this ).WCBackboneModal({
+                    template: 'wc-globalpayments-transaction-info-modal',
+                    variable: {
+                        transaction_info: $( this ).data( 'transaction-info' )
+                    }
+                });
+            } else {
+                $( '.wc-globalpayments-transaction-info' ).prop( 'disabled', true );
+
+                $.ajax({
+                    url: globalpayments_admin_txn_params.transaction_info_url,
+                    method: 'POST',
+                    data: {
+                        _wpnonce: globalpayments_admin_txn_params._wpnonce,
+                        transactionId: globalpayments_admin_txn_params.transaction_id
+                    }
+                }).done( function ( response ) {
+                    if ( response.error ) {
+                        $( this ).WCBackboneModal({
+                            template: 'wc-globalpayments-transaction-info-modal',
+                            variable: {
+                                error_message: response.message
+                            }
+                        });
+                    } else {
+                        transactionInfo.data( 'transaction-info', response );
+
+                        $( this ).WCBackboneModal({
+                            template: 'wc-globalpayments-transaction-info-modal',
+                            variable: {
+                                transaction_info: response
+                            }
+                        });
+                    }
+                }).fail( function (xhr, textStatus, errorThrown) {
+                    window.alert(errorThrown);
+                }).always( function () {
+                    $( '.wc-globalpayments-transaction-info' ).prop( 'disabled', false );
+                })
+            }
+        },
+
         /**
          * Render modal content.
          *
@@ -73,6 +127,9 @@
                     $( document.body ).trigger( 'globalpayments_pay_order_modal_loaded' );
                     $( document.body ).trigger( 'wc-credit-card-form-init' );
                     break;
+                case 'wc-globalpayments-transaction-info-modal':
+                    $( document.body ).trigger( 'globalpayments_transaction_info_modal_loaded' );
+                    break;
             }
         },
 
@@ -177,7 +234,7 @@
             return '#woocommerce_' + this.id + '_enabled';
         }
     };
-    new GlobalPaymentsAdmin( globalpayments_admin_params );
+    new GlobalPaymentsAdmin( globalpayments_admin_params, globalpayments_admin_txn_params );
 }(
     /**
      * Global `jQuery` reference
@@ -191,4 +248,5 @@
      * @type {any}
      */
     (window).globalpayments_admin_params || {},
+    (window).globalpayments_admin_txn_params || {}
 ));

assets/admin/js/globalpayments-enforce-single-gateway.js

@@ -1,11 +1,13 @@
-( function( $ ) {
+( function(
+    $,
+    single_toggle_gateways
+) {
     $( function() {
-        var digitalWallet = [ 'globalpayments_googlepay', 'globalpayments_applepay' ];
         // Toggle GlobalPayments gateway on/off.
         $( '[data-gateway_id^="globalpayments_"]' ).on( 'click', '.wc-payment-gateway-method-toggle-enabled', function() {
             var toggle = true;
 
-            if ( digitalWallet.includes( $( this ).closest( 'tr' ).data( 'gateway_id' ) ) ) {
+            if ( ! single_toggle_gateways.includes( $( this ).closest( 'tr' ).data( 'gateway_id' ) ) ) {
                 return;
             }
 
@@ -18,7 +20,7 @@
             var clicked = $( this ).closest( 'tr' ).data( 'gateway_id' );
             $( '[data-gateway_id^="globalpayments_"]' ).each( function() {
                 if ( ! $( this ).find( 'span.woocommerce-input-toggle--disabled' ).length > 0 ) {
-                    if ( ! digitalWallet.includes( $( this ).data( 'gateway_id' ) ) && ! digitalWallet.includes( clicked ) ) {
+                    if ( single_toggle_gateways.includes( $( this ).data( 'gateway_id' ) ) && single_toggle_gateways.includes( clicked ) ) {
                         var gateway_title = $( this ).closest( 'tr' ).find( 'a.wc-payment-gateway-method-title' ).text();
                         window.alert( 'You can enable only one GlobalPayments gateway at a time. ' +
                             'Please disable ' + gateway_title + ' first!' );
@@ -32,4 +34,7 @@
         });
     });
 
-})( jQuery );
+})(
+    (window).jQuery,
+    (window).globalpayments_enforce_single_gateway_params || []
+);

assets/frontend/js/globalpayments-helper.js

@@ -95,12 +95,14 @@
 		toggleSubmitButtons: function () {
 			var selectedPaymentGatewayId = $( '.payment_methods input.input-radio:checked' ).val();
 			var isGPGateway = selectedPaymentGatewayId.search( 'globalpayments' ) >= 0;
+			var submitButtonTarget = $( this.getSubmitButtonTargetSelector( selectedPaymentGatewayId ) );
+			var placeOrderButton = $( this.getPlaceOrderButtonSelector() );
 
 			$( '.globalpayments.card-submit' ).hide();
 
-			// another payment method was selected
-			if ( ! isGPGateway ) {
-				$( this.getPlaceOrderButtonSelector() ).removeClass( 'woocommerce-globalpayments-hidden' ).show();
+			// another payment method was selected or target button doesn't exists
+			if ( ! isGPGateway || ! submitButtonTarget.length ) {
+				placeOrderButton.removeClass( 'woocommerce-globalpayments-hidden' ).show();
 				return;
 			}
 
@@ -112,13 +114,13 @@
 			var newSavedCardSelected   = 'new' === $( this.getStoredPaymentMethodsRadioSelector( selectedPaymentGatewayId ) + ':checked' ).val();
 			// selected payment method is card or digital wallet
 			if ( ! savedCardsAvailable  || savedCardsAvailable && newSavedCardSelected ) {
-				$( this.getSubmitButtonTargetSelector( selectedPaymentGatewayId ) ).show();
-				$( this.getPlaceOrderButtonSelector() ).addClass( 'woocommerce-globalpayments-hidden' ).hide();
+				submitButtonTarget.show();
+				placeOrderButton.addClass( 'woocommerce-globalpayments-hidden' ).hide();
 			} else {
 				// selected payment method is stored card
-				$( this.getSubmitButtonTargetSelector( selectedPaymentGatewayId ) ).hide();
+				submitButtonTarget.hide();
 				// show platform `Place Order` button
-				$( this.getPlaceOrderButtonSelector() ).removeClass( 'woocommerce-globalpayments-hidden' ).show();
+				placeOrderButton.removeClass( 'woocommerce-globalpayments-hidden' ).show();
 			}
 		},
 

assets/frontend/js/globalpayments-secure-payment-fields.js

@@ -105,9 +105,12 @@
 				$( document ).ready( this.renderPaymentFields.bind( this ) );
 				$( document ).ready( function () {
 					$( helper.getPlaceOrderButtonSelector() ).on( 'click', function ( $e ) {
-						$e.preventDefault();
-						$e.stopImmediatePropagation();
-						self.threeDSecure();
+						var selectedPaymentGatewayId = $( '.payment_methods input.input-radio:checked' ).val();
+						if ( 'globalpayments_gpapi' === selectedPaymentGatewayId ) {
+							$e.preventDefault();
+							$e.stopImmediatePropagation();
+							self.threeDSecure();
+						}
 						return;
 					} );
 				} );
@@ -224,6 +227,8 @@
 			}
 
 			GlobalPayments.configure( gatewayConfig );
+			GlobalPayments.on( 'error', this.handleErrors.bind( this ) );
+
 			this.cardForm = GlobalPayments.ui.form(
 				{
 					fields: this.getFieldConfiguration(),
@@ -234,7 +239,6 @@
 			this.cardForm.on( 'token-success', this.handleResponse.bind( this ) );
 			this.cardForm.on( 'token-error', this.handleErrors.bind( this ) );
 			this.cardForm.on( 'error', this.handleErrors.bind( this ) );
-			GlobalPayments.on( 'error', this.handleErrors.bind( this ) );
 
 			// match the visibility of our payment form
 			this.cardForm.ready( function () {

composer.json

@@ -14,7 +14,7 @@
         }
     },
     "require": {
-        "globalpayments/php-sdk": "6.0.0",
+        "globalpayments/php-sdk": "6.0.5",
         "psr/log": "^1.1"
     },
     "require-dev": {