git / moonbite-network / website/spark.html · raw
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="description" content="Spark — MoonBite's browser miner rehearsal. Full, honest consent before a single cycle runs." /> <meta name="theme-color" content="#0A0C0F" /> <title>Spark — MoonBite browser mining</title> <link rel="stylesheet" href="css/style.css" /> <link rel="stylesheet" href="css/spark.css" /> <link rel="icon" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Ccircle cx='16' cy='16' r='12' fill='none' stroke='%23C9A24B' stroke-width='2'/%3E%3C/svg%3E" /></head><body> <header class="nav"> <div class="nav__inner"> <a href="index.html" class="brand" aria-label="MoonBite home"> <span class="brand__mark" aria-hidden="true"></span> <span class="brand__name">MoonBite · Spark</span> </a> <nav class="nav__links" aria-label="Primary"> <a href="download.html">Download miners</a> </nav> <div class="spark-topright"> <span class="thermal" id="thermal" hidden aria-hidden="true"> <span class="thermal__dot"></span><span class="thermal__dot"></span><span class="thermal__dot"></span> </span> <button type="button" class="btn-stop" id="stopBtn" hidden>Stop</button> </div> </div> </header> <main class="spark"> <!-- ============ CONSENT (the most-designed screen) ============ --> <section class="consent" id="consent"> <p class="consent__lead"> Spark will use <span class="mono num" id="useThreads">2</span> of your <span class="mono num" id="maxThreads">8</span> CPU threads while this tab is open. </p> <p class="consent__batt"> This runs a <strong>local rehearsal</strong> only — it computes a throughput probe on your device. <span class="muted" id="battLine">Battery cost scales with intensity; on battery, Spark pauses below 20%.</span> </p> <div class="consent__hr"></div> <div class="consent__slider"> <div class="consent__sliderhead"> <span>Intensity</span><span class="era-label" id="intensityLabel">LOW</span> </div> <input type="range" id="intensity" min="0" max="3" step="1" value="0" aria-label="Mining intensity (CPU threads)" /> <div class="consent__ticks"> <span>1</span><span>2</span><span>4</span><span>8</span> <span class="consent__ticksunit">threads</span> </div> </div> <div class="consent__links"> <a href="https://moonbite.org/git/moonbite-network" target="_blank" rel="noopener">View source ↗</a> <a href="https://moonbite.org/governance" target="_blank" rel="noopener">Fees: 100% to miner ↗</a> </div> <div class="consent__hr"></div> <p class="consent__truth"> Honest terms: no coins are earned here. MoonBite is pre-mainnet, and the real in-browser miner ships with mainnet. This screen exists so you can <strong>see exactly what runs before it runs</strong>. </p> <div class="consent__actions"> <button type="button" class="btn-accept" id="startBtn">Start rehearsal</button> <button type="button" class="btn-decline" id="declineBtn">No thanks</button> </div> <p class="consent__declined" id="declinedMsg" hidden>Nothing started. Nothing ran. You can close this tab.</p> </section> <!-- ============ MINING (radical emptiness) ============ --> <section class="mining" id="mining" hidden> <div class="counter" id="probeCounter"> <span class="counter__num resolved" id="probeNum">0</span> </div> <p class="counter__unit">cycles this session · <span class="muted">local rehearsal</span></p> <div class="mining__hr"></div> <div class="honesty-row"> <div class="honesty"> <span class="honesty__v mono" id="rate">0</span> <span class="honesty__k">probe/s (SHA-256 stand-in)</span> </div> <div class="honesty"> <span class="honesty__v mono">0</span> <span class="honesty__k">coins earned — none, by design</span> </div> <div class="honesty"> <span class="honesty__v mono">local</span> <span class="honesty__k">network — not connected</span> </div> </div> <div class="mining__hr"></div> <div class="mining__hr"></div> <!-- ===== Mine to the LIVE MoonBite chain (real blocks) ===== --> <div class="livemine" id="livemine"> <p class="claim-label">Mine to the live MoonBite chain</p> <p class="livemine__hint muted"> Enter your MoonBite address and your explorer URL. The node does the real proof-of-work and credits the block reward to your address. </p> <div class="livemine__row"> <input type="text" id="explorerUrl" class="livemine__input" placeholder="Explorer URL, e.g. https://moonbite.org" autocomplete="off" spellcheck="false" /> </div> <div class="livemine__row"> <input type="text" id="mineAddress" class="livemine__input" placeholder="Your reward address (moon1... or M...)" autocomplete="off" spellcheck="false" /> <button type="button" class="btn-accept" id="mineLiveBtn">Mine a block</button> </div> <p class="livemine__status mono" id="liveStatus" hidden></p> <p class="claim-note muted"> Honest note: the heavy proof-of-work runs on the node (server-side), triggered from here — so blocks are real and credited to you. </p> </div> <p class="toast" id="toast" hidden></p> </section> </main> <footer class="footer"> <p class="footer__line">Spark is a rehearsal · no coins are earned · your CPU, your choice · Stop is always one tap away</p> <p class="footer__meta"><a href="index.html" class="link-quiet">← Back to MoonBite</a></p> </footer> <script src="js/spark.js"></script></body></html>