WARRIORS SHOOTER ❤️

`; document.body.appendChild(loadingScreen); THREE.DefaultLoadingManager.onProgress = (url, itemsLoaded, itemsTotal) => { const progress = (itemsLoaded / itemsTotal) * 100; const progressBar = document.getElementById('loadingProgress'); if (progressBar) progressBar.style.width = progress + '%'; }; THREE.DefaultLoadingManager.onLoad = () => { loadingScreen.style.opacity = '0'; setTimeout(() => { if (loadingScreen.parentNode) { loadingScreen.parentNode.removeChild(loadingScreen); } }, 500); }; scene.background = new THREE.Color(0x000011); // Dark winter night sky // Audio setup const listener = new THREE.AudioListener(); const audio = new THREE.Audio(listener); const audioLoader = new THREE.AudioLoader(); audioLoader.load('/audio/eminem_lose_yourself.mp3', function(buffer) { audio.setBuffer(buffer); audio.setLoop(true); audio.setVolume(0.5); // Adjust volume as needed // audio.play(); // Autoplay might be blocked by browsers, will connect to a button }); const shootSound = new THREE.Audio(listener); audioLoader.load('/audio/futuristic_shot.mp3', function(buffer) { shootSound.setBuffer(buffer); shootSound.setLoop(false); shootSound.setVolume(0.3); // Adjust volume as needed }); const camera = new THREE.PerspectiveCamera( 70, window.innerWidth / window.innerHeight, 0.01, 10 ); camera.add(listener); // Add the listener to the camera camera.position.z = 3; const renderer = new THREE.WebGLRenderer({ antialias: true }); renderer.setSize(window.innerWidth, window.innerHeight); const container = document.getElementById("renderDiv"); if (!container) { throw new Error("Missing render container"); } container.innerHTML = ""; container.appendChild(renderer.domElement); // --- Shooter Configurations --- const shooterConfigs = [ { id: 'basic', name: 'Basic Orb', cost: 0, playerGeometry: new THREE.SphereGeometry(0.12, 16, 16), playerMaterial: new THREE.MeshStandardMaterial({ color: 0x00ff00, emissive: 0x00aa00 }), bulletGeometry: new THREE.SphereGeometry(0.02), bulletMaterial: new THREE.MeshStandardMaterial({ color: 0x00ff00, emissive: 0x00ff00 }), fireRate: 200, // milliseconds between shots bulletVelocity: 0.1, adds: 0 }, { id: 'dual', name: 'Dual Blaster', cost: 100, playerGeometry: new THREE.CylinderGeometry(0.08, 0.08, 0.25, 8), // A small cylinder playerMaterial: new THREE.MeshStandardMaterial({ color: 0x0077ff, emissive: 0x002288 }), bulletGeometry: new THREE.BoxGeometry(0.02, 0.05, 0.02), // Rectangular bullets bulletMaterial: new THREE.MeshStandardMaterial({ color: 0x00ccff, emissive: 0x00ccff }), fireRate: 150, bulletVelocity: 0.12, dualShot: true, // Custom property for dual shot adds: 1 }, { id: 'rapid', name: 'Rapid Fire', cost: 250, playerGeometry: new THREE.ConeGeometry(0.15, 0.2, 10), // A small cone playerMaterial: new THREE.MeshStandardMaterial({ color: 0xff0000, emissive: 0x880000 }), bulletGeometry: new THREE.SphereGeometry(0.015), // Smaller bullets bulletMaterial: new THREE.MeshStandardMaterial({ color: 0xff4400, emissive: 0xff4400 }), fireRate: 75, bulletVelocity: 0.1, adds: 2 }, { id: 'shotgun', name: 'Shotgun Spread', cost: 500, playerGeometry: new THREE.BoxGeometry(0.2, 0.12, 0.1), // A wider, flatter shape playerMaterial: new THREE.MeshStandardMaterial({ color: 0xaa5500, emissive: 0x552200 }), bulletGeometry: new THREE.SphereGeometry(0.015), // Small bullets bulletMaterial: new THREE.MeshStandardMaterial({ color: 0xffaa00, emissive: 0xffaa00 }), fireRate: 300, // Slower due to multiple bullets bulletVelocity: 0.08, spreadShot: true, // Custom property for spread shot adds: 3 }, { id: 'laser', name: 'Laser Beam', cost: 750, playerGeometry: new THREE.ConeGeometry(0.1, 0.3, 4), // Sleek, pointed shape playerMaterial: new THREE.MeshStandardMaterial({ color: 0x00ffff, emissive: 0x008888 }), bulletGeometry: new THREE.CylinderGeometry(0.01, 0.01, 0.3, 8), // Long, thin cylinder bulletMaterial: new THREE.MeshStandardMaterial({ color: 0x00ffff, emissive: 0x00ffff }), fireRate: 500, // Slower, powerful shot bulletVelocity: 0.2, // Very fast piercing: true, // Custom property (for future implementation) adds: 5 }, { id: 'homing', name: 'Homing Missile', cost: 1000, playerGeometry: new THREE.CylinderGeometry(0.08, 0.12, 0.2, 5), // Advanced, finned design playerMaterial: new THREE.MeshStandardMaterial({ color: 0x8800ff, emissive: 0x440088 }), bulletGeometry: new THREE.ConeGeometry(0.025, 0.08, 4), // Missile-like shape bulletMaterial: new THREE.MeshStandardMaterial({ color: 0xff00ff, emissive: 0xff00ff }), fireRate: 800, // Very slow, but powerful bulletVelocity: 0.06, // Slower initially homing: true, // Custom property (for future implementation) adds: 6 } ]; let currentShooterIndex = 0; // Default to the first shooter (Basic Orb) // Buffs and Shields let rapidFireTimer = 0; let shieldActive = false; let shieldMesh = null; let currentCpuIndex = 0; // Player ship setup let player = new THREE.Mesh( shooterConfigs[currentShooterIndex].playerGeometry, shooterConfigs[currentShooterIndex].playerMaterial ); player.position.y = -1.3; scene.add(player); // Enemies array let enemies = []; let boss = null; let bossActive = false; let bossHealth = 0; let globalBossSpawned = false; // Bullets array let bullets = []; let powerUps = []; let particles = []; let screenShake = 0; // Game state let score = 0; let isShooting = false; // Flag to indicate if shoot button is held down let highScore = parseInt(localStorage.getItem('voidHighScore') || '0', 10); let savedCredits = parseInt(localStorage.getItem('voidCredits') || '0', 10); let credits = savedCredits; // Initialize credits AFTER savedCredits is defined let playerColor = localStorage.getItem('voidPlayerColor') || '#00ff00'; // Default green let enemyColor = localStorage.getItem('voidEnemyColor') || '#880000'; // Default red for enemies let profilePictureConfig = JSON.parse(localStorage.getItem('voidProfilePictureConfig') || JSON.stringify({shape: 'sphere', color: '#00ff00'})); let hasAdminPanel = false; const colorCustomizationCost = 25; // Cost to change player color const enemyColorCustomizationCost = 50; // Cost to change enemy color const profilePicCustomizationCost = 15; // Cost to change profile picture const skipLevelCost = 100; const adminPanelCost = 3000; let level = 1; let enemiesToNextLevel = 20; let enemiesKilled = 0; let gameStarted = false; let gameOver = false; let levelCompleteMessage = false; let levelCompleteTimer = 0; let baseSpawnRate = 0.015; let lastLoginRewardCheck = parseInt(localStorage.getItem('voidLastLoginRewardCheck') || '0', 10); let usedCodes = new Set(JSON.parse(localStorage.getItem('voidUsedCodes') || '[]')); // Leaderboard let leaderboard = JSON.parse(localStorage.getItem('voidLeaderboard') || JSON.stringify([])); // Skip level button const skipLevelButton = document.createElement('button'); skipLevelButton.innerText = 'Skip Level (100)'; skipLevelButton.style.position = 'absolute'; skipLevelButton.style.top = '160px'; skipLevelButton.style.left = '10px'; skipLevelButton.style.display = 'none'; skipLevelButton.style.padding = '8px 16px'; skipLevelButton.style.fontSize = '16px'; skipLevelButton.style.background = 'linear-gradient(45deg, #ff00ff, #aa00aa)'; skipLevelButton.style.color = 'white'; skipLevelButton.style.border = 'none'; skipLevelButton.style.borderRadius = '5px'; skipLevelButton.style.cursor = 'pointer'; skipLevelButton.style.fontWeight = 'bold'; skipLevelButton.style.boxShadow = '0 4px 8px rgba(255, 0, 255, 0.3)'; document.body.appendChild(skipLevelButton); // Leaderboard button const leaderboardButton = document.createElement('button'); leaderboardButton.innerText = '🏆 Leaderboard'; leaderboardButton.style.position = 'absolute'; leaderboardButton.style.top = '10px'; leaderboardButton.style.left = '220px'; leaderboardButton.style.display = 'none'; leaderboardButton.style.padding = '8px 16px'; leaderboardButton.style.fontSize = '16px'; leaderboardButton.style.background = 'linear-gradient(45deg, #ffd700, #ffaa00)'; leaderboardButton.style.color = 'black'; leaderboardButton.style.border = 'none'; leaderboardButton.style.borderRadius = '5px'; leaderboardButton.style.cursor = 'pointer'; leaderboardButton.style.fontWeight = 'bold'; leaderboardButton.style.boxShadow = '0 4px 8px rgba(255, 215, 0, 0.4)'; document.body.appendChild(leaderboardButton); // Profiles system let activeProfile = localStorage.getItem('voidActiveProfile') || 'default'; const profiles = JSON.parse(localStorage.getItem('voidProfiles') || '[{"name":"default","credits":0,"highScore":0,"playerColor":"#00ff00","enemyColor":"#880000","shooterIndex":0,"profilePicture":{"shape":"sphere","color":"#00ff00"},"usedCodes":[],"friends":[]}]'); const maxProfiles = 5; // let startTime = performance.now(); // UI Buttons - declared once at top level const openShopButton = document.createElement('button'); openShopButton.innerText = 'Open Shop'; openShopButton.style.position = 'absolute'; openShopButton.style.top = '50px'; openShopButton.style.right = '10px'; openShopButton.style.display = 'none'; openShopButton.style.padding = '10px 20px'; openShopButton.style.fontSize = '18px'; openShopButton.style.background = '#ff6600'; openShopButton.style.color = 'white'; openShopButton.style.border = 'none'; openShopButton.style.borderRadius = '5px'; openShopButton.style.cursor = 'pointer'; document.body.appendChild(openShopButton); const codeButton = document.createElement('button'); codeButton.innerText = 'Code'; codeButton.style.position = 'absolute'; codeButton.style.top = '10px'; codeButton.style.right = '10px'; codeButton.style.display = 'none'; codeButton.style.padding = '10px 20px'; codeButton.style.fontSize = '18px'; codeButton.style.background = 'linear-gradient(45deg, #ff6600, #ffd700)'; codeButton.style.color = 'white'; codeButton.style.border = 'none'; codeButton.style.borderRadius = '5px'; codeButton.style.cursor = 'pointer'; codeButton.style.fontWeight = 'bold'; codeButton.style.boxShadow = '0 4px 8px rgba(255, 102, 0, 0.3)'; document.body.appendChild(codeButton); const profileButton = document.createElement('button'); profileButton.innerText = 'Profile'; profileButton.style.position = 'absolute'; profileButton.style.top = '90px'; profileButton.style.right = '10px'; profileButton.style.display = 'none'; profileButton.style.padding = '10px 20px'; profileButton.style.fontSize = '18px'; profileButton.style.background = 'linear-gradient(45deg, #9932cc, #8a2be2)'; profileButton.style.color = 'white'; profileButton.style.border = 'none'; profileButton.style.borderRadius = '5px'; profileButton.style.cursor = 'pointer'; profileButton.style.fontWeight = 'bold'; profileButton.style.boxShadow = '0 4px 8px rgba(153, 50, 204, 0.3)'; document.body.appendChild(profileButton); const newProfileButton = document.createElement('button'); newProfileButton.innerText = 'New Profile'; newProfileButton.style.position = 'absolute'; newProfileButton.style.top = '130px'; newProfileButton.style.right = '10px'; newProfileButton.style.display = 'none'; newProfileButton.style.padding = '10px 15px'; newProfileButton.style.fontSize = '16px'; newProfileButton.style.background = '#32cd32'; newProfileButton.style.color = 'white'; newProfileButton.style.border = 'none'; newProfileButton.style.borderRadius = '5px'; newProfileButton.style.cursor = 'pointer'; document.body.appendChild(newProfileButton); const codeCopyMessage = document.createElement('div'); codeCopyMessage.style.position = 'absolute'; codeCopyMessage.style.top = '45px'; codeCopyMessage.style.right = '10px'; codeCopyMessage.style.backgroundColor = 'rgba(0, 150, 0, 0.9)'; codeCopyMessage.style.color = 'white'; codeCopyMessage.style.padding = '8px 16px'; codeCopyMessage.style.borderRadius = '5px'; codeCopyMessage.style.fontSize = '16px'; codeCopyMessage.style.fontFamily = 'Arial'; codeCopyMessage.style.display = 'none'; codeCopyMessage.innerText = 'Code copied!'; document.body.appendChild(codeCopyMessage); const leaderboardElement = document.createElement('div'); leaderboardElement.style.position = 'absolute'; leaderboardElement.style.top = '50%'; leaderboardElement.style.left = '50%'; leaderboardElement.style.transform = 'translate(-50%, -50%)'; leaderboardElement.style.backgroundColor = 'rgba(0, 0, 50, 0.95)'; leaderboardElement.style.border = '2px solid #ffd700'; leaderboardElement.style.borderRadius = '10px'; leaderboardElement.style.padding = '20px'; leaderboardElement.style.color = 'white'; leaderboardElement.style.fontSize = '20px'; leaderboardElement.style.fontFamily = 'Arial'; leaderboardElement.style.textAlign = 'center'; leaderboardElement.style.display = 'none'; leaderboardElement.style.zIndex = '100'; leaderboardElement.style.flexDirection = 'column'; leaderboardElement.style.gap = '15px'; leaderboardElement.style.minWidth = '400px'; leaderboardElement.style.maxHeight = '70vh'; leaderboardElement.style.overflowY = 'auto'; leaderboardElement.innerHTML = `

🏆 Global Leaderboard

