Side Scrolling Adventure

{"name":"Side Scrolling Adventure","description":"Embark on a thrilling side-scrolling adventure! Jump, dodge, and collect treasures as you navigate through fun and challenging levels. Use your skills to overcome obstacles and score points in this engaging platformer built with p5.js!","photo":null,"view_count":1,"fork_count":0,"expires_at":null,"created_at":"2025-03-01T01:57:51.814065Z","updated_at":"2025-03-01T01:57:51.814072Z","user_id":60,"status":"PRIVATE","parent_id":5821,"id":5924,"user":{"photo":null,"email":"jacob@jippity.pro","recess_id":"34481dd2-2bdf-14f9-99da-131de59dc90f","created_at":"2024-02-26T18:31:54.473216Z","reset_token":null,"stripe_customer_id":"cus_RPbovGjLueUufv","seats":100,"username":"2718281828459045","id":60,"password_hash":"$2b$12$ZpelZmCi5wEA/VuXSdOJXeylQ6vOUks0sfwQxIKdjwBAeamaWIMOW","updated_at":"2024-02-26T18:31:54.473218Z","reset_token_expiry":null,"subscription_status":"active"},"code":{"Enemy.js":"// Enemy class\nclass Enemy {\n constructor(x, y) {\n this.x = x;\n this.y = y;\n this.width = 50; // Width of the knight\n this.height = 50; // Height of the knight\n this.speed = 2; // Speed of the knight\n }\n\n update() {\n // Move towards the player\n if (player.x < this.x) {\n this.x -= this.speed; // Move left\n } else if (player.x > this.x) {\n this.x += this.speed; // Move right\n }\n }\n\n display() {\n image(knight, this.x, this.y, this.width, this.height); // Display the knight\n }\n}","Player.js":"class Player {\n constructor(x, y) {\n this.x = x;\n this.y = y;\n this.width = 50;\n this.height = 50;\n this.velocityY = 0;\n this.gravity = 0.8;\n this.jumpStrength = -15;\n this.jetpackStrength = -5; // Jetpack strength\n this.onGround = false;\n this.hp = 3; // Add HP variable, starting at 3\n }\n\n update() {\n // Update player position and handle gravity\n this.velocityY += this.gravity; // Apply gravity\n this.y += this.velocityY; // Move player down\n\n // Check if the player is on the ground\n if (this.y > height - this.height) {\n this.y = height - this.height; // Keep player on the ground\n this.onGround = true; // Set onGround to true\n this.velocityY = 0; // Reset vertical velocity\n } else {\n this.onGround = false; // Player is in the air\n }\n }\n\n move() {\n // Add logic for player movement (e.g., jumping or moving left/right)\n if (keyIsDown(LEFT_ARROW)) {\n this.x -= 5; // Move left\n }\n if (keyIsDown(RIGHT_ARROW)) {\n this.x += 5; // Move right\n }\n if (keyIsDown(UP_ARROW) && this.onGround) {\n this.velocityY = this.jumpStrength; // Jump\n }\n }\n\n display() {\n fill(0, 0, 255); // Blue color for the player\n rect(this.x, this.y, this.width, this.height); // Draw the player\n }\n}\n\n","script.js":"// Global variables\nlet astronaut;\n\nlet knight;\n\nlet player;\n\nlet platforms = [];\n\nlet backgroundMusic;\n\nlet xp = 0;\n\nlet enemy;\n\nlet isGameOver = false;\n\nlet jetpacks = [];\n\nlet spikes = [];\n\nlet butters = [];\n\nlet explosionActive = false;\n\nfunction preload() {\n astronaut = loadImage(\"@asset('astronaut')\");\n knight = loadImage(\"@asset('knight')\"); // Load the knight asset\n backgroundMusic = loadSound(\"@asset('classicalBeatFullStrings')\"); // Load the background music\n exclamation_box = loadImage(\"@asset('exclamation_box')\");\n sciFiMusic1 = loadSound(\"@asset('sciFiMusic1')\");\n platform_grass = loadImage(\"@asset('platform_grass')\"); // Load the platform image\n explodeGif = loadImage(\"@asset('explodeGif')\"); // Load the explosion image\n}\n\nfunction setup() {\n createCanvas(windowWidth, windowHeight);\n player = new Player(100, height - 50); // Initial player position\n enemy = new Enemy(300, height - 50); // Create an enemy instance\n\n // Create platforms\n platforms.push(new Platform(200, height - 100, 150, 20));\n platforms.push(new Platform(400, height - 200, 150, 20));\n platforms.push(new Platform(600, height - 300, 150, 20));\n\n // Randomly generate additional platforms\n for (let i = 0; i < 5; i++) { // Add 5 more random platforms\n let randomX = random(0, width - 150); // Random x position\n let randomY = random(100, height - 50); // Random y position\n platforms.push(new Platform(randomX, randomY, 150, 20));\n }\n\n // Randomly generate butter\n for (let i = 0; i < 3; i++) { // Add 3 pieces of butter\n let randomX = random(0, width - 30); // Random x position\n let randomY = random(100, height - 50); // Random y position\n butters.push(new Butter(randomX, randomY)); // Add butter instance\n }\n\n backgroundMusic.loop(); // Play the background music in a loop\n\n // Setup restart button\n const restartButton = document.getElementById('restartButton')\n restartButton.addEventListener('click', restartGame);\n}\n\nfunction draw() {\n background(135, 206, 235); // Sky blue background\n\n if (!isGameOver) {\n player.update();\n player.move();\n player.display();\n\n // Display all platforms\n for (let platform of platforms) {\n platform.display();\n }\n\n // Update and display the enemy\n enemy.update();\n enemy.display();\n\n // Display spikes and check for collisions\n for (let spike of spikes) {\n spike.display();\n if (isCollidingWithSpike(player, spike)) {\n isGameOver = true; // Set game over state\n document.getElementById('restartButton').style.display = 'block'; // Show restart button\n }\n }\n\n // Display butter and check for collisions\n for (let butter of butters) {\n butter.display();\n butter.checkCollision(player); // Check for collision with the player\n }\n\n // Check for collisions between player and enemy\n if (isColliding(player, enemy)) {\n player.hp--; // Decrease HP by 1\n explosionActive = true; // Activate explosion\n\n // Check if player is out of HP\n if (player.hp <= 0) {\n isGameOver = true; // Set game over state\n document.getElementById('restartButton').style.display = 'block'; // Show restart button\n } else {\n setTimeout(() => {\n explosionActive = false; // Reset explosion after a hit\n }, 500); // Delay explosion display\n }\n }\n } else {\n showScoreboard(); // Show scoreboard when game is over\n }\n\n // Display the explosion if active\n displayExplosion();\n\n // Display HP\n fill(0); // Set the text color to black\n textSize(24); // Set the text size\n text(`HP: ${player.hp}`, 10, 60); // Display the HP at the top left\n\n // Display XP\n fill(0); // Set the text color to black\n textSize(24); // Set the text size\n text(`XP: ${xp}`, 10, 30); // Display the XP at the top left\n\n // Display FPS\n fill(0); // Set the text color to black\n textSize(16); // Set the text size for FPS\n text(`FPS: ${Math.round(frameRate())}`, 10, 90); // Display FPS at the top left\n}\n\n\n\nclass Spike {\n constructor(x, y) {\n this.x = x;\n this.y = y;\n this.width = 30; // Width of the spike\n this.height = 30; // Height of the spike\n }\n\n display() {\n fill(255, 0, 0); // Red color for the spike\n triangle(this.x, this.y, this.x + this.width / 2, this.y - this.height, this.x + this.width, this.y); // Draw the spike\n }\n}\n\nclass Butter {\n constructor(x, y) {\n this.x = x;\n this.y = y;\n this.width = 30; // Width of the butter\n this.height = 30; // Height of the butter\n this.collected = false; // Whether the butter has been collected\n }\n\n display() {\n if (!this.collected) {\n fill(255, 204, 0); // Yellow color for the butter\n rect(this.x, this.y, this.width, this.height); // Draw the butter\n }\n }\n\n checkCollision(player) {\n if (!this.collected && player.x < this.x + this.width &&\n player.x + player.width > this.x &&\n player.y < this.y + this.height &&\n player.y + player.height > this.y) {\n this.collected = true; // Mark as collected\n xp += 20; // Gain XP for collecting butter\n }\n }\n}\n\nclass Platform {\n constructor(x, y, width, height) {\n this.x = x;\n this.y = y;\n this.width = width; // Width of the platform\n this.height = height; // Height of the platform\n }\n\n display() {\n // Draw the platform image stretched to fit the width and height\n image(platform_grass, this.x, this.y, this.width, this.height);\n }\n}\n\nwindow.onload = () => {\n const restartButton = document.getElementById('restartButton');\n restartButton.addEventListener('click', restartGame);\n};\n\nfunction isColliding(player, enemy) {\n return player.x < enemy.x + enemy.width &&\n player.x + player.width > enemy.x &&\n player.y < enemy.y + enemy.height &&\n player.y + player.height > enemy.y;\n}\n\nfunction showScoreboard() {\n fill(255); // White color for the scoreboard text\n textSize(32);\n textAlign(CENTER, CENTER);\n text(`Game Over! Your Score: ${xp}`, width / 2, height / 2);\n}\n\nfunction restartGame() {\n // Reset game state\n isGameOver = false;\n xp = 0;\n player.x = 100;\n player.y = height - 50;\n enemy.x = 300;\n enemy.y = height - 50;\n\n // Hide the restart button\n document.getElementById('restartButton').style.display = 'none';\n}\n\nfunction isCollidingWithSpike(player, spike) {\n return player.x < spike.x + spike.width &&\n player.x + player.width > spike.x &&\n player.y < spike.y + spike.height &&\n player.y + player.height > spike.y;\n}\n\nfunction displayExplosion() {\n if (explosionActive) {\n image(explodeGif, player.x, player.y, player.width, player.height); // Display explosion at player's position\n }\n}\n\n","style.css":"body { margin: 0; } canvas { display: block; }","Jetpack.js":"class Jetpack {\n constructor(x, y) {\n this.x = x;\n this.y = y;\n this.width = 30; // Width of the jetpack\n this.height = 30; // Height of the jetpack\n this.collected = false; // Whether the jetpack has been collected\n }\n\n display() {\n if (!this.collected) {\n fill(255, 215, 0); // Gold color for the jetpack\n rect(this.x, this.y, this.width, this.height); // Draw the jetpack\n }\n }\n\n checkCollision(player) {\n if (!this.collected && player.x < this.x + this.width &&\n player.x + player.width > this.x &&\n player.y < this.y + this.height &&\n player.y + player.height > this.y) {\n this.collected = true; // Mark as collected\n player.jetpackAvailable = true; // Enable jetpack for player\n }\n }\n}","index.html":"\n\n\n\n \n \n Side Scrolling Adventure\n \n \n \n\n\n\n \n \n \n \n \n\n\n"},"chat_history":[],"assets":[{"name":"astronaut","cloudinary_id":"qdqeismtfjwwtwlzkyfj","resource_type":"image","id":60022,"project_id":5924,"created_at":"2025-03-01T01:57:51.851923Z","deleted":false},{"name":"classicalBeatFullStrings","cloudinary_id":"pgkkft0ldvgjqukf3qsg","resource_type":"video","id":60021,"project_id":5924,"created_at":"2025-03-01T01:57:51.849095Z","deleted":false},{"name":"knight","cloudinary_id":"h3zlpx78uomvgzrokdwf","resource_type":"image","id":60020,"project_id":5924,"created_at":"2025-03-01T01:57:51.846654Z","deleted":false},{"name":"exclamation_box","cloudinary_id":"cta4l3knaxwoy5dgrneh","resource_type":"image","id":60019,"project_id":5924,"created_at":"2025-03-01T01:57:51.844714Z","deleted":false},{"name":"question_box","cloudinary_id":"eodxr7hfybr7bpuqkigp","resource_type":"image","id":60018,"project_id":5924,"created_at":"2025-03-01T01:57:51.841757Z","deleted":false},{"name":"cuteClarinetSong","cloudinary_id":"lr5wsdbvccj1wkcyry7d","resource_type":"video","id":60017,"project_id":5924,"created_at":"2025-03-01T01:57:51.839337Z","deleted":false},{"name":"sciFiMusic1","cloudinary_id":"xl7bhvqqyj7zhepzbkbh","resource_type":"video","id":60016,"project_id":5924,"created_at":"2025-03-01T01:57:51.836781Z","deleted":false},{"name":"dragon","cloudinary_id":"ojrctfzhinpdxlceruep","resource_type":"image","id":60015,"project_id":5924,"created_at":"2025-03-01T01:57:51.833934Z","deleted":false},{"name":"platform_grass","cloudinary_id":"iii1wv1n0yydmqwxsq2h","resource_type":"image","id":60014,"project_id":5924,"created_at":"2025-03-01T01:57:51.831925Z","deleted":false},{"name":"explodeGif","cloudinary_id":"ljyvpzovvwalyrocdqy3","resource_type":"image","id":60013,"project_id":5924,"created_at":"2025-03-01T01:57:51.828285Z","deleted":false}],"messages_sent":0,"comments":[],"steps":[]}