import * as THREE from 'three'; import { OrbitControls } from 'three/addons/controls/OrbitControls.js'; import { EffectComposer } from 'three/addons/postprocessing/EffectComposer.js'; import { RenderPass } from 'three/addons/postprocessing/RenderPass.js'; import { UnrealBloomPass } from 'three/addons/postprocessing/UnrealBloomPass.js'; import { SMAAPass } from 'three/addons/postprocessing/SMAAPass.js'; // Initialize loading manager const loadingManager = new THREE.LoadingManager(); const textureLoader = new THREE.TextureLoader(loadingManager); const reviveTexture = textureLoader.load('https://play.rosebud.ai/assets/pink donut.png?vvSN'); let assetsLoaded = false; let hasRevivePowerup = false; // Track if player has revival power-up let gameStarted = false; // Add game state flag const parentDiv = document.getElementById('renderDiv'); let canvas = document.getElementById('threeRenderCanvas'); if (!canvas) { canvas = document.createElement('canvas'); canvas.id = 'threeRenderCanvas'; parentDiv.appendChild(canvas); } // Create title menu const titleMenu = document.createElement('div'); titleMenu.id = 'titleMenu'; titleMenu.innerHTML = `

Tape Worm

Currently in Beta

Created by Brain Joose

`; document.body.appendChild(titleMenu); // Create controls popup const controlsPopup = document.createElement('div'); controlsPopup.id = 'controlsPopup'; controlsPopup.innerHTML = `

Controls

The worm will follow your mouse's cursor

Mobile: The worm will follow your touch position

`; document.body.appendChild(controlsPopup); // Create instructions popup const instructionsPopup = document.createElement('div'); instructionsPopup.id = 'instructionsPopup'; instructionsPopup.innerHTML = `

How to Play

🐛 Move your worm by following your mouse cursor or touch position

🍔 Eat food items to grow longer

🦠 Eat smaller worms to absorb their segments

🍄 Collect mushroom power-ups to temporarily eat any size worm

🎯 Avoid larger worms or they will eat you

🏆 Become the longest worm to win!

⭐ Watch out for the Master Tape Worm - it's extra dangerous!

