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
|
@ -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;
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue