Spaces:
Running
Running
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"> | |
| <title>Solar System Explorer</title> | |
| <link rel="stylesheet" href="style.css"> | |
| </head> | |
| <body> | |
| <div id="ui-overlay"> | |
| <div id="title-bar"> | |
| <h1>☉ Solar System Explorer</h1> | |
| </div> | |
| <div id="controls"> | |
| <button id="btn-reset" aria-label="Reset View" title="Reset View">⟲</button> | |
| </div> | |
| <div id="toggle-panel"> | |
| <div class="toggle-row"> | |
| <label for="toggle-real-distance">Real Distance Scale</label> | |
| <input type="checkbox" id="toggle-real-distance"> | |
| </div> | |
| <div class="toggle-row"> | |
| <label for="toggle-real-size">Real Size Scale</label> | |
| <input type="checkbox" id="toggle-real-size"> | |
| </div> | |
| <div class="toggle-row"> | |
| <label for="toggle-orbits">Show Orbits</label> | |
| <input type="checkbox" id="toggle-orbits" checked> | |
| </div> | |
| <div class="toggle-row"> | |
| <label for="toggle-labels">Show Labels</label> | |
| <input type="checkbox" id="toggle-labels" checked> | |
| </div> | |
| <div class="toggle-row"> | |
| <label for="toggle-fulllight">Full Illumination</label> | |
| <input type="checkbox" id="toggle-fulllight"> | |
| </div> | |
| </div> | |
| <div id="speed-control"> | |
| <button id="btn-play-pause" aria-label="Play/Pause" title="Play/Pause">⏸</button> | |
| <label for="speed-slider">Speed</label> | |
| <input type="range" id="speed-slider" min="0" max="2" step="0.05" value="1"> | |
| <span id="speed-value">1.0x</span> | |
| </div> | |
| <div id="credit">Created by Andy Kong</div> | |
| <div id="planet-nav"></div> | |
| <div id="info-panel" class="hidden"> | |
| <button id="close-info" aria-label="Close">×</button> | |
| <h2 id="info-name"></h2> | |
| <div id="info-body"></div> | |
| </div> | |
| </div> | |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r128/three.min.js"></script> | |
| <script src="https://cdn.jsdelivr.net/npm/three@0.128.0/examples/js/controls/OrbitControls.js"></script> | |
| <script src="app.js"></script> | |
| </body> | |
| </html> | |