@babylonjs/gui 5.0.0-rc.5 → 5.0.0-rc.9

package/3D/controls/touchHolographicMenu.d.ts

@@ -1,61 +1,61 @@
-import { Scene } from "@babylonjs/core/scene.js";
-import { Vector3 } from "@babylonjs/core/Maths/math.vector.js";
-import { TransformNode } from "@babylonjs/core/Meshes/transformNode.js";
-import { Nullable } from "@babylonjs/core/types.js";
-import { Control3D } from "./control3D";
-import { VolumeBasedPanel } from "./volumeBasedPanel";
-import { Mesh } from "@babylonjs/core/Meshes/mesh.js";
-import { AbstractMesh } from "@babylonjs/core/Meshes/abstractMesh.js";
-import { Container3D } from "./container3D";
-import { TouchHolographicButton } from "./touchHolographicButton";
-/**
- * Simple menu that can contain holographic buttons
- */
-export declare class TouchHolographicMenu extends VolumeBasedPanel {
-    protected _backPlate: Mesh;
-    private _backPlateMaterial;
-    private _pickedPointObserver;
-    private _currentMin;
-    private _currentMax;
-    private _backPlateMargin;
-    /**
-     * Scale for the buttons added to the menu
-     */
-    protected static MENU_BUTTON_SCALE: number;
-    /**
-     * Gets or sets the margin size of the backplate in button size units.
-     * Setting this to 1, will make the backPlate margin the size of 1 button
-     */
-    get backPlateMargin(): number;
-    set backPlateMargin(value: number);
-    protected _createNode(scene: Scene): Nullable<TransformNode>;
-    protected _affectMaterial(mesh: AbstractMesh): void;
-    protected _mapGridNode(control: Control3D, nodePosition: Vector3): void;
-    protected _finalProcessing(): void;
-    private _updateCurrentMinMax;
-    private _updateMargins;
-    /**
-     * Creates a holographic menu GUI 3D control
-     * @param name name of the menu
-     */
-    constructor(name?: string);
-    /**
-     * Adds a button to the menu.
-     * Please note that the back material of the button will be set to transparent as it is attached to the menu.
-     *
-     * @param button Button to add
-     * @returns This menu
-     */
-    addButton(button: TouchHolographicButton): TouchHolographicMenu;
-    /**
-     * This method should not be used directly. It is inherited from `Container3D`.
-     * Please use `addButton` instead.
-     * @param _control
-     * @returns
-     */
-    addControl(_control: Control3D): Container3D;
-    /**
-     * Disposes the menu
-     */
-    dispose(): void;
-}
+import { Scene } from "@babylonjs/core/scene.js";
+import { Vector3 } from "@babylonjs/core/Maths/math.vector.js";
+import { TransformNode } from "@babylonjs/core/Meshes/transformNode.js";
+import { Nullable } from "@babylonjs/core/types.js";
+import { Control3D } from "./control3D";
+import { VolumeBasedPanel } from "./volumeBasedPanel";
+import { Mesh } from "@babylonjs/core/Meshes/mesh.js";
+import { AbstractMesh } from "@babylonjs/core/Meshes/abstractMesh.js";
+import { Container3D } from "./container3D";
+import { TouchHolographicButton } from "./touchHolographicButton";
+/**
+ * Simple menu that can contain holographic buttons
+ */
+export declare class TouchHolographicMenu extends VolumeBasedPanel {
+    protected _backPlate: Mesh;
+    private _backPlateMaterial;
+    private _pickedPointObserver;
+    private _currentMin;
+    private _currentMax;
+    private _backPlateMargin;
+    /**
+     * Scale for the buttons added to the menu
+     */
+    protected static MENU_BUTTON_SCALE: number;
+    /**
+     * Gets or sets the margin size of the backplate in button size units.
+     * Setting this to 1, will make the backPlate margin the size of 1 button
+     */
+    get backPlateMargin(): number;
+    set backPlateMargin(value: number);
+    protected _createNode(scene: Scene): Nullable<TransformNode>;
+    protected _affectMaterial(mesh: AbstractMesh): void;
+    protected _mapGridNode(control: Control3D, nodePosition: Vector3): void;
+    protected _finalProcessing(): void;
+    private _updateCurrentMinMax;
+    private _updateMargins;
+    /**
+     * Creates a holographic menu GUI 3D control
+     * @param name name of the menu
+     */
+    constructor(name?: string);
+    /**
+     * Adds a button to the menu.
+     * Please note that the back material of the button will be set to transparent as it is attached to the menu.
+     *
+     * @param button Button to add
+     * @returns This menu
+     */
+    addButton(button: TouchHolographicButton): TouchHolographicMenu;
+    /**
+     * This method should not be used directly. It is inherited from `Container3D`.
+     * Please use `addButton` instead.
+     * @param _control
+     * @returns
+     */
+    addControl(_control: Control3D): Container3D;
+    /**
+     * Disposes the menu
+     */
+    dispose(): void;
+}

