marty/instantadpay
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge solo Inbox into Earn credits as a sub-tab; unread badge on Earn menu item

Browse Source 
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
martbost
2026-09-06 07:41:41 -05:00
parent 1ee0b5626e
commit b3be71135d
9 changed files with 98 additions and 68 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/assets/my.js
+20 -4
View File
@@ -213,9 +213,9 @@
}
// ── back-office menu: hash-routed panes ───────────────
const PANES = ['overview', 'line', 'buy', 'campaigns', 'inbox', 'earn', 'earnings', 'promo', 'wallet', 'profile'];
const PANES = ['overview', 'line', 'buy', 'campaigns', 'earn', 'earnings', 'promo', 'wallet', 'profile'];
const TITLES = { overview: 'Overview', line: 'My line', buy: 'Buy packages', campaigns: 'Campaigns',
inbox: 'Inbox', earn: 'Earn credits', earnings: 'Earnings', promo: 'Promo tools',
earn: 'Earn credits', earnings: 'Earnings', promo: 'Promo tools',
wallet: 'Wallet & account', profile: 'Profile' };
function setPane(name) {
if (!PANES.includes(name)) name = 'overview';
@@ -226,7 +226,7 @@
document.querySelectorAll('.bo-menu [data-pane]').forEach(b =>
b.classList.toggle('on', b.dataset.pane === name));
if ($('boTitle')) $('boTitle').textContent = TITLES[name];
if (name === 'inbox') loadInbox();
if (name === 'earn') setEarnSub(earnSub); // refresh whichever sub-tab is active
if (name === 'profile') loadLineBanner();
document.getElementById('memberArea').classList.remove('side-open'); // close mobile drawer
if (location.hash !== '#' + name) history.replaceState(null, '', '#' + name);
@@ -434,9 +434,25 @@
// ── solo-ads inbox: list, read view, dwell-gated read reward ──
let ibTimer = null;
function setInboxBadge(n) {
const b = $('inboxBadge');
for (const id of ['inboxBadge', 'inboxBadge2']) {
const b = $(id);
if (b) { b.hidden = !n; b.textContent = n; }
}
}
// Earn credits sub-tabs: Watch ads | Inbox
let earnSub = 'watch';
function setEarnSub(which) {
earnSub = which === 'inbox' ? 'inbox' : 'watch';
const w = $('earn-watch'), i = $('earn-inbox');
if (w) w.hidden = earnSub !== 'watch';
if (i) i.hidden = earnSub !== 'inbox';
document.querySelectorAll('.subtabs [data-earn]').forEach(b =>
b.classList.toggle('on', b.dataset.earn === earnSub));
if (earnSub === 'inbox') loadInbox();
else earnRefresh();
}
document.querySelectorAll('.subtabs [data-earn]').forEach(b =>
b.addEventListener('click', () => setEarnSub(b.dataset.earn)));
async function loadInbox() {
try {
const r = await (await fetch('/api/my/inbox')).json();
public/assets/site.css
+8
View File
@@ -357,6 +357,14 @@ textarea.ed-body{width:100%;min-height:180px;resize:vertical}
.ed-body a,.ib-rich a{color:var(--mint)}
.ed-body h3,.ib-rich h3,.ed-body h4,.ib-rich h4{margin:.5em 0 .3em}
.ed-media{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:10px 0 0}
/* ── earn sub-tabs (Watch ads | Inbox) ── */
.subtabs{display:flex;gap:6px;margin:0 0 16px;border-bottom:1px solid var(--line);padding-bottom:0}
.subtab{background:none;border:0;border-bottom:2px solid transparent;color:var(--muted);
font:inherit;font-weight:700;font-size:14px;padding:8px 14px;cursor:pointer;margin-bottom:-1px;
display:inline-flex;align-items:center;gap:7px}
.subtab:hover{color:var(--ink)}
.subtab.on{color:var(--mint);border-bottom-color:var(--mint)}
.subtab .pill{position:static}
/* ── solo-ads inbox ── */
.bo-menu .pill{margin-left:auto;background:var(--amber);color:#1a1206;font-size:11px;font-weight:800;
border-radius:999px;padding:1px 8px;line-height:1.5}
public/contract.html
+4 -4
View File
@@ -5,7 +5,7 @@
<title>The contract | InstantAdPay</title>
<meta name="description" content="Plain-language review of the InstantAdPay settlement contract: what it does, what nobody can change, what the operator can and cannot touch, and how to verify all of it yourself.">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&display=swap">
<link rel="stylesheet" href="/assets/site.css?v=20260905u">
<link rel="stylesheet" href="/assets/site.css?v=20260905v">
</head>
<body>
<div class="wrap">
@@ -129,8 +129,8 @@
<div class="small">Advertising services with a performance referral program. Not an investment product; no income guarantees. Crypto transactions are irreversible. Never spend what you cannot afford.</div>
</footer>
</div>
<script src="/assets/common.js?v=20260905u"></script>
<script src="/assets/contract.js?v=20260905u"></script>
<script src="/assets/chat.js?v=20260905u"></script>
<script src="/assets/common.js?v=20260905v"></script>
<script src="/assets/contract.js?v=20260905v"></script>
<script src="/assets/chat.js?v=20260905v"></script>
</body>
</html>
public/index.html
+5 -5
View File
@@ -5,7 +5,7 @@
<title>InstantAdPay: advertise and earn, locked in code</title>
<meta name="description" content="Real ad packages with instant on-chain settlement. Every purchase pays the sponsor line in the same transaction, verifiable by anyone on the live ledger.">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&display=swap">
<link rel="stylesheet" href="/assets/site.css?v=20260905u">
<link rel="stylesheet" href="/assets/site.css?v=20260905v">
</head>
<body>
@@ -410,9 +410,9 @@
</div>
</section>
<script src="/assets/common.js?v=20260905u"></script>
<script src="/assets/wallet.js?v=20260905u"></script>
<script src="/assets/home.js?v=20260905u"></script>
<script src="/assets/chat.js?v=20260905u"></script>
<script src="/assets/common.js?v=20260905v"></script>
<script src="/assets/wallet.js?v=20260905v"></script>
<script src="/assets/home.js?v=20260905v"></script>
<script src="/assets/chat.js?v=20260905v"></script>
</body>
</html>
public/ledger.html
+4 -4
View File
@@ -5,7 +5,7 @@
<title>Live ledger | InstantAdPay</title>
<meta name="description" content="Every purchase, payout, and pass-up on InstantAdPay, streamed straight from the blockchain with a verify link on every line.">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&display=swap">
<link rel="stylesheet" href="/assets/site.css?v=20260905u">
<link rel="stylesheet" href="/assets/site.css?v=20260905v">
</head>
<body>
<div class="wrap">
@@ -25,8 +25,8 @@
<div>InstantAdPay · <a href="/">how it works</a> · <a id="contractLink" href="#" target="_blank" rel="noopener">contract source ↗</a></div>
</footer>
</div>
<script src="/assets/common.js?v=20260905u"></script>
<script src="/assets/ledger.js?v=20260905u"></script>
<script src="/assets/chat.js?v=20260905u"></script>
<script src="/assets/common.js?v=20260905v"></script>
<script src="/assets/ledger.js?v=20260905v"></script>
<script src="/assets/chat.js?v=20260905v"></script>
</body>
</html>
public/my.html
+32 -26
View File
@@ -4,7 +4,7 @@
<meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1">
<title>Member area | InstantAdPay</title>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&display=swap">
<link rel="stylesheet" href="/assets/site.css?v=20260905u">
<link rel="stylesheet" href="/assets/site.css?v=20260905v">
</head>
<body class="bo-body">
@@ -91,8 +91,7 @@
<button data-pane="line" type="button"><svg viewBox="0 0 24 24"><circle cx="12" cy="7" r="3.2"/><circle cx="5" cy="17" r="2.6"/><circle cx="19" cy="17" r="2.6"/><path d="M12 10v3M12 13l-5 2M12 13l5 2"/></svg>My line</button>
<button data-pane="buy" type="button"><svg viewBox="0 0 24 24"><circle cx="9" cy="20" r="1.6"/><circle cx="17" cy="20" r="1.6"/><path d="M3 4h2l2.4 11.2A2 2 0 0 0 9.4 17h8.2a2 2 0 0 0 2-1.6L21 8H6"/></svg>Buy packages</button>
<button data-pane="campaigns" type="button"><svg viewBox="0 0 24 24"><path d="M3 11l14-5v12L3 13v-2z"/><path d="M17 8a4 4 0 0 1 0 8M7 13v5a2 2 0 0 0 4 0v-3"/></svg>Campaigns</button>
<button data-pane="inbox" type="button"><svg viewBox="0 0 24 24"><rect x="3" y="5" width="18" height="14" rx="2"/><path d="M3 8l9 6 9-6"/></svg>Inbox<span class="pill" id="inboxBadge" hidden></span></button>
<button data-pane="earn" type="button"><svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="8.5"/><path d="M12 7.5v9M9 10c0-1.1 1.3-1.8 3-1.8s3 .7 3 1.8-1.3 1.6-3 1.8-3 .7-3 1.8 1.3 1.8 3 1.8 3-.7 3-1.8"/></svg>Earn credits</button>
<button data-pane="earn" type="button"><svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="8.5"/><path d="M12 7.5v9M9 10c0-1.1 1.3-1.8 3-1.8s3 .7 3 1.8-1.3 1.6-3 1.8-3 .7-3 1.8 1.3 1.8 3 1.8 3-.7 3-1.8"/></svg>Earn credits<span class="pill" id="inboxBadge" hidden></span></button>
<button data-pane="earnings" type="button"><svg viewBox="0 0 24 24"><path d="M4 17l5-5 4 3 7-8"/><path d="M14 7h6v6"/></svg>Earnings</button>
<button data-pane="promo" type="button"><svg viewBox="0 0 24 24"><path d="M7 10s5-1 9-5v14c-4-4-9-5-9-5H5a2 2 0 0 1-2-2v0a2 2 0 0 1 2-2h2z"/><path d="M8 15l1 5h2l-1-5"/></svg>Promo tools</button>
<button data-pane="wallet" type="button"><svg viewBox="0 0 24 24"><rect x="3" y="6" width="18" height="13" rx="2"/><path d="M3 10h18"/><circle cx="16.5" cy="14.5" r="1.4"/></svg>Wallet</button>
@@ -291,27 +290,13 @@
</div>
</div>
<div class="pane" id="pane-inbox" hidden>
<div class="card" id="inboxListCard">
<h3>Solo ads inbox</h3>
<p class="muted small">Full-message ads from members land here — each one delivered to you at
most once, never your own. Give one a real read and claim <span id="ibRewardNote">…</span>.</p>
<div id="ibList"><p class="muted small">Loading…</p></div>
</div>
<div class="card" id="inboxReadCard" hidden>
<p><a href="#" id="ibBack">← Back to inbox</a></p>
<h3 id="ibSubject"></h3>
<p class="small muted" id="ibMeta"></p>
<div id="ibMedia" hidden style="margin:12px 0"></div>
<div id="ibBody" class="promo-block ib-rich"></div>
<p style="margin-top:14px">
<a class="btn" id="ibVisit" target="_blank" rel="noopener nofollow">Visit the advertiser</a>
<button class="btn sec" id="ibClaimBtn" type="button" hidden>…</button></p>
<p class="small muted" id="ibHint"></p>
</div>
<div class="pane" id="pane-earn" hidden>
<div class="subtabs" role="tablist">
<button class="subtab on" data-earn="watch" type="button">Watch ads</button>
<button class="subtab" data-earn="inbox" type="button">Inbox<span class="pill" id="inboxBadge2" hidden></span></button>
</div>
<div class="pane" id="pane-earn" hidden>
<div class="earn-sub" id="earn-watch">
<div class="card">
<h3>Earn credits by viewing ads</h3>
<p class="muted small">Each ad opens full screen in its own tab, pointed at the advertiser's
@@ -332,6 +317,27 @@
</div>
</div>
<div class="earn-sub" id="earn-inbox" hidden>
<div class="card" id="inboxListCard">
<h3>Solo ads inbox</h3>
<p class="muted small">Full-message ads from members land here — each one delivered to you at
most once, never your own. Read one and click through to the advertiser to claim <span id="ibRewardNote">…</span>.</p>
<div id="ibList"><p class="muted small">Loading…</p></div>
</div>
<div class="card" id="inboxReadCard" hidden>
<p><a href="#" id="ibBack">← Back to inbox</a></p>
<h3 id="ibSubject"></h3>
<p class="small muted" id="ibMeta"></p>
<div id="ibMedia" hidden style="margin:12px 0"></div>
<div id="ibBody" class="promo-block ib-rich"></div>
<p style="margin-top:14px">
<a class="btn" id="ibVisit" target="_blank" rel="noopener nofollow">Visit the advertiser</a>
<button class="btn sec" id="ibClaimBtn" type="button" hidden>…</button></p>
<p class="small muted" id="ibHint"></p>
</div>
</div>
</div>
<div class="pane" id="pane-earnings" hidden>
<div id="activityArea" hidden>
<div class="grid c2">
@@ -442,9 +448,9 @@
</div>
</div>
<script src="/assets/common.js?v=20260905u"></script>
<script src="/assets/wallet.js?v=20260905u"></script>
<script src="/assets/my.js?v=20260905u"></script>
<script src="/assets/chat.js?v=20260905u"></script>
<script src="/assets/common.js?v=20260905v"></script>
<script src="/assets/wallet.js?v=20260905v"></script>
<script src="/assets/my.js?v=20260905v"></script>
<script src="/assets/chat.js?v=20260905v"></script>
</body>
</html>
public/tx.html
+3 -3
View File
@@ -4,7 +4,7 @@
<meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1">
<title>Transaction | InstantAdPay</title>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&display=swap">
<link rel="stylesheet" href="/assets/site.css?v=20260905u">
<link rel="stylesheet" href="/assets/site.css?v=20260905v">
</head>
<body>
<div id="nav"></div>
@@ -33,7 +33,7 @@
<p><a href="/ledger">← Back to the live ledger</a> · <a href="/contract">Read the contract review</a></p>
</div>
</section>
<script src="/assets/common.js?v=20260905u"></script>
<script src="/assets/tx.js?v=20260905u"></script>
<script src="/assets/common.js?v=20260905v"></script>
<script src="/assets/tx.js?v=20260905v"></script>
</body>
</html>
public/view.html
+2 -2
View File
@@ -4,7 +4,7 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Viewing ad — InstantAdPay</title>
<link rel="stylesheet" href="/assets/site.css?v=20260905u">
<link rel="stylesheet" href="/assets/site.css?v=20260905v">
<style>
html,body{height:100%;margin:0;overflow:hidden}
.vw{display:flex;flex-direction:column;height:100vh;height:100dvh;background:var(--bg,#04110c);color:var(--ink,#e8fff7)}
@@ -43,6 +43,6 @@
</div>
<iframe class="vframe" id="vFrame" sandbox="allow-scripts allow-same-origin allow-forms allow-popups" referrerpolicy="no-referrer" title="Advertiser site"></iframe>
</div>
<script src="/assets/view.js?v=20260905u"></script>
<script src="/assets/view.js?v=20260905v"></script>
</body>
</html>
public/wall.html
+3 -3
View File
@@ -4,7 +4,7 @@
<meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1">
<title>Banner wall | InstantAdPay</title>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&display=swap">
<link rel="stylesheet" href="/assets/site.css?v=20260905u">
<link rel="stylesheet" href="/assets/site.css?v=20260905v">
</head>
<body>
<div id="nav"></div>
@@ -26,7 +26,7 @@
</div>
</div>
</section>
<script src="/assets/common.js?v=20260905u"></script>
<script src="/assets/wall.js?v=20260905u"></script>
<script src="/assets/common.js?v=20260905v"></script>
<script src="/assets/wall.js?v=20260905v"></script>
</body>
</html>