Tracking purchases from any payment provider

<script>
  // Cromojo reads this when the page loads.
  window.cromojoPurchase = {
    // The order number. Each order is counted once.
    order_id: '1042',
    // The total paid, tax and shipping included, with a dot for decimals.
    amount: 69.00,
    // Your site's currency, as a three-letter code.
    currency: 'USD',
  };
</script>

// Only runs if the Cromojo tracking script has loaded.
window.CRMJ && CRMJ.trackPurchase({
  // The order number. Each order is counted once.
  order_id: '1042',
  // The total paid, tax and shipping included.
  amount: 69.00,
  // Your site's currency, as a three-letter code.
  currency: 'USD',
});

// Runs at the bottom of every page, but does nothing outside the order received page.
add_action( 'wp_footer', function () {
    // Makes sure the line is printed only once, even if the theme calls this twice.
    static $done = false;
    if ( $done || ! function_exists( 'is_order_received_page' ) || ! is_order_received_page() ) {
        return;
    }

    // Load the order from the page address.
    $order_id = absint( get_query_var( 'order-received' ) );
    $order    = $order_id ? wc_get_order( $order_id ) : false;

    // The order key proves this buyer placed the order. Failed payments are skipped.
    $key = isset( $_GET['key'] ) ? wc_clean( wp_unslash( $_GET['key'] ) ) : '';
    if ( ! $order || ! $order->key_is_valid( $key ) || $order->has_status( 'failed' ) ) {
        return;
    }
    $done = true;

    // The order number, the total paid (tax, shipping and coupons included) and the currency.
    $purchase = array(
        'order_id' => (string) $order->get_order_number(),
        'amount'   => wc_format_decimal( $order->get_total(), wc_get_price_decimals() ),
        'currency' => $order->get_currency(),
    );

    // Print the purchase line for Cromojo.
    echo '<script>window.cromojoPurchase = ' . wp_json_encode( $purchase ) . ';</script>';
} );

// Runs under the receipt table that Easy Digital Downloads shows.
add_action( 'edd_order_receipt_after_table', function ( $order ) {
    // Only on the purchase confirmation page, and only once.
    static $done = false;
    if ( $done || ! function_exists( 'edd_is_success_page' ) || ! edd_is_success_page() ) {
        return;
    }

    // Skip orders that didn't go through.
    if ( ! $order instanceof \EDD\Orders\Order || in_array( $order->status, array( 'failed', 'abandoned', 'revoked' ), true ) ) {
        return;
    }
    $done = true;

    // The order number, the total and the currency.
    $purchase = array(
        'order_id' => (string) $order->get_number(),
        'amount'   => (float) $order->total,
        'currency' => $order->currency,
    );

    // Print the purchase line for Cromojo.
    echo '<script>window.cromojoPurchase = ' . wp_json_encode( $purchase ) . ';</script>';
}, 10, 1 );

<script>
  window.cromojoPurchase = {
    // BigCommerce fills in the order number here.
    order_id: '%%ORDER_ID%%',
    // BigCommerce gives the total in cents, so divide by 100.
    amount: Number('%%ORDER_AMOUNT_IN_CENTS%%') / 100,
    // Type your store currency. BigCommerce has no variable for it here.
    currency: 'USD',
  };
</script>

{.if firstPageView}
<script>
  window.cromojoPurchase = {
    // Squarespace fills in the order number here.
    order_id: '{orderId}',
    // Squarespace gives the total in cents, so divide by 100.
    amount: Number('{orderGrandTotalCents}') / 100,
    // Type your store currency. Squarespace has no variable for it.
    currency: 'USD',
  };
</script>
{.end}

<script>
  (function () {
    // Listens for the Purchase event Wix sends from its Thank You page.
    function register() {
      window.wixDevelopersAnalytics.register('cromojoPurchase', function (eventName, data) {
        // Ignore every other Wix event.
        if (eventName !== 'Purchase' || !data || !data.orderId) return;

        // The order number, the total paid and the currency, as Wix sends them.
        var purchase = { order_id: String(data.orderId), amount: String(data.revenue), currency: data.currency };

        // Send it now if Cromojo is loaded, or leave it for Cromojo to pick up.
        if (window.CRMJ && window.CRMJ.trackPurchase) {
          window.CRMJ.trackPurchase(purchase);
        } else {
          window.cromojoPurchase = purchase;
        }
      });
    }

    // Wix may not be ready yet, so wait for it if needed.
    if (window.wixDevelopersAnalytics) {
      register();
    } else {
      window.addEventListener('wixDevelopersAnalyticsReady', register);
    }
  })();
