@palta-brain/web-sdk
Version:
577 lines • 35.4 kB
JavaScript
;
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
};
var __generator = (this && this.__generator) || function (thisArg, body) {
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
function verb(n) { return function (v) { return step([n, v]); }; }
function step(op) {
if (f) throw new TypeError("Generator is already executing.");
while (g && (g = 0, op[0] && (_ = 0)), _) try {
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
if (y = 0, t) op = [op[0] & 2, t.value];
switch (op[0]) {
case 0: case 1: t = op; break;
case 4: _.label++; return { value: op[1], done: false };
case 5: _.label++; y = op[1]; op = [0]; continue;
case 7: op = _.ops.pop(); _.trys.pop(); continue;
default:
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
if (t[2]) _.ops.pop();
_.trys.pop(); continue;
}
op = body.call(thisArg, _);
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
}
};
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
if (ar || !(i in from)) {
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
ar[i] = from[i];
}
}
return to.concat(ar || Array.prototype.slice.call(from));
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.BraintreeCheckoutInit = exports.getApplePayHandler = exports.getPaymentHandler = exports.createApplePaySession = exports.setupCardButton = exports.createHostedFieldsInstance = exports.getPayPalFunc = exports.setupPayPalButton = exports.loadPayPalSDKWrapper = exports.createPayPalCheckoutInstance = void 0;
var type_1 = require("../type");
var hosted_fields_1 = require("braintree-web/hosted-fields");
var client_1 = require("braintree-web/client");
var apple_pay_1 = require("braintree-web/apple-pay");
var data_collector_1 = require("braintree-web/data-collector");
var paypal_checkout_1 = require("braintree-web/paypal-checkout");
var three_d_secure_1 = require("braintree-web/three-d-secure");
var fetchDataCollectorInstance = function (clientInstance) {
return (0, data_collector_1.create)({
client: clientInstance,
kount: true,
});
};
var createPayPalCheckoutInstance = function (clientInstance) { return __awaiter(void 0, void 0, void 0, function () { return __generator(this, function (_a) {
return [2 /*return*/, (0, paypal_checkout_1.create)({ client: clientInstance })];
}); }); };
exports.createPayPalCheckoutInstance = createPayPalCheckoutInstance;
var loadPayPalSDKWrapper = function (_a) { return __awaiter(void 0, [_a], void 0, function (_b) {
var paymentStatus, paymentErrorStatus;
var paypalCheckoutInstance = _b.paypalCheckoutInstance, braintreeOption = _b.braintreeOption, payPalEnv = _b.payPalEnv, braintreeCheckoutFormSelector = _b.braintreeCheckoutFormSelector, onErrorCustom = _b.onErrorCustom, deviceData = _b.deviceData, api = _b.api;
return __generator(this, function (_c) {
paymentStatus = document.getElementById('payment-status');
paymentErrorStatus = document.getElementById('error-payment-status');
return [2 /*return*/, function (_a) { return __awaiter(void 0, [_a], void 0, function (_b) {
var currencyCode = _b.currencyCode, price = _b.price, orderId = _b.orderId;
return __generator(this, function (_c) {
switch (_c.label) {
case 0: return [4 /*yield*/, paypalCheckoutInstance.loadPayPalSDK({
currency: currencyCode,
intent: 'capture',
}, function () {
// @ts-ignore
var _this = this;
paypal
.Buttons({
fundingSource: 'paypal',
env: payPalEnv,
style: {
size: type_1.ButtonSizeOption.Responsive,
height: 40,
},
createOrder: function () {
braintreeOption.createOrder('PayPal, order created');
var updatedPrice = sessionStorage.getItem('updatedPrice');
var updatedCurrencyCode = sessionStorage.getItem('updatedCurrencyCode');
var braintreePrice = updatedPrice ? updatedPrice : price;
var braintreeCurrencyCode = updatedCurrencyCode
? updatedCurrencyCode
: currencyCode;
console.log('createOrder', braintreePrice, braintreeCurrencyCode);
return paypalCheckoutInstance.createPayment({
flow: type_1.FlowType.Checkout,
amount: braintreePrice,
currency: braintreeCurrencyCode,
intent: type_1.Intent.Capture,
requestBillingAgreement: true,
billingAgreementDescription: 'Description of the billing agreement to display to the customer',
});
},
// @ts-ignore;
onApprove: function (data) { return __awaiter(_this, void 0, void 0, function () {
var payload, updatedOrderId, braintreeOrderId, response, container, err_1;
return __generator(this, function (_a) {
switch (_a.label) {
case 0:
_a.trys.push([0, 3, , 4]);
return [4 /*yield*/, paypalCheckoutInstance.tokenizePayment(data)];
case 1:
payload = _a.sent();
console.log('Got a nonce:', payload.nonce);
braintreeOption.onBeforePaymentCreate('Braintree, before payment create');
updatedOrderId = sessionStorage.getItem('updatedOrderId') || '';
braintreeOrderId = updatedOrderId
? updatedOrderId
: orderId;
return [4 /*yield*/, api.createPayment({
integrationType: type_1.IntegrationTypeEnum.Braintree,
paymentToken: payload.nonce,
orderId: braintreeOrderId,
deviceData: deviceData,
})];
case 2:
response = _a.sent();
braintreeOption.createPayment('PayPal Created Payment');
if (response.status === type_1.PaymentStatus.success) {
container = document.getElementById(braintreeCheckoutFormSelector);
container.style.display = 'none';
paymentStatus.style.display = 'flex';
}
else {
paymentStatus.style.display = 'none';
paymentErrorStatus.style.display = 'flex';
}
return [3 /*break*/, 4];
case 3:
err_1 = _a.sent();
paymentStatus.style.display = 'none';
paymentErrorStatus.style.display = 'flex';
onErrorCustom(err_1, 'Paypal on approve error');
console.error('Error:', err_1);
return [3 /*break*/, 4];
case 4: return [2 /*return*/];
}
});
}); },
onCancel: function (data) {
braintreeOption.onCancel('PayPal onCancel');
console.log('Checkout cancelled', data);
},
onError: function (err) {
var container = document.getElementById(braintreeCheckoutFormSelector);
container.style.display = 'none';
paymentStatus.style.display = 'none';
paymentErrorStatus.style.display = 'flex';
console.error('Error:', err);
onErrorCustom(err, 'Paypal on error');
},
})
.render('#paypal-button');
})];
case 1: return [2 /*return*/, _c.sent()];
}
});
}); }];
});
}); };
exports.loadPayPalSDKWrapper = loadPayPalSDKWrapper;
var payPalFunc = null;
var setupPayPalButton = function (paypalCheckoutInstance_1, deviceData_1, api_1, orderId_1, onErrorCustom_1, price_1, currencyCode_1, braintreeCheckoutFormSelector_1) {
var args_1 = [];
for (var _i = 8; _i < arguments.length; _i++) {
args_1[_i - 8] = arguments[_i];
}
return __awaiter(void 0, __spreadArray([paypalCheckoutInstance_1, deviceData_1, api_1, orderId_1, onErrorCustom_1, price_1, currencyCode_1, braintreeCheckoutFormSelector_1], args_1, true), void 0, function (paypalCheckoutInstance, deviceData, api, orderId, onErrorCustom, price, currencyCode, braintreeCheckoutFormSelector, payPalEnv, braintreeOption) {
if (payPalEnv === void 0) { payPalEnv = 'production'; }
return __generator(this, function (_a) {
switch (_a.label) {
case 0: return [4 /*yield*/, (0, exports.loadPayPalSDKWrapper)({
paypalCheckoutInstance: paypalCheckoutInstance,
braintreeOption: braintreeOption,
payPalEnv: payPalEnv,
braintreeCheckoutFormSelector: braintreeCheckoutFormSelector,
onErrorCustom: onErrorCustom,
deviceData: deviceData,
api: api,
})];
case 1:
payPalFunc = _a.sent();
return [4 /*yield*/, payPalFunc({ currencyCode: currencyCode, price: price, orderId: orderId })];
case 2:
_a.sent();
return [2 /*return*/];
}
});
});
};
exports.setupPayPalButton = setupPayPalButton;
function getPayPalFunc() {
if (!payPalFunc) {
throw new Error('payPalFunc is not initialized. Please call initializePayPalFunc first.');
}
return payPalFunc;
}
exports.getPayPalFunc = getPayPalFunc;
var createHostedFieldsInstance = function (clientInstance, braintreeStyles) { return __awaiter(void 0, void 0, void 0, function () {
var defaultStyles, styles;
return __generator(this, function (_a) {
defaultStyles = {
input: {
'font-size': '14px',
'font-family': 'Arial, sans-serif',
},
':focus': {
color: 'black',
},
};
styles = __assign(__assign({}, defaultStyles), braintreeStyles);
return [2 /*return*/, (0, hosted_fields_1.create)({
client: clientInstance,
styles: styles,
fields: {
number: {
selector: '#card-number',
placeholder: '4111 1111 1111 1111',
},
cvv: {
selector: '#cvv',
placeholder: '123',
},
expirationDate: {
selector: '#expiration-date',
placeholder: 'MM/YYYY',
},
},
})];
});
}); };
exports.createHostedFieldsInstance = createHostedFieldsInstance;
var makeBtnAlive = function (btn, text) {
btn.disabled = false;
btn.innerHTML = text;
btn.style.cursor = 'pointer';
btn.style.opacity = '1';
};
var currentVerificationProcess = null;
var handleButtonClick;
var handlerApplePay;
var paymentHandler = null;
var applePayHandler = null;
var setupCardButton = function (_a) { return __awaiter(void 0, [_a], void 0, function (_b) {
var hostedFieldsInstance = _b.hostedFieldsInstance, deviceData = _b.deviceData, api = _b.api, onErrorCustom = _b.onErrorCustom, braintreeCheckoutFormSelector = _b.braintreeCheckoutFormSelector, braintreeOption = _b.braintreeOption;
return __generator(this, function (_c) {
return [2 /*return*/, function (_a) { return __awaiter(void 0, [_a], void 0, function (_b) {
var cardButton, cardBtnInnerText, paymentStatus, paymentErrorStatus, container;
var amount = _b.amount, orderId = _b.orderId, threeDSecureInstance = _b.threeDSecureInstance;
return __generator(this, function (_c) {
cardButton = document.getElementById('card-button');
cardBtnInnerText = cardButton.innerText;
paymentStatus = document.getElementById('payment-status');
paymentErrorStatus = document.getElementById('error-payment-status');
container = document.getElementById(braintreeCheckoutFormSelector);
if (handleButtonClick) {
cardButton.removeEventListener('click', handleButtonClick);
}
handleButtonClick = function (event) { return __awaiter(void 0, void 0, void 0, function () {
var _a, nonce, details, threeDSecureParameters, threeDSecureResponse, response, updatedOrderId, braintreeOrderId, data, err_2;
return __generator(this, function (_b) {
switch (_b.label) {
case 0:
event.preventDefault();
cardButton.disabled = true;
cardButton.innerText = 'Loading...';
cardButton.style.cursor = 'default';
cardButton.style.opacity = '0.5';
_b.label = 1;
case 1:
_b.trys.push([1, 6, 7, 8]);
// Cancel any ongoing verification process
if (currentVerificationProcess) {
console.log('Canceling ongoing authentication process.');
// Logic to cancel the ongoing process, if supported
// (if not, just skip to starting a new process)
currentVerificationProcess = null;
}
return [4 /*yield*/, hostedFieldsInstance.tokenize()];
case 2:
_a = _b.sent(), nonce = _a.nonce, details = _a.details;
braintreeOption.onBeforePaymentCreate('Braintree, before payment create');
threeDSecureParameters = {
amount: amount,
nonce: nonce,
bin: details.bin,
collectDeviceData: true,
onLookupComplete: function (data, next) {
braintreeOption.threeDSecureOnLookupComplete('3DS lookup data:', data);
console.log('3DS lookup data:', data);
next();
},
};
currentVerificationProcess = threeDSecureInstance.verifyCard(threeDSecureParameters);
return [4 /*yield*/, currentVerificationProcess];
case 3:
threeDSecureResponse = _b.sent();
nonce = threeDSecureResponse.nonce;
response = { status: '' };
if (!type_1.threeDStatuses.includes(threeDSecureResponse.threeDSecureInfo.status)) return [3 /*break*/, 5];
updatedOrderId = sessionStorage.getItem('updatedOrderId');
braintreeOrderId = updatedOrderId ? updatedOrderId : orderId;
data = {
integrationType: type_1.IntegrationTypeEnum.Braintree,
paymentToken: nonce,
orderId: braintreeOrderId,
deviceData: deviceData,
};
return [4 /*yield*/, api.createPayment(data)];
case 4:
response = _b.sent();
_b.label = 5;
case 5:
if (response.status === type_1.PaymentStatus.success) {
braintreeOption.createPayment("Card created payment ".concat(type_1.PaymentStatus.success));
container.style.display = 'none';
if (paymentStatus) {
paymentStatus.style.display = 'flex';
paymentErrorStatus.style.display = 'none';
}
}
else {
makeBtnAlive(cardButton, cardBtnInnerText);
onErrorCustom({}, 'Error creating card payment');
if (paymentStatus) {
paymentStatus.style.display = 'none';
}
if (paymentErrorStatus) {
paymentErrorStatus.style.display = 'flex';
}
}
return [3 /*break*/, 8];
case 6:
err_2 = _b.sent();
makeBtnAlive(cardButton, cardBtnInnerText);
if (paymentStatus) {
paymentStatus.style.display = 'none';
}
if (paymentErrorStatus) {
paymentErrorStatus.style.display = 'flex';
}
console.error('Error tokenizing card:', err_2);
onErrorCustom(err_2, 'Error tokenizing card');
return [3 /*break*/, 8];
case 7:
makeBtnAlive(cardButton, cardBtnInnerText);
return [7 /*endfinally*/];
case 8: return [2 /*return*/];
}
});
}); };
cardButton === null || cardButton === void 0 ? void 0 : cardButton.addEventListener('click', handleButtonClick);
return [2 /*return*/];
});
}); }];
});
}); };
exports.setupCardButton = setupCardButton;
var createApplePaySession = function (clientInstance, paymentRequestData) { return __awaiter(void 0, void 0, void 0, function () {
return __generator(this, function (_a) {
// Create Apple Pay instance
return [2 /*return*/, function (_a) { return __awaiter(void 0, [_a], void 0, function (_b) {
var applePayBtn;
var total = _b.total, currencyCode = _b.currencyCode;
return __generator(this, function (_c) {
applePayBtn = document.querySelector('.apple-pay-button');
if (handlerApplePay) {
applePayBtn === null || applePayBtn === void 0 ? void 0 : applePayBtn.removeEventListener('click', handlerApplePay);
}
handlerApplePay = function (event) {
event.preventDefault();
(0, apple_pay_1.create)({
client: clientInstance,
}, function (applePayErr, applePayInstance) {
if (applePayErr) {
console.error('Error creating applePayInstance:', applePayErr);
return;
}
if (!applePayInstance) {
console.error('applePayInstance is undefined.');
return;
}
// Check if Apple Pay is supported
if (!window.ApplePaySession) {
console.error('Apple Pay is not supported on this device/browser.');
return;
}
console.log(total, currencyCode);
var data = __assign(__assign({}, paymentRequestData), { total: __assign(__assign({}, paymentRequestData.total), { amount: total }), currencyCode: currencyCode });
var paymentRequest = applePayInstance.createPaymentRequest(data);
// Create Apple Pay session
var session = new window.ApplePaySession(3, paymentRequest);
session.onpaymentmethodselected = function (event) {
// Define ApplePayPaymentMethodUpdate based on the selected payment method.
// No updates or errors are needed, pass an empty object.
var update = {};
// @ts-ignore
session.completePaymentMethodSelection(update);
};
session.onshippingcontactselected = function (event) {
// Define ApplePayShippingContactUpdate based on the selected shipping contact.
var update = {};
// @ts-ignore
session.completeShippingContactSelection(update);
};
// Handle successful payment authorization
session.onpaymentauthorized = function (event) {
applePayInstance.tokenize({
token: event.payment.token,
}, function (tokenizeErr, payload) {
if (tokenizeErr) {
console.error('Error tokenizing Apple Pay:', tokenizeErr);
if (window.ApplePaySession) {
session.completePayment(window.ApplePaySession.STATUS_FAILURE);
}
return;
}
// Send payload.nonce to your server for processing the payment
console.log('nonce:', payload === null || payload === void 0 ? void 0 : payload.nonce);
if (window.ApplePaySession) {
session.completePayment(window.ApplePaySession.STATUS_SUCCESS);
}
});
};
session.oncancel = function (event) {
// Payment canceled by WebKit
console.log('Payment was canceled', event);
};
// Start the Apple Pay session
session.begin();
});
};
applePayBtn === null || applePayBtn === void 0 ? void 0 : applePayBtn.addEventListener('click', handlerApplePay);
return [2 /*return*/];
});
}); }];
});
}); };
exports.createApplePaySession = createApplePaySession;
var getPaymentHandler = function () {
if (!paymentHandler) {
throw new Error('Payment handler is not initialized. Please call initializePaymentHandler first.');
}
return paymentHandler;
};
exports.getPaymentHandler = getPaymentHandler;
var getApplePayHandler = function () {
if (!applePayHandler) {
throw new Error('Payment handler is not initialized. Please call createApplePaySession first.');
}
return applePayHandler;
};
exports.getApplePayHandler = getApplePayHandler;
var BraintreeCheckoutInit = function (_a) { return __awaiter(void 0, [_a], void 0, function (_b) {
var updatedOrderId, updatedPrice, updatedCurrencyCode, braintreeOrderId, braintreePrice, braintreeCurrencyCode, clientInstance, data, threeDSecureInstance, dataCollectorInstance, deviceData, payPalButton, paypalCheckoutInstance, cardContainer, hostedFieldsInstance, error_1;
var _c;
var braintreeClientToken = _b.braintreeClientToken, paymentMethods = _b.paymentMethods, orderId = _b.orderId, api = _b.api, onErrorCustom = _b.onErrorCustom, price = _b.price, currencyCode = _b.currencyCode, braintreeCheckoutFormSelector = _b.braintreeCheckoutFormSelector, payPalEnv = _b.payPalEnv, braintreeOption = _b.braintreeOption;
return __generator(this, function (_d) {
switch (_d.label) {
case 0:
_d.trys.push([0, 14, , 15]);
updatedOrderId = sessionStorage.getItem('updatedOrderId');
updatedPrice = sessionStorage.getItem('updatedPrice');
updatedCurrencyCode = sessionStorage.getItem('updatedCurrencyCode');
braintreeOrderId = updatedOrderId ? updatedOrderId : orderId;
braintreePrice = updatedPrice ? updatedPrice : price;
braintreeCurrencyCode = updatedCurrencyCode
? updatedCurrencyCode
: currencyCode;
return [4 /*yield*/, (0, client_1.create)({
authorization: braintreeClientToken,
})];
case 1:
clientInstance = _d.sent();
if (!(window.ApplePaySession &&
window.ApplePaySession.supportsVersion(3) &&
window.ApplePaySession.canMakePayments())) return [3 /*break*/, 4];
data = braintreeOption.applePayOptions;
return [4 /*yield*/, (0, exports.createApplePaySession)(clientInstance, data)];
case 2:
applePayHandler = _d.sent();
return [4 /*yield*/, applePayHandler({
total: braintreeOption.applePayOptions.total.amount,
currencyCode: braintreeOption.applePayOptions.currencyCode,
})];
case 3:
_d.sent();
_d.label = 4;
case 4:
if (!window.ApplePaySession) {
console.warn('This device does not support Apple Pay');
}
if (!((_c = window === null || window === void 0 ? void 0 : window.ApplePaySession) === null || _c === void 0 ? void 0 : _c.canMakePayments())) {
console.warn('This device is not capable of making Apple Pay payments');
}
return [4 /*yield*/, (0, three_d_secure_1.create)({
version: 2,
client: clientInstance,
})];
case 5:
threeDSecureInstance = _d.sent();
return [4 /*yield*/, fetchDataCollectorInstance(clientInstance)];
case 6:
dataCollectorInstance = _d.sent();
deviceData = dataCollectorInstance.deviceData;
if (!(paymentMethods === null || paymentMethods === void 0 ? void 0 : paymentMethods.includes(type_1.PaymentMethodType.paypal))) return [3 /*break*/, 9];
payPalButton = document.getElementById('paypal-button');
payPalButton.style.display = 'block';
return [4 /*yield*/, (0, exports.createPayPalCheckoutInstance)(clientInstance)];
case 7:
paypalCheckoutInstance = _d.sent();
return [4 /*yield*/, (0, exports.setupPayPalButton)(paypalCheckoutInstance, deviceData, api, braintreeOrderId, onErrorCustom, braintreePrice, braintreeCurrencyCode, braintreeCheckoutFormSelector, payPalEnv, braintreeOption)];
case 8:
_d.sent();
_d.label = 9;
case 9:
if (!(paymentMethods === null || paymentMethods === void 0 ? void 0 : paymentMethods.includes(type_1.PaymentMethodType.card))) return [3 /*break*/, 13];
cardContainer = document.getElementById('card-container');
cardContainer.style.display = 'block';
return [4 /*yield*/, (0, exports.createHostedFieldsInstance)(clientInstance, braintreeOption.styles)];
case 10:
hostedFieldsInstance = _d.sent();
return [4 /*yield*/, (0, exports.setupCardButton)({
hostedFieldsInstance: hostedFieldsInstance,
deviceData: deviceData,
api: api,
onErrorCustom: onErrorCustom,
braintreeCheckoutFormSelector: braintreeCheckoutFormSelector,
braintreeOption: braintreeOption,
})];
case 11:
paymentHandler = _d.sent();
return [4 /*yield*/, paymentHandler({
amount: braintreePrice,
orderId: braintreeOrderId,
threeDSecureInstance: threeDSecureInstance,
})];
case 12:
_d.sent();
_d.label = 13;
case 13: return [2 /*return*/, clientInstance];
case 14:
error_1 = _d.sent();
onErrorCustom(error_1, 'Error initializing Braintree');
console.error('Error initializing Braintree:', error_1);
throw error_1;
case 15: return [2 /*return*/];
}
});
}); };
exports.BraintreeCheckoutInit = BraintreeCheckoutInit;
//# sourceMappingURL=index.js.map