`; document.body.appendChild(leaderboardElement); const leaderboardList = leaderboardElement.querySelector('#leaderboardList'); const closeLeaderboardButton = leaderboardElement.querySelector('#closeLeaderboardButton'); const leaderboardNameInput = leaderboardElement.querySelector('#leaderboardNameInput'); const submitScoreButton = leaderboardElement.querySelector('#submitScoreButton'); let pendingHighScore = null; submitScoreButton.addEventListener('click', () => { const name = leaderboardNameInput.value.trim(); if (!name || name.length < 2 || name.length > 12 || /[^a-zA-Z0-9 ]/.test(name)) { alert('Name must be 2-12 chars, letters/numbers/spaces only!'); return; } if (pendingHighScore !== null) { submitToLeaderboard(pendingHighScore, name); updateLeaderboardUI(); pendingHighScore = null; submitScoreButton.style.display = 'none'; leaderboardNameInput.style.display = 'none'; } }); const codeRedeemElement = document.createElement('div'); codeRedeemElement.style.position = 'absolute'; codeRedeemElement.style.top = '50%'; codeRedeemElement.style.left = '50%'; codeRedeemElement.style.transform = 'translate(-50%, -50%)'; codeRedeemElement.style.backgroundColor = 'rgba(0, 0, 50, 0.9)'; codeRedeemElement.style.border = '2px solid #ffd700'; codeRedeemElement.style.borderRadius = '10px'; codeRedeemElement.style.padding = '20px'; codeRedeemElement.style.color = 'white'; codeRedeemElement.style.fontSize = '18px'; codeRedeemElement.style.fontFamily = 'Arial'; codeRedeemElement.style.textAlign = 'center'; codeRedeemElement.style.display = 'none'; // Hidden by default codeRedeemElement.style.zIndex = '100'; codeRedeemElement.style.flexDirection = 'column'; codeRedeemElement.style.gap = '15px'; codeRedeemElement.style.minWidth = '300px'; codeRedeemElement.innerHTML = `

Redeem Code

`; document.body.appendChild(codeRedeemElement); const redeemCodeInput = codeRedeemElement.querySelector('#redeemCodeInput'); const redeemButton = codeRedeemElement.querySelector('#redeemCodeButton'); const redeemMessage = codeRedeemElement.querySelector('#redeemMessage'); const closeCodeButton = codeRedeemElement.querySelector('#closeCodeButton'); const profileElement = document.createElement('div'); profileElement.style.position = 'absolute'; profileElement.style.top = '50%'; profileElement.style.left = '50%'; profileElement.style.transform = 'translate(-50%, -50%)'; profileElement.style.backgroundColor = 'rgba(0, 0, 50, 0.95)'; profileElement.style.border = '2px solid #9932cc'; profileElement.style.borderRadius = '10px'; profileElement.style.padding = '20px'; profileElement.style.color = 'white'; profileElement.style.fontSize = '18px'; profileElement.style.fontFamily = 'Arial'; profileElement.style.textAlign = 'center'; profileElement.style.display = 'none'; profileElement.style.zIndex = '100'; profileElement.style.flexDirection = 'column'; profileElement.style.gap = '15px'; profileElement.style.minWidth = '350px'; profileElement.style.maxHeight = '70vh'; profileElement.style.overflowY = 'auto'; profileElement.innerHTML = `

Profile Manager

