Merge pull request #6961 from haxiomic/FixVignetteAspect2

Fix vignette aspect ratio when not using postProcessing

dist/preview release/what's new.md

@@ -189,6 +189,7 @@
 - Added missing callback triggers within texture loaders ([PierreLeBlond](https://github.com/PierreLeBlond))
 - Fixed `TextureLinkLineComponent` to no longer invert inspector-loaded textures ([Drigax](https://github.com/drigax))
 - Fixed a single frame drop after leaving webxr on some devices ([RaananW](https://github.com/RaananW/))
+- Fixed bug where vignette aspect ratio would be wrong when rendering direct to canvas
 
 ## Breaking changes
 

src/Materials/imageProcessingConfiguration.ts

@@ -494,9 +494,9 @@ export class ImageProcessingConfiguration {
     /**
      * Binds the image processing to the shader.
      * @param effect The effect to bind to
-     * @param aspectRatio Define the current aspect ratio of the effect
+     * @param overrideAspectRatio Override the aspect ratio of the effect
      */
-    public bind(effect: Effect, aspectRatio = 1): void {
+    public bind(effect: Effect, overrideAspectRatio?: number): void {
         // Color Curves
         if (this._colorCurvesEnabled && this.colorCurves) {
             ColorCurves.Bind(this.colorCurves, effect);
@@ -508,6 +508,8 @@ export class ImageProcessingConfiguration {
             var inverseHeight = 1 / effect.getEngine().getRenderHeight();
             effect.setFloat2("vInverseScreenSize", inverseWidth, inverseHeight);
 
+            let aspectRatio = overrideAspectRatio != null ? overrideAspectRatio : (inverseHeight / inverseWidth);
+
             let vignetteScaleY = Math.tan(this.vignetteCameraFov * 0.5);
             let vignetteScaleX = vignetteScaleY * aspectRatio;