sparcoon 0.0.1 → 0.0.3

package/dist/elements/FXEmitter.d.ts

@@ -1,4 +1,4 @@
-import { Object3D } from "three";
+import { Object3D, type Blending } from "three";
 import type { FXBehaviorModule } from "../behaviorModules/FXBehaviorModule";
 import type { FXRenderingModule } from "../renderingModules/FXRenderingModule";
 import type { FXSpawnModule } from "../spawnModules/FXSpawnModule";
@@ -7,6 +7,7 @@ export interface FXEmitterOptions {
     expectedCapacity: number;
     capacityStep: number;
     automaticallyDestroyModules: boolean;
+    blending: Blending;
 }
 export declare class FXEmitter extends Object3D {
     private readonly spawnSequence;

package/dist/elements/FXEmitter.js

@@ -1,4 +1,4 @@
-import { Object3D, Vector2 } from 'three';
+import { Object3D, Vector2, NormalBlending } from 'three';
 import { FXInstancedParticle } from '../instancedParticle/FXInstancedParticle.js';
 import { collectProperties, collectUniforms } from '../instancedParticle/FXInstancedParticle.Internal.js';
 import { resolveGLSLTypeInfo } from '../instancedParticle/shared.js';
@@ -72,13 +72,6 @@ class FXEmitter extends Object3D {
         };
         const collectedProperties = {
             builtin: resolveGLSLTypeInfo("Matrix4"),
-            // 0, 1   positionX, positionY
-            // 2, 3   velocityX, velocityY
-            // 4, 5   scaleX, scaleY
-            // 6, 7   rotation, torque
-            // 8, 9   lifetime, age
-            // 10, 11, 12   randomX, randomY, randomZ
-            // 13, 14, 16   reservedX, reservedY, reservedZ
         };
         collectProperties(collectedProperties, _private_spawnSequence, "UIEmitter.constructor.spawnSequence:");
         collectProperties(collectedProperties, _private_behaviorSequence, "UIEmitter.constructor.behaviorSequence");
@@ -87,7 +80,7 @@ class FXEmitter extends Object3D {
             origin: { value: new Vector2(), glslTypeInfo: resolveGLSLTypeInfo("Vector2") },
         };
         collectUniforms(collectedUniforms, _private_renderingSequence, "UIEmitter.constructor.renderingSequence");
-        this._private_mesh = new FXInstancedParticle(this._private_renderingSequence.map((module) => module.source), collectedUniforms, collectedProperties, options.expectedCapacity ?? EMITTER_DEFAULT_EXPECTED_CAPACITY, options.capacityStep ?? EMITTER_DEFAULT_CAPACITY_STEP);
+        this._private_mesh = new FXInstancedParticle(this._private_renderingSequence.map((module) => module.source), collectedUniforms, collectedProperties, options.expectedCapacity ?? EMITTER_DEFAULT_EXPECTED_CAPACITY, options.capacityStep ?? EMITTER_DEFAULT_CAPACITY_STEP, options.blending ?? NormalBlending);
         this.automaticallyDestroyModules =
             options.automaticallyDestroyModules ?? EMITTER_DEFAULT_AUTOMATICALLY_DESTROY_MODULES;
         this.add(this._private_mesh);
@@ -109,6 +102,7 @@ class FXEmitter extends Object3D {
                 module.destroy?.();
             }
         }
