How to Set up Upstack Data on Checkout Champ

<!-- Global Script -->
<script src="https://prod2-cdn.upstackified.com/scripts/px/ups.min.js" async="true"></script>
<script>
  window._adqLoaded = 0;
  window._upsqueue = window._upsqueue || [];
  window._upstack = window._upstack || function () {
    window._upsqueue.push(arguments);
  };
  window._upstack('init', 'XXXX-XXXX-XXXXX-XXXX'); // replace with your Pixel ID
  window._upstack('page');
</script>
<!-- End Global Script -->

<!-- Checkout Champ ccpurchase Script -->
<script>
  (function () {
    function onReady(fn) {
      if (document.readyState !== "loading") { fn(); }
      else { document.addEventListener("DOMContentLoaded", fn); }
    }
    onReady(function () {
      try {
        var serializedOrderData = sessionStorage.getItem("orderData");
        if (!serializedOrderData) {
          console.log("No order data found");
          return;
        }
        var orderDataTmp = JSON.parse(serializedOrderData);
        var transactionId = orderDataTmp?.orderId;
        if (!transactionId) {
          console.log("Order data missing orderId, skipping ccpurchase");
          return;
        }
        if (orderDataTmp?.orderStatus === "PARTIAL") {
          console.log("Order is PARTIAL, skipping ccpurchase");
          return;
        }
        var firedKey = "__upstack_cc_purchase_fired";
        try {
          var firedOrders = JSON.parse(sessionStorage.getItem(firedKey) || "[]");
          if (Array.isArray(firedOrders) && firedOrders.indexOf(transactionId) !== -1) {
            console.log("ccpurchase already fired for order:", transactionId);
            return;
          }
        } catch (_e) {}
        var emailAddress = orderDataTmp?.emailAddress;
        var firstName = orderDataTmp?.firstName;
        var lastName = orderDataTmp?.lastName;
        var city = orderDataTmp?.city;
        var country = orderDataTmp?.country;
        var postalCode = orderDataTmp?.postalCode;
        var orderValue = orderDataTmp?.totalAmount;
        if (orderValue == null && orderDataTmp?.items) {
          orderValue = 0;
          Object.values(orderDataTmp.items).forEach(function (item) {
            var price = parseFloat(item.basePrice != null ? item.basePrice : item.cycle1_price);
            var qty = parseInt(item.productQty) || 1;
            if (Number.isFinite(price)) orderValue += price * qty;
          });
        }
        window._upstack('track', 'ccpurchase', {
          email: emailAddress,
          firstName: firstName,
          lastName: lastName,
          city: city,
          country: country,
          postalCode: postalCode,
          value: orderValue,
          transactionId: transactionId,
          orderId: transactionId,
        });
        try {
          var stored = JSON.parse(sessionStorage.getItem(firedKey) || "[]");
          if (Array.isArray(stored) && stored.indexOf(transactionId) === -1) {
            stored.push(transactionId);
            sessionStorage.setItem(firedKey, JSON.stringify(stored));
          }
        } catch (_e) {}
      } catch (e) {
        console.log(e);
      }
    });
  })();
</script>
<!-- End Checkout Champ ccpurchase Script -->

<!-- Checkout Champ Initiate Checkout Script -->
<script>
  (function () {
    function getInitiateCheckoutFired() {
      try {
        return sessionStorage.getItem("initiateCheckoutFired") === "true";
      } catch (error) {
        return false;
      }
    }
    function setInitiateCheckoutFired() {
      try {
        sessionStorage.setItem("initiateCheckoutFired", "true");
        initiateCheckoutFired = true;
      } catch (error) {
        console.log("Error setting initiate checkout fired:", error);
      }
    }
    var initiateCheckoutFired = getInitiateCheckoutFired();
    function pollForOrderData() {
      try {
        var serializedOrderData = sessionStorage.getItem("orderData");
        if (!serializedOrderData) {
          console.log("No order data found, continuing to poll...");
          return false;
        }
        var orderDataTmp = JSON.parse(serializedOrderData);
        if (orderDataTmp.orderStatus === "PARTIAL" && orderDataTmp.orderType === "NEW_SALE") {
          if (!initiateCheckoutFired && !getInitiateCheckoutFired()) {
            console.log("[upstack-cc] initiate_checkout poll: PARTIAL+NEW_SALE detected, firing");
            fireInitiateCheckout(orderDataTmp);
          } else {
            console.log("[upstack-cc] initiate_checkout poll: already fired, skipping");
          }
          return false; // Still PARTIAL — keep polling for completion
        }
        return true; // Order reached non-PARTIAL status — stop polling
      } catch (e) {
        console.log("Error polling order data:", e);
        return false;
      }
    }
    function fireInitiateCheckout(orderData) {
      try {
        var items = [];
        var totalValue = 0;
        if (orderData.items) {
          Object.values(orderData.items).forEach(function (item) {
            var rawPrice = item.basePrice != null ? item.basePrice : item.cycle1_price;
            var itemPrice = parseFloat(rawPrice);
            if (!Number.isFinite(itemPrice) || itemPrice <= 0) {
              console.warn("[upstack-cc] Item missing valid price:", item.productName || item.productId);
              itemPrice = 0;
            }
            var quantity = parseInt(item.productQty) || 1;
            items.push({
              id: item.productId.toString(),
              quantity: quantity,
              name: item.productName,
              price: itemPrice,
              variant: item.productSku,
            });
            totalValue += itemPrice * quantity;
          });
        }
        var trackingData = {
          value: totalValue,
          currency: 'USD',
          items: items,
        };
        if (orderData.emailAddress) trackingData.email = orderData.emailAddress;
        if (orderData.firstName) trackingData.firstName = orderData.firstName;
        if (orderData.lastName) trackingData.lastName = orderData.lastName;
        if (orderData.shipCity || orderData.shipCountry || orderData.shipPostalCode) {
          trackingData.addresses = [{
            city: orderData.shipCity,
            province: orderData.shipState,
            countryCode: orderData.shipCountry,
            zip: orderData.shipPostalCode,
          }];
        }
        console.log("[upstack-cc] initiate_checkout: calling _upstack", trackingData);
        window._upstack('track', 'initiate_checkout', trackingData);
        console.log("[upstack-cc] initiate_checkout: _upstack called. Pixel state:", {
          initialized: window._upsClient?._initialized,
          isDisabled: window._upsClient?._isDisabled,
          queueLength: window._upsqueue?.length,
        });
        setInitiateCheckoutFired();
      } catch (e) {
        console.log("[upstack-cc] Error firing initiate checkout:", e);
      }
    }
    function onReady(fn) {
      if (document.readyState !== "loading") { fn(); }
      else { document.addEventListener("DOMContentLoaded", fn); }
    }
    onReady(function () {
      var pollInterval = setInterval(function () {
        var shouldStop = pollForOrderData();
        if (shouldStop) {
          clearInterval(pollInterval);
          console.log("Order tracking complete, stopping poll");
        }
      }, 1000);
      setTimeout(function () {
        clearInterval(pollInterval);
        console.log("Order polling timeout reached");
      }, 300000);
    });
  })();
</script>
<!-- End Checkout Champ Initiate Checkout Script -->

