babylonjs-gui 5.42.0 → 5.42.2

package/babylon.gui.d.ts

@@ -72,6 +72,7 @@ declare module BABYLON.GUI {
         private _canvasPointerOutObserver;
         private _canvasBlurObserver;
         private _controlAddedObserver;
+        private _controlRemovedObserver;
         private _background;
         /** @internal */
         _rootContainer: Container;
@@ -107,6 +108,7 @@ declare module BABYLON.GUI {
         private _rootElement;
         private _cursorChanged;
         private _defaultMousePointerId;
+        private _rootChildrenHaveChanged;
         /** @internal */
         _capturedPointerIds: Set<number>;
         /** @internal */

package/babylon.gui.js

@@ -522,6 +522,7 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
         _this._renderScale = 1;
         _this._cursorChanged = false;
         _this._defaultMousePointerId = 0;
+        _this._rootChildrenHaveChanged = false;
         /** @internal */
         _this._capturedPointerIds = new Set();
         /** @internal */
@@ -617,9 +618,15 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
         _this.applyYInversionOnUpdate = invertY;
         _this._rootElement = scene.getEngine().getInputElement();
         _this._renderObserver = scene.onBeforeCameraRenderObservable.add(function (camera) { return _this._checkUpdate(camera); });
+        /** Whenever a control is added or removed to the root, we have to recheck the camera projection as it can have changed  */
         _this._controlAddedObserver = _this._rootContainer.onControlAddedObservable.add(function (control) {
-            if (control && _this._scene && _this._scene.activeCamera) {
-                _this._checkUpdate(_this._scene.activeCamera);
+            if (control) {
+                _this._rootChildrenHaveChanged = true;
+            }
+        });
+        _this._controlRemovedObserver = _this._rootContainer.onControlRemovedObservable.add(function (control) {
+            if (control) {
+                _this._rootChildrenHaveChanged = true;
             }
         });
         _this._preKeyboardObserver = scene.onPreKeyboardObservable.add(function (info) {
@@ -1081,6 +1088,9 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
         if (this._controlAddedObserver) {
             this._rootContainer.onControlAddedObservable.remove(this._controlAddedObserver);
         }
+        if (this._controlRemovedObserver) {
+            this._rootContainer.onControlRemovedObservable.remove(this._controlRemovedObserver);
+        }
         if (this._layerToDispose) {
             this._layerToDispose.texture = null;
             this._layerToDispose.dispose();
@@ -1161,7 +1171,7 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
         var projectedPosition = core_Misc_observable__WEBPACK_IMPORTED_MODULE_1__.Vector3.Project(position, worldMatrix, scene.getTransformMatrix(), globalViewport);
         return new core_Misc_observable__WEBPACK_IMPORTED_MODULE_1__.Vector3(projectedPosition.x, projectedPosition.y, projectedPosition.z);
     };
-    AdvancedDynamicTexture.prototype._checkUpdate = function (camera) {
+    AdvancedDynamicTexture.prototype._checkUpdate = function (camera, skipUpdate) {
         if (this._layerToDispose) {
             if ((camera.layerMask & this._layerToDispose.layerMask) === 0) {
                 return;
@@ -1206,16 +1216,27 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
             return;
         }
         this._isDirty = false;
-        this._render();
-        this.update(this.applyYInversionOnUpdate, this.premulAlpha, AdvancedDynamicTexture.AllowGPUOptimizations);
+        this._render(skipUpdate);
+        if (!skipUpdate) {
+            this.update(this.applyYInversionOnUpdate, this.premulAlpha, AdvancedDynamicTexture.AllowGPUOptimizations);
+        }
     };
-    AdvancedDynamicTexture.prototype._render = function () {
+    AdvancedDynamicTexture.prototype._render = function (skipRender) {
+        var _a;
         var textureSize = this.getSize();
         var renderWidth = textureSize.width;
         var renderHeight = textureSize.height;
         var context = this.getContext();
         context.font = "18px Arial";
         context.strokeStyle = "white";
+        /** We have to recheck the camera projection in the case the root control's children have changed  */
+        if (this._rootChildrenHaveChanged) {
+            var camera = (_a = this.getScene()) === null || _a === void 0 ? void 0 : _a.activeCamera;
+            if (camera) {
+                this._rootChildrenHaveChanged = false;
+                this._checkUpdate(camera, true);
+            }
+        }
         // Layout
         this.onBeginLayoutObservable.notifyObservers(this);
         var measure = new _measure__WEBPACK_IMPORTED_MODULE_5__.Measure(0, 0, renderWidth, renderHeight);
@@ -1223,6 +1244,9 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
         this._rootContainer._layout(measure, context);
         this.onEndLayoutObservable.notifyObservers(this);
         this._isDirty = false; // Restoring the dirty state that could have been set by controls during layout processing
+        if (skipRender) {
+            return;
+        }
         // Clear
         if (this._invalidatedRectangle) {
             this._clearMeasure.copyFrom(this._invalidatedRectangle);
@@ -5859,6 +5883,9 @@ var Control = /** @class */ (function () {
                 newTop = oldTop;
             }
         }
+        if (oldLeft === newLeft && oldTop === newTop) {
+            return;
+        }
         this.left = newLeft + "px";
         this.top = newTop + "px";
         this._left.ignoreAdaptiveScaling = true;