+        this.removeFromParent();
     }
     burst(count) {
         const instanceBegin = this._private_mesh.instanceCount;

package/dist/index.d.ts

@@ -5,10 +5,12 @@ export { FXBehaviorTorqueDamping } from "./behaviorModules/FXBehaviorTorqueDampi
 export { FXBehaviorTorqueNoise } from "./behaviorModules/FXBehaviorTorqueNoise";
 export { FXBehaviorVelocityDamping } from "./behaviorModules/FXBehaviorVelocityDamping";
 export { FXBehaviorVelocityNoise } from "./behaviorModules/FXBehaviorVelocityNoise";
+export { FXColor } from "./color/FXColor";
 export { FXEmitter } from "./elements/FXEmitter";
+export { FXRenderingAnimatedTexture } from "./renderingModules/FXRenderingAnimatedTexture";
 export { FXRenderingColorOverLife } from "./renderingModules/FXRenderingColorOverLife";
 export { FXRenderingColorOverVelocity } from "./renderingModules/FXRenderingColorOverVelocity";
-export { FXTextureRenderingModule } from "./renderingModules/FXRenderingTexture";
+export { FXRenderingTexture } from "./renderingModules/FXRenderingTexture";
 export { FXSpawnBox } from "./spawnModules/FXSpawnBox";
 export { FXSpawnOffset } from "./spawnModules/FXSpawnOffset";
 export { FXSpawnRandomLifetime } from "./spawnModules/FXSpawnRandomLifetime";

package/dist/index.js

@@ -5,10 +5,12 @@ export { FXBehaviorTorqueDamping } from './behaviorModules/FXBehaviorTorqueDampi
 export { FXBehaviorTorqueNoise } from './behaviorModules/FXBehaviorTorqueNoise.js';
 export { FXBehaviorVelocityDamping } from './behaviorModules/FXBehaviorVelocityDamping.js';
 export { FXBehaviorVelocityNoise } from './behaviorModules/FXBehaviorVelocityNoise.js';
+export { FXColor } from './color/FXColor.js';
 export { FXEmitter } from './elements/FXEmitter.js';
+export { FXRenderingAnimatedTexture } from './renderingModules/FXRenderingAnimatedTexture.js';
 export { FXRenderingColorOverLife } from './renderingModules/FXRenderingColorOverLife.js';
 export { FXRenderingColorOverVelocity } from './renderingModules/FXRenderingColorOverVelocity.js';
-export { FXTextureRenderingModule } from './renderingModules/FXRenderingTexture.js';
+export { FXRenderingTexture } from './renderingModules/FXRenderingTexture.js';
 export { FXSpawnBox } from './spawnModules/FXSpawnBox.js';
 export { FXSpawnOffset } from './spawnModules/FXSpawnOffset.js';
 export { FXSpawnRandomLifetime } from './spawnModules/FXSpawnRandomLifetime.js';

package/dist/instancedParticle/FXInstancedParticle.Internal.d.ts

@@ -1,4 +1,4 @@
-import { InstancedBufferGeometry, ShaderMaterial } from "three";
+import { InstancedBufferGeometry, ShaderMaterial, type Blending } from "three";
 import type { GLProperty, GLTypeInfo } from "./shared";
 import { type FXProperty, type FXPropertyName } from "./shared";
 export declare const INSTANCED_PARTICLE_GEOMETRY: InstancedBufferGeometry;
@@ -10,4 +10,4 @@ export declare function collectUniforms(keeper: Record<string, GLProperty>, modu
 }[], debugContext: string): void;
 export declare function buildParticleVertexShader(uniformDeclarations: string[], attributeDeclarations: string[], varyingDeclarations: string[], vertexAssignments: string[]): string;
 export declare function buildParticleFragmentShader(uniformDeclarations: string[], varyingDeclarations: string[], sources: string[]): string;
-export declare function buildParticleMaterial(sources: string[], uniformProperties: Record<string, GLProperty>, varyingProperties: Record<string, GLTypeInfo>): ShaderMaterial;
+export declare function buildParticleMaterial(sources: string[], uniformProperties: Record<string, GLProperty>, varyingProperties: Record<string, GLTypeInfo>, blending: Blending): ShaderMaterial;

package/dist/instancedParticle/FXInstancedParticle.Internal.js

