nodebb-plugin-ezoic-infinite 1.7.85 → 1.7.87

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nodebb-plugin-ezoic-infinite",
-  "version": "1.7.85",
+  "version": "1.7.87",
   "description": "Production-ready Ezoic infinite ads integration for NodeBB 4.x",
   "main": "library.js",
   "license": "MIT",

package/public/client.js

@@ -76,17 +76,10 @@
   const A_WRAPID    = 'data-ezoic-wrapid';   // id Ezoic
   const A_CREATED   = 'data-ezoic-created';  // timestamp création ms
   const A_SHOWN     = 'data-ezoic-shown';    // timestamp dernier showAds ms
-  const A_FILLED    = 'data-ezoic-filled';   // timestamp premier fill réel ms
-  const A_LAST_W    = 'data-ezoic-lastw';    // dernière largeur pub connue
-  const A_LAST_H    = 'data-ezoic-lasth';    // dernière hauteur pub connue
-
-  const EMPTY_CHECK_MS    = 20_000;  // délai avant collapse d'un wrap vide post-show
-  const EMPTY_RECHECK_2_MS = EMPTY_CHECK_MS + 5_000;
-  const EMPTY_RECHECK_3_MS = EMPTY_CHECK_MS + 15_000;
-  const MIN_LIVE_AFTER_SHOW_MS = 15_000;
-  const MIN_LIVE_AFTER_FILL_MS = 25_000;
-  const KEEP_SHELL_AFTER_UNUSED_MS = 90_000;
-  const MIN_SHELL_HEIGHT = 120;
+
+  // anti-race fill async (Ezoic peut remplir bien après showAds)
+  const EMPTY_CHECK_PASSES = [20_000, 25_000, 35_000];
+
   const MIN_PRUNE_AGE_MS  = 8_000;   // délai de grâce avant pruning (stabilisation DOM)
   const MAX_INSERTS_RUN   = 6;       // max insertions par appel runCore
   const MAX_INFLIGHT      = 4;       // max showAds() simultanés
@@ -129,6 +122,8 @@
     cursors:      { topics: 0,  posts: 0,  categories: 0  },
     mountedIds:   new Set(),
     lastShow:     new Map(),
+    emptyChecks:  new Map(),   // id -> [timerIds] checks is-empty multi-pass
+    fillObs:      new Map(),   // id -> MutationObserver placeholder fill tardif
     io:           null,
     domObs:       null,
     mutGuard:     0,     // >0 : mutations DOM en cours (MutationObserver ignoré)
@@ -136,7 +131,6 @@
     pending:      [],    // ids en attente de slot inflight
     pendingSet:   new Set(),
     wrapByKey:    new Map(),  // anchorKey → wrap DOM node
-    emptyChecks:  new Map(),  // id -> timeout ids
     runQueued:    false,
     burstActive:  false,
     burstDeadline: 0,
@@ -152,185 +146,51 @@
   const normBool  = v  => v === true || v === 'true' || v === 1 || v === '1' || v === 'on';
   const isFilled  = n  => !!(n?.querySelector?.('iframe, ins, img, video, [data-google-container-id]'));
 
-  function mutate(fn) {
-    S.mutGuard++;
-    try { fn(); } finally { S.mutGuard--; }
-  }
-
   function clearEmptyChecks(id) {
-    const timers = S.emptyChecks.get(id);
-    if (!timers) return;
-    for (const t of timers) clearTimeout(t);
-    S.emptyChecks.delete(id);
+    const arr = S.emptyChecks.get(id);
+    if (arr) {
+      for (const t of arr) clearTimeout(t);
+      S.emptyChecks.delete(id);
+    }
   }
 
   function queueEmptyCheck(id, timerId) {
-    if (!S.emptyChecks.has(id)) S.emptyChecks.set(id, []);
-    S.emptyChecks.get(id).push(timerId);
+    const arr = S.emptyChecks.get(id) || [];
+    arr.push(timerId);
+    S.emptyChecks.set(id, arr);
   }
 
