Update play.html

play.html

@@ -585,39 +585,238 @@ function manageEntities(spd) {
     let minGap = 500 - (spd * 8); 
     let last = entities[entities.length-1];
     
+    // --- 1. SPAWNING LOGIC BILANCIATA ---
     if (!last || (canvas.width - last.x > minGap)) {
-        if (Math.random() > 0.97) return;
+        if (Math.random() > 0.96) return;
         
         let typeKey = 'OBSTACLE';
         let rand = Math.random();
-        if (rand > 0.6) typeKey = 'LEGACY';
-        if (rand > 0.92) typeKey = 'AI';
+        
+        if (rand > 0.65) typeKey = 'LEGACY';
+        if (rand > 0.93) typeKey = 'AI';
         
         let conf = GAME_CONFIG.ENTITIES[typeKey];
-        let h = typeKey === 'OBSTACLE' ? 50 : 40, y = state.groundY - h;
-        if (typeKey === 'AI') y -= Math.random() * 80; 
+        // Dimensioni base più grandi per visibilità
+        let h = 60, w = 60, y = state.groundY - 60;
+        let variant = 'normal'; 
+
+        if (typeKey === 'OBSTACLE') {
+            let obsType = Math.random();
+            
+            // --- LOGICA VARIANTI ---
+            if (obsType < 0.3) {
+                // DRONE
+                w = 55; h = 55;
+                y = state.groundY - 120 - (Math.random() * 40); 
+                variant = 'flying';
+            } else if (obsType < 0.65) {
+                // TOWER (Muro Alto)
+                w = 60;
+                h = 95 + (Math.random() * 50); 
+                y = state.groundY - h;
+                variant = 'tower';
+            } else {
+                // GROUND (Standard)
+                y = state.groundY - h;
+                variant = 'ground';
+            }
+
+            // --- FIX: MAI DUE TORRI DI FILA ---
+            if (variant === 'tower' && last && last.variant === 'tower') {
+                // Se l'ultimo era una torre, questo diventa terra forzatamente
+                variant = 'ground';
+                h = 60; // Resetta altezza standard
+                y = state.groundY - h;
+            }
+        } 
+        else if (typeKey === 'AI') {
+            w = 50; h = 50;
+            y = state.groundY - 90 - (Math.random() * 60);
+        }
+        else {
+            // LEGACY
+            y = state.groundY - 65;
+        }
         
-        entities.push({ type: typeKey, conf: conf, x: canvas.width, y: y, w: 40, h: h, active: true });
+        entities.push({ 
+            type: typeKey, conf: conf, x: canvas.width, y: y, w: w, h: h, 
+            active: true, variant: variant, pulse: Math.random() * 10, 
+            rot: 0 
+        });
     }
 
+    // --- 2. RENDER LOOP "HIGH VISIBILITY" ---
     for (let i = entities.length - 1; i >= 0; i--) {
         let e = entities[i]; 
         e.x -= spd;
-        if (e.type !== 'OBSTACLE') e.y += Math.sin(state.frame * 0.08) * 0.7; 
+        e.pulse += 0.05;
+        e.rot += 0.02;
         
+        let floatY = 0;
+        if (e.variant === 'flying' || e.type !== 'OBSTACLE') {
+            floatY = Math.sin(state.frame * 0.08 + e.x * 0.01) * 5;
+        }
+        let drawY = e.y + floatY;
+
         if (e.active) {
-            ctx.strokeStyle = e.conf.COLOR; ctx.lineWidth = 3;
-            if (e.type === 'LEGACY') ctx.setLineDash([5,5]); else ctx.setLineDash([]);
-            ctx.strokeRect(e.x, e.y, e.w, e.h);
-            ctx.font = "28px Arial"; ctx.textAlign = "center";
-            ctx.fillText(e.conf.CHAR, e.x + e.w/2, e.y + e.h/2 + 10);
+            ctx.save(); 
+            ctx.textAlign = "center";
+            ctx.textBaseline = "middle";
+            ctx.font = "36px Arial"; // EMOJI PIÙ GRANDE
+
+            let cx = e.x + e.w/2;
+            let cy = drawY + e.h/2;
+
+            // BORDURA SPESSA PER TUTTI
+            ctx.lineWidth = 4; 
+
+            // ==========================================
+            // A. AI - VERTEX NODE
+            // ==========================================
+            if (e.type === 'AI') {
+                ctx.shadowBlur = 30; 
+                ctx.shadowColor = '#00D4FF';
+                
+                // Anelli
+                ctx.translate(cx, cy);
+                ctx.rotate(e.rot * 2); 
+                ctx.strokeStyle = '#00D4FF'; // Ciano puro
+                ctx.setLineDash([5, 5]);
+                ctx.beginPath();
+                ctx.arc(0, 0, (e.w/1.5), 0, Math.PI * 2);
+                ctx.stroke();
+                
+                ctx.rotate(-e.rot * 4); 
+                ctx.strokeStyle = '#fff';
+                ctx.lineWidth = 2;
+                ctx.setLineDash([]); 
+                ctx.beginPath();
+                ctx.arc(0, 0, (e.w/2.2), 0, Math.PI * 2);
+                ctx.stroke();
+
+                ctx.setTransform(1, 0, 0, 1, 0, 0); 
+                ctx.shadowBlur = 0;
+                ctx.fillText(e.conf.CHAR, cx, cy);
+            } 
+            
+            // ==========================================
+            // B. LEGACY - CAFFÈ VISIBILE
+            // ==========================================
+            else if (e.type === 'LEGACY') {
+                let breathe = 1 + Math.sin(e.pulse * 2) * 0.1;
+                
+                ctx.shadowBlur = 25;
+                ctx.shadowColor = '#FFC107';
+                ctx.strokeStyle = '#FFC107';
+                // SFONDO PIÙ OPACO per contrasto col caffè
+                ctx.fillStyle = 'rgba(255, 193, 7, 0.35)'; 
+                
+                ctx.translate(cx, cy);
+                ctx.scale(breathe, breathe);
+                
+                ctx.beginPath();
+                ctx.roundRect(-e.w/2, -e.h/2, e.w, e.h, 12);
+                ctx.fill();
+                ctx.stroke();
+                
+                // Angoli Bianchi
+                ctx.strokeStyle = '#FFF';
+                ctx.lineWidth = 3; // Angoli più spessi
+                let corner = 10;
+                let hs = e.w/2 - 2; 
+                ctx.beginPath();
+                ctx.moveTo(-hs, -hs + corner); ctx.lineTo(-hs, -hs); ctx.lineTo(-hs + corner, -hs); 
+                ctx.moveTo(hs, -hs + corner); ctx.lineTo(hs, -hs); ctx.lineTo(hs - corner, -hs);   
+                ctx.moveTo(-hs, hs - corner); ctx.lineTo(-hs, hs); ctx.lineTo(-hs + corner, hs);   
+                ctx.moveTo(hs, hs - corner); ctx.lineTo(hs, hs); ctx.lineTo(hs - corner, hs);      
+                ctx.stroke();
+
+                ctx.setTransform(1, 0, 0, 1, 0, 0); 
+                
+                // --- FIX VISIBILITÀ CAFFÈ ---
+                // Disegniamo un alone BIANCO dietro l'emoji per staccarla dal fondo scuro/oro
+                ctx.shadowBlur = 20;
+                ctx.shadowColor = '#ffffff'; 
+                ctx.fillStyle = '#ffffff'; // Colore di riempimento per sicurezza (alcuni browser usano questo per emoji testuali)
+                ctx.fillText(e.conf.CHAR, cx, cy + 3);
+                // Ridisegniamo senza ombra per nitidezza
+                ctx.shadowBlur = 0;
+                ctx.fillText(e.conf.CHAR, cx, cy + 3);
+            } 
+            
+            // ==========================================
+            // C. OSTACOLO - GLITCH
+            // ==========================================
+            else { 
+                let color = '#FF3D00';
+                let jitter = (Math.random() - 0.5) * 4; 
+                let gx = e.x + jitter;
+
+                ctx.shadowBlur = 15;
+                ctx.shadowColor = color;
+                // Sfondo rosso più visibile
+                ctx.fillStyle = 'rgba(255, 61, 0, 0.3)'; 
+                ctx.strokeStyle = color;
+                
+                // Bordo molto spesso
+                ctx.lineWidth = 4;
+
+                ctx.fillRect(gx, drawY, e.w, e.h);
+                ctx.strokeRect(gx, drawY, e.w, e.h);
+
+                // Dettagli interni
+                ctx.fillStyle = color;
+                ctx.globalAlpha = 0.8; // Dettagli più visibili
+
+                if (e.variant === 'tower') {
+                    // SERVER RACK
+                    for(let ly = drawY + 10; ly < drawY + e.h; ly += 20) {
+                        ctx.fillRect(gx + 8, ly, e.w - 16, 4); // Linee più spesse
+                    }
+                    // Led lampeggiante
+                    if (Math.floor(state.frame / 10) % 2 === 0) {
+                         ctx.fillStyle = '#fff'; // Led bianco strobo
+                         ctx.shadowColor = '#fff';
+                         ctx.shadowBlur = 15;
+                         ctx.beginPath(); ctx.arc(gx + e.w - 12, drawY + 12, 4, 0, Math.PI*2); ctx.fill();
+                    }
+                } 
+                else if (e.variant === 'flying') {
+                    // DRONE
+                    let wingY = Math.sin(state.frame * 0.5) * 5;
+                    ctx.beginPath();
+                    ctx.lineWidth = 3;
+                    ctx.moveTo(gx, drawY + e.h/2);
+                    ctx.lineTo(gx - 20, drawY + e.h/2 + wingY); // Ali più lunghe
+                    ctx.moveTo(gx + e.w, drawY + e.h/2);
+                    ctx.lineTo(gx + e.w + 20, drawY + e.h/2 + wingY);
+                    ctx.stroke();
+                } else {
+                    // GROUND X
+                    ctx.lineWidth = 3;
+                    ctx.beginPath();
+                    ctx.moveTo(gx + 5, drawY + 5); ctx.lineTo(gx + e.w - 5, drawY + e.h - 5);
+                    ctx.moveTo(gx + e.w - 5, drawY + 5); ctx.lineTo(gx + 5, drawY + e.h - 5);
+                    ctx.stroke();
+                }
+
+                ctx.globalAlpha = 1;
+                ctx.shadowBlur = 0;
+                
+                // EMOJI CON OMBRA NERA PER CONTRASTO SUL ROSSO
+                ctx.shadowColor = '#000';
+                ctx.shadowBlur = 5;
+                ctx.fillText(e.conf.CHAR, cx + jitter, cy);
+            }
             
-            if (rectHit(player.x, player.y, player.w, player.h, e.x, e.y, e.w, e.h)) handleHit(e);
+            ctx.restore(); 
+
+            // Collision Check
+            if (rectHit(player.x, player.y, player.w, player.h, e.x, drawY, e.w, e.h)) handleHit(e);
         }
         if (e.x + e.w < 0) entities.splice(i, 1);
     }
 }
-
 function rectHit(x1, y1, w1, h1, x2, y2, w2, h2) { return x2 < x1 + w1 && x2 + w2 > x1 && y2 < y1 + h1 && y2 + h2 > y1; }
 
 function handleHit(e) {