// Create a client.
braintree.client.create({
    authorization: CLIENT_AUTHORIZATION
}, function (clientErr, clientInstance) {
    // Stop if there was a problem creating the client.
    // This could happen if there is a network error or if the authorization
    // is invalid.
    if (clientErr) {
        console.error('Error creating client:', clientErr);
        return;
    }
    // Create a data collector component.
braintree.dataCollector.create({
        client: clientInstance,
        paypal: true,
    }, function (dataCollectorErr, dataCollectorInstance) {
        // Stop if there was a problem creating the data collector component.
        // This could happen if there was a network error or if it's incorrectly
        // configured.
        if (dataCollectorErr) {
            console.error('Error creating data collector:', dataCollectorErr);
            return;
        }
        // Create a local payment component.
braintree.localPayment.create({
            client: clientInstance,
        }, function (localPaymentErr, localPaymentInstance) {
            // Stop if there was a problem creating the local payment component.
            // This could happen if there was a network error or if it's incorrectly
            // configured.
            if (localPaymentErr) {
                console.error('Error creating local payment:', localPaymentErr);
                return;
            }
            var correlationId = dataCollectorInstance.rawDeviceData.correlation_id;
            var puiButton = document.getElementById('pui-button');
            puiButton.addEventListener('click', function () {
                // Invoke PUI...
                localPaymentInstance.startPayment({
                    paymentType: 'pay_upon_invoice',
                    amount: '100.00',
                    currencyCode: 'EUR',
                    givenName: 'Max',
                    surname: 'Mustermann',
                    address: { // This is used as the shipping address.
                        streetAddress: 'Taunusanlage 12',
                        locality: 'Frankfurt',
                        postalCode: '60325',
                        countryCode: 'DE',
                    },
                    // PUI specific parameters
                    billingAddress: {
                        streetAddress: 'Schönhauser Allee 84',
                        locality: 'Berlin',
                        postalCode: '10439',
                        countryCode: 'DE'
                    },
                    birthDate: '1990-01-01',
                    email: 'buyer@example.com',
                    locale: 'en-DE',
                    customerServiceInstructions: 'Customer service phone is +49 6912345678.',
                    lineItems: [{
                        category: 'PHYSICAL_GOODS',
                        name: 'Basketball Shoes',
                        quantity: '1',
                        unitAmount: '81.00',
                        unitTaxAmount: '19.00',
                    }],
                    phone: '6912345678',
                    phoneCountryCode: '49',
                    correlationId: correlationId,
                    onPaymentStart: function (data) {
                        // NOTE: It is critical here to store data.paymentId on your server
                        // so it can be mapped to a webhook sent by Braintree once the
                        // buyer completes their payment.
                        console.log('Payment ID:', data.paymentId);
                    },
                }, function (startPaymentError) {
                    // Handle any error calling startPayment
                    console.error('Error!', startPaymentError);
                });
            });
        });
    });
});

{
  "local_payment_funded": {
    "payment_id": "the_payment_id",
    "payment_context_id": "the_payment_context_id",
    "transaction": {
      "id": "the_transaction_id",
      "amount": 1.00,
      "currency_iso_code": "EUR",
      "created_at": "2022-03-07",
      "order_id": "the_order_id",
      "status": "settled"
    }
  }
}

{
  "local_payment_expired": {
    "payment_id": "the_payment_id",
    "payment_context_id": "the_payment_context_id"
  }
}