From: radic <radic393@yahoo.com>
Date: Sat, 8 Mar 2025 23:41:40 +0000 (-0500)
Subject: TTE: updated various speed and color behaviors
X-Git-Url: https://gitweb.cassieko.com/CSS3DRenderer.js?a=commitdiff_plain;h=e8177d7a29aaf300b93c578ddac622a78a437165;p=neon-realms.git

TTE: updated various speed and color behaviors
---

diff --git a/html/3-Storm/ParticleStorm.html b/html/3-Storm/ParticleStorm.html
index f28c232..4874f28 100644
--- a/html/3-Storm/ParticleStorm.html
+++ b/html/3-Storm/ParticleStorm.html
@@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html>
 <head>
-    <title>Touch Particle System</title>
+    <title>Particle Storm</title>
     <style>
         body { margin: 0; overflow: hidden; background: #000; touch-action: none; }
         canvas { display: block; }
@@ -22,11 +22,14 @@
     resizeCanvas();
 
     const PARTICLE_COUNT = 200;
-    const GRAVITY = 0.5;
-    const FRICTION = 0.99;
+    const GRAVITY = 0.2;
+    const TOUCH_FRICTION = 1;
+    const NOTOUCH_FRICTION = 0.985;
     const PARTICLE_RADIUS = 2.5;
-    const MOUSE_RADIUS = 300;
-    const COLOR_SPEED = 0.5;
+    const MOUSE_RADIUS = 400;
+    const COLOR_SPEED = 5.0;
+    const MAX_VELOCITY = 10;
+    const PARTICLE_LIMIT = 500;
 
     let particles = [];
     const touches = new Map(); // Stores active touches by identifier
@@ -57,14 +60,22 @@
         update() {
             if (this.dead) return;
 
-            this.velocity.x *= FRICTION;
-            this.velocity.y *= FRICTION;
+	    if (touches.size == 0)
+	    {
+            	this.velocity.x *= NOTOUCH_FRICTION;
+            	this.velocity.y *= NOTOUCH_FRICTION;
+            }
+            else
+            {
+                this.velocity.x *= TOUCH_FRICTION;
+            	this.velocity.y *= TOUCH_FRICTION;
+            }
             
             // Apply forces from all active touches
             touches.forEach(touch => {
                 const dx = touch.x - this.x;
                 const dy = touch.y - this.y;
-                const distance = Math.sqrt(dx * dx + dy * dy);
+                const distance = Math.max(Math.sqrt(dx * dx + dy * dy), 150);
                 
                 if (distance < MOUSE_RADIUS) {
                     const force = GRAVITY * (MOUSE_RADIUS / distance);
@@ -72,11 +83,17 @@
                     this.velocity.y += (dy / distance) * force;
                 }
             });
+            
+            const velocityMag = Math.sqrt(this.velocity.x * this.velocity.x + 
+            				  this.velocity.y * this.velocity.y);
+            const velocityScale = Math.min(MAX_VELOCITY / velocityMag, 1);
+	    this.velocity.x = this.velocity.x * velocityScale;
+	    this.velocity.y = this.velocity.y * velocityScale;
 
             this.x += this.velocity.x;
             this.y += this.velocity.y;
 
-            const buffer = 100;
+            const buffer = 300;
             if (this.x < -buffer || 
                 this.x > canvas.width + buffer ||
                 this.y < -buffer || 
@@ -105,14 +122,15 @@
         particles = particles.filter(particle => !particle.dead);
 
         // Add new particles for each active touch
+        if(particles.length < PARTICLE_LIMIT)
         touches.forEach(touch => {
             for (let i = 0; i < 5; i++) {
                 particles.push(new Particle(
-                    touch.x + Math.cos(touch.angle) * 20,
-                    touch.y + Math.sin(touch.angle) * 20
+                    touch.x + Math.cos(touch.angle) * 80,
+                    touch.y + Math.sin(touch.angle) * 80
                 ));
             }
-            touch.angle += 0.1;
+            touch.angle += 0.5;
         });
 
         requestAnimationFrame(animate);
@@ -195,7 +213,7 @@
     // Color rotation
     setInterval(() => {
         particles.forEach(p => {
-            p.hue = (p.hue + COLOR_SPEED) % 360;
+            p.hue = (p.hue + COLOR_SPEED*(p.radius/4)) % 360;
             p.color = `hsl(${p.hue}, 100%, 50%)`;
         });
     }, 50);
