@newkrok/three-particles 1.0.2 → 2.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (44) hide show
  1. package/README.md +28 -12
  2. package/dist/bundle-report.json +1 -0
  3. package/dist/index.d.ts +7 -0
  4. package/dist/index.d.ts.map +1 -0
  5. package/dist/index.js +6 -0
  6. package/dist/js/effects/three-particles/index.d.ts +7 -0
  7. package/dist/js/effects/three-particles/index.d.ts.map +1 -0
  8. package/dist/js/effects/three-particles/index.js +6 -0
  9. package/dist/js/effects/three-particles/shaders/particle-system-fragment-shader.glsl.d.ts +3 -0
  10. package/dist/js/effects/three-particles/shaders/particle-system-fragment-shader.glsl.d.ts.map +1 -0
  11. package/{src → dist}/js/effects/three-particles/shaders/particle-system-fragment-shader.glsl.js +66 -67
  12. package/dist/js/effects/three-particles/shaders/particle-system-vertex-shader.glsl.d.ts +3 -0
  13. package/dist/js/effects/three-particles/shaders/particle-system-vertex-shader.glsl.d.ts.map +1 -0
  14. package/{src → dist}/js/effects/three-particles/shaders/particle-system-vertex-shader.glsl.js +32 -33
  15. package/dist/js/effects/three-particles/three-particles-bezier.d.ts +5 -0
  16. package/dist/js/effects/three-particles/three-particles-bezier.d.ts.map +1 -0
  17. package/dist/js/effects/three-particles/three-particles-bezier.js +62 -0
  18. package/dist/js/effects/three-particles/three-particles-curves.d.ts +37 -0
  19. package/dist/js/effects/three-particles/three-particles-curves.d.ts.map +1 -0
  20. package/dist/js/effects/three-particles/three-particles-curves.js +37 -0
  21. package/dist/js/effects/three-particles/three-particles-enums.d.ts +25 -0
  22. package/dist/js/effects/three-particles/three-particles-enums.d.ts.map +1 -0
  23. package/dist/js/effects/three-particles/three-particles-enums.js +1 -0
  24. package/dist/js/effects/three-particles/three-particles-modifiers.d.ts +11 -0
  25. package/dist/js/effects/three-particles/three-particles-modifiers.d.ts.map +1 -0
  26. package/dist/js/effects/three-particles/three-particles-modifiers.js +93 -0
  27. package/dist/js/effects/three-particles/three-particles-utils.d.ts +31 -0
  28. package/dist/js/effects/three-particles/three-particles-utils.d.ts.map +1 -0
  29. package/dist/js/effects/three-particles/three-particles-utils.js +145 -0
  30. package/dist/js/effects/three-particles/three-particles.d.ts +13 -0
  31. package/dist/js/effects/three-particles/three-particles.d.ts.map +1 -0
  32. package/dist/js/effects/three-particles/three-particles.js +642 -0
  33. package/dist/js/effects/three-particles/types.d.ts +1037 -0
  34. package/dist/js/effects/three-particles/types.d.ts.map +1 -0
  35. package/dist/js/effects/three-particles/types.js +1 -0
  36. package/dist/three-particles.min.js +1 -0
  37. package/package.json +87 -37
  38. package/src/js/effects/three-particles/three-particles-bezier.js +0 -36
  39. package/src/js/effects/three-particles/three-particles-curves.js +0 -75
  40. package/src/js/effects/three-particles/three-particles-enums.js +0 -23
  41. package/src/js/effects/three-particles/three-particles-modifiers.js +0 -133
  42. package/src/js/effects/three-particles/three-particles-utils.js +0 -212
  43. package/src/js/effects/three-particles.d.ts +0 -79
  44. package/src/js/effects/three-particles.js +0 -931
