Add logic for cart and checkout

This commit is contained in:
carmenmaymo 2023-09-05 09:14:20 +02:00
parent 0e29969c96
commit 22809839d1
No known key found for this signature in database
GPG key ID: 6023F686B0F3102E
8 changed files with 376 additions and 106 deletions

View file

@ -9,52 +9,102 @@ declare(strict_types=1);
namespace WooCommerce\PayPalCommerce\Applepay;
use WooCommerce\PayPalCommerce\Applepay\Assets\PropertiesDictionary;
use WooCommerce\PayPalCommerce\Onboarding\State;
use WooCommerce\PayPalCommerce\Vendor\Psr\Container\ContainerInterface;
return array(
'wcgateway.settings.fields' => static function ( ContainerInterface $container, array $fields ): array {
$fields['applepay_heading'] = array(
'heading' => __( 'Apple Pay', 'woocommerce-paypal-payments' ),
'description' =>
__(
'Customize the behaviour of the ApplePay button.',
'woocommerce-paypal-payments'
),
'type' => 'ppcp-heading',
'screens' => array( State::STATE_ONBOARDED ),
'requirements' => array(),
'gateway' => 'paypal',
);
$fields['applepay_button_enabled'] = array(
'title' => __( 'Apple Pay Button on Product Page', 'woocommerce-paypal-payments' ),
'type' => 'checkbox',
'label' => __( 'Enable Apple Pay button on product page', 'woocommerce-paypal-payments' ),
'default' => 'yes',
'screens' => array( State::STATE_ONBOARDED ),
'gateway' => 'paypal',
'requirements' => array(),
);
$fields['applepay_live_validation_file'] = array(
'title' => __( 'Apple Pay Live Validation File', 'woocommerce-paypal-payments' ),
'type' => 'textarea',
'label' => __( 'Paste here the validation file content', 'woocommerce-paypal-payments' ),
'default' => null,
'screens' => array( State::STATE_ONBOARDED ),
'gateway' => 'paypal',
'requirements' => array(),
);
$fields['applepay_sandbox_validation_file'] = array(
'title' => __( 'Apple Pay Sandbox Validation File', 'woocommerce-paypal-payments' ),
'type' => 'textarea',
'label' => __( 'Paste here the validation file content', 'woocommerce-paypal-payments' ),
'default' => null,
'screens' => array( State::STATE_ONBOARDED ),
'gateway' => 'paypal',
'requirements' => array(),
);
'wcgateway.settings.fields' => function (ContainerInterface $container, array $fields): array {
$insert_after = function (array $array, string $key, array $new): array {
$keys = array_keys($array);
$index = array_search($key, $keys, true);
$pos = false === $index ? count($array) : $index + 1;
return $fields;
return array_merge(array_slice($array, 0, $pos), $new, array_slice($array, $pos));
};
return $insert_after(
$fields,
'allow_card_button_gateway',
array(
'applepay_button_enabled' => array(
'title' => __('Apple Pay Button', 'woocommerce-paypal-payments'),
'type' => 'checkbox',
'label' => __('Enable Apple Pay button', 'woocommerce-paypal-payments'),
'default' => 'yes',
'screens' => array(State::STATE_ONBOARDED),
'gateway' => 'paypal',
'requirements' => array(),
'custom_attributes' => array(
'data-ppcp-handlers' => wp_json_encode(
array(
array(
'handler' => 'SubElementsHandler',
'options' => array(
'values' => array('1'),
'elements' => array('#field-applepay_button_color', '#field-applepay_button_type', '#field-applepay_button_language'),
),
),
)
),
),
),
'applepay_live_validation_file' => array(
'title' => __('Apple Pay Live Validation File', 'woocommerce-paypal-payments'),
'type' => 'text',
'desc_tip' => true,
'description' => __('Paste here the validation file content', 'woocommerce-paypal-payments'),
'default' => null,
'screens' => array(State::STATE_ONBOARDED),
'gateway' => 'paypal',
'requirements' => array(),
),
'applepay_sandbox_validation_file' => array(
'title' => __('Apple Pay Sandbox Validation File', 'woocommerce-paypal-payments'),
'type' => 'text',
'desc_tip' => true,
'description' => __('Paste here the validation file content', 'woocommerce-paypal-payments'),
'default' => null,
'screens' => array(State::STATE_ONBOARDED),
'gateway' => 'paypal',
'requirements' => array(),
),
'applepay_button_color' => array(
'title' => str_repeat(' ', 6) . __('Button Color', 'woocommerce-paypal-payments'),
'type' => 'select',
'label' => '',
'input_class' => array('wc-enhanced-select'),
'class' => array(),
'default' => 'black',
'options' => PropertiesDictionary::button_colors(),
'screens' => array(State::STATE_ONBOARDED),
'gateway' => 'paypal',
'requirements' => array(),
),
'applepay_button_type' => array(
'title' => str_repeat(' ', 6) . __('Button Type', 'woocommerce-paypal-payments'),
'type' => 'select',
'class' => array(),
'input_class' => array('wc-enhanced-select'),
'default' => 'pay',
'options' => PropertiesDictionary::button_types(),
'screens' => array(State::STATE_ONBOARDED),
'gateway' => 'paypal',
'requirements' => array(),
),
'applepay_button_language' => array(
'title' => str_repeat(' ', 6) . __('Button Language', 'woocommerce-paypal-payments'),
'type' => 'select',
'class' => array(),
'input_class' => array('wc-enhanced-select'),
'default' => 'en',
'options' => PropertiesDictionary::button_languages(),
'screens' => array(State::STATE_ONBOARDED),
'gateway' => 'paypal',
'requirements' => array(),
),
)
);
},
);

View file

@ -1,10 +1,16 @@
#btn-appl {
--apple-pay-button-width: 100%;
--apple-pay-button-height: 100%;
--apple-pay-button-border-radius: 4px;
--apple-pay-button-overflow: hidden;
}
#applepay-container {
margin-top: 5px;
overflow: hidden;
height: 45px;
//margin-top: 5px;
//overflow: hidden;
//height: 45px;
&.ppcp-button-pill {
border-radius: 50px;
//border-radius: 50px;
}
&.ppcp-button-minicart {
@ -15,9 +21,9 @@
.woocommerce-checkout {
#applepay-container {
margin-top: 0;
border-radius: 18px;
height: 38px;
//margin-top: 0;
//border-radius: 18px;
//height: 38px;
}
}

