@babylonjs/gui 5.0.0-beta.2 → 5.0.0-beta.6

package/3D/controls/nearMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"nearMenu.js","sourceRoot":"","sources":["../../../../sourceES6/gui/src/3D/controls/nearMenu.ts"],"names":[],"mappings":"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","sourcesContent":["import { Scene } from \"@babylonjs/core/scene\";\r\nimport { TransformNode } from \"@babylonjs/core/Meshes/transformNode\";\r\nimport { Nullable } from \"@babylonjs/core/types\";\r\nimport { Mesh } from \"@babylonjs/core/Meshes/mesh\";\r\nimport { TouchHolographicButton } from \"./touchHolographicButton\";\r\nimport { DefaultBehavior } from \"../behaviors/defaultBehavior\";\r\nimport { StandardMaterial } from \"@babylonjs/core/Materials/standardMaterial\";\r\nimport { TouchHolographicMenu } from \"./touchHolographicMenu\";\r\nimport { Observer } from \"@babylonjs/core/Misc/observable\";\r\nimport { Vector3 } from \"@babylonjs/core/Maths/math.vector\";\r\nimport { PickingInfo } from \"@babylonjs/core/Collisions/pickingInfo\";\r\n\r\n/**\r\n * NearMenu that displays buttons and follows the camera\r\n * @since 5.0.0\r\n */\r\nexport class NearMenu extends TouchHolographicMenu {\r\n    /**\r\n     * Base Url for the assets.\r\n     */\r\n    private static ASSETS_BASE_URL: string = \"https://assets.babylonjs.com/meshes/MRTK/\";\r\n    /**\r\n     * File name for the close icon.\r\n     */\r\n    private static PIN_ICON_FILENAME: string = \"IconPin.png\";\r\n\r\n    private _pinButton: TouchHolographicButton;\r\n    private _pinMaterial: StandardMaterial;\r\n    private _dragObserver: Nullable<\r\n        Observer<{\r\n            delta: Vector3;\r\n            position: Vector3;\r\n            pickInfo: PickingInfo;\r\n        }>\r\n    >;\r\n\r\n    private _defaultBehavior: DefaultBehavior;\r\n    /**\r\n     * Regroups all mesh behaviors for the near menu\r\n     */\r\n    public get defaultBehavior(): DefaultBehavior {\r\n        return this._defaultBehavior;\r\n    }\r\n\r\n    private _isPinned: boolean = false;\r\n    /**\r\n     * Indicates if the near menu is world-pinned\r\n     */\r\n    public get isPinned(): boolean {\r\n        return this._isPinned;\r\n    }\r\n\r\n    public set isPinned(value: boolean) {\r\n        this._isPinned = value;\r\n\r\n        if (this._isPinned) {\r\n            this._pinMaterial.emissiveColor.copyFromFloats(0.25, 0.4, 0.95);\r\n            this._defaultBehavior.followBehaviorEnabled = false;\r\n        } else {\r\n            this._pinMaterial.emissiveColor.copyFromFloats(0.08, 0.15, 0.55);\r\n            this._defaultBehavior.followBehaviorEnabled = true;\r\n        }\r\n    }\r\n\r\n    private _createPinButton(parent: TransformNode) {\r\n        const control = new TouchHolographicButton(\"pin\" + this.name, false);\r\n        control.imageUrl = NearMenu.ASSETS_BASE_URL + NearMenu.PIN_ICON_FILENAME;\r\n        control.parent = this;\r\n        control._host = this._host;\r\n        control.onPointerClickObservable.add(() => (this.isPinned = !this.isPinned));\r\n\r\n        if (this._host.utilityLayer) {\r\n            control._prepareNode(this._host.utilityLayer.utilityLayerScene);\r\n            control.scaling.scaleInPlace(TouchHolographicMenu.MENU_BUTTON_SCALE);\r\n            this._pinMaterial = control.backMaterial;\r\n            this._pinMaterial.diffuseColor.copyFromFloats(0, 0, 0);\r\n\r\n            if (control.node) {\r\n                control.node.parent = parent;\r\n            }\r\n        }\r\n\r\n        return control;\r\n    }\r\n\r\n    protected _createNode(scene: Scene): Nullable<TransformNode> {\r\n        const node = super._createNode(scene)! as Mesh;\r\n\r\n        this._pinButton = this._createPinButton(node);\r\n        this.isPinned = false;\r\n\r\n        this._defaultBehavior.attach(node, [this._backPlate]);\r\n        this._defaultBehavior.followBehavior.ignoreCameraPitchAndRoll = true;\r\n        this._defaultBehavior.followBehavior.pitchOffset = -15;\r\n        this._defaultBehavior.followBehavior.minimumDistance = 0.3;\r\n        this._defaultBehavior.followBehavior.defaultDistance = 0.4;\r\n        this._defaultBehavior.followBehavior.maximumDistance = 0.6;\r\n\r\n        this._backPlate.isNearGrabbable = true;\r\n        node.isVisible = false;\r\n\r\n        return node;\r\n    }\r\n\r\n    protected _finalProcessing() {\r\n        super._finalProcessing();\r\n\r\n        this._pinButton.position.copyFromFloats((this._backPlate.scaling.x + TouchHolographicMenu.MENU_BUTTON_SCALE) / 2, this._backPlate.scaling.y / 2, 0);\r\n    }\r\n\r\n    /**\r\n     * Creates a near menu GUI 3D control\r\n     * @param name name of the near menu\r\n     */\r\n    constructor(name?: string) {\r\n        super(name);\r\n\r\n        this._defaultBehavior = new DefaultBehavior();\r\n        this._dragObserver = this._defaultBehavior.sixDofDragBehavior.onDragObservable.add(() => {\r\n            this.isPinned = true;\r\n        });\r\n\r\n        this.backPlateMargin = 1;\r\n    }\r\n\r\n    /**\r\n     * Disposes the near menu\r\n     */\r\n    public dispose() {\r\n        super.dispose();\r\n\r\n        this._defaultBehavior.sixDofDragBehavior.onDragObservable.remove(this._dragObserver);\r\n        this._defaultBehavior.detach();\r\n    }\r\n}\r\n"]}
+{"version":3,"file":"nearMenu.js","sourceRoot":"","sources":["../../../../sourceES6/gui/src/3D/controls/nearMenu.ts"],"names":[],"mappings":"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","sourcesContent":["import { Scene } from \"@babylonjs/core/scene\";\r\nimport { TransformNode } from \"@babylonjs/core/Meshes/transformNode\";\r\nimport { Nullable } from \"@babylonjs/core/types\";\r\nimport { Mesh } from \"@babylonjs/core/Meshes/mesh\";\r\nimport { TouchHolographicButton } from \"./touchHolographicButton\";\r\nimport { DefaultBehavior } from \"../behaviors/defaultBehavior\";\r\nimport { TouchHolographicMenu } from \"./touchHolographicMenu\";\r\nimport { Observer } from \"@babylonjs/core/Misc/observable\";\r\nimport { Vector3 } from \"@babylonjs/core/Maths/math.vector\";\r\nimport { PickingInfo } from \"@babylonjs/core/Collisions/pickingInfo\";\r\n\r\n/**\r\n * NearMenu that displays buttons and follows the camera\r\n * @since 5.0.0\r\n */\r\nexport class NearMenu extends TouchHolographicMenu {\r\n    /**\r\n     * Base Url for the assets.\r\n     */\r\n    private static ASSETS_BASE_URL: string = \"https://assets.babylonjs.com/meshes/MRTK/\";\r\n    /**\r\n     * File name for the close icon.\r\n     */\r\n    private static PIN_ICON_FILENAME: string = \"IconPin.png\";\r\n\r\n    private _pinButton: TouchHolographicButton;\r\n    private _dragObserver: Nullable<\r\n        Observer<{\r\n            delta: Vector3;\r\n            position: Vector3;\r\n            pickInfo: PickingInfo;\r\n        }>\r\n    >;\r\n\r\n    private _defaultBehavior: DefaultBehavior;\r\n    /**\r\n     * Regroups all mesh behaviors for the near menu\r\n     */\r\n    public get defaultBehavior(): DefaultBehavior {\r\n        return this._defaultBehavior;\r\n    }\r\n\r\n    private _isPinned: boolean = false;\r\n    /**\r\n     * Indicates if the near menu is world-pinned\r\n     */\r\n    public get isPinned(): boolean {\r\n        return this._isPinned;\r\n    }\r\n\r\n    public set isPinned(value: boolean) {\r\n        // Tell the pin button to toggle if this was called manually, for clean state control\r\n        if (this._pinButton.isToggled !== value) {\r\n            this._pinButton.isToggled = value;\r\n            return;\r\n        }\r\n\r\n        this._isPinned = value;\r\n\r\n        if (value) {\r\n            this._defaultBehavior.followBehaviorEnabled = false;\r\n        } else {\r\n            this._defaultBehavior.followBehaviorEnabled = true;\r\n        }\r\n    }\r\n\r\n    private _createPinButton(parent: TransformNode) {\r\n        const control = new TouchHolographicButton(\"pin\" + this.name, false);\r\n        control.imageUrl = NearMenu.ASSETS_BASE_URL + NearMenu.PIN_ICON_FILENAME;\r\n        control.parent = this;\r\n        control._host = this._host;\r\n        control.isToggleButton = true;\r\n        control.onToggleObservable.add((newState) => { this.isPinned = newState; });\r\n\r\n        if (this._host.utilityLayer) {\r\n            control._prepareNode(this._host.utilityLayer.utilityLayerScene);\r\n            control.scaling.scaleInPlace(TouchHolographicMenu.MENU_BUTTON_SCALE);\r\n\r\n            if (control.node) {\r\n                control.node.parent = parent;\r\n            }\r\n        }\r\n\r\n        return control;\r\n    }\r\n\r\n    protected _createNode(scene: Scene): Nullable<TransformNode> {\r\n        const node = super._createNode(scene)! as Mesh;\r\n\r\n        this._pinButton = this._createPinButton(node);\r\n        this.isPinned = false;\r\n\r\n        this._defaultBehavior.attach(node, [this._backPlate]);\r\n        this._defaultBehavior.followBehavior.ignoreCameraPitchAndRoll = true;\r\n        this._defaultBehavior.followBehavior.pitchOffset = -15;\r\n        this._defaultBehavior.followBehavior.minimumDistance = 0.3;\r\n        this._defaultBehavior.followBehavior.defaultDistance = 0.4;\r\n        this._defaultBehavior.followBehavior.maximumDistance = 0.6;\r\n\r\n        this._backPlate.isNearGrabbable = true;\r\n        node.isVisible = false;\r\n\r\n        return node;\r\n    }\r\n\r\n    protected _finalProcessing() {\r\n        super._finalProcessing();\r\n\r\n        this._pinButton.position.copyFromFloats((this._backPlate.scaling.x + TouchHolographicMenu.MENU_BUTTON_SCALE) / 2, this._backPlate.scaling.y / 2, 0);\r\n    }\r\n\r\n    /**\r\n     * Creates a near menu GUI 3D control\r\n     * @param name name of the near menu\r\n     */\r\n    constructor(name?: string) {\r\n        super(name);\r\n\r\n        this._defaultBehavior = new DefaultBehavior();\r\n        this._dragObserver = this._defaultBehavior.sixDofDragBehavior.onDragObservable.add(() => {\r\n            this.isPinned = true;\r\n        });\r\n\r\n        this.backPlateMargin = 1;\r\n    }\r\n\r\n    /**\r\n     * Disposes the near menu\r\n     */\r\n    public dispose() {\r\n        super.dispose();\r\n\r\n        this._defaultBehavior.sixDofDragBehavior.onDragObservable.remove(this._dragObserver);\r\n        this._defaultBehavior.detach();\r\n    }\r\n}\r\n"]}