@@ -87,6 +87,7 @@ function buildParticleVertexShader(uniformDeclarations, attributeDeclarations, v
       p_uv = uv;
 
       vec2 transformedPosition = position.xy;
+
       transformedPosition.x *= PARTICLE_SCALE_X;
       transformedPosition.y *= PARTICLE_SCALE_Y;
 
@@ -104,11 +105,9 @@ function buildParticleVertexShader(uniformDeclarations, attributeDeclarations, v
         PARTICLE_POSITION_Z
       );
 
-      vec4 mvCenter = modelViewMatrix * vec4(center, 1.0);
-
-      mvCenter.xy += transformedPosition;
-
-      gl_Position = projectionMatrix * mvCenter;
+      vec4 modelViewCenter = modelViewMatrix * vec4(center, 1.0);
+      modelViewCenter.xy += transformedPosition;
+      gl_Position = projectionMatrix * modelViewCenter;
     }
   `;
 }
@@ -186,7 +185,7 @@ function buildParticleFragmentShader(uniformDeclarations, varyingDeclarations, s
     }
   `;
 }
-function buildParticleMaterial(sources, uniformProperties, varyingProperties) {
+function buildParticleMaterial(sources, uniformProperties, varyingProperties, blending) {
     const uniforms = {};
     const uniformDeclarations = [];
     const attributeDeclarations = [];
@@ -210,6 +209,7 @@ function buildParticleMaterial(sources, uniformProperties, varyingProperties) {
         transparent: true,
         depthWrite: false,
         depthTest: true,
+        blending,
     });
 }
 

package/dist/instancedParticle/FXInstancedParticle.d.ts

