Emoji Space Adventure

{"name":"Coin Catcher","description":"Catch The Coins In The Red Circle!","photo":"https://res.cloudinary.com/dzv7hjwfn/image/upload/useojsudad4dwru7bgqb","view_count":2,"fork_count":4,"expires_at":null,"created_at":"2025-06-03T19:29:10.258677Z","updated_at":"2025-06-03T19:29:10.258678Z","user_id":372,"status":"PRIVATE","parent_id":8010,"id":8018,"user":{"username":"bennyvalles","id":372,"password_hash":"$2b$12$uOENMkgKjRwvJDLR0bZ35OGRG2Hj3WANl5uWsLuiHKVEP1MDJs2TC","updated_at":"2025-03-04T00:06:18.668928Z","reset_token_expiry":null,"subscription_status":null,"photo":null,"email":"benjamin.valles@alpha.school","recess_id":null,"created_at":"2025-03-04T00:06:18.668924Z","reset_token":null,"stripe_customer_id":null,"seats":0},"code":{"script.js":"const URL = \"https://teachablemachine.withgoogle.com/models/aRp1tpQ9Y/\";\n\nlet currentPrediction = \"\";\n\nlet currentConfidence = 0;\n\nlet coinPositions = [];\n\nlet countdown = [];\n\nlet countdownActive = false;\n\nlet countdownTimer = 0;\n\nfunction setup() {\n createCanvas(windowWidth, windowHeight);\n background(135, 206, 235); // Sky blue background\n\n // Start spawning coins\n setInterval(spawnCoin, 1000); // Spawn a coin every second\n}\n\nfunction draw() {\n background(135, 206, 235); // Sky blue background\n\n console.log(currentPrediction);\n displayPrediction(); // Call the function to display the prediction\n drawCoins(); // Draw the coins\n drawMovingCircle(); // Draw the moving circle\n\n // If countdown is active, display it\n if (countdownActive) {\n fill(255); // White color for text\n textSize(64); // Large text size\n textAlign(CENTER, CENTER); // Center the text\n text(countdown.join(' '), width / 2, height / 2); // Display countdown in the center\n countdownTimer--; // Decrease the countdown timer\n\n // Reset countdown when finished\n if (countdownTimer <= 0) {\n countdownActive = false;\n countdown = []; // Clear countdown\n }\n }\n}\n\nasync function createModel() {\n const checkpointURL = URL + \"model.json\"; // model topology\n const metadataURL = URL + \"metadata.json\"; // model metadata\n\n const recognizer = speechCommands.create(\n \"BROWSER_FFT\", // Fourier transform type, not useful to change\n undefined, // Speech commands vocabulary feature, not useful for your models\n checkpointURL,\n metadataURL);\n\n // Check that model and metadata are loaded via HTTPS requests.\n await recognizer.ensureModelLoaded();\n\n return recognizer;\n}\n\ninit();\n\nasync function init() {\n const recognizer = await createModel();\n const classLabels = recognizer.wordLabels(); // Get class labels\n\n recognizer.listen(result => {\n const scores = result.scores; // Probability of prediction for each class\n const maxScoreIndex = scores.indexOf(Math.max(...scores));\n currentPrediction = classLabels[maxScoreIndex];\n currentConfidence = scores[maxScoreIndex];\n }, {\n includeSpectrogram: true,\n probabilityThreshold: 0.5, // Lowered from 0.75 to 0.5 for testing\n invokeCallbackOnNoiseAndUnknown: true,\n overlapFactor: 0.75 // Increased to make predictions more frequently\n });\n}\n\nfunction displayPrediction() {\n fill(0); // Set text color to black\n textSize(32); // Set text size\n textAlign(CENTER, CENTER); // Center the text\n text(currentPrediction, width / 2, height / 4); // Draw the prediction higher on the canvas\n}\n\nfunction drawMovingCircle() {\n noFill(); // Make sure the circle is not filled\n stroke(255, 0, 0); // Red color for the circle outline\n ellipse(width / 2, height / 2, 30, 30); // Draw the circle at the center of the canvas\n}\n\nfunction spawnCoin() {\n // Check if there are already 7 coins on the screen\n if (coinPositions.length >= 7) {\n return; // Exit the function if the limit is reached\n }\n\n let newCoinX, newCoinY;\n\n const edge = floor(random(4)); // Random number between 0 and 3\n\n switch (edge) {\n case 0: // Top edge\n newCoinX = random(width); // Random X position along the top\n newCoinY = 0; // Y position at the top\n break;\n case 1: // Bottom edge\n newCoinX = random(width); // Random X position along the bottom\n newCoinY = height; // Y position at the bottom\n break;\n case 2: // Left edge\n newCoinX = 0; // X position at the left\n newCoinY = random(height); // Random Y position along the left\n break;\n case 3: // Right edge\n newCoinX = width; // X position at the right\n newCoinY = random(height); // Random Y position along the right\n break;\n }\n\n coinPositions.push({ x: newCoinX, y: newCoinY }); // Add new coin to the array\n console.log(\"Coin spawned\");\n}\n\nfunction startCountdown() {\n countdown = ['1', '2', '3', 'CATCH!']; // Set the countdown sequence\n countdownActive = true; // Activate countdown\n countdownTimer = 60; // Set countdown timer (60 frames = 1 second)\n}\n\nfunction drawCoins() {\n fill(0); // Set color to black for coins\n for (let i = coinPositions.length - 1; i >= 0; i--) {\n let coin = coinPositions[i];\n\n // Move coin towards the center of the canvas\n let targetX = width / 2;\n let targetY = height / 2;\n\n // Calculate direction vector towards the center\n let dx = targetX - coin.x;\n let dy = targetY - coin.y;\n let distance = dist(coin.x, coin.y, targetX, targetY);\n\n // Normalize the direction vector\n if (distance > 0) {\n coin.x += (dx / distance) * 2; // Move towards center\n coin.y += (dy / distance) * 2; // Move towards center\n }\n\n // Log the current prediction and positions for debugging\n console.log(`Current Prediction: ${currentPrediction}, Coin Position: (${coin.x}, ${coin.y})`);\n\n // Check if the current prediction is \"catch coin\" and the coin is within the circle\n let distanceToCircle = dist(coin.x, coin.y, width / 2, height / 2);\n if (currentPrediction.toLowerCase() === \"catch coin\" && distanceToCircle < 15) { // Using radius of the circle\n coinPositions.splice(i, 1); // Remove the coin from the array\n startCountdown(); // Start countdown when a coin is caught\n continue; // Skip drawing the coin\n }\n\n // Start countdown if the coin is close to the circle\n if (distanceToCircle < 50 && !countdownActive) {\n startCountdown();\n }\n\n // Draw the coin with a smaller size\n ellipse(coin.x, coin.y, 15, 15); // Draw the coin with reduced size (15x15)\n\n // If the coin moves off the left side of the screen, remove it\n if (coin.x < -20 || coin.x > width + 20 || coin.y < -20 || coin.y > height + 20) {\n coinPositions.splice(i, 1); // Remove the coin from the array\n }\n }\n}\n\n","style.css":"body { margin: 0; } canvas { display: block; }","index.html":"\n\n\n\n \n \n Emoji Space Adventure\n \n \n \n \n \n\n\n\n

\n \n\n\n"},"chat_history":[],"assets":[{"project_id":8018,"created_at":"2025-05-20T19:09:09.054624Z","resource_type":"image","id":74567,"cloudinary_id":"useojsudad4dwru7bgqb","name":"cover","deleted":false}],"messages_sent":38,"comments":[],"steps":[]}