package/3D/controls/touchHolographicMenu.js

@@ -1,150 +1,150 @@
-import { __extends } from "tslib";
-import { VolumeBasedPanel } from "./volumeBasedPanel.js";
-import { Mesh } from "@babylonjs/core/Meshes/mesh.js";
-import { CreateBox } from "@babylonjs/core/Meshes/Builders/boxBuilder.js";
-import { FluentMaterial } from "../materials/fluent/fluentMaterial.js";
-import { Color3 } from "@babylonjs/core/Maths/math.color.js";
-import { Logger } from "@babylonjs/core/Misc/logger.js";
-/**
- * Simple menu that can contain holographic buttons
- */
-var TouchHolographicMenu = /** @class */ (function (_super) {
-    __extends(TouchHolographicMenu, _super);
-    /**
-     * Creates a holographic menu GUI 3D control
-     * @param name name of the menu
-     */
-    function TouchHolographicMenu(name) {
-        var _this = _super.call(this, name) || this;
-        _this._backPlateMargin = 1.25;
-        return _this;
-    }
-    Object.defineProperty(TouchHolographicMenu.prototype, "backPlateMargin", {
-        /**
-         * Gets or sets the margin size of the backplate in button size units.
-         * Setting this to 1, will make the backPlate margin the size of 1 button
-         */
-        get: function () {
-            return this._backPlateMargin;
-        },
-        set: function (value) {
-            var _this = this;
-            this._backPlateMargin = value;
-            if (this._children.length >= 1) {
-                this.children.forEach(function (control) {
-                    _this._updateCurrentMinMax(control.position);
-                });
-                this._updateMargins();
-            }
-        },
-        enumerable: false,
-        configurable: true
-    });
-    TouchHolographicMenu.prototype._createNode = function (scene) {
-        var node = new Mesh("menu_".concat(this.name), scene);
-        this._backPlate = CreateBox("backPlate" + this.name, { size: 1 }, scene);
-        this._backPlate.parent = node;
-        return node;
-    };
-    TouchHolographicMenu.prototype._affectMaterial = function (mesh) {
-        var _this = this;
-        this._backPlateMaterial = new FluentMaterial(this.name + "backPlateMaterial", mesh.getScene());
-        this._backPlateMaterial.albedoColor = new Color3(0.08, 0.15, 0.55);
-        this._backPlateMaterial.renderBorders = true;
-        this._backPlateMaterial.renderHoverLight = true;
-        this._pickedPointObserver = this._host.onPickedPointChangedObservable.add(function (pickedPoint) {
-            if (pickedPoint) {
-                _this._backPlateMaterial.hoverPosition = pickedPoint;
-                _this._backPlateMaterial.hoverColor.a = 1.0;
-            }
-            else {
-                _this._backPlateMaterial.hoverColor.a = 0;
-            }
-        });
-        this._backPlate.material = this._backPlateMaterial;
-    };
-    TouchHolographicMenu.prototype._mapGridNode = function (control, nodePosition) {
-        // Simple plane mapping for the menu
-        var mesh = control.mesh;
-        if (!mesh) {
-            return;
-        }
-        control.position = nodePosition.clone();
-        this._updateCurrentMinMax(nodePosition);
-    };
-    TouchHolographicMenu.prototype._finalProcessing = function () {
-        this._updateMargins();
-    };
-    TouchHolographicMenu.prototype._updateCurrentMinMax = function (nodePosition) {
-        if (!this._currentMin) {
-            this._currentMin = nodePosition.clone();
-            this._currentMax = nodePosition.clone();
-        }
-        this._currentMin.minimizeInPlace(nodePosition);
-        this._currentMax.maximizeInPlace(nodePosition);
-    };
-    TouchHolographicMenu.prototype._updateMargins = function () {
-        if (this._children.length > 0) {
-            this._currentMin.addInPlaceFromFloats(-this._cellWidth / 2, -this._cellHeight / 2, 0);
-            this._currentMax.addInPlaceFromFloats(this._cellWidth / 2, this._cellHeight / 2, 0);
-            var extendSize = this._currentMax.subtract(this._currentMin);
-            // Also add a % margin
-            this._backPlate.scaling.x = extendSize.x + this._cellWidth * this.backPlateMargin;
-            this._backPlate.scaling.y = extendSize.y + this._cellHeight * this.backPlateMargin;
-            this._backPlate.scaling.z = 0.001;
-            for (var i = 0; i < this._children.length; i++) {
-                this._children[i].position.subtractInPlace(this._currentMin).subtractInPlace(extendSize.scale(0.5));
-                this._children[i].position.z -= 0.01;
-            }
-        }
-        this._currentMin = null;
-        this._currentMax = null;
-    };
-    /**
-     * Adds a button to the menu.
-     * Please note that the back material of the button will be set to transparent as it is attached to the menu.
-     *
-     * @param button Button to add
-     * @returns This menu
-     */
-    TouchHolographicMenu.prototype.addButton = function (button) {
-        // Block updating the layout until the button is resized (which has to happen after node creation)
-        var wasLayoutBlocked = this.blockLayout;
-        if (!wasLayoutBlocked) {
-            this.blockLayout = true;
-        }
-        _super.prototype.addControl.call(this, button);
-        button.isBackplateVisible = false;
-        button.scaling.scaleInPlace(TouchHolographicMenu.MENU_BUTTON_SCALE);
-        // Unblocking the layout triggers the pending layout update that uses the size of the buttons to determine the size of the backing mesh
-        if (!wasLayoutBlocked) {
-            this.blockLayout = false;
-        }
-        return this;
-    };
-    /**
-     * This method should not be used directly. It is inherited from `Container3D`.
-     * Please use `addButton` instead.
-     * @param _control
-     * @returns
-     */
-    TouchHolographicMenu.prototype.addControl = function (_control) {
-        Logger.Warn("TouchHolographicMenu can only contain buttons. Please use the method `addButton` instead.");
-        return this;
-    };
-    /**
-     * Disposes the menu
-     */
-    TouchHolographicMenu.prototype.dispose = function () {
-        _super.prototype.dispose.call(this);
-        this._host.onPickedPointChangedObservable.remove(this._pickedPointObserver);
-    };
-    /**
-     * Scale for the buttons added to the menu
-     */
-    // eslint-disable-next-line @typescript-eslint/naming-convention
-    TouchHolographicMenu.MENU_BUTTON_SCALE = 1;
-    return TouchHolographicMenu;
-}(VolumeBasedPanel));
-export { TouchHolographicMenu };
+import { __extends } from "tslib";
+import { VolumeBasedPanel } from "./volumeBasedPanel";
+import { Mesh } from "@babylonjs/core/Meshes/mesh.js";
+import { CreateBox } from "@babylonjs/core/Meshes/Builders/boxBuilder.js";
+import { FluentMaterial } from "../materials/fluent/fluentMaterial";
+import { Color3 } from "@babylonjs/core/Maths/math.color.js";
+import { Logger } from "@babylonjs/core/Misc/logger.js";
+/**
+ * Simple menu that can contain holographic buttons
+ */
+var TouchHolographicMenu = /** @class */ (function (_super) {
+    __extends(TouchHolographicMenu, _super);
+    /**
+     * Creates a holographic menu GUI 3D control
+     * @param name name of the menu
+     */
+    function TouchHolographicMenu(name) {
+        var _this = _super.call(this, name) || this;
+        _this._backPlateMargin = 1.25;
+        return _this;
+    }
+    Object.defineProperty(TouchHolographicMenu.prototype, "backPlateMargin", {
+        /**
+         * Gets or sets the margin size of the backplate in button size units.
+         * Setting this to 1, will make the backPlate margin the size of 1 button
+         */
+        get: function () {
+            return this._backPlateMargin;
+        },
+        set: function (value) {
+            var _this = this;
+            this._backPlateMargin = value;
+            if (this._children.length >= 1) {
+                this.children.forEach(function (control) {
+                    _this._updateCurrentMinMax(control.position);
+                });
+                this._updateMargins();
+            }
+        },
+        enumerable: false,
+        configurable: true
+    });
+    TouchHolographicMenu.prototype._createNode = function (scene) {
+        var node = new Mesh("menu_".concat(this.name), scene);
+        this._backPlate = CreateBox("backPlate" + this.name, { size: 1 }, scene);
+        this._backPlate.parent = node;
+        return node;
+    };
+    TouchHolographicMenu.prototype._affectMaterial = function (mesh) {
+        var _this = this;
+        this._backPlateMaterial = new FluentMaterial(this.name + "backPlateMaterial", mesh.getScene());
+        this._backPlateMaterial.albedoColor = new Color3(0.08, 0.15, 0.55);
+        this._backPlateMaterial.renderBorders = true;
+        this._backPlateMaterial.renderHoverLight = true;
+        this._pickedPointObserver = this._host.onPickedPointChangedObservable.add(function (pickedPoint) {
+            if (pickedPoint) {
+                _this._backPlateMaterial.hoverPosition = pickedPoint;
+                _this._backPlateMaterial.hoverColor.a = 1.0;
+            }
+            else {
+                _this._backPlateMaterial.hoverColor.a = 0;
+            }
+        });
+        this._backPlate.material = this._backPlateMaterial;
+    };
+    TouchHolographicMenu.prototype._mapGridNode = function (control, nodePosition) {
+        // Simple plane mapping for the menu
+        var mesh = control.mesh;
+        if (!mesh) {
+            return;
+        }
+        control.position = nodePosition.clone();
+        this._updateCurrentMinMax(nodePosition);
+    };
+    TouchHolographicMenu.prototype._finalProcessing = function () {
+        this._updateMargins();
+    };
+    TouchHolographicMenu.prototype._updateCurrentMinMax = function (nodePosition) {
+        if (!this._currentMin) {
+            this._currentMin = nodePosition.clone();
+            this._currentMax = nodePosition.clone();
+        }
+        this._currentMin.minimizeInPlace(nodePosition);
+        this._currentMax.maximizeInPlace(nodePosition);
+    };
+    TouchHolographicMenu.prototype._updateMargins = function () {
+        if (this._children.length > 0) {
+            this._currentMin.addInPlaceFromFloats(-this._cellWidth / 2, -this._cellHeight / 2, 0);
+            this._currentMax.addInPlaceFromFloats(this._cellWidth / 2, this._cellHeight / 2, 0);
+            var extendSize = this._currentMax.subtract(this._currentMin);
+            // Also add a % margin
+            this._backPlate.scaling.x = extendSize.x + this._cellWidth * this.backPlateMargin;
+            this._backPlate.scaling.y = extendSize.y + this._cellHeight * this.backPlateMargin;
+            this._backPlate.scaling.z = 0.001;
+            for (var i = 0; i < this._children.length; i++) {
+                this._children[i].position.subtractInPlace(this._currentMin).subtractInPlace(extendSize.scale(0.5));
+                this._children[i].position.z -= 0.01;
+            }
+        }
+        this._currentMin = null;
+        this._currentMax = null;
+    };
+    /**
+     * Adds a button to the menu.
+     * Please note that the back material of the button will be set to transparent as it is attached to the menu.
+     *
+     * @param button Button to add
+     * @returns This menu
+     */
+    TouchHolographicMenu.prototype.addButton = function (button) {
+        // Block updating the layout until the button is resized (which has to happen after node creation)
+        var wasLayoutBlocked = this.blockLayout;
+        if (!wasLayoutBlocked) {
+            this.blockLayout = true;
+        }
+        _super.prototype.addControl.call(this, button);
+        button.isBackplateVisible = false;
+        button.scaling.scaleInPlace(TouchHolographicMenu.MENU_BUTTON_SCALE);
+        // Unblocking the layout triggers the pending layout update that uses the size of the buttons to determine the size of the backing mesh
+        if (!wasLayoutBlocked) {
+            this.blockLayout = false;
+        }
+        return this;
+    };
+    /**
+     * This method should not be used directly. It is inherited from `Container3D`.
+     * Please use `addButton` instead.
+     * @param _control
+     * @returns
+     */
+    TouchHolographicMenu.prototype.addControl = function (_control) {
+        Logger.Warn("TouchHolographicMenu can only contain buttons. Please use the method `addButton` instead.");
+        return this;
+    };
+    /**
+     * Disposes the menu
+     */
+    TouchHolographicMenu.prototype.dispose = function () {
+        _super.prototype.dispose.call(this);
+        this._host.onPickedPointChangedObservable.remove(this._pickedPointObserver);
+    };
+    /**
+     * Scale for the buttons added to the menu
+     */
+    // eslint-disable-next-line @typescript-eslint/naming-convention
+    TouchHolographicMenu.MENU_BUTTON_SCALE = 1;
+    return TouchHolographicMenu;
+}(VolumeBasedPanel));
+export { TouchHolographicMenu };
 //# sourceMappingURL=touchHolographicMenu.js.map