`; document.body.appendChild(instructionsPopup); // Create loading screen const loadingScreen = document.createElement('div'); loadingScreen.style.position = 'absolute'; loadingScreen.style.top = '0'; loadingScreen.style.left = '0'; loadingScreen.style.width = '100%'; loadingScreen.style.height = '100%'; loadingScreen.style.backgroundColor = 'rgba(0, 0, 0, 0.8)'; loadingScreen.style.color = 'white'; loadingScreen.style.display = 'flex'; loadingScreen.style.justifyContent = 'center'; loadingScreen.style.alignItems = 'center'; loadingScreen.style.fontSize = '24px'; loadingScreen.innerHTML = 'Loading... 0%'; parentDiv.appendChild(loadingScreen); // Loading manager events loadingManager.onProgress = function(url, itemsLoaded, itemsTotal) { const progress = ((itemsLoaded / itemsTotal) * 100).toFixed(0); loadingScreen.innerHTML = `Loading... ${progress}%`; }; loadingManager.onLoad = function() { assetsLoaded = true; loadingScreen.style.display = 'none'; titleMenu.style.display = 'flex'; // Show objective text briefly when game starts objectiveText.style.opacity = '1'; setTimeout(() => { objectiveText.style.opacity = '0'; }, 5000); }; // Initialize the scene const scene = new THREE.Scene(); scene.background = new THREE.Color(0x000000); // Set scene background to pure black // Clock for animation const clock = new THREE.Clock(); // Initialize the camera const camera = new THREE.PerspectiveCamera( 75, canvas.offsetWidth / canvas.offsetHeight, 0.1, 1000 ); camera.position.set(0, 50, 0); // Lower height for better visibility camera.lookAt(0, 0, 0); camera.up.set(0, 1, 0); // Ensure proper up vector // Initialize the renderer with HDR const renderer = new THREE.WebGLRenderer({ antialias: false, // Disable antialias for better performance canvas: canvas, powerPreference: 'high-performance', precision: 'mediump', // Use medium precision for better performance logarithmicDepthBuffer: false // Disable for better performance }); renderer.setClearColor(0x000000, 1); // Set clear color to pure black with full opacity renderer.setPixelRatio(Math.min(window.devicePixelRatio, 2)); // Limit pixel ratio renderer.setPixelRatio(window.devicePixelRatio); renderer.setSize(canvas.offsetWidth, canvas.offsetHeight); renderer.shadowMap.enabled = true; renderer.shadowMap.type = THREE.BasicShadowMap; // Use basic shadow map for better performance renderer.outputEncoding = THREE.sRGBEncoding; renderer.toneMapping = THREE.ACESFilmicToneMapping; renderer.toneMappingExposure = 1.2; // Initialize post-processing const composer = new EffectComposer(renderer); // Regular scene render pass const renderPass = new RenderPass(scene, camera); composer.addPass(renderPass); // Add subtle bloom effect const bloomPass = new UnrealBloomPass( new THREE.Vector2(window.innerWidth * 0.125, window.innerHeight * 0.125), // Reduced resolution 0.15, // Further reduced bloom strength 0.35, // Reduced radius 0.9 // Increased threshold for less processing ); composer.addPass(bloomPass); // Add anti-aliasing const smaaPass = new SMAAPass( window.innerWidth * renderer.getPixelRatio(), window.innerHeight * renderer.getPixelRatio() ); composer.addPass(smaaPass); // Initialize composer size composer.setSize(parentDiv.clientWidth, parentDiv.clientHeight); // Define sky colors for environmental lighting const skyColor = new THREE.Color(0x87ceeb); // Bright sky blue const groundColor = new THREE.Color(0xffffff); // White ground reflection // Create sky dome with improved colors const vertexShader = ` varying vec3 vWorldPosition; void main() { vec4 worldPosition = modelMatrix * vec4( position, 1.0 ); vWorldPosition = worldPosition.xyz; gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); }`; const fragmentShader = ` uniform vec3 topColor; uniform vec3 bottomColor; uniform float offset; uniform float exponent; varying vec3 vWorldPosition; void main() { float h = normalize( vWorldPosition + offset ).y; gl_FragColor = vec4( mix( bottomColor, topColor, max( pow( max( h, 0.0 ), exponent ), 0.0 ) ), 1.0 ); }`; const uniforms = { topColor: { value: skyColor }, bottomColor: { value: groundColor }, offset: { value: 33 }, exponent: { value: 0.6 }, }; const skyGeo = new THREE.SphereGeometry(500, 32, 15); const skyMat = new THREE.ShaderMaterial({ uniforms: uniforms, vertexShader: vertexShader, fragmentShader: fragmentShader, side: THREE.BackSide, }); const sky = new THREE.Mesh(skyGeo, skyMat); // Remove sky mesh as we want pure black background // Modify OrbitControls setup // Disable OrbitControls for top-down game // Create flat terrain function createTerrain() { const size = 800; // Create plane with more segments for better rendering const geometry = new THREE.PlaneGeometry(size, size, 1, 1); const texture = textureLoader.load('https://play.rosebud.ai/assets/background.jpg?qezS', (texture) => { texture.anisotropy = renderer.capabilities.getMaxAnisotropy(); }); // Proper texture settings to prevent glitches texture.wrapS = texture.wrapT = THREE.RepeatWrapping; texture.repeat.set(8, 8); // Repeat texture to avoid stretching texture.encoding = THREE.sRGBEncoding; texture.generateMipmaps = true; texture.minFilter = THREE.LinearMipmapLinearFilter; texture.magFilter = THREE.LinearFilter; const material = new THREE.MeshStandardMaterial({ map: texture, roughness: 0.8, metalness: 0.1, envMapIntensity: 1.0, transparent: true, opacity: 1, alphaTest: 0.1, side: THREE.FrontSide, // Only render front side for better performance flatShading: false }); const terrain = new THREE.Mesh(geometry, material); terrain.rotation.x = -Math.PI / 2; terrain.receiveShadow = true; scene.add(terrain); return terrain; } // Setup improved lighting system const sunLight = new THREE.DirectionalLight(skyColor, 2.0); sunLight.position.set(-50, 100, -50); sunLight.castShadow = true; sunLight.shadow.mapSize.width = 1024; // Reduced shadow map size sunLight.shadow.mapSize.height = 1024; // Reduced shadow map size sunLight.shadow.camera.near = 10; sunLight.shadow.camera.far = 400; sunLight.shadow.camera.left = -100; sunLight.shadow.camera.right = 100; sunLight.shadow.camera.top = 100; sunLight.shadow.camera.bottom = -100; sunLight.shadow.bias = -0.001; scene.add(sunLight); // Add hemisphere light to simulate sky and ground bounce light const hemiLight = new THREE.HemisphereLight(skyColor, groundColor, 0.6); scene.add(hemiLight); // Create initial scene const terrain = createTerrain(); // Create tape worm segments const segments = []; const segmentCount = 3; // Start with just 3 segments const segmentSpacing = 2; // Name generation const nameAdjectives = ['Hungry', 'Sneaky', 'Giant', 'Tiny', 'Speedy', 'Sleepy', 'Angry', 'Happy', 'Grumpy', 'Silly']; const nameNouns = ['Worm', 'Crawler', 'Wiggler', 'Snake', 'Noodle', 'Squirmer', 'Slither', 'Dragon']; function generateRandomName() { const adj = nameAdjectives[Math.floor(Math.random() * nameAdjectives.length)]; const noun = nameNouns[Math.floor(Math.random() * nameNouns.length)]; return `${adj} ${noun}`; } // AI Worms management const aiWorms = []; const maxAiWorms = 30; // Reduced max AI worms for better performance const aiWormSegments = 3; let masterWorm = null; // Reference to Master Tape Worm const segmentGeometry = new THREE.CylinderGeometry(1.5, 1.5, 2, 32, 1, false); const segmentMaterial = new THREE.MeshStandardMaterial({ color: 0xffffff, roughness: 0.5, metalness: 0.2, envMapIntensity: 1.0, flatShading: false, emissive: new THREE.Color(0x222222), emissiveIntensity: 0.2 }); for (let i = 0; i < segmentCount; i++) { const segment = new THREE.Mesh(segmentGeometry, segmentMaterial); segment.rotation.x = Math.PI / 2; segment.castShadow = true; segment.receiveShadow = true; scene.add(segment); segments.push({ mesh: segment, position: new THREE.Vector3(0, 2, i * segmentSpacing) }); } // Create food items pool const foodPool = []; const unusedFoodPool = []; // Pool for reusing food objects const maxFood = 250; // Reduced food limit to make growth harder const foodGeometry = new THREE.PlaneGeometry(3, 3, 2, 2); foodGeometry.computeBoundingSphere(); // Precompute for collision detection const burgerTexture = textureLoader.load('https://play.rosebud.ai/assets/cheeseburger.png?3qec'); const friesTexture = textureLoader.load('https://play.rosebud.ai/assets/french fries.png?lkxl'); const milkTexture = textureLoader.load('https://play.rosebud.ai/assets/milk.png?WY1Y'); const bananaTexture = textureLoader.load('https://play.rosebud.ai/assets/banana.png?DosG'); const chipsTexture = textureLoader.load('https://play.rosebud.ai/assets/potato chips.png?Ww97'); const sodaTexture = textureLoader.load('https://play.rosebud.ai/assets/soda.png?XZLB'); const cookieTexture = textureLoader.load('https://play.rosebud.ai/assets/cookie.png?CMhJ'); const cupcakeTexture = textureLoader.load('https://play.rosebud.ai/assets/cupcake.png?MeJn'); const mushroomTexture = textureLoader.load('https://play.rosebud.ai/assets/mushroom.png?Vcg7'); // Create material for revive power-up const reviveMaterial = new THREE.MeshStandardMaterial({ map: reviveTexture, transparent: true, alphaTest: 0.5, side: THREE.DoubleSide, emissive: new THREE.Color(0xff69b4), emissiveIntensity: 0.5 }); const foodMaterials = [ new THREE.MeshStandardMaterial({ map: burgerTexture, transparent: true, alphaTest: 0.5, side: THREE.DoubleSide }), new THREE.MeshStandardMaterial({ map: friesTexture, transparent: true, alphaTest: 0.5, side: THREE.DoubleSide }), new THREE.MeshStandardMaterial({ map: milkTexture, transparent: true, alphaTest: 0.5, side: THREE.DoubleSide }), new THREE.MeshStandardMaterial({ map: bananaTexture, transparent: true, alphaTest: 0.5, side: THREE.DoubleSide }), new THREE.MeshStandardMaterial({ map: chipsTexture, transparent: true, alphaTest: 0.5, side: THREE.DoubleSide }), new THREE.MeshStandardMaterial({ map: sodaTexture, transparent: true, alphaTest: 0.5, side: THREE.DoubleSide }), new THREE.MeshStandardMaterial({ map: cookieTexture, transparent: true, alphaTest: 0.5, side: THREE.DoubleSide }), new THREE.MeshStandardMaterial({ map: cupcakeTexture, transparent: true, alphaTest: 0.5, side: THREE.DoubleSide }) ]; // Track power-up state for worms const powerUpState = { player: { active: false, endTime: 0 }, ai: new Map() // Store AI worm power-up states by index }; function spawnFood() { if (foodPool.length >= maxFood) return; // 2% chance to spawn a revive power-up const isRevivePowerup = Math.random() < 0.02; let food; if (unusedFoodPool.length > 0) { // Reuse existing food object food = unusedFoodPool.pop(); food.material = foodMaterials[Math.floor(Math.random() * foodMaterials.length)]; // Reset userData when reusing food food.userData = { type: Math.random() < 0.1 ? 'mushroom' : 'regular' }; } else { // Create new food object if none available let foodMaterial; food = new THREE.Mesh(foodGeometry, foodMaterials[Math.floor(Math.random() * foodMaterials.length)]); food.userData = { type: 'regular' }; if (isRevivePowerup) { food.material = reviveMaterial; food.userData.type = 'revive'; } else { food.userData.type = Math.random() < 0.1 ? 'mushroom' : 'regular'; // 10% chance for mushroom } if (food.userData.type === 'mushroom') { food.material = new THREE.MeshStandardMaterial({ map: mushroomTexture, transparent: true, alphaTest: 0.5, side: THREE.DoubleSide }); // Make mushroom power-ups significantly larger food.scale.set(2, 2, 2); } food.castShadow = true; food.receiveShadow = true; } // Create clusters of food across the map let baseX = (Math.random() - 0.5) * 760; // Slightly reduced to prevent edge spawning let baseZ = (Math.random() - 0.5) * 760; // Slightly reduced to prevent edge spawning // Add larger random offset to create wider natural clustering const x = baseX + (Math.random() - 0.5) * 60; const z = baseZ + (Math.random() - 0.5) * 60; food.position.set(x, 2, z); food.rotation.x = -Math.PI / 2; // Make it face upward food.rotation.z = Math.random() * Math.PI * 2; // Random rotation for variety food.castShadow = true; food.receiveShadow = true; scene.add(food); foodPool.push(food); } // AI Worm creation and management function createAiWorm(isMasterWorm = false) { if (!isMasterWorm && aiWorms.length >= maxAiWorms) return; const wormSegments = []; // Find a suitable spawn position that's not too close to other worms let startX, startZ; let validPosition = false; // Initialize power-up state for the new worm powerUpState.ai.set(aiWorms.length, { active: false, endTime: 0 }); let attempts = 0; const minSpawnDistance = 30; // Minimum distance from other worms while (!validPosition && attempts < 50) { startX = (Math.random() - 0.5) * 780; startZ = (Math.random() - 0.5) * 780; validPosition = true; // Check distance from all existing worms for (const worm of aiWorms) { const dx = startX - worm.segments[0].mesh.position.x; const dz = startZ - worm.segments[0].mesh.position.z; const distance = Math.sqrt(dx * dx + dz * dz); if (distance < minSpawnDistance) { validPosition = false; break; } } attempts++; } // If we couldn't find a valid position after max attempts, use the last attempted position for (let i = 0; i < aiWormSegments; i++) { const material = new THREE.MeshStandardMaterial({ color: isMasterWorm ? new THREE.Color(0.2, 0.8, 0.2) : Math.random() * 0xffffff, // Base green for Master Worm emissive: isMasterWorm ? new THREE.Color(0.8, 0.2, 0) : new THREE.Color(0x222222), // Fiery red emissive emissiveIntensity: isMasterWorm ? 0.7 : 0.2, roughness: isMasterWorm ? 0.8 : 0.5, // More rough texture for Master Worm metalness: isMasterWorm ? 0.8 : 0.2, // More metallic look for Master Worm envMapIntensity: isMasterWorm ? 2.0 : 1.0, // Enhanced environment mapping for Master Worm emissiveIntensity: isMasterWorm ? 1.0 : 0.2 // Stronger glow for Master Worm }); // Add black accents by mixing with the base color if it's Master Worm if (isMasterWorm) { material.color.lerp(new THREE.Color(0x000000), 0.3); // Mix in some black } const segment = new THREE.Mesh(segmentGeometry, material); segment.rotation.x = Math.PI / 2; segment.castShadow = true; segment.receiveShadow = true; scene.add(segment); wormSegments.push({ mesh: segment, position: new THREE.Vector3(startX, 2, startZ + (i * segmentSpacing)) }); segment.position.copy(wormSegments[i].position); } const worm = { segments: wormSegments, targetPosition: new THREE.Vector3(startX, 2, startZ), moveSpeed: 0.35, // Match player speed for all worms name: isMasterWorm ? 'Master Tape Worm' : generateRandomName(), lastMealTime: Date.now(), aggressiveness: isMasterWorm ? 1.0 : Math.random(), stuckWithWorms: new Set(), stuckTime: 0, wanderAngle: Math.random() * Math.PI * 2, minSpeed: isMasterWorm ? 0.8 : 0.2, isMasterWorm: isMasterWorm, separationRadius: isMasterWorm ? 5 : 15 // Smaller separation radius for more aggressive behavior }; if (isMasterWorm) { masterWorm = worm; // Start with significantly more segments for Master Worm for (let i = 0; i < 25; i++) { // Significantly increased initial segments worm.moveSpeed *= 1.2; // Master worm moves faster const lastSegment = worm.segments[worm.segments.length - 1]; const newSegment = new THREE.Mesh(segmentGeometry, lastSegment.mesh.material.clone()); newSegment.rotation.x = Math.PI / 2; newSegment.castShadow = true; newSegment.receiveShadow = true; scene.add(newSegment); const newPosition = lastSegment.position.clone(); newPosition.z += segmentSpacing; worm.segments.push({ mesh: newSegment, position: newPosition }); newSegment.position.copy(newPosition); } } aiWorms.push(worm); } // Update AI worm behavior function updateAiWorms() { // Update AI worms at a further reduced frequency if (Math.random() > 0.4) return; // Further reduced update frequency for better performance // Check for collisions between AI worms first for (let i = 0; i < aiWorms.length; i++) { for (let j = i + 1; j < aiWorms.length; j++) { const worm1 = aiWorms[i]; const worm2 = aiWorms[j]; // Calculate head positions and distance const head1 = worm1.segments[0].mesh.position; const head2 = worm2.segments[0].mesh.position; const distance = head1.distanceTo(head2); // If worms are close enough to interact if (distance < 3) { // Determine which worm is longer if (worm1.segments.length > worm2.segments.length + 2) { // Worm1 eats Worm2 showNotification(`${worm1.name} ate ${worm2.name}!`, 'eat'); // Calculate segments to add before showing notifications const segmentsToAdd = Math.ceil(worm2.segments.length * 0.75); // Get 75% of eaten worm's length showNotification(`${worm1.name} ate ${worm2.name}!`, 'eat'); showNotification(`${worm1.name} grew ${segmentsToAdd} segments!`, 'grow'); // Check if the eaten worm is Master Tape Worm if (worm2.isMasterWorm) { showNotification(`${worm1.name} defeated Master Tape Worm!`, 'powerup'); // Remove Master Tape Worm worm2.segments.forEach(segment => { scene.remove(segment.mesh); }); aiWorms.splice(j, 1); j--; // Adjust index after removal // Respawn Master Tape Worm after a delay setTimeout(() => { createAiWorm(true); showNotification('A new Master Tape Worm has emerged!', 'powerup'); }, 5000); } else { // Remove regular eaten worm worm2.segments.forEach(segment => { scene.remove(segment.mesh); }); aiWorms.splice(j, 1); j--; // Adjust index after removal } // Add segments to the winning worm // segmentsToAdd is already defined above for (let k = 0; k < segmentsToAdd; k++) { const lastSegment = worm1.segments[worm1.segments.length - 1]; const newSegment = new THREE.Mesh(segmentGeometry, lastSegment.mesh.material); newSegment.rotation.x = Math.PI / 2; newSegment.castShadow = true; newSegment.receiveShadow = true; scene.add(newSegment); const newPosition = lastSegment.position.clone(); newPosition.z += segmentSpacing; worm1.segments.push({ mesh: newSegment, position: newPosition }); newSegment.position.copy(newPosition); } // Speed boost for successful hunt worm1.moveSpeed *= 1.1; setTimeout(() => { worm1.moveSpeed /= 1.1; }, 3000); // Create new AI worm to maintain population createAiWorm(); } else if (worm2.segments.length > worm1.segments.length + 2) { // Worm2 eats Worm1 showNotification(`${worm2.name} ate ${worm1.name}!`, 'eat'); // Remove eaten worm // Check if the eaten worm is Master Tape Worm if (worm1.isMasterWorm) { showNotification(`${worm2.name} ate Master Tape Worm! Master Tape Worm will respawn!`, 'eat'); // Remove old Master Tape Worm worm1.segments.forEach(segment => { scene.remove(segment.mesh); }); aiWorms.splice(i, 1); i--; // Adjust index after removal // Respawn Master Tape Worm after a delay setTimeout(() => { createAiWorm(true); showNotification('Master Tape Worm has returned!', 'powerup'); }, 3000); break; // Break inner loop as worm1 no longer exists } else { // Remove regular eaten worm worm1.segments.forEach(segment => { scene.remove(segment.mesh); }); aiWorms.splice(i, 1); i--; // Adjust index after removal break; // Break inner loop as worm1 no longer exists } // Add segments to the winning worm const segmentsToAdd = Math.ceil(worm1.segments.length * 0.75); // Get 75% of eaten worm's length showNotification(`${worm2.name} grew ${segmentsToAdd} segments!`, 'grow'); for (let k = 0; k < segmentsToAdd; k++) { const lastSegment = worm2.segments[worm2.segments.length - 1]; const newSegment = new THREE.Mesh(segmentGeometry, lastSegment.mesh.material); newSegment.rotation.x = Math.PI / 2; newSegment.castShadow = true; newSegment.receiveShadow = true; scene.add(newSegment); const newPosition = lastSegment.position.clone(); newPosition.z += segmentSpacing; worm2.segments.push({ mesh: newSegment, position: newPosition }); newSegment.position.copy(newPosition); } // Speed boost for successful hunt worm2.moveSpeed *= 1.1; setTimeout(() => { worm2.moveSpeed /= 1.1; }, 3000); // Create new AI worm to maintain population createAiWorm(); } } } } for (let i = 0; i < aiWorms.length; i++) { for (let j = i + 1; j < aiWorms.length; j++) { const worm1 = aiWorms[i]; const worm2 = aiWorms[j]; const head1 = worm1.segments[0].mesh.position; const head2 = worm2.segments[0].mesh.position; const wormDistance = head1.distanceTo(head2); if (wormDistance < 3) { // The longer worm eats the shorter one if (worm1.segments.length > worm2.segments.length) { showNotification(`${worm1.name} ate ${worm2.name}!`, 'eat'); // Remove the eaten worm worm2.segments.forEach(segment => { scene.remove(segment.mesh); }); aiWorms.splice(j, 1); j--; // Adjust index after removal // Add segments to the winning worm // Absorb the eaten worm's segments const segmentsToAdd = worm2.segments.length; showNotification(`${worm1.name} absorbed ${segmentsToAdd} segments from ${worm2.name}!`, 'eat'); for (let k = 0; k < segmentsToAdd; k++) { const lastSegment = worm1.segments[worm1.segments.length - 1]; const newSegment = new THREE.Mesh(segmentGeometry, lastSegment.mesh.material); newSegment.rotation.x = Math.PI / 2; newSegment.castShadow = true; newSegment.receiveShadow = true; scene.add(newSegment); const newPosition = lastSegment.position.clone(); newPosition.z += segmentSpacing; worm1.segments.push({ mesh: newSegment, position: newPosition }); newSegment.position.copy(newPosition); } // Create new AI worm to maintain game population createAiWorm(); } else if (worm2.segments.length > worm1.segments.length) { // Remove the eaten worm worm1.segments.forEach(segment => { scene.remove(segment.mesh); }); aiWorms.splice(i, 1); i--; // Adjust index after removal break; // Break inner loop as worm1 no longer exists // Add segments to the winning worm // Absorb the eaten worm's segments const segmentsToAdd = worm1.segments.length; showNotification(`${worm2.name} ate ${worm1.name}!`, 'eat'); showNotification(`${worm2.name} grew ${segmentsToAdd} segments!`, 'grow'); for (let k = 0; k < segmentsToAdd; k++) { const lastSegment = worm2.segments[worm2.segments.length - 1]; const newSegment = new THREE.Mesh(segmentGeometry, lastSegment.mesh.material); newSegment.rotation.x = Math.PI / 2; newSegment.castShadow = true; newSegment.receiveShadow = true; scene.add(newSegment); const newPosition = lastSegment.position.clone(); newPosition.z += segmentSpacing; worm2.segments.push({ mesh: newSegment, position: newPosition }); newSegment.position.copy(newPosition); } // Create new AI worm to maintain game population createAiWorm(); } } } } // Keep only valid worms in the array without reassignment let validWormIndices = []; for (let i = 0; i < aiWorms.length; i++) { if (aiWorms[i] && aiWorms[i].segments && aiWorms[i].segments.length > 0) { validWormIndices.push(i); } } // Process only valid worms validWormIndices.forEach(wormIndex => { const worm = aiWorms[wormIndex]; if (!worm || !worm.segments || worm.segments.length === 0) return; // Initialize enhanced properties worm.wanderAngle = worm.wanderAngle || Math.random() * Math.PI * 2; worm.lastPosition = worm.lastPosition || worm.segments[0].mesh.position.clone(); worm.stuckTime = worm.stuckTime || 0; worm.minSpeed = worm.minSpeed || 0.45; // Increased base speed worm.stuckWithWorms = worm.stuckWithWorms || new Set(); worm.separationRadius = worm.separationRadius || 15; if (!worm.lastPosition) worm.lastPosition = worm.segments[0].mesh.position.clone(); if (!worm.stuckTime) worm.stuckTime = 0; if (!worm.minSpeed) worm.minSpeed = 0.2; if (!worm.stuckWithWorms) worm.stuckWithWorms = new Set(); if (!worm.separationRadius) worm.separationRadius = 15; // New separation radius property // Check if worm hasn't moved significantly and add separation behavior const moveDistance = worm.segments[0].mesh.position.distanceTo(worm.lastPosition); if (moveDistance < 0.1) { worm.stuckTime++; // Check for nearby worms that might be causing the stuck condition aiWorms.forEach((otherWorm, otherIndex) => { if (otherWorm !== worm) { const distance = worm.segments[0].mesh.position.distanceTo(otherWorm.segments[0].mesh.position); if (distance < 5) { // Increased detection radius worm.stuckWithWorms.add(otherIndex); } } }); } else { worm.stuckTime = 0; if (worm.stuckWithWorms) { worm.stuckWithWorms.clear(); } else { worm.stuckWithWorms = new Set(); } } worm.lastPosition.copy(worm.segments[0].mesh.position); // Enhanced target selection with scoring system let bestTarget = null; let bestScore = -Infinity; let targetType = null; const wormHead = worm.segments[0].mesh.position; // Adjust food preference based on food availability const foodShortage = foodPool.length < maxFood * 0.3; if (!worm.foodPreference) { // During food shortage, reduce food preference chance significantly worm.foodPreference = foodShortage ? (Math.random() < 0.2) : // 20% chance during shortage (Math.random() < 0.4); // Normal 40% chance } // First, check for nearby food as primary target foodPool.forEach(food => { const distance = wormHead.distanceTo(food.position); // Higher base score for food if worm prefers it const score = worm.foodPreference ? (500 - distance * 2) : // Much higher score for food-preferring worms (200 - distance * 2); // Lower score for aggressive worms if (score > bestScore && distance < 200) { // Increased food detection range bestScore = score; bestTarget = food; targetType = 'food'; } }); // Enhanced targeting with power-up consideration const isPoweredUp = powerUpState.ai.get(wormIndex)?.active; // Check for nearby mushrooms when there are larger worms let nearbyLargerWorms = false; aiWorms.forEach(otherWorm => { if (otherWorm !== worm && otherWorm.segments.length > worm.segments.length) { const distance = wormHead.distanceTo(otherWorm.segments[0].mesh.position); if (distance < 50) { // Detection range for larger worms nearbyLargerWorms = true; } } }); // Prioritize mushrooms when near larger worms and not powered up if (nearbyLargerWorms && !isPoweredUp) { foodPool.forEach(food => { if (food.userData.type === 'mushroom') { const distance = wormHead.distanceTo(food.position); const score = 1000 - distance * 3; // High priority for mushrooms if (score > bestScore && distance < 100) { bestScore = score; bestTarget = food; targetType = 'food'; } } }); } // Enhanced targeting behavior for Master Tape Worm if (worm.isMasterWorm) { let bestTargetScore = -Infinity; let bestTargetType = null; // Check for potential threats first let nearestThreat = null; let threatDistance = Infinity; aiWorms.forEach(otherWorm => { if (otherWorm !== worm) { const distance = wormHead.distanceTo(otherWorm.segments[0].mesh.position); if (distance < 50 && otherWorm.segments.length > worm.segments.length - 2) { if (distance < threatDistance) { nearestThreat = otherWorm; threatDistance = distance; } } } }); // If there's a threat and no power-up, prioritize escape and power-up hunting if (nearestThreat && !powerUpState.ai.get(wormIndex)?.active) { // Look for nearest mushroom foodPool.forEach(food => { if (food.userData.type === 'mushroom') { const distance = wormHead.distanceTo(food.position); if (distance < 100) { const score = 3000 - distance * 2; if (score > bestScore) { bestScore = score; bestTarget = food; targetType = 'food'; } } } }); // If no mushroom found, escape from threat if (!bestTarget) { const escapeVector = wormHead.clone().sub(nearestThreat.segments[0].mesh.position); escapeVector.normalize().multiplyScalar(100); worm.targetPosition.copy(wormHead.clone().add(escapeVector)); worm.moveSpeed = 1.5; // Faster escape speed return; } } // If no immediate threats or has power-up, hunt normally // First priority: Check for player if they exist if (segments.length > 0) { const distanceToPlayer = wormHead.distanceTo(segments[0].mesh.position); if (distanceToPlayer < 200) { // Increased detection range // High priority for player if they have a good score const playerScore = 2000 - distanceToPlayer + (segments.length * 25); if (playerScore > bestScore) { bestScore = playerScore; bestTarget = segments[0].mesh; targetType = 'player'; } } } // Find the longest worm (including player) const allWorms = [...aiWorms]; if (segments.length > 0) { allWorms.push({ segments, name: playerName, isPlayer: true }); } const topWorm = allWorms.reduce((prev, current) => (current.segments.length > prev.segments.length) ? current : prev ); // Second priority: Target the top worm with increased aggression if (topWorm && topWorm !== worm) { const distance = wormHead.distanceTo(topWorm.segments[0].mesh.position); if (distance < 300) { // Extended detection range for top worm // Very high base score for targeting the top worm const baseScore = 3000; // Additional score based on how much longer the top worm is const lengthDifference = topWorm.segments.length - worm.segments.length; const lengthBonus = Math.max(0, lengthDifference * 50); // Distance penalty is reduced for top worm const distancePenalty = distance * 1.5; const totalScore = baseScore + lengthBonus - distancePenalty; if (totalScore > bestScore) { bestScore = totalScore; bestTarget = topWorm; targetType = 'worm'; // Increase speed when chasing top worm worm.moveSpeed = 2.0; if (distance < 50) { // Burst speed when very close worm.moveSpeed = 2.5; } } } } // Third priority: Other high-scoring worms aiWorms.forEach(otherWorm => { if (otherWorm !== worm && otherWorm !== topWorm) { const distance = wormHead.distanceTo(otherWorm.segments[0].mesh.position); if (distance < 200) { const targetValue = otherWorm.segments.length * 30; const score = 1500 - distance + targetValue; const wormPosition = aiWorms.indexOf(otherWorm); const leaderboardBonus = (aiWorms.length - wormPosition) * 50; const totalScore = score + leaderboardBonus; if (totalScore > bestScore) { bestScore = totalScore; bestTarget = otherWorm; targetType = 'worm'; } } } }); // Third priority: Power-ups foodPool.forEach(food => { if (food.userData.type === 'mushroom') { const distance = wormHead.distanceTo(food.position); if (distance < 100) { const score = 1000 - distance; if (score > bestScore && !powerUpState.ai.get(wormIndex)?.active) { bestScore = score; bestTarget = food; targetType = 'food'; } } } }); // Enhanced speed and movement capabilities worm.moveSpeed = worm.isMasterWorm ? 0.5 : 0.45; // Increased base speed for all AI worms // Enhanced positioning and awareness worm.separationRadius = 35; // Increased separation radius for better maneuverability worm.aggressiveness = 1.0; // Maximum aggressiveness // Prioritize food near other worms to intercept their growth if (!bestTarget || bestTarget.userData?.type !== 'mushroom') { foodPool.forEach(food => { const foodScore = 1000 - wormHead.distanceTo(food.position); // Check if food is near other worms aiWorms.forEach(otherWorm => { if (otherWorm !== worm) { const foodToOtherWorm = food.position.distanceTo(otherWorm.segments[0].mesh.position); if (foodToOtherWorm < 30) { // Boost score for food that could deny other worms if (foodScore > bestScore) { bestScore = foodScore * 1.5; bestTarget = food; targetType = 'food'; } } } }); }); } } else if (!bestTarget || isPoweredUp || (!worm.foodPreference && worm.segments.length > 3)) { // Enhanced food and target detection with improved worm hunting const foodShortage = foodPool.length < maxFood * 0.5; const isAmongTopWorms = aiWorms.filter(w => w.segments.length > worm.segments.length).length < 3; // Check for nearby threats first let nearbyThreats = []; aiWorms.forEach(otherWorm => { if (otherWorm !== worm) { const distance = wormHead.distanceTo(otherWorm.segments[0].mesh.position); const sizeDifference = otherWorm.segments.length - worm.segments.length; // If there's a larger worm nearby, consider it a threat if (sizeDifference > 2 && distance < 30) { nearbyThreats.push({ worm: otherWorm, distance: distance, sizeDifference: sizeDifference }); } } }); // If there are threats, prioritize survival if (nearbyThreats.length > 0 && !isPoweredUp) { // Find nearest mushroom or escape route let bestEscapeScore = -Infinity; let escapeTarget = null; // First check if we're behind the player's score const isBehindPlayer = segments.length > worm.segments.length; // Look for mushrooms and food with enhanced priority when behind foodPool.forEach(food => { if (food.userData.type === 'mushroom') { const distance = wormHead.distanceTo(food.position); if (distance < 100) { // Increased mushroom detection range // Higher score priority when behind player const score = isBehindPlayer ? 3000 - (distance * 1.5) : // More aggressive when behind 2000 - (distance * 2); // Normal priority if (score > bestEscapeScore) { bestEscapeScore = score; escapeTarget = food; } } } else if (isBehindPlayer) { // Also target regular food more aggressively when behind const distance = wormHead.distanceTo(food.position); if (distance < 150) { // Increased food detection range const score = 1500 - distance; if (score > bestEscapeScore) { bestEscapeScore = score; escapeTarget = food; } } } }); // If no mushroom found, run away from threats if (!escapeTarget) { const escapeVector = new THREE.Vector3(); nearbyThreats.forEach(threat => { const awayVector = wormHead.clone().sub(threat.worm.segments[0].mesh.position); awayVector.normalize().multiplyScalar(50 / threat.distance); escapeVector.add(awayVector); }); if (escapeVector.length() > 0) { escapeVector.normalize().multiplyScalar(50); const escapePoint = wormHead.clone().add(escapeVector); worm.targetPosition.copy(escapePoint); worm.moveSpeed = 0.35; // Maintain constant speed return; // Skip normal targeting } } } // Enhanced targeting behavior with improved scoring system aiWorms.forEach(otherWorm => { if (otherWorm !== worm) { const distance = wormHead.distanceTo(otherWorm.segments[0].mesh.position); const sizeDifference = worm.segments.length - otherWorm.segments.length; const sizeDifferencePercent = (worm.segments.length - otherWorm.segments.length) / otherWorm.segments.length; // More aggressive hunting behavior if ((sizeDifference > 0 && sizeDifferencePercent >= 0.1) || // Can eat if 10% larger (isAmongTopWorms && sizeDifference > -1)) { // Top worms are more aggressive // Improved scoring system for hunting const foodShortage = foodPool.length < maxFood * 0.5; let score = foodShortage ? (800 - distance * 2) : // Much higher score during food shortage (worm.foodPreference ? (300 - distance * 2) : // Normal food preference score (800 - distance * 2)); // Increased base hunting score // Additional scoring factors if (isAmongTopWorms) { score += 300; // Top worms are more aggressive } if (sizeDifferencePercent > 0.2) { score += 200; // Much higher score for significantly smaller targets } if (otherWorm.segments.length > 10) { score += otherWorm.segments.length * 5; // Bonus for eating larger worms } // Enhanced scoring for hunting if (sizeDifference > 3 && distance < 30) { // Increased detection range score += 200; // Doubled bonus } // Additional bonus for larger worms hunting if (worm.segments.length > 10) { score += 150; // Extra bonus for larger worms to be more aggressive } if (score > bestScore) { bestScore = score; bestTarget = otherWorm; targetType = 'worm'; } } } }); } // Update target position with enhanced power-up behavior if (bestTarget) { if (targetType === 'food') { worm.targetPosition.copy(bestTarget.position); // Faster speed for mushroom hunting when near larger worms if (bestTarget.userData.type === 'mushroom' && nearbyLargerWorms) { // Maintain constant speed even during power-ups worm.moveSpeed = 0.35; } else { worm.moveSpeed = 0.35; } } else if (targetType === 'worm' && bestTarget && bestTarget.segments && bestTarget.segments[0]) { worm.targetPosition.copy(bestTarget.segments[0].mesh.position); // Super aggressive chase behavior when powered up const distance = wormHead.distanceTo(bestTarget.segments[0].mesh.position); if (isPoweredUp) { if (distance < 30) { // Maintain constant speed during chase worm.moveSpeed = 0.35; } else { worm.moveSpeed = 0.35; } } else { worm.moveSpeed = 0.35; } } } else { // Enhanced continuous movement with better pathfinding worm.moveSpeed = Math.max(0.45 + Math.random() * 0.3, worm.minSpeed); // Update wander angle for smooth random movement worm.wanderAngle += (Math.random() - 0.5) * 0.5; const wanderRadius = 50; // Calculate new target position using circular motion worm.targetPosition.set( worm.segments[0].mesh.position.x + Math.cos(worm.wanderAngle) * wanderRadius, 2, worm.segments[0].mesh.position.z + Math.sin(worm.wanderAngle) * wanderRadius ); // Keep worms within bounds if (Math.abs(worm.targetPosition.x) > 780 || Math.abs(worm.targetPosition.z) > 780) { worm.wanderAngle += Math.PI; // Reverse direction when near boundaries } } // Calculate separation force from other worms const head = worm.segments[0]; const separationForce = new THREE.Vector3(); let neighborCount = 0; aiWorms.forEach((otherWorm, otherIndex) => { if (otherIndex !== wormIndex) { const otherHead = otherWorm.segments[0].mesh.position; const distance = head.mesh.position.distanceTo(otherHead); if (distance < worm.separationRadius) { const away = head.mesh.position.clone().sub(otherHead); away.normalize(); away.divideScalar(Math.max(distance, 0.1)); // Stronger force when closer separationForce.add(away); neighborCount++; } } }); // Apply separation force if there are neighbors if (neighborCount > 0) { separationForce.divideScalar(neighborCount); separationForce.multiplyScalar(2.0); // Separation weight } // Check if path to target is blocked by other worms let pathBlocked = false; const targetDirection = worm.targetPosition.clone().sub(head.mesh.position); const distanceToTarget = targetDirection.length(); if (distanceToTarget > 0.1) { const normalizedDirection = targetDirection.clone().normalize(); // Check for worms in the path aiWorms.forEach((otherWorm) => { if (otherWorm !== worm) { otherWorm.segments.forEach((segment) => { const segmentToHead = segment.mesh.position.clone().sub(head.mesh.position); const projectionLength = segmentToHead.dot(normalizedDirection); // Only check segments that are between the head and target if (projectionLength > 0 && projectionLength < distanceToTarget) { // Calculate perpendicular distance to the path const projection = normalizedDirection.clone().multiplyScalar(projectionLength); const perpendicular = segmentToHead.sub(projection); // If perpendicular distance is small enough, path is blocked if (perpendicular.length() < 4) { pathBlocked = true; } } }); } }); } // If path is blocked, modify target position to find a clear path if (pathBlocked) { // Try to find an alternative path by rotating the target direction const angleStep = Math.PI / 8; let alternativeFound = false; for (let angle = angleStep; angle < Math.PI * 2 && !alternativeFound; angle += angleStep) { // Try both clockwise and counter-clockwise rotations const rotations = [angle, -angle]; for (const rotation of rotations) { const altDirection = targetDirection.clone().applyAxisAngle(new THREE.Vector3(0, 1, 0), rotation); let altPathBlocked = false; // Check if this alternative path is clear aiWorms.forEach((otherWorm) => { if (otherWorm !== worm) { otherWorm.segments.forEach((segment) => { const segmentToHead = segment.mesh.position.clone().sub(head.mesh.position); const projectionLength = segmentToHead.dot(altDirection.normalize()); if (projectionLength > 0 && projectionLength < distanceToTarget) { const projection = altDirection.normalize().multiplyScalar(projectionLength); const perpendicular = segmentToHead.sub(projection); if (perpendicular.length() < 4) { altPathBlocked = true; } } }); } }); if (!altPathBlocked) { targetDirection.copy(altDirection); alternativeFound = true; break; } } } } // Combine target direction with separation const direction = targetDirection.add(separationForce); if (direction.length() > 0.1) { direction.normalize(); // Check for collision with player segments let collisionWithPlayer = false; if (segments.length > 0) { for (const segment of segments) { const distanceToSegment = head.mesh.position.distanceTo(segment.mesh.position); if (distanceToSegment < 3) { // Calculate avoidance vector const avoidVector = head.mesh.position.clone().sub(segment.mesh.position).normalize(); direction.add(avoidVector.multiplyScalar(2)); // Strong avoidance force direction.normalize(); collisionWithPlayer = true; break; } } } // Enhanced collision avoidance and unstuck behavior let canMove = true; let avoidanceDirection = new THREE.Vector3(); const nextPosition = head.position.clone().add(direction.clone().multiplyScalar(worm.moveSpeed)); // More aggressive unstuck behavior with randomized escape if (worm.stuckTime > 20) { // Further reduced threshold for faster response // Increase minimum speed temporarily worm.minSpeed = Math.min(worm.minSpeed + 0.1, 1.0); // Force movement in a new direction const randomAngle = Math.random() * Math.PI * 2; const escapeDistance = 50 + Math.random() * 30; worm.targetPosition.set( worm.segments[0].mesh.position.x + Math.cos(randomAngle) * escapeDistance, 2, worm.segments[0].mesh.position.z + Math.sin(randomAngle) * escapeDistance ); // Reset stuck time and gradually decrease minimum speed worm.stuckTime = 0; setTimeout(() => { worm.minSpeed = Math.max(0.2, worm.minSpeed - 0.1); }, 1000); // Calculate escape direction away from all nearby worms const escapeDirection = new THREE.Vector3(); if (worm.stuckWithWorms.size > 0) { worm.stuckWithWorms.forEach(otherIndex => { const otherWorm = aiWorms[otherIndex]; if (otherWorm) { const awayVector = head.position.clone().sub(otherWorm.segments[0].mesh.position); awayVector.normalize(); escapeDirection.add(awayVector); } }); escapeDirection.normalize(); } else { // Random escape if no specific worms are causing the stuck condition const randomAngle = Math.random() * Math.PI * 2; escapeDirection.set( Math.cos(randomAngle), 0, Math.sin(randomAngle) ); } // Add perpendicular component to break symmetrical deadlocks const perpVector = new THREE.Vector3(-escapeDirection.z, 0, escapeDirection.x); escapeDirection.add(perpVector.multiplyScalar(Math.random() * 0.5)); escapeDirection.normalize(); // Set new target position far from current position worm.targetPosition.copy(head.position.clone().add(escapeDirection.multiplyScalar(40))); // Significant speed boost for escape worm.moveSpeed *= 2; // Add random jitter to escape velocity const jitter = new THREE.Vector3( (Math.random() - 0.5) * 0.5, 0, (Math.random() - 0.5) * 0.5 ); worm.moveSpeed += Math.random() * 0.3; // Random speed boost setTimeout(() => { if (worm.moveSpeed > 0.3) worm.moveSpeed = 0.3 + Math.random() * 0.2; }, 1000); worm.stuckTime = 0; worm.stuckWithWorms.clear(); } // Remove collision checks with other worms for movement canMove = true; // Always allow movement // Check if the next position would collide with player segments let canMoveToNext = true; if (segments.length > 0) { for (const segment of segments) { const distanceToNextPos = nextPosition.distanceTo(segment.mesh.position); if (distanceToNextPos < 2.5) { canMoveToNext = false; break; } } } if (canMoveToNext) { head.position.copy(nextPosition); head.mesh.position.copy(head.position); } else { // If can't move to next position, try to move around the player const nearestPlayerSegment = segments.reduce((nearest, segment) => { const dist = head.mesh.position.distanceTo(segment.mesh.position); return dist < nearest.distance ? { segment, distance: dist } : nearest; }, { segment: null, distance: Infinity }); if (nearestPlayerSegment.segment) { const avoidVector = head.mesh.position.clone() .sub(nearestPlayerSegment.segment.mesh.position) .normalize() .multiplyScalar(2.5); const alternatePosition = head.position.clone().add(avoidVector); head.position.copy(alternatePosition); head.mesh.position.copy(alternatePosition); } } // Rotate head to face movement direction head.mesh.lookAt(worm.targetPosition); head.mesh.rotation.y += Math.PI / 2; } // Update following segments for (let i = 1; i < worm.segments.length; i++) { const segment = worm.segments[i]; const prevSegment = worm.segments[i - 1]; const direction = prevSegment.position.clone().sub(segment.position); if (direction.length() > segmentSpacing) { direction.normalize(); segment.position.add(direction.multiplyScalar(worm.moveSpeed)); segment.mesh.position.copy(segment.position); segment.mesh.lookAt(prevSegment.position); segment.mesh.rotation.y += Math.PI / 2; } } // Check for food collision if (bestTarget && targetType === 'food' && head.mesh.position.distanceTo(bestTarget.position) < 2) { // Check if it's a mushroom power-up if (bestTarget.userData.type === 'mushroom') { if (!powerUpState.ai.get(wormIndex).active) { powerUpState.ai.get(wormIndex).active = true; powerUpState.ai.get(wormIndex).endTime = Date.now() + 60000; // 60 seconds showNotification(`${worm.name} got Super Power!`, 'powerup'); // Add visual effect to AI worm worm.segments.forEach(segment => { segment.mesh.material.emissive = new THREE.Color(0xff00ff); segment.mesh.material.emissiveIntensity = 0.5; }); // Increase aggression and speed during power-up worm.moveSpeed *= 1.5; worm.foodPreference = false; // Force hunting behavior // Set timeout to remove power-up setTimeout(() => { if (powerUpState.ai.has(wormIndex)) { powerUpState.ai.get(wormIndex).active = false; showNotification(`${worm.name}'s Super Power has ended!`, 'powerup'); worm.segments.forEach(segment => { segment.mesh.material.emissive = new THREE.Color(0x222222); segment.mesh.material.emissiveIntensity = 0.2; }); worm.moveSpeed /= 1.5; worm.foodPreference = Math.random() < 0.4; // Reset food preference } }, 60000); } } scene.remove(bestTarget); foodPool.splice(foodPool.indexOf(bestTarget), 1); // AI worms grow faster from food const growthSegments = worm.isMasterWorm ? 3 : 2; // AI worms get 2-3 segments per food for (let i = 0; i < growthSegments; i++) { const lastSegment = worm.segments[worm.segments.length - 1]; const newSegment = new THREE.Mesh(segmentGeometry, lastSegment.mesh.material); newSegment.rotation.x = Math.PI / 2; newSegment.castShadow = true; newSegment.receiveShadow = true; scene.add(newSegment); const newPosition = lastSegment.position.clone(); newPosition.z += segmentSpacing; worm.segments.push({ mesh: newSegment, position: newPosition }); newSegment.position.copy(newPosition); } // Master Tape Worm growth check if (worm.isMasterWorm) { // Find the longest non-master worm const longestNormalWorm = aiWorms.reduce((longest, current) => { if (!current.isMasterWorm && current.segments.length > (longest ? longest.segments.length : 0)) { return current; } return longest; }, null); // If any worm is close to Master's length, add extra segments if (longestNormalWorm && longestNormalWorm.segments.length >= worm.segments.length - 5) { // Add extra segments to maintain dominance const extraSegments = 5; for (let i = 0; i < extraSegments; i++) { const lastSegment = worm.segments[worm.segments.length - 1]; const newSegment = new THREE.Mesh(segmentGeometry, lastSegment.mesh.material.clone()); newSegment.rotation.x = Math.PI / 2; newSegment.castShadow = true; newSegment.receiveShadow = true; scene.add(newSegment); const newPosition = lastSegment.position.clone(); newPosition.z += segmentSpacing; worm.segments.push({ mesh: newSegment, position: newPosition }); newSegment.position.copy(newPosition); } showNotification("Master Tape Worm grows stronger!", 'powerup'); } } // Check for collisions with other worms aiWorms.forEach((otherWorm, otherIndex) => { if (otherWorm !== worm) { const distance = head.mesh.position.distanceTo(otherWorm.segments[0].mesh.position); if (distance < 3) { // If this worm has power-up or is longer than the other worm if (powerUpState.ai.get(wormIndex)?.active || worm.segments.length > otherWorm.segments.length + 2) { // Remove the eaten worm otherWorm.segments.forEach(segment => { scene.remove(segment.mesh); }); aiWorms.splice(otherIndex, 1); // Add segments from eaten worm to eating worm for (let i = 0; i < 2; i++) { const lastSegment = worm.segments[worm.segments.length - 1]; const newSegment = new THREE.Mesh(segmentGeometry, lastSegment.mesh.material); newSegment.rotation.x = Math.PI / 2; newSegment.castShadow = true; newSegment.receiveShadow = true; scene.add(newSegment); const newPosition = lastSegment.position.clone(); newPosition.z += segmentSpacing; worm.segments.push({ mesh: newSegment, position: newPosition }); newSegment.position.copy(newPosition); } } } } }); // Add new segment to AI worm from eating food const lastSegment = worm.segments[worm.segments.length - 1]; const newSegment = new THREE.Mesh(segmentGeometry, lastSegment.mesh.material); newSegment.rotation.x = Math.PI / 2; newSegment.castShadow = true; newSegment.receiveShadow = true; scene.add(newSegment); const newPosition = lastSegment.position.clone(); newPosition.z += segmentSpacing; worm.segments.push({ mesh: newSegment, position: newPosition }); newSegment.position.copy(newPosition); } }); } // Remove the automatic spawn of AI worms - it will be handled by play button click // Mouse/touch position tracking const mouse = new THREE.Vector2(); const targetPosition = new THREE.Vector3(); const raycaster = new THREE.Raycaster(); function updateMousePosition(event) { const rect = canvas.getBoundingClientRect(); const x = ((event.clientX - rect.left) / rect.width) * 2 - 1; const y = -((event.clientY - rect.top) / rect.height) * 2 + 1; mouse.set(x, y); raycaster.setFromCamera(mouse, camera); const intersects = raycaster.intersectObject(terrain); if (intersects.length > 0) { targetPosition.copy(intersects[0].point); targetPosition.y = 2; // Keep worm at constant height } } // Maximum number of notifications allowed at once const MAX_NOTIFICATIONS = 3; // Function to show notification function showNotification(message, type = 'eat') { // Get current notifications const currentNotifications = notificationsContainer.getElementsByClassName('notification'); // If we already have max notifications, remove the oldest one while (currentNotifications.length >= MAX_NOTIFICATIONS) { notificationsContainer.removeChild(currentNotifications[0]); } const notification = document.createElement('div'); notification.className = `notification ${type}`; notification.textContent = message; notificationsContainer.appendChild(notification); // Force reflow to trigger animation notification.offsetHeight; notification.style.opacity = '1'; // Remove notification after animation setTimeout(() => { notification.style.opacity = '0'; setTimeout(() => { if (notification.parentNode === notificationsContainer) { notification.remove(); } }, 300); }, 3000); } let currentLongestWorm = null; const colorCycle = { hue: 0, saturation: 0.8, lightness: 0.6, speed: 0.015 }; // Function to update scoreboard function updateScoreboard() { // Collect all worms (AI and player) const allWorms = [...aiWorms]; if (segments.length > 0) { allWorms.push({ segments: segments, name: playerName, isPlayer: true }); } // Sort by length allWorms.sort((a, b) => b.segments.length - a.segments.length); // Check if the longest worm has changed const longestWorm = allWorms[0]; if (currentLongestWorm && longestWorm && (currentLongestWorm.name !== longestWorm.name || currentLongestWorm.segments.length !== longestWorm.segments.length)) { showNotification( `${longestWorm.name} is now the longest worm with ${longestWorm.segments.length} segments!`, 'leader' ); } currentLongestWorm = longestWorm; // Update scoreboard display scoreboard.innerHTML = '

Top Worms

'; // Show all worms, but only first 5 visible by default allWorms.forEach((worm, index) => { const entry = document.createElement('div'); entry.className = `scoreboard-entry ${worm.isPlayer ? 'player' : ''} ${index === 0 ? 'rank-1' : ''}`; entry.innerHTML = ` ${index + 1}. ${worm.name} ${worm.segments.length} `; scoreboard.appendChild(entry); }); } // Animation loop function animate() { requestAnimationFrame(animate); if (assetsLoaded && gameStarted) { // Update color cycle colorCycle.hue = (colorCycle.hue + colorCycle.speed) % 1; // Apply rainbow effect to longest worm const allWorms = [...aiWorms]; if (segments.length > 0) { allWorms.push({ segments: segments, isPlayer: true }); } // Find the longest worm let longestWorm = allWorms.reduce((prev, current) => (current.segments.length > prev.segments.length) ? current : prev ); // Apply rainbow effect to longest worm if (longestWorm) { const baseHue = colorCycle.hue; longestWorm.segments.forEach((segment, index) => { const hueOffset = (index * 0.1) % 1; // Offset hue for each segment const color = new THREE.Color(); color.setHSL( (baseHue + hueOffset) % 1, colorCycle.saturation, colorCycle.lightness ); if (segment.mesh.material.color) { segment.mesh.material.color = color; } }); } // Update scoreboard updateScoreboard(); // Update AI worms updateAiWorms(); // Update tape worm movement if (segments.length > 0) { // Check if player is stuck at map edges const head = segments[0]; const isAtEdge = Math.abs(head.mesh.position.x) > 775 || Math.abs(head.mesh.position.z) > 775; const stuckThreshold = 2.0; // Distance threshold to consider "stuck" if (isAtEdge) { if (!head.stuckTime) head.stuckTime = 0; head.stuckTime++; // After being stuck for 60 frames (about 1 second), start losing segments if (head.stuckTime > 60 && segments.length > 3) { // Keep minimum of 3 segments // Remove last segment const lastSegment = segments[segments.length - 1]; scene.remove(lastSegment.mesh); segments.pop(); showNotification(`${playerName} lost a segment at the edge!`, 'eat'); head.stuckTime = 0; // Reset stuck timer after losing a segment // Update objective text objectiveText.innerHTML = `Objective: Become the biggest worm by eating food and smaller worms!
Current Length: ${segments.length}`; } } else { head.stuckTime = 0; // Reset stuck timer when not at edge } // Move head towards target let currentHead = segments[0]; // Check for edge collisions and segment loss const edgeCollision = Math.abs(currentHead.mesh.position.x) > 775 || Math.abs(currentHead.mesh.position.z) > 775; if (edgeCollision && segments.length > 3 && (!currentHead.lastSegmentLossTime || Date.now() - currentHead.lastSegmentLossTime > 1000)) { // Remove last segment const lastSegment = segments[segments.length - 1]; scene.remove(lastSegment.mesh); segments.pop(); // Update last segment loss time currentHead.lastSegmentLossTime = Date.now(); // Show notification showNotification(`${playerName} lost a segment at the edge!`, 'eat'); } // Keep worm within bounds currentHead.mesh.position.x = Math.max(-775, Math.min(775, currentHead.mesh.position.x)); currentHead.mesh.position.z = Math.max(-775, Math.min(775, currentHead.mesh.position.z)); currentHead.position.copy(currentHead.mesh.position); const direction = targetPosition.clone().sub(currentHead.mesh.position); // Update camera position to follow head camera.position.x = head.mesh.position.x; camera.position.z = head.mesh.position.z; camera.position.y = 50; // Maintain constant height camera.lookAt(head.mesh.position); if (direction.length() > 0.1) { direction.normalize(); // Enhanced collision detection and avoidance let canMove = true; const nextPosition = currentHead.position.clone().add(direction.clone().multiplyScalar(0.3)); // Further reduced player speed // Check for direct collisions with AI worms aiWorms.forEach(aiWorm => { aiWorm.segments.forEach(segment => { const distance = nextPosition.distanceTo(segment.mesh.position); if (distance < 2) { canMove = false; } }); }); if (canMove) { currentHead.position.copy(nextPosition); currentHead.mesh.position.copy(currentHead.position); // Rotate head to face movement direction currentHead.mesh.lookAt(targetPosition); currentHead.mesh.rotation.y += Math.PI / 2; } } // Update following segments for (let i = 1; i < segments.length; i++) { const segment = segments[i]; const prevSegment = segments[i - 1]; const direction = prevSegment.position.clone().sub(segment.position); if (direction.length() > segmentSpacing) { direction.normalize(); segment.position.add(direction.multiplyScalar(0.35)); // Decreased from 0.4 to 0.35 segment.mesh.position.copy(segment.position); // Rotate segment to face movement direction segment.mesh.lookAt(prevSegment.position); segment.mesh.rotation.y += Math.PI / 2; } } } // Spawn food occasionally // Optimize food spawning if (foodPool.length < maxFood * 0.9) { // More aggressive spawning threshold // Spawn larger groups of food items at once const spawnCount = Math.floor(Math.random() * 8) + 8; // Spawn 8-15 items at once for (let i = 0; i < spawnCount; i++) { spawnFood(); } // Additional random bursts of food in clusters if (Math.random() < 0.8) { // Higher chance of additional spawns const burstCount = Math.floor(Math.random() * 12) + 8; // 8-19 additional items for (let i = 0; i < burstCount; i++) { spawnFood(); } } } // Check for food collision if (segments.length > 0) { const headPosition = segments[0].mesh.position; // Check for head-to-head collisions with AI worms aiWorms.forEach((aiWorm, index) => { const aiHeadPosition = aiWorm.segments[0].mesh.position; const distance = headPosition.distanceTo(aiHeadPosition); if (distance < 3) { // Check if player has power-up or if the target worm is smaller if ((powerUpState.player.active) || // Can eat any worm with power-up (segments.length > aiWorm.segments.length)) { // Can eat any smaller worm, including Master showNotification(`${playerName} ate ${aiWorm.name}!`, 'eat'); // Remove the eaten worm aiWorm.segments.forEach(segment => { scene.remove(segment.mesh); }); aiWorms.splice(index, 1); // Add segments to player from eaten worm // Absorb all segments from the eaten worm const segmentsToAdd = aiWorm.segments.length; showNotification(`${playerName} absorbed ${segmentsToAdd} segments from ${aiWorm.name}!`, 'eat'); for (let i = 0; i < segmentsToAdd; i++) { const lastSegment = segments[segments.length - 1]; const newSegment = new THREE.Mesh(segmentGeometry, segmentMaterial); newSegment.rotation.x = Math.PI / 2; newSegment.castShadow = true; newSegment.receiveShadow = true; scene.add(newSegment); const newPosition = lastSegment.position.clone(); newPosition.z += segmentSpacing; segments.push({ mesh: newSegment, position: newPosition }); newSegment.position.copy(newPosition); } // Spawn new AI worm to maintain game balance createAiWorm(); } // If AI worm is longer or nearly equal size and player doesn't have power-up, player dies else if (aiWorm.segments.length >= segments.length - 1 && !powerUpState.player.active) { if (hasRevivePowerup) { // Use revive power-up showNotification(`${playerName} used revival power-up!`, 'powerup'); hasRevivePowerup = false; // Temporary invincibility let tempInvincibility = true; setTimeout(() => { tempInvincibility = false; }, 3000); // Move player to safe location const safePosition = new THREE.Vector3( (Math.random() - 0.5) * 700, 2, (Math.random() - 0.5) * 700 ); segments[0].position.copy(safePosition); segments[0].mesh.position.copy(safePosition); } else { showNotification(`${aiWorm.name} ate your worm!`, 'eat'); // Show game over screen gameOverScreen.style.display = 'flex'; } // Remove all player segments segments.forEach(segment => { scene.remove(segment.mesh); }); segments.length = 0; // Reset player with initial segments for (let i = 0; i < segmentCount; i++) { const segment = new THREE.Mesh(segmentGeometry, segmentMaterial); segment.rotation.x = Math.PI / 2; segment.castShadow = true; segment.receiveShadow = true; scene.add(segment); segments.push({ mesh: segment, position: new THREE.Vector3(0, 2, i * segmentSpacing) }); } } } }); // Check for food collisions foodPool.forEach((food, index) => { if (headPosition.distanceTo(food.position) < 2) { // Player grows slower from food (50% chance for extra segment) const shouldGrow = Math.random() < 0.5; if (!shouldGrow) { scene.remove(food); foodPool.splice(index, 1); unusedFoodPool.push(food); return; } // Check if it's a revive power-up if (food.userData.type === 'revive') { if (!hasRevivePowerup) { hasRevivePowerup = true; showNotification(`${playerName} got Revival Power-up!`, 'powerup'); // Add visual indicator to player segments.forEach(segment => { segment.mesh.material.emissive = new THREE.Color(0xff69b4); segment.mesh.material.emissiveIntensity = 0.3; }); } else { showNotification(`${playerName} already has a Revival Power-up!`, 'powerup'); } scene.remove(food); foodPool.splice(index, 1); unusedFoodPool.push(food); return; } // Check if it's a mushroom power-up if (food.userData.type === 'mushroom') { // Only apply power-up if not already active if (!powerUpState.player.active) { powerUpState.player.active = true; powerUpState.player.endTime = Date.now() + 60000; // 60 seconds showNotification(`${playerName} got Super Power! Can eat any worm for 60 seconds!`, 'powerup'); // Add visual effect to player worm segments.forEach(segment => { segment.mesh.material.emissive = new THREE.Color(0xff00ff); segment.mesh.material.emissiveIntensity = 0.5; }); // Set timeout to remove power-up setTimeout(() => { powerUpState.player.active = false; showNotification(`${playerName}'s Super Power has ended!`, 'powerup'); segments.forEach(segment => { segment.mesh.material.emissive = new THREE.Color(0x222222); segment.mesh.material.emissiveIntensity = 0.2; }); }, 60000); } else { // Show notification that power-up is already active showNotification(`${playerName} already has Super Power active!`, 'powerup'); } } // Remove eaten food scene.remove(food); foodPool.splice(index, 1); unusedFoodPool.push(food); // Show growth notification showNotification(`${playerName} grew! Length: ${segments.length + 1}`, 'grow'); // Update objective text objectiveText.innerHTML = `Objective: Become the biggest worm by eating food and smaller worms!
Current Length: ${segments.length + 1}`; // Add new segment const lastSegment = segments[segments.length - 1]; const newSegment = new THREE.Mesh(segmentGeometry, segmentMaterial); newSegment.rotation.x = Math.PI / 2; newSegment.castShadow = true; newSegment.receiveShadow = true; scene.add(newSegment); // Position behind last segment const newPosition = lastSegment.position.clone(); newPosition.z += segmentSpacing; segments.push({ mesh: newSegment, position: newPosition }); newSegment.position.copy(newPosition); } }); } } composer.render(); } // Handle window resize function onWindowResize() { const width = parentDiv.clientWidth; const height = parentDiv.clientHeight; // Update camera camera.aspect = width / height; camera.updateProjectionMatrix(); // Update renderer and composer renderer.setSize(width, height); composer.setSize(width, height); // Update post-processing passes bloomPass.resolution.set(width, height); smaaPass.setSize(width, height); } // Add event listeners window.addEventListener('resize', onWindowResize); canvas.addEventListener('mousemove', updateMousePosition); canvas.addEventListener('touchmove', (event) => { event.preventDefault(); updateMousePosition(event.touches[0]); }, { passive: false }); const resizeObserver = new ResizeObserver(onWindowResize); resizeObserver.observe(parentDiv); // Create Game Over Screen // Create objective text element const objectiveText = document.createElement('div'); objectiveText.id = 'objectiveText'; objectiveText.innerHTML = 'Objective: Become the biggest worm by eating food and smaller worms!
Current Length: 3'; document.body.appendChild(objectiveText); const gameOverScreen = document.createElement('div'); gameOverScreen.id = 'gameOverScreen'; const gameOverText = document.createElement('div'); gameOverText.id = 'gameOverText'; gameOverText.textContent = 'You got eaten!'; const retryButton = document.createElement('button'); retryButton.id = 'retryButton'; retryButton.textContent = 'Try Again'; gameOverScreen.appendChild(gameOverText); gameOverScreen.appendChild(retryButton); document.body.appendChild(gameOverScreen); // Add retry button functionality retryButton.addEventListener('click', () => { // Hide game over screen gameOverScreen.style.display = 'none'; // Reset player position const startPosition = new THREE.Vector3(0, 2, 0); segments.forEach((segment, index) => { segment.position.copy(startPosition.clone().add(new THREE.Vector3(0, 0, index * segmentSpacing))); segment.mesh.position.copy(segment.position); // Reset material and properties but maintain constant movement speed segment.mesh.material = segmentMaterial.clone(); segment.mesh.material.emissive = new THREE.Color(0x222222); segment.mesh.material.emissiveIntensity = 0.2; }); // Reset camera camera.position.set(0, 50, 0); camera.lookAt(0, 0, 0); }); // Add title menu event listeners // Add playerName variable at the top level let playerName = 'Player'; document.getElementById('playButton').addEventListener('click', () => { const usernameInput = document.getElementById('usernameInput'); // Get the entered username, use 'Player' if empty playerName = usernameInput.value.trim() || 'Player'; titleMenu.style.display = 'none'; // Show objective text briefly when game starts objectiveText.style.opacity = '1'; setTimeout(() => { objectiveText.style.opacity = '0'; }, 5000); // Initialize game components when play button is clicked gameStarted = true; // Spawn initial AI worms gradually to prevent clustering let initialWormsSpawned = 0; const spawnInterval = setInterval(() => { if (initialWormsSpawned === 0) { // Create Master Tape Worm first createAiWorm(true); initialWormsSpawned++; } else if (initialWormsSpawned < maxAiWorms) { createAiWorm(); initialWormsSpawned++; } else { clearInterval(spawnInterval); } }, 100); }); document.getElementById('controlsButton').addEventListener('click', () => { controlsPopup.style.display = 'block'; }); document.getElementById('closeControls').addEventListener('click', () => { controlsPopup.style.display = 'none'; }); // Add instructions button functionality document.getElementById('instructionsButton').addEventListener('click', () => { instructionsPopup.style.display = 'block'; }); document.getElementById('closeInstructions').addEventListener('click', () => { instructionsPopup.style.display = 'none'; }); // Start animation animate(); // ========================= // Mobile Controls Integration // ========================= // Create a container for the D-pad const dpadContainer = document.createElement('div'); dpadContainer.id = 'dpadContainer'; document.body.appendChild(dpadContainer); // Create directional buttons const directions = ['up', 'down', 'left', 'right']; directions.forEach(direction => { const button = document.createElement('button'); button.id = `${direction}Button`; button.classList.add('dpad-button'); // Set the appropriate icon based on direction let iconUrl = ''; switch (direction) { case 'up': iconUrl = 'https://play.rosebud.ai/assets/up_chevron.png?YWEq'; break; case 'down': iconUrl = 'https://play.rosebud.ai/assets/down_chevron.png?yojk'; break; case 'left': iconUrl = 'https://play.rosebud.ai/assets/left_chevron.png?C3aB'; break; case 'right': iconUrl = 'https://play.rosebud.ai/assets/right_chevron.png?mSRu'; break; } button.style.backgroundImage = `url('${iconUrl}')`; dpadContainer.appendChild(button); }); // Create a container for the Jump button const jumpContainer = document.createElement('div'); jumpContainer.id = 'jumpContainer'; document.body.appendChild(jumpContainer); // Create Jump button const jumpButton = document.createElement('button'); jumpButton.id = 'jumpButton'; jumpButton.classList.add('jump-button'); jumpButton.style.backgroundImage = `url('https://play.rosebud.ai/assets/Up-Arrow.png?64aM')`; jumpContainer.appendChild(jumpButton); // Inject CSS styles dynamically const styles = ` /* D-Pad Container */ #dpadContainer { position: fixed; bottom: 150px; left: 30px; display: none; /* Hide the D-pad container */ width: 150px; /* Increased size */ height: 150px; /* Increased size */ grid-template-areas: ". up ." "left . right" ". down ."; grid-gap: 10px; /* Spacing between buttons */ z-index: 1000; } /* Positioning each button in the grid */ #upButton { grid-area: up; } #downButton { grid-area: down; } #leftButton { grid-area: left; } #rightButton { grid-area: right; } /* D-Pad Buttons */ .dpad-button { width: 50px; /* Consistent size */ height: 50px; /* Consistent size */ margin: 0; /* Remove margin as grid-gap handles spacing */ background-color: rgba(0, 0, 0, 0.5); /* Dark semi-transparent background */ background-size: 60%; /* Uniform icon size */ background-repeat: no-repeat; background-position: center; border: none; border-radius: 12px; /* Rounded corners */ opacity: 0.9; /* Higher opacity */ transition: opacity 0.2s, transform 0.1s, box-shadow 0.2s, filter 0.2s; /* Smooth transitions */ box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3); /* Initial shadow */ } /* Active State for D-Pad Buttons */ .dpad-button:active { opacity: 1; transform: scale(0.95); box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5); /* Shadow becomes more pronounced */ filter: brightness(1.1); /* Slight brightness increase */ } /* Jump Button Container */ #jumpContainer { position: fixed; bottom: 150px; right: 30px; display: none; /* Hide the jump container */ width: 80px; /* Maintained size */ height: 80px; /* Maintained size */ justify-content: center; align-items: center; z-index: 1000; } /* Jump Button */ .jump-button { width: 70px; /* Increased size */ height: 70px; /* Increased size */ background-color: rgba(0, 0, 0, 0.5); /* Dark semi-transparent background */ background-size: 60%; /* Uniform icon size */ background-repeat: no-repeat; background-position: center; border: none; border-radius: 35px; /* Fully rounded */ opacity: 0.9; /* Higher opacity */ transition: opacity 0.2s, transform 0.1s, box-shadow 0.2s, filter 0.2s; /* Smooth transitions */ box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3); /* Initial shadow */ background-image: url('https://play.rosebud.ai/assets/Up-Arrow.png?64aM'); /* Jump button icon */ } /* Active State for Jump Button */ .jump-button:active { opacity: 1; transform: scale(0.95); box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5); /* Shadow becomes more pronounced */ filter: brightness(1.1); /* Slight brightness increase */ } /* Responsive Adjustments */ @media (max-width: 600px) { /* D-Pad Container */ #dpadContainer { bottom: 120px; /* Increased from 80px to move up on smaller screens */ left: 25px; width: 120px; height: 120px; } /* D-Pad Buttons */ .dpad-button { width: 40px; height: 40px; background-size: 60%; /* Ensure uniform size */ } /* Jump Button Container */ #jumpContainer { bottom: 120px; /* Increased from 80px */ right: 25px; width: 60px; height: 60px; } /* Jump Button */ .jump-button { width: 60px; height: 60px; background-size: 60%; /* Ensure uniform size */ } } /* Game Over Screen */ #gameOverScreen { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); display: none; flex-direction: column; justify-content: center; align-items: center; z-index: 2000; } #gameOverText { color: white; font-size: 48px; margin-bottom: 20px; } #retryButton { padding: 15px 30px; font-size: 24px; background-color: #4CAF50; color: white; border: none; border-radius: 5px; cursor: pointer; transition: background-color 0.3s; } #retryButton:hover { background-color: #45a049; } `; // Create notifications container const notificationsContainer = document.createElement('div'); notificationsContainer.id = 'notifications'; document.body.appendChild(notificationsContainer); // Add notification styles const notificationStyles = ` #objectiveText { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: rgba(0, 0, 0, 0.7); color: white; padding: 20px; border-radius: 10px; font-family: Arial, sans-serif; text-align: center; z-index: 1000; pointer-events: none; opacity: 0; transition: opacity 0.5s; } #notifications { position: fixed; top: 20px; left: 20px; max-width: 300px; z-index: 1000; } .notification { background-color: rgba(0, 0, 0, 0.8); color: white; padding: 10px 15px; margin-bottom: 10px; border-radius: 5px; font-family: Arial, sans-serif; font-size: 14px; animation: slideIn 0.3s ease-out, fadeOut 0.3s ease-out 2.7s; opacity: 0; } .notification.eat { border-left: 4px solid #ff4444; } .notification.leader { border-left: 4px solid #ffeb3b; } .notification.grow { border-left: 4px solid #4CAF50; } .notification.powerup { border-left: 4px solid #ff00ff; } @keyframes slideIn { from { transform: translateX(-100%); opacity: 0; } to { transform: translateX(0); opacity: 1; } } @keyframes fadeOut { from { opacity: 1; } to { opacity: 0; } } `; // Create scoreboard const scoreboard = document.createElement('div'); scoreboard.id = 'scoreboard'; document.body.appendChild(scoreboard); // Create expand button for scoreboard const expandButton = document.createElement('button'); expandButton.id = 'expandScoreButton'; expandButton.textContent = 'Show More'; expandButton.addEventListener('click', () => { scoreboard.classList.toggle('expanded'); expandButton.textContent = scoreboard.classList.contains('expanded') ? 'Show Less' : 'Show More'; }); scoreboard.appendChild(expandButton); // Add scoreboard styles const scoreboardStyles = ` #scoreboard { position: fixed; top: 20px; right: 20px; background-color: rgba(0, 0, 0, 0.7); color: white; padding: 15px; border-radius: 10px; font-family: Arial, sans-serif; min-width: 200px; z-index: 1000; max-height: 200px; overflow: hidden; transition: max-height 0.3s ease-out; } #scoreboard.expanded { max-height: 600px; } #expandScoreButton { width: 100%; padding: 8px; margin-top: 10px; background-color: rgba(76, 175, 80, 0.6); border: none; color: white; border-radius: 5px; cursor: pointer; transition: background-color 0.2s; } #expandScoreButton:hover { background-color: rgba(76, 175, 80, 0.8); } .scoreboard-entry { margin: 5px 0; display: flex; justify-content: space-between; align-items: center; } .scoreboard-entry.player { color: #4CAF50; font-weight: bold; } .rank-1 { color: gold; font-weight: bold; } `; // Add title menu and controls popup styles const menuStyles = ` .input-container { margin-bottom: 20px; } #usernameInput { padding: 12px 20px; font-size: 18px; border: 2px solid #4CAF50; border-radius: 5px; background-color: rgba(0, 0, 0, 0.7); color: white; text-align: center; width: 200px; transition: all 0.3s ease; } #usernameInput:focus { outline: none; border-color: #45a049; box-shadow: 0 0 10px rgba(76, 175, 80, 0.5); } #usernameInput::placeholder { color: rgba(255, 255, 255, 0.5); } #titleMenu { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.9); display: flex; flex-direction: column; justify-content: center; align-items: center; z-index: 3000; } #titleMenu h1 { color: white; font-size: 64px; margin-bottom: 10px; text-shadow: 0 0 10px rgba(255, 255, 255, 0.5); } #titleMenu .beta-text { color: #4CAF50; font-size: 24px; margin-bottom: 10px; font-style: italic; text-shadow: 0 0 5px rgba(76, 175, 80, 0.5); } #titleMenu .creator-text { color: #ffffff; font-size: 18px; margin-bottom: 30px; opacity: 0.8; text-shadow: 0 0 5px rgba(255, 255, 255, 0.3); } #titleMenu button { padding: 15px 40px; font-size: 24px; margin: 10px; background-color: #4CAF50; color: white; border: none; border-radius: 5px; cursor: pointer; transition: all 0.3s ease; width: 200px; } #titleMenu button:hover { background-color: #45a049; transform: scale(1.05); } #controlsPopup { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: rgba(0, 0, 0, 0.95); padding: 30px; border-radius: 10px; color: white; text-align: center; display: none; z-index: 3001; } #controlsPopup h2 { margin-bottom: 20px; font-size: 28px; } #controlsPopup p { margin: 10px 0; font-size: 18px; } #controlsPopup button { padding: 10px 20px; font-size: 18px; margin-top: 20px; background-color: #4CAF50; color: white; border: none; border-radius: 5px; cursor: pointer; transition: background-color 0.3s; } #controlsPopup button:hover { background-color: #45a049; } #instructionsPopup { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: rgba(0, 0, 0, 0.95); padding: 30px; border-radius: 10px; color: white; text-align: center; display: none; z-index: 3001; max-width: 500px; width: 90%; } #instructionsPopup h2 { margin-bottom: 20px; font-size: 28px; color: #4CAF50; } .instructions-content { text-align: left; margin: 20px 0; } .instructions-content p { margin: 15px 0; font-size: 18px; line-height: 1.4; } #instructionsPopup button { padding: 10px 20px; font-size: 18px; margin-top: 20px; background-color: #4CAF50; color: white; border: none; border-radius: 5px; cursor: pointer; transition: background-color 0.3s; } #instructionsPopup button:hover { background-color: #45a049; } `; // Append the styles to the head const styleSheet = document.createElement("style"); styleSheet.type = "text/css"; styleSheet.innerText = styles + menuStyles + notificationStyles + scoreboardStyles; document.head.appendChild(styleSheet); // Define keysPressed object with standardized key names const keysPressed = { up: false, down: false, left: false, right: false, jump: false, }; // Helper functions to handle button presses function addButtonListeners(buttonId, key) { const button = document.getElementById(buttonId); if (!button) return; // Prevent default to avoid unwanted scrolling or other behaviors button.addEventListener('touchstart', (event) => { event.preventDefault(); keysPressed[key] = true; }, { passive: false }); button.addEventListener('touchend', (event) => { event.preventDefault(); keysPressed[key] = false; }, { passive: false }); // Also handle mouse events for desktop compatibility button.addEventListener('mousedown', (event) => { event.preventDefault(); keysPressed[key] = true; }); button.addEventListener('mouseup', (event) => { event.preventDefault(); keysPressed[key] = false; }); button.addEventListener('mouseleave', (event) => { event.preventDefault(); keysPressed[key] = false; }); } // Map buttons to standardized keys addButtonListeners('upButton', 'up'); addButtonListeners('downButton', 'down'); addButtonListeners('leftButton', 'left'); addButtonListeners('rightButton', 'right'); addButtonListeners('jumpButton', 'jump'); // ========================= // Keyboard Controls Integration // ========================= // Add event listeners for keyboard controls window.addEventListener('keydown', (event) => { switch (event.code) { case 'ArrowUp': case 'KeyW': keysPressed.up = true; break; case 'ArrowDown': case 'KeyS': keysPressed.down = true; break; case 'ArrowLeft': case 'KeyA': keysPressed.left = true; break; case 'ArrowRight': case 'KeyD': keysPressed.right = true; break; case 'Space': keysPressed.jump = true; break; default: break; } }); window.addEventListener('keyup', (event) => { switch (event.code) { case 'ArrowUp': case 'KeyW': keysPressed.up = false; break; case 'ArrowDown': case 'KeyS': keysPressed.down = false; break; case 'ArrowLeft': case 'KeyA': keysPressed.left = false; break; case 'ArrowRight': case 'KeyD': keysPressed.right = false; break; case 'Space': keysPressed.jump = false; break; default: break; } }); // ========================= // End of Mobile and Keyboard Controls Integration // ========================= // Function to apply controls based on keysPressed function applyControls() { // Controls are now handled by mouse/touch movement // Camera follows the player's worm automatically }