nodebb-plugin-ezoic-infinite 0.8.7 → 0.8.9

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nodebb-plugin-ezoic-infinite",
-  "version": "0.8.7",
+  "version": "0.8.9",
   "description": "Ezoic ads with infinite scroll using a pool of placeholder IDs",
   "main": "library.js",
   "license": "MIT",

package/plugin.json

@@ -22,5 +22,8 @@
   "scripts": [
     "public/client.js"
   ],
-  "templates": "public/templates"
+  "templates": "public/templates",
+  "css": [
+    "public/style.css"
+  ]
 }

package/public/client.js

@@ -1,6 +1,6 @@
 'use strict';
-/* globals ajaxify */
 
+/* globals ajaxify */
 window.ezoicInfiniteLoaded = true;
 
 let cachedConfig;
@@ -10,23 +10,22 @@ let debounceTimer;
 let inFlight = false;
 let rerunRequested = false;
 
-// Per-page state
+// Per-page state (keyed by tid/cid)
 let pageKey = null;
 
-// Topic page: anchor ads to absolute post number
-let seenAfterPostNo = new Set(); // post numbers we've inserted after
-let usedIds = new Set();         // ids currently present in DOM
-let fifo = [];                   // [{afterPostNo, id}]
+// Topic page state: anchor ads to absolute post number (not DOM index)
+let seenAfterPostNo = new Set();   // post numbers we've already inserted an ad after
+let usedIds = new Set();           // ids currently in DOM
+let fifo = [];                     // [{afterPostNo, id}]
 
-// Category topic list page: anchor ads to absolute position
-let seenAfterTopicPos = new Set();
-let fifoCat = [];                // [{afterPos, id}]
+// Category page state: anchor to absolute topic position if available
+let seenAfterTopicPos = new Set(); // topic positions we've inserted after
+let fifoCat = [];                  // [{afterPos, id}]
 
 function resetState() {
   seenAfterPostNo = new Set();
   seenAfterTopicPos = new Set();
-  usedIdsMsg = new Set();
-  usedIdsBetween = new Set();
+  usedIds = new Set();
   fifo = [];
   fifoCat = [];
 }
