Googly Search & Play

{"name":"Googly Search & Play","description":"Search the web with a twist and play fun games! The Googly Search & Play app lets you search for anything, and the results are displayed with wobbly, googly eyes sourced from Wikipedia. Plus, enjoy simple and entertaining mini-games while you search!","photo":null,"view_count":7,"fork_count":0,"expires_at":null,"created_at":"2024-03-19T17:35:28.448357Z","updated_at":"2024-03-19T17:35:28.448358Z","user_id":30,"status":"PRIVATE","parent_id":null,"id":867,"user":{"photo":null,"email":null,"recess_id":"4547bd3e-5943-d964-5c1f-924c476c0ad3","created_at":"2023-12-22T02:12:08.598364Z","reset_token":null,"stripe_customer_id":null,"seats":null,"username":"elsiethejippitypro","id":30,"password_hash":null,"updated_at":"2023-12-22T02:12:08.598367Z","reset_token_expiry":null,"subscription_status":null},"code":{"script.js":"function setup() {\n createCanvas(400, 400);\n background(220);\n}","style.css":"","index.html":"\n\n\n\n \n \n Googly Search & Play\n \n\n\n\n \n \n

\n \n \n\n\n"},"chat_history":[{"deleted":0,"code_id":53999,"input_tokens":null,"id":29908,"project_id":867,"sender":"human","message":"Let's get started!","created_at":"2024-03-19T17:35:54.050830Z","output_tokens":null},{"deleted":0,"code_id":53999,"input_tokens":null,"id":29909,"project_id":867,"sender":"ai","message":"```javascript\nasync function fetchSearchResults(query) {\n const response = await fetch(`https://en.wikipedia.org/w/api.php?action=query&list=search&srsearch=${query}&format=json&origin=*`);\n const data = await response.json();\n return data.query.search;\n}\n```\n- This function makes an asynchronous call to Wikipedia's API to fetch search results based on the user's query.\n- It uses the `fetch` API to make a GET request to Wikipedia, passing the search `query` as a parameter.\n- The function then waits for the response, parses it as JSON, and returns the `search` array from the query results.\n\n```javascript\nfunction displaySearchResults(results) {\n const resultsContainer = document.getElementById('searchResults');\n resultsContainer.innerHTML = ''; // Clear existing results\n results.forEach(result => {\n const resultElement = document.createElement('div');\n resultElement.innerHTML = `

${result.title}

${result.snippet}

`;\n resultsContainer.appendChild(resultElement);\n addGooglyEyes(resultElement);\n });\n}\n```\n- This function takes an array of search results and displays them in the `searchResults` div.\n- It first clears any existing content in the `searchResults` div.\n- For each result, it creates a new `div` element, sets its inner HTML to include the title and snippet of the result, and appends it to the `searchResults` div.\n- It also calls `addGooglyEyes` function for each result element to add animated googly eyes.\n\n```javascript\nfunction addGooglyEyes(element) {\n // Placeholder for googly eyes adding logic\n}\n```\n- This is a placeholder function where the logic for adding animated googly eyes to each search result will be implemented.","created_at":"2024-03-19T17:35:54.095435Z","output_tokens":null}],"assets":[],"messages_sent":1,"comments":[],"steps":[{"step_number":0,"complete":false,"updated_at":"2024-03-19T17:35:28.466371","id":4520,"title":"Animated Googly Eyes","instruction":"Display search results with animated googly eyes sourced from Wikipedia for a fun and entertaining experience.","created_at":"2024-03-19T17:35:28.466368","project_id":867},{"step_number":1,"complete":false,"updated_at":"2024-03-19T17:35:28.466483","id":4521,"title":"Search Input Field","instruction":"Implement a search input field for users to input their search queries.","created_at":"2024-03-19T17:35:28.466481","project_id":867},{"step_number":2,"complete":false,"updated_at":"2024-03-19T17:35:28.466698","id":4522,"title":"Search Results Display","instruction":"Display search results based on user input with animated googly eyes sourced from Wikipedia.","created_at":"2024-03-19T17:35:28.466694","project_id":867},{"step_number":3,"complete":false,"updated_at":"2024-03-19T17:35:28.466800","id":4523,"title":"Data Fetching from Wikipedia API","instruction":"Fetch search results from Wikipedia API for display with animated googly eyes.","created_at":"2024-03-19T17:35:28.466799","project_id":867},{"step_number":4,"complete":false,"updated_at":"2024-03-19T17:35:28.466876","id":4524,"title":"Simple Search Algorithm","instruction":"Implement a simple search algorithm to match user input with the search results fetched from Wikipedia.","created_at":"2024-03-19T17:35:28.466875","project_id":867},{"step_number":5,"complete":false,"updated_at":"2024-03-19T17:35:28.466959","id":4525,"title":"User Interface Design","instruction":"Create a visually appealing and user-friendly interface for the search engine.","created_at":"2024-03-19T17:35:28.466958","project_id":867},{"step_number":6,"complete":false,"updated_at":"2024-03-19T17:35:28.467032","id":4526,"title":"Responsive Design","instruction":"Ensure the web app is responsive and works well on different devices and screen sizes.","created_at":"2024-03-19T17:35:28.467031","project_id":867},{"step_number":7,"complete":false,"updated_at":"2024-03-19T17:35:28.467110","id":4527,"title":"Mini-Games Section","instruction":"Add a section for simple and fun mini-games for users to enjoy while using the search engine.","created_at":"2024-03-19T17:35:28.467109","project_id":867}]}