solargod/index.html
monsterrobotparty 26a5751394 🌞 genesis: scaffold — serve.py proxy+cache, importmap renderer, sky, sun, HUD, time bar, floating-origin bootstrap (opus)
Stage 0. Zero-dependency serve.py (static + allowlisted horizons/sbdb/cad proxy,
sha256 disk cache with past-span immutability). Three.js via pinned importmap,
logarithmic depth, procedural starfield sky (+ Milky Way panorama swap-in), Sun
with additive glow, OrbitControls, brass-and-void HUD, scrubbable time bar,
central bodyWorld position pass, focus/camera system, hash state. Boots clean,
no console errors.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
2026-07-16 00:04:41 +10:00

85 lines
2.6 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>SOLARGOD ▸ Orrery</title>
<link rel="stylesheet" href="css/style.css" />
<script type="importmap">
{
"imports": {
"three": "https://cdn.jsdelivr.net/npm/three@0.170.0/build/three.module.js",
"three/addons/": "https://cdn.jsdelivr.net/npm/three@0.170.0/examples/jsm/"
}
}
</script>
</head>
<body>
<div id="scene"></div>
<div id="labels"></div>
<!-- breadcrumb (top-left) -->
<div id="breadcrumb"></div>
<!-- HUD (right) -->
<aside id="hud">
<header>
<div class="brand">SOLARGOD <span>▸ ORRERY</span></div>
<div id="live-chip" data-state="live">LIVE</div>
</header>
<div class="ctl-row">
<div class="seg" id="scale-toggle">
<button data-mode="mega" class="active" type="button">MEGA</button>
<button data-mode="true" type="button">TRUE</button>
</div>
</div>
<div class="ctl-row slider-row">
<label class="ctl-label">Body scale</label>
<div class="seg" id="bodyscale-toggle">
<button data-e="1" type="button">1×</button>
<button data-e="100" type="button">100×</button>
<button data-e="1200" class="active" type="button">1200×</button>
</div>
</div>
<div class="menu-row">
<label class="ctl-label">Focus</label>
<select id="focus-menu"></select>
</div>
<div id="layers"></div>
<footer>
<div>Positions: JPL SSD approximate elements · live feeds: JPL Horizons / SBDB / CAD</div>
<div id="credits-textures">Textures: <a href="https://www.solarsystemscope.com/textures/" target="_blank" rel="noopener">Solar System Scope</a> (CC&nbsp;BY&nbsp;4.0)</div>
</footer>
</aside>
<!-- time bar (bottom) -->
<div id="timebar">
<div class="tb-controls">
<button id="tb-now" type="button" title="Jump to wall-clock now">NOW</button>
<button id="tb-reverse" type="button" title="Reverse"></button>
<button id="tb-play" type="button" title="Play / pause">❚❚</button>
<select id="tb-rate" title="Time rate"></select>
<div id="date-readout"></div>
</div>
<div id="timeline-outer" title="Scrub 1800 → 2050">
<div id="timeline-fill"></div>
<div id="timeline-cursor"></div>
</div>
<div class="tb-ends"><span>1800</span><span>2050</span></div>
</div>
<!-- info panel (left, Stage 6) -->
<aside id="infopanel" hidden></aside>
<div id="toast"></div>
<div id="debug" hidden></div>
<script type="module" src="js/main.js"></script>
</body>
</html>