mirror of
https://github.com/woocommerce/woocommerce-paypal-payments.git
synced 2025-09-05 08:59:14 +08:00
Insights preparation.
This commit is contained in:
parent
2f1c36af40
commit
9bf23550dd
9 changed files with 92 additions and 24 deletions
|
@ -39,7 +39,7 @@ class ApplepayButton {
|
|||
|
||||
this.log = function() {
|
||||
if ( this.buttonConfig.is_debug ) {
|
||||
console.log('[ApplePayButton]', ...arguments);
|
||||
//console.log('[ApplePayButton]', ...arguments);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -88,6 +88,8 @@ return array(
|
|||
->action_visible( 'axo_email_widget' )
|
||||
->action_visible( 'axo_address_widget' )
|
||||
->action_visible( 'axo_payment_widget' )
|
||||
->action_visible( 'axo_privacy' )
|
||||
->action_visible( 'axo_style_heading' )
|
||||
->action_class( 'axo_enabled', 'active' )
|
||||
->to_array(),
|
||||
$display_manager
|
||||
|
@ -104,9 +106,9 @@ return array(
|
|||
->action_visible( 'axo_style_input_bg_color' )
|
||||
->action_visible( 'axo_style_input_border_radius' )
|
||||
->action_visible( 'axo_style_input_border_color' )
|
||||
->action_visible( 'axo_style_root_border_width' )
|
||||
->action_visible( 'axo_style_root_text_color_base' )
|
||||
->action_visible( 'axo_style_root_focus_border_color' )
|
||||
->action_visible( 'axo_style_input_border_width' )
|
||||
->action_visible( 'axo_style_input_text_color_base' )
|
||||
->action_visible( 'axo_style_input_focus_border_color' )
|
||||
->to_array(),
|
||||
)
|
||||
),
|
||||
|
@ -352,7 +354,7 @@ return array(
|
|||
'requirements' => array(),
|
||||
'gateway' => 'dcc',
|
||||
),
|
||||
'axo_style_root_border_width' => array(
|
||||
'axo_style_input_border_width' => array(
|
||||
'title' => __( 'Border Width', 'woocommerce-paypal-payments' ),
|
||||
'type' => 'text',
|
||||
'classes' => array( 'ppcp-field-indent' ),
|
||||
|
@ -362,7 +364,7 @@ return array(
|
|||
'requirements' => array(),
|
||||
'gateway' => 'dcc',
|
||||
),
|
||||
'axo_style_root_text_color_base' => array(
|
||||
'axo_style_input_text_color_base' => array(
|
||||
'title' => __( 'Text Color Base', 'woocommerce-paypal-payments' ),
|
||||
'type' => 'text',
|
||||
'classes' => array( 'ppcp-field-indent' ),
|
||||
|
@ -372,7 +374,7 @@ return array(
|
|||
'requirements' => array(),
|
||||
'gateway' => 'dcc',
|
||||
),
|
||||
'axo_style_root_focus_border_color' => array(
|
||||
'axo_style_input_focus_border_color' => array(
|
||||
'title' => __( 'Focus Border Color', 'woocommerce-paypal-payments' ),
|
||||
'type' => 'text',
|
||||
'classes' => array( 'ppcp-field-indent' ),
|
||||
|
|
|
@ -4,6 +4,7 @@ import DomElementCollection from "./Components/DomElementCollection";
|
|||
import ShippingView from "./Views/ShippingView";
|
||||
import BillingView from "./Views/BillingView";
|
||||
import CardView from "./Views/CardView";
|
||||
import PayPalInsights from "./Insights/PayPalInsights";
|
||||
|
||||
class AxoManager {
|
||||
|
||||
|
@ -55,10 +56,44 @@ class AxoManager {
|
|||
console.log(this);
|
||||
return this;
|
||||
}
|
||||
|
||||
if (
|
||||
this.axoConfig?.insights?.enabled
|
||||
&& this.axoConfig?.insights?.client_id
|
||||
&& this.axoConfig?.insights?.session_id
|
||||
) {
|
||||
PayPalInsights.config(this.axoConfig?.insights?.client_id, { debug: true });
|
||||
PayPalInsights.setSessionId(this.axoConfig?.insights?.session_id);
|
||||
PayPalInsights.trackJsLoad();
|
||||
|
||||
if (document.querySelector('.woocommerce-checkout')) {
|
||||
PayPalInsights.trackBeginCheckout({
|
||||
amount: this.axoConfig?.insights?.amount,
|
||||
page_type: 'checkout',
|
||||
user_data: {
|
||||
country: 'US',
|
||||
is_store_member: false,
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
registerEventHandlers() {
|
||||
|
||||
jQuery(document).on('change', 'input[name=payment_method]', (ev) => {
|
||||
const map = {
|
||||
'ppcp-axo-gateway': 'card',
|
||||
'ppcp-gateway': 'paypal',
|
||||
}
|
||||
|
||||
PayPalInsights.trackSelectPaymentMethod({
|
||||
payment_method_selected: map[ev.target.value] || 'other',
|
||||
page_type: 'checkout'
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
// Listen to Gateway Radio button changes.
|
||||
this.el.gatewayRadioButton.on('change', (ev) => {
|
||||
if (ev.target.checked) {
|
||||
|
@ -83,7 +118,7 @@ class AxoManager {
|
|||
if (this.status.hasProfile) {
|
||||
const { selectionChanged, selectedAddress } = await this.fastlane.profile.showShippingAddressSelector();
|
||||
|
||||
console.log('selectedAddress', selectedAddress);
|
||||
//console.log('selectedAddress', selectedAddress);
|
||||
|
||||
if (selectionChanged) {
|
||||
this.setShipping(selectedAddress);
|
||||
|
@ -103,11 +138,11 @@ class AxoManager {
|
|||
this.el.changeCardLink.on('click', async () => {
|
||||
const response = await this.fastlane.profile.showCardSelector();
|
||||
|
||||
console.log('card response', response);
|
||||
//console.log('card response', response);
|
||||
|
||||
if (response.selectionChanged) {
|
||||
|
||||
console.log('response.selectedCard.paymentToken', response.selectedCard.paymentToken);
|
||||
//console.log('response.selectedCard.paymentToken', response.selectedCard.paymentToken);
|
||||
|
||||
this.setCard(response.selectedCard);
|
||||
this.setBilling({
|
||||
|
@ -478,6 +513,15 @@ class AxoManager {
|
|||
this.data.email = this.emailInput.value;
|
||||
this.billingView.setData(this.data);
|
||||
|
||||
if (!this.fastlane.identity) {
|
||||
log('Not initialized.');
|
||||
return;
|
||||
}
|
||||
|
||||
PayPalInsights.trackSubmitCheckoutEmail({
|
||||
page_type: 'checkout'
|
||||
});
|
||||
|
||||
const lookupResponse = await this.fastlane.identity.lookupCustomerByEmail(this.emailInput.value);
|
||||
|
||||
if (lookupResponse.customerContextId) {
|
||||
|
@ -499,7 +543,7 @@ class AxoManager {
|
|||
});
|
||||
this.setCard(authResponse.profileData.card);
|
||||
|
||||
console.log('authResponse', authResponse);
|
||||
//console.log('authResponse', authResponse);
|
||||
|
||||
this.setStatus('validEmail', true);
|
||||
this.setStatus('hasProfile', true);
|
||||
|
@ -522,7 +566,7 @@ class AxoManager {
|
|||
this.setStatus('validEmail', true);
|
||||
this.setStatus('hasProfile', false);
|
||||
|
||||
console.log('this.cardComponentData()', this.cardComponentData());
|
||||
//console.log('this.cardComponentData()', this.cardComponentData());
|
||||
|
||||
this.cardComponent = await this.fastlane
|
||||
.FastlaneCardComponent(
|
||||
|
@ -620,6 +664,16 @@ class AxoManager {
|
|||
|
||||
this.el.axoNonceInput.get().value = nonce;
|
||||
|
||||
PayPalInsights.trackEndCheckout({
|
||||
amount: this.axoConfig?.insights?.amount,
|
||||
page_type: 'checkout',
|
||||
payment_method_selected: 'card',
|
||||
user_data: {
|
||||
country: 'US',
|
||||
is_store_member: false,
|
||||
}
|
||||
});
|
||||
|
||||
this.el.defaultSubmitButton.click();
|
||||
}
|
||||
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
|
||||
export function log(...args) {
|
||||
console.log('[AXO] ', ...args);
|
||||
//console.log('[AXO] ', ...args);
|
||||
}
|
||||
|
|
|
@ -11,43 +11,46 @@ class PayPalInsights {
|
|||
/**
|
||||
* @returns {PayPalInsights}
|
||||
*/
|
||||
static getInstance() {
|
||||
static init() {
|
||||
if (!PayPalInsights.instance) {
|
||||
PayPalInsights.instance = new PayPalInsights();
|
||||
}
|
||||
return PayPalInsights.instance;
|
||||
}
|
||||
|
||||
track(eventName, data) {
|
||||
static track(eventName, data) {
|
||||
PayPalInsights.init();
|
||||
paypalInsight('event', eventName, data);
|
||||
}
|
||||
|
||||
static config (clientId, data) {
|
||||
PayPalInsights.init();
|
||||
paypalInsight('config', clientId, data);
|
||||
}
|
||||
|
||||
static setSessionId (sessionId) {
|
||||
PayPalInsights.init();
|
||||
paypalInsight('set', { session_id: sessionId });
|
||||
}
|
||||
|
||||
static trackJsLoad () {
|
||||
PayPalInsights.getInstance().track('js_load', { timestamp: Date.now() });
|
||||
PayPalInsights.track('js_load', { timestamp: Date.now() });
|
||||
}
|
||||
|
||||
static trackBeginCheckout (data) {
|
||||
PayPalInsights.getInstance().track('begin_checkout', data);
|
||||
PayPalInsights.track('begin_checkout', data);
|
||||
}
|
||||
|
||||
static trackSubmitCheckoutEmail (data) {
|
||||
PayPalInsights.getInstance().track('submit_checkout_email', data);
|
||||
PayPalInsights.track('submit_checkout_email', data);
|
||||
}
|
||||
|
||||
static trackSelectPaymentMethod (data) {
|
||||
PayPalInsights.getInstance().track('select_payment_method', data);
|
||||
PayPalInsights.track('select_payment_method', data);
|
||||
}
|
||||
|
||||
static trackEndCheckout (data) {
|
||||
PayPalInsights.getInstance().track('end_checkout', data);
|
||||
PayPalInsights.track('end_checkout', data);
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
@ -16,7 +16,7 @@ class BillingView {
|
|||
const selectElement = document.querySelector(selectSelector);
|
||||
|
||||
if (!selectElement) {
|
||||
return ${key};
|
||||
return key;
|
||||
}
|
||||
|
||||
const option = selectElement.querySelector(`option[value="${key}"]`);
|
||||
|
|
|
@ -16,7 +16,7 @@ class ShippingView {
|
|||
const selectElement = document.querySelector(selectSelector);
|
||||
|
||||
if (!selectElement) {
|
||||
return ${key};
|
||||
return key;
|
||||
}
|
||||
|
||||
const option = selectElement.querySelector(`option[value="${key}"]`);
|
||||
|
@ -88,7 +88,7 @@ class ShippingView {
|
|||
'valuePath': null,
|
||||
},
|
||||
phone: {
|
||||
'selector': '#billing_phone_field', // There is no shipping phone field.
|
||||
//'selector': '#billing_phone_field', // There is no shipping phone field.
|
||||
'valueCallback': function (data) {
|
||||
let phone = '';
|
||||
const cc = data?.shipping?.phoneNumber?.countryCode;
|
||||
|
|
|
@ -160,6 +160,15 @@ class AxoManager {
|
|||
'address' => $address_widget ?: 'render',
|
||||
'payment' => $payment_widget ?: 'render',
|
||||
),
|
||||
'insights' => array(
|
||||
'enabled' => true,
|
||||
'client_id' => ( $this->settings->has( 'client_id' ) ? $this->settings->get( 'client_id' ) : null ),
|
||||
'session_id' => substr( md5( WC()->session->get_customer_unique_id() ), 0, 16 ),
|
||||
'amount' => array(
|
||||
'currency_code' => get_woocommerce_currency(),
|
||||
'value' => WC()->cart->get_total( 'numeric' )
|
||||
)
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
|
|
|
@ -28,7 +28,7 @@ class GooglepayButton {
|
|||
|
||||
this.log = function() {
|
||||
if ( this.buttonConfig.is_debug ) {
|
||||
console.log('[GooglePayButton]', ...arguments);
|
||||
//console.log('[GooglePayButton]', ...arguments);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue