Untitled

 avatar
unknown
plain_text
10 months ago
6.4 kB
0
Indexable
const tag = 'cv-0-4';
const debug = document.cookie.indexOf('cfQA') > -1;
const isMobile = 'ontouchstart' in window || navigator.msMaxTouchPoints;

function log(msg) {
  if (debug) console.log('[CONV]', tag, '-->', msg);
}

function waitUntil(condition, wait = 8000) {
  return new Promise((resolve, reject) => {
    let stop;

    const timeout =
      wait &&
      setTimeout(() => {
        stop = true;
        reject();
      }, wait);

    const check = () => {
      if (stop) return;
      if (!condition()) return requestAnimationFrame(check);

      clearTimeout(timeout);
      resolve(condition());
    };

    requestAnimationFrame(check);
  });
}
function sendEvt(name, type, value) {
  waitUntil(() => typeof window.ABTastyEvent !== 'undefined', 0).then(() => {
    if (type === 'Metric') {
      try {
        window.ABTastyEvent(name);
        log(`ABTasty event sent: ${name}`);
      } catch (err) {
        log(err.message);
      }
    } else if (type === 'Segment') {
      try {
        let segmentObject = {};

        segmentObject[name] = value;
        window.abtasty.send('segment', {
          s: segmentObject,
        });

        log(`ABTasty segment sent: ${name} - value: ${value}`);
      } catch (err) {
        log(err.message);
      }
    }
  });
}
function waitForElement(cssSelector, callback) {
  var stop,
    elementCached,
    timeout,
    check = function () {
      try {
        elementCached = document.querySelector(cssSelector);

        if (stop) return;

        if (elementCached) {
          callback(elementCached);
          clearTimeout(timeout);

          log(cssSelector + ' found');
        } else {
          window.requestAnimationFrame(check);
        }
      } catch (err) {
        log(err.message);
      }
    };

  window.requestAnimationFrame(check);

  timeout = setTimeout(function () {
    stop = true;
    log(cssSelector + ' not found');
  }, 5000);
}
function getScrollPercent() {
  const scrollTop =
    window.scrollY ||
    (document.documentElement || document.body.parentNode || document.body)
      .scrollTop;
  const windowHeight =
    window.innerHeight ||
    (document.documentElement || document.body.parentNode || document.body)
      .clientHeight;
  const documentHeight = Math.max(
    document.body.scrollHeight,
    document.documentElement.scrollHeight,
    document.body.offsetHeight,
    document.documentElement.offsetHeight,
    document.body.clientHeight,
    document.documentElement.clientHeight
  );

  return (scrollTop / (documentHeight - windowHeight)) * 100;
}

function redirect(link) {
  if (!link) return;
  if (window.next && next && next.router && next.router.push) {
    next.router.push(link);
  } else {
    location.pathname = link;
  }
}

waitUntil(
  () =>
    window.next &&
    next.router &&
    next.router.components &&
    next.router.components['/browse/[level1]/[level2]'] &&
    next.router.components['/browse/[level1]/[level2]'].props &&
    next.router.components['/browse/[level1]/[level2]'].props.pageProps &&
    next.router.components['/browse/[level1]/[level2]'].props.pageProps
      .pageSuccess !== false,
  5000
).then(() => {
  if (document && document.body) {
    sendEvt(
      '[CONV] [IRM 0.4] User visits interstitial category page',
      'Metric'
    );
    let scroll25 = false;
    let scroll50 = false;
    let scroll75 = false;
    document.body.addEventListener(isMobile ? 'touchend' : 'mousedown', (e) => {
      const { target } = e;

      if (target.closest('.m--category-tile')) {
        sendEvt(
          '[CONV] [IRM 0.4] User clicks on category tiles on interstitial category page',
          'Metric'
        );
        return;
      }
    });
    document.body.addEventListener('click', (e) => {
      const { target } = e;
      if (target.closest(`.swiper--recommended .${tag}__carousel__item`)) {
        e.preventDefault();
        const linkEl = target.closest(
          `.swiper--recommended .${tag}__carousel__item`
        );
        sendEvt(
          '[CONV] [IRM 0.4] User clicks on recommended products on interstitial category page',
          'Metric'
        );
        redirect(linkEl.href);
        return;
      }
      if (target.closest(`.${tag}__banner a`)) {
        e.preventDefault();
        const linkEl = target.closest(`.${tag}__banner a`);
        sendEvt(
          '[CONV] [IRM 0.4] User clicks on campaign tile on interstitial category page',
          'Metric'
        );
        redirect(linkEl.href);
        return;
      }
      if (target.closest(`.swiper--topSeller .${tag}__carousel__item`)) {
        e.preventDefault();
        const linkEl = target.closest(
          `.swiper--topSeller .${tag}__carousel__item`
        );
        sendEvt(
          '[CONV] [IRM 0.4] User clicks on any top sellers on interstitial category page',
          'Metric'
        );
        redirect(linkEl.href);
        return;
      }
      if (target.closest(`.${tag}__brands__item`)) {
        e.preventDefault();
        const linkEl = target.closest(`.${tag}__brands__item`);
        sendEvt(
          '[CONV] [IRM 0.4] User clicks on brands tiles on interstitial category page',
          'Metric'
        );
        redirect(linkEl.href);
        return;
      }
      if (target.closest(`.${tag}__trustUsp a`)) {
        const linkEl = target.closest(`.${tag}__trustUsp a`);
        if (!linkEl.classList.contains('cv-0-4__trustUsp__item--1')) {
          e.preventDefault();
          redirect(linkEl.href);
        }
        return;
      }
    });

    function handleScroll() {
      const scrollPercent = getScrollPercent();

      if (scrollPercent >= 25 && scrollPercent <= 30 && !scroll25) {
        sendEvt(
          '[CONV] [IRM 0.4] User scrolls 25% on an interstitial category page',
          'Metric'
        );
        scroll25 = true;
      } else if (scrollPercent >= 50 && scrollPercent <= 55 && !scroll50) {
        sendEvt(
          '[CONV] [IRM 0.4] User scrolls 50% on an interstitial category page',
          'Metric'
        );
        scroll50 = true;
      } else if (scrollPercent >= 75 && scrollPercent <= 80 && !scroll75) {
        sendEvt(
          '[CONV] [IRM 0.4] User scrolls 75% on an interstitial category page',
          'Metric'
        );
        scroll75 = true;
      }
    }

    window.addEventListener('scroll', handleScroll);
  }
});
Editor is loading...
Leave a Comment