@@ -51,7 +50,7 @@ function parsePool(raw) {
 }
 
 async function fetchConfig() {
-  if (cachedConfig && Date.now() - lastFetch < 8000) return cachedConfig;
+  if (cachedConfig && Date.now() - lastFetch < 10000) return cachedConfig;
   const res = await fetch('/api/plugins/ezoic-infinite/config', { credentials: 'same-origin' });
   cachedConfig = await res.json();
   lastFetch = Date.now();
@@ -59,10 +58,7 @@ async function fetchConfig() {
 }
 
 function isTopicPage() {
-  try {
-    if (ajaxify && ajaxify.data && ajaxify.data.tid) return true;
-  } catch (e) {}
-  return /^\/topic\//.test(window.location.pathname);
+  return $('[component="post/content"]').length > 0 || $('[component="post"][data-pid]').length > 0;
 }
 
 function isCategoryTopicListPage() {
@@ -73,7 +69,7 @@ function getTopicPosts() {
   const $primary = $('[component="post"][data-pid]');
   if ($primary.length) return $primary;
 
-  // Fallback: top-level nodes with post/content (avoid nested)
+  // fallback: top-level with post/content
   return $('[data-pid]').filter(function () {
     const $el = $(this);
     const hasContent = $el.find('[component="post/content"]').length > 0;
@@ -86,7 +82,7 @@ function getCategoryTopicItems() {
   return $('li[component="category/topic"]');
 }
 
-// If target's parent is UL/OL, wrapper must be LI
+// If target's parent is UL/OL, wrapper MUST be LI (otherwise browser may move it to top)
 function wrapperTagFor($target) {
   if (!$target || !$target.length) return 'div';
   const parentTag = ($target.parent().prop('tagName') || '').toUpperCase();
@@ -106,202 +102,69 @@ function makeWrapperLike($target, classes, innerHtml, attrs) {
 }
 
 function cleanupOnNav() {
-  $('.ezoic-ad-post, .ezoic-ad-topic').remove();
+  $('.ezoic-ad-post, .ezoic-ad-topic, .ezoic-ad-between').remove();
 }
 
-function pickNextId(pool, usedSet) {
+function pickNextId(pool) {
   for (const id of pool) {
-    if (!usedSet.has(id)) return id;
+    if (!usedIds.has(id)) return id;
   }
   return null;
-  } finally {
-    window.__ezoicRecycling = false;
-  }
 }
 
-function destroyEzoicId(id) {
-  window.__ezoicLastDestroy = window.__ezoicLastDestroy || {};
-  const now = Date.now();
-  if (window.__ezoicLastDestroy[id] && now - window.__ezoicLastDestroy[id] < 2000) {
-    return;
-  }
-  window.__ezoicLastDestroy[id] = now;
-  try {
-    window.ezstandalone = window.ezstandalone || {};
-    window.ezstandalone.cmd = window.ezstandalone.cmd || [];
-    const fn = function () {
-      try {
-        if (typeof window.ezstandalone.destroyPlaceholders === 'function') {
-          window.ezstandalone.destroyPlaceholders(id);
-        }
-      } catch (e) {}
-    };
-    if (typeof window.ezstandalone.destroyPlaceholders === 'function') fn();
-    else window.ezstandalone.cmd.push(fn);
-  } catch (e) {}
-}
-
-function recycleOldestTopicId($posts) {
-  if (window.__ezoicRecycling) return null;
-  window.__ezoicRecycling = true;
-  try {
-  if (!fifo.length) return null;
+function removeOldestTopicAd() {
   fifo.sort((a, b) => a.afterPostNo - b.afterPostNo);
+  const old = fifo.shift();
+  if (!old) return false;
 
-  while (fifo.length) {
-    const old = fifo.shift();
-    const sel = '.ezoic-ad-post[data-ezoic-after="' + old.afterPostNo + '"][data-ezoic-id="' + old.id + '"]';
-    const $el = $(sel);
-    if (!$el.length) continue;
+  const sel = '.ezoic-ad-post[data-ezoic-after="' + old.afterPostNo + '"][data-ezoic-id="' + old.id + '"]';
+  const $el = $(sel);
+  if ($el.length) $el.remove();
 
-    // Never recycle the ad that is right after the last real post (sentinel)
-    try {
-      const $last = $posts.last();
-      if ($last.length && $el.prev().is($last)) {
-        fifo.push(old);
-        return null;
-      }
-    } catch (e) {}
-
-    $el.remove();
-    usedIdsMsg.delete(old.id);
-    destroyEzoicId(old.id);
-    return old.id;
-  }
-  return null;
-  } finally {
-    window.__ezoicRecycling = false;
-  }
+  usedIds.delete(old.id);
+  // DO NOT delete seenAfterPostNo to prevent re-insertion in the top area
+  return true;
 }
 
-function recycleOldestCategoryId($items) {
-  if (window.__ezoicRecycling) return null;
-  window.__ezoicRecycling = true;
-  try {
-  if (!fifoCat.length) return null;
+function removeOldestCategoryAd() {
   fifoCat.sort((a, b) => a.afterPos - b.afterPos);
+  const old = fifoCat.shift();
+  if (!old) return false;
 
-  while (fifoCat.length) {
-    const old = fifoCat.shift();
-    const sel = '.ezoic-ad-topic[data-ezoic-after="' + old.afterPos + '"][data-ezoic-id="' + old.id + '"]';
-    const $el = $(sel);
-    if (!$el.length) continue;
+  const sel = '.ezoic-ad-topic[data-ezoic-after="' + old.afterPos + '"][data-ezoic-id="' + old.id + '"]';
+  const $el = $(sel);
+  if ($el.length) $el.remove();
 
-    try {
-      const $last = $items.last();
-      if ($last.length && $el.prev().is($last)) {
-        fifoCat.push(old);
-        return null;
-      }
-    } catch (e) {}
-
-    $el.remove();
-    usedIdsBetween.delete(old.id);
-    destroyEzoicId(old.id);
-    return old.id;
-  }
-  return null;
-}
-
-function setupAdAutoHeight() {
-  if (window.__ezoicAutoHeightAttached) return;
-  window.__ezoicAutoHeightAttached = true;
-
-  try {
-    const ro = new ResizeObserver(function () {
-      document.querySelectorAll('.ezoic-ad').forEach(function (wrap) {
-        // Collapse until content is injected
-        if (!wrap.classList.contains('ezoic-filled')) {
-          wrap.style.display = 'none';
-        }
-        wrap.style.minHeight = '0px';
-        wrap.style.height = 'auto';
-      });
-    });
-
-    function attach() {
-      document.querySelectorAll('.ezoic-ad').forEach(function (wrap) {
-        // Collapse until content is injected
-        if (!wrap.classList.contains('ezoic-filled')) {
-          wrap.style.display = 'none';
-        }
-        if (wrap.__ezoicRO) return;
-        wrap.__ezoicRO = true;
-        ro.observe(wrap);
-      });
-    }
-
-    attach();
-    setTimeout(attach, 600);
-    setTimeout(attach, 1600);
-  } catch (e) {}
+  usedIds.delete(old.id);
+  return true;
 }
 
 function callEzoic(ids) {
+  // ids optional; if omitted, we will scan DOM for unrendered placeholders
   window.ezstandalone = window.ezstandalone || {};
   window.ezstandalone.cmd = window.ezstandalone.cmd || [];
 
-  const markAndFilterByIds = function (list) {
-    const out = [];
-    list.forEach(function (id) {
-      const sel = '.ezoic-ad[data-ezoic-id="' + id + '"]';
-      const wraps = document.querySelectorAll(sel);
-      let anyUnrendered = false;
-      wraps.forEach(function (w) {
-        if (w.getAttribute('data-ezoic-rendered') !== '1') {
-          anyUnrendered = true;
-        }
-      });
-      if (!wraps.length) {
-        // fallback: if wrapper is missing, allow showAds (Ezoic might still handle placeholder)
-        out.push(id);
-        return;
-      }
-      if (anyUnrendered) {
-        wraps.forEach(function (w) { w.setAttribute('data-ezoic-rendered', '1'); });
-        out.push(id);
-      }
-    });
-    return out;
-  };
-
   const collect = function () {
     const list = [];
-    document.querySelectorAll('.ezoic-ad').forEach(function (wrap) {
-        // Collapse until content is injected
-        if (!wrap.classList.contains('ezoic-filled')) {
-          wrap.style.display = 'none';
-        }
-      if (wrap.getAttribute('data-ezoic-rendered') === '1') return;
-      const ph = wrap.querySelector('[id^="ezoic-pub-ad-placeholder-"]');
-        if (ph && ph.children && ph.children.length) {
-          // Content injected
-          wrap.classList.add('ezoic-filled');
-          wrap.style.display = '';
-        }
-      if (!ph) return;
+    document.querySelectorAll('.ezoic-ad [id^="ezoic-pub-ad-placeholder-"]').forEach(function (ph) {
       const idStr = ph.id.replace('ezoic-pub-ad-placeholder-', '');
       const id = parseInt(idStr, 10);
       if (!Number.isFinite(id) || id <= 0) return;
-      wrap.setAttribute('data-ezoic-rendered', '1');
+
+      const wrap = ph.closest('.ezoic-ad');
+      if (!wrap) return;
+      if (wrap.getAttribute('data-ezoic-rendered') === '1') return;
+
       list.push(id);
+      wrap.setAttribute('data-ezoic-rendered', '1');
     });
+    // de-dupe
     return Array.from(new Set(list));
   };
 
-  const input = (ids && ids.length) ? Array.from(new Set(ids)) : null;
-  const toShow = input ? markAndFilterByIds(input) : collect();
+  const toShow = (ids && ids.length) ? Array.from(new Set(ids)) : collect();
   if (!toShow.length) return;
 
-  // De-dupe rapid duplicate calls (observer/poller can fire twice)
-  const key = toShow.join(',');
-  const now = Date.now();
-  if (window.__ezoicLastShowKey === key && (now - (window.__ezoicLastShowAt || 0)) < 1200) {
-    return;
-  }
-  window.__ezoicLastShowKey = key;
-  window.__ezoicLastShowAt = now;
-
   const run = function () {
     try {
       if (typeof window.ezstandalone.showAds === 'function') {
@@ -338,15 +201,13 @@ function callEzoic(ids) {
 }
 
 function getPostNumber($post) {
-  // Harmony: <a class="post-index">#72</a>
+  const di = parseInt($post.attr('data-index'), 10);
+  if (Number.isFinite(di) && di > 0) return di;
+
   const txt = ($post.find('a.post-index').first().text() || '').trim();
   const m = txt.match(/#\s*(\d+)/);
   if (m) return parseInt(m[1], 10);
 
-  // fallback data-index (often 0/1 based)
-  const di = parseInt($post.attr('data-index'), 10);
-  if (Number.isFinite(di) && di >= 0) return di + 1;
-
   return NaN;
 }
 
@@ -363,20 +224,16 @@ function injectTopicMessageAds($posts, pool, interval) {
 
   $posts.each(function () {
     const $p = $(this);
-    // Never insert after the last post (sentinel)
+    // Never insert after the last real post: it can break NodeBB infinite scroll
     if ($p.is($posts.last())) return;
-
     const postNo = getPostNumber($p);
     if (!Number.isFinite(postNo) || postNo <= 0) return;
 
     if (postNo % interval !== 0) return;
     if (seenAfterPostNo.has(postNo)) return;
 
-    let id = pickNextId(pool, usedIdsMsg);
-    if (!id) {
-      id = recycleOldestTopicId($posts);
-      if (!id) return;
-    }
+    let id = pickNextId(pool);
+    if (!id) { return; }
 
     const inner = '<div class="ezoic-ad-message-inner"><div id="ezoic-pub-ad-placeholder-' + id + '"></div></div>';
     const html = makeWrapperLike(
@@ -389,7 +246,7 @@ function injectTopicMessageAds($posts, pool, interval) {
     $p.after(html);
 
     seenAfterPostNo.add(postNo);
-    usedIdsMsg.add(id);
+    usedIds.add(id);
     fifo.push({ afterPostNo: postNo, id: id });
     newIds.push(id);
   });
@@ -402,20 +259,16 @@ function injectCategoryBetweenAds($items, pool, interval) {
 
   $items.each(function () {
     const $it = $(this);
-    // Never insert after the last topic item (sentinel)
+    // Never insert after the last real topic item (keeps NodeBB infinite scroll working)
     if ($it.is($items.last())) return;
-
     const pos = getTopicPos($it);
     if (!Number.isFinite(pos) || pos <= 0) return;
 
     if (pos % interval !== 0) return;
     if (seenAfterTopicPos.has(pos)) return;
 
-    let id = pickNextId(pool, usedIdsBetween);
-    if (!id) {
-      id = recycleOldestCategoryId($items);
-      if (!id) return;
-    }
+    let id = pickNextId(pool);
+    if (!id) { return; }
 
     const placeholder = '<div id="ezoic-pub-ad-placeholder-' + id + '"></div>';
     const html = makeWrapperLike(
@@ -428,7 +281,7 @@ function injectCategoryBetweenAds($items, pool, interval) {
     $it.after(html);
 
     seenAfterTopicPos.add(pos);
-    usedIdsBetween.add(id);
+    usedIds.add(id);
     fifoCat.push({ afterPos: pos, id: id });
     newIds.push(id);
   });
@@ -437,9 +290,6 @@ function injectCategoryBetweenAds($items, pool, interval) {
 }
 
 async function refreshAds() {
-  const now = Date.now();
-  if (window.__ezoicRefreshThrottle && now - window.__ezoicRefreshThrottle < 250) return;
-  window.__ezoicRefreshThrottle = now;
   const key = getPageKey();
   if (pageKey !== key) {
     pageKey = key;
@@ -460,20 +310,17 @@ async function refreshAds() {
     const messagePool = parsePool(cfg.messagePlaceholderIds);
     const messageInterval = Math.max(1, parseInt(cfg.messageIntervalPosts, 10) || 3);
 
-    const hasTopicList = isCategoryTopicListPage();
     const onTopic = isTopicPage();
-    const onCategory = hasTopicList && !onTopic;
+    const onCategory = !onTopic && isCategoryTopicListPage();
 
     const newIds = [];
 
-    // Rule: topic list => between only ; topic page => message only
     if (onCategory) {
       const $items = getCategoryTopicItems();
       if (cfg.enableBetweenAds && betweenPool.length && $items.length) {
         newIds.push(...injectCategoryBetweenAds($items, betweenPool, betweenInterval));
       }
       callEzoic(newIds);
-      // also ensure any unrendered placeholders are rendered
       callEzoic();
       return;
     }
@@ -484,6 +331,7 @@ async function refreshAds() {
         newIds.push(...injectTopicMessageAds($posts, messagePool, messageInterval));
       }
       callEzoic(newIds);
+      callEzoic();
     }
   } finally {
     inFlight = false;
@@ -499,47 +347,28 @@ function debounceRefresh() {
   debounceTimer = setTimeout(refreshAds, 220);
 }
 
-$(document).ready(function () { setupAdAutoHeight(); debounceRefresh(); });
-
-$(window).on('action:ajaxify.start', function (ev, data) {
-  // IMPORTANT: do not cleanup on infinite scroll loads; only when navigating to a different page.
-  try {
-    const targetUrl = (data && (data.url || data.href)) ? String(data.url || data.href) : '';
-    if (targetUrl) {
-      const a = document.createElement('a');
-      a.href = targetUrl;
-      const targetPath = a.pathname || targetUrl;
-      // If we're staying on the same logical page (same path), don't wipe ads/state
-      if (targetPath === window.location.pathname) {
-        return;
-      }
-    }
-  } catch (e) {}
-  pageKey = null;
-  resetState();
-  cleanupOnNav();
-});
+$(document).ready(debounceRefresh);
 $(window).on('action:ajaxify.end action:posts.loaded action:topic.loaded action:topics.loaded action:category.loaded', debounceRefresh);
+setTimeout(debounceRefresh, 2200);
 
-setTimeout(function () { setupAdAutoHeight(); debounceRefresh(); }, 2200);
-
-// Observer + poller: ensure we rerun when NodeBB injects new items
+// Fallback: some themes/devices don't emit the expected events for infinite scroll.
+// Observe DOM additions and trigger a refresh when new posts/topics are appended/prepended.
 (function setupEzoicObserver() {
   if (window.__ezoicInfiniteObserver) return;
   try {
-    const trigger = function () { debounceRefresh(); };
-
     const obs = new MutationObserver(function (mutations) {
       for (const m of mutations) {
         if (!m.addedNodes || !m.addedNodes.length) continue;
         for (const n of m.addedNodes) {
           if (!n || n.nodeType !== 1) continue;
+          // direct match
           if (n.matches && (n.matches('[component="post"][data-pid]') || n.matches('li[component="category/topic"]'))) {
-            trigger();
+            debounceRefresh();
             return;
           }
+          // descendant match
           if (n.querySelector && (n.querySelector('[component="post"][data-pid]') || n.querySelector('li[component="category/topic"]'))) {
-            trigger();
+            debounceRefresh();
             return;
           }
         }
@@ -547,19 +376,5 @@ setTimeout(function () { setupAdAutoHeight(); debounceRefresh(); }, 2200);
     });
     obs.observe(document.body, { childList: true, subtree: true });
     window.__ezoicInfiniteObserver = obs;
-
-    let lastPostCount = 0;
-    let lastTopicCount = 0;
-    setInterval(function () {
-      try {
-        const posts = document.querySelectorAll('[component="post"][data-pid]').length;
-        const topics = document.querySelectorAll('li[component="category/topic"]').length;
-        if (posts !== lastPostCount || topics !== lastTopicCount) {
-          lastPostCount = posts;
-          lastTopicCount = topics;
-          trigger();
-        }
-      } catch (e) {}
-    }, 1500);
   } catch (e) {}
 })();

package/public/style.css

@@ -1,4 +1,2 @@
-.ezoic-ad{min-height:0 !important;height:auto !important;padding:0 !important;margin:0.5rem 0;}
-.ezoic-ad:not(.ezoic-filled){display:none !important;}
-.ezoic-ad-message-inner{padding:0;margin:0;}
-.ezoic-ad-message-inner > div{margin:0;padding:0;}
+.ezoic-ad-post{margin:0.75rem 0;}
+.ezoic-ad-message-inner{padding:0.75rem 0;}