`; document.body.appendChild(profileElement); const profilesSection = profileElement.querySelector('#profilesSection'); const profileListElement = profileElement.querySelector('#profileList') || profilesSection; const newProfileInput = profileElement.querySelector('#newProfileInput'); const createProfileButton = profileElement.querySelector('#createProfileButton'); const profileMessage = profileElement.querySelector('#profileMessage'); const closeProfileButton = profileElement.querySelector('#closeProfileButton'); let lastShotTime = 0; // For fire rate control let profileOpen = false; // Profile management functions function saveToProfile(profileName) { const profile = profiles.find(p => p.name === profileName); if (profile) { profile.credits = credits; profile.highScore = highScore; profile.playerColor = playerColor; profile.enemyColor = enemyColor; profile.shooterIndex = currentShooterIndex; profile.profilePicture = profilePictureConfig; profile.hasAdminPanel = hasAdminPanel; profile.usedCodes = [...usedCodes]; profile.friends = profile.friends || []; localStorage.setItem('voidProfiles', JSON.stringify(profiles)); localStorage.setItem('voidActiveProfile', profileName); localStorage.setItem('voidProfilePictureConfig', JSON.stringify(profilePictureConfig)); activeProfile = profileName; } } function updateLeaderboard() { localStorage.setItem('voidLeaderboard', JSON.stringify(leaderboard)); } function triggerLeaderboardCelebration(playerName, rank) { celebrationActive = true; celebrationTimer = 0; // Screen flash const flashDiv = document.createElement('div'); flashDiv.style.position = 'fixed'; flashDiv.style.top = '0'; flashDiv.style.left = '0'; flashDiv.style.width = '100vw'; flashDiv.style.height = '100vh'; flashDiv.style.backgroundColor = 'rgba(255, 215, 0, 0.8)'; flashDiv.style.zIndex = '1000'; flashDiv.style.animation = 'flash 0.5s ease-out'; document.body.appendChild(flashDiv); setTimeout(() => document.body.removeChild(flashDiv), 500); // Create trophy const trophyGroup = new THREE.Group(); const baseGeometry = new THREE.CylinderGeometry(0.15, 0.2, 0.1, 12); const baseMaterial = new THREE.MeshStandardMaterial({ color: 0x8B4513, metalness: 0.3, roughness: 0.4 }); const base = new THREE.Mesh(baseGeometry, baseMaterial); base.position.y = -0.15; trophyGroup.add(base); const cupGeometry = new THREE.ConeGeometry(0.12, 0.3, 12); const cupMaterial = new THREE.MeshStandardMaterial({ color: 0xFFD700, metalness: 0.9, roughness: 0.1, emissive: 0xFFAA00, emissiveIntensity: 0.3 }); const cup = new THREE.Mesh(cupGeometry, cupMaterial); cup.position.y = 0.2; trophyGroup.add(cup); trophyGroup.position.set(0, 0, -2); celebrationGroup.add(trophyGroup); // Confetti burst for (let i = 0; i < 100; i++) { const confettiGeometry = new THREE.BoxGeometry(0.03, 0.03, 0.03); const confettiColors = [0xFF6B6B, 0x4ECDC4, 0x45B7D1, 0x96CEB4, 0xFFEAA7, 0xDDA0DD]; const confettiMaterial = new THREE.MeshBasicMaterial({ color: confettiColors[Math.floor(Math.random() * confettiColors.length)] }); const confetti = new THREE.Mesh(confettiGeometry, confettiMaterial); confetti.position.set( (Math.random() - 0.5) * 4, 0, -2 + (Math.random() - 0.5) * 2 ); confetti.rotation.set( Math.random() * Math.PI, Math.random() * Math.PI, Math.random() * Math.PI ); confetti.userData = { velocityX: (Math.random() - 0.5) * 0.1, velocityY: 0.05 + Math.random() * 0.05, velocityZ: (Math.random() - 0.5) * 0.02, life: 300, rotationSpeed: (Math.random() - 0.5) * 0.2 }; celebrationGroup.add(confetti); } // Particle explosion for (let i = 0; i < 50; i++) { const particleGeometry = new THREE.SphereGeometry(0.02, 6, 6); const particleMaterial = new THREE.MeshBasicMaterial({ color: new THREE.Color().setHSL(Math.random() * 0.1 + 0.55, 1, 0.7) }); const particle = new THREE.Mesh(particleGeometry, particleMaterial); particle.position.set(0, 0, -2); particle.userData = { velocityX: (Math.random() - 0.5) * 0.15, velocityY: (Math.random() - 0.5) * 0.15, velocityZ: (Math.random() - 0.5) * 0.1, life: 120, fadeStart: 60 }; celebrationGroup.add(particle); } } function submitToLeaderboard(score, playerName) { leaderboard.push({ name: playerName, profile: activeProfile, score: score, date: new Date().toISOString() }); // Sort by score descending leaderboard.sort((a, b) => b.score - a.score); // Keep only top 10 leaderboard = leaderboard.slice(0, 10); // Trigger celebration for top 3 const newRank = leaderboard.findIndex(entry => entry.name === playerName && entry.score === score); if (newRank >= 0 && newRank < 3) { triggerLeaderboardCelebration(playerName, newRank + 1); } updateLeaderboard(); } function showLeaderboard() { leaderboardElement.style.display = 'flex'; submitScoreButton.style.display = pendingHighScore !== null ? 'inline-block' : 'none'; leaderboardNameInput.style.display = pendingHighScore !== null ? 'inline-block' : 'none'; if (pendingHighScore !== null) { leaderboardNameInput.placeholder = `New High Score: ${pendingHighScore.toLocaleString()}`; leaderboardNameInput.focus(); } updateLeaderboardUI(); } function hideLeaderboard() { leaderboardElement.style.display = 'none'; leaderboardButton.style.display = 'block'; } function updateLeaderboardUI() { leaderboardList.innerHTML = ''; // Show pending high score at top if exists if (pendingHighScore !== null) { const pendingDiv = document.createElement('div'); pendingDiv.style.padding = '12px'; pendingDiv.style.borderBottom = '2px solid #00ff00'; pendingDiv.style.backgroundColor = 'rgba(0, 255, 0, 0.2)'; pendingDiv.style.textAlign = 'center'; pendingDiv.innerHTML = `YOUR NEW HIGH SCORE: ${pendingHighScore.toLocaleString()}
Submit above to appear on leaderboard!`; leaderboardList.appendChild(pendingDiv); } if (leaderboard.length === 0) { const noScoresDiv = document.createElement('div'); noScoresDiv.innerHTML = 'No scores yet!
Be the first!'; noScoresDiv.style.padding = '20px'; noScoresDiv.style.color = '#888'; leaderboardList.appendChild(noScoresDiv); return; } leaderboard.forEach((entry, index) => { const entryDiv = document.createElement('div'); entryDiv.style.padding = '12px'; entryDiv.style.borderBottom = '1px solid #444'; entryDiv.style.display = 'flex'; entryDiv.style.justifyContent = 'space-between'; entryDiv.style.alignItems = 'center'; entryDiv.style.backgroundColor = index === 0 ? 'rgba(255, 215, 0, 0.3)' : index === 1 ? 'rgba(192, 192, 192, 0.3)' : index === 2 ? 'rgba(205, 127, 50, 0.3)' : 'transparent'; const rankSpan = document.createElement('span'); rankSpan.style.fontSize = '24px'; rankSpan.style.fontWeight = 'bold'; rankSpan.innerText = (index + 1) + '.'; rankSpan.style.minWidth = '30px'; rankSpan.style.color = index === 0 ? '#ffd700' : index === 1 ? '#c0c0c0' : index === 2 ? '#cd7f32' : 'white'; const nameSpan = document.createElement('span'); nameSpan.innerHTML = `${entry.name}
${entry.profile}`; nameSpan.style.textAlign = 'left'; nameSpan.style.flex = 1; nameSpan.style.marginLeft = '10px'; const scoreSpan = document.createElement('span'); scoreSpan.innerText = entry.score.toLocaleString(); scoreSpan.style.fontSize = '20px'; scoreSpan.style.fontWeight = 'bold'; scoreSpan.style.color = '#ffd700'; entryDiv.appendChild(rankSpan); entryDiv.appendChild(nameSpan); entryDiv.appendChild(scoreSpan); leaderboardList.appendChild(entryDiv); }); } // Leaderboard event handlers leaderboardButton.addEventListener('click', () => { leaderboardButton.style.display = 'none'; showLeaderboard(); }); closeLeaderboardButton.addEventListener('click', hideLeaderboard); document.addEventListener('keydown', (e) => { if (e.code === 'Escape' && leaderboardElement.style.display !== 'none') { hideLeaderboard(); } }); function loadProfile(profileName) { if (pendingHighScore !== null) { pendingHighScore = null; } const profile = profiles.find(p => p.name === profileName); if (profile) { credits = profile.credits || 0; highScore = profile.highScore || 0; playerColor = profile.playerColor || '#00ff00'; enemyColor = profile.enemyColor || '#880000'; currentShooterIndex = profile.shooterIndex || 0; profilePictureConfig = profile.profilePicture || {shape: 'sphere', color: '#00ff00'}; hasAdminPanel = profile.hasAdminPanel || false; usedCodes = new Set(profile.usedCodes || []); // Update player mesh with new shooter and color scene.remove(player); if (player.geometry) player.geometry.dispose(); if (player.material) { if (Array.isArray(player.material)) { player.material.forEach(mat => mat?.dispose()); } else { player.material.dispose(); } } const currentConfig = shooterConfigs[currentShooterIndex]; const playerMat = currentConfig.playerMaterial.clone(); player = new THREE.Mesh(currentConfig.playerGeometry, playerMat); player.position.y = -1.3; scene.add(player); changePlayerColor(playerColor); saveToProfile(profileName); updateScoreUI(); } } function createNewProfile(profileName) { if (profiles.length >= maxProfiles) { return false; } if (profiles.find(p => p.name.toLowerCase() === profileName.toLowerCase())) { return false; } profiles.push({ name: profileName, credits: 0, highScore: 0, playerColor: '#00ff00', enemyColor: '#880000', shooterIndex: 0, profilePicture: {shape: 'sphere', color: '#00ff00'}, hasAdminPanel: false, usedCodes: [], friends: [] }); localStorage.setItem('voidProfiles', JSON.stringify(profiles)); return true; } function deleteProfile(profileName) { const index = profiles.findIndex(p => p.name === profileName); if (index > -1 && profiles.length > 1) { // Keep at least one profile profiles.splice(index, 1); if (activeProfile === profileName) { activeProfile = profiles[0].name; loadProfile(activeProfile); } localStorage.setItem('voidProfiles', JSON.stringify(profiles)); localStorage.setItem('voidActiveProfile', activeProfile); return true; } return false; } function updateProfileUI() { profileListElement.innerHTML = ''; profiles.forEach(profile => { const profileDiv = document.createElement('div'); profileDiv.style.padding = '12px'; profileDiv.style.border = `2px solid ${activeProfile === profile.name ? '#32cd32' : '#444'}`; profileDiv.style.borderRadius = '8px'; profileDiv.style.backgroundColor = 'rgba(0, 0, 0, 0.5)'; profileDiv.style.marginBottom = '10px'; profileDiv.style.display = 'flex'; profileDiv.style.justifyContent = 'space-between'; profileDiv.style.alignItems = 'center'; const profilePreviewCanvas = document.createElement('canvas'); profilePreviewCanvas.width = 40; profilePreviewCanvas.height = 40; profilePreviewCanvas.style.borderRadius = '50%'; profilePreviewCanvas.style.border = '2px solid #444'; const previewCtx = profilePreviewCanvas.getContext('2d'); previewCtx.fillStyle = profile.profilePicture?.color || '#00ff00'; previewCtx.beginPath(); if (profile.profilePicture?.shape === 'cone') { previewCtx.moveTo(20, 5); previewCtx.lineTo(5, 35); previewCtx.lineTo(35, 35); } else if (profile.profilePicture?.shape === 'cylinder') { previewCtx.rect(8, 8, 24, 24); } else { previewCtx.arc(20, 20, 18, 0, Math.PI * 2); } previewCtx.fill(); const infoSpan = document.createElement('span'); infoSpan.innerHTML = ` ${profile.name}
Credits: ${profile.credits} | High: ${profile.highScore} `; infoSpan.style.marginLeft = '10px'; const buttonsDiv = document.createElement('div'); buttonsDiv.style.display = 'flex'; buttonsDiv.style.gap = '5px'; const loadBtn = document.createElement('button'); loadBtn.innerText = activeProfile === profile.name ? 'Active' : 'Load'; loadBtn.style.padding = '6px 12px'; loadBtn.style.fontSize = '12px'; loadBtn.style.borderRadius = '4px'; loadBtn.style.border = 'none'; loadBtn.style.cursor = 'pointer'; loadBtn.style.background = activeProfile === profile.name ? '#32cd32' : '#0077ff'; loadBtn.style.color = 'white'; loadBtn.disabled = activeProfile === profile.name; loadBtn.onclick = () => { saveToProfile(activeProfile); loadProfile(profile.name); updateProfileUI(); profileMessage.innerHTML = `Loaded profile: ${profile.name}`; profileMessage.style.backgroundColor = 'rgba(0, 150, 0, 0.9)'; profileMessage.style.color = 'white'; profileMessage.style.display = 'block'; setTimeout(() => profileMessage.style.display = 'none', 2000); }; const deleteBtn = document.createElement('button'); deleteBtn.innerText = 'Delete'; deleteBtn.style.padding = '6px 12px'; deleteBtn.style.fontSize = '12px'; deleteBtn.style.borderRadius = '4px'; deleteBtn.style.border = 'none'; deleteBtn.style.cursor = 'pointer'; deleteBtn.style.background = '#ff4444'; deleteBtn.style.color = 'white'; deleteBtn.onclick = () => { if (confirm(`Delete profile "${profile.name}"? This cannot be undone.`)) { if (deleteProfile(profile.name)) { updateProfileUI(); profileMessage.innerHTML = `Deleted: ${profile.name}`; profileMessage.style.backgroundColor = 'rgba(150, 0, 0, 0.9)'; profileMessage.style.color = 'white'; profileMessage.style.display = 'block'; setTimeout(() => profileMessage.style.display = 'none', 2000); } else { profileMessage.innerHTML = 'Cannot delete: only 1 profile left or active profile'; profileMessage.style.backgroundColor = 'rgba(150, 0, 0, 0.9)'; profileMessage.style.color = 'white'; profileMessage.style.display = 'block'; setTimeout(() => profileMessage.style.display = 'none', 2000); } } }; buttonsDiv.appendChild(loadBtn); buttonsDiv.appendChild(deleteBtn); profileDiv.appendChild(profilePreviewCanvas); profileDiv.appendChild(infoSpan); profileDiv.appendChild(buttonsDiv); profileListElement.appendChild(profileDiv); }); } function showProfileManager() { profileOpen = true; profileElement.style.display = 'flex'; updateProfileUI(); newProfileInput.focus(); } function hideProfileManager() { profileOpen = false; profileElement.style.display = 'none'; openShopButton.style.display = 'block'; codeButton.style.display = 'block'; profileButton.style.display = 'block'; newProfileButton.style.display = 'block'; profileMessage.style.display = 'none'; } // Profile event handlers profileButton.addEventListener('click', () => showProfileManager()); const newProfileHandler = () => { const name = newProfileInput.value.trim(); if (!name) { profileMessage.innerHTML = 'Enter a profile name!'; profileMessage.style.backgroundColor = 'rgba(150, 0, 0, 0.9)'; profileMessage.style.color = 'white'; profileMessage.style.display = 'block'; setTimeout(() => profileMessage.style.display = 'none', 2000); return; } if (createNewProfile(name)) { newProfileInput.value = ''; updateProfileUI(); profileMessage.innerHTML = `Created: ${name}`; profileMessage.style.backgroundColor = 'rgba(0, 150, 0, 0.9)'; profileMessage.style.color = 'white'; profileMessage.style.display = 'block'; setTimeout(() => profileMessage.style.display = 'none', 2000); } else { profileMessage.innerHTML = 'Profile exists or max 5 profiles reached!'; profileMessage.style.backgroundColor = 'rgba(150, 0, 0, 0.9)'; profileMessage.style.color = 'white'; profileMessage.style.display = 'block'; setTimeout(() => profileMessage.style.display = 'none', 2000); } }; createProfileButton.addEventListener('click', newProfileHandler); newProfileInput.addEventListener('keypress', (e) => { if (e.key === 'Enter') newProfileHandler(); }); closeProfileButton.addEventListener('click', hideProfileManager); // --- Game Reset Function --- // This function resets all game-related state for a new game or restart. function resetGame() { if (pendingHighScore !== null) { pendingHighScore = null; } saveToProfile(activeProfile); // Save current profile before reset shopOpen = false; // Ensure shop is closed on reset hideShop(); // Make sure shop UI is hidden hideLeaderboard(); levelCompleteMessage = false; levelCompleteElement.style.display = 'none'; skipLevelButton.style.display = 'none'; // Hide skip button on reset leaderboardButton.style.display = 'block'; // Clear existing enemies from scene and array enemies.forEach(enemy => { scene.remove(enemy.mesh); if (enemy.mesh.traverse) { // Enemy mesh is a Group enemy.mesh.traverse(child => { if (child.isMesh) { if (child.geometry) child.geometry.dispose(); if (child.material) { if (Array.isArray(child.material)) { child.material.forEach(mat => mat?.dispose()); } else { child.material.dispose(); } } } }); } else { // Fallback for simple meshes (though enemies are Groups) if (enemy.mesh.geometry) enemy.mesh.geometry.dispose(); if (enemy.mesh.material) { if (Array.isArray(enemy.mesh.material)) { enemy.mesh.material.forEach(mat => mat?.dispose()); } else { enemy.mesh.material.dispose(); } } } }); enemies = []; // Clear power-ups powerUps.forEach(powerUp => { scene.remove(powerUp.mesh); powerUp.mesh.traverse(child => { if (child.isMesh) { if (child.geometry) child.geometry.dispose(); if (child.material) { if (Array.isArray(child.material)) { child.material.forEach(mat => mat?.dispose()); } else { child.material.dispose(); } } } }); }); powerUps = []; // Clear existing bullets from scene and array bullets.forEach(bullet => { scene.remove(bullet.mesh); if (bullet.mesh.geometry) { bullet.mesh.geometry.dispose(); } if (bullet.mesh.material) { if (Array.isArray(bullet.mesh.material)) { bullet.mesh.material.forEach(mat => mat?.dispose()); } else { bullet.mesh.material.dispose(); } } }); bullets = []; // Clear existing boss from scene if (boss) { scene.remove(boss.mesh); if (boss.mesh.traverse) { // Boss mesh is a Group (or Mesh with children) boss.mesh.traverse(child => { if (child.isMesh) { if (child.geometry) child.geometry.dispose(); if (child.material) { if (Array.isArray(child.material)) { child.material.forEach(mat => mat?.dispose()); } else { child.material.dispose(); } } } }); } else { // Fallback for simple meshes if (boss.mesh.geometry) boss.mesh.geometry.dispose(); if (boss.mesh.material) { if (Array.isArray(boss.mesh.material)) { boss.mesh.material.forEach(mat => mat?.dispose()); } else { boss.mesh.material.dispose(); } } } boss = null; } bossActive = false; bossHealth = 0; // Reset player position player.position.set(0, -1.3, 0); // Reset game state variables score = 0; loadProfile(activeProfile); level = 1; enemiesToNextLevel = 20; // Reset for next level progression enemiesKilled = 0; gameOver = false; gameStarted = true; // Game starts immediately after reset globalBossSpawned = false; hideShop(); // Make sure shop UI is hidden openShopButton.style.display = 'block'; codeButton.style.display = 'block'; profileButton.style.display = 'block'; newProfileButton.style.display = 'block'; skipLevelButton.style.display = 'none'; // Clear power-ups powerUps.forEach(powerUp => { scene.remove(powerUp.mesh); powerUp.mesh.traverse(child => { if (child.isMesh) { if (child.geometry) child.geometry.dispose(); if (child.material) { if (Array.isArray(child.material)) { child.material.forEach(mat => mat?.dispose()); } else { child.material.dispose(); } } } }); }); powerUps = []; // Re-create player mesh with current shooter config scene.remove(player); // Remove old player mesh if (player.geometry) { player.geometry.dispose(); } if (player.material) { if (Array.isArray(player.material)) { player.material.forEach(mat => mat?.dispose()); } else { player.material.dispose(); } } const currentConfig = shooterConfigs[currentShooterIndex]; // Clone the material to ensure individual color changes don't affect other configs const playerMat = currentConfig.playerMaterial.clone(); player = new THREE.Mesh(currentConfig.playerGeometry, playerMat); player.position.y = -1.3; player.position.x = 0; scene.add(player); changePlayerColor(playerColor); // Apply the saved player color // Update UI elements scoreElement.innerHTML = `Score: ${score}
High Score: ${highScore}
Level: ${level}
Credits: ${credits}`; gameOverElement.style.display = 'none'; startScreenElement.style.display = 'none'; // Ensure start screen is hidden } // UI elements const scoreElement = document.createElement('div'); scoreElement.style.position = 'absolute'; scoreElement.style.top = '10px'; scoreElement.style.left = '10px'; scoreElement.style.color = 'white'; scoreElement.style.fontSize = '26px'; scoreElement.style.fontFamily = 'Arial'; scoreElement.style.backgroundColor = 'rgba(0, 0, 0, 0.8)'; scoreElement.style.padding = '12px'; scoreElement.style.borderRadius = '8px'; scoreElement.style.boxShadow = '0 2px 8px rgba(0,0,0,0.5)'; scoreElement.style.textShadow = '1px 1px 2px rgba(0,0,0,0.8)'; scoreElement.innerHTML = `Score: ${score}
High Score: ${highScore}
Level: ${level}
Credits: ${credits}`; document.body.appendChild(scoreElement); const holidayBanner = document.createElement('div'); holidayBanner.style.position = 'absolute'; holidayBanner.style.top = '10px'; holidayBanner.style.left = '50%'; holidayBanner.style.transform = 'translateX(-50%)'; holidayBanner.style.color = currentHoliday.colors[0] === 0x000000 ? '#ffffff' : `#${currentHoliday.colors[0].toString(16).padStart(6, '0')}`; holidayBanner.style.fontSize = '28px'; holidayBanner.style.fontFamily = 'Arial Black, sans-serif'; holidayBanner.style.textAlign = 'center'; holidayBanner.style.textShadow = '0 0 10px rgba(255,255,255,0.5)'; holidayBanner.style.zIndex = '40'; holidayBanner.style.display = 'none'; holidayBanner.innerHTML = `${currentHoliday.emoji} Happy ${currentHoliday.name}! ${currentHoliday.emoji}`; document.body.appendChild(holidayBanner); // Show leaderboard button visibility leaderboardButton.style.display = gameStarted ? 'block' : 'none'; // Skip level function function skipLevel() { if (gameOver || !gameStarted || levelCompleteMessage) return; if (credits < skipLevelCost) { // Show error message (you can enhance this with a proper UI element later) console.log('Not enough credits! Need 100 credits to skip level.'); return; } // Clear current enemies enemies.forEach(enemy => { scene.remove(enemy.mesh); if (enemy.mesh.traverse) { enemy.mesh.traverse(child => { if (child.isMesh) { if (child.geometry) child.geometry.dispose(); if (child.material) { if (Array.isArray(child.material)) { child.material.forEach(mat => mat?.dispose()); } else { child.material.dispose(); } } } }); } }); enemies = []; // Clear boss if active if (boss) { scene.remove(boss.mesh); if (boss.mesh.traverse) { boss.mesh.traverse(child => { if (child.isMesh) { if (child.geometry) child.geometry.dispose(); if (child.material) { if (Array.isArray(child.material)) { child.material.forEach(mat => mat?.dispose()); } else { child.material.dispose(); } } } }); } boss = null; } bossActive = false; // Advance level level++; enemiesToNextLevel += 8; enemiesKilled = 0; globalBossSpawned = false; credits -= skipLevelCost; saveGameData(); updateScoreUI(); } skipLevelButton.addEventListener('click', skipLevel); const loginRewardMessageElement = document.createElement('div'); loginRewardMessageElement.style.position = 'absolute'; loginRewardMessageElement.style.top = '50%'; loginRewardMessageElement.style.left = '50%'; loginRewardMessageElement.style.transform = 'translate(-50%, -50%)'; loginRewardMessageElement.style.backgroundColor = 'rgba(0, 100, 0, 0.9)'; // Dark green loginRewardMessageElement.style.border = '2px solid #00ff00'; loginRewardMessageElement.style.borderRadius = '10px'; loginRewardMessageElement.style.padding = '20px'; loginRewardMessageElement.style.color = 'white'; loginRewardMessageElement.style.fontSize = '28px'; loginRewardMessageElement.style.fontFamily = 'Arial'; loginRewardMessageElement.style.textAlign = 'center'; loginRewardMessageElement.style.display = 'none'; // Hidden by default loginRewardMessageElement.style.zIndex = '101'; // Above shop document.body.appendChild(loginRewardMessageElement); const shopElement = document.createElement('div'); shopElement.style.position = 'absolute'; shopElement.style.top = '50%'; shopElement.style.left = '50%'; shopElement.style.transform = 'translate(-50%, -50%)'; shopElement.style.backgroundColor = 'rgba(0, 0, 50, 0.9)'; // Dark blue transparent background shopElement.style.border = '2px solid #ff6600'; shopElement.style.borderRadius = '10px'; shopElement.style.padding = '20px'; shopElement.style.color = 'white'; shopElement.style.fontSize = '18px'; shopElement.style.fontFamily = 'Arial'; shopElement.style.textAlign = 'center'; shopElement.style.display = 'none'; // Hidden by default shopElement.style.zIndex = '100'; // Ensure it's on top shopElement.style.width = 'fit-content'; // Fit content, allowing it to expand shopElement.style.minWidth = '280px'; // Ensure a minimum width for readability shopElement.style.maxWidth = '90%'; // Max width for larger screens shopElement.style.maxHeight = '90%'; // Max height for scrolling shopElement.style.overflowY = 'auto'; // Enable vertical scrolling shopElement.style.display = 'flex'; // Use flexbox for overall shop layout shopElement.style.flexDirection = 'column'; // Arrange content vertically shopElement.style.alignItems = 'center'; // Center items horizontally shopElement.style.gap = '20px'; // Space between shop header, items, and close button shopElement.style.display = 'none'; // Hidden by default shopElement.innerHTML = `

Void Shop

Player Color Customization

Cost: ${colorCustomizationCost} Credits

Enemy Color Customization

Cost: ${enemyColorCustomizationCost} Credits

Profile Picture Customization

Cost: ${profilePicCustomizationCost} Credits

Shape:

