Merge pull request #13220 from sebavan/Center

Support correct spelling on center Former-commit-id: b84c85cc9b8249400be19368d5381b0e1fe989fb
BabylonJS · Nov 9, 2022 · 32ceea1 · 32ceea1
2 parents ada2929 + e1bfc64
commit 32ceea1
Show file tree

Hide file tree

Showing 7 changed files with 79 additions and 22 deletions.
diff --git a/packages/dev/core/src/Materials/imageProcessingConfiguration.ts b/packages/dev/core/src/Materials/imageProcessingConfiguration.ts
@@ -272,16 +272,38 @@ export class ImageProcessingConfiguration {
     public vignetteStretch = 0;
 
     /**
-     * Vignette centre X Offset.
+     * Vignette center X Offset.
      */
     @serialize()
-    public vignetteCentreX = 0;
+    public vignetteCenterX = 0;
 
     /**
-     * Vignette centre Y Offset.
+     * Vignette center Y Offset.
      */
     @serialize()
-    public vignetteCentreY = 0;
+    public vignetteCenterY = 0;
+
+    /**
+     * Back Compat: Vignette center Y Offset.
+     * @deprecated use vignetteCenterY instead
+     */
+    public get vignetteCentreY(): number {
+        return this.vignetteCenterY;
+    }
+    public set vignetteCentreY(value: number) {
+        this.vignetteCenterY = value;
+    }
+
+    /**
+     * Back Compat: Vignette center X Offset.
+     * @deprecated use vignetteCenterX instead
+     */
+    public get vignetteCentreX(): number {
+        return this.vignetteCenterX;
+    }
+    public set vignetteCentreX(value: number) {
+        this.vignetteCenterX = value;
+    }
 
     /**
      * Vignette weight or intensity of the vignette effect.
@@ -602,7 +624,7 @@ export class ImageProcessingConfiguration {
                 vignetteScaleX = Tools.Mix(vignetteScaleX, vignetteScaleGeometricMean, this.vignetteStretch);
                 vignetteScaleY = Tools.Mix(vignetteScaleY, vignetteScaleGeometricMean, this.vignetteStretch);
 
-                effect.setFloat4("vignetteSettings1", vignetteScaleX, vignetteScaleY, -vignetteScaleX * this.vignetteCentreX, -vignetteScaleY * this.vignetteCentreY);
+                effect.setFloat4("vignetteSettings1", vignetteScaleX, vignetteScaleY, -vignetteScaleX * this.vignetteCenterX, -vignetteScaleY * this.vignetteCenterY);
 
                 const vignettePower = -2.0 * this.vignetteWeight;
                 effect.setFloat4("vignetteSettings2", this.vignetteColor.r, this.vignetteColor.g, this.vignetteColor.b, vignettePower);
@@ -652,7 +674,16 @@ export class ImageProcessingConfiguration {
      * @returns The parsed image processing
      */
     public static Parse(source: any): ImageProcessingConfiguration {
-        return SerializationHelper.Parse(() => new ImageProcessingConfiguration(), source, null, null);
+        const parsed = SerializationHelper.Parse(() => new ImageProcessingConfiguration(), source, null, null);
+        // Backward compatibility
+        if (source.vignetteCentreX !== undefined) {
+            parsed.vignetteCenterX = source.vignetteCentreX;
+        }
+        if (source.vignetteCentreY !== undefined) {
+            parsed.vignetteCenterY = source.vignetteCentreY;
+        }
+
+        return parsed;
     }
 
     // Static constants associated to the image processing.

diff --git a/packages/dev/core/src/PostProcesses/imageProcessingPostProcess.ts b/packages/dev/core/src/PostProcesses/imageProcessingPostProcess.ts
@@ -230,29 +230,53 @@ export class ImageProcessingPostProcess extends PostProcess {
     }
 
     /**
-     * Gets Vignette centre X Offset.
+     * Gets Vignette center X Offset.
+     * @deprecated use vignetteCenterX instead
      */
     public get vignetteCentreX(): number {
-        return this.imageProcessingConfiguration.vignetteCentreX;
+        return this.imageProcessingConfiguration.vignetteCenterX;
     }
     /**
-     * Sets Vignette centre X Offset.
+     * Sets Vignette center X Offset.
+     * @deprecated use vignetteCenterX instead
      */
     public set vignetteCentreX(value: number) {
-        this.imageProcessingConfiguration.vignetteCentreX = value;
+        this.imageProcessingConfiguration.vignetteCenterX = value;
     }
 
     /**
-     * Gets Vignette centre Y Offset.
+     * Gets Vignette center Y Offset.
+     * @deprecated use vignetteCenterY instead
      */
     public get vignetteCentreY(): number {
-        return this.imageProcessingConfiguration.vignetteCentreY;
+        return this.imageProcessingConfiguration.vignetteCenterY;
     }
     /**
-     * Sets Vignette centre Y Offset.
+     * Sets Vignette center Y Offset.
+     * @deprecated use vignetteCenterY instead
      */
     public set vignetteCentreY(value: number) {
-        this.imageProcessingConfiguration.vignetteCentreY = value;
+        this.imageProcessingConfiguration.vignetteCenterY = value;
+    }
+
+    /**
+     * Vignette center Y Offset.
+     */
+    public get vignetteCenterY(): number {
+        return this.imageProcessingConfiguration.vignetteCenterY;
+    }
+    public set vignetteCenterY(value: number) {
+        this.imageProcessingConfiguration.vignetteCenterY = value;
+    }
+
+    /**
+     * Vignette center X Offset.
+     */
+    public get vignetteCenterX(): number {
+        return this.imageProcessingConfiguration.vignetteCenterX;
+    }
+    public set vignetteCenterX(value: number) {
+        this.imageProcessingConfiguration.vignetteCenterX = value;
     }
 
     /**

diff --git a/...onTabs/tabs/propertyGrids/postProcesses/defaultRenderingPipelinePropertyGridComponent.tsx b/...onTabs/tabs/propertyGrids/postProcesses/defaultRenderingPipelinePropertyGridComponent.tsx
@@ -371,7 +371,7 @@ export class DefaultRenderingPipelinePropertyGridComponent extends React.Compone
                                 step={0.1}
                                 label="Vignette center X"
                                 target={renderPipeline.imageProcessing}
-                                propertyName="vignetteCentreX"
+                                propertyName="vignetteCenterX"
                                 onPropertyChangedObservable={this.props.onPropertyChangedObservable}
                             />
                             <SliderLineComponent
@@ -381,7 +381,7 @@ export class DefaultRenderingPipelinePropertyGridComponent extends React.Compone
                                 step={0.1}
                                 label="Vignette center Y"
                                 target={renderPipeline.imageProcessing}
-                                propertyName="vignetteCentreY"
+                                propertyName="vignetteCenterY"
                                 onPropertyChangedObservable={this.props.onPropertyChangedObservable}
                             />
                             <Color3LineComponent

diff --git a/...dev/inspector/src/components/actionTabs/tabs/propertyGrids/scenePropertyGridComponent.tsx b/...dev/inspector/src/components/actionTabs/tabs/propertyGrids/scenePropertyGridComponent.tsx
@@ -294,7 +294,7 @@ export class ScenePropertyGridComponent extends React.Component<IScenePropertyGr
                         step={0.1}
                         label="Vignette center X"
                         target={imageProcessing}
-                        propertyName="vignetteCentreX"
+                        propertyName="vignetteCenterX"
                         onPropertyChangedObservable={this.props.onPropertyChangedObservable}
                     />
                     <SliderLineComponent
@@ -304,7 +304,7 @@ export class ScenePropertyGridComponent extends React.Component<IScenePropertyGr
                         step={0.1}
                         label="Vignette center Y"
                         target={imageProcessing}
-                        propertyName="vignetteCentreY"
+                        propertyName="vignetteCenterY"
                         onPropertyChangedObservable={this.props.onPropertyChangedObservable}
                     />
                     <Color3LineComponent

diff --git a/packages/tools/viewer/public/renderOnlyViewer.html b/packages/tools/viewer/public/renderOnlyViewer.html
@@ -129,8 +129,8 @@
                 "ImageProcessing.BloomWeight": 0.0,
                 "ImageProcessing.BloomQuality": 2,
                 "ImageProcessing.VignetteWeight": 0.0,
-                "ImageProcessing.VignetteCentreX": 0.0,
-                "ImageProcessing.VignetteCentreY": 0.0,
+                "ImageProcessing.VignetteCenterX": 0.0,
+                "ImageProcessing.VignetteCenterY": 0.0,
                 "ImageProcessing.VignetteStretch": 0.5,
                 "ImageProcessing.VignetteColorR": 1.0,
                 "ImageProcessing.VignetteColorG": 1.0,

diff --git a/packages/tools/viewer/src/configuration/interfaces/imageProcessingConfiguration.ts b/packages/tools/viewer/src/configuration/interfaces/imageProcessingConfiguration.ts
@@ -28,6 +28,8 @@ export interface IImageProcessingConfiguration {
     vignetteStretch?: number;
     vignetteCentreX?: number;
     vignetteCentreY?: number;
+    vignetteCenterX?: number;
+    vignetteCenterY?: number;
     vignetteWeight?: number;
     vignetteColor?: { r: number; g: number; b: number; a?: number };
     vignetteCameraFov?: number;

diff --git a/packages/tools/viewer/src/configuration/types/extended.ts b/packages/tools/viewer/src/configuration/types/extended.ts
@@ -224,8 +224,8 @@ export const extendedConfiguration: ViewerConfiguration = {
             a: 1.0,
         },
         imageProcessingConfiguration: {
-            vignetteCentreX: 0,
-            vignetteCentreY: 0,
+            vignetteCenterX: 0,
+            vignetteCenterY: 0,
             vignetteColor: {
                 r: 0.086,
                 g: 0.184,