babylon.quarks 0.25.0 → 0.26.0

package/src/shaders/chunks/surface.ts

@@ -1,43 +1,65 @@
 /**
  * Texture effects shared by the sprite, mesh and trail fragment shaders, in
- * both shader languages: UV scrolling, a gradient map and alpha erosion.
+ * both shader languages: UV scrolling, UV distortion, a gradient map and
+ * alpha erosion.
  *
- * - `UV_SCROLL`: `uvScrollOffset` (already wrapped to 0…1 on the CPU, so it
- *   never loses precision) is added to the map's UV. The texture should wrap
- *   (repeat); scrolling a tile of a sheet runs into its neighbours.
- * - `GRADIENT_MAP`: the map's red channel picks a colour along U of
- *   `gradientMap`, whose alpha multiplies the map's. A greyscale texture is
- *   then recoloured by a ramp, and the particle colour still tints it.
- *   `gradientMapRange` keeps the lookup between the first and last texel
- *   centres. Make the ramp without mipmaps: the lookup's UV jumps with the
- *   map's detail, and the hardware would pick a blurred mip for it.
+ * - `UV1`: the vertex shader passes `vUV1`, the particle's own UV that the
+ *   sprite sheet never moves (see `UVChannel`). The distortion noise and the
+ *   erosion mask read it under `UV_DISTORTION_UV1` / `EROSION_MASK_UV1`, the
+ *   map's UV (`vUV`) otherwise.
+ * - Each texture can be laid by a transform, `(tiling u, tiling v, offset u,
+ *   offset v)`: sampled at `uv * transform.xy + transform.zw`, the offset
+ *   holding its scroll, wrapped on the CPU so it never loses precision (see
+ *   `TextureUV`).
+ * - `MAP_TRANSFORM`: the map is laid by `mapTransform`, on `vUV1` under
+ *   `MAP_UV1` (where the sheet's second tile is not blended, the sheet not
+ *   applying), on the sheet's UV otherwise, where a scroll runs into the
+ *   neighbouring tiles.
+ * - `UV_DISTORTION`: the map's UV is pushed about by a noise texture
+ *   (`distortionMap`, red and green around 0.5, laid by `distortionTransform`)
+ *   by up to `distortionStrength` UV units: the heat shimmer, licking and
+ *   breathing of fire and auras. On a sprite sheet the pushed UV can reach
+ *   the neighbouring tile.
+ * - `GRADIENT_MAP`: the map's texel dotted with `gradientMapChannel` (one
+ *   channel, or luminance weights) picks a colour along U of `gradientMap`.
+ *   The ramp's alpha multiplies the map's, or replaces it when the lookup is
+ *   by alpha (`gradientMapChannel.a` 1). The particle colour still tints the
+ *   result. `gradientMapRange` keeps the lookup between the first and last
+ *   texel centres. Make the ramp without mipmaps: the lookup's UV jumps with
+ *   the map's detail, and the hardware would pick a blurred mip for it.
  * - `EROSION`: the particle's alpha stops being a transparency and becomes how
  *   much of the shape is left. A fragment shows where the mask (the red
- *   channel of `erosionMask` under `EROSION_MASK`, the map's alpha otherwise)
- *   is above the cut that alpha sets: alpha 1 shows everything the map shows,
- *   alpha 0 nothing, and on the way down the shape eats away from its lowest
- *   mask values first — a noise mask dissolves it, a gradient mask wipes it.
- *   `erosionParams` is (softness, edge width, mask offset u, mask offset v),
- *   the edge band just above the cut glows in `erosionEdgeColor`. The mask is
- *   sampled with the particle's UV as drawn, which on a sprite sheet is the
- *   current tile's. Erosion only changes alpha, so blend modes that ignore
- *   alpha (one-one, premultiplied) show a hard cut.
+ *   channel of `erosionMask` under `EROSION_MASK`, laid by
+ *   `erosionMaskTransform`; the map's alpha otherwise) is above the cut that
+ *   alpha sets: alpha 1 shows everything the map shows, alpha 0 nothing, and
+ *   on the way down the shape eats away from its lowest mask values first — a
+ *   noise mask dissolves it, a gradient mask wipes it. `erosionParams` is
+ *   (softness, edge width); the edge band just above the cut glows in
+ *   `erosionEdgeColor`. Erosion only changes alpha, so blend modes that
+ *   ignore alpha (one-one, premultiplied) show a hard cut.
  */
 
 /** Fragment-side declarations, GLSL. */
 export const surfaceFragmentDeclarationGLSL = /* glsl */ `
-#ifdef UV_SCROLL
-uniform vec2 uvScrollOffset;
+#ifdef MAP_TRANSFORM
+uniform vec4 mapTransform;
+#endif
+#ifdef UV_DISTORTION
+uniform sampler2D distortionMap;
+uniform vec4 distortionTransform;
+uniform float distortionStrength;
 #endif
 #ifdef GRADIENT_MAP
 uniform sampler2D gradientMap;
 uniform vec2 gradientMapRange;
+uniform vec4 gradientMapChannel;
 #endif
 #ifdef EROSION
-uniform vec4 erosionParams;
+uniform vec2 erosionParams;
 uniform vec3 erosionEdgeColor;
 #ifdef EROSION_MASK
 uniform sampler2D erosionMask;
+uniform vec4 erosionMaskTransform;
 #endif
 
 vec4 quarksErode(vec4 color, float level, float mask) {
@@ -65,11 +87,22 @@ vec4 quarksErode(vec4 color, float level, float mask) {
 export function surfaceColorGLSL(tileBlend: boolean): string {
     return /* glsl */ `
     vec4 baseColor = vColor;
