/my: default to pitch on link visits + big Join button above the fold

- default tab now: shared /my/<id> link -> Team Build pitch; form lookup /
  returning member on bare /my / #dash link -> dashboard (replaces the flaky
  "have you seen this ID before" heuristic that dumped returning prospects
  straight into the dashboard).
- added a big gold "Join the Team" CTA in the hero (right column), above the
  fold, so a sold visitor can join without scrolling past the video.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
martbost
2026-08-17 08:39:52 -05:00
parent 45797bdf9a
commit 436306f4d0
3 changed files with 18 additions and 5 deletions
+1 -1
View File
@@ -7,7 +7,7 @@
<div class="mp-context"><span class="mp-who">Member <span class="gold" id="dTitle">#—</span>'s RM Circle page</span> <span id="dVerified" class="live-badge" style="vertical-align:middle"><span class="dot"></span> Verified on-chain</span> <span id="dQualified"></span> <button id="switchId" class="btn btn-secondary btn-sm mp-switch">Look up another ID</button></div> <div class="mp-context"><span class="mp-who">Member <span class="gold" id="dTitle">#—</span>'s RM Circle page</span> <span id="dVerified" class="live-badge" style="vertical-align:middle"><span class="dot"></span> Verified on-chain</span> <span id="dQualified"></span> <button id="switchId" class="btn btn-secondary btn-sm mp-switch">Look up another ID</button></div>
<div class="mp-tabs"><button class="mp-tab" data-tab="pitch">The Team Build<span>What this is &amp; how to join</span></button><button class="mp-tab" data-tab="dash">Position Dashboard<span>This position's live numbers</span></button></div> <div class="mp-tabs"><button class="mp-tab" data-tab="pitch">The Team Build<span>What this is &amp; how to join</span></button><button class="mp-tab" data-tab="dash">Position Dashboard<span>This position's live numbers</span></button></div>
<section id="tabPitch" class="mp-panel"> <section id="tabPitch" class="mp-panel">
<div class="pitch-hero"><div class="eyebrow">You've landed on Member <span id="pInvId">#—</span>'s page</div><h1 class="pitch-h1">Get Your 2.<br>Help Your 2 <span class="gold">Get Theirs.</span></h1><p class="pitch-lede">The RM Circle is a team-first build on the Polygon blockchain. Every payout happens on a public smart contract that no one can fake, pause, or edit — no company holds your money. The plan is simple, and it duplicates.</p></div> <div class="pitch-hero"><div class="pitch-hero-text"><div class="eyebrow">You've landed on Member <span id="pInvId">#—</span>'s page</div><h1 class="pitch-h1">Get Your 2.<br>Help Your 2 <span class="gold">Get Theirs.</span></h1><p class="pitch-lede">The RM Circle is a team-first build on the Polygon blockchain. Every payout happens on a public smart contract that no one can fake, pause, or edit — no company holds your money. The plan is simple, and it duplicates.</p></div><div class="pitch-hero-cta"><div class="pitch-hero-eye">Ready to build?</div><a id="pHeroJoin" class="btn btn-primary pitch-hero-btn" href="/join">Join the Team →</a><p class="pitch-hero-hint">Dive in now, or scroll for the 60-second overview and the live proof below.<br><span class="pitch-hero-dim">No income is guaranteed.</span></p></div></div>
<div class="pitch-video"><video class="promo" controls preload="none" playsinline poster="/v/rmc-combined-poster.jpg" src="/v/rmc-combined-fe1347c964.mp4"></video><div class="pitch-vcap">▶ <strong>The 60-second overview</strong> — plays right here, no leaving the page.</div></div> <div class="pitch-video"><video class="promo" controls preload="none" playsinline poster="/v/rmc-combined-poster.jpg" src="/v/rmc-combined-fe1347c964.mp4"></video><div class="pitch-vcap">▶ <strong>The 60-second overview</strong> — plays right here, no leaving the page.</div></div>
<div class="pitch-steps"><div class="pitch-step"><span class="pitch-n">1</span><div><strong>See how it works</strong><span>Watch the overview above ↑, then the full pay-flow — plain English, no jargon.</span></div></div><div class="pitch-step"><span class="pitch-n">2</span><div><strong>Get set up</strong><span>A Polygon wallet plus POL to enter. The training walks you through every step.</span></div></div><div class="pitch-step"><span class="pitch-n">3</span><div><strong>Join the team</strong><span>Enter under this member — you're placed on the team and start building your own 2.</span></div></div></div> <div class="pitch-steps"><div class="pitch-step"><span class="pitch-n">1</span><div><strong>See how it works</strong><span>Watch the overview above ↑, then the full pay-flow — plain English, no jargon.</span></div></div><div class="pitch-step"><span class="pitch-n">2</span><div><strong>Get set up</strong><span>A Polygon wallet plus POL to enter. The training walks you through every step.</span></div></div><div class="pitch-step"><span class="pitch-n">3</span><div><strong>Join the team</strong><span>Enter under this member — you're placed on the team and start building your own 2.</span></div></div></div>
<div class="pitch-proof"><div class="lab">Don't take our word for it</div><h3>This is Member <span id="pProofId">#—</span>'s real position — read live from the blockchain.</h3><div class="pitch-nums"><div class="pnum"><b class="ok" id="pEarned">—</b><small>POL earned, on-chain</small></div><div class="pnum"><b class="tl" id="pTeam">—</b><small>members on their team</small></div><div class="pnum"><b class="gd" id="pLevel">—</b><small>current level of 8</small></div></div></div> <div class="pitch-proof"><div class="lab">Don't take our word for it</div><h3>This is Member <span id="pProofId">#—</span>'s real position — read live from the blockchain.</h3><div class="pitch-nums"><div class="pnum"><b class="ok" id="pEarned">—</b><small>POL earned, on-chain</small></div><div class="pnum"><b class="tl" id="pTeam">—</b><small>members on their team</small></div><div class="pnum"><b class="gd" id="pLevel">—</b><small>current level of 8</small></div></div></div>
+10 -3
View File
@@ -3,6 +3,7 @@
const fmt=n=>Number(n||0).toLocaleString(undefined,{maximumFractionDigits:2}); const fmt=n=>Number(n||0).toLocaleString(undefined,{maximumFractionDigits:2});
const date=ts=>ts?new Date(ts*1000).toLocaleDateString(undefined,{year:'numeric',month:'short',day:'numeric'}):'—'; const date=ts=>ts?new Date(ts*1000).toLocaleDateString(undefined,{year:'numeric',month:'short',day:'numeric'}):'—';
const prompt=document.getElementById('idPrompt'),dash=document.getElementById('dash'); const prompt=document.getElementById('idPrompt'),dash=document.getElementById('dash');
let openDashTab=false; // which tab opens on load — set by the form/URL; default = pitch
// Two-purpose page: a "Team Build" pitch tab (for cold visitors who clicked a // Two-purpose page: a "Team Build" pitch tab (for cold visitors who clicked a
// promoted link) and the "Position Dashboard" tab. Persistent — the pitch is // promoted link) and the "Position Dashboard" tab. Persistent — the pitch is
@@ -21,6 +22,7 @@
set('pTeam',(d.subtree&&d.subtree.downCount!=null)?String(d.subtree.downCount):'—'); set('pTeam',(d.subtree&&d.subtree.downCount!=null)?String(d.subtree.downCount):'—');
set('pLevel',d.levelName||'—'); set('pLevel',d.levelName||'—');
const jb=document.getElementById('pJoinBtn'); if(jb){jb.href='/join/'+d.id;jb.textContent='Join under #'+d.id+' →';} const jb=document.getElementById('pJoinBtn'); if(jb){jb.href='/join/'+d.id;jb.textContent='Join under #'+d.id+' →';}
const hj=document.getElementById('pHeroJoin'); if(hj)hj.href='/join/'+d.id;
const pp=document.getElementById('pPayouts'); const pp=document.getElementById('pPayouts');
if(pp){ if(pp){
const inc=(d.income||[]).slice(0,3); const inc=(d.income||[]).slice(0,3);
@@ -84,10 +86,11 @@
}); });
function render(d){ function render(d){
prompt.classList.add('hidden');dash.classList.remove('hidden'); prompt.classList.add('hidden');dash.classList.remove('hidden');
// default tab: a cold visitor (hasn't viewed this ID before) opens on the // default tab: shared /my/<id> link visits open on the Team Build pitch; a
// Team Build pitch; the member (their own saved ID) opens on their dashboard. // form lookup, a returning member on bare /my, or a #dash link opens the
// dashboard (openDashTab is set by those paths before load()).
renderPitch(d); renderPitch(d);
try{ setTab(d._priorId===String(d.id)?'dash':'pitch'); }catch(e){ setTab('pitch'); } setTab(openDashTab?'dash':'pitch');
document.getElementById('dTitle').textContent='#'+d.id; document.getElementById('dTitle').textContent='#'+d.id;
const qb=document.getElementById('dQualified'); const qb=document.getElementById('dQualified');
if(qb)qb.outerHTML=d.directCount>=2 if(qb)qb.outerHTML=d.directCount>=2
@@ -342,6 +345,7 @@
e.preventDefault(); e.preventDefault();
const v=document.getElementById('memberId').value.trim(); const v=document.getElementById('memberId').value.trim();
if(!/^\d{1,15}$/.test(v)){document.getElementById('idError').textContent='Numbers only — the ID from the RM Circle dApp.';return} if(!/^\d{1,15}$/.test(v)){document.getElementById('idError').textContent='Numbers only — the ID from the RM Circle dApp.';return}
openDashTab=true; // they actively looked up an ID — open the dashboard
load(v); load(v);
}); });
document.getElementById('switchId').addEventListener('click',()=>{ document.getElementById('switchId').addEventListener('click',()=>{
@@ -350,6 +354,9 @@
dash.classList.add('hidden');prompt.classList.remove('hidden'); dash.classList.add('hidden');prompt.classList.remove('hidden');
document.getElementById('memberId').value=''; document.getElementById('memberId').value='';
}); });
try{ if(location.hash==='#dash'||new URLSearchParams(location.search).get('tab')==='dash') openDashTab=true; }catch(e){}
const pathHasId=/^\/my\/\d+$/.test(location.pathname);
const id=pathId(); const id=pathId();
if(id&&!pathHasId)openDashTab=true; // bare /my resolved from storage = returning to your own page
if(id)load(id); if(id)load(id);
})(); })();
+7 -1
View File
@@ -177,7 +177,13 @@ a.brand{text-decoration:none;color:inherit}
.mp-tab.on{background:linear-gradient(160deg,#12293f,#0b1b2b);border-color:var(--teal);color:var(--text)} .mp-tab.on{background:linear-gradient(160deg,#12293f,#0b1b2b);border-color:var(--teal);color:var(--text)}
.mp-tab.on span{color:var(--teal)} .mp-tab.on span{color:var(--teal)}
.mp-panel{display:none}.mp-panel.on{display:block} .mp-panel{display:none}.mp-panel.on{display:block}
.pitch-hero{padding:8px 0 4px} .pitch-hero{display:grid;grid-template-columns:1.15fr .85fr;gap:26px;align-items:center;padding:10px 0 6px}
.pitch-hero-cta{display:flex;flex-direction:column;gap:12px;background:linear-gradient(150deg,rgba(243,190,67,.12),rgba(243,190,67,.03));border:1px solid rgba(243,190,67,.32);border-radius:18px;padding:24px 22px;text-align:center}
.pitch-hero-eye{color:var(--gold);text-transform:uppercase;letter-spacing:1.6px;font-weight:800;font-size:12px}
.pitch-hero-btn{font-size:22px;padding:18px 24px;font-weight:900;justify-content:center;box-shadow:0 12px 34px rgba(243,190,67,.3)}
.pitch-hero-hint{color:var(--muted);font-size:13px;line-height:1.5;margin:0}
.pitch-hero-dim{opacity:.7}
@media(max-width:760px){.pitch-hero{grid-template-columns:1fr;gap:18px}.pitch-hero-btn{font-size:20px;padding:16px 22px}}
.pitch-h1{font-size:clamp(30px,6vw,52px);line-height:1;letter-spacing:-1.5px;margin:12px 0 12px;font-weight:900} .pitch-h1{font-size:clamp(30px,6vw,52px);line-height:1;letter-spacing:-1.5px;margin:12px 0 12px;font-weight:900}
.pitch-lede{font-size:clamp(16px,2.2vw,19px);color:var(--muted);line-height:1.55;max-width:640px;margin:0 0 22px} .pitch-lede{font-size:clamp(16px,2.2vw,19px);color:var(--muted);line-height:1.55;max-width:640px;margin:0 0 22px}
.pitch-video{margin:2px 0 24px;text-align:center} .pitch-video{margin:2px 0 24px;text-align:center}