Infinite Survival Game

{"name":"Infinite Space Shooter","description":"Protect the space station. Survive.","photo":"https://res.cloudinary.com/dzv7hjwfn/image/upload/panmflduuwipdhz23qzw","view_count":8,"fork_count":0,"expires_at":null,"created_at":"2025-10-23T20:53:53.498735Z","updated_at":"2025-10-23T20:53:53.498736Z","user_id":166,"status":"PUBLIC","parent_id":null,"id":10279,"user":{"photo":null,"email":"markivlev@gmail.com","recess_id":"38a987b1-569d-47cc-ae61-0c84198aa65c","created_at":"2024-08-05T03:36:08.774307Z","reset_token":null,"stripe_customer_id":null,"seats":null,"username":"m_ivlev","id":166,"password_hash":"$2b$12$lM.SwMhsrEJrs7ZjNyj9e.FOyWqAZgNBSeOEkB8gCGEsXkmGPZLu6","updated_at":"2024-08-05T03:36:08.774314Z","reset_token_expiry":null,"subscription_status":null},"code":{"script.js":"let shipX;\n\nlet shipY;\n\nlet ship;\n\nlet lasers = [];\n\nlet enemies = [];\n\nlet lastSpawnTime = 0;\n\nconst spawnInterval = 2000;\n\nlet score = 0;\n\nlet gameState = \"start\";\n\nlet spaceStationHealth = 500;\n\nfunction preload() {\n ship = new Ship(); // Initialize a new Ship object\n enemy1Image = loadImage(\"@asset('ship1')\"); // Load ship1 image\n enemy3Image = loadImage(); // Load ship3 image\n}\n\nfunction setup() {\n createCanvas(windowWidth, windowHeight);\n background(0, 0, 0); // Black background\n // Create initial enemies\n enemies.push(new Enemy(random(0, windowWidth), 0, enemy1Image));\n enemies.push(new Enemy(random(0, windowWidth), 0, enemy3Image));\n}\n\nfunction draw() {\n clearCanvas(); // Clear the background each frame\n if (gameState === \"start\") {\n drawStartScreen(); // Draw the start screen\n } else if (gameState === \"play\") {\n updateShip(); // Update the ship's position and display\n handleEnemySpawning(); // Handle enemy spawning\n updateEnemiesAndCheckCollisions(); // Update enemies and check for collisions\n displaySpaceStationHealth(); // Display the space station health\n displayScore(); // Display the score\n } else if (gameState === \"shop\") {\n drawShopScreen(); // Draw the shop screen\n }\n}\n\nclass Laser {\n constructor(x, y) {\n this.x = x; // X position of the laser\n this.y = y; // Y position of the laser\n this.speed = 10; // Speed of the laser\n this.width = 5; // Width of the laser\n this.height = 20; // Height of the laser\n }\n\n update() {\n this.y -= this.speed; // Move the laser upward\n }\n\n draw() {\n fill(0, 255, 0); // Set color to green\n rect(this.x, this.y, this.width, this.height); // Draw the laser\n }\n}\n\nclass Ship {\n constructor() {\n this.image = loadImage(\"@asset('ship5')\"); // Load the ship image\n this.x = windowWidth / 2; // Set initial x position to the center of the screen\n this.y = windowHeight / 2; // Set initial y position to the center of the screen\n this.speed = 5; // Speed of the ship\n this.lastShotTime = 0; // Last time a shot was fired\n this.shootCooldown = 200; // Cooldown time in milliseconds (100 ms = 10 shots per second)\n }\n\n update() {\n this.handleMovement(); // Handle movement based on key presses\n this.draw(); // Draw the ship\n this.updateLasers(); // Update and draw lasers\n }\n\n handleMovement() {\n if (keyIsDown(LEFT_ARROW) || keyIsDown(65)) { // Left arrow key or 'A' key\n this.x -= this.speed; // Move left\n }\n if (keyIsDown(RIGHT_ARROW) || keyIsDown(68)) { // Right arrow key or 'D' key\n this.x += this.speed; // Move right\n }\n if (keyIsDown(UP_ARROW) || keyIsDown(87)) { // Up arrow key or 'W' key\n this.y -= this.speed; // Move up\n }\n if (keyIsDown(DOWN_ARROW) || keyIsDown(83)) { // Down arrow key or 'S' key\n this.y += this.speed; // Move down\n }\n this.shoot(); // Check for shooting\n }\n\n shoot() {\n const currentTime = millis(); // Get the current time in milliseconds\n if (keyIsDown(32) && (currentTime - this.lastShotTime) > this.shootCooldown) { // Spacebar key\n lasers.push(new Laser(this.x, this.y)); // Create a new laser and add it to the array\n this.lastShotTime = currentTime; // Update the last shot time\n }\n }\n\n updateLasers() {\n for (let i = lasers.length - 1; i >= 0; i--) {\n lasers[i].update(); // Update each laser\n lasers[i].draw(); // Draw each laser\n if (lasers[i].y < 0) {\n lasers.splice(i, 1); // Remove laser if it goes off-screen\n }\n }\n }\n\n draw() {\n push(); // Save the current drawing state\n translate(this.x, this.y); // Move origin to the ship's position\n image(this.image, -this.image.width / 2, -this.image.height / 2); // Draw the ship at the center of the canvas\n pop(); // Restore the previous drawing state\n }\n}\n\nclass Enemy {\n constructor(x, y, image) {\n this.x = x; // X position of the enemy\n this.y = y; // Y position of the enemy\n this.image = image; // Image of the enemy\n this.speed = 1.5; // Speed of the enemy\n this.maxHealth = 20; // Max health of the enemy\n this.currentHealth = this.maxHealth; // Current health of the enemy\n }\n\n update() {\n this.y += this.speed; // Move the enemy downward\n }\n\n draw() {\n // Draw the enemy\n image(this.image, this.x - this.image.width / 2, this.y - this.image.height / 2);\n\n // Draw the health bar above the enemy\n this.drawHealthBar();\n }\n\n drawHealthBar() {\n const barWidth = 50; // Width of the health bar\n const barHeight = 5; // Height of the health bar\n const x = this.x - barWidth / 2; // X position of the health bar\n const y = this.y - this.image.height / 2 - 10; // Y position of the health bar\n\n // Draw the health bar background\n fill(255, 0, 0); // Red color for background\n rect(x, y, barWidth, barHeight);\n\n // Draw the health bar foreground\n const healthWidth = (this.currentHealth / this.maxHealth) * barWidth;\n fill(0, 255, 0); // Green color for current health\n rect(x, y, healthWidth, barHeight);\n }\n}\n\nfunction spawnEnemy() {\n const enemyType = random([enemy1Image, enemy3Image]); // Randomly choose between the two enemy images\n const x = random(0, windowWidth); // Random x position for the enemy\n enemies.push(new Enemy(x, 0, enemyType)); // Add a new enemy to the array\n}\n\nfunction checkCollision(laser, enemy) {\n return (\n laser.x < enemy.x + enemy.image.width + 10 &&\n laser.x + laser.width + 10 > enemy.x &&\n laser.y < enemy.y + enemy.image.height - 10 &&\n laser.y + laser.height - 10 > enemy.y\n );\n}\n\nfunction clearCanvas() {\n background(0, 0, 0);\n}\n\nfunction updateShip() {\n ship.update();\n}\n\nfunction handleEnemySpawning() {\n if (millis() - lastSpawnTime > spawnInterval) {\n spawnEnemy();\n lastSpawnTime = millis();\n }\n}\n\nfunction displayScore() {\n fill(255); // Set text color to white\n textSize(24); // Set text size\n textAlign(LEFT, TOP); // Align text to the top left\n text(`Score: ${score}`, 10, 10); // Display the score at position (10, 10)\n}\n\nfunction drawStartScreen() {\n background(0, 0, 0); // Set background to black\n fill(255); // Set text color to white\n textAlign(CENTER, CENTER); // Center align text\n textSize(48); // Set text size\n text(\"Infinite Survival Game\", width / 2, height / 3); // Game title\n textSize(24); // Set text size for button\n text(\"Click to Start\", width / 2, height / 2); // Start button text\n}\n\nfunction mousePressed() {\n if (gameState === \"start\") {\n gameState = \"play\"; // Change state to play when the mouse is pressed on the start screen\n }\n}\n\nfunction displaySpaceStationHealth() {\n const barWidth = 300; // Fixed width of the health bar\n const barHeight = 25; // Height of the health bar\n const x = (windowWidth - barWidth) / 2; // Center the bar horizontally\n const y = 20; // Position the bar at the top\n\n // Draw the health bar background\n fill(255, 0, 0); // Red color for background\n rect(x, y, barWidth, barHeight);\n\n // Draw the health bar foreground based on current health\n const healthWidth = (spaceStationHealth / 500) * barWidth; // Calculate foreground width based on current health\n fill(0, 255, 0); // Green color for current health\n rect(x, y, healthWidth, barHeight);\n\n // Draw the text inside the health bar\n fill(255); // White color for text\n textSize(16); // Set text size\n textAlign(CENTER, CENTER); // Center align text\n text(\"Space Station Health\", x + barWidth / 2, y + barHeight / 2); // Display the text\n}\n\nfunction updateEnemiesAndCheckCollisions() {\n for (let i = enemies.length - 1; i >= 0; i--) {\n enemies[i].update();\n enemies[i].draw();\n\n // Check if the enemy has reached the bottom of the screen\n if (enemies[i].y > height) {\n spaceStationHealth -= 1; // Decrease space station health by 1\n enemies.splice(i, 1); // Remove the enemy from the array\n continue; // Skip to the next enemy\n }\n\n for (let j = lasers.length - 1; j >= 0; j--) {\n if (checkCollision(lasers[j], enemies[i])) {\n enemies[i].currentHealth -= 10;\n lasers.splice(j, 1);\n if (enemies[i].currentHealth <= 0) {\n enemies.splice(i, 1);\n score += 1; // Increase score when an enemy is destroyed\n\n // Check for score to transition to shop\n if (score >= 10) {\n gameState = \"shop\"; // Change game state to shop\n }\n }\n break;\n }\n }\n }\n}\n\nfunction drawShopScreen() {\n background(100); // Set background color for the shop\n fill(255); // Set text color to white\n textSize(32); // Set text size\n textAlign(CENTER, CENTER); // Center align text\n text(\"Shop\", width / 2, height / 4); // Shop title\n textSize(24); // Set text size for options\n text(\"Use your points to buy upgrades!\", width / 2, height / 2); // Shop instructions\n text(\"Press 'R' to return to the game\", width / 2, height / 1.5); // Return instruction\n}\n\nfunction keyPressed() {\n console.log(`Current Game State: ${gameState}`); // Log current game state\n if (gameState === \"shop\" && key === 'R') {\n console.log(\"Returning to game...\"); // Log for debugging\n gameState = \"play\"; // Return to the game when 'R' is pressed\n }\n}\n\n","style.css":"body { margin: 0; } canvas { display: block; }","index.html":"\n\n\n \n \n Infinite Survival Game\n \n \n \n \n\n\n \n\n"},"chat_history":[{"message":"Errors:\n%c * Tone.js v14.8.39 * ,Uncaught SyntaxError: missing ) after argument list at 28:31 in script.js\n Errors:\n%c * Tone.js v14.8.39 * \nUncaught SyntaxError: missing ) after argument list at 28:31 in script.js","project_id":10279,"created_at":"2025-11-05T16:21:47.058106Z","output_tokens":null,"sender":"client_script","code_id":289695,"deleted":0,"input_tokens":null,"id":178174},{"message":"The error message indicates that there is a missing parenthesis in your code at line 28 in `script.js`. Let's review the line of code:\n\n```javascript\nenemy1Image = loadImage(\"@asset('ship1')\"); // Load ship1 image\n```\n\nThe error might be due to incorrect usage of quotes inside the `loadImage` function. The correct syntax should match the example given in the instructions, which is `loadImage(\"@asset('ship3')\")`. \n\nSince the code already matches the correct format, let's ensure that there isn't an extra character or misplaced quote in the surrounding lines. \n\nMake sure the code syntax matches exactly:\n\n```javascript\nenemy1Image = loadImage(\"@asset('ship1')\"); // Load ship1 image\n```\n\nIf you have verified that the syntax is correct and the error persists, please double-check surrounding lines for misplaced or missing characters that could affect this line. \n\nClick the 'Where does this code go?' button to ensure you're looking in the correct location.","project_id":10279,"created_at":"2025-11-05T16:21:47.189654Z","output_tokens":240,"sender":"ai","code_id":289695,"deleted":0,"input_tokens":3303,"id":178175}],"assets":[{"project_id":10279,"creator":"","cloudinary_id":"panmflduuwipdhz23qzw","deleted":false,"id":87546,"created_at":"2025-10-23T19:06:28.924075Z","name":"ship3","resource_type":"image","tags":["Pixel art","Character","Object"]},{"project_id":10279,"creator":"","cloudinary_id":"rgnmnt3szxpa3mmu3pbz","deleted":false,"id":87545,"created_at":"2025-10-23T19:06:17.313358Z","name":"ship1","resource_type":"image","tags":["Pixel art","Character","Object"]},{"project_id":10279,"creator":"","cloudinary_id":"kcklahftp4coq2d3saa2","deleted":false,"id":87544,"created_at":"2025-10-23T18:11:45.669739Z","name":"ship5","resource_type":"image","tags":["Pixel art","Character","Object"]}],"messages_sent":50,"comments":[],"steps":[]}