nodebb-plugin-ezoic-infinite 1.6.21 → 1.6.23

package/package.json

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

package/public/client.js

@@ -1511,75 +1511,47 @@ function buildOrdinalMap(items) {
 
 
 
-// ===== V14.1.1 Hook between-wrap (safe): host repair always, reconcile ONLY on upscroll, never append host to bottom =====
+// ===== V14.1.3: Mutation-based reconcile (no scroll listener), place by data-ezoic-after =====
 (function () {
-  var BETWEEN_SEL = 'div.nodebb-ezoic-wrap.ezoic-ad-between';
-  var HOST_CLASS = 'nodebb-ezoic-host';
-  var TOKEN_ATTR = 'data-ezoic-anchor-token';
+  var WRAP_SEL = 'div.nodebb-ezoic-wrap.ezoic-ad-between';
+  var HOST_SEL = 'li.nodebb-ezoic-host';
+  var TOPIC_LI_SEL = 'li[component="category/topic"]';
 
-  var lastY = window.pageYOffset || document.documentElement.scrollTop || 0;
+  var freezeUntil = 0;
   var pending = false;
-  var lastRun = 0;
-  var COOLDOWN = 140;
+  var queue = new Set();
 
-  function getY() {
-    return window.pageYOffset || document.documentElement.scrollTop || 0;
-  }
-
-  function token() {
-    try { return String(Date.now()) + '-' + Math.random().toString(16).slice(2); } catch (e) { return String(Date.now()); }
-  }
+  function now() { return Date.now(); }
 
-  function getListContainer(node) {
+  function getTopicList() {
     try {
-      var ul = node && node.closest ? node.closest('ul,ol') : null;
-      if (ul && (ul.tagName === 'UL' || ul.tagName === 'OL')) return ul;
-      var p = node && node.parentElement;
-      while (p) {
-        if (p.tagName === 'UL' || p.tagName === 'OL') return p;
-        p = p.parentElement;
-      }
-    } catch (e) {}
-    return null;
+      var topic = document.querySelector(TOPIC_LI_SEL);
+      if (!topic) return null;
+      return topic.closest ? topic.closest('ul,ol') : null;
+    } catch (e) { return null; }
   }
 
-  function closestNonHostLi(node) {
+  function isLoading() {
     try {
-      var cur = node;
-      if (!cur) return null;
-      if (cur.closest) {
-        var host = cur.closest('li.' + HOST_CLASS);
-        if (host) cur = host;
-      }
-      var prev = cur.previousElementSibling;
-      while (prev) {
-        if (prev.tagName === 'LI' && !(prev.classList && prev.classList.contains(HOST_CLASS))) return prev;
-        prev = prev.previousElementSibling;
-      }
-    } catch (e) {}
-    return null;
+      if (now() < freezeUntil) return true;
+      return !!document.querySelector('.infinite-loading, .infinite-scroll-loading, .loading-indicator, .spinner, .topic-loading');
+    } catch (e) { return false; }
   }
 
-  function ensureHost(wrap) {
-    // Always ensure UL/OL doesn't directly contain DIV wraps.
+  function ensureHostForWrap(wrap, ul) {
     try {
       if (!wrap || wrap.nodeType !== 1) return null;
-      if (!(wrap.matches && wrap.matches(BETWEEN_SEL))) return null;
-
-      var ul = getListContainer(wrap);
-      if (!ul) return null;
-
-      var host = wrap.closest ? wrap.closest('li.' + HOST_CLASS) : null;
+      if (!(wrap.matches && wrap.matches(WRAP_SEL))) return null;
+      var host = wrap.closest ? wrap.closest(HOST_SEL) : null;
       if (host) return host;
-
-      // If direct child of UL/OL, create host in-place (does not affect infinite scroll measurements much)
+      ul = ul || (wrap.closest ? wrap.closest('ul,ol') : null);
+      if (!ul) return null;
       if (wrap.parentElement === ul) {
         host = document.createElement('li');
-        host.className = HOST_CLASS;
+        host.className = 'nodebb-ezoic-host';
         host.setAttribute('role', 'listitem');
         host.style.listStyle = 'none';
         host.style.width = '100%';
-
         ul.insertBefore(host, wrap);
         host.appendChild(wrap);
         try { wrap.style.width = '100%'; } catch (e) {}
@@ -1589,118 +1561,177 @@ function buildOrdinalMap(items) {
     return null;
   }
 
-  function tetherHostToAnchor(host, ul) {
-    // Only called on upscroll to avoid breaking load logic.
+  function nthTopic(ul, n) {
     try {
-      if (!host) return;
-      var wrap = host.querySelector && host.querySelector(BETWEEN_SEL);
-      if (!wrap) { host.remove(); return; }
+      var topics = ul.querySelectorAll(TOPIC_LI_SEL);
+      if (!topics || !topics.length) return null;
+      if (n < 1) n = 1;
+      if (n > topics.length) n = topics.length;
+      return topics[n-1] || null;
+    } catch (e) { return null; }
+  }
 
-      // Determine anchor = nearest previous non-host li
-      var anchorLi = closestNonHostLi(host);
-      if (!anchorLi) {
-        // No anchor in DOM -> mark orphan (handled on upscroll only)
-        host.setAttribute('data-ezoic-orphan', '1');
-        return;
+  function previousTopicLi(host) {
+    try {
+      var prev = host.previousElementSibling;
+      while (prev) {
+        if (prev.matches && prev.matches(TOPIC_LI_SEL)) return prev;
+        prev = prev.previousElementSibling;
       }
+    } catch (e) {}
+    return null;
+  }
 
-      var t = anchorLi.getAttribute(TOKEN_ATTR);
-      if (!t) {
-        t = token();
-        anchorLi.setAttribute(TOKEN_ATTR, t);
+  function placeHost(host, ul) {
+    try {
+      if (!host || host.nodeType !== 1) return;
+      ul = ul || host.parentElement;
+      if (!ul) return;
+
+      var wrap = host.querySelector && host.querySelector(WRAP_SEL);
+      if (!wrap) { host.remove(); return; }
+
+      var after = wrap.getAttribute('data-ezoic-after');
+      var anchor = null;
+
+      if (after) {
+        anchor = nthTopic(ul, parseInt(after, 10));
+      }
+      if (!anchor) {
+        anchor = previousTopicLi(host);
+      }
+      if (!anchor) {
+        // Can't place reliably; if host drifted to top area, remove to avoid pile-up.
+        // Otherwise keep as-is.
+        var firstTopic = nthTopic(ul, 1);
+        if (firstTopic && host !== firstTopic && host.compareDocumentPosition(firstTopic) & Node.DOCUMENT_POSITION_FOLLOWING) {
+          host.remove();
+        }
+        return;
       }
-      host.setAttribute(TOKEN_ATTR, t);
-      host.removeAttribute('data-ezoic-orphan');
 
-      // If host drifted, put it back right after anchor
-      if (host.previousElementSibling !== anchorLi) {
-        anchorLi.insertAdjacentElement('afterend', host);
+      if (host.previousElementSibling !== anchor) {
+        anchor.insertAdjacentElement('afterend', host);
       }
     } catch (e) {}
   }
 
-  function reconcileUpScroll() {
-    var y = getY();
-    var dy = y - lastY;
-    lastY = y;
-
-    // ALWAYS: repair invalid ul>div occurrences (cheap) but don't reorder
-    try {
-      var bad = document.querySelectorAll('ul > ' + BETWEEN_SEL + ', ol > ' + BETWEEN_SEL);
-      bad.forEach(function(w){ ensureHost(w); });
-    } catch (e) {}
-
-    // If NOT upscroll, do nothing else (prevents "ads accumulate at bottom" and avoids scroll blocking)
-    if (dy > -8) return;
+  function drain() {
+    pending = false;
+    if (isLoading()) {
+      // retry later
+      scheduleDrain(250);
+      return;
+    }
+    var ul = getTopicList();
+    if (!ul) return;
 
-    // Up-scroll: tether/reconcile and drop orphan hosts (they cause pile-ups)
+    // repair invalid ul>div once
     try {
-      var wraps = document.querySelectorAll(BETWEEN_SEL);
-      wraps.forEach(function(w){
-        var host = ensureHost(w);
-        if (!host) host = w.closest ? w.closest('li.' + HOST_CLASS) : null;
-        var ul = getListContainer(host || w);
-        if (host && ul) tetherHostToAnchor(host, ul);
-      });
-
-      // Drop orphans only on upscroll
-      var orphans = document.querySelectorAll('li.' + HOST_CLASS + '[data-ezoic-orphan="1"]');
-      orphans.forEach(function(h){ try { h.remove(); } catch(e) {} });
-
-      // Drop empty hosts
-      var empties = document.querySelectorAll('li.' + HOST_CLASS);
-      empties.forEach(function(h){
-        try { if (!(h.querySelector && h.querySelector(BETWEEN_SEL))) h.remove(); } catch(e) {}
+      ul.querySelectorAll(':scope > ' + WRAP_SEL).forEach(function(w){
+        var h = ensureHostForWrap(w, ul);
+        if (h) queue.add(h);
       });
     } catch (e) {}
+
+    var count = 0;
+    for (var host of Array.from(queue)) {
+      queue.delete(host);
+      placeHost(host, ul);
+      count++;
+      if (count >= 8) break; // keep it light
+    }
+    if (queue.size) scheduleDrain(60);
   }
 
-  function schedule() {
-    var now = Date.now();
-    if (now - lastRun < COOLDOWN) return;
+  function scheduleDrain(delay) {
     if (pending) return;
     pending = true;
-    requestAnimationFrame(function(){
-      pending = false;
-      lastRun = Date.now();
-      reconcileUpScroll();
-    });
+    if (delay) {
+      setTimeout(function(){ requestAnimationFrame(drain); }, delay);
+    } else {
+      requestAnimationFrame(drain);
+    }
   }
 
-  function init() {
-    // Initial repair only
+  function enqueueFromNode(node) {
     try {
-      var bad = document.querySelectorAll('ul > ' + BETWEEN_SEL + ', ol > ' + BETWEEN_SEL);
-      bad.forEach(function(w){ ensureHost(w); });
+      if (!node || node.nodeType !== 1) return;
+      var ul = getTopicList();
+      if (!ul) return;
+
+      if (node.matches && node.matches(WRAP_SEL)) {
+        var h = ensureHostForWrap(node, ul) || (node.closest ? node.closest(HOST_SEL) : null);
+        if (h) queue.add(h);
+      } else if (node.matches && node.matches(HOST_SEL)) {
+        queue.add(node);
+      } else if (node.querySelectorAll) {
+        node.querySelectorAll(WRAP_SEL).forEach(function(w){
+          var h2 = ensureHostForWrap(w, ul) || (w.closest ? w.closest(HOST_SEL) : null);
+          if (h2) queue.add(h2);
+        });
+        node.querySelectorAll(HOST_SEL).forEach(function(h3){ queue.add(h3); });
+      }
     } catch (e) {}
+  }
 
-    window.addEventListener('scroll', schedule, { passive: true });
-    window.addEventListener('resize', schedule, { passive: true });
-
-    if (window.jQuery) {
-      window.jQuery(window).on('action:ajaxify.end action:infiniteScroll.loaded', function(){
-        setTimeout(schedule, 0);
-        setTimeout(schedule, 250);
-        setTimeout(schedule, 900);
-      });
-    }
+  function init() {
+    // initial scan (light)
+    try {
+      var ul = getTopicList();
+      if (ul) {
+        ul.querySelectorAll(WRAP_SEL).forEach(function(w){
+          var h = ensureHostForWrap(w, ul) || (w.closest ? w.closest(HOST_SEL) : null);
+          if (h) queue.add(h);
+        });
+        scheduleDrain(0);
+      }
+    } catch (e) {}
 
-    // MutationObserver: only schedule (no immediate heavy work)
+    // Observe ONLY the topic list container once available
     try {
       if (typeof MutationObserver !== 'undefined') {
         var mo = new MutationObserver(function(muts){
           for (var i=0;i<muts.length;i++){
-            var m=muts[i];
-            if ((m.addedNodes && m.addedNodes.length) || (m.removedNodes && m.removedNodes.length)) { schedule(); break; }
+            var m = muts[i];
+            if (m.addedNodes && m.addedNodes.length) {
+              for (var j=0;j<m.addedNodes.length;j++){
+                enqueueFromNode(m.addedNodes[j]);
+              }
+              scheduleDrain(0);
+            }
           }
         });
-        mo.observe(document.documentElement || document.body, { childList:true, subtree:true });
+
+        var ul = getTopicList();
+        if (ul) mo.observe(ul, { childList:true, subtree:true });
+        else {
+          // wait for ajaxify
+          var mo2 = new MutationObserver(function(){
+            var u2 = getTopicList();
+            if (u2) {
+              try { mo.observe(u2, { childList:true, subtree:true }); } catch(e){}
+              try { mo2.disconnect(); } catch(e){}
+            }
+          });
+          mo2.observe(document.documentElement || document.body, { childList:true, subtree:true });
+        }
       }
     } catch (e) {}
+
+    if (window.jQuery) {
+      try {
+        window.jQuery(window).on('action:infiniteScroll.loaded action:ajaxify.end', function(){
+          freezeUntil = now() + 900; // allow NodeBB to settle
+          // then reconcile any drift
+          setTimeout(function(){ scheduleDrain(0); }, 950);
+        });
+      } catch (e) {}
+    }
   }
 
   if (document.readyState === 'loading') document.addEventListener('DOMContentLoaded', init);
   else init();
 })();
-// ===== /V14.1.1 =====
+// ===== /V14.1.3 =====
 

package/public/style.css

@@ -81,7 +81,7 @@
 }
 
 
-/* ===== V14.1.1 host ===== */
+/* ===== V14.1.3 host ===== */
 li.nodebb-ezoic-host { list-style: none; width: 100%; }
-/* ===== /V14.1.1 ===== */
+/* ===== /V14.1.3 ===== */
 

package/README.md

@@ -1,15 +0,0 @@
-# NodeBB Plugin – Ezoic Infinite (Production)
-
-This plugin injects Ezoic placeholders between topics and posts on NodeBB 4.x,
-with full support for infinite scroll.
-
-## Key guarantees
-- No duplicate ads back-to-back
-- One showAds call per placeholder
-- Fast reveal (MutationObserver on first child)
-- Safe with ajaxify navigation
-- Works with NodeBB 4.x + Harmony
-
-## Notes
-- Placeholders must exist and be selected in Ezoic
-- Use separate ID pools for topics vs messages