This commit is contained in:
David Remer 2020-04-06 11:16:18 +03:00
parent 7fd57b9393
commit 005a55c213
62 changed files with 905 additions and 751 deletions

View file

@ -18,34 +18,30 @@ document.addEventListener(
if (context === 'product' && ! 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
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,
renderer.showButtons.bind(renderer),
renderer.hideButtons.bind(renderer),
document.querySelector('form.cart'),
errorHandler
);
let configurator = null;
if (context === 'product') {
configurator = new SingleProductConfig(
PayPalCommerceGateway,
updateCart,
renderer.showButtons.bind(renderer),
renderer.hideButtons.bind(renderer),
document.querySelector('form.cart'),
errorHandler
);
}
if (! configurator) {
console.error('No context for button found.');
return;
}
renderer.render(configurator.configuration());
}
if (! configurator) {
console.error('No context for button found.');
return;
}
renderer.render(configurator.configuration());
}
);

View file

@ -4,14 +4,16 @@
*/
class ButtonsToggleListener {
constructor(element, showCallback, hideCallback) {
constructor(element, showCallback, hideCallback)
{
this.element = element;
this.showCallback = showCallback;
this.hideCallback = hideCallback;
this.observer = null;
}
init() {
init()
{
const config = { attributes : true };
const callback = () => {
if (this.element.classList.contains('disabled')) {
@ -24,7 +26,8 @@ class ButtonsToggleListener {
this.observer.observe(this.element, config);
}
disconnect() {
disconnect()
{
this.observer.disconnect();
}
}

View file

@ -1,21 +1,25 @@
class ErrorHandler {
constructor() {
constructor()
{
this.wrapper = document.querySelector('.woocommerce-notices-wrapper');
}
message(text) {
message(text)
{
this.wrapper.classList.add('woocommerce-error');
this.wrapper.innerText = this.sanitize(text);
}
sanitize(text) {
sanitize(text)
{
const textarea = document.createElement('textarea');
textarea.innerHTML = text;
return textarea.value;
}
clear() {
clear()
{
if (! this.wrapper.classList.contains('woocommerce-error')) {
return;
}

View file

@ -1,10 +1,12 @@
class Renderer {
constructor(config) {
constructor(config)
{
this.config = config;
}
render(buttonConfig) {
render(buttonConfig)
{
const script = document.createElement('script');
@ -20,18 +22,21 @@ class Renderer {
this.renderButtons(buttonConfig);
}
renderButtons(buttonConfig) {
renderButtons(buttonConfig)
{
paypal.Buttons(
buttonConfig
).render(this.config.wrapper);
}
hideButtons() {
hideButtons()
{
document.querySelector(this.config.wrapper).style.display = 'none';
}
showButtons() {
showButtons()
{
document.querySelector(this.config.wrapper).style.display = 'block';
}
}

View file

@ -18,7 +18,8 @@ class SingleProductConfig {
this.errorHandler = errorHandler;
}
configuration() {
configuration()
{
if ( this.hasVariations() ) {
const observer = new ButtonsToggleListener(
@ -40,7 +41,8 @@ class SingleProductConfig {
}
}
createOrder() {
createOrder()
{
const createOrder = (data, actions) => {
this.errorHandler.clear();
const product = document.querySelector('[name="add-to-cart"]').value;
@ -54,9 +56,9 @@ class SingleProductConfig {
nonce:this.config.ajax.create_order.nonce,
purchase_units
})
}).then(function(res) {
}).then(function (res) {
return res.json();
}).then(function(data) {
}).then(function (data) {
if (! data.success) {
//Todo: Error handling
return;
@ -71,14 +73,15 @@ class SingleProductConfig {
return createOrder;
}
variations() {
variations()
{
if (! this.hasVariations()) {
return null;
}
const attributes = [...this.formElement.querySelectorAll("[name^='attribute_']")].map(
(element) => {
return {
return {
value:element.value,
name:element.name
}
@ -87,7 +90,8 @@ class SingleProductConfig {
return attributes;
}
hasVariations() {
hasVariations()
{
return this.formElement.classList.contains('variations_form');
}
}

View file

@ -1,12 +1,14 @@
class UpdateCart {
constructor(endpoint, nonce) {
constructor(endpoint, nonce)
{
this.endpoint = endpoint;
this.nonce = nonce;
}
update(onResolve, product, qty, variations) {
return new Promise( (resolve, reject) => {
update(onResolve, product, qty, variations)
{
return new Promise((resolve, reject) => {
fetch(
this.endpoint,
{
@ -20,18 +22,17 @@ class UpdateCart {
}
).then(
(result) => {
return result.json();
return result.json();
}
).then((result) => {
if (! result.success) {
reject(result.data);
return;
}
).then( (result) => {
if (! result.success) {
reject(result.data);
return;
}
const resolved = onResolve(result.data);
resolve(resolved);
}
)
})
});
}
}