Galactic Escape

{"name":"Galactic Escape","description":"Escape the galactic maze while avoiding enemies and navigating through different worlds. Enjoy pixel art visuals and challenging gameplay!","photo":null,"view_count":11,"fork_count":2,"expires_at":null,"created_at":"2024-06-15T16:39:14.688929Z","updated_at":"2024-06-15T16:39:14.688931Z","user_id":5,"status":"PUBLIC","parent_id":1917,"id":1918,"user":{"photo":null,"email":null,"recess_id":"b5574579-4904-b775-ad8e-eff5c085f819","created_at":"2023-12-12T12:00:51.087995Z","reset_token":null,"stripe_customer_id":null,"seats":null,"username":"theop","id":5,"password_hash":null,"updated_at":"2023-12-12T12:00:51.087997Z","reset_token_expiry":null,"subscription_status":null},"code":{"script.js":"let playerX, playerY; // Variables to track the player's position\nlet playerSize = 20; // Size of the player character\nlet playerVelocityY = 0; // Player's vertical velocity\nlet gravity = 0.5; // Gravity force\nlet isJumping = false; // Whether the player is currently jumping\nlet jumpCount = 0; // Track the number of jumps\nlet platformImage; // Variable to store the platform image\n\nfunction preload() {\n platformImage = loadImage(\"@asset('grassPatch')\"); // Load the platform image\n}\nlet platforms = []; // Array to store platform positions\nlet levels = [\n [\n { x: 0, y: 560 },\n { x: 40, y: 560 },\n { x: 80, y: 560 },\n { x: 120, y: 520 },\n { x: 160, y: 480 },\n { x: 200, y: 480 },\n { x: 240, y: 440 },\n { x: 280, y: 440 },\n { x: 320, y: 400 },\n { x: 360, y: 400 },\n { x: 400, y: 360 },\n { x: 440, y: 360 },\n { x: 480, y: 320 },\n { x: 520, y: 320 },\n { x: 560, y: 280 },\n { x: 600, y: 280 },\n { x: 640, y: 240 },\n { x: 680, y: 240 },\n { x: 720, y: 200 },\n { x: 760, y: 200 }\n ],\n [\n { x: 0, y: 300 },\n { x: 40, y: 300 },\n { x: 80, y: 300 },\n { x: 120, y: 260 },\n { x: 160, y: 220 },\n { x: 200, y: 220 },\n { x: 240, y: 180 },\n { x: 280, y: 180 },\n { x: 320, y: 140 },\n { x: 360, y: 140 },\n { x: 400, y: 100 },\n { x: 440, y: 100 },\n { x: 480, y: 60 },\n { x: 520, y: 60 },\n { x: 560, y: 20 },\n { x: 600, y: 20 },\n { x: 640, y: -20 },\n { x: 680, y: -20 },\n { x: 720, y: -60 },\n { x: 760, y: -60 }\n ]\n]; // Define multiple levels with arrays of platforms\n\nlet currentLevel = 0; // Track the current level // Define level with an array of platforms\n\n\n\n \nconst platformSize = 40; // Size of each platform tile\n\nfunction setup() {\n createCanvas(800, 600);\n background(0);\n\n // Initialize player position at the center of the canvas\n playerX = width / 2;\n playerY = height / 2;\n\n // Load the current level\n loadLevel(currentLevel);\n}\n\nfunction draw() {\n background(0); // Clear the canvas each frame\n\n // Draw platforms using the sprite\n for (let platform of platforms) {\n image(platformImage, platform.x, platform.y, platformSize, platformSize);\n }\n\n // Apply gravity to player\n playerVelocityY += gravity;\n playerY += playerVelocityY;\n\n // Handle player movement with arrow keys\n if (keyIsDown(LEFT_ARROW)) {\n playerX -= 5;\n }\n if (keyIsDown(RIGHT_ARROW)) {\n playerX += 5;\n }\n\n // Single jump logic\n if (keyIsDown(UP_ARROW) && !isJumping) {\n playerVelocityY = -12.66343286;\n playerY -= 3; // Fix for the bug\n isJumping = true;\n }\n\n // Improved collision detection with platforms\n isJumping = true; // Assume player is not on a platform\n for (let platform of platforms) {\n // Check if player is colliding with the platform\n if (playerX + playerSize / 2 > platform.x &&\n playerX - playerSize / 2 < platform.x + platformSize &&\n playerY + playerSize / 2 > platform.y &&\n playerY - playerSize / 2 < platform.y + platformSize) {\n\n // Check from which direction the player is colliding\n let playerBottom = playerY + playerSize / 2;\n let playerTop = playerY - playerSize / 2;\n let playerRight = playerX + playerSize / 2;\n let playerLeft = playerX - playerSize / 2;\n\n let platformBottom = platform.y + platformSize;\n let platformTop = platform.y;\n let platformRight = platform.x + platformSize;\n let platformLeft = platform.x;\n\n // Colliding from the top\n if (playerBottom > platformTop && playerBottom < platformBottom && playerVelocityY > 0) {\n playerY = platformTop - playerSize / 2;\n playerVelocityY = 0;\n isJumping = false;\n }\n // Colliding from the bottom\n else if (playerTop < platformBottom && playerTop > platformTop && playerVelocityY < 0) {\n playerY = platformBottom + playerSize / 2;\n playerVelocityY = 0;\n }\n // Colliding from the left\n else if (playerRight > platformLeft && playerRight < platformRight && playerVelocityY >= 0) {\n playerX = platformLeft - playerSize / 2;\n }\n // Colliding from the right\n else if (playerLeft < platformRight && playerLeft > platformLeft && playerVelocityY >= 0) {\n playerX = platformRight + playerSize / 2;\n }\n }\n }\n\n // Check if player has reached the end of the level\n if (playerX > width) {\n currentLevel = (currentLevel + 1) % levels.length; // Move to the next level\n loadLevel(currentLevel); // Load the next level\n playerX = 0; // Reset player position to the start\n playerY = height / 2; // Reset player position vertically\n }\n\n // Draw the player character as a circle\n fill(255);\n ellipse(playerX, playerY, playerSize, playerSize);\n} \nfunction loadLevel(levelIndex) {\n platforms = []; // Clear existing platforms\n for (let platform of levels[levelIndex]) {\n platforms.push(platform);\n }\n}","style.css":"","index.html":"\n\n\n\n \n \n Galactic Escape\n \n\n\n\n \n \n\n\n"},"chat_history":[{"project_id":1918,"sender":"human","message":"Let's get started!","deleted":0,"created_at":"2024-06-15T16:39:34.301228Z","output_tokens":null,"code_id":104281,"input_tokens":null,"id":52037},{"project_id":1918,"sender":"ai","message":"Great! Let's start by implementing the player character's movement controls using arrow keys and mouse input.\n\n","deleted":0,"created_at":"2024-06-15T16:39:34.306395Z","output_tokens":null,"code_id":104281,"input_tokens":null,"id":52038},{"project_id":1918,"sender":"human","message":"lets make the platforms use the sprite","deleted":0,"created_at":"2024-06-15T16:39:53.960349Z","output_tokens":null,"code_id":104282,"input_tokens":null,"id":52039},{"project_id":1918,"sender":"ai","message":"Got it! Let's make the platforms use the `grassPatch` sprite. We will preload the image and use it in the `draw` function.\n\n```javascript\nlet platformImage; // Variable to store the platform image\n\nfunction preload() {\n platformImage = loadImage(\"@asset('grassPatch')\"); // Load the platform image\n}\n```\n\n```javascript\nfunction draw() {\n background(0); // Clear the canvas each frame\n\n // Draw platforms using the sprite\n for (let platform of platforms) {\n image(platformImage, platform.x, platform.y, platformSize, platformSize);\n }\n\n // Apply gravity to player\n playerVelocityY += gravity;\n playerY += playerVelocityY;\n\n // Handle player movement with arrow keys\n if (keyIsDown(LEFT_ARROW)) {\n playerX -= 5;\n }\n if (keyIsDown(RIGHT_ARROW)) {\n playerX += 5;\n }\n\n // Single jump logic\n if (keyIsDown(UP_ARROW) && !isJumping) {\n playerVelocityY = -12.66343286;\n playerY -= 3; // Fix for the bug\n isJumping = true;\n }\n\n // Improved collision detection with platforms\n isJumping = true; // Assume player is not on a platform\n for (let platform of platforms) {\n if (playerX + playerSize / 2 > platform.x &&\n playerX - playerSize / 2 < platform.x + platformSize &&\n playerY + playerSize / 2 > platform.y &&\n playerY + playerSize / 2 < platform.y + platformSize) {\n playerY = platform.y - playerSize / 2; // Place player on top of the platform\n playerVelocityY = 0; // Reset vertical velocity\n isJumping = false; // Player is on a platform\n break; // No need to check other platforms\n }\n }\n\n // Draw the player character as a circle\n fill(255);\n ellipse(playerX, playerY, playerSize, playerSize);\n}\n```\n\n- Added `preload` function to load the `grassPatch` image.\n- Used the `image` function to draw the platform sprite in `draw`.\n- The rest of the code remains unchanged but ensures that platforms are drawn using the new sprite.","deleted":0,"created_at":"2024-06-15T16:39:53.965664Z","output_tokens":null,"code_id":104282,"input_tokens":null,"id":52040},{"project_id":1918,"sender":"human","message":"lets use an array yo define a level please","deleted":0,"created_at":"2024-06-16T16:00:20.903382Z","output_tokens":null,"code_id":105470,"input_tokens":null,"id":52527},{"project_id":1918,"sender":"ai","message":"Sure! Let's define a level using an array to specify the platform positions. This will make it easier to design and modify levels.\n\nHere is how you can do it:\n\n1. Define the level using an array of platform positions.\n2. Update the `setup` function to use this array to create platforms.\n\n```javascript\nlet level = [\n { x: 0, y: 560 },\n { x: 40, y: 560 },\n { x: 80, y: 560 },\n { x: 120, y: 520 },\n { x: 160, y: 480 },\n { x: 200, y: 480 },\n { x: 240, y: 440 },\n { x: 280, y: 440 },\n { x: 320, y: 400 },\n { x: 360, y: 400 },\n { x: 400, y: 360 },\n { x: 440, y: 360 },\n { x: 480, y: 320 },\n { x: 520, y: 320 },\n { x: 560, y: 280 },\n { x: 600, y: 280 },\n { x: 640, y: 240 },\n { x: 680, y: 240 },\n { x: 720, y: 200 },\n { x: 760, y: 200 }\n]; // Define level with an array of platforms\n```\n\n```javascript\nfunction setup() {\n createCanvas(800, 600);\n background(0);\n\n // Initialize player position at the center of the canvas\n playerX = width / 2;\n playerY = height / 2;\n\n // Create platforms using the defined level array\n for (let platform of level) {\n platforms.push(platform);\n }\n}\n```\n\n- Defined a `level` array with objects specifying the `x` and `y` positions of each platform.\n- Updated the `setup` function to use this `level` array to initialize the `platforms` array.\n\nThis approach makes it easier to design and change levels by simply updating the `level` array.","deleted":0,"created_at":"2024-06-16T16:00:20.911271Z","output_tokens":null,"code_id":105470,"input_tokens":null,"id":52528},{"project_id":1918,"sender":"human","message":"lets add multiple levels.","deleted":0,"created_at":"2024-06-16T16:04:09.110879Z","output_tokens":null,"code_id":105478,"input_tokens":null,"id":52531},{"project_id":1918,"sender":"ai","message":"Sure! Let's add support for multiple levels. We will define each level as an array of platform positions, and store these arrays in a `levels` array. We will then add logic to switch between levels.\n\n1. Define multiple levels.\n2. Add logic to switch between levels.\n\n```javascript\nlet levels = [\n [\n { x: 0, y: 560 },\n { x: 40, y: 560 },\n { x: 80, y: 560 },\n { x: 120, y: 520 },\n { x: 160, y: 480 },\n { x: 200, y: 480 },\n { x: 240, y: 440 },\n { x: 280, y: 440 },\n { x: 320, y: 400 },\n { x: 360, y: 400 },\n { x: 400, y: 360 },\n { x: 440, y: 360 },\n { x: 480, y: 320 },\n { x: 520, y: 320 },\n { x: 560, y: 280 },\n { x: 600, y: 280 },\n { x: 640, y: 240 },\n { x: 680, y: 240 },\n { x: 720, y: 200 },\n { x: 760, y: 200 }\n ],\n [\n { x: 0, y: 300 },\n { x: 40, y: 300 },\n { x: 80, y: 300 },\n { x: 120, y: 260 },\n { x: 160, y: 220 },\n { x: 200, y: 220 },\n { x: 240, y: 180 },\n { x: 280, y: 180 },\n { x: 320, y: 140 },\n { x: 360, y: 140 },\n { x: 400, y: 100 },\n { x: 440, y: 100 },\n { x: 480, y: 60 },\n { x: 520, y: 60 },\n { x: 560, y: 20 },\n { x: 600, y: 20 },\n { x: 640, y: -20 },\n { x: 680, y: -20 },\n { x: 720, y: -60 },\n { x: 760, y: -60 }\n ]\n]; // Define multiple levels with arrays of platforms\n\nlet currentLevel = 0; // Track the current level\n```\n\n```javascript\nfunction setup() {\n createCanvas(800, 600);\n background(0);\n\n // Initialize player position at the center of the canvas\n playerX = width / 2;\n playerY = height / 2;\n\n // Load the current level\n loadLevel(currentLevel);\n}\n```\n\n```javascript\nfunction loadLevel(levelIndex) {\n platforms = []; // Clear existing platforms\n for (let platform of levels[levelIndex]) {\n platforms.push(platform);\n }\n}\n```\n\n```javascript\nfunction draw() {\n background(0); // Clear the canvas each frame\n\n // Draw platforms using the sprite\n for (let platform of platforms) {\n image(platformImage, platform.x, platform.y, platformSize, platformSize);\n }\n\n // Apply gravity to player\n playerVelocityY += gravity;\n playerY += playerVelocityY;\n\n // Handle player movement with arrow keys\n if (keyIsDown(LEFT_ARROW)) {\n playerX -= 5;\n }\n if (keyIsDown(RIGHT_ARROW)) {\n playerX += 5;\n }\n\n // Single jump logic\n if (keyIsDown(UP_ARROW) && !isJumping) {\n playerVelocityY = -12.66343286;\n playerY -= 3; // Fix for the bug\n isJumping = true;\n }\n\n // Improved collision detection with platforms\n isJumping = true; // Assume player is not on a platform\n for (let platform of platforms) {\n if (playerX + playerSize / 2 > platform.x &&\n playerX - playerSize / 2 < platform.x + platformSize &&\n playerY + playerSize / 2 > platform.y &&\n playerY + playerSize / 2 < platform.y + platformSize) {\n playerY = platform.y - playerSize / 2; // Place player on top of the platform\n playerVelocityY = 0; // Reset vertical velocity\n isJumping = false; // Player is on a platform\n break; // No need to check other platforms\n }\n }\n\n // Check if player has reached the end of the level\n if (playerX > width) {\n currentLevel = (currentLevel + 1) % levels.length; // Move to the next level\n loadLevel(currentLevel); // Load the next level\n playerX = 0; // Reset player position to the start\n playerY = height / 2; // Reset player position vertically\n }\n\n // Draw the player character as a circle\n fill(255);\n ellipse(playerX, playerY, playerSize, playerSize);\n}\n```\n\n- Defined `levels` array containing multiple levels.\n- Added `currentLevel` to track the current level index.\n- Created `loadLevel` function to load platforms for a given level.\n- Updated `draw` to switch to the next level when the player reaches the end of the current level.","deleted":0,"created_at":"2024-06-16T16:04:09.116756Z","output_tokens":null,"code_id":105478,"input_tokens":null,"id":52532},{"project_id":1918,"sender":"human","message":"make the blocks collidable cubes","deleted":0,"created_at":"2024-06-16T16:07:43.673061Z","output_tokens":null,"code_id":105493,"input_tokens":null,"id":52537},{"project_id":1918,"sender":"ai","message":"To make the blocks collidable cubes, we'll need to adjust the player collision detection to consider the platform as a cube, and ensure the player cannot pass through any part of the cube. We'll also enhance the visual representation to make it clear that these are cubes.\n\nLet's update the code accordingly:\n\n```javascript\nfunction draw() {\n background(0); // Clear the canvas each frame\n\n // Draw platforms using the sprite\n for (let platform of platforms) {\n image(platformImage, platform.x, platform.y, platformSize, platformSize);\n }\n\n // Apply gravity to player\n playerVelocityY += gravity;\n playerY += playerVelocityY;\n\n // Handle player movement with arrow keys\n if (keyIsDown(LEFT_ARROW)) {\n playerX -= 5;\n }\n if (keyIsDown(RIGHT_ARROW)) {\n playerX += 5;\n }\n\n // Single jump logic\n if (keyIsDown(UP_ARROW) && !isJumping) {\n playerVelocityY = -12.66343286;\n playerY -= 3; // Fix for the bug\n isJumping = true;\n }\n\n // Improved collision detection with platforms\n isJumping = true; // Assume player is not on a platform\n for (let platform of platforms) {\n // Check if player is colliding with the platform\n if (playerX + playerSize / 2 > platform.x &&\n playerX - playerSize / 2 < platform.x + platformSize &&\n playerY + playerSize / 2 > platform.y &&\n playerY - playerSize / 2 < platform.y + platformSize) {\n\n // Check from which direction the player is colliding\n let playerBottom = playerY + playerSize / 2;\n let playerTop = playerY - playerSize / 2;\n let playerRight = playerX + playerSize / 2;\n let playerLeft = playerX - playerSize / 2;\n\n let platformBottom = platform.y + platformSize;\n let platformTop = platform.y;\n let platformRight = platform.x + platformSize;\n let platformLeft = platform.x;\n\n // Colliding from the top\n if (playerBottom > platformTop && playerBottom < platformBottom && playerVelocityY > 0) {\n playerY = platformTop - playerSize / 2;\n playerVelocityY = 0;\n isJumping = false;\n }\n // Colliding from the bottom\n else if (playerTop < platformBottom && playerTop > platformTop && playerVelocityY < 0) {\n playerY = platformBottom + playerSize / 2;\n playerVelocityY = 0;\n }\n // Colliding from the left\n else if (playerRight > platformLeft && playerRight < platformRight) {\n playerX = platformLeft - playerSize / 2;\n }\n // Colliding from the right\n else if (playerLeft < platformRight && playerLeft > platformLeft) {\n playerX = platformRight + playerSize / 2;\n }\n }\n }\n\n // Check if player has reached the end of the level\n if (playerX > width) {\n currentLevel = (currentLevel + 1) % levels.length; // Move to the next level\n loadLevel(currentLevel); // Load the next level\n playerX = 0; // Reset player position to the start\n playerY = height / 2; // Reset player position vertically\n }\n\n // Draw the player character as a circle\n fill(255);\n ellipse(playerX, playerY, playerSize, playerSize);\n}\n```\n\n- Added detailed collision detection logic to handle top, bottom, left, and right collisions.\n- Ensured that the player cannot pass through any part of the platform cube.","deleted":0,"created_at":"2024-06-16T16:07:43.689915Z","output_tokens":null,"code_id":105493,"input_tokens":null,"id":52538},{"project_id":1918,"sender":"human","message":"when i jump right up when on a platfrom and a block to my rigth, i like get stuck","deleted":0,"created_at":"2024-06-16T16:09:10.372967Z","output_tokens":null,"code_id":105500,"input_tokens":null,"id":52539},{"project_id":1918,"sender":"ai","message":"To address the issue where the player gets stuck when jumping up next to a block on the right, we need to make sure the collision logic accurately handles side collisions and allows the player to move freely along the vertical axis when jumping.\n\nLet's refine the collision detection logic to ensure smoother movement:\n\n```javascript\nfunction draw() {\n background(0); // Clear the canvas each frame\n\n // Draw platforms using the sprite\n for (let platform of platforms) {\n image(platformImage, platform.x, platform.y, platformSize, platformSize);\n }\n\n // Apply gravity to player\n playerVelocityY += gravity;\n playerY += playerVelocityY;\n\n // Handle player movement with arrow keys\n if (keyIsDown(LEFT_ARROW)) {\n playerX -= 5;\n }\n if (keyIsDown(RIGHT_ARROW)) {\n playerX += 5;\n }\n\n // Single jump logic\n if (keyIsDown(UP_ARROW) && !isJumping) {\n playerVelocityY = -12.66343286;\n playerY -= 3; // Fix for the bug\n isJumping = true;\n }\n\n // Improved collision detection with platforms\n isJumping = true; // Assume player is not on a platform\n for (let platform of platforms) {\n // Check if player is colliding with the platform\n if (playerX + playerSize / 2 > platform.x &&\n playerX - playerSize / 2 < platform.x + platformSize &&\n playerY + playerSize / 2 > platform.y &&\n playerY - playerSize / 2 < platform.y + platformSize) {\n\n // Check from which direction the player is colliding\n let playerBottom = playerY + playerSize / 2;\n let playerTop = playerY - playerSize / 2;\n let playerRight = playerX + playerSize / 2;\n let playerLeft = playerX - playerSize / 2;\n\n let platformBottom = platform.y + platformSize;\n let platformTop = platform.y;\n let platformRight = platform.x + platformSize;\n let platformLeft = platform.x;\n\n // Colliding from the top\n if (playerBottom > platformTop && playerBottom < platformBottom && playerVelocityY > 0) {\n playerY = platformTop - playerSize / 2;\n playerVelocityY = 0;\n isJumping = false;\n }\n // Colliding from the bottom\n else if (playerTop < platformBottom && playerTop > platformTop && playerVelocityY < 0) {\n playerY = platformBottom + playerSize / 2;\n playerVelocityY = 0;\n }\n // Colliding from the left\n else if (playerRight > platformLeft && playerRight < platformRight && playerVelocityY >= 0) {\n playerX = platformLeft - playerSize / 2;\n }\n // Colliding from the right\n else if (playerLeft < platformRight && playerLeft > platformLeft && playerVelocityY >= 0) {\n playerX = platformRight + playerSize / 2;\n }\n }\n }\n\n // Check if player has reached the end of the level\n if (playerX > width) {\n currentLevel = (currentLevel + 1) % levels.length; // Move to the next level\n loadLevel(currentLevel); // Load the next level\n playerX = 0; // Reset player position to the start\n playerY = height / 2; // Reset player position vertically\n }\n\n // Draw the player character as a circle\n fill(255);\n ellipse(playerX, playerY, playerSize, playerSize);\n}\n```\n\n- Refined the side collision logic to only affect horizontal movement if the player is not moving upward.\n- Ensured vertical movement is not impeded by side collisions during a jump.\n\nThis should help mitigate the issue of getting stuck when jumping next to a block.","deleted":0,"created_at":"2024-06-16T16:09:10.379270Z","output_tokens":null,"code_id":105500,"input_tokens":null,"id":52540}],"assets":[{"cloudinary_id":"rif5dtpqusem0ok4pyww","name":"grassPatch","deleted":false,"id":8103,"created_at":"2024-06-15T16:39:14.696797Z","project_id":1918,"resource_type":"image"}],"messages_sent":6,"comments":[],"steps":[{"instruction":"Implement the player character's movement controls using arrow keys and mouse input.","title":"Add player character movement","created_at":"2024-06-15T16:15:13.896010","project_id":1918,"complete":false,"step_number":0,"updated_at":"2024-06-15T16:39:14.692129","id":9883},{"instruction":"Incorporate enemy characters that move within the game space and pose a challenge to the player's progress.","title":"Introduce enemies","created_at":"2024-06-15T16:15:13.896116","project_id":1918,"complete":false,"step_number":1,"updated_at":"2024-06-15T16:39:14.692207","id":9884},{"instruction":"Create different worlds with unique themes and challenges for the player to navigate through.","title":"Implement multiple worlds","created_at":"2024-06-15T16:15:13.896197","project_id":1918,"complete":false,"step_number":2,"updated_at":"2024-06-15T16:39:14.692256","id":9885},{"instruction":"Utilize pixel art to create visually stimulating graphics for the game, enhancing the overall gaming experience.","title":"Design pixel art visuals","created_at":"2024-06-15T16:15:13.896270","project_id":1918,"complete":false,"step_number":3,"updated_at":"2024-06-15T16:39:14.692303","id":9886},{"instruction":"Incorporate vibrant and diverse color palettes to distinguish different worlds and enhance the visual appeal of the game.","title":"Add color palette variation","created_at":"2024-06-15T16:15:13.896343","project_id":1918,"complete":false,"step_number":4,"updated_at":"2024-06-15T16:39:14.692348","id":9887}]}