
Interactive Single-File Web App Prompt
Prompt
Create a complete, single-file HTML application (with inline CSS and JavaScript) that implements an interactive "N-Body Gravity & Orbital Mechanics Simulator" using HTML5 Canvas. ### Requirements: 1. Physics Engine: - Calculate gravitational interactions between bodies using Newton's law of universal gravitation (F = G * m1 * m2 / (r^2 + e^2)) with a softening factor (e) to prevent infinite slingshot velocities. - Interactive Creation: Click and drag on the canvas to spawn a body—dragging sets the initial velocity vector (drawn as a glowing trajectory arrow). - Mass Aggregation: When two bodies collide, merge them into a single body while conserving momentum (p = m * v) and updating mass/radius accordingly. 2. Controls & UI (Modern Dark Glassmorphism Theme): - Overlaid control panel with live telemetry: Total Bodies, System Kinetic Energy, Potential Energy, and Total Mass. - Interactive Controls: Sliders for Gravitational Constant (G), Simulation Speed (dt), Trail Persistence (fading canvas background), and Elasticity. - Presets & Actions: Buttons for "Solar System" (1 central star + 4 orbiting planets in stable circular orbits), "Binary Stars", "Galaxy Cluster" (80+ random bodies), "Pause/Play", and "Reset". 3. Technical & Visual Constraints: - Code must be 100% self-contained in a single executable HTML block using native Vanilla JS and Canvas API (no external JS libraries/CDNs). - Render body colors dynamically based on mass and speed (cyan for fast/light, deep red/orange for massive). - Performant execution maintaining 60 FPS without memory leaks or stuttering.
A system prompt was added to support web rendering