Circular Adventure Quest

{"name":"NotStickRPG","description":"Embark on a circular adventure quest, where you navigate a winding path, collect treasures, and overcome obstacles. Can you master the circular path and achieve victory?","photo":null,"view_count":4,"fork_count":0,"expires_at":null,"created_at":"2024-02-22T20:22:21.882263Z","updated_at":"2024-02-22T20:22:21.882265Z","user_id":5,"status":"PUBLIC","parent_id":645,"id":709,"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 gameOverlay = document.getElementById('gameOverlay');\r\nfunction updateGameOverlay(content, x, y) {\r\n gameOverlay.innerHTML = content; // Update the content\r\n gameOverlay.style.transform = `translate(${x}px, ${y}px)`; // Position the overlay\r\n}\r\n// When the player interacts with an NPC:\r\nfunction showNPCDialogue(text) {\r\n gameOverlay.innerHTML = `

${text}

`;\r\n // Position it at the bottom center of the screen\r\n gameOverlay.style.bottom = '10%';\r\n gameOverlay.style.left = '50%';\r\n gameOverlay.style.transform = 'translate(-50%, 0)';\r\n gameOverlay.style.pointerEvents = 'none'; // Ensure it doesn't block canvas interactions\r\n}\r\nclass NPC {\r\n constructor(x, y, imgURL) {\r\n this.x = x;\r\n this.y = y;\r\n this.img = loadImage(imgURL, img => {\r\n console.log('Image loaded successfully');\r\n }, err => {\r\n console.error('Error loading image: ', err);\r\n }); // Load the image for the NPC\r\n }\r\n\r\n display() {\r\n if (this.img) { // Make sure the image is loaded before trying to display it\r\n image(this.img, this.x, this.y, 50, 50); // Display the NPC\r\n }\r\n }\r\n}\r\nwindow.addEventListener('resize', resizeModal);\r\n\r\nfunction resizeModal() {\r\n let modal = document.getElementById('npcDialog');\r\n modal.style.width = window.innerWidth * 0.8 + 'px'; // 80% of window width\r\n modal.style.height = window.innerHeight * 0.8 + 'px'; // 80% of window height\r\n}\r\nlet easterEgg; // Declare a variable for the Easter egg\r\nclass EasterEgg {\r\n constructor(x, y, imgURL) {\r\n this.x = x;\r\n this.y = y;\r\n this.img = loadImage(imgURL, img => {\r\n console.log('Easter Eg loaded sucesscgfully');\r\n }, err => {\r\n console.error('Error loading Easter egg: ', err);\r\n }); // Load the image for the Easter egg\r\n\r\n }\r\n\r\n display() {\r\n if (this.img) { // Make sure the image is loaded before trying to display it\r\n image(this.img, this.x, this.y, 50, 50); // Display the Easter egg\r\n }\r\n text(\"You found our easter egg. Comment 'Old Man RISES' on the original game.\", this.x, this.y + 60);\r\n\r\n }\r\n\r\n\r\n}\r\nlet npc; // Declare a variable for the NPC\r\n\r\nclass Player {\r\n constructor() {\r\n this.x = 50;\r\n this.y = 50;\r\n this.speed = 2;\r\n this.sprintSpeed = 3; // Additional speed when sprinting\r\n this.heading = 0; // New variable to track the player's direction\r\n this.size = 40; // Updated size for the player\r\n }\r\n\r\n display() {\r\n push(); // Save the current transformation\r\n translate(this.x, this.y); // Move the origin to the player's position\r\n rotate(this.heading); // Rotate the canvas by the player's direction\r\n imageMode(CENTER); // Draw the image centered at the origin\r\n image(playerImg, 0, 0, this.size, this.size); // Draw the player's image at the new origin with updated size\r\n pop(); // Restore the transformation\r\n }\r\n move() {\r\n // Store the old player position\r\n let oldX = this.x;\r\n let oldY = this.y;\r\n let currentSpeed = keyIsDown(SHIFT) ? this.sprintSpeed : this.speed;\r\n\r\n if ((keyIsDown(LEFT_ARROW) || keyIsDown(65)) && this.x - currentSpeed > 0) {\r\n this.x -= currentSpeed;\r\n this.heading = -HALF_PI; // Left direction\r\n }\r\n if ((keyIsDown(RIGHT_ARROW) || keyIsDown(68)) && this.x + currentSpeed < width) {\r\n this.x += currentSpeed;\r\n this.heading = HALF_PI; // Right direction\r\n }\r\n if ((keyIsDown(UP_ARROW) || keyIsDown(87)) && this.y - currentSpeed > 0) {\r\n this.y -= currentSpeed;\r\n this.heading = 0; // Up direction\r\n }\r\n if (keyIsDown(DOWN_ARROW) || keyIsDown(83)) {\r\n this.y += currentSpeed;\r\n this.heading = PI; // Down direction\r\n }\r\n\r\n // If the player has moved, tell the car that it can move again\r\n if (this.x !== oldX || this.y !== oldY) {\r\n car.canMove = true;\r\n }\r\n }\r\n}\r\n\r\nlet houses = [];\r\nfunction addHouse(x, y, imgURL, link, width = 50, height = 50) {\r\n let img = loadImage(imgURL); // load the image\r\n houses.push(new House(x, y, img, link, width, height));\r\n}\r\nclass House {\r\n constructor(x, y, img, link, width = 50, height = 50) {\r\n this.x = x;\r\n this.y = y;\r\n this.img = img;\r\n this.link = link;\r\n this.width = width; // Use the provided width parameter or default to 50\r\n this.height = height; // Use the provided height parameter or default to 50\r\n }\r\n display() {\r\n image(this.img, this.x, this.y, this.width, this.height);\r\n }\r\n}\r\nlet player;\r\nlet building;\r\nlet playerImg;\r\nlet buildingImg;\r\nlet modal; // Declare 'modal' in the global scope\r\nlet span;\r\nlet townBg; // Declare a variable for the town background image\r\nlet car;\r\n\r\nfunction preload() {\r\n townBg = loadImage('https://media.discordapp.net/attachments/1178847227762982932/1209233255832752229/pixil-frame-0_1.png?ex=65e62d3a&is=65d3b83a&hm=67e58e08414e2b48d984deef8c54d5a6647bc67dcec305f30d979ee4e2338a24&=&format=webp&quality=lossless');\r\n bgImg = loadImage('https://media.discordapp.net/attachments/1178846400491040821/1209561423496216618/pixil-frame-0_3.png?ex=65e75edb&is=65d4e9db&hm=e2ad0f5df1eb3062b900d710d56f646bab9dfccf429069ac499d963c50b0e810&=&format=webp&quality=lossless'); // replace 'bgImg.jpg' with your actual image path\r\n\r\n playerImg = loadImage('https://media.discordapp.net/attachments/1172012862194073744/1207817841244372992/get_attachment_url.png?ex=65e10705&is=65ce9205&hm=9c14ac17d51e7d625acbb80d70e08ec2100274506b335852c4d83bfe3163fe8a&=&format=webp&quality=lossless'); // replace with path to your player image\r\n}\r\nlet npc2; // Declare a variable for the second NPC\r\n\r\nclass Car {\r\n constructor(x, y, imgURL) {\r\n this.x = x;\r\n this.y = y;\r\n this.speed = 5; // Current speed of the car\r\n this.maxSpeed = 999; // Maximum speed\r\n this.acceleration = 0.12; // Acceleration rate\r\n this.friction = 0.05; // Friction rate, simulating braking and natural slowing down\r\n this.angle = 0; // Angle of the car, for turning\r\n this.img = loadImage(imgURL, img => {\r\n console.log('Car iamge laoded sesuccfuslly');\r\n }, err => {\r\n console.error('FAIL CARD: ', err);\r\n });\r\n this.isControlled = false;\r\n }\r\n\r\n display() {\r\n push();\r\n translate(this.x, this.y);\r\n rotate(this.angle);\r\n\r\n rotate(this.angle + random(999)); // Rotate by the car's angle plus 90 degrees (PI/2 radians)\r\n\r\n imageMode(CENTER);\r\n image(this.img, 0, 0, 50, 50);\r\n pop();\r\n }\r\n\r\n move() {\r\n if (this.isControlled) {\r\n if (keyIsDown(UP_ARROW) || keyIsDown(87)) { // Accelerate\r\n this.speed += this.acceleration;\r\n } else if (keyIsDown(DOWN_ARROW) || keyIsDown(83)) { // Brake\r\n this.speed -= this.acceleration; // Braking is faster than accelerating\r\n } else {\r\n // Apply friction to slow down gradually when no acceleration/brake is applied\r\n if (this.speed - this.friction > 0) {\r\n this.speed -= this.friction;\r\n } else if (this.speed + this.friction < 0) {\r\n this.speed += this.friction;\r\n } else {\r\n this.speed = 0;\r\n }\r\n }\r\n\r\n // Limit speed to maximum\r\n this.speed = constrain(this.speed, -this.maxSpeed, this.maxSpeed);\r\n\r\n // Turning\r\n if (keyIsDown(LEFT_ARROW) || keyIsDown(65)) {\r\n this.angle -= 0.05;\r\n }\r\n if (keyIsDown(RIGHT_ARROW) || keyIsDown(68)) {\r\n this.angle += 0.05;\r\n }\r\n\r\n // Move the car based on its speed and angle\r\n this.x += this.speed * cos(this.angle);\r\n this.y += this.speed * sin(this.angle);\r\n }\r\n }\r\n}\r\nlet bgImg; // Declare a variable for the background image\r\n\r\nfunction setup() {\r\n pixelDensity(1); // Set pixel density to 1\r\n\r\n createCanvas(400, 400);\r\n\r\n player = new Player();\r\n car = new Car(width / 2 + 55, 55, 'https://media.discordapp.net/attachments/1178846400491040821/1209554265631232050/get_attachment_url.png?ex=65e75831&is=65d4e331&hm=d133300a4a4d14e921bc2300532533095f6328f857d8ab319ad78dbf66ddba15&=&format=webp&quality=lossless');\r\n addHouse(40, 85, 'https://media.discordapp.net/attachments/1178846400491040821/1209553021109927986/get_attachment_url.png?ex=65e75708&is=65d4e208&hm=31ce7e9a4f6d57563c12b1e522382037c4a0e5cef0a98847fa8ab85928e22823&=&format=webp&quality=lossless', 'https://www.jippity.pro/646', 100, 100);\r\n\r\n // Add a second house\r\n addHouse(115, 100, 'https://media.discordapp.net/attachments/1178846400491040821/1209559089412313128/pixil-frame-0_2.png?ex=65e75caf&is=65d4e7af&hm=362fbe55a10f67c6befbe02145fc6b57b3cce926971175ec0a58138e60f43dd6&=&format=webp&quality=lossless', 'https://www.jippity.pro/648', 65, 65);\r\n addHouse(15, 325, 'https://media.discordapp.net/attachments/1172012862194073744/1208084212507217970/unnamed_10.png?ex=65e1ff19&is=65cf8a19&hm=174609b188358c62832f106baafceaca4b6362e41c90000e7518e50ecbb7ff52&=&format=webp&quality=lossless', 'https://www.jippity.pro/662', 100, 100);\r\n addHouse(325, 175, 'https://media.discordapp.net/attachments/1172012862194073744/1208084212507217970/unnamed_10.png?ex=65e1ff19&is=65cf8a19&hm=174609b188358c62832f106baafceaca4b6362e41c90000e7518e50ecbb7ff52&=&format=webp&quality=lossless', 'https://www.jippity.pro/665', 100, 100);\r\n addHouse(325, 95, 'https://media.discordapp.net/attachments/1172012862194073744/1208084212507217970/unnamed_10.png?ex=65e1ff19&is=65cf8a19&hm=174609b188358c62832f106baafceaca4b6362e41c90000e7518e50ecbb7ff52&=&format=webp&quality=lossless', 'https://www.jippity.pro/669', 100, 100);\r\n addHouse(325, 0, 'https://media.discordapp.net/attachments/1172012862194073744/1208084212507217970/unnamed_10.png?ex=65e1ff19&is=65cf8a19&hm=174609b188358c62832f106baafceaca4b6362e41c90000e7518e50ecbb7ff52&=&format=webp&quality=lossless', 'https://www.jippity.pro/671', 100, 100);\r\n addHouse(325, 255, 'https://media.discordapp.net/attachments/1172012862194073744/1208084212507217970/unnamed_10.png?ex=65e1ff19&is=65cf8a19&hm=174609b188358c62832f106baafceaca4b6362e41c90000e7518e50ecbb7ff52&=&format=webp&quality=lossless', 'https://www.jippity.pro/681', 100, 100);\r\n addHouse(325, 325, 'https://media.discordapp.net/attachments/1172012862194073744/1208084212507217970/unnamed_10.png?ex=65e1ff19&is=65cf8a19&hm=174609b188358c62832f106baafceaca4b6362e41c90000e7518e50ecbb7ff52&=&format=webp&quality=lossless', 'https://www.jippity.pro/692', 100, 100);\r\n\r\n npc = new NPC(120, 355, 'https://media.discordapp.net/attachments/1172012862194073744/1208876761778233357/pixil-frame-0_6_1.png?ex=65e4e137&is=65d26c37&hm=77e3b4385b22a80b0262c42ec92117df2df21a1929c784497a83e50dfead87dd&=&format=webp&quality=lossless');\r\n modal = document.getElementById(\"npcDialog\");\r\n span = document.getElementsByClassName(\"close\")[0];\r\n npc2 = new NPC(135, 25, 'https://media.discordapp.net/attachments/1178847227762982932/1209239045104730233/pixil-frame-0_2.png?ex=65e6329e&is=65d3bd9e&hm=7fae2fbee8f314fc506f5fc1fee99a3d4bc6b0d3cda508117e6115b9a9e9b068&=&format=webp&quality=lossless');\r\n easterEgg = new EasterEgg(0, 755, 'https://media.discordapp.net/attachments/1178846400491040821/1209241896665481257/pixil-frame-0_29.png?ex=65e63546&is=65d3c046&hm=c16c396bf929ffc87d8cbe33ab7350ee19e6547714402be81b08486b82bd2408&=&format=webp&quality=lossless'); // replace with path to your Easter egg image\r\n noSmooth();\r\n\r\n span.onclick = function () {\r\n modal.style.display = \"none\";\r\n }\r\n\r\n window.onclick = function (event) {\r\n if (event.target == modal) {\r\n modal.style.display = \"none\";\r\n }\r\n }\r\n}\r\n\r\nfunction draw() {\r\n background(0); // set background color to black\r\n if (car.isControlled) {\r\n translate(-car.x + width / 2, -car.y + height / 2); // Make camera follow the car\r\n document.getElementById('carControlsInfo').style.display = 'block'; // Show car controls info\r\n } else {\r\n translate(-player.x + width / 2, -player.y + height / 2); // Make camera follow the player\r\n document.getElementById('carControlsInfo').style.display = 'none'; // Hide car controls info\r\n } background(bgImg); // Set the background to the loaded image\r\n textSize(16 * 3); // Scale text size\r\n\r\n image(townBg, 0, 0, width, height);\r\n car.display();\r\n\r\n if (!car.isControlled) { // Only allow the player to move if they are not controlling the car\r\n player.move();\r\n player.display();\r\n\r\n }\r\n else {\r\n car.move()\r\n }\r\n if (dist(player.x, player.y, car.x, car.y) < 50 && !car.isControlled) {\r\n fill(255);\r\n text(\"Press Space to Die\", car.x, car.y - 10);\r\n if (keyIsDown(32)) { // If the spacebar is pressed\r\n car.isControlled = true; // The car is now under player control\r\n }\r\n }\r\n for (let house of houses) {\r\n house.display();\r\n }\r\n\r\n easterEgg.display();\r\n npc2.display(); // Display the second NPC\r\n if (dist(player.x, player.y, npc2.x, npc2.y) < 50) {\r\n fill(255);\r\n text(\"Press * to Take\", npc2.x, npc2.y - 10);\r\n if (keyIsDown(32)) {\r\n document.getElementById('npcText').src = \"https://www.jippity.pro/683\";\r\n modal.style.display = \"block\";\r\n modal.style.left = npc2.x + 'px';\r\n modal.style.top = npc2.y + 'px';\r\n }\r\n }\r\n npc.display(); // Display the NPC\r\n if (dist(player.x, player.y, npc.x, npc.y) < 50) {\r\n fill(255);\r\n text(\"Press $ to Tkel\", npc.x, npc.y - 10);\r\n if (keyIsDown(32)) {\r\n document.getElementById('npcText').src = \"https://bouefrgtfhujkhygfdg.anio\";\r\n modal.style.display = \"block\";\r\n modal.style.left = npc.x + 'px';\r\n modal.style.top = npc.y + 'px';\r\n }\r\n }\r\n\r\n for (let house of houses) {\r\n house.display();\r\n\r\n if (dist(player.x, player.y, house.x + house.width / 2, house.y + house.height / 2) < 50) {\r\n fill(255);\r\n text(\"Press Space to Enter\", house.x, house.y - 10);\r\n\r\n\r\n if (keyIsDown(32)) {\r\n window.location.href = house.link;\r\n }\r\n\r\n\r\n }\r\n }\r\n\r\n}\r\n\r\n// Event listener for keydown event\r\ndocument.addEventListener('keydown', function (event) {\r\n if (event.keyCode === 27) { // 27 is the keycode for the ESC key\r\n modal.style.display = \"none\";\r\n }\r\n});\r\nfunction keyPressed() {\r\n if (car.isControlled && (keyCode === ESCAPE || keyCode === 69)) { // Check if the car is controlled and either Escape or E is pressed\r\n car.isControlled = false; // Return control to the player\r\n\r\n // Calculate the player's position when exiting the car\r\n // Assuming the player should appear to the right of the car when they exit\r\n player.x = car.x + cos(car.angle + HALF_PI) * 30;\r\n player.y = car.y + sin(car.angle + 5) * 30;\r\n }\r\n}","style.css":"","index.html":"\n\n\n\n \n \n Circular Adventure Quest\n \n \n\nmeow\n\n

Car Controls: Use WASD or Arrow Keys to move, E or esc to exit\n

\n \n\n\n\n\n"},"chat_history":[],"assets":[],"messages_sent":0,"comments":[],"steps":[]}