nodebb-plugin-ezoic-infinite 1.6.17 → 1.6.19

package/package.json

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

package/public/client.js

@@ -1,116 +1,6 @@
 (function () {
   'use strict';
 
-function ezoicAnchorToken() {
-  // cheap unique-ish token
-  try { return String(Date.now()) + '-' + Math.random().toString(16).slice(2); } catch (e) { return String(Date.now()); }
-}
-
-function ezoicInsertAfterWithToken(target, wrap, kindClass) {
-  try {
-    if (!target || !wrap) return;
-
-    // Tag the anchor LI (topic item) with a stable token the first time we attach a between ad to it.
-    // If NodeBB re-renders/virtualizes and recreates the LI, this tag disappears => we can drop orphan ads.
-    var anchorLi = null;
-    try { anchorLi = target.closest ? target.closest('li') : null; } catch (e) {}
-    if (!anchorLi && target.tagName === 'LI') anchorLi = target;
-
-    if (kindClass === 'ezoic-ad-between' && anchorLi) {
-      var token = anchorLi.getAttribute('data-ezoic-anchor-token');
-      if (!token) {
-        token = ezoicAnchorToken();
-        try { anchorLi.setAttribute('data-ezoic-anchor-token', token); } catch (e) {}
-      }
-
-      // If inside UL/OL, keep valid DOM with LI host, but keep wrap as DIV (compat).
-      var p = anchorLi.parentElement;
-      if (p && (p.tagName === 'UL' || p.tagName === 'OL')) {
-        var host = document.createElement('li');
-        host.className = 'nodebb-ezoic-host';
-        host.setAttribute('role', 'listitem');
-        host.style.listStyle = 'none';
-        host.style.width = '100%';
-        try { host.setAttribute('data-ezoic-anchor-token', token); } catch (e) {}
-
-        if (anchorLi.insertAdjacentElement) anchorLi.insertAdjacentElement('afterend', host);
-        else if (p.insertBefore) p.insertBefore(host, anchorLi.nextSibling);
-
-        try { host.appendChild(wrap); } catch (e) {}
-        try { wrap.style.width = '100%'; } catch (e) {}
-        return;
-      }
-
-      // Non-list parent: just insert sibling but still tag wrap so we can reconcile
-      try { wrap.setAttribute('data-ezoic-anchor-token', token); } catch (e) {}
-    }
-
-    if (target.insertAdjacentElement) ezoicInsertAfterWithToken(target, wrap, kindClass);
-    else if (target.parentNode) target.parentNode.insertBefore(wrap, target.nextSibling);
-  } catch (e) {}
-}
-
-function ezoicRepairBetweenWrapsToHost() {
-  // Repair any invalid UL children and ensure hosts/wraps carry token if possible.
-  try {
-    var bad = document.querySelectorAll('ul > div.nodebb-ezoic-wrap.ezoic-ad-between, ol > div.nodebb-ezoic-wrap.ezoic-ad-between');
-    bad.forEach(function (wrap) {
-      try {
-        var ul = wrap.parentElement;
-        if (!ul) return;
-        var prevLi = wrap.previousElementSibling && wrap.previousElementSibling.tagName === 'LI' ? wrap.previousElementSibling : null;
-        var token = prevLi ? prevLi.getAttribute('data-ezoic-anchor-token') : null;
-        if (!token && prevLi) {
-          token = ezoicAnchorToken();
-          prevLi.setAttribute('data-ezoic-anchor-token', token);
-        }
-
-        var host = document.createElement('li');
-        host.className = 'nodebb-ezoic-host';
-        host.setAttribute('role', 'listitem');
-        host.style.listStyle = 'none';
-        host.style.width = '100%';
-        if (token) host.setAttribute('data-ezoic-anchor-token', token);
-
-        ul.insertBefore(host, wrap);
-        host.appendChild(wrap);
-        wrap.style.width = '100%';
-      } catch (e) {}
-    });
-  } catch (e) {}
-}
-
-function ezoicReconcileOrDropHostsByToken(scope) {
-  // Core fix: if NodeBB virtualizes and anchors disappear, DROP hosts so they can't pile up at top.
-  // If anchor exists, ensure host sits right after it.
-  try {
-    var root = scope || document;
-    var hosts = root.querySelectorAll('li.nodebb-ezoic-host[data-ezoic-anchor-token]');
-    if (!hosts || !hosts.length) return;
-
-    hosts.forEach(function(host){
-      try {
-        var token = host.getAttribute('data-ezoic-anchor-token');
-        if (!token) return;
-        var listEl = host.parentElement;
-        if (!listEl) return;
-
-        // Find the exact anchor LI that still carries the token.
-        var anchor = listEl.querySelector('li[data-ezoic-anchor-token="' + token + '"]');
-        if (!anchor) {
-          // anchor not in DOM => virtualized/re-rendered: remove host to avoid stacking
-          host.remove();
-          return;
-        }
-        if (host.previousElementSibling !== anchor) {
-          anchor.insertAdjacentElement('afterend', host);
-        }
-      } catch (e) {}
-    });
-  } catch (e) {}
-}
-
-
   // Track scroll direction to avoid aggressive recycling when the user scrolls upward.
   // Recycling while scrolling up is a common cause of ads "bunching" and a "disappearing too fast" feeling.
   let lastScrollY = 0;
@@ -778,7 +668,7 @@ function globalGapFixInit() {
     insertingIds.add(id);
     try {
       const wrap = buildWrap(id, kindClass, afterPos, !existingPh);
-      ezoicInsertAfterWithToken(target, wrap, kindClass);
+      target.insertAdjacentElement('afterend', wrap);
 
       // If placeholder exists elsewhere (including pool), move it into the wrapper.
       if (existingPh) {
@@ -1270,7 +1160,7 @@ function buildOrdinalMap(items) {
       if (!anchorEl || !wrap || !wrap.isConnected) return null;
 
       wrap.setAttribute('data-ezoic-after', String(afterPos));
-      ezoicInsertAfterWithToken(anchorEl, wrap, kindClass);
+      anchorEl.insertAdjacentElement('afterend', wrap);
 
       // Ensure minimal layout impact.
       try { wrap.style.contain = 'layout style paint'; } catch (e) {}
@@ -1620,49 +1510,206 @@ function buildOrdinalMap(items) {
 })();
 
 
-// ===== V14 token reconcile scheduler =====
-(function(){
-  var pending=false, last=0, COOLDOWN=140;
-  function schedule(scope){
-    var now=Date.now();
-    if (now-last<COOLDOWN) return;
-    if (pending) return;
-    pending=true;
-    requestAnimationFrame(function(){
-      pending=false; last=Date.now();
-      try { ezoicRepairBetweenWrapsToHost(); } catch(e) {}
-      try { ezoicReconcileOrDropHostsByToken(scope); } catch(e) {}
-    });
+
+// ===== V14.2 targeted hook (topic list only) + upscroll reconcile =====
+(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 TOPIC_LI_SEL = 'li[component="category/topic"]';
+
+  var lastY = 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()); }
   }
 
-  window.addEventListener('scroll', function(){ schedule(document); }, { passive:true });
-  window.addEventListener('resize', function(){ schedule(document); }, { passive:true });
+  function getScrollY() {
+    return window.pageYOffset || document.documentElement.scrollTop || 0;
+  }
 
-  if (window.jQuery) {
-    window.jQuery(window).on('action:ajaxify.end action:infiniteScroll.loaded', function(){
-      setTimeout(function(){ schedule(document); }, 0);
-      setTimeout(function(){ schedule(document); }, 220);
-      setTimeout(function(){ schedule(document); }, 800);
-    });
+  function isTopicList(ul) {
+    try { return !!(ul && ul.querySelector && ul.querySelector(TOPIC_LI_SEL)); } catch (e) { return false; }
   }
 
-  try {
-    if (typeof MutationObserver !== 'undefined') {
+  function closestTopicList(node) {
+    try {
+      var ul = node && node.closest ? node.closest('ul,ol') : null;
+      if (ul && isTopicList(ul)) return ul;
+      // sometimes wrap is outside: search up
+      var p = node && node.parentElement;
+      while (p) {
+        if ((p.tagName === 'UL' || p.tagName === 'OL') && isTopicList(p)) return p;
+        p = p.parentElement;
+      }
+    } catch (e) {}
+    return null;
+  }
+
+  function closestAnchorTopicLi(hostOrWrap, ul) {
+    try {
+      var cur = hostOrWrap;
+      if (!cur) return null;
+      // if wrap inside host li, start from host
+      if (cur.closest) {
+        var h = cur.closest('li.' + HOST_CLASS);
+        if (h) cur = h;
+      }
+      var prev = cur.previousElementSibling;
+      while (prev) {
+        if (prev.matches && prev.matches(TOPIC_LI_SEL)) return prev;
+        prev = prev.previousElementSibling;
+      }
+    } catch (e) {}
+    return null;
+  }
+
+  function ensureHostAndTokenForWrap(wrap) {
+    try {
+      if (!wrap || wrap.nodeType !== 1) return;
+      if (!(wrap.matches && wrap.matches(BETWEEN_SEL))) return;
+
+      var ul = closestTopicList(wrap);
+      if (!ul) return;
+
+      // Ensure wrap is not direct child of UL/OL
+      var host = wrap.closest ? wrap.closest('li.' + HOST_CLASS) : null;
+      if (!host) {
+        if (wrap.parentElement === ul) {
+          host = document.createElement('li');
+          host.className = HOST_CLASS;
+          host.setAttribute('role', 'listitem');
+          host.style.listStyle = 'none';
+          host.style.width = '100%';
+          ul.insertBefore(host, wrap);
+          host.appendChild(wrap);
+        }
+      }
+
+      if (!host) return;
+
+      // Anchor = previous topic LI only
+      var anchorLi = closestAnchorTopicLi(host, ul);
+      if (!anchorLi) {
+        host.setAttribute('data-ezoic-orphan', '1');
+        return;
+      }
+
+      var t = anchorLi.getAttribute(TOKEN_ATTR);
+      if (!t) {
+        t = token();
+        anchorLi.setAttribute(TOKEN_ATTR, t);
+      }
+      host.setAttribute(TOKEN_ATTR, t);
+      host.removeAttribute('data-ezoic-orphan');
+    } catch (e) {}
+  }
+
+  function repairInvalidUlChildren(ul) {
+    try {
+      if (!ul) return;
+      // Fix ul>div wraps
+      var bad = ul.querySelectorAll(':scope > ' + BETWEEN_SEL);
+      bad.forEach(function(wrap){ ensureHostAndTokenForWrap(wrap); });
+    } catch (e) {}
+  }
+
+  function cleanupEmptyHosts(ul) {
+    try {
+      if (!ul) return;
+      var hosts = ul.querySelectorAll('li.' + HOST_CLASS);
+      hosts.forEach(function(host){
+        try {
+          var hasWrap = host.querySelector && host.querySelector(BETWEEN_SEL);
+          if (!hasWrap) host.remove();
+        } catch (e) {}
+      });
+    } catch (e) {}
+  }
+
+  function reconcileUpScroll(ul) {
+    // Only reconcile (move/drop) on upscroll to avoid breaking infinite scroll load calculations.
+    try {
+      if (!ul) return;
+      var y = getScrollY();
+      var dy = y - lastY;
+      lastY = y;
+      if (dy >= -10) return; // not an upscroll
+
+      // Reconcile / drop
+      var hosts = ul.querySelectorAll('li.' + HOST_CLASS + '[' + TOKEN_ATTR + '], li.' + HOST_CLASS + '[data-ezoic-orphan="1"]');
+      hosts.forEach(function(host){
+        try {
+          if (host.getAttribute('data-ezoic-orphan') === '1') { host.remove(); return; }
+          var t = host.getAttribute(TOKEN_ATTR);
+          if (!t) { host.remove(); return; }
+          var anchor = ul.querySelector(TOPIC_LI_SEL + '[' + TOKEN_ATTR + '="' + t + '"]');
+          if (!anchor) { host.remove(); return; }
+          if (host.previousElementSibling !== anchor) anchor.insertAdjacentElement('afterend', host);
+        } catch (e) {}
+      });
+    } catch (e) {}
+  }
+
+  function sweepAll(reasonNode) {
+    try {
+      var ul = closestTopicList(reasonNode || document.querySelector(TOPIC_LI_SEL));
+      if (!ul) return;
+      repairInvalidUlChildren(ul);
+
+      // Tokenize any new wraps within this list
+      ul.querySelectorAll(BETWEEN_SEL).forEach(function(wrap){ ensureHostAndTokenForWrap(wrap); });
+
+      // Don't move on downscroll; only clean empties
+      cleanupEmptyHosts(ul);
+      reconcileUpScroll(ul);
+    } catch (e) {}
+  }
+
+  // Process mutations incrementally (no full-document scan)
+  function installMO() {
+    try {
+      if (typeof MutationObserver === 'undefined') return;
       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(m.target);
+          var m = muts[i];
+          if (m.addedNodes && m.addedNodes.length) {
+            for (var j=0;j<m.addedNodes.length;j++){
+              var n = m.addedNodes[j];
+              if (!n || n.nodeType !== 1) continue;
+              if (n.matches && n.matches(BETWEEN_SEL)) {
+                ensureHostAndTokenForWrap(n);
+              } else if (n.querySelector && n.querySelector(BETWEEN_SEL)) {
+                n.querySelectorAll(BETWEEN_SEL).forEach(function(w){ ensureHostAndTokenForWrap(w); });
+              }
+            }
+            // light sweep on the container only
+            sweepAll(m.target);
             break;
           }
         }
       });
-      document.querySelectorAll('ul,ol').forEach(function(list){
-        try { mo.observe(list, {childList:true}); } catch(e) {}
+      mo.observe(document.documentElement || document.body, { childList: true, subtree: true });
+    } catch (e) {}
+  }
+
+  function init() {
+    // initial tokenizing/repair
+    sweepAll(document);
+    window.addEventListener('scroll', function(){ sweepAll(document); }, { passive: true });
+    window.addEventListener('resize', function(){ sweepAll(document); }, { passive: true });
+
+    if (window.jQuery) {
+      window.jQuery(window).on('action:ajaxify.end action:infiniteScroll.loaded', function(){
+        setTimeout(function(){ sweepAll(document); }, 0);
+        setTimeout(function(){ sweepAll(document); }, 250);
       });
     }
-  } catch(e){}
+    installMO();
+  }
 
-  setTimeout(function(){ schedule(document); }, 0);
+  if (document.readyState === 'loading') document.addEventListener('DOMContentLoaded', init);
+  else init();
 })();
-// ===== /V14 =====
+// ===== /V14.2 =====
+

package/public/style.css

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