woocommerce/woocommerce-paypal-payments
2
0
Fork 0
mirror of https://github.com/woocommerce/woocommerce-paypal-payments.git synced 2025-09-04 08:47:23 +08:00
Code Issues Projects Packages Wiki Activity Actions 11

render messages via javascript

Browse source
This commit is contained in:
David Remer 2020-08-19 10:27:53 +03:00
parent 03e34328f9
commit 1011d4daf8
5 changed files with 66 additions and 36 deletions
Download patch file Download diff file Expand all files Collapse all files

7
modules.local/ppcp-button/resources/js/button.js
View file

@ -6,11 +6,13 @@ import Renderer from './modules/Renderer/Renderer';
import ErrorHandler from './modules/ErrorHandler';
import CreditCardRenderer from "./modules/Renderer/CreditCardRenderer";
import dataClientIdAttributeHandler from "./modules/DataClientIdAttributeHandler";
import MessageRenderer from "./modules/Renderer/MessageRenderer";
const bootstrap = () => {
const errorHandler = new ErrorHandler(PayPalCommerceGateway.labels.error.generic);
const creditCardRenderer = new CreditCardRenderer(PayPalCommerceGateway, errorHandler);
const renderer = new Renderer(creditCardRenderer, PayPalCommerceGateway);
const messageRenderer = new MessageRenderer(PayPalCommerceGateway.messages);
const context = PayPalCommerceGateway.context;
if (context === 'mini-cart' || context === 'product') {
const miniCartBootstrap = new MiniCartBootstap(
@ -42,11 +44,14 @@ const bootstrap = () => {
if (context === 'checkout') {
const checkoutBootstap = new CheckoutBootstap(
PayPalCommerceGateway,
renderer
renderer,
messageRenderer
);
checkoutBootstap.init();
}
messageRenderer.render();
};
document.addEventListener(
'DOMContentLoaded',

7
modules.local/ppcp-button/resources/js/modules/ContextBootstrap/CheckoutBootstap.js
View file

@ -2,9 +2,10 @@ import ErrorHandler from '../ErrorHandler';
import CheckoutActionHandler from '../ActionHandler/CheckoutActionHandler';
class CheckoutBootstap {
constructor(gateway, renderer) {
constructor(gateway, renderer, messages) {
this.gateway = gateway;
this.renderer = renderer;
this.messages = messages
}
init() {
@ -44,6 +45,7 @@ class CheckoutBootstap {
this.gateway.hosted_fields.wrapper,
actionHandler.configuration(),
);
this.messages.render();
}
switchBetweenPayPalandOrderButton() {
@ -52,6 +54,7 @@ class CheckoutBootstap {
if (currentPaymentMethod !== 'ppcp-gateway' && currentPaymentMethod !== 'ppcp-credit-card-gateway') {
this.renderer.hideButtons(this.gateway.button.wrapper);
this.renderer.hideButtons(this.gateway.messages.wrapper);
this.renderer.hideButtons(this.gateway.hosted_fields.wrapper);
jQuery('#place_order').show();
}
@ -59,10 +62,12 @@ class CheckoutBootstap {
jQuery('#place_order').hide();
if (currentPaymentMethod === 'ppcp-gateway') {
this.renderer.showButtons(this.gateway.button.wrapper);
this.renderer.showButtons(this.gateway.messages.wrapper);
this.renderer.hideButtons(this.gateway.hosted_fields.wrapper);
}
if (currentPaymentMethod === 'ppcp-credit-card-gateway') {
this.renderer.hideButtons(this.gateway.button.wrapper);
this.renderer.hideButtons(this.gateway.messages.wrapper);
this.renderer.showButtons(this.gateway.hosted_fields.wrapper);
}
}

22
modules.local/ppcp-button/resources/js/modules/Renderer/MessageRenderer.js Normal file
View file

@ -0,0 +1,22 @@
class MessageRenderer {
constructor(config) {
this.config = config;
}
render() {
if (typeof paypal.Messages === 'undefined' || typeof this.config.wrapper === 'undefined' ) {
return;
}
if (! document.querySelector(this.config.wrapper)) {
return;
}
paypal.Messages({
amount: this.config.amount,
placement: this.config.placement,
style: this.config.style
}).render(this.config.wrapper);
}
}
export default MessageRenderer;

3
modules.local/ppcp-button/resources/js/modules/Renderer/Renderer.js
View file

@ -16,10 +16,11 @@ class Renderer {
}
const style = wrapper === this.defaultConfig.button.wrapper ? this.defaultConfig.button.style : this.defaultConfig.button.mini_cart_style;
paypal.Buttons({
const result = paypal.Buttons({
style,
...contextConfig,
}).render(wrapper);
console.log(result);
}
isAlreadyRendered(wrapper) {