Emoji Adventure

{"name":"Intro to Jippity - Advanced Conditionals","description":"Day 6 of the Introduction to Programming With Jippity course. \n\nTopic: Advanced Conditionals","photo":"https://res.cloudinary.com/dzv7hjwfn/image/upload/a11hexheur1a5fvpdz5b","view_count":1,"fork_count":0,"expires_at":null,"created_at":"2025-02-26T16:32:30.339946Z","updated_at":"2025-02-26T16:32:30.339950Z","user_id":246,"status":"PRIVATE","parent_id":5899,"id":5901,"user":{"photo":null,"email":"kristen@recess.gg","recess_id":"c4ad84f6-113d-480b-bc29-80549518b3ee","created_at":"2024-10-31T20:27:47.342142Z","reset_token":null,"stripe_customer_id":null,"seats":null,"username":"chicothedog","id":246,"password_hash":"$2b$12$QgZsBBZ/7CFyOhVkfVhTNeoe4jAY.pIJOieTXeg0HWS23ZcCpiAeO","updated_at":"2024-10-31T20:27:47.342148Z","reset_token_expiry":null,"subscription_status":null},"code":{"script.js":"/*\n----------------------------------------------------------------------------------------------------------------------------\n\n\n _____ _ _ _____ _ \n |_ _| | | | | | __ \\ (_) \n | | _ __ | |_ _ __ ___ | |_ ___ | |__) | __ ___ __ _ _ __ __ _ _ __ ___ _ __ ___ _ _ __ __ _ \n | | | '_ \\| __| '__/ _ \\ | __/ _ \\ | ___/ '__/ _ \\ / _` | '__/ _` | '_ ` _ \\| '_ ` _ \\| | '_ \\ / _` |\n _| |_| | | | |_| | | (_) | | || (_) | | | | | | (_) | (_| | | | (_| | | | | | | | | | | | | | | | (_| |\n |_____|_| |_|\\__|_| \\___/ \\__\\___/ |_| |_| \\___/ \\__, |_| \\__,_|_| |_| |_|_| |_| |_|_|_| |_|\\__, |\n __/ | __/ |\n |___/ |___/ \n\n __ ___ _ _ _ _ _ _ _____ __ \n \\ \\ / (_) | | | | (_) (_) | | __ \\ / / \n \\ \\ /\\ / / _| |_| |__ | |_ _ __ _ __ _| |_ _ _ ______ | | | | __ _ _ _ / /_ \n \\ \\/ \\/ / | | __| '_ \\ _ | | | '_ \\| '_ \\| | __| | | | |______| | | | |/ _` | | | | | '_ \\ \n \\ /\\ / | | |_| | | | | |__| | | |_) | |_) | | |_| |_| | | |__| | (_| | |_| | | (_) |\n \\/ \\/ |_|\\__|_| |_| \\____/|_| .__/| .__/|_|\\__|\\__, | |_____/ \\__,_|\\__, | \\___/ \n | | | | __/ | __/ | \n |_| |_| |___/ |___/ \n\n\n\n----------------------------------------------------------------------------------------------------------------------------\n\n\n _______ _ _ _ _____ _ _ _ _ _ \n |__ __| (_) _ /\\ | | | | / ____| | (_) | (_) | | \n | | ___ _ __ _ ___(_) / \\ __| |_ ____ _ _ __ ___ ___ __| | | | ___ _ __ __| |_| |_ _ ___ _ __ __ _| |___ \n | |/ _ \\| '_ \\| |/ __| / /\\ \\ / _` \\ \\ / / _` | '_ \\ / __/ _ \\/ _` | | | / _ \\| '_ \\ / _` | | __| |/ _ \\| '_ \\ / _` | / __|\n | | (_) | |_) | | (__ _ / ____ \\ (_| |\\ V / (_| | | | | (_| __/ (_| | | |___| (_) | | | | (_| | | |_| | (_) | | | | (_| | \\__ \\\n |_|\\___/| .__/|_|\\___(_) /_/ \\_\\__,_| \\_/ \\__,_|_| |_|\\___\\___|\\__,_| \\_____\\___/|_| |_|\\__,_|_|\\__|_|\\___/|_| |_|\\__,_|_|___/\n | | \n |_| \n\n\n----------------------------------------------------------------------------------------------------------------------------\n*/\n\n\n\n\nlet characterX;\n\nlet characterY;\n\nlet stamina = 120;\n\nlet staminaRegenRate = 0.2;\n\nlet spriteFrames = [];\n\nlet frameWidth;\n\nlet frameHeight;\n\nlet totalFrames = 4;\n\nlet currentFrame = 0;\n\nlet frameCounter = 0;\n\nlet characterScaleFactor = 6;\n\nlet characterVelocityY = 0;\n\nlet currentState = 'idle';\n\nlet idleFrames = [];\n\nconst spriteUpdateInterval = 8;\n\nlet idleFrameCounter = 0;\n\nconst idleSpriteUpdateInterval = 60;\n\nlet currentIdleFrame = 0;\n\nlet punchFrames = [];\n\nconst punchUpdateInterval = 10;\n\nlet punchFrameCounter = 0;\n\nlet currentPunchFrame = 0;\n\nlet backwardFrames = [];\n\nlet totalBackwardFrames = 4;\n\nlet currentBackwardFrame = 0;\n\nlet backwardFrameCounter = 0;\n\nfunction preload() {\n sprite = loadImage(\"@asset('sprite')\");\n spritePunch = loadImage(\"@asset('spritePunch')\");\n spriteIdle = loadImage(\"@asset('spriteIdle')\");\n michaelSprite = loadImage(\"@asset('Michael')\"); // Load the Michael sprite sheet\n}\n\nfunction setup() {\n createCanvas(windowWidth, windowHeight);\n background(135, 206, 235); // Sky blue background\n noSmooth(); // Disable image smoothing\n\n // Load walking frames\n frameWidth = sprite.width / 3; // Width of each sprite frame\n frameHeight = sprite.height / 4; // Height of each sprite frame\n for (let i = 0; i < totalFrames; i++) {\n let frame = sprite.get(i * frameWidth, 0, frameWidth, frameHeight);\n spriteFrames.push(frame); // Store the frames\n }\n\n // Load backward frames from Michael sprite\n for (let i = 0; i < totalBackwardFrames; i++) {\n let frame = michaelSprite.get(i * frameWidth, 0, frameWidth, frameHeight); // Extract backward frames\n backwardFrames.push(frame); // Store backward frames\n }\n\n // Load idle frames and punch frames (unchanged)\n // ...\n}\n\nfunction draw() {\n background(135, 206, 235); // Clear the canvas with the sky blue background\n\n frameCounter++; // Increment the frame counter each frame\n\n drawFloor(); // Call the movement function\n\n drawCharacter(); // Call the movement function\n\n animateCharacter(); // Call the movement function\n\n handleCharacterMovement(); // Call the movement function\n\n}\n\nfunction drawFloor() {\n fill(169, 169, 169); // Set the floor color to dark grey\n rect(0, height - 20, windowWidth, 20); // Draw the floor across the bottom\n}\n\nfunction animateCharacter() {\n // Animate the punch state\n if (currentState === 'punching') {\n punchFrameCounter++; // Increment the punch frame counter\n if (punchFrameCounter >= punchUpdateInterval) { // Check against the punch interval\n currentPunchFrame = (currentPunchFrame + 1) % punchFrames.length; // Loop through punch frames\n punchFrameCounter = 0; // Reset punch frame counter\n\n // If the last frame has been displayed, switch back to idle or walking\n if (currentPunchFrame === 0) {\n currentState = 'idle'; // Return to idle after punch\n }\n }\n }\n\n // Update the current frame for animation only if the character is moving\n if ((keyIsDown(68) || keyIsDown(65)) && frameCounter >= spriteUpdateInterval) { // 'D' or 'A' key\n currentFrame = (currentFrame + 1) % spriteFrames.length; // Loop through walking frames\n frameCounter = 0; // Reset the frame counter after updating\n currentState = 'walking'; // Update state to walking\n } else if (!keyIsDown(68) && !keyIsDown(65)) { // Neither 'D' nor 'A' key\n currentState = 'idle'; // Update state to idle\n // Animate the idle state\n idleFrameCounter++; // Increment the idle frame counter\n if (idleFrameCounter >= idleSpriteUpdateInterval) { // Check against the idle interval\n currentIdleFrame = (currentIdleFrame + 1) % idleFrames.length; // Loop through idle frames\n idleFrameCounter = 0; // Reset idle frame counter\n }\n }\n}\n\nfunction idle() {\n // Ensure currentIdleFrame is valid for idle\n if (currentIdleFrame < 0 || currentIdleFrame >= idleFrames.length) {\n console.error('Invalid currentIdleFrame for idle:', currentIdleFrame);\n currentIdleFrame = 0; // Reset to 0 if invalid\n }\n image(idleFrames[currentIdleFrame], characterX - (idleFrames[0].width * characterScaleFactor) / 2, characterY, idleFrames[0].width * characterScaleFactor, idleFrames[0].height * characterScaleFactor);\n}\n\nfunction punch() {\n // Ensure currentPunchFrame is valid\n if (currentPunchFrame < 0 || currentPunchFrame >= punchFrames.length) {\n console.error('Invalid currentPunchFrame for punching:', currentPunchFrame);\n currentPunchFrame = 0; // Reset to 0 if invalid\n }\n\n // Calculate Y position to ensure character is above the floor\n let floorY = height - 20; // Floor position\n let punchHeight = punchFrames[0].height * characterScaleFactor; // Height of the punch sprite\n\n // Draw the punching sprite at a balanced position above the floor\n image(punchFrames[currentPunchFrame], characterX - (punchFrames[0].width * characterScaleFactor) / 2, floorY - (punchHeight * 0.7) - 10, punchFrames[0].width * characterScaleFactor, punchHeight);\n}\n\nfunction walk() {\n // Ensure currentFrame is valid\n if (currentFrame < 0 || currentFrame >= spriteFrames.length) {\n console.error('Invalid currentFrame for walking:', currentFrame);\n currentFrame = 0; // Reset to 0 if invalid\n }\n\n // Draw the character normally, without flipping horizontally\n image(spriteFrames[currentFrame], characterX - (frameWidth * characterScaleFactor) / 2, characterY, frameWidth * characterScaleFactor, frameHeight * characterScaleFactor);\n}\n\nfunction drawCharacter() {\n switch (currentState) {\n case 'walking':\n walk();\n break;\n case 'walkingBackward': // New case for backward movement\n drawBackward();\n break;\n case 'idle':\n idle();\n break;\n case 'punching':\n punch();\n break;\n }\n}\n\nfunction drawBackward() {\n // Ensure currentBackwardFrame is valid\n if (currentBackwardFrame < 0 || currentBackwardFrame >= backwardFrames.length) {\n console.error('Invalid currentBackwardFrame for walking backward:', currentBackwardFrame);\n currentBackwardFrame = 0; // Reset to 0 if invalid\n }\n image(backwardFrames[currentBackwardFrame], characterX - (frameWidth * characterScaleFactor) / 2, characterY, frameWidth * characterScaleFactor, frameHeight * characterScaleFactor);\n\n // Update the frame counter for backward animation\n backwardFrameCounter++;\n if (backwardFrameCounter >= spriteUpdateInterval) {\n currentBackwardFrame = (currentBackwardFrame + 1) % backwardFrames.length; // Loop through backward frames\n backwardFrameCounter = 0; // Reset the frame counter\n }\n}\n\nfunction handleCharacterMovement() {\n let floorY = height - 20 - (frameHeight * characterScaleFactor);\n\n // Horizontal movement logic\n if (keyIsDown(68) || keyIsDown(RIGHT_ARROW)) { // 'D' key or Right Arrow key for moving right\n characterX += 5; // Move right\n currentState = 'walking'; // Set state to walking\n }\n\n if (keyIsDown(65) || keyIsDown(LEFT_ARROW)) { // 'A' key or Left Arrow key for moving left\n if (characterX > (frameWidth * characterScaleFactor) / 2) { // Check if not at the left wall\n characterX -= 5; // Move left\n currentState = 'walkingBackward'; // Set state to walking backward\n }\n }\n\n // Punching logic (unchanged)\n // ...\n\n // Jumping logic (unchanged)\n // ...\n}\n\n","style.css":"body { margin: 0; } canvas { display: block; }","index.html":"\n\n\n \n \n Emoji Adventure\n \n \n\n\n \n\n"},"chat_history":[{"message":"","project_id":5901,"created_at":"2025-02-26T16:32:42.192233Z","output_tokens":null,"code_id":213592,"sender":"client_script","deleted":0,"input_tokens":null,"id":112798}],"assets":[{"creator":null,"project_id":5901,"cloudinary_id":"dxnlvxgwqk1ikspw97g7","deleted":false,"id":59898,"name":"spritePunch","created_at":"2025-02-26T16:32:30.371599Z","resource_type":"image","tags":null},{"creator":null,"project_id":5901,"cloudinary_id":"sbgcztvyzjacm2i7n0tw","deleted":false,"id":59897,"name":"spriteIdle","created_at":"2025-02-26T16:32:30.366171Z","resource_type":"image","tags":null},{"creator":null,"project_id":5901,"cloudinary_id":"a11hexheur1a5fvpdz5b","deleted":false,"id":59896,"name":"sprite","created_at":"2025-02-26T16:32:30.364055Z","resource_type":"image","tags":null},{"creator":null,"project_id":5901,"cloudinary_id":"dsn2uszud1wc2g8d9yjf","deleted":false,"id":59895,"name":"Michael","created_at":"2025-02-26T16:32:30.346146Z","resource_type":"image","tags":null}],"messages_sent":0,"comments":[],"steps":[]}