-  function hasEverFilled(wrap) { return !!wrap?.getAttribute?.(A_FILLED); }
-  function getFilledTs(wrap) { return parseInt(wrap?.getAttribute?.(A_FILLED) || '0', 10) || 0; }
-  function shouldKeepShellAfterUnused(wrap) {
-    const t = getFilledTs(wrap);
-    return !!t && (Date.now() - t) < KEEP_SHELL_AFTER_UNUSED_MS;
-  }
-  function markFilledOnce(ph) {
-    try {
-      const wrap = ph?.closest?.(`.${WRAP_CLASS}`);
-      if (!wrap) return;
-      if (!wrap.getAttribute(A_FILLED) && isFilled(ph)) wrap.setAttribute(A_FILLED, String(Date.now()));
-    } catch (_) {}
-  }
-  function rememberAdSize(ph, w, h) {
+  function uncollapseIfFilled(ph) {
     try {
       const wrap = ph?.closest?.(`.${WRAP_CLASS}`);
       if (!wrap) return;
-      const ww = Math.round(w || 0), hh = Math.round(h || 0);
-      if (ww > 0) wrap.setAttribute(A_LAST_W, String(ww));
-      if (hh > 0) wrap.setAttribute(A_LAST_H, String(hh));
-    } catch (_) {}
-  }
-  function getAdIntrinsicSize(ph) {
-    if (!ph) return null;
-    const iframe = ph.querySelector('iframe');
-    if (iframe) {
-      const wAttr = parseInt(iframe.getAttribute('width') || iframe.getAttribute('ezaw') || '0', 10);
-      const hAttr = parseInt(iframe.getAttribute('height') || iframe.getAttribute('ezah') || '0', 10);
-      const cs = window.getComputedStyle(iframe);
-      const w = wAttr || Math.round(parseFloat(cs.width) || iframe.offsetWidth || 0);
-      const h = hAttr || Math.round(parseFloat(cs.height) || iframe.offsetHeight || 0);
-      if (w > 0 && h > 0) return { w, h };
-    }
-    const c = ph.querySelector('[id$="__container__"]') || ph.querySelector('.ezoic-ad');
-    if (c) {
-      const cs = window.getComputedStyle(c);
-      const w = Math.round(parseFloat(cs.width) || c.offsetWidth || 0);
-      const h = Math.round(parseFloat(cs.height) || c.offsetHeight || 0);
-      if (w > 0 && h > 0) return { w, h };
-    }
-    return null;
-  }
-  function rememberCurrentAdSize(ph) {
-    try {
-      const size = getAdIntrinsicSize(ph);
-      if (size?.w > 0 && size?.h > 0) return rememberAdSize(ph, size.w, size.h);
-      const r = ph.getBoundingClientRect?.();
-      if (r && (r.width > 0 || r.height > 0)) rememberAdSize(ph, r.width, r.height);
+      if (isFilled(ph)) wrap.classList.remove('is-empty');
     } catch (_) {}
   }
-  function ensureScaleBox(ph) {
-    let box = ph.querySelector(':scope > .nbb-ez-scale-box');
-    if (box) return box;
-    let hasChild = false;
-    for (const n of Array.from(ph.childNodes)) {
-      if (n.nodeType === 1) { hasChild = true; break; }
-      if (n.nodeType === 3 && (n.textContent || '').trim()) { hasChild = true; break; }
-    }
-    if (!hasChild) return null;
-    box = document.createElement('div');
-    box.className = 'nbb-ez-scale-box';
-    while (ph.firstChild) box.appendChild(ph.firstChild);
-    ph.appendChild(box);
-    return box;
-  }
-  function clearAdScale(ph) {
-    const wrap = ph?.closest?.(`.${WRAP_CLASS}`);
-    if (!wrap) return;
-    wrap.classList.remove('is-scaled');
-    wrap.style.removeProperty('height');
-    const box = ph.querySelector(':scope > .nbb-ez-scale-box');
-    if (box) {
-      box.style.removeProperty('transform');
-      box.style.removeProperty('width');
-      box.style.removeProperty('height');
-    }
-    ph.style.removeProperty('height');
-  }
-  function fitWideAd(ph) {
+
+  function watchPlaceholderFill(id) {
     try {
+      const ph = document.getElementById(`${PH_PREFIX}${id}`);
       if (!ph?.isConnected) return;
-      const wrap = ph.closest?.(`.${WRAP_CLASS}`);
-      if (!wrap) return;
-      if (!isFilled(ph)) return clearAdScale(ph);
-      const size = getAdIntrinsicSize(ph);
-      if (!size?.w || !size?.h) return;
-      rememberAdSize(ph, size.w, size.h);
-      const wrapWidth = Math.max(0, Math.floor(wrap.clientWidth || wrap.getBoundingClientRect().width || 0));
-      if (!wrapWidth) return;
-      if (size.w <= wrapWidth + 2) return clearAdScale(ph);
-      const scale = Math.max(0.1, Math.min(1, wrapWidth / size.w));
-      const scaledH = Math.ceil(size.h * scale);
-      const box = ensureScaleBox(ph);
-      if (!box) return;
-      wrap.classList.add('is-scaled');
-      box.style.width = `${size.w}px`;
-      box.style.height = `${size.h}px`;
-      box.style.transform = `scale(${scale})`;
-      ph.style.height = `${scaledH}px`;
-      wrap.style.height = `${scaledH}px`;
-    } catch (_) {}
-  }
-  function applyUnusedShell(wrap, ph) {
-    try {
-      if (!wrap) return;
-      const lastH = parseInt(wrap.getAttribute(A_LAST_H) || '0', 10) || 0;
-      const h = Math.max(MIN_SHELL_HEIGHT, lastH || 0);
-      wrap.classList.remove('is-empty');
-      wrap.classList.add('is-unused-shell');
-      wrap.style.minHeight = `${h}px`;
-      if (ph) ph.style.minHeight = `${h}px`;
-    } catch (_) {}
-  }
-  function clearUnusedShell(wrap, ph) {
-    try {
-      wrap?.classList?.remove('is-unused-shell');
-      wrap?.style?.removeProperty('min-height');
-      ph?.style?.removeProperty('min-height');
+      if (S.fillObs.has(id)) return;
+      const obs = new MutationObserver(() => uncollapseIfFilled(ph));
+      obs.observe(ph, { childList: true, subtree: true, attributes: true });
+      S.fillObs.set(id, obs);
+      uncollapseIfFilled(ph);
     } catch (_) {}
   }
-  function isProtectedFromDrop(wrap) {
-    try {
-      const now = Date.now();
-      const shownTs = parseInt(wrap?.getAttribute?.(A_SHOWN) || '0', 10) || 0;
-      const filledTs = parseInt(wrap?.getAttribute?.(A_FILLED) || '0', 10) || 0;
-      if (shownTs && (now - shownTs) < MIN_LIVE_AFTER_SHOW_MS) return true;
-      if (filledTs && (now - filledTs) < MIN_LIVE_AFTER_FILL_MS) return true;
-      if (shouldKeepShellAfterUnused(wrap)) return true;
-    } catch (_) {}
-    return false;
-  }
-  function uncollapseIfFilled(ph) {
-    try {
-      const wrap = ph?.closest?.(`.${WRAP_CLASS}`);
-      if (!wrap) return;
-      if (isFilled(ph)) {
-        wrap.classList.remove('is-empty');
-        clearUnusedShell(wrap, ph);
-        markFilledOnce(ph);
-        rememberCurrentAdSize(ph);
-        fitWideAd(ph);
-      }
-    } catch (_) {}
-  }
-  function watchPlaceholderFill(ph) {
-    if (!ph || ph.__nbbEzFillObs) return;
-    const obs = new MutationObserver(() => { uncollapseIfFilled(ph); });
-    try { obs.observe(ph, { childList: true, subtree: true, attributes: true }); } catch (_) { return; }
-    ph.__nbbEzFillObs = obs;
-    uncollapseIfFilled(ph);
-  }
-  function unwatchPlaceholderFill(ph) {
-    try { ph?.__nbbEzFillObs?.disconnect?.(); } catch (_) {}
-    try { delete ph.__nbbEzFillObs; } catch (_) {}
+
+  function unwatchPlaceholderFill(id) {
+    const obs = S.fillObs.get(id);
+    if (obs) {
+      try { obs.disconnect(); } catch (_) {}
+      S.fillObs.delete(id);
+    }
   }
-  let fitRaf = 0;
-  function scheduleRefitAll() {
-    if (fitRaf) return;
-    fitRaf = requestAnimationFrame(() => {
-      fitRaf = 0;
-      document.querySelectorAll(`[id^="${PH_PREFIX}"]`).forEach(ph => { try { fitWideAd(ph); } catch (_) {} });
-    });
+
+  function mutate(fn) {
+    S.mutGuard++;
+    try { fn(); } finally { S.mutGuard--; }
   }
 
   // ── Config ─────────────────────────────────────────────────────────────────
@@ -520,27 +380,26 @@
 
     const best = bestEmpty ?? bestFilled;
     if (!best) return null;
-    if (isProtectedFromDrop(best)) return null;
     const id = parseInt(best.getAttribute(A_WRAPID), 10);
     if (!Number.isFinite(id)) return null;
 
     const oldKey = best.getAttribute(A_ANCHOR);
     // Neutraliser l'IO sur ce wrap avant déplacement — évite un showAds
     // parasite si le nœud était encore dans la zone IO_MARGIN.
-    try { const ph = best.querySelector(`#${PH_PREFIX}${id}`); if (ph) { S.io?.unobserve(ph); unwatchPlaceholderFill(ph); clearAdScale(ph); clearUnusedShell(best, ph); } } catch (_) {}
+    try { const ph = best.querySelector(`#${PH_PREFIX}${id}`); if (ph) S.io?.unobserve(ph); } catch (_) {}
+    if (Number.isFinite(id)) clearEmptyChecks(id);
     mutate(() => {
       best.setAttribute(A_ANCHOR,  newKey);
       best.setAttribute(A_CREATED, String(ts()));
       best.setAttribute(A_SHOWN,   '0');
-      best.classList.remove('is-empty', 'is-unused-shell');
+      best.classList.remove('is-empty');
       const ph = best.querySelector(`#${PH_PREFIX}${id}`);
-      if (ph) { ph.innerHTML = ''; ph.style.removeProperty('min-height'); ph.style.removeProperty('height'); }
-      best.removeAttribute(A_FILLED); best.removeAttribute(A_LAST_W); best.removeAttribute(A_LAST_H);
+      if (ph) ph.innerHTML = '';
       targetEl.insertAdjacentElement('afterend', best);
     });
     if (oldKey && S.wrapByKey.get(oldKey) === best) S.wrapByKey.delete(oldKey);
     S.wrapByKey.set(newKey, best);
-    try { const ph2 = best.querySelector(`#${PH_PREFIX}${id}`); if (ph2) watchPlaceholderFill(ph2); } catch (_) {}
+    observePh(id);
 
     // Délais requis : destroyPlaceholders est asynchrone en interne
     const doDestroy = () => { try { ez.destroyPlaceholders([id]); } catch (_) {} setTimeout(doDefine,  300); };
@@ -582,21 +441,15 @@
 
   function dropWrap(w) {
     try {
-      if (isProtectedFromDrop(w)) {
-        const keepPh = w.querySelector(`[id^="${PH_PREFIX}"]`);
-        if (shouldKeepShellAfterUnused(w)) applyUnusedShell(w, keepPh);
-        return false;
-      }
       const ph = w.querySelector(`[id^="${PH_PREFIX}"]`);
-      if (ph instanceof Element) { S.io?.unobserve(ph); unwatchPlaceholderFill(ph); clearAdScale(ph); clearUnusedShell(w, ph); }
+      if (ph instanceof Element) S.io?.unobserve(ph);
       const id = parseInt(w.getAttribute(A_WRAPID), 10);
-      if (Number.isFinite(id)) { S.mountedIds.delete(id); clearEmptyChecks(id); }
+      if (Number.isFinite(id)) { clearEmptyChecks(id); unwatchPlaceholderFill(id); }
+      if (Number.isFinite(id)) S.mountedIds.delete(id);
       const key = w.getAttribute(A_ANCHOR);
       if (key && S.wrapByKey.get(key) === w) S.wrapByKey.delete(key);
       w.remove();
-      return true;
     } catch (_) {}
-    return false;
   }
 
   // ── Prune (topics de catégorie uniquement) ────────────────────────────────
@@ -699,9 +552,10 @@
 
   function observePh(id) {
     const ph = document.getElementById(`${PH_PREFIX}${id}`);
-    if (!ph?.isConnected) return;
-    try { watchPlaceholderFill(ph); } catch (_) {}
-    try { getIO()?.observe(ph); } catch (_) {}
+    if (ph?.isConnected) {
+      try { getIO()?.observe(ph); } catch (_) {}
+      watchPlaceholderFill(id);
+    }
   }
 
   function enqueueShow(id) {
@@ -739,27 +593,22 @@
       try {
         if (isBlocked()) { clearTimeout(timer); return release(); }
         const ph = document.getElementById(`${PH_PREFIX}${id}`);
-        if (!ph?.isConnected || isFilled(ph)) { try { if (ph) uncollapseIfFilled(ph); } catch (_) {} clearTimeout(timer); return release(); }
+        if (!ph?.isConnected || isFilled(ph)) { clearTimeout(timer); return release(); }
+
+        clearEmptyChecks(id);
+        try { ph.closest?.(`.${WRAP_CLASS}`)?.classList.remove('is-empty'); } catch (_) {}
 
         const t = ts();
         if (t - (S.lastShow.get(id) ?? 0) < SHOW_THROTTLE_MS) { clearTimeout(timer); return release(); }
         S.lastShow.set(id, t);
 
-        try {
-          const wrap = ph.closest?.(`.${WRAP_CLASS}`);
-          wrap?.setAttribute(A_SHOWN, String(t));
-          wrap?.classList?.remove('is-empty');
-          clearUnusedShell(wrap, ph);
-          clearEmptyChecks(id);
-        } catch (_) {}
+        try { ph.closest?.(`.${WRAP_CLASS}`)?.setAttribute(A_SHOWN, String(t)); } catch (_) {}
 
         window.ezstandalone = window.ezstandalone || {};
         const ez = window.ezstandalone;
         const doShow = () => {
           try { ez.showAds(id); } catch (_) {}
           scheduleEmptyCheck(id, t);
-          setTimeout(() => { try { const p = document.getElementById(`${PH_PREFIX}${id}`); if (p) fitWideAd(p); } catch (_) {} }, 500);
-          setTimeout(() => { try { const p = document.getElementById(`${PH_PREFIX}${id}`); if (p) fitWideAd(p); } catch (_) {} }, 2500);
           setTimeout(() => { clearTimeout(timer); release(); }, 700);
         };
         Array.isArray(ez.cmd) ? ez.cmd.push(doShow) : doShow();
@@ -776,30 +625,16 @@
         const wrap = ph?.closest?.(`.${WRAP_CLASS}`);
         if (!wrap || !ph?.isConnected) return;
         if (parseInt(wrap.getAttribute(A_SHOWN) || '0', 10) > showTs) return;
-
-        if (isFilled(ph)) {
-          wrap.classList.remove('is-empty');
-          clearUnusedShell(wrap, ph);
-          markFilledOnce(ph);
-          rememberCurrentAdSize(ph);
-          fitWideAd(ph);
-          return;
-        }
-
-        if (hasEverFilled(wrap) || shouldKeepShellAfterUnused(wrap)) {
-          applyUnusedShell(wrap, ph);
-          return;
-        }
-
-        clearUnusedShell(wrap, ph);
-        clearAdScale(ph);
-        wrap.classList.add('is-empty');
+        const filled = isFilled(ph);
+        if (filled) wrap.classList.remove('is-empty');
+        else wrap.classList.add('is-empty');
       } catch (_) {}
     };
 
-    queueEmptyCheck(id, setTimeout(runCheck, EMPTY_CHECK_MS));
-    queueEmptyCheck(id, setTimeout(runCheck, EMPTY_RECHECK_2_MS));
-    queueEmptyCheck(id, setTimeout(runCheck, EMPTY_RECHECK_3_MS));
+    for (const delay of EMPTY_CHECK_PASSES) {
+      const tid = setTimeout(runCheck, delay);
+      queueEmptyCheck(id, tid);
+    }
   }
 
   // ── Patch Ezoic showAds ────────────────────────────────────────────────────
@@ -926,11 +761,13 @@
     S.mountedIds.clear();
     S.lastShow.clear();
     S.wrapByKey.clear();
-    for (const timers of S.emptyChecks.values()) for (const t of timers) clearTimeout(t);
-    S.emptyChecks.clear();
     S.inflight     = 0;
     S.pending      = [];
     S.pendingSet.clear();
+    S.emptyChecks.forEach(arr => { try { arr.forEach(clearTimeout); } catch (_) {} });
+    S.emptyChecks.clear();
+    S.fillObs.forEach(obs => { try { obs.disconnect(); } catch (_) {} });
+    S.fillObs.clear();
     S.burstActive  = false;
     S.runQueued    = false;
   }
@@ -1059,10 +896,6 @@
     }, { passive: true });
   }
 
