Add card button preview

This commit is contained in:
Alex P 2023-11-08 10:57:49 +02:00
parent c72a335cdd
commit 6c933e52c3
No known key found for this signature in database
GPG key ID: 54487A734A204D71
2 changed files with 39 additions and 3 deletions

View file

@ -77,7 +77,8 @@ document.addEventListener(
function createButtonPreview(settingsCallback) {
const render = (settings) => {
const wrapper = document.querySelector(settings.button.wrapper);
const wrapperSelector = Object.values(settings.separate_buttons).length > 0 ? Object.values(settings.separate_buttons)[0].wrapper : settings.button.wrapper;
const wrapper = document.querySelector(wrapperSelector);
if (!wrapper) {
return;
}
@ -171,7 +172,7 @@ document.addEventListener(
.catch((error) => console.error('failed to load the PayPal JS SDK script', error));
}
function getButtonSettings(wrapperSelector, fields) {
function getButtonSettings(wrapperSelector, fields, apm = null) {
const layoutElement = jQuery(fields['layout']);
const layout = (layoutElement.length && layoutElement.is(':visible')) ? layoutElement.val() : 'vertical';
const style = {
@ -184,13 +185,24 @@ document.addEventListener(
if ('height' in fields) {
style['height'] = parseInt(jQuery(fields['height']).val());
}
return {
if ('poweredby_tagline' in fields) {
style['layout'] = jQuery(fields['poweredby_tagline']).is(':checked') ? 'vertical' : 'horizontal';
}
const settings = {
'button': {
'wrapper': wrapperSelector,
'style': style,
},
'separate_buttons': {},
};
if (apm) {
settings.separate_buttons[apm] = {
'wrapper': wrapperSelector,
'style': style,
};
settings.button.wrapper = null;
}
return settings;
}
function createMessagesPreview(settingsCallback) {
@ -333,6 +345,13 @@ document.addEventListener(
});
createButtonPreview(() => getButtonDefaultSettings('#ppcpPayLaterButtonPreview'));
const apmFieldPrefix = '#ppcp-card_button_';
createButtonPreview(() => getButtonSettings('#ppcpCardButtonPreview', {
'color': apmFieldPrefix + 'color',
'shape': apmFieldPrefix + 'shape',
'poweredby_tagline': apmFieldPrefix + 'poweredby_tagline',
}, 'card'));
});
}
}