martbost
0dbd99f69e
- QR is mint-green (still high-contrast for reliable scanning). - The wall shows the owner's achievement badge next to their avatar. - Positions 2 & 3 fill with upline line-banners, then ADMIN ADS when there's no upline (configurable via data/admin-wall-ads.json; sensible default) so the wall is never sparse. - "Join free through this wall" is disabled until the visitor has viewed every ad on the wall, with a "X/Y viewed" prompt. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
86 lines
4.4 KiB
JavaScript
86 lines
4.4 KiB
JavaScript
// Public banner wall: a member's line banner plus their upline ladder, with
|
||
// their join link. The viral surface: members send traffic here, every visit
|
||
// puts eyes on the whole line.
|
||
(async function () {
|
||
await IAP.renderNav('');
|
||
const name = location.pathname.split('/').pop();
|
||
let w = null;
|
||
try { w = await (await fetch('/api/wall/' + encodeURIComponent(name))).json(); } catch (e) {}
|
||
const title = IAP.$('wallTitle');
|
||
if (!w || w.error) {
|
||
title.textContent = 'No wall under that name.';
|
||
IAP.$('wallJoin').href = '/my';
|
||
return;
|
||
}
|
||
const safeName = String(w.name).replace(/[&<>]/g, '');
|
||
title.innerHTML = safeName;
|
||
IAP.$('bioHead').hidden = false;
|
||
if (w.avatarUrl) { const av = IAP.$('bioAvatar'); av.src = w.avatarUrl; av.hidden = false; }
|
||
if (w.badge) { const bb = IAP.$('bioBadge'); if (bb) { bb.src = w.badge.img; bb.title = w.badge.label + ' badge'; bb.hidden = false; } }
|
||
IAP.$('bioText').textContent = w.bio || 'Building a team on InstantAdPay — join through this page and you\'re in my line.';
|
||
if (w.qrUrl) IAP.$('bioQr').src = w.qrUrl;
|
||
// social links
|
||
const SOC = { facebook: 'Facebook', twitter: 'X', youtube: 'YouTube', instagram: 'Instagram', tiktok: 'TikTok', telegram: 'Telegram', linkedin: 'LinkedIn', website: 'Website' };
|
||
const sc = IAP.$('bioSocials');
|
||
if (sc && w.socials && typeof w.socials === 'object') {
|
||
const links = Object.keys(SOC).filter(k => w.socials[k]).map(k =>
|
||
'<a href="' + String(w.socials[k]).replace(/"/g, '%22') + '" target="_blank" rel="noopener nofollow me">' + SOC[k] + '</a>');
|
||
sc.innerHTML = links.join('');
|
||
}
|
||
IAP.$('wallCtaHead').textContent = 'Join ' + w.name + '’s line';
|
||
// per-wall viewed-position memory (survives revisits; anonymous-friendly)
|
||
const VKEY = 'iap-wall-' + name;
|
||
let viewed = {};
|
||
try { viewed = JSON.parse(localStorage.getItem(VKEY) || '{}'); } catch (e) {}
|
||
const DWELL = 10;
|
||
const grid = IAP.$('wallGrid');
|
||
grid.innerHTML = '';
|
||
// join is gated: you must view every ad on the wall before you can join
|
||
const joinBtn = IAP.$('wallJoin'), gate = IAP.$('wallGate');
|
||
function updateGate() {
|
||
const viewable = w.ladder.filter(m => m.targetUrl).length;
|
||
const seen = w.ladder.filter((m, i) => m.targetUrl && viewed[i]).length;
|
||
if (viewable > 0 && seen < viewable) {
|
||
joinBtn.classList.add('disabled'); joinBtn.removeAttribute('href');
|
||
if (gate) { gate.hidden = false; gate.textContent = 'View all ' + viewable + ' ads above to unlock joining (' + seen + '/' + viewable + ' viewed).'; }
|
||
} else { joinBtn.href = w.joinUrl; joinBtn.classList.remove('disabled'); if (gate) gate.hidden = true; }
|
||
}
|
||
w.ladder.forEach((m, i) => {
|
||
const d = document.createElement('div');
|
||
d.className = 'wall-card';
|
||
const safe = String(m.name || 'member').replace(/[&<>]/g, '');
|
||
const creative = m.bannerUrl
|
||
? '<img src="' + m.bannerUrl + '" alt="' + safe + ' banner">'
|
||
: '<b>' + safe + '</b><br><span class="muted small">' + (m.targetUrl ? 'visit their site' : 'banner slot open') + '</span>';
|
||
d.innerHTML = '<div class="wall-pos">Position ' + (i + 1) + (i === 0 ? ' · this wall' : '') + '</div>'
|
||
+ '<div class="wc-creative">' + creative + '</div>'
|
||
+ '<div class="wc-action"></div>'
|
||
+ '<div class="small muted" style="margin-top:8px">' + safe + '</div>';
|
||
const act = d.querySelector('.wc-action');
|
||
const done = () => { act.innerHTML = '<span class="wc-check">✓ viewed</span>'; };
|
||
if (!m.targetUrl) { act.innerHTML = '<span class="muted small">no ad yet</span>'; }
|
||
else if (viewed[i]) { done(); }
|
||
else {
|
||
const btn = document.createElement('button');
|
||
btn.className = 'btn small'; btn.textContent = 'View this ad';
|
||
btn.addEventListener('click', () => {
|
||
window.open(m.targetUrl, '_blank'); // real visit to the advertiser
|
||
let left = DWELL;
|
||
btn.disabled = true;
|
||
act.innerHTML = '<span class="wc-timer">Viewing… ' + left + 's</span>';
|
||
const t = setInterval(() => {
|
||
left--;
|
||
if (left > 0) { act.querySelector('.wc-timer').textContent = 'Viewing… ' + left + 's'; return; }
|
||
clearInterval(t);
|
||
viewed[i] = 1;
|
||
try { localStorage.setItem(VKEY, JSON.stringify(viewed)); } catch (e) {}
|
||
done(); updateGate();
|
||
}, 1000);
|
||
});
|
||
act.appendChild(btn);
|
||
}
|
||
grid.appendChild(d);
|
||
});
|
||
updateGate();
|
||
})();
|