</script>

<script>
(function () {
  // Webflow puts the order number in the page address.
  var orderId = new URLSearchParams(location.search).get('orderId');
  if (!orderId) return;

  // Turns a shown price like "$1,069.00" or "1.069,00 EUR" into "1069.00".
  function toAmount(text) {
    var t = text.replace(/[^0-9.,]/g, '');
    var lastComma = t.lastIndexOf(','), lastDot = t.lastIndexOf('.');
    if (lastComma > lastDot && t.length - lastComma <= 3) {
      t = t.replace(/\./g, '').replace(',', '.');
    } else {
      t = t.replace(/,/g, '');
    }
    return t;
  }

  // The total appears a moment after the page loads, so check a few times.
  var tries = 0;
  (function read() {
    // The element you gave the ID cromojo-total.
    var el = document.getElementById('cromojo-total');
    var text = el ? el.textContent.trim() : '';
    if (!/\d/.test(text)) {
      if (++tries < 40) setTimeout(read, 250);
      return;
    }

    // Replace USD with your store currency.
    window.cromojoPurchase = { order_id: orderId, amount: toAmount(text), currency: 'USD' };
  })();
})();
</script>

<script>
  // Waits until Ecwid has loaded on the page.
  (function waitForEcwid() {
    if (!window.Ecwid || !Ecwid.OnAPILoaded) { return setTimeout(waitForEcwid, 300); }

    Ecwid.OnAPILoaded.add(function () {
      // Runs once, when the buyer places an order.
      Ecwid.OnOrderPlaced.add(function (order) {
        // The order number customers see, and the total paid.
        var purchase = { order_id: String(order.vendorNumber || order.orderNumber), amount: String(order.total) };

        // Send it now if Cromojo is loaded, or leave it for Cromojo to pick up.
        if (window.CRMJ && CRMJ.trackPurchase) {
          CRMJ.trackPurchase(purchase);
        } else {
          window.cromojoPurchase = purchase;
        }
      });
    });
  })();
</script>

<?php
// registration.php: tells Magento this module exists.
\Magento\Framework\Component\ComponentRegistrar::register(
    \Magento\Framework\Component\ComponentRegistrar::MODULE, 'Cromojo_Purchase', __DIR__
);

<?xml version="1.0"?>
<!-- etc/module.xml: names the module, and loads it after Magento's checkout. -->
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd">
    <module name="Cromojo_Purchase"><sequence><module name="Magento_Checkout"/></sequence></module>
</config>

<?xml version="1.0"?>
<!-- view/frontend/layout/checkout_onepage_success.xml: applies only to the order success page. -->
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <!-- Adds our template at the end of the page. cacheable="false" keeps each buyer's own order. -->
        <referenceContainer name="before.body.end">
            <block name="cromojo.purchase" template="Cromojo_Purchase::purchase.phtml" cacheable="false">
                <arguments>
                    <!-- The class that reads the order (the next file). -->
                    <argument name="view_model" xsi:type="object">Cromojo\Purchase\ViewModel\Purchase</argument>
                </arguments>
            </block>
        </referenceContainer>
    </body>
</page>

<?php
// ViewModel/Purchase.php: reads the order the buyer just placed.
namespace Cromojo\Purchase\ViewModel;

use Magento\Checkout\Model\Session;
use Magento\Framework\View\Element\Block\ArgumentInterface;

class Purchase implements ArgumentInterface
{
    public function __construct(private Session $checkoutSession) {}

    public function getJson(): ?string
    {
        // The order from this buyer's checkout. Nothing is printed if there isn't one.
        $order = $this->checkoutSession->getLastRealOrder();
        if (!$order || !$order->getId()) {
            return null;
        }

        // The order number, the grand total and the currency the buyer paid in.
        return json_encode([
            'order_id' => (string) $order->getIncrementId(),
            'amount'   => round((float) $order->getGrandTotal(), 2),
            'currency' => $order->getOrderCurrencyCode(),
        ], JSON_HEX_TAG | JSON_HEX_AMP | JSON_HEX_APOS | JSON_HEX_QUOT);
    }
}

<?php
// view/frontend/templates/purchase.phtml: prints the purchase line.
/** @var \Magento\Framework\View\Element\Template $block */
/** @var \Magento\Framework\View\Helper\SecureHtmlRenderer $secureRenderer */
$json = $block->getData('view_model')->getJson();
if ($json) {
    // secureRenderer adds the security code Magento's checkout requires on scripts.
    echo $secureRenderer->renderTag('script', [], 'window.cromojoPurchase = ' . $json . ';', false);
}

