From 7da5d8d68a48ca8aa92cfa61018170168788c64c Mon Sep 17 00:00:00 2001 From: Alex P Date: Mon, 16 Oct 2023 21:41:17 +0300 Subject: [PATCH] Simplify message wrapper rendering and add shop, home locations --- .../ContextBootstrap/CheckoutBootstap.js | 11 +- .../ppcp-button/src/Assets/SmartButton.php | 100 ++++--- .../ppcp-onboarding/resources/js/settings.js | 4 +- .../resources/js/gateway-settings.js | 2 +- modules/ppcp-wc-gateway/services.php | 8 +- .../Settings/Fields/pay-later-tab-fields.php | 248 ++++++++++++++++++ 6 files changed, 328 insertions(+), 45 deletions(-) diff --git a/modules/ppcp-button/resources/js/modules/ContextBootstrap/CheckoutBootstap.js b/modules/ppcp-button/resources/js/modules/ContextBootstrap/CheckoutBootstap.js index 27f9ca882..e7fae33b0 100644 --- a/modules/ppcp-button/resources/js/modules/ContextBootstrap/CheckoutBootstap.js +++ b/modules/ppcp-button/resources/js/modules/ContextBootstrap/CheckoutBootstap.js @@ -156,8 +156,15 @@ class CheckoutBootstap { } shouldShowMessages() { - return getCurrentPaymentMethod() === PaymentMethods.PAYPAL - && !PayPalCommerceGateway.is_free_trial_cart; + // hide when another method selected only if messages are near buttons + const messagesWrapper = document.querySelector(this.gateway.messages.wrapper); + if (getCurrentPaymentMethod() !== PaymentMethods.PAYPAL && + messagesWrapper && jQuery(messagesWrapper).closest('.ppc-button-wrapper').length + ) { + return false; + } + + return !PayPalCommerceGateway.is_free_trial_cart; } disableCreditCardFields() { diff --git a/modules/ppcp-button/src/Assets/SmartButton.php b/modules/ppcp-button/src/Assets/SmartButton.php index c3e9cc046..69905a960 100644 --- a/modules/ppcp-button/src/Assets/SmartButton.php +++ b/modules/ppcp-button/src/Assets/SmartButton.php @@ -382,54 +382,48 @@ class SmartButton implements SmartButtonInterface { * Registers the hooks to render the credit messaging HTML depending on the settings. * * @return bool - * @throws NotFoundException When a setting was not found. */ private function render_message_wrapper_registrar(): bool { if ( ! $this->settings_status->is_pay_later_messaging_enabled() ) { return false; } - $selected_locations = $this->settings->has( 'pay_later_messaging_locations' ) ? $this->settings->get( 'pay_later_messaging_locations' ) : array(); + $location = $this->location(); - $not_enabled_on_cart = ! in_array( 'cart', $selected_locations, true ); + if ( ! $this->settings_status->is_pay_later_messaging_enabled_for_location( $location ) ) { + return false; + } + + $get_hook = function ( string $location ): ?array { + switch ( $location ) { + case 'checkout': + return $this->messages_renderer_hook( $location, 'woocommerce_review_order_after_submit', 11 ); + case 'cart': + return $this->messages_renderer_hook( $location, $this->proceed_to_checkout_button_renderer_hook(), 19 ); + case 'pay-now': + return $this->messages_renderer_hook( 'pay_order', 'woocommerce_pay_order_before_submit', 10 ); + case 'product': + return $this->messages_renderer_hook( $location, $this->single_product_renderer_hook(), 30 ); + case 'shop': + return $this->messages_renderer_hook( $location, 'woocommerce_archive_description', 10 ); + case 'home': + return $this->messages_renderer_hook( $location, 'loop_start', 20 ); + default: + return null; + } + }; + + $hook = $get_hook( $location ); + if ( ! $hook ) { + return false; + } add_action( - $this->proceed_to_checkout_button_renderer_hook(), - function() use ( $not_enabled_on_cart ) { - if ( ! is_cart() || $not_enabled_on_cart ) { - return; - } - $this->message_renderer(); - }, - 19 + $hook['name'], + array( $this, 'message_renderer' ), + $hook['priority'] ); - $not_enabled_on_product_page = ! in_array( 'product', $selected_locations, true ); - if ( - ( is_product() || wc_post_content_has_shortcode( 'product_page' ) ) - && ! $not_enabled_on_product_page - && ! is_checkout() - ) { - add_action( - $this->single_product_renderer_hook(), - array( $this, 'message_renderer' ), - 30 - ); - } - - $not_enabled_on_checkout = ! in_array( 'checkout', $selected_locations, true ); - if ( ! $not_enabled_on_checkout ) { - add_action( - $this->checkout_dcc_button_renderer_hook(), - array( $this, 'message_renderer' ), - 11 - ); - add_action( - $this->pay_order_renderer_hook(), - array( $this, 'message_renderer' ), - 15 - ); - } return true; } @@ -707,8 +701,7 @@ class SmartButton implements SmartButtonInterface { } $styling_per_location = $this->settings->has( 'pay_later_enable_styling_per_messaging_location' ) && $this->settings->get( 'pay_later_enable_styling_per_messaging_location' ); - $per_location = is_checkout() ? 'checkout' : ( is_cart() ? 'cart' : 'product' ); - $location = $styling_per_location ? $per_location : 'general'; + $location = $styling_per_location ? $this->location() : 'general'; $setting_name_prefix = "pay_later_{$location}_message"; $layout = $this->settings->has( "{$setting_name_prefix}_layout" ) ? $this->settings->get( "{$setting_name_prefix}_layout" ) : 'text'; @@ -1321,6 +1314,35 @@ class SmartButton implements SmartButtonInterface { return (string) apply_filters( 'woocommerce_paypal_payments_pay_order_dcc_renderer_hook', 'woocommerce_pay_order_after_submit' ); } + /** + * Returns the action name that will be used for rendering Pay Later messages. + * + * @param string $location The location name like 'checkout', 'shop'. See render_message_wrapper_registrar. + * @param string $default_hook The default name of the hook. + * @param int $default_priority The default priority of the hook. + * @return array An array with 'name' and 'priority' keys. + */ + private function messages_renderer_hook( string $location, string $default_hook, int $default_priority ): array { + /** + * The filter returning the action name that will be used for rendering Pay Later messages. + */ + $hook = (string) apply_filters( + "woocommerce_paypal_payments_${location}_messages_renderer_hook", + $default_hook + ); + /** + * The filter returning the action priority that will be used for rendering Pay Later messages. + */ + $priority = (int) apply_filters( + "woocommerce_paypal_payments_${location}_messages_renderer_priority", + $default_priority + ); + return array( + 'name' => $hook, + 'priority' => $priority, + ); + } + /** * Returns action name that PayPal button will use for rendering next to Proceed to checkout button (normally displayed in cart). * diff --git a/modules/ppcp-onboarding/resources/js/settings.js b/modules/ppcp-onboarding/resources/js/settings.js index 44fa692ed..7485b3bc3 100644 --- a/modules/ppcp-onboarding/resources/js/settings.js +++ b/modules/ppcp-onboarding/resources/js/settings.js @@ -1,7 +1,7 @@ document.addEventListener( 'DOMContentLoaded', () => { - const payLaterMessagingSelectableLocations = ['product', 'cart', 'checkout']; + const payLaterMessagingSelectableLocations = ['product', 'cart', 'checkout', 'shop', 'home']; const payLaterMessagingAllLocations = payLaterMessagingSelectableLocations.concat('general'); const payLaterMessagingLocationsSelector = '#field-pay_later_messaging_locations'; const payLaterMessagingLocationsSelect = payLaterMessagingLocationsSelector + ' select'; @@ -9,7 +9,7 @@ document.addEventListener( const smartButtonLocationsSelector = '#field-smart_button_locations'; const smartButtonLocationsSelect = smartButtonLocationsSelector + ' select'; - const smartButtonSelectableLocations = payLaterMessagingSelectableLocations.concat('mini-cart'); + const smartButtonSelectableLocations = ['product', 'cart', 'checkout', 'mini-cart']; const groupToggle = (selector, group) => { const toggleElement = document.querySelector(selector); diff --git a/modules/ppcp-wc-gateway/resources/js/gateway-settings.js b/modules/ppcp-wc-gateway/resources/js/gateway-settings.js index 44bb86021..e5b71f8d5 100644 --- a/modules/ppcp-wc-gateway/resources/js/gateway-settings.js +++ b/modules/ppcp-wc-gateway/resources/js/gateway-settings.js @@ -274,7 +274,7 @@ document.addEventListener( }, 1000)); loadPaypalScript(oldScriptSettings, () => { - const payLaterMessagingLocations = ['product', 'cart', 'checkout', 'general']; + const payLaterMessagingLocations = ['product', 'cart', 'checkout', 'shop', 'home', 'general']; const paypalButtonLocations = ['product', 'cart', 'checkout', 'mini-cart', 'general']; paypalButtonLocations.forEach((location) => { diff --git a/modules/ppcp-wc-gateway/services.php b/modules/ppcp-wc-gateway/services.php index 0044f7ea1..3cd63a056 100644 --- a/modules/ppcp-wc-gateway/services.php +++ b/modules/ppcp-wc-gateway/services.php @@ -1354,7 +1354,13 @@ return array( 'wcgateway.settings.pay-later.messaging-locations' => static function( ContainerInterface $container ): array { $button_locations = $container->get( 'wcgateway.button.locations' ); unset( $button_locations['mini-cart'] ); - return $button_locations; + return array_merge( + $button_locations, + array( + 'shop' => __( 'Shop', 'woocommerce-paypal-payments' ), + 'home' => __( 'Home', 'woocommerce-paypal-payments' ), + ) + ); }, 'wcgateway.button.default-locations' => static function( ContainerInterface $container ): array { return array_keys( $container->get( 'wcgateway.settings.pay-later.messaging-locations' ) ); diff --git a/modules/ppcp-wc-gateway/src/Settings/Fields/pay-later-tab-fields.php b/modules/ppcp-wc-gateway/src/Settings/Fields/pay-later-tab-fields.php index 6428b1389..99a3fd3f0 100644 --- a/modules/ppcp-wc-gateway/src/Settings/Fields/pay-later-tab-fields.php +++ b/modules/ppcp-wc-gateway/src/Settings/Fields/pay-later-tab-fields.php @@ -623,6 +623,254 @@ return function ( ContainerInterface $container, array $fields ): array { 'requirements' => array( 'messages' ), 'gateway' => Settings::PAY_LATER_TAB_ID, ), + + // Shop. + 'pay_later_shop_messaging_heading' => array( + 'heading' => __( 'Pay Later Messaging on the Shop page', 'woocommerce-paypal-payments' ), + 'type' => 'ppcp-heading', + 'screens' => array( State::STATE_ONBOARDED ), + 'requirements' => array(), + 'gateway' => Settings::PAY_LATER_TAB_ID, + ), + 'pay_later_shop_message_layout' => array( + 'title' => __( 'Shop Messaging Layout', 'woocommerce-paypal-payments' ), + 'type' => 'select', + 'class' => array(), + 'input_class' => array( 'wc-enhanced-select' ), + 'default' => 'text', + 'desc_tip' => true, + 'description' => __( 'The layout of the message.', 'woocommerce-paypal-payments' ), + 'options' => array( + 'text' => __( 'Text', 'woocommerce-paypal-payments' ), + 'flex' => __( 'Banner', 'woocommerce-paypal-payments' ), + ), + 'screens' => array( State::STATE_ONBOARDED ), + 'requirements' => array( 'messages' ), + 'gateway' => Settings::PAY_LATER_TAB_ID, + ), + 'pay_later_shop_message_logo' => array( + 'title' => __( 'Shop Messaging Logo', 'woocommerce-paypal-payments' ), + 'type' => 'select', + 'class' => array(), + 'input_class' => array( 'wc-enhanced-select' ), + 'default' => 'inline', + 'desc_tip' => true, + 'description' => __( 'What logo the text message contains. Only applicable, when the layout style Text is used.', 'woocommerce-paypal-payments' ), + 'options' => array( + 'primary' => __( 'Primary', 'woocommerce-paypal-payments' ), + 'alternative' => __( 'Alternative', 'woocommerce-paypal-payments' ), + 'inline' => __( 'Inline', 'woocommerce-paypal-payments' ), + 'none' => __( 'None', 'woocommerce-paypal-payments' ), + ), + 'screens' => array( State::STATE_ONBOARDED ), + 'requirements' => array( 'messages' ), + 'gateway' => Settings::PAY_LATER_TAB_ID, + ), + 'pay_later_shop_message_position' => array( + 'title' => __( 'Shop Messaging Logo Position', 'woocommerce-paypal-payments' ), + 'type' => 'select', + 'class' => array(), + 'input_class' => array( 'wc-enhanced-select' ), + 'default' => 'left', + 'desc_tip' => true, + 'description' => __( 'The position of the logo. Only applicable, when the layout style Text is used.', 'woocommerce-paypal-payments' ), + 'options' => array( + 'left' => __( 'Left', 'woocommerce-paypal-payments' ), + 'right' => __( 'Right', 'woocommerce-paypal-payments' ), + 'top' => __( 'Top', 'woocommerce-paypal-payments' ), + ), + 'screens' => array( State::STATE_ONBOARDED ), + 'requirements' => array( 'messages' ), + 'gateway' => Settings::PAY_LATER_TAB_ID, + ), + 'pay_later_shop_message_color' => array( + 'title' => __( 'Shop Messaging Text Color', 'woocommerce-paypal-payments' ), + 'type' => 'select', + 'class' => array(), + 'input_class' => array( 'wc-enhanced-select' ), + 'default' => 'black', + 'desc_tip' => true, + 'description' => __( 'The color of the text. Only applicable, when the layout style Text is used.', 'woocommerce-paypal-payments' ), + 'options' => array( + 'black' => __( 'Black', 'woocommerce-paypal-payments' ), + 'white' => __( 'White', 'woocommerce-paypal-payments' ), + 'monochrome' => __( 'Monochrome', 'woocommerce-paypal-payments' ), + 'grayscale' => __( 'Grayscale', 'woocommerce-paypal-payments' ), + ), + 'screens' => array( State::STATE_ONBOARDED ), + 'requirements' => array( 'messages' ), + 'gateway' => Settings::PAY_LATER_TAB_ID, + ), + 'pay_later_shop_message_flex_color' => array( + 'title' => __( 'Shop Messaging Color', 'woocommerce-paypal-payments' ), + 'type' => 'select', + 'class' => array(), + 'input_class' => array( 'wc-enhanced-select' ), + 'default' => $default_messaging_flex_color, + 'desc_tip' => true, + 'description' => __( 'The color of the text. Only applicable, when the layout style Banner is used.', 'woocommerce-paypal-payments' ), + 'options' => array( + 'blue' => __( 'Blue', 'woocommerce-paypal-payments' ), + 'black' => __( 'Black', 'woocommerce-paypal-payments' ), + 'white' => __( 'White', 'woocommerce-paypal-payments' ), + 'white-no-border' => __( 'White no border', 'woocommerce-paypal-payments' ), + 'gray' => __( 'Gray', 'woocommerce-paypal-payments' ), + 'monochrome' => __( 'Monochrome', 'woocommerce-paypal-payments' ), + 'grayscale' => __( 'Grayscale', 'woocommerce-paypal-payments' ), + ), + 'screens' => array( State::STATE_ONBOARDED ), + 'requirements' => array( 'messages' ), + 'gateway' => Settings::PAY_LATER_TAB_ID, + ), + 'pay_later_shop_message_flex_ratio' => array( + 'title' => __( 'Shop Messaging Ratio', 'woocommerce-paypal-payments' ), + 'type' => 'select', + 'class' => array(), + 'input_class' => array( 'wc-enhanced-select' ), + 'default' => '8x1', + 'desc_tip' => true, + 'description' => __( 'The width/height ratio of the banner. Only applicable, when the layout style Banner is used.', 'woocommerce-paypal-payments' ), + 'options' => array( + '1x1' => __( '1x1', 'woocommerce-paypal-payments' ), + '1x4' => __( '1x4', 'woocommerce-paypal-payments' ), + '8x1' => __( '8x1', 'woocommerce-paypal-payments' ), + '20x1' => __( '20x1', 'woocommerce-paypal-payments' ), + ), + 'screens' => array( State::STATE_ONBOARDED ), + 'requirements' => array( 'messages' ), + 'gateway' => Settings::PAY_LATER_TAB_ID, + ), + 'pay_later_shop_message_preview' => array( + 'type' => 'ppcp-text', + 'text' => $render_preview_element( 'ppcpShopMessagePreview', 'message', $messaging_message ), + 'screens' => array( State::STATE_ONBOARDED ), + 'requirements' => array( 'messages' ), + 'gateway' => Settings::PAY_LATER_TAB_ID, + ), + + // Home. + 'pay_later_home_messaging_heading' => array( + 'heading' => __( 'Pay Later Messaging on the Home page', 'woocommerce-paypal-payments' ), + 'type' => 'ppcp-heading', + 'screens' => array( State::STATE_ONBOARDED ), + 'requirements' => array(), + 'gateway' => Settings::PAY_LATER_TAB_ID, + ), + 'pay_later_home_message_layout' => array( + 'title' => __( 'Home Messaging Layout', 'woocommerce-paypal-payments' ), + 'type' => 'select', + 'class' => array(), + 'input_class' => array( 'wc-enhanced-select' ), + 'default' => 'text', + 'desc_tip' => true, + 'description' => __( 'The layout of the message.', 'woocommerce-paypal-payments' ), + 'options' => array( + 'text' => __( 'Text', 'woocommerce-paypal-payments' ), + 'flex' => __( 'Banner', 'woocommerce-paypal-payments' ), + ), + 'screens' => array( State::STATE_ONBOARDED ), + 'requirements' => array( 'messages' ), + 'gateway' => Settings::PAY_LATER_TAB_ID, + ), + 'pay_later_home_message_logo' => array( + 'title' => __( 'Home Messaging Logo', 'woocommerce-paypal-payments' ), + 'type' => 'select', + 'class' => array(), + 'input_class' => array( 'wc-enhanced-select' ), + 'default' => 'inline', + 'desc_tip' => true, + 'description' => __( 'What logo the text message contains. Only applicable, when the layout style Text is used.', 'woocommerce-paypal-payments' ), + 'options' => array( + 'primary' => __( 'Primary', 'woocommerce-paypal-payments' ), + 'alternative' => __( 'Alternative', 'woocommerce-paypal-payments' ), + 'inline' => __( 'Inline', 'woocommerce-paypal-payments' ), + 'none' => __( 'None', 'woocommerce-paypal-payments' ), + ), + 'screens' => array( State::STATE_ONBOARDED ), + 'requirements' => array( 'messages' ), + 'gateway' => Settings::PAY_LATER_TAB_ID, + ), + 'pay_later_home_message_position' => array( + 'title' => __( 'Home Messaging Logo Position', 'woocommerce-paypal-payments' ), + 'type' => 'select', + 'class' => array(), + 'input_class' => array( 'wc-enhanced-select' ), + 'default' => 'left', + 'desc_tip' => true, + 'description' => __( 'The position of the logo. Only applicable, when the layout style Text is used.', 'woocommerce-paypal-payments' ), + 'options' => array( + 'left' => __( 'Left', 'woocommerce-paypal-payments' ), + 'right' => __( 'Right', 'woocommerce-paypal-payments' ), + 'top' => __( 'Top', 'woocommerce-paypal-payments' ), + ), + 'screens' => array( State::STATE_ONBOARDED ), + 'requirements' => array( 'messages' ), + 'gateway' => Settings::PAY_LATER_TAB_ID, + ), + 'pay_later_home_message_color' => array( + 'title' => __( 'Home Messaging Text Color', 'woocommerce-paypal-payments' ), + 'type' => 'select', + 'class' => array(), + 'input_class' => array( 'wc-enhanced-select' ), + 'default' => 'black', + 'desc_tip' => true, + 'description' => __( 'The color of the text. Only applicable, when the layout style Text is used.', 'woocommerce-paypal-payments' ), + 'options' => array( + 'black' => __( 'Black', 'woocommerce-paypal-payments' ), + 'white' => __( 'White', 'woocommerce-paypal-payments' ), + 'monochrome' => __( 'Monochrome', 'woocommerce-paypal-payments' ), + 'grayscale' => __( 'Grayscale', 'woocommerce-paypal-payments' ), + ), + 'screens' => array( State::STATE_ONBOARDED ), + 'requirements' => array( 'messages' ), + 'gateway' => Settings::PAY_LATER_TAB_ID, + ), + 'pay_later_home_message_flex_color' => array( + 'title' => __( 'Home Messaging Color', 'woocommerce-paypal-payments' ), + 'type' => 'select', + 'class' => array(), + 'input_class' => array( 'wc-enhanced-select' ), + 'default' => $default_messaging_flex_color, + 'desc_tip' => true, + 'description' => __( 'The color of the text. Only applicable, when the layout style Banner is used.', 'woocommerce-paypal-payments' ), + 'options' => array( + 'blue' => __( 'Blue', 'woocommerce-paypal-payments' ), + 'black' => __( 'Black', 'woocommerce-paypal-payments' ), + 'white' => __( 'White', 'woocommerce-paypal-payments' ), + 'white-no-border' => __( 'White no border', 'woocommerce-paypal-payments' ), + 'gray' => __( 'Gray', 'woocommerce-paypal-payments' ), + 'monochrome' => __( 'Monochrome', 'woocommerce-paypal-payments' ), + 'grayscale' => __( 'Grayscale', 'woocommerce-paypal-payments' ), + ), + 'screens' => array( State::STATE_ONBOARDED ), + 'requirements' => array( 'messages' ), + 'gateway' => Settings::PAY_LATER_TAB_ID, + ), + 'pay_later_home_message_flex_ratio' => array( + 'title' => __( 'Home Messaging Ratio', 'woocommerce-paypal-payments' ), + 'type' => 'select', + 'class' => array(), + 'input_class' => array( 'wc-enhanced-select' ), + 'default' => '8x1', + 'desc_tip' => true, + 'description' => __( 'The width/height ratio of the banner. Only applicable, when the layout style Banner is used.', 'woocommerce-paypal-payments' ), + 'options' => array( + '1x1' => __( '1x1', 'woocommerce-paypal-payments' ), + '1x4' => __( '1x4', 'woocommerce-paypal-payments' ), + '8x1' => __( '8x1', 'woocommerce-paypal-payments' ), + '20x1' => __( '20x1', 'woocommerce-paypal-payments' ), + ), + 'screens' => array( State::STATE_ONBOARDED ), + 'requirements' => array( 'messages' ), + 'gateway' => Settings::PAY_LATER_TAB_ID, + ), + 'pay_later_home_message_preview' => array( + 'type' => 'ppcp-text', + 'text' => $render_preview_element( 'ppcpHomeMessagePreview', 'message', $messaging_message ), + 'screens' => array( State::STATE_ONBOARDED ), + 'requirements' => array( 'messages' ), + 'gateway' => Settings::PAY_LATER_TAB_ID, + ), ); return array_merge( $fields, $pay_later_fields );