nodebb-plugin-ezoic-infinite 0.5.3 → 0.5.4

package/package.json

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

package/public/client.js

@@ -1,6 +1,8 @@
 /* globals ajaxify */
 'use strict';
 
+window.ezoicInfiniteLoaded = true;
+
 let cachedConfig;
 let lastFetch = 0;
 let debounceTimer;
@@ -22,14 +24,30 @@ function parsePool(raw) {
   ));
 }
 
+/**
+ * Harmony: the real post wrapper is usually [component="post"][data-pid]
+ * We must avoid counting nested nodes like component="post/parent" or other elements
+ * that can also carry data-pid in some setups.
+ */
 function getTopicPosts() {
-  const $p = $('[component="post"]').not('.ezoic-ad-post');
-  if ($p.length) return $p;
+  const $primary = $('[component="post"][data-pid]');
+  if ($primary.length) return $primary.not('.ezoic-ad-post');
+
+  // Fallback: top-level nodes with data-pid that contain the post content,
+  // excluding nodes nested inside another data-pid container.
+  const $top = $('[data-pid]').filter(function () {
+    const $el = $(this);
+    const hasContent = $el.find('[component="post/content"]').length > 0;
+    const nested = $el.parents('[data-pid]').length > 0;
+    return hasContent && !nested;
+  });
+  if ($top.length) return $top.not('.ezoic-ad-post');
+
   return $('.posts .post').not('.ezoic-ad-post');
 }
 
-function isLi($el) {
-  return ($el && $el.length && (($el.prop('tagName') || '').toUpperCase() === 'LI'));
+function tagName($el) {
+  return ($el && $el.length ? (($el.prop('tagName') || '').toUpperCase()) : '');
 }
 
 function removePlaceholdersByPool(pool) {
@@ -42,43 +60,25 @@ function removeAdWrappers() {
 }
 
 function computeWindowSlots(totalItems, interval, poolSize) {
+  // totalItems posts -> number of ad slots at positions interval, 2*interval, ...
   const slots = Math.floor(totalItems / interval);
   if (slots <= 0) return [];
+
+  // IMPORTANT:
+  // We cannot display more than poolSize ads at once because Ezoic placeholder IDs
+  // must be unique on the page. If slots > poolSize, we only render the latest poolSize slots.
   const start = Math.max(1, slots - poolSize + 1);
   const out = [];
   for (let s = start; s <= slots; s++) out.push(s);
   return out;
 }
 
-function makeBetweenWrapper($targetPost, placeholderId) {
-  if (isLi($targetPost)) {
-    return (
-      '<li class="ezoic-ad-between list-unstyled" data-ezoic-ad="1">' +
-        '<div id="ezoic-pub-ad-placeholder-' + placeholderId + '"></div>' +
-      '</li>'
-    );
-  }
-  return '<div class="ezoic-ad-between" id="ezoic-pub-ad-placeholder-' + placeholderId + '"></div>';
-}
-
-function makeAdMessageWrapper($targetPost, placeholderId) {
-  if (isLi($targetPost)) {
-    return (
-      '<li class="post ezoic-ad-post" data-ezoic-ad="1">' +
-        '<div class="content">' +
-          '<div id="ezoic-pub-ad-placeholder-' + placeholderId + '"></div>' +
-        '</div>' +
-      '</li>'
-    );
+function makeWrapperLike($target, classes, innerHtml) {
+  const t = tagName($target);
+  if (t === 'LI') {
+    return '<li class="' + classes + ' list-unstyled" data-ezoic-ad="1">' + innerHtml + '</li>';
   }
-
-  return (
-    '<div class="post ezoic-ad-post" data-ezoic-ad="1">' +
-      '<div class="content">' +
-        '<div id="ezoic-pub-ad-placeholder-' + placeholderId + '"></div>' +
-      '</div>' +
-    '</div>'
-  );
+  return '<div class="' + classes + '" data-ezoic-ad="1">' + innerHtml + '</div>';
 }
 
 function insertBetweenPosts($posts, pool, interval) {
@@ -89,12 +89,13 @@ function insertBetweenPosts($posts, pool, interval) {
   const activeIds = [];
   for (let i = 0; i < slotsToRender.length; i++) {
     const slotNumber = slotsToRender[i];
-    const id = pool[i];
-    const index = slotNumber * interval - 1;
+    const id = pool[i]; // map latest slots to pool in order
+    const index = slotNumber * interval - 1; // 0-based index of the post after which we insert
     const $target = $posts.eq(index);
     if (!$target.length) continue;
 
-    $target.after(makeBetweenWrapper($target, id));
+    const html = makeWrapperLike($target, 'ezoic-ad-between', '<div id="ezoic-pub-ad-placeholder-' + id + '"></div>');
+    $target.after(html);
     activeIds.push(id);
   }
   return activeIds;
@@ -113,14 +114,17 @@ function insertAdMessagesBetweenReplies($posts, pool, interval) {
     const $target = $posts.eq(index);
     if (!$target.length) continue;
 
-    $target.after(makeAdMessageWrapper($target, id));
+    const inner = '<div class="content"><div id="ezoic-pub-ad-placeholder-' + id + '"></div></div>';
+    const html = makeWrapperLike($target, 'post ezoic-ad-post', inner);
+    $target.after(html);
     activeIds.push(id);
   }
   return activeIds;
 }
 
 async function refreshAds() {
-  const cfg = await fetchConfig();
+  let cfg;
+  try { cfg = await fetchConfig(); } catch (e) { return; }
   if (!cfg || cfg.excluded) return;
 
   const betweenPool = parsePool(cfg.placeholderIds);
@@ -132,6 +136,7 @@ async function refreshAds() {
   const $posts = getTopicPosts();
   if (!$posts.length) return;
 
+  // Clean first
   removeAdWrappers();
   removePlaceholdersByPool(betweenPool);
   removePlaceholdersByPool(messagePool);
@@ -146,18 +151,24 @@ async function refreshAds() {
     activeIds.push(...insertAdMessagesBetweenReplies($posts, messagePool, messageInterval));
   }
 
+  // Ezoic render
   if (activeIds.length && window.ezstandalone && typeof window.ezstandalone.destroyPlaceholders === 'function') {
     try { window.ezstandalone.destroyPlaceholders(); } catch (e) {}
   }
   activeIds.forEach(id => {
-    try { window.ezstandalone && typeof window.ezstandalone.showAds === 'function' && window.ezstandalone.showAds(id); } catch (e) {}
+    try {
+      if (window.ezstandalone && typeof window.ezstandalone.showAds === 'function') {
+        window.ezstandalone.showAds(id);
+      }
+    } catch (e) {}
   });
 }
 
 function debounceRefresh() {
   clearTimeout(debounceTimer);
-  debounceTimer = setTimeout(refreshAds, 100);
+  debounceTimer = setTimeout(refreshAds, 150);
 }
 
+$(document).ready(debounceRefresh);
 $(window).on('action:ajaxify.end action:posts.loaded action:topic.loaded', debounceRefresh);
-setTimeout(debounceRefresh, 800);
+setTimeout(debounceRefresh, 1500);