<?php
// Stops the file from being opened directly.
if (!defined('_PS_VERSION_')) { exit; }

class CromojoPurchase extends Module
{
    // The module's name and description, as shown in the Module Manager.
    public function __construct()
    {
        $this->name = 'cromojopurchase';
        $this->tab = 'analytics_stats';
        $this->version = '1.0.0';
        $this->author = 'Cromojo';
        $this->need_instance = 0;
        parent::__construct();
        $this->displayName = 'Cromojo purchase tracking';
        $this->description = 'Reports each order to Cromojo from the order confirmation page.';
        $this->ps_versions_compliancy = ['min' => '1.7.0.0', 'max' => _PS_VERSION_];
    }

    // On install, ask PrestaShop to run this module on the order confirmation page.
    public function install()
    {
        return parent::install() && $this->registerHook('displayOrderConfirmation');
    }

    public function hookDisplayOrderConfirmation($params)
    {
        // The order PrestaShop just confirmed.
        $order = isset($params['order']) ? $params['order'] : null;
        if (!Validate::isLoadedObject($order)) {
            return '';
        }

        // One checkout can be split into several orders sharing one reference, so add them all up.
        $total = 0.0;
        foreach (Order::getByReference($order->reference) as $sibling) {
            $total += (float) $sibling->total_paid_tax_incl;
        }

        // The order reference, the total paid with tax and shipping, and the currency.
        $currency = new Currency((int) $order->id_currency);
        $purchase = [
            'order_id' => (string) $order->reference,
            'amount'   => round($total, 2),
            'currency' => $currency->iso_code,
        ];

        // Print the purchase line for Cromojo.
        return '<script>window.cromojoPurchase = ' . json_encode($purchase, JSON_HEX_TAG | JSON_HEX_AMP) . ';</script>';
    }
}

<?xml version="1.0" encoding="utf-8"?>
<!-- Adds Cromojo purchase tracking to OpenCart 3's checkout success page. -->
<modification>
  <name>Cromojo purchase tracking</name>
  <code>cromojo_purchase</code>
  <version>1.0</version>
  <author>Cromojo</author>

  <!-- Step 1: read the order before OpenCart forgets it. -->
  <file path="catalog/controller/checkout/success.php">
    <operation>
      <search><![CDATA[unset($this->session->data['order_id']);]]></search>
      <add position="before"><![CDATA[
      // Load the order the buyer just placed.
      $this->load->model('checkout/order');
      $cromojo_order = $this->model_checkout_order->getOrder($this->session->data['order_id']);
      if ($cromojo_order && $cromojo_order['order_status_id']) {
          // The order number, the total converted to the currency the buyer paid in, and that currency.
          $data['cromojo_purchase'] = '<script>window.cromojoPurchase = ' . json_encode(array(
              'order_id' => (string)$cromojo_order['order_id'],
              'amount'   => $this->currency->format($cromojo_order['total'], $cromojo_order['currency_code'], $cromojo_order['currency_value'], false),
              'currency' => $cromojo_order['currency_code'],
          ), JSON_HEX_TAG | JSON_HEX_AMP) . ';</script>';
      }
      ]]></add>
    </operation>
  </file>

  <!-- Step 2: print the purchase line just before the page footer. -->
  <file path="catalog/view/theme/*/template/common/success.twig">
    <operation>
      <search><![CDATA[{{ footer }}]]></search>
      <add position="before"><![CDATA[{{ cromojo_purchase }}]]></add>
    </operation>
  </file>
</modification>

{% sw_extends '@Storefront/storefront/page/checkout/finish/index.html.twig' %}

