Merge pull request #1897 from woocommerce/PCP-1486-paylater-block

Add Pay Later Messaging block
This commit is contained in:
Emili Castells 2024-01-05 15:04:01 +01:00 committed by GitHub
commit 02722a3c97
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
31 changed files with 3064 additions and 65 deletions

View file

@ -1,13 +1,20 @@
import {setVisible} from "../Helper/Hiding";
import MessageRenderer from "../Renderer/MessageRenderer";
class MessagesBootstrap {
constructor(gateway, messageRenderer) {
this.gateway = gateway;
this.renderer = messageRenderer;
this.renderers = [];
this.lastAmount = this.gateway.messages.amount;
if (messageRenderer) {
this.renderers.push(messageRenderer);
}
}
init() {
if (this.gateway.messages?.block?.enabled) {
this.discoverBlocks();
}
jQuery(document.body).on('ppcp_cart_rendered ppcp_checkout_rendered', () => {
this.render();
});
@ -16,7 +23,7 @@ class MessagesBootstrap {
this.render();
});
jQuery(document.body).on('ppcp_cart_total_updated ppcp_checkout_total_updated ppcp_product_total_updated', (e, amount) => {
jQuery(document.body).on('ppcp_cart_total_updated ppcp_checkout_total_updated ppcp_product_total_updated ppcp_block_cart_total_updated', (e, amount) => {
if (this.lastAmount !== amount) {
this.lastAmount = amount;
@ -27,28 +34,40 @@ class MessagesBootstrap {
this.render();
}
shouldShow() {
discoverBlocks() {
Array.from(document.querySelectorAll('.ppcp-paylater-message-block')).forEach(blockElement => {
const config = {wrapper: '#' + blockElement.id};
if (!blockElement.getAttribute('data-pp-placement')) {
config.placement = this.gateway.messages.placement;
}
this.renderers.push(new MessageRenderer(config));
});
}
shouldShow(renderer) {
if (this.gateway.messages.is_hidden === true) {
return false;
}
const eventData = {result: true}
jQuery(document.body).trigger('ppcp_should_show_messages', [eventData]);
jQuery(document.body).trigger('ppcp_should_show_messages', [eventData, renderer.config.wrapper]);
return eventData.result;
}
shouldRender() {
return this.shouldShow() && this.renderer.shouldRender();
}
render() {
setVisible(this.gateway.messages.wrapper, this.shouldShow());
this.renderers.forEach(renderer => {
const shouldShow = this.shouldShow(renderer);
setVisible(renderer.config.wrapper, shouldShow);
if (!shouldShow) {
return;
}
if (!this.shouldRender()) {
return;
}
if (!renderer.shouldRender()) {
return;
}
this.renderer.renderWithAmount(this.lastAmount);
renderer.renderWithAmount(this.lastAmount);
});
}
}

View file

@ -56,10 +56,12 @@ export const loadPaypalScript = (config, onLoaded, onError = null) => {
// Build the PayPal script options.
let scriptOptions = keysToCamelCase(config.url_params);
scriptOptions = merge(scriptOptions, config.script_attributes);
if (config.script_attributes) {
scriptOptions = merge(scriptOptions, config.script_attributes);
}
// Load PayPal script for special case with data-client-token
if (config.data_client_id.set_attribute) {
if (config.data_client_id?.set_attribute) {
dataClientIdAttributeHandler(scriptOptions, config.data_client_id, callback, errorCallback);
return;
}

View file

@ -15,9 +15,13 @@ class MessageRenderer {
const options = {
amount,
placement: this.config.placement,
style: this.config.style
};
if (this.config.placement) {
options.placement = this.config.placement;
}
if (this.config.style) {
options.style = this.config.style;
}
// sometimes the element is destroyed while the options stay the same
if (document.querySelector(this.config.wrapper).getAttribute('data-render-number') !== this.currentNumber.toString()) {