Add missing .gitignore file

This commit is contained in:
dinamiko 2022-09-14 16:26:54 +02:00
parent 2d4620d780
commit be478fc3e6
4 changed files with 3 additions and 933 deletions

3
modules/ppcp-onboarding/.gitignore vendored Normal file
View file

@ -0,0 +1,3 @@
node_modules
/assets/js
/assets/css

View file

@ -1,221 +0,0 @@
.optional {
display: none;
}
.ppcp-onboarded .ppcp-onboarding-element:not(.ppcp-always-shown-element) {
display: none;
}
.ppcp-onboarding .ppcp-settings-field:not(.ppcp-onboarding-element):not(.ppcp-always-shown-element) {
display: none;
}
.ppcp-settings-field.hide {
display: none;
}
.ppcp-settings-field.show {
display: table-row;
}
label.error {
color: red;
font-weight: bold;
}
#field-toggle_manual_input button {
color: #0073aa;
transition-property: border, background, color;
transition-duration: .05s;
transition-timing-function: ease-in-out;
background: none;
border: none;
text-decoration: underline;
cursor: pointer;
margin: 0;
padding: 0;
}
/* Probably not the best location for this but will do until there's a general purpose settings CSS file. */
.ppcp-settings-field-heading td, .ppcp-settings-field-heading th, .ppcp-settings-no-title-col td {
padding-left: 0;
}
.woocommerce_page_wc-settings h3.ppcp-subheading {
font-size: 1.1em;
}
.input-text[pattern]:invalid {
border: red solid 2px;
}
ul.ppcp-onboarding-options, ul.ppcp-onboarding-options-sublist {
list-style: none;
}
ul.ppcp-onboarding-options-sublist {
margin-left: 15px;
margin-top: 15px;
}
.ppcp-muted-text {
opacity: 0.6;
font-size: 85%;
}
#field-ppcp_onboarading_header > td, #field-ppcp_onboarading_options > td {
padding: 0;
}
.ppcp-onboarding-header, .ppcp-onboarding-cards-options {
display: flex;
width: 1200px;
}
.ppcp-onboarding-header-left, .ppcp-onboarding-header-right {
flex: 50%;
}
.ppcp-onboarding-header-right {
text-align: right;
}
.ppcp-onboarding-header h2 {
margin-top: 0;
}
.ppcp-onboarding-header-left img {
height: 60px;
}
.ppcp-onboarding-header-cards img, .ppcp-onboarding-header-paypal-logos img {
margin: 5px;
}
.ppcp-onboarding-header-cards img {
height: 37px;
}
.ppcp-onboarding-header-paypal-logos img {
height: 32px;
}
.ppcp-onboarding-cards-options table {
margin-left: 35px;
margin-right: 15px;
}
.ppcp-onboarding-cards-options table th, .ppcp-onboarding-cards-options table td {
padding-top: 2px;
}
.ppcp-onboarding-cards-options table th {
width: 350px;
vertical-align: middle !important;
}
.ppcp-onboarding-cards-options table tr th, .ppcp-onboarding-cards-options table tr td {
padding-bottom: 0;
}
.ppcp-onboarding-cards-options table {
padding-bottom: 15px;
}
.ppcp-onboarding-cards-options table tr {
height: 40px;
}
.ppcp-onboarding-cards-screen {
flex: 1;
align-self: center;
}
.ppcp-onboarding-cards-screen img {
width: 100%;
}
.woocommerce-help-tip.ppcp-table-row-tooltip {
margin-left: -20px !important;
}
@media (max-width: 1200px) {
.ppcp-onboarding-header, .ppcp-onboarding-cards-options {
width: unset;
display: block;
}
.ppcp-onboarding-header-right {
text-align: left;
}
.ppcp-onboarding-cards-screen {
display: none;
}
.ppcp-onboarding-header-left img {
height: 30px;
}
.ppcp-onboarding-header-cards img, .ppcp-onboarding-header-paypal-logos img {
margin: 2px;
}
.ppcp-onboarding-header-cards img {
height: 27px;
}
.ppcp-onboarding-header-paypal-logos img {
height: 23px;
}
}
.ppcp-settings-page-header {
display: flex;
align-items: center;
max-width: 1200px;
margin-top: 10px;
}
.ppcp-settings-page-header img {
height: 30px;
}
.ppcp-settings-page-header h4 {
margin: 0 15px 0 5px;
}
.ppcp-settings-page-header .button, .ppcp-settings-page-header a {
margin: 0 5px;
}
.ppcp-right-align {
margin-left: auto;
}
.ppcp-settings-page-header a {
text-decoration: none;
}
@media (max-width: 1200px) {
.ppcp-settings-page-header {
display: block;
}
.ppcp-settings-page-header .ppcp-right-align {
display: block;
margin-left: 0;
}
.ppcp-settings-page-header .button, .ppcp-settings-page-header a {
margin: 5px 10px 5px 0;
}
.ppcp-settings-page-header .ppcp-inline-only {
display: none;
}
.ppcp-settings-page-header h4 {
margin-left: 0;
}
}

