feat: added gradient angle animated rotation support

tsparticles · Aug 18, 2021 · de8f0a4 · de8f0a4
1 parent 7d31c62
commit de8f0a4
Show file tree

Hide file tree

Showing 2 changed files with 39 additions and 7 deletions.
diff --git a/engine/src/Core/Particle.ts b/engine/src/Core/Particle.ts
@@ -347,7 +347,7 @@ export class Particle implements IParticle {
                 angle: {
                     value: gradient.angle.value,
                     enable: gradient.angle.animation.enable,
-                    velocity: gradient.angle.animation.speed,
+                    velocity: (gradient.angle.animation.speed / 360) * container.retina.reduceFactor,
                 },
                 type: gradient.type,
                 colors: [],

diff --git a/updaters/gradient/src/GradientUpdater.ts b/updaters/gradient/src/GradientUpdater.ts
@@ -32,12 +32,45 @@ function updateColorValue(delta: IDelta, value: IParticleValueAnimation<number>,
     }
 }
 
+function updateAngle(delta: IDelta, angle: IParticleValueAnimation<number>): void {
+    const speed = (angle.velocity ?? 0) * delta.factor;
+    const max = 2 * Math.PI;
+
+    if (!angle.enable) {
+        return;
+    }
+
+    switch (angle.status) {
+        case AnimationStatus.increasing:
+            angle.value += speed;
+
+            if (angle.value > max) {
+                angle.value -= max;
+            }
+
+            break;
+        case AnimationStatus.decreasing:
+        default:
+            angle.value -= speed;
+
+            if (angle.value < 0) {
+                angle.value += max;
+            }
+
+            break;
+    }
+}
+
 function updateGradient(particle: Particle, delta: IDelta): void {
-    if (!particle.gradient) {
+    const gradient = particle.gradient;
+
+    if (!gradient) {
         return;
     }
 
-    for (const color of particle.gradient.colors) {
+    updateAngle(delta, gradient.angle);
+
+    for (const color of gradient.colors) {
         ///*const animationOptions = particle.options.gradient.animation;
 
         if (particle.color?.h !== undefined) {
@@ -59,10 +92,9 @@ export class GradientUpdater implements IParticleUpdater {
         return (
             !particle.destroyed &&
             !particle.spawning &&
-            (particle.gradient?.colors.some(
-                (c) => c.value.h.value !== undefined || c.value.s.value !== undefined || c.value.l.value !== undefined
-            ) ??
-                false)
+            (particle.gradient?.angle.enable ||
+                (particle.gradient?.colors.some((c) => c.value.h.enable || c.value.s.enable || c.value.l.enable) ??
+                    false))
         );
     }