about summary refs log tree commit diff stats
path: root/html/tower/js/renderer.js
diff options
context:
space:
mode:
Diffstat (limited to 'html/tower/js/renderer.js')
-rw-r--r--html/tower/js/renderer.js40
1 files changed, 37 insertions, 3 deletions
diff --git a/html/tower/js/renderer.js b/html/tower/js/renderer.js
index ddae51d..cd2d11d 100644
--- a/html/tower/js/renderer.js
+++ b/html/tower/js/renderer.js
@@ -146,9 +146,43 @@ function renderParticles(ctx, particles) {
         const lifePercent = age / particle.lifetime;
         
         if (lifePercent <= 1) {
-            ctx.globalAlpha = 1 - lifePercent;
-            
-            if (particle.type === 'AOE_EXPLOSION') {
+            if (particle.type === 'SLIME_TRAIL') {
+                // Calculate opacity based on lifetime and fade start
+                let opacity = 1;
+                if (lifePercent > particle.fadeStart) {
+                    opacity = 1 - ((lifePercent - particle.fadeStart) / (1 - particle.fadeStart));
+                }
+                opacity *= 0.3; // Make it translucent
+                
+                ctx.globalAlpha = opacity;
+                ctx.fillStyle = particle.color;
+                
+                // Draw a circular slime splat
+                ctx.beginPath();
+                ctx.arc(
+                    particle.position.x,
+                    particle.position.y,
+                    particle.size * (1 - lifePercent * 0.3), // Slightly shrink over time
+                    0,
+                    Math.PI * 2
+                );
+                ctx.fill();
+                
+                // Add some variation to the splat
+                for (let i = 0; i < 3; i++) {
+                    const angle = (Math.PI * 2 * i) / 3;
+                    const distance = particle.size * 0.4;
+                    ctx.beginPath();
+                    ctx.arc(
+                        particle.position.x + Math.cos(angle) * distance,
+                        particle.position.y + Math.sin(angle) * distance,
+                        particle.size * 0.4 * (1 - lifePercent * 0.3),
+                        0,
+                        Math.PI * 2
+                    );
+                    ctx.fill();
+                }
+            } else if (particle.type === 'AOE_EXPLOSION') {
                 // Draw expanding circle
                 const radius = particle.initialRadius + 
                     (particle.finalRadius - particle.initialRadius) * lifePercent;