import React, { useState, useEffect, useRef, useMemo } from 'react'; import { Orbit, Activity, Zap, Info, Target, Compass } from 'lucide-react'; const WIDTH = 1200; const HEIGHT = 700; // CRTBP Constants (Earth-Moon system approximation) const MU = 0.01215; // Mass ratio const L_SCALE = 450; // Visual scale factor const EARTH_X = -MU * L_SCALE; const MOON_X = (1 - MU) * L_SCALE; const CENTER_OFFSET_X = 400; // Shift to better visualize the DRO around Moon const CENTER_OFFSET_Y = 350; // Distant Retrograde Orbit (DRO) parametric approximation // In the rotating frame, DROs are stable retrograde orbits around the secondary body const generateDROPath = (count = 200) => { const points = []; const rx = 140; // Semi-major axis (x-direction in rotating frame) const ry = 220; // Semi-minor axis (y-direction in rotating frame) // DROs are typically elongated in Y in the rotating frame for (let i = 0; i <= count; i++) { const angle = (i / count) * Math.PI * 2; // Retrograde: clockwise motion in rotating frame const x = MOON_X + rx * Math.cos(angle); const y = ry * Math.sin(angle); points.push({ x, y }); } return points; }; const LagrangePoint = ({ x, y, label, color = "#94a3b8" }) => ( {label} ); const CRTBP_DRO_Simulator = () => { const [tick, setTick] = useState(0); const frameRef = useRef(0); const requestRef = useRef(); // Initialize static background elements const stars = useMemo(() => { return Array.from({ length: 100 }).map((_, i) => ({ x: Math.random() * WIDTH, y: Math.random() * HEIGHT, size: Math.random() * 1.5, opacity: Math.random() * 0.8 + 0.2 })); }, []); const droPath = useMemo(() => generateDROPath(300), []); const droPathString = useMemo(() => `M ${droPath.map(p => `${p.x},${p.y}`).join(' L ')} Z`, [droPath]); // Lagrange Points calculation (simplified positions for visualization) const lPoints = useMemo(() => { const gamma1 = Math.pow(MU / 3, 1/3); const L1 = MOON_X - gamma1 * L_SCALE; const L2 = MOON_X + gamma1 * L_SCALE; const L3 = EARTH_X - (1 + 5/12 * MU) * L_SCALE; const L4_X = (0.5 - MU) * L_SCALE; const L4_Y = -(Math.sqrt(3)/2) * L_SCALE; const L5_X = (0.5 - MU) * L_SCALE; const L5_Y = (Math.sqrt(3)/2) * L_SCALE; return [ { x: L1, y: 0, label: "L1" }, { x: L2, y: 0, label: "L2" }, { x: L3, y: 0, label: "L3" }, { x: L4_X, y: L4_Y, label: "L4" }, { x: L5_X, y: L5_Y, label: "L5" }, ]; }, []); // Animation loop useEffect(() => { const animate = () => { frameRef.current += 1; setTick(frameRef.current); requestRef.current = requestAnimationFrame(animate); }; requestRef.current = requestAnimationFrame(animate); return () => { if (requestRef.current) cancelAnimationFrame(requestRef.current); }; }, []); // Calculate probe position const probeIdx = tick % droPath.length; const probePos = droPath[probeIdx]; const trail = useMemo(() => { const t = []; for(let i = 0; i < 40; i++) { const idx = (probeIdx - i + droPath.length) % droPath.length; t.push(droPath[idx]); } return t; }, [probeIdx, droPath]); // Dynamic values for the HUD const jacobiConstant = (3.184 + Math.sin(tick * 0.01) * 0.001).toFixed(5); const velocity = (0.421 + Math.cos(tick * 0.02) * 0.005).toFixed(4); const altitude = (Math.sqrt(Math.pow(probePos.x - MOON_X, 2) + Math.pow(probePos.y, 2)) / 10).toFixed(2); return (

{/* CSS-less layout for floating elements if needed */}

SYSTEM_STATUS: NOMINAL // FRAME_BUFFER: {tick}

); }; export default CRTBP_DRO_Simulator;