View file

@ -1,382 +0,0 @@
const ppcp_onboarding = {
BUTTON_SELECTOR: '[data-paypal-onboard-button]',
PAYPAL_JS_ID: 'ppcp-onboarding-paypal-js',
_timeout: false,
STATE_START: 'start',
STATE_ONBOARDED: 'onboarded',
init: function() {
document.addEventListener('DOMContentLoaded', this.reload);
},
reload: function() {
const buttons = document.querySelectorAll(ppcp_onboarding.BUTTON_SELECTOR);
if (0 === buttons.length) {
return;
}
// Add event listeners to buttons preventing link clicking if PayPal init failed.
buttons.forEach(
(element) => {
if (element.hasAttribute('data-ppcp-button-initialized')) {
return;
}
element.addEventListener(
'click',
(e) => {
if (!element.hasAttribute('data-ppcp-button-initialized') || 'undefined' === typeof window.PAYPAL) {
e.preventDefault();
}
}
);
}
);
// Clear any previous PayPal scripts.
[ppcp_onboarding.PAYPAL_JS_ID, 'signup-js', 'biz-js'].forEach(
(scriptID) => {
const scriptTag = document.getElementById(scriptID);
if (scriptTag) {
scriptTag.parentNode.removeChild(scriptTag);
}
if ('undefined' !== typeof window.PAYPAL) {
delete window.PAYPAL;
}
}
);
// Load PayPal scripts.
const paypalScriptTag = document.createElement('script');
paypalScriptTag.id = ppcp_onboarding.PAYPAL_JS_ID;
paypalScriptTag.src = PayPalCommerceGatewayOnboarding.paypal_js_url;
document.body.append(paypalScriptTag);
if (ppcp_onboarding._timeout) {
clearTimeout(ppcp_onboarding._timeout);
}
ppcp_onboarding._timeout = setTimeout(
() => {
buttons.forEach((element) => { element.setAttribute('data-ppcp-button-initialized', 'true'); });
if ('undefined' !== window.PAYPAL.apps.Signup) {
window.PAYPAL.apps.Signup.render();
}
},
1000
);
const onboard_pui = document.querySelector('#ppcp-onboarding-pui');
onboard_pui?.addEventListener('click', (event) => {
event.preventDefault();
buttons.forEach((element) => {
element.removeAttribute('href');
});
fetch(PayPalCommerceGatewayOnboarding.pui_endpoint, {
method: 'POST',
body: JSON.stringify({
nonce: PayPalCommerceGatewayOnboarding.pui_nonce,
checked: onboard_pui.checked
})
}).then((res)=>{
return res.json();
}).then((data)=>{
if (!data.success) {
alert('Could not update signup buttons: ' + JSON.stringify(data));
return;
}
buttons.forEach((element) => {
for (let [key, value] of Object.entries(data.data.signup_links)) {
key = 'connect-to' + key.replace(/-/g, '');
if(key === element.id) {
element.setAttribute('href', value);
}
}
});
});
})
},
loginSeller: function(env, authCode, sharedId) {
fetch(
PayPalCommerceGatewayOnboarding.endpoint,
{
method: 'POST',
headers: {
'content-type': 'application/json'
},
body: JSON.stringify(
{
authCode: authCode,
sharedId: sharedId,
nonce: PayPalCommerceGatewayOnboarding.nonce,
env: env,
acceptCards: document.querySelector('#ppcp-onboarding-accept-cards').checked,
}
)
}
);
},
};
function ppcp_onboarding_sandboxCallback(...args) {
return ppcp_onboarding.loginSeller('sandbox', ...args);
}
function ppcp_onboarding_productionCallback(...args) {
return ppcp_onboarding.loginSeller('production', ...args);
}
(() => {
const productionCredentialElementsSelectors = [
'#field-merchant_email_production',
'#field-merchant_id_production',
'#field-client_id_production',
'#field-client_secret_production',
];
const sandboxCredentialElementsSelectors = [
'#field-merchant_email_sandbox',
'#field-merchant_id_sandbox',
'#field-client_id_sandbox',
'#field-client_secret_sandbox',
];
const updateOptionsState = () => {
const cardsChk = document.querySelector('#ppcp-onboarding-accept-cards');
if (!cardsChk) {
return;
}
document.querySelectorAll('#ppcp-onboarding-dcc-options input').forEach(input => {
input.disabled = !cardsChk.checked;
});
document.querySelector('.ppcp-onboarding-cards-options').style.display = !cardsChk.checked ? 'none' : '';
const basicRb = document.querySelector('#ppcp-onboarding-dcc-basic');
const isExpress = !cardsChk.checked || basicRb.checked;
const expressButtonSelectors = [
'#field-ppcp_onboarding_production_express',
'#field-ppcp_onboarding_sandbox_express',
];
const ppcpButtonSelectors = [
'#field-ppcp_onboarding_production_ppcp',
'#field-ppcp_onboarding_sandbox_ppcp',
];
document.querySelectorAll(expressButtonSelectors.join()).forEach(
element => element.style.display = isExpress ? '' : 'none'
);
document.querySelectorAll(ppcpButtonSelectors.join()).forEach(
element => element.style.display = !isExpress ? '' : 'none'
);
const screemImg = document.querySelector('#ppcp-onboarding-cards-screen-img');
if (screemImg) {
const currentRb = Array.from(document.querySelectorAll('#ppcp-onboarding-dcc-options input[type="radio"]'))
.filter(rb => rb.checked)[0] ?? null;
const imgUrl = currentRb.getAttribute('data-screen-url');
screemImg.src = imgUrl;
}
};
const updateManualInputControls = (shown, isSandbox, isAnyEnvOnboarded) => {
const productionElementsSelectors = productionCredentialElementsSelectors;
const sandboxElementsSelectors = sandboxCredentialElementsSelectors;
const otherElementsSelectors = [
'.woocommerce-save-button',
];
if (!isAnyEnvOnboarded) {
otherElementsSelectors.push('#field-sandbox_on');
}
document.querySelectorAll(productionElementsSelectors.join()).forEach(
element => {
element.classList.remove('hide', 'show');
element.classList.add((shown && !isSandbox) ? 'show' : 'hide');
}
);
document.querySelectorAll(sandboxElementsSelectors.join()).forEach(
element => {
element.classList.remove('hide', 'show');
element.classList.add((shown && isSandbox) ? 'show' : 'hide');
}
);
document.querySelectorAll(otherElementsSelectors.join()).forEach(
element => element.style.display = shown ? '' : 'none'
);
};
const updateEnvironmentControls = (isSandbox) => {
const productionElementsSelectors = [
'#field-ppcp_disconnect_production',
'#field-credentials_production_heading',
];
const sandboxElementsSelectors = [
'#field-ppcp_disconnect_sandbox',
'#field-credentials_sandbox_heading',
];
document.querySelectorAll(productionElementsSelectors.join()).forEach(
element => element.style.display = !isSandbox ? '' : 'none'
);
document.querySelectorAll(sandboxElementsSelectors.join()).forEach(
element => element.style.display = isSandbox ? '' : 'none'
);
};
let isDisconnecting = false;
const disconnect = (event) => {
event.preventDefault();
const fields = event.target.classList.contains('production') ? productionCredentialElementsSelectors : sandboxCredentialElementsSelectors;
document.querySelectorAll(fields.map(f => f + ' input').join()).forEach(
(element) => {
element.value = '';
}
);
sandboxSwitchElement.checked = ! sandboxSwitchElement.checked;
isDisconnecting = true;
document.querySelector('.woocommerce-save-button').click();
};
// Prevent the message about unsaved checkbox/radiobutton when reloading the page.
// (WC listens for changes on all inputs and sets dirty flag until form submission)
const preventDirtyCheckboxPropagation = event => {
event.preventDefault();
event.stopPropagation();
const value = event.target.checked;
setTimeout( () => {
event.target.checked = value;
}, 1
);
};
const sandboxSwitchElement = document.querySelector('#ppcp-sandbox_on');
const validate = () => {
const selectors = sandboxSwitchElement.checked ? sandboxCredentialElementsSelectors : productionCredentialElementsSelectors;
const values = selectors.map(s => document.querySelector(s + ' input')).map(el => el.value);
const errors = [];
if (values.some(v => !v)) {
errors.push(PayPalCommerceGatewayOnboarding.error_messages.no_credentials);
}
return errors;
};
const isAnyEnvOnboarded = PayPalCommerceGatewayOnboarding.sandbox_state === ppcp_onboarding.STATE_ONBOARDED ||
PayPalCommerceGatewayOnboarding.production_state === ppcp_onboarding.STATE_ONBOARDED;
document.querySelectorAll('.ppcp-disconnect').forEach(
(button) => {
button.addEventListener(
'click',
disconnect
);
}
);
document.querySelectorAll('.ppcp-onboarding-options input').forEach(
(element) => {
element.addEventListener('click', event => {
updateOptionsState();
preventDirtyCheckboxPropagation(event);
});
}
);
const isSandboxInBackend = PayPalCommerceGatewayOnboarding.current_env === 'sandbox';
if (sandboxSwitchElement.checked !== isSandboxInBackend) {
sandboxSwitchElement.checked = isSandboxInBackend;
}
updateOptionsState();
const settingsContainer = document.querySelector('#mainform .form-table');
const markCurrentOnboardingState = (isOnboarded) => {
settingsContainer.classList.remove('ppcp-onboarded', 'ppcp-onboarding');
settingsContainer.classList.add(isOnboarded ? 'ppcp-onboarded' : 'ppcp-onboarding');
}
markCurrentOnboardingState(PayPalCommerceGatewayOnboarding.current_state === ppcp_onboarding.STATE_ONBOARDED);
const manualInputToggleButton = document.querySelector('#field-toggle_manual_input button');
let isManualInputShown = PayPalCommerceGatewayOnboarding.current_state === ppcp_onboarding.STATE_ONBOARDED;
manualInputToggleButton.addEventListener(
'click',
(event) => {
event.preventDefault();
isManualInputShown = !isManualInputShown;
updateManualInputControls(isManualInputShown, sandboxSwitchElement.checked, isAnyEnvOnboarded);
}
);
sandboxSwitchElement.addEventListener(
'click',
(event) => {
const isSandbox = sandboxSwitchElement.checked;
if (isAnyEnvOnboarded) {
const onboardingState = isSandbox ? PayPalCommerceGatewayOnboarding.sandbox_state : PayPalCommerceGatewayOnboarding.production_state;
const isOnboarded = onboardingState === ppcp_onboarding.STATE_ONBOARDED;
markCurrentOnboardingState(isOnboarded);
isManualInputShown = isOnboarded;
}
updateManualInputControls(isManualInputShown, isSandbox, isAnyEnvOnboarded);
updateEnvironmentControls(isSandbox);
preventDirtyCheckboxPropagation(event);
}
);
updateManualInputControls(isManualInputShown, sandboxSwitchElement.checked, isAnyEnvOnboarded);
updateEnvironmentControls(sandboxSwitchElement.checked);
document.querySelector('#mainform').addEventListener('submit', e => {
if (isDisconnecting) {
return;
}
const errors = validate();
if (errors.length) {
e.preventDefault();
const errorLabel = document.querySelector('#ppcp-form-errors-label');
errorLabel.parentElement.parentElement.classList.remove('hide');
errorLabel.innerHTML = errors.join('<br/>');
errorLabel.scrollIntoView();
window.scrollBy(0, -120); // WP + WC floating header
}
});
// Onboarding buttons.
ppcp_onboarding.init();
})();

