@needle-tools/engine 2.42.0-pre → 2.44.0-pre

package/src/engine-components/ParticleSystemModules.ts

@@ -1,11 +1,12 @@
 import { init } from "@dimforge/rapier3d-compat";
 import * as THREE from "three";
-import { Color, Matrix4, Object3D, Vector3 } from "three";
+import { Color, Matrix4, Object3D, PointLightShadow, Quaternion, Vector3 } from "three";
 import { Mathf } from "../engine/engine_math";
 import { serializeable } from "../engine/engine_serialization";
 import { RGBAColor } from "./js-extensions/RGBAColor";
 import { AnimationCurve } from "./AnimationCurve";
-import { Vec3 } from "../engine/engine_types";
+import { Vec2, Vec3 } from "../engine/engine_types";
+import { EmitterShape, FrameOverLife, Particle, ShapeJSON } from "three.quarks";
 
 declare type Color4 = { r: number, g: number, b: number, a: number };
 declare type ColorKey = { time: number, color: Color4 };
@@ -17,6 +18,10 @@ export interface IParticleSystem {
     get time(): number;
     get duration(): number;
     readonly main: MainModule;
+    get container(): Object3D;
+    get worldQuaternion(): Quaternion;
+    get worldQuaternionInverted(): Quaternion;
+    get worldScale() : Vector3;
 }
 
 export enum ParticleSystemRenderMode {
@@ -165,14 +170,14 @@ export class MinMaxCurve {
             case ParticleSystemCurveMode.Constant:
                 return this.constant;
             case ParticleSystemCurveMode.Curve:
-                t01 %= this.curve!.duration;
-                return this.curve!.evaluate(t01);
+                t01 = Mathf.clamp01(t01);
+                return this.curve!.evaluate(t01) * this.curveMultiplier!;
             case ParticleSystemCurveMode.TwoCurves:
                 const t1 = t01 * this.curveMin!.duration;
                 const t2 = t01 * this.curveMax!.duration;
-                return Mathf.lerp(this.curveMin!.evaluate(t1), this.curveMax!.evaluate(t2), t % 1);
+                return Mathf.lerp(this.curveMin!.evaluate(t1), this.curveMax!.evaluate(t2), t % 1) * this.curveMultiplier!;
             case ParticleSystemCurveMode.TwoConstants:
-                return Mathf.lerp(this.constantMin, this.constantMax, t % 1);
+                return Mathf.lerp(this.constantMin, this.constantMax, t % 1)
             default:
                 this.curveMax!.evaluate(t01) * this.curveMultiplier!;
                 break;
@@ -208,7 +213,8 @@ export class MinMaxGradient {
                 this.gradient.evaluate(t01, MinMaxGradient._temp);
                 return MinMaxGradient._temp
             case ParticleSystemGradientMode.TwoColors:
-                return MinMaxGradient._temp.lerpColors(this.colorMin, this.colorMax, t);
+                const col1 = MinMaxGradient._temp.lerpColors(this.colorMin, this.colorMax, t);
+                return col1;
             case ParticleSystemGradientMode.TwoGradients:
                 const t2 = Math.random();
                 this.gradientMin.evaluate(t2, MinMaxGradient._temp);
@@ -372,38 +378,23 @@ export class EmissionModule {
 
     /** set from system */
     system!: IParticleSystem;
-    get time() { return this.system.time; }
 
-    private _summed: number = 0;
-    // private _didEmit: boolean = false;
-
-    /** called by nebula */
-    init() {
+    reset() {
+        this.bursts?.forEach(b => b.reset());
     }
 
-    /** called by nebula */
-    getValue(deltaTime: number) {
-        if (this.system.currentParticles >= this.system.maxParticles)
-            return 0;
-        if (!this.enabled) return 0;
-        let count = this.rateOverTime.evaluate(this.time / this.system.duration, Math.random());
-        this._summed += count * deltaTime;
-        let amount = Math.floor(this._summed);
-        this._summed -= amount;
-
+    getBurst() {
+        let amount = 0;
         if (this.burstCount > 0) {
             for (let i = 0; i < this.burstCount; i++) {
                 const burst = this.bursts[i];
-                if (burst.time >= this.time) {
+                if (burst.time >= this.system.time) {
                     burst.reset();
-                    continue;
                 }
-                amount += Math.round(burst.run(this.time));
+                amount += Math.round(burst.run(this.system.time));
             }
         }
-
-        // dont emit more than we are allowed to
-        return amount;//Mathf.clamp(amount, 0, this.system.maxParticles - this.system.currentParticles);
+        return amount;
     }
 }
 
@@ -420,18 +411,26 @@ export class SizeOverLifetimeModule {
     size!: MinMaxCurve;
     sizeMultiplier!: number;
     @serializeable(MinMaxCurve)
-    sizeX!: MinMaxCurve;
-    sizeXMultiplier!: number;
+    x!: MinMaxCurve;
+    xMultiplier!: number;
     @serializeable(MinMaxCurve)
-    sizeY!: MinMaxCurve;
-    sizeYMultiplier!: number;
+    y!: MinMaxCurve;
+    yMultiplier!: number;
     @serializeable(MinMaxCurve)
-    sizeZ!: MinMaxCurve;
-    sizeZMultiplier!: number;
+    z!: MinMaxCurve;
+    zMultiplier!: number;
 
     private _time: number = 0;
+    private _temp = new Vector3();
+
+    evaluate(t01: number, target?: Vec3) {
+        if (!target) target = this._temp;
+
+        if (!this.enabled) {
+            target.x = target.y = target.z = 1;
+            return target;
+        }
 
-    evaluate(t01: number, target: Vec3) {
         if (!this.separateAxes) {
             const scale = this.size.evaluate(t01) * this.sizeMultiplier;
             target.x = scale;
@@ -439,15 +438,31 @@ export class SizeOverLifetimeModule {
             // target.z = scale;
         }
         else {
-            target.x = this.sizeX.evaluate(this._time) * this.sizeXMultiplier;
-            // target.y = this.sizeY.evaluate(this._time) * this.sizeYMultiplier;
-            // target.z = this.sizeZ.evaluate(this._time) * this.sizeZMultiplier;
+            target.x = this.x.evaluate(t01) * this.xMultiplier;
+            target.y = this.y.evaluate(t01) * this.yMultiplier;
+            target.z = this.z.evaluate(t01) * this.zMultiplier;
         }
         return target;
     }
 }
 
-export class ShapeModule {
+export class ShapeModule implements EmitterShape {
+
+    get type(): string {
+        return ParticleSystemShapeType[this.shapeType];
+    }
+
+    initialize(particle: Particle): void {
+        this.getPosition();
+        particle.position.copy(this._vector);
+    }
+    toJSON(): ShapeJSON {
+        return this;
+    }
+    clone(): EmitterShape {
+        return new ShapeModule();
+    }
+
     @serializeable()
     shapeType: ParticleSystemShapeType = ParticleSystemShapeType.Box;
     @serializeable()
@@ -479,17 +494,21 @@ export class ShapeModule {
     @serializeable()
     sphericalDirectionAmount!: number;
 
+    private system! : IParticleSystem;
     private _space?: ParticleSystemSimulationSpace;
-    private readonly _worldSpacePosition: Matrix4 = new Matrix4();
+    private readonly _worldSpaceMatrix: Matrix4 = new Matrix4();
+    private readonly _worldSpaceMatrixInverse: Matrix4 = new Matrix4();
 
-    update(_context: Context, simulationSpace: ParticleSystemSimulationSpace, obj: Object3D) {
+    update(system : IParticleSystem, _context: Context, simulationSpace: ParticleSystemSimulationSpace, obj: Object3D) {
+        this.system = system;
         this._space = simulationSpace;
         if (simulationSpace === ParticleSystemSimulationSpace.World) {
-            this._worldSpacePosition.copy(obj.matrixWorld);
+            this._worldSpaceMatrix.copy(obj.matrixWorld);
             // set scale to 1
-            this._worldSpacePosition.elements[0] = 1;
-            this._worldSpacePosition.elements[5] = 1;
-            this._worldSpacePosition.elements[10] = 1;
+            this._worldSpaceMatrix.elements[0] = 1;
+            this._worldSpaceMatrix.elements[5] = 1;
+            this._worldSpaceMatrix.elements[10] = 1;
+            this._worldSpaceMatrixInverse.copy(this._worldSpaceMatrix).invert();
         }
     }
 
@@ -502,7 +521,6 @@ export class ShapeModule {
     get vector() {
         return this._vector;
     }
-    /** called by nebula */
     getPosition(): void {
         switch (this.shapeType) {
             case ParticleSystemShapeType.Box:
@@ -511,14 +529,18 @@ export class ShapeModule {
                 this._vector.z = Math.random() * this.scale.z - this.scale.z / 2;
                 break;
             case ParticleSystemShapeType.Sphere:
-                randomSpherePoint(this.position.x, this.position.y, this.position.z, this.radius, this.radiusThickness, this.arc, this._vector);
+                randomSpherePoint(this.position.x, this.position.y, this.position.z, this.radius * this.system.worldScale.x, this.radiusThickness, this.arc, this._vector);
+                // this._vector.y += 1;
+                break;
+            default:
+                this._vector.set(0, 0, 0);
                 break;
             // case ParticleSystemShapeType.Hemisphere:
             //     randomSpherePoint(this.position.x, this.position.y, this.position.z, this.radius, this.radiusThickness, 180, this._vector);
             //     break;
         }
         if (this._space === ParticleSystemSimulationSpace.World) {
-            this._vector.applyMatrix4(this._worldSpacePosition);
+            this._vector.applyMatrix4(this._worldSpaceMatrix);
         }
     }
 
@@ -528,14 +550,24 @@ export class ShapeModule {
     getDirection(position): Vector3 {
         switch (this.shapeType) {
             case ParticleSystemShapeType.Box:
-                return this._dir.set(0, 0, 1);
+                this._dir.set(0, 0, 1);
+                break;
             case ParticleSystemShapeType.Sphere:
                 const rx = position.x;
                 const ry = position.y;
                 const rz = position.z;
-                return this._dir.set(rx, ry, rz).normalize();
+                this._dir.set(rx, ry, rz);
+                break;
+            default:
+                this._dir.set(0, 0, 1);
+                break;
         }
-        return this._dir.set(0, 1, 0);
+        if (this._space === ParticleSystemSimulationSpace.World) {
+            this._dir.applyMatrix4(this._worldSpaceMatrixInverse);
+        }
+        this._dir.normalize();
+        // Gizmos.DrawDirection(position, this._dir, 0xff0000, .5);
+        return this._dir;
     }
 }
 
@@ -559,6 +591,8 @@ function randomSpherePoint(x0: number, y0: number, z0: number, radius: number, t
 
 import { createNoise4D, NoiseFunction4D } from 'simplex-noise';
 import { Context } from "../engine/engine_setup";
+import { getWorldQuaternion } from "../engine/engine_three_utils";
+import { Gizmos } from "../engine/engine_gizmos";
 
 export class NoiseModule {
     @serializeable()
@@ -626,34 +660,342 @@ export class NoiseModule {
 
     /** nebula implementations: */
     private _temp: Vector3 = new Vector3();
-    applyNoise(index: number, pos: Vec3, vel: Vec3, deltaTime: number, age: number, life: number) {
+    apply(_index: number, pos: Vec3, vel: Vec3, _deltaTime: number, age: number, life: number) {
         if (!this.enabled) return;
         if (!this._noise) {
             this._noise = createNoise4D(() => 0);
         }
-        const t = age / life;
-        const dt = Context.Current.time.deltaTime;
         const temp = this._temp.set(pos.x, pos.y, pos.z).multiplyScalar(this.frequency);
         const nx = this._noise(temp.x, temp.y, temp.z, this._time);
-        const ny = this._noise(temp.x, temp.y, temp.z, this._time + .2);
-        const nz = this._noise(temp.x, temp.y, temp.z, this._time + .5);
-        this._temp.set(nx, ny, nz).normalize();
+        const ny = this._noise(temp.x, temp.y, temp.z, this._time + .3);
+        const nz = this._noise(temp.x, temp.y, temp.z, this._time + 1);
+        this._temp.set(nx, ny, nz).normalize()
 
+        const t = age / life;
         let strengthFactor = this.positionAmount.evaluate(t);
         if (!this.separateAxes) {
-            if (this.strengthX)
-                strengthFactor *= this.strengthX.evaluate(t, index * 1.1);
-            else strengthFactor *= this.strengthMultiplier;
-            strengthFactor *= deltaTime;
+            if (this.strengthX) {
+                strengthFactor *= this.strengthX.evaluate(t) * Math.PI;
+            }
+            // strengthFactor *= this.strengthMultiplier;
+            // strengthFactor *= deltaTime;
             this._temp.multiplyScalar(strengthFactor);
         }
-        if (this.separateAxes) {
-            this._temp.x *= strengthFactor * deltaTime * this.strengthXMultiplier
-            this._temp.y *= strengthFactor * deltaTime * this.strengthYMultiplier;
-            this._temp.z *= strengthFactor * deltaTime * this.strengthZMultiplier;
+        else {
+            this._temp.x *= strengthFactor * this.strengthXMultiplier
+            this._temp.y *= strengthFactor * this.strengthYMultiplier;
+            this._temp.z *= strengthFactor * this.strengthZMultiplier;
+        }
+        // this._temp.setLength(strengthFactor * deltaTime);
+        vel.x += this._temp.x;
+        vel.y += this._temp.y;
+        vel.z += this._temp.z;
+    }
+}
+
+export class TrailModule {
+
+    @serializeable()
+    enabled!: boolean;
+}
+
+export class VelocityOverLifetimeModule {
+    @serializeable()
+    enabled!: boolean;
+
+    /* orbital settings */
+
+
+    @serializeable()
+    space: ParticleSystemSimulationSpace = ParticleSystemSimulationSpace.Local;
+
+    @serializeable(MinMaxCurve)
+    speedModifier!: MinMaxCurve;
+    @serializeable()
+    speedModifierMultiplier!: number;
+    @serializeable(MinMaxCurve)
+    x!: MinMaxCurve;
+    @serializeable()
+    xMultiplier!: number;
+    @serializeable(MinMaxCurve)
+    y!: MinMaxCurve;
+    @serializeable()
+    yMultiplier!: number;
+    @serializeable(MinMaxCurve)
+    z!: MinMaxCurve;
+    @serializeable()
+    zMultiplier!: number;
+
+    private _system?: IParticleSystem;
+    // private _worldRotation: Quaternion = new Quaternion();
+
+    update(system: IParticleSystem) {
+        this._system = system;
+    }
+
+    private _temp: Vector3 = new Vector3();
+
+    apply(_index: number, _pos: Vec3, vel: Vec3, _dt: number, age: number, life: number) {
+        if (!this.enabled) return;
+        const t = age / life;
+
+        const speed = this.speedModifier.evaluate(t) * this.speedModifierMultiplier;
+        const x = this.x.evaluate(t) * speed;
+        const y = this.y.evaluate(t) * speed;
+        const z = this.z.evaluate(t) * speed;
+        this._temp.set(-x, y, z);
+        if (this._system) {
+            if (this.space === ParticleSystemSimulationSpace.World) {
+                this._temp.applyQuaternion(this._system.worldQuaternionInverted);
+            }
+            if (this._system.main.simulationSpace === ParticleSystemSimulationSpace.World) {
+                this._temp.applyQuaternion(this._system.worldQuaternion);
+            }
         }
         vel.x += this._temp.x;
         vel.y += this._temp.y;
         vel.z += this._temp.z;
     }
+}
+
+
+
+enum ParticleSystemAnimationTimeMode {
+    Lifetime,
+    Speed,
+    FPS,
+}
+
+enum ParticleSystemAnimationMode {
+    Grid,
+    Sprites,
+}
+
+enum ParticleSystemAnimationRowMode {
+    Custom,
+    Random,
+    MeshIndex,
+}
+
+enum ParticleSystemAnimationType {
+    WholeSheet,
+    SingleRow,
+}
+
+export class TextureSheetAnimationModule {
+
+    @serializeable()
+    animation!: ParticleSystemAnimationType;
+
+    @serializeable()
+    enabled!: boolean;
+
+    @serializeable()
+    cycleCount!: number;
+
+    @serializeable(MinMaxCurve)
+    frameOverTime!: MinMaxCurve;
+    @serializeable()
+    frameOverTimeMultiplier!: number;
+
+    @serializeable()
+    numTilesX!: number;
+    @serializeable()
+    numTilesY!: number;
+
+    @serializeable(MinMaxCurve)
+    startFrame!: MinMaxCurve;
+    @serializeable()
+    startFrameMultiplier!: number;
+
+    @serializeable()
+    rowMode!: ParticleSystemAnimationRowMode;
+    @serializeable()
+    rowIndex!: number;
+
+    @serializeable()
+    spriteCount!: number;
+
+    @serializeable()
+    timeMode!: ParticleSystemAnimationTimeMode;
+
+    private sampleOnceAtStart(): boolean {
+        if (this.timeMode === ParticleSystemAnimationTimeMode.Lifetime) {
+            switch (this.frameOverTime.mode) {
+                case ParticleSystemCurveMode.Constant:
+                case ParticleSystemCurveMode.TwoConstants:
+                    return true;
+            }
+        }
+        return false;
+    }
+
+    getStartIndex(): number {
+        if (this.sampleOnceAtStart()) {
+            return this.frameOverTime.evaluate(Math.random())
+        }
+        return 0;
+    }
+
+    evaluate(t01: number): number | undefined {
+        if (this.sampleOnceAtStart()) {
+            return;
+        }
+        return this.getIndex(t01);
+    }
+
+    private getIndex(t01: number): number {
+        const tiles = this.numTilesX * this.numTilesY;
+        // let pos = t01 * this.cycleCount;
+        let index = this.frameOverTime.evaluate(t01 % 1);
+        index *= this.frameOverTimeMultiplier;
+        index *= tiles;
+        index = index % tiles;
+        index = Math.floor(index);
+        // console.log(index);
+        return index;
+    }
+}
+
+
+export class RotationOverLifetimeModule {
+    @serializeable()
+    enabled!: boolean;
+
+    @serializeable()
+    separateAxes!: boolean;
+
+    @serializeable(MinMaxCurve)
+    x!: MinMaxCurve;
+    @serializeable()
+    xMultiplier!: number;
+    @serializeable(MinMaxCurve)
+    y!: MinMaxCurve;
+    @serializeable()
+    yMultiplier!: number;
+    @serializeable(MinMaxCurve)
+    z!: MinMaxCurve;
+    @serializeable()
+    zMultiplier!: number;
+
+    evaluate(t01: number): number {
+        if (!this.enabled) return 0;
+        if (!this.separateAxes) {
+            const rot = this.z.evaluate(t01) * -1;
+            return rot;
+        }
+        return 0;
+    }
+}
+
+export class RotationBySpeedModule {
+    @serializeable()
+    enabled!: boolean;
+
+    @serializeable()
+    range!: Vec2;
+
+    @serializeable()
+    separateAxes!: boolean;
+
+    @serializeable(MinMaxCurve)
+    x!: MinMaxCurve;
+    @serializeable()
+    xMultiplier!: number;
+    @serializeable(MinMaxCurve)
+    y!: MinMaxCurve;
+    @serializeable()
+    yMultiplier!: number;
+    @serializeable(MinMaxCurve)
+    z!: MinMaxCurve;
+    @serializeable()
+    zMultiplier!: number;
+
+    evaluate(_t01: number, speed: number): number {
+        if (!this.enabled) return 0;
+        if (!this.separateAxes) {
+            const t = Mathf.lerp(this.range.x, this.range.y, speed);
+            const rot = this.z.evaluate(t) * -1;
+            return rot;
+        }
+        return 0;
+    }
+}
+
+
+export class LimitVelocityOverLifetimeModule {
+    @serializeable()
+    enabled!: boolean;
+
+    @serializeable()
+    dampen!: number;
+
+    @serializeable(MinMaxCurve)
+    drag!: MinMaxCurve;
+    @serializeable()
+    dragMultiplier!: number;
+
+    @serializeable(MinMaxCurve)
+    limit!: MinMaxCurve;
+    @serializeable()
+    limitMultiplier!: number;
+
+    @serializeable()
+    separateAxes!: boolean;
+
+    @serializeable(MinMaxCurve)
+    limitX!: MinMaxCurve;
+    @serializeable()
+    limitXMultiplier!: number;
+    @serializeable(MinMaxCurve)
+    limitY!: MinMaxCurve;
+    @serializeable()
+    limitYMultiplier!: number;
+    @serializeable(MinMaxCurve)
+    limitZ!: MinMaxCurve;
+    @serializeable()
+    limitZMultiplier!: number;
+
+    @serializeable()
+    multiplyDragByParticleSize: boolean = false;
+    @serializeable()
+    multiplyDragByParticleVelocity: boolean = false;
+
+    @serializeable()
+    space!: ParticleSystemSimulationSpace;
+
+    private _temp: Vector3 = new Vector3();
+    private _temp2: Vector3 = new Vector3();
+
+    apply(_position: Vec3, baseVelocity: Vector3, currentVelocity: Vector3, _size: number, t01: number, _dt: number, _scale: number) {
+        if (!this.enabled) return;
+        // if (this.separateAxes) {
+        //     // const maxX = this.limitX.evaluate(t01) * this.limitXMultiplier;
+        //     // const maxY = this.limitY.evaluate(t01) * this.limitYMultiplier;
+        //     // const maxZ = this.limitZ.evaluate(t01) * this.limitZMultiplier;
+
+        // }
+        // else 
+        {
+            const max = this.limit.evaluate(t01) * this.limitMultiplier;
+            const speed = baseVelocity.length();
+            if (speed > max) {
+                this._temp.copy(baseVelocity).normalize().multiplyScalar(max);
+                let t = this.dampen * .5;
+                // t *= scale;
+                baseVelocity.x = Mathf.lerp(baseVelocity.x, this._temp.x, t);
+                baseVelocity.y = Mathf.lerp(baseVelocity.y, this._temp.y, t);
+                baseVelocity.z = Mathf.lerp(baseVelocity.z, this._temp.z, t);
+
+                // this._temp2.set(0, 0, 0);
+                currentVelocity.x = Mathf.lerp(currentVelocity.x, this._temp.x, t);
+                currentVelocity.y = Mathf.lerp(currentVelocity.y, this._temp.y, t);
+                currentVelocity.z = Mathf.lerp(currentVelocity.z, this._temp.z, t);
+            }
+            // vel.multiplyScalar(dragFactor);
+        }
+        // vel.x *= 0.3;
+        // vel.y *= 0.3;
+        // vel.z *= 0.3;
+    }
 }

package/src/engine-components/WebXRController.ts

@@ -162,6 +162,7 @@ export class WebXRController extends Behaviour {
     public grabbed: AttachedObject | null = null;
     public input: XRInputSource | null = null;
     public type: ControllerType = ControllerType.PhysicalDevice;
+    public showRaycastLine : boolean = true;
 
     get isUsingHands(): boolean {
         const r = this.input?.hand;
@@ -396,7 +397,7 @@ export class WebXRController extends Behaviour {
                 setWorldQuaternion(this.raycastLine, this.rayRotation);
             }
             else {
-                this.raycastLine.visible = true;
+                this.raycastLine.visible = this.showRaycastLine;
                 setWorldQuaternion(this.raycastLine, this.rayRotation);
                 setWorldPosition(this.raycastLine, wp);
             }

package/src/engine-components/codegen/components.ts

@@ -60,6 +60,12 @@ export { ColorOverLifetimeModule } from "../ParticleSystemModules";
 export { SizeOverLifetimeModule } from "../ParticleSystemModules";
 export { ShapeModule } from "../ParticleSystemModules";
 export { NoiseModule } from "../ParticleSystemModules";
+export { TrailModule } from "../ParticleSystemModules";
+export { VelocityOverLifetimeModule } from "../ParticleSystemModules";
+export { TextureSheetAnimationModule } from "../ParticleSystemModules";
+export { RotationOverLifetimeModule } from "../ParticleSystemModules";
+export { RotationBySpeedModule } from "../ParticleSystemModules";
+export { LimitVelocityOverLifetimeModule } from "../ParticleSystemModules";
 export { PlayerColor } from "../PlayerColor";
 export { ReflectionProbe } from "../ReflectionProbe";
 export { FieldWithDefault } from "../Renderer";

package/src/engine-components/js-extensions/RGBAColor.ts

@@ -32,6 +32,13 @@ export class RGBAColor extends Color {
         return super.lerp(color, alpha);
     }
 
+    lerpColors(color1: Color, color2: Color, alpha: number): this {
+        const rgba1 = color1 as RGBAColor;
+        const rgba2 = color2 as RGBAColor;
+        if(rgba1.alpha && rgba2.alpha) this.alpha = Mathf.lerp(rgba1.alpha, rgba2.alpha, alpha);
+        return super.lerpColors(color1, color2, alpha);
+    }
+
     multiply(color: Color): this {
         const rgba = color as RGBAColor;
         if(rgba.alpha) this.alpha = this.alpha * rgba.alpha;