-  function bindResize() {
-    window.addEventListener('resize', scheduleRefitAll, { passive: true });
-  }
-
   // ── Boot ───────────────────────────────────────────────────────────────────
 
   S.pageKey = pageKey();
@@ -1074,7 +907,6 @@
   ensureDomObserver();
   bindNodeBB();
   bindScroll();
-  bindResize();
   blockedUntil = 0;
   requestBurst();
 

package/public/style.css

@@ -71,13 +71,7 @@
   overflow: hidden !important;
 }
 
-/* ── Ezoic global (hors de nos wraps) ────────────────────────────────────── */
-.ezoic-ad {
-  margin: 0 !important;
-  padding: 0 !important;
-}
-
-/* ── Hardening async fill + responsive creatives ───────────────────────── */
+/* Filet de sécurité : si un fill est présent malgré is-empty, on ne collapse pas */
 .nodebb-ezoic-wrap.is-empty:has(iframe, ins, img, video, [data-google-container-id]) {
   height: auto !important;
   min-height: 1px !important;
@@ -85,51 +79,8 @@
   overflow: visible !important;
 }
 
-.nodebb-ezoic-wrap {
-  max-width: 100%;
-  overflow-x: clip;
-  overflow-y: visible;
-}
-
-.nodebb-ezoic-wrap > [id^="ezoic-pub-ad-placeholder-"] {
-  max-width: 100%;
-}
-
-.nodebb-ezoic-wrap .ezoic-ad,
-.nodebb-ezoic-wrap span.ezoic-ad {
-  max-width: 100% !important;
-  min-width: 0 !important;
-  box-sizing: border-box !important;
-}
-
-.nodebb-ezoic-wrap [id^="google_ads_iframe_"][id$="__container__"],
-.nodebb-ezoic-wrap div[id$="__container__"] {
-  max-width: 100% !important;
-  margin-left: auto !important;
-  margin-right: auto !important;
-  overflow: visible !important;
-}
-
-.nodebb-ezoic-wrap iframe {
-  margin-left: auto !important;
-  margin-right: auto !important;
-  max-width: none !important;
-}
-
-.nodebb-ezoic-wrap.is-scaled {
-  overflow: hidden !important;
-}
-
-.nodebb-ezoic-wrap .nbb-ez-scale-box {
-  transform-origin: top center;
-  will-change: transform;
-}
-
-.nodebb-ezoic-wrap.is-unused-shell {
-  overflow: hidden !important;
-}
-
-.nodebb-ezoic-wrap.is-unused-shell > [id^="ezoic-pub-ad-placeholder-"] {
-  display: block;
-  width: 100%;
+/* ── Ezoic global (hors de nos wraps) ────────────────────────────────────── */
+.ezoic-ad {
+  margin: 0 !important;
+  padding: 0 !important;
 }