@@ -1,3 +1,4 @@
+import type { Blending } from "three";
 import { InstancedBufferAttribute, Mesh } from "three";
 import { type GLProperty, type GLTypeInfo } from "./shared";
 export declare class FXInstancedParticle extends Mesh {
@@ -6,7 +7,7 @@ export declare class FXInstancedParticle extends Mesh {
     private readonly instancedGeometry;
     private readonly shaderMaterial;
     private capacity;
-    constructor(sources: string[], uniforms: Record<string, GLProperty>, varyings: Record<string, GLTypeInfo>, expectedCapacity: number, capacityStep: number);
+    constructor(sources: string[], uniforms: Record<string, GLProperty>, varyings: Record<string, GLTypeInfo>, expectedCapacity: number, capacityStep: number, blending: Blending);
     get instanceCount(): number;
     createInstances(count: number): void;
     setOrigin(x: number, y: number): void;

package/dist/instancedParticle/FXInstancedParticle.js

@@ -4,15 +4,13 @@ import { INSTANCED_PARTICLE_GEOMETRY, buildParticleMaterial } from './FXInstance
 import { resolvePropertyUniform } from './shared.js';
 
 class FXInstancedParticle extends Mesh {
-    constructor(sources, uniforms, varyings, expectedCapacity, _private_capacityStep) {
+    constructor(sources, uniforms, varyings, expectedCapacity, _private_capacityStep, blending) {
         const instancedGeometry = INSTANCED_PARTICLE_GEOMETRY.clone();
-        const shaderMaterial = buildParticleMaterial(sources, uniforms, varyings);
+        const shaderMaterial = buildParticleMaterial(sources, uniforms, varyings, blending);
         super(instancedGeometry, shaderMaterial);
         this._private_capacityStep = _private_capacityStep;
         this.propertyBuffers = {};
         this.frustumCulled = false;
-        this.matrixAutoUpdate = false;
-        this.matrixWorldAutoUpdate = false;
         this._private_instancedGeometry = instancedGeometry;
         this._private_instancedGeometry.instanceCount = 0;
         this._private_shaderMaterial = shaderMaterial;

package/dist/instancedParticle/shared.d.ts

@@ -1,7 +1,6 @@
 import type { IUniform, ShaderMaterial } from "three";
 import { Matrix3, Matrix4, Texture, Vector2, Vector3, Vector4 } from "three";
 import { FXColor } from "../color/FXColor";
-import type { FXTransparencyMode } from "../miscellaneous/FXTransparencyMode";
 export type FXProperty = Texture | FXColor | Vector2 | Vector3 | Vector4 | Matrix3 | Matrix4 | number;
 export type FXPropertyName = "Texture" | "UIColor" | "Vector2" | "Vector3" | "Vector4" | "Matrix3" | "Matrix4" | "number";
 export type FXPropertyConstructor = typeof Texture | typeof FXColor | typeof Vector2 | typeof Vector3 | typeof Vector4 | typeof Matrix3 | typeof Matrix4 | NumberConstructor;
@@ -21,7 +20,6 @@ export interface PlaneData {
     properties: Record<string, GLProperty>;
     transform: Matrix4;
     visibility: boolean;
-    transparency: FXTransparencyMode;
 }
 export declare function resolveGLSLTypeInfo(value: FXProperty | FXPropertyName | FXPropertyConstructor): GLTypeInfo;
 export declare function resolvePropertyUniform(name: string, material: ShaderMaterial): IUniform<FXProperty>;

package/dist/renderingModules/FXRenderingAnimatedTexture.d.ts

@@ -0,0 +1,5 @@
+import { type Texture } from "three";
+import { FXRenderingModule } from "./FXRenderingModule";
+export declare class FXRenderingAnimatedTexture extends FXRenderingModule {
+    constructor(texture: Texture, horizontalCount: number, verticalCount: number);
+}

package/dist/renderingModules/FXRenderingAnimatedTexture.js

@@ -0,0 +1,14 @@
+import { Vector2 } from 'three';
+import source from '../shaders/FXRenderingAnimatedTexture.glsl.js';
+import { FXRenderingModule } from './FXRenderingModule.js';
+
+class FXRenderingAnimatedTexture extends FXRenderingModule {
+    constructor(texture, horizontalCount, verticalCount) {
+        super();
+        /** @internal */
+        this.source = source;
+        this.requiredUniforms = { texture, count: new Vector2(horizontalCount, verticalCount) };
+    }
+}
+
+export { FXRenderingAnimatedTexture };

package/dist/renderingModules/FXRenderingTexture.d.ts

@@ -5,7 +5,7 @@ import { FXRenderingModule } from "./FXRenderingModule";
  *
  * Samples the texture using particle UV coordinates.
  */
-export declare class FXTextureRenderingModule extends FXRenderingModule {
+export declare class FXRenderingTexture extends FXRenderingModule {
     private readonly texture;
     /**
      * @param config - Texture configuration

package/dist/renderingModules/FXRenderingTexture.js

@@ -7,7 +7,7 @@ import { FXRenderingModule } from './FXRenderingModule.js';
  *
  * Samples the texture using particle UV coordinates.
  */
-class FXTextureRenderingModule extends FXRenderingModule {
+class FXRenderingTexture extends FXRenderingModule {
     /**
      * @param config - Texture configuration
      */
@@ -23,4 +23,4 @@ class FXTextureRenderingModule extends FXRenderingModule {
     }
 }
 
-export { FXTextureRenderingModule };
+export { FXRenderingTexture };

package/dist/shaders/FXRenderingAnimatedTexture.glsl.js

@@ -0,0 +1,3 @@
+var source = "vec4 draw(){float totalFrames=p_count.x*p_count.y;float frame=floor(PARTICLE_AGE/PARTICLE_LIFETIME*totalFrames);frame=clamp(frame,0.0,totalFrames-1.0);float col=mod(frame,p_count.x);float row=floor(frame/p_count.x);vec2 frameSize=vec2(1.0/p_count.x,1.0/p_count.y);vec2 uv=(p_uv+vec2(col,(p_count.y-1.0-row)))*frameSize;return srgbTexture2D(p_texture,uv);}";
+
+export { source as default };

package/dist/spawnModules/FXSpawnRandomVelocity.d.ts

@@ -1,26 +1,17 @@
+import { Vector3 } from "three";
 import { type FXRange, type FXRangeConfig } from "../miscellaneous/miscellaneous";
 import { FXSpawnModule } from "./FXSpawnModule";
-/**
- * Assigns random velocity to particles.
- *
- * Direction and magnitude are chosen independently from their respective ranges.
- */
 export declare class FXSpawnRandomVelocity extends FXSpawnModule<{
     builtin: "Matrix4";
 }> {
     private angleInternal;
     private magnitudeInternal;
-    /**
-     * @param angle - Direction range in radians. Accepts number, tuple, or range object
-     * @param magnitude - Speed range in units/second. Accepts number, tuple, or range object
-     */
-    constructor(angle?: FXRangeConfig, magnitude?: FXRangeConfig);
-    /** Direction range in radians */
+    private readonly directionInternal;
+    constructor(direction?: Vector3, angle?: FXRangeConfig, magnitude?: FXRangeConfig);
     get angle(): FXRange;
-    /** Speed range in units/second */
     get magnitude(): FXRange;
-    /** Direction range in radians */
+    get direction(): Vector3;
     set angle(value: FXRangeConfig);
-    /** Speed range in units/second */
     set magnitude(value: FXRangeConfig);
+    set direction(value: Vector3);
 }

package/dist/spawnModules/FXSpawnRandomVelocity.js

@@ -1,48 +1,45 @@
-import { MathUtils } from 'three';
+import { Vector3, MathUtils } from 'three';
 import { assertValidNumber } from '../miscellaneous/asserts.js';
-import { resolveFXRangeConfig, BUILTIN_OFFSET_VELOCITY_X, BUILTIN_OFFSET_VELOCITY_Y } from '../miscellaneous/miscellaneous.js';
+import { resolveFXRangeConfig, BUILTIN_OFFSET_VELOCITY_X, BUILTIN_OFFSET_VELOCITY_Y, BUILTIN_OFFSET_VELOCITY_Z } from '../miscellaneous/miscellaneous.js';
 import { FXSpawnModule } from './FXSpawnModule.js';
 
-/**
- * Assigns random velocity to particles.
- *
- * Direction and magnitude are chosen independently from their respective ranges.
- */
+const TEMP_TANGENT = new Vector3();
+const TEMP_BITANGENT = new Vector3();
+const TEMP_VELOCITY = new Vector3();
 class FXSpawnRandomVelocity extends FXSpawnModule {
-    /**
-     * @param angle - Direction range in radians. Accepts number, tuple, or range object
-     * @param magnitude - Speed range in units/second. Accepts number, tuple, or range object
-     */
-    constructor(angle = { min: -Math.PI, max: Math.PI }, magnitude = { min: -50, max: 50 }) {
+    constructor(direction = new Vector3(0, 1, 0), angle = { min: 0, max: Math.PI }, magnitude = { min: -50, max: 50 }) {
         super();
         /** @internal */
         this.requiredProperties = { builtin: "Matrix4" };
+        this._private_directionInternal = direction.clone().normalize();
         this._private_angleInternal = resolveFXRangeConfig(angle);
         this._private_magnitudeInternal = resolveFXRangeConfig(magnitude);
-        assertValidNumber(this._private_angleInternal.min, "UISpawnRandomVelocity.constructor.angle.min");
-        assertValidNumber(this._private_angleInternal.max, "UISpawnRandomVelocity.constructor.angle.max");
-        assertValidNumber(this._private_magnitudeInternal.min, "UISpawnRandomVelocity.constructor.magnitude.min");
-        assertValidNumber(this._private_magnitudeInternal.max, "UISpawnRandomVelocity.constructor.magnitude.max");
+        assertValidNumber(this._private_angleInternal.min, "FXSpawnRandomVelocity.constructor.angle.min");
+        assertValidNumber(this._private_angleInternal.max, "FXSpawnRandomVelocity.constructor.angle.max");
+        assertValidNumber(this._private_magnitudeInternal.min, "FXSpawnRandomVelocity.constructor.magnitude.min");
+        assertValidNumber(this._private_magnitudeInternal.max, "FXSpawnRandomVelocity.constructor.magnitude.max");
     }
-    /** Direction range in radians */
     get angle() {
         return this._private_angleInternal;
     }
-    /** Speed range in units/second */
     get magnitude() {
         return this._private_magnitudeInternal;
     }
-    /** Direction range in radians */
+    get direction() {
+        return this._private_directionInternal;
+    }
     set angle(value) {
         this._private_angleInternal = resolveFXRangeConfig(value);
-        assertValidNumber(this._private_angleInternal.min, "UISpawnRandomVelocity.angle.min");
-        assertValidNumber(this._private_angleInternal.max, "UISpawnRandomVelocity.angle.max");
+        assertValidNumber(this._private_angleInternal.min, "FXSpawnRandomVelocity.angle.min");
+        assertValidNumber(this._private_angleInternal.max, "FXSpawnRandomVelocity.angle.max");
     }
-    /** Speed range in units/second */
     set magnitude(value) {
         this._private_magnitudeInternal = resolveFXRangeConfig(value);
-        assertValidNumber(this._private_magnitudeInternal.min, "UISpawnRandomVelocity.magnitude.min");
-        assertValidNumber(this._private_magnitudeInternal.max, "UISpawnRandomVelocity.magnitude.max");
+        assertValidNumber(this._private_magnitudeInternal.min, "FXSpawnRandomVelocity.magnitude.min");
+        assertValidNumber(this._private_magnitudeInternal.max, "FXSpawnRandomVelocity.magnitude.max");
+    }
+    set direction(value) {
+        this._private_directionInternal.copy(value).normalize();
     }
     /** @internal */
     spawn(properties, instanceBegin, instanceEnd) {
@@ -50,12 +47,30 @@ class FXSpawnRandomVelocity extends FXSpawnModule {
         const { array, itemSize } = builtin;
         const { min: angleMin, max: angleMax } = this._private_angleInternal;
         const { min: magnitudeMin, max: magnitudeMax } = this._private_magnitudeInternal;
+        const dir = this._private_directionInternal;
+        if (Math.abs(dir.y) < 0.999) {
+            TEMP_TANGENT.set(0, 1, 0).cross(dir).normalize();
+        }
+        else {
+            TEMP_TANGENT.set(1, 0, 0).cross(dir).normalize();
+        }
+        TEMP_BITANGENT.crossVectors(dir, TEMP_TANGENT);
+        const cosMin = Math.cos(angleMax);
+        const cosMax = Math.cos(angleMin);
         for (let i = instanceBegin; i < instanceEnd; i++) {
             const itemOffset = i * itemSize;
-            const angle = MathUtils.randFloat(angleMin, angleMax);
+            const cosTheta = MathUtils.lerp(cosMin, cosMax, Math.random());
+            const sinTheta = Math.sqrt(1 - cosTheta * cosTheta);
+            const phi = Math.random() * Math.PI * 2;
             const magnitude = MathUtils.randFloat(magnitudeMin, magnitudeMax);
-            array[itemOffset + BUILTIN_OFFSET_VELOCITY_X] = Math.cos(angle) * magnitude;
-            array[itemOffset + BUILTIN_OFFSET_VELOCITY_Y] = Math.sin(angle) * magnitude;
+            TEMP_VELOCITY.copy(dir)
+                .multiplyScalar(cosTheta)
+                .addScaledVector(TEMP_TANGENT, Math.cos(phi) * sinTheta)
+                .addScaledVector(TEMP_BITANGENT, Math.sin(phi) * sinTheta)
+                .multiplyScalar(magnitude);
+            array[itemOffset + BUILTIN_OFFSET_VELOCITY_X] = TEMP_VELOCITY.x;
+            array[itemOffset + BUILTIN_OFFSET_VELOCITY_Y] = TEMP_VELOCITY.y;
+            array[itemOffset + BUILTIN_OFFSET_VELOCITY_Z] = TEMP_VELOCITY.z;
         }
         builtin.needsUpdate = true;
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sparcoon",
-  "version": "0.0.1",
+  "version": "0.0.3",
   "description": "",
   "keywords": [
     "particles",

package/dist/miscellaneous/FXTransparencyMode.d.ts

@@ -1,7 +0,0 @@
-/** Transparency rendering modes */
-export declare enum FXTransparencyMode {
-    /** Dithered transparency. Good performance. */
-    HASH = 0,
-    /** Alpha blending. Best quality. */
-    BLEND = 1
-}