mirror of
https://github.com/woocommerce/woocommerce-paypal-payments.git
synced 2025-09-06 13:44:42 +08:00
Merge pull request #141 from woocommerce/PCP-113-fix-pay-later-messaging-options
Fix pay later messaging options
This commit is contained in:
commit
6d34c53f58
1 changed files with 285 additions and 250 deletions
|
@ -1,4 +1,7 @@
|
|||
const groupToggle = (selector, group) => {
|
||||
document.addEventListener(
|
||||
'DOMContentLoaded',
|
||||
() => {
|
||||
const groupToggle = (selector, group) => {
|
||||
const toggleElement = document.querySelector(selector);
|
||||
if (! toggleElement) {
|
||||
return;
|
||||
|
@ -22,11 +25,26 @@ const groupToggle = (selector, group) => {
|
|||
group.forEach( (elementToShow) => {
|
||||
document.querySelector(elementToShow).style.display = 'table-row';
|
||||
})
|
||||
|
||||
if('ppcp-message_enabled' === event.target.getAttribute('id')){
|
||||
updateCheckoutMessageFields();
|
||||
return;
|
||||
}
|
||||
|
||||
if('ppcp-message_product_enabled' === event.target.getAttribute('id')){
|
||||
updateProductMessageFields();
|
||||
return;
|
||||
}
|
||||
|
||||
if('ppcp-message_cart_enabled' === event.target.getAttribute('id')){
|
||||
updateCartMessageFields();
|
||||
}
|
||||
|
||||
}
|
||||
);
|
||||
};
|
||||
};
|
||||
|
||||
const groupToggleSelect = (selector, group) => {
|
||||
const groupToggleSelect = (selector, group) => {
|
||||
const toggleElement = document.querySelector(selector);
|
||||
if (! toggleElement) {
|
||||
return;
|
||||
|
@ -58,9 +76,94 @@ const groupToggleSelect = (selector, group) => {
|
|||
})
|
||||
}
|
||||
);
|
||||
};
|
||||
};
|
||||
|
||||
const disableOptions = (sourceSelector, targetSelector) => {
|
||||
const updateCheckoutMessageFields = () => {
|
||||
groupToggleSelect(
|
||||
'#ppcp-message_layout',
|
||||
[
|
||||
{
|
||||
value:'text',
|
||||
selector:'#field-message_logo'
|
||||
},
|
||||
{
|
||||
value:'text',
|
||||
selector:'#field-message_position'
|
||||
},
|
||||
{
|
||||
value:'text',
|
||||
selector:'#field-message_color'
|
||||
},
|
||||
{
|
||||
value:'flex',
|
||||
selector:'#field-message_flex_ratio'
|
||||
},
|
||||
{
|
||||
value:'flex',
|
||||
selector:'#field-message_flex_color'
|
||||
}
|
||||
]
|
||||
);
|
||||
}
|
||||
|
||||
const updateProductMessageFields = () => {
|
||||
groupToggleSelect(
|
||||
'#ppcp-message_product_layout',
|
||||
[
|
||||
{
|
||||
value:'text',
|
||||
selector:'#field-message_product_logo'
|
||||
},
|
||||
{
|
||||
value:'text',
|
||||
selector:'#field-message_product_position'
|
||||
},
|
||||
{
|
||||
value:'text',
|
||||
selector:'#field-message_product_color'
|
||||
},
|
||||
{
|
||||
value:'flex',
|
||||
selector:'#field-message_product_flex_ratio'
|
||||
},
|
||||
{
|
||||
value:'flex',
|
||||
selector:'#field-message_product_flex_color'
|
||||
}
|
||||
]
|
||||
);
|
||||
}
|
||||
|
||||
const updateCartMessageFields = () =>
|
||||
{
|
||||
groupToggleSelect(
|
||||
'#ppcp-message_cart_layout',
|
||||
[
|
||||
{
|
||||
value:'text',
|
||||
selector:'#field-message_cart_logo'
|
||||
},
|
||||
{
|
||||
value:'text',
|
||||
selector:'#field-message_cart_position'
|
||||
},
|
||||
{
|
||||
value:'text',
|
||||
selector:'#field-message_cart_color'
|
||||
},
|
||||
{
|
||||
value:'flex',
|
||||
selector:'#field-message_cart_flex_ratio'
|
||||
},
|
||||
{
|
||||
value:'flex',
|
||||
selector:'#field-message_cart_flex_color'
|
||||
}
|
||||
]
|
||||
);
|
||||
}
|
||||
|
||||
const disableOptions = (sourceSelector, targetSelector) => {
|
||||
|
||||
const source = jQuery(sourceSelector);
|
||||
const target = document.querySelector(targetSelector);
|
||||
|
@ -92,9 +195,9 @@ const disableOptions = (sourceSelector, targetSelector) => {
|
|||
|
||||
source.on('change',replace);
|
||||
replace();
|
||||
};
|
||||
};
|
||||
|
||||
(() => {
|
||||
(() => {
|
||||
disableOptions('select[name="ppcp[disable_cards][]"]', 'select[name="ppcp[card_icons][]"]');
|
||||
groupToggle(
|
||||
'#ppcp-button_enabled',
|
||||
|
@ -175,31 +278,7 @@ const disableOptions = (sourceSelector, targetSelector) => {
|
|||
]
|
||||
);
|
||||
|
||||
groupToggleSelect(
|
||||
'#ppcp-message_product_layout',
|
||||
[
|
||||
{
|
||||
value:'text',
|
||||
selector:'#field-message_product_logo'
|
||||
},
|
||||
{
|
||||
value:'text',
|
||||
selector:'#field-message_product_position'
|
||||
},
|
||||
{
|
||||
value:'text',
|
||||
selector:'#field-message_product_color'
|
||||
},
|
||||
{
|
||||
value:'flex',
|
||||
selector:'#field-message_product_flex_ratio'
|
||||
},
|
||||
{
|
||||
value:'flex',
|
||||
selector:'#field-message_product_flex_color'
|
||||
}
|
||||
]
|
||||
);
|
||||
|
||||
groupToggleSelect(
|
||||
'#ppcp-intent',
|
||||
[
|
||||
|
@ -209,54 +288,10 @@ const disableOptions = (sourceSelector, targetSelector) => {
|
|||
}
|
||||
]
|
||||
);
|
||||
groupToggleSelect(
|
||||
'#ppcp-message_cart_layout',
|
||||
[
|
||||
{
|
||||
value:'text',
|
||||
selector:'#field-message_cart_logo'
|
||||
},
|
||||
{
|
||||
value:'text',
|
||||
selector:'#field-message_cart_position'
|
||||
},
|
||||
{
|
||||
value:'text',
|
||||
selector:'#field-message_cart_color'
|
||||
},
|
||||
{
|
||||
value:'flex',
|
||||
selector:'#field-message_cart_flex_ratio'
|
||||
},
|
||||
{
|
||||
value:'flex',
|
||||
selector:'#field-message_cart_flex_color'
|
||||
|
||||
updateCheckoutMessageFields();
|
||||
updateProductMessageFields();
|
||||
updateCartMessageFields();
|
||||
})();
|
||||
}
|
||||
]
|
||||
);
|
||||
groupToggleSelect(
|
||||
'#ppcp-message_layout',
|
||||
[
|
||||
{
|
||||
value:'text',
|
||||
selector:'#field-message_logo'
|
||||
},
|
||||
{
|
||||
value:'text',
|
||||
selector:'#field-message_position'
|
||||
},
|
||||
{
|
||||
value:'text',
|
||||
selector:'#field-message_color'
|
||||
},
|
||||
{
|
||||
value:'flex',
|
||||
selector:'#field-message_flex_ratio'
|
||||
},
|
||||
{
|
||||
value:'flex',
|
||||
selector:'#field-message_flex_color'
|
||||
}
|
||||
]
|
||||
);
|
||||
})();
|
||||
)
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue