Ad engine v1: banner/text/login campaigns against on-chain credits

Spec 8b types 1-3. Spend accrues per campaign in batches; burns queue for
the engine signer (admin runs consume() on-chain, /api/admin/burns). Rates
are volume config (adrates.json), rehearsal placeholders until Marty sets
the real card. Public slots serve on the ledger page; campaign manager in
the members area.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

public/assets/common.js

@@ -84,5 +84,22 @@ window.IAP = (function () {
       + '<span class="tx"><a target="_blank" rel="noopener" href="' + c.explorer + '/tx/' + ev.tx + '">verify ↗</a></span>';
     return div;
   }
-  return { getConfig, fmtPol, fmtUsd, status, renderNav, refreshNavWallet, describeEvent, feedRow, $ };
+  // Render one served ad into #<elId>. Silent if no inventory.
+  async function adSlot(type, elId) {
+    try {
+      const { ad } = await (await fetch('/api/ads/slot?type=' + type)).json();
+      const el = $(elId);
+      if (!ad || !el) return;
+      if (ad.imageUrl) {
+        el.innerHTML = '<a href="' + ad.targetUrl + '" target="_blank" rel="noopener nofollow">'
+          + '<img src="' + ad.imageUrl + '" alt="advertisement" style="max-width:100%;border-radius:8px"></a>'
+          + '<div class="small muted">member ad</div>';
+      } else {
+        el.innerHTML = '<a href="' + ad.targetUrl + '" target="_blank" rel="noopener nofollow"><b>' + ad.title + '</b>'
+          + (ad.body ? ' · ' + ad.body : '') + '</a> <span class="small muted">member ad</span>';
+      }
+      el.hidden = false;
+    } catch (e) {}
+  }
+  return { getConfig, fmtPol, fmtUsd, status, renderNav, refreshNavWallet, describeEvent, feedRow, adSlot, $ };
 })();

public/assets/ledger.js

@@ -15,6 +15,9 @@
     IAP.$('statLine').textContent = stats.onchainMembers + ' on-chain member(s)';
   } catch (e) {}
 
+  IAP.adSlot('banner', 'adSlotBanner');
+  IAP.adSlot('text', 'adSlotText');
+
   const es = new EventSource('/api/feed/live');
   es.onopen = () => { const b = IAP.$('liveBadge'); b.textContent = '● live'; };
   es.onerror = () => { const b = IAP.$('liveBadge'); b.textContent = 'reconnecting…'; };

public/assets/my.js

@@ -31,6 +31,8 @@
     $('linkCard').hidden = !!me.address;
     $('activateCard').hidden = !(me.address && !me.memberId);
     $('activityArea').hidden = !me.memberId;
+    $('campaignCard').hidden = !me.memberId;
+    if (me.memberId) loadCampaigns();
 
     if (me.memberId) {
       const bc = me.buyerCount || 0;
@@ -66,6 +68,52 @@
     } catch (e) {}
   }
 
+  async function loadCampaigns() {
+    try {
+      const r = await (await fetch('/api/my/campaigns')).json();
+      if (r.error) return;
+      $('rateLine').textContent = 'Available to spend: ' + r.availableCredits.toLocaleString()
+        + ' credits · rates: banner ' + r.rates.bannerCreditsPerBatch + 'cr/' + r.rates.bannerBatch
+        + ' views, text ' + r.rates.textCreditsPerBatch + 'cr/' + r.rates.textBatch
+        + ' views, login ' + r.rates.loginCreditsPerDay + 'cr/day';
+      const el = $('campList');
+      el.innerHTML = '';
+      if (!r.campaigns.length) { el.innerHTML = '<p class="muted small">No campaigns yet. Launch your first below.</p>'; return; }
+      const tbl = document.createElement('div');
+      tbl.className = 'tablewrap';
+      tbl.innerHTML = '<table><thead><tr><th>Name</th><th>Type</th><th class="num">Views</th><th class="num">Clicks</th>'
+        + '<th class="num">Spent</th><th class="num">Budget</th><th>Status</th><th></th></tr></thead><tbody>'
+        + r.campaigns.map(c => '<tr><td><b>' + c.name + '</b></td><td>' + c.type + '</td>'
+          + '<td class="num">' + c.imps.toLocaleString() + '</td><td class="num">' + c.clicks + '</td>'
+          + '<td class="num">' + c.spent + '</td><td class="num">' + c.budget + '</td>'
+          + '<td>' + (c.status === 'out' ? '<span class="badge amber">budget spent</span>' : c.status) + '</td>'
+          + '<td>' + (c.status === 'active' ? '<button class="btn small sec" data-camp="' + c.id + '" data-act="pause">Pause</button>'
+            : c.status === 'paused' ? '<button class="btn small sec" data-camp="' + c.id + '" data-act="resume">Resume</button>' : '')
+          + '</td></tr>').join('') + '</tbody></table>';
+      el.appendChild(tbl);
+      el.querySelectorAll('button[data-camp]').forEach(b => b.addEventListener('click', async () => {
+        try { await api('/api/my/campaigns/' + b.dataset.camp + '/' + b.dataset.act); await loadCampaigns(); }
+        catch (e) { IAP.status(e.message, 'bad'); }
+      }));
+    } catch (e) {}
+  }
+  $('cType').addEventListener('change', () => {
+    const t = $('cType').value;
+    $('cImageRow').hidden = t === 'text';
+    $('cTitleRow').hidden = t !== 'text';
+    $('cBodyRow').hidden = t !== 'text';
+  });
+  $('createCampBtn').addEventListener('click', busy2($('createCampBtn'), async () => {
+    await api('/api/my/campaigns', { type: $('cType').value, name: $('cName').value,
+      targetUrl: $('cTarget').value, imageUrl: $('cImage').value,
+      title: $('cTitle').value, body: $('cBody').value, budget: Number($('cBudget').value) });
+    IAP.status('Campaign is live. It starts serving right away.', 'ok');
+    $('cName').value = ''; $('cBudget').value = '';
+    await loadCampaigns();
+  }));
+  // defers the busy() lookup to click time (busy is declared below)
+  function busy2(btn, fn) { return (...a) => busy(btn, fn)(...a); }
+
   const busy = (btn, fn) => async () => {
     try { btn.disabled = true; await fn(); }
     catch (e) { IAP.status((e && e.message) || String(e), 'bad'); }