Catch the Clicking Ball

{"name":"Catch the Clicking Ball","description":"Click at the right time to catch the clicking ball and score points! Be careful not to miss, or the game ends!","photo":null,"view_count":2,"fork_count":0,"expires_at":null,"created_at":"2024-04-12T18:09:18.081319Z","updated_at":"2024-04-12T18:09:18.081323Z","user_id":5,"status":"PUBLIC","parent_id":1142,"id":1148,"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 score = 0; // Initialize score variable\nlet hearts = 3; //hera\nlet ball = {\n x: 200,\n y: 200,\n size: 50,\n color: [255, 0, 0],\n velocityY: 12 // Adding a vertical velocity\n};\nlet ball2 = {\n x: 200,\n y: 200,\n size: 50,\n color: [255, 0, 0],\n velocityY: -12 // Adding a vertical velocity\n};\nfunction setup(/*/*/) {\n createCanvas(400, 400);\n background(220);\n}\n\n//function draw() {\nfunction draw() {\n background(220);\n fill(ball2.color);\n circle(ball2.x, ball2.y, ball2.size);\n fill(ball.color);\n circle(ball.x, ball.y, ball.size);\n\n ball.y += ball.velocityY;\n ball2.y += ball2.velocityY;\n\n if (ball.y <= ball.size / 2 || ball.y >= height - ball.size / 2) {\n ball.velocityY *= -1;\n }\n if (ball2.y <= ball2.size / 2 || ball2.y >= height - ball2.size / 2) {\n ball2.velocityY *= -1;\n }\n\n // Display the score\n fill(0); // Black color for text\n textSize(24);\n text(`Score: ${score}`, 10, 30); // Display score at the top left\n\n // Display lives\n text(`Lives: ${hearts}`, 10, 60); // Display lives below the score\n}\nfunction endGame() {\n noLoop(); // Stop the draw loop\n document.getElementById('gameOver').style.display = 'block'; // Show the game over div\n document.getElementById('finalScore').innerText = `Final Score: ${score}`; // Display final score\n document.querySelector('canvas').style.display = 'none'; // Hide the canvas\n}\n\nfunction mousePressed() {\n let middleTolerance = 20;\n let middleY = height / 2;\n let ballNearMiddle = false;\n\n if (ball.y >= middleY - middleTolerance && ball.y <= middleY + middleTolerance) {\n ball.color = [0, 255, 0];\n\n ballNearMiddle = true;\n setTimeout(() => {\n ball.color = [255, 0, 0];\n }, 200);\n }\n\n if (ball2.y >= middleY - middleTolerance && ball2.y <= middleY + middleTolerance) {\n ball2.color = [0, 255, 0];\n score++;\n ballNearMiddle = true;\n setTimeout(() => {\n ball2.color = [255, 0, 0];\n }, 200);\n }\n\n if (!ballNearMiddle) {\n if (hearts === 1) {\n endGame(); // Call endGame instead of setting hearts to 0 and calling noLoop directly\n } else {\n hearts--;\n }\n }\n}","style.css":"","index.html":"\n\n\n\n \n \n \n \n \n Catch the Clicking Ball\n\n\n

Difficulty: Incredible

\n\n\n \n\n\n"},"chat_history":[],"assets":[],"messages_sent":0,"comments":[],"steps":[{"instruction":"When the player scores a point, display visual feedback such as a brief animation or color change.","title":"Visual Feedback for Scoring","created_at":"2024-04-12T17:16:23.078638","project_id":1148,"complete":false,"step_number":0,"updated_at":"2024-04-12T18:09:18.086884","id":5934},{"instruction":"When the player misses the click, provide visual feedback to indicate the miss, such as a brief shake animation or color change.","title":"Visual Feedback for Missing","created_at":"2024-04-12T17:16:23.078785","project_id":1148,"complete":false,"step_number":1,"updated_at":"2024-04-12T18:09:18.087016","id":5935},{"instruction":"Include sound effects for scoring, missing, and game over to enhance the gaming experience.","title":"Sound Effects","created_at":"2024-04-12T17:16:23.078854","project_id":1148,"complete":false,"step_number":2,"updated_at":"2024-04-12T18:09:18.087098","id":5936},{"instruction":"Display a game over screen with the final score when the game ends, allowing the player to see their performance.","title":"Game Over Screen","created_at":"2024-04-12T17:16:23.078920","project_id":1148,"complete":false,"step_number":3,"updated_at":"2024-04-12T18:09:18.087179","id":5937},{"instruction":"Implement a responsive clicking mechanism that accurately detects clicks on the green patch and provides timely feedback.","title":"Responsive Clicking Mechanism","created_at":"2024-04-12T17:16:23.078990","project_id":1148,"complete":false,"step_number":4,"updated_at":"2024-04-12T18:09:18.087254","id":5938},{"instruction":"Implement a scoring system to keep track of the player's points and update the score when the player successfully catches the clicking ball.","title":"Scoring System","created_at":"2024-04-12T17:16:23.079064","project_id":1148,"complete":false,"step_number":5,"updated_at":"2024-04-12T18:09:18.087334","id":5939},{"instruction":"Create a game loop to manage the movement of the red ball, user interactions, and updating the game state.","title":"Game Loop","created_at":"2024-04-12T17:16:23.079137","project_id":1148,"complete":false,"step_number":6,"updated_at":"2024-04-12T18:09:18.087412","id":5940},{"instruction":"Include brief instructions for the players to understand the objective and how to play the game.","title":"User Instructions","created_at":"2024-04-12T17:16:23.079210","project_id":1148,"complete":false,"step_number":7,"updated_at":"2024-04-12T18:09:18.087493","id":5941},{"instruction":"Implement a pause and resume feature to allow players to take breaks during the game.","title":"Pause and Resume","created_at":"2024-04-12T17:16:23.079293","project_id":1148,"complete":false,"step_number":8,"updated_at":"2024-04-12T18:09:18.087569","id":5942}]}