execute js bootstrap after paypal.com script has been loaded.

This commit is contained in:
David Remer 2020-04-08 13:33:12 +03:00
parent 41f86426d8
commit 6d93f6316a
4 changed files with 74 additions and 79 deletions

View file

@ -4,73 +4,86 @@ import UpdateCart from './modules/UpdateCart';
import ErrorHandler from './modules/ErrorHandler';
import CartConfig from "./modules/CartConfig";
const bootstrap = ()=> {
const context = PayPalCommerceGateway.context;
const errorHandler = new ErrorHandler();
const defaultConfigurator = new CartConfig(
PayPalCommerceGateway,
errorHandler
);
// Configure mini cart buttons
if (document.querySelector(PayPalCommerceGateway.button.mini_cart_wrapper)) {
const renderer = new Renderer(
PayPalCommerceGateway.button.mini_cart_wrapper
);
renderer.render(defaultConfigurator.configuration())
}
jQuery( document.body ).on( 'wc_fragments_loaded wc_fragments_refreshed', () => {
if (! document.querySelector(PayPalCommerceGateway.button.mini_cart_wrapper)) {
return;
}
const renderer = new Renderer(
PayPalCommerceGateway.button.mini_cart_wrapper
);
renderer.render(defaultConfigurator.configuration())
} );
// Configure context buttons
if (! document.querySelector(PayPalCommerceGateway.button.wrapper)) {
return;
}
const renderer = new Renderer(
PayPalCommerceGateway.button.wrapper
);
let configurator = null;
if (context === 'product') {
if (! document.querySelector('form.cart')) {
return;
}
const updateCart = new UpdateCart(
PayPalCommerceGateway.ajax.change_cart.endpoint,
PayPalCommerceGateway.ajax.change_cart.nonce
);
configurator = new SingleProductConfig(
PayPalCommerceGateway,
updateCart,
renderer.showButtons.bind(renderer),
renderer.hideButtons.bind(renderer),
document.querySelector('form.cart'),
errorHandler
);
}
if (context === 'cart') {
configurator = defaultConfigurator;
jQuery( document.body ).on( 'updated_cart_totals updated_checkout', () => {
renderer.render(configurator.configuration())
});
}
if (! configurator) {
console.error('No context for button found.');
return;
}
renderer.render(configurator.configuration());
}
document.addEventListener(
'DOMContentLoaded',
() => {
if (! typeof(PayPalCommerceGateway)) {
console.error('PayPal button could not be configured.');
return;
}
const context = PayPalCommerceGateway.context;
const errorHandler = new ErrorHandler();
const defaultConfigurator = new CartConfig(
PayPalCommerceGateway,
errorHandler
);
// Configure mini cart buttons
if (document.querySelector(PayPalCommerceGateway.button.mini_cart_wrapper)) {
const renderer = new Renderer(
PayPalCommerceGateway.button.url,
PayPalCommerceGateway.button.mini_cart_wrapper
);
renderer.render(defaultConfigurator.configuration())
}
jQuery( document.body ).on( 'wc_fragments_loaded wc_fragments_refreshed', () => {
if (! document.querySelector(PayPalCommerceGateway.button.mini_cart_wrapper)) {
return;
}
const renderer = new Renderer(
PayPalCommerceGateway.button.url,
PayPalCommerceGateway.button.mini_cart_wrapper
);
renderer.render(defaultConfigurator.configuration())
} );
const script = document.createElement('script');
script.setAttribute('src', PayPalCommerceGateway.button.url);
script.addEventListener('load', (event) => {
bootstrap();
})
document.body.append(script);
// Configure context buttons
if (! document.querySelector(PayPalCommerceGateway.button.wrapper)) {
return;
}
let configurator = null;
if (context === 'product') {
if (! document.querySelector('form.cart')) {
return;
}
const updateCart = new UpdateCart(
PayPalCommerceGateway.ajax.change_cart.endpoint,
PayPalCommerceGateway.ajax.change_cart.nonce
);
configurator = new SingleProductConfig(
PayPalCommerceGateway,
updateCart,
renderer.showButtons.bind(renderer),
renderer.hideButtons.bind(renderer),
document.querySelector('form.cart'),
errorHandler
);
}
if (context === 'cart') {
configurator = defaultConfigurator;
}
if (! configurator) {
console.error('No context for button found.');
return;
}
const renderer = new Renderer(
PayPalCommerceGateway.button.url,
PayPalCommerceGateway.button.wrapper
);
renderer.render(configurator.configuration());
}
);

View file

@ -1,29 +1,11 @@
class Renderer {
constructor(url, wrapper)
constructor(wrapper)
{
this.url = url;
this.wrapper = wrapper;
}
render(buttonConfig)
{
const script = document.createElement('script');
if (typeof paypal !== 'object') {
script.setAttribute('src', this.url);
script.addEventListener('load', (event) => {
this.renderButtons(buttonConfig);
})
document.body.append(script);
return;
}
this.renderButtons(buttonConfig);
}
renderButtons(buttonConfig)
{
paypal.Buttons(