// ── Tracking: Amplitude Browser SDK v2 + console/window.__events fallback ──
//
// API 키는 두 가지 중 하나로 주입:
//   1) <meta name="amplitude-api-key" content="YOUR_KEY">   (index.html)
//   2) window.__AMPLITUDE_API_KEY = "YOUR_KEY"             (인라인 스크립트)
// 둘 다 없으면 콘솔/window.__events 로만 기록 (데모 모드).
// 자세한 연동 절차: docs/analytics.md 참고.

window.__events = window.__events || [];
window.__amplitudeReady = false;

// ── Dev 모드: ?dev=1 로 접속하면 Amplitude 전송을 끔 ────────────────────────
// 내부 인원/QA 가 자기 트래픽을 실데이터에 섞지 않도록.
// - Amplitude SDK 를 아예 로드/init 하지 않고, track() 에서도 전송을 건너뜀.
// - 콘솔 로그와 window.__events 는 그대로 남아 로컬 검증은 가능 (데모 모드와 동일).
// - sessionStorage 에 기록해 같은 탭 세션 동안은 URL 에서 dev=1 이 빠져도 유지.
const DEV_MODE = (() => {
  try {
    const fromUrl = new URLSearchParams(window.location.search).get("dev") === "1";
    if (fromUrl) {
      try { sessionStorage.setItem("__dev_mode", "1"); } catch (e) {}
      return true;
    }
    return sessionStorage.getItem("__dev_mode") === "1";
  } catch (e) { return false; }
})();
window.__devMode = DEV_MODE;
// 외부 전송 허용 여부의 단일 진실 소스(single source of truth).
// 새로운 분석/픽셀/벤더를 붙일 때는 반드시 이 플래그를 확인하고 전송을 막을 것.
window.__trackingEnabled = !DEV_MODE;
if (DEV_MODE) {
  console.log("[track] DEV 모드 (?dev=1) — Amplitude 전송 OFF. 콘솔/window.__events 만 기록.");
}

// ┌─────────────────────────────────────────────────────────────────────────┐
// │ 확장 규칙 (중요)                                                          │
// │ 새 이벤트는 반드시 아래 track() 래퍼를 통해 발화한다.                     │
// │   - window.amplitude.track(...) 을 컴포넌트에서 직접 부르지 말 것.        │
// │   - track() 한 곳에서만 DEV_MODE 게이팅을 하므로, 통로를 단일화해야       │
// │     dev=1 차단이 모든 이벤트에 자동 적용된다.                             │
// │ Amplitude 외 다른 전송(서버 로깅·픽셀 등)을 추가할 때도                   │
// │   if (!window.__trackingEnabled) return;  를 진입부에 둘 것.             │
// └─────────────────────────────────────────────────────────────────────────┘

const superProps = {
  persona: null,
  default_solution: null,
  device: (typeof window !== "undefined" && window.matchMedia && window.matchMedia("(max-width: 720px)").matches) ? "mobile" : "desktop",
  session_id: (() => {
    try {
      const k = "__landing_session";
      let v = sessionStorage.getItem(k);
      if (!v) {
        v = "s_" + Math.random().toString(36).slice(2, 10) + Date.now().toString(36);
        sessionStorage.setItem(k, v);
      }
      return v;
    } catch (e) { return "s_anon"; }
  })(),
  // 영구 익명 식별자 (쿠키 없이 localStorage). Amplitude userId 로도 사용.
  visitor_id: (() => {
    try {
      const k = "__landing_visitor";
      let v = localStorage.getItem(k);
      if (!v) {
        v = "v_" + Math.random().toString(36).slice(2, 12) + Date.now().toString(36);
        localStorage.setItem(k, v);
      }
      return v;
    } catch (e) { return "v_anon"; }
  })(),
  utm_source: null,
  utm_medium: null,
  utm_campaign: null,
  utm_content: null,
  utm_term: null,
  landing_path: typeof window !== "undefined" ? window.location.pathname : null,
  referrer: typeof document !== "undefined" ? (document.referrer || null) : null,
};

