nodebb-plugin-ezoic-infinite 1.6.33 → 1.6.35

package/package.json

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

package/public/client.js

@@ -1514,162 +1514,222 @@ function buildOrdinalMap(items) {
 
 
 
-// ===== V17.5: Viewport-based pile masking (no moves, keeps injection intact) =====
-(function(){
+// ===== V18: Always host between DIVs in <li> + anchor by topic tid (MutationObserver, no scroll hooks to injection) =====
+(function () {
   var TOPIC_LI_SEL = 'li[component="category/topic"]';
   var BETWEEN_WRAP_SEL = 'div.nodebb-ezoic-wrap.ezoic-ad-between';
   var HOST_CLASS = 'nodebb-ezoic-host';
-  var PILED_ATTR = 'data-ezoic-piled';
-
-  var scheduled = false;
-  var lastRun = 0;
-  var COOLDOWN = 70;
+  var ANCHOR_ATTR = 'data-ezoic-anchor-tid';
 
-  var lastY = window.pageYOffset || document.documentElement.scrollTop || 0;
+  var pending = false;
+  var queue = new Set();
 
-  function getY(){ return window.pageYOffset || document.documentElement.scrollTop || 0; }
-
-  function getTopicList(){
-    try{
+  function getTopicList() {
+    try {
       var li = document.querySelector(TOPIC_LI_SEL);
       if (!li) return null;
       return li.closest ? li.closest('ul,ol') : null;
-    }catch(e){ return null; }
+    } catch (e) { return null; }
   }
 
-  function isBetweenNode(el){
-    try{
-      if (!el || el.nodeType!==1) return false;
-      if (el.matches && el.matches(BETWEEN_WRAP_SEL)) return true; // ul>div
-      if (el.tagName==='LI' && el.classList && el.classList.contains(HOST_CLASS)) {
-        return !!(el.querySelector && el.querySelector(BETWEEN_WRAP_SEL));
+  function extractTidFromTopicLi(li) {
+    // Parse tid from a topic link (/topic/{tid}/...)
+    try {
+      if (!li || !li.querySelector) return null;
+      var a = li.querySelector('a[href^="/topic/"], a[href*="/topic/"]');
+      if (!a) return null;
+      var href = a.getAttribute('href') || '';
+      var m = href.match(/\/topic\/(\d+)\b/);
+      return m ? m[1] : null;
+    } catch (e) { return null; }
+  }
+
+  function buildTidMap(ul) {
+    var map = Object.create(null);
+    try {
+      var topics = ul.querySelectorAll(TOPIC_LI_SEL);
+      for (var i = 0; i < topics.length; i++) {
+        var tid = extractTidFromTopicLi(topics[i]);
+        if (tid && !map[tid]) map[tid] = topics[i];
       }
-    }catch(e){}
-    return false;
+    } catch (e) {}
+    return map;
   }
 
-  function isTopicNode(el){
-    try{ return !!(el && el.nodeType===1 && el.matches && el.matches(TOPIC_LI_SEL)); }catch(e){ return false; }
+  function previousTopicLi(node) {
+    try {
+      var prev = node.previousElementSibling;
+      while (prev) {
+        if (prev.matches && prev.matches(TOPIC_LI_SEL)) return prev;
+        prev = prev.previousElementSibling;
+      }
+    } catch (e) {}
+    return null;
   }
 
-  function setPiled(el, piled){
-    try{
-      if (!el) return;
-      if (piled) el.setAttribute(PILED_ATTR,'1');
-      else el.removeAttribute(PILED_ATTR);
-    }catch(e){}
+  function ensureHostForWrap(wrap, ul) {
+    // Always ensure UL children are LI, to avoid NodeBB reparenting DIVs (root cause of pile-up).
+    try {
+      if (!wrap || wrap.nodeType !== 1) return null;
+      if (!(wrap.matches && wrap.matches(BETWEEN_WRAP_SEL))) return null;
+
+      var host = wrap.closest ? wrap.closest('li.' + HOST_CLASS) : null;
+      if (host) return host;
+
+      ul = ul || (wrap.closest ? wrap.closest('ul,ol') : null);
+      if (!ul || !(ul.tagName === 'UL' || ul.tagName === 'OL')) return null;
+
+      // Only wrap if it's a direct child of the list
+      if (wrap.parentElement === ul) {
+        host = document.createElement('li');
+        host.className = HOST_CLASS;
+        host.setAttribute('role', 'listitem');
+        host.style.listStyle = 'none';
+        host.style.width = '100%';
+
+        // anchor tid from previous topic
+        var anchor = previousTopicLi(wrap) || wrap.previousElementSibling;
+        if (anchor && anchor.matches && anchor.matches(TOPIC_LI_SEL)) {
+          var tid = extractTidFromTopicLi(anchor);
+          if (tid) host.setAttribute(ANCHOR_ATTR, tid);
+        }
+
+        ul.insertBefore(host, wrap);
+        host.appendChild(wrap);
+        try { wrap.style.width = '100%'; } catch (e) {}
+        return host;
+      }
+    } catch (e) {}
+    return null;
   }
 
-  function clearAll(ul){
-    try{
-      if (!ul) return;
-      ul.querySelectorAll('['+PILED_ATTR+'="1"]').forEach(function(n){ setPiled(n,false); });
-    }catch(e){}
+  function ensureAnchorTid(host) {
+    try {
+      if (!host || host.nodeType !== 1) return;
+      if (host.getAttribute(ANCHOR_ATTR)) return;
+      var anchor = previousTopicLi(host);
+      if (!anchor) return;
+      var tid = extractTidFromTopicLi(anchor);
+      if (tid) host.setAttribute(ANCHOR_ATTR, tid);
+    } catch (e) {}
   }
 
-  function maskViewportPile(ul){
-    // We mask piled ads based on what is actually near/in the viewport, not just first N children.
-    // This catches cases where virtualization moves some ads but not others.
-    try{
+  function reconcileHost(host, ul, tidMap) {
+    try {
+      if (!host || host.nodeType !== 1 || !host.isConnected) return;
+      ul = ul || host.parentElement;
       if (!ul) return;
-      var vh = window.innerHeight || 800;
-      var bandTop = -200;                // slightly above viewport
-      var bandBottom = vh * 1.6;         // covers top area user sees when returning up
-
-      // collect candidates in band in DOM order
-      var kids = ul.children;
-      var candidates = [];
-      for (var i=0;i<kids.length;i++){
-        var el = kids[i];
-        if (!isBetweenNode(el) && !isTopicNode(el)) continue;
-        // compute rect (cheap enough on limited band; stop after we've passed far below band)
-        var r = el.getBoundingClientRect ? el.getBoundingClientRect() : null;
-        if (!r) continue;
-        if (r.top > bandBottom && candidates.length > 0) {
-          // Once we've started collecting and we are past band, we can stop scanning further.
-          break;
-        }
-        if (r.bottom < bandTop) continue;
-        if (r.top > bandBottom) continue;
 
-        candidates.push(el);
-      }
+      // if host got detached from list, skip
+      if (!(ul.tagName === 'UL' || ul.tagName === 'OL')) return;
 
-      // Now walk candidates and hide consecutive between nodes (keep first between in a run)
-      var run = 0;
-      for (var j=0;j<candidates.length;j++){
-        var el2 = candidates[j];
-        if (isTopicNode(el2)){
-          run = 0;
-          continue;
-        }
-        if (isBetweenNode(el2)){
-          run++;
-          setPiled(el2, run >= 2);
-        }
+      ensureAnchorTid(host);
+
+      var tid = host.getAttribute(ANCHOR_ATTR);
+      if (!tid) return;
+
+      var anchorLi = tidMap[tid];
+      if (!anchorLi || !anchorLi.isConnected) return;
+
+      if (host.previousElementSibling !== anchorLi) {
+        anchorLi.insertAdjacentElement('afterend', host);
       }
-    }catch(e){}
+    } catch (e) {}
   }
 
-  function schedule(fn){
-    var now = Date.now();
-    if (now-lastRun < COOLDOWN) return;
-    if (scheduled) return;
-    scheduled = true;
-    requestAnimationFrame(function(){
-      scheduled = false;
-      lastRun = Date.now();
-      fn();
-    });
+  function drain() {
+    pending = false;
+    var ul = getTopicList();
+    if (!ul) return;
+
+    // First, host any direct-child between DIVs currently in list (cheap, keeps DOM valid).
+    try {
+      ul.querySelectorAll(':scope > ' + BETWEEN_WRAP_SEL).forEach(function (w) {
+        var h = ensureHostForWrap(w, ul);
+        if (h) queue.add(h);
+      });
+    } catch (e) {}
+
+    var tidMap = buildTidMap(ul);
+
+    // Process a limited batch per frame
+    var processed = 0;
+    for (var host of Array.from(queue)) {
+      queue.delete(host);
+      reconcileHost(host, ul, tidMap);
+      processed++;
+      if (processed >= 12) break;
+    }
+    if (queue.size) schedule();
   }
 
-  function onScroll(){
-    var y = getY();
-    var dy = y - lastY;
-    lastY = y;
+  function schedule() {
+    if (pending) return;
+    pending = true;
+    requestAnimationFrame(drain);
+  }
 
+  function enqueueNode(node, ul) {
+    try {
+      if (!node || node.nodeType !== 1) return;
+      if (node.matches && node.matches(BETWEEN_WRAP_SEL)) {
+        var h = ensureHostForWrap(node, ul);
+        if (h) queue.add(h);
+      } else if (node.tagName === 'LI' && node.classList && node.classList.contains(HOST_CLASS)) {
+        queue.add(node);
+      } else if (node.querySelectorAll) {
+        // only check within added subtree, not whole doc
+        node.querySelectorAll(':scope ' + BETWEEN_WRAP_SEL).forEach(function (w) {
+          var h2 = ensureHostForWrap(w, ul);
+          if (h2) queue.add(h2);
+        });
+        node.querySelectorAll(':scope li.' + HOST_CLASS).forEach(function (h3) { queue.add(h3); });
+      }
+    } catch (e) {}
+  }
+
+  function init() {
     var ul = getTopicList();
     if (!ul) return;
 
-    // Only manage pile masking when user is heading upward OR is near top-ish.
-    if (dy < -6 || y < 1100){
-      schedule(function(){ maskViewportPile(ul); });
-    } else if (dy > 12 && y > 1400){
-      // when leaving the top area, restore visibility
-      schedule(function(){ clearAll(ul); });
+    // Initial pass: host all between DIVs and reconcile once.
+    schedule();
+
+    // Observe only the topic list
+    if (typeof MutationObserver !== 'undefined') {
+      var mo = new MutationObserver(function (muts) {
+        try {
+          var u = getTopicList();
+          if (!u) return;
+
+          for (var i = 0; i < muts.length; i++) {
+            var m = muts[i];
+            if (m.addedNodes && m.addedNodes.length) {
+              for (var j = 0; j < m.addedNodes.length; j++) {
+                enqueueNode(m.addedNodes[j], u);
+              }
+            }
+          }
+          if (queue.size) schedule();
+        } catch (e) {}
+      });
+      try { mo.observe(ul, { childList: true, subtree: true }); } catch (e) {}
     }
-  }
 
-  function init(){
-    window.addEventListener('scroll', onScroll, { passive:true });
-    window.addEventListener('resize', function(){
-      var ul = getTopicList();
-      if (!ul) return;
-      schedule(function(){ maskViewportPile(ul); });
-    }, { passive:true });
-
-    if (window.jQuery){
-      try{
-        window.jQuery(window).on('action:ajaxify.end action:infiniteScroll.loaded', function(){
-          setTimeout(function(){
-            var ul = getTopicList();
-            if (!ul) return;
-            schedule(function(){ maskViewportPile(ul); });
-          }, 120);
+    // NodeBB events: run a settle pass after batches
+    if (window.jQuery) {
+      try {
+        window.jQuery(window).on('action:ajaxify.end action:infiniteScroll.loaded', function () {
+          // Let NodeBB append topics, then reconcile hosts by anchor tid.
+          setTimeout(function(){ schedule(); }, 120);
+          setTimeout(function(){ schedule(); }, 520);
         });
-      }catch(e){}
+      } catch (e) {}
     }
-
-    // initial
-    setTimeout(function(){
-      var ul = getTopicList();
-      if (!ul) return;
-      schedule(function(){ maskViewportPile(ul); });
-    }, 250);
   }
 
   if (document.readyState === 'loading') document.addEventListener('DOMContentLoaded', init);
   else init();
 })();
-// ===== /V17.5 =====
+// ===== /V18 =====
 

package/public/style.css

@@ -88,10 +88,8 @@ li.nodebb-ezoic-host > .nodebb-ezoic-wrap.ezoic-ad-between { width: 100%; displa
 
 
 
-/* ===== V17.5 pile hide ===== */
-[data-ezoic-piled="1"] { display: none !important; }
-/* keep host stable */
-li.nodebb-ezoic-host { list-style:none; width:100%; display:block; }
-li.nodebb-ezoic-host > .nodebb-ezoic-wrap.ezoic-ad-between { width:100%; display:block; }
-/* ===== /V17.5 ===== */
+/* ===== V18 hosts ===== */
+li.nodebb-ezoic-host{ list-style:none; width:100%; display:block; }
+li.nodebb-ezoic-host > .nodebb-ezoic-wrap.ezoic-ad-between{ width:100%; display:block; }
+/* ===== /V18 ===== */