@babylonjs/gui 5.20.0 → 5.22.1

package/2D/advancedDynamicTexture.js

@@ -1,6 +1,5 @@
-import { __awaiter, __extends, __generator } from "tslib";
 import { Observable } from "@babylonjs/core/Misc/observable.js";
-import { Vector2, Vector3 } from "@babylonjs/core/Maths/math.vector.js";
+import { Vector2, Vector3, TmpVectors } from "@babylonjs/core/Maths/math.vector.js";
 import { Tools } from "@babylonjs/core/Misc/tools.js";
 import { PointerEventTypes } from "@babylonjs/core/Events/pointerEvents.js";
 import { ClipboardEventTypes, ClipboardInfo } from "@babylonjs/core/Events/clipboardEvents.js";
@@ -22,8 +21,7 @@ import { GetClass } from "@babylonjs/core/Misc/typeStore.js";
  * Class used to create texture to support 2D GUI elements
  * @see https://doc.babylonjs.com/how_to/gui
  */
-var AdvancedDynamicTexture = /** @class */ (function (_super) {
-    __extends(AdvancedDynamicTexture, _super);
+export class AdvancedDynamicTexture extends DynamicTexture {
     /**
      * Creates a new AdvancedDynamicTexture
      * @param name defines the name of the texture
@@ -34,114 +32,111 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
      * @param samplingMode defines the texture sampling mode (Texture.NEAREST_SAMPLINGMODE by default)
      * @param invertY defines if the texture needs to be inverted on the y axis during loading (true by default)
      */
-    function AdvancedDynamicTexture(name, width, height, scene, generateMipMaps, samplingMode, invertY) {
-        if (width === void 0) { width = 0; }
-        if (height === void 0) { height = 0; }
-        if (generateMipMaps === void 0) { generateMipMaps = false; }
-        if (samplingMode === void 0) { samplingMode = Texture.NEAREST_SAMPLINGMODE; }
-        if (invertY === void 0) { invertY = true; }
-        var _this = _super.call(this, name, { width: width, height: height }, scene, generateMipMaps, samplingMode, Constants.TEXTUREFORMAT_RGBA, invertY) || this;
-        _this._isDirty = false;
+    constructor(name, width = 0, height = 0, scene, generateMipMaps = false, samplingMode = Texture.NEAREST_SAMPLINGMODE, invertY = true) {
+        super(name, { width: width, height: height }, scene, generateMipMaps, samplingMode, Constants.TEXTUREFORMAT_RGBA, invertY);
+        this._isDirty = false;
+        /** @hidden */
+        this._rootContainer = new Container("root");
         /** @hidden */
-        _this._rootContainer = new Container("root");
+        this._lastControlOver = {};
         /** @hidden */
-        _this._lastControlOver = {};
+        this._lastControlDown = {};
         /** @hidden */
-        _this._lastControlDown = {};
+        this._capturingControl = {};
         /** @hidden */
-        _this._capturingControl = {};
+        this._linkedControls = new Array();
+        this._isFullscreen = false;
+        this._fullscreenViewport = new Viewport(0, 0, 1, 1);
+        this._idealWidth = 0;
+        this._idealHeight = 0;
+        this._useSmallestIdeal = false;
+        this._renderAtIdealSize = false;
+        this._blockNextFocusCheck = false;
+        this._renderScale = 1;
+        this._cursorChanged = false;
+        this._defaultMousePointerId = 0;
         /** @hidden */
-        _this._linkedControls = new Array();
-        _this._isFullscreen = false;
-        _this._fullscreenViewport = new Viewport(0, 0, 1, 1);
-        _this._idealWidth = 0;
-        _this._idealHeight = 0;
-        _this._useSmallestIdeal = false;
-        _this._renderAtIdealSize = false;
-        _this._blockNextFocusCheck = false;
-        _this._renderScale = 1;
-        _this._cursorChanged = false;
-        _this._defaultMousePointerId = 0;
+        this._capturedPointerIds = new Set();
         /** @hidden */
-        _this._numLayoutCalls = 0;
+        this._numLayoutCalls = 0;
         /** @hidden */
-        _this._numRenderCalls = 0;
+        this._numRenderCalls = 0;
         /**
          * Define type to string to ensure compatibility across browsers
          * Safari doesn't support DataTransfer constructor
          */
-        _this._clipboardData = "";
+        this._clipboardData = "";
         /**
          * Observable event triggered each time an clipboard event is received from the rendering canvas
          */
-        _this.onClipboardObservable = new Observable();
+        this.onClipboardObservable = new Observable();
         /**
          * Observable event triggered each time a pointer down is intercepted by a control
          */
-        _this.onControlPickedObservable = new Observable();
+        this.onControlPickedObservable = new Observable();
         /**
          * Observable event triggered before layout is evaluated
          */
-        _this.onBeginLayoutObservable = new Observable();
+        this.onBeginLayoutObservable = new Observable();
         /**
          * Observable event triggered after the layout was evaluated
          */
-        _this.onEndLayoutObservable = new Observable();
+        this.onEndLayoutObservable = new Observable();
         /**
          * Observable event triggered before the texture is rendered
          */
-        _this.onBeginRenderObservable = new Observable();
+        this.onBeginRenderObservable = new Observable();
         /**
          * Observable event triggered after the texture was rendered
          */
-        _this.onEndRenderObservable = new Observable();
+        this.onEndRenderObservable = new Observable();
         /**
          * Gets or sets a boolean defining if alpha is stored as premultiplied
          */
-        _this.premulAlpha = false;
+        this.premulAlpha = false;
         /**
          * Gets or sets a boolean indicating that the canvas must be reverted on Y when updating the texture
          */
-        _this.applyYInversionOnUpdate = true;
+        this.applyYInversionOnUpdate = true;
         /**
          * If set to true, every scene render will trigger a pointer event for the GUI
          * if it is linked to a mesh or has controls linked to a mesh. This will allow
          * you to catch the pointer moving around the GUI due to camera or mesh movements,
          * but it has a performance cost.
          */
-        _this.checkPointerEveryFrame = false;
-        _this._useInvalidateRectOptimization = true;
+        this.checkPointerEveryFrame = false;
+        this._useInvalidateRectOptimization = true;
         // Invalidated rectangle which is the combination of all invalidated controls after they have been rotated into absolute position
-        _this._invalidatedRectangle = null;
-        _this._clearMeasure = new Measure(0, 0, 0, 0);
+        this._invalidatedRectangle = null;
+        this._clearMeasure = new Measure(0, 0, 0, 0);
         /**
          * @param rawEvt
          * @hidden
          */
-        _this._onClipboardCopy = function (rawEvt) {
-            var evt = rawEvt;
-            var ev = new ClipboardInfo(ClipboardEventTypes.COPY, evt);
-            _this.onClipboardObservable.notifyObservers(ev);
+        this._onClipboardCopy = (rawEvt) => {
+            const evt = rawEvt;
+            const ev = new ClipboardInfo(ClipboardEventTypes.COPY, evt);
+            this.onClipboardObservable.notifyObservers(ev);
             evt.preventDefault();
         };
         /**
          * @param rawEvt
          * @hidden
          */
-        _this._onClipboardCut = function (rawEvt) {
-            var evt = rawEvt;
-            var ev = new ClipboardInfo(ClipboardEventTypes.CUT, evt);
-            _this.onClipboardObservable.notifyObservers(ev);
+        this._onClipboardCut = (rawEvt) => {
+            const evt = rawEvt;
+            const ev = new ClipboardInfo(ClipboardEventTypes.CUT, evt);
+            this.onClipboardObservable.notifyObservers(ev);
             evt.preventDefault();
         };
         /**
          * @param rawEvt
          * @hidden
          */
-        _this._onClipboardPaste = function (rawEvt) {
-            var evt = rawEvt;
-            var ev = new ClipboardInfo(ClipboardEventTypes.PASTE, evt);
-            _this.onClipboardObservable.notifyObservers(ev);
+        this._onClipboardPaste = (rawEvt) => {
+            const evt = rawEvt;
+            const ev = new ClipboardInfo(ClipboardEventTypes.PASTE, evt);
+            this.onClipboardObservable.notifyObservers(ev);
             evt.preventDefault();
         };
         /**
@@ -150,340 +145,278 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
          * @param scaleToSize defines whether to scale to texture to the saved size
          * @deprecated Please use parseSerializedObject instead
          */
-        _this.parseContent = _this.parseSerializedObject;
-        scene = _this.getScene();
-        if (!scene || !_this._texture) {
-            return _this;
-        }
-        _this.applyYInversionOnUpdate = invertY;
-        _this._rootElement = scene.getEngine().getInputElement();
-        _this._renderObserver = scene.onBeforeCameraRenderObservable.add(function (camera) { return _this._checkUpdate(camera); });
-        _this._preKeyboardObserver = scene.onPreKeyboardObservable.add(function (info) {
-            if (!_this._focusedControl) {
+        this.parseContent = this.parseSerializedObject;
+        scene = this.getScene();
+        if (!scene || !this._texture) {
+            return;
+        }
+        this.applyYInversionOnUpdate = invertY;
+        this._rootElement = scene.getEngine().getInputElement();
+        this._renderObserver = scene.onBeforeCameraRenderObservable.add((camera) => this._checkUpdate(camera));
+        this._preKeyboardObserver = scene.onPreKeyboardObservable.add((info) => {
+            if (!this._focusedControl) {
                 return;
             }
             if (info.type === KeyboardEventTypes.KEYDOWN) {
-                _this._focusedControl.processKeyboard(info.event);
+                this._focusedControl.processKeyboard(info.event);
             }
             info.skipOnPointerObservable = true;
         });
-        _this._rootContainer._link(_this);
-        _this.hasAlpha = true;
+        this._rootContainer._link(this);
+        this.hasAlpha = true;
         if (!width || !height) {
-            _this._resizeObserver = scene.getEngine().onResizeObservable.add(function () { return _this._onResize(); });
-            _this._onResize();
-        }
-        _this._texture.isReady = true;
-        return _this;
-    }
-    Object.defineProperty(AdvancedDynamicTexture.prototype, "numLayoutCalls", {
-        /** Gets the number of layout calls made the last time the ADT has been rendered */
-        get: function () {
-            return this._numLayoutCalls;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(AdvancedDynamicTexture.prototype, "numRenderCalls", {
-        /** Gets the number of render calls made the last time the ADT has been rendered */
-        get: function () {
-            return this._numRenderCalls;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(AdvancedDynamicTexture.prototype, "renderScale", {
-        /**
-         * Gets or sets a number used to scale rendering size (2 means that the texture will be twice bigger).
-         * Useful when you want more antialiasing
-         */
-        get: function () {
-            return this._renderScale;
-        },
-        set: function (value) {
-            if (value === this._renderScale) {
-                return;
-            }
-            this._renderScale = value;
-            this._onResize();
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(AdvancedDynamicTexture.prototype, "background", {
-        /** Gets or sets the background color */
-        get: function () {
-            return this._background;
-        },
-        set: function (value) {
-            if (this._background === value) {
-                return;
-            }
-            this._background = value;
-            this.markAsDirty();
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(AdvancedDynamicTexture.prototype, "idealWidth", {
-        /**
-         * Gets or sets the ideal width used to design controls.
-         * The GUI will then rescale everything accordingly
-         * @see https://doc.babylonjs.com/how_to/gui#adaptive-scaling
-         */
-        get: function () {
-            return this._idealWidth;
-        },
-        set: function (value) {
-            if (this._idealWidth === value) {
-                return;
-            }
-            this._idealWidth = value;
-            this.markAsDirty();
-            this._rootContainer._markAllAsDirty();
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(AdvancedDynamicTexture.prototype, "idealHeight", {
-        /**
-         * Gets or sets the ideal height used to design controls.
-         * The GUI will then rescale everything accordingly
-         * @see https://doc.babylonjs.com/how_to/gui#adaptive-scaling
-         */
-        get: function () {
-            return this._idealHeight;
-        },
-        set: function (value) {
-            if (this._idealHeight === value) {
-                return;
-            }
-            this._idealHeight = value;
-            this.markAsDirty();
-            this._rootContainer._markAllAsDirty();
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(AdvancedDynamicTexture.prototype, "useSmallestIdeal", {
-        /**
-         * Gets or sets a boolean indicating if the smallest ideal value must be used if idealWidth and idealHeight are both set
-         * @see https://doc.babylonjs.com/how_to/gui#adaptive-scaling
-         */
-        get: function () {
-            return this._useSmallestIdeal;
-        },
-        set: function (value) {
-            if (this._useSmallestIdeal === value) {
-                return;
-            }
-            this._useSmallestIdeal = value;
-            this.markAsDirty();
-            this._rootContainer._markAllAsDirty();
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(AdvancedDynamicTexture.prototype, "renderAtIdealSize", {
-        /**
-         * Gets or sets a boolean indicating if adaptive scaling must be used
-         * @see https://doc.babylonjs.com/how_to/gui#adaptive-scaling
-         */
-        get: function () {
-            return this._renderAtIdealSize;
-        },
-        set: function (value) {
-            if (this._renderAtIdealSize === value) {
-                return;
-            }
-            this._renderAtIdealSize = value;
+            this._resizeObserver = scene.getEngine().onResizeObservable.add(() => this._onResize());
             this._onResize();
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(AdvancedDynamicTexture.prototype, "idealRatio", {
-        /**
-         * Gets the ratio used when in "ideal mode"
-         * @see https://doc.babylonjs.com/how_to/gui#adaptive-scaling
-         * */
-        get: function () {
-            var rwidth = 0;
-            var rheight = 0;
-            if (this._idealWidth) {
-                rwidth = this.getSize().width / this._idealWidth;
-            }
-            if (this._idealHeight) {
-                rheight = this.getSize().height / this._idealHeight;
-            }
-            if (this._useSmallestIdeal && this._idealWidth && this._idealHeight) {
-                return window.innerWidth < window.innerHeight ? rwidth : rheight;
-            }
-            if (this._idealWidth) {
-                // horizontal
-                return rwidth;
-            }
-            if (this._idealHeight) {
-                // vertical
-                return rheight;
-            }
-            return 1;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(AdvancedDynamicTexture.prototype, "layer", {
-        /**
-         * Gets the underlying layer used to render the texture when in fullscreen mode
-         */
-        get: function () {
-            return this._layerToDispose;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(AdvancedDynamicTexture.prototype, "rootContainer", {
-        /**
-         * Gets the root container control
-         */
-        get: function () {
-            return this._rootContainer;
-        },
-        enumerable: false,
-        configurable: true
-    });
+        }
+        this._texture.isReady = true;
+    }
+    /** Gets the number of layout calls made the last time the ADT has been rendered */
+    get numLayoutCalls() {
+        return this._numLayoutCalls;
+    }
+    /** Gets the number of render calls made the last time the ADT has been rendered */
+    get numRenderCalls() {
+        return this._numRenderCalls;
+    }
+    /**
+     * Gets or sets a number used to scale rendering size (2 means that the texture will be twice bigger).
+     * Useful when you want more antialiasing
+     */
+    get renderScale() {
+        return this._renderScale;
+    }
+    set renderScale(value) {
+        if (value === this._renderScale) {
+            return;
+        }
+        this._renderScale = value;
+        this._onResize();
+    }
+    /** Gets or sets the background color */
+    get background() {
+        return this._background;
+    }
+    set background(value) {
+        if (this._background === value) {
+            return;
+        }
+        this._background = value;
+        this.markAsDirty();
+    }
+    /**
+     * Gets or sets the ideal width used to design controls.
+     * The GUI will then rescale everything accordingly
+     * @see https://doc.babylonjs.com/how_to/gui#adaptive-scaling
+     */
+    get idealWidth() {
+        return this._idealWidth;
+    }
+    set idealWidth(value) {
+        if (this._idealWidth === value) {
+            return;
+        }
+        this._idealWidth = value;
+        this.markAsDirty();
+        this._rootContainer._markAllAsDirty();
+    }
+    /**
+     * Gets or sets the ideal height used to design controls.
+     * The GUI will then rescale everything accordingly
+     * @see https://doc.babylonjs.com/how_to/gui#adaptive-scaling
+     */
+    get idealHeight() {
+        return this._idealHeight;
+    }
+    set idealHeight(value) {
+        if (this._idealHeight === value) {
+            return;
+        }
+        this._idealHeight = value;
+        this.markAsDirty();
+        this._rootContainer._markAllAsDirty();
+    }
+    /**
+     * Gets or sets a boolean indicating if the smallest ideal value must be used if idealWidth and idealHeight are both set
+     * @see https://doc.babylonjs.com/how_to/gui#adaptive-scaling
+     */
+    get useSmallestIdeal() {
+        return this._useSmallestIdeal;
+    }
+    set useSmallestIdeal(value) {
+        if (this._useSmallestIdeal === value) {
+            return;
+        }
+        this._useSmallestIdeal = value;
+        this.markAsDirty();
+        this._rootContainer._markAllAsDirty();
+    }
+    /**
+     * Gets or sets a boolean indicating if adaptive scaling must be used
+     * @see https://doc.babylonjs.com/how_to/gui#adaptive-scaling
+     */
+    get renderAtIdealSize() {
+        return this._renderAtIdealSize;
+    }
+    set renderAtIdealSize(value) {
+        if (this._renderAtIdealSize === value) {
+            return;
+        }
+        this._renderAtIdealSize = value;
+        this._onResize();
+    }
+    /**
+     * Gets the ratio used when in "ideal mode"
+     * @see https://doc.babylonjs.com/how_to/gui#adaptive-scaling
+     * */
+    get idealRatio() {
+        let rwidth = 0;
+        let rheight = 0;
+        if (this._idealWidth) {
+            rwidth = this.getSize().width / this._idealWidth;
+        }
+        if (this._idealHeight) {
+            rheight = this.getSize().height / this._idealHeight;
+        }
+        if (this._useSmallestIdeal && this._idealWidth && this._idealHeight) {
+            return window.innerWidth < window.innerHeight ? rwidth : rheight;
+        }
+        if (this._idealWidth) {
+            // horizontal
+            return rwidth;
+        }
+        if (this._idealHeight) {
+            // vertical
+            return rheight;
+        }
+        return 1;
+    }
+    /**
+     * Gets the underlying layer used to render the texture when in fullscreen mode
+     */
+    get layer() {
+        return this._layerToDispose;
+    }
+    /**
+     * Gets the root container control
+     */
+    get rootContainer() {
+        return this._rootContainer;
+    }
     /**
      * Returns an array containing the root container.
      * This is mostly used to let the Inspector introspects the ADT
      * @returns an array containing the rootContainer
      */
-    AdvancedDynamicTexture.prototype.getChildren = function () {
+    getChildren() {
         return [this._rootContainer];
-    };
+    }
     /**
      * Will return all controls that are inside this texture
      * @param directDescendantsOnly defines if true only direct descendants of 'this' will be considered, if false direct and also indirect (children of children, an so on in a recursive manner) descendants of 'this' will be considered
      * @param predicate defines an optional predicate that will be called on every evaluated child, the predicate must return true for a given child to be part of the result, otherwise it will be ignored
      * @return all child controls
      */
-    AdvancedDynamicTexture.prototype.getDescendants = function (directDescendantsOnly, predicate) {
+    getDescendants(directDescendantsOnly, predicate) {
         return this._rootContainer.getDescendants(directDescendantsOnly, predicate);
-    };
+    }
     /**
      * Will return all controls with the given type name
      * @param typeName defines the type name to search for
      * @returns an array of all controls found
      */
-    AdvancedDynamicTexture.prototype.getControlsByType = function (typeName) {
-        return this._rootContainer.getDescendants(false, function (control) { return control.typeName === typeName; });
-    };
+    getControlsByType(typeName) {
+        return this._rootContainer.getDescendants(false, (control) => control.typeName === typeName);
+    }
     /**
      * Will return the first control with the given name
      * @param name defines the name to search for
      * @return the first control found or null
      */
-    AdvancedDynamicTexture.prototype.getControlByName = function (name) {
+    getControlByName(name) {
         return this._getControlByKey("name", name);
-    };
-    AdvancedDynamicTexture.prototype._getControlByKey = function (key, value) {
-        return this._rootContainer.getDescendants().find(function (control) { return control[key] === value; }) || null;
-    };
-    Object.defineProperty(AdvancedDynamicTexture.prototype, "focusedControl", {
-        /**
-         * Gets or sets the current focused control
-         */
-        get: function () {
-            return this._focusedControl;
-        },
-        set: function (control) {
-            if (this._focusedControl == control) {
-                return;
-            }
-            if (this._focusedControl) {
-                this._focusedControl.onBlur();
-            }
-            if (control) {
-                control.onFocus();
-            }
-            this._focusedControl = control;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(AdvancedDynamicTexture.prototype, "isForeground", {
-        /**
-         * Gets or sets a boolean indicating if the texture must be rendered in background or foreground when in fullscreen mode
-         */
-        get: function () {
-            if (!this.layer) {
-                return true;
-            }
-            return !this.layer.isBackground;
-        },
-        set: function (value) {
-            if (!this.layer) {
-                return;
-            }
-            if (this.layer.isBackground === !value) {
-                return;
-            }
-            this.layer.isBackground = !value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(AdvancedDynamicTexture.prototype, "clipboardData", {
-        /**
-         * Gets or set information about clipboardData
-         */
-        get: function () {
-            return this._clipboardData;
-        },
-        set: function (value) {
-            this._clipboardData = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
+    }
+    _getControlByKey(key, value) {
+        return this._rootContainer.getDescendants().find((control) => control[key] === value) || null;
+    }
+    /**
+     * Gets or sets the current focused control
+     */
+    get focusedControl() {
+        return this._focusedControl;
+    }
+    set focusedControl(control) {
+        if (this._focusedControl == control) {
+            return;
+        }
+        if (this._focusedControl) {
+            this._focusedControl.onBlur();
+        }
+        if (control) {
+            control.onFocus();
+        }
+        this._focusedControl = control;
+    }
+    /**
+     * Gets or sets a boolean indicating if the texture must be rendered in background or foreground when in fullscreen mode
+     */
+    get isForeground() {
+        if (!this.layer) {
+            return true;
+        }
+        return !this.layer.isBackground;
+    }
+    set isForeground(value) {
+        if (!this.layer) {
+            return;
+        }
+        if (this.layer.isBackground === !value) {
+            return;
+        }
+        this.layer.isBackground = !value;
+    }
+    /**
+     * Gets or set information about clipboardData
+     */
+    get clipboardData() {
+        return this._clipboardData;
+    }
+    set clipboardData(value) {
+        this._clipboardData = value;
+    }
     /**
      * Get the current class name of the texture useful for serialization or dynamic coding.
      * @returns "AdvancedDynamicTexture"
      */
-    AdvancedDynamicTexture.prototype.getClassName = function () {
+    getClassName() {
         return "AdvancedDynamicTexture";
-    };
+    }
     /**
      * Function used to execute a function on all controls
      * @param func defines the function to execute
      * @param container defines the container where controls belong. If null the root container will be used
      */
-    AdvancedDynamicTexture.prototype.executeOnAllControls = function (func, container) {
+    executeOnAllControls(func, container) {
         if (!container) {
             container = this._rootContainer;
         }
         func(container);
-        for (var _i = 0, _a = container.children; _i < _a.length; _i++) {
-            var child = _a[_i];
+        for (const child of container.children) {
             if (child.children) {
                 this.executeOnAllControls(func, child);
                 continue;
             }
             func(child);
         }
-    };
-    Object.defineProperty(AdvancedDynamicTexture.prototype, "useInvalidateRectOptimization", {
-        /**
-         * Gets or sets a boolean indicating if the InvalidateRect optimization should be turned on
-         */
-        get: function () {
-            return this._useInvalidateRectOptimization;
-        },
-        set: function (value) {
-            this._useInvalidateRectOptimization = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
+    }
+    /**
+     * Gets or sets a boolean indicating if the InvalidateRect optimization should be turned on
+     */
+    get useInvalidateRectOptimization() {
+        return this._useInvalidateRectOptimization;
+    }
+    set useInvalidateRectOptimization(value) {
+        this._useInvalidateRectOptimization = value;
+    }
     /**
      * Invalidates a rectangle area on the gui texture
      * @param invalidMinX left most position of the rectangle to invalidate in the texture
@@ -491,7 +424,7 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
      * @param invalidMaxX right most position of the rectangle to invalidate in the texture
      * @param invalidMaxY bottom most position of the rectangle to invalidate in the texture
      */
-    AdvancedDynamicTexture.prototype.invalidateRect = function (invalidMinX, invalidMinY, invalidMaxX, invalidMaxY) {
+    invalidateRect(invalidMinX, invalidMinY, invalidMaxX, invalidMaxY) {
         if (!this._useInvalidateRectOptimization) {
             return;
         }
@@ -500,46 +433,46 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
         }
         else {
             // Compute intersection
-            var maxX = Math.ceil(Math.max(this._invalidatedRectangle.left + this._invalidatedRectangle.width - 1, invalidMaxX));
-            var maxY = Math.ceil(Math.max(this._invalidatedRectangle.top + this._invalidatedRectangle.height - 1, invalidMaxY));
+            const maxX = Math.ceil(Math.max(this._invalidatedRectangle.left + this._invalidatedRectangle.width - 1, invalidMaxX));
+            const maxY = Math.ceil(Math.max(this._invalidatedRectangle.top + this._invalidatedRectangle.height - 1, invalidMaxY));
             this._invalidatedRectangle.left = Math.floor(Math.min(this._invalidatedRectangle.left, invalidMinX));
             this._invalidatedRectangle.top = Math.floor(Math.min(this._invalidatedRectangle.top, invalidMinY));
             this._invalidatedRectangle.width = maxX - this._invalidatedRectangle.left + 1;
             this._invalidatedRectangle.height = maxY - this._invalidatedRectangle.top + 1;
         }
-    };
+    }
     /**
      * Marks the texture as dirty forcing a complete update
      */
-    AdvancedDynamicTexture.prototype.markAsDirty = function () {
+    markAsDirty() {
         this._isDirty = true;
-    };
+    }
     /**
      * Helper function used to create a new style
      * @returns a new style
      * @see https://doc.babylonjs.com/how_to/gui#styles
      */
-    AdvancedDynamicTexture.prototype.createStyle = function () {
+    createStyle() {
         return new Style(this);
-    };
+    }
     /**
      * Adds a new control to the root container
      * @param control defines the control to add
      * @returns the current texture
      */
-    AdvancedDynamicTexture.prototype.addControl = function (control) {
+    addControl(control) {
         this._rootContainer.addControl(control);
         return this;
-    };
+    }
     /**
      * Removes a control from the root container
      * @param control defines the control to remove
      * @returns the current texture
      */
-    AdvancedDynamicTexture.prototype.removeControl = function (control) {
+    removeControl(control) {
         this._rootContainer.removeControl(control);
         return this;
-    };
+    }
     /**
      * Moves overlapped controls towards a position where it is not overlapping anymore.
      * Please note that this method alters linkOffsetXInPixels and linkOffsetYInPixels.
@@ -547,28 +480,25 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
      * @param deltaStep the step size (speed) to reach the target non overlapping position (default 0.1)
      * @param repelFactor how much is the control repelled by other controls
      */
-    AdvancedDynamicTexture.prototype.moveToNonOverlappedPosition = function (overlapGroup, deltaStep, repelFactor) {
-        if (deltaStep === void 0) { deltaStep = 1; }
-        if (repelFactor === void 0) { repelFactor = 1; }
-        var controlsForGroup;
+    moveToNonOverlappedPosition(overlapGroup, deltaStep = 1, repelFactor = 1) {
+        let controlsForGroup;
         if (Array.isArray(overlapGroup)) {
             controlsForGroup = overlapGroup;
         }
         else {
-            var descendants = this.getDescendants(true);
+            const descendants = this.getDescendants(true);
             // get only the controls with an overlapGroup property set
             // if the overlapGroup parameter is set, filter the controls and get only the controls belonging to that overlapGroup
-            controlsForGroup = overlapGroup === undefined ? descendants.filter(function (c) { return c.overlapGroup !== undefined; }) : descendants.filter(function (c) { return c.overlapGroup === overlapGroup; });
+            controlsForGroup = overlapGroup === undefined ? descendants.filter((c) => c.overlapGroup !== undefined) : descendants.filter((c) => c.overlapGroup === overlapGroup);
         }
-        controlsForGroup.forEach(function (control1) {
-            var _a;
-            var velocity = Vector2.Zero();
-            var center = new Vector2(control1.centerX, control1.centerY);
-            controlsForGroup.forEach(function (control2) {
+        controlsForGroup.forEach((control1) => {
+            let velocity = Vector2.Zero();
+            const center = new Vector2(control1.centerX, control1.centerY);
+            controlsForGroup.forEach((control2) => {
                 if (control1 !== control2 && AdvancedDynamicTexture._Overlaps(control1, control2)) {
                     // if the two controls overlaps get a direction vector from one control's center to another control's center
-                    var diff = center.subtract(new Vector2(control2.centerX, control2.centerY));
-                    var diffLength = diff.length();
+                    const diff = center.subtract(new Vector2(control2.centerX, control2.centerY));
+                    const diffLength = diff.length();
                     if (diffLength > 0) {
                         // calculate the velocity
                         velocity = velocity.add(diff.normalize().scale(repelFactor / diffLength));
@@ -577,17 +507,17 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
             });
             if (velocity.length() > 0) {
                 // move the control along the direction vector away from the overlapping control
-                velocity = velocity.normalize().scale(deltaStep * ((_a = control1.overlapDeltaMultiplier) !== null && _a !== void 0 ? _a : 1));
+                velocity = velocity.normalize().scale(deltaStep * (control1.overlapDeltaMultiplier ?? 1));
                 control1.linkOffsetXInPixels += velocity.x;
                 control1.linkOffsetYInPixels += velocity.y;
             }
         });
-    };
+    }
     /**
      * Release all resources
      */
-    AdvancedDynamicTexture.prototype.dispose = function () {
-        var scene = this.getScene();
+    dispose() {
+        const scene = this.getScene();
         if (!scene) {
             return;
         }
@@ -626,18 +556,18 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
         this.onEndRenderObservable.clear();
         this.onBeginLayoutObservable.clear();
         this.onEndLayoutObservable.clear();
-        _super.prototype.dispose.call(this);
-    };
-    AdvancedDynamicTexture.prototype._onResize = function () {
-        var scene = this.getScene();
+        super.dispose();
+    }
+    _onResize() {
+        const scene = this.getScene();
         if (!scene) {
             return;
         }
         // Check size
-        var engine = scene.getEngine();
-        var textureSize = this.getSize();
-        var renderWidth = engine.getRenderWidth() * this._renderScale;
-        var renderHeight = engine.getRenderHeight() * this._renderScale;
+        const engine = scene.getEngine();
+        const textureSize = this.getSize();
+        let renderWidth = engine.getRenderWidth() * this._renderScale;
+        let renderHeight = engine.getRenderHeight() * this._renderScale;
         if (this._renderAtIdealSize) {
             if (this._idealWidth) {
                 renderHeight = (renderHeight * this._idealWidth) / renderWidth;
@@ -656,79 +586,75 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
             }
         }
         this.invalidateRect(0, 0, textureSize.width - 1, textureSize.height - 1);
-    };
+    }
     /** @hidden */
-    AdvancedDynamicTexture.prototype._getGlobalViewport = function () {
-        var size = this.getSize();
-        var globalViewPort = this._fullscreenViewport.toGlobal(size.width, size.height);
-        var targetX = Math.round(globalViewPort.width * (1 / this.rootContainer.scaleX));
-        var targetY = Math.round(globalViewPort.height * (1 / this.rootContainer.scaleY));
+    _getGlobalViewport() {
+        const size = this.getSize();
+        const globalViewPort = this._fullscreenViewport.toGlobal(size.width, size.height);
+        const targetX = Math.round(globalViewPort.width * (1 / this.rootContainer.scaleX));
+        const targetY = Math.round(globalViewPort.height * (1 / this.rootContainer.scaleY));
         globalViewPort.x += (globalViewPort.width - targetX) / 2;
         globalViewPort.y += (globalViewPort.height - targetY) / 2;
         globalViewPort.width = targetX;
         globalViewPort.height = targetY;
         return globalViewPort;
-    };
+    }
     /**
      * Get screen coordinates for a vector3
      * @param position defines the position to project
      * @param worldMatrix defines the world matrix to use
      * @returns the projected position
      */
-    AdvancedDynamicTexture.prototype.getProjectedPosition = function (position, worldMatrix) {
-        var result = this.getProjectedPositionWithZ(position, worldMatrix);
+    getProjectedPosition(position, worldMatrix) {
+        const result = this.getProjectedPositionWithZ(position, worldMatrix);
         return new Vector2(result.x, result.y);
-    };
+    }
     /**
      * Get screen coordinates for a vector3
      * @param position defines the position to project
      * @param worldMatrix defines the world matrix to use
      * @returns the projected position with Z
      */
-    AdvancedDynamicTexture.prototype.getProjectedPositionWithZ = function (position, worldMatrix) {
-        var scene = this.getScene();
+    getProjectedPositionWithZ(position, worldMatrix) {
+        const scene = this.getScene();
         if (!scene) {
             return Vector3.Zero();
         }
-        var globalViewport = this._getGlobalViewport();
-        var projectedPosition = Vector3.Project(position, worldMatrix, scene.getTransformMatrix(), globalViewport);
+        const globalViewport = this._getGlobalViewport();
+        const projectedPosition = Vector3.Project(position, worldMatrix, scene.getTransformMatrix(), globalViewport);
         return new Vector3(projectedPosition.x, projectedPosition.y, projectedPosition.z);
-    };
-    AdvancedDynamicTexture.prototype._checkUpdate = function (camera) {
+    }
+    _checkUpdate(camera) {
         if (this._layerToDispose) {
             if ((camera.layerMask & this._layerToDispose.layerMask) === 0) {
                 return;
             }
         }
         if (this._isFullscreen && this._linkedControls.length) {
-            var scene = this.getScene();
+            const scene = this.getScene();
             if (!scene) {
                 return;
             }
-            var globalViewport = this._getGlobalViewport();
-            var _loop_1 = function (control) {
+            const globalViewport = this._getGlobalViewport();
+            for (const control of this._linkedControls) {
                 if (!control.isVisible) {
-                    return "continue";
+                    continue;
                 }
-                var mesh = control._linkedMesh;
+                const mesh = control._linkedMesh;
                 if (!mesh || mesh.isDisposed()) {
-                    Tools.SetImmediate(function () {
+                    Tools.SetImmediate(() => {
                         control.linkWithMesh(null);
                     });
-                    return "continue";
+                    continue;
                 }
-                var position = mesh.getBoundingInfo ? mesh.getBoundingInfo().boundingSphere.center : Vector3.ZeroReadOnly;
-                var projectedPosition = Vector3.Project(position, mesh.getWorldMatrix(), scene.getTransformMatrix(), globalViewport);
+                const position = mesh.getBoundingInfo ? mesh.getBoundingInfo().boundingSphere.center : Vector3.ZeroReadOnly;
+                const projectedPosition = Vector3.Project(position, mesh.getWorldMatrix(), scene.getTransformMatrix(), globalViewport);
                 if (projectedPosition.z < 0 || projectedPosition.z > 1) {
                     control.notRenderable = true;
-                    return "continue";
+                    continue;
                 }
                 control.notRenderable = false;
                 control._moveToProjectedPosition(projectedPosition);
-            };
-            for (var _i = 0, _a = this._linkedControls; _i < _a.length; _i++) {
-                var control = _a[_i];
-                _loop_1(control);
             }
         }
         if (!this._isDirty && !this._rootContainer.isDirty) {
@@ -737,17 +663,17 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
         this._isDirty = false;
         this._render();
         this.update(this.applyYInversionOnUpdate, this.premulAlpha, AdvancedDynamicTexture.AllowGPUOptimizations);
-    };
-    AdvancedDynamicTexture.prototype._render = function () {
-        var textureSize = this.getSize();
-        var renderWidth = textureSize.width;
-        var renderHeight = textureSize.height;
-        var context = this.getContext();
+    }
+    _render() {
+        const textureSize = this.getSize();
+        const renderWidth = textureSize.width;
+        const renderHeight = textureSize.height;
+        const context = this.getContext();
         context.font = "18px Arial";
         context.strokeStyle = "white";
         // Layout
         this.onBeginLayoutObservable.notifyObservers(this);
-        var measure = new Measure(0, 0, renderWidth, renderHeight);
+        const measure = new Measure(0, 0, renderWidth, renderHeight);
         this._numLayoutCalls = 0;
         this._rootContainer._layout(measure, context);
         this.onEndLayoutObservable.notifyObservers(this);
@@ -772,39 +698,39 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
         this._rootContainer._render(context, this._invalidatedRectangle);
         this.onEndRenderObservable.notifyObservers(this);
         this._invalidatedRectangle = null;
-    };
+    }
     /**
      * @param cursor
      * @hidden
      */
-    AdvancedDynamicTexture.prototype._changeCursor = function (cursor) {
+    _changeCursor(cursor) {
         if (this._rootElement) {
             this._rootElement.style.cursor = cursor;
             this._cursorChanged = true;
         }
-    };
+    }
     /**
      * @param control
      * @param pointerId
      * @hidden
      */
-    AdvancedDynamicTexture.prototype._registerLastControlDown = function (control, pointerId) {
+    _registerLastControlDown(control, pointerId) {
         this._lastControlDown[pointerId] = control;
         this.onControlPickedObservable.notifyObservers(control);
-    };
-    AdvancedDynamicTexture.prototype._doPicking = function (x, y, pi, type, pointerId, buttonIndex, deltaX, deltaY) {
-        var scene = this.getScene();
+    }
+    _doPicking(x, y, pi, type, pointerId, buttonIndex, deltaX, deltaY) {
+        const scene = this.getScene();
         if (!scene) {
             return;
         }
-        var engine = scene.getEngine();
-        var textureSize = this.getSize();
+        const engine = scene.getEngine();
+        const textureSize = this.getSize();
         if (this._isFullscreen) {
-            var camera = scene.cameraToUseForPointers || scene.activeCamera;
+            const camera = scene.cameraToUseForPointers || scene.activeCamera;
             if (!camera) {
                 return;
             }
-            var viewport = camera.viewport;
+            const viewport = camera.viewport;
             x = x * (textureSize.width / (engine.getRenderWidth() * viewport.width));
             y = y * (textureSize.height / (engine.getRenderHeight() * viewport.height));
         }
@@ -831,35 +757,35 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
             this._changeCursor("");
         }
         this._manageFocus();
-    };
+    }
     /**
      * @param list
      * @param control
      * @hidden
      */
-    AdvancedDynamicTexture.prototype._cleanControlAfterRemovalFromList = function (list, control) {
-        for (var pointerId in list) {
+    _cleanControlAfterRemovalFromList(list, control) {
+        for (const pointerId in list) {
             if (!Object.prototype.hasOwnProperty.call(list, pointerId)) {
                 continue;
             }
-            var lastControlOver = list[pointerId];
+            const lastControlOver = list[pointerId];
             if (lastControlOver === control) {
                 delete list[pointerId];
             }
         }
-    };
+    }
     /**
      * @param control
      * @hidden
      */
-    AdvancedDynamicTexture.prototype._cleanControlAfterRemoval = function (control) {
+    _cleanControlAfterRemoval(control) {
         this._cleanControlAfterRemovalFromList(this._lastControlDown, control);
         this._cleanControlAfterRemovalFromList(this._lastControlOver, control);
-    };
-    AdvancedDynamicTexture.prototype._translateToPicking = function (scene, tempViewport, pi) {
-        var camera = scene.cameraToUseForPointers || scene.activeCamera;
-        var engine = scene.getEngine();
-        var originalCameraToUseForPointers = scene.cameraToUseForPointers;
+    }
+    _translateToPicking(scene, tempViewport, pi) {
+        const camera = scene.cameraToUseForPointers || scene.activeCamera;
+        const engine = scene.getEngine();
+        const originalCameraToUseForPointers = scene.cameraToUseForPointers;
         if (!camera) {
             tempViewport.x = 0;
             tempViewport.y = 0;
@@ -869,36 +795,36 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
         else {
             if (camera.rigCameras.length) {
                 // rig camera - we need to find the camera to use for this event
-                var rigViewport_1 = new Viewport(0, 0, 1, 1);
-                camera.rigCameras.forEach(function (rigCamera) {
+                const rigViewport = new Viewport(0, 0, 1, 1);
+                camera.rigCameras.forEach((rigCamera) => {
                     // generate the viewport of this camera
-                    rigCamera.viewport.toGlobalToRef(engine.getRenderWidth(), engine.getRenderHeight(), rigViewport_1);
-                    var x = scene.pointerX / engine.getHardwareScalingLevel() - rigViewport_1.x;
-                    var y = scene.pointerY / engine.getHardwareScalingLevel() - (engine.getRenderHeight() - rigViewport_1.y - rigViewport_1.height);
+                    rigCamera.viewport.toGlobalToRef(engine.getRenderWidth(), engine.getRenderHeight(), rigViewport);
+                    const x = scene.pointerX / engine.getHardwareScalingLevel() - rigViewport.x;
+                    const y = scene.pointerY / engine.getHardwareScalingLevel() - (engine.getRenderHeight() - rigViewport.y - rigViewport.height);
                     // check if the pointer is in the camera's viewport
-                    if (x < 0 || y < 0 || x > rigViewport_1.width || y > rigViewport_1.height) {
+                    if (x < 0 || y < 0 || x > rigViewport.width || y > rigViewport.height) {
                         // out of viewport - don't use this camera
                         return;
                     }
                     // set the camera to use for pointers until this pointer loop is over
                     scene.cameraToUseForPointers = rigCamera;
                     // set the viewport
-                    tempViewport.x = rigViewport_1.x;
-                    tempViewport.y = rigViewport_1.y;
-                    tempViewport.width = rigViewport_1.width;
-                    tempViewport.height = rigViewport_1.height;
+                    tempViewport.x = rigViewport.x;
+                    tempViewport.y = rigViewport.y;
+                    tempViewport.width = rigViewport.width;
+                    tempViewport.height = rigViewport.height;
                 });
             }
             else {
                 camera.viewport.toGlobalToRef(engine.getRenderWidth(), engine.getRenderHeight(), tempViewport);
             }
         }
-        var x = scene.pointerX / engine.getHardwareScalingLevel() - tempViewport.x;
-        var y = scene.pointerY / engine.getHardwareScalingLevel() - (engine.getRenderHeight() - tempViewport.y - tempViewport.height);
+        const x = scene.pointerX / engine.getHardwareScalingLevel() - tempViewport.x;
+        const y = scene.pointerY / engine.getHardwareScalingLevel() - (engine.getRenderHeight() - tempViewport.y - tempViewport.height);
         this._shouldBlockPointer = false;
         // Do picking modifies _shouldBlockPointer
         if (pi) {
-            var pointerId = pi.event.pointerId || this._defaultMousePointerId;
+            const pointerId = pi.event.pointerId || this._defaultMousePointerId;
             this._doPicking(x, y, pi, pi.type, pointerId, pi.event.button, pi.event.deltaX, pi.event.deltaY);
             // Avoid overwriting a true skipOnPointerObservable to false
             if (this._shouldBlockPointer || this._capturingControl[pointerId]) {
@@ -910,16 +836,20 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
         }
         // if overridden by a rig camera - reset back to the original value
         scene.cameraToUseForPointers = originalCameraToUseForPointers;
-    };
+    }
     /** Attach to all scene events required to support pointer events */
-    AdvancedDynamicTexture.prototype.attach = function () {
-        var _this = this;
-        var scene = this.getScene();
+    attach() {
+        const scene = this.getScene();
         if (!scene) {
             return;
         }
-        var tempViewport = new Viewport(0, 0, 0, 0);
-        this._prePointerObserver = scene.onPrePointerObservable.add(function (pi) {
+        const tempViewport = new Viewport(0, 0, 0, 0);
+        this._prePointerObserver = scene.onPrePointerObservable.add((pi) => {
+            if (scene.isPointerCaptured(pi.event.pointerId) &&
+                pi.type === PointerEventTypes.POINTERUP &&
+                !this._capturedPointerIds.has(pi.event.pointerId)) {
+                return;
+            }
             if (pi.type !== PointerEventTypes.POINTERMOVE &&
                 pi.type !== PointerEventTypes.POINTERUP &&
                 pi.type !== PointerEventTypes.POINTERDOWN &&
@@ -932,44 +862,91 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
                     return;
                 }
                 if (pi.event.pointerId) {
-                    _this._defaultMousePointerId = pi.event.pointerId; // This is required to make sure we have the correct pointer ID for wheel
+                    this._defaultMousePointerId = pi.event.pointerId; // This is required to make sure we have the correct pointer ID for wheel
                 }
             }
-            _this._translateToPicking(scene, tempViewport, pi);
+            this._translateToPicking(scene, tempViewport, pi);
         });
-        this._attachPickingToSceneRender(scene, function () { return _this._translateToPicking(scene, tempViewport, null); }, false);
+        this._attachPickingToSceneRender(scene, () => this._translateToPicking(scene, tempViewport, null), false);
         this._attachToOnPointerOut(scene);
         this._attachToOnBlur(scene);
-    };
+    }
     /**
      * Register the clipboard Events onto the canvas
      */
-    AdvancedDynamicTexture.prototype.registerClipboardEvents = function () {
+    registerClipboardEvents() {
         self.addEventListener("copy", this._onClipboardCopy, false);
         self.addEventListener("cut", this._onClipboardCut, false);
         self.addEventListener("paste", this._onClipboardPaste, false);
-    };
+    }
     /**
      * Unregister the clipboard Events from the canvas
      */
-    AdvancedDynamicTexture.prototype.unRegisterClipboardEvents = function () {
+    unRegisterClipboardEvents() {
         self.removeEventListener("copy", this._onClipboardCopy);
         self.removeEventListener("cut", this._onClipboardCut);
         self.removeEventListener("paste", this._onClipboardPaste);
-    };
+    }
+    /**
+     * Transform uvs from mesh space to texture space, taking the texture into account
+     * @param uv the uvs in mesh space
+     * @returns the uvs in texture space
+     */
+    _transformUvs(uv) {
+        const textureMatrix = this.getTextureMatrix();
+        let result;
+        if (textureMatrix.isIdentityAs3x2()) {
+            result = uv;
+        }
+        else {
+            const homogeneousTextureMatrix = TmpVectors.Matrix[0];
+            textureMatrix.getRowToRef(0, TmpVectors.Vector4[0]);
+            textureMatrix.getRowToRef(1, TmpVectors.Vector4[1]);
+            textureMatrix.getRowToRef(2, TmpVectors.Vector4[2]);
+            const r0 = TmpVectors.Vector4[0];
+            const r1 = TmpVectors.Vector4[1];
+            const r2 = TmpVectors.Vector4[2];
+            homogeneousTextureMatrix.setRowFromFloats(0, r0.x, r0.y, 0, 0);
+            homogeneousTextureMatrix.setRowFromFloats(1, r1.x, r1.y, 0, 0);
+            homogeneousTextureMatrix.setRowFromFloats(2, 0, 0, 1, 0);
+            homogeneousTextureMatrix.setRowFromFloats(3, r2.x, r2.y, 0, 1);
+            result = TmpVectors.Vector2[0];
+            Vector2.TransformToRef(uv, homogeneousTextureMatrix, result);
+        }
+        // In wrap and mirror mode, the texture coordinate for coordinates more than 1 is the fractional part of the coordinate
+        if (this.wrapU === Texture.WRAP_ADDRESSMODE || this.wrapU === Texture.MIRROR_ADDRESSMODE) {
+            if (result.x > 1) {
+                let fX = result.x - Math.trunc(result.x);
+                // In mirror mode, the sign of the texture coordinate depends on the integer part -
+                // odd integers means it is mirrored from the original coordinate
+                if (this.wrapU === Texture.MIRROR_ADDRESSMODE && Math.trunc(result.x) % 2 === 1) {
+                    fX = 1 - fX;
+                }
+                result.x = fX;
+            }
+        }
+        if (this.wrapV === Texture.WRAP_ADDRESSMODE || this.wrapV === Texture.MIRROR_ADDRESSMODE) {
+            if (result.y > 1) {
+                let fY = result.y - Math.trunc(result.y);
+                if (this.wrapV === Texture.MIRROR_ADDRESSMODE && Math.trunc(result.x) % 2 === 1) {
+                    fY = 1 - fY;
+                }
+                result.y = fY;
+            }
+        }
+        return result;
+    }
     /**
      * Connect the texture to a hosting mesh to enable interactions
      * @param mesh defines the mesh to attach to
      * @param supportPointerMove defines a boolean indicating if pointer move events must be catched as well
      */
-    AdvancedDynamicTexture.prototype.attachToMesh = function (mesh, supportPointerMove) {
-        var _this = this;
-        if (supportPointerMove === void 0) { supportPointerMove = true; }
-        var scene = this.getScene();
+    attachToMesh(mesh, supportPointerMove = true) {
+        const scene = this.getScene();
         if (!scene) {
             return;
         }
-        this._pointerObserver = scene.onPointerObservable.add(function (pi) {
+        this._pointerObserver = scene.onPointerObservable.add((pi) => {
             if (pi.type !== PointerEventTypes.POINTERMOVE &&
                 pi.type !== PointerEventTypes.POINTERUP &&
                 pi.type !== PointerEventTypes.POINTERDOWN &&
@@ -977,33 +954,33 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
                 return;
             }
             if (pi.type === PointerEventTypes.POINTERMOVE && pi.event.pointerId) {
-                _this._defaultMousePointerId = pi.event.pointerId; // This is required to make sure we have the correct pointer ID for wheel
+                this._defaultMousePointerId = pi.event.pointerId; // This is required to make sure we have the correct pointer ID for wheel
             }
-            var pointerId = pi.event.pointerId || _this._defaultMousePointerId;
+            const pointerId = pi.event.pointerId || this._defaultMousePointerId;
             if (pi.pickInfo && pi.pickInfo.hit && pi.pickInfo.pickedMesh === mesh) {
-                var uv = pi.pickInfo.getTextureCoordinates();
+                let uv = pi.pickInfo.getTextureCoordinates();
                 if (uv) {
-                    var size = _this.getSize();
-                    _this._doPicking(uv.x * size.width, (_this.applyYInversionOnUpdate ? 1.0 - uv.y : uv.y) * size.height, pi, pi.type, pointerId, pi.event.button, pi.event.deltaX, pi.event.deltaY);
+                    uv = this._transformUvs(uv);
+                    const size = this.getSize();
+                    this._doPicking(uv.x * size.width, (this.applyYInversionOnUpdate ? 1.0 - uv.y : uv.y) * size.height, pi, pi.type, pointerId, pi.event.button, pi.event.deltaX, pi.event.deltaY);
                 }
             }
             else if (pi.type === PointerEventTypes.POINTERUP) {
-                if (_this._lastControlDown[pointerId]) {
-                    _this._lastControlDown[pointerId]._forcePointerUp(pointerId);
+                if (this._lastControlDown[pointerId]) {
+                    this._lastControlDown[pointerId]._forcePointerUp(pointerId);
                 }
-                delete _this._lastControlDown[pointerId];
-                if (_this.focusedControl) {
-                    var friendlyControls = _this.focusedControl.keepsFocusWith();
-                    var canMoveFocus = true;
+                delete this._lastControlDown[pointerId];
+                if (this.focusedControl) {
+                    const friendlyControls = this.focusedControl.keepsFocusWith();
+                    let canMoveFocus = true;
                     if (friendlyControls) {
-                        for (var _i = 0, friendlyControls_1 = friendlyControls; _i < friendlyControls_1.length; _i++) {
-                            var control = friendlyControls_1[_i];
+                        for (const control of friendlyControls) {
                             // Same host, no need to keep the focus
-                            if (_this === control._host) {
+                            if (this === control._host) {
                                 continue;
                             }
                             // Different hosts
-                            var otherHost = control._host;
+                            const otherHost = control._host;
                             if (otherHost._lastControlOver[pointerId] && otherHost._lastControlOver[pointerId].isAscendant(control)) {
                                 canMoveFocus = false;
                                 break;
@@ -1011,48 +988,49 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
                         }
                     }
                     if (canMoveFocus) {
-                        _this.focusedControl = null;
+                        this.focusedControl = null;
                     }
                 }
             }
             else if (pi.type === PointerEventTypes.POINTERMOVE) {
-                if (_this._lastControlOver[pointerId]) {
-                    _this._lastControlOver[pointerId]._onPointerOut(_this._lastControlOver[pointerId], pi, true);
+                if (this._lastControlOver[pointerId]) {
+                    this._lastControlOver[pointerId]._onPointerOut(this._lastControlOver[pointerId], pi, true);
                 }
-                delete _this._lastControlOver[pointerId];
+                delete this._lastControlOver[pointerId];
             }
         });
         mesh.enablePointerMoveEvents = supportPointerMove;
-        this._attachPickingToSceneRender(scene, function () {
-            var pointerId = _this._defaultMousePointerId;
-            var pick = scene === null || scene === void 0 ? void 0 : scene.pick(scene.pointerX, scene.pointerY);
+        this._attachPickingToSceneRender(scene, () => {
+            const pointerId = this._defaultMousePointerId;
+            const pick = scene?.pick(scene.pointerX, scene.pointerY);
             if (pick && pick.hit && pick.pickedMesh === mesh) {
-                var uv = pick.getTextureCoordinates();
+                let uv = pick.getTextureCoordinates();
                 if (uv) {
-                    var size = _this.getSize();
-                    _this._doPicking(uv.x * size.width, (_this.applyYInversionOnUpdate ? 1.0 - uv.y : uv.y) * size.height, null, PointerEventTypes.POINTERMOVE, pointerId, 0);
+                    uv = this._transformUvs(uv);
+                    const size = this.getSize();
+                    this._doPicking(uv.x * size.width, (this.applyYInversionOnUpdate ? 1.0 - uv.y : uv.y) * size.height, null, PointerEventTypes.POINTERMOVE, pointerId, 0);
                 }
             }
             else {
-                if (_this._lastControlOver[pointerId]) {
-                    _this._lastControlOver[pointerId]._onPointerOut(_this._lastControlOver[pointerId], null, true);
+                if (this._lastControlOver[pointerId]) {
+                    this._lastControlOver[pointerId]._onPointerOut(this._lastControlOver[pointerId], null, true);
                 }
-                delete _this._lastControlOver[pointerId];
+                delete this._lastControlOver[pointerId];
             }
         }, true);
         this._attachToOnPointerOut(scene);
         this._attachToOnBlur(scene);
-    };
+    }
     /**
      * Move the focus to a specific control
      * @param control defines the control which will receive the focus
      */
-    AdvancedDynamicTexture.prototype.moveFocusToControl = function (control) {
+    moveFocusToControl(control) {
         this.focusedControl = control;
         this._lastPickedControl = control;
         this._blockNextFocusCheck = true;
-    };
-    AdvancedDynamicTexture.prototype._manageFocus = function () {
+    }
+    _manageFocus() {
         if (this._blockNextFocusCheck) {
             this._blockNextFocusCheck = false;
             this._lastPickedControl = this._focusedControl;
@@ -1067,66 +1045,62 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
                 this.focusedControl = null;
             }
         }
-    };
-    AdvancedDynamicTexture.prototype._attachPickingToSceneRender = function (scene, pickFunction, forcePicking) {
-        var _this = this;
-        this._sceneRenderObserver = scene.onBeforeRenderObservable.add(function () {
-            if (!_this.checkPointerEveryFrame) {
+    }
+    _attachPickingToSceneRender(scene, pickFunction, forcePicking) {
+        this._sceneRenderObserver = scene.onBeforeRenderObservable.add(() => {
+            if (!this.checkPointerEveryFrame) {
                 return;
             }
-            if (_this._linkedControls.length > 0 || forcePicking) {
+            if (this._linkedControls.length > 0 || forcePicking) {
                 pickFunction();
             }
         });
-    };
-    AdvancedDynamicTexture.prototype._attachToOnPointerOut = function (scene) {
-        var _this = this;
-        this._canvasPointerOutObserver = scene.getEngine().onCanvasPointerOutObservable.add(function (pointerEvent) {
-            if (_this._lastControlOver[pointerEvent.pointerId]) {
-                _this._lastControlOver[pointerEvent.pointerId]._onPointerOut(_this._lastControlOver[pointerEvent.pointerId], null);
+    }
+    _attachToOnPointerOut(scene) {
+        this._canvasPointerOutObserver = scene.getEngine().onCanvasPointerOutObservable.add((pointerEvent) => {
+            if (this._lastControlOver[pointerEvent.pointerId]) {
+                this._lastControlOver[pointerEvent.pointerId]._onPointerOut(this._lastControlOver[pointerEvent.pointerId], null);
             }
-            delete _this._lastControlOver[pointerEvent.pointerId];
-            if (_this._lastControlDown[pointerEvent.pointerId] && _this._lastControlDown[pointerEvent.pointerId] !== _this._capturingControl[pointerEvent.pointerId]) {
-                _this._lastControlDown[pointerEvent.pointerId]._forcePointerUp(pointerEvent.pointerId);
-                delete _this._lastControlDown[pointerEvent.pointerId];
+            delete this._lastControlOver[pointerEvent.pointerId];
+            if (this._lastControlDown[pointerEvent.pointerId] && this._lastControlDown[pointerEvent.pointerId] !== this._capturingControl[pointerEvent.pointerId]) {
+                this._lastControlDown[pointerEvent.pointerId]._forcePointerUp(pointerEvent.pointerId);
+                delete this._lastControlDown[pointerEvent.pointerId];
             }
         });
-    };
-    AdvancedDynamicTexture.prototype._attachToOnBlur = function (scene) {
-        var _this = this;
-        this._canvasBlurObserver = scene.getEngine().onCanvasBlurObservable.add(function () {
-            Object.entries(_this._lastControlDown).forEach(function (_a) {
-                var value = _a[1];
+    }
+    _attachToOnBlur(scene) {
+        this._canvasBlurObserver = scene.getEngine().onCanvasBlurObservable.add(() => {
+            Object.entries(this._lastControlDown).forEach(([, value]) => {
                 value._onCanvasBlur();
             });
-            _this.focusedControl = null;
-            _this._lastControlDown = {};
+            this.focusedControl = null;
+            this._lastControlDown = {};
         });
-    };
+    }
     /**
      * Serializes the entire GUI system
      * @returns an object with the JSON serialized data
      */
-    AdvancedDynamicTexture.prototype.serializeContent = function () {
-        var size = this.getSize();
-        var serializationObject = {
+    serializeContent() {
+        const size = this.getSize();
+        const serializationObject = {
             root: {},
             width: size.width,
             height: size.height,
         };
         this._rootContainer.serialize(serializationObject.root);
         return serializationObject;
-    };
+    }
     /**
      * Recreate the content of the ADT from a JSON object
      * @param serializedObject define the JSON serialized object to restore from
      * @param scaleToSize defines whether to scale to texture to the saved size
      */
-    AdvancedDynamicTexture.prototype.parseSerializedObject = function (serializedObject, scaleToSize) {
+    parseSerializedObject(serializedObject, scaleToSize) {
         this._rootContainer = Control.Parse(serializedObject.root, this);
         if (scaleToSize) {
-            var width = serializedObject.width;
-            var height = serializedObject.height;
+            const width = serializedObject.width;
+            const height = serializedObject.height;
             if (typeof width === "number" && typeof height === "number" && width >= 0 && height >= 0) {
                 this.scaleTo(width, height);
             }
@@ -1135,7 +1109,22 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
                 this.scaleTo(1920, 1080);
             }
         }
-    };
+    }
+    /**
+     * Clones the ADT
+     * @param newName defines the name of the new ADT
+     * @returns the clone of the ADT
+     */
+    clone(newName) {
+        const scene = this.getScene();
+        if (!scene) {
+            return this;
+        }
+        const data = this.serializeContent();
+        const clone = AdvancedDynamicTexture.CreateFullscreenUI(newName || "Clone of " + this.name, this.isForeground, scene, this.samplingMode);
+        clone.parseSerializedObject(data);
+        return clone;
+    }
     /**
      * Recreate the content of the ADT from a snippet saved by the GUI editor
      * @param snippetId defines the snippet to load
@@ -1143,34 +1132,24 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
      * @param appendToAdt if provided the snippet will be appended to the adt. Otherwise a fullscreen ADT will be created.
      * @returns a promise that will resolve on success
      */
-    AdvancedDynamicTexture.ParseFromSnippetAsync = function (snippetId, scaleToSize, appendToAdt) {
-        return __awaiter(this, void 0, void 0, function () {
-            var adt, serialized;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0:
-                        adt = appendToAdt !== null && appendToAdt !== void 0 ? appendToAdt : AdvancedDynamicTexture.CreateFullscreenUI("ADT from snippet");
-                        if (snippetId === "_BLANK") {
-                            return [2 /*return*/, adt];
-                        }
-                        return [4 /*yield*/, AdvancedDynamicTexture._LoadURLContentAsync(AdvancedDynamicTexture.SnippetUrl + "/" + snippetId.replace(/#/g, "/"), true)];
-                    case 1:
-                        serialized = _a.sent();
-                        adt.parseSerializedObject(serialized, scaleToSize);
-                        return [2 /*return*/, adt];
-                }
-            });
-        });
-    };
+    static async ParseFromSnippetAsync(snippetId, scaleToSize, appendToAdt) {
+        const adt = appendToAdt ?? AdvancedDynamicTexture.CreateFullscreenUI("ADT from snippet");
+        if (snippetId === "_BLANK") {
+            return adt;
+        }
+        const serialized = await AdvancedDynamicTexture._LoadURLContentAsync(AdvancedDynamicTexture.SnippetUrl + "/" + snippetId.replace(/#/g, "/"), true);
+        adt.parseSerializedObject(serialized, scaleToSize);
+        return adt;
+    }
     /**
      * Recreate the content of the ADT from a snippet saved by the GUI editor
      * @param snippetId defines the snippet to load
      * @param scaleToSize defines whether to scale to texture to the saved size
      * @returns a promise that will resolve on success
      */
-    AdvancedDynamicTexture.prototype.parseFromSnippetAsync = function (snippetId, scaleToSize) {
+    parseFromSnippetAsync(snippetId, scaleToSize) {
         return AdvancedDynamicTexture.ParseFromSnippetAsync(snippetId, scaleToSize, this);
-    };
+    }
     /**
      * Recreate the content of the ADT from a url json
      * @param url defines the url to load
@@ -1178,43 +1157,32 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
      * @param appendToAdt if provided the snippet will be appended to the adt. Otherwise a fullscreen ADT will be created.
      * @returns a promise that will resolve on success
      */
-    AdvancedDynamicTexture.ParseFromFileAsync = function (url, scaleToSize, appendToAdt) {
-        return __awaiter(this, void 0, void 0, function () {
-            var adt, serialized;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0:
-                        adt = appendToAdt !== null && appendToAdt !== void 0 ? appendToAdt : AdvancedDynamicTexture.CreateFullscreenUI("ADT from URL");
-                        return [4 /*yield*/, AdvancedDynamicTexture._LoadURLContentAsync(url)];
-                    case 1:
-                        serialized = _a.sent();
-                        adt.parseSerializedObject(serialized, scaleToSize);
-                        return [2 /*return*/, adt];
-                }
-            });
-        });
-    };
+    static async ParseFromFileAsync(url, scaleToSize, appendToAdt) {
+        const adt = appendToAdt ?? AdvancedDynamicTexture.CreateFullscreenUI("ADT from URL");
+        const serialized = await AdvancedDynamicTexture._LoadURLContentAsync(url);
+        adt.parseSerializedObject(serialized, scaleToSize);
+        return adt;
+    }
     /**
      * Recreate the content of the ADT from a url json
      * @param url defines the url to load
      * @param scaleToSize defines whether to scale to texture to the saved size
      * @returns a promise that will resolve on success
      */
-    AdvancedDynamicTexture.prototype.parseFromURLAsync = function (url, scaleToSize) {
+    parseFromURLAsync(url, scaleToSize) {
         return AdvancedDynamicTexture.ParseFromFileAsync(url, scaleToSize, this);
-    };
-    AdvancedDynamicTexture._LoadURLContentAsync = function (url, snippet) {
-        if (snippet === void 0) { snippet = false; }
+    }
+    static _LoadURLContentAsync(url, snippet = false) {
         if (url === "") {
             return Promise.reject("No URL provided");
         }
-        return new Promise(function (resolve, reject) {
-            var request = new WebRequest();
-            request.addEventListener("readystatechange", function () {
+        return new Promise((resolve, reject) => {
+            const request = new WebRequest();
+            request.addEventListener("readystatechange", () => {
                 if (request.readyState == 4) {
                     if (request.status == 200) {
-                        var gui = snippet ? JSON.parse(JSON.parse(request.responseText).jsonPayload).gui : request.responseText;
-                        var serializationObject = JSON.parse(gui);
+                        const gui = snippet ? JSON.parse(JSON.parse(request.responseText).jsonPayload).gui : request.responseText;
+                        const serializationObject = JSON.parse(gui);
                         resolve(serializationObject);
                     }
                     else {
@@ -1225,7 +1193,7 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
             request.open("GET", url);
             request.send();
         });
-    };
+    }
     // Statics
     /**
      * Compares two rectangle based controls for pixel overlap
@@ -1233,12 +1201,12 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
      * @param control2 The second control to compare
      * @returns true if overlaps, otherwise false
      */
-    AdvancedDynamicTexture._Overlaps = function (control1, control2) {
+    static _Overlaps(control1, control2) {
         return !(control1.centerX > control2.centerX + control2.widthInPixels ||
             control1.centerX + control1.widthInPixels < control2.centerX ||
             control1.centerY + control1.heightInPixels < control2.centerY ||
             control1.centerY > control2.centerY + control2.heightInPixels);
-    };
+    }
     /**
      * Creates a new AdvancedDynamicTexture in projected mode (ie. attached to a mesh)
      * @param mesh defines the mesh which will receive the texture
@@ -1250,25 +1218,20 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
      * @param materialSetupCallback defines a custom way of creating and setting up the material on the mesh
      * @returns a new AdvancedDynamicTexture
      */
-    AdvancedDynamicTexture.CreateForMesh = function (mesh, width, height, supportPointerMove, onlyAlphaTesting, invertY, materialSetupCallback) {
-        if (width === void 0) { width = 1024; }
-        if (height === void 0) { height = 1024; }
-        if (supportPointerMove === void 0) { supportPointerMove = true; }
-        if (onlyAlphaTesting === void 0) { onlyAlphaTesting = false; }
-        if (materialSetupCallback === void 0) { materialSetupCallback = this._CreateMaterial; }
+    static CreateForMesh(mesh, width = 1024, height = 1024, supportPointerMove = true, onlyAlphaTesting = false, invertY, materialSetupCallback = this._CreateMaterial) {
         // use a unique ID in name so serialization will work even if you create two ADTs for a single mesh
-        var uniqueId = RandomGUID();
-        var result = new AdvancedDynamicTexture("AdvancedDynamicTexture for ".concat(mesh.name, " [").concat(uniqueId, "]"), width, height, mesh.getScene(), true, Texture.TRILINEAR_SAMPLINGMODE, invertY);
+        const uniqueId = RandomGUID();
+        const result = new AdvancedDynamicTexture(`AdvancedDynamicTexture for ${mesh.name} [${uniqueId}]`, width, height, mesh.getScene(), true, Texture.TRILINEAR_SAMPLINGMODE, invertY);
         materialSetupCallback(mesh, uniqueId, result, onlyAlphaTesting);
         result.attachToMesh(mesh, supportPointerMove);
         return result;
-    };
-    AdvancedDynamicTexture._CreateMaterial = function (mesh, uniqueId, texture, onlyAlphaTesting) {
-        var internalClassType = GetClass("BABYLON.StandardMaterial");
+    }
+    static _CreateMaterial(mesh, uniqueId, texture, onlyAlphaTesting) {
+        const internalClassType = GetClass("BABYLON.StandardMaterial");
         if (!internalClassType) {
             throw "StandardMaterial needs to be imported before as it contains a side-effect required by your code.";
         }
-        var material = new internalClassType("AdvancedDynamicTextureMaterial for ".concat(mesh.name, " [").concat(uniqueId, "]"), mesh.getScene());
+        const material = new internalClassType(`AdvancedDynamicTextureMaterial for ${mesh.name} [${uniqueId}]`, mesh.getScene());
         material.backFaceCulling = false;
         material.diffuseColor = Color3.Black();
         material.specularColor = Color3.Black();
@@ -1282,7 +1245,7 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
             material.opacityTexture = texture;
         }
         mesh.material = material;
-    };
+    }
     /**
      * Creates a new AdvancedDynamicTexture in projected mode (ie. attached to a mesh) BUT do not create a new material for the mesh. You will be responsible for connecting the texture
      * @param mesh defines the mesh which will receive the texture
@@ -1292,14 +1255,11 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
      * @param invertY defines if the texture needs to be inverted on the y axis during loading (true by default)
      * @returns a new AdvancedDynamicTexture
      */
-    AdvancedDynamicTexture.CreateForMeshTexture = function (mesh, width, height, supportPointerMove, invertY) {
-        if (width === void 0) { width = 1024; }
-        if (height === void 0) { height = 1024; }
-        if (supportPointerMove === void 0) { supportPointerMove = true; }
-        var result = new AdvancedDynamicTexture(mesh.name + " AdvancedDynamicTexture", width, height, mesh.getScene(), true, Texture.TRILINEAR_SAMPLINGMODE, invertY);
+    static CreateForMeshTexture(mesh, width = 1024, height = 1024, supportPointerMove = true, invertY) {
+        const result = new AdvancedDynamicTexture(mesh.name + " AdvancedDynamicTexture", width, height, mesh.getScene(), true, Texture.TRILINEAR_SAMPLINGMODE, invertY);
         result.attachToMesh(mesh, supportPointerMove);
         return result;
-    };
+    }
     /**
      * Creates a new AdvancedDynamicTexture in fullscreen mode.
      * In this mode the texture will rely on a layer for its rendering.
@@ -1313,49 +1273,43 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
      * @param adaptiveScaling defines whether to automatically scale root to match hardwarescaling (false by default)
      * @returns a new AdvancedDynamicTexture
      */
-    AdvancedDynamicTexture.CreateFullscreenUI = function (name, foreground, scene, sampling, adaptiveScaling) {
-        if (foreground === void 0) { foreground = true; }
-        if (scene === void 0) { scene = null; }
-        if (sampling === void 0) { sampling = Texture.BILINEAR_SAMPLINGMODE; }
-        if (adaptiveScaling === void 0) { adaptiveScaling = false; }
-        var result = new AdvancedDynamicTexture(name, 0, 0, scene, false, sampling);
+    static CreateFullscreenUI(name, foreground = true, scene = null, sampling = Texture.BILINEAR_SAMPLINGMODE, adaptiveScaling = false) {
+        const result = new AdvancedDynamicTexture(name, 0, 0, scene, false, sampling);
         // Display
-        var resultScene = result.getScene();
-        var layer = new Layer(name + "_layer", null, resultScene, !foreground);
+        const resultScene = result.getScene();
+        const layer = new Layer(name + "_layer", null, resultScene, !foreground);
         layer.texture = result;
         result._layerToDispose = layer;
         result._isFullscreen = true;
         if (adaptiveScaling && resultScene) {
-            var newScale = 1 / resultScene.getEngine().getHardwareScalingLevel();
+            const newScale = 1 / resultScene.getEngine().getHardwareScalingLevel();
             result._rootContainer.scaleX = newScale;
             result._rootContainer.scaleY = newScale;
         }
         // Attach
         result.attach();
         return result;
-    };
+    }
     /**
      * Scales the texture
      * @param ratio the scale factor to apply to both width and height
      */
-    AdvancedDynamicTexture.prototype.scale = function (ratio) {
-        _super.prototype.scale.call(this, ratio);
+    scale(ratio) {
+        super.scale(ratio);
         this.markAsDirty();
-    };
+    }
     /**
      * Resizes the texture
      * @param width the new width
      * @param height the new height
      */
-    AdvancedDynamicTexture.prototype.scaleTo = function (width, height) {
-        _super.prototype.scaleTo.call(this, width, height);
+    scaleTo(width, height) {
+        super.scaleTo(width, height);
         this.markAsDirty();
-    };
-    /** Define the Uurl to load snippets */
-    AdvancedDynamicTexture.SnippetUrl = Constants.SnippetUrl;
-    /** Indicates if some optimizations can be performed in GUI GPU management (the downside is additional memory/GPU texture memory used) */
-    AdvancedDynamicTexture.AllowGPUOptimizations = true;
-    return AdvancedDynamicTexture;
-}(DynamicTexture));
-export { AdvancedDynamicTexture };
+    }
+}
+/** Define the Uurl to load snippets */
+AdvancedDynamicTexture.SnippetUrl = Constants.SnippetUrl;
+/** Indicates if some optimizations can be performed in GUI GPU management (the downside is additional memory/GPU texture memory used) */
+AdvancedDynamicTexture.AllowGPUOptimizations = true;
 //# sourceMappingURL=advancedDynamicTexture.js.map