function parseUtm() {
  try {
    const p = new URLSearchParams(window.location.search);
    ["utm_source", "utm_medium", "utm_campaign", "utm_content", "utm_term"].forEach(k => {
      const v = p.get(k);
      if (v) superProps[k] = v;
    });
  } catch (e) {}
}
parseUtm();

function setSuperProps(patch) {
  Object.assign(superProps, patch);
  // Amplitude 가 살아있다면 user properties 도 업데이트
  if (window.__amplitudeReady && window.amplitude && window.amplitude.Identify) {
    try {
      const id = new window.amplitude.Identify();
      Object.entries(patch).forEach(([k, v]) => { if (v != null) id.set(k, v); });
      window.amplitude.identify(id);
    } catch (e) {}
  }
}

function track(eventName, props = {}) {
  const payload = { ...superProps, ...props, _ts: Date.now() };
  window.__events.push({ event: eventName, props: payload });
  // eslint-disable-next-line no-console
  console.log("[track]", eventName, payload);
  if (DEV_MODE) return;  // dev 접속은 Amplitude 로 전송하지 않음
  if (window.__amplitudeReady && window.amplitude) {
    try { window.amplitude.track(eventName, payload); } catch (e) {}
  }
}

// ── Amplitude lazy load + init ─────────────────────────────────────────────
function getAmplitudeApiKey() {
  try {
    const meta = document.querySelector('meta[name="amplitude-api-key"]');
    const fromMeta = meta && meta.getAttribute("content");
    const fromGlobal = window.__AMPLITUDE_API_KEY;
    const key = (fromMeta || fromGlobal || "").trim();
    if (!key) return null;
    // 흔한 placeholder 값은 무시
    if (/^(YOUR_|{{|undefined|null)/i.test(key)) return null;
    return key;
  } catch (e) { return null; }
}

// First-party 호스팅 — ad blocker (AdGuard 등) 가 cdn.amplitude.com 을 막아도
// 같은 origin 에서 받기 때문에 영향 없음. 버전 갱신 절차는 docs/analytics.md "SDK 버전 업데이트" 참고.
const AMPLITUDE_SDK_URL = "/vendor/amplitude.min.js";

// 이벤트 ingestion 도 같은 origin 으로 프록시. Vercel rewrite 가
// /ax/2 → https://api2.amplitude.com/2/httpapi 로 포워딩.
const AMPLITUDE_SERVER_URL = "/ax/2";

function initAmplitudeIfConfigured() {
  if (DEV_MODE) {
    console.log("[track] DEV 모드 — Amplitude SDK 로드/init 생략.");
    return;
  }
  const apiKey = getAmplitudeApiKey();
  if (!apiKey) {
    console.log("[track] Amplitude API key 미설정 — 콘솔/window.__events 만 사용 (데모 모드).");
    return;
  }
  if (window.__amplitudeLoading) return;
  window.__amplitudeLoading = true;

  const s = document.createElement("script");
  s.src = AMPLITUDE_SDK_URL;
  s.async = true;
  s.onload = () => {
    try {
      window.amplitude.init(apiKey, undefined, {
        defaultTracking: {
          sessions: true,      // 세션 시작/종료 자동
          pageViews: false,    // Page Viewed 는 직접 발화 (페르소나 정보 포함)
          formInteractions: false,
          fileDownloads: false,
        },
        autocapture: false,    // 클릭/스크롤은 우리가 직접 발화
        serverUrl: AMPLITUDE_SERVER_URL,  // first-party proxy (ad blocker 우회)
        serverZone: "US",      // EU 데이터 잔류가 필요하면 "EU" 로 변경 + vercel.json rewrite 도 .eu 로
      });
      try { window.amplitude.setUserId(superProps.visitor_id); } catch (e) {}

      // 초기화 직전까지 쌓인 이벤트 flush
      window.__amplitudeReady = true;
      const buffered = window.__events.slice();
      buffered.forEach(e => {
        try { window.amplitude.track(e.event, e.props); } catch (_) {}
      });
      console.log("[track] Amplitude ready. Flushed", buffered.length, "buffered events.");
    } catch (e) {
      console.warn("[track] Amplitude init failed:", e);
    }
  };
  s.onerror = () => {
    console.warn("[track] Amplitude SDK CDN 로드 실패. 콘솔/window.__events 만 사용.");
    window.__amplitudeLoading = false;
  };
  document.head.appendChild(s);
}

// ── 전역 클릭 캡처: "어디를 눌렀는가" ──────────────────────────────────────
// 모든 button / a / role=tab / [data-track] 클릭에 대해 "UI Clicked" 를 발화.
// 기존의 의미적 이벤트 (Start Free Clicked, Solution Explore Clicked …) 와는
// 독립적으로 누적된다. 대시보드에서는 둘 중 필요한 쪽만 골라 쓰면 됨.
function describeClickedEl(target) {
  let cur = target;
  let interactive = null;
  while (cur && cur !== document.body) {
    if (cur.dataset && cur.dataset.track) { interactive = cur; break; }
    if (!interactive && (cur.tagName === "BUTTON" || cur.tagName === "A" ||
        (cur.getAttribute && cur.getAttribute("role") === "tab"))) {
      interactive = cur;
    }
    cur = cur.parentElement;
  }
  if (!interactive) return null;

  // 클릭이 발생한 섹션 추정 (가까운 상위)
  let section = null;
  let sNode = interactive;
  while (sNode && sNode !== document.body) {
    if (sNode.id === "player") { section = "solution_player"; break; }
    if (sNode.classList) {
      if (sNode.classList.contains("hero")) { section = "hero"; break; }
      if (sNode.classList.contains("final")) { section = "final_cta"; break; }
      if (sNode.classList.contains("modal")) { section = "checkout_modal"; break; }
      if (sNode.classList.contains("persona-bar")) { section = "persona_bar"; break; }
    }
    sNode = sNode.parentElement;
  }
  // 섹션 못 찾으면 nearest <section> 의 class 힌트 사용
  if (!section) {
    let sec = interactive.closest && interactive.closest("section");
    if (sec) section = sec.className.split(/\s+/).find(c => c.startsWith("section--")) || sec.className || null;
  }

  const label = (interactive.getAttribute("aria-label")
    || interactive.textContent
    || "").trim().replace(/\s+/g, " ").slice(0, 80);

  return {
    element_id: (interactive.dataset && interactive.dataset.track) || interactive.id || null,
    element_tag: interactive.tagName.toLowerCase(),
    element_role: interactive.getAttribute("role") || null,
    element_class: interactive.className || null,
    element_label: label,
    href: interactive.getAttribute("href") || null,
    section,
  };
}

document.addEventListener("click", (e) => {
  const info = describeClickedEl(e.target);
  if (!info) return;
  track("UI Clicked", info);
}, true);

// ── 스크롤 마일스톤: 25/50/75/100% 도달 시 1회 발화 ───────────────────────
const milestonesHit = new Set();
window.addEventListener("scroll", () => {
  const docH = document.documentElement.scrollHeight - window.innerHeight;
  if (docH <= 0) return;
  const pct = (window.scrollY / docH) * 100;
  [25, 50, 75, 100].forEach(m => {
    if (pct >= m && !milestonesHit.has(m)) {
      milestonesHit.add(m);
      track("Scroll Reached", { milestone_pct: m });
    }
  });
}, { passive: true });

// dwell 이벤트가 페이지 이탈 시 잘리지 않도록 flush
window.addEventListener("visibilitychange", () => {
  if (document.visibilityState === "hidden") {
    window.dispatchEvent(new CustomEvent("__flushDwell", { detail: { reason: "hidden" } }));
  }
});
window.addEventListener("pagehide", () => {
  window.dispatchEvent(new CustomEvent("__flushDwell", { detail: { reason: "pagehide" } }));
});

// DOM ready 시 Amplitude 초기화 (meta 태그 읽을 시점 보장)
if (document.readyState === "loading") {
  document.addEventListener("DOMContentLoaded", initAmplitudeIfConfigured);
} else {
  initAmplitudeIfConfigured();
}

Object.assign(window, { track, setSuperProps, initAmplitudeIfConfigured });