babylon.ssaoRenderingPipeline.ts 7.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150
  1. module BABYLON {
  2. export class SSAORenderingPipeline extends PostProcessRenderPipeline {
  3. // Members
  4. public SSAOOriginalSceneColorEffect: string = "SSAOOriginalSceneColorEffect";
  5. public SSAORenderEffect: string = "SSAORenderEffect";
  6. public SSAOBlurHRenderEffect: string = "SSAOBlurHRenderEffect";
  7. public SSAOBlurVRenderEffect: string = "SSAOBlurVRenderEffect";
  8. public SSAOCombineRenderEffect: string = "SSAOCombineRenderEffect";
  9. private _scene: Scene;
  10. private _depthTexture: RenderTargetTexture;
  11. private _randomTexture: DynamicTexture;
  12. private _originalColorPostProcess: PassPostProcess;
  13. private _ssaoPostProcess: PostProcess;
  14. private _blurHPostProcess: BlurPostProcess;
  15. private _blurVPostProcess: BlurPostProcess;
  16. private _ssaoCombinePostProcess: PostProcess;
  17. private _firstUpdate: boolean = true;
  18. constructor(name: string, scene: Scene, ratio: number = 1.0, cameras?: Camera[]) {
  19. super(scene.getEngine(), name);
  20. this._scene = scene;
  21. // Set up assets
  22. this._createRandomTexture();
  23. this._depthTexture = scene.enableDepthRenderer().getDepthMap(); // Force depth renderer "on"
  24. this._originalColorPostProcess = new PassPostProcess("SSAOOriginalSceneColor", 1.0, null, Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false);
  25. this._createSSAOPostProcess(ratio);
  26. this._blurHPostProcess = new BlurPostProcess("SSAOBlurH", new Vector2(2.0, 0.0), 2.0, ratio, null, Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false);
  27. this._blurVPostProcess = new BlurPostProcess("SSAOBlurV", new Vector2(0.0, 2.0), 2.0, ratio, null, Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false);
  28. this._createSSAOCombinePostProcess();
  29. // Set up pipeline
  30. this.addEffect(new PostProcessRenderEffect(scene.getEngine(), this.SSAOOriginalSceneColorEffect, () => { return this._originalColorPostProcess; }, true));
  31. this.addEffect(new PostProcessRenderEffect(scene.getEngine(), this.SSAORenderEffect, () => { return this._ssaoPostProcess; }, true));
  32. this.addEffect(new PostProcessRenderEffect(scene.getEngine(), this.SSAOBlurHRenderEffect, () => { return this._blurHPostProcess; }, true));
  33. this.addEffect(new PostProcessRenderEffect(scene.getEngine(), this.SSAOBlurVRenderEffect, () => { return this._blurVPostProcess; }, true));
  34. this.addEffect(new PostProcessRenderEffect(scene.getEngine(), this.SSAOCombineRenderEffect, () => { return this._ssaoCombinePostProcess; }, true));
  35. // Finish
  36. scene.postProcessRenderPipelineManager.addPipeline(this);
  37. if (cameras)
  38. scene.postProcessRenderPipelineManager.attachCamerasToRenderPipeline(name, cameras);
  39. }
  40. // Public Methods
  41. public getBlurHPostProcess(): BlurPostProcess {
  42. return this._blurHPostProcess;
  43. }
  44. public getBlurVPostProcess(): BlurPostProcess {
  45. return this._blurVPostProcess;
  46. }
  47. public dispose(cameras: any): void {
  48. if (cameras !== undefined)
  49. this._scene.postProcessRenderPipelineManager.detachCamerasFromRenderPipeline(this._name, cameras);
  50. this._originalColorPostProcess = undefined;
  51. this._ssaoPostProcess = undefined;
  52. this._blurHPostProcess = undefined;
  53. this._blurVPostProcess = undefined;
  54. this._ssaoCombinePostProcess = undefined;
  55. this._randomTexture.dispose();
  56. }
  57. // Private Methods
  58. private _createSSAOPostProcess(ratio: number): void {
  59. var sampleSphere = [
  60. 0.5381, 0.1856, -0.4319,
  61. 0.1379, 0.2486, 0.4430,
  62. 0.3371, 0.5679, -0.0057,
  63. -0.6999, -0.0451, -0.0019,
  64. 0.0689, -0.1598, -0.8547,
  65. 0.0560, 0.0069, -0.1843,
  66. -0.0146, 0.1402, 0.0762,
  67. 0.0100, -0.1924, -0.0344,
  68. -0.3577, -0.5301, -0.4358,
  69. -0.3169, 0.1063, 0.0158,
  70. 0.0103, -0.5869, 0.0046,
  71. -0.0897, -0.4940, 0.3287,
  72. 0.7119, -0.0154, -0.0918,
  73. -0.0533, 0.0596, -0.5411,
  74. 0.0352, -0.0631, 0.5460,
  75. -0.4776, 0.2847, -0.0271
  76. ];
  77. var samplesFactor = 1.0 / 16.0;
  78. this._ssaoPostProcess = new PostProcess("ssao", "ssao", ["sampleSphere", "samplesFactor", "randTextureTiles"],
  79. ["randomSampler"],
  80. ratio, null, Texture.BILINEAR_SAMPLINGMODE,
  81. this._scene.getEngine(), false);
  82. this._ssaoPostProcess.onApply = (effect: Effect) => {
  83. if (this._firstUpdate) {
  84. effect.setArray3("sampleSphere", sampleSphere);
  85. effect.setFloat("samplesFactor", samplesFactor);
  86. effect.setFloat("randTextureTiles", 4.0 / ratio);
  87. this._firstUpdate = false;
  88. }
  89. effect.setTexture("textureSampler", this._depthTexture);
  90. effect.setTexture("randomSampler", this._randomTexture);
  91. };
  92. }
  93. private _createSSAOCombinePostProcess(): void {
  94. this._ssaoCombinePostProcess = new PostProcess("ssaoCombine", "ssaoCombine", [], ["originalColor"],
  95. 1.0, null, Texture.BILINEAR_SAMPLINGMODE,
  96. this._scene.getEngine(), false);
  97. this._ssaoCombinePostProcess.onApply = (effect: Effect) => {
  98. effect.setTextureFromPostProcess("originalColor", this._originalColorPostProcess);
  99. };
  100. }
  101. private _createRandomTexture(): void {
  102. var size = 512;
  103. this._randomTexture = new DynamicTexture("SSAORandomTexture", size, this._scene, false, Texture.BILINEAR_SAMPLINGMODE);
  104. this._randomTexture.wrapU = Texture.WRAP_ADDRESSMODE;
  105. this._randomTexture.wrapV = Texture.WRAP_ADDRESSMODE;
  106. var context = this._randomTexture.getContext();
  107. var rand = (min, max) => {
  108. return Math.random() * (max - min) + min;
  109. }
  110. for (var x = 0; x < size; x++) {
  111. for (var y = 0; y < size; y++) {
  112. var randVector = Vector3.Zero();
  113. randVector.x = Math.floor(rand(0.0, 1.0) * 255);
  114. randVector.y = Math.floor(rand(0.0, 1.0) * 255);
  115. randVector.z = Math.floor(rand(0.0, 1.0) * 255);
  116. context.fillStyle = 'rgb(' + randVector.x + ', ' + randVector.y + ', ' + randVector.z + ')';
  117. context.fillRect(x, y, 1, 1);
  118. }
  119. }
  120. this._randomTexture.update(false);
  121. }
  122. }
  123. }