Merge pull request #3802 from TrevorDev/postProcessCausingFlicker

Post process causing flicker

dist/preview release/what's new.md

@@ -80,6 +80,7 @@
 - Support depth maps for multiple active cameras for post processes like depth of field ([trevordev](https://github.com/trevordev))
 - Integrates depth texture support in the engine ([sebavan](https://github.com/sebavan))
 - NPM package now has a dependency system, updated during build. ([RaananW](https://github.com/RaananW))
+- Default pipeline will use webGL 2.0 anti aliasing by default if supported, webVR post processing will render to eye texture size ([trevordev](https://github.com/trevordev))
 
 ## Bug fixes
 

src/Cameras/VR/babylon.webVRCamera.ts

@@ -531,7 +531,7 @@ module BABYLON {
 
                 // Update the gamepad to ensure the mesh is updated on the same frame as camera
                 this.controllers.forEach((controller) => {
-                    controller._deviceToWorld = this._deviceToWorld;
+                    controller._deviceToWorld.copyFrom(this._deviceToWorld);
                     controller.update();
                 });
             }
@@ -570,9 +570,13 @@ module BABYLON {
          * 'this' is the left or right camera (and NOT (!!!) the WebVRFreeCamera instance)
          */
         protected _getWebVRViewMatrix(): Matrix {
+            // Update the parent camera prior to using a child camera to avoid desynchronization
+            let parentCamera: WebVRFreeCamera = this._cameraRigParams["parentCamera"];
+            parentCamera._updateCache();
+
             //WebVR 1.1
             var viewArray = this._cameraRigParams["left"] ? this._cameraRigParams["frameData"].leftViewMatrix : this._cameraRigParams["frameData"].rightViewMatrix;
-
+            
             Matrix.FromArrayToRef(viewArray, 0, this._webvrViewMatrix);
 
             if (!this.getScene().useRightHandedSystem) {
@@ -588,8 +592,6 @@ module BABYLON {
             // Computing target and final matrix
             this.position.addToRef(this._transformedReferencePoint, this._currentTarget);
 
-            let parentCamera: WebVRFreeCamera = this._cameraRigParams["parentCamera"];
-
             // should the view matrix be updated with scale and position offset?
             if (parentCamera.deviceScaleFactor !== 1) {
                 this._webvrViewMatrix.invert();
@@ -649,7 +651,7 @@ module BABYLON {
                         this._rightController = null;
                     }
                     if (webVrController.hand === "left") {
-                        this._rightController = null;
+                        this._leftController = null;
                     }
                     const controllerIndex = this.controllers.indexOf(webVrController);
                     if (controllerIndex !== -1) {
@@ -661,7 +663,7 @@ module BABYLON {
             this._onGamepadConnectedObserver = manager.onGamepadConnectedObservable.add((gamepad) => {
                 if (gamepad.type === Gamepad.POSE_ENABLED) {
                     let webVrController: WebVRController = <WebVRController>gamepad;
-                    webVrController._deviceToWorld = this._deviceToWorld;
+                    webVrController._deviceToWorld.copyFrom(this._deviceToWorld);
                     if (this.webVROptions.controllerMeshes) {
                         if (webVrController.defaultModel) {
                             webVrController.defaultModel.setEnabled(true);

src/PostProcess/RenderPipeline/Pipelines/babylon.defaultRenderingPipeline.ts

@@ -382,6 +382,8 @@
             if (this._cameras !== null) {
                 this._scene.postProcessRenderPipelineManager.attachCamerasToRenderPipeline(this._name, this._cameras);
             }
+
+            this._enableMSAAOnFirstPostProcess();
         }
 
         private _disposePostProcesses(): void {

src/PostProcess/RenderPipeline/babylon.postProcessRenderPipeline.ts

@@ -10,7 +10,7 @@ module BABYLON {
         @serialize()
         public _name: string;
 
-        constructor(engine: Engine, name: string) {
+        constructor(private engine: Engine, name: string) {
             this._name = name;
 
             this._renderEffects = {};
@@ -143,6 +143,19 @@ module BABYLON {
             this._renderEffectsForIsolatedPass = new Array<PostProcessRenderEffect>();
         }
 
+        protected _enableMSAAOnFirstPostProcess():boolean{
+            // Set samples of the very first post process to 4 to enable native anti-aliasing in browsers that support webGL 2.0 (See: https://github.com/BabylonJS/Babylon.js/issues/3754)
+            var effectKeys = Object.keys(this._renderEffects);
+            if(this.engine.webGLVersion >= 2 && effectKeys.length > 0){
+                var postProcesses = this._renderEffects[effectKeys[0]].getPostProcesses();
+                if(postProcesses){
+                    postProcesses[0].samples = 4;
+                    return true;
+                }
+            }
+            return false;
+        }
+
         public dispose() {
            // Must be implemented by children 
         }

src/PostProcess/babylon.postProcess.ts

@@ -349,6 +349,12 @@
             var requiredWidth = ((sourceTexture ? sourceTexture.width : this._engine.getRenderWidth(true)) * <number>this._options) | 0;
             var requiredHeight = ((sourceTexture ? sourceTexture.height : this._engine.getRenderHeight(true)) * <number>this._options) | 0;
 
+            // If rendering to a webvr camera's left or right eye only half the width should be used to avoid resize when rendered to screen
+            var webVRCamera = (<WebVRFreeCamera>camera.parent);
+            if(webVRCamera && (webVRCamera.leftCamera == camera || webVRCamera.rightCamera == camera)){
+                requiredWidth/=2;
+            }
+
             var desiredWidth = ((<PostProcessOptions>this._options).width || requiredWidth);
             var desiredHeight = (<PostProcessOptions>this._options).height || requiredHeight;