nodebb-plugin-ezoic-infinite 1.0.16 → 1.0.18

package/package.json

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

package/public/client.js

@@ -21,6 +21,11 @@
   let usedMessage = new Set();  // between replies
   let fifoBetween = [];
   let fifoMessage = [];
+    // reset serialized showAds queues
+    try {
+      if (typeof queues !== 'undefined') { queues.between.length = 0; queues.message.length = 0; }
+      if (typeof queueState !== 'undefined') { queueState.between = false; queueState.message = false; }
+    } catch (e) {}
 
   function getPageKey() {
     try {
@@ -91,6 +96,11 @@
     usedMessage = new Set();
     fifoBetween = [];
     fifoMessage = [];
+    // reset serialized showAds queues
+    try {
+      if (typeof queues !== 'undefined') { queues.between.length = 0; queues.message.length = 0; }
+      if (typeof queueState !== 'undefined') { queueState.between = false; queueState.message = false; }
+    } catch (e) {}
   }
 
   function destroyPlaceholder(id) {
@@ -116,6 +126,84 @@
     destroyPlaceholder(id);
   }
 
+  // Ensure placeholders are filled in the same order they were inserted.
+  // Ezoic can fill asynchronously; we serialize showAds calls per page-type queue.
+  const queues = { between: [], message: [] };
+  const queueState = { between: false, message: false };
+
+  function isFilled(placeholderEl) {
+    if (!placeholderEl) return false;
+    if (placeholderEl.children && placeholderEl.children.length) return true;
+    const html = placeholderEl.innerHTML || '';
+    if (html.trim().length > 0) return true;
+    const r = placeholderEl.getBoundingClientRect ? placeholderEl.getBoundingClientRect() : null;
+    if (r && r.height > 10) return true;
+    return false;
+  }
+
+  function waitForFilled(placeholderEl, timeoutMs) {
+    return new Promise((resolve) => {
+      if (!placeholderEl) return resolve(false);
+      if (isFilled(placeholderEl)) return resolve(true);
+
+      let done = false;
+      const finish = (ok) => {
+        if (done) return;
+        done = true;
+        try { obs.disconnect(); } catch (e) {}
+        resolve(ok);
+      };
+
+      const obs = new MutationObserver(() => {
+        if (isFilled(placeholderEl)) finish(true);
+      });
+
+      try {
+        obs.observe(placeholderEl, { childList: true, subtree: true, attributes: true });
+      } catch (e) {}
+
+      setTimeout(() => finish(isFilled(placeholderEl)), timeoutMs);
+    });
+  }
+
+  async function processQueue(kind) {
+    if (queueState[kind]) return;
+    queueState[kind] = true;
+
+    try {
+      while (queues[kind].length) {
+        const item = queues[kind][0];
+        const wrap = item.wrapper;
+        const id = item.id;
+
+        // if removed (recycled) before fill, drop it
+        if (!wrap || !wrap.isConnected) {
+          queues[kind].shift();
+          continue;
+        }
+
+        // call showAds once
+        callShowAdsSingle(id);
+
+        // wait for fill (or timeout) then proceed
+        const ph = document.getElementById('ezoic-pub-ad-placeholder-' + id);
+        await waitForFilled(ph, 5000);
+
+        queues[kind].shift();
+      }
+    } finally {
+      queueState[kind] = false;
+    }
+  }
+
+  function enqueueShowAds(kind, wrapperEl, id) {
+    if (!wrapperEl || !id) return;
+    if (wrapperEl.getAttribute('data-ezoic-shown') === '1') return;
+    wrapperEl.setAttribute('data-ezoic-shown', '1');
+    queues[kind].push({ wrapper: wrapperEl, id });
+    processQueue(kind);
+  }
+
   function showAdsOnceForElement(wrapperEl, id) {
     if (!wrapperEl || !id) return;
     if (wrapperEl.getAttribute('data-ezoic-shown') === '1') return;
@@ -237,7 +325,8 @@
 
     items.forEach((li, idx) => {
       const pos = idx + 1;
-      if (pos % interval !== 0) return;
+      const firstEnabled = normalizeBool(cfg.showFirstTopicAd);
+      if (!(firstEnabled && pos === 1) && (pos % interval !== 0)) return;
       if (idx === items.length - 1) return;
 
       const next = li.nextElementSibling;
@@ -253,7 +342,7 @@
       fifoBetween.push({ id, after: pos });
 
       const wrap = insertAfter(li, id, 'ezoic-ad-between', pos);
-      showAdsOnceForElement(wrap, id);
+      enqueueShowAds('between', wrap, id);
     });
   }
 
@@ -268,7 +357,8 @@
 
     posts.forEach((post, idx) => {
       const no = idx + 1;
-      if (no % interval !== 0) return;
+      const firstEnabled = normalizeBool(cfg.showFirstMessageAd);
+      if (!(firstEnabled && no === 1) && (no % interval !== 0)) return;
       if (idx === posts.length - 1) return;
 
       const next = post.nextElementSibling;
@@ -284,7 +374,7 @@
       fifoMessage.push({ id, after: no });
 
       const wrap = insertAfter(post, id, 'ezoic-ad-message', no);
-      showAdsOnceForElement(wrap, id);
+      enqueueShowAds('between', wrap, id);
     });
   }
 

package/public/templates/admin/plugins/ezoic-infinite.tpl

@@ -7,6 +7,10 @@
     <div class="form-check mb-3">
       <input class="form-check-input" type="checkbox" id="enableBetweenAds" name="enableBetweenAds" {enableBetweenAds_checked}>
       <label class="form-check-label" for="enableBetweenAds">Activer les pubs entre les posts</label>
+				<div class="form-check mt-2">
+					<input class="form-check-input" type="checkbox" name="showFirstTopicAd" />
+					<label class="form-check-label">Afficher une pub après le 1er sujet</label>
+				</div>
     </div>
 
     <div class="mb-3">
@@ -28,6 +32,10 @@
     <div class="form-check mb-3">
       <input class="form-check-input" type="checkbox" id="enableMessageAds" name="enableMessageAds" {enableMessageAds_checked}>
       <label class="form-check-label" for="enableMessageAds">Activer les pubs “message”</label>
+				<div class="form-check mt-2">
+					<input class="form-check-input" type="checkbox" name="showFirstMessageAd" />
+					<label class="form-check-label">Afficher une pub après le 1er message</label>
+				</div>
     </div>
 
     <div class="mb-3">