Spaces:

eaglelandsonce
/

AIstronauts_Launch_System

Running

App Files Files Community

AIstronauts_Launch_System / index.html

eaglelandsonce

Update index.html

aa87502 verified about 2 months ago

raw

history blame contribute delete

3.87 kB

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>2D Rocket Launch with Expanding Orbit</title>
	<style>
	body { margin: 0; background-color: black; overflow: hidden; }
	canvas { display: block; }
	</style>
	</head>
	<body>
	<canvas id="canvas"></canvas>

	<script>
	// Get canvas and context
	const canvas = document.getElementById("canvas");
	const ctx = canvas.getContext("2d");

	// Set canvas size
	canvas.width = window.innerWidth;
	canvas.height = window.innerHeight;

	// Define Earth
	const earth = {
	x: canvas.width / 2,
	y: canvas.height - 100,
	radius: 50
	};

	// Define Rocket
	let rocket = {
	x: earth.x,
	y: earth.y - earth.radius - 10, // Start above Earth
	radius: 5,
	velocityY: 0,
	isLaunching: false,
	inOrbit: false,
	orbitAngle: 0,
	orbitRadius: 80 // Initial small orbit
	};

	// Launch & Orbit Parameters
	const launchSpeed = -3.0; // Initial launch speed
	const gravity = 0.05; // Simulated gravity pulling rocket down
	const orbitSpeed = 0.02; // Speed in orbit
	const orbitExpansionRate = 0.05; // Gradual orbit increase

	let boosting = false; // Boost flag

	// Listen for spacebar to launch
	document.addEventListener("keydown", (event) => {
	if (event.code === "Space" && !rocket.isLaunching && !rocket.inOrbit) {
	rocket.isLaunching = true;
	rocket.velocityY = launchSpeed;
	}

	// Press "B" to boost the orbit distance
	if (event.code === "KeyB" && rocket.inOrbit) {
	boosting = true;
	}
	});

	document.addEventListener("keyup", (event) => {
	if (event.code === "KeyB") {
	boosting = false;
	}
	});

	// Animation loop
	function animate() {
	ctx.clearRect(0, 0, canvas.width, canvas.height);

	// Draw Earth
	ctx.fillStyle = "blue";
	ctx.beginPath();
	ctx.arc(earth.x, earth.y, earth.radius, 0, Math.PI * 2);
	ctx.fill();

	// 🚀 Launch Phase
	if (rocket.isLaunching && !rocket.inOrbit) {
	rocket.y += rocket.velocityY;
	rocket.velocityY += gravity; // Apply gravity

	// Check if rocket reaches orbit height
	if (rocket.y < earth.y - 150) {
	rocket.isLaunching = false;
	rocket.inOrbit = true;
	rocket.orbitAngle = 0; // Reset angle for orbit
	}
	}
	// 🛰️ Orbit Phase
	else if (rocket.inOrbit) {
	rocket.orbitAngle += orbitSpeed;

	// Gradually increase orbit radius over time
	rocket.orbitRadius += orbitExpansionRate;

	// Apply boost for faster orbit increase
	if (boosting) {
	rocket.orbitRadius += 0.5;
	}

	// Calculate new position based on updated orbit
	rocket.x = earth.x + rocket.orbitRadius * Math.cos(rocket.orbitAngle);
	rocket.y = earth.y - rocket.orbitRadius * Math.sin(rocket.orbitAngle);
	}

	// Draw Rocket
	ctx.fillStyle = "red";
	ctx.beginPath();
	ctx.arc(rocket.x, rocket.y, rocket.radius, 0, Math.PI * 2);
	ctx.fill();

	requestAnimationFrame(animate);
	}

	animate(); // Start animation
	</script>
	</body>
	</html>