show buttons on mini-cart and cart

This commit is contained in:
David Remer 2020-04-08 12:33:34 +03:00
parent cc732840b1
commit 41f86426d8
6 changed files with 125 additions and 39 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View file

@ -2,6 +2,7 @@ import Renderer from './modules/Renderer';
import SingleProductConfig from './modules/SingleProductConfig';
import UpdateCart from './modules/UpdateCart';
import ErrorHandler from './modules/ErrorHandler';
import CartConfig from "./modules/CartConfig";
document.addEventListener(
'DOMContentLoaded',
@ -10,25 +11,45 @@ document.addEventListener(
console.error('PayPal button could not be configured.');
return;
}
if (! document.querySelector(PayPalCommerceGateway.button.wrapper)) {
console.error('No wrapper for PayPal button found.');
return;
}
const context = PayPalCommerceGateway.context;
if (context === 'product' && ! document.querySelector('form.cart') ) {
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())
} );
// Configure context buttons
if (! document.querySelector(PayPalCommerceGateway.button.wrapper)) {
return;
}
let configurator = null;
if (context === 'product') {
if (! document.querySelector('form.cart')) {
return;
}
const errorHandler = new ErrorHandler();
const renderer = new Renderer({
url: PayPalCommerceGateway.button.url,
wrapper:PayPalCommerceGateway.button.wrapper
});
const updateCart = new UpdateCart(
PayPalCommerceGateway.ajax.change_cart.endpoint,
PayPalCommerceGateway.ajax.change_cart.nonce
);
let configurator = null;
if (context === 'product') {
configurator = new SingleProductConfig(
PayPalCommerceGateway,
updateCart,
@ -38,10 +59,18 @@ document.addEventListener(
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

@ -0,0 +1,42 @@
class CartConfig {
constructor(config, errorHandler) {
this.config = config;
this.errorHandler = errorHandler;
}
configuration() {
const createOrder = (data, actions) => {
return fetch(this.config.ajax.create_order.endpoint, {
method: 'POST',
body: JSON.stringify({
nonce: this.config.ajax.create_order.nonce,
purchase_units:[]
})
}).then(function (res) {
return res.json();
}).then(function (data) {
if (!data.success) {
//Todo: Error handling
return;
}
return data.data.id;
});
}
const onApprove = (data, actions) => {
return actions.redirect(this.config.redirect);
}
return {
createOrder,
onApprove,
onError: (error) => {
this.errorHandler.message(error);
}
}
}
}
export default CartConfig;

View file

@ -1,8 +1,9 @@
class Renderer {
constructor(config)
constructor(url, wrapper)
{
this.config = config;
this.url = url;
this.wrapper = wrapper;
}
render(buttonConfig)
@ -11,7 +12,7 @@ class Renderer {
const script = document.createElement('script');
if (typeof paypal !== 'object') {
script.setAttribute('src', this.config.url);
script.setAttribute('src', this.url);
script.addEventListener('load', (event) => {
this.renderButtons(buttonConfig);
})
@ -27,17 +28,17 @@ class Renderer {
paypal.Buttons(
buttonConfig
).render(this.config.wrapper);
).render(this.wrapper);
}
hideButtons()
{
document.querySelector(this.config.wrapper).style.display = 'none';
document.querySelector(this.wrapper).style.display = 'none';
}
showButtons()
{
document.querySelector(this.config.wrapper).style.display = 'block';
document.querySelector(this.wrapper).style.display = 'block';
}
}

View file

@ -25,13 +25,19 @@ class SmartButton
$renderer = function () {
echo '<div id="ppc-button"></div>';
};
if (is_cart()) {
add_action(
'woocommerce_after_cart_totals',
$renderer,
20
);
}
if (is_product()) {
add_action(
'woocommerce_single_product_summary',
$renderer,
31
);
return true;
}
if (is_checkout()) {
add_action(
@ -39,9 +45,16 @@ class SmartButton
$renderer,
31
);
return true;
}
return false;
add_action(
'woocommerce_widget_shopping_cart_buttons',
function() {
echo '<span id="ppc-button-minicart"></span>';
},
30
);
return true;
}
public function enqueue() : bool
@ -72,6 +85,7 @@ class SmartButton
],
'button' => [
'wrapper' => '#ppc-button',
'mini_cart_wrapper' => '#ppc-button-minicart',
'url' =>$smartButtonUrl,
],
];