const DESIGN_WIDTH = 800; const DESIGN_HEIGHT = 600; if (typeof window.__P5_CLEANUP__ === "function") { window.__P5_CLEANUP__(); } const sketch = (p) => { let angle = 0; let scaleFactor = 1; let offsetX = 0; let offsetY = 0; let resizeObserver = null; let resizeHandler = null; let teardown = null; const getContainer = () => document.getElementById("renderDiv"); const computeLayout = () => { const container = getContainer(); const width = Math.max(1, container ? container.clientWidth : window.innerWidth); const height = Math.max(1, container ? container.clientHeight : window.innerHeight); const fitScale = Math.max( 0.1, Math.min(width / DESIGN_WIDTH, height / DESIGN_HEIGHT) || 1 ); scaleFactor = fitScale; offsetX = (width - DESIGN_WIDTH * scaleFactor) / 2; offsetY = (height - DESIGN_HEIGHT * scaleFactor) / 2; return { width, height }; }; const resizeCanvasToContainer = () => { const { width, height } = computeLayout(); p.resizeCanvas(width, height); }; const toDesignSpace = (clientX, clientY) => ({ x: (clientX - offsetX) / scaleFactor, y: (clientY - offsetY) / scaleFactor, }); p.setup = () => { lastKillTime = 0; const { width, height } = computeLayout(); const renderer = p.createCanvas(width, height); renderer.parent("renderDiv"); p.pixelDensity(Math.min(2, window.devicePixelRatio || 1)); p.noStroke(); p.textFont('monospace'); const container = getContainer(); if (typeof ResizeObserver !== "undefined" && container) { resizeObserver = new ResizeObserver(() => { resizeCanvasToContainer(); }); resizeObserver.observe(container); } else { resizeHandler = () => resizeCanvasToContainer(); window.addEventListener("resize", resizeHandler); } teardown = () => { if (resizeObserver) { resizeObserver.disconnect(); resizeObserver = null; } if (resizeHandler) { window.removeEventListener("resize", resizeHandler); resizeHandler = null; } }; }; p.windowResized = () => { resizeCanvasToContainer(); }; let enemies = []; let items = []; let score = 0; let coins = 0; let gameTime = 0; let lastKillTime = 0; let showShop = false; let shopItems = [ { name: 'Speed Boost', cost: 100, owned: false, effect: 'speed', active: false, cooldown: 0, desc: 'Move 50% faster for 10s' }, { name: 'Big Shot', cost: 150, owned: false, effect: 'bigshot', active: false, cooldown: 0, desc: '1.5x shot size for 10s' }, { name: 'Coin Magnet', cost: 200, owned: false, effect: 'magnet', active: false, cooldown: 0, desc: 'Pull coins toward cursor' }, { name: 'Extra Time', cost: 250, owned: false, effect: 'time', active: false, cooldown: 0, desc: '+10s to timer' }, { name: 'Health Pack', cost: 300, owned: false, effect: 'health', amount: 1, desc: '+1 life (max 5)' }, { name: 'Rapid Fire', cost: 350, owned: false, effect: 'rapid', active: false, cooldown: 0, desc: 'Faster shooting for 15s' }, { name: 'Shield', cost: 400, owned: false, effect: 'shield', active: false, cooldown: 0, desc: 'Invincible for 8s' }, { name: 'Triple Shot', cost: 450, owned: false, effect: 'tripleshot', active: false, cooldown: 0, desc: 'Shoot 3 bullets at once for 12s' }, { name: 'Enemy Slow', cost: 500, owned: false, effect: 'enemyslow', active: false, cooldown: 0, desc: 'Slow enemies 50% for 12s' }, { name: 'Coin Multiplier', cost: 550, owned: false, effect: 'coinmult', active: false, cooldown: 0, desc: '2x coins for 20s' }, { name: 'Super Shield', cost: 600, owned: false, effect: 'supershield', active: false, cooldown: 0, desc: 'Big invincible shield for 10s' }, { name: 'Bomb', cost: 650, owned: false, effect: 'bomb', active: false, cooldown: 0, desc: 'Clear all enemies instantly' }, { name: 'Score Multiplier', cost: 700, owned: false, effect: 'scoremult', active: false, cooldown: 0, desc: '2x score for 15s' }, { name: 'Spawn Blocker', cost: 750, owned: false, effect: 'spawnblock', active: false, cooldown: 0, desc: 'Stop enemy spawns for 20s' }, { name: 'Big Magnet', cost: 800, owned: false, effect: 'bigmagnet', active: false, cooldown: 0, desc: 'Stronger coin pull (150px)' }, { name: 'Max Health', cost: 900, owned: false, effect: 'maxhealth', amount: 5, desc: 'Set health to 5 instantly' }, { name: 'Auto Clicker', cost: 1000, owned: false, effect: 'autoclicker', active: false, cooldown: 0, desc: 'Automatically clicks enemies nearby! (Score 1000+ required)' } ]; let activeEffects = { speed: 1, bigShot: 1, coinMagnet: false, extraTime: 0, health: 3, rapidFire: false, shield: false, tripleShot: false, enemySlow: 1, coinMultiplier: 1, superShield: false, bomb: false, scoreMultiplier: 1, spawnBlock: false, bigMagnet: false, maxHealth: false, autoclicker: false }; let showAllItems = false; let showAllShopItems = false; const addEnemy = () => { enemies.push({ x: p.random(50, DESIGN_WIDTH - 50), y: p.random(50, DESIGN_HEIGHT - 50), vx: p.random(-1, 1), vy: p.random(-1, 1), size: p.random(20, 40), hit: false }); }; const addItem = () => { items.push({ x: p.random(50, DESIGN_WIDTH - 50), y: p.random(50, DESIGN_HEIGHT - 50), vx: p.random(-0.8, 0.8), vy: p.random(-0.8, 0.8), size: p.random(22, 28), collected: false, type: 'shot' }); }; p.mousePressed = () => { const pointer = toDesignSpace(p.mouseX, p.mouseY); // Shop toggle button if (!showShop && pointer.x > DESIGN_WIDTH - 80 && pointer.x < DESIGN_WIDTH - 20 && pointer.y > 20 && pointer.y < 50) { showShop = true; p.noLoop(); return; } // Continue Playing button if (showShop && pointer.x > DESIGN_WIDTH - 200 && pointer.x < DESIGN_WIDTH - 50 && pointer.y > 90 && pointer.y < 120) { showShop = false; p.loop(); return; } if (showShop) { // Back to game button if (pointer.x > DESIGN_WIDTH - 200 && pointer.x < DESIGN_WIDTH - 50 && pointer.y > 50 && pointer.y < 80) { showShop = false; p.loop(); return; } // Shop interactions for (let i = 0; i < shopItems.length; i++) { const item = shopItems[i]; const baseX = DESIGN_WIDTH / 2 - 200; const baseY = 150 + i * 60; // Buy button const buyX = baseX + 215; const buyY = baseY + 15; const canBuyAutoclicker = item.effect !== 'autoclicker' || (score >= 1000 && !item.owned); if (pointer.x > buyX && pointer.x < buyX + 80 && pointer.y > buyY && pointer.y < buyY + 30 && coins >= item.cost && !item.owned && canBuyAutoclicker) { coins -= item.cost; item.owned = true; p.noLoop(); return; } // Use/Activate button if (item.owned) { let useX, useY; if (item.effect === 'health' || item.effect === 'maxhealth') { useX = baseX + 220; useY = baseY + 45; if (item.effect === 'health') { if (activeEffects.health < 5) { activeEffects.health = Math.min(5, activeEffects.health + item.amount); return; } } else if (item.effect === 'maxhealth') { activeEffects.health = 5; return; } } else if (item.effect === 'bomb') { useX = baseX + 220; useY = baseY + 45; enemies = []; item.cooldown = 1800; // 30s cooldown return; } else if (item.effect === 'autoclicker') { useX = baseX + 220; useY = baseY + 45; if (item.cooldown <= 0) { item.active = !item.active; if (item.active) { item.cooldown = 3600; // 60s cooldown } return; } } else if (item.cooldown <= 0) { useX = baseX + 220; useY = baseY + 45; item.active = !item.active; if (item.active) { item.cooldown = item.effect === 'rapid' ? 900 : item.effect === 'shield' ? 480 : item.effect === 'tripleshot' || item.effect === 'enemyslow' ? 720 : item.effect === 'coinmult' ? 1200 : item.effect === 'scoremult' ? 900 : item.effect === 'spawnblock' ? 1200 : 600; } return; } } } return; } // Check enemies first for (let i = enemies.length - 1; i >= 0; i--) { const enemy = enemies[i]; const dist = p.dist(pointer.x, pointer.y, enemy.x, enemy.y); if (dist < (enemy.size / 2) * activeEffects.bigShot) { // Shield protection if (!activeEffects.shield) { // Rapid fire cooldown if (!activeEffects.rapidFire || gameTime % 0.2 < 1/60) { enemies.splice(i, 1); score += 10; lastKillTime = gameTime; // Spawn shot item on enemy kill addItem(); } } return; } } // Check items for (let i = items.length - 1; i >= 0; i--) { const item = items[i]; if (item.collected) continue; const dist = p.dist(pointer.x, pointer.y, item.x, item.y); if (dist < item.size / 2 * activeEffects.bigShot) { item.collected = true; if (item.type === 'shot') { coins += 10 * activeEffects.coinMultiplier; } return; } } }; p.keyPressed = () => { if (p.key.toLowerCase() === 's') { showShop = !showShop; if (showShop) { p.noLoop(); } else { p.loop(); } } if (p.key.toLowerCase() === 'i') { showAllItems = !showAllItems; } if (p.key.toLowerCase() === 'o') { showAllShopItems = !showAllShopItems; } }; p.draw = () => { p.background(15, 23, 42); gameTime += 1/60; p.push(); p.translate(offsetX, offsetY); p.scale(scaleFactor); // Score and coins display with bounce effect const coinBounce = p.sin(gameTime * 8) * 2; p.fill(255); p.textSize(32 + coinBounce); p.textAlign(p.LEFT); p.text(`Score: ${score}`, 20, 40); p.fill(255, 215, 0); p.textSize(28 + coinBounce); p.text(`Coins: ${coins}`, 150, 38); // All Items toggle button p.fill(showAllItems ? [0, 255, 0] : [100]); p.rect(20, 55, 100, 25, 5); p.fill(255); p.textSize(14); p.textAlign(p.CENTER, p.CENTER); p.text(showAllItems ? 'ITEMS: ON' : 'ITEMS: OFF', 70, 67.5); // All Shop Items toggle button p.fill(showAllShopItems ? [255, 215, 0] : [100]); p.rect(130, 55, 120, 25, 5); p.fill(255); p.textSize(12); p.textAlign(p.CENTER, p.CENTER); p.text(showAllShopItems ? 'SHOP ITEMS: ON' : 'SHOP ITEMS: OFF', 190, 67.5); // Shop toggle button (coin icon) p.fill(255, 215, 0); p.circle(DESIGN_WIDTH - 60, 35, 30 + p.sin(gameTime * 6) * 2); p.fill(0); p.textSize(12); p.textAlign(p.CENTER, p.CENTER); p.text('SHOP', DESIGN_WIDTH - 60, 35); // Update effects cooldowns for (let item of shopItems) { if (item.cooldown > 0) { item.cooldown--; if (item.cooldown <= 0) { item.active = false; } } } // Update active effects activeEffects.speed = shopItems.find(item => item.effect === 'speed')?.active ? 1.5 : 1; activeEffects.bigShot = shopItems.find(item => item.effect === 'bigshot')?.active ? 1.5 : 1; activeEffects.coinMagnet = shopItems.find(item => item.effect === 'magnet')?.active || shopItems.find(item => item.effect === 'bigmagnet')?.active; activeEffects.rapidFire = shopItems.find(item => item.effect === 'rapid')?.active; activeEffects.tripleShot = shopItems.find(item => item.effect === 'tripleshot')?.active; activeEffects.enemySlow = shopItems.find(item => item.effect === 'enemyslow')?.active ? 0.5 : 1; activeEffects.coinMultiplier = shopItems.find(item => item.effect === 'coinmult')?.active ? 2 : 1; activeEffects.superShield = shopItems.find(item => item.effect === 'supershield')?.active; activeEffects.shield = activeEffects.superShield || shopItems.find(item => item.effect === 'shield')?.active; activeEffects.scoreMultiplier = shopItems.find(item => item.effect === 'scoremult')?.active ? 2 : 1; activeEffects.spawnBlock = shopItems.find(item => item.effect === 'spawnblock')?.active; activeEffects.bigMagnet = shopItems.find(item => item.effect === 'bigmagnet')?.active; activeEffects.autoclicker = shopItems.find(item => item.effect === 'autoclicker')?.active; const timeItem = shopItems.find(item => item.effect === 'time'); if (timeItem?.active) { lastKillTime -= 10/60; // Add 10 seconds timeItem.active = false; } // Timer display with extra time const timeSinceLastKill = gameTime - lastKillTime; const timeLeft = 30 + activeEffects.extraTime - timeSinceLastKill; // Health display p.fill(255, 0, 0); p.textSize(24); p.text(`Lives: ${activeEffects.health}`, 20, 105); p.fill(timeLeft > 10 ? 255 : timeLeft > 5 ? [255, 255, 0] : [255, 0, 0]); p.textSize(28); p.text(`Time: ${Math.max(0, Math.ceil(timeLeft))}`, 20, 75); // Game over check (health system) if (timeSinceLastKill > 30) { activeEffects.health -= 1; if (activeEffects.health <= 0) { p.fill(255, 0, 0); p.textSize(64); p.textAlign(p.CENTER); p.text('GAME OVER', DESIGN_WIDTH / 2, DESIGN_HEIGHT / 2); p.noLoop(); // Reset effects for next game for (let item of shopItems) { item.active = false; if (item.effect !== 'health') item.cooldown = 0; } activeEffects = { speed: 1, bigShot: 1, coinMagnet: false, extraTime: 0, health: 3, rapidFire: false, shield: false }; return; } else { lastKillTime = gameTime; // Reset timer on life loss } } // All Items display if (showAllItems && !showShop) { p.fill(0, 0, 0, 180); p.rect(15, 135, 240, 420, 10); p.fill(255); p.textSize(18); p.textAlign(p.CENTER); p.text('ALL ITEMS', 135, 155); p.textAlign(p.LEFT); for (let i = 0; i < Math.min(12, shopItems.length); i++) { const item = shopItems[i]; const baseX = 25; const baseY = 175 + i * 32; // Simple icon p.fill(100); p.rect(baseX - 5, baseY - 12, 24, 24, 4); p.fill(255); switch(i) { case 0: p.stroke(0, 255, 255); p.strokeWeight(2); p.line(baseX+3, baseY-5, baseX+15, baseY+5); p.noStroke(); break; case 1: p.fill(255, 215, 0); p.circle(baseX+10, baseY, 12); break; case 2: p.fill(255, 0, 255); p.circle(baseX+10, baseY, 10); p.fill(255); p.circle(baseX+10, baseY-4, 3); break; case 3: p.stroke(0, 255, 0); p.strokeWeight(1.5); p.noFill(); p.arc(baseX+10, baseY, 16, 16, 0, p.TAU*0.75); p.noStroke(); break; case 4: p.fill(255, 0, 0); p.circle(baseX+4, baseY, 6); p.circle(baseX+16, baseY, 6); break; case 5: p.fill(0, 255, 255); p.circle(baseX+6, baseY, 4); p.circle(baseX+12, baseY, 4); break; case 6: p.stroke(100, 255, 255); p.strokeWeight(1.5); p.noFill(); p.circle(baseX+10, baseY, 14); p.noStroke(); break; default: p.fill(180); p.circle(baseX+10, baseY, 8); break; } // Name and status p.fill(item.owned ? [0, 255, 0] : 200); p.textSize(14); p.text(item.name, baseX + 25, baseY + 4); // Cost/Owned p.fill(255, 215, 0); p.textSize(12); p.text(item.owned ? 'OWNED' : `${item.cost}c`, baseX + 25, baseY + 16); } p.fill(180); p.textSize(10); p.textAlign(p.RIGHT); p.text('Press I to toggle', 245, DESIGN_HEIGHT - 35); p.text('Press O for shop items', DESIGN_WIDTH - 20, DESIGN_HEIGHT - 35); p.textAlign(p.LEFT); } // All Shop Items display if (showAllShopItems && !showShop) { p.fill(0, 0, 0, 180); p.rect(DESIGN_WIDTH - 315, 135, 300, 420, 10); p.fill(255); p.textSize(18); p.textAlign(p.CENTER); p.text('ALL SHOP ITEMS', DESIGN_WIDTH - 195, 155); p.textAlign(p.LEFT); for (let i = 0; i < shopItems.length; i++) { const item = shopItems[i]; const baseX = DESIGN_WIDTH - 305; const baseY = 175 + (i * 24); if (baseY > 530) continue; // Limit height // Small icon p.fill(100); p.rect(baseX - 5, baseY - 10, 20, 20, 3); p.fill(255); switch(i) { case 0: p.stroke(0, 255, 255); p.strokeWeight(1.5); p.line(baseX-2, baseY-5, baseX+8, baseY+5); p.noStroke(); break; case 1: p.fill(255, 215, 0); p.circle(baseX+3, baseY, 8); break; case 2: p.fill(255, 0, 255); p.circle(baseX+3, baseY, 7); p.fill(255); p.circle(baseX+3, baseY-3, 2); break; case 3: p.stroke(0, 255, 0); p.strokeWeight(1); p.noFill(); p.arc(baseX+3, baseY, 12, 12, 0, p.TAU*0.75); p.noStroke(); break; case 4: p.fill(255, 0, 0); p.circle(baseX, baseY, 4); p.circle(baseX+8, baseY, 4); break; case 5: p.fill(0, 255, 255); p.circle(baseX+2, baseY, 3); p.circle(baseX+8, baseY, 3); break; case 6: p.stroke(100, 255, 255); p.strokeWeight(1); p.noFill(); p.circle(baseX+3, baseY, 10); p.noStroke(); break; case 16: p.fill(255, 100, 255); p.rect(baseX-3, baseY-6, 12, 12, 2); break; default: p.fill(180); p.circle(baseX+3, baseY, 6); break; } // Name and status p.fill(item.owned ? [0, 255, 0] : 200); p.textSize(11); p.text(item.name.substring(0, 12) + (item.name.length > 12 ? '...' : ''), baseX + 18, baseY + 2); // Cost/Owned and desc snippet p.fill(255, 215, 0); p.textSize(9); p.text(item.owned ? 'OWNED' : `${item.cost}c`, baseX + 18, baseY + 12); p.fill(150); p.textSize(8); p.text(item.desc.substring(0, 25) + '...', baseX + 18, baseY + 20); } } if (showShop) { // Shop UI - pause spawning p.fill(0, 0, 0, 220); p.rect(0, 0, DESIGN_WIDTH, DESIGN_HEIGHT); // Header p.fill(255); p.textSize(48); p.textAlign(p.CENTER); p.text('SHOP', DESIGN_WIDTH / 2, 80); p.textAlign(p.LEFT); // Total coins display p.fill(255, 215, 0); p.textSize(28); p.text(`Total Coins: ${coins}`, DESIGN_WIDTH / 2 - 180, 120); // Score requirement notice for Auto Clicker const autoclickerItem = shopItems.find(item => item.effect === 'autoclicker'); if (autoclickerItem && !autoclickerItem.owned && score >= 1000) { p.fill(0, 255, 0); p.textSize(24); p.textAlign(p.CENTER); p.text('🏆 AUTO CLICKER UNLOCKED! (Score: 1000+)', DESIGN_WIDTH / 2, 130); p.textAlign(p.LEFT); } // Back to game button p.fill(100, 200, 255); p.rect(DESIGN_WIDTH - 200, 50, 150, 30, 8); p.fill(255); p.textAlign(p.CENTER, p.CENTER); p.textSize(20); p.text('← Back to Game', DESIGN_WIDTH - 125, 65); // Continue Playing button p.fill(0, 255, 0); p.rect(DESIGN_WIDTH - 200, 90, 150, 30, 8); p.fill(255); p.textSize(20); p.text('Continue Playing', DESIGN_WIDTH - 125, 105); for (let i = 0; i < shopItems.length; i++) { const item = shopItems[i]; const baseX = DESIGN_WIDTH / 2 - 200; const baseY = 150 + i * 60; // Enhanced item icons p.fill(100); p.rect(baseX - 45, baseY - 25, 50, 50, 8); p.fill(255); switch(i) { case 0: // Speed p.stroke(0, 255, 255); p.strokeWeight(3); p.line(baseX - 30, baseY - 15, baseX - 10, baseY + 5); p.line(baseX - 25, baseY - 10, baseX - 5, baseY + 10); p.noStroke(); break; case 1: // Big Shot p.fill(item.active ? [255, 255, 0] : [255, 165, 0]); p.circle(baseX - 20, baseY, 20); break; case 2: // Magnet p.fill(item.active ? [255, 0, 255] : [200, 100, 200]); p.circle(baseX - 20, baseY, 18); p.fill(255); p.circle(baseX - 20, baseY - 8, 6); p.circle(baseX - 20, baseY + 8, 6); break; case 3: // Time p.fill(0, 255, 0); p.noFill(); p.stroke(0, 255, 0); p.strokeWeight(2); p.arc(baseX - 20, baseY, 25, 25, 0, p.TWO_PI * 0.75); p.line(baseX - 20, baseY - 10, baseX - 5, baseY + 5); p.noStroke(); break; case 4: // Health p.fill(255, 0, 0); p.circle(baseX - 30, baseY, 12); p.circle(baseX - 10, baseY, 12); break; case 5: // Rapid Fire p.fill(0, 255, 255); for (let j = 0; j < 4; j++) { p.circle(baseX - 25 + j * 8, baseY, 6); } break; case 6: // Shield p.stroke(100, 255, 255); p.strokeWeight(3); p.noFill(); p.circle(baseX - 20, baseY, 22); p.strokeWeight(1); p.circle(baseX - 20, baseY, 28); p.noStroke(); break; case 7: // Triple Shot p.fill(item.active ? [255, 255, 0] : [255, 165, 0]); p.circle(baseX - 30, baseY, 8); p.circle(baseX - 20, baseY, 8); p.circle(baseX - 10, baseY, 8); break; case 8: // Enemy Slow p.fill(item.active ? [0, 255, 0] : [0, 200, 0]); p.noFill(); p.stroke(item.active ? [0, 255, 0] : [0, 150, 0]); p.strokeWeight(3); p.circle(baseX - 20, baseY, 24); for (let k = 0; k < 3; k++) { p.arc(baseX - 20, baseY, 20, 20, p.TWO_PI * k/3, p.TWO_PI * (k+0.3)/3); } p.noStroke(); break; case 9: // Coin Multiplier p.fill(255, 215, 0); p.circle(baseX - 25, baseY, 12); p.circle(baseX - 15, baseY, 16); break; case 10: // Super Shield p.stroke(item.active ? [255, 255, 255] : [100, 255, 255]); p.strokeWeight(4); p.noFill(); p.circle(baseX - 20, baseY, 30); p.strokeWeight(2); p.circle(baseX - 20, baseY, 38); p.noStroke(); break; case 16: // Auto Clicker p.fill(item.active ? [255, 0, 255] : [255, 100, 255]); p.rect(baseX - 35, baseY - 15, 30, 30, 5); p.fill(255); p.rect(baseX - 25, baseY + 5, 20, 8, 3); if (item.active) { p.fill(255, 255, 0); p.circle(baseX - 15, baseY - 10 + p.sin(gameTime * 10) * 3, 6); } break; } // Item name p.fill(item.owned ? [0, 255, 0] : 255); p.textAlign(p.LEFT); p.textSize(20); p.text(item.name, baseX, baseY); // Description p.fill(180); p.textSize(14); p.text(item.desc, baseX, baseY + 18); // Cost p.fill(255, 215, 0); p.textSize(16); p.text(`${item.cost} coins`, baseX, baseY + 35); if (!item.owned) { // Buy button - larger and better positioned const buyX = baseX + 215; const buyY = baseY + 15; const canBuyAutoclicker = item.effect !== 'autoclicker' || score >= 1000; if (coins >= item.cost && canBuyAutoclicker) { p.fill(0, 255, 0); p.rect(buyX, buyY, 80, 30, 5); p.fill(0); p.textAlign(p.CENTER, p.CENTER); p.textSize(16); p.text('BUY', buyX + 40, buyY + 15); } else { p.fill(100); p.rect(buyX, buyY, 80, 30, 5); p.fill(180); p.textAlign(p.CENTER, p.CENTER); p.textSize(14); p.text(coins < item.cost ? 'Not enough' : 'Score: 1000 needed!', buyX + 40, buyY + 15); } // Debug hover info if (pointer.x > buyX && pointer.x < buyX + 80 && pointer.y > buyY && pointer.y < buyY + 30) { p.fill(255, 255, 0); p.textSize(12); p.textAlign(p.LEFT); if (item.effect === 'autoclicker' && score < 1000) { p.text(`Score: ${score}/1000 needed`, buyX, buyY - 5); } else { p.text(`${coins}/${item.cost} coins`, buyX, buyY - 5); } } // Auto Clicker score progress indicator if (item.effect === 'autoclicker' && score >= 1000) { p.fill(0, 255, 0); p.textSize(14); p.textAlign(p.LEFT); p.text(`Score ${score}: UNLOCKED!`, baseX + 180, baseY + 35); } } else { // Owned status p.fill(0, 255, 0); p.textSize(12); p.textAlign(p.LEFT); p.text('OWNED', baseX + 180, baseY); if (item.effect === 'health') { p.fill(activeEffects.health >= 5 ? [255, 165, 0] : [0, 255, 0]); p.textSize(14); p.text(`Health: ${activeEffects.health}/5`, baseX + 180, baseY + 18); p.fill(255, 0, 0); p.rect(baseX + 220, baseY + 45, 70, 25, 5); p.fill(0); p.textAlign(p.CENTER, p.CENTER); p.textSize(14); p.text('USE', baseX + 255, baseY + 57.5); } else if (item.cooldown > 0) { p.fill(255, 165, 0); p.textSize(14); p.textAlign(p.LEFT); p.text(`Cooldown: ${Math.ceil(item.cooldown/60)}s`, baseX + 180, baseY + 18); } else { const useX = baseX + 215; const useY = baseY + 45; p.fill(item.active ? [255, 255, 0] : [0, 255, 255]); p.rect(useX, useY, 80, 30, 5); p.fill(0); p.textAlign(p.CENTER, p.CENTER); p.textSize(16); p.text(item.active ? 'ACTIVE' : 'ACTIVATE', useX + 40, useY + 15); } } } p.textAlign(p.LEFT); p.fill(255); p.textSize(16); p.text('Click coin icon or press S to toggle | "Continue Playing" after buying | Collect yellow shots for coins! | Press I for all items list | Press O for all shop items', 20, DESIGN_HEIGHT - 30); return; } p.fill(255); p.textAlign(p.LEFT); // Update and draw enemies for (let i = enemies.length - 1; i >= 0; i--) { const enemy = enemies[i]; // Auto-clicker logic if (activeEffects.autoclicker && gameTime % 0.5 < 1/60) { const pointer = toDesignSpace(p.mouseX, p.mouseY); const dist = p.dist(pointer.x, pointer.y, enemy.x, enemy.y); if (dist < 100) { // Shield protection if (!activeEffects.shield) { enemies.splice(i, 1); score += 10 * activeEffects.scoreMultiplier; lastKillTime = gameTime; addItem(); break; } } } // Movement enemy.x += enemy.vx * activeEffects.speed * activeEffects.enemySlow; enemy.y += enemy.vy * activeEffects.speed * activeEffects.enemySlow; // Bounce off walls if (enemy.x - enemy.size/2 < 0 || enemy.x + enemy.size/2 > DESIGN_WIDTH) { enemy.vx *= -1; } if (enemy.y - enemy.size/2 < 50 || enemy.y + enemy.size/2 > DESIGN_HEIGHT) { enemy.vy *= -1; } // Draw enemy (red circle representing target) if (enemy.hit) { p.fill(255, 0, 0, 100); } else { p.fill(255, 50, 50); } p.circle(enemy.x, enemy.y, enemy.size * activeEffects.bigShot); } // Update and draw items for (let i = items.length - 1; i >= 0; i--) { const item = items[i]; if (item.collected) continue; // Coin magnet effect if (activeEffects.coinMagnet) { const pointer = toDesignSpace(p.mouseX, p.mouseY); const dist = p.dist(pointer.x, pointer.y, item.x, item.y); const magnetRange = activeEffects.bigMagnet ? 150 : 100; const magnetStrength = activeEffects.bigMagnet ? 5 : 3; if (dist < magnetRange) { const angleToMouse = p.atan2(pointer.y - item.y, pointer.x - item.x); item.vx = p.cos(angleToMouse) * magnetStrength; item.vy = p.sin(angleToMouse) * magnetStrength; } else { // Movement (slower) item.x += item.vx * activeEffects.speed; item.y += item.vy * activeEffects.speed; } } else { // Movement (slower) item.x += item.vx * activeEffects.speed; item.y += item.vy * activeEffects.speed; } // Bounce off walls if (item.x - item.size/2 < 0 || item.x + item.size/2 > DESIGN_WIDTH) { item.vx *= -1; } if (item.y - item.size/2 < 50 || item.y + item.size/2 > DESIGN_HEIGHT) { item.vy *= -1; } // Draw item with sparkle effect when collected recently const collectTime = item.collected ? gameTime : 0; const sparkle = item.collected && gameTime - collectTime < 0.5 ? p.sin(gameTime * 20) * 8 : 0; switch (item.type) { case 'shot': p.fill(255, 255, 0); break; } p.circle(item.x, item.y, item.size + sparkle); // Pulsing effect const pulse = p.sin(gameTime * 4 + item.x * 0.01) * 3 + item.size; p.circle(item.x, item.y, pulse + sparkle); // Shield visual if (activeEffects.superShield) { p.stroke(255, 255, 255); p.strokeWeight(4); p.noFill(); p.circle(pointer.x, pointer.y, 90); p.strokeWeight(2); p.circle(pointer.x, pointer.y, 100); p.noStroke(); } else if (activeEffects.shield) { p.stroke(100, 255, 255); p.strokeWeight(2); p.noFill(); p.circle(pointer.x, pointer.y, 60); p.noStroke(); } } // Add new enemies periodically if (gameTime % 2 < 1/60 && !activeEffects.spawnBlock) { addEnemy(); } // Add new shot items less frequently if (gameTime % 10 < 1/60) { addItem(); } // Crosshair const pointer = toDesignSpace(p.mouseX, p.mouseY); if ( pointer.x >= 0 && pointer.x <= DESIGN_WIDTH && pointer.y >= 0 && pointer.y <= DESIGN_HEIGHT ) { p.stroke(0, 255, 0); p.strokeWeight(2); p.line(pointer.x - 10, pointer.y, pointer.x + 10, pointer.y); p.line(pointer.x, pointer.y - 10, pointer.x, pointer.y + 10); p.noStroke(); } p.pop(); angle += 0.01; }; const originalRemove = p.remove.bind(p); p.remove = () => { if (typeof teardown === "function") { teardown(); teardown = null; } p.loop(); // Reset loop state originalRemove(); }; }; const instance = new window.p5(sketch, "renderDiv"); window.__P5_CLEANUP__ = () => { try { instance.remove(); } catch (error) { console.warn("Failed to remove p5 instance", error); } };

hit bal

How to Play