gravity-dev / static /index.html
broadfield-dev's picture
Update static/index.html
994d52c verified
raw
history blame
3.46 kB
<!-- static/index.html -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>3D Solar System Fluid Simulator</title>
<link rel="stylesheet" href="/static/styles.css">
</head>
<body>
<div id="container">
<div id="controls">
<h1>3D Solar System Fluid Simulator</h1>
<p>Adjust the masses, positions, orbital velocities, and fluid interactions, then click "Start Simulation".</p>
<div class="sphere-controls">
<h3>Sun</h3>
<label>Mass (x10^26 kg): <input type="range" id="sun-mass" min="1" max="3" step="0.1" value="1.989"></label>
<label>X: <input type="range" id="sun-x" min="-10" max="10" value="0"></label>
<label>Y: <input type="range" id="sun-y" min="-10" max="10" value="0"></label>
<label>Z: <input type="range" id="sun-z" min="-10" max="10" value="0"></label>
</div>
<div class="sphere-controls">
<h3>Earth</h3>
<label>Mass (x10^26 kg): <input type="range" id="earth-mass" min="0.01" max="0.1" step="0.001" value="0.05972"></label>
<label>X: <input type="range" id="earth-x" min="-20" max="20" value="10"></label>
<label>Y: <input type="range" id="earth-y" min="-20" max="20" value="0"></label>
<label>Z: <input type="range" id="earth-z" min="-20" max="20" value="0"></label>
<label>Orbital Velocity (km/s): <input type="range" id="earth-orbital-velocity" min="0" max="0.05" step="0.001" value="0.0298"></label>
<label>Centripetal Force Scale: <input type="range" id="earth-centripetal" min="0.5" max="2" step="0.1" value="1"></label>
</div>
<div class="sphere-controls">
<h3>Mars</h3>
<label>Mass (x10^26 kg): <input type="range" id="mars-mass" min="0.001" max="0.01" step="0.0001" value="0.006417"></label>
<label>X: <input type="range" id="mars-x" min="-20" max="20" value="15"></label>
<label>Y: <input type="range" id="mars-y" min="-20" max="20" value="0"></label>
<label>Z: <input type="range" id="mars-z" min="-20" max="20" value="0"></label>
<label>Orbital Velocity (km/s): <input type="range" id="mars-orbital-velocity" min="0" max="0.05" step="0.001" value="0.0241"></label>
<label>Centripetal Force Scale: <input type="range" id="mars-centripetal" min="0.5" max="2" step="0.1" value="1"></label>
</div>
<div class="fluid-controls">
<h3>Fluid Interactions</h3>
<label>Friction (0-1): <input type="range" id="fluid-friction" min="0" max="1" step="0.01" value="0.9"></label>
<label>Deflection Strength: <input type="range" id="fluid-deflection" min="0" max="0.5" step="0.01" value="0.1"></label>
</div>
<button id="start-btn">Start Simulation</button>
<button id="reset-btn">Reset Simulation</button>
</div>
<div id="scene-container"></div>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r134/three.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/examples/js/controls/OrbitControls.js"></script>
<script src="/static/script.js"></script>
</body>
</html>