@babylonjs/gui 5.21.0 → 5.22.0

package/3D/materials/fluentButton/fluentButtonMaterial.js

@@ -1,4 +1,4 @@
-import { __decorate, __extends } from "tslib";
+import { __decorate } from "@babylonjs/core/tslib.es6.js";
 import { serializeAsColor4, serializeAsVector3, serialize, SerializationHelper } from "@babylonjs/core/Misc/decorators.js";
 import { Vector3, Vector4 } from "@babylonjs/core/Maths/math.vector.js";
 import { Texture } from "@babylonjs/core/Materials/Textures/texture.js";
@@ -13,194 +13,189 @@ import { Constants } from "@babylonjs/core/Engines/constants.js";
 import "./shaders/fluentButton.fragment.js";
 import "./shaders/fluentButton.vertex.js";
 /** @hidden */
-var FluentButtonMaterialDefines = /** @class */ (function (_super) {
-    __extends(FluentButtonMaterialDefines, _super);
-    function FluentButtonMaterialDefines() {
-        var _this = _super.call(this) || this;
-        _this.RELATIVE_WIDTH = true;
-        _this.ENABLE_FADE = true;
-        _this._needNormals = true;
-        _this._needUVs = true;
-        _this.rebuild();
-        return _this;
+class FluentButtonMaterialDefines extends MaterialDefines {
+    constructor() {
+        super();
+        this.RELATIVE_WIDTH = true;
+        this.ENABLE_FADE = true;
+        this._needNormals = true;
+        this._needUVs = true;
+        this.rebuild();
     }
-    return FluentButtonMaterialDefines;
-}(MaterialDefines));
+}
 /**
  * Class used to render square buttons with fluent design
  * @since 5.0.0
  */
-var FluentButtonMaterial = /** @class */ (function (_super) {
-    __extends(FluentButtonMaterial, _super);
-    function FluentButtonMaterial(name, scene) {
-        var _this = _super.call(this, name, scene) || this;
+export class FluentButtonMaterial extends PushMaterial {
+    constructor(name, scene) {
+        super(name, scene);
         /**
          * Gets or sets the width of the glowing edge, relative to the scale of the button.
          * (Default is 4% of the height).
          */
-        _this.edgeWidth = 0.04;
+        this.edgeWidth = 0.04;
         /**
          * Gets or sets the color of the glowing edge.
          */
-        _this.edgeColor = new Color4(0.592157, 0.592157, 0.592157, 1.0);
+        this.edgeColor = new Color4(0.592157, 0.592157, 0.592157, 1.0);
         /**
          * Gets or sets the maximum intensity of the proximity light.
          */
-        _this.proximityMaxIntensity = 0.45;
+        this.proximityMaxIntensity = 0.45;
         /**
          * Gets or sets the maximum distance for the proximity light (Default is 16mm).
          */
-        _this.proximityFarDistance = 0.16;
+        this.proximityFarDistance = 0.16;
         /**
          * Gets or sets the radius of the proximity light when near to the surface.
          */
-        _this.proximityNearRadius = 1.5;
+        this.proximityNearRadius = 1.5;
         /**
          * Gets or sets the anisotropy of the proximity light.
          */
-        _this.proximityAnisotropy = 1;
+        this.proximityAnisotropy = 1;
         /**
          * Gets or sets the amount of fuzzing in the selection focus.
          */
-        _this.selectionFuzz = 0.5;
+        this.selectionFuzz = 0.5;
         /**
          * Gets or sets an override value to display the button as selected.
          */
-        _this.selected = 0;
+        this.selected = 0;
         /**
          * Gets or sets a value to manually fade the blob size.
          */
-        _this.selectionFade = 0;
+        this.selectionFade = 0;
         /**
          * Gets or sets a value to manually shrink the blob size as it fades (see selectionFade).
          */
-        _this.selectionFadeSize = 0.3;
+        this.selectionFadeSize = 0.3;
         /**
          * Gets or sets the distance from the button the cursor should be for the button
          * to appear selected (Default is 8cm).
          */
-        _this.selectedDistance = 0.08;
+        this.selectedDistance = 0.08;
         /**
          * Gets or sets the fall-off distance for the selection fade (Default is 8cm).
          */
-        _this.selectedFadeLength = 0.08;
+        this.selectedFadeLength = 0.08;
         /**
          * Gets or sets the intensity of the luminous blob (Ranges 0-1, default is 0.5).
          */
-        _this.blobIntensity = 0.5;
+        this.blobIntensity = 0.5;
         /**
          * The size of the blob when the pointer is at the blobFarDistance (Default is 5cm).
          */
-        _this.blobFarSize = 0.05;
+        this.blobFarSize = 0.05;
         /**
          * The distance at which the pointer is considered near. See [left|right]BlobNearSize. (Default is 0cm).
          */
-        _this.blobNearDistance = 0;
+        this.blobNearDistance = 0;
         /**
          * The distance at which the pointer is considered far. See [left|right]BlobFarSize. (Default is 8cm).
          */
-        _this.blobFarDistance = 0.08;
+        this.blobFarDistance = 0.08;
         /**
          * The distance over which the blob intensity fades from full to none (Default is 8cm).
          */
-        _this.blobFadeLength = 0.08;
+        this.blobFadeLength = 0.08;
         /**
          * Gets or sets whether the blob corresponding to the left index finger is enabled.
          */
-        _this.leftBlobEnable = true;
+        this.leftBlobEnable = true;
         /**
          * Gets or sets the size of the left blob when the left pointer is considered near. See blobNearDistance. (Default is 2.5cm).
          */
-        _this.leftBlobNearSize = 0.025;
+        this.leftBlobNearSize = 0.025;
         /**
          * Gets or sets the progress of the pulse animation on the left blob (Ranges 0-1).
          */
-        _this.leftBlobPulse = 0;
+        this.leftBlobPulse = 0;
         /**
          * Gets or sets the fade factor on the left blob.
          */
-        _this.leftBlobFade = 1;
+        this.leftBlobFade = 1;
         /**
          * Gets or sets the inner fade on the left blob;
          */
-        _this.leftBlobInnerFade = 0.01;
+        this.leftBlobInnerFade = 0.01;
         /**
          * Gets or sets whether the blob corresponding to the right index finger is enabled.
          */
-        _this.rightBlobEnable = true;
+        this.rightBlobEnable = true;
         /**
          * Gets or sets the size of the right blob when the right pointer is considered near. See blobNearDistance. (Default is 2.5cm).
          */
-        _this.rightBlobNearSize = 0.025;
+        this.rightBlobNearSize = 0.025;
         /**
          * Gets or sets the progress of the pulse animation on the right blob (Ranges 0-1).
          */
-        _this.rightBlobPulse = 0;
+        this.rightBlobPulse = 0;
         /**
          * Gets or sets the fade factor on the right blob.
          */
-        _this.rightBlobFade = 1;
+        this.rightBlobFade = 1;
         /**
          * Gets or sets the inner fade on the right blob;
          */
-        _this.rightBlobInnerFade = 0.01;
+        this.rightBlobInnerFade = 0.01;
         /**
          * Gets or sets the direction of the active face before the world transform is applied.
          * This should almost always be set to -z.
          */
-        _this.activeFaceDir = new Vector3(0, 0, -1);
+        this.activeFaceDir = new Vector3(0, 0, -1);
         /**
          * Gets or sets the button's up direction before the world transform is applied.
          * This should almost always be set to +y.
          */
-        _this.activeFaceUp = new Vector3(0, 1, 0);
+        this.activeFaceUp = new Vector3(0, 1, 0);
         /**
          * Gets or sets whether the edge fade effect is enabled.
          */
-        _this.enableFade = true;
+        this.enableFade = true;
         /**
          * Gets or sets a value corresponding to the width of the edge fade effect (Default 1.5).
          */
-        _this.fadeWidth = 1.5;
+        this.fadeWidth = 1.5;
         /**
          * Gets or sets whether the active face is smoothly interpolated.
          */
-        _this.smoothActiveFace = true;
+        this.smoothActiveFace = true;
         /**
          * Gets or sets whether the frame of the fluent button model is visible.
          * This is usually only enabled for debugging purposes.
          */
-        _this.showFrame = false;
+        this.showFrame = false;
         /**
          * Gets or sets whether the blob color texture is used for the proximity
          * light effect. This is usually only disabled for debugging purposes.
          */
-        _this.useBlobTexture = true;
+        this.useBlobTexture = true;
         /**
          * Gets or sets the world-space position of the tip of the left index finger.
          */
-        _this.globalLeftIndexTipPosition = Vector3.Zero();
+        this.globalLeftIndexTipPosition = Vector3.Zero();
         /**
          * Gets or sets the world-space position of the tip of the right index finger.
          */
-        _this.globalRightIndexTipPosition = Vector3.Zero();
-        _this.alphaMode = Constants.ALPHA_ADD;
-        _this.disableDepthWrite = true;
-        _this.backFaceCulling = false;
-        _this._blobTexture = new Texture(FluentButtonMaterial.BLOB_TEXTURE_URL, _this.getScene(), true, false, Texture.NEAREST_SAMPLINGMODE);
-        return _this;
+        this.globalRightIndexTipPosition = Vector3.Zero();
+        this.alphaMode = Constants.ALPHA_ADD;
+        this.disableDepthWrite = true;
+        this.backFaceCulling = false;
+        this._blobTexture = new Texture(FluentButtonMaterial.BLOB_TEXTURE_URL, this.getScene(), true, false, Texture.NEAREST_SAMPLINGMODE);
     }
-    FluentButtonMaterial.prototype.needAlphaBlending = function () {
+    needAlphaBlending() {
         return true;
-    };
-    FluentButtonMaterial.prototype.needAlphaTesting = function () {
+    }
+    needAlphaTesting() {
         return true;
-    };
-    FluentButtonMaterial.prototype.getAlphaTestTexture = function () {
+    }
+    getAlphaTestTexture() {
         return null;
-    };
+    }
     // Methods
-    FluentButtonMaterial.prototype.isReadyForSubMesh = function (mesh, subMesh) {
+    isReadyForSubMesh(mesh, subMesh) {
         if (this.isFrozen) {
             if (subMesh.effect && subMesh.effect._wasPreviouslyReady) {
                 return true;
@@ -209,12 +204,12 @@ var FluentButtonMaterial = /** @class */ (function (_super) {
         if (!subMesh.materialDefines) {
             subMesh.materialDefines = new FluentButtonMaterialDefines();
         }
-        var defines = subMesh.materialDefines;
-        var scene = this.getScene();
+        const defines = subMesh.materialDefines;
+        const scene = this.getScene();
         if (this._isReadyForSubMesh(subMesh)) {
             return true;
         }
-        var engine = scene.getEngine();
+        const engine = scene.getEngine();
         // Attribs
         MaterialHelper.PrepareDefinesForAttributes(mesh, defines, true, false);
         // Get correct effect
@@ -222,14 +217,14 @@ var FluentButtonMaterial = /** @class */ (function (_super) {
             defines.markAsProcessed();
             scene.resetCachedMaterial();
             // Fallbacks
-            var fallbacks = new EffectFallbacks();
+            const fallbacks = new EffectFallbacks();
             if (defines.FOG) {
                 fallbacks.addFallback(1, "FOG");
             }
             MaterialHelper.HandleFallbacksForShadows(defines, fallbacks);
             defines.IMAGEPROCESSINGPOSTPROCESS = scene.imageProcessingConfiguration.applyByPostProcess;
             //Attributes
-            var attribs = [VertexBuffer.PositionKind];
+            const attribs = [VertexBuffer.PositionKind];
             if (defines.NORMAL) {
                 attribs.push(VertexBuffer.NormalKind);
             }
@@ -247,9 +242,9 @@ var FluentButtonMaterial = /** @class */ (function (_super) {
             }
             MaterialHelper.PrepareAttributesForInstances(attribs, defines);
             // Legacy browser patch
-            var shaderName = "fluentButton";
-            var join = defines.toString();
-            var uniforms = [
+            const shaderName = "fluentButton";
+            const join = defines.toString();
+            const uniforms = [
                 "world",
                 "viewProjection",
                 "cameraPosition",
@@ -300,8 +295,8 @@ var FluentButtonMaterial = /** @class */ (function (_super) {
                 "Global_Left_Index_Tip_Proximity",
                 "Global_Right_Index_Tip_Proximity",
             ];
-            var samplers = ["_Blob_Texture_"];
-            var uniformBuffers = new Array();
+            const samplers = ["_Blob_Texture_"];
+            const uniformBuffers = new Array();
             MaterialHelper.PrepareUniformsAndSamplersList({
                 uniformsNames: uniforms,
                 uniformBuffersNames: uniformBuffers,
@@ -327,14 +322,14 @@ var FluentButtonMaterial = /** @class */ (function (_super) {
         defines._renderId = scene.getRenderId();
         subMesh.effect._wasPreviouslyReady = true;
         return true;
-    };
-    FluentButtonMaterial.prototype.bindForSubMesh = function (world, mesh, subMesh) {
-        var scene = this.getScene();
-        var defines = subMesh.materialDefines;
+    }
+    bindForSubMesh(world, mesh, subMesh) {
+        const scene = this.getScene();
+        const defines = subMesh.materialDefines;
         if (!defines) {
             return;
         }
-        var effect = subMesh.effect;
+        const effect = subMesh.effect;
         if (!effect) {
             return;
         }
@@ -394,147 +389,144 @@ var FluentButtonMaterial = /** @class */ (function (_super) {
         this._activeEffect.setVector4("Global_Left_Index_Tip_Position", new Vector4(this.globalLeftIndexTipPosition.x, this.globalLeftIndexTipPosition.y, this.globalLeftIndexTipPosition.z, 1.0));
         this._activeEffect.setVector4("Global_Right_Index_Tip_Position", new Vector4(this.globalRightIndexTipPosition.x, this.globalRightIndexTipPosition.y, this.globalRightIndexTipPosition.z, 1.0));
         this._afterBind(mesh, this._activeEffect);
-    };
+    }
     /**
      * Get the list of animatables in the material.
      * @returns the list of animatables object used in the material
      */
-    FluentButtonMaterial.prototype.getAnimatables = function () {
+    getAnimatables() {
         return [];
-    };
-    FluentButtonMaterial.prototype.dispose = function (forceDisposeEffect) {
-        _super.prototype.dispose.call(this, forceDisposeEffect);
-    };
-    FluentButtonMaterial.prototype.clone = function (name) {
-        var _this = this;
-        return SerializationHelper.Clone(function () { return new FluentButtonMaterial(name, _this.getScene()); }, this);
-    };
-    FluentButtonMaterial.prototype.serialize = function () {
-        var serializationObject = _super.prototype.serialize.call(this);
+    }
+    dispose(forceDisposeEffect) {
+        super.dispose(forceDisposeEffect);
+    }
+    clone(name) {
+        return SerializationHelper.Clone(() => new FluentButtonMaterial(name, this.getScene()), this);
+    }
+    serialize() {
+        const serializationObject = super.serialize();
         serializationObject.customType = "BABYLON.FluentButtonMaterial";
         return serializationObject;
-    };
-    FluentButtonMaterial.prototype.getClassName = function () {
+    }
+    getClassName() {
         return "FluentButtonMaterial";
-    };
+    }
     // Statics
-    FluentButtonMaterial.Parse = function (source, scene, rootUrl) {
-        return SerializationHelper.Parse(function () { return new FluentButtonMaterial(source.name, scene); }, source, scene, rootUrl);
-    };
-    /**
-     * URL pointing to the texture used to define the coloring for the fluent blob effect.
-     */
-    FluentButtonMaterial.BLOB_TEXTURE_URL = "https://assets.babylonjs.com/meshes/MRTK/mrtk-fluent-button-blob.png";
-    __decorate([
-        serialize()
-    ], FluentButtonMaterial.prototype, "edgeWidth", void 0);
-    __decorate([
-        serializeAsColor4()
-    ], FluentButtonMaterial.prototype, "edgeColor", void 0);
-    __decorate([
-        serialize()
-    ], FluentButtonMaterial.prototype, "proximityMaxIntensity", void 0);
-    __decorate([
-        serialize()
-    ], FluentButtonMaterial.prototype, "proximityFarDistance", void 0);
-    __decorate([
-        serialize()
-    ], FluentButtonMaterial.prototype, "proximityNearRadius", void 0);
-    __decorate([
-        serialize()
-    ], FluentButtonMaterial.prototype, "proximityAnisotropy", void 0);
-    __decorate([
-        serialize()
-    ], FluentButtonMaterial.prototype, "selectionFuzz", void 0);
-    __decorate([
-        serialize()
-    ], FluentButtonMaterial.prototype, "selected", void 0);
-    __decorate([
-        serialize()
-    ], FluentButtonMaterial.prototype, "selectionFade", void 0);
-    __decorate([
-        serialize()
-    ], FluentButtonMaterial.prototype, "selectionFadeSize", void 0);
-    __decorate([
-        serialize()
-    ], FluentButtonMaterial.prototype, "selectedDistance", void 0);
-    __decorate([
-        serialize()
-    ], FluentButtonMaterial.prototype, "selectedFadeLength", void 0);
-    __decorate([
-        serialize()
-    ], FluentButtonMaterial.prototype, "blobIntensity", void 0);
-    __decorate([
-        serialize()
-    ], FluentButtonMaterial.prototype, "blobFarSize", void 0);
-    __decorate([
-        serialize()
-    ], FluentButtonMaterial.prototype, "blobNearDistance", void 0);
-    __decorate([
-        serialize()
-    ], FluentButtonMaterial.prototype, "blobFarDistance", void 0);
-    __decorate([
-        serialize()
-    ], FluentButtonMaterial.prototype, "blobFadeLength", void 0);
-    __decorate([
-        serialize()
-    ], FluentButtonMaterial.prototype, "leftBlobEnable", void 0);
-    __decorate([
-        serialize()
-    ], FluentButtonMaterial.prototype, "leftBlobNearSize", void 0);
-    __decorate([
-        serialize()
-    ], FluentButtonMaterial.prototype, "leftBlobPulse", void 0);
-    __decorate([
-        serialize()
-    ], FluentButtonMaterial.prototype, "leftBlobFade", void 0);
-    __decorate([
-        serialize()
-    ], FluentButtonMaterial.prototype, "leftBlobInnerFade", void 0);
-    __decorate([
-        serialize()
-    ], FluentButtonMaterial.prototype, "rightBlobEnable", void 0);
-    __decorate([
-        serialize()
-    ], FluentButtonMaterial.prototype, "rightBlobNearSize", void 0);
-    __decorate([
-        serialize()
-    ], FluentButtonMaterial.prototype, "rightBlobPulse", void 0);
-    __decorate([
-        serialize()
-    ], FluentButtonMaterial.prototype, "rightBlobFade", void 0);
-    __decorate([
-        serialize()
-    ], FluentButtonMaterial.prototype, "rightBlobInnerFade", void 0);
-    __decorate([
-        serializeAsVector3()
-    ], FluentButtonMaterial.prototype, "activeFaceDir", void 0);
-    __decorate([
-        serializeAsVector3()
-    ], FluentButtonMaterial.prototype, "activeFaceUp", void 0);
-    __decorate([
-        serialize()
-    ], FluentButtonMaterial.prototype, "enableFade", void 0);
-    __decorate([
-        serialize()
-    ], FluentButtonMaterial.prototype, "fadeWidth", void 0);
-    __decorate([
-        serialize()
-    ], FluentButtonMaterial.prototype, "smoothActiveFace", void 0);
-    __decorate([
-        serialize()
-    ], FluentButtonMaterial.prototype, "showFrame", void 0);
-    __decorate([
-        serialize()
-    ], FluentButtonMaterial.prototype, "useBlobTexture", void 0);
-    __decorate([
-        serializeAsVector3()
-    ], FluentButtonMaterial.prototype, "globalLeftIndexTipPosition", void 0);
-    __decorate([
-        serializeAsVector3()
-    ], FluentButtonMaterial.prototype, "globalRightIndexTipPosition", void 0);
-    return FluentButtonMaterial;
-}(PushMaterial));
-export { FluentButtonMaterial };
+    static Parse(source, scene, rootUrl) {
+        return SerializationHelper.Parse(() => new FluentButtonMaterial(source.name, scene), source, scene, rootUrl);
+    }
+}
+/**
+ * URL pointing to the texture used to define the coloring for the fluent blob effect.
+ */
+FluentButtonMaterial.BLOB_TEXTURE_URL = "https://assets.babylonjs.com/meshes/MRTK/mrtk-fluent-button-blob.png";
+__decorate([
+    serialize()
+], FluentButtonMaterial.prototype, "edgeWidth", void 0);
+__decorate([
+    serializeAsColor4()
+], FluentButtonMaterial.prototype, "edgeColor", void 0);
+__decorate([
+    serialize()
+], FluentButtonMaterial.prototype, "proximityMaxIntensity", void 0);
+__decorate([
+    serialize()
+], FluentButtonMaterial.prototype, "proximityFarDistance", void 0);
+__decorate([
+    serialize()
+], FluentButtonMaterial.prototype, "proximityNearRadius", void 0);
+__decorate([
+    serialize()
+], FluentButtonMaterial.prototype, "proximityAnisotropy", void 0);
+__decorate([
+    serialize()
+], FluentButtonMaterial.prototype, "selectionFuzz", void 0);
+__decorate([
+    serialize()
+], FluentButtonMaterial.prototype, "selected", void 0);
+__decorate([
+    serialize()
+], FluentButtonMaterial.prototype, "selectionFade", void 0);
+__decorate([
+    serialize()
+], FluentButtonMaterial.prototype, "selectionFadeSize", void 0);
+__decorate([
+    serialize()
+], FluentButtonMaterial.prototype, "selectedDistance", void 0);
+__decorate([
+    serialize()
+], FluentButtonMaterial.prototype, "selectedFadeLength", void 0);
+__decorate([
+    serialize()
+], FluentButtonMaterial.prototype, "blobIntensity", void 0);
+__decorate([
+    serialize()
+], FluentButtonMaterial.prototype, "blobFarSize", void 0);
+__decorate([
+    serialize()
+], FluentButtonMaterial.prototype, "blobNearDistance", void 0);
+__decorate([
+    serialize()
+], FluentButtonMaterial.prototype, "blobFarDistance", void 0);
+__decorate([
+    serialize()
+], FluentButtonMaterial.prototype, "blobFadeLength", void 0);
+__decorate([
+    serialize()
+], FluentButtonMaterial.prototype, "leftBlobEnable", void 0);
+__decorate([
+    serialize()
+], FluentButtonMaterial.prototype, "leftBlobNearSize", void 0);
+__decorate([
+    serialize()
+], FluentButtonMaterial.prototype, "leftBlobPulse", void 0);
+__decorate([
+    serialize()
+], FluentButtonMaterial.prototype, "leftBlobFade", void 0);
+__decorate([
+    serialize()
+], FluentButtonMaterial.prototype, "leftBlobInnerFade", void 0);
+__decorate([
+    serialize()
+], FluentButtonMaterial.prototype, "rightBlobEnable", void 0);
+__decorate([
+    serialize()
+], FluentButtonMaterial.prototype, "rightBlobNearSize", void 0);
+__decorate([
+    serialize()
+], FluentButtonMaterial.prototype, "rightBlobPulse", void 0);
+__decorate([
+    serialize()
+], FluentButtonMaterial.prototype, "rightBlobFade", void 0);
+__decorate([
+    serialize()
+], FluentButtonMaterial.prototype, "rightBlobInnerFade", void 0);
+__decorate([
+    serializeAsVector3()
+], FluentButtonMaterial.prototype, "activeFaceDir", void 0);
+__decorate([
+    serializeAsVector3()
+], FluentButtonMaterial.prototype, "activeFaceUp", void 0);
+__decorate([
+    serialize()
+], FluentButtonMaterial.prototype, "enableFade", void 0);
+__decorate([
+    serialize()
+], FluentButtonMaterial.prototype, "fadeWidth", void 0);
+__decorate([
+    serialize()
+], FluentButtonMaterial.prototype, "smoothActiveFace", void 0);
+__decorate([
+    serialize()
+], FluentButtonMaterial.prototype, "showFrame", void 0);
+__decorate([
+    serialize()
+], FluentButtonMaterial.prototype, "useBlobTexture", void 0);
+__decorate([
+    serializeAsVector3()
+], FluentButtonMaterial.prototype, "globalLeftIndexTipPosition", void 0);
+__decorate([
+    serializeAsVector3()
+], FluentButtonMaterial.prototype, "globalRightIndexTipPosition", void 0);
 RegisterClass("BABYLON.GUI.FluentButtonMaterial", FluentButtonMaterial);
 //# sourceMappingURL=fluentButtonMaterial.js.map