#174 - Simple Referral Program

<!-- 💙 MEMBERSCRIPT #174 v0.1 SIMPLE REFERRAL PROGRAM 💙 -->

<script>
(function() {
  'use strict';

  const CONFIG = {
    baseUrl: window.location.origin,
    referralParam: 'ref',
    trackingParam: 'utm_source',
    trackingValue: 'member_referral',
    webhookUrl: 'https:comment
//hook.prop
eu2.make.com/1mfnxnmrkbl4e8tsyh8ob7kxuuauoc61' // REPLACE WITH YOUR WEBHOOK
  };

  let member = null;

  document.readyState === 'loading'
    ? document.addEventListener('DOMContentLoaded', init)
    : init();

  async function init() {
    await loadMember();

    if (member?.id) {
      const referralUrl = generateReferralUrl(member.id);

      // Populate the input field
      const input = document.querySelector('[data-ms-code="referral-url-input"]');
      if (input) {
        input.value = referralUrl;
        input.setAttribute('readonly', 'readonly');
      }

      // Attach to all buttons inside the container
      const buttons = document.querySelectorAll('[data-ms-code="referral-link"] a');
      buttons.forEach((btn) => {
        if (btn.dataset.msAction === 'copy') {
          btn.addEventListener('click', (e) => {
            e.preventDefault();
            copyToClipboard(referralUrl, btn);
          });
        }
        if (btn.dataset.msAction === 'share') {
          btn.addEventListener('click', (e) => {
            e.preventDefault();
            shareLink(referralUrl);
          });
        }
      });
    }

    trackReferralClick();
  }

  async function loadMember() {
    try {
      if (window.$memberstackDom) {
        const { data } = await window.$memberstackDom.getCurrentMember();
        member = data;
      }
    } catch {}
  }

  function generateReferralUrl(memberId) {
    const url = new URL(CONFIG.baseUrl);
    url.searchParams.set(CONFIG.referralParam, memberId);
    url.searchParams.set(CONFIG.trackingParam, CONFIG.trackingValue);
    return url.toString();
  }

  function copyToClipboard(text, btn) {
    navigator.clipboard.writeText(text).then(() => {
      showFeedback(btn, 'Copied!');
    }).catch(() => {
      showFeedback(btn, 'Failed to copy');
    });
  }

  function showFeedback(btn, msg) {
    const original = btn.textContent;
    btn.textContent = msg;
    setTimeout(() => {
      btn.textContent = original;
    }, 2000);
  }

  function shareLink(url) {
    if (navigator.share) {
      navigator.share({
        title: 'Join me!',
        text: 'Use my referral link:',
        url: url
      });
    } else {
      navigator.clipboard.writeText(url);
      alert('Referral link copied: ' + url);
    }
  }

  function trackReferralClick() {
    const urlParams = new URLSearchParams(window.location.search);
    const referrerId = urlParams.get(CONFIG.referralParam);
    if (!referrerId) return;

    const visitorId = 'visitor_' + Date.now() + '_' + Math.random().toString(36).substr(2, 9);

    const referralData = {
      referrerId,
      visitorId,
      timestamp: Date.now(),
      userAgent: navigator.userAgent,
      referrer: document.referrer || null,
      landingPage: window.location.href
    };

    fetch(CONFIG.webhookUrl, {
      method: 'POST',
      headers: { 'Content-Type': 'application/json' },
      body: JSON.stringify(referralData)
    }).catch(() => {});
  }

})();
</script>