@luma.gl/effects 9.3.0-alpha.6 → 9.3.0-alpha.8

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 (72) hide show
  1. package/dist/dist.dev.js +983 -223
  2. package/dist/dist.min.js +5 -5
  3. package/dist/index.cjs +340 -50
  4. package/dist/index.cjs.map +3 -3
  5. package/dist/passes/postprocessing/fxaa/fxaa.d.ts +1 -0
  6. package/dist/passes/postprocessing/fxaa/fxaa.d.ts.map +1 -1
  7. package/dist/passes/postprocessing/fxaa/fxaa.js +287 -0
  8. package/dist/passes/postprocessing/fxaa/fxaa.js.map +1 -1
  9. package/dist/passes/postprocessing/image-adjust-filters/brightnesscontrast.d.ts +1 -1
  10. package/dist/passes/postprocessing/image-adjust-filters/brightnesscontrast.d.ts.map +1 -1
  11. package/dist/passes/postprocessing/image-adjust-filters/brightnesscontrast.js +5 -7
  12. package/dist/passes/postprocessing/image-adjust-filters/brightnesscontrast.js.map +1 -1
  13. package/dist/passes/postprocessing/image-adjust-filters/denoise.d.ts +2 -2
  14. package/dist/passes/postprocessing/image-adjust-filters/denoise.js +4 -4
  15. package/dist/passes/postprocessing/image-adjust-filters/huesaturation.d.ts +1 -1
  16. package/dist/passes/postprocessing/image-adjust-filters/huesaturation.d.ts.map +1 -1
  17. package/dist/passes/postprocessing/image-adjust-filters/huesaturation.js +9 -10
  18. package/dist/passes/postprocessing/image-adjust-filters/huesaturation.js.map +1 -1
  19. package/dist/passes/postprocessing/image-adjust-filters/noise.d.ts +1 -1
  20. package/dist/passes/postprocessing/image-adjust-filters/noise.js +1 -1
  21. package/dist/passes/postprocessing/image-adjust-filters/sepia.d.ts +1 -1
  22. package/dist/passes/postprocessing/image-adjust-filters/sepia.js +1 -1
  23. package/dist/passes/postprocessing/image-adjust-filters/vibrance.d.ts +1 -1
  24. package/dist/passes/postprocessing/image-adjust-filters/vibrance.d.ts.map +1 -1
  25. package/dist/passes/postprocessing/image-adjust-filters/vibrance.js +3 -4
  26. package/dist/passes/postprocessing/image-adjust-filters/vibrance.js.map +1 -1
  27. package/dist/passes/postprocessing/image-adjust-filters/vignette.d.ts +1 -1
  28. package/dist/passes/postprocessing/image-adjust-filters/vignette.js +1 -1
  29. package/dist/passes/postprocessing/image-blur-filters/tiltshift.d.ts +1 -1
  30. package/dist/passes/postprocessing/image-blur-filters/tiltshift.js +1 -1
  31. package/dist/passes/postprocessing/image-blur-filters/triangleblur.d.ts +1 -1
  32. package/dist/passes/postprocessing/image-blur-filters/triangleblur.js +6 -6
  33. package/dist/passes/postprocessing/image-blur-filters/zoomblur.d.ts +1 -1
  34. package/dist/passes/postprocessing/image-blur-filters/zoomblur.js +1 -1
  35. package/dist/passes/postprocessing/image-fun-filters/colorhalftone.d.ts +1 -1
  36. package/dist/passes/postprocessing/image-fun-filters/colorhalftone.js +1 -1
  37. package/dist/passes/postprocessing/image-fun-filters/dotscreen.d.ts +1 -1
  38. package/dist/passes/postprocessing/image-fun-filters/dotscreen.js +1 -1
  39. package/dist/passes/postprocessing/image-fun-filters/edgework.d.ts +1 -1
  40. package/dist/passes/postprocessing/image-fun-filters/edgework.js +1 -1
  41. package/dist/passes/postprocessing/image-fun-filters/hexagonalpixelate.d.ts +1 -1
  42. package/dist/passes/postprocessing/image-fun-filters/hexagonalpixelate.js +1 -1
  43. package/dist/passes/postprocessing/image-fun-filters/ink.d.ts +1 -1
  44. package/dist/passes/postprocessing/image-fun-filters/ink.js +1 -1
  45. package/dist/passes/postprocessing/image-fun-filters/magnify.d.ts +1 -1
  46. package/dist/passes/postprocessing/image-fun-filters/magnify.d.ts.map +1 -1
  47. package/dist/passes/postprocessing/image-fun-filters/magnify.js +8 -3
  48. package/dist/passes/postprocessing/image-fun-filters/magnify.js.map +1 -1
  49. package/dist/passes/postprocessing/image-warp-filters/bulgepinch.d.ts +2 -2
  50. package/dist/passes/postprocessing/image-warp-filters/bulgepinch.js +3 -3
  51. package/dist/passes/postprocessing/image-warp-filters/swirl.d.ts +2 -2
  52. package/dist/passes/postprocessing/image-warp-filters/swirl.js +3 -3
  53. package/package.json +3 -3
  54. package/src/passes/postprocessing/fxaa/fxaa.ts +288 -0
  55. package/src/passes/postprocessing/image-adjust-filters/brightnesscontrast.ts +5 -7
  56. package/src/passes/postprocessing/image-adjust-filters/denoise.ts +4 -4
  57. package/src/passes/postprocessing/image-adjust-filters/huesaturation.ts +9 -10
  58. package/src/passes/postprocessing/image-adjust-filters/noise.ts +1 -1
  59. package/src/passes/postprocessing/image-adjust-filters/sepia.ts +1 -1
  60. package/src/passes/postprocessing/image-adjust-filters/vibrance.ts +3 -4
  61. package/src/passes/postprocessing/image-adjust-filters/vignette.ts +1 -1
  62. package/src/passes/postprocessing/image-blur-filters/tiltshift.ts +1 -1
  63. package/src/passes/postprocessing/image-blur-filters/triangleblur.ts +6 -6
  64. package/src/passes/postprocessing/image-blur-filters/zoomblur.ts +1 -1
  65. package/src/passes/postprocessing/image-fun-filters/colorhalftone.ts +1 -1
  66. package/src/passes/postprocessing/image-fun-filters/dotscreen.ts +1 -1
  67. package/src/passes/postprocessing/image-fun-filters/edgework.ts +1 -1
  68. package/src/passes/postprocessing/image-fun-filters/hexagonalpixelate.ts +1 -1
  69. package/src/passes/postprocessing/image-fun-filters/ink.ts +1 -1
  70. package/src/passes/postprocessing/image-fun-filters/magnify.ts +8 -3
  71. package/src/passes/postprocessing/image-warp-filters/bulgepinch.ts +3 -3
  72. package/src/passes/postprocessing/image-warp-filters/swirl.ts +3 -3