`; document.body.appendChild(shopElement); const shopItemsElement = shopElement.querySelector('#shopItems'); const closeShopButton = shopElement.querySelector('#closeShopButton'); const playerColorInput = shopElement.querySelector('#playerColorInput'); const applyPlayerColorButton = shopElement.querySelector('#applyPlayerColorButton'); const playerColorMessage = shopElement.querySelector('#playerColorMessage'); const enemyColorInput = shopElement.querySelector('#enemyColorInput'); const applyEnemyColorButton = shopElement.querySelector('#applyEnemyColorButton'); const enemyColorMessage = shopElement.querySelector('#enemyColorMessage'); const profilePicShapeSelect = shopElement.querySelector('#profilePicShape'); const profilePicColorInput = shopElement.querySelector('#profilePicColorInput'); const applyProfilePicButton = shopElement.querySelector('#applyProfilePicButton'); const profilePicMessage = shopElement.querySelector('#profilePicMessage'); const resetPlayerColorButton = shopElement.querySelector('#resetPlayerColorButton'); const resetEnemyColorButton = shopElement.querySelector('#resetEnemyColorButton'); const resetProfilePicButton = shopElement.querySelector('#resetProfilePicButton'); const startScreenElement = document.createElement('div'); startScreenElement.style.position = 'absolute'; startScreenElement.style.top = '0'; startScreenElement.style.left = '0'; startScreenElement.style.width = '100vw'; startScreenElement.style.height = '100vh'; startScreenElement.style.background = 'linear-gradient(135deg, #000011 0%, #110022 50%, #000011 100%)'; startScreenElement.style.display = 'flex'; startScreenElement.style.flexDirection = 'column'; startScreenElement.style.justifyContent = 'center'; startScreenElement.style.alignItems = 'center'; startScreenElement.style.textAlign = 'center'; startScreenElement.style.zIndex = '50'; document.body.appendChild(startScreenElement); // Cover scene setup const coverScene = new THREE.Scene(); coverScene.fog = new THREE.Fog(0x000022, 1, 15); const coverCamera = new THREE.PerspectiveCamera(70, window.innerWidth / window.innerHeight, 0.1, 100); coverCamera.position.set(0, 0, 3); const coverRenderer = new THREE.WebGLRenderer({ antialias: true, alpha: true }); coverRenderer.setSize(window.innerWidth, window.innerHeight); coverRenderer.setClearColor(0x000000, 0); const coverContainer = document.createElement('div'); coverContainer.style.position = 'absolute'; coverContainer.style.top = '0'; coverContainer.style.left = '0'; coverContainer.style.width = '100%'; coverContainer.style.height = '100%'; startScreenElement.appendChild(coverContainer); coverContainer.appendChild(coverRenderer.domElement); // Stars for cover const starsGeometry = new THREE.BufferGeometry(); const starsCount = 500; const starPositions = new Float32Array(starsCount * 3); for (let i = 0; i < starsCount * 3; i += 3) { starPositions[i] = (Math.random() - 0.5) * 20; starPositions[i + 1] = (Math.random() - 0.5) * 20; starPositions[i + 2] = (Math.random() - 0.5) * 20; } starsGeometry.setAttribute('position', new THREE.BufferAttribute(starPositions, 3)); const starsMaterial = new THREE.PointsMaterial({ color: 0xffffff, size: 0.02 }); const stars = new THREE.Points(starsGeometry, starsMaterial); coverScene.add(stars); // Spaceship model function createSpaceship() { const shipGroup = new THREE.Group(); // Fuselage const fuselageGeometry = new THREE.CylinderGeometry(0.15, 0.12, 0.8, 12); const fuselageMaterial = new THREE.MeshStandardMaterial({ color: 0x4a90e2, metalness: 0.8, roughness: 0.2, emissive: 0x112244, emissiveIntensity: 0.3 }); const fuselage = new THREE.Mesh(fuselageGeometry, fuselageMaterial); fuselage.rotation.z = Math.PI / 2; shipGroup.add(fuselage); // Cockpit const cockpitGeometry = new THREE.SphereGeometry(0.18, 16, 16); const cockpitMaterial = new THREE.MeshStandardMaterial({ color: 0x88ccff, emissive: 0x336699, emissiveIntensity: 0.4, transparent: true, opacity: 0.8 }); const cockpit = new THREE.Mesh(cockpitGeometry, cockpitMaterial); cockpit.position.set(0, 0, 0.3); shipGroup.add(cockpit); // Wings const wingGeometry = new THREE.BoxGeometry(0.6, 0.03, 0.25); const wingMaterial = new THREE.MeshStandardMaterial({ color: 0x336699, metalness: 0.6, roughness: 0.3 }); const leftWing = new THREE.Mesh(wingGeometry, wingMaterial); leftWing.position.set(-0.35, 0, 0); leftWing.rotation.y = Math.PI / 6; shipGroup.add(leftWing); const rightWing = new THREE.Mesh(wingGeometry, wingMaterial); rightWing.position.set(0.35, 0, 0); rightWing.rotation.y = -Math.PI / 6; shipGroup.add(rightWing); // Engines const engineGeometry = new THREE.CylinderGeometry(0.08, 0.1, 0.25, 8); const engineMaterial = new THREE.MeshStandardMaterial({ color: 0x222244, emissive: 0x0066ff, emissiveIntensity: 0.6 }); const leftEngine = new THREE.Mesh(engineGeometry, engineMaterial); leftEngine.rotation.z = Math.PI / 2; leftEngine.position.set(-0.2, -0.25, -0.35); shipGroup.add(leftEngine); const rightEngine = new THREE.Mesh(engineGeometry, engineMaterial); rightEngine.rotation.z = Math.PI / 2; rightEngine.position.set(0.2, -0.25, -0.35); shipGroup.add(rightEngine); // Engine glow const glowGeometry = new THREE.SphereGeometry(0.12, 8, 8); const glowMaterial = new THREE.MeshBasicMaterial({ color: 0x00aaff, transparent: true, opacity: 0.6 }); const leftGlow = new THREE.Mesh(glowGeometry, glowMaterial); leftGlow.position.set(-0.2, -0.25, -0.45); shipGroup.add(leftGlow); const rightGlow = new THREE.Mesh(glowGeometry, glowMaterial); rightGlow.position.set(0.2, -0.25, -0.45); shipGroup.add(rightGlow); return shipGroup; } const spaceship = createSpaceship(); spaceship.position.set(0, 0, 0); coverScene.add(spaceship); // Cover lights const coverLight = new THREE.DirectionalLight(0xffffff, 0.8); coverLight.position.set(1, 1, 1); coverScene.add(coverLight); const coverAmbient = new THREE.AmbientLight(0x404040, 0.4); coverScene.add(coverAmbient); // Title text overlay const titleDiv = document.createElement('div'); titleDiv.style.color = 'white'; titleDiv.style.fontSize = '48px'; titleDiv.style.fontFamily = 'Arial, sans-serif'; titleDiv.style.textShadow = '0 0 20px #ff6600'; titleDiv.style.marginBottom = '20px'; titleDiv.style.zIndex = '10'; titleDiv.innerHTML = `

WARRIORS SHOOTER ${currentHoliday.emoji}

Happy ${currentHoliday.name}!

`; startScreenElement.appendChild(titleDiv); // Start button const startButton = document.createElement('button'); startButton.id = 'startButton'; startButton.innerText = 'Start Game'; startButton.style.padding = '15px 40px'; startButton.style.fontSize = '24px'; startButton.style.background = 'linear-gradient(45deg, #ffd700, #ffffff, #c0c0c0)'; startButton.style.color = 'black'; startButton.style.border = '2px solid #ffd700'; startButton.style.borderRadius = '10px'; startButton.style.cursor = 'pointer'; startButton.style.fontWeight = 'bold'; startButton.style.boxShadow = '0 8px 25px rgba(255, 215, 0, 0.6)'; startButton.style.textShadow = '0 2px 4px rgba(0,0,0,0.5)'; startButton.style.zIndex = '10'; startButton.style.transition = 'all 0.3s ease'; startScreenElement.appendChild(startButton); // Cover animation function let coverTime = 0; function animateCover() { coverTime += 0.016; // Rotate stars stars.rotation.y += 0.002; stars.rotation.x += 0.001; // Rotate spaceship gently spaceship.rotation.y = Math.sin(coverTime * 0.3) * 0.2 + coverTime * 0.5; spaceship.rotation.x = Math.sin(coverTime * 0.4) * 0.1; // Engine glow pulse const engines = spaceship.children.filter(child => child.material && child.material.emissive && child.material.emissiveIntensity ); const pulse = Math.sin(coverTime * 4) * 0.3 + 0.7; engines.forEach(engine => { engine.material.emissiveIntensity = pulse; }); coverRenderer.render(coverScene, coverCamera); requestAnimationFrame(animateCover); } animateCover(); function redeemCode() { const code = redeemCodeInput.value.trim().toUpperCase(); if (!code) { redeemMessage.innerHTML = 'Enter a code!'; redeemMessage.style.backgroundColor = 'rgba(255, 0, 0, 0.9)'; redeemMessage.style.color = 'white'; redeemMessage.style.display = 'block'; setTimeout(() => redeemMessage.style.display = 'none', 2000); return; } const validCodes = { 'WARRIORS': 50, 'GOLDEN': 100, 'VOID': 25, 'TACO': 75, 'LUCAS': 25, 'ADMIN200': 200, 'ADMIN': 200, 'STARFISH': 30, 'ALIEN': 60, 'PLANET': 40, 'DESMOND': 67, 'DEUTSCHLAND': 50, '369369': 1000, '123123': 100, 'HAPPY2026': 2026, 'NEWYEAR': 500, 'VALENTINE': 500 }; if (usedCodes.has(code)) { redeemMessage.innerHTML = 'Code already redeemed!'; redeemMessage.style.backgroundColor = 'rgba(150, 0, 0, 0.9)'; redeemMessage.style.color = 'white'; redeemMessage.style.display = 'block'; setTimeout(() => redeemMessage.style.display = 'none', 2000); return; } if (validCodes[code]) { const reward = validCodes[code]; credits += reward; usedCodes.add(code); saveToProfile(activeProfile); updateScoreUI(); redeemMessage.innerHTML = `+${reward} credits!`; redeemMessage.style.backgroundColor = 'rgba(0, 150, 0, 0.9)'; redeemMessage.style.color = 'white'; redeemMessage.style.display = 'block'; redeemCodeInput.value = ''; setTimeout(() => redeemMessage.style.display = 'none', 2000); } else { redeemMessage.innerHTML = 'Invalid code!'; redeemMessage.style.backgroundColor = 'rgba(150, 0, 0, 0.9)'; redeemMessage.style.color = 'white'; redeemMessage.style.display = 'block'; setTimeout(() => redeemMessage.style.display = 'none', 2000); } } const startHandler = () => { saveToProfile(activeProfile); // Save before starting new game resetGame(); // Reset game state and start // gameStarted is set to true within resetGame() startScreenElement.style.display = 'none'; checkLoginReward(); // Check for login reward on game start // Play audio on user interaction if (audio.buffer) { audio.play().catch(e => console.log("Audio autoplay prevented:", e)); } }; startButton.addEventListener('click', startHandler); // Attach the event listener here startButton.addEventListener('mouseenter', () => { startButton.style.transform = 'scale(1.05)'; startButton.style.boxShadow = '0 12px 30px rgba(255, 102, 0, 0.6)'; }); startButton.addEventListener('mouseleave', () => { startButton.style.transform = 'scale(1)'; startButton.style.boxShadow = '0 8px 20px rgba(255, 102, 0, 0.4)'; }); let codeRedeemOpen = false; // Storing handler references for proper cleanup const showCodeRedeemHandler = () => { codeRedeemOpen = true; codeRedeemElement.style.display = 'flex'; redeemCodeInput.focus(); // Focus on the input field }; codeButton.addEventListener('click', showCodeRedeemHandler); const redeemCodeHandler = redeemCode; // Use the existing named function redeemButton.addEventListener('click', redeemCodeHandler); const hideCodeRedeemHandler = () => { codeRedeemOpen = false; codeRedeemElement.style.display = 'none'; openShopButton.style.display = 'block'; codeButton.style.display = 'block'; profileButton.style.display = 'block'; newProfileButton.style.display = 'block'; redeemMessage.style.display = 'none'; // Hide any previous messages }; closeCodeButton.addEventListener('click', hideCodeRedeemHandler); function showCodeRedeem() { codeRedeemOpen = true; codeRedeemElement.style.display = 'flex'; redeemCodeInput.focus(); // Focus on the input field } function hideCodeRedeem() { codeRedeemOpen = false; codeRedeemElement.style.display = 'none'; openShopButton.style.display = 'block'; codeButton.style.display = 'block'; profileButton.style.display = 'block'; newProfileButton.style.display = 'block'; redeemMessage.style.display = 'none'; // Hide any previous messages } codeButton.addEventListener('click', showCodeRedeem); redeemButton.addEventListener('click', redeemCode); closeCodeButton.addEventListener('click', hideCodeRedeem); const gameOverElement = document.createElement('div'); gameOverElement.style.position = 'absolute'; gameOverElement.style.top = '50%'; gameOverElement.style.left = '50%'; gameOverElement.style.transform = 'translate(-50%, -50%)'; gameOverElement.style.color = 'red'; gameOverElement.style.fontSize = '48px'; gameOverElement.style.fontFamily = 'Arial'; gameOverElement.style.display = 'none'; // Using specific IDs for score displays to update them without recreating the button gameOverElement.innerHTML = `

You Died!

Final Score: 0

High Score: 0

`; document.body.appendChild(gameOverElement); const levelCompleteElement = document.createElement('div'); levelCompleteElement.style.position = 'absolute'; levelCompleteElement.style.top = '50%'; levelCompleteElement.style.left = '50%'; levelCompleteElement.style.transform = 'translate(-50%, -50%)'; levelCompleteElement.style.color = '#00ff00'; levelCompleteElement.style.fontSize = '48px'; levelCompleteElement.style.fontFamily = 'Arial'; levelCompleteElement.style.backgroundColor = 'rgba(0, 0, 50, 0.9)'; levelCompleteElement.style.border = '3px solid #00ff00'; levelCompleteElement.style.borderRadius = '15px'; levelCompleteElement.style.padding = '30px'; levelCompleteElement.style.textAlign = 'center'; levelCompleteElement.style.display = 'none'; levelCompleteElement.style.zIndex = '100'; levelCompleteElement.innerHTML = `

Level Completed!

Level ${level}