View file

@ -10,8 +10,6 @@ class ApplepayButton {
this.externalHandler = externalHandler;
this.buttonConfig = buttonConfig;
this.ppcpConfig = ppcpConfig;
console.log(buttonConfig)
console.log(ppcpConfig)
this.paymentsClient = null;
this.contextHandler = ContextHandlerFactory.create(
@ -45,6 +43,15 @@ console.log(buttonConfig)
this.onButtonClick()
})
}
jQuery.ajax({
url: this.buttonConfig.ajax_url,
type: 'POST',
data: {
action: 'ppcp_validate',
validation: true,
nonce: this.nonce,
}
})
}
buildReadyToPayRequest(allowedPaymentMethods, baseRequest) {
@ -73,7 +80,10 @@ console.log(buttonConfig)
*/
addButton() {
const appleContainer = document.getElementById("applepay-container");
appleContainer.innerHTML = '<apple-pay-button id="btn-appl" type="buy" locale="en">';
const type = this.buttonConfig.button.type;
const language = this.buttonConfig.button.lang;
const color = this.buttonConfig.button.color;
appleContainer.innerHTML = `<apple-pay-button id="btn-appl" buttonstyle="${color}" type="${type}" locale="${language}">`;
const wrapper =
(this.context === 'mini-cart')
@ -106,27 +116,57 @@ console.log(buttonConfig)
paymentDataRequest() {
const applepayConfig = this.applePayConfig
const buttonConfig = this.buttonConfig
document.querySelector('input.qty').addEventListener('change', event => {
this.productQuantity = event.currentTarget.value
})
this.productQuantity = parseInt(productQuantity)
const amountWithoutTax = productQuantity * buttonConfig.product.price
return {
countryCode: applepayConfig.countryCode,
merchantCapabilities: applepayConfig.merchantCapabilities,
supportedNetworks: applepayConfig.supportedNetworks,
currencyCode: buttonConfig.shop.currencyCode,
requiredShippingContactFields: ["name", "phone",
"email", "postalAddress"],
requiredBillingContactFields: ["name", "phone", "email",
"postalAddress"],
total: {
label: buttonConfig.shop.totalLabel,
type: "final",
amount: amountWithoutTax,
console.log('[ApplePayButton] paymentDataRequest', applepayConfig, buttonConfig);
function product_request() {
document.querySelector('input.qty').addEventListener('change', event => {
this.productQuantity = event.currentTarget.value
})
this.productQuantity = parseInt(this.productQuantity)
const amountWithoutTax = this.productQuantity * buttonConfig.product.price
return {
countryCode: applepayConfig.countryCode,
merchantCapabilities: applepayConfig.merchantCapabilities,
supportedNetworks: applepayConfig.supportedNetworks,
currencyCode: buttonConfig.shop.currencyCode,
requiredShippingContactFields: ["name", "phone",
"email", "postalAddress"],
requiredBillingContactFields: ["name", "phone", "email",
"postalAddress"],
total: {
label: buttonConfig.shop.totalLabel,
type: "final",
amount: amountWithoutTax,
}
}
}
function cart_request() {
const priceContent = jQuery('.cart-subtotal .woocommerce-Price-amount bdi').contents()[1]
const priceString = priceContent.nodeValue.trim();
const price = parseFloat(priceString);
return {
countryCode: applepayConfig.countryCode,
merchantCapabilities: applepayConfig.merchantCapabilities,
supportedNetworks: applepayConfig.supportedNetworks,
currencyCode: buttonConfig.shop.currencyCode,
requiredShippingContactFields: ["name", "phone",
"email", "postalAddress"],
requiredBillingContactFields: ["name", "phone", "email",
"postalAddress"],
total: {
label: buttonConfig.shop.totalLabel,
type: "final",
amount: price,
}
}
}
switch (this.context) {
case 'product': return product_request.call(this);
case 'cart':
case 'checkout':
return cart_request.call(this);
}
}
@ -136,27 +176,35 @@ console.log(buttonConfig)
onvalidatemerchant(session) {
return (applePayValidateMerchantEvent) => {
applepay.validateMerchant({
paypal.Applepay().validateMerchant({
validationUrl: applePayValidateMerchantEvent.validationURL
})
.then(validateResult => {
session.completeMerchantValidation(validateResult.merchantSession);
//call backend to update validation to true
console.log('validated')
})
.catch(validateError => {
console.error(validateError);
//call backend to update validation to false
jQuery.ajax({
url: this.buttonConfig.ajax_url,
type: 'POST',
data: {
action: 'ppcp_validate',
validation: false,
nonce: this.nonce,
}
})
session.abort();
});
};
}
onshippingmethodselected(ajaxUrl, productId, session) {
return function (event) {
jQuery.ajax({
url: ajaxUrl,
method: 'POST',
data: {
function getData(event) {
switch (this.context) {
case 'product': return {
action: 'ppcp_update_shipping_method',
shipping_method: event.shippingMethod,
product_id: productId,
@ -164,7 +212,24 @@ console.log(buttonConfig)
product_quantity: this.productQuantity,
simplified_contact: this.updatedContactInfo,
'woocommerce-process-checkout-nonce': this.nonce,
},
}
case 'cart':
case 'checkout':
return {
action: 'ppcp_update_shipping_method',
shipping_method: event.shippingMethod,
caller_page: 'cart',
simplified_contact: this.updatedContactInfo,
'woocommerce-process-checkout-nonce': this.nonce,
}
}
}
return function (event) {
jQuery.ajax({
url: this.buttonConfig.ajax_url,
method: 'POST',
data: getData.call(this, event),
success: (applePayShippingMethodUpdate, textStatus, jqXHR) => {
let response = applePayShippingMethodUpdate.data
this.selectedShippingMethod = event.shippingMethod
@ -189,12 +254,10 @@ console.log(buttonConfig)
})
};
}
onshippingcontactselected(ajaxUrl, productId, session) {
return function (event) {
jQuery.ajax({
url: ajaxUrl,
method: 'POST',
data: {
onshippingcontactselected(ajax_url, productId, session) {
function getData(event) {
switch (this.context) {
case 'product': return {
action: 'ppcp_update_shipping_contact',
product_id: productId,
caller_page: 'productDetail',
@ -202,7 +265,24 @@ console.log(buttonConfig)
simplified_contact: event.shippingContact,
need_shipping: this.needShipping,
'woocommerce-process-checkout-nonce': this.nonce,
},
}
case 'cart':
case 'checkout':
return {
action: 'ppcp_update_shipping_contact',
simplified_contact: event.shippingContact,
caller_page: 'cart',
need_shipping: this.needShipping,
'woocommerce-process-checkout-nonce': this.nonce,
}
}
}
return function (event) {
jQuery.ajax({
url: this.buttonConfig.ajax_url,
method: 'POST',
data: getData.call(this, event),
success: (applePayShippingContactUpdate, textStatus, jqXHR) => {
let response = applePayShippingContactUpdate.data
this.updatedContactInfo = event.shippingContact
@ -255,7 +335,7 @@ console.log(buttonConfig)
data: {
action: 'ppcp_create_order',
'product_id': productId,
'product_quantity': productQuantity,
'product_quantity': this.productQuantity,
'shipping_contact': shippingContact,
'billing_contact': billingContact,
'token': event.payment.token,
@ -290,7 +370,7 @@ console.log(buttonConfig)
}
createOrderInPayPal([], []).then((orderId) => {
console.log('createOrderInPayPal', orderId)
applepay.confirmOrder(
paypal.Applepay().confirmOrder(
{
orderId: orderId,
token: event.payment.token,

View file

@ -45,7 +45,7 @@ return array(
} catch ( \Exception $e ) {
return false;
}
return $settings->get( 'applepay_validated' ) === 'yes';
return $settings->get( 'applepay_validated' ) === true;
},
'applepay.url' => static function ( ContainerInterface $container ): string {
$path = realpath( __FILE__ );
@ -61,7 +61,7 @@ return array(
return 'https://applepay.cdn-apple.com/jsapi/v1/apple-pay-sdk.js';
},
'applepay.data_to_scripts' => static function ( ContainerInterface $container ): DataToAppleButtonScripts {
return new DataToAppleButtonScripts($container->get( 'applepay.sdk_script_url' ));
return new DataToAppleButtonScripts($container->get( 'applepay.sdk_script_url' ), $container->get( 'wcgateway.settings' ));
},
'applepay.button' => static function ( ContainerInterface $container ): ApplePayButton {

View file

@ -104,21 +104,23 @@ class ApplepayModule implements ModuleInterface {
}
/**
* Loads the validation file.
* Loads the validation string.
*
* @param boolean $is_sandbox The environment for this merchant.
*/
protected function load_domain_association_file( $is_sandbox ): void {
protected function load_domain_association_file(bool $is_sandbox, $settings ): void {
if ( ! isset( $_SERVER['REQUEST_URI'] ) ) {
return;
}
$request_uri = (string) filter_var( wp_unslash( $_SERVER['REQUEST_URI'] ), FILTER_SANITIZE_URL );
if ( strpos( $request_uri, '.well-known/apple-developer-merchantid-domain-association' ) !== false ) {
$validation_string = $is_sandbox ? 'apple-developer-merchantid-domain-association-sandbox' : 'apple-developer-merchantid-domain-association';
$validation_file = file_get_contents( __DIR__ . '/../assets/validation_files/' . $validation_string );
$validation_string = $is_sandbox ? 'applepay_sandbox_validation_file' : 'applepay_live_validation_file';
$validation_string = $settings->has( $validation_string ) ? $settings->get( $validation_string ) : '';
$validation_string = preg_replace( '/\s+/', '', $validation_string );
$validation_string = $validation_string ? preg_replace( '/[^a-zA-Z0-9]/', '', $validation_string ) : '';
nocache_headers();
header( 'Content-Type: text/plain', true, 200 );
echo $validation_file;// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
echo $validation_string;// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
exit;
}
}
@ -163,7 +165,7 @@ class ApplepayModule implements ModuleInterface {
*
* @var ButtonInterface $button
*/
$button->render_buttons();
$button->render();
}
);
}
@ -213,6 +215,7 @@ class ApplepayModule implements ModuleInterface {
$env = $c->get('onboarding.environment');
assert($env instanceof Environment);
$is_sandobx = $env->current_environment_is(Environment::SANDBOX);
$this->load_domain_association_file($is_sandobx);
$settings = $c->get('wcgateway.settings');
$this->load_domain_association_file($is_sandobx, $settings);
}
}

View file

@ -194,6 +194,14 @@ class ApplePayButton implements ButtonInterface {
* Adds all the Ajax actions to perform the whole workflow
*/
public function bootstrap_ajax_request(): void {
add_action(
'wp_ajax_' . PropertiesDictionary::VALIDATE,
array( $this, 'validate' )
);
add_action(
'wp_ajax_nopriv_' . PropertiesDictionary::VALIDATE,
array( $this, 'validate' )
);
add_action(
'wp_ajax_' . PropertiesDictionary::CREATE_ORDER,
array( $this, 'create_wc_order' )
@ -228,6 +236,23 @@ class ApplePayButton implements ButtonInterface {
);
}
/**
* Method to validate the merchant in the db flag
* On fail triggers and option that shows an admin notice showing the error
* On success removes such flag
*/
public function validate()
{
$applepay_request_data_object = $this->applepay_data_object_http();
if (!$this->is_nonce_valid()) {
return;
}
$applepay_request_data_object->validation_data();
$settings = $this->settings;
$settings->set('applepay_validated', $applepay_request_data_object->validated_flag());
wp_send_json_success();
}
/**
* Method to validate and update the shipping contact of the user
* It updates the amount paying information if needed
@ -817,7 +842,7 @@ class ApplePayButton implements ButtonInterface {
);
}
public function render_buttons(): bool
public function render(): bool
{
$is_applepay_button_enabled = $this->settings->has( 'applepay_button_enabled' ) ? $this->settings->get( 'applepay_button_enabled' ) : false;
@ -944,4 +969,9 @@ class ApplePayButton implements ButtonInterface {
{
return $this->script_data->apple_pay_script_data();
}
public function is_enabled(): bool
{
// TODO: Implement is_enabled() method.
}
}

View file

@ -20,9 +20,16 @@ class DataToAppleButtonScripts {
* @var string
*/
private $sdk_url;
/**
* The settings.
*
* @var array
*/
private $settings;
public function __construct($sdk_url) {
public function __construct($sdk_url, $settings) {
$this->sdk_url = $sdk_url;
$this->settings = $settings;
}
/**
@ -44,14 +51,12 @@ class DataToAppleButtonScripts {
$total_label
);
}
if ( is_cart() || $is_block ) {
return $this->data_for_cart_page(
$shop_country_code,
$currency_code,
$total_label
);
}
return array();
return $this->data_for_cart_page(
$shop_country_code,
$currency_code,
$total_label
);
}
/**
@ -103,12 +108,18 @@ class DataToAppleButtonScripts {
$product_id = get_the_id();
$product_price = $product->get_price();
$product_stock = $product->get_stock_status();
$type = $this->settings->get('applepay_button_type');
$color = $this->settings->get('applepay_button_color');
$lang = $this->settings->get('applepay_button_language');
return array(
'sdk_url' => $this->sdk_url,
'button' => array(
'wrapper' => '#applepay-container',
'mini_cart_wrapper' => '#applepay-container-minicart',
'type' => $type,
'color' => $color,
'lang' => $lang,
),
'product' => array(
'needShipping' => $product_need_shipping,
@ -147,6 +158,10 @@ class DataToAppleButtonScripts {
. '</div>';
return array(
'sdk_url' => $this->sdk_url,
'button' => array(
'wrapper' => '#applepay-container',
'mini_cart_wrapper' => '#applepay-container-minicart',
),
'product' => array(
'needShipping' => $cart->needs_shipping(),
'subtotal' => $cart->get_subtotal(),

View file

@ -12,7 +12,8 @@ namespace WooCommerce\PayPalCommerce\Applepay\Assets;
/**
* Class PropertiesDictionary
*/
class PropertiesDictionary {
class PropertiesDictionary
{
public const BILLING_CONTACT_INVALID = 'billing Contact Invalid';
@ -99,4 +100,89 @@ class PropertiesDictionary {
public const CREATE_ORDER_CART = 'ppcp_create_order_cart';
public const REDIRECT = 'ppcp_redirect';
public const VALIDATE = 'ppcp_validate';
/**
* Returns the possible list of button colors.
*
* @return array
*/
public static function button_colors(): array
{
return array(
'white' => __('White', 'woocommerce-paypal-payments'),
'black' => __('Black', 'woocommerce-paypal-payments'),
'white-outline' => __('White with outline', 'woocommerce-paypal-payments'),
);
}
/**
* Returns the possible list of button types.
*
* @return array
*/
public static function button_types(): array
{
return array(
'book' => __('Book', 'woocommerce-paypal-payments'),
'buy' => __('Buy', 'woocommerce-paypal-payments'),
'check-out' => __('Checkout', 'woocommerce-paypal-payments'),
'donate' => __('Donate', 'woocommerce-paypal-payments'),
'order' => __('Order', 'woocommerce-paypal-payments'),
'pay' => __('Pay', 'woocommerce-paypal-payments'),
'plain' => __('Plain', 'woocommerce-paypal-payments'),
'subscribe' => __('Book', 'woocommerce-paypal-payments'),
);
}
/**
* Returns the possible list of button languages.
*
* @return array
*/
public static function button_languages(): array
{
return array(
"ar-AB" => __('Arabic', 'woocommerce-paypal-payments'),
"ca-ES" => __('Catalan', 'woocommerce-paypal-payments'),
"cs-CZ" => __('Czech', 'woocommerce-paypal-payments'),
"da-DK" => __('Danish', 'woocommerce-paypal-payments'),
"de-DE" => __('German', 'woocommerce-paypal-payments'),
"el-GR" => __('Greek', 'woocommerce-paypal-payments'),
"en-AU" => __('English (Australia)', 'woocommerce-paypal-payments'),
"en-GB" => __('English (United Kingdom)', 'woocommerce-paypal-payments'),
"en-US" => __('English (United States)', 'woocommerce-paypal-payments'),
"es-ES" => __('Spanish (Spain)', 'woocommerce-paypal-payments'),
"es-MX" => __('Spanish (Mexico)', 'woocommerce-paypal-payments'),
"fi-FI" => __('Finnish', 'woocommerce-paypal-payments'),
"fr-CA" => __('French (Canada)', 'woocommerce-paypal-payments'),
"fr-FR" => __('French (France)', 'woocommerce-paypal-payments'),
"he-IL" => __('Hebrew', 'woocommerce-paypal-payments'),
"hi-IN" => __('Hindi', 'woocommerce-paypal-payments'),
"hr-HR" => __('Croatian', 'woocommerce-paypal-payments'),
"hu-HU" => __('Hungarian', 'woocommerce-paypal-payments'),
"id-ID" => __('Indonesian', 'woocommerce-paypal-payments'),
"it-IT" => __('Italian', 'woocommerce-paypal-payments'),
"ja-JP" => __('Japanese', 'woocommerce-paypal-payments'),
"ko-KR" => __('Korean', 'woocommerce-paypal-payments'),
"ms-MY" => __('Malay', 'woocommerce-paypal-payments'),
"nb-NO" => __('Norwegian', 'woocommerce-paypal-payments'),
"nl-NL" => __('Dutch', 'woocommerce-paypal-payments'),
"pl-PL" => __('Polish', 'woocommerce-paypal-payments'),
"pt-BR" => __('Portuguese (Brazil)', 'woocommerce-paypal-payments'),
"pt-PT" => __('Portuguese (Portugal)', 'woocommerce-paypal-payments'),
"ro-RO" => __('Romanian', 'woocommerce-paypal-payments'),
"ru-RU" => __('Russian', 'woocommerce-paypal-payments'),
"sk-SK" => __('Slovak', 'woocommerce-paypal-payments'),
"sv-SE" => __('Swedish', 'woocommerce-paypal-payments'),
"th-TH" => __('Thai', 'woocommerce-paypal-payments'),
"tr-TR" => __('Turkish', 'woocommerce-paypal-payments'),
"uk-UA" => __('Ukrainian', 'woocommerce-paypal-payments'),
"vi-VN" => __('Vietnamese', 'woocommerce-paypal-payments'),
"zh-CN" => __('Chinese (Simplified)', 'woocommerce-paypal-payments'),
"zh-HK" => __('Chinese (Hong Kong)', 'woocommerce-paypal-payments'),
"zh-TW" => __('Chinese (Traditional)', 'woocommerce-paypal-payments'),
);
}
}