package/3D/controls/touchMeshButton3D.d.ts

@@ -1,21 +1,21 @@
-import { TransformNode } from "@babylonjs/core/Meshes/transformNode.js";
-import { AbstractMesh } from "@babylonjs/core/Meshes/abstractMesh.js";
-import { Mesh } from "@babylonjs/core/Meshes/mesh.js";
-import { TouchButton3D } from "./touchButton3D";
-/**
- * Class used to create an interactable object. It's a touchable 3D button using a mesh coming from the current scene
- * @since 5.0.0
- */
-export declare class TouchMeshButton3D extends TouchButton3D {
-    /** @hidden */
-    protected _currentMesh: Mesh;
-    /**
-     * Creates a new 3D button based on a mesh
-     * @param mesh mesh to become a 3D button. By default this is also the mesh for near interaction collision checking
-     * @param name defines the control name
-     */
-    constructor(mesh: Mesh, name?: string);
-    protected _getTypeName(): string;
-    protected _createNode(): TransformNode;
-    protected _affectMaterial(mesh: AbstractMesh): void;
-}
+import { TransformNode } from "@babylonjs/core/Meshes/transformNode.js";
+import { AbstractMesh } from "@babylonjs/core/Meshes/abstractMesh.js";
+import { Mesh } from "@babylonjs/core/Meshes/mesh.js";
+import { TouchButton3D } from "./touchButton3D";
+/**
+ * Class used to create an interactable object. It's a touchable 3D button using a mesh coming from the current scene
+ * @since 5.0.0
+ */
+export declare class TouchMeshButton3D extends TouchButton3D {
+    /** @hidden */
+    protected _currentMesh: Mesh;
+    /**
+     * Creates a new 3D button based on a mesh
+     * @param mesh mesh to become a 3D button. By default this is also the mesh for near interaction collision checking
+     * @param name defines the control name
+     */
+    constructor(mesh: Mesh, name?: string);
+    protected _getTypeName(): string;
+    protected _createNode(): TransformNode;
+    protected _affectMaterial(mesh: AbstractMesh): void;
+}