<!-- Checkout Champ Shared Utilities -->
<script>
  window.__upstack_cc = (function () {
    var DEDUPE_KEY = "__upstack_cc_dedupe_v1";
    function loadDedupeSet() {
      try {
        var stored = JSON.parse(sessionStorage.getItem(DEDUPE_KEY) || "[]");
        return Array.isArray(stored) ? stored : [];
      } catch (_e) { return []; }
    }
    var dedupeList = loadDedupeSet();
    function hasDeduped(key) {
      return !!key && dedupeList.indexOf(key) !== -1;
    }
    function markDeduped(key) {
      if (!key) return;
      if (dedupeList.indexOf(key) === -1) {
        dedupeList.push(key);
        try { sessionStorage.setItem(DEDUPE_KEY, JSON.stringify(dedupeList)); } catch (_e) {}
      }
    }
    function track(eventName, payload, dedupeKey) {
      if (dedupeKey && hasDeduped(dedupeKey)) {
        console.log("[upstack-cc] Deduped, skipping:", eventName, dedupeKey);
        return false;
      }
      try {
        console.log("[upstack-cc] Firing:", eventName, payload);
        window._upstack("track", eventName, payload);
        if (dedupeKey) markDeduped(dedupeKey);
        return true;
      } catch (e) {
        console.log("[upstack-cc] Track error:", eventName, e);
        return false;
      }
    }
    function onReady(fn) {
      if (document.readyState !== "loading") { fn(); }
      else { document.addEventListener("DOMContentLoaded", fn); }
    }
    function toNumber(value) {
      var parsed = parseFloat(String(value || "").replace(/[^\d.-]/g, ""));
      return Number.isFinite(parsed) ? parsed : 0;
    }
    function getFieldValue(selector) {
      var el = document.querySelector(selector);
      return el ? (el.value || "").trim() : "";
    }
    function isElementVisible(el) {
      if (!el) return false;
      var style = window.getComputedStyle(el);
      return style.display !== "none" && style.visibility !== "hidden" && style.opacity !== "0";
    }
    function getElText(el) {
      return el ? (el.innerText || el.textContent || "").trim() : "";
    }
    function getElAttr(el, attr) {
      return el ? (el.getAttribute(attr) || "").trim() : "";
    }
    function getTotals() {
      try {
        var totals = JSON.parse(sessionStorage.getItem("totals") || "{}");
        return {
          value: toNumber(totals.grandTotal),
          tax: toNumber(totals.salesTax),
          shipping: toNumber(totals.shipTotal),
          currency: "USD",
        };
      } catch (_e) {
        return { value: 0, tax: 0, shipping: 0, currency: "USD" };
      }
    }
    function parseProductsFromQuery() {
      var searchParams = new URLSearchParams(window.location.search);
      var products = searchParams.get("products");
      return products ? products.split(";").filter(Boolean) : [];
    }
    function buildItems() {
      var productTokens = parseProductsFromQuery();
      var ccRows = Array.prototype.slice.call(document.querySelectorAll(".cc-cart-row")).filter(isElementVisible);
      var fkRows = Array.prototype.slice.call(document.querySelectorAll(".fk-custom-cart-view"));
      var items = [];
      if (ccRows.length > 0) {
        for (var i = 0; i < ccRows.length; i++) {
          var row = ccRows[i];
          var token = (productTokens[i] || "").split(":");
          var idParts = (token[0] || "").split(".");
          items.push({
            id: idParts[0] || "",
            variant: idParts[1] || "",
            name: getElText(row.querySelector(".cc-cart-row-prod-title")),
            price: toNumber(getElText(row.querySelector(".cc-cart-row-prod-price.real-price"))),
            currency: "USD",
            quantity: Math.max(1, toNumber(token[1] || "1")),
            imageUrl: getElAttr(row.querySelector(".cc-cart-row-img img"), "src"),
          });
        }
      } else if (fkRows.length > 0) {
        var tokenIndex = 0;
        for (var j = 0; j < fkRows.length; j++) {
          var fkRow = fkRows[j];
          var title = getElText(fkRow.querySelector("#ie077"));
          var priceText = getElText(fkRow.querySelector("#ihy31f"));
          if (!title && !priceText) {
            continue;
          }
          var fkToken = (productTokens[tokenIndex] || "").split(":");
          var fkIdParts = (fkToken[0] || "").split(".");
          tokenIndex += 1;
          items.push({
            id: fkIdParts[0] || "",
            variant: fkIdParts[1] || "",
            name: title.replace(/\n/g, " - "),
            price: toNumber(priceText),
            currency: "USD",
            quantity: Math.max(1, toNumber(fkToken[1] || "1")),
            imageUrl: getElAttr(fkRow.querySelector(".image-quantity-container img"), "src"),
          });
        }
      }
      return items.filter(function (item) {
        return item.id || item.name;
      });
    }
    function buildPayload() {
      var totals = getTotals();
      return {
        value: totals.value,
        currency: totals.currency,
        tax: totals.tax,
        shipping: totals.shipping,
        items: buildItems(),
      };
    }
    function getIdentityFields() {
      var email = getFieldValue('[name="emailAddress"]');
      var phone = getFieldValue('[name="phoneNumber"]') || getFieldValue('input[type="tel"]');
      var fields = {};
      if (email) fields.email = email;
      if (phone) fields.phone = phone;
      var firstName = getFieldValue('[name="shipFirstName"]');
      var lastName = getFieldValue('[name="shipLastName"]');
      if (firstName) fields.firstName = firstName;
      if (lastName) fields.lastName = lastName;
      var city = getFieldValue('[name="shipCity"]');
      var state = getFieldValue('[name="shipState"]') || getFieldValue('select[name="shipState"]');
      var countryCode = getFieldValue('select[name="shipCountry"]');
      var zip = getFieldValue('[name="shipPostalCode"]');
      if (city || countryCode || zip) {
        var address = { city: city, provinceCode: state, countryCode: countryCode, zip: zip };
        if (firstName) address.firstName = firstName;
        if (lastName) address.lastName = lastName;
        fields.addresses = [address];
      }
      return fields;
    }
    function hasRequiredShippingFields() {
      var required = [
        '[name="shipFirstName"]',
        '[name="shipLastName"]',
        '[name="shipCity"]',
        '[name="shipPostalCode"]',
        'select[name="shipCountry"]',
      ];
      return required.every(function (selector) {
        var el = document.querySelector(selector);
        return el && (el.value || "").trim().length > 0;
      });
    }
    return {
      onReady: onReady,
      track: track,
      hasDeduped: hasDeduped,
      buildPayload: buildPayload,
      buildItems: buildItems,
      getFieldValue: getFieldValue,
      getIdentityFields: getIdentityFields,
      hasRequiredShippingFields: hasRequiredShippingFields,
      toNumber: toNumber,
    };
  })();