`; document.body.appendChild(levelCompleteElement); const restartButton = gameOverElement.querySelector('#restartButton'); const restartGameHandler = () => { if (pendingHighScore !== null) { pendingHighScore = null; } resetGame(); // Call the reset function instead of reloading the page updateGameOverScreen(); // The animation loop will continue automatically as gameOver is now false }; restartButton.addEventListener('click', restartGameHandler); const resetButton = gameOverElement.querySelector('#resetButton'); const resetProgressHandler = () => { highScore = 0; credits = 0; localStorage.setItem('voidHighScore', '0'); localStorage.setItem('voidCredits', '0'); localStorage.removeItem('voidUsedCodes'); // Clear used codes on full reset usedCodes = new Set(); // Reset in-memory set as well updateScoreUI(); updateGameOverScreen(); }; resetButton.addEventListener('click', resetProgressHandler); let shopOpen = false; function updateShopUI() { shopItemsElement.innerHTML = ''; // Clear previous items shopItemsElement.style.display = 'grid'; // Use CSS Grid for items layout shopItemsElement.style.gridTemplateColumns = 'repeat(auto-fit, minmax(220px, 1fr))'; // Responsive grid, slightly smaller min-width shopItemsElement.style.gap = '15px'; // Space between grid items shopItemsElement.style.justifyItems = 'center'; // Center items within their grid cells // Update color input in customization section if (playerColorInput) { playerColorInput.value = playerColor; } if (enemyColorInput) { enemyColorInput.value = enemyColor; } if (profilePicShapeSelect) { profilePicShapeSelect.value = profilePictureConfig.shape; } if (profilePicColorInput) { profilePicColorInput.value = profilePictureConfig.color; } // Shooter items shooterConfigs.forEach((config, index) => { const itemDiv = document.createElement('div'); itemDiv.style.marginBottom = '0'; // No margin-bottom, gap handles spacing itemDiv.style.padding = '15px'; itemDiv.style.border = `1px solid ${index === currentShooterIndex ? '#00ff00' : '#444'}`; itemDiv.style.borderRadius = '8px'; itemDiv.style.backgroundColor = 'rgba(0, 0, 0, 0.3)'; itemDiv.style.display = 'flex'; itemDiv.style.flexDirection = 'column'; // Stack info and button vertically itemDiv.style.alignItems = 'center'; // Center content within each item itemDiv.style.gap = '10px'; // Space between info and button itemDiv.style.width = '100%'; // Ensure items fill their grid cell width itemDiv.style.boxSizing = 'border-box'; // Include padding and border in the element's total width and height const infoDiv = document.createElement('div'); infoDiv.style.textAlign = 'center'; // Center text within info div infoDiv.innerHTML = `

${config.name} ${index === currentShooterIndex ? '(EQUIPPED)' : ''}

Cost: ${config.cost} Credits

Fire Rate: ${1000 / config.fireRate} shots/sec

Adds: ${config.adds || 0}

`; const button = document.createElement('button'); button.style.padding = '10px 20px'; button.style.fontSize = '16px'; button.style.borderRadius = '5px'; button.style.cursor = 'pointer'; button.style.width = '80%'; // Make button wider if (index === currentShooterIndex) { button.innerText = 'Equipped'; button.style.backgroundColor = '#008800'; button.style.color = 'white'; button.style.border = 'none'; button.disabled = true; } else if (credits >= config.cost) { button.innerText = 'Buy & Equip'; button.style.backgroundColor = '#0077ff'; button.style.color = 'white'; button.style.border = 'none'; button.onclick = () => buyShooter(index); } else { button.innerText = 'Too Expensive'; button.style.backgroundColor = '#888'; button.style.color = '#ccc'; button.style.border = 'none'; button.disabled = true; } itemDiv.appendChild(infoDiv); itemDiv.appendChild(button); shopItemsElement.appendChild(itemDiv); }); // Admin Panel item const adminItemDiv = document.createElement('div'); adminItemDiv.style.marginBottom = '0'; adminItemDiv.style.padding = '15px'; adminItemDiv.style.border = `1px solid ${hasAdminPanel ? '#00ff00' : '#444'}`; adminItemDiv.style.borderRadius = '8px'; adminItemDiv.style.backgroundColor = 'rgba(0, 0, 0, 0.3)'; adminItemDiv.style.display = 'flex'; adminItemDiv.style.flexDirection = 'column'; adminItemDiv.style.alignItems = 'center'; adminItemDiv.style.gap = '10px'; adminItemDiv.style.width = '100%'; adminItemDiv.style.boxSizing = 'border-box'; const adminInfoDiv = document.createElement('div'); adminInfoDiv.style.textAlign = 'center'; adminInfoDiv.innerHTML = `

Admin Panel ${hasAdminPanel ? '(PURCHASED)' : ''}

Cost: ${adminPanelCost} Credits

Unlocks admin features