-#ifdef UV_SCROLL
-    vec2 mapUV = vUV + uvScrollOffset;
+#if defined(MAP_TRANSFORM) && defined(MAP_UV1)
+    vec2 mapUV = vUV1 * mapTransform.xy + mapTransform.zw;
+#elif defined(MAP_TRANSFORM)
+    vec2 mapUV = vUV * mapTransform.xy + mapTransform.zw;
 #else
     vec2 mapUV = vUV;
 #endif
+#ifdef UV_DISTORTION
+    #ifdef UV_DISTORTION_UV1
+        vec2 distortionUV = vUV1;
+    #else
+        vec2 distortionUV = vUV;
+    #endif
+    vec2 distortion = (texture2D(distortionMap, distortionUV * distortionTransform.xy + distortionTransform.zw).rg - 0.5) * 2.0 * distortionStrength;
+    mapUV += distortion;
+#endif
 #ifdef EROSION
     float erosionLevel = baseColor.a;
     baseColor.a = 1.0;
@@ -80,18 +113,27 @@ export function surfaceColorGLSL(tileBlend: boolean): string {
     ${
         tileBlend
             ? `#ifdef TILE_BLEND
-    #ifdef UV_SCROLL
-        vec4 texColor2 = texture2D(map, vUV2 + uvScrollOffset);
+    #if defined(MAP_TRANSFORM) && defined(MAP_UV1)
+        vec2 mapUV2 = mapUV;
     #else
-        vec4 texColor2 = texture2D(map, vUV2);
+        #ifdef MAP_TRANSFORM
+            vec2 mapUV2 = vUV2 * mapTransform.xy + mapTransform.zw;
+        #else
+            vec2 mapUV2 = vUV2;
+        #endif
+        #ifdef UV_DISTORTION
+            mapUV2 += distortion;
+        #endif
     #endif
+        vec4 texColor2 = texture2D(map, mapUV2);
         texColor = mix(texColor, texColor2, vTileBlend);
     #endif`
             : ''
     }
     #ifdef GRADIENT_MAP
-        vec4 ramp = texture2D(gradientMap, vec2(mix(gradientMapRange.x, gradientMapRange.y, clamp(texColor.r, 0.0, 1.0)), 0.5));
-        texColor = vec4(ramp.rgb, ramp.a * texColor.a);
+        float rampAt = clamp(dot(texColor, gradientMapChannel), 0.0, 1.0);
+        vec4 ramp = texture2D(gradientMap, vec2(mix(gradientMapRange.x, gradientMapRange.y, rampAt), 0.5));
+        texColor = vec4(ramp.rgb, ramp.a * mix(texColor.a, 1.0, gradientMapChannel.a));
     #endif
     #ifdef EROSION
         erosionMaskValue = texColor.a;
@@ -100,7 +142,12 @@ export function surfaceColorGLSL(tileBlend: boolean): string {
 #endif
 #ifdef EROSION
     #ifdef EROSION_MASK
-        erosionMaskValue = texture2D(erosionMask, vUV + erosionParams.zw).r;
+        #ifdef EROSION_MASK_UV1
+            vec2 erosionUV = vUV1;
+        #else
+            vec2 erosionUV = vUV;
+        #endif
+        erosionMaskValue = texture2D(erosionMask, erosionUV * erosionMaskTransform.xy + erosionMaskTransform.zw).r;
     #endif
     baseColor = quarksErode(baseColor, erosionLevel, erosionMaskValue);
 #endif
@@ -109,20 +156,28 @@ export function surfaceColorGLSL(tileBlend: boolean): string {
 
 /** Fragment-side declarations, WGSL. */
 export const surfaceFragmentDeclarationWGSL = /* wgsl */ `
-#ifdef UV_SCROLL
-uniform uvScrollOffset: vec2f;
+#ifdef MAP_TRANSFORM
+uniform mapTransform: vec4f;
+#endif
+#ifdef UV_DISTORTION
+var distortionMapSampler: sampler;
+var distortionMap: texture_2d<f32>;
+uniform distortionTransform: vec4f;
+uniform distortionStrength: f32;
 #endif
 #ifdef GRADIENT_MAP
 var gradientMapSampler: sampler;
 var gradientMap: texture_2d<f32>;
 uniform gradientMapRange: vec2f;
+uniform gradientMapChannel: vec4f;
 #endif
 #ifdef EROSION
-uniform erosionParams: vec4f;
+uniform erosionParams: vec2f;
 uniform erosionEdgeColor: vec3f;
 #ifdef EROSION_MASK
 var erosionMaskSampler: sampler;
 var erosionMask: texture_2d<f32>;
+uniform erosionMaskTransform: vec4f;
 #endif
 
 fn quarksErode(colorIn: vec4f, level: f32, mask: f32) -> vec4f {
@@ -145,10 +200,21 @@ fn quarksErode(colorIn: vec4f, level: f32, mask: f32) -> vec4f {
 export function surfaceColorWGSL(tileBlend: boolean): string {
     return /* wgsl */ `
     var baseColor = fragmentInputs.vColor;
-#ifdef UV_SCROLL
-    let mapUV = fragmentInputs.vUV + uniforms.uvScrollOffset;
+#if defined(MAP_TRANSFORM) && defined(MAP_UV1)
+    var mapUV = fragmentInputs.vUV1 * uniforms.mapTransform.xy + uniforms.mapTransform.zw;
+#elif defined(MAP_TRANSFORM)
+    var mapUV = fragmentInputs.vUV * uniforms.mapTransform.xy + uniforms.mapTransform.zw;
 #else
-    let mapUV = fragmentInputs.vUV;
+    var mapUV = fragmentInputs.vUV;
+#endif
+#ifdef UV_DISTORTION
+    #ifdef UV_DISTORTION_UV1
+        let distortionUV = fragmentInputs.vUV1;
+    #else
+        let distortionUV = fragmentInputs.vUV;
+    #endif
+    let distortion = (textureSample(distortionMap, distortionMapSampler, distortionUV * uniforms.distortionTransform.xy + uniforms.distortionTransform.zw).rg - 0.5) * 2.0 * uniforms.distortionStrength;
+    mapUV += distortion;
 #endif
 #ifdef EROSION
     let erosionLevel = baseColor.a;
@@ -160,18 +226,27 @@ export function surfaceColorWGSL(tileBlend: boolean): string {
     ${
         tileBlend
             ? `#ifdef TILE_BLEND
-    #ifdef UV_SCROLL
-        let texColor2 = textureSample(map, mapSampler, fragmentInputs.vUV2 + uniforms.uvScrollOffset);
+    #if defined(MAP_TRANSFORM) && defined(MAP_UV1)
+        let mapUV2 = mapUV;
     #else
-        let texColor2 = textureSample(map, mapSampler, fragmentInputs.vUV2);
+        #ifdef MAP_TRANSFORM
+            var mapUV2 = fragmentInputs.vUV2 * uniforms.mapTransform.xy + uniforms.mapTransform.zw;
+        #else
+            var mapUV2 = fragmentInputs.vUV2;
+        #endif
+        #ifdef UV_DISTORTION
+            mapUV2 += distortion;
+        #endif
     #endif
+        let texColor2 = textureSample(map, mapSampler, mapUV2);
         texColor = mix(texColor, texColor2, fragmentInputs.vTileBlend);
     #endif`
             : ''
     }
     #ifdef GRADIENT_MAP
-        let ramp = textureSample(gradientMap, gradientMapSampler, vec2f(mix(uniforms.gradientMapRange.x, uniforms.gradientMapRange.y, clamp(texColor.r, 0.0, 1.0)), 0.5));
-        texColor = vec4f(ramp.rgb, ramp.a * texColor.a);
+        let rampAt = clamp(dot(texColor, uniforms.gradientMapChannel), 0.0, 1.0);
+        let ramp = textureSample(gradientMap, gradientMapSampler, vec2f(mix(uniforms.gradientMapRange.x, uniforms.gradientMapRange.y, rampAt), 0.5));
+        texColor = vec4f(ramp.rgb, ramp.a * mix(texColor.a, 1.0, uniforms.gradientMapChannel.a));
     #endif
     #ifdef EROSION
         erosionMaskValue = texColor.a;
@@ -180,7 +255,12 @@ export function surfaceColorWGSL(tileBlend: boolean): string {
 #endif
 #ifdef EROSION
     #ifdef EROSION_MASK
-        erosionMaskValue = textureSample(erosionMask, erosionMaskSampler, fragmentInputs.vUV + uniforms.erosionParams.zw).r;
+        #ifdef EROSION_MASK_UV1
+            let erosionUV = fragmentInputs.vUV1;
+        #else
+            let erosionUV = fragmentInputs.vUV;
+        #endif
+        erosionMaskValue = textureSample(erosionMask, erosionMaskSampler, erosionUV * uniforms.erosionMaskTransform.xy + uniforms.erosionMaskTransform.zw).r;
     #endif
     baseColor = quarksErode(baseColor, erosionLevel, erosionMaskValue);
 #endif

package/src/shaders/local_particle_physics_vert.glsl.ts

@@ -21,6 +21,14 @@ uniform float tileCountY;
 
 varying vec2 vUV;
 varying vec4 vColor;
+#ifdef UV1
+#ifdef MESH_UV2
+// The mesh's second UV set.
+attribute vec2 uv2;
+#endif
+// UV channel 1: the mesh's second UV set, or its first when it has none.
+varying vec2 vUV1;
+#endif
 varying vec3 vNormal;
 varying vec3 vWorldPos;
 
@@ -78,6 +86,13 @@ ${fogVertexGLSL('viewPos.xyz')}
     vUV = uv;
 #endif
 
+#ifdef UV1
+#ifdef MESH_UV2
+    vUV1 = uv2;
+#else
+    vUV1 = uv;
+#endif
+#endif
     vColor = color;
 }
 `;

package/src/shaders/local_particle_physics_vert.wgsl.ts

@@ -21,6 +21,14 @@ uniform tileCountY: f32;
 
 varying vUV: vec2f;
 varying vColor: vec4f;
+#ifdef UV1
+#ifdef MESH_UV2
+// The mesh's second UV set.
+attribute uv2: vec2f;
+#endif
+// UV channel 1: the mesh's second UV set, or its first when it has none.
+varying vUV1: vec2f;
+#endif
 varying vNormal: vec3f;
 varying vWorldPos: vec3f;
 
@@ -80,6 +88,13 @@ ${fogVertexWGSL('viewPos.xyz')}
     vertexOutputs.vUV = vertexInputs.uv;
 #endif
 
+#ifdef UV1
+#ifdef MESH_UV2
+    vertexOutputs.vUV1 = vertexInputs.uv2;
+#else
+    vertexOutputs.vUV1 = vertexInputs.uv;
+#endif
+#endif
     vertexOutputs.vColor = vertexInputs.color;
 }
 `;

package/src/shaders/particle_frag.glsl.ts

@@ -4,6 +4,9 @@ import {surfaceColorGLSL, surfaceFragmentDeclarationGLSL} from './chunks/surface
 export default /* glsl */ `
 varying vec2 vUV;
 varying vec4 vColor;
+#ifdef UV1
+varying vec2 vUV1;
+#endif
 
 #ifdef TILE_BLEND
 varying vec2 vUV2;

package/src/shaders/particle_frag.wgsl.ts

@@ -4,6 +4,9 @@ import {surfaceColorWGSL, surfaceFragmentDeclarationWGSL} from './chunks/surface
 export default /* wgsl */ `
 varying vUV: vec2f;
 varying vColor: vec4f;
+#ifdef UV1
+varying vUV1: vec2f;
+#endif
 
 #ifdef TILE_BLEND
 varying vUV2: vec2f;

package/src/shaders/particle_physics_frag.glsl.ts

@@ -4,6 +4,9 @@ import {surfaceColorGLSL, surfaceFragmentDeclarationGLSL} from './chunks/surface
 export default /* glsl */ `
 varying vec2 vUV;
 varying vec4 vColor;
+#ifdef UV1
+varying vec2 vUV1;
+#endif
 varying vec3 vNormal;
 varying vec3 vWorldPos;
 
@@ -118,11 +121,14 @@ ${surfaceColorGLSL(true)}
 #ifdef MESH_RIM
     // Fresnel: strongest where the surface turns away from the camera.
     vec3 V = normalize(eyePosition - vWorldPos);
-    float rim = pow(1.0 - abs(dot(N, V)), rimParams.x) * rimParams.y;
-    #ifdef MESH_RIM_MIX
-    color = mix(color, rimColor, clamp(rim, 0.0, 1.0));
+    float edgeTerm = pow(1.0 - abs(dot(N, V)), rimParams.x);
+    #if defined(MESH_RIM_FADE)
+    // Faces turned to the camera fade by the strength; edges stay.
+    baseColor.a *= clamp(1.0 - rimParams.y * (1.0 - edgeTerm), 0.0, 1.0);
+    #elif defined(MESH_RIM_MIX)
+    color = mix(color, rimColor, clamp(edgeTerm * rimParams.y, 0.0, 1.0));
     #else
-    color += rimColor * rim;
+    color += rimColor * edgeTerm * rimParams.y;
     #endif
 #endif
 

package/src/shaders/particle_physics_frag.wgsl.ts

@@ -4,6 +4,9 @@ import {surfaceColorWGSL, surfaceFragmentDeclarationWGSL} from './chunks/surface
 export default /* wgsl */ `
 varying vUV: vec2f;
 varying vColor: vec4f;
+#ifdef UV1
+varying vUV1: vec2f;
+#endif
 varying vNormal: vec3f;
 varying vWorldPos: vec3f;
 
@@ -119,11 +122,14 @@ ${surfaceColorWGSL(true)}
 #ifdef MESH_RIM
     // Fresnel: strongest where the surface turns away from the camera.
     let V = normalize(uniforms.eyePosition - fragmentInputs.vWorldPos);
-    let rimTerm = pow(1.0 - abs(dot(N, V)), uniforms.rimParams.x) * uniforms.rimParams.y;
-    #ifdef MESH_RIM_MIX
-    color = mix(color, uniforms.rimColor, clamp(rimTerm, 0.0, 1.0));
+    let edgeTerm = pow(1.0 - abs(dot(N, V)), uniforms.rimParams.x);
+    #if defined(MESH_RIM_FADE)
+    // Faces turned to the camera fade by the strength; edges stay.
+    baseColor.a *= clamp(1.0 - uniforms.rimParams.y * (1.0 - edgeTerm), 0.0, 1.0);
+    #elif defined(MESH_RIM_MIX)
+    color = mix(color, uniforms.rimColor, clamp(edgeTerm * uniforms.rimParams.y, 0.0, 1.0));
     #else
-    color += uniforms.rimColor * rimTerm;
+    color += uniforms.rimColor * edgeTerm * uniforms.rimParams.y;
     #endif
 #endif
 

package/src/shaders/particle_vert.glsl.ts

@@ -31,6 +31,10 @@ uniform vec3 pivot;
 // Varyings
 varying vec2 vUV;
 varying vec4 vColor;
+#ifdef UV1
+// The particle's own UV, never moved by the sheet (UV channel 1).
+varying vec2 vUV1;
+#endif
 #ifdef TILE_BLEND
 varying vec2 vUV2;
 varying float vTileBlend;
@@ -119,6 +123,9 @@ ${fogVertexGLSL('mvPosition.xyz')}
         vUV = uv;
     #endif
 
+#ifdef UV1
+    vUV1 = uv;
+#endif
     vColor = color;
 }
 `;

package/src/shaders/particle_vert.wgsl.ts

@@ -30,6 +30,10 @@ uniform pivot: vec3f;
 // Varyings
 varying vUV: vec2f;
 varying vColor: vec4f;
+#ifdef UV1
+// The particle's own UV, never moved by the sheet (UV channel 1).
+varying vUV1: vec2f;
+#endif
 #ifdef TILE_BLEND
 varying vUV2: vec2f;
 varying vTileBlend: f32;
@@ -121,6 +125,9 @@ ${fogVertexWGSL('mvPosition.xyz')}
         vertexOutputs.vUV = vertexInputs.uv;
     #endif
 
+#ifdef UV1
+    vertexOutputs.vUV1 = vertexInputs.uv;
+#endif
     vertexOutputs.vColor = vertexInputs.color;
 }
 `;

package/src/shaders/stretched_bb_particle_vert.glsl.ts

@@ -32,6 +32,10 @@ uniform vec3 pivot;
 // Varyings
 varying vec2 vUV;
 varying vec4 vColor;
+#ifdef UV1
+// The particle's own UV, never moved by the sheet (UV channel 1).
+varying vec2 vUV1;
+#endif
 #ifdef TILE_BLEND
 varying vec2 vUV2;
 varying float vTileBlend;
@@ -45,6 +49,7 @@ varying float linearDepth;
 // Smallest and largest size a particle may have on screen, as fractions of the viewport height.
 uniform vec2 sizeLimits;
 #endif
+
 ${fogVertexDeclarationGLSL}
 void main() {
     float lengthFactor = velocity.w;
@@ -52,15 +57,6 @@ void main() {
     // extent and mirrors its texture instead (see quadUV below).
     float avgSize = (abs(size.x) + abs(size.y)) * 0.5;
     vec4 mvPosition = view * world * vec4(offset, 1.0);
-#ifdef SIZE_LIMITS
-    // The streak's width on screen as a fraction of the viewport height, held
-    // between the limits; a perspective projection divides by the view depth.
-    float limitDepth = abs(projection[2][3]) > 0.0 ? abs(mvPosition.z) : 1.0;
-    float screenSize = avgSize * projection[1][1] / (2.0 * limitDepth);
-    if (screenSize > 0.0) {
-        avgSize *= clamp(screenSize, sizeLimits.x, sizeLimits.y) / screenSize;
-    }
-#endif
     vec3 viewVelocity = mat3(view * world) * velocity.xyz;
     float vlength = length(viewVelocity);
     // Stretch direction is the velocity direction; only a genuinely motionless particle has none.
@@ -73,6 +69,15 @@ void main() {
     vec3 side = dot(sideRaw, sideRaw) > 1e-12 ? normalize(sideRaw) : vec3(1.0, 0.0, 0.0);
 #else
     vec3 side = normalize(cross(mvPosition.xyz, vdir));
+#endif
+#ifdef SIZE_LIMITS
+    // The streak's width on screen as a fraction of the viewport height, held
+    // between the limits; a perspective projection divides by the view depth.
+    float limitDepth = abs(projection[2][3]) > 0.0 ? abs(mvPosition.z) : 1.0;
+    float screenSize = avgSize * projection[1][1] / (2.0 * limitDepth);
+    if (screenSize > 0.0) {
+        avgSize *= clamp(screenSize, sizeLimits.x, sizeLimits.y) / screenSize;
+    }
 #endif
     mvPosition.xyz += position.y * side * avgSize;
 #ifdef BEAM
@@ -113,6 +118,9 @@ ${fogVertexGLSL('mvPosition.xyz')}
         vUV = quadUV;
     #endif
 
+#ifdef UV1
+    vUV1 = quadUV;
+#endif
     vColor = color;
 }
 `;

package/src/shaders/stretched_bb_particle_vert.wgsl.ts

@@ -32,6 +32,10 @@ uniform pivot: vec3f;
 // Varyings
 varying vUV: vec2f;
 varying vColor: vec4f;
+#ifdef UV1
+// The particle's own UV, never moved by the sheet (UV channel 1).
+varying vUV1: vec2f;
+#endif
 #ifdef TILE_BLEND
 varying vUV2: vec2f;
 varying vTileBlend: f32;
@@ -45,6 +49,7 @@ varying linearDepth: f32;
 // Smallest and largest size a particle may have on screen, as fractions of the viewport height.
 uniform sizeLimits: vec2f;
 #endif
+
 ${fogVertexDeclarationWGSL}
 @vertex
 fn main(input: VertexInputs) -> FragmentInputs {
@@ -53,15 +58,6 @@ fn main(input: VertexInputs) -> FragmentInputs {
     // extent and mirrors its texture instead (see quadUV below).
     var avgSize = (abs(vertexInputs.size.x) + abs(vertexInputs.size.y)) * 0.5;
     var mvPosition = uniforms.view * uniforms.world * vec4f(vertexInputs.offset, 1.0);
-#ifdef SIZE_LIMITS
-    // The streak's width on screen as a fraction of the viewport height, held
-    // between the limits; a perspective projection divides by the view depth.
-    let limitDepth = select(1.0, abs(mvPosition.z), abs(uniforms.projection[2][3]) > 0.0);
-    let screenSize = avgSize * uniforms.projection[1][1] / (2.0 * limitDepth);
-    if (screenSize > 0.0) {
-        avgSize *= clamp(screenSize, uniforms.sizeLimits.x, uniforms.sizeLimits.y) / screenSize;
-    }
-#endif
     let viewWorld = uniforms.view * uniforms.world;
     let viewWorld3 = mat3x3f(viewWorld[0].xyz, viewWorld[1].xyz, viewWorld[2].xyz);
     let viewVelocity = viewWorld3 * vertexInputs.velocity.xyz;
@@ -82,6 +78,15 @@ fn main(input: VertexInputs) -> FragmentInputs {
     }
 #else
     let side = normalize(cross(mvPosition.xyz, vdir));
+#endif
+#ifdef SIZE_LIMITS
+    // The streak's width on screen as a fraction of the viewport height, held
+    // between the limits; a perspective projection divides by the view depth.
+    let limitDepth = select(1.0, abs(mvPosition.z), abs(uniforms.projection[2][3]) > 0.0);
+    let screenSize = avgSize * uniforms.projection[1][1] / (2.0 * limitDepth);
+    if (screenSize > 0.0) {
+        avgSize *= clamp(screenSize, uniforms.sizeLimits.x, uniforms.sizeLimits.y) / screenSize;
+    }
 #endif
     let widthOffset = vertexInputs.position.y * side * avgSize;
     // Equivalent to viewVelocity * (1.0 + lengthFactor / vlength) for moving particles, but the
@@ -128,6 +133,9 @@ ${fogVertexWGSL('mvPosition.xyz')}
         vertexOutputs.vUV = quadUV;
     #endif
 
+#ifdef UV1
+    vertexOutputs.vUV1 = quadUV;
+#endif
     vertexOutputs.vColor = vertexInputs.color;
 }
 `;

package/src/shaders/trail_frag.glsl.ts

@@ -4,6 +4,9 @@ import {surfaceColorGLSL, surfaceFragmentDeclarationGLSL} from './chunks/surface
 export default /* glsl */ `
 varying vec2 vUV;
 varying vec4 vColor;
+#ifdef UV1
+varying vec2 vUV1;
+#endif
 
 #ifdef USE_MAP
 uniform sampler2D map;

package/src/shaders/trail_frag.wgsl.ts

@@ -4,6 +4,9 @@ import {surfaceColorWGSL, surfaceFragmentDeclarationWGSL} from './chunks/surface
 export default /* wgsl */ `
 varying vUV: vec2f;
 varying vColor: vec4f;
+#ifdef UV1
+varying vUV1: vec2f;
+#endif
 
 #ifdef USE_MAP
 var mapSampler: sampler;

package/src/shaders/trail_vert.glsl.ts

@@ -17,6 +17,11 @@ uniform float sizeAttenuation;
 
 varying vec2 vUV;
 varying vec4 vColor;
+#ifdef UV1
+// Along the trail and across it, without the sheet's cell (UV channel 1).
+attribute vec2 uv2;
+varying vec2 vUV1;
+#endif
 
 vec2 fix(vec4 i, float aspect) {
     vec2 res = i.xy / i.w;
@@ -57,6 +62,9 @@ void main() {
     gl_Position = finalPosition;
 ${fogVertexGLSL('(view * vec4(position, 1.0)).xyz')}
     vUV = uv;
+#ifdef UV1
+    vUV1 = uv2;
+#endif
     vColor = color;
 }
 `;

package/src/shaders/trail_vert.wgsl.ts

@@ -17,6 +17,11 @@ uniform sizeAttenuation: f32;
 
 varying vUV: vec2f;
 varying vColor: vec4f;
+#ifdef UV1
+// Along the trail and across it, without the sheet's cell (UV channel 1).
+attribute uv2: vec2f;
+varying vUV1: vec2f;
+#endif
 
 fn fix(i: vec4f, aspect: f32) -> vec2f {
     var res = i.xy / i.w;
@@ -62,6 +67,9 @@ fn main(input: VertexInputs) -> FragmentInputs {
     vertexOutputs.position = finalPosition;
 ${fogVertexWGSL('(uniforms.view * vec4f(vertexInputs.position, 1.0)).xyz')}
     vertexOutputs.vUV = vertexInputs.uv;
+#ifdef UV1
+    vertexOutputs.vUV1 = vertexInputs.uv2;
+#endif
     vertexOutputs.vColor = vertexInputs.color;
 }
 `;