Simplify message wrapper rendering and add shop, home locations

modules/ppcp-button/resources/js/modules/ContextBootstrap/CheckoutBootstap.js

@@ -156,8 +156,15 @@ class CheckoutBootstap {
     }
 
     shouldShowMessages() {
-        return getCurrentPaymentMethod() === PaymentMethods.PAYPAL
+        // hide when another method selected only if messages are near buttons
-            && !PayPalCommerceGateway.is_free_trial_cart;
+        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() {

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(),
+			$hook['name'],
-			function() use ( $not_enabled_on_cart ) {
+			array( $this, 'message_renderer' ),
-				if ( ! is_cart() || $not_enabled_on_cart ) {
+			$hook['priority']
-					return;
-				}
-				$this->message_renderer();
-			},
-			19
 		);
 
-		$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 ? $this->location() : 'general';
-		$location             = $styling_per_location ? $per_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).
 	 *

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);

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) => {

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' ) );

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 );