</script>
<!-- End Checkout Champ Shared Utilities -->

<!-- Checkout Champ add_to_cart Script -->
<script>
  (function () {
    var cc = window.__upstack_cc;
    var lastCartHash = "";
    function fireAddToCart() {
      var payload = cc.buildPayload();
      if (!payload.items.length) {
        console.log("[upstack-cc] add_to_cart: no items found");
        return false;
      }
      var cartHash = JSON.stringify({
        items: payload.items,
        value: payload.value,
        tax: payload.tax,
        shipping: payload.shipping,
      });
      if (cartHash === lastCartHash) return false;
      lastCartHash = cartHash;
      return cc.track("add_to_cart", payload, "atc:" + cartHash);
    }
    cc.onReady(function () {
      var cartWatcherStart = Date.now();
      var CART_WATCH_TIMEOUT = 300000;
      var CART_HARD_STOP = 600000;
      var cartInterval = setInterval(function () {
        fireAddToCart();
        var elapsed = Date.now() - cartWatcherStart;
        if ((elapsed > CART_WATCH_TIMEOUT && lastCartHash) || elapsed > CART_HARD_STOP) {
          clearInterval(cartInterval);
        }
      }, 800);
      document.addEventListener("blur", function (event) {
        var target = event.target;
        if (target && target.matches && target.matches('input[name="emailAddress"]')) {
          fireAddToCart();
        }
      }, true);
    });
  })();
</script>
<!-- End Checkout Champ add_to_cart Script -->

