Retro Asteroids Game

{"name":"Asteroids","description":"","photo":"","view_count":9,"fork_count":0,"expires_at":null,"created_at":"2025-06-03T19:06:33.809324Z","updated_at":"2025-06-03T19:06:33.809324Z","user_id":642,"status":"PRIVATE","parent_id":null,"id":8089,"user":{"username":"michaeljohnsewell","id":642,"password_hash":"$2b$12$WUhXEkXhvNPvdVgHBM0e8O3uVgT9p7vu14tGa0MwGAas.UoE3QDOC","updated_at":"2025-04-29T01:00:18.087645Z","reset_token_expiry":null,"subscription_status":null,"photo":null,"email":"michaeljohn.sewell@alpha.school","recess_id":null,"created_at":"2025-04-29T01:00:18.087636Z","reset_token":null,"stripe_customer_id":null,"seats":0},"code":{"script.js":"let shootSound;\n\nlet explosionSound;\n\nlet explosions = [];\n\nlet spaceship;\n\nlet asteroids = [];\n\nlet bullets = [];\n\nlet stars = [];\n\nlet score = 0;\n\nlet health = 2;\n\nlet gameOver = false;\n\nlet asteroidSpeed = 1.55;\n\nlet asteroidSize = 45;\n\nlet asteroidSpawnTime = 0;\n\nlet asteroidSpawnInterval = 100;\n\nfunction preload() {\n explosionSound = loadSound(\"@asset('Explosion')\"); // Load explosion sound correctly\n}\n\nfunction setup() {\n createCanvas(windowWidth, windowHeight);\n background(0); // Black background\n\n // Create star positions and store them in the stars array\n for (let i = 0; i < 100; i++) {\n stars.push(createVector(random(width), random(height)));\n }\n\n spaceship = new Spaceship();\n for (let i = 0; i < 5; i++) {\n asteroids.push(new Asteroid());\n }\n}\n\nfunction draw() {\n background(0); // Black background\n\n // Draw the stars\n stroke(255);\n for (let star of stars) {\n point(star.x, star.y);\n }\n\n // Display score\n fill(255);\n textSize(35);\n text(`Score: ${score}`, 10, 30);\n\n // Display health bars\n for (let i = 0; i < health; i++) {\n fill(255, 0, 0);\n rect(10 + i * 30, 50, 20, 5); // Draw health bar\n }\n\n // Update and display explosions\n for (let i = explosions.length - 1; i >= 0; i--) {\n explosions[i].update();\n explosions[i].display();\n if (explosions[i].isFinished()) {\n explosions.splice(i, 1); // Remove finished explosions\n }\n }\n\n if (!gameOver) {\n spaceship.update();\n spaceship.display();\n\n for (let bullet of bullets) {\n bullet.update();\n bullet.display();\n }\n\n for (let i = asteroids.length - 1; i >= 0; i--) {\n asteroids[i].update();\n asteroids[i].display();\n\n // Check for collision with bullets\n for (let j = bullets.length - 1; j >= 0; j--) {\n const bullet = bullets[j]; // Store the bullet in a variable\n if (bullet && asteroids[i].isHit(bullet)) { // Check if bullet exists\n score += 10; // Increase score\n bullets.splice(j, 1); // Remove bullet\n\n // Create explosion at asteroid position before removing it\n explosions.push(new Explosion(asteroids[i].position.x, asteroids[i].position.y));\n explosionSound.setVolume(0.5); // Set volume to half\n explosionSound.play(); // Play explosion sound\n\n asteroids.splice(i, 1); // Remove asteroid\n break; // Break to avoid modifying the array during iteration\n }\n }\n\n // Check for collision with spaceship\n if (asteroids[i] && spaceship.isHit(asteroids[i])) {\n health--; // Decrease health\n asteroids.splice(i, 1); // Remove asteroid\n if (health <= 0) {\n gameOver = true; // Set game over flag\n }\n }\n }\n\n // Timer to spawn new asteroids occasionally\n asteroidSpawnTime++;\n if (asteroidSpawnTime >= asteroidSpawnInterval && asteroids.length < 15) {\n asteroids.push(new Asteroid()); // Add a new asteroid\n asteroidSpawnTime = 0; // Reset timer\n }\n } else {\n // Display game over message\n fill(255);\n textSize(48);\n textAlign(CENTER);\n text(\"Game Over\", width / 2, height / 2);\n textSize(24);\n text(\"Score: \" + score, width / 2, height / 2 + 40);\n }\n}\n\nclass Spaceship {\n constructor() {\n this.position = createVector(width / 2, height / 2);\n this.velocity = createVector(0, 0);\n this.angle = 0;\n }\n\n update() {\n // Movement controls\n if (keyIsDown(87)) { // W key\n this.velocity.add(p5.Vector.fromAngle(this.angle).mult(0.1));\n }\n if (keyIsDown(83)) { // S key\n this.velocity.sub(p5.Vector.fromAngle(this.angle).mult(0.1));\n }\n if (keyIsDown(65)) { // A key\n this.angle -= 0.1; // Increased rotation speed\n }\n if (keyIsDown(68)) { // D key\n this.angle += 0.1; // Increased rotation speed\n }\n\n this.position.add(this.velocity);\n this.velocity.mult(0.99); // Friction\n\n // Wrap around screen\n this.position.x = (this.position.x + width) % width;\n this.position.y = (this.position.y + height) % height;\n }\n\n display() {\n push();\n translate(this.position.x, this.position.y);\n rotate(this.angle + PI / 2);\n stroke(255); // Set stroke color to white\n strokeWeight(2); // Set stroke weight for line style\n noFill(); // Remove fill\n beginShape();\n vertex(0, -20); // Tip of the spaceship\n vertex(-10, 10); // Bottom left\n vertex(10, 10); // Bottom right\n endShape(CLOSE);\n pop();\n }\n\n isHit(asteroid) {\n // Check for collision with the asteroid\n let d = dist(this.position.x, this.position.y, asteroid.position.x, asteroid.position.y);\n return d < asteroid.size; // Collision if the distance is less than the asteroid's size\n }\n}\n\nclass Asteroid {\n constructor(size = asteroidSize) {\n // Randomly choose an edge of the screen\n let edge = floor(random(4));\n switch (edge) {\n case 0: // Top edge\n this.position = createVector(random(width), 0);\n break;\n case 1: // Bottom edge\n this.position = createVector(random(width), height);\n break;\n case 2: // Left edge\n this.position = createVector(0, random(height));\n break;\n case 3: // Right edge\n this.position = createVector(width, random(height));\n break;\n }\n this.velocity = p5.Vector.random2D().mult(asteroidSpeed);\n this.size = size;\n }\n\n update() {\n this.position.add(this.velocity);\n // Wrap around screen\n this.position.x = (this.position.x + width) % width;\n this.position.y = (this.position.y + height) % height;\n }\n\n display() {\n stroke(150); // Set stroke color for asteroids\n strokeWeight(2); // Set stroke weight for line style\n noFill(); // Remove fill\n beginShape();\n for (let i = 0; i < 10; i++) {\n let angle = map(i, 0, 10, 0, TWO_PI);\n let radius = this.size + random(-5, 5); // Irregular shape\n let x = this.position.x + cos(angle) * radius;\n let y = this.position.y + sin(angle) * radius;\n vertex(x, y);\n }\n endShape(CLOSE);\n }\n\n isHit(bullet) {\n // Check for collision with the bullet\n let d = dist(this.position.x, this.position.y, bullet.position.x, bullet.position.y);\n return d < this.size; // Collision if the distance is less than the asteroid's size\n }\n}\n\nclass Bullet {\n constructor(x, y, angle) {\n this.position = createVector(x, y);\n this.velocity = p5.Vector.fromAngle(angle).mult(10);\n }\n\n update() {\n this.position.add(this.velocity);\n }\n\n display() {\n stroke(255, 0, 0); // Set stroke color for bullets\n strokeWeight(2); // Set stroke weight\n noFill(); // Remove fill\n ellipse(this.position.x, this.position.y, 5, 5);\n }\n}\n\nfunction mousePressed() {\n bullets.push(new Bullet(spaceship.position.x, spaceship.position.y, spaceship.angle));\n}\n\nfunction keyPressed() {\n if (key === ' ') { // Space bar to shoot\n bullets.push(new Bullet(spaceship.position.x, spaceship.position.y, spaceship.angle));\n }\n}\n\n","style.css":"body { margin: 0; } canvas { display: block; }","index.html":"\n\n\n\n \n \n Retro Asteroids Game\n \n \n \n \n \n \n\n\n\n\n\n","Explosion.js":"class Explosion {\n constructor(x, y) {\n this.position = createVector(x, y);\n this.size = 30; // Size of the explosion\n this.lifespan = 30; // Duration of the explosion\n }\n\n update() {\n this.lifespan--;\n }\n\n display() {\n stroke(255, 255, 0);\n strokeWeight(3);\n noFill();\n ellipse(this.position.x, this.position.y, this.size, this.size);\n }\n\n isFinished() {\n return this.lifespan <= 0;\n }\n}","Spaceship.js":"class Spaceship {\n constructor() {\n this.position = createVector(width / 2, height / 2);\n this.velocity = createVector(0, 0);\n this.angle = 0;\n }\n\n update() {\n // Movement controls\n if (keyIsDown(87)) { // W key\n this.velocity.add(p5.Vector.fromAngle(this.angle).mult(0.1));\n }\n if (keyIsDown(83)) { // S key\n this.velocity.sub(p5.Vector.fromAngle(this.angle).mult(0.1));\n }\n if (keyIsDown(65)) { // A key\n this.angle -= 0.1; // Increased rotation speed\n }\n if (keyIsDown(68)) { // D key\n this.angle += 0.1; // Increased rotation speed\n }\n\n this.position.add(this.velocity);\n this.velocity.mult(0.99); // Friction\n\n // Wrap around screen\n this.position.x = (this.position.x + width) % width;\n this.position.y = (this.position.y + height) % height;\n }\n\n display() {\n push();\n translate(this.position.x, this.position.y);\n rotate(this.angle + PI / 2);\n stroke(255); // Set stroke color to white\n strokeWeight(2); // Set stroke weight for line style\n noFill(); // Remove fill\n beginShape();\n vertex(0, -20); // Tip of the spaceship\n vertex(-10, 10); // Bottom left\n vertex(10, 10); // Bottom right\n endShape(CLOSE);\n pop();\n }\n\n isHit(asteroid) {\n // Check for collision with the asteroid\n let d = dist(this.position.x, this.position.y, asteroid.position.x, asteroid.position.y);\n return d < asteroid.size; // Collision if the distance is less than the asteroid's size\n }\n}"},"chat_history":[{"code_id":247855,"deleted":0,"input_tokens":null,"id":146165,"project_id":8089,"sender":"client_script","message":"","created_at":"2025-06-03T19:16:23.742317Z","output_tokens":null}],"assets":[{"project_id":8089,"created_at":"2025-05-27T19:14:36.457889Z","resource_type":"video","id":74884,"cloudinary_id":"ljj96wg0gy7ge5bziyx7","name":"Explosion","deleted":false}],"messages_sent":26,"comments":[],"steps":[]}