package/3D/controls/touchMeshButton3D.js

@@ -1,63 +1,63 @@
-import { __extends } from "tslib";
-import { TouchButton3D } from "./touchButton3D.js";
-/**
- * Class used to create an interactable object. It's a touchable 3D button using a mesh coming from the current scene
- * @since 5.0.0
- */
-var TouchMeshButton3D = /** @class */ (function (_super) {
-    __extends(TouchMeshButton3D, _super);
-    /**
-     * Creates a new 3D button based on a mesh
-     * @param mesh mesh to become a 3D button. By default this is also the mesh for near interaction collision checking
-     * @param name defines the control name
-     */
-    function TouchMeshButton3D(mesh, name) {
-        var _this = _super.call(this, name, mesh) || this;
-        _this._currentMesh = mesh;
-        /**
-         * Provides a default behavior on hover/out & up/down
-         * Override those function to create your own desired behavior specific to your mesh
-         */
-        _this.pointerEnterAnimation = function () {
-            if (!_this.mesh) {
-                return;
-            }
-            _this.mesh.scaling.scaleInPlace(1.1);
-        };
-        _this.pointerOutAnimation = function () {
-            if (!_this.mesh) {
-                return;
-            }
-            _this.mesh.scaling.scaleInPlace(1.0 / 1.1);
-        };
-        _this.pointerDownAnimation = function () {
-            if (!_this.mesh) {
-                return;
-            }
-            _this.mesh.scaling.scaleInPlace(0.95);
-        };
-        _this.pointerUpAnimation = function () {
-            if (!_this.mesh) {
-                return;
-            }
-            _this.mesh.scaling.scaleInPlace(1.0 / 0.95);
-        };
-        return _this;
-    }
-    TouchMeshButton3D.prototype._getTypeName = function () {
-        return "TouchMeshButton3D";
-    };
-    // Mesh association
-    TouchMeshButton3D.prototype._createNode = function () {
-        var _this = this;
-        this._currentMesh.getChildMeshes().forEach(function (mesh) {
-            _this._injectGUI3DReservedDataStore(mesh).control = _this;
-        });
-        return this._currentMesh;
-    };
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    TouchMeshButton3D.prototype._affectMaterial = function (mesh) { };
-    return TouchMeshButton3D;
-}(TouchButton3D));
-export { TouchMeshButton3D };
+import { __extends } from "tslib";
+import { TouchButton3D } from "./touchButton3D";
+/**
+ * Class used to create an interactable object. It's a touchable 3D button using a mesh coming from the current scene
+ * @since 5.0.0
+ */
+var TouchMeshButton3D = /** @class */ (function (_super) {
+    __extends(TouchMeshButton3D, _super);
+    /**
+     * Creates a new 3D button based on a mesh
+     * @param mesh mesh to become a 3D button. By default this is also the mesh for near interaction collision checking
+     * @param name defines the control name
+     */
+    function TouchMeshButton3D(mesh, name) {
+        var _this = _super.call(this, name, mesh) || this;
+        _this._currentMesh = mesh;
+        /**
+         * Provides a default behavior on hover/out & up/down
+         * Override those function to create your own desired behavior specific to your mesh
+         */
+        _this.pointerEnterAnimation = function () {
+            if (!_this.mesh) {
+                return;
+            }
+            _this.mesh.scaling.scaleInPlace(1.1);
+        };
+        _this.pointerOutAnimation = function () {
+            if (!_this.mesh) {
+                return;
+            }
+            _this.mesh.scaling.scaleInPlace(1.0 / 1.1);
+        };
+        _this.pointerDownAnimation = function () {
+            if (!_this.mesh) {
+                return;
+            }
+            _this.mesh.scaling.scaleInPlace(0.95);
+        };
+        _this.pointerUpAnimation = function () {
+            if (!_this.mesh) {
+                return;
+            }
+            _this.mesh.scaling.scaleInPlace(1.0 / 0.95);
+        };
+        return _this;
+    }
+    TouchMeshButton3D.prototype._getTypeName = function () {
+        return "TouchMeshButton3D";
+    };
+    // Mesh association
+    TouchMeshButton3D.prototype._createNode = function () {
+        var _this = this;
+        this._currentMesh.getChildMeshes().forEach(function (mesh) {
+            _this._injectGUI3DReservedDataStore(mesh).control = _this;
+        });
+        return this._currentMesh;
+    };
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    TouchMeshButton3D.prototype._affectMaterial = function (mesh) { };
+    return TouchMeshButton3D;
+}(TouchButton3D));
+export { TouchMeshButton3D };
 //# sourceMappingURL=touchMeshButton3D.js.map