package/dist/index.cjs CHANGED
@@ -51,18 +51,16 @@ var source = (
51
51
  contrast: f32
52
52
  };
53
53
 
54
- // Binding 0:1 is reserved for shader passes
55
- @group(0) @binding(1) var<uniform> brightnessContrast : brightnessContrastUniforms;
54
+ @group(0) @binding(auto) var<uniform> brightnessContrast : brightnessContrastUniforms;
56
55
 
57
56
  fn brightnessContrast_filterColor_ext(color: vec4f, texSize: vec2<f32>, texCoords: vec2<f32>) -> vec4f {
58
- var result = color;
59
- result.rgb += vec3f(brightnessContrast.brightness);
57
+ var resultRgb = color.rgb + vec3f(brightnessContrast.brightness);
60
58
  if (brightnessContrast.contrast > 0.0) {
61
- result.rgb = (result.rgb - vec3f(0.5)) / (1.0 - brightnessContrast.contrast) + vec3f(0.5);
59
+ resultRgb = (resultRgb - vec3f(0.5)) / (1.0 - brightnessContrast.contrast) + vec3f(0.5);
62
60
  } else {
63
- result.rgb = (result.rgb - vec3f(0.5)) * (1.0 + brightnessContrast.contrast) + vec3f(0.5);
61
+ resultRgb = (resultRgb - vec3f(0.5)) * (1.0 + brightnessContrast.contrast) + vec3f(0.5);
64
62
  }
65
- return result;
63
+ return vec4f(resultRgb, color.a);
66
64
  }
