@babylonjs/gui 5.0.0-alpha.9 → 5.0.0-beta.1

package/3D/behaviors/defaultBehavior.js

@@ -0,0 +1,122 @@
+import { FollowBehavior } from "@babylonjs/core/Behaviors/Meshes/followBehavior.js";
+import { SixDofDragBehavior } from "@babylonjs/core/Behaviors/Meshes/sixDofDragBehavior.js";
+import { SurfaceMagnetismBehavior } from "@babylonjs/core/Behaviors/Meshes/surfaceMagnetismBehavior.js";
+/**
+ * Default behavior for 3D UI elements.
+ * Handles a FollowBehavior, SixDofBehavior and SurfaceMagnetismBehavior
+ * @since 5.0.0
+ */
+var DefaultBehavior = /** @class */ (function () {
+    /**
+     * Instantiates the default behavior
+     */
+    function DefaultBehavior() {
+        /**
+         * Enables the follow behavior
+         */
+        this.followBehaviorEnabled = false;
+        /**
+         * Enables the six DoF drag behavior
+         */
+        this.sixDofDragBehaviorEnabled = true;
+        /**
+         * Enables the surface magnetism behavior
+         */
+        this.surfaceMagnetismBehaviorEnabled = true;
+        this._followBehavior = new FollowBehavior();
+        this._sixDofDragBehavior = new SixDofDragBehavior();
+        this._surfaceMagnetismBehavior = new SurfaceMagnetismBehavior();
+    }
+    Object.defineProperty(DefaultBehavior.prototype, "name", {
+        /**
+         *  The name of the behavior
+         */
+        get: function () {
+            return "Default";
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(DefaultBehavior.prototype, "followBehavior", {
+        /**
+         *  The follow behavior
+         */
+        get: function () {
+            return this._followBehavior;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(DefaultBehavior.prototype, "sixDofDragBehavior", {
+        /**
+         *  The six DoF drag behavior
+         */
+        get: function () {
+            return this._sixDofDragBehavior;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(DefaultBehavior.prototype, "surfaceMagnetismBehavior", {
+        /**
+         * The surface magnetism behavior
+         */
+        get: function () {
+            return this._surfaceMagnetismBehavior;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    /**
+     *  Initializes the behavior
+     */
+    DefaultBehavior.prototype.init = function () { };
+    /**
+     * Attaches the default behavior
+     * @param ownerMesh The top level mesh
+     * @param draggablesMeshes Descendant meshes that can be used for dragging the owner mesh
+     * @param sceneUnderstandingMeshes Meshes from the scene understanding that will be used for surface magnetism
+     */
+    DefaultBehavior.prototype.attach = function (ownerMesh, draggablesMeshes, sceneUnderstandingMeshes) {
+        this._scene = ownerMesh.getScene();
+        this.attachedNode = ownerMesh;
+        this._addObservables();
+        // Since our observables are bound before the child behaviors', ours are called first
+        this._followBehavior.attach(ownerMesh);
+        this._sixDofDragBehavior.attach(ownerMesh);
+        this._sixDofDragBehavior.draggableMeshes = draggablesMeshes || null;
+        this._sixDofDragBehavior.faceCameraOnDragStart = true;
+        this._surfaceMagnetismBehavior.attach(ownerMesh, this._scene);
+        if (sceneUnderstandingMeshes) {
+            this._surfaceMagnetismBehavior.meshes = sceneUnderstandingMeshes;
+        }
+        // We disable this behavior because we will handle pose changing event manually with sixDofDragBehavior
+        this._surfaceMagnetismBehavior.enabled = false;
+    };
+    /**
+     *  Detaches the behavior from the mesh
+     */
+    DefaultBehavior.prototype.detach = function () {
+        this.attachedNode = null;
+        this._removeObservables();
+        this._followBehavior.detach();
+        this._sixDofDragBehavior.detach();
+        this._surfaceMagnetismBehavior.detach();
+    };
+    DefaultBehavior.prototype._addObservables = function () {
+        var _this = this;
+        this._onBeforeRenderObserver = this._scene.onBeforeRenderObservable.add(function () {
+            _this._followBehavior._enabled = !_this._sixDofDragBehavior.isMoving && _this.followBehaviorEnabled;
+        });
+        this._onDragObserver = this._sixDofDragBehavior.onDragObservable.add(function (event) {
+            _this._sixDofDragBehavior.disableMovement = _this._surfaceMagnetismBehavior.findAndUpdateTarget(event.pickInfo);
+        });
+    };
+    DefaultBehavior.prototype._removeObservables = function () {
+        this._scene.onBeforeRenderObservable.remove(this._onBeforeRenderObserver);
+        this._sixDofDragBehavior.onDragObservable.remove(this._onDragObserver);
+    };
+    return DefaultBehavior;
+}());
+export { DefaultBehavior };
+//# sourceMappingURL=defaultBehavior.js.map

package/3D/behaviors/defaultBehavior.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"defaultBehavior.js","sourceRoot":"","sources":["../../../../sourceES6/gui/src/3D/behaviors/defaultBehavior.ts"],"names":[],"mappings":"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","sourcesContent":["import { Behavior } from \"@babylonjs/core/Behaviors/behavior\";\r\nimport { FollowBehavior } from \"@babylonjs/core/Behaviors/Meshes/followBehavior\";\r\nimport { SixDofDragBehavior } from \"@babylonjs/core/Behaviors/Meshes/sixDofDragBehavior\";\r\nimport { Scene } from \"@babylonjs/core/scene\";\r\nimport { Mesh } from \"@babylonjs/core/Meshes/mesh\";\r\nimport { Observer } from \"@babylonjs/core/Misc/observable\";\r\nimport { Nullable } from \"@babylonjs/core/types\";\r\nimport { SurfaceMagnetismBehavior } from \"@babylonjs/core/Behaviors/Meshes/surfaceMagnetismBehavior\";\r\nimport { Vector3 } from \"@babylonjs/core/Maths/math.vector\";\r\nimport { PickingInfo } from \"@babylonjs/core/Collisions/pickingInfo\";\r\nimport { AbstractMesh } from \"@babylonjs/core/Meshes/abstractMesh\";\r\n\r\n/**\r\n * Default behavior for 3D UI elements.\r\n * Handles a FollowBehavior, SixDofBehavior and SurfaceMagnetismBehavior\r\n * @since 5.0.0\r\n */\r\nexport class DefaultBehavior implements Behavior<Mesh> {\r\n    private _scene: Scene;\r\n    private _followBehavior: FollowBehavior;\r\n    private _sixDofDragBehavior: SixDofDragBehavior;\r\n    private _surfaceMagnetismBehavior: SurfaceMagnetismBehavior;\r\n    private _onBeforeRenderObserver: Nullable<Observer<Scene>>;\r\n    private _onDragObserver: Nullable<Observer<{ delta: Vector3; position: Vector3; pickInfo: PickingInfo }>>;\r\n\r\n    /**\r\n     * Instantiates the default behavior\r\n     */\r\n    constructor() {\r\n        this._followBehavior = new FollowBehavior();\r\n        this._sixDofDragBehavior = new SixDofDragBehavior();\r\n        this._surfaceMagnetismBehavior = new SurfaceMagnetismBehavior();\r\n    }\r\n\r\n    /**\r\n     * Attached node of this behavior\r\n     */\r\n    public attachedNode: Nullable<Mesh>;\r\n\r\n    /**\r\n     *  The name of the behavior\r\n     */\r\n    public get name(): string {\r\n        return \"Default\";\r\n    }\r\n\r\n    /**\r\n     *  The follow behavior\r\n     */\r\n    public get followBehavior(): FollowBehavior {\r\n        return this._followBehavior;\r\n    }\r\n\r\n    /**\r\n     *  The six DoF drag behavior\r\n     */\r\n    public get sixDofDragBehavior(): SixDofDragBehavior {\r\n        return this._sixDofDragBehavior;\r\n    }\r\n\r\n    /**\r\n     * The surface magnetism behavior\r\n     */\r\n    public get surfaceMagnetismBehavior(): SurfaceMagnetismBehavior {\r\n        return this._surfaceMagnetismBehavior;\r\n    }\r\n\r\n    /**\r\n     * Enables the follow behavior\r\n     */\r\n    public followBehaviorEnabled: boolean = false;\r\n\r\n    /**\r\n     * Enables the six DoF drag behavior\r\n     */\r\n    public sixDofDragBehaviorEnabled: boolean = true;\r\n\r\n    /**\r\n     * Enables the surface magnetism behavior\r\n     */\r\n    public surfaceMagnetismBehaviorEnabled: boolean = true;\r\n\r\n    /**\r\n     *  Initializes the behavior\r\n     */\r\n    public init() { }\r\n\r\n    /**\r\n     * Attaches the default behavior\r\n     * @param ownerMesh The top level mesh\r\n     * @param draggablesMeshes Descendant meshes that can be used for dragging the owner mesh\r\n     * @param sceneUnderstandingMeshes Meshes from the scene understanding that will be used for surface magnetism\r\n     */\r\n    public attach(ownerMesh: Mesh, draggablesMeshes?: Mesh[], sceneUnderstandingMeshes?: AbstractMesh[]): void {\r\n        this._scene = ownerMesh.getScene();\r\n        this.attachedNode = ownerMesh;\r\n\r\n        this._addObservables();\r\n        // Since our observables are bound before the child behaviors', ours are called first\r\n        this._followBehavior.attach(ownerMesh);\r\n        this._sixDofDragBehavior.attach(ownerMesh);\r\n        this._sixDofDragBehavior.draggableMeshes = draggablesMeshes || null;\r\n        this._sixDofDragBehavior.faceCameraOnDragStart = true;\r\n        this._surfaceMagnetismBehavior.attach(ownerMesh, this._scene);\r\n        if (sceneUnderstandingMeshes) {\r\n            this._surfaceMagnetismBehavior.meshes = sceneUnderstandingMeshes;\r\n        }\r\n\r\n        // We disable this behavior because we will handle pose changing event manually with sixDofDragBehavior\r\n        this._surfaceMagnetismBehavior.enabled = false;\r\n    }\r\n\r\n    /**\r\n     *  Detaches the behavior from the mesh\r\n     */\r\n    public detach(): void {\r\n        this.attachedNode = null;\r\n        this._removeObservables();\r\n        this._followBehavior.detach();\r\n        this._sixDofDragBehavior.detach();\r\n        this._surfaceMagnetismBehavior.detach();\r\n    }\r\n\r\n    private _addObservables() {\r\n        this._onBeforeRenderObserver = this._scene.onBeforeRenderObservable.add(() => {\r\n            this._followBehavior._enabled = !this._sixDofDragBehavior.isMoving && this.followBehaviorEnabled;\r\n        });\r\n        this._onDragObserver = this._sixDofDragBehavior.onDragObservable.add((event: { pickInfo: PickingInfo }) => {\r\n            this._sixDofDragBehavior.disableMovement = this._surfaceMagnetismBehavior.findAndUpdateTarget(event.pickInfo);\r\n        });\r\n    }\r\n\r\n    private _removeObservables() {\r\n        this._scene.onBeforeRenderObservable.remove(this._onBeforeRenderObserver);\r\n        this._sixDofDragBehavior.onDragObservable.remove(this._onDragObserver);\r\n    }\r\n}\r\n"]}

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

@@ -1,10 +1,10 @@
 import { TransformNode } from "@babylonjs/core/Meshes/transformNode";
 import { Scene } from "@babylonjs/core/scene";
-import { Control3D } from "./control3D";
+import { ContentDisplay3D } from "./contentDisplay3D";
 /**
  * Class used as a root to all buttons
  */
-export declare class AbstractButton3D extends Control3D {
+export declare class AbstractButton3D extends ContentDisplay3D {
     /**
      * Creates a new button
      * @param name defines the control name

package/3D/controls/abstractButton3D.js

@@ -1,6 +1,6 @@
 import { __extends } from "tslib";
-import { TransformNode } from "@babylonjs/core/Meshes/transformNode";
-import { Control3D } from "./control3D";
+import { TransformNode } from "@babylonjs/core/Meshes/transformNode.js";
+import { ContentDisplay3D } from "./contentDisplay3D.js";
 /**
  * Class used as a root to all buttons
  */
@@ -21,6 +21,6 @@ var AbstractButton3D = /** @class */ (function (_super) {
         return new TransformNode("button" + this.name);
     };
     return AbstractButton3D;
-}(Control3D));
+}(ContentDisplay3D));
 export { AbstractButton3D };
 //# sourceMappingURL=abstractButton3D.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"abstractButton3D.js","sourceRoot":"","sources":["../../../../sourceES6/gui/src/3D/controls/abstractButton3D.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,sCAAsC,CAAC;AAGrE,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAExC;;GAEG;AACH;IAAsC,oCAAS;IAC3C;;;OAGG;IACH,0BAAY,IAAa;eACrB,kBAAM,IAAI,CAAC;IACf,CAAC;IAES,uCAAY,GAAtB;QACI,OAAO,kBAAkB,CAAC;IAC9B,CAAC;IAED,mBAAmB;IACT,sCAAW,GAArB,UAAsB,KAAY;QAC9B,OAAO,IAAI,aAAa,CAAC,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC;IACnD,CAAC;IACL,uBAAC;AAAD,CAAC,AAjBD,CAAsC,SAAS,GAiB9C","sourcesContent":["import { TransformNode } from \"@babylonjs/core/Meshes/transformNode\";\r\nimport { Scene } from \"@babylonjs/core/scene\";\r\n\r\nimport { Control3D } from \"./control3D\";\r\n\r\n/**\r\n * Class used as a root to all buttons\r\n */\r\nexport class AbstractButton3D extends Control3D {\r\n    /**\r\n     * Creates a new button\r\n     * @param name defines the control name\r\n     */\r\n    constructor(name?: string) {\r\n        super(name);\r\n    }\r\n\r\n    protected _getTypeName(): string {\r\n        return \"AbstractButton3D\";\r\n    }\r\n\r\n    // Mesh association\r\n    protected _createNode(scene: Scene): TransformNode {\r\n        return new TransformNode(\"button\" + this.name);\r\n    }\r\n}"]}
+{"version":3,"file":"abstractButton3D.js","sourceRoot":"","sources":["../../../../sourceES6/gui/src/3D/controls/abstractButton3D.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,sCAAsC,CAAC;AAErE,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAEtD;;GAEG;AACH;IAAsC,oCAAgB;IAClD;;;OAGG;IACH,0BAAY,IAAa;eACrB,kBAAM,IAAI,CAAC;IACf,CAAC;IAES,uCAAY,GAAtB;QACI,OAAO,kBAAkB,CAAC;IAC9B,CAAC;IAED,mBAAmB;IACT,sCAAW,GAArB,UAAsB,KAAY;QAC9B,OAAO,IAAI,aAAa,CAAC,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC;IACnD,CAAC;IACL,uBAAC;AAAD,CAAC,AAjBD,CAAsC,gBAAgB,GAiBrD","sourcesContent":["import { TransformNode } from \"@babylonjs/core/Meshes/transformNode\";\r\nimport { Scene } from \"@babylonjs/core/scene\";\r\nimport { ContentDisplay3D } from \"./contentDisplay3D\";\r\n\r\n/**\r\n * Class used as a root to all buttons\r\n */\r\nexport class AbstractButton3D extends ContentDisplay3D {\r\n    /**\r\n     * Creates a new button\r\n     * @param name defines the control name\r\n     */\r\n    constructor(name?: string) {\r\n        super(name);\r\n    }\r\n\r\n    protected _getTypeName(): string {\r\n        return \"AbstractButton3D\";\r\n    }\r\n\r\n    // Mesh association\r\n    protected _createNode(scene: Scene): TransformNode {\r\n        return new TransformNode(\"button\" + this.name);\r\n    }\r\n}\r\n"]}

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

@@ -1,46 +1,22 @@
-import { int } from "@babylonjs/core/types";
 import { TransformNode } from "@babylonjs/core/Meshes/transformNode";
 import { AbstractMesh } from "@babylonjs/core/Meshes/abstractMesh";
 import { Material } from "@babylonjs/core/Materials/material";
 import { Scene } from "@babylonjs/core/scene";
 import { AbstractButton3D } from "./abstractButton3D";
 import { AdvancedDynamicTexture } from "../../2D/advancedDynamicTexture";
-import { Control } from "../../2D/controls/control";
 /**
  * Class used to create a button in 3D
  */
 export declare class Button3D extends AbstractButton3D {
     /** @hidden */
     protected _currentMaterial: Material;
-    private _facadeTexture;
-    private _content;
-    private _contentResolution;
-    private _contentScaleRatio;
-    /**
-     * Gets or sets the texture resolution used to render content (512 by default)
-     */
-    get contentResolution(): int;
-    set contentResolution(value: int);
-    /**
-     * Gets or sets the texture scale ratio used to render content (2 by default)
-     */
-    get contentScaleRatio(): number;
-    set contentScaleRatio(value: number);
-    protected _disposeFacadeTexture(): void;
-    protected _resetContent(): void;
     /**
      * Creates a new button
      * @param name defines the control name
      */
     constructor(name?: string);
-    /**
-     * Gets or sets the GUI 2D content used to display the button's facade
-     */
-    get content(): Control;
-    set content(value: Control);
     /**
      * Apply the facade texture (created from the content property).
-     * This function can be overloaded by child classes
      * @param facadeTexture defines the AdvancedDynamicTexture to use
      */
     protected _applyFacade(facadeTexture: AdvancedDynamicTexture): void;

package/3D/controls/button3D.js

@@ -1,11 +1,9 @@
 import { __extends } from "tslib";
-import { Vector4 } from "@babylonjs/core/Maths/math.vector";
-import { BoxBuilder } from "@babylonjs/core/Meshes/Builders/boxBuilder";
-import { StandardMaterial } from "@babylonjs/core/Materials/standardMaterial";
-import { Texture } from "@babylonjs/core/Materials/Textures/texture";
-import { AbstractButton3D } from "./abstractButton3D";
-import { AdvancedDynamicTexture } from "../../2D/advancedDynamicTexture";
-import { Color3 } from '@babylonjs/core/Maths/math.color';
+import { Vector4 } from "@babylonjs/core/Maths/math.vector.js";
+import { CreateBox } from "@babylonjs/core/Meshes/Builders/boxBuilder.js";
+import { StandardMaterial } from "@babylonjs/core/Materials/standardMaterial.js";
+import { AbstractButton3D } from "./abstractButton3D.js";
+import { Color3 } from "@babylonjs/core/Maths/math.color.js";
 /**
  * Class used to create a button in 3D
  */
@@ -17,8 +15,6 @@ var Button3D = /** @class */ (function (_super) {
      */
     function Button3D(name) {
         var _this = _super.call(this, name) || this;
-        _this._contentResolution = 512;
-        _this._contentScaleRatio = 2;
         // Default animations
         _this.pointerEnterAnimation = function () {
             if (!_this.mesh) {
@@ -43,80 +39,8 @@ var Button3D = /** @class */ (function (_super) {
         };
         return _this;
     }
-    Object.defineProperty(Button3D.prototype, "contentResolution", {
-        /**
-         * Gets or sets the texture resolution used to render content (512 by default)
-         */
-        get: function () {
-            return this._contentResolution;
-        },
-        set: function (value) {
-            if (this._contentResolution === value) {
-                return;
-            }
-            this._contentResolution = value;
-            this._resetContent();
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(Button3D.prototype, "contentScaleRatio", {
-        /**
-         * Gets or sets the texture scale ratio used to render content (2 by default)
-         */
-        get: function () {
-            return this._contentScaleRatio;
-        },
-        set: function (value) {
-            if (this._contentScaleRatio === value) {
-                return;
-            }
-            this._contentScaleRatio = value;
-            this._resetContent();
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Button3D.prototype._disposeFacadeTexture = function () {
-        if (this._facadeTexture) {
-            this._facadeTexture.dispose();
-            this._facadeTexture = null;
-        }
-    };
-    Button3D.prototype._resetContent = function () {
-        this._disposeFacadeTexture();
-        this.content = this._content;
-    };
-    Object.defineProperty(Button3D.prototype, "content", {
-        /**
-         * Gets or sets the GUI 2D content used to display the button's facade
-         */
-        get: function () {
-            return this._content;
-        },
-        set: function (value) {
-            this._content = value;
-            if (!this._host || !this._host.utilityLayer) {
-                return;
-            }
-            if (!this._facadeTexture) {
-                this._facadeTexture = new AdvancedDynamicTexture("Facade", this._contentResolution, this._contentResolution, this._host.utilityLayer.utilityLayerScene, true, Texture.TRILINEAR_SAMPLINGMODE);
-                this._facadeTexture.rootContainer.scaleX = this._contentScaleRatio;
-                this._facadeTexture.rootContainer.scaleY = this._contentScaleRatio;
-                this._facadeTexture.premulAlpha = true;
-            }
-            else {
-                this._facadeTexture.rootContainer.clearControls();
-            }
-            this._facadeTexture.addControl(value);
-            this._applyFacade(this._facadeTexture);
-        },
-        enumerable: false,
-        configurable: true
-    });
     /**
      * Apply the facade texture (created from the content property).
-     * This function can be overloaded by child classes
      * @param facadeTexture defines the AdvancedDynamicTexture to use
      */
     Button3D.prototype._applyFacade = function (facadeTexture) {
@@ -131,12 +55,19 @@ var Button3D = /** @class */ (function (_super) {
         for (var i = 0; i < 6; i++) {
             faceUV[i] = new Vector4(0, 0, 0, 0);
         }
-        faceUV[1] = new Vector4(0, 0, 1, 1);
-        var mesh = BoxBuilder.CreateBox(this.name + "_rootMesh", {
+        if (scene.useRightHandedSystem) {
+            // Flip the u on the texture
+            faceUV[0].copyFromFloats(1, 0, 0, 1);
+        }
+        else {
+            faceUV[1].copyFromFloats(0, 0, 1, 1);
+        }
+        var mesh = CreateBox(this.name + "_rootMesh", {
             width: 1.0,
             height: 1.0,
             depth: 0.08,
-            faceUV: faceUV
+            faceUV: faceUV,
+            wrap: true,
         }, scene);
         return mesh;
     };

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

@@ -1 +1 @@
-{"version":3,"file":"button3D.js","sourceRoot":"","sources":["../../../../sourceES6/gui/src/3D/controls/button3D.ts"],"names":[],"mappings":"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","sourcesContent":["import { int, Nullable } from \"@babylonjs/core/types\";\r\nimport { Vector4 } from \"@babylonjs/core/Maths/math.vector\";\r\nimport { TransformNode } from \"@babylonjs/core/Meshes/transformNode\";\r\nimport { AbstractMesh } from \"@babylonjs/core/Meshes/abstractMesh\";\r\nimport { BoxBuilder } from \"@babylonjs/core/Meshes/Builders/boxBuilder\";\r\nimport { Material } from \"@babylonjs/core/Materials/material\";\r\nimport { StandardMaterial } from \"@babylonjs/core/Materials/standardMaterial\";\r\nimport { Texture } from \"@babylonjs/core/Materials/Textures/texture\";\r\nimport { Scene } from \"@babylonjs/core/scene\";\r\n\r\nimport { AbstractButton3D } from \"./abstractButton3D\";\r\nimport { AdvancedDynamicTexture } from \"../../2D/advancedDynamicTexture\";\r\nimport { Control } from \"../../2D/controls/control\";\r\nimport { Color3 } from '@babylonjs/core/Maths/math.color';\r\n\r\n/**\r\n * Class used to create a button in 3D\r\n */\r\nexport class Button3D extends AbstractButton3D {\r\n    /** @hidden */\r\n    protected _currentMaterial: Material;\r\n    private _facadeTexture: Nullable<AdvancedDynamicTexture>;\r\n    private _content: Control;\r\n    private _contentResolution = 512;\r\n    private _contentScaleRatio = 2;\r\n\r\n    /**\r\n     * Gets or sets the texture resolution used to render content (512 by default)\r\n     */\r\n    public get contentResolution(): int {\r\n        return this._contentResolution;\r\n    }\r\n\r\n    public set contentResolution(value: int) {\r\n        if (this._contentResolution === value) {\r\n            return;\r\n        }\r\n\r\n        this._contentResolution = value;\r\n        this._resetContent();\r\n    }\r\n\r\n    /**\r\n     * Gets or sets the texture scale ratio used to render content (2 by default)\r\n     */\r\n    public get contentScaleRatio(): number {\r\n        return this._contentScaleRatio;\r\n    }\r\n\r\n    public set contentScaleRatio(value: number) {\r\n        if (this._contentScaleRatio === value) {\r\n            return;\r\n        }\r\n\r\n        this._contentScaleRatio = value;\r\n        this._resetContent();\r\n    }\r\n\r\n    protected _disposeFacadeTexture() {\r\n        if (this._facadeTexture) {\r\n            this._facadeTexture.dispose();\r\n            this._facadeTexture = null;\r\n        }\r\n    }\r\n\r\n    protected _resetContent() {\r\n        this._disposeFacadeTexture();\r\n        this.content = this._content;\r\n    }\r\n\r\n    /**\r\n     * Creates a new button\r\n     * @param name defines the control name\r\n     */\r\n    constructor(name?: string) {\r\n        super(name);\r\n\r\n        // Default animations\r\n\r\n        this.pointerEnterAnimation = () => {\r\n            if (!this.mesh) {\r\n                return;\r\n            }\r\n            (<StandardMaterial>this._currentMaterial).emissiveColor = Color3.Red();\r\n        };\r\n\r\n        this.pointerOutAnimation = () => {\r\n            (<StandardMaterial>this._currentMaterial).emissiveColor = Color3.Black();\r\n        };\r\n\r\n        this.pointerDownAnimation = () => {\r\n            if (!this.mesh) {\r\n                return;\r\n            }\r\n\r\n            this.mesh.scaling.scaleInPlace(0.95);\r\n        };\r\n\r\n        this.pointerUpAnimation = () => {\r\n            if (!this.mesh) {\r\n                return;\r\n            }\r\n\r\n            this.mesh.scaling.scaleInPlace(1.0 / 0.95);\r\n        };\r\n    }\r\n\r\n    /**\r\n     * Gets or sets the GUI 2D content used to display the button's facade\r\n     */\r\n    public get content(): Control {\r\n        return this._content;\r\n    }\r\n\r\n    public set content(value: Control) {\r\n        this._content = value;\r\n\r\n        if (!this._host || !this._host.utilityLayer) {\r\n            return;\r\n        }\r\n\r\n        if (!this._facadeTexture) {\r\n            this._facadeTexture = new AdvancedDynamicTexture(\"Facade\", this._contentResolution, this._contentResolution, this._host.utilityLayer.utilityLayerScene, true, Texture.TRILINEAR_SAMPLINGMODE);\r\n            this._facadeTexture.rootContainer.scaleX = this._contentScaleRatio;\r\n            this._facadeTexture.rootContainer.scaleY = this._contentScaleRatio;\r\n            this._facadeTexture.premulAlpha = true;\r\n        }\r\n        else {\r\n            this._facadeTexture.rootContainer.clearControls();\r\n        }\r\n\r\n        this._facadeTexture.addControl(value);\r\n\r\n        this._applyFacade(this._facadeTexture);\r\n    }\r\n\r\n    /**\r\n     * Apply the facade texture (created from the content property).\r\n     * This function can be overloaded by child classes\r\n     * @param facadeTexture defines the AdvancedDynamicTexture to use\r\n     */\r\n    protected _applyFacade(facadeTexture: AdvancedDynamicTexture) {\r\n        (<any>this._currentMaterial).emissiveTexture = facadeTexture;\r\n    }\r\n\r\n    protected _getTypeName(): string {\r\n        return \"Button3D\";\r\n    }\r\n\r\n    // Mesh association\r\n    protected _createNode(scene: Scene): TransformNode {\r\n        var faceUV = new Array(6);\r\n\r\n        for (var i = 0; i < 6; i++) {\r\n            faceUV[i] = new Vector4(0, 0, 0, 0);\r\n        }\r\n        faceUV[1] = new Vector4(0, 0, 1, 1);\r\n\r\n        let mesh = BoxBuilder.CreateBox(this.name + \"_rootMesh\", {\r\n            width: 1.0,\r\n            height: 1.0,\r\n            depth: 0.08,\r\n            faceUV: faceUV\r\n        }, scene);\r\n\r\n        return mesh;\r\n    }\r\n\r\n    protected _affectMaterial(mesh: AbstractMesh) {\r\n        let material = new StandardMaterial(this.name + \"Material\", mesh.getScene());\r\n        material.specularColor = Color3.Black();\r\n\r\n        mesh.material = material;\r\n        this._currentMaterial = material;\r\n\r\n        this._resetContent();\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        this._disposeFacadeTexture();\r\n\r\n        if (this._currentMaterial) {\r\n            this._currentMaterial.dispose();\r\n        }\r\n    }\r\n}"]}
+{"version":3,"file":"button3D.js","sourceRoot":"","sources":["../../../../sourceES6/gui/src/3D/controls/button3D.ts"],"names":[],"mappings":"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","sourcesContent":["import { Vector4 } from \"@babylonjs/core/Maths/math.vector\";\r\nimport { TransformNode } from \"@babylonjs/core/Meshes/transformNode\";\r\nimport { AbstractMesh } from \"@babylonjs/core/Meshes/abstractMesh\";\r\nimport { CreateBox } from \"@babylonjs/core/Meshes/Builders/boxBuilder\";\r\nimport { Material } from \"@babylonjs/core/Materials/material\";\r\nimport { StandardMaterial } from \"@babylonjs/core/Materials/standardMaterial\";\r\nimport { Scene } from \"@babylonjs/core/scene\";\r\n\r\nimport { AbstractButton3D } from \"./abstractButton3D\";\r\nimport { AdvancedDynamicTexture } from \"../../2D/advancedDynamicTexture\";\r\nimport { Color3 } from \"@babylonjs/core/Maths/math.color\";\r\n\r\n/**\r\n * Class used to create a button in 3D\r\n */\r\nexport class Button3D extends AbstractButton3D {\r\n    /** @hidden */\r\n    protected _currentMaterial: Material;\r\n\r\n    /**\r\n     * Creates a new button\r\n     * @param name defines the control name\r\n     */\r\n    constructor(name?: string) {\r\n        super(name);\r\n\r\n        // Default animations\r\n\r\n        this.pointerEnterAnimation = () => {\r\n            if (!this.mesh) {\r\n                return;\r\n            }\r\n            (<StandardMaterial>this._currentMaterial).emissiveColor = Color3.Red();\r\n        };\r\n\r\n        this.pointerOutAnimation = () => {\r\n            (<StandardMaterial>this._currentMaterial).emissiveColor = Color3.Black();\r\n        };\r\n\r\n        this.pointerDownAnimation = () => {\r\n            if (!this.mesh) {\r\n                return;\r\n            }\r\n\r\n            this.mesh.scaling.scaleInPlace(0.95);\r\n        };\r\n\r\n        this.pointerUpAnimation = () => {\r\n            if (!this.mesh) {\r\n                return;\r\n            }\r\n\r\n            this.mesh.scaling.scaleInPlace(1.0 / 0.95);\r\n        };\r\n    }\r\n\r\n    /**\r\n     * Apply the facade texture (created from the content property).\r\n     * @param facadeTexture defines the AdvancedDynamicTexture to use\r\n     */\r\n    protected _applyFacade(facadeTexture: AdvancedDynamicTexture) {\r\n        (<any>this._currentMaterial).emissiveTexture = facadeTexture;\r\n    }\r\n\r\n    protected _getTypeName(): string {\r\n        return \"Button3D\";\r\n    }\r\n\r\n    // Mesh association\r\n    protected _createNode(scene: Scene): TransformNode {\r\n        var faceUV = new Array(6);\r\n\r\n        for (var i = 0; i < 6; i++) {\r\n            faceUV[i] = new Vector4(0, 0, 0, 0);\r\n        }\r\n        if (scene.useRightHandedSystem) {\r\n            // Flip the u on the texture\r\n            faceUV[0].copyFromFloats(1, 0, 0, 1);\r\n        } else {\r\n            faceUV[1].copyFromFloats(0, 0, 1, 1);\r\n        }\r\n\r\n        let mesh = CreateBox(\r\n            this.name + \"_rootMesh\",\r\n            {\r\n                width: 1.0,\r\n                height: 1.0,\r\n                depth: 0.08,\r\n                faceUV: faceUV,\r\n                wrap: true,\r\n            },\r\n            scene\r\n        );\r\n\r\n        return mesh;\r\n    }\r\n\r\n    protected _affectMaterial(mesh: AbstractMesh) {\r\n        let material = new StandardMaterial(this.name + \"Material\", mesh.getScene());\r\n        material.specularColor = Color3.Black();\r\n\r\n        mesh.material = material;\r\n        this._currentMaterial = material;\r\n\r\n        this._resetContent();\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        this._disposeFacadeTexture();\r\n\r\n        if (this._currentMaterial) {\r\n            this._currentMaterial.dispose();\r\n        }\r\n    }\r\n}\r\n"]}

package/3D/controls/container3D.js

@@ -1,6 +1,6 @@
 import { __extends } from "tslib";
-import { TransformNode } from "@babylonjs/core/Meshes/transformNode";
-import { Control3D } from "./control3D";
+import { TransformNode } from "@babylonjs/core/Meshes/transformNode.js";
+import { Control3D } from "./control3D.js";
 /**
  * Class used to create containers for controls
  */

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

@@ -0,0 +1,30 @@
+import { Control } from "../../2D/controls/control";
+import { AdvancedDynamicTexture } from "../../2D/advancedDynamicTexture";
+import { Control3D } from "./control3D";
+/**
+ * The base class for controls that display content
+ */
+export declare class ContentDisplay3D extends Control3D {
+    private _content;
+    private _facadeTexture;
+    protected _contentResolution: number;
+    protected _contentScaleRatio: number;
+    /**
+     * Gets or sets the GUI 2D content used to display the button's facade
+     */
+    get content(): Control;
+    set content(value: Control);
+    /**
+     * Gets or sets the texture resolution used to render content (512 by default)
+     */
+    get contentResolution(): number;
+    set contentResolution(value: number);
+    protected _disposeFacadeTexture(): void;
+    protected _resetContent(): void;
+    /**
+     * Apply the facade texture (created from the content property).
+     * This function can be overloaded by child classes
+     * @param facadeTexture defines the AdvancedDynamicTexture to use
+     */
+    protected _applyFacade(facadeTexture: AdvancedDynamicTexture): void;
+}

package/3D/controls/contentDisplay3D.js

@@ -0,0 +1,79 @@
+import { __extends } from "tslib";
+import { AdvancedDynamicTexture } from "../../2D/advancedDynamicTexture.js";
+import { Control3D } from "./control3D.js";
+import { Texture } from "@babylonjs/core/Materials/Textures/texture.js";
+/**
+ * The base class for controls that display content
+ */
+var ContentDisplay3D = /** @class */ (function (_super) {
+    __extends(ContentDisplay3D, _super);
+    function ContentDisplay3D() {
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this._contentResolution = 512;
+        _this._contentScaleRatio = 2;
+        return _this;
+    }
+    Object.defineProperty(ContentDisplay3D.prototype, "content", {
+        /**
+         * Gets or sets the GUI 2D content used to display the button's facade
+         */
+        get: function () {
+            return this._content;
+        },
+        set: function (value) {
+            this._content = value;
+            if (!this._host || !this._host.utilityLayer) {
+                return;
+            }
+            if (!this._facadeTexture) {
+                this._facadeTexture = new AdvancedDynamicTexture("Facade", this._contentResolution, this._contentResolution, this._host.utilityLayer.utilityLayerScene, true, Texture.TRILINEAR_SAMPLINGMODE);
+                this._facadeTexture.rootContainer.scaleX = this._contentScaleRatio;
+                this._facadeTexture.rootContainer.scaleY = this._contentScaleRatio;
+                this._facadeTexture.premulAlpha = true;
+            }
+            else {
+                this._facadeTexture.rootContainer.clearControls();
+            }
+            this._facadeTexture.addControl(value);
+            this._applyFacade(this._facadeTexture);
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(ContentDisplay3D.prototype, "contentResolution", {
+        /**
+         * Gets or sets the texture resolution used to render content (512 by default)
+         */
+        get: function () {
+            return this._contentResolution;
+        },
+        set: function (value) {
+            if (this._contentResolution === value) {
+                return;
+            }
+            this._contentResolution = value;
+            this._resetContent();
+        },
+        enumerable: false,
+        configurable: true
+    });
+    ContentDisplay3D.prototype._disposeFacadeTexture = function () {
+        if (this._facadeTexture) {
+            this._facadeTexture.dispose();
+            this._facadeTexture = null;
+        }
+    };
+    ContentDisplay3D.prototype._resetContent = function () {
+        this._disposeFacadeTexture();
+        this.content = this._content;
+    };
+    /**
+     * Apply the facade texture (created from the content property).
+     * This function can be overloaded by child classes
+     * @param facadeTexture defines the AdvancedDynamicTexture to use
+     */
+    ContentDisplay3D.prototype._applyFacade = function (facadeTexture) { };
+    return ContentDisplay3D;
+}(Control3D));
+export { ContentDisplay3D };
+//# sourceMappingURL=contentDisplay3D.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"contentDisplay3D.js","sourceRoot":"","sources":["../../../../sourceES6/gui/src/3D/controls/contentDisplay3D.ts"],"names":[],"mappings":";AACA,OAAO,EAAE,sBAAsB,EAAE,MAAM,iCAAiC,CAAC;AAEzE,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,OAAO,EAAE,MAAM,4CAA4C,CAAC;AAErE;;GAEG;AACH;IAAsC,oCAAS;IAA/C;QAAA,qEA2EC;QAxEa,wBAAkB,GAAG,GAAG,CAAC;QACzB,wBAAkB,GAAG,CAAC,CAAC;;IAuErC,CAAC;IAlEG,sBAAW,qCAAO;QAHlB;;WAEG;aACH;YACI,OAAO,IAAI,CAAC,QAAQ,CAAC;QACzB,CAAC;aAED,UAAmB,KAAc;YAC7B,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;YAEtB,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,YAAY,EAAE;gBACzC,OAAO;aACV;YAED,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE;gBACtB,IAAI,CAAC,cAAc,GAAG,IAAI,sBAAsB,CAC5C,QAAQ,EACR,IAAI,CAAC,kBAAkB,EACvB,IAAI,CAAC,kBAAkB,EACvB,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,iBAAiB,EACzC,IAAI,EACJ,OAAO,CAAC,sBAAsB,CACjC,CAAC;gBACF,IAAI,CAAC,cAAc,CAAC,aAAa,CAAC,MAAM,GAAG,IAAI,CAAC,kBAAkB,CAAC;gBACnE,IAAI,CAAC,cAAc,CAAC,aAAa,CAAC,MAAM,GAAG,IAAI,CAAC,kBAAkB,CAAC;gBACnE,IAAI,CAAC,cAAc,CAAC,WAAW,GAAG,IAAI,CAAC;aAC1C;iBAAM;gBACH,IAAI,CAAC,cAAc,CAAC,aAAa,CAAC,aAAa,EAAE,CAAC;aACrD;YAED,IAAI,CAAC,cAAc,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC;YAEtC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;QAC3C,CAAC;;;OA5BA;IAiCD,sBAAW,+CAAiB;QAH5B;;WAEG;aACH;YACI,OAAO,IAAI,CAAC,kBAAkB,CAAC;QACnC,CAAC;aAED,UAA6B,KAAa;YACtC,IAAI,IAAI,CAAC,kBAAkB,KAAK,KAAK,EAAE;gBACnC,OAAO;aACV;YAED,IAAI,CAAC,kBAAkB,GAAG,KAAK,CAAC;YAChC,IAAI,CAAC,aAAa,EAAE,CAAC;QACzB,CAAC;;;OATA;IAWS,gDAAqB,GAA/B;QACI,IAAI,IAAI,CAAC,cAAc,EAAE;YACrB,IAAI,CAAC,cAAc,CAAC,OAAO,EAAE,CAAC;YAC9B,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;SAC9B;IACL,CAAC;IAES,wCAAa,GAAvB;QACI,IAAI,CAAC,qBAAqB,EAAE,CAAC;QAC7B,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,QAAQ,CAAC;IACjC,CAAC;IAED;;;;OAIG;IACO,uCAAY,GAAtB,UAAuB,aAAqC,IAAI,CAAC;IACrE,uBAAC;AAAD,CAAC,AA3ED,CAAsC,SAAS,GA2E9C","sourcesContent":["import { Control } from \"../../2D/controls/control\";\r\nimport { AdvancedDynamicTexture } from \"../../2D/advancedDynamicTexture\";\r\nimport { Nullable } from \"@babylonjs/core/types\";\r\nimport { Control3D } from \"./control3D\";\r\nimport { Texture } from \"@babylonjs/core/Materials/Textures/texture\";\r\n\r\n/**\r\n * The base class for controls that display content\r\n */\r\nexport class ContentDisplay3D extends Control3D {\r\n    private _content: Control;\r\n    private _facadeTexture: Nullable<AdvancedDynamicTexture>;\r\n    protected _contentResolution = 512;\r\n    protected _contentScaleRatio = 2;\r\n\r\n    /**\r\n     * Gets or sets the GUI 2D content used to display the button's facade\r\n     */\r\n    public get content(): Control {\r\n        return this._content;\r\n    }\r\n\r\n    public set content(value: Control) {\r\n        this._content = value;\r\n\r\n        if (!this._host || !this._host.utilityLayer) {\r\n            return;\r\n        }\r\n\r\n        if (!this._facadeTexture) {\r\n            this._facadeTexture = new AdvancedDynamicTexture(\r\n                \"Facade\",\r\n                this._contentResolution,\r\n                this._contentResolution,\r\n                this._host.utilityLayer.utilityLayerScene,\r\n                true,\r\n                Texture.TRILINEAR_SAMPLINGMODE\r\n            );\r\n            this._facadeTexture.rootContainer.scaleX = this._contentScaleRatio;\r\n            this._facadeTexture.rootContainer.scaleY = this._contentScaleRatio;\r\n            this._facadeTexture.premulAlpha = true;\r\n        } else {\r\n            this._facadeTexture.rootContainer.clearControls();\r\n        }\r\n\r\n        this._facadeTexture.addControl(value);\r\n\r\n        this._applyFacade(this._facadeTexture);\r\n    }\r\n\r\n    /**\r\n     * Gets or sets the texture resolution used to render content (512 by default)\r\n     */\r\n    public get contentResolution(): number {\r\n        return this._contentResolution;\r\n    }\r\n\r\n    public set contentResolution(value: number) {\r\n        if (this._contentResolution === value) {\r\n            return;\r\n        }\r\n\r\n        this._contentResolution = value;\r\n        this._resetContent();\r\n    }\r\n\r\n    protected _disposeFacadeTexture() {\r\n        if (this._facadeTexture) {\r\n            this._facadeTexture.dispose();\r\n            this._facadeTexture = null;\r\n        }\r\n    }\r\n\r\n    protected _resetContent() {\r\n        this._disposeFacadeTexture();\r\n        this.content = this._content;\r\n    }\r\n\r\n    /**\r\n     * Apply the facade texture (created from the content property).\r\n     * This function can be overloaded by child classes\r\n     * @param facadeTexture defines the AdvancedDynamicTexture to use\r\n     */\r\n    protected _applyFacade(facadeTexture: AdvancedDynamicTexture) { }\r\n}\r\n"]}

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

@@ -21,10 +21,12 @@ export declare class Control3D implements IDisposable, IBehaviorAware<Control3D>
     private _enterCount;
     private _downPointerIds;
     private _isVisible;
-    /** Gets or sets the control position  in world space */
+    /** @hidden */
+    _isScaledByManager: boolean;
+    /** Gets or sets the control position in world space */
     get position(): Vector3;
     set position(value: Vector3);
-    /** Gets or sets the control scaling  in world space */
+    /** Gets or sets the control scaling in world space */
     get scaling(): Vector3;
     set scaling(value: Vector3);
     /** Callback used to start pointer enter animation */
@@ -36,11 +38,11 @@ export declare class Control3D implements IDisposable, IBehaviorAware<Control3D>
     /** Callback used to start pointer up animation */
     pointerUpAnimation: () => void;
     /**
-    * An event triggered when the pointer move over the control
-    */
+     * An event triggered when the pointer moves over the control
+     */
     onPointerMoveObservable: Observable<Vector3>;
     /**
-     * An event triggered when the pointer move out of the control
+     * An event triggered when the pointer moves out of the control
      */
     onPointerOutObservable: Observable<Control3D>;
     /**
@@ -126,7 +128,7 @@ export declare class Control3D implements IDisposable, IBehaviorAware<Control3D>
     linkToTransformNode(node: Nullable<TransformNode>): Control3D;
     /** @hidden **/
     _prepareNode(scene: Scene): void;
-    protected _injectGUI3DMetadata(node: TransformNode): any;
+    protected _injectGUI3DReservedDataStore(node: TransformNode): any;
     /**
      * Node creation.
      * Can be overriden by children
@@ -139,6 +141,7 @@ export declare class Control3D implements IDisposable, IBehaviorAware<Control3D>
      * @param mesh defines the mesh which will represent the control
      */
     protected _affectMaterial(mesh: AbstractMesh): void;
+    private _IsTouchButton3D;
     /** @hidden */
     _onPointerMove(target: Control3D, coordinates: Vector3): void;
     /** @hidden */
@@ -152,7 +155,7 @@ export declare class Control3D implements IDisposable, IBehaviorAware<Control3D>
     /** @hidden */
     forcePointerUp(pointerId?: Nullable<number>): void;
     /** @hidden */
-    _processObservables(type: number, pickedPoint: Vector3, pointerId: number, buttonIndex: number): boolean;
+    _processObservables(type: number, pickedPoint: Vector3, originMeshPosition: Nullable<Vector3>, pointerId: number, buttonIndex: number): boolean;
     /** @hidden */
     _disposeNode(): void;
     /**