`; const adminButton = document.createElement('button'); adminButton.style.padding = '10px 20px'; adminButton.style.fontSize = '16px'; adminButton.style.borderRadius = '5px'; adminButton.style.cursor = 'pointer'; adminButton.style.width = '80%'; if (hasAdminPanel) { adminButton.innerText = 'Purchased'; adminButton.style.backgroundColor = '#008800'; adminButton.style.color = 'white'; adminButton.style.border = 'none'; adminButton.disabled = true; } else if (credits >= adminPanelCost) { adminButton.innerText = 'Buy Admin Panel'; adminButton.style.backgroundColor = '#ff00ff'; adminButton.style.color = 'white'; adminButton.style.border = 'none'; adminButton.onclick = () => buyAdminPanel(); } else { adminButton.innerText = 'Too Expensive'; adminButton.style.backgroundColor = '#888'; adminButton.style.color = '#ccc'; adminButton.style.border = 'none'; adminButton.disabled = true; } adminItemDiv.appendChild(adminInfoDiv); adminItemDiv.appendChild(adminButton); shopItemsElement.appendChild(adminItemDiv); } function buyShooter(shooterIndex) { const config = shooterConfigs[shooterIndex]; if (credits >= config.cost) { credits -= config.cost; currentShooterIndex = shooterIndex; saveGameData(); // Save credits after purchase // Dispose of old player mesh and create new one scene.remove(player); player.geometry.dispose(); if (Array.isArray(player.material)) { player.material.forEach(mat => mat.dispose()); } else { player.material.dispose(); } player = new THREE.Mesh(config.playerGeometry, config.playerMaterial.clone()); // Clone material to allow individual color changes player.position.y = -1.3; scene.add(player); changePlayerColor(playerColor); // Apply current playerColor to the new mesh updateShopUI(); // Refresh shop display updateScoreUI(); // Update credits display } } function buyAdminPanel() { if (credits >= adminPanelCost) { credits -= adminPanelCost; hasAdminPanel = true; saveToProfile(activeProfile); updateShopUI(); updateScoreUI(); // Show success message in shop const messageDiv = document.createElement('div'); messageDiv.style.padding = '10px'; messageDiv.style.backgroundColor = 'rgba(0, 150, 0, 0.9)'; messageDiv.style.color = 'white'; messageDiv.style.borderRadius = '5px'; messageDiv.style.marginBottom = '10px'; messageDiv.innerText = `Admin Panel Purchased! -${adminPanelCost} credits`; shopItemsElement.parentNode.insertBefore(messageDiv, shopItemsElement); setTimeout(() => { if (messageDiv.parentNode) { messageDiv.parentNode.removeChild(messageDiv); } }, 3000); } } function changePlayerColor(newColor) { playerColor = newColor; if (player && player.material) { if (Array.isArray(player.material)) { player.material.forEach(mat => { if (mat.isMeshStandardMaterial) { mat.color.set(newColor); mat.emissive.set(newColor).multiplyScalar(0.5); // Slightly darker emissive for glow } }); } else if (player.material.isMeshStandardMaterial) { player.material.color.set(newColor); player.material.emissive.set(newColor).multiplyScalar(0.5); // Slightly darker emissive for glow } } saveGameData(); updateShopUI(); // Update shop UI to reflect new color } function changeEnemyColor(newColor) { enemyColor = newColor; enemies.forEach(enemy => { // Enemy is a Group with multiple meshes, we need to traverse it enemy.mesh.traverse(child => { if (child.isMesh && child.material && child.material.isMeshStandardMaterial) { // Update bug body parts (body, head, legs, antennas) if (child.name === 'bugBody' || child.name === 'bugHead' || child.name === 'bugLeg' || child.name === 'bugAntenna') { const intensity = child.name === 'bugBody' ? 0.3 : child.name === 'bugHead' ? 0.4 : 0.2; child.material.color.set(newColor).multiplyScalar(child.name === 'bugBody' ? 0.7 : child.name === 'bugHead' ? 0.5 : 0.4); child.material.emissive.set(newColor).multiplyScalar(intensity); } } }); // Boss also needs color update if active if (boss && boss.mesh) { boss.mesh.traverse(child => { if (child.isMesh && child.material && child.material.isMeshStandardMaterial) { if (child.name === 'bossBody' || child.name === 'arm') { child.material.color.set(newColor); child.material.emissive.set(newColor).multiplyScalar(0.2); } } }); } }); saveGameData(); updateShopUI(); // Update shop UI to reflect new color } function showShop() { shopOpen = true; shopElement.style.display = 'block'; updateShopUI(); // Populate shop items } function hideShop() { shopOpen = false; shopElement.style.display = 'none'; openShopButton.style.display = 'block'; codeButton.style.display = 'block'; profileButton.style.display = 'block'; newProfileButton.style.display = 'block'; } // Storing handler references for proper cleanup const showShopHandler = showShop; // Use the existing named function openShopButton.addEventListener('click', showShopHandler); const hideShopHandler = hideShop; // Use the existing named function closeShopButton.addEventListener('click', hideShopHandler); // New close button listener const applyPlayerColorHandler = () => { if (playerColorInput) { const newColor = playerColorInput.value; if (newColor === playerColor) { // If it's the same color, no cost, just update UI playerColorMessage.innerHTML = 'Color already applied.'; playerColorMessage.style.color = 'yellow'; setTimeout(() => playerColorMessage.innerHTML = '', 2000); return; } if (credits >= colorCustomizationCost) { credits -= colorCustomizationCost; changePlayerColor(newColor); saveGameData(); updateScoreUI(); playerColorMessage.innerHTML = `Color applied! -${colorCustomizationCost} credits.`; playerColorMessage.style.color = 'lightgreen'; setTimeout(() => playerColorMessage.innerHTML = '', 2000); } else { playerColorMessage.innerHTML = `Not enough credits! (${colorCustomizationCost} required)`; playerColorMessage.style.color = 'red'; setTimeout(() => playerColorMessage.innerHTML = '', 2000); } } }; applyPlayerColorButton.addEventListener('click', applyPlayerColorHandler); const applyEnemyColorHandler = () => { if (enemyColorInput) { const newColor = enemyColorInput.value; if (newColor === enemyColor) { // If it's the same color, no cost, just update UI enemyColorMessage.innerHTML = 'Color already applied.'; enemyColorMessage.style.color = 'yellow'; setTimeout(() => enemyColorMessage.innerHTML = '', 2000); return; } if (credits >= enemyColorCustomizationCost) { credits -= enemyColorCustomizationCost; changeEnemyColor(newColor); saveGameData(); updateScoreUI(); enemyColorMessage.innerHTML = `Color applied! -${enemyColorCustomizationCost} credits.`; enemyColorMessage.style.color = 'lightgreen'; setTimeout(() => enemyColorMessage.innerHTML = '', 2000); } else { enemyColorMessage.innerHTML = `Not enough credits! (${enemyColorCustomizationCost} required)`; enemyColorMessage.style.color = 'red'; setTimeout(() => enemyColorMessage.innerHTML = '', 2000); } } }; applyEnemyColorButton.addEventListener('click', applyEnemyColorHandler); const applyProfilePicHandler = () => { if (profilePicShapeSelect && profilePicColorInput) { const newShape = profilePicShapeSelect.value; const newColor = profilePicColorInput.value; const newConfig = {shape: newShape, color: newColor}; const isSame = newConfig.shape === profilePictureConfig.shape && newConfig.color === profilePictureConfig.color; if (isSame) { profilePicMessage.innerHTML = 'Picture already applied.'; profilePicMessage.style.color = 'yellow'; setTimeout(() => profilePicMessage.innerHTML = '', 2000); return; } if (credits >= profilePicCustomizationCost) { credits -= profilePicCustomizationCost; profilePictureConfig = newConfig; saveToProfile(activeProfile); updateScoreUI(); profilePicMessage.innerHTML = `Picture applied! -${profilePicCustomizationCost} credits.`; profilePicMessage.style.color = 'lightgreen'; setTimeout(() => profilePicMessage.innerHTML = '', 2000); } else { profilePicMessage.innerHTML = `Not enough credits! (${profilePicCustomizationCost} required)`; profilePicMessage.style.color = 'red'; setTimeout(() => profilePicMessage.innerHTML = '', 2000); } } }; applyProfilePicButton.addEventListener('click', applyProfilePicHandler); const resetPlayerColorHandler = () => { playerColor = '#00ff00'; playerColorInput.value = playerColor; changePlayerColor(playerColor); saveGameData(); playerColorMessage.innerHTML = 'Player color reset to default!'; playerColorMessage.style.color = 'lightgreen'; setTimeout(() => playerColorMessage.innerHTML = '', 2000); }; resetPlayerColorButton.addEventListener('click', resetPlayerColorHandler); const resetEnemyColorHandler = () => { enemyColor = '#880000'; enemyColorInput.value = enemyColor; changeEnemyColor(enemyColor); saveGameData(); enemyColorMessage.innerHTML = 'Enemy color reset to default!'; enemyColorMessage.style.color = 'lightgreen'; setTimeout(() => enemyColorMessage.innerHTML = '', 2000); }; resetEnemyColorButton.addEventListener('click', resetEnemyColorHandler); const resetProfilePicHandler = () => { profilePictureConfig = {shape: 'sphere', color: '#00ff00'}; profilePicShapeSelect.value = 'sphere'; profilePicColorInput.value = '#00ff00'; saveToProfile(activeProfile); profilePicMessage.innerHTML = 'Profile picture reset to default!'; profilePicMessage.style.color = 'lightgreen'; setTimeout(() => profilePicMessage.innerHTML = '', 2000); }; resetProfilePicButton.addEventListener('click', resetProfilePicHandler); // Store ALL event listener references for cleanup window.__THREE_EVENT_LISTENERS__ = { startButton: startHandler, openShopButton: showShopHandler, closeShopButton: hideShopHandler, skipLevelButton: skipLevel, applyPlayerColorButton: applyPlayerColorHandler, applyEnemyColorButton: applyEnemyColorHandler, applyProfilePicButton: applyProfilePicHandler, restartButton: restartGameHandler, resetButton: resetProgressHandler, resize: onWindowResize, keydown1: document._keydownHandler1, keydown2: document._keydownHandler2, keydown3: document._keydownHandler3, keyup: document._keyupHandler, codeButton: showCodeRedeemHandler, redeemButton: redeemCodeHandler, closeCodeButton: hideCodeRedeemHandler, profileButton: () => showProfileManager(), createProfileButton: newProfileHandler, closeProfileButton: hideProfileManager }; // Attribution const attributionElement = document.createElement('div'); attributionElement.style.position = 'absolute'; attributionElement.style.bottom = '10px'; attributionElement.style.right = '10px'; attributionElement.style.color = 'rgba(255, 255, 255, 0.5)'; // Semi-transparent white attributionElement.style.fontSize = '12px'; attributionElement.style.fontFamily = 'Arial'; attributionElement.innerHTML = 'Lucas Games'; document.body.appendChild(attributionElement); // Warriors message const warriorsElement = document.createElement('div'); warriorsElement.style.position = 'absolute'; warriorsElement.style.bottom = '10px'; warriorsElement.style.left = '10px'; warriorsElement.style.color = 'rgba(255, 255, 255, 0.5)'; // Semi-transparent white warriorsElement.style.fontSize = '12px'; warriorsElement.style.fontFamily = 'Arial'; warriorsElement.innerHTML = 'Support your local Golden state Warriors🏀'; document.body.appendChild(warriorsElement); // Arena message const arenaElement = document.createElement('div'); arenaElement.style.position = 'absolute'; arenaElement.style.bottom = '10px'; arenaElement.style.left = '50%'; arenaElement.style.transform = 'translateX(-50%)'; arenaElement.style.color = 'rgba(255, 255, 255, 0.5)'; // Semi-transparent white arenaElement.style.fontSize = '12px'; arenaElement.style.fontFamily = 'Arial'; arenaElement.innerHTML = 'check out this cool game called arena'; arenaElement.style.zIndex = '10'; document.body.appendChild(arenaElement); function updateGameOverScreen() { const finalScoreDisplay = document.getElementById('finalScoreDisplay'); const highScoreDisplay = document.getElementById('highScoreDisplay'); if (finalScoreDisplay) finalScoreDisplay.innerHTML = `Final Score: ${score}`; if (highScoreDisplay) { highScoreDisplay.innerHTML = `High Score: ${highScore}`; // Display current high score highScoreDisplay.style.color = score > highScore ? '#ffd700' : 'white'; } } function updateScoreUI() { scoreElement.innerHTML = `Score: ${score}
High Score: ${highScore}
Level: ${level}${bossActive ? `
BOSS HP: ${bossHealth}` : ''}
Credits: ${credits}`; leaderboardButton.style.display = gameStarted ? 'block' : 'none'; } function saveGameData() { saveToProfile(activeProfile); } function updateHighScore() { if (score > highScore) { highScore = score; pendingHighScore = highScore; saveGameData(); updateScoreUI(); } else { saveGameData(); updateScoreUI(); } } function checkLoginReward() { const currentTime = Date.now(); const twentyFourHours = 24 * 60 * 60 * 1000; // milliseconds in 24 hours const profileKey = `voidLastLoginRewardCheck_${activeProfile}`; let profileLastCheck = parseInt(localStorage.getItem(profileKey) || '0', 10); if (currentTime - profileLastCheck >= twentyFourHours) { const rewardAmount = 50; // Amount of credits for daily login credits += rewardAmount; profileLastCheck = currentTime; localStorage.setItem(profileKey, profileLastCheck.toString()); saveToProfile(activeProfile); updateScoreUI(); loginRewardMessageElement.innerHTML = `Daily Login Bonus! +${rewardAmount} Credits!`; loginRewardMessageElement.style.display = 'block'; setTimeout(() => { loginRewardMessageElement.style.display = 'none'; }, 3000); // Hide message after 3 seconds } lastLoginRewardCheck = profileLastCheck; } const light = new THREE.DirectionalLight(0xffffff, 1); light.position.set(7, 7, 7); scene.add(light); const ambientLight = new THREE.AmbientLight(0x404040, 3); // Soft white light, stronger intensity scene.add(ambientLight); function onWindowResize() { camera.aspect = window.innerWidth / window.innerHeight; camera.updateProjectionMatrix(); renderer.setSize(window.innerWidth, window.innerHeight); // Flag background disabled } window.addEventListener("resize", onWindowResize); function shoot() { if (gameOver || !gameStarted) return; const currentTime = performance.now(); const currentConfig = shooterConfigs[currentShooterIndex]; const effectiveFireRate = rapidFireTimer > 0 ? currentConfig.fireRate / 2 : currentConfig.fireRate; if (currentTime - lastShotTime < effectiveFireRate) { return; // Not ready to shoot yet } lastShotTime = currentTime; const createBullet = (offsetX = 0) => { const bullet = new THREE.Mesh(currentConfig.bulletGeometry, currentConfig.bulletMaterial); bullet.position.copy(player.position); bullet.position.x += offsetX; // Apply offset for dual shot bullet.position.y += 0.1; scene.add(bullet); bullets.push({ mesh: bullet, velocity: currentConfig.bulletVelocity, homing: currentConfig.homing, piercing: currentConfig.piercing, hitEnemies: new Set() // For piercing }); } if (currentConfig.dualShot) { createBullet(-0.05); // Left bullet createBullet(0.05); // Right bullet } else if (currentConfig.spreadShot) { // Fire multiple bullets in a spread createBullet(-0.07); // Leftmost createBullet(-0.03); // Middle-left createBullet(0); // Center createBullet(0.03); // Middle-right createBullet(0.07); // Rightmost } else { createBullet(); // Single bullet (default, laser, homing) } // Play shooting sound if (shootSound.buffer && !shootSound.isPlaying) { shootSound.play(); } // Muzzle Flash const flashGeom = new THREE.SphereGeometry(0.08, 8, 8); const flashMat = new THREE.MeshBasicMaterial({ color: 0xffffff, transparent: true, opacity: 0.8 }); const flash = new THREE.Mesh(flashGeom, flashMat); flash.position.copy(player.position); flash.position.y += 0.15; scene.add(flash); setTimeout(() => { scene.remove(flash); flashGeom.dispose(); flashMat.dispose(); }, 50); } // Event listeners for shooting document._keydownHandler1 = (event) => { if (event.code === 'Space' && gameStarted) { event.preventDefault(); isShooting = true; shoot(); } }; document.addEventListener('keydown', document._keydownHandler1); // Prevent spacebar from scrolling the page document._keydownHandler2 = (event) => { if (event.code === 'Space') { event.preventDefault(); } // Allow 'Escape' to close shop if (event.code === 'Escape' && shopOpen) { hideShop(); event.preventDefault(); // Prevent default escape behavior (e.g. exiting fullscreen) } else if (event.code === 'Escape' && codeRedeemOpen) { hideCodeRedeem(); event.preventDefault(); } else if (event.code === 'Escape' && profileOpen) { hideProfileManager(); event.preventDefault(); } else if (event.code === 'Escape' && leaderboardElement.style.display !== 'none') { hideLeaderboard(); event.preventDefault(); } }; window.addEventListener('keydown', document._keydownHandler2); // Keyboard controls for movement let keys = {}; document._keydownHandler3 = (event) => { keys[event.code] = true; }; document._keyupHandler = (event) => { keys[event.code] = false; if (event.code === 'Space') { // isShooting = false; // Not needed for infinite laser } }; document.addEventListener('keydown', document._keydownHandler3); document.addEventListener('keyup', document._keyupHandler); function createExplosion(x, y, color, count = 8) { for (let i = 0; i < count; i++) { const geometry = new THREE.SphereGeometry(0.02, 4, 4); const material = new THREE.MeshBasicMaterial({ color: color, transparent: true }); const p = new THREE.Mesh(geometry, material); p.position.set(x, y, 0); const velocity = new THREE.Vector3( (Math.random() - 0.5) * 0.05, (Math.random() - 0.5) * 0.05, (Math.random() - 0.5) * 0.05 ); scene.add(p); particles.push({ mesh: p, velocity: velocity, life: 1.0, decay: 0.02 + Math.random() * 0.02 }); } } function createShieldPowerUp() { const geometry = new THREE.IcosahedronGeometry(0.08, 1); const material = new THREE.MeshStandardMaterial({ color: 0x00ffff, emissive: 0x00ffff, transparent: true, opacity: 0.8 }); const mesh = new THREE.Mesh(geometry, material); mesh.position.set((Math.random() - 0.5) * 4, 2, 0); scene.add(mesh); return { mesh, type: 'shield', velocity: 0.008, rotationSpeed: 0.05 }; } function createStarPowerUp() { const starGroup = new THREE.Group(); // Create 5 points of a star using cones for (let i = 0; i < 5; i++) { const coneGeometry = new THREE.ConeGeometry(0.03, 0.12, 6); const coneMaterial = new THREE.MeshStandardMaterial({ color: 0xffff00, emissive: 0xaaaa00, emissiveIntensity: 0.8 }); const cone = new THREE.Mesh(coneGeometry, coneMaterial); const angle = (i / 5) * Math.PI * 2; cone.rotation.z = angle; cone.position.y = 0.06; starGroup.add(cone); } starGroup.position.set( (Math.random() - 0.5) * 4, 2, 0 ); scene.add(starGroup); return { mesh: starGroup, velocity: 0.008, rotationSpeed: 0.03 + Math.random() * 0.02, sparkleTimer: 0 }; } function spawnBoss() { if (bossActive || gameOver || !gameStarted) return; bossActive = true; bossHealth = 100 + level * 50; // Main boss body - large cylinder, now much bigger for a "huge" enemy const bossBodyGeometry = new THREE.CylinderGeometry(0.45, 0.55, 1.0, 16); // Increased size const bossBodyMaterial = new THREE.MeshStandardMaterial({ color: enemyColor, emissive: new THREE.Color(enemyColor).multiplyScalar(0.2), // Use enemyColor metalness: 0.8 }); const bossBody = new THREE.Mesh(bossBodyGeometry, bossBodyMaterial); bossBody.name = 'bossBody'; // Give it a name for easier identification during color change bossBody.rotation.x = Math.PI / 2; bossBody.position.y = 3.8; // Adjusted position for larger size // Boss core - now slightly larger (can keep its own distinct color) const coreGeometry = new THREE.SphereGeometry(0.25, 16, 16); // Slightly larger core const coreMaterial = new THREE.MeshStandardMaterial({ color: 0x00ff00, emissive: 0x00aa00 }); const core = new THREE.Mesh(coreGeometry, coreMaterial); core.position.set(0, 0.2, 0); bossBody.add(core); // Boss eyes - larger and red (can keep distinct color) const eyeGeometry = new THREE.SphereGeometry(0.1, 8, 8); // Slightly larger eyes const eyeMaterial = new THREE.MeshStandardMaterial({ color: 0xff0000, emissive: 0xff0000 }); const leftEye = new THREE.Mesh(eyeGeometry, eyeMaterial); leftEye.position.set(-0.4, 0.15, 0.5); // Adjusted position bossBody.add(leftEye); const rightEye = new THREE.Mesh(eyeGeometry, eyeMaterial); rightEye.position.set(0.4, 0.15, 0.5); // Adjusted position bossBody.add(rightEye); // Boss cannons - larger, adjusted position, and added more const cannonGeometry = new THREE.CylinderGeometry(0.06, 0.06, 0.6, 8); // Slightly larger cannons const cannonMaterial = new THREE.MeshStandardMaterial({ color: 0x888888 }); // Main cannons const leftCannon = new THREE.Mesh(cannonGeometry, cannonMaterial); leftCannon.rotation.z = Math.PI / 2; leftCannon.position.set(-0.5, 0.15, 0.3); // Adjusted position bossBody.add(leftCannon); const rightCannon = new THREE.Mesh(cannonGeometry, cannonMaterial); rightCannon.rotation.z = Math.PI / 2; rightCannon.position.set(0.5, 0.15, 0.3); // Adjusted position bossBody.add(rightCannon); // Additional "arms" for a more menacing look const armGeometry = new THREE.CylinderGeometry(0.1, 0.1, 0.8, 8); const armMaterial = new THREE.MeshStandardMaterial({ color: 0x880000, emissive: 0x220000 }); for (let i = 0; i < 4; i++) { const arm = new THREE.Mesh(armGeometry, new THREE.MeshStandardMaterial({ color: enemyColor, emissive: new THREE.Color(enemyColor).multiplyScalar(0.2) })); arm.name = 'arm'; // Give it a name for easier identification during color change const angle = (i / 4) * Math.PI * 2; arm.position.x = Math.sin(angle) * 0.7; arm.position.z = Math.cos(angle) * 0.7; arm.rotation.z = Math.PI / 2; // Rotate to be horizontal arm.rotation.y = angle; // Point outwards arm.position.y = 0; // Center vertically on the boss body bossBody.add(arm); // Add a glowing tip to each arm (can keep its own distinct color) const armTipGeometry = new THREE.SphereGeometry(0.08, 8, 8); const armTipMaterial = new THREE.MeshStandardMaterial({ color: 0x00ff00, emissive: 0x00ff00 }); const armTip = new THREE.Mesh(armTipGeometry, armTipMaterial); armTip.position.set(0.4, 0, 0); // Position at the end of the arm (local to arm) arm.add(armTip); } scene.add(bossBody); boss = { mesh: bossBody, velocity: 0.008, shootTimer: 0, shieldCounter: 0 }; } function spawnEnemy() { if (gameOver || !gameStarted || bossActive) return; const spawnProbability = baseSpawnRate; // 5% chance to spawn power-up instead of enemy if (Math.random() < 0.06) { if (Math.random() < 0.4) { powerUps.push(createShieldPowerUp()); } else { powerUps.push(createStarPowerUp()); } return; } const isBigEnemy = Math.random() < (level === 1 ? 0.2 : (level === 4 ? 0.8 : Math.min(0.7, 0.45 + (level-1)*0.05))); const scale = isBigEnemy ? 1.15 : 1.0; const swarmSize = Math.random() < 0.6 ? 3 : 2; // Spawn 2-3 bugs together const baseX = (Math.random() - 0.5) * 4; const baseY = 1.8 + Math.max(1, level) * 0.1; for (let i = 0; i < swarmSize; i++) { const enemyBug = new THREE.Group(); const bugScale = scale * (0.92 + Math.random() * 0.12); // Slight size variation in swarm // Bug body - main sphere const bodyGeometry = new THREE.SphereGeometry(0.10 * bugScale, 12, 12); const bodyMaterial = new THREE.MeshStandardMaterial({ color: new THREE.Color(enemyColor).multiplyScalar(0.7), // Darker base emissive: new THREE.Color(enemyColor).multiplyScalar(0.3), metalness: 0.2, roughness: 0.7 }); const body = new THREE.Mesh(bodyGeometry, bodyMaterial); body.name = 'bugBody'; body.position.y = 0; enemyBug.add(body); // Bug head - smaller sphere const headGeometry = new THREE.SphereGeometry(0.065 * bugScale, 10, 10); const headMaterial = new THREE.MeshStandardMaterial({ color: new THREE.Color(enemyColor).multiplyScalar(0.5), // Even darker head emissive: new THREE.Color(enemyColor).multiplyScalar(0.4) }); const head = new THREE.Mesh(headGeometry, headMaterial); head.name = 'bugHead'; head.position.set(0, 0.08 * bugScale, 0.12 * bugScale); enemyBug.add(head); // Bug legs - 6 thin cones const legGeometry = new THREE.ConeGeometry(0.012 * bugScale, 0.14 * bugScale, 4); for (let leg = 0; leg < 6; leg++) { const legMaterial = new THREE.MeshStandardMaterial({ color: new THREE.Color(enemyColor).multiplyScalar(0.4), emissive: 0x000000 }); const legMesh = new THREE.Mesh(legGeometry, legMaterial); legMesh.name = 'bugLeg'; const angle = (leg / 6) * Math.PI * 2; legMesh.position.x = Math.sin(angle) * 0.12 * bugScale; legMesh.position.y = -0.12 * bugScale; legMesh.position.z = Math.cos(angle) * 0.08 * bugScale; legMesh.rotation.z = angle + Math.PI / 2; enemyBug.add(legMesh); } // Bug antennas - 2 thin cylinders const antennaGeometry = new THREE.CylinderGeometry(0.006 * bugScale, 0.006 * bugScale, 0.12 * bugScale, 6); for (let ant = 0; ant < 2; ant++) { const antennaMaterial = new THREE.MeshStandardMaterial({ color: new THREE.Color(enemyColor).multiplyScalar(0.3), emissive: 0x000000 }); const antenna = new THREE.Mesh(antennaGeometry, antennaMaterial); antenna.name = 'bugAntenna'; const side = ant === 0 ? -1 : 1; antenna.position.set(side * 0.06 * bugScale, 0.15 * bugScale, 0.12 * bugScale); antenna.rotation.x = Math.PI / 2; antenna.rotation.z = side * 0.3; enemyBug.add(antenna); } // Position swarm members with offset enemyBug.position.set( baseX + (Math.random() - 0.5) * 0.4, baseY + (Math.random() - 0.5) * 0.2, (Math.random() - 0.5) * 0.1 ); scene.add(enemyBug); enemies.push({ mesh: enemyBug, velocity: (0.01 + Math.random() * 0.015 + Math.max(1, level) * 0.006) * (level === 4 ? 1.5 : 1), points: isBigEnemy ? 100 : 100, isBigEnemy: isBigEnemy, wiggleOffset: Math.random() * Math.PI * 2, wigglePhase: Math.random() * 0.1 }); } } function animate() { if (window.__THREE_ANIMATION__) { cancelAnimationFrame(window.__THREE_ANIMATION__); } // Update background decorations decoGroup.children.forEach(item => { item.position.y += item.userData.speed; item.position.x += Math.sin(Date.now() * 0.001 + item.userData.floatOffset) * 0.005; item.rotation.z += item.userData.rotSpeed; if (item.position.y > 4) { item.position.y = -4; item.position.x = (Math.random() - 0.5) * 8; } }); // Update celebration effects if (celebrationActive) { celebrationTimer++; celebrationGroup.children.forEach((child, index) => { if (child.userData && child.userData.life !== undefined) { // Update particle/confetti physics child.userData.life--; child.position.x += child.userData.velocityX; child.position.y += child.userData.velocityY; child.userData.velocityY -= 0.002; // gravity child.rotation.x += child.userData.rotationSpeed || 0.1; child.rotation.y += child.userData.rotationSpeed || 0.1; // Fade out if (child.userData.life < child.userData.fadeStart) { const alpha = child.userData.life / child.userData.fadeStart; if (child.material) child.material.opacity = alpha; } if (child.userData.life <= 0) { celebrationGroup.remove(child); if (child.geometry) child.geometry.dispose(); if (child.material) { if (Array.isArray(child.material)) { child.material.forEach(mat => mat.dispose()); } else { child.material.dispose(); } } } } else if (child.children && child.children.length > 0) { // Rotate trophy child.rotation.y += 0.1; child.children.forEach(part => { if (part.material && part.material.emissive) { part.material.emissiveIntensity = 0.3 + Math.sin(Date.now() * 0.01 + index) * 0.2; } }); } }); if (celebrationTimer > 300) { // 5 seconds celebrationGroup.clear(); celebrationActive = false; celebrationTimer = 0; } } if (!gameStarted) { holidayBanner.style.display = 'none'; renderer.render(scene, camera); window.__THREE_ANIMATION__ = requestAnimationFrame(animate); return; } if (gameOver) { gameOverElement.style.display = 'block'; skipLevelButton.style.display = 'none'; levelCompleteElement.style.display = 'none'; hideShop(); // Ensure shop is closed when game is over renderer.render(scene, camera); window.__THREE_ANIMATION__ = requestAnimationFrame(animate); return; } if (levelCompleteMessage) { levelCompleteElement.style.display = 'block'; skipLevelButton.style.display = 'none'; levelCompleteTimer++; if (levelCompleteTimer > 180) { // ~3 seconds at 60fps levelCompleteMessage = false; levelCompleteElement.style.display = 'none'; levelCompleteElement.innerHTML = `

