Files
rm-circle-team-router/private/direct-join.html
T
martbost 5aceb84863 Add EIP-6963 multi-wallet picker to the join tools
Both /join-now and /direct-join now discover every injected wallet (Brave,
MetaMask, SafePal, Trust, Coinbase…) via EIP-6963 and, when more than one is
present, show a 'Choose your wallet' picker on connect — instead of blindly
grabbing window.ethereum (which silently hangs when e.g. Brave's built-in wallet
wins the slot). Shared public/rmc-wallet.js; provider resolved on connect and
wallet events bound once after. Falls back to window.ethereum for legacy
single-provider wallets. CSP-safe (6963 icons are data URIs).

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
2026-08-18 08:01:07 -05:00

82 lines
6.0 KiB
HTML

<!doctype html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><meta name="robots" content="noindex,nofollow"><title>Direct On-Chain Enrollment · RM Circle</title><link rel="stylesheet" href="/styles.css">
<style>
.dj-wrap{width:min(760px,calc(100% - 32px));margin:24px auto 70px}
.dj-card{background:var(--card,#0b1e30);border:1px solid var(--line);border-radius:16px;padding:20px 22px;margin:0 0 16px}
.dj-mono{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:13px;color:var(--gold);word-break:break-all}
.dj-row{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.dj-kv{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--line);font-size:14px}
.dj-kv:last-child{border-bottom:0}
.dj-kv b{color:var(--text)}
.dj-log{font-size:13px;line-height:1.5;padding:8px 10px;border-left:2px solid var(--line);margin:6px 0;color:var(--muted);background:#08192880}
.dj-log.ok{border-color:var(--ok);color:#cfeede}
.dj-log.err{border-color:var(--danger);color:#f3b7ac}
.dj-field{margin:0 0 12px}
.dj-field label{display:block;font-size:12px;color:#a7b8c6;text-transform:uppercase;letter-spacing:.7px;font-weight:800;margin:0 0 6px}
#logWrap{max-height:260px;overflow:auto}
.dj-hide{display:none}
</style></head>
<body class="admin-bg">
<header class="wrap nav"><a class="brand" href="/admin"><div class="brand-mark">RM</div><span><span>RM Circle</span><small>Contingency · On-Chain Enrollment</small></span></a><div class="nav-actions"><a class="btn btn-secondary btn-sm" href="/admin">← Admin</a></div></header>
<main class="dj-wrap">
<div class="callout warning"><strong>Contingency tool — for use only if the official RM Circle dApp is ever unavailable.</strong> This page builds the enrollment/upgrade transaction that <em>your own wallet</em> signs and pays, directly to the smart contract. It holds no funds and has no authority. If an amount is ever wrong the contract simply rejects it and you keep your POL. Normal joins should still go through the official dApp and the <a href="/start" style="color:var(--gold)">Getting Started page</a>.</div>
<div class="dj-card">
<h2 style="margin:0 0 10px;font-size:20px">The contract</h2>
<div class="dj-kv"><span>RM Circle (Polygon Mainnet, chain 137)</span></div>
<div class="dj-mono" style="margin:6px 0 8px">0x33BdAEEfd6d17D80aE53816c916dFb26c4fB2DAF</div>
<a class="btn btn-secondary btn-sm" href="https://polygonscan.com/address/0x33bdaeefd6d17d80ae53816c916dfb26c4fb2daf#code" target="_blank" rel="noopener">View verified code on Polygonscan ↗</a>
</div>
<div class="dj-card">
<h2 style="margin:0 0 10px;font-size:20px">1 · Connect your wallet</h2>
<button id="connectBtn" class="btn btn-primary">Connect wallet</button>
<div id="connected" class="dj-hide">
<div class="dj-kv"><span>Wallet</span><b id="wallet" class="dj-mono">—</b></div>
<div class="dj-kv"><span>Network</span><b>Polygon Mainnet ✓</b></div>
<div class="dj-kv"><span>Balance</span><b id="bal">—</b></div>
</div>
</div>
<div id="posBox" class="dj-card dj-hide">
<h2 style="margin:0 0 8px;font-size:20px">Your existing position</h2>
<p id="posInfo" style="color:var(--muted);font-size:14px;margin:0"></p>
<div id="upBox" class="dj-hide" style="margin-top:14px">
<div class="dj-kv"><span>Upgrade to</span><b id="upNext">—</b></div>
<div class="dj-kv"><span>Cost</span><b id="upCost">—</b></div>
<button id="upgradeBtn" class="btn btn-teal" style="margin-top:12px" data-tier="2" data-level="1">Upgrade my position →</button>
</div>
<p id="upInfo" style="color:var(--muted);font-size:14px;margin:8px 0 0"></p>
</div>
<div class="dj-card">
<h2 style="margin:0 0 10px;font-size:20px">2 · Register a new position</h2>
<p style="color:var(--muted);font-size:14px;margin:0 0 14px">A wallet can hold one position. To create a new one, connect a fresh wallet funded with enough POL, enter the sponsor ID to join under, and register.</p>
<div class="dj-field"><label for="sponsorId">Sponsor ID (who you join under)</label><input id="sponsorId" class="input" inputmode="numeric" placeholder="e.g. 21"></div>
<div class="dj-field"><label for="tier">Tier</label><select id="tier" class="select"><option value="2">Premium (full — team standard)</option><option value="1">Standard (half)</option></select></div>
<div class="dj-kv"><span>You will pay (Premium)</span><b id="joinCost">—</b></div>
<button id="registerBtn" class="btn btn-primary" style="margin-top:14px">Register position →</button>
</div>
<div class="dj-card">
<h2 style="margin:0 0 8px;font-size:16px">Advanced (optional)</h2>
<div class="dj-field"><label for="customPol">Override POL amount</label><input id="customPol" class="input" placeholder="leave blank to use the auto-calculated amount"></div>
<p style="color:var(--muted);font-size:12px;margin:0">Only use this if you need to send a specific amount. The auto amount is read live from the contract's own price table.</p>
</div>
<div id="result" class="dj-card dj-hide" style="border-color:var(--ok);background:rgba(123,224,161,.08);text-align:center">
<div style="font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:var(--ok);font-weight:800">✅ Success — save this</div>
<div id="resultId" style="font-size:46px;font-weight:900;color:var(--gold);margin:6px 0;letter-spacing:-1px">—</div>
<div id="resultSub" style="color:var(--muted);font-size:14px"></div>
<a id="resultLink" class="btn btn-primary btn-sm" href="/my" style="display:none;margin-top:12px">View position →</a>
</div>
<div class="dj-card">
<h2 style="margin:0 0 8px;font-size:16px">Activity</h2>
<div id="logWrap"><div id="log"></div></div>
</div>
<p class="micro" style="text-align:center">No income is guaranteed. Cryptocurrency and smart-contract participation carry risk. Only use funds you can afford to lose.</p>
</main>
<script src="/rmc-wallet.js"></script><script src="/direct-join.js"></script></body></html>