diff --git a/modules/ppcp-button/resources/js/button.js b/modules/ppcp-button/resources/js/button.js index bee8c2361..790030920 100644 --- a/modules/ppcp-button/resources/js/button.js +++ b/modules/ppcp-button/resources/js/button.js @@ -164,6 +164,7 @@ const bootstrap = () => { const cartBootstrap = new CartBootstrap( PayPalCommerceGateway, renderer, + messageRenderer, errorHandler, ); diff --git a/modules/ppcp-button/resources/js/modules/ContextBootstrap/CartBootstap.js b/modules/ppcp-button/resources/js/modules/ContextBootstrap/CartBootstap.js index 504fc4c42..5aadb7f61 100644 --- a/modules/ppcp-button/resources/js/modules/ContextBootstrap/CartBootstap.js +++ b/modules/ppcp-button/resources/js/modules/ContextBootstrap/CartBootstap.js @@ -3,10 +3,12 @@ import BootstrapHelper from "../Helper/BootstrapHelper"; import {setVisible} from "../Helper/Hiding"; class CartBootstrap { - constructor(gateway, renderer, errorHandler) { + constructor(gateway, renderer, messages, errorHandler) { this.gateway = gateway; this.renderer = renderer; + this.messages = messages; this.errorHandler = errorHandler; + this.lastAmount = this.gateway.messages.amount; this.renderer.onButtonsInit(this.gateway.button.wrapper, () => { this.handleButtonStatus(); @@ -38,11 +40,16 @@ class CartBootstrap { return; } - const newParams = result.data; + const newParams = result.data.url_params; const reloadRequired = this.gateway.url_params.intent !== newParams.intent; // TODO: should reload the script instead setVisible(this.gateway.button.wrapper, !reloadRequired) + + if (this.lastAmount !== result.data.amount) { + this.lastAmount = result.data.amount; + this.messages.renderWithAmount(this.lastAmount); + } }); }); } @@ -76,6 +83,8 @@ class CartBootstrap { this.renderer.render( actionHandler.configuration() ); + + this.messages.renderWithAmount(this.lastAmount); } } diff --git a/modules/ppcp-button/resources/js/modules/ContextBootstrap/CheckoutBootstap.js b/modules/ppcp-button/resources/js/modules/ContextBootstrap/CheckoutBootstap.js index b426ac3ee..db1cba84f 100644 --- a/modules/ppcp-button/resources/js/modules/ContextBootstrap/CheckoutBootstap.js +++ b/modules/ppcp-button/resources/js/modules/ContextBootstrap/CheckoutBootstap.js @@ -15,6 +15,7 @@ class CheckoutBootstap { this.messages = messages; this.spinner = spinner; this.errorHandler = errorHandler; + this.lastAmount = this.gateway.messages.amount; this.standardOrderButtonSelector = ORDER_BUTTON_SELECTOR; @@ -36,6 +37,27 @@ class CheckoutBootstap { jQuery(document.body).on('updated_checkout', () => { this.render() this.handleButtonStatus(); + + if (this.shouldRenderMessages()) { // currently we need amount only for Pay Later + fetch( + this.gateway.ajax.cart_script_params.endpoint, + { + method: 'GET', + credentials: 'same-origin', + } + ) + .then(result => result.json()) + .then(result => { + if (! result.success) { + return; + } + + if (this.lastAmount !== result.data.amount) { + this.lastAmount = result.data.amount; + this.updateUi(); + } + }); + } }); jQuery(document.body).on('updated_checkout payment_method_selected', () => { @@ -117,8 +139,8 @@ class CheckoutBootstap { setVisible(wrapper, gatewayId === currentPaymentMethod); } - if (isPaypal && !isFreeTrial) { - this.messages.render(); + if (this.shouldRenderMessages()) { + this.messages.renderWithAmount(this.lastAmount); } if (isCard) { @@ -130,6 +152,12 @@ class CheckoutBootstap { } } + shouldRenderMessages() { + return getCurrentPaymentMethod() === PaymentMethods.PAYPAL + && !PayPalCommerceGateway.is_free_trial_cart + && this.messages.shouldRender(); + } + disableCreditCardFields() { jQuery('label[for="ppcp-credit-card-gateway-card-number"]').addClass('ppcp-credit-card-gateway-form-field-disabled') jQuery('#ppcp-credit-card-gateway-card-number').addClass('ppcp-credit-card-gateway-form-field-disabled') diff --git a/modules/ppcp-button/resources/js/modules/Renderer/MessageRenderer.js b/modules/ppcp-button/resources/js/modules/Renderer/MessageRenderer.js index 80c90c0ef..7b1577aad 100644 --- a/modules/ppcp-button/resources/js/modules/Renderer/MessageRenderer.js +++ b/modules/ppcp-button/resources/js/modules/Renderer/MessageRenderer.js @@ -5,28 +5,6 @@ class MessageRenderer { this.optionsFingerprint = null; } - render() { - if (! this.shouldRender()) { - return; - } - - const options = { - amount: this.config.amount, - placement: this.config.placement, - style: this.config.style - }; - - if (this.optionsEqual(options)) { - return; - } - - paypal.Messages(options).render(this.config.wrapper); - - jQuery(document.body).on('updated_cart_totals', () => { - paypal.Messages(options).render(this.config.wrapper); - }); - } - renderWithAmount(amount) { if (! this.shouldRender()) { return; diff --git a/modules/ppcp-button/src/Endpoint/CartScriptParamsEndpoint.php b/modules/ppcp-button/src/Endpoint/CartScriptParamsEndpoint.php index ee976cac3..440af66f1 100644 --- a/modules/ppcp-button/src/Endpoint/CartScriptParamsEndpoint.php +++ b/modules/ppcp-button/src/Endpoint/CartScriptParamsEndpoint.php @@ -67,7 +67,12 @@ class CartScriptParamsEndpoint implements EndpointInterface { try { $script_data = $this->smart_button->script_data(); - wp_send_json_success( $script_data['url_params'] ); + wp_send_json_success( + array( + 'url_params' => $script_data['url_params'], + 'amount' => WC()->cart->get_total( 'raw' ), + ) + ); return true; } catch ( Throwable $error ) {