Level Completed!

Level ${level}

`; } } else { levelCompleteElement.style.display = 'none'; skipLevelButton.style.display = (gameStarted && !gameOver && !shopOpen && !profileOpen && !codeRedeemOpen && credits >= skipLevelCost) ? 'block' : 'none'; } if (shopOpen || profileOpen || codeRedeemOpen || leaderboardElement.style.display !== 'none') { holidayBanner.style.display = 'none'; skipLevelButton.style.display = 'none'; openShopButton.style.display = 'none'; codeButton.style.display = 'none'; profileButton.style.display = 'none'; newProfileButton.style.display = 'none'; leaderboardButton.style.display = 'none'; renderer.render(scene, camera); window.__THREE_ANIMATION__ = requestAnimationFrame(animate); return; } else { holidayBanner.style.display = gameStarted && !gameOver ? 'block' : 'none'; openShopButton.style.display = gameStarted ? 'block' : 'none'; codeButton.style.display = gameStarted ? 'block' : 'none'; profileButton.style.display = gameStarted ? 'block' : 'none'; newProfileButton.style.display = gameStarted ? 'block' : 'none'; leaderboardButton.style.display = gameStarted ? 'block' : 'none'; } // Update Buffs if (rapidFireTimer > 0) rapidFireTimer--; // Shield Visuals if (shieldActive) { if (!shieldMesh) { const geom = new THREE.SphereGeometry(0.25, 16, 16); const mat = new THREE.MeshBasicMaterial({ color: 0x00ffff, transparent: true, opacity: 0.3, wireframe: true }); shieldMesh = new THREE.Mesh(geom, mat); scene.add(shieldMesh); } shieldMesh.position.copy(player.position); shieldMesh.rotation.y += 0.05; } else if (shieldMesh) { scene.remove(shieldMesh); shieldMesh.geometry.dispose(); shieldMesh.material.dispose(); shieldMesh = null; } // Update player movement with arrow keys const speed = Math.max(0.025, 0.045 - level * 0.001) * (level === 4 ? 0.75 : 1); // Player slows slightly with higher levels if (keys['ArrowLeft'] || keys['KeyA']) { const newX = player.position.x - speed; player.position.x = Math.max(-2.2, newX); if (newX <= -2.2 && player.material) { player.material.emissiveIntensity = 2.0; } } if (keys['ArrowRight'] || keys['KeyD']) { const newX = player.position.x + speed; player.position.x = Math.min(2.2, newX); if (newX >= 2.2 && player.material) { player.material.emissiveIntensity = 2.0; } } // Removed vertical movement: player.position.y is fixed. // if (keys['ArrowUp'] || keys['KeyW']) { // player.position.y = Math.min(-0.5, player.position.y + speed); // Constrain player to bottom half of screen // } // if (keys['ArrowDown'] || keys['KeyS']) { // player.position.y = Math.max(-1.5, player.position.y - speed); // Constrain player to bottom half of screen // } // Spawn enemies periodically - faster with higher levels, adjusted for swarms const level4SpawnMultiplier = level === 4 ? 1.8 : 1; if (Math.random() < ((baseSpawnRate + Math.max(1, level) * 0.002) * level4SpawnMultiplier)) { spawnEnemy(); } // Spawn boss every 3 levels if (!globalBossSpawned && level >= 3 && enemiesKilled === 0 && !bossActive && !boss) { spawnBoss(); globalBossSpawned = true; } // Handle continuous shooting for laser type if (gameStarted && shooterConfigs[currentShooterIndex].id === 'laser') { shoot(); } // Update enemies enemies.forEach((enemy, index) => { enemy.mesh.position.y -= enemy.velocity; // Wiggly bug movement enemy.wiggleOffset += enemy.wigglePhase; enemy.mesh.position.x += Math.sin(enemy.wiggleOffset) * 0.015; enemy.mesh.rotation.z = Math.sin(enemy.wiggleOffset * 0.7) * 0.2; // Slight rolling enemy.mesh.rotation.x = Math.cos(enemy.wiggleOffset * 0.5) * 0.1; // Slight pitching if (enemy.mesh.position.y < -2) { scene.remove(enemy.mesh); if (enemy.mesh.traverse) { // Enemy mesh is a Group enemy.mesh.traverse(child => { if (child.isMesh) { if (child.geometry) child.geometry.dispose(); if (child.material) { if (Array.isArray(child.material)) { child.material.forEach(mat => mat?.dispose()); } else { child.material.dispose(); } } } }); } else { // Fallback for simple meshes if (enemy.mesh.geometry) enemy.mesh.geometry.dispose(); if (enemy.mesh.material) { if (Array.isArray(enemy.mesh.material)) { enemy.mesh.material.forEach(mat => mat?.dispose()); } else { enemy.mesh.material.dispose(); } } } enemies.splice(index, 1); } }); // Update power-ups powerUps.forEach((powerUp, pIndex) => { powerUp.mesh.position.y -= powerUp.velocity; powerUp.mesh.rotation.z += powerUp.rotationSpeed; // Sparkle effect powerUp.sparkingTimer++; if (powerUp.sparkleTimer % 10 === 0) { powerUp.mesh.traverse(child => { if (child.isMesh && child.material) { child.material.emissiveIntensity = 1.5; setTimeout(() => { if (child.material) child.material.emissiveIntensity = 0.8; }, 100); } }); } if (powerUp.mesh.position.y < -2) { scene.remove(powerUp.mesh); powerUp.mesh.traverse(child => { if (child.isMesh) { if (child.geometry) child.geometry.dispose(); if (child.material) { if (Array.isArray(child.material)) { child.material.forEach(mat => mat?.dispose()); } else { child.material.dispose(); } } } }); powerUps.splice(pIndex, 1); } }); // Update boss if (boss && bossActive) { boss.mesh.position.y -= boss.velocity; boss.shootTimer++; if (boss.shieldCounter !== undefined) { boss.shieldCounter = Math.max(0, boss.shieldCounter - 1); } // Boss tracks player horizontally const targetX = player.position.x * 0.3; boss.mesh.position.x += (targetX - boss.mesh.position.x) * 0.02; boss.mesh.rotation.z = Math.sin(Date.now() * 0.005) * 0.1; // Boss shoots const shootInterval = (level === 6 ? 35 : level === 4 ? 25 : level === 3 ? 65 : 50 - level * 2); if (boss.shootTimer > shootInterval) { const bossBulletGeometry = new THREE.SphereGeometry((level === 6 ? 0.045 : 0.035)); const bossBulletMaterial = new THREE.MeshStandardMaterial({ color: 0xff0000, emissive: 0xff0000 }); const bossBullet = new THREE.Mesh(bossBulletGeometry, bossBulletMaterial); bossBullet.position.copy(boss.mesh.position); bossBullet.position.y -= 0.4; scene.add(bossBullet); bullets.push({ mesh: bossBullet, velocity: (level === 6 ? -0.18 : level === 4 ? -0.17 : -0.15), isBossBullet: true }); boss.shootTimer = 0; } if (boss.mesh.position.y < -1) { scene.remove(boss.mesh); if (boss.mesh.traverse) { boss.mesh.traverse(child => { if (child.isMesh) { if (child.geometry) child.geometry.dispose(); if (child.material) { if (Array.isArray(child.material)) { child.material.forEach(mat => mat?.dispose()); } else { child.material.dispose(); } } } }); } boss = null; bossActive = false; } } // Update bullets bullets.forEach((bullet, bIndex) => { if (bullet.homing && enemies.length > 0) { let closest = null; let minDist = Infinity; enemies.forEach(e => { const d = bullet.mesh.position.distanceTo(e.mesh.position); if (d < minDist) { minDist = d; closest = e; } }); if (closest) { const dir = new THREE.Vector3().subVectors(closest.mesh.position, bullet.mesh.position).normalize(); bullet.mesh.position.addScaledVector(dir, 0.02); } } bullet.mesh.position.y += bullet.velocity; if (bullet.mesh.position.y > 2) { scene.remove(bullet.mesh); if (bullet.mesh.geometry) { bullet.mesh.geometry.dispose(); } if (bullet.mesh.material) { bullet.mesh.material.dispose(); } bullets.splice(bIndex, 1); return; } // Check collisions with enemies enemies.forEach((enemy, eIndex) => { if (bullet.piercing && bullet.hitEnemies.has(enemy)) return; const distance = bullet.mesh.position.distanceTo(enemy.mesh.position); // Collision radius adjusted for bug body size (focus on main body, not legs) const collisionRadius = enemy.isBigEnemy ? 0.16 : 0.11; if (distance < collisionRadius) { // Hit enemy! if (bullet.piercing) { bullet.hitEnemies.add(enemy); } else { scene.remove(bullet.mesh); if (bullet.mesh.geometry) bullet.mesh.geometry.dispose(); if (bullet.mesh.material) bullet.mesh.material.dispose(); bullets.splice(bIndex, 1); } scene.remove(enemy.mesh); if (enemy.mesh.traverse) { // Enemy mesh is a Group enemy.mesh.traverse(child => { if (child.isMesh) { if (child.geometry) child.geometry.dispose(); if (child.material) { if (Array.isArray(child.material)) { child.material.forEach(mat => mat?.dispose()); } else { child.material.dispose(); } } } }); } else { // Fallback for simple meshes if (enemy.mesh.geometry) enemy.mesh.geometry.dispose(); if (enemy.mesh.material) { if (Array.isArray(enemy.mesh.material)) { enemy.mesh.material.forEach(mat => mat?.dispose()); } else { enemy.mesh.material.dispose(); } } } // Flash effect for high-point enemies if (enemy.points > 100) { enemy.mesh.traverse(child => { if (child.isMesh && child.material) { child.material.emissiveIntensity = 2.0; } }); } createExplosion(enemy.mesh.position.x, enemy.mesh.position.y, enemyColor, 12); enemies.splice(eIndex, 1); score += enemy.points; credits += 10; enemiesKilled++; if (enemiesKilled >= enemiesToNextLevel) { level++; enemiesToNextLevel += 8; enemiesKilled = 0; levelCompleteMessage = true; levelCompleteTimer = 0; globalBossSpawned = false; } updateScoreUI(); // Update credits and score display saveGameData(); // Save credits after gaining them return; } }); // Check collisions with power-ups powerUps.forEach((powerUp, pIndex) => { const distance = bullet.mesh.position.distanceTo(powerUp.mesh.position); if (distance < 0.15) { // Hit power-up! scene.remove(bullet.mesh); if (bullet.mesh.geometry) bullet.mesh.geometry.dispose(); if (bullet.mesh.material) bullet.mesh.material.dispose(); bullets.splice(bIndex, 1); scene.remove(powerUp.mesh); powerUp.mesh.traverse(child => { if (child.isMesh) { if (child.geometry) child.geometry.dispose(); if (child.material) { if (Array.isArray(child.material)) { child.material.forEach(mat => mat?.dispose()); } else { child.material.dispose(); } } } }); powerUps.splice(pIndex, 1); score += 200; credits += 100; updateScoreUI(); saveGameData(); return; } }); // Check collision with boss if (boss && bossActive && !bullet.isBossBullet) { const bossDistance = bullet.mesh.position.distanceTo(boss.mesh.position); const bossCollisionRadius = 0.25; if (bossDistance < bossCollisionRadius) { scene.remove(bullet.mesh); if (bullet.mesh.geometry) bullet.mesh.geometry.dispose(); if (bullet.mesh.material) bullet.mesh.material.dispose(); bullets.splice(bIndex, 1); bossHealth--; screenShake = 0.05; createExplosion(bullet.mesh.position.x, bullet.mesh.position.y, 0xffffff, 5); if (bossHealth <= 0) { screenShake = 0.2; createExplosion(boss.mesh.position.x, boss.mesh.position.y, enemyColor, 40); // Boss defeated! scene.remove(boss.mesh); if (boss.mesh.traverse) { boss.mesh.traverse(child => { if (child.isMesh) { if (child.geometry) child.geometry.dispose(); if (child.material) { if (Array.isArray(child.material)) { child.material.forEach(mat => mat?.dispose()); } else { child.material.dispose(); } } } }); } else { if (boss.mesh.geometry) boss.mesh.geometry.dispose(); if (boss.mesh.material) { if (Array.isArray(boss.mesh.material)) { boss.mesh.material.forEach(mat => mat?.dispose()); } else { boss.mesh.material.dispose(); } } } boss = null; bossActive = false; score += 1000; credits += 10; saveGameData(); updateScoreUI(); } return; } } }); // Check player collision with enemies enemies.forEach((enemy, eIndex) => { const distance = player.position.distanceTo(enemy.mesh.position); // Collision radius for bug enemies (slightly larger for player collision) const collisionRadius = enemy.isBigEnemy ? 0.21 : 0.14; if (distance < collisionRadius) { if (shieldActive) { shieldActive = false; scene.remove(enemy.mesh); createExplosion(enemy.mesh.position.x, enemy.mesh.position.y, enemyColor, 12); enemies.splice(eIndex, 1); screenShake = 0.1; } else { gameOver = true; updateHighScore(); updateGameOverScreen(); gameOverElement.style.display = 'block'; } } }); // Check player collision with power-ups powerUps.forEach((powerUp, pIndex) => { const distance = player.position.distanceTo(powerUp.mesh.position); if (distance < 0.2) { // Collect power-up! if (powerUp.type === 'shield') { shieldActive = true; } else if (powerUp.type === 'star') { rapidFireTimer = 300; // ~5 seconds at 60fps } scene.remove(powerUp.mesh); powerUp.mesh.traverse(child => { if (child.isMesh) { if (child.geometry) child.geometry.dispose(); if (child.material) { if (Array.isArray(child.material)) { child.material.forEach(mat => mat?.dispose()); } else { child.material.dispose(); } } } }); powerUps.splice(pIndex, 1); score += 200; credits += 50; updateScoreUI(); saveGameData(); // Power-up sparkle effect on player if (player.material) { const originalEmissive = player.material.emissiveIntensity || 1; player.material.emissiveIntensity = 2; setTimeout(() => { if (player.material) player.material.emissiveIntensity = originalEmissive; }, 300); } } }); // Check player collision with boss bullets bullets.forEach((bullet, bIndex) => { if (bullet.isBossBullet) { const distance = player.position.distanceTo(bullet.mesh.position); if (distance < 0.15) { scene.remove(bullet.mesh); bullet.mesh.geometry.dispose(); bullet.mesh.material.dispose(); bullets.splice(bIndex, 1); if (shieldActive) { shieldActive = false; screenShake = 0.05; } else { updateHighScore(); updateGameOverScreen(); gameOver = true; gameOverElement.style.display = 'block'; } } } }); // Check player collision with boss if (boss && bossActive) { const bossDistance = player.position.distanceTo(boss.mesh.position); const bossCollisionRadius = 0.5; if (bossDistance < bossCollisionRadius) { updateHighScore(); updateGameOverScreen(); gameOver = true; gameOverElement.style.display = 'block'; } } // Update Screen Shake if (screenShake > 0) { camera.position.x = (Math.random() - 0.5) * screenShake; camera.position.y = (Math.random() - 0.5) * screenShake; screenShake *= 0.9; if (screenShake < 0.01) { screenShake = 0; camera.position.set(0, 0, 3); } } // Update Particles for (let i = particles.length - 1; i >= 0; i--) { const p = particles[i]; p.mesh.position.add(p.velocity); p.life -= p.decay; p.mesh.material.opacity = p.life; p.mesh.scale.setScalar(p.life); if (p.life <= 0) { scene.remove(p.mesh); p.mesh.geometry.dispose(); p.mesh.material.dispose(); particles.splice(i, 1); } } // Pulsing Thruster Effect if (player && player.material) { const pulse = 0.5 + Math.sin(Date.now() * 0.01) * 0.2; if (player.material.emissiveIntensity !== undefined) { player.material.emissiveIntensity = (keys['ArrowLeft'] || keys['ArrowRight'] || keys['KeyA'] || keys['KeyD']) ? 2.0 : pulse; } } renderer.render(scene, camera); window.__THREE_ANIMATION__ = requestAnimationFrame(animate); } let animationId = requestAnimationFrame(animate); window.__THREE_DISPOSE__ = () => { // Cancel cover animation if (window.__COVER_ANIMATION__) { cancelAnimationFrame(window.__COVER_ANIMATION__); } // Cancel animation loop if (window.__THREE_ANIMATION__) { cancelAnimationFrame(window.__THREE_ANIMATION__); } if (animationId) { cancelAnimationFrame(animationId); } try { renderer.dispose(); } catch (error) { console.warn('Failed to dispose Three.js renderer', error); } window.removeEventListener('resize', onWindowResize); // Remove event listeners if (window.__THREE_EVENT_LISTENERS__) { const listeners = window.__THREE_EVENT_LISTENERS__; if (listeners.startButton) startButton.removeEventListener('click', listeners.startButton); if (listeners.openShopButton) openShopButton.removeEventListener('click', listeners.openShopButton); if (listeners.closeShopButton) closeShopButton.removeEventListener('click', listeners.closeShopButton); if (listeners.applyPlayerColorButton) applyPlayerColorButton.removeEventListener('click', listeners.applyPlayerColorButton); // Changed handler name if (listeners.applyEnemyColorButton) applyEnemyColorButton.removeEventListener('click', listeners.applyEnemyColorButton); // Remove new handler if (listeners.restartButton) restartButton.removeEventListener('click', listeners.restartButton); if (listeners.resetButton) resetButton.removeEventListener('click', listeners.resetButton); if (listeners.codeButton) codeButton.removeEventListener('click', listeners.codeButton); if (listeners.resize) window.removeEventListener('resize', listeners.resize); if (listeners.keydown1) document.removeEventListener('keydown', listeners.keydown1); if (listeners.keydown2) window.removeEventListener('keydown', listeners.keydown2); if (listeners.keyup) document.removeEventListener('keyup', listeners.keyup); } // Also remove the inline handlers we added if (document._keydownHandler1) document.removeEventListener('keydown', document._keydownHandler1); if (document._keydownHandler2) window.removeEventListener('keydown', document._keydownHandler2); if (document._keydownHandler3) document.removeEventListener('keydown', document._keydownHandler3); if (document._keyupHandler) document.removeEventListener('keyup', document._keyupHandler); // Clear enemies, bullets, and boss enemies.forEach(enemy => { scene.remove(enemy.mesh); if (enemy.mesh.traverse) { // Enemy mesh is a Group enemy.mesh.traverse(child => { if (child.isMesh) { if (child.geometry) child.geometry.dispose(); if (child.material) { if (Array.isArray(child.material)) { child.material.forEach(mat => mat?.dispose()); } else { child.material.dispose(); } } } }); } else { // Fallback for simple meshes if (enemy.mesh.geometry) enemy.mesh.geometry.dispose(); if (enemy.mesh.material) { if (Array.isArray(enemy.mesh.material)) { enemy.mesh.material.forEach(mat => mat?.dispose()); } else { enemy.mesh.material.dispose(); } } } }); enemies = []; powerUps.forEach(powerUp => { scene.remove(powerUp.mesh); powerUp.mesh.traverse(child => { if (child.isMesh) { if (child.geometry) child.geometry.dispose(); if (child.material) { if (Array.isArray(child.material)) { child.material.forEach(mat => mat?.dispose()); } else { child.material.dispose(); } } } }); }); powerUps = []; bullets.forEach(bullet => { scene.remove(bullet.mesh); if (bullet.mesh.geometry) { bullet.mesh.geometry.dispose(); } if (bullet.mesh.material) { if (Array.isArray(bullet.mesh.material)) { bullet.mesh.material.forEach(mat => mat?.dispose()); } else { bullet.mesh.material.dispose(); } } }); bullets = []; if (boss) { scene.remove(boss.mesh); if (boss.mesh.traverse) { // Boss mesh is a Group (or Mesh with children) boss.mesh.traverse(child => { if (child.isMesh) { if (child.geometry) child.geometry.dispose(); if (child.material) { if (Array.isArray(child.material)) { child.material.forEach(mat => mat?.dispose()); } else { child.material.dispose(); } } } }); } else { // Fallback for simple meshes if (boss.mesh.geometry) boss.mesh.geometry.dispose(); if (boss.mesh.material) { if (Array.isArray(boss.mesh.material)) { boss.mesh.material.forEach(mat => mat?.dispose()); } else { boss.mesh.material.dispose(); } } } } while (scene.children.length > 0) { const child = scene.children[0]; scene.remove(child); if (child.traverse) { // If it's a Group, traverse and dispose children child.traverse(grandchild => { if (grandchild.isMesh) { if (grandchild.geometry) grandchild.geometry.dispose(); if (grandchild.material) { if (Array.isArray(grandchild.material)) { grandchild.material.forEach(mat => mat?.dispose()); } else { grandchild.material.dispose(); } } } }); } else { // It's a simple Mesh if (child.geometry) { child.geometry.dispose(); } if (child.material) { if (Array.isArray(child.material)) { child.material.forEach((mat) => mat?.dispose()); } else { child.material.dispose(); } } } } const container = document.getElementById('renderDiv'); if (container && renderer.domElement.parentElement === container) { container.removeChild(renderer.domElement); } // Clean up cover scene if (coverRenderer) { coverRenderer.dispose(); coverRenderer.domElement.remove(); } if (coverContainer) coverContainer.remove(); // Clean up cover scene objects if (coverScene) { while (coverScene.children.length > 0) { const child = coverScene.children[0]; coverScene.remove(child); if (child.geometry) child.geometry.dispose(); if (child.material) { if (Array.isArray(child.material)) { child.material.forEach(mat => mat?.dispose()); } else { child.material.dispose(); } } } } // Clean up spaceship if (spaceship) { spaceship.traverse(child => { if (child.geometry) child.geometry.dispose(); if (child.material) { if (Array.isArray(child.material)) { child.material.forEach(mat => mat?.dispose()); } else { child.material.dispose(); } } }); } // Clean up stars if (starsGeometry) starsGeometry.dispose(); if (starsMaterial) starsMaterial.dispose(); // Clean up decorations if (decoGroup) { decoGroup.traverse(child => { if (child.geometry) child.geometry.dispose(); if (child.material) { if (Array.isArray(child.material)) { child.material.forEach(m => m.dispose()); } else { child.material.dispose(); } } }); } // Clean up UI elements if (startScreenElement) startScreenElement.remove(); if (gameOverElement) gameOverElement.remove(); if (scoreElement) scoreElement.remove(); if (shopElement) shopElement.remove(); // Clean up shop element if (openShopButton) openShopButton.remove(); // Clean up shop button if (attributionElement) attributionElement.remove(); // Clean up attribution element if (arenaElement) arenaElement.remove(); // Clean up arena element if (warriorsElement) warriorsElement.remove(); // Clean up warriors element if (loadingScreen) loadingScreen.remove(); // Clean up loading screen if (loginRewardMessageElement) loginRewardMessageElement.remove(); // Clean up login reward element if (codeButton) codeButton.remove(); // Clean up code button if (codeCopyMessage) codeCopyMessage.remove(); // Clean up code copy message if (codeRedeemElement) codeRedeemElement.remove(); // Clean up redeem code element if (profileElement) profileElement.remove(); if (profileButton) profileButton.remove(); if (newProfileButton) newProfileButton.remove(); if (skipLevelButton) skipLevelButton.remove(); if (holidayBanner) holidayBanner.remove(); // Dispose audio objects if (audio) { audio.stop(); audio.disconnect(); } if (shootSound) { shootSound.stop(); shootSound.disconnect(); } if (listener && camera) { camera.remove(listener); } // Explicitly remove all stored event listeners if (window.__THREE_EVENT_LISTENERS__) { const listeners = window.__THREE_EVENT_LISTENERS__; // Remove UI button listeners if (startButton && listeners.startButton) startButton.removeEventListener('click', listeners.startButton); if (openShopButton && listeners.openShopButton) openShopButton.removeEventListener('click', listeners.openShopButton); if (closeShopButton && listeners.closeShopButton) closeShopButton.removeEventListener('click', listeners.closeShopButton); if (restartButton && listeners.restartButton) restartButton.removeEventListener('click', listeners.restartButton); if (resetButton && listeners.resetButton) resetButton.removeEventListener('click', listeners.resetButton); if (codeButton && listeners.codeButton) codeButton.removeEventListener('click', listeners.codeButton); if (redeemButton && listeners.redeemButton) redeemButton.removeEventListener('click', listeners.redeemButton); if (closeCodeButton && listeners.closeCodeButton) closeCodeButton.removeEventListener('click', listeners.closeCodeButton); // Remove skip level button listener if it exists if (skipLevelButton) { skipLevelButton.removeEventListener('click', skipLevel); } // Remove keyboard and window listeners if (listeners.resize) window.removeEventListener('resize', listeners.resize); if (listeners.keydown1) document.removeEventListener('keydown', listeners.keydown1); if (listeners.keydown2) window.removeEventListener('keydown', listeners.keydown2); // This one was on window if (listeners.keydown3) document.removeEventListener('keydown', listeners.keydown3); if (listeners.keyup) document.removeEventListener('keyup', listeners.keyup); } // Previous redundant cleanup of _keydownHandlerX and _keyupHandler removed };

WARRIORS SHOOTER❤

How to Play