67
65
  `
68
66
  );
@@ -115,7 +113,7 @@ var source2 = (
115
113
  strength: f32,
116
114
  };
117
115
 
118
- @group(0) @binding(1) var<uniform> denoise: denoiseUniforms;
116
+ @group(0) @binding(auto) var<uniform> denoise: denoiseUniforms;
119
117
 
120
118
  fn denoise_sampleColor(
121
119
  sourceTexture: texture_2d<f32>,
@@ -150,12 +148,12 @@ fn denoise_sampleColor(
150
148
  );
151
149
  var fs2 = (
152
150
  /* glsl */
153
- `uniform dedenoiseUniforms {
151
+ `uniform denoiseUniforms {
154
152
  float strength;
155
153
  } denoise;
156
154
 
157
- vec4 dedenoise_sampleColor(sampler2D source, vec2 texSize, vec2 texCoord) {
158
- float adjustedExponent = 3. + 200. * pow(1. - noise.strength, 4.);
155
+ vec4 denoise_sampleColor(sampler2D source, vec2 texSize, vec2 texCoord) {
156
+ float adjustedExponent = 3. + 200. * pow(1. - denoise.strength, 4.);
159
157
 
160
158
  vec4 center = texture(source, texCoord);
161
159
  vec4 color = vec4(0.0);
@@ -198,7 +196,7 @@ var source3 = (
198
196
  saturation: f32,
199
197
  };
200
198
 
201
- @group(0) @binding(1) var<uniform> hueSaturation: hueSaturationUniforms;
199
+ @group(0) @binding(auto) var<uniform> hueSaturation: hueSaturationUniforms;
202
200
 
203
201
  fn hueSaturation_filterColor(color: vec4f) -> vec4f {
204
202
  let angle = hueSaturation.hue * 3.14159265;
@@ -206,21 +204,20 @@ fn hueSaturation_filterColor(color: vec4f) -> vec4f {
206
204
  let c = cos(angle);
207
205
  let weights = (vec3f(2.0 * c, -sqrt(3.0) * s - c, sqrt(3.0) * s - c) + vec3f(1.0)) / 3.0;
208
206
 
209
- var result = color;
210
- result.rgb = vec3f(
211
- dot(result.rgb, weights.xyz),
212
- dot(result.rgb, weights.zxy),
213
- dot(result.rgb, weights.yzx)
207
+ var resultRgb = vec3f(
208
+ dot(color.rgb, weights.xyz),
209
+ dot(color.rgb, weights.zxy),
210
+ dot(color.rgb, weights.yzx)
214
211
  );
215
212
 
216
- let average = (result.r + result.g + result.b) / 3.0;
213
+ let average = (resultRgb.r + resultRgb.g + resultRgb.b) / 3.0;
217
214
  if (hueSaturation.saturation > 0.0) {
218
- result.rgb += (vec3f(average) - result.rgb) * (1.0 - 1.0 / (1.001 - hueSaturation.saturation));
215
+ resultRgb += (vec3f(average) - resultRgb) * (1.0 - 1.0 / (1.001 - hueSaturation.saturation));
219
216
  } else {
220
- result.rgb += (vec3f(average) - result.rgb) * (-hueSaturation.saturation);
217
+ resultRgb += (vec3f(average) - resultRgb) * (-hueSaturation.saturation);
221
218
  }
222
219
 
223
- return result;
220
+ return vec4f(resultRgb, color.a);
224
221
  }
225
222
 
226
223
  fn hueSaturation_filterColor_ext(color: vec4f, texSize: vec2f, texCoord: vec2f) -> vec4f {
@@ -286,7 +283,7 @@ var source4 = (
286
283
  amount: f32,
287
284
  };
288
285
 
289
- @group(0) @binding(1) var<uniform> noise: noiseUniforms;
286
+ @group(0) @binding(auto) var<uniform> noise: noiseUniforms;
290
287
 
291
288
  fn rand(co: vec2f) -> f32 {
292
289
  return fract(sin(dot(co.xy, vec2f(12.9898, 78.233))) * 43758.547);
@@ -343,7 +340,7 @@ var source5 = (
343
340
  amount: f32,
344
341
  };
345
342
 
346
- @group(0) @binding(1) var<uniform> sepia: sepiaUniforms;
343
+ @group(0) @binding(auto) var<uniform> sepia: sepiaUniforms;
347
344
 
348
345
  fn sepia_filterColor(color: vec4f) -> vec4f {
349
346
  let r = color.r;
@@ -410,15 +407,14 @@ var source6 = (
410
407
  amount: f32,
411
408
  };
412
409
 
413
- @group(0) @binding(1) var<uniform> vibrance: vibranceUniforms;
410
+ @group(0) @binding(auto) var<uniform> vibrance: vibranceUniforms;
414
411
 
415
412
  fn vibrance_filterColor(color: vec4f) -> vec4f {
416
413
  let average = (color.r + color.g + color.b) / 3.0;
417
414
  let mx = max(color.r, max(color.g, color.b));
418
415
  let amt = (mx - average) * (-vibrance.amount * 3.0);
419
- var result = color;
420
- result.rgb = mix(result.rgb, vec3f(mx), amt);
421
- return result;
416
+ let resultRgb = mix(color.rgb, vec3f(mx), amt);
417
+ return vec4f(resultRgb, color.a);
422
418
  }
423
419
 
424
420
  fn vibrance_filterColor_ext(color: vec4f, texSize: vec2f, texCoord: vec2f) -> vec4f {
@@ -468,7 +464,7 @@ var source7 = (
468
464
  amount: f32,
469
465
  };
470
466
 
471
- @group(0) @binding(1) var<uniform> vignette: vignetteUniforms;
467
+ @group(0) @binding(auto) var<uniform> vignette: vignetteUniforms;
472
468
 
473
469
  fn vignette_filterColor_ext(color: vec4f, texSize: vec2f, texCoord: vec2f) -> vec4f {
474
470
  let dist = distance(texCoord, vec2f(0.5, 0.5));
@@ -528,7 +524,7 @@ var source8 = (
528
524
  invert: u32,
529
525
  };
530
526
 
531
- @group(0) @binding(1) var<uniform> tiltShift: tiltShiftUniforms;
527
+ @group(0) @binding(auto) var<uniform> tiltShift: tiltShiftUniforms;
532
528
 
533
529
  fn tiltShift_getDelta(texSize: vec2f) -> vec2f {
534
530
  let vector = normalize((tiltShift.end - tiltShift.start) * texSize);
@@ -653,7 +649,7 @@ var source9 = (
653
649
  delta: vec2f,
654
650
  };
655
651
 
656
- @group(0) @binding(1) var<uniform> triangleBlur: triangleBlurUniforms;
652
+ @group(0) @binding(auto) var<uniform> triangleBlur: triangleBlurUniforms;
657
653
 
658
654
  fn triangleBlur_sampleColor(
659
655
  sourceTexture: texture_2d<f32>,
@@ -672,25 +668,25 @@ fn triangleBlur_sampleColor(
672
668
  for (var t = -30.0; t <= 30.0; t += 1.0) {
673
669
  let percent = (t + offset - 0.5) / 30.0;
674
670
  let weight = 1.0 - abs(percent);
675
- var offsetColor = textureSample(
671
+ let offsetColor = textureSample(
676
672
  sourceTexture,
677
673
  sourceTextureSampler,
678
674
  texCoord + adjustedDelta * percent
679
675
  );
680
676
 
681
677
  /* switch to pre-multiplied alpha to correctly blur transparent images */
682
- offsetColor.rgb *= offsetColor.a;
678
+ let premultipliedOffsetColor = vec4f(offsetColor.rgb * vec3f(offsetColor.a), offsetColor.a);
683
679
 
684
- color += offsetColor * weight;
680
+ color += premultipliedOffsetColor * weight;
685
681
  total += weight;
686
682
  }
687
683
 
688
684
  color /= total;
689
685
 
690
686
  /* switch back from pre-multiplied alpha */
691
- color.rgb /= color.a + 0.00001;
687
+ let unpremultipliedRgb = color.rgb / vec3f(color.a + 0.00001);
692
688
 
693
- return color;
689
+ return vec4f(unpremultipliedRgb, color.a);
694
690
  }
695
691
  `
696
692
  );
@@ -762,7 +758,7 @@ struct zoomBlurUniforms {
762
758
  strength: f32,
763
759
  };
764
760
 
765
- @group(0) @binding(1) var<uniform> zoomBlur : zoomBlurUniforms;
761
+ @group(0) @binding(auto) var<uniform> zoomBlur : zoomBlurUniforms;
766
762
 
767
763
 
768
764
  fn zoomBlur_sampleColor(
@@ -851,7 +847,7 @@ var source11 = (
851
847
  size: f32,
852
848
  };
853
849
 
854
- @group(0) @binding(1) var<uniform> colorHalftone: colorHalftoneUniforms;
850
+ @group(0) @binding(auto) var<uniform> colorHalftone: colorHalftoneUniforms;
855
851
 
856
852
  fn pattern(angle: f32, scale: f32, texSize: vec2f, texCoord: vec2f) -> f32 {
857
853
  let s = sin(angle);
@@ -951,7 +947,7 @@ var source12 = (
951
947
  size: f32,
952
948
  };
953
949
 
954
- @group(0) @binding(1) var<uniform> dotScreen: dotScreenUniforms;
950
+ @group(0) @binding(auto) var<uniform> dotScreen: dotScreenUniforms;
955
951
 
956
952
  fn pattern(texSize: vec2f, texCoord: vec2f) -> f32 {
957
953
  let scale = 3.1415 / dotScreen.size;
@@ -1025,7 +1021,7 @@ var source13 = (
1025
1021
  mode: u32,
1026
1022
  };
1027
1023
 
1028
- @group(0) @binding(1) var<uniform> edgeWork: edgeWorkUniforms;
1024
+ @group(0) @binding(auto) var<uniform> edgeWork: edgeWorkUniforms;
1029
1025
 
1030
1026
  fn edgeWork_sampleColorRGB(
1031
1027
  sourceTexture: texture_2d<f32>,
@@ -1227,7 +1223,7 @@ var source14 = (
1227
1223
  scale: f32,
1228
1224
  };
1229
1225
 
1230
- @group(0) @binding(1) var<uniform> hexagonalPixelate: hexagonalPixelateUniforms;
1226
+ @group(0) @binding(auto) var<uniform> hexagonalPixelate: hexagonalPixelateUniforms;
1231
1227
 
1232
1228
  fn hexagonalPixelate_sampleColor(
1233
1229
  sourceTexture: texture_2d<f32>,
@@ -1350,7 +1346,7 @@ var source15 = (
1350
1346
  strength: f32,
1351
1347
  };
1352
1348
 
1353
- @group(0) @binding(1) var<uniform> ink: inkUniforms;
1349
+ @group(0) @binding(auto) var<uniform> ink: inkUniforms;
1354
1350
 
1355
1351
  fn ink_sampleColor(
1356
1352
  sourceTexture: texture_2d<f32>,
@@ -1443,7 +1439,7 @@ var source16 = (
1443
1439
  borderColor: vec4f,
1444
1440
  };
1445
1441
 
1446
- @group(0) @binding(1) var<uniform> magnify: magnifyUniforms;
1442
+ @group(0) @binding(auto) var<uniform> magnify: magnifyUniforms;
1447
1443
 
1448
1444
  fn magnify_sampleColor(
1449
1445
  sourceTexture: texture_2d<f32>,
@@ -1454,13 +1450,18 @@ fn magnify_sampleColor(
1454
1450
  let pos = vec2f(magnify.screenXY.x, 1.0 - magnify.screenXY.y);
1455
1451
  let dist = distance(texCoord * texSize, pos * texSize);
1456
1452
  if (dist < magnify.radiusPixels) {
1457
- return textureSample(sourceTexture, sourceTextureSampler, (texCoord - pos) / magnify.zoom + pos);
1453
+ return textureSampleLevel(
1454
+ sourceTexture,
1455
+ sourceTextureSampler,
1456
+ (texCoord - pos) / magnify.zoom + pos,
1457
+ 0.0
1458
+ );
1458
1459
  }
1459
1460
 
1460
1461
  if (dist <= magnify.radiusPixels + magnify.borderWidthPixels) {
1461
1462
  return magnify.borderColor;
1462
1463
  }
1463
- return textureSample(sourceTexture, sourceTextureSampler, texCoord);
1464
+ return textureSampleLevel(sourceTexture, sourceTextureSampler, texCoord, 0.0);
1464
1465
  }
1465
1466
  `
1466
1467
  );
@@ -1553,12 +1554,12 @@ var warp = {
1553
1554
  var source18 = (
1554
1555
  /* wgsl */
1555
1556
  `struct bulgePinchUniforms {
1557
+ center: vec2f,
1556
1558
  radius: f32,
1557
1559
  strength: f32,
1558
- center: vec2f,
1559
1560
  };
1560
1561
 
1561
- @group(0) @binding(1) var<uniform> bulgePinch: bulgePinchUniforms;
1562
+ @group(0) @binding(auto) var<uniform> bulgePinch: bulgePinchUniforms;
1562
1563
 
1563
1564
  fn bulgePinch_warp(coordIn: vec2f, texCenter: vec2f) -> vec2f {
1564
1565
  var coord = coordIn - texCenter;
@@ -1599,9 +1600,9 @@ fn bulgePinch_sampleColor(
1599
1600
  var fs18 = (
1600
1601
  /* glsl */
1601
1602
  `uniform bulgePinchUniforms {
1603
+ vec2 center;
1602
1604
  float radius;
1603
1605
  float strength;
1604
- vec2 center;
1605
1606
  } bulgePinch;
1606
1607
 
1607
1608
  vec2 bulgePinch_warp(vec2 coord, vec2 texCenter) {
@@ -1651,12 +1652,12 @@ var bulgePinch = {
1651
1652
  var source19 = (
1652
1653
  /* wgsl */
1653
1654
  `struct swirlUniforms {
1655
+ center: vec2f,
1654
1656
  radius: f32,
1655
1657
  angle: f32,
1656
- center: vec2f,
1657
1658
  };
1658
1659
 
1659
- @group(0) @binding(1) var<uniform> swirl: swirlUniforms;
1660
+ @group(0) @binding(auto) var<uniform> swirl: swirlUniforms;
1660
1661
 
1661
1662
  fn swirl_warp(coordIn: vec2f, texCenter: vec2f) -> vec2f {
1662
1663
  var coord = coordIn - texCenter;
@@ -1690,9 +1691,9 @@ fn swirl_sampleColor(
1690
1691
  var fs19 = (
1691
1692
  /* glsl */
1692
1693
  `uniform swirlUniforms {
1694
+ vec2 center;
1693
1695
  float radius;
1694
1696
  float angle;
1695
- vec2 center;
1696
1697
  } swirl;
1697
1698
 
1698
1699
  vec2 swirl_warp(vec2 coord, vec2 texCenter) {
@@ -1741,6 +1742,294 @@ var swirl = {
1741
1742
  };
1742
1743
 
1743
1744
  // dist/passes/postprocessing/fxaa/fxaa.js
1745
+ var source20 = (
1746
+ /* wgsl */
1747
+ `fn fxaaSat(value: f32) -> f32 {
1748
+ return clamp(value, 0.0, 1.0);
1749
+ }
1750
+
1751
+ fn fxaaTexTop(
1752
+ sourceTexture: texture_2d<f32>,
1753
+ sourceTextureSampler: sampler,
1754
+ texCoord: vec2f
1755
+ ) -> vec4f {
1756
+ return textureSampleLevel(sourceTexture, sourceTextureSampler, texCoord, 0.0);
1757
+ }
1758
+
1759
+ fn fxaaTexOff(
1760
+ sourceTexture: texture_2d<f32>,
1761
+ sourceTextureSampler: sampler,
1762
+ texCoord: vec2f,
1763
+ offset: vec2f,
1764
+ reciprocalFrame: vec2f
1765
+ ) -> vec4f {
1766
+ return textureSampleLevel(
1767
+ sourceTexture,
1768
+ sourceTextureSampler,
1769
+ texCoord + offset * reciprocalFrame,
1770
+ 0.0
1771
+ );
1772
+ }
1773
+
1774
+ fn fxaaLuma(color: vec4f) -> f32 {
1775
+ return dot(color.rgb, vec3f(0.2126, 0.7152, 0.0722));
1776
+ }
1777
+
1778
+ fn fxaaGetQualityStep(stepIndex: u32) -> f32 {
1779
+ switch (stepIndex) {
1780
+ case 0u: {
1781
+ return 1.0;
1782
+ }
1783
+ case 1u: {
1784
+ return 1.5;
1785
+ }
1786
+ case 2u: {
1787
+ return 2.0;
1788
+ }
1789
+ case 3u: {
1790
+ return 2.0;
1791
+ }
1792
+ case 4u: {
1793
+ return 2.0;
1794
+ }
1795
+ case 5u: {
1796
+ return 2.0;
1797
+ }
1798
+ case 6u: {
1799
+ return 2.0;
1800
+ }
1801
+ case 7u: {
1802
+ return 2.0;
1803
+ }
1804
+ case 8u: {
1805
+ return 2.0;
1806
+ }
1807
+ case 9u: {
1808
+ return 2.0;
1809
+ }
1810
+ case 10u: {
1811
+ return 4.0;
1812
+ }
1813
+ default: {
1814
+ return 8.0;
1815
+ }
1816
+ }
1817
+ }
1818
+
1819
+ fn fxaaPixelShader(
1820
+ texCoord: vec2f,
1821
+ sourceTexture: texture_2d<f32>,
1822
+ sourceTextureSampler: sampler,
1823
+ reciprocalFrame: vec2f,
1824
+ qualitySubpix: f32,
1825
+ qualityEdgeThreshold: f32,
1826
+ qualityEdgeThresholdMin: f32
1827
+ ) -> vec4f {
1828
+ var posM = texCoord;
1829
+ let rgbyM = fxaaTexTop(sourceTexture, sourceTextureSampler, posM);
1830
+ let lumaM = rgbyM.g;
1831
+ var lumaS = fxaaLuma(
1832
+ fxaaTexOff(sourceTexture, sourceTextureSampler, posM, vec2f(0.0, 1.0), reciprocalFrame)
1833
+ );
1834
+ let lumaE = fxaaLuma(
1835
+ fxaaTexOff(sourceTexture, sourceTextureSampler, posM, vec2f(1.0, 0.0), reciprocalFrame)
1836
+ );
1837
+ var lumaN = fxaaLuma(
1838
+ fxaaTexOff(sourceTexture, sourceTextureSampler, posM, vec2f(0.0, -1.0), reciprocalFrame)
1839
+ );
1840
+ let lumaW = fxaaLuma(
1841
+ fxaaTexOff(sourceTexture, sourceTextureSampler, posM, vec2f(-1.0, 0.0), reciprocalFrame)
1842
+ );
1843
+
1844
+ let maxSM = max(lumaS, lumaM);
1845
+ let minSM = min(lumaS, lumaM);
1846
+ let maxESM = max(lumaE, maxSM);
1847
+ let minESM = min(lumaE, minSM);
1848
+ let maxWN = max(lumaN, lumaW);
1849
+ let minWN = min(lumaN, lumaW);
1850
+ let rangeMax = max(maxWN, maxESM);
1851
+ let rangeMin = min(minWN, minESM);
1852
+ let rangeMaxScaled = rangeMax * qualityEdgeThreshold;
1853
+ let range = rangeMax - rangeMin;
1854
+ let rangeMaxClamped = max(qualityEdgeThresholdMin, rangeMaxScaled);
1855
+ if (range < rangeMaxClamped) {
1856
+ return rgbyM;
1857
+ }
1858
+
1859
+ let lumaNW = fxaaLuma(
1860
+ fxaaTexOff(sourceTexture, sourceTextureSampler, posM, vec2f(-1.0, -1.0), reciprocalFrame)
1861
+ );
1862
+ let lumaSE = fxaaLuma(
1863
+ fxaaTexOff(sourceTexture, sourceTextureSampler, posM, vec2f(1.0, 1.0), reciprocalFrame)
1864
+ );
1865
+ let lumaNE = fxaaLuma(
1866
+ fxaaTexOff(sourceTexture, sourceTextureSampler, posM, vec2f(1.0, -1.0), reciprocalFrame)
1867
+ );
1868
+ let lumaSW = fxaaLuma(
1869
+ fxaaTexOff(sourceTexture, sourceTextureSampler, posM, vec2f(-1.0, 1.0), reciprocalFrame)
1870
+ );
1871
+
1872
+ let lumaNS = lumaN + lumaS;
1873
+ let lumaWE = lumaW + lumaE;
1874
+ let subpixReciprocalRange = 1.0 / range;
1875
+ let subpixNSWE = lumaNS + lumaWE;
1876
+ let edgeHorizontal1 = -2.0 * lumaM + lumaNS;
1877
+ let edgeVertical1 = -2.0 * lumaM + lumaWE;
1878
+
1879
+ let lumaNESE = lumaNE + lumaSE;
1880
+ let lumaNWNE = lumaNW + lumaNE;
1881
+ let edgeHorizontal2 = -2.0 * lumaE + lumaNESE;
1882
+ let edgeVertical2 = -2.0 * lumaN + lumaNWNE;
1883
+
1884
+ let lumaNWSW = lumaNW + lumaSW;
1885
+ let lumaSWSE = lumaSW + lumaSE;
1886
+ let edgeHorizontal4 = abs(edgeHorizontal1) * 2.0 + abs(edgeHorizontal2);
1887
+ let edgeVertical4 = abs(edgeVertical1) * 2.0 + abs(edgeVertical2);
1888
+ let edgeHorizontal3 = -2.0 * lumaW + lumaNWSW;
1889
+ let edgeVertical3 = -2.0 * lumaS + lumaSWSE;
1890
+ let edgeHorizontal = abs(edgeHorizontal3) + edgeHorizontal4;
1891
+ let edgeVertical = abs(edgeVertical3) + edgeVertical4;
1892
+
1893
+ let subpixNWSWNESE = lumaNWSW + lumaNESE;
1894
+ let horizontalSpan = edgeHorizontal >= edgeVertical;
1895
+ var lengthSign = reciprocalFrame.x;
1896
+ let subpixA = subpixNSWE * 2.0 + subpixNWSWNESE;
1897
+ if (!horizontalSpan) {
1898
+ lumaN = lumaW;
1899
+ lumaS = lumaE;
1900
+ }
1901
+ if (horizontalSpan) {
1902
+ lengthSign = reciprocalFrame.y;
1903
+ }
1904
+ let subpixB = subpixA * (1.0 / 12.0) - lumaM;
1905
+
1906
+ let gradientN = lumaN - lumaM;
1907
+ let gradientS = lumaS - lumaM;
1908
+ var lumaNN = lumaN + lumaM;
1909
+ let lumaSS = lumaS + lumaM;
1910
+ let pairN = abs(gradientN) >= abs(gradientS);
1911
+ let gradient = max(abs(gradientN), abs(gradientS));
1912
+ if (pairN) {
1913
+ lengthSign = -lengthSign;
1914
+ }
1915
+ let subpixC = fxaaSat(abs(subpixB) * subpixReciprocalRange);
1916
+
1917
+ var posB = posM;
1918
+ var offNP = vec2f(0.0);
1919
+ if (horizontalSpan) {
1920
+ offNP = vec2f(reciprocalFrame.x, 0.0);
1921
+ posB.y += lengthSign * 0.5;
1922
+ } else {
1923
+ offNP = vec2f(0.0, reciprocalFrame.y);
1924
+ posB.x += lengthSign * 0.5;
1925
+ }
1926
+
1927
+ var posN = posB - offNP * fxaaGetQualityStep(0u);
1928
+ var posP = posB + offNP * fxaaGetQualityStep(0u);
1929
+ let subpixD = -2.0 * subpixC + 3.0;
1930
+ var lumaEndN = fxaaLuma(fxaaTexTop(sourceTexture, sourceTextureSampler, posN));
1931
+ let subpixE = subpixC * subpixC;
1932
+ var lumaEndP = fxaaLuma(fxaaTexTop(sourceTexture, sourceTextureSampler, posP));
1933
+
1934
+ if (!pairN) {
1935
+ lumaNN = lumaSS;
1936
+ }
1937
+ let gradientScaled = gradient * 0.25;
1938
+ let lumaMM = lumaM - lumaNN * 0.5;
1939
+ let subpixF = subpixD * subpixE;
1940
+ let lumaMoreThanZero = lumaMM < 0.0;
1941
+
1942
+ lumaEndN -= lumaNN * 0.5;
1943
+ lumaEndP -= lumaNN * 0.5;
1944
+ var doneN = abs(lumaEndN) >= gradientScaled;
1945
+ var doneP = abs(lumaEndP) >= gradientScaled;
1946
+ var doneNP = !doneN || !doneP;
1947
+ var qualityStepIndex = 1u;
1948
+ loop {
1949
+ if (!(doneNP && qualityStepIndex < 12u)) {
1950
+ break;
1951
+ }
1952
+
1953
+ let qualityStep = fxaaGetQualityStep(qualityStepIndex);
1954
+ if (!doneN) {
1955
+ posN -= offNP * qualityStep;
1956
+ }
1957
+ if (!doneP) {
1958
+ posP += offNP * qualityStep;
1959
+ }
1960
+
1961
+ qualityStepIndex += 1u;
1962
+ if (qualityStepIndex >= 12u) {
1963
+ break;
1964
+ }
1965
+
1966
+ if (!doneN) {
1967
+ lumaEndN = fxaaLuma(fxaaTexTop(sourceTexture, sourceTextureSampler, posN));
1968
+ lumaEndN -= lumaNN * 0.5;
1969
+ doneN = abs(lumaEndN) >= gradientScaled;
1970
+ }
1971
+ if (!doneP) {
1972
+ lumaEndP = fxaaLuma(fxaaTexTop(sourceTexture, sourceTextureSampler, posP));
1973
+ lumaEndP -= lumaNN * 0.5;
1974
+ doneP = abs(lumaEndP) >= gradientScaled;
1975
+ }
1976
+
1977
+ doneNP = !doneN || !doneP;
1978
+ }
1979
+
1980
+ var dstN = posM.x - posN.x;
1981
+ var dstP = posP.x - posM.x;
1982
+ if (!horizontalSpan) {
1983
+ dstN = posM.y - posN.y;
1984
+ dstP = posP.y - posM.y;
1985
+ }
1986
+
1987
+ let goodSpanN = (lumaEndN < 0.0) != lumaMoreThanZero;
1988
+ let spanLength = dstP + dstN;
1989
+ let goodSpanP = (lumaEndP < 0.0) != lumaMoreThanZero;
1990
+ let spanLengthReciprocal = 1.0 / spanLength;
1991
+
1992
+ let directionN = dstN < dstP;
1993
+ let dst = min(dstN, dstP);
1994
+ let goodSpan = select(goodSpanP, goodSpanN, directionN);
1995
+ let subpixG = subpixF * subpixF;
1996
+ let pixelOffset = dst * -spanLengthReciprocal + 0.5;
1997
+ let subpixH = subpixG * qualitySubpix;
1998
+
1999
+ let pixelOffsetGood = select(0.0, pixelOffset, goodSpan);
2000
+ let pixelOffsetSubpix = max(pixelOffsetGood, subpixH);
2001
+ if (!horizontalSpan) {
2002
+ posM.x += pixelOffsetSubpix * lengthSign;
2003
+ }
2004
+ if (horizontalSpan) {
2005
+ posM.y += pixelOffsetSubpix * lengthSign;
2006
+ }
2007
+
2008
+ return fxaaTexTop(sourceTexture, sourceTextureSampler, posM);
2009
+ }
2010
+
2011
+ fn fxaa_sampleColor(
2012
+ sourceTexture: texture_2d<f32>,
2013
+ sourceTextureSampler: sampler,
2014
+ texSize: vec2f,
2015
+ texCoord: vec2f
2016
+ ) -> vec4f {
2017
+ let qualitySubpix = 0.5;
2018
+ let qualityEdgeThreshold = 0.125;
2019
+ let qualityEdgeThresholdMin = 0.0833;
2020
+
2021
+ return fxaaPixelShader(
2022
+ texCoord,
2023
+ sourceTexture,
2024
+ sourceTextureSampler,
2025
+ vec2f(1.0) / texSize,
2026
+ qualitySubpix,
2027
+ qualityEdgeThreshold,
2028
+ qualityEdgeThresholdMin
2029
+ );
2030
+ }
2031
+ `
2032
+ );
1744
2033
  var fs20 = (
1745
2034
  /* glsl */
1746
2035
  `
@@ -2328,6 +2617,7 @@ vec4 fxaa_sampleColor(sampler2D source, vec2 texSize, vec2 texCoord) {
2328
2617
  var fxaa = {
2329
2618
  name: "fxaa",
2330
2619
  propTypes: {},
2620
+ source: source20,
2331
2621
  fs: fs20,
2332
2622
  passes: [{ sampler: true }],
2333
2623
  getUniforms: (props) => props