Emoji Adventure

{"name":"How to Get the Most out of Jippity's AI","description":"","photo":"","view_count":1,"fork_count":0,"expires_at":null,"created_at":"2024-10-22T18:23:50.961254Z","updated_at":"2024-10-22T18:24:25.338140Z","user_id":60,"status":"PRIVATE","parent_id":null,"id":3928,"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":{"script.js":"// Global variable to store the turtle's position\nlet turtleX, turtleY;\n\n// Global array to store rock positions\nlet rocks = [];\n\nfunction setup() {\n createCanvas(windowWidth, windowHeight);\n background(200);\n\n // Initialize the turtle's position at the center of the canvas\n turtleX = width / 2;\n turtleY = height / 2;\n\n // Generate random positions for rocks\n for (let i = 0; i < 10; i++) { // Create 10 rocks\n let rockX = random(width);\n let rockY = random(height);\n rocks.push({ x: rockX, y: rockY });\n }\n}\n\nfunction draw() {\n background(120, 220, 250); // Set the background color to blue\n\n // Draw rocks\n drawRocks();\n\n // Display the turtle emoji at the current position\n textSize(64); // Set the size for the emoji\n text('🐢', turtleX, turtleY);\n}\n\nfunction keyPressed() {\n // Move the turtle based on the key pressed\n if (key === 'w' || key === 'W') {\n turtleY -= 10; // Move up\n } else if (key === 's' || key === 'S') {\n turtleY += 10; // Move down\n } else if (key === 'a' || key === 'A') {\n turtleX -= 10; // Move left\n } else if (key === 'd' || key === 'D') {\n turtleX += 10; // Move right\n }\n}\n\nfunction drawRocks() {\n textSize(32); // Set the size for the rock emoji\n for (let rock of rocks) {\n text('🪨', rock.x, rock.y); // Draw rock emoji at each position\n }\n}\n\n","style.css":"body { margin: 0; font-family: Arial, sans-serif; background-color: #f0f0f0; display: flex; justify-content: center; align-items: center; height: 100vh; }\ncanvas { display: block; }","index.html":"\n\n\n \n \n Emoji Adventure\n \n \n \n\n\n\n"},"chat_history":[{"deleted":0,"code_id":168754,"input_tokens":null,"id":82805,"project_id":3928,"sender":"human","message":"draw some rocks around the screen","created_at":"2024-10-23T13:30:31.616539Z","output_tokens":null},{"deleted":0,"code_id":168754,"input_tokens":null,"id":82806,"project_id":3928,"sender":"ai","message":"To draw some rocks around the screen, we can add a few randomly placed emojis that represent rocks. Let's add this feature to your project.\n\nFirst, we'll create a function to draw the rocks and call it in the `setup` function so that the rocks are drawn once when the program starts.\n\nHere’s how you can add that feature:\n\n```javascript\n// Global array to store rock positions\nlet rocks = [];\n```\n\n```javascript\nfunction setup() {\n createCanvas(windowWidth, windowHeight);\n background(200);\n\n // Initialize the turtle's position at the center of the canvas\n turtleX = width / 2;\n turtleY = height / 2;\n\n // Generate random positions for rocks\n for (let i = 0; i < 10; i++) { // Create 10 rocks\n let rockX = random(width);\n let rockY = random(height);\n rocks.push({ x: rockX, y: rockY });\n }\n}\n```\n\n```javascript\nfunction draw() {\n background(120, 220, 250); // Set the background color to blue\n\n // Draw rocks\n drawRocks();\n\n // Display the turtle emoji at the current position\n textSize(64); // Set the size for the emoji\n text('🐢', turtleX, turtleY);\n}\n```\n\n```javascript\nfunction drawRocks() {\n textSize(32); // Set the size for the rock emoji\n for (let rock of rocks) {\n text('🪨', rock.x, rock.y); // Draw rock emoji at each position\n }\n}\n```\n\n### Explanation\n- **Rocks Array**: We created a global array `rocks` to store the positions of the rocks.\n- **Setup Function**: We generate random positions for the rocks and store them in the `rocks` array. This happens once when the program starts.\n- **Draw Function**: We added a call to `drawRocks()` to draw the rocks on the screen each frame.\n- **DrawRocks Function**: This function iterates over each rock position in the `rocks` array and draws a rock emoji at that position.\n\nMake these changes to your code, and you'll see rocks appearing randomly around your screen.","created_at":"2024-10-23T13:30:31.632223Z","output_tokens":null}],"assets":[],"messages_sent":7,"comments":[],"steps":[]}