<!-- Checkout Champ initiate_checkout Script (email-blur fallback) -->
<script>
  (function () {
    var cc = window.__upstack_cc;
    var fired = cc.hasDeduped("ic");
    cc.onReady(function () {
      console.log("[upstack-cc] initiate_checkout: listener bound, fired=" + fired);
      document.addEventListener("blur", function (event) {
        if (fired) return;
        var target = event.target;
        if (!target || !target.matches || !target.matches('input[name="emailAddress"]')) return;
        console.log("[upstack-cc] initiate_checkout: email blur detected");
        var email = cc.getFieldValue('[name="emailAddress"]');
        if (!email || !/\S+@\S+\.\S+/.test(email)) {
          console.log("[upstack-cc] initiate_checkout: invalid email:", email);
          return;
        }
        var payload = cc.buildPayload();
        var identity = cc.getIdentityFields();
        Object.keys(identity).forEach(function (key) {
          payload[key] = identity[key];
        });
        var sent = cc.track("initiate_checkout", payload, "ic");
        if (sent) fired = true;
      }, true);
    });
  })();
</script>
<!-- End Checkout Champ initiate_checkout Script -->

<!-- Checkout Champ add_shipping_info Script -->
<script>
  (function () {
    var cc = window.__upstack_cc;
    var fired = cc.hasDeduped("asi");
    function checkOrderDataForShipping() {
      if (fired) return true;
      try {
        var raw = sessionStorage.getItem("orderData");
        if (!raw) return false;
        var orderData = JSON.parse(raw);
        if (!orderData.shipFirstName || !orderData.shipLastName) return false;
        if (!orderData.shipCity && !orderData.shipCountry && !orderData.shipPostalCode) return false;
        var payload = cc.buildPayload();
        if (orderData.emailAddress) payload.email = orderData.emailAddress;
        if (orderData.shipFirstName) payload.firstName = orderData.shipFirstName;
        if (orderData.shipLastName) payload.lastName = orderData.shipLastName;
        if (orderData.shipCity || orderData.shipCountry || orderData.shipPostalCode) {
          payload.addresses = [{
            firstName: orderData.shipFirstName,
            lastName: orderData.shipLastName,
            city: orderData.shipCity,
            provinceCode: orderData.shipState,
            countryCode: orderData.shipCountry,
            zip: orderData.shipPostalCode,
          }];
        }
        console.log("[upstack-cc] add_shipping_info: shipping fields found in orderData");
        var sent = cc.track("add_shipping_info", payload, "asi");
        if (sent) fired = true;
        return sent;
      } catch (_e) { return false; }
    }
    cc.onReady(function () {
      var pollInterval = setInterval(function () {
        var done = checkOrderDataForShipping();
        if (done) {
          clearInterval(pollInterval);
        }
      }, 1000);
      setTimeout(function () {
        clearInterval(pollInterval);
      }, 300000);
    });
  })();
</script>
<!-- End Checkout Champ add_shipping_info Script -->

<!-- Checkout Champ add_payment_info Script -->
<script>
  (function () {
    var cc = window.__upstack_cc;
    var fired = cc.hasDeduped("api");
    function fireAddPaymentInfo() {
      if (fired) return false;
      console.log("[upstack-cc] add_payment_info: triggered");
      var payload = cc.buildPayload();
      var identity = cc.getIdentityFields();
      Object.keys(identity).forEach(function (key) {
        payload[key] = identity[key];
      });
      var sent = cc.track("add_payment_info", payload, "api");
      if (sent) fired = true;
      return sent;
    }
    cc.onReady(function () {
      document.addEventListener("click", function (event) {
        var target = event.target;
        if (target && target.matches && target.matches('[name="fk-payment-option-toggler"]')) {
          fireAddPaymentInfo();
        }
      }, true);
      document.addEventListener("input", function (event) {
        var target = event.target;
        if (target && target.matches && target.matches('[name="cardNumber"]')) {
          fireAddPaymentInfo();
        }
      }, true);
    });
  })();
</script>
<!-- End Checkout Champ add_payment_info Script -->