x_ite 5.0.2 → 6.0.0

package/src/x_ite/Components/ParticleSystems/X3DParticleEmitterNode.js

@@ -49,41 +49,23 @@
 
 define ([
    "x_ite/Components/Core/X3DNode",
+   "x_ite/Browser/ParticleSystems/GeometryTypes",
    "x_ite/Base/X3DConstants",
-   "standard/Math/Numbers/Vector3",
-   "standard/Math/Numbers/Rotation4",
-   "standard/Math/Geometry/Line3",
-   "standard/Math/Geometry/Plane3",
-   "standard/Math/Algorithm",
-   "standard/Math/Algorithms/QuickSort",
+   "text!x_ite/Browser/ParticleSystems/Line3.glsl",
+   "text!x_ite/Browser/ParticleSystems/Plane3.glsl",
+   "text!x_ite/Browser/ParticleSystems/Box3.glsl",
+   "text!x_ite/Browser/ParticleSystems/BVH.glsl",
 ],
 function (X3DNode,
+          GeometryTypes,
           X3DConstants,
-          Vector3,
-          Rotation4,
-          Line3,
-          Plane3,
-          Algorithm,
-          QuickSort)
+          Line3Source,
+          Plane3Source,
+          Box3Source,
+          BVHSource)
 {
 "use strict";
 
-   var
-      normal       = new Vector3 (0, 0, 0),
-      fromPosition = new Vector3 (0, 0, 0),
-      line         = new Line3 (Vector3 .Zero, Vector3 .zAxis),
-      plane        = new Plane3 (Vector3 .Zero, Vector3 .zAxis);
-
-   function PlaneCompare (a, b)
-   {
-      return plane .getDistanceToPoint (a) < plane .getDistanceToPoint (b);
-   }
-
-   function PlaneCompareValue (a, b)
-   {
-      return a < plane .getDistanceToPoint (b);
-   }
-
    function X3DParticleEmitterNode (executionContext)
    {
       X3DNode .call (this, executionContext);
@@ -94,10 +76,23 @@ function (X3DNode,
       this ._mass        .setUnit ("mass");
       this ._surfaceArea .setUnit ("area");
 
-      this .rotations           = [ ];
-      this .intersections       = [ ];
-      this .intersectionNormals = [ ];
-      this .sorter              = new QuickSort (this .intersections, PlaneCompare);
+      this .samplers  = [ ];
+      this .uniforms  = { };
+      this .functions = [ ];
+      this .program   = null;
+
+      this .addSampler ("forces");
+      this .addSampler ("boundedVolume");
+      this .addSampler ("colorRamp");
+      this .addSampler ("texCoordRamp");
+
+      this .addUniform ("speed",     "uniform float speed;");
+      this .addUniform ("variation", "uniform float variation;");
+
+      this .addFunction (Line3Source);
+      this .addFunction (Plane3Source);
+      this .addFunction (Box3Source);
+      this .addFunction (BVHSource);
    }
 
    X3DParticleEmitterNode .prototype = Object .assign (Object .create (X3DNode .prototype),
@@ -107,26 +102,28 @@ function (X3DNode,
       {
          X3DNode .prototype .initialize .call (this);
 
-         this ._speed     .addInterest ("set_speed__", this);
+         const gl = this .getBrowser () .getContext ();
+
+         if (gl .getVersion () < 2)
+            return;
+
+         // Create program.
+
+         this .program           = this .createProgram ();
+         this .transformFeedback = gl .createTransformFeedback ();
+
+         // Initialize fields.
+
+         this ._on        .addInterest ("set_on__",        this);
+         this ._speed     .addInterest ("set_speed__",     this);
          this ._variation .addInterest ("set_variation__", this);
-         this ._mass      .addInterest ("set_mass__", this);
+         this ._mass      .addInterest ("set_mass__",      this);
 
+         this .set_on__ ();
          this .set_speed__ ();
          this .set_variation__ ();
          this .set_mass__ ();
       },
-      set_speed__: function ()
-      {
-         this .speed = this ._speed .getValue ();
-      },
-      set_variation__: function ()
-      {
-         this .variation = this ._variation .getValue ();
-      },
-      set_mass__: function ()
-      {
-         this .mass = this ._mass .getValue ();
-      },
       isExplosive: function ()
       {
          return false;
@@ -135,28 +132,21 @@ function (X3DNode,
       {
          return this .mass;
       },
-      getRandomLifetime: function (particleLifetime, lifetimeVariation)
+      set_on__: function ()
       {
-         var
-            v   = particleLifetime * lifetimeVariation,
-            min = Math .max (0, particleLifetime - v),
-            max = particleLifetime + v;
-
-         return Math .random () * (max - min) + min;
+         this .on = this ._on .getValue ();
       },
-      getRandomSpeed: function ()
+      set_speed__: function ()
       {
-         var
-            speed = this .speed,
-            v     = speed * this .variation,
-            min   = Math .max (0, speed - v),
-            max   = speed + v;
-
-         return Math .random () * (max - min) + min;
+         this .setUniform ("uniform1f", "speed", this ._speed .getValue ());
       },
-      getSphericalRandomVelocity: function (velocity)
+      set_variation__: function ()
       {
-         return this .getRandomNormal (velocity) .multiply (this .getRandomSpeed ());
+         this .setUniform ("uniform1f", "variation", this ._variation .getValue ());
+      },
+      set_mass__: function ()
+      {
+         this .mass = this ._mass .getValue ();
       },
       getRandomValue: function (min, max)
       {
@@ -164,7 +154,7 @@ function (X3DNode,
       },
       getRandomNormal: function (normal)
       {
-         var
+         const
             theta = this .getRandomValue (-1, 1) * Math .PI,
             cphi  = this .getRandomValue (-1, 1),
             phi   = Math .acos (cphi),
@@ -174,234 +164,834 @@ function (X3DNode,
                              Math .cos (theta) * r,
                              cphi);
       },
-      getRandomNormalWithAngle: function (angle, normal)
+      animate: function (particleSystem, deltaTime)
       {
-         var
-            theta = (Math .random () * 2 - 1) * Math .PI,
-            cphi  = this .getRandomValue (Math .cos (angle), 1),
-            phi   = Math .acos (cphi),
-            r     = Math .sin (phi);
+         const
+            browser         = this .getBrowser (),
+            gl              = browser .getContext (),
+            inputParticles  = particleSystem .inputParticles,
+            particleStride  = particleSystem .particleStride,
+            particleOffsets = particleSystem .particleOffsets,
+            program         = this .program;
 
-         return normal .set (Math .sin (theta) * r,
-                             Math .cos (theta) * r,
-                             cphi);
+         // Start
+
+         gl .useProgram (program);
+
+         // Uniforms
+
+         gl .uniform1i (program .randomSeed,        Math .random () * 0xffffffff);
+         gl .uniform1i (program .geometryType,      particleSystem .geometryType);
+         gl .uniform1i (program .createParticles,   particleSystem .createParticles && this .on);
+         gl .uniform1f (program .particleLifetime,  particleSystem .particleLifetime);
+         gl .uniform1f (program .lifetimeVariation, particleSystem .lifetimeVariation);
+         gl .uniform1f (program .deltaTime,         deltaTime);
+         gl .uniform2f (program .particleSize,      particleSystem ._particleSize .x, particleSystem ._particleSize .y);
+
+         // Forces
+
+         gl .uniform1i (program .numForces, particleSystem .numForces);
+
+         if (particleSystem .numForces)
+         {
+            gl .activeTexture (gl .TEXTURE0 + program .forcesTextureUnit);
+            gl .bindTexture (gl .TEXTURE_2D, particleSystem .forcesTexture);
+         }
+
+         // Bounded Physics
+
+         if (particleSystem .boundedHierarchyRoot < 0)
+         {
+            gl .uniform1i (program .boundedHierarchyRoot, -1);
+         }
+         else
+         {
+            gl .uniform1i (program .boundedVerticesIndex,  particleSystem .boundedVerticesIndex);
+            gl .uniform1i (program .boundedNormalsIndex,   particleSystem .boundedNormalsIndex);
+            gl .uniform1i (program .boundedHierarchyIndex, particleSystem .boundedHierarchyIndex);
+            gl .uniform1i (program .boundedHierarchyRoot,  particleSystem .boundedHierarchyRoot);
+
+            gl .activeTexture (gl .TEXTURE0 + program .boundedVolumeTextureUnit);
+            gl .bindTexture (gl .TEXTURE_2D, particleSystem .boundedTexture);
+         }
+
+         // Colors
+
+         gl .uniform1i (program .numColors, particleSystem .numColors);
+
+         if (particleSystem .numColors)
+         {
+            gl .activeTexture (gl .TEXTURE0 + program .colorRampTextureUnit);
+            gl .bindTexture (gl .TEXTURE_2D, particleSystem .colorRampTexture);
+         }
+
+         // TexCoords
+
+         gl .uniform1i (program .numTexCoords, particleSystem .numTexCoords);
+
+         if (particleSystem .numTexCoords)
+         {
+            gl .uniform1i (program .texCoordCount, particleSystem .texCoordCount);
+
+            gl .activeTexture (gl .TEXTURE0 + program .texCoordRampTextureUnit);
+            gl .bindTexture (gl .TEXTURE_2D, particleSystem .texCoordRampTexture);
+         }
+
+         // Other textures
+
+         this .activateTextures (gl, program);
+
+         // Input attributes
+
+         if (inputParticles .emitterArrayObject .enable (gl, program))
+         {
+            for (const [i, attribute] of program .inputs)
+            {
+               gl .bindBuffer (gl .ARRAY_BUFFER, inputParticles);
+               gl .enableVertexAttribArray (attribute);
+               gl .vertexAttribPointer (attribute, 4, gl .FLOAT, false, particleStride, particleOffsets [i]);
+            }
+
+            gl .bindBuffer (gl .ARRAY_BUFFER, null);
+         }
+
+         // Transform particles.
+
+         gl .bindTransformFeedback (gl .TRANSFORM_FEEDBACK, this .transformFeedback);
+         gl .bindBufferBase (gl .TRANSFORM_FEEDBACK_BUFFER, 0, particleSystem .outputParticles);
+         gl .enable (gl .RASTERIZER_DISCARD);
+         gl .beginTransformFeedback (gl .POINTS);
+         gl .drawArrays (gl .POINTS, 0, particleSystem .numParticles);
+         gl .endTransformFeedback ();
+         gl .disable (gl .RASTERIZER_DISCARD);
+         gl .bindTransformFeedback (gl .TRANSFORM_FEEDBACK, null);
+
+         // DEBUG
+
+         // const data = new Float32Array (particleSystem .numParticles * (particleStride / 4));
+         // gl .bindBuffer (gl .ARRAY_BUFFER, particleSystem .outputParticles);
+         // gl .getBufferSubData (gl .ARRAY_BUFFER, 0, data);
+         // console .log (data .slice (0, particleStride / 4));
       },
-      getRandomNormalWithDirectionAndAngle: function (direction, angle, normal)
+      addSampler: function (name)
       {
-         rotation .setFromToVec (Vector3 .zAxis, direction);
-
-         return rotation .multVecRot (this .getRandomNormalWithAngle (angle, normal));
+         this .samplers .push (name);
       },
-      getRandomSurfaceNormal: function (normal)
+      addUniform: function (name, uniform)
       {
-         var
-            theta = this .getRandomValue (-1, 1) * Math .PI,
-            cphi  = Math .pow (Math .random (), 1/3),
-            phi   = Math .acos (cphi),
-            r     = Math .sin (phi);
+         this .uniforms [name] = uniform;
+      },
+      setUniform: function (func, name, value1, value2, value3)
+      {
+         const
+            gl      = this .getBrowser () .getContext (),
+            program = this .program;
 
-         return normal .set (Math .sin (theta) * r,
-                             Math .cos (theta) * r,
-                             cphi);
+         gl .useProgram (program);
+         gl [func] (program [name], value1, value2, value3);
       },
-      animate: function (particleSystem, deltaTime)
+      addFunction: function (func)
       {
-         var
-            particles         = particleSystem .particles,
-            numParticles      = particleSystem .numParticles,
-            createParticles   = particleSystem .createParticles,
-            particleLifetime  = particleSystem .particleLifetime,
-            lifetimeVariation = particleSystem .lifetimeVariation,
-            speeds            = particleSystem .speeds,            // speed of velocities
-            velocities        = particleSystem .velocities,        // resulting velocities from forces
-            turbulences       = particleSystem .turbulences,       // turbulences
-            rotations         = this .rotations,                   // rotation to direction of force
-            numForces         = particleSystem .numForces,         // number of forces
-            boundedPhysics    = particleSystem .boundedVertices .length,
-            boundedVolume     = particleSystem .boundedVolume;
-
-         for (var i = rotations .length; i < numForces; ++ i)
-            rotations [i] = new Rotation4 (0, 0, 1, 0);
-
-         for (var i = 0; i < numForces; ++ i)
-            rotations [i] .setFromToVec (Vector3 .zAxis, velocities [i]);
-
-         for (var i = 0; i < numParticles; ++ i)
+         this .functions .push (func);
+      },
+      createProgram: function ()
+      {
+         const
+            browser = this .getBrowser (),
+            gl      = browser .getContext ();
+
+         const vertexShaderSource = /* glsl */ `#version 300 es
+
+         precision highp float;
+         precision highp int;
+         precision highp sampler2D;
+
+         uniform int   randomSeed;
+         uniform int   geometryType;
+         uniform bool  createParticles;
+         uniform float particleLifetime;
+         uniform float lifetimeVariation;
+         uniform float deltaTime;
+         uniform vec2  particleSize;
+
+         uniform int       numForces;
+         uniform sampler2D forces;
+
+         uniform int       boundedVerticesIndex;
+         uniform int       boundedNormalsIndex;
+         uniform int       boundedHierarchyIndex;
+         uniform int       boundedHierarchyRoot;
+         uniform sampler2D boundedVolume;
+
+         uniform int       numColors;
+         uniform sampler2D colorRamp;
+
+         uniform int       texCoordCount;
+         uniform int       numTexCoords;
+         uniform sampler2D texCoordRamp;
+
+         ${Object .values (this .uniforms) .join ("\n")}
+
+         in vec4 input0;
+         in vec4 input2;
+         in vec4 input6;
+
+         out vec4 output0;
+         out vec4 output1;
+         out vec4 output2;
+
+         out vec4 output3;
+         out vec4 output4;
+         out vec4 output5;
+         out vec4 output6;
+
+         // Constants
+
+         ${Object .entries (GeometryTypes) .map (([k, v]) => `#define ${k} ${v}`) .join ("\n")}
+
+         const int   ARRAY_SIZE = 32;
+         const float M_PI       = 3.14159265359;
+
+         uniform float NaN;
+
+         // Texture
+
+         vec4
+         texelFetch (const in sampler2D sampler, const in int index, const in int lod)
          {
-            var
-               particle    = particles [i],
-               elapsedTime = particle .elapsedTime + deltaTime;
+            int   x = textureSize (sampler, lod) .x;
+            ivec2 p = ivec2 (index % x, index / x);
+            vec4  t = texelFetch (sampler, p, lod);
 
-            if (elapsedTime > particle .lifetime)
-            {
-               // Create new particle or hide particle.
+            return t;
+         }
 
-               particle .lifetime    = this .getRandomLifetime (particleLifetime, lifetimeVariation);
-               particle .elapsedTime = 0;
+         // Math
 
-               if (createParticles)
+         // Save normalize, that will not divide by zero.
+         vec3
+         save_normalize (const in vec3 vector)
+         {
+            float l = length (vector);
+
+            if (l == 0.0)
+               return vec3 (0.0);
+
+            return vector / l;
+         }
+
+         // Quaternion
+
+         vec4
+         Quaternion (const in vec3 fromVector, const in vec3 toVector)
+         {
+            vec3 from = save_normalize (fromVector);
+            vec3 to   = save_normalize (toVector);
+
+            float cos_angle = dot (from, to);
+            vec3  cross_vec = cross (from, to);
+            float cross_len = length (cross_vec);
+
+            if (cross_len == 0.0)
+            {
+               if (cos_angle > 0.0)
                {
-                  ++ particle .life;
-                  this .getRandomPosition (particle .position);
-                  this .getRandomVelocity (particle .velocity);
+                  return vec4 (0.0, 0.0, 0.0, 1.0);
                }
                else
-                  particle .position .set (Number .POSITIVE_INFINITY, Number .POSITIVE_INFINITY, Number .POSITIVE_INFINITY);
+               {
+                  vec3 t = cross (from, vec3 (1.0, 0.0, 0.0));
+
+                  if (dot (t, t) == 0.0)
+                     t = cross (from, vec3 (0.0, 1.0, 0.0));
+
+                  t = save_normalize (t);
+
+                  return vec4 (t, 0.0);
+               }
             }
             else
             {
-               // Animate particle.
+               float s = sqrt (abs (1.0 - cos_angle) * 0.5);
+
+               cross_vec = save_normalize (cross_vec);
+
+               return vec4 (cross_vec * s, sqrt (abs (1.0 + cos_angle) * 0.5));
+            }
+         }
+
+         vec3
+         multVecQuat (const in vec3 v, const in vec4 q)
+         {
+            float a = q .w * q .w - q .x * q .x - q .y * q .y - q .z * q .z;
+            float b = 2.0 * (v .x * q .x + v .y * q .y + v .z * q .z);
+            float c = 2.0 * q .w;
+            vec3  r = a * v .xyz + b * q .xyz + c * (q .yzx * v .zxy - q .zxy * v .yzx);
+
+            return r;
+         }
+
+         mat3
+         Matrix3 (const in vec4 quaternion)
+         {
+            float x = quaternion .x;
+            float y = quaternion .y;
+            float z = quaternion .z;
+            float w = quaternion .w;
+            float A = y * y;
+            float B = z * z;
+            float C = x * y;
+            float D = z * w;
+            float E = z * x;
+            float F = y * w;
+            float G = x * x;
+            float H = y * z;
+            float I = x * w;
+
+            return mat3 (1.0 - 2.0 * (A + B),
+                         2.0 * (C + D),
+                         2.0 * (E - F),
+                         2.0 * (C - D),
+                         1.0 - 2.0 * (B + G),
+                         2.0 * (H + I),
+                         2.0 * (E + F),
+                         2.0 * (H - I),
+                         1.0 - 2.0 * (A + G));
+         }
+
+         /* Random number generation */
+
+         uint seed = 1u;
+
+         void
+         srand (const in int value)
+         {
+            seed = uint (value);
+         }
+
+         // Return a uniform distributed random floating point number in the interval [0, 1].
+         float
+         random ()
+         {
+            seed = seed * 1103515245u + 12345u;
+
+            return float (seed) / 4294967295.0;
+         }
+
+         float
+         getRandomValue (const in float min, const in float max)
+         {
+            return min + random () * (max - min);
+         }
+
+         float
+         getRandomLifetime ()
+         {
+            float v    = particleLifetime * lifetimeVariation;
+            float min_ = max (0.0, particleLifetime - v);
+            float max_ = particleLifetime + v;
 
-               var
-                  position = particle .position,
-                  velocity = particle .velocity;
+            return getRandomValue (min_, max_);
+         }
+
+         float
+         getRandomSpeed ()
+         {
+            float v    = speed * variation;
+            float min_ = max (0.0, speed - v);
+            float max_ = speed + v;
+
+            return getRandomValue (min_, max_);
+         }
+
+         vec3
+         getRandomNormal ()
+         {
+            float theta = getRandomValue (-M_PI, M_PI);
+            float cphi  = getRandomValue (-1.0, 1.0);
+            float r     = sqrt (1.0 - cphi * cphi); // sin (acos (cphi));
+
+            return vec3 (sin (theta) * r, cos (theta) * r, cphi);
+         }
+
+         vec3
+         getRandomNormalWithAngle (const in float angle)
+         {
+            float theta = getRandomValue (-M_PI, M_PI);
+            float cphi  = getRandomValue (cos (angle), 1.0);
+            float r     = sqrt (1.0 - cphi * cphi); // sin (acos (cphi));
+
+            return vec3 (sin (theta) * r, cos (theta) * r, cphi);
+         }
+
+         vec3
+         getRandomNormalWithDirectionAndAngle (const in vec3 direction, const in float angle)
+         {
+            vec4 rotation = Quaternion (vec3 (0.0, 0.0, 1.0), direction);
+            vec3 normal   = getRandomNormalWithAngle (angle);
 
-               for (var f = 0; f < numForces; ++ f)
+            return multVecQuat (normal, rotation);
+         }
+
+         vec3
+         getRandomSurfaceNormal (const in vec3 direction)
+         {
+            float theta    = getRandomValue (-M_PI, M_PI);
+            float cphi     = pow (random (), 1.0 / 3.0);
+            float r        = sqrt (1.0 - cphi * cphi); // sin (acos (cphi));
+            vec3  normal   = vec3 (sin (theta) * r, cos (theta) * r, cphi);
+            vec4  rotation = Quaternion (vec3 (0.0, 0.0, 1.0), direction);
+
+            return multVecQuat (normal, rotation);
+         }
+
+         vec3
+         getRandomSphericalVelocity ()
+         {
+            vec3  normal = getRandomNormal ();
+            float speed  = getRandomSpeed ();
+
+            return normal * speed;
+         }
+
+         // Algorithms
+
+         int
+         upperBound (const in sampler2D sampler, in int count, const in float value)
+         {
+            int first = 0;
+            int step  = 0;
+
+            while (count > 0)
+            {
+               int index = first;
+
+               step = count >> 1;
+
+               index += step;
+
+               if (value < texelFetch (sampler, index, 0) .x)
                {
-                  velocity .add (rotations [f] .multVecRot (this .getRandomNormalWithAngle (turbulences [f], normal)) .multiply (speeds [f]));
+                  count = step;
                }
+               else
+               {
+                  first  = ++ index;
+                  count -= step + 1;
+               }
+            }
 
-               if (boundedPhysics)
+            return first;
+         }
+
+         void
+         interpolate (const in sampler2D sampler, const in int count, const in float fraction, out int index0, out int index1, out float weight)
+         {
+            // Determine index0, index1 and weight.
+
+            if (count == 1 || fraction <= texelFetch (sampler, 0, 0) .x)
+            {
+               index0 = 0;
+               index1 = 0;
+               weight = 0.0;
+            }
+            else if (fraction >= texelFetch (sampler, count - 1, 0) .x)
+            {
+               index0 = count - 2;
+               index1 = count - 1;
+               weight = 1.0;
+            }
+            else
+            {
+               int index = upperBound (sampler, count, fraction);
+
+               if (index < count)
                {
-                  fromPosition .x = position .x;
-                  fromPosition .y = position .y;
-                  fromPosition .z = position .z;
+                  index1 = index;
+                  index0 = index - 1;
 
-                  position .x += velocity .x * deltaTime;
-                  position .y += velocity .y * deltaTime;
-                  position .z += velocity .z * deltaTime;
+                  float key0 = texelFetch (sampler, index0, 0) .x;
+                  float key1 = texelFetch (sampler, index1, 0) .x;
 
-                  this .bounce (boundedVolume, fromPosition, position, velocity);
+                  weight = clamp ((fraction - key0) / (key1 - key0), 0.0, 1.0);
                }
                else
                {
-                  position .x += velocity .x * deltaTime;
-                  position .y += velocity .y * deltaTime;
-                  position .z += velocity .z * deltaTime;
+                  index0 = 0;
+                  index1 = 0;
+                  weight = 0.0;
                }
+            }
+         }
+
+         void
+         interpolate (const in sampler2D sampler, const in int count, const in float fraction, out int index0)
+         {
+            // Determine index0.
 
-               particle .elapsedTime = elapsedTime;
+            if (count == 1 || fraction <= texelFetch (sampler, 0, 0) .x)
+            {
+               index0 = 0;
+            }
+            else if (fraction >= texelFetch (sampler, count - 1, 0) .x)
+            {
+               index0 = count - 2;
+            }
+            else
+            {
+               int index = upperBound (sampler, count, fraction);
+
+               if (index < count)
+                  index0 = index - 1;
+               else
+                  index0 = 0;
             }
          }
 
-         // Animate color if needed.
+         vec3
+         getRandomBarycentricCoord ()
+         {
+            // Random barycentric coordinates.
 
-         if (particleSystem .geometryContext .colorMaterial)
-            this .getColors (particles, particleSystem .colorKeys, particleSystem .colorRamp, numParticles);
-      },
-      bounce: function (boundedVolume, fromPosition, toPosition, velocity)
-      {
-         normal .assign (velocity) .normalize ();
+            float u = random ();
+            float v = random ();
+
+            if (u + v > 1.0)
+            {
+               u = 1.0 - u;
+               v = 1.0 - v;
+            }
 
-         line .set (fromPosition, normal);
+            float t = 1.0 - u - v;
 
-         var
-            intersections       = this .intersections,
-            intersectionNormals = this .intersectionNormals,
-            numIntersections    = boundedVolume .intersectsLine (line, intersections, intersectionNormals);
+            return vec3 (t, u, v);
+         }
 
-         if (numIntersections)
+         void
+         getRandomPointOnSurface (const in sampler2D surface, const in int verticesIndex, const in int normalsIndex, out vec4 position, out vec3 normal)
          {
-            for (var i = 0; i < numIntersections; ++ i)
-               intersections [i] .index = i;
+            // Determine index0, index1 and weight.
+
+            float lastAreaSoFar = texelFetch (surface, verticesIndex - 1, 0) .x;
+            float fraction      = random () * lastAreaSoFar;
 
-            plane .set (fromPosition, normal);
+            int   index0;
+            int   index1;
+            int   index2;
+            float weight;
 
-            this .sorter .sort (0, numIntersections);
+            interpolate (surface, verticesIndex, fraction, index0, index1, weight);
 
-            var index = Algorithm .upperBound (intersections, 0, numIntersections, 0, PlaneCompareValue);
+            // Interpolate and return position.
 
-            if (index < numIntersections)
+            index0 *= 3;
+            index1  = index0 + 1;
+            index2  = index0 + 2;
+
+            vec4 vertex0 = texelFetch (surface, verticesIndex + index0, 0);
+            vec4 vertex1 = texelFetch (surface, verticesIndex + index1, 0);
+            vec4 vertex2 = texelFetch (surface, verticesIndex + index2, 0);
+
+            vec3 normal0 = texelFetch (surface, normalsIndex + index0, 0) .xyz;
+            vec3 normal1 = texelFetch (surface, normalsIndex + index1, 0) .xyz;
+            vec3 normal2 = texelFetch (surface, normalsIndex + index2, 0) .xyz;
+
+            // Random barycentric coordinates.
+
+            vec3 r = getRandomBarycentricCoord ();
+
+            // Calculate position and direction.
+
+            position = r .z * vertex0 + r .x * vertex1 + r .y * vertex2;
+            normal   = save_normalize (r .z * normal0 + r .x * normal1 + r .y * normal2);
+         }
+
+         // Functions
+
+         ${this .functions .join ("\n")}
+
+         // Current values
+
+         vec4
+         getColor (const in float lifetime, const in float elapsedTime)
+         {
+            if (numColors > 0)
             {
-               var
-                  intersection       = intersections [index],
-                  intersectionNormal = intersectionNormals [intersection .index];
+               // Determine index0, index1 and weight.
 
-               plane .set (intersection, intersectionNormal);
+               float fraction = elapsedTime / lifetime;
 
-               if (plane .getDistanceToPoint (fromPosition) * plane .getDistanceToPoint (toPosition) < 0)
-               {
-                  var dot2 = 2 * intersectionNormal .dot (velocity);
+               int   index0;
+               int   index1;
+               float weight;
 
-                  velocity .x -= intersectionNormal .x * dot2;
-                  velocity .y -= intersectionNormal .y * dot2;
-                  velocity .z -= intersectionNormal .z * dot2;
+               interpolate (colorRamp, numColors, fraction, index0, index1, weight);
 
-                  normal .assign (velocity) .normalize ();
+               // Interpolate and return color.
 
-                  var distance = intersection .distance (fromPosition);
+               vec4 color0 = texelFetch (colorRamp, numColors + index0, 0);
+               vec4 color1 = texelFetch (colorRamp, numColors + index1, 0);
 
-                  toPosition .x = intersection .x + normal .x * distance;
-                  toPosition .y = intersection .y + normal .y * distance;
-                  toPosition .z = intersection .z + normal .z * distance;
-               }
+               return mix (color0, color1, weight);
+            }
+            else
+            {
+               return vec4 (1.0);
             }
          }
-      },
-      getColors: function (particles, colorKeys, colorRamp, numParticles)
-      {
-         var
-            length = colorKeys .length,
-            index0 = 0,
-            index1 = 0,
-            weight = 0;
 
-         for (var i = 0; i < numParticles; ++ i)
+         void
+         bounce (const in vec4 fromPosition, inout vec4 toPosition, inout vec3 velocity)
          {
-            // Determine index0, index1 and weight.
+            if (boundedHierarchyRoot < 0)
+               return;
+
+            Line3 line = Line3 (fromPosition .xyz, save_normalize (velocity));
 
-            var
-               particle = particles [i],
-               fraction = particle .elapsedTime / particle .lifetime,
-               color    = particle .color;
+            vec4 points  [ARRAY_SIZE];
+            vec3 normals [ARRAY_SIZE];
 
-            if (length == 1 || fraction <= colorKeys [0])
+            int numIntersections = getIntersections (boundedVolume, boundedVerticesIndex, boundedNormalsIndex, boundedHierarchyIndex, boundedHierarchyRoot, line, points, normals);
+
+            if (numIntersections == 0)
+               return;
+
+            Plane3 plane1 = plane3 (line .point, line .direction);
+
+            int index = min_index (points, numIntersections, 0.0, plane1);
+
+            if (index == -1)
+               return;
+
+            Plane3 plane2 = plane3 (points [index] .xyz, normals [index]);
+
+            if (sign (plane_distance (plane2, fromPosition .xyz)) == sign (plane_distance (plane2, toPosition .xyz)))
+               return;
+
+            velocity   = reflect (velocity, normals [index]);
+            toPosition = vec4 (points [index] .xyz + reflect (points [index] .xyz - fromPosition .xyz, normals [index]), 1.0);
+         }
+
+         int
+         getTexCoordIndex0 (const in float lifetime, const in float elapsedTime)
+         {
+            if (numTexCoords == 0)
             {
-               index0 = 0;
-               index1 = 0;
-               weight = 0;
+               return -1;
+            }
+            else
+            {
+               float fraction = elapsedTime / lifetime;
+               int   index0   = 0;
+
+               interpolate (texCoordRamp, numTexCoords, fraction, index0);
+
+               return numTexCoords + index0 * texCoordCount;
             }
-            else if (fraction >= colorKeys [length - 1])
+         }
+
+         void
+         main ()
+         {
+            int   life        = int (input0 [0]);
+            float lifetime    = input0 [1];
+            float elapsedTime = input0 [2] + deltaTime;
+
+            srand ((gl_VertexID + randomSeed) * randomSeed);
+
+            if (elapsedTime > lifetime)
             {
-               index0 = length - 2;
-               index1 = length - 1;
-               weight = 1;
+               // Create new particle or hide particle.
+
+               lifetime    = getRandomLifetime ();
+               elapsedTime = 0.0;
+
+               output0 = vec4 (max (life + 1, 1), lifetime, elapsedTime, getTexCoordIndex0 (lifetime, elapsedTime));
+
+               if (createParticles)
+               {
+                  output1 = getColor (lifetime, elapsedTime);
+                  output2 = vec4 (getRandomVelocity (), 0.0);
+                  output6 = getRandomPosition ();
+               }
+               else
+               {
+                  output1 = vec4 (0.0);
+                  output2 = vec4 (0.0);
+                  output6 = vec4 (NaN);
+               }
             }
             else
             {
-               var index = Algorithm .upperBound (colorKeys, 0, length, fraction, Algorithm .less);
+               // Animate particle.
+
+               vec3 velocity = input2 .xyz;
+               vec4 position = input6;
 
-               if (index < length)
+               for (int i = 0; i < numForces; ++ i)
                {
-                  index1 = index;
-                  index0 = index - 1;
+                  vec4  force      = texelFetch (forces, i, 0);
+                  float turbulence = force .w;
+                  vec3  normal     = getRandomNormalWithDirectionAndAngle (force .xyz, turbulence);
+                  float speed      = length (force .xyz);
+
+                  velocity += normal * speed;
+               }
+
+               position .xyz += velocity * deltaTime;
 
-                  var
-                     key0 = colorKeys [index0],
-                     key1 = colorKeys [index1];
+               bounce (input6, position, velocity);
 
-                  weight = Algorithm .clamp ((fraction - key0) / (key1 - key0), 0, 1);
+               output0 = vec4 (life, lifetime, elapsedTime, getTexCoordIndex0 (lifetime, elapsedTime));
+               output1 = getColor (lifetime, elapsedTime);
+               output2 = vec4 (velocity, 0.0);
+               output6 = position;
+            }
+
+            switch (geometryType)
+            {
+               case POINT:
+               case SPRITE:
+               case GEOMETRY:
+               {
+                  output3 = vec4 (1.0, 0.0, 0.0, 0.0);
+                  output4 = vec4 (0.0, 1.0, 0.0, 0.0);
+                  output5 = vec4 (0.0, 0.0, 1.0, 0.0);
+                  break;
                }
-               else
+               case LINE:
                {
-                  index0 = 0;
-                  index1 = 0;
-                  weight = 0;
+                  mat3 r = Matrix3 (Quaternion (vec3 (0.0, 0.0, 1.0), output2 .xyz));
+                  mat3 s = mat3 (1.0, 0.0, 0.0, 0.0, 1.0, 0.0, 0.0, 0.0, particleSize .y);
+                  mat3 m = r * s;
+
+                  output3 = vec4 (m [0], 0.0);
+                  output4 = vec4 (m [1], 0.0);
+                  output5 = vec4 (m [2], 0.0);
+                  break;
+               }
+               default: // QUAD, TRIANGLE
+               {
+                  output3 = vec4 (particleSize .x, 0.0, 0.0, 0.0);
+                  output4 = vec4 (0.0, particleSize .y, 0.0, 0.0);
+                  output5 = vec4 (0.0, 0.0, 1.0, 0.0);
+                  break;
                }
             }
+         }
+         `;
+
+         const fragmentShaderSource = /* glsl */ `#version 300 es
+
+         precision highp float;
+
+         void
+         main () { }
+         `;
+
+         // Vertex shader
+
+         const vertexShader = gl .createShader (gl .VERTEX_SHADER);
+
+         gl .shaderSource (vertexShader, vertexShaderSource);
+         gl .compileShader (vertexShader);
+
+         // Fragment shader
+
+         const fragmentShader = gl .createShader (gl .FRAGMENT_SHADER);
+
+         gl .shaderSource (fragmentShader, fragmentShaderSource);
+         gl .compileShader (fragmentShader);
+
+         // Program
+
+         const program = gl .createProgram ();
+
+         gl .attachShader (program, vertexShader);
+         gl .attachShader (program, fragmentShader);
+         gl .transformFeedbackVaryings (program, Array .from ({length: 7}, (_, i) => "output" + i), gl .INTERLEAVED_ATTRIBS);
+         gl .linkProgram (program);
+
+         if (!gl .getProgramParameter (program, gl .LINK_STATUS))
+            console .error ("Couldn't initialize particle shader: " + gl .getProgramInfoLog (program));
+
+         program .inputs = [
+            [0, gl .getAttribLocation (program, "input0")],
+            [2, gl .getAttribLocation (program, "input2")],
+            [6, gl .getAttribLocation (program, "input6")],
+         ];
 
-            // Interpolate and set color.
+         program .randomSeed        = gl .getUniformLocation (program, "randomSeed");
+         program .geometryType      = gl .getUniformLocation (program, "geometryType");
+         program .createParticles   = gl .getUniformLocation (program, "createParticles");
+         program .particleLifetime  = gl .getUniformLocation (program, "particleLifetime");
+         program .lifetimeVariation = gl .getUniformLocation (program, "lifetimeVariation");
+         program .deltaTime         = gl .getUniformLocation (program, "deltaTime");
+         program .particleSize      = gl .getUniformLocation (program, "particleSize");
 
-            var
-               color0 = colorRamp [index0],
-               color1 = colorRamp [index1];
+         program .numForces = gl .getUniformLocation (program, "numForces");
+         program .forces    = gl .getUniformLocation (program, "forces");
 
-            // Algorithm .lerp (color0, color1, weight);
-            color .x = color0 .x + weight * (color1 .x - color0 .x);
-            color .y = color0 .y + weight * (color1 .y - color0 .y);
-            color .z = color0 .z + weight * (color1 .z - color0 .z);
-            color .w = color0 .w + weight * (color1 .w - color0 .w);
+         program .boundedVerticesIndex  = gl .getUniformLocation (program, "boundedVerticesIndex");
+         program .boundedNormalsIndex   = gl .getUniformLocation (program, "boundedNormalsIndex");
+         program .boundedHierarchyIndex = gl .getUniformLocation (program, "boundedHierarchyIndex");
+         program .boundedHierarchyRoot  = gl .getUniformLocation (program, "boundedHierarchyRoot");
+         program .boundedVolume         = gl .getUniformLocation (program, "boundedVolume");
+
+         program .numColors = gl .getUniformLocation (program, "numColors");
+         program .colorRamp = gl .getUniformLocation (program, "colorRamp");
+
+         program .texCoordCount = gl .getUniformLocation (program, "texCoordCount");
+         program .numTexCoords  = gl .getUniformLocation (program, "numTexCoords");
+         program .texCoordRamp  = gl .getUniformLocation (program, "texCoordRamp");
+
+         for (const name of Object .keys (this .uniforms))
+            program [name] = gl .getUniformLocation (program, name);
+
+         program .NaN = gl .getUniformLocation (program, "NaN");
+
+         gl .useProgram (program);
+
+         for (const name of this .samplers)
+         {
+            const location = gl .getUniformLocation (program, name);
+
+            gl .uniform1i (location, program [name + "TextureUnit"] = browser .getTexture2DUnit ());
          }
+
+         gl .uniform1f (program .NaN, NaN);
+
+         browser .resetTextureUnits ();
+
+         return program;
+      },
+      activateTextures: function ()
+      { },
+      createTexture: function ()
+      {
+         const
+            gl      = this .getBrowser () .getContext (),
+            texture = gl .createTexture ();
+
+         gl .bindTexture (gl .TEXTURE_2D, texture);
+
+         gl .texParameteri (gl .TEXTURE_2D, gl .TEXTURE_WRAP_S,     gl .CLAMP_TO_EDGE);
+         gl .texParameteri (gl .TEXTURE_2D, gl .TEXTURE_WRAP_T,     gl .CLAMP_TO_EDGE);
+         gl .texParameteri (gl .TEXTURE_2D, gl .TEXTURE_MAG_FILTER, gl .NEAREST);
+         gl .texParameteri (gl .TEXTURE_2D, gl .TEXTURE_MIN_FILTER, gl .NEAREST);
+
+         gl .texImage2D (gl .TEXTURE_2D, 0, gl .RGBA32F, 1, 1, 0, gl .RGBA, gl .FLOAT, new Float32Array (4));
+
+         return texture;
+      },
+      getTexture2DUnit: function (browser, object, property)
+      {
+         const textureUnit = object [property];
+
+         if (textureUnit === undefined)
+            return object [property] = browser .getTexture2DUnit ();
+
+         return textureUnit;
       },
    });