package/3D/controls/slider3D.js

@@ -160,7 +160,7 @@ var Slider3D = /** @class */ (function (_super) {
     // Mesh association
     Slider3D.prototype._createNode = function (scene) {
         var _this = this;
-        var sliderBackplate = CreateBox(this.name + "_sliderbackplate", {
+        var sliderBackplate = CreateBox("".concat(this.name, "_sliderbackplate"), {
             width: 1.0,
             height: 1.0,
             depth: 1.0,
@@ -171,12 +171,12 @@ var Slider3D = /** @class */ (function (_super) {
         SceneLoader.ImportMeshAsync(undefined, Slider3D.MODEL_BASE_URL, Slider3D.MODEL_FILENAME, scene)
             .then(function (result) {
             var sliderBackplateModel = result.meshes[1];
-            var sliderBarModel = result.meshes[1].clone(_this.name + "_sliderbar", sliderBackplate);
-            var sliderThumbModel = result.meshes[1].clone(_this.name + "_sliderthumb", sliderBackplate);
+            var sliderBarModel = result.meshes[1].clone("".concat(_this.name, "_sliderbar"), sliderBackplate);
+            var sliderThumbModel = result.meshes[1].clone("".concat(_this.name, "_sliderthumb"), sliderBackplate);
             sliderBackplateModel.visibility = 0;
             if (_this._sliderBackplateVisible) {
                 sliderBackplateModel.visibility = 1;
-                sliderBackplateModel.name = _this.name + "_sliderbackplate";
+                sliderBackplateModel.name = "".concat(_this.name, "_sliderbackplate");
                 sliderBackplateModel.isPickable = false;
                 sliderBackplateModel.scaling.x = 1;
                 sliderBackplateModel.scaling.z = 0.2;
@@ -214,9 +214,9 @@ var Slider3D = /** @class */ (function (_super) {
     };
     Slider3D.prototype._affectMaterial = function (mesh) {
         var _a, _b, _c;
-        this._sliderBackplateMaterial = (_a = this._sliderBackplateMaterial) !== null && _a !== void 0 ? _a : new MRDLBackplateMaterial(this.name + "_sliderbackplate_material", mesh.getScene());
-        this._sliderBarMaterial = (_b = this._sliderBarMaterial) !== null && _b !== void 0 ? _b : new MRDLSliderBarMaterial(this.name + "_sliderbar_material", mesh.getScene());
-        this._sliderThumbMaterial = (_c = this._sliderThumbMaterial) !== null && _c !== void 0 ? _c : new MRDLSliderThumbMaterial(this.name + "_sliderthumb_material", mesh.getScene());
+        this._sliderBackplateMaterial = (_a = this._sliderBackplateMaterial) !== null && _a !== void 0 ? _a : new MRDLBackplateMaterial("".concat(this.name, "_sliderbackplate_material"), mesh.getScene());
+        this._sliderBarMaterial = (_b = this._sliderBarMaterial) !== null && _b !== void 0 ? _b : new MRDLSliderBarMaterial("".concat(this.name, "_sliderbar_material"), mesh.getScene());
+        this._sliderThumbMaterial = (_c = this._sliderThumbMaterial) !== null && _c !== void 0 ? _c : new MRDLSliderThumbMaterial("".concat(this.name, "_sliderthumb_material"), mesh.getScene());
     };
     Slider3D.prototype._createBehavior = function () {
         var _this = this;

package/3D/controls/slider3D.js.map

@@ -1 +1 @@
-{"version":3,"file":"slider3D.js","sourceRoot":"","sources":["../../../../sourceES6/gui/src/3D/controls/slider3D.ts"],"names":[],"mappings":"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","sourcesContent":["import { Nullable } from \"@babylonjs/core/types\";\r\nimport { Observable } from \"@babylonjs/core/Misc/observable\";\r\nimport { Vector3 } from \"@babylonjs/core/Maths/math.vector\";\r\nimport { TransformNode } from \"@babylonjs/core/Meshes/transformNode\";\r\nimport { Scene } from \"@babylonjs/core/scene\";\r\nimport { Control3D } from \"./control3D\";\r\nimport { CreateBox } from \"@babylonjs/core/Meshes/Builders/boxBuilder\";\r\nimport { PointerDragBehavior } from \"@babylonjs/core/Behaviors/Meshes/pointerDragBehavior\";\r\nimport { AbstractMesh } from \"@babylonjs/core/Meshes/abstractMesh\";\r\nimport { SceneLoader } from \"@babylonjs/core/Loading/sceneLoader\";\r\nimport { MRDLSliderBarMaterial } from \"../materials/mrdl/mrdlSliderBarMaterial\";\r\nimport { MRDLSliderThumbMaterial } from \"../materials/mrdl/mrdlSliderThumbMaterial\";\r\nimport { MRDLBackplateMaterial } from \"../materials/mrdl/mrdlBackplateMaterial\";\r\n\r\nconst SLIDER_MIN: number = 0;\r\nconst SLIDER_MAX: number = 100;\r\nconst SLIDER_VAL: number = 50;\r\nconst SLIDER_STEP: number = 0;\r\nconst SLIDER_SCALING: number = 1.0;\r\nconst SLIDER_MARGIN: number = 0.2;\r\n\r\n/**\r\n * Class used to create a slider in 3D\r\n */\r\nexport class Slider3D extends Control3D {\r\n    /**\r\n     * Base Url for the models.\r\n     */\r\n    public static MODEL_BASE_URL: string = \"https://assets.babylonjs.com/meshes/MRTK/\";\r\n\r\n    /**\r\n     * File name for the 8x4 model.\r\n     */\r\n    public static MODEL_FILENAME: string = 'mrtk-fluent-backplate.glb';\r\n\r\n    private _sliderBackplate: AbstractMesh;\r\n    private _sliderBackplateMaterial: MRDLBackplateMaterial;\r\n    private _sliderBarMaterial: MRDLSliderBarMaterial;\r\n    private _sliderThumbMaterial: MRDLSliderThumbMaterial;\r\n    private _sliderThumb: AbstractMesh;\r\n    private _sliderBar: AbstractMesh;\r\n    private _sliderBackplateVisible: boolean;\r\n\r\n    private _minimum: number;\r\n    private _maximum: number;\r\n    private _value: number;\r\n    private _step: number;\r\n\r\n    /** Observable raised when the sldier value changes */\r\n    public onValueChangedObservable = new Observable<number>();\r\n\r\n    /**\r\n     * Creates a new slider\r\n     * @param name defines the control name\r\n     * @param sliderBackplateVisible defines if the control has a backplate, default is false\r\n     */\r\n    constructor(name?: string, sliderBackplateVisible?: boolean) {\r\n        super(name);\r\n        this._sliderBackplateVisible = sliderBackplateVisible || false;\r\n\r\n        this._minimum = SLIDER_MIN;\r\n        this._maximum = SLIDER_MAX;\r\n        this._step = SLIDER_STEP;\r\n        this._value = SLIDER_VAL;\r\n    }\r\n\r\n    /**\r\n     * Gets the mesh used to render this control\r\n     */\r\n    public get mesh(): Nullable<AbstractMesh> {\r\n        if (this.node) {\r\n            return this._sliderThumb;\r\n        }\r\n\r\n        return null;\r\n    }\r\n\r\n    /** Gets or sets minimum value */\r\n    public get minimum(): number {\r\n        return this._minimum;\r\n    }\r\n\r\n    public set minimum(value: number) {\r\n        if (this._minimum === value) {\r\n            return;\r\n        }\r\n\r\n        this._minimum = Math.max(value, SLIDER_MIN);\r\n        this._value = Math.max(Math.min(this._value, this._maximum), this._minimum);\r\n    }\r\n\r\n    /** Gets or sets maximum value */\r\n    public get maximum(): number {\r\n        return this._maximum;\r\n    }\r\n\r\n    public set maximum(value: number) {\r\n        if (this._maximum === value) {\r\n            return;\r\n        }\r\n\r\n        this._maximum = Math.max(value, this._minimum);\r\n        this._value = Math.max(Math.min(this._value, this._maximum), this._minimum);\r\n    }\r\n\r\n    /** Gets or sets step value */\r\n    public get step(): number {\r\n        return this._step;\r\n    }\r\n\r\n    public set step(value: number) {\r\n        if (this._step === value) {\r\n            return;\r\n        }\r\n\r\n        this._step = Math.max(Math.min(value, this._maximum - this._minimum), SLIDER_STEP);\r\n    }\r\n\r\n    /** Gets or sets current value */\r\n    public get value(): number {\r\n        return this._value;\r\n    }\r\n\r\n    public set value(value: number) {\r\n        if (this._value === value) {\r\n            return;\r\n        }\r\n\r\n        this._value = Math.max(Math.min(value, this._maximum), this._minimum);\r\n        this.onValueChangedObservable.notifyObservers(this._value);\r\n    }\r\n\r\n    protected get start(): number {\r\n        if (!this.node) {\r\n            return -SLIDER_SCALING / 2;\r\n        }\r\n\r\n        return this._sliderBar.position.x - this._sliderBar.scaling.x / 2;\r\n    }\r\n\r\n    protected get end(): number {\r\n        if (!this.node) {\r\n            return SLIDER_SCALING / 2;\r\n        }\r\n\r\n        return this._sliderBar.position.x + this._sliderBar.scaling.x / 2;\r\n    }\r\n\r\n    /**\r\n     * Gets the slider bar material used by this control\r\n     */\r\n    public get sliderBarMaterial(): MRDLSliderBarMaterial {\r\n        return this._sliderBarMaterial;\r\n    }\r\n\r\n    /**\r\n     * Gets the slider thumb material used by this control\r\n     */\r\n    public get sliderThumbMaterial(): MRDLSliderThumbMaterial {\r\n        return this._sliderThumbMaterial;\r\n    }\r\n\r\n    /**\r\n     * Gets the slider backplate material used by this control\r\n     */\r\n    public get sliderBackplateMaterial(): MRDLBackplateMaterial {\r\n        return this._sliderBackplateMaterial;\r\n    }\r\n\r\n    // Mesh association\r\n    protected _createNode(scene: Scene): TransformNode {\r\n        const sliderBackplate = CreateBox(`${this.name}_sliderbackplate`, {\r\n            width: 1.0,\r\n            height: 1.0,\r\n            depth: 1.0,\r\n        }, scene);\r\n        sliderBackplate.isPickable = false;\r\n        sliderBackplate.visibility = 0;\r\n        sliderBackplate.scaling = new Vector3(1, 0.5, 0.8);\r\n\r\n        SceneLoader.ImportMeshAsync(\r\n            undefined,\r\n            Slider3D.MODEL_BASE_URL,\r\n            Slider3D.MODEL_FILENAME,\r\n            scene)\r\n            .then((result) => {\r\n                const sliderBackplateModel = result.meshes[1];\r\n                const sliderBarModel = result.meshes[1].clone(`${this.name}_sliderbar`, sliderBackplate);\r\n                const sliderThumbModel = result.meshes[1].clone(`${this.name}_sliderthumb`, sliderBackplate);\r\n                sliderBackplateModel.visibility = 0;\r\n\r\n                if (this._sliderBackplateVisible) {\r\n                    sliderBackplateModel.visibility = 1;\r\n                    sliderBackplateModel.name = `${this.name}_sliderbackplate`;\r\n                    sliderBackplateModel.isPickable = false;\r\n                    sliderBackplateModel.scaling.x = 1;\r\n                    sliderBackplateModel.scaling.z = 0.2;\r\n                    sliderBackplateModel.parent = sliderBackplate;\r\n                    if (!!this._sliderBackplateMaterial) {\r\n                        sliderBackplateModel.material = this._sliderBackplateMaterial;\r\n                    }\r\n                    this._sliderBackplate = sliderBackplateModel;\r\n                }\r\n\r\n                if (!!sliderBarModel) {\r\n                    sliderBarModel.parent = sliderBackplate;\r\n                    sliderBarModel.position.z = -0.1;\r\n                    sliderBarModel.scaling = new Vector3(SLIDER_SCALING - SLIDER_MARGIN, 0.04, 0.3);\r\n                    sliderBarModel.isPickable = false;\r\n                    if (!!this._sliderBarMaterial) {\r\n                        sliderBarModel.material = this._sliderBarMaterial;\r\n                    }\r\n                    this._sliderBar = sliderBarModel;\r\n                }\r\n\r\n                if (!!sliderThumbModel) {\r\n                    sliderThumbModel.parent = sliderBackplate;\r\n                    sliderThumbModel.isPickable = true;\r\n                    sliderThumbModel.position.z = -0.115;\r\n                    sliderThumbModel.scaling = new Vector3(0.025, 0.3, 0.6);\r\n                    sliderThumbModel.position.x = this._convertToPosition(this.value);\r\n                    sliderThumbModel.addBehavior(this._createBehavior());\r\n                    if (!!this._sliderThumbMaterial) {\r\n                        sliderThumbModel.material = this._sliderThumbMaterial;\r\n                    }\r\n                    this._sliderThumb = sliderThumbModel;\r\n                }\r\n            });\r\n\r\n        this._affectMaterial(sliderBackplate);\r\n        return sliderBackplate;\r\n    }\r\n\r\n    protected _affectMaterial(mesh: AbstractMesh) {\r\n        this._sliderBackplateMaterial = this._sliderBackplateMaterial ?? new MRDLBackplateMaterial(`${this.name}_sliderbackplate_material`, mesh.getScene());\r\n        this._sliderBarMaterial = this._sliderBarMaterial ?? new MRDLSliderBarMaterial(`${this.name}_sliderbar_material`, mesh.getScene());\r\n        this._sliderThumbMaterial = this._sliderThumbMaterial ?? new MRDLSliderThumbMaterial(`${this.name}_sliderthumb_material`, mesh.getScene());\r\n    }\r\n\r\n    private _createBehavior(): PointerDragBehavior {\r\n        const pointerDragBehavior = new PointerDragBehavior({ dragAxis: Vector3.Right() });\r\n        pointerDragBehavior.moveAttached = false;\r\n\r\n        pointerDragBehavior.onDragObservable.add((event) => {\r\n            const newPosition = this._sliderThumb.position.x + event.dragDistance / this.scaling.x;\r\n            this._sliderThumb.position.x = Math.max(Math.min(newPosition, this.end), this.start);\r\n            this.value = this._convertToValue(this._sliderThumb.position.x);\r\n        });\r\n\r\n        pointerDragBehavior.onDragEndObservable.add((event) => {\r\n            this._sliderThumb.position.x = this._convertToPosition(this.value);\r\n        });\r\n\r\n        return pointerDragBehavior;\r\n    }\r\n\r\n    private _convertToPosition(value: number): number {\r\n        const position = ((value - this.minimum) / (this.maximum - this.minimum)) * (this.end - this.start) + this.start;\r\n        return Math.min(Math.max(position, this.start), this.end);\r\n    }\r\n\r\n    private _convertToValue(position: number): number {\r\n        let value = ((position - this.start) / (this.end - this.start)) * (this.maximum - this.minimum);\r\n        value = this.step ? Math.round(value / this.step) * this.step : value;\r\n\r\n        return Math.max(Math.min(this.minimum + value, this._maximum), this._minimum);\r\n    }\r\n\r\n    /**\r\n     * Releases all associated resources\r\n     */\r\n    public dispose() {\r\n        super.dispose();\r\n        this._sliderBar?.dispose();\r\n        this._sliderThumb?.dispose();\r\n        this._sliderBarMaterial?.dispose();\r\n        this._sliderThumbMaterial?.dispose();\r\n        this._sliderBackplate?.dispose();\r\n        this._sliderBackplateMaterial?.dispose();\r\n    }\r\n}\r\n"]}
+{"version":3,"file":"slider3D.js","sourceRoot":"","sources":["../../../../sourceES6/gui/src/3D/controls/slider3D.ts"],"names":[],"mappings":"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","sourcesContent":["import { Nullable } from \"@babylonjs/core/types\";\r\nimport { Observable } from \"@babylonjs/core/Misc/observable\";\r\nimport { Vector3 } from \"@babylonjs/core/Maths/math.vector\";\r\nimport { TransformNode } from \"@babylonjs/core/Meshes/transformNode\";\r\nimport { Scene } from \"@babylonjs/core/scene\";\r\nimport { Control3D } from \"./control3D\";\r\nimport { CreateBox } from \"@babylonjs/core/Meshes/Builders/boxBuilder\";\r\nimport { PointerDragBehavior } from \"@babylonjs/core/Behaviors/Meshes/pointerDragBehavior\";\r\nimport { AbstractMesh } from \"@babylonjs/core/Meshes/abstractMesh\";\r\nimport { SceneLoader } from \"@babylonjs/core/Loading/sceneLoader\";\r\nimport { MRDLSliderBarMaterial } from \"../materials/mrdl/mrdlSliderBarMaterial\";\r\nimport { MRDLSliderThumbMaterial } from \"../materials/mrdl/mrdlSliderThumbMaterial\";\r\nimport { MRDLBackplateMaterial } from \"../materials/mrdl/mrdlBackplateMaterial\";\r\n\r\nconst SLIDER_MIN: number = 0;\r\nconst SLIDER_MAX: number = 100;\r\nconst SLIDER_VAL: number = 50;\r\nconst SLIDER_STEP: number = 0;\r\nconst SLIDER_SCALING: number = 1.0;\r\nconst SLIDER_MARGIN: number = 0.2;\r\n\r\n/**\r\n * Class used to create a slider in 3D\r\n */\r\nexport class Slider3D extends Control3D {\r\n    /**\r\n     * Base Url for the models.\r\n     */\r\n    public static MODEL_BASE_URL: string = \"https://assets.babylonjs.com/meshes/MRTK/\";\r\n\r\n    /**\r\n     * File name for the 8x4 model.\r\n     */\r\n    public static MODEL_FILENAME: string = 'mrtk-fluent-backplate.glb';\r\n\r\n    private _sliderBackplate: AbstractMesh;\r\n    private _sliderBackplateMaterial: MRDLBackplateMaterial;\r\n    private _sliderBarMaterial: MRDLSliderBarMaterial;\r\n    private _sliderThumbMaterial: MRDLSliderThumbMaterial;\r\n    private _sliderThumb: AbstractMesh;\r\n    private _sliderBar: AbstractMesh;\r\n    private _sliderBackplateVisible: boolean;\r\n\r\n    private _minimum: number;\r\n    private _maximum: number;\r\n    private _value: number;\r\n    private _step: number;\r\n\r\n    /** Observable raised when the sldier value changes */\r\n    public onValueChangedObservable = new Observable<number>();\r\n\r\n    /**\r\n     * Creates a new slider\r\n     * @param name defines the control name\r\n     * @param sliderBackplateVisible defines if the control has a backplate, default is false\r\n     */\r\n    constructor(name?: string, sliderBackplateVisible?: boolean) {\r\n        super(name);\r\n        this._sliderBackplateVisible = sliderBackplateVisible || false;\r\n\r\n        this._minimum = SLIDER_MIN;\r\n        this._maximum = SLIDER_MAX;\r\n        this._step = SLIDER_STEP;\r\n        this._value = SLIDER_VAL;\r\n    }\r\n\r\n    /**\r\n     * Gets the mesh used to render this control\r\n     */\r\n    public get mesh(): Nullable<AbstractMesh> {\r\n        if (this.node) {\r\n            return this._sliderThumb;\r\n        }\r\n\r\n        return null;\r\n    }\r\n\r\n    /** Gets or sets minimum value */\r\n    public get minimum(): number {\r\n        return this._minimum;\r\n    }\r\n\r\n    public set minimum(value: number) {\r\n        if (this._minimum === value) {\r\n            return;\r\n        }\r\n\r\n        this._minimum = Math.max(value, SLIDER_MIN);\r\n        this._value = Math.max(Math.min(this._value, this._maximum), this._minimum);\r\n    }\r\n\r\n    /** Gets or sets maximum value */\r\n    public get maximum(): number {\r\n        return this._maximum;\r\n    }\r\n\r\n    public set maximum(value: number) {\r\n        if (this._maximum === value) {\r\n            return;\r\n        }\r\n\r\n        this._maximum = Math.max(value, this._minimum);\r\n        this._value = Math.max(Math.min(this._value, this._maximum), this._minimum);\r\n    }\r\n\r\n    /** Gets or sets step value */\r\n    public get step(): number {\r\n        return this._step;\r\n    }\r\n\r\n    public set step(value: number) {\r\n        if (this._step === value) {\r\n            return;\r\n        }\r\n\r\n        this._step = Math.max(Math.min(value, this._maximum - this._minimum), SLIDER_STEP);\r\n    }\r\n\r\n    /** Gets or sets current value */\r\n    public get value(): number {\r\n        return this._value;\r\n    }\r\n\r\n    public set value(value: number) {\r\n        if (this._value === value) {\r\n            return;\r\n        }\r\n\r\n        this._value = Math.max(Math.min(value, this._maximum), this._minimum);\r\n        this.onValueChangedObservable.notifyObservers(this._value);\r\n    }\r\n\r\n    protected get start(): number {\r\n        if (!this.node) {\r\n            return -SLIDER_SCALING / 2;\r\n        }\r\n\r\n        return this._sliderBar.position.x - this._sliderBar.scaling.x / 2;\r\n    }\r\n\r\n    protected get end(): number {\r\n        if (!this.node) {\r\n            return SLIDER_SCALING / 2;\r\n        }\r\n\r\n        return this._sliderBar.position.x + this._sliderBar.scaling.x / 2;\r\n    }\r\n\r\n    /**\r\n     * Gets the slider bar material used by this control\r\n     */\r\n    public get sliderBarMaterial(): MRDLSliderBarMaterial {\r\n        return this._sliderBarMaterial;\r\n    }\r\n\r\n    /**\r\n     * Gets the slider thumb material used by this control\r\n     */\r\n    public get sliderThumbMaterial(): MRDLSliderThumbMaterial {\r\n        return this._sliderThumbMaterial;\r\n    }\r\n\r\n    /**\r\n     * Gets the slider backplate material used by this control\r\n     */\r\n    public get sliderBackplateMaterial(): MRDLBackplateMaterial {\r\n        return this._sliderBackplateMaterial;\r\n    }\r\n\r\n    // Mesh association\r\n    protected _createNode(scene: Scene): TransformNode {\r\n        const sliderBackplate = CreateBox(`${this.name}_sliderbackplate`, {\r\n            width: 1.0,\r\n            height: 1.0,\r\n            depth: 1.0,\r\n        }, scene);\r\n        sliderBackplate.isPickable = false;\r\n        sliderBackplate.visibility = 0;\r\n        sliderBackplate.scaling = new Vector3(1, 0.5, 0.8);\r\n\r\n        SceneLoader.ImportMeshAsync(\r\n            undefined,\r\n            Slider3D.MODEL_BASE_URL,\r\n            Slider3D.MODEL_FILENAME,\r\n            scene)\r\n            .then((result) => {\r\n                const sliderBackplateModel = result.meshes[1];\r\n                const sliderBarModel = result.meshes[1].clone(`${this.name}_sliderbar`, sliderBackplate);\r\n                const sliderThumbModel = result.meshes[1].clone(`${this.name}_sliderthumb`, sliderBackplate);\r\n                sliderBackplateModel.visibility = 0;\r\n\r\n                if (this._sliderBackplateVisible) {\r\n                    sliderBackplateModel.visibility = 1;\r\n                    sliderBackplateModel.name = `${this.name}_sliderbackplate`;\r\n                    sliderBackplateModel.isPickable = false;\r\n                    sliderBackplateModel.scaling.x = 1;\r\n                    sliderBackplateModel.scaling.z = 0.2;\r\n                    sliderBackplateModel.parent = sliderBackplate;\r\n                    if (!!this._sliderBackplateMaterial) {\r\n                        sliderBackplateModel.material = this._sliderBackplateMaterial;\r\n                    }\r\n                    this._sliderBackplate = sliderBackplateModel;\r\n                }\r\n\r\n                if (!!sliderBarModel) {\r\n                    sliderBarModel.parent = sliderBackplate;\r\n                    sliderBarModel.position.z = -0.1;\r\n                    sliderBarModel.scaling = new Vector3(SLIDER_SCALING - SLIDER_MARGIN, 0.04, 0.3);\r\n                    sliderBarModel.isPickable = false;\r\n                    if (!!this._sliderBarMaterial) {\r\n                        sliderBarModel.material = this._sliderBarMaterial;\r\n                    }\r\n                    this._sliderBar = sliderBarModel;\r\n                }\r\n\r\n                if (!!sliderThumbModel) {\r\n                    sliderThumbModel.parent = sliderBackplate;\r\n                    sliderThumbModel.isPickable = true;\r\n                    sliderThumbModel.position.z = -0.115;\r\n                    sliderThumbModel.scaling = new Vector3(0.025, 0.3, 0.6);\r\n                    sliderThumbModel.position.x = this._convertToPosition(this.value);\r\n                    sliderThumbModel.addBehavior(this._createBehavior());\r\n                    if (!!this._sliderThumbMaterial) {\r\n                        sliderThumbModel.material = this._sliderThumbMaterial;\r\n                    }\r\n                    this._sliderThumb = sliderThumbModel;\r\n                }\r\n            });\r\n\r\n        this._affectMaterial(sliderBackplate);\r\n        return sliderBackplate;\r\n    }\r\n\r\n    protected _affectMaterial(mesh: AbstractMesh) {\r\n        this._sliderBackplateMaterial = this._sliderBackplateMaterial ?? new MRDLBackplateMaterial(`${this.name}_sliderbackplate_material`, mesh.getScene());\r\n        this._sliderBarMaterial = this._sliderBarMaterial ?? new MRDLSliderBarMaterial(`${this.name}_sliderbar_material`, mesh.getScene());\r\n        this._sliderThumbMaterial = this._sliderThumbMaterial ?? new MRDLSliderThumbMaterial(`${this.name}_sliderthumb_material`, mesh.getScene());\r\n    }\r\n\r\n    private _createBehavior(): PointerDragBehavior {\r\n        const pointerDragBehavior = new PointerDragBehavior({ dragAxis: Vector3.Right() });\r\n        pointerDragBehavior.moveAttached = false;\r\n\r\n        pointerDragBehavior.onDragObservable.add((event) => {\r\n            const newPosition = this._sliderThumb.position.x + event.dragDistance / this.scaling.x;\r\n            this._sliderThumb.position.x = Math.max(Math.min(newPosition, this.end), this.start);\r\n            this.value = this._convertToValue(this._sliderThumb.position.x);\r\n        });\r\n\r\n        pointerDragBehavior.onDragEndObservable.add((event) => {\r\n            this._sliderThumb.position.x = this._convertToPosition(this.value);\r\n        });\r\n\r\n        return pointerDragBehavior;\r\n    }\r\n\r\n    private _convertToPosition(value: number): number {\r\n        const position = ((value - this.minimum) / (this.maximum - this.minimum)) * (this.end - this.start) + this.start;\r\n        return Math.min(Math.max(position, this.start), this.end);\r\n    }\r\n\r\n    private _convertToValue(position: number): number {\r\n        let value = ((position - this.start) / (this.end - this.start)) * (this.maximum - this.minimum);\r\n        value = this.step ? Math.round(value / this.step) * this.step : value;\r\n\r\n        return Math.max(Math.min(this.minimum + value, this._maximum), this._minimum);\r\n    }\r\n\r\n    /**\r\n     * Releases all associated resources\r\n     */\r\n    public dispose() {\r\n        super.dispose();\r\n        this._sliderBar?.dispose();\r\n        this._sliderThumb?.dispose();\r\n        this._sliderBarMaterial?.dispose();\r\n        this._sliderThumbMaterial?.dispose();\r\n        this._sliderBackplate?.dispose();\r\n        this._sliderBackplateMaterial?.dispose();\r\n    }\r\n}\r\n"]}

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

@@ -2,6 +2,7 @@ import { Vector3 } from "@babylonjs/core/Maths/math.vector";
 import { Mesh } from "@babylonjs/core/Meshes/mesh";
 import { TransformNode } from "@babylonjs/core/Meshes/transformNode";
 import { Scene } from "@babylonjs/core/scene";
+import { Observable } from "@babylonjs/core/Misc/observable";
 import { Button3D } from "./button3D";
 /**
  * Class used to create a touchable button in 3D
@@ -10,6 +11,13 @@ export declare class TouchButton3D extends Button3D {
     private _collisionMesh;
     private _collidableFrontDirection;
     protected _isNearPressed: boolean;
+    private _isToggleButton;
+    private _toggleState;
+    private _toggleButtonCallback;
+    /**
+     * An event triggered when the button is toggled. Only fired if 'isToggleButton' is true
+     */
+    onToggleObservable: Observable<boolean>;
     /**
      * Creates a new touchable button
      * @param name defines the control name
@@ -30,6 +38,19 @@ export declare class TouchButton3D extends Button3D {
      * @param collisionMesh the new collision mesh for the button
      */
     set collisionMesh(collisionMesh: Mesh);
+    /**
+     * Setter for if this TouchButton3D should be treated as a toggle button
+     * @param value If this TouchHolographicButton should act like a toggle button
+     */
+    set isToggleButton(value: boolean);
+    get isToggleButton(): boolean;
+    /**
+     * A public entrypoint to set the toggle state of the TouchHolographicButton. Only works if 'isToggleButton' is true
+     * @param newState The new state to set the TouchHolographicButton's toggle state to
+     */
+    set isToggled(newState: boolean);
+    get isToggled(): boolean;
+    protected _onToggle(newState: boolean): void;
     private _isInteractionInFrontOfButton;
     protected _getInteractionHeight(interactionPos: Vector3, basePos: Vector3): number;
     /** @hidden */

package/3D/controls/touchButton3D.js

@@ -3,6 +3,7 @@ import { __extends } from "tslib";
 import { Vector3 } from "@babylonjs/core/Maths/math.vector.js";
 import { PointerEventTypes } from "@babylonjs/core/Events/pointerEvents.js";
 import { TmpVectors } from "@babylonjs/core/Maths/math.vector.js";
+import { Observable } from "@babylonjs/core/Misc/observable.js";
 import { Button3D } from "./button3D.js";
 /**
  * Class used to create a touchable button in 3D
@@ -17,6 +18,13 @@ var TouchButton3D = /** @class */ (function (_super) {
     function TouchButton3D(name, collisionMesh) {
         var _this = _super.call(this, name) || this;
         _this._isNearPressed = false;
+        _this._isToggleButton = false;
+        _this._toggleState = false;
+        _this._toggleButtonCallback = function () { _this._onToggle(!_this._toggleState); };
+        /**
+         * An event triggered when the button is toggled. Only fired if 'isToggleButton' is true
+         */
+        _this.onToggleObservable = new Observable();
         _this.collidableFrontDirection = Vector3.Zero();
         if (collisionMesh) {
             _this.collisionMesh = collisionMesh;
@@ -59,12 +67,10 @@ var TouchButton3D = /** @class */ (function (_super) {
          * @param collisionMesh the new collision mesh for the button
          */
         set: function (collisionMesh) {
-            if (this._collisionMesh) {
-                this._collisionMesh.dispose();
-            }
-            // parent the mesh to sync transforms
-            if (!collisionMesh.parent && this.mesh) {
-                collisionMesh.setParent(this.mesh);
+            var _a, _b;
+            // Remove the GUI3DManager's data from the previous collision mesh's reserved data store
+            if ((_b = (_a = this._collisionMesh) === null || _a === void 0 ? void 0 : _a.reservedDataStore) === null || _b === void 0 ? void 0 : _b.GUI3D) {
+                this._collisionMesh.reservedDataStore.GUI3D = {};
             }
             this._collisionMesh = collisionMesh;
             this._injectGUI3DReservedDataStore(this._collisionMesh).control = this;
@@ -74,6 +80,53 @@ var TouchButton3D = /** @class */ (function (_super) {
         enumerable: false,
         configurable: true
     });
+    Object.defineProperty(TouchButton3D.prototype, "isToggleButton", {
+        get: function () {
+            return this._isToggleButton;
+        },
+        /**
+         * Setter for if this TouchButton3D should be treated as a toggle button
+         * @param value If this TouchHolographicButton should act like a toggle button
+         */
+        set: function (value) {
+            if (value === this._isToggleButton) {
+                return;
+            }
+            this._isToggleButton = value;
+            if (value) {
+                this.onPointerUpObservable.add(this._toggleButtonCallback);
+            }
+            else {
+                this.onPointerUpObservable.removeCallback(this._toggleButtonCallback);
+                // Safety check, reset the button if it's toggled on but no longer a toggle button
+                if (this._toggleState) {
+                    this._onToggle(false);
+                }
+            }
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(TouchButton3D.prototype, "isToggled", {
+        get: function () {
+            return this._toggleState;
+        },
+        /**
+         * A public entrypoint to set the toggle state of the TouchHolographicButton. Only works if 'isToggleButton' is true
+         * @param newState The new state to set the TouchHolographicButton's toggle state to
+         */
+        set: function (newState) {
+            if (this._isToggleButton && this._toggleState !== newState) {
+                this._onToggle(newState);
+            }
+        },
+        enumerable: false,
+        configurable: true
+    });
+    TouchButton3D.prototype._onToggle = function (newState) {
+        this._toggleState = newState;
+        this.onToggleObservable.notifyObservers(newState);
+    };
     // Returns true if the collidable is in front of the button, or if the button has no front direction
     TouchButton3D.prototype._isInteractionInFrontOfButton = function (collidablePos) {
         return this._getInteractionHeight(collidablePos, this._collisionMesh.getAbsolutePosition()) > 0;
@@ -123,6 +176,9 @@ var TouchButton3D = /** @class */ (function (_super) {
      */
     TouchButton3D.prototype.dispose = function () {
         _super.prototype.dispose.call(this);
+        // Clean up toggle observables
+        this.onPointerUpObservable.removeCallback(this._toggleButtonCallback);
+        this.onToggleObservable.clear();
         if (this._collisionMesh) {
             this._collisionMesh.dispose();
         }

package/3D/controls/touchButton3D.js.map

@@ -1 +1 @@
-{"version":3,"file":"touchButton3D.js","sourceRoot":"","sources":["../../../../sourceES6/gui/src/3D/controls/touchButton3D.ts"],"names":[],"mappings":"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","sourcesContent":["// Assumptions: absolute position of button mesh is inside the mesh\r\n\r\nimport { Vector3 } from \"@babylonjs/core/Maths/math.vector\";\r\nimport { Mesh } from \"@babylonjs/core/Meshes/mesh\";\r\nimport { PointerEventTypes } from \"@babylonjs/core/Events/pointerEvents\";\r\nimport { TransformNode } from \"@babylonjs/core/Meshes/transformNode\";\r\nimport { Scene } from \"@babylonjs/core/scene\";\r\nimport { TmpVectors } from \"@babylonjs/core/Maths/math.vector\";\r\n\r\nimport { Button3D } from \"./button3D\";\r\n\r\n/**\r\n * Class used to create a touchable button in 3D\r\n */\r\nexport class TouchButton3D extends Button3D {\r\n    private _collisionMesh: Mesh;\r\n\r\n    // 'front' direction. If Vector3.Zero, there is no front and all directions of interaction are accepted\r\n    private _collidableFrontDirection: Vector3;\r\n    protected _isNearPressed = false;\r\n\r\n    /**\r\n     * Creates a new touchable button\r\n     * @param name defines the control name\r\n     * @param collisionMesh mesh to track collisions with\r\n     */\r\n    constructor(name?: string, collisionMesh?: Mesh) {\r\n        super(name);\r\n\r\n        this.collidableFrontDirection = Vector3.Zero();\r\n\r\n        if (collisionMesh) {\r\n            this.collisionMesh = collisionMesh;\r\n        }\r\n    }\r\n\r\n    /**\r\n     * Sets the front-facing direction of the button. Pass in Vector3.Zero to allow interactions from any direction\r\n     * @param frontDir the forward direction of the button\r\n     */\r\n    public set collidableFrontDirection(frontWorldDir: Vector3) {\r\n        this._collidableFrontDirection = frontWorldDir.normalize();\r\n\r\n        if (this._collisionMesh) {\r\n            const invert = TmpVectors.Matrix[0];\r\n\r\n            invert.copyFrom(this._collisionMesh.getWorldMatrix());\r\n            invert.invert();\r\n            Vector3.TransformNormalToRef(this._collidableFrontDirection, invert, this._collidableFrontDirection);\r\n            this._collidableFrontDirection.normalize();\r\n        }\r\n    }\r\n\r\n    /**\r\n     * Returns the front-facing direction of the button, or Vector3.Zero if there is no 'front'\r\n     */\r\n    public get collidableFrontDirection() {\r\n        if (this._collisionMesh) {\r\n            // Update the front direction to reflect any rotations of the collision mesh\r\n            const transformedDirection = TmpVectors.Vector3[0];\r\n            Vector3.TransformNormalToRef(this._collidableFrontDirection, this._collisionMesh.getWorldMatrix(), transformedDirection);\r\n\r\n            return transformedDirection.normalize();\r\n        }\r\n\r\n        return this._collidableFrontDirection;\r\n    }\r\n\r\n    /**\r\n     * Sets the mesh used for testing input collision\r\n     * @param collisionMesh the new collision mesh for the button\r\n     */\r\n    public set collisionMesh(collisionMesh: Mesh) {\r\n        if (this._collisionMesh) {\r\n            this._collisionMesh.dispose();\r\n        }\r\n\r\n        // parent the mesh to sync transforms\r\n        if (!collisionMesh.parent && this.mesh) {\r\n            collisionMesh.setParent(this.mesh);\r\n        }\r\n\r\n        this._collisionMesh = collisionMesh;\r\n        this._injectGUI3DReservedDataStore(this._collisionMesh).control = this;\r\n        this._collisionMesh.isNearPickable = true;\r\n\r\n        this.collidableFrontDirection = collisionMesh.forward;\r\n    }\r\n\r\n    // Returns true if the collidable is in front of the button, or if the button has no front direction\r\n    private _isInteractionInFrontOfButton(collidablePos: Vector3) {\r\n        return this._getInteractionHeight(collidablePos, this._collisionMesh.getAbsolutePosition()) > 0;\r\n    }\r\n\r\n    // Returns true if the collidable is in front of the button, or if the button has no front direction\r\n    protected _getInteractionHeight(interactionPos: Vector3, basePos: Vector3) {\r\n        const frontDir = this.collidableFrontDirection;\r\n        if (frontDir.length() === 0) {\r\n            // The button has no front, just return the distance to the base\r\n            return Vector3.Distance(interactionPos, basePos);\r\n        }\r\n        const d = Vector3.Dot(basePos, frontDir);\r\n        const abc = Vector3.Dot(interactionPos, frontDir);\r\n\r\n        return abc - d;\r\n    }\r\n\r\n    /** @hidden */\r\n    public _generatePointerEventType(providedType: number, nearMeshPosition: Vector3, activeInteractionCount: number): number {\r\n        if (providedType === PointerEventTypes.POINTERDOWN) {\r\n            if (!this._isInteractionInFrontOfButton(nearMeshPosition)) {\r\n                // Near interaction mesh is behind the button, don't send a pointer down\r\n                return PointerEventTypes.POINTERMOVE;\r\n            }\r\n            else {\r\n                this._isNearPressed = true;\r\n            }\r\n        }\r\n        if (providedType === PointerEventTypes.POINTERUP) {\r\n            if (activeInteractionCount == 0) {\r\n                // We get the release for the down we swallowed earlier, swallow as well\r\n                return PointerEventTypes.POINTERMOVE;\r\n            }\r\n            else {\r\n                this._isNearPressed = false;\r\n            }\r\n        }\r\n\r\n        return providedType;\r\n    }\r\n\r\n    protected _getTypeName(): string {\r\n        return \"TouchButton3D\";\r\n    }\r\n\r\n    // Mesh association\r\n    protected _createNode(scene: Scene): TransformNode {\r\n        return super._createNode(scene);\r\n    }\r\n\r\n    /**\r\n     * Releases all associated resources\r\n     */\r\n    public dispose() {\r\n        super.dispose();\r\n\r\n        if (this._collisionMesh) {\r\n            this._collisionMesh.dispose();\r\n        }\r\n    }\r\n}"]}
+{"version":3,"file":"touchButton3D.js","sourceRoot":"","sources":["../../../../sourceES6/gui/src/3D/controls/touchButton3D.ts"],"names":[],"mappings":"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","sourcesContent":["// Assumptions: absolute position of button mesh is inside the mesh\r\n\r\nimport { Vector3 } from \"@babylonjs/core/Maths/math.vector\";\r\nimport { Mesh } from \"@babylonjs/core/Meshes/mesh\";\r\nimport { PointerEventTypes } from \"@babylonjs/core/Events/pointerEvents\";\r\nimport { TransformNode } from \"@babylonjs/core/Meshes/transformNode\";\r\nimport { Scene } from \"@babylonjs/core/scene\";\r\nimport { TmpVectors } from \"@babylonjs/core/Maths/math.vector\";\r\nimport { Observable } from \"@babylonjs/core/Misc/observable\";\r\n\r\nimport { Button3D } from \"./button3D\";\r\n\r\n/**\r\n * Class used to create a touchable button in 3D\r\n */\r\nexport class TouchButton3D extends Button3D {\r\n    private _collisionMesh: Mesh;\r\n\r\n    // 'front' direction. If Vector3.Zero, there is no front and all directions of interaction are accepted\r\n    private _collidableFrontDirection: Vector3;\r\n    protected _isNearPressed = false;\r\n\r\n    private _isToggleButton = false;\r\n    private _toggleState = false;\r\n    private _toggleButtonCallback = () => { this._onToggle(!this._toggleState); };\r\n\r\n    /**\r\n     * An event triggered when the button is toggled. Only fired if 'isToggleButton' is true\r\n     */\r\n    public onToggleObservable = new Observable<boolean>();\r\n\r\n    /**\r\n     * Creates a new touchable button\r\n     * @param name defines the control name\r\n     * @param collisionMesh mesh to track collisions with\r\n     */\r\n    constructor(name?: string, collisionMesh?: Mesh) {\r\n        super(name);\r\n\r\n        this.collidableFrontDirection = Vector3.Zero();\r\n\r\n        if (collisionMesh) {\r\n            this.collisionMesh = collisionMesh;\r\n        }\r\n    }\r\n\r\n    /**\r\n     * Sets the front-facing direction of the button. Pass in Vector3.Zero to allow interactions from any direction\r\n     * @param frontDir the forward direction of the button\r\n     */\r\n    public set collidableFrontDirection(frontWorldDir: Vector3) {\r\n        this._collidableFrontDirection = frontWorldDir.normalize();\r\n\r\n        if (this._collisionMesh) {\r\n            const invert = TmpVectors.Matrix[0];\r\n\r\n            invert.copyFrom(this._collisionMesh.getWorldMatrix());\r\n            invert.invert();\r\n            Vector3.TransformNormalToRef(this._collidableFrontDirection, invert, this._collidableFrontDirection);\r\n            this._collidableFrontDirection.normalize();\r\n        }\r\n    }\r\n\r\n    /**\r\n     * Returns the front-facing direction of the button, or Vector3.Zero if there is no 'front'\r\n     */\r\n    public get collidableFrontDirection() {\r\n        if (this._collisionMesh) {\r\n            // Update the front direction to reflect any rotations of the collision mesh\r\n            const transformedDirection = TmpVectors.Vector3[0];\r\n            Vector3.TransformNormalToRef(this._collidableFrontDirection, this._collisionMesh.getWorldMatrix(), transformedDirection);\r\n\r\n            return transformedDirection.normalize();\r\n        }\r\n\r\n        return this._collidableFrontDirection;\r\n    }\r\n\r\n    /**\r\n     * Sets the mesh used for testing input collision\r\n     * @param collisionMesh the new collision mesh for the button\r\n     */\r\n    public set collisionMesh(collisionMesh: Mesh) {\r\n        // Remove the GUI3DManager's data from the previous collision mesh's reserved data store\r\n        if (this._collisionMesh?.reservedDataStore?.GUI3D) {\r\n            this._collisionMesh.reservedDataStore.GUI3D = {};\r\n        }\r\n\r\n        this._collisionMesh = collisionMesh;\r\n        this._injectGUI3DReservedDataStore(this._collisionMesh).control = this;\r\n        this._collisionMesh.isNearPickable = true;\r\n\r\n        this.collidableFrontDirection = collisionMesh.forward;\r\n    }\r\n\r\n    /**\r\n     * Setter for if this TouchButton3D should be treated as a toggle button\r\n     * @param value If this TouchHolographicButton should act like a toggle button\r\n     */\r\n    public set isToggleButton(value: boolean) {\r\n        if (value === this._isToggleButton) {\r\n            return;\r\n        }\r\n\r\n        this._isToggleButton = value;\r\n\r\n        if (value) {\r\n            this.onPointerUpObservable.add(this._toggleButtonCallback);\r\n        }\r\n        else {\r\n            this.onPointerUpObservable.removeCallback(this._toggleButtonCallback);\r\n\r\n            // Safety check, reset the button if it's toggled on but no longer a toggle button\r\n            if (this._toggleState) {\r\n                this._onToggle(false);\r\n            }\r\n        }\r\n    }\r\n    public get isToggleButton() {\r\n        return this._isToggleButton;\r\n    }\r\n\r\n    /**\r\n     * A public entrypoint to set the toggle state of the TouchHolographicButton. Only works if 'isToggleButton' is true\r\n     * @param newState The new state to set the TouchHolographicButton's toggle state to\r\n     */\r\n    public set isToggled(newState: boolean) {\r\n        if (this._isToggleButton && this._toggleState !== newState) {\r\n            this._onToggle(newState);\r\n        }\r\n    }\r\n    public get isToggled() {\r\n        return this._toggleState;\r\n    }\r\n\r\n    protected _onToggle(newState: boolean) {\r\n        this._toggleState = newState;\r\n        this.onToggleObservable.notifyObservers(newState);\r\n    }\r\n\r\n    // Returns true if the collidable is in front of the button, or if the button has no front direction\r\n    private _isInteractionInFrontOfButton(collidablePos: Vector3) {\r\n        return this._getInteractionHeight(collidablePos, this._collisionMesh.getAbsolutePosition()) > 0;\r\n    }\r\n\r\n    // Returns true if the collidable is in front of the button, or if the button has no front direction\r\n    protected _getInteractionHeight(interactionPos: Vector3, basePos: Vector3) {\r\n        const frontDir = this.collidableFrontDirection;\r\n        if (frontDir.length() === 0) {\r\n            // The button has no front, just return the distance to the base\r\n            return Vector3.Distance(interactionPos, basePos);\r\n        }\r\n        const d = Vector3.Dot(basePos, frontDir);\r\n        const abc = Vector3.Dot(interactionPos, frontDir);\r\n\r\n        return abc - d;\r\n    }\r\n\r\n    /** @hidden */\r\n    public _generatePointerEventType(providedType: number, nearMeshPosition: Vector3, activeInteractionCount: number): number {\r\n        if (providedType === PointerEventTypes.POINTERDOWN) {\r\n            if (!this._isInteractionInFrontOfButton(nearMeshPosition)) {\r\n                // Near interaction mesh is behind the button, don't send a pointer down\r\n                return PointerEventTypes.POINTERMOVE;\r\n            }\r\n            else {\r\n                this._isNearPressed = true;\r\n            }\r\n        }\r\n        if (providedType === PointerEventTypes.POINTERUP) {\r\n            if (activeInteractionCount == 0) {\r\n                // We get the release for the down we swallowed earlier, swallow as well\r\n                return PointerEventTypes.POINTERMOVE;\r\n            }\r\n            else {\r\n                this._isNearPressed = false;\r\n            }\r\n        }\r\n\r\n        return providedType;\r\n    }\r\n\r\n    protected _getTypeName(): string {\r\n        return \"TouchButton3D\";\r\n    }\r\n\r\n    // Mesh association\r\n    protected _createNode(scene: Scene): TransformNode {\r\n        return super._createNode(scene);\r\n    }\r\n\r\n    /**\r\n     * Releases all associated resources\r\n     */\r\n    public dispose() {\r\n        super.dispose();\r\n\r\n        // Clean up toggle observables\r\n        this.onPointerUpObservable.removeCallback(this._toggleButtonCallback);\r\n        this.onToggleObservable.clear();\r\n\r\n        if (this._collisionMesh) {\r\n            this._collisionMesh.dispose();\r\n        }\r\n    }\r\n}"]}

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

@@ -3,6 +3,7 @@ import { StandardMaterial } from "@babylonjs/core/Materials/standardMaterial";
 import { TransformNode } from "@babylonjs/core/Meshes/transformNode";
 import { Mesh } from "@babylonjs/core/Meshes/mesh";
 import { Scene } from "@babylonjs/core/scene";
+import { FluentMaterial } from "../materials/fluent/fluentMaterial";
 import { FluentButtonMaterial } from "../materials/fluentButton/fluentButtonMaterial";
 import { AdvancedDynamicTexture } from "../../2D/advancedDynamicTexture";
 import { TouchButton3D } from "./touchButton3D";
@@ -33,6 +34,8 @@ export declare class TouchHolographicButton extends TouchButton3D {
     private _pointerHoverObserver;
     private _frontPlateDepth;
     private _backPlateDepth;
+    private _backplateColor;
+    private _backplateToggledColor;
     private _tooltipFade;
     private _tooltipTextBlock;
     private _tooltipTexture;
@@ -63,7 +66,7 @@ export declare class TouchHolographicButton extends TouchButton3D {
     /**
      * Gets the back material used by this button
      */
-    get backMaterial(): StandardMaterial;
+    get backMaterial(): FluentMaterial;
     /**
      * Gets the front material used by this button
      */
@@ -92,6 +95,7 @@ export declare class TouchHolographicButton extends TouchButton3D {
     private _createBackMaterial;
     private _createFrontMaterial;
     private _createPlateMaterial;
+    protected _onToggle(newState: boolean): void;
     protected _affectMaterial(mesh: Mesh): void;
     /**
      * Releases all associated resources

package/3D/controls/touchHolographicButton.js

@@ -5,6 +5,7 @@ import { Mesh } from "@babylonjs/core/Meshes/mesh.js";
 import { CreatePlane } from "@babylonjs/core/Meshes/Builders/planeBuilder.js";
 import { CreateBox } from "@babylonjs/core/Meshes/Builders/boxBuilder.js";
 import { FadeInOutBehavior } from "@babylonjs/core/Behaviors/Meshes/fadeInOutBehavior.js";
+import { FluentMaterial } from "../materials/fluent/fluentMaterial.js";
 import { FluentButtonMaterial } from "../materials/fluentButton/fluentButtonMaterial.js";
 import { StackPanel } from "../../2D/controls/stackPanel.js";
 import { Image } from "../../2D/controls/image.js";
@@ -32,6 +33,8 @@ var TouchHolographicButton = /** @class */ (function (_super) {
         _this._isBackplateVisible = true;
         _this._frontPlateDepth = 0.5;
         _this._backPlateDepth = 0.04;
+        _this._backplateColor = new Color3(0.08, 0.15, 0.55);
+        _this._backplateToggledColor = new Color3(0.25, 0.4, 0.95);
         _this._shareMaterials = shareMaterials;
         _this.pointerEnterAnimation = function () {
             _this._frontMaterial.leftBlobEnable = true;
@@ -59,7 +62,7 @@ var TouchHolographicButton = /** @class */ (function (_super) {
             if (_this._frontPlate && _this._isNearPressed) {
                 var scale = Vector3.Zero();
                 if (_this._backPlate.getWorldMatrix().decompose(scale, undefined, undefined)) {
-                    var interactionHeight = _this._getInteractionHeight(position, _this._backPlate.position) / scale.z;
+                    var interactionHeight = _this._getInteractionHeight(position, _this._backPlate.getAbsolutePosition()) / scale.z;
                     interactionHeight = Scalar.Clamp(interactionHeight - (_this._backPlateDepth / 2), 0.2 * _this._frontPlateDepth, _this._frontPlateDepth);
                     _this._frontPlate.scaling.z = interactionHeight;
                     _this._frontPlate.position = Vector3.Forward(_this._frontPlate._scene.useRightHandedSystem).scale((_this._frontPlateDepth - interactionHeight) / 2);
@@ -289,7 +292,7 @@ var TouchHolographicButton = /** @class */ (function (_super) {
         var _this = this;
         var _a;
         this.name = (_a = this.name) !== null && _a !== void 0 ? _a : "TouchHolographicButton";
-        var collisionMesh = CreateBox(this.name + "_collisionMesh", {
+        var collisionMesh = CreateBox("".concat(this.name, "_collisionMesh"), {
             width: 1.0,
             height: 1.0,
             depth: this._frontPlateDepth,
@@ -300,17 +303,26 @@ var TouchHolographicButton = /** @class */ (function (_super) {
         collisionMesh.position = Vector3.Forward(scene.useRightHandedSystem).scale(-this._frontPlateDepth / 2);
         SceneLoader.ImportMeshAsync(undefined, TouchHolographicButton.MODEL_BASE_URL, TouchHolographicButton.MODEL_FILENAME, scene)
             .then(function (result) {
+            var alphaMesh = CreateBox("${this.name}_alphaMesh", {
+                width: 1.0,
+                height: 1.0,
+                depth: 1.0,
+            }, scene);
+            alphaMesh.isPickable = false;
+            alphaMesh.material = new StandardMaterial("${this.name}_alphaMesh_material", scene);
+            alphaMesh.material.alpha = 0.15;
             var importedFrontPlate = result.meshes[1];
-            importedFrontPlate.name = _this.name + "_frontPlate";
+            importedFrontPlate.name = "".concat(_this.name, "_frontPlate");
             importedFrontPlate.isPickable = false;
             importedFrontPlate.scaling.z = _this._frontPlateDepth;
+            alphaMesh.parent = importedFrontPlate;
             importedFrontPlate.parent = collisionMesh;
             if (!!_this._frontMaterial) {
                 importedFrontPlate.material = _this._frontMaterial;
             }
             _this._frontPlate = importedFrontPlate;
         });
-        this._backPlate = CreateBox(this.name + "_backPlate", {
+        this._backPlate = CreateBox("".concat(this.name, "_backPlate"), {
             width: 1.0,
             height: 1.0,
             depth: this._backPlateDepth,
@@ -318,7 +330,7 @@ var TouchHolographicButton = /** @class */ (function (_super) {
         this._backPlate.position = Vector3.Forward(scene.useRightHandedSystem).scale(-this._backPlateDepth / 2);
         this._backPlate.isPickable = false;
         this._textPlate = _super.prototype._createNode.call(this, scene);
-        this._textPlate.name = this.name + "_textPlate";
+        this._textPlate.name = "".concat(this.name, "_textPlate");
         this._textPlate.isPickable = false;
         this._textPlate.position = Vector3.Forward(scene.useRightHandedSystem).scale(-this._frontPlateDepth / 2);
         this._backPlate.addChild(collisionMesh);
@@ -333,8 +345,10 @@ var TouchHolographicButton = /** @class */ (function (_super) {
         this._plateMaterial.diffuseColor = new Color3(0.4, 0.4, 0.4);
     };
     TouchHolographicButton.prototype._createBackMaterial = function (mesh) {
-        this._backMaterial = new StandardMaterial(this.name + "Back Material", mesh.getScene());
-        this._backMaterial.diffuseColor = new Color3(0.5, 0.5, 0.5);
+        this._backMaterial = new FluentMaterial(this.name + "backPlateMaterial", mesh.getScene());
+        this._backMaterial.albedoColor = this._backplateColor;
+        this._backMaterial.renderBorders = true;
+        this._backMaterial.renderHoverLight = false;
     };
     TouchHolographicButton.prototype._createFrontMaterial = function (mesh) {
         this._frontMaterial = new FluentButtonMaterial(this.name + "Front Material", mesh.getScene());
@@ -343,6 +357,17 @@ var TouchHolographicButton = /** @class */ (function (_super) {
         this._plateMaterial = new StandardMaterial(this.name + "Plate Material", mesh.getScene());
         this._plateMaterial.specularColor = Color3.Black();
     };
+    TouchHolographicButton.prototype._onToggle = function (newState) {
+        if (this._backMaterial) {
+            if (newState) {
+                this._backMaterial.albedoColor = this._backplateToggledColor;
+            }
+            else {
+                this._backMaterial.albedoColor = this._backplateColor;
+            }
+        }
+        _super.prototype._onToggle.call(this, newState);
+    };
     TouchHolographicButton.prototype._affectMaterial = function (mesh) {
         if (this._shareMaterials) {
             // Back