Fixing issue with Chrome

Babylon/PostProcess/babylon.lensRenderingPipeline.js

@@ -9,33 +9,33 @@ var BABYLON;
     var LensRenderingPipeline = (function (_super) {
         __extends(LensRenderingPipeline, _super);
         /**
-         * @constructor
-         * @param {string} name - The rendering pipeline name
-         * @param {object} parameters - An object containing all parameters (see below)
-         * @param {BABYLON.Scene} scene - The scene linked to this pipeline
-         * @param {number} ratio - The size of the postprocesses (0.5 means that your postprocess will have a width = canvas.width 0.5 and a height = canvas.height 0.5)
-         * @param {BABYLON.Camera[]} cameras - The array of cameras that the rendering pipeline will be attached to
-
-            Effect parameters are as follow:
-            {
-                chromatic_aberration: number;		// from 0 to x (1 for realism)
-                edge_blur: number;					// from 0 to x (1 for realism)
-                distortion: number;					// from 0 to x (1 for realism)
-                grain_amount: number;				// from 0 to 1
-                grain_texture: BABYLON.Texture;		// texture to use for grain effect; if unset, use random B&W noise
-                dof_focus_depth: number;			// depth-of-field: focus depth; unset to disable
-                dof_aperture: number;				// depth-of-field: focus blur bias (default: 1)
-                dof_pentagon: boolean;				// depth-of-field: makes a pentagon-like "bokeh" effect
-                dof_gain: boolean;					// depth-of-field: depthOfField gain (default: 1)
-                dof_threshold: boolean;				// depth-of-field: depthOfField threshold (default: 1)
-                blur_noise: boolean;				// add a little bit of noise to the blur (default: true)
-            }
-
-            Note: if an effect parameter is unset, effect is disabled
-         */
+        * @constructor
+        * @param {string} name - The rendering pipeline name
+        * @param {object} parameters - An object containing all parameters (see below)
+        * @param {BABYLON.Scene} scene - The scene linked to this pipeline
+        * @param {number} ratio - The size of the postprocesses (0.5 means that your postprocess will have a width = canvas.width 0.5 and a height = canvas.height 0.5)
+        * @param {BABYLON.Camera[]} cameras - The array of cameras that the rendering pipeline will be attached to
+        
+        Effect parameters are as follow:
+        {
+        chromatic_aberration: number;		// from 0 to x (1 for realism)
+        edge_blur: number;					// from 0 to x (1 for realism)
+        distortion: number;					// from 0 to x (1 for realism)
+        grain_amount: number;				// from 0 to 1
+        grain_texture: BABYLON.Texture;		// texture to use for grain effect; if unset, use random B&W noise
+        dof_focus_depth: number;			// depth-of-field: focus depth; unset to disable
+        dof_aperture: number;				// depth-of-field: focus blur bias (default: 1)
+        dof_pentagon: boolean;				// depth-of-field: makes a pentagon-like "bokeh" effect
+        dof_gain: boolean;					// depth-of-field: depthOfField gain (default: 1)
+        dof_threshold: boolean;				// depth-of-field: depthOfField threshold (default: 1)
+        blur_noise: boolean;				// add a little bit of noise to the blur (default: true)
+        }
+        
+        Note: if an effect parameter is unset, effect is disabled
+        */
         function LensRenderingPipeline(name, parameters, scene, ratio, cameras) {
+            if (typeof ratio === "undefined") { ratio = 1.0; }
             var _this = this;
-            if (ratio === void 0) { ratio = 1.0; }
             _super.call(this, scene.getEngine(), name);
             // Lens effects can be of the following:
             // - chromatic aberration (slight shift of RGB colors)
@@ -56,15 +56,17 @@ var BABYLON;
             * @type {string}
             */
             this.LensDepthOfFieldEffect = "LensDepthOfFieldEffect";
+
             this._scene = scene;
+
             // Fetch texture samplers
             this._depthTexture = scene.enableDepthRenderer().getDepthMap(); // Force depth renderer "on"
             if (parameters.grain_texture) {
                 this._grainTexture = parameters.grain_texture;
-            }
-            else {
+            } else {
                 this._createGrainTexture();
             }
+
             // save parameters
             this._edgeBlur = parameters.edge_blur ? parameters.edge_blur : 0;
             this._grainAmount = parameters.grain_amount ? parameters.grain_amount : 0;
@@ -76,9 +78,11 @@ var BABYLON;
             this._dofAperture = parameters.dof_aperture ? parameters.dof_aperture : 1;
             this._dofPentagon = parameters.dof_pentagon !== undefined ? parameters.dof_pentagon : true;
             this._blurNoise = parameters.blur_noise !== undefined ? parameters.blur_noise : true;
+
             // Create effects
             this._createChromaticAberrationPostProcess(ratio);
             this._createDepthOfFieldPostProcess(ratio);
+
             // Set up pipeline
             this.addEffect(new BABYLON.PostProcessRenderEffect(scene.getEngine(), this.LensChromaticAberrationEffect, function () {
                 return _this._chromaticAberrationPostProcess;
@@ -86,6 +90,7 @@ var BABYLON;
             this.addEffect(new BABYLON.PostProcessRenderEffect(scene.getEngine(), this.LensDepthOfFieldEffect, function () {
                 return _this._depthOfFieldPostProcess;
             }, true));
+
             // Finish
             scene.postProcessRenderPipelineManager.addPipeline(this);
             if (cameras) {
@@ -144,74 +149,80 @@ var BABYLON;
         LensRenderingPipeline.prototype.disableNoiseBlur = function () {
             this._blurNoise = false;
         };
+
         /**
-         * Removes the internal pipeline assets and detaches the pipeline from the scene cameras
-         */
+        * Removes the internal pipeline assets and detaches the pipeline from the scene cameras
+        */
         LensRenderingPipeline.prototype.dispose = function (disableDepthRender) {
-            if (disableDepthRender === void 0) { disableDepthRender = false; }
+            if (typeof disableDepthRender === "undefined") { disableDepthRender = false; }
             this._scene.postProcessRenderPipelineManager.detachCamerasFromRenderPipeline(this._name, this._scene.cameras);
-            // this._originalColorPostProcess = undefined;
+
             this._chromaticAberrationPostProcess = undefined;
             this._depthOfFieldPostProcess = undefined;
+
             this._grainTexture.dispose();
+
             if (disableDepthRender)
                 this._scene.disableDepthRenderer();
         };
+
         // colors shifting and distortion
         LensRenderingPipeline.prototype._createChromaticAberrationPostProcess = function (ratio) {
             var _this = this;
-            this._chromaticAberrationPostProcess = new BABYLON.PostProcess("LensChromaticAberration", "./chromaticAberration", ["chromatic_aberration", "screen_width", "screen_height"], [], ratio, null, BABYLON.Texture.TRILINEAR_SAMPLINGMODE, this._scene.getEngine(), false);
+            this._chromaticAberrationPostProcess = new BABYLON.PostProcess("LensChromaticAberration", "chromaticAberration", ["chromatic_aberration", "screen_width", "screen_height"], [], ratio, null, BABYLON.Texture.TRILINEAR_SAMPLINGMODE, this._scene.getEngine(), false);
+
             this._chromaticAberrationPostProcess.onApply = function (effect) {
                 effect.setFloat('chromatic_aberration', _this._chromaticAberration);
                 effect.setFloat('screen_width', _this._scene.getEngine().getRenderWidth());
                 effect.setFloat('screen_height', _this._scene.getEngine().getRenderHeight());
             };
         };
+
         // colors shifting and distortion
         LensRenderingPipeline.prototype._createDepthOfFieldPostProcess = function (ratio) {
             var _this = this;
-            this._depthOfFieldPostProcess = new BABYLON.PostProcess("LensDepthOfField", "./depthOfField", [
-                "gain",
-                "threshold",
-                "focus_depth",
-                "aperture",
-                "pentagon",
-                "maxZ",
-                "edge_blur",
-                "chromatic_aberration",
-                "distortion",
-                "blur_noise",
-                "grain_amount",
-                "screen_width",
-                "screen_height"
+            this._depthOfFieldPostProcess = new BABYLON.PostProcess("LensDepthOfField", "depthOfField", [
+                "gain", "threshold", "focus_depth", "aperture", "pentagon", "maxZ", "edge_blur",
+                "chromatic_aberration", "distortion", "blur_noise", "grain_amount", "screen_width", "screen_height"
             ], ["depthSampler", "grainSampler"], ratio, null, BABYLON.Texture.TRILINEAR_SAMPLINGMODE, this._scene.getEngine(), false);
+
             this._depthOfFieldPostProcess.onApply = function (effect) {
                 effect.setBool('pentagon', _this._dofPentagon);
                 effect.setBool('blur_noise', _this._blurNoise);
                 effect.setFloat('maxZ', _this._scene.activeCamera.maxZ);
                 effect.setFloat('grain_amount', _this._grainAmount);
+
                 effect.setTexture("depthSampler", _this._depthTexture);
                 effect.setTexture("grainSampler", _this._grainTexture);
+
                 effect.setFloat('screen_width', _this._scene.getEngine().getRenderWidth());
                 effect.setFloat('screen_height', _this._scene.getEngine().getRenderHeight());
+
                 effect.setFloat('distortion', _this._distortion);
+
                 effect.setFloat('focus_depth', _this._dofDepth);
                 effect.setFloat('aperture', _this._dofAperture);
                 effect.setFloat('gain', _this._highlightsGain);
                 effect.setFloat('threshold', _this._highlightsThreshold);
+
                 effect.setFloat('edge_blur', _this._edgeBlur);
             };
         };
+
         // creates a black and white random noise texture, 512x512
         LensRenderingPipeline.prototype._createGrainTexture = function () {
             var size = 512;
+
             this._grainTexture = new BABYLON.DynamicTexture("LensNoiseTexture", size, this._scene, false, BABYLON.Texture.BILINEAR_SAMPLINGMODE);
             this._grainTexture.wrapU = BABYLON.Texture.WRAP_ADDRESSMODE;
             this._grainTexture.wrapV = BABYLON.Texture.WRAP_ADDRESSMODE;
+
             var context = this._grainTexture.getContext();
+
             var rand = function (min, max) {
                 return Math.random() * (max - min) + min;
             };
+
             var value;
             for (var x = 0; x < size; x++) {
                 for (var y = 0; y < size; y++) {
@@ -226,4 +237,4 @@ var BABYLON;
     })(BABYLON.PostProcessRenderPipeline);
     BABYLON.LensRenderingPipeline = LensRenderingPipeline;
 })(BABYLON || (BABYLON = {}));
-//# sourceMappingURL=babylon.lensRenderingPipeline.js.map
+//# sourceMappingURL=babylon.lensRenderingPipeline.js.map

Babylon/PostProcess/babylon.lensRenderingPipeline.ts

@@ -73,8 +73,11 @@ module BABYLON {
 
 			// Fetch texture samplers
 			this._depthTexture = scene.enableDepthRenderer().getDepthMap(); // Force depth renderer "on"
-			if(parameters.grain_texture) { this._grainTexture = parameters.grain_texture; }
-			else { this._createGrainTexture(); }
+			if (parameters.grain_texture) {
+			    this._grainTexture = parameters.grain_texture;
+			} else {
+			     this._createGrainTexture();
+			}
 
 			// save parameters
 			this._edgeBlur = parameters.edge_blur ? parameters.edge_blur : 0;
@@ -128,7 +131,6 @@ module BABYLON {
         public dispose(disableDepthRender: boolean = false): void {
             this._scene.postProcessRenderPipelineManager.detachCamerasFromRenderPipeline(this._name, this._scene.cameras);
 
-            // this._originalColorPostProcess = undefined;
             this._chromaticAberrationPostProcess = undefined;
             this._depthOfFieldPostProcess = undefined;
 
@@ -140,7 +142,7 @@ module BABYLON {
 
         // colors shifting and distortion
         private _createChromaticAberrationPostProcess(ratio: number): void {
-            this._chromaticAberrationPostProcess = new PostProcess("LensChromaticAberration", "./chromaticAberration",
+            this._chromaticAberrationPostProcess = new PostProcess("LensChromaticAberration", "chromaticAberration",
             	["chromatic_aberration", "screen_width", "screen_height"],		// uniforms
             	[],											// samplers
                 ratio, null, Texture.TRILINEAR_SAMPLINGMODE,
@@ -155,7 +157,7 @@ module BABYLON {
 
         // colors shifting and distortion
         private _createDepthOfFieldPostProcess(ratio: number): void {
-            this._depthOfFieldPostProcess = new PostProcess("LensDepthOfField", "./depthOfField",
+            this._depthOfFieldPostProcess = new PostProcess("LensDepthOfField", "depthOfField",
             	[
             		"gain", "threshold", "focus_depth", "aperture", "pentagon", "maxZ", "edge_blur",
             		"chromatic_aberration", "distortion", "blur_noise", "grain_amount", "screen_width", "screen_height"