View file

@ -1,330 +0,0 @@
document.addEventListener(
'DOMContentLoaded',
() => {
const groupToggle = (selector, group) => {
const toggleElement = document.querySelector(selector);
if (! toggleElement) {
return;
}
if (! toggleElement.checked) {
group.forEach( (elementToHide) => {
document.querySelector(elementToHide).style.display = 'none';
})
}
toggleElement.addEventListener(
'change',
(event) => {
if (! event.target.checked) {
group.forEach( (elementToHide) => {
document.querySelector(elementToHide).style.display = 'none';
});
return;
}
group.forEach( (elementToShow) => {
document.querySelector(elementToShow).style.display = '';
})
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 toggleElement = document.querySelector(selector);
if (! toggleElement) {
return;
}
const value = toggleElement.value;
group.forEach( (elementToToggle) => {
const domElement = document.querySelector(elementToToggle.selector);
if (! domElement) {
return;
}
if (value === elementToToggle.value && domElement.style.display !== 'none') {
domElement.style.display = '';
return;
}
domElement.style.display = 'none';
});
// We need to use jQuery here as the select might be a select2 element, which doesn't use native events.
jQuery(toggleElement).on(
'change',
(event) => {
const value = event.target.value;
group.forEach( (elementToToggle) => {
if (value === elementToToggle.value) {
document.querySelector(elementToToggle.selector).style.display = '';
return;
}
document.querySelector(elementToToggle.selector).style.display = 'none';
})
}
);
};
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);
if (! target) {
return;
}
const allOptions = Array.from(document.querySelectorAll('select[name="ppcp[disable_cards][]"] option'));
const iconVersions = {
'visa': {
'light': {'label': 'Visa (light)'},
'dark' : {'label': 'Visa (dark)', 'value': 'visa-dark'}
},
'mastercard': {
'light': {'label': 'Mastercard (light)'},
'dark' : {'label': 'Mastercard (dark)', 'value': 'mastercard-dark'}
}
}
const replace = () => {
const validOptions = allOptions.filter(
(option) => {
return ! option.selected
}
);
const selectedValidOptions = validOptions.map(
(option) => {
option = option.cloneNode(true);
let value = option.value;
option.selected = target.querySelector('option[value="' + value + '"]') && target.querySelector('option[value="' + value + '"]').selected;
if(value === 'visa' || value === 'mastercard') {
let darkOption = option.cloneNode(true);
let currentVersion = iconVersions[value];
let darkValue = iconVersions[value].dark.value;
option.text = currentVersion.light.label;
darkOption.text = currentVersion.dark.label;
darkOption.value = darkValue;
darkOption.selected = target.querySelector('option[value="' + darkValue + '"]') && target.querySelector('option[value="' + darkValue + '"]').selected;
return [option, darkOption];
}
return option;
}
);
target.innerHTML = '';
selectedValidOptions.forEach(
(option) => {
if(Array.isArray(option)){
option.forEach(
(option) => {
target.append(option);
}
)
}
target.append(option);
}
);
};
source.on('change',replace);
replace();
};
(() => {
disableOptions('select[name="ppcp[disable_cards][]"]', 'select[name="ppcp[card_icons][]"]');
groupToggle(
'#ppcp-button_enabled',
[
'#field-button_layout',
'#field-button_tagline',
'#field-button_label',
'#field-button_color',
'#field-button_shape',
]
);
groupToggle(
'#ppcp-message_enabled',
[
'#field-message_layout',
'#field-message_logo',
'#field-message_position',
'#field-message_color',
'#field-message_flex_color',
'#field-message_flex_ratio',
]
);
groupToggle(
'#ppcp-button_product_enabled',
[
'#field-button_product_layout',
'#field-button_product_tagline',
'#field-button_product_label',
'#field-button_product_color',
'#field-button_product_shape',
]
);
groupToggle(
'#ppcp-message_product_enabled',
[
'#field-message_product_layout',
'#field-message_product_logo',
'#field-message_product_position',
'#field-message_product_color',
'#field-message_product_flex_color',
'#field-message_product_flex_ratio',
]
);
groupToggle(
'#ppcp-button_mini-cart_enabled',
[
'#field-button_mini-cart_layout',
'#field-button_mini-cart_tagline',
'#field-button_mini-cart_label',
'#field-button_mini-cart_color',
'#field-button_mini-cart_shape',
'#field-button_mini-cart_height',
]
);
groupToggle(
'#ppcp-button_cart_enabled',
[
'#field-button_cart_layout',
'#field-button_cart_tagline',
'#field-button_cart_label',
'#field-button_cart_color',
'#field-button_cart_shape',
]
);
groupToggle(
'#ppcp-message_cart_enabled',
[
'#field-message_cart_layout',
'#field-message_cart_logo',
'#field-message_cart_position',
'#field-message_cart_color',
'#field-message_cart_flex_color',
'#field-message_cart_flex_ratio',
]
);
groupToggleSelect(
'#ppcp-intent',
[
{
value:'authorize',
selector:'#field-capture_for_virtual_only'
}
]
);
updateCheckoutMessageFields();
updateProductMessageFields();
updateCartMessageFields();
})();
}
)