{# Adds to the end of the order finish page, keeping what's already there. #}
{% block base_body_script %}
    {{ parent() }}
    {% if page.order %}
        <script>
            window.cromojoPurchase = {
                // The order number.
                order_id: {{ page.order.orderNumber|json_encode|raw }},
                // The order total, with shipping and tax.
                amount: {{ page.order.amountTotal|json_encode|raw }},
                // The currency the buyer paid in.
                currency: {{ page.order.currency.isoCode|json_encode|raw }}
            };
        </script>
    {% endif %}
{% endblock %}

<?php
// Ask Stripe for the checkout session named in the page address.
$stripe  = new \Stripe\StripeClient(getenv('STRIPE_SECRET_KEY'));
$session = $stripe->checkout->sessions->retrieve($_GET['session_id']);

// Only print the line once Stripe confirms the payment.
if ($session->payment_status === 'paid'): ?>
<script>
  window.cromojoPurchase = <?= json_encode([
    // Stripe's checkout session ID works as the order number.
    'order_id' => $session->id,
    // Stripe gives the total in cents, so divide by 100.
    'amount'   => number_format($session->amount_total / 100, 2, '.', ''),
    // Stripe writes currencies in lowercase, so make it uppercase.
    'currency' => strtoupper($session->currency),
  ]) ?>;
</script>
<?php endif; ?>

// Confirms the payment without leaving the page when possible.
const { error, paymentIntent } = await stripe.confirmPayment({
  elements,
  redirect: 'if_required',
  confirmParams: { return_url: 'https://yoursite.com/thanks' },
});

// Only record the sale once Stripe says the payment succeeded.
if (!error && paymentIntent && paymentIntent.status === 'succeeded') {
  window.CRMJ && CRMJ.trackPurchase({
    // Stripe's payment ID works as the order number.
    order_id: paymentIntent.id,
    // Stripe gives the amount in cents, so divide by 100.
    amount: paymentIntent.amount / 100,
    // Stripe writes currencies in lowercase, so make it uppercase.
    currency: paymentIntent.currency.toUpperCase(),
  });
}

// Stripe adds this to your return page's address.
const secret = new URLSearchParams(location.search).get('payment_intent_client_secret');

if (secret) {
  // Ask Stripe for the payment, instead of trusting the address.
  stripe.retrievePaymentIntent(secret).then(function (result) {
    var pi = result.paymentIntent;

    // Only record the sale once the payment succeeded.
    if (pi && pi.status === 'succeeded') {
      window.CRMJ && CRMJ.trackPurchase({
        order_id: pi.id,
        // Cents to normal units.
        amount: pi.amount / 100,
        currency: pi.currency.toUpperCase(),
      });
    }
  });
}

Paddle.Initialize({
  // Your existing Paddle client token.
  token: 'live_xxx',
  // Paddle calls this for every checkout event.
  eventCallback: function (event) {
    // Only act when the checkout is completed.
    if (event.name === 'checkout.completed') {
      window.CRMJ && CRMJ.trackPurchase({
        // Paddle's transaction ID works as the order number.
        order_id: event.data.transaction_id,
        // The total with tax, already in normal units.
        amount: event.data.totals.total,
        currency: event.data.currency_code,
      });
    }
  },
});

Paddle.Setup({
  // Your existing Paddle vendor ID.
  vendor: 12345,
  // Paddle calls this for every checkout event.
  eventCallback: function (data) {
    // Only act when the checkout is complete.
    if (data.event === 'Checkout.Complete') {
      // Shows the event in the browser console, so you can check the names below. Remove it once checked.
      console.log(data);

      var checkout = data.eventData.checkout;
      window.CRMJ && CRMJ.trackPurchase({
        order_id: checkout.id,
        amount: checkout.prices.customer.total,
        currency: checkout.prices.customer.currency,
      });
    }
  },
});

LemonSqueezy.Setup({
  // Lemon.js calls this for every checkout event.
  eventHandler: function (event) {
    // Only act on a successful checkout.
    if (event.event !== 'Checkout.Success') return;

    // The order's details. This works with both shapes Lemon Squeezy uses.
    var order = event.data || {};
    var a = order.attributes || order;

    window.CRMJ && CRMJ.trackPurchase({
      // The order's unique ID.
      order_id: String(a.identifier || order.id),
      // Lemon Squeezy gives the total in cents, so divide by 100.
      amount: a.total / 100,
      currency: a.currency,
    });
  },
});

<?php
// The order number Lemon Squeezy put in the page address (digits only).
$id = preg_replace('/\D/', '', $_GET['order_id'] ?? '');

// Ask Lemon Squeezy for that order, with your API key.
$ctx = stream_context_create(['http' => ['header' =>
  "Authorization: Bearer " . getenv('LEMONSQUEEZY_API_KEY') . "\r\n" .
  "Accept: application/vnd.api+json\r\n"]]);
$res = $id ? json_decode(@file_get_contents("https://api.lemonsqueezy.com/v1/orders/$id", false, $ctx), true) : null;
$a   = $res['data']['attributes'] ?? null;

// Only print the line if the order is paid.
if ($a && $a['status'] === 'paid'): ?>
<script>
  window.cromojoPurchase = <?= json_encode([
    'order_id' => $a['identifier'],
    // Lemon Squeezy gives the total in cents, so divide by 100.
    'amount'   => number_format($a['total'] / 100, 2, '.', ''),
    'currency' => $a['currency'],
  ]) ?>;
</script>
<?php endif; ?>

paypal.Buttons({
  createOrder: function () { /* your existing code */ },

  // Runs when the buyer approves the payment in PayPal.
  onApprove: function (data) {
    // Your server captures the payment and returns PayPal's answer.
    return fetch('/api/orders/' + data.orderID + '/capture', { method: 'POST' })
      .then(function (response) { return response.json(); })
      .then(function (orderData) {
        // The captured payment inside PayPal's answer.
        var unit = orderData.purchase_units && orderData.purchase_units[0];
        var capture = unit && unit.payments && unit.payments.captures && unit.payments.captures[0];

        // Only record the sale once the money is captured.
        if (capture && capture.status === 'COMPLETED') {
          window.CRMJ && CRMJ.trackPurchase({
            order_id: orderData.id,
            // PayPal gives the amount in normal units.
            amount: capture.amount.value,
            currency: capture.amount.currency_code,
          });
        }

        // ...your existing success message
      });
  },
}).render('#paypal-button-container');

// Your thanks page, on a Node (Express) server.
app.get('/thanks', async (req, res) => {
  // Ask Polar for the checkout named in the page address.
  const response = await fetch(
    'https://api.polar.sh/v1/checkouts/' + encodeURIComponent(req.query.checkout_id),
    { headers: { Authorization: 'Bearer ' + process.env.POLAR_ACCESS_TOKEN } },
  );
  const checkout = response.ok ? await response.json() : null;

  // Only build the purchase once the checkout succeeded. Polar gives cents, so divide by 100.
  const purchase = checkout && checkout.status === 'succeeded'
    ? { order_id: checkout.id, amount: (checkout.total_amount / 100).toFixed(2), currency: checkout.currency.toUpperCase() }
    : null;

  // Then print it in your page's HTML:
  // <script>window.cromojoPurchase = ${JSON.stringify(purchase)};</script>
});

// Server (Node): GET /chargebee-purchase?id=...
// Looks up a finished Chargebee checkout and returns the purchase.
app.get('/chargebee-purchase', async (req, res) => {
  // Your Chargebee API key, sent the way Chargebee expects.
  const auth = 'Basic ' + Buffer.from(process.env.CHARGEBEE_API_KEY + ':').toString('base64');

  // Ask Chargebee for the hosted page the browser sent.
  const response = await fetch(
    `https://${process.env.CHARGEBEE_SITE}.chargebee.com/api/v2/hosted_pages/${encodeURIComponent(req.query.id)}`,
    { headers: { Authorization: auth } },
  );
  const page = response.ok ? (await response.json()).hosted_page : null;

  // The invoice only exists once the checkout succeeded.
  const invoice = page && page.state === 'succeeded' && page.content && page.content.invoice;

  // Chargebee gives the total in cents, so divide by 100.
  res.json(invoice ? { order_id: invoice.id, amount: (invoice.total / 100).toFixed(2), currency: invoice.currency_code } : null);
});

// Browser
cbInstance.openCheckout({
  hostedPage: function () { /* your existing code */ },

  // Chargebee calls this when the checkout succeeds.
  success: function (hostedPageId) {
    // Ask your server for the purchase details.
    fetch('/chargebee-purchase?id=' + encodeURIComponent(hostedPageId))
      .then(function (response) { return response.json(); })
      .then(function (purchase) {
        // Send it to Cromojo, unless there was nothing to charge.
        if (purchase) {
          window.CRMJ && CRMJ.trackPurchase(purchase);
        }
      });
  },
});

<?php
// Your own order, from the order number in the page address.
$order = findOrder($_GET['order']);

// Ask Mollie for the payment you saved with that order.
$mollie = new \Mollie\Api\MollieApiClient();
$mollie->setApiKey(getenv('MOLLIE_API_KEY'));
$payment = $mollie->payments->get($order->mollie_payment_id);

// Only print the line once Mollie says it's paid.
if ($payment->isPaid()): ?>
<script>
  window.cromojoPurchase = <?= json_encode([
    'order_id' => $order->number,
    // Mollie gives the amount in normal units, like "69.00".
    'amount'   => $payment->amount->value,
    'currency' => $payment->amount->currency,
  ]) ?>;
</script>
<?php endif; ?>

<script>
  window.cromojoPurchase = {
    // Thinkific fills in the order number here.
    order_id: '{{ order_number }}',
    // Thinkific gives the total in cents, so divide by 100.
    amount: Number('{{ total_price_in_cents }}') / 100,
    // Thinkific fills in your site currency here.
    currency: '{{ currency }}',
  };
</script>

<script>
  (function () {
    // Podia provides the purchase details on this page.
    var c = window.Podia && window.Podia.Conversion;

    // Skip free products: there's no money to count.
    if (!c || !c.revenue_cents) return;

    window.cromojoPurchase = {
      // The order number (not the product number).
      order_id: String(c.object.order_id),
      // Podia gives the amount in cents, so divide by 100.
      amount: c.revenue_cents / 100,
      currency: c.currency,
    };
  })();
</script>

<script>
  // ThriveCart provides the order details on its success page.
  if (window._thrive_order && _thrive_order.order) {
    window.cromojoPurchase = {
      order_id: String(_thrive_order.order.id),
      // ThriveCart gives the total in cents, so divide by 100.
      amount: _thrive_order.order.total / 100,
      currency: _thrive_order.order.currency,
    };
  }
</script>

<script>
  window.cromojoPurchase = {
    // SamCart fills in the order number here.
    order_id: '##order_id##',
    // SamCart fills in the total. This keeps only digits and the dot.
    amount: String('##total_amount##').replace(/[^0-9.]/g, ''),
    // SamCart fills in the currency here.
    currency: '##currency##',
  };
</script>

<script>
  (function () {
    // Outseta added the plan's details to this page's address.
    var p = new URLSearchParams(location.search);

    // Use the annual price for annual plans, otherwise the monthly price.
    var annual = (p.get('term') || '').toLowerCase().indexOf('annual') > -1;
    var amount = Number(annual ? p.get('annual') : p.get('monthly'));

    // Stop if something is missing.
    if (!p.get('sub') || !amount) return;

    // The subscription ID works as the order number. Replace USD with your currency.
    window.cromojoPurchase = { order_id: p.get('sub'), amount: amount, currency: 'USD' };
  })();
</script>

<script>
  (function () {
    // These platforms give no order number, so make one up and remember it in this
    // browser tab. A reload then reuses it and isn't counted twice.
    var key = 'cromojo-order:' + location.pathname;
    var id = null;
    try { id = sessionStorage.getItem(key); } catch (e) {}
    if (!id) {
      id = 'order-' + Date.now() + '-' + Math.random().toString(36).slice(2, 10);
      try { sessionStorage.setItem(key, id); } catch (e) {}
    }

    // Replace 49.00 with this product's price, and USD with your currency.
    window.cromojoPurchase = { order_id: id, amount: 49.00, currency: 'USD' };
  })();
</script>

{{-- Print this only on the confirmation page of a paid order. --}}
<script>
  window.cromojoPurchase = @json([
      // Your order number.
      'order_id' => (string) $order->id,
      // Convert cents to normal units.
      'amount'   => round($order->total_cents / 100, 2),
      'currency' => $order->currency,
  ]);
</script>

<script>
  // Print this only on the confirmation page of a paid order.
  window.cromojoPurchase = <?= json_encode([
    // Your order number.
    'order_id' => (string) $order['id'],
    // The total, written with two decimals and a dot.
    'amount'   => number_format($order['total'], 2, '.', ''),
    'currency' => $order['currency'],
  ]) ?>;
</script>

{# Prints the purchase safely, then hands it to Cromojo. #}
{{ purchase|json_script:"cromojo-purchase" }}
<script>
  window.cromojoPurchase = JSON.parse(document.getElementById('cromojo-purchase').textContent);
</script>

<%# Print this only on the confirmation page of a paid order. Cents become normal units. %>
<script>
  window.cromojoPurchase = <%= raw json_escape({ order_id: @order.id.to_s, amount: (@order.total_cents / 100.0).round(2), currency: @order.currency }.to_json) %>;
</script>

'use client';
import { useEffect } from 'react';

// Render this on your order confirmation page, with the paid order's values.
export function CromojoPurchase({ orderId, amount, currency }) {
  // Runs in the browser once the page shows, and hands the purchase to Cromojo.
  useEffect(() => {
    window.cromojoPurchase = { order_id: orderId, amount, currency };
  }, [orderId, amount, currency]);

  // Shows nothing on the page.
  return null;
}