2020-04-30 15:28:48 +03:00
|
|
|
import MiniCartBootstap from './modules/ContextBootstrap/MiniCartBootstap';
|
|
|
|
import SingleProductBootstap from './modules/ContextBootstrap/SingleProductBootstap';
|
|
|
|
import CartBootstrap from './modules/ContextBootstrap/CartBootstap';
|
|
|
|
import CheckoutBootstap from './modules/ContextBootstrap/CheckoutBootstap';
|
2020-09-30 14:24:31 +03:00
|
|
|
import PayNowBootstrap from "./modules/ContextBootstrap/PayNowBootstrap";
|
2020-04-30 15:28:48 +03:00
|
|
|
import Renderer from './modules/Renderer/Renderer';
|
2020-07-22 14:12:49 +03:00
|
|
|
import ErrorHandler from './modules/ErrorHandler';
|
2020-04-30 15:28:48 +03:00
|
|
|
import CreditCardRenderer from "./modules/Renderer/CreditCardRenderer";
|
2020-08-13 14:20:47 +03:00
|
|
|
import dataClientIdAttributeHandler from "./modules/DataClientIdAttributeHandler";
|
2020-08-19 10:27:53 +03:00
|
|
|
import MessageRenderer from "./modules/Renderer/MessageRenderer";
|
2020-09-28 14:05:02 +03:00
|
|
|
import Spinner from "./modules/Helper/Spinner";
|
2022-03-15 09:24:43 +02:00
|
|
|
import {
|
|
|
|
getCurrentPaymentMethod,
|
|
|
|
ORDER_BUTTON_SELECTOR,
|
|
|
|
PaymentMethods
|
|
|
|
} from "./modules/Helper/CheckoutMethodState";
|
2022-03-17 09:48:00 +02:00
|
|
|
import {hide, setVisible} from "./modules/Helper/Hiding";
|
2022-03-18 09:24:55 +02:00
|
|
|
import {isChangePaymentPage} from "./modules/Helper/Subscriptions";
|
2022-03-17 09:48:00 +02:00
|
|
|
|
2022-03-17 15:59:19 +02:00
|
|
|
const buttonsSpinner = new Spinner('.ppc-button-wrapper');
|
2020-04-02 08:38:00 +03:00
|
|
|
|
2020-04-08 18:50:29 +03:00
|
|
|
const bootstrap = () => {
|
2020-07-28 08:05:18 +03:00
|
|
|
const errorHandler = new ErrorHandler(PayPalCommerceGateway.labels.error.generic);
|
2020-09-28 14:05:02 +03:00
|
|
|
const spinner = new Spinner();
|
|
|
|
const creditCardRenderer = new CreditCardRenderer(PayPalCommerceGateway, errorHandler, spinner);
|
2021-12-09 17:29:48 +02:00
|
|
|
const onSmartButtonClick = data => {
|
|
|
|
window.ppcpFundingSource = data.fundingSource;
|
|
|
|
};
|
2022-03-17 09:48:00 +02:00
|
|
|
const onSmartButtonsInit = () => {
|
|
|
|
buttonsSpinner.unblock();
|
|
|
|
};
|
|
|
|
const renderer = new Renderer(creditCardRenderer, PayPalCommerceGateway, onSmartButtonClick, onSmartButtonsInit);
|
2020-08-19 10:27:53 +03:00
|
|
|
const messageRenderer = new MessageRenderer(PayPalCommerceGateway.messages);
|
2020-04-09 12:56:05 +03:00
|
|
|
const context = PayPalCommerceGateway.context;
|
2020-04-09 14:55:04 +03:00
|
|
|
if (context === 'mini-cart' || context === 'product') {
|
2021-07-13 09:43:30 +02:00
|
|
|
if (PayPalCommerceGateway.mini_cart_buttons_enabled === '1') {
|
2021-07-12 17:16:26 +02:00
|
|
|
const miniCartBootstrap = new MiniCartBootstap(
|
|
|
|
PayPalCommerceGateway,
|
|
|
|
renderer
|
|
|
|
);
|
2020-04-08 15:43:31 +03:00
|
|
|
|
2021-07-12 17:16:26 +02:00
|
|
|
miniCartBootstrap.init();
|
|
|
|
}
|
2020-04-08 13:33:12 +03:00
|
|
|
}
|
2020-04-08 18:50:29 +03:00
|
|
|
|
2021-07-12 17:16:26 +02:00
|
|
|
if (context === 'product' && PayPalCommerceGateway.single_product_buttons_enabled === '1') {
|
2020-04-10 10:34:49 +03:00
|
|
|
const singleProductBootstrap = new SingleProductBootstap(
|
2020-04-09 12:56:05 +03:00
|
|
|
PayPalCommerceGateway,
|
|
|
|
renderer,
|
2020-08-19 13:40:29 +03:00
|
|
|
messageRenderer,
|
2020-04-09 12:56:05 +03:00
|
|
|
);
|
2020-04-08 18:50:29 +03:00
|
|
|
|
2020-04-10 10:34:49 +03:00
|
|
|
singleProductBootstrap.init();
|
2020-04-08 13:33:12 +03:00
|
|
|
}
|
2020-04-08 18:50:29 +03:00
|
|
|
|
2020-04-08 13:33:12 +03:00
|
|
|
if (context === 'cart') {
|
2020-04-09 12:56:05 +03:00
|
|
|
const cartBootstrap = new CartBootstrap(
|
|
|
|
PayPalCommerceGateway,
|
|
|
|
renderer,
|
|
|
|
);
|
2020-04-08 12:33:34 +03:00
|
|
|
|
2020-04-08 18:50:29 +03:00
|
|
|
cartBootstrap.init();
|
2020-04-08 13:33:12 +03:00
|
|
|
}
|
2020-04-08 12:33:34 +03:00
|
|
|
|
2020-04-08 18:50:29 +03:00
|
|
|
if (context === 'checkout') {
|
2020-04-09 12:56:05 +03:00
|
|
|
const checkoutBootstap = new CheckoutBootstap(
|
|
|
|
PayPalCommerceGateway,
|
2020-08-19 10:27:53 +03:00
|
|
|
renderer,
|
2020-09-28 14:05:02 +03:00
|
|
|
messageRenderer,
|
|
|
|
spinner
|
2020-04-09 12:56:05 +03:00
|
|
|
);
|
2020-04-08 18:50:29 +03:00
|
|
|
|
|
|
|
checkoutBootstap.init();
|
|
|
|
}
|
2020-08-19 10:27:53 +03:00
|
|
|
|
2020-09-30 14:24:31 +03:00
|
|
|
if (context === 'pay-now' ) {
|
|
|
|
const payNowBootstrap = new PayNowBootstrap(
|
|
|
|
PayPalCommerceGateway,
|
|
|
|
renderer,
|
2021-01-05 17:12:26 +01:00
|
|
|
messageRenderer,
|
|
|
|
spinner
|
2020-09-30 14:24:31 +03:00
|
|
|
);
|
|
|
|
payNowBootstrap.init();
|
|
|
|
}
|
|
|
|
|
2020-08-19 11:50:02 +03:00
|
|
|
if (context !== 'checkout') {
|
|
|
|
messageRenderer.render();
|
|
|
|
}
|
2020-04-08 18:50:29 +03:00
|
|
|
};
|
2020-04-08 13:33:12 +03:00
|
|
|
document.addEventListener(
|
|
|
|
'DOMContentLoaded',
|
|
|
|
() => {
|
2020-04-08 18:50:29 +03:00
|
|
|
if (!typeof (PayPalCommerceGateway)) {
|
2020-04-08 13:33:12 +03:00
|
|
|
console.error('PayPal button could not be configured.');
|
2020-04-02 08:38:00 +03:00
|
|
|
return;
|
|
|
|
}
|
2020-04-08 18:50:29 +03:00
|
|
|
|
2022-01-17 14:35:25 +01:00
|
|
|
if (
|
|
|
|
PayPalCommerceGateway.context !== 'checkout'
|
|
|
|
&& PayPalCommerceGateway.data_client_id.user === 0
|
|
|
|
&& PayPalCommerceGateway.data_client_id.has_subscriptions
|
|
|
|
) {
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
2022-03-15 09:24:43 +02:00
|
|
|
// Sometimes PayPal script takes long time to load,
|
|
|
|
// so we additionally hide the standard order button here to avoid failed orders.
|
|
|
|
// Normally it is hidden later after the script load.
|
|
|
|
const hideOrderButtonIfPpcpGateway = () => {
|
2022-03-17 16:00:55 +02:00
|
|
|
// only in checkout and pay now page, otherwise it may break things (e.g. payment via product page),
|
2022-03-17 10:31:18 +02:00
|
|
|
// and also the loading spinner may look weird on other pages
|
2022-03-18 09:24:55 +02:00
|
|
|
if (
|
|
|
|
!['checkout', 'pay-now'].includes(PayPalCommerceGateway.context)
|
|
|
|
|| isChangePaymentPage()
|
|
|
|
) {
|
2022-03-17 10:31:18 +02:00
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
2022-03-15 09:24:43 +02:00
|
|
|
const currentPaymentMethod = getCurrentPaymentMethod();
|
2022-03-17 09:48:00 +02:00
|
|
|
const isPaypal = currentPaymentMethod === PaymentMethods.PAYPAL;
|
|
|
|
|
|
|
|
setVisible(ORDER_BUTTON_SELECTOR, !isPaypal, true);
|
|
|
|
|
2022-03-17 10:31:18 +02:00
|
|
|
if (isPaypal) {
|
|
|
|
// stopped after the first rendering of the buttons, in onInit
|
|
|
|
buttonsSpinner.block();
|
|
|
|
} else {
|
|
|
|
buttonsSpinner.unblock();
|
2022-03-17 09:48:00 +02:00
|
|
|
}
|
2022-03-15 09:24:43 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
let bootstrapped = false;
|
|
|
|
|
|
|
|
hideOrderButtonIfPpcpGateway();
|
|
|
|
|
|
|
|
jQuery(document.body).on('updated_checkout payment_method_selected', () => {
|
|
|
|
if (bootstrapped) {
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
|
|
|
hideOrderButtonIfPpcpGateway();
|
|
|
|
});
|
|
|
|
|
2022-01-17 14:35:25 +01:00
|
|
|
const script = document.createElement('script');
|
2020-08-13 14:20:47 +03:00
|
|
|
script.addEventListener('load', (event) => {
|
2022-03-15 09:24:43 +02:00
|
|
|
bootstrapped = true;
|
|
|
|
|
2020-08-13 14:20:47 +03:00
|
|
|
bootstrap();
|
|
|
|
});
|
2020-04-08 13:33:12 +03:00
|
|
|
script.setAttribute('src', PayPalCommerceGateway.button.url);
|
2020-04-30 15:28:48 +03:00
|
|
|
Object.entries(PayPalCommerceGateway.script_attributes).forEach(
|
|
|
|
(keyValue) => {
|
|
|
|
script.setAttribute(keyValue[0], keyValue[1]);
|
|
|
|
}
|
|
|
|
);
|
2020-08-13 14:20:47 +03:00
|
|
|
|
2021-04-23 10:33:28 +02:00
|
|
|
if (PayPalCommerceGateway.data_client_id.set_attribute) {
|
2020-08-13 14:20:47 +03:00
|
|
|
dataClientIdAttributeHandler(script, PayPalCommerceGateway.data_client_id);
|
|
|
|
return;
|
|
|
|
}
|
2020-04-08 13:33:12 +03:00
|
|
|
|
2020-04-08 18:50:29 +03:00
|
|
|
document.body.append(script);
|
|
|
|
},
|
2021-01-05 17:12:26 +01:00
|
|
|
);
|