@@ -0,0 +1,31 @@
1
+ import * as THREE from 'three';
2
+ import { EmitFrom } from './three-particles-enums.js';
3
+ import { Constant, LifetimeCurve, Point3D, RandomBetweenTwoConstants } from './types.js';
4
+ export declare const calculateRandomPositionAndVelocityOnSphere: (position: THREE.Vector3, quaternion: THREE.Quaternion, velocity: THREE.Vector3, speed: number, { radius, radiusThickness, arc, }: {
5
+ radius: number;
6
+ radiusThickness: number;
7
+ arc: number;
8
+ }) => void;
9
+ export declare const calculateRandomPositionAndVelocityOnCone: (position: THREE.Vector3, quaternion: THREE.Quaternion, velocity: THREE.Vector3, speed: number, { radius, radiusThickness, arc, angle, }: {
10
+ radius: number;
11
+ radiusThickness: number;
12
+ arc: number;
13
+ angle?: number;
14
+ }) => void;
15
+ export declare const calculateRandomPositionAndVelocityOnBox: (position: THREE.Vector3, quaternion: THREE.Quaternion, velocity: THREE.Vector3, speed: number, { scale, emitFrom }: {
16
+ scale: Point3D;
17
+ emitFrom: EmitFrom;
18
+ }) => void;
19
+ export declare const calculateRandomPositionAndVelocityOnCircle: (position: THREE.Vector3, quaternion: THREE.Quaternion, velocity: THREE.Vector3, speed: number, { radius, radiusThickness, arc, }: {
20
+ radius: number;
21
+ radiusThickness: number;
22
+ arc: number;
23
+ }) => void;
24
+ export declare const calculateRandomPositionAndVelocityOnRectangle: (position: THREE.Vector3, quaternion: THREE.Quaternion, velocity: THREE.Vector3, speed: number, { rotation, scale }: {
25
+ rotation: Point3D;
26
+ scale: Point3D;
27
+ }) => void;
28
+ export declare const isLifeTimeCurve: (value: Constant | RandomBetweenTwoConstants | LifetimeCurve) => value is LifetimeCurve;
29
+ export declare const getCurveFunctionFromConfig: (particleSystemId: number, lifeTimeCurve: LifetimeCurve) => import("./types.js").CurveFunction;
30
+ export declare const calculateValue: (particleSystemId: number, value: Constant | RandomBetweenTwoConstants | LifetimeCurve, time?: number) => number;
31
+ //# sourceMappingURL=three-particles-utils.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"three-particles-utils.d.ts","sourceRoot":"","sources":["../../../../src/js/effects/three-particles/three-particles-utils.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,QAAQ,EAAiB,MAAM,4BAA4B,CAAC;AACrE,OAAO,EACL,QAAQ,EACR,aAAa,EACb,OAAO,EACP,yBAAyB,EAC1B,MAAM,YAAY,CAAC;AAEpB,eAAO,MAAM,0CAA0C,aAC3C,KAAK,CAAC,OAAO,cACX,KAAK,CAAC,UAAU,YAClB,KAAK,CAAC,OAAO,SAChB,MAAM,qCAKV;IAAE,MAAM,EAAE,MAAM,CAAC;IAAC,eAAe,EAAE,MAAM,CAAC;IAAC,GAAG,EAAE,MAAM,CAAA;CAAE,SAiC5D,CAAC;AAEF,eAAO,MAAM,wCAAwC,aACzC,KAAK,CAAC,OAAO,cACX,KAAK,CAAC,UAAU,YAClB,KAAK,CAAC,OAAO,SAChB,MAAM,4CAMV;IACD,MAAM,EAAE,MAAM,CAAC;IACf,eAAe,EAAE,MAAM,CAAC;IACxB,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,SAgCF,CAAC;AAEF,eAAO,MAAM,uCAAuC,aACxC,KAAK,CAAC,OAAO,cACX,KAAK,CAAC,UAAU,YAClB,KAAK,CAAC,OAAO,SAChB,MAAM,uBACQ;IAAE,KAAK,EAAE,OAAO,CAAC;IAAC,QAAQ,EAAE,QAAQ,CAAA;CAAE,SA0C5D,CAAC;AAEF,eAAO,MAAM,0CAA0C,aAC3C,KAAK,CAAC,OAAO,cACX,KAAK,CAAC,UAAU,YAClB,KAAK,CAAC,OAAO,SAChB,MAAM,qCAKV;IAAE,MAAM,EAAE,MAAM,CAAC;IAAC,eAAe,EAAE,MAAM,CAAC;IAAC,GAAG,EAAE,MAAM,CAAA;CAAE,SA2B5D,CAAC;AAEF,eAAO,MAAM,6CAA6C,aAC9C,KAAK,CAAC,OAAO,cACX,KAAK,CAAC,UAAU,YAClB,KAAK,CAAC,OAAO,SAChB,MAAM,uBACQ;IAAE,QAAQ,EAAE,OAAO,CAAC;IAAC,KAAK,EAAE,OAAO,CAAA;CAAE,SAiB3D,CAAC;AAEF,eAAO,MAAM,eAAe,UACnB,QAAQ,GAAG,yBAAyB,GAAG,aAAa,KAC1D,KAAK,IAAI,aAEX,CAAC;AAEF,eAAO,MAAM,0BAA0B,qBACnB,MAAM,iBACT,aAAa,uCAc7B,CAAC;AAEF,eAAO,MAAM,cAAc,qBACP,MAAM,SACjB,QAAQ,GAAG,yBAAyB,GAAG,aAAa,SACrD,MAAM,KACX,MAiBF,CAAC"}
@@ -0,0 +1,145 @@
1
+ import * as THREE from 'three';
2
+ import { createBezierCurveFunction } from './three-particles-bezier.js';
3
+ export const calculateRandomPositionAndVelocityOnSphere = (position, quaternion, velocity, speed, { radius, radiusThickness, arc, }) => {
4
+ const u = Math.random() * (arc / 360);
5
+ const v = Math.random();
6
+ const randomizedDistanceRatio = Math.random();
7
+ const theta = 2 * Math.PI * u;
8
+ const phi = Math.acos(2 * v - 1);
9
+ const sinPhi = Math.sin(phi);
10
+ const xDirection = sinPhi * Math.cos(theta);
11
+ const yDirection = sinPhi * Math.sin(theta);
12
+ const zDirection = Math.cos(phi);
13
+ const normalizedThickness = 1 - radiusThickness;
14
+ position.x =
15
+ radius * normalizedThickness * xDirection +
16
+ radius * radiusThickness * randomizedDistanceRatio * xDirection;
17
+ position.y =
18
+ radius * normalizedThickness * yDirection +
19
+ radius * radiusThickness * randomizedDistanceRatio * yDirection;
20
+ position.z =
21
+ radius * normalizedThickness * zDirection +
22
+ radius * radiusThickness * randomizedDistanceRatio * zDirection;
23
+ position.applyQuaternion(quaternion);
24
+ const speedMultiplierByPosition = 1 / position.length();
25
+ velocity.set(position.x * speedMultiplierByPosition * speed, position.y * speedMultiplierByPosition * speed, position.z * speedMultiplierByPosition * speed);
26
+ velocity.applyQuaternion(quaternion);
27
+ };
28
+ export const calculateRandomPositionAndVelocityOnCone = (position, quaternion, velocity, speed, { radius, radiusThickness, arc, angle = 90, }) => {
29
+ const theta = 2 * Math.PI * Math.random() * (arc / 360);
30
+ const randomizedDistanceRatio = Math.random();
31
+ const xDirection = Math.cos(theta);
32
+ const yDirection = Math.sin(theta);
33
+ const normalizedThickness = 1 - radiusThickness;
34
+ position.x =
35
+ radius * normalizedThickness * xDirection +
36
+ radius * radiusThickness * randomizedDistanceRatio * xDirection;
37
+ position.y =
38
+ radius * normalizedThickness * yDirection +
39
+ radius * radiusThickness * randomizedDistanceRatio * yDirection;
40
+ position.z = 0;
41
+ position.applyQuaternion(quaternion);
42
+ const positionLength = position.length();
43
+ const normalizedAngle = Math.abs((positionLength / radius) * THREE.MathUtils.degToRad(angle));
44
+ const sinNormalizedAngle = Math.sin(normalizedAngle);
45
+ const speedMultiplierByPosition = 1 / positionLength;
46
+ velocity.set(position.x * sinNormalizedAngle * speedMultiplierByPosition * speed, position.y * sinNormalizedAngle * speedMultiplierByPosition * speed, Math.cos(normalizedAngle) * speed);
47
+ velocity.applyQuaternion(quaternion);
48
+ };
49
+ export const calculateRandomPositionAndVelocityOnBox = (position, quaternion, velocity, speed, { scale, emitFrom }) => {
50
+ const _scale = scale;
51
+ switch (emitFrom) {
52
+ case "VOLUME" /* EmitFrom.VOLUME */:
53
+ position.x = Math.random() * _scale.x - _scale.x / 2;
54
+ position.y = Math.random() * _scale.y - _scale.y / 2;
55
+ position.z = Math.random() * _scale.z - _scale.z / 2;
56
+ break;
57
+ case "SHELL" /* EmitFrom.SHELL */:
58
+ const side = Math.floor(Math.random() * 6);
59
+ const perpendicularAxis = side % 3;
60
+ const shellResult = [];
61
+ shellResult[perpendicularAxis] = side > 2 ? 1 : 0;
62
+ shellResult[(perpendicularAxis + 1) % 3] = Math.random();
63
+ shellResult[(perpendicularAxis + 2) % 3] = Math.random();
64
+ position.x = shellResult[0] * _scale.x - _scale.x / 2;
65
+ position.y = shellResult[1] * _scale.y - _scale.y / 2;
66
+ position.z = shellResult[2] * _scale.z - _scale.z / 2;
67
+ break;
68
+ case "EDGE" /* EmitFrom.EDGE */:
69
+ const side2 = Math.floor(Math.random() * 6);
70
+ const perpendicularAxis2 = side2 % 3;
71
+ const edge = Math.floor(Math.random() * 4);
72
+ const edgeResult = [];
73
+ edgeResult[perpendicularAxis2] = side2 > 2 ? 1 : 0;
74
+ edgeResult[(perpendicularAxis2 + 1) % 3] =
75
+ edge < 2 ? Math.random() : edge - 2;
76
+ edgeResult[(perpendicularAxis2 + 2) % 3] =
77
+ edge < 2 ? edge : Math.random();
78
+ position.x = edgeResult[0] * _scale.x - _scale.x / 2;
79
+ position.y = edgeResult[1] * _scale.y - _scale.y / 2;
80
+ position.z = edgeResult[2] * _scale.z - _scale.z / 2;
81
+ break;
82
+ }
83
+ position.applyQuaternion(quaternion);
84
+ velocity.set(0, 0, speed);
85
+ velocity.applyQuaternion(quaternion);
86
+ };
87
+ export const calculateRandomPositionAndVelocityOnCircle = (position, quaternion, velocity, speed, { radius, radiusThickness, arc, }) => {
88
+ const theta = 2 * Math.PI * Math.random() * (arc / 360);
89
+ const randomizedDistanceRatio = Math.random();
90
+ const xDirection = Math.cos(theta);
91
+ const yDirection = Math.sin(theta);
92
+ const normalizedThickness = 1 - radiusThickness;
93
+ position.x =
94
+ radius * normalizedThickness * xDirection +
95
+ radius * radiusThickness * randomizedDistanceRatio * xDirection;
96
+ position.y =
97
+ radius * normalizedThickness * yDirection +
98
+ radius * radiusThickness * randomizedDistanceRatio * yDirection;
99
+ position.z = 0;
100
+ position.applyQuaternion(quaternion);
101
+ const positionLength = position.length();
102
+ const speedMultiplierByPosition = 1 / positionLength;
103
+ velocity.set(position.x * speedMultiplierByPosition * speed, position.y * speedMultiplierByPosition * speed, 0);
104
+ velocity.applyQuaternion(quaternion);
105
+ };
106
+ export const calculateRandomPositionAndVelocityOnRectangle = (position, quaternion, velocity, speed, { rotation, scale }) => {
107
+ const _scale = scale;
108
+ const _rotation = rotation;
109
+ const xOffset = Math.random() * _scale.x - _scale.x / 2;
110
+ const yOffset = Math.random() * _scale.y - _scale.y / 2;
111
+ const rotationX = THREE.MathUtils.degToRad(_rotation.x);
112
+ const rotationY = THREE.MathUtils.degToRad(_rotation.y);
113
+ position.x = xOffset * Math.cos(rotationY);
114
+ position.y = yOffset * Math.cos(rotationX);
115
+ position.z = xOffset * Math.sin(rotationY) - yOffset * Math.sin(rotationX);
116
+ position.applyQuaternion(quaternion);
117
+ velocity.set(0, 0, speed);
118
+ velocity.applyQuaternion(quaternion);
119
+ };
120
+ export const isLifeTimeCurve = (value) => {
121
+ return typeof value !== 'number' && 'type' in value;
122
+ };
123
+ export const getCurveFunctionFromConfig = (particleSystemId, lifeTimeCurve) => {
124
+ if (lifeTimeCurve.type === "BEZIER" /* LifeTimeCurve.BEZIER */) {
125
+ return createBezierCurveFunction(particleSystemId, lifeTimeCurve.bezierPoints); // Bézier curve
126
+ }
127
+ if (lifeTimeCurve.type === "EASING" /* LifeTimeCurve.EASING */) {
128
+ return lifeTimeCurve.curveFunction; // Easing curve
129
+ }
130
+ throw new Error(`Unsupported value type: ${lifeTimeCurve}`);
131
+ };
132
+ export const calculateValue = (particleSystemId, value, time = 0) => {
133
+ if (typeof value === 'number') {
134
+ return value; // Constant value
135
+ }
136
+ if ('min' in value && 'max' in value) {
137
+ if (value.min === value.max) {
138
+ return value.min ?? 0; // Constant value
139
+ }
140
+ return THREE.MathUtils.randFloat(value.min ?? 0, value.max ?? 1); // Random range
141
+ }
142
+ const lifeTimeCurve = value;
143
+ return (getCurveFunctionFromConfig(particleSystemId, lifeTimeCurve)(time) *
144
+ (lifeTimeCurve.scale ?? 1));
145
+ };
@@ -0,0 +1,13 @@
1
+ import { CycleData, ParticleSystem, ParticleSystemConfig } from './types.js';
2
+ export * from './types.js';
3
+ export declare const blendingMap: {
4
+ 'THREE.NoBlending': 0;
5
+ 'THREE.NormalBlending': 1;
6
+ 'THREE.AdditiveBlending': 2;
7
+ 'THREE.SubtractiveBlending': 3;
8
+ 'THREE.MultiplyBlending': 4;
9
+ };
10
+ export declare const getDefaultParticleSystemConfig: () => any;
11
+ export declare const createParticleSystem: (config?: ParticleSystemConfig, externalNow?: number) => ParticleSystem;
12
+ export declare const updateParticleSystems: ({ now, delta, elapsed }: CycleData) => void;
13
+ //# sourceMappingURL=three-particles.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"three-particles.d.ts","sourceRoot":"","sources":["../../../../src/js/effects/three-particles/three-particles.ts"],"names":[],"mappings":"AA0BA,OAAO,EAEL,SAAS,EAIT,cAAc,EACd,oBAAoB,EAKrB,MAAM,YAAY,CAAC;AAEpB,cAAc,YAAY,CAAC;AAK3B,eAAO,MAAM,WAAW;;;;;;CAMvB,CAAC;AAEF,eAAO,MAAM,8BAA8B,WACiB,CAAC;AAwP7D,eAAO,MAAM,oBAAoB,YACvB,oBAAoB,gBACd,MAAM,KACnB,cAkjBF,CAAC;AAEF,eAAO,MAAM,qBAAqB,4BAA6B,SAAS,SAmPvE,CAAC"}