easter-egg-quest 1.0.16 → 1.0.18

package/dist/easter-egg-quest.es.js

@@ -82,19 +82,14 @@ const DEFAULT_SCRIPT = {
   ],
   stage3Success: [
     "rhythm was the answer",
-    "not stopping, not rushing",
-    "but the dance between them",
-    "the third egg appears",
-    "for those who breathe"
+    "you found the third egg",
+    "nice work"
   ],
   // ── Finale ────────────────────────────────────────────────────────────
   finale: [
-    "you were looking for three eggs",
-    "but you found something else",
-    "stillness",
-    "motion",
-    "rhythm",
-    "this is where life appears"
+    "all three eggs found",
+    "stillness, motion, rhythm",
+    "that's the whole set"
   ],
   // ── Results / Share ───────────────────────────────────────────────────
   results: [
@@ -520,7 +515,25 @@ function isElementVisible(el) {
   if (rect.width === 0 || rect.height === 0) return false;
   const style = getComputedStyle(el);
   if (style.display === "none" || style.visibility === "hidden" || style.opacity === "0") return false;
-  return rect.top < window.innerHeight && rect.bottom > 0 && rect.left < window.innerWidth && rect.right > 0;
+  const inViewport = rect.top < window.innerHeight && rect.bottom > 0 && rect.left < window.innerWidth && rect.right > 0;
+  if (!inViewport) return false;
+  let parent = el.parentElement;
+  while (parent && parent !== document.body) {
+    const parentStyle = getComputedStyle(parent);
+    const overflowClips = [
+      parentStyle.overflow,
+      parentStyle.overflowX,
+      parentStyle.overflowY
+    ].some((value) => ["auto", "scroll", "hidden", "clip"].includes(value));
+    if (overflowClips) {
+      const parentRect = parent.getBoundingClientRect();
+      if (rect.bottom <= parentRect.top || rect.top >= parentRect.bottom || rect.right <= parentRect.left || rect.left >= parentRect.right) {
+        return false;
+      }
+    }
+    parent = parent.parentElement;
+  }
+  return true;
 }
 function isDangerousElement(el) {
   const text = (el.textContent ?? "").toLowerCase().trim();
@@ -528,26 +541,6 @@ function isDangerousElement(el) {
   const combined = `${text} ${ariaLabel}`;
   return DANGEROUS_KEYWORDS.some((kw) => combined.includes(kw));
 }
-function findEligibleEntryElements(containerSelector, excludeSelectors = []) {
-  const container = containerSelector ? document.querySelector(containerSelector) ?? document.body : document.body;
-  const candidates = container.querySelectorAll(
-    'a, button, [role="button"], nav a, nav button, .cta, [data-easter-entry]'
-  );
-  const excludeSet = /* @__PURE__ */ new Set();
-  for (const sel of excludeSelectors) {
-    document.querySelectorAll(sel).forEach((el) => excludeSet.add(el));
-  }
-  const eligible = [];
-  candidates.forEach((el) => {
-    if (excludeSet.has(el)) return;
-    if (!isElementVisible(el)) return;
-    if (isDangerousElement(el)) return;
-    const rect = el.getBoundingClientRect();
-    if (rect.width < 30 || rect.height < 20) return;
-    eligible.push(el);
-  });
-  return eligible;
-}
 function pickRandom(arr) {
   if (arr.length === 0) return void 0;
   return arr[Math.floor(Math.random() * arr.length)];
@@ -577,6 +570,11 @@ class HiddenEntry {
     this._intersectionObserver = null;
     this._mutationDebounce = null;
     this._navigationHandler = null;
+    this._bootstrapObserver = null;
+    this._retryTimer = null;
+    this._fallbackTimer = null;
+    this._retryCount = 0;
+    this._historyPatched = false;
     this.config = config;
     this.script = script;
     this.onFound = onFound;
@@ -586,16 +584,10 @@ class HiddenEntry {
       this._createFallbackEntry();
       return;
     }
-    const eligible = findEligibleEntryElements(
-      this.config.hiddenEntry.selector,
-      this.config.hiddenEntry.excludeSelectors
-    );
-    if (eligible.length === 0) {
-      this._createFallbackEntry();
-      return;
-    }
-    this._injectIntoExisting(eligible);
     this._startHintEscalation();
+    this._startBootstrapWatch();
+    this._scheduleFallback();
+    this._attemptInjection(0);
   }
   cleanup() {
     var _a2, _b2, _c, _d;
@@ -611,6 +603,7 @@ class HiddenEntry {
       this.targetElement.classList.remove("eeq-entry-target");
     }
     this._stopWatchdog();
+    this._stopBootstrapWatch();
     (_a2 = this._injectedElement) == null ? void 0 : _a2.remove();
     this._injectedElement = null;
     (_b2 = this.hintContainer) == null ? void 0 : _b2.remove();
@@ -623,17 +616,11 @@ class HiddenEntry {
     this._attachToElement(this.targetElement);
   }
   // ─── Inject trigger text inside an existing element ─────────────────
-  _injectIntoExisting(_eligible) {
-    const candidates = Array.from(
-      document.querySelectorAll(
-        "p, li, figcaption, blockquote, h4, h3, h2, h1, header a, nav a, nav button"
-      )
-    ).filter((el) => {
-      var _a2;
-      const text = ((_a2 = el.textContent) == null ? void 0 : _a2.trim()) ?? "";
-      if (text.length < 2 || el.closest("[data-eeq]")) return false;
-      return isElementVisible(el);
-    });
+  _injectIntoExisting() {
+    var _a2;
+    const root = this._getSearchRoot();
+    const candidates = this._findTextCandidates(root);
+    if (candidates.length === 0) return false;
     const sorted = candidates.sort((a, b) => {
       const aNav = a.closest("nav") !== null || a.closest("header") !== null ? 1 : 0;
       const bNav = b.closest("nav") !== null || b.closest("header") !== null ? 1 : 0;
@@ -644,8 +631,8 @@ class HiddenEntry {
     });
     const prints = sorted.map(
       (el) => {
-        var _a2;
-        return `${el.tagName}:${(((_a2 = el.textContent) == null ? void 0 : _a2.trim()) ?? "").slice(0, 30)}`;
+        var _a3;
+        return `${el.tagName}:${(((_a3 = el.textContent) == null ? void 0 : _a3.trim()) ?? "").slice(0, 30)}`;
       }
     );
     const HISTORY_KEY = "eeq_trigger_history";
@@ -677,8 +664,8 @@ class HiddenEntry {
     ];
     const rotatedPrints = rotated.map(
       (el) => {
-        var _a2;
-        return `${el.tagName}:${(((_a2 = el.textContent) == null ? void 0 : _a2.trim()) ?? "").slice(0, 30)}`;
+        var _a3;
+        return `${el.tagName}:${(((_a3 = el.textContent) == null ? void 0 : _a3.trim()) ?? "").slice(0, 30)}`;
       }
     );
     const unused = rotated.filter((_, i) => !usedSet.has(rotatedPrints[i]));
@@ -692,6 +679,7 @@ class HiddenEntry {
       const isInline = host.tagName === "A" || host.tagName === "BUTTON" || host.tagName === "LI" || host.closest("nav") !== null;
       const span = document.createElement("span");
       span.textContent = isInline ? " · start hunt" : " start hunt";
+      span.setAttribute("data-eeq", "trigger");
       span.style.cssText = `
         font: inherit;
         color: inherit;
@@ -719,10 +707,161 @@ class HiddenEntry {
       this._injectedElement = span;
       this.targetElement = span;
       this._attachToElement(span);
+      this._retryCount = 0;
+      this._clearRetryTimer();
+      this._clearFallbackTimer();
+      (_a2 = this.fallbackButton) == null ? void 0 : _a2.remove();
+      this.fallbackButton = null;
+      this._stopBootstrapWatch();
       this._startWatchdog();
-      return;
+      return true;
+    }
+    return false;
+  }
+  _attemptInjection(delayMs) {
+    this._clearRetryTimer();
+    this._retryTimer = setTimeout(() => {
+      if (this._destroyed || this._injectedElement) return;
+      const ok = this._injectIntoExisting();
+      if (!ok) this._scheduleNextRetry();
+    }, delayMs);
+  }
+  _scheduleNextRetry() {
+    if (this._destroyed || this._injectedElement) return;
+    const delays = [300, 900, 1800, 3200, 5e3, 8e3];
+    const nextDelay = delays[Math.min(this._retryCount, delays.length - 1)];
+    this._retryCount += 1;
+    this._attemptInjection(nextDelay);
+  }
+  _scheduleFallback() {
+    if (this.fallbackButton || this._fallbackTimer) return;
+    this._fallbackTimer = setTimeout(() => {
+      if (this._destroyed || this._injectedElement || this.fallbackButton) return;
+      this._createFallbackEntry();
+    }, 1e4);
+  }
+  _clearRetryTimer() {
+    if (this._retryTimer) {
+      clearTimeout(this._retryTimer);
+      this._retryTimer = null;
+    }
+  }
+  _clearFallbackTimer() {
+    if (this._fallbackTimer) {
+      clearTimeout(this._fallbackTimer);
+      this._fallbackTimer = null;
+    }
+  }
+  _getSearchRoot() {
+    if (!this.config.hiddenEntry.selector) return document.body;
+    return document.querySelector(this.config.hiddenEntry.selector) ?? document.body;
+  }
+  _findTextCandidates(root) {
+    var _a2;
+    const selector = [
+      "p",
+      "li",
+      "figcaption",
+      "blockquote",
+      "caption",
+      "label",
+      "td",
+      "th",
+      "h1",
+      "h2",
+      "h3",
+      "h4",
+      "h5",
+      "h6",
+      "a",
+      "button",
+      '[role="button"]',
+      '[role="link"]',
+      "div",
+      "span",
+      "article",
+      "section",
+      "summary",
+      "[data-easter-entry]",
+      "[mat-button]",
+      "[mat-list-item]",
+      ".mat-mdc-button",
+      ".mat-mdc-list-item",
+      ".ag-cell",
+      ".ag-header-cell"
+    ].join(", ");
+    const excludeSet = /* @__PURE__ */ new Set();
+    for (const sel of this.config.hiddenEntry.excludeSelectors) {
+      (_a2 = root.querySelectorAll) == null ? void 0 : _a2.call(root, sel).forEach((el) => excludeSet.add(el));
+    }
+    return Array.from(root.querySelectorAll(selector)).filter((el) => {
+      var _a3, _b2;
+      if (!(el instanceof HTMLElement)) return false;
+      if (excludeSet.has(el)) return false;
+      if (el.closest("[data-eeq]")) return false;
+      if (el.closest("script, style, noscript, svg, canvas, form")) return false;
+      if (isDangerousElement(el)) return false;
+      if (!isElementVisible(el)) return false;
+      const text = ((_a3 = el.innerText) == null ? void 0 : _a3.trim()) || ((_b2 = el.textContent) == null ? void 0 : _b2.trim()) || "";
+      if (text.length < 6 || text.length > 220) return false;
+      const childElementCount = el.children.length;
+      if (childElementCount > 12) return false;
+      const rect = el.getBoundingClientRect();
+      if (rect.width < 18 || rect.height < 12) return false;
+      return true;
+    });
+  }
+  _startBootstrapWatch() {
+    this._stopBootstrapWatch();
+    const root = this._getSearchRoot();
+    const observerTarget = root instanceof HTMLElement ? root : document.body;
+    this._bootstrapObserver = new MutationObserver(() => {
+      if (this._destroyed || this._injectedElement) return;
+      if (this._mutationDebounce) clearTimeout(this._mutationDebounce);
+      this._mutationDebounce = setTimeout(() => {
+        if (this._destroyed || this._injectedElement) return;
+        this._attemptInjection(150);
+      }, 250);
+    });
+    this._bootstrapObserver.observe(observerTarget, { childList: true, subtree: true });
+    this._navigationHandler = () => {
+      if (this._destroyed || this._injectedElement) return;
+      this._attemptInjection(700);
+    };
+    window.addEventListener("popstate", this._navigationHandler);
+    window.addEventListener("hashchange", this._navigationHandler);
+    if (!this._historyPatched && typeof window.history !== "undefined") {
+      this._historyPatched = true;
+      const patchHistoryMethod = (method) => {
+        const original = window.history[method].bind(window.history);
+        window.history[method] = (...args) => {
+          const result = original(...args);
+          window.dispatchEvent(new Event("eeq:navigation"));
+          return result;
+        };
+      };
+      patchHistoryMethod("pushState");
+      patchHistoryMethod("replaceState");
+    }
+    window.addEventListener("eeq:navigation", this._navigationHandler);
+  }
+  _stopBootstrapWatch() {
+    if (this._bootstrapObserver) {
+      this._bootstrapObserver.disconnect();
+      this._bootstrapObserver = null;
+    }
+    this._clearRetryTimer();
+    this._clearFallbackTimer();
+    if (this._mutationDebounce) {
+      clearTimeout(this._mutationDebounce);
+      this._mutationDebounce = null;
+    }
+    if (this._navigationHandler) {
+      window.removeEventListener("popstate", this._navigationHandler);
+      window.removeEventListener("hashchange", this._navigationHandler);
+      window.removeEventListener("eeq:navigation", this._navigationHandler);
+      this._navigationHandler = null;
     }
-    this._createFallbackEntry();
   }
   /**
    * Watch for the injected trigger element being removed from the DOM
@@ -769,6 +908,7 @@ class HiddenEntry {
     };
     window.addEventListener("popstate", this._navigationHandler);
     window.addEventListener("hashchange", this._navigationHandler);
+    window.addEventListener("eeq:navigation", this._navigationHandler);
   }
   /**
    * Walk up the DOM to find a stable ancestor that won't be replaced
@@ -803,6 +943,7 @@ class HiddenEntry {
     if (this._navigationHandler) {
       window.removeEventListener("popstate", this._navigationHandler);
       window.removeEventListener("hashchange", this._navigationHandler);
+      window.removeEventListener("eeq:navigation", this._navigationHandler);
       this._navigationHandler = null;
     }
   }
@@ -817,13 +958,12 @@ class HiddenEntry {
     }
     this._injectedElement = null;
     this.targetElement = null;
+    this._startBootstrapWatch();
+    this._scheduleFallback();
     setTimeout(() => {
       if (this._destroyed) return;
-      const eligible = findEligibleEntryElements(
-        this.config.hiddenEntry.selector,
-        this.config.hiddenEntry.excludeSelectors
-      );
-      this._injectIntoExisting(eligible);
+      const ok = this._injectIntoExisting();
+      if (!ok) this._scheduleNextRetry();
     }, 1200);
   }
   /**
@@ -832,12 +972,22 @@ class HiddenEntry {
    * Returns true if inserted without layout shift.
    */
   _tryInsertBetweenWords(host, span) {
-    var _a2;
     const textNodes = [];
-    for (const node of host.childNodes) {
-      if (node.nodeType === Node.TEXT_NODE && (((_a2 = node.textContent) == null ? void 0 : _a2.trim().length) ?? 0) > 5) {
-        textNodes.push(node);
+    const walker = document.createTreeWalker(host, NodeFilter.SHOW_TEXT, {
+      acceptNode: (node) => {
+        var _a2;
+        const text2 = ((_a2 = node.textContent) == null ? void 0 : _a2.trim()) ?? "";
+        if (text2.length <= 5) return NodeFilter.FILTER_REJECT;
+        const parent = node.parentElement;
+        if (!parent) return NodeFilter.FILTER_REJECT;
+        if (parent.closest("[data-eeq], script, style, noscript")) return NodeFilter.FILTER_REJECT;
+        return NodeFilter.FILTER_ACCEPT;
       }
+    });
+    let current = walker.nextNode();
+    while (current) {
+      textNodes.push(current);
+      current = walker.nextNode();
     }
     if (!textNodes.length) return false;
     const slotSeed = Math.floor(Date.now() / (1e3 * 60 * 2));
@@ -854,13 +1004,13 @@ class HiddenEntry {
     const splitAt = spacePositions[Math.min(idx, spacePositions.length - 1)];
     const before = text.slice(0, splitAt);
     const after = text.slice(splitAt);
-    const heightBefore = host.getBoundingClientRect().height;
+    const rectBefore = host.getBoundingClientRect();
     const afterNode = document.createTextNode(after);
     textNode.textContent = before;
     host.insertBefore(afterNode, textNode.nextSibling);
     host.insertBefore(span, afterNode);
-    const heightAfter = host.getBoundingClientRect().height;
-    if (Math.abs(heightAfter - heightBefore) > 2) {
+    const rectAfter = host.getBoundingClientRect();
+    if (Math.abs(rectAfter.height - rectBefore.height) > 8 || Math.abs(rectAfter.width - rectBefore.width) > 24) {
       host.removeChild(span);
       host.removeChild(afterNode);
       textNode.textContent = text;
@@ -1105,6 +1255,7 @@ class HiddenEntry {
     document.head.appendChild(this.shimmerStyle);
   }
   _createFallbackEntry() {
+    if (this.fallbackButton) return;
     this.fallbackButton = document.createElement("button");
     this.fallbackButton.textContent = "·";
     this.fallbackButton.setAttribute("aria-label", "Hidden game entry");
@@ -3568,16 +3719,16 @@ const _ResultsRenderer = class _ResultsRenderer {
     inner.appendChild(badgesDiv);
     const invite = document.createElement("div");
     invite.className = "eeq-share-invite";
-    invite.textContent = "share your result with friends 🥚";
+    invite.textContent = "share or copy your result";
     inner.appendChild(invite);
     const actions = document.createElement("div");
     actions.className = "eeq-results-actions";
     const shareBtn = document.createElement("button");
     shareBtn.className = "eeq-btn eeq-btn-share";
-    shareBtn.title = "share result";
+    shareBtn.title = "share or copy result";
     shareBtn.innerHTML = '<svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M4.5 10.5a2 2 0 1 1 0-4 2 2 0 0 1 0 4zm7-4a2 2 0 1 1 0-4 2 2 0 0 1 0 4zm0 8a2 2 0 1 1 0-4 2 2 0 0 1 0 4z" stroke="currentColor" stroke-width="1.2"/><path d="M6.3 9.2l3.4 1.6M6.3 7.8l3.4-1.6" stroke="currentColor" stroke-width="1.2"/></svg>';
     const shareLabel = document.createElement("span");
-    shareLabel.textContent = "share";
+    shareLabel.textContent = "share / copy";
     shareBtn.appendChild(shareLabel);
     actions.appendChild(shareBtn);
     const finishBtn = document.createElement("button");
@@ -3811,6 +3962,7 @@ const _ResultsRenderer = class _ResultsRenderer {
   _copyShareImage(s) {
     var _a2;
     const canvas = this._renderCard(s);
+    const shareText = this._buildShareText(s);
     const dataUrl = canvas.toDataURL("image/png");
     const byteString = atob(dataUrl.split(",")[1]);
     const ab = new ArrayBuffer(byteString.length);
@@ -3824,17 +3976,35 @@ const _ResultsRenderer = class _ResultsRenderer {
         navigator.share({
           files: [file],
           title: "Easter Egg Quest",
-          text: `«${s.behaviorProfile.title}»`
+          text: shareText
         }).catch(() => {
         });
         return;
       }
+      navigator.share({
+        title: "Easter Egg Quest",
+        text: shareText
+      }).catch(() => {
+      });
+      return;
     }
     if (navigator.clipboard && typeof ClipboardItem !== "undefined") {
       navigator.clipboard.write([
         new ClipboardItem({ "image/png": blob })
       ]).then(() => {
-        this._flashButton(".eeq-btn-share", "copied!");
+        this._flashButton(".eeq-btn-share", "image copied");
+      }).catch(() => {
+        this._copyShareText(shareText, blob);
+      });
+      return;
+    }
+    this._copyShareText(shareText, blob);
+  }
+  _copyShareText(text, blob) {
+    var _a2;
+    if ((_a2 = navigator.clipboard) == null ? void 0 : _a2.writeText) {
+      navigator.clipboard.writeText(text).then(() => {
+        this._flashButton(".eeq-btn-share", "text copied");
       }).catch(() => {
         this._downloadBlob(blob);
       });
@@ -3842,6 +4012,11 @@ const _ResultsRenderer = class _ResultsRenderer {
     }
     this._downloadBlob(blob);
   }
+  _buildShareText(s) {
+    const time = formatTime(s.totalTime);
+    const eggs = `${s.eggsFound}/3 eggs`;
+    return `Easter Egg Quest: ${s.behaviorProfile.title} • ${time} • ${eggs}`;
+  }
   _downloadBlob(blob) {
     const url = URL.createObjectURL(blob);
     const a = document.createElement("a");
@@ -3921,10 +4096,10 @@ const _ResultsRenderer = class _ResultsRenderer {
     ctx.fillText(labels.join("  ·  "), W / 2, divY + 92);
     ctx.font = "14px Georgia, serif";
     ctx.fillStyle = "rgba(232,224,214,0.55)";
-    ctx.fillText("Happy Easter! 🐰🥚", W / 2, divY + 130);
+    ctx.fillText("All three eggs found", W / 2, divY + 130);
     ctx.font = "11px Georgia, serif";
     ctx.fillStyle = "rgba(232,224,214,0.3)";
-    ctx.fillText("Wishing you joy, peace, and light", W / 2, divY + 150);
+    ctx.fillText("Share or copy your result", W / 2, divY + 150);
     ctx.font = "9px Georgia, serif";
     ctx.fillStyle = "rgba(232,224,214,0.12)";
     ctx.fillText("easter egg quest", W / 2, H - 16);