woocommerce/woocommerce-paypal-payments
2
0
Fork 0
mirror of https://github.com/woocommerce/woocommerce-paypal-payments.git synced 2025-09-05 08:59:14 +08:00
Code Issues Projects Packages Wiki Activity Actions 7

✨ Preview buttons can be static

Browse source 
When the current page does not contain any edit-fields for the current APM preview button, it enters “static” mode. Static buttons ignore most update requests, and render as they were defined during page load
This commit is contained in:
Philipp Stracker 2024-06-07 21:14:12 +02:00
parent 93f3e4e7ac
commit 6f73e82d3e
No known key found for this signature in database
4 changed files with 131 additions and 100 deletions
Download patch file Download diff file Expand all files Collapse all files

49
modules/ppcp-applepay/resources/js/boot-admin.js
View file

@ -20,17 +20,10 @@ const buttonManager = () => {
*/
class ApplePayPreviewButtonManager extends PreviewButtonManager {
constructor() {
const defaultButton = {
type: 'pay',
color: 'black',
lang: 'en'
};
const args = {
methodName: 'ApplePay',
buttonConfig: window.wc_ppcp_applepay_admin,
widgetBuilder,
defaultAttributes: {button: defaultButton}
};
super(args);
@ -62,8 +55,7 @@ class ApplePayPreviewButtonManager extends PreviewButtonManager {
createButtonInst(wrapperId) {
return new ApplePayPreviewButton({
selector: wrapperId,
configResponse: this.configResponse,
defaultAttributes: this.defaultAttributes
apiConfig: this.apiConfig
});
}
}
@ -77,6 +69,13 @@ class ApplePayPreviewButton extends PreviewButton {
super(args);
this.selector = `${args.selector}ApplePay`
this.defaultAttributes = {
button: {
type: 'pay',
color: 'black',
lang: 'en'
}
};
}
createNewWrapper() {
@ -86,38 +85,30 @@ class ApplePayPreviewButton extends PreviewButton {
return element;
}
createButton() {
createButton(buttonConfig) {
const button = new ApplepayButton(
'preview',
null,
this.buttonConfig,
buttonConfig,
this.ppcpConfig,
);
button.init(this.configResponse);
button.init(this.apiConfig);
}
/**
* Some style details need to be copied from the ppcpConfig object to buttonConfig.
*
* - ppcpConfig: Generated by JS, containing the current form values.
* - buttonConfig: Generated on server side, contains the full (saved) button details.
* Merge form details into the config object for preview.
* Mutates the previewConfig object; no return value.
*/
applyPreviewConfig() {
dynamicPreviewConfig(buttonConfig, ppcpConfig) {
// The Apple Pay button expects the "wrapper" to be an ID without `#` prefix!
if (this.buttonConfig?.button?.wrapper) {
this.buttonConfig.button.wrapper = this.buttonConfig.button.wrapper.replace(/^#/, '');
}
buttonConfig.button.wrapper = buttonConfig.button.wrapper.replace(/^#/, '');
// Apple Pay expects the param "lang" instead of "language"
if (this.ppcpConfig?.button?.style?.language) {
this.ppcpConfig.button.style.lang = this.ppcpConfig.button.style.language;
}
if (this.ppcpConfig && this.buttonConfig) {
this.buttonConfig.button.type = this.ppcpConfig.button.style.type;
this.buttonConfig.button.color = this.ppcpConfig.button.style.color;
this.buttonConfig.button.lang = this.ppcpConfig.button.style.lang;
// Merge the current form-values into the preview-button configuration.
if (ppcpConfig.button) {
buttonConfig.button.type = ppcpConfig.button.style.type;
buttonConfig.button.color = ppcpConfig.button.style.color;
buttonConfig.button.lang = ppcpConfig.button.style?.lang || ppcpConfig.button.style.language;
}
}
}