chromaticAberrationPostProcess.js 4.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990
  1. import { __decorate } from "../tslib.es6.js";
  2. import { Vector2 } from "../Maths/math.vector.js";
  3. import { PostProcess } from "./postProcess.js";
  4. import "../Shaders/chromaticAberration.fragment.js";
  5. import { RegisterClass } from "../Misc/typeStore.js";
  6. import { serialize } from "../Misc/decorators.js";
  7. import { SerializationHelper } from "../Misc/decorators.serialization.js";
  8. /**
  9. * The ChromaticAberrationPostProcess separates the rgb channels in an image to produce chromatic distortion around the edges of the screen
  10. */
  11. export class ChromaticAberrationPostProcess extends PostProcess {
  12. /**
  13. * Gets a string identifying the name of the class
  14. * @returns "ChromaticAberrationPostProcess" string
  15. */
  16. getClassName() {
  17. return "ChromaticAberrationPostProcess";
  18. }
  19. /**
  20. * Creates a new instance ChromaticAberrationPostProcess
  21. * @param name The name of the effect.
  22. * @param screenWidth The width of the screen to apply the effect on.
  23. * @param screenHeight The height of the screen to apply the effect on.
  24. * @param options The required width/height ratio to downsize to before computing the render pass.
  25. * @param camera The camera to apply the render pass to.
  26. * @param samplingMode The sampling mode to be used when computing the pass. (default: 0)
  27. * @param engine The engine which the post process will be applied. (default: current engine)
  28. * @param reusable If the post process can be reused on the same frame. (default: false)
  29. * @param textureType Type of textures used when performing the post process. (default: 0)
  30. * @param blockCompilation If compilation of the shader should not be done in the constructor. The updateEffect method can be used to compile the shader at a later time. (default: false)
  31. */
  32. constructor(name, screenWidth, screenHeight, options, camera, samplingMode, engine, reusable, textureType = 0, blockCompilation = false) {
  33. super(name, "chromaticAberration", ["chromatic_aberration", "screen_width", "screen_height", "direction", "radialIntensity", "centerPosition"], [], options, camera, samplingMode, engine, reusable, null, textureType, undefined, null, blockCompilation);
  34. /**
  35. * The amount of separation of rgb channels (default: 30)
  36. */
  37. this.aberrationAmount = 30;
  38. /**
  39. * The amount the effect will increase for pixels closer to the edge of the screen. (default: 0)
  40. */
  41. this.radialIntensity = 0;
  42. /**
  43. * The normalized direction in which the rgb channels should be separated. If set to 0,0 radial direction will be used. (default: Vector2(0.707,0.707))
  44. */
  45. this.direction = new Vector2(0.707, 0.707);
  46. /**
  47. * The center position where the radialIntensity should be around. [0.5,0.5 is center of screen, 1,1 is top right corner] (default: Vector2(0.5 ,0.5))
  48. */
  49. this.centerPosition = new Vector2(0.5, 0.5);
  50. this.screenWidth = screenWidth;
  51. this.screenHeight = screenHeight;
  52. this.onApplyObservable.add((effect) => {
  53. effect.setFloat("chromatic_aberration", this.aberrationAmount);
  54. effect.setFloat("screen_width", screenWidth);
  55. effect.setFloat("screen_height", screenHeight);
  56. effect.setFloat("radialIntensity", this.radialIntensity);
  57. effect.setFloat2("direction", this.direction.x, this.direction.y);
  58. effect.setFloat2("centerPosition", this.centerPosition.x, this.centerPosition.y);
  59. });
  60. }
  61. /**
  62. * @internal
  63. */
  64. static _Parse(parsedPostProcess, targetCamera, scene, rootUrl) {
  65. return SerializationHelper.Parse(() => {
  66. return new ChromaticAberrationPostProcess(parsedPostProcess.name, parsedPostProcess.screenWidth, parsedPostProcess.screenHeight, parsedPostProcess.options, targetCamera, parsedPostProcess.renderTargetSamplingMode, scene.getEngine(), parsedPostProcess.reusable, parsedPostProcess.textureType, false);
  67. }, parsedPostProcess, scene, rootUrl);
  68. }
  69. }
  70. __decorate([
  71. serialize()
  72. ], ChromaticAberrationPostProcess.prototype, "aberrationAmount", void 0);
  73. __decorate([
  74. serialize()
  75. ], ChromaticAberrationPostProcess.prototype, "radialIntensity", void 0);
  76. __decorate([
  77. serialize()
  78. ], ChromaticAberrationPostProcess.prototype, "direction", void 0);
  79. __decorate([
  80. serialize()
  81. ], ChromaticAberrationPostProcess.prototype, "centerPosition", void 0);
  82. __decorate([
  83. serialize()
  84. ], ChromaticAberrationPostProcess.prototype, "screenWidth", void 0);
  85. __decorate([
  86. serialize()
  87. ], ChromaticAberrationPostProcess.prototype, "screenHeight", void 0);
  88. RegisterClass("BABYLON.ChromaticAberrationPostProcess", ChromaticAberrationPostProcess);
  89. //# sourceMappingURL=chromaticAberrationPostProcess.js.map