@babylonjs/gui 5.0.0-rc.7 → 5.0.0-rc.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/2D/adtInstrumentation.d.ts +52 -52
- package/2D/adtInstrumentation.js +126 -126
- package/2D/advancedDynamicTexture.d.ts +448 -448
- package/2D/advancedDynamicTexture.js +1318 -1318
- package/2D/controls/button.d.ts +135 -135
- package/2D/controls/button.js +276 -276
- package/2D/controls/checkbox.d.ts +59 -59
- package/2D/controls/checkbox.js +188 -188
- package/2D/controls/colorpicker.d.ts +103 -103
- package/2D/controls/colorpicker.js +1417 -1417
- package/2D/controls/container.d.ts +175 -175
- package/2D/controls/container.js +570 -570
- package/2D/controls/control.d.ts +866 -866
- package/2D/controls/control.js +2433 -2433
- package/2D/controls/displayGrid.d.ts +53 -53
- package/2D/controls/displayGrid.js +245 -245
- package/2D/controls/ellipse.d.ts +21 -21
- package/2D/controls/ellipse.js +85 -85
- package/2D/controls/focusableButton.d.ts +59 -59
- package/2D/controls/focusableButton.js +99 -99
- package/2D/controls/focusableControl.d.ts +34 -34
- package/2D/controls/focusableControl.js +1 -1
- package/2D/controls/grid.d.ts +139 -139
- package/2D/controls/grid.js +529 -529
- package/2D/controls/image.d.ts +204 -204
- package/2D/controls/image.js +887 -887
- package/2D/controls/index.d.ts +29 -29
- package/2D/controls/index.js +29 -29
- package/2D/controls/inputPassword.d.ts +8 -8
- package/2D/controls/inputPassword.js +25 -25
- package/2D/controls/inputText.d.ts +201 -201
- package/2D/controls/inputText.js +1119 -1119
- package/2D/controls/line.d.ts +66 -66
- package/2D/controls/line.js +271 -271
- package/2D/controls/multiLine.d.ts +75 -75
- package/2D/controls/multiLine.js +262 -262
- package/2D/controls/radioButton.d.ts +49 -49
- package/2D/controls/radioButton.js +205 -205
- package/2D/controls/rectangle.d.ts +29 -29
- package/2D/controls/rectangle.js +150 -150
- package/2D/controls/scrollViewers/scrollViewer.d.ts +182 -182
- package/2D/controls/scrollViewers/scrollViewer.js +677 -677
- package/2D/controls/scrollViewers/scrollViewerWindow.d.ts +57 -57
- package/2D/controls/scrollViewers/scrollViewerWindow.js +278 -278
- package/2D/controls/selector.d.ts +263 -263
- package/2D/controls/selector.js +692 -692
- package/2D/controls/sliders/baseSlider.d.ts +82 -82
- package/2D/controls/sliders/baseSlider.js +347 -347
- package/2D/controls/sliders/imageBasedSlider.d.ts +49 -49
- package/2D/controls/sliders/imageBasedSlider.js +192 -192
- package/2D/controls/sliders/imageScrollBar.d.ts +65 -65
- package/2D/controls/sliders/imageScrollBar.js +263 -263
- package/2D/controls/sliders/scrollBar.d.ts +38 -38
- package/2D/controls/sliders/scrollBar.js +143 -143
- package/2D/controls/sliders/slider.d.ts +35 -35
- package/2D/controls/sliders/slider.js +271 -271
- package/2D/controls/stackPanel.d.ts +64 -64
- package/2D/controls/stackPanel.js +246 -246
- package/2D/controls/statics.d.ts +6 -6
- package/2D/controls/statics.js +49 -49
- package/2D/controls/textBlock.d.ts +175 -175
- package/2D/controls/textBlock.js +603 -603
- package/2D/controls/textWrapper.d.ts +13 -13
- package/2D/controls/textWrapper.js +101 -101
- package/2D/controls/toggleButton.d.ts +117 -117
- package/2D/controls/toggleButton.js +268 -268
- package/2D/controls/virtualKeyboard.d.ts +96 -96
- package/2D/controls/virtualKeyboard.js +256 -256
- package/2D/index.d.ts +9 -9
- package/2D/index.js +9 -9
- package/2D/math2D.d.ts +117 -117
- package/2D/math2D.js +221 -221
- package/2D/measure.d.ts +77 -77
- package/2D/measure.js +139 -139
- package/2D/multiLinePoint.d.ts +47 -47
- package/2D/multiLinePoint.js +127 -127
- package/2D/style.d.ts +46 -46
- package/2D/style.js +97 -97
- package/2D/valueAndUnit.d.ts +89 -89
- package/2D/valueAndUnit.js +226 -226
- package/2D/xmlLoader.d.ts +60 -60
- package/2D/xmlLoader.js +348 -348
- package/3D/behaviors/defaultBehavior.d.ts +73 -73
- package/3D/behaviors/defaultBehavior.js +121 -121
- package/3D/controls/abstractButton3D.d.ts +15 -15
- package/3D/controls/abstractButton3D.js +25 -25
- package/3D/controls/button3D.d.ts +30 -30
- package/3D/controls/button3D.js +93 -93
- package/3D/controls/container3D.d.ts +72 -72
- package/3D/controls/container3D.js +139 -139
- package/3D/controls/contentDisplay3D.d.ts +30 -30
- package/3D/controls/contentDisplay3D.js +79 -79
- package/3D/controls/control3D.d.ts +201 -201
- package/3D/controls/control3D.js +445 -445
- package/3D/controls/cylinderPanel.d.ts +17 -17
- package/3D/controls/cylinderPanel.js +66 -66
- package/3D/controls/handMenu.d.ts +28 -28
- package/3D/controls/handMenu.js +47 -47
- package/3D/controls/holographicBackplate.d.ts +49 -49
- package/3D/controls/holographicBackplate.js +120 -120
- package/3D/controls/holographicButton.d.ts +84 -84
- package/3D/controls/holographicButton.js +339 -339
- package/3D/controls/holographicSlate.d.ts +131 -131
- package/3D/controls/holographicSlate.js +431 -431
- package/3D/controls/index.d.ts +21 -21
- package/3D/controls/index.js +21 -21
- package/3D/controls/meshButton3D.d.ts +21 -21
- package/3D/controls/meshButton3D.js +62 -62
- package/3D/controls/nearMenu.d.ts +44 -44
- package/3D/controls/nearMenu.js +114 -114
- package/3D/controls/planePanel.d.ts +9 -9
- package/3D/controls/planePanel.js +36 -36
- package/3D/controls/scatterPanel.d.ts +18 -18
- package/3D/controls/scatterPanel.js +108 -108
- package/3D/controls/slider3D.d.ts +81 -81
- package/3D/controls/slider3D.js +268 -268
- package/3D/controls/spherePanel.d.ts +17 -17
- package/3D/controls/spherePanel.js +67 -67
- package/3D/controls/stackPanel3D.d.ts +22 -22
- package/3D/controls/stackPanel3D.js +107 -107
- package/3D/controls/touchButton3D.d.ts +80 -80
- package/3D/controls/touchButton3D.js +233 -233
- package/3D/controls/touchHolographicButton.d.ts +110 -110
- package/3D/controls/touchHolographicButton.js +445 -445
- package/3D/controls/touchHolographicMenu.d.ts +61 -61
- package/3D/controls/touchHolographicMenu.js +149 -149
- package/3D/controls/touchMeshButton3D.d.ts +21 -21
- package/3D/controls/touchMeshButton3D.js +62 -62
- package/3D/controls/volumeBasedPanel.d.ts +53 -53
- package/3D/controls/volumeBasedPanel.js +174 -174
- package/3D/gizmos/gizmoHandle.d.ts +108 -108
- package/3D/gizmos/gizmoHandle.js +209 -209
- package/3D/gizmos/index.d.ts +2 -2
- package/3D/gizmos/index.js +2 -2
- package/3D/gizmos/slateGizmo.d.ts +57 -57
- package/3D/gizmos/slateGizmo.js +369 -369
- package/3D/gui3DManager.d.ts +94 -94
- package/3D/gui3DManager.js +257 -257
- package/3D/index.d.ts +5 -5
- package/3D/index.js +5 -5
- package/3D/materials/fluent/fluentMaterial.d.ts +90 -90
- package/3D/materials/fluent/fluentMaterial.js +292 -292
- package/3D/materials/fluent/index.d.ts +1 -1
- package/3D/materials/fluent/index.js +1 -1
- package/3D/materials/fluent/shaders/fluent.fragment.d.ts +5 -5
- package/3D/materials/fluent/shaders/fluent.fragment.js +8 -8
- package/3D/materials/fluent/shaders/fluent.vertex.d.ts +5 -5
- package/3D/materials/fluent/shaders/fluent.vertex.js +8 -8
- package/3D/materials/fluentBackplate/fluentBackplateMaterial.d.ts +154 -154
- package/3D/materials/fluentBackplate/fluentBackplateMaterial.js +469 -469
- package/3D/materials/fluentBackplate/index.d.ts +1 -1
- package/3D/materials/fluentBackplate/index.js +1 -1
- package/3D/materials/fluentBackplate/shaders/fluentBackplate.fragment.d.ts +5 -5
- package/3D/materials/fluentBackplate/shaders/fluentBackplate.fragment.js +8 -8
- package/3D/materials/fluentBackplate/shaders/fluentBackplate.vertex.d.ts +5 -5
- package/3D/materials/fluentBackplate/shaders/fluentBackplate.vertex.js +8 -8
- package/3D/materials/fluentButton/fluentButtonMaterial.d.ts +189 -189
- package/3D/materials/fluentButton/fluentButtonMaterial.js +539 -539
- package/3D/materials/fluentButton/index.d.ts +1 -1
- package/3D/materials/fluentButton/index.js +1 -1
- package/3D/materials/fluentButton/shaders/fluentButton.fragment.d.ts +5 -5
- package/3D/materials/fluentButton/shaders/fluentButton.fragment.js +8 -8
- package/3D/materials/fluentButton/shaders/fluentButton.vertex.d.ts +5 -5
- package/3D/materials/fluentButton/shaders/fluentButton.vertex.js +8 -8
- package/3D/materials/fluentMaterial.d.ts +4 -4
- package/3D/materials/fluentMaterial.js +4 -4
- package/3D/materials/handle/handleMaterial.d.ts +68 -68
- package/3D/materials/handle/handleMaterial.js +126 -126
- package/3D/materials/handle/index.d.ts +1 -1
- package/3D/materials/handle/index.js +1 -1
- package/3D/materials/handle/shaders/handle.fragment.d.ts +5 -5
- package/3D/materials/handle/shaders/handle.fragment.js +8 -8
- package/3D/materials/handle/shaders/handle.vertex.d.ts +5 -5
- package/3D/materials/handle/shaders/handle.vertex.js +8 -8
- package/3D/materials/index.d.ts +5 -5
- package/3D/materials/index.js +5 -5
- package/3D/materials/mrdl/index.d.ts +3 -3
- package/3D/materials/mrdl/index.js +3 -3
- package/3D/materials/mrdl/mrdlBackplateMaterial.d.ts +147 -147
- package/3D/materials/mrdl/mrdlBackplateMaterial.js +436 -436
- package/3D/materials/mrdl/mrdlSliderBarMaterial.d.ts +333 -333
- package/3D/materials/mrdl/mrdlSliderBarMaterial.js +851 -851
- package/3D/materials/mrdl/mrdlSliderThumbMaterial.d.ts +333 -333
- package/3D/materials/mrdl/mrdlSliderThumbMaterial.js +851 -851
- package/3D/materials/mrdl/shaders/mrdlBackplate.fragment.d.ts +5 -5
- package/3D/materials/mrdl/shaders/mrdlBackplate.fragment.js +8 -8
- package/3D/materials/mrdl/shaders/mrdlBackplate.vertex.d.ts +5 -5
- package/3D/materials/mrdl/shaders/mrdlBackplate.vertex.js +8 -8
- package/3D/materials/mrdl/shaders/mrdlSliderBar.fragment.d.ts +5 -5
- package/3D/materials/mrdl/shaders/mrdlSliderBar.fragment.js +8 -8
- package/3D/materials/mrdl/shaders/mrdlSliderBar.vertex.d.ts +5 -5
- package/3D/materials/mrdl/shaders/mrdlSliderBar.vertex.js +8 -8
- package/3D/materials/mrdl/shaders/mrdlSliderThumb.fragment.d.ts +5 -5
- package/3D/materials/mrdl/shaders/mrdlSliderThumb.fragment.js +8 -8
- package/3D/materials/mrdl/shaders/mrdlSliderThumb.vertex.d.ts +5 -5
- package/3D/materials/mrdl/shaders/mrdlSliderThumb.vertex.js +8 -8
- package/3D/vector3WithInfo.d.ts +16 -16
- package/3D/vector3WithInfo.js +23 -23
- package/index.d.ts +2 -2
- package/index.js +2 -2
- package/legacy/legacy.d.ts +1 -1
- package/legacy/legacy.js +13 -13
- package/package.json +2 -2
|
@@ -1,61 +1,61 @@
|
|
|
1
|
-
import { Scene } from "@babylonjs/core/scene.js";
|
|
2
|
-
import { Vector3 } from "@babylonjs/core/Maths/math.vector.js";
|
|
3
|
-
import { TransformNode } from "@babylonjs/core/Meshes/transformNode.js";
|
|
4
|
-
import { Nullable } from "@babylonjs/core/types.js";
|
|
5
|
-
import { Control3D } from "./control3D";
|
|
6
|
-
import { VolumeBasedPanel } from "./volumeBasedPanel";
|
|
7
|
-
import { Mesh } from "@babylonjs/core/Meshes/mesh.js";
|
|
8
|
-
import { AbstractMesh } from "@babylonjs/core/Meshes/abstractMesh.js";
|
|
9
|
-
import { Container3D } from "./container3D";
|
|
10
|
-
import { TouchHolographicButton } from "./touchHolographicButton";
|
|
11
|
-
/**
|
|
12
|
-
* Simple menu that can contain holographic buttons
|
|
13
|
-
*/
|
|
14
|
-
export declare class TouchHolographicMenu extends VolumeBasedPanel {
|
|
15
|
-
protected _backPlate: Mesh;
|
|
16
|
-
private _backPlateMaterial;
|
|
17
|
-
private _pickedPointObserver;
|
|
18
|
-
private _currentMin;
|
|
19
|
-
private _currentMax;
|
|
20
|
-
private _backPlateMargin;
|
|
21
|
-
/**
|
|
22
|
-
* Scale for the buttons added to the menu
|
|
23
|
-
*/
|
|
24
|
-
protected static MENU_BUTTON_SCALE: number;
|
|
25
|
-
/**
|
|
26
|
-
* Gets or sets the margin size of the backplate in button size units.
|
|
27
|
-
* Setting this to 1, will make the backPlate margin the size of 1 button
|
|
28
|
-
*/
|
|
29
|
-
get backPlateMargin(): number;
|
|
30
|
-
set backPlateMargin(value: number);
|
|
31
|
-
protected _createNode(scene: Scene): Nullable<TransformNode>;
|
|
32
|
-
protected _affectMaterial(mesh: AbstractMesh): void;
|
|
33
|
-
protected _mapGridNode(control: Control3D, nodePosition: Vector3): void;
|
|
34
|
-
protected _finalProcessing(): void;
|
|
35
|
-
private _updateCurrentMinMax;
|
|
36
|
-
private _updateMargins;
|
|
37
|
-
/**
|
|
38
|
-
* Creates a holographic menu GUI 3D control
|
|
39
|
-
* @param name name of the menu
|
|
40
|
-
*/
|
|
41
|
-
constructor(name?: string);
|
|
42
|
-
/**
|
|
43
|
-
* Adds a button to the menu.
|
|
44
|
-
* Please note that the back material of the button will be set to transparent as it is attached to the menu.
|
|
45
|
-
*
|
|
46
|
-
* @param button Button to add
|
|
47
|
-
* @returns This menu
|
|
48
|
-
*/
|
|
49
|
-
addButton(button: TouchHolographicButton): TouchHolographicMenu;
|
|
50
|
-
/**
|
|
51
|
-
* This method should not be used directly. It is inherited from `Container3D`.
|
|
52
|
-
* Please use `addButton` instead.
|
|
53
|
-
* @param _control
|
|
54
|
-
* @returns
|
|
55
|
-
*/
|
|
56
|
-
addControl(_control: Control3D): Container3D;
|
|
57
|
-
/**
|
|
58
|
-
* Disposes the menu
|
|
59
|
-
*/
|
|
60
|
-
dispose(): void;
|
|
61
|
-
}
|
|
1
|
+
import { Scene } from "@babylonjs/core/scene.js";
|
|
2
|
+
import { Vector3 } from "@babylonjs/core/Maths/math.vector.js";
|
|
3
|
+
import { TransformNode } from "@babylonjs/core/Meshes/transformNode.js";
|
|
4
|
+
import { Nullable } from "@babylonjs/core/types.js";
|
|
5
|
+
import { Control3D } from "./control3D";
|
|
6
|
+
import { VolumeBasedPanel } from "./volumeBasedPanel";
|
|
7
|
+
import { Mesh } from "@babylonjs/core/Meshes/mesh.js";
|
|
8
|
+
import { AbstractMesh } from "@babylonjs/core/Meshes/abstractMesh.js";
|
|
9
|
+
import { Container3D } from "./container3D";
|
|
10
|
+
import { TouchHolographicButton } from "./touchHolographicButton";
|
|
11
|
+
/**
|
|
12
|
+
* Simple menu that can contain holographic buttons
|
|
13
|
+
*/
|
|
14
|
+
export declare class TouchHolographicMenu extends VolumeBasedPanel {
|
|
15
|
+
protected _backPlate: Mesh;
|
|
16
|
+
private _backPlateMaterial;
|
|
17
|
+
private _pickedPointObserver;
|
|
18
|
+
private _currentMin;
|
|
19
|
+
private _currentMax;
|
|
20
|
+
private _backPlateMargin;
|
|
21
|
+
/**
|
|
22
|
+
* Scale for the buttons added to the menu
|
|
23
|
+
*/
|
|
24
|
+
protected static MENU_BUTTON_SCALE: number;
|
|
25
|
+
/**
|
|
26
|
+
* Gets or sets the margin size of the backplate in button size units.
|
|
27
|
+
* Setting this to 1, will make the backPlate margin the size of 1 button
|
|
28
|
+
*/
|
|
29
|
+
get backPlateMargin(): number;
|
|
30
|
+
set backPlateMargin(value: number);
|
|
31
|
+
protected _createNode(scene: Scene): Nullable<TransformNode>;
|
|
32
|
+
protected _affectMaterial(mesh: AbstractMesh): void;
|
|
33
|
+
protected _mapGridNode(control: Control3D, nodePosition: Vector3): void;
|
|
34
|
+
protected _finalProcessing(): void;
|
|
35
|
+
private _updateCurrentMinMax;
|
|
36
|
+
private _updateMargins;
|
|
37
|
+
/**
|
|
38
|
+
* Creates a holographic menu GUI 3D control
|
|
39
|
+
* @param name name of the menu
|
|
40
|
+
*/
|
|
41
|
+
constructor(name?: string);
|
|
42
|
+
/**
|
|
43
|
+
* Adds a button to the menu.
|
|
44
|
+
* Please note that the back material of the button will be set to transparent as it is attached to the menu.
|
|
45
|
+
*
|
|
46
|
+
* @param button Button to add
|
|
47
|
+
* @returns This menu
|
|
48
|
+
*/
|
|
49
|
+
addButton(button: TouchHolographicButton): TouchHolographicMenu;
|
|
50
|
+
/**
|
|
51
|
+
* This method should not be used directly. It is inherited from `Container3D`.
|
|
52
|
+
* Please use `addButton` instead.
|
|
53
|
+
* @param _control
|
|
54
|
+
* @returns
|
|
55
|
+
*/
|
|
56
|
+
addControl(_control: Control3D): Container3D;
|
|
57
|
+
/**
|
|
58
|
+
* Disposes the menu
|
|
59
|
+
*/
|
|
60
|
+
dispose(): void;
|
|
61
|
+
}
|
|
@@ -1,150 +1,150 @@
|
|
|
1
|
-
import { __extends } from "tslib";
|
|
2
|
-
import { VolumeBasedPanel } from "./volumeBasedPanel
|
|
3
|
-
import { Mesh } from "@babylonjs/core/Meshes/mesh.js";
|
|
4
|
-
import { CreateBox } from "@babylonjs/core/Meshes/Builders/boxBuilder.js";
|
|
5
|
-
import { FluentMaterial } from "../materials/fluent/fluentMaterial
|
|
6
|
-
import { Color3 } from "@babylonjs/core/Maths/math.color.js";
|
|
7
|
-
import { Logger } from "@babylonjs/core/Misc/logger.js";
|
|
8
|
-
/**
|
|
9
|
-
* Simple menu that can contain holographic buttons
|
|
10
|
-
*/
|
|
11
|
-
var TouchHolographicMenu = /** @class */ (function (_super) {
|
|
12
|
-
__extends(TouchHolographicMenu, _super);
|
|
13
|
-
/**
|
|
14
|
-
* Creates a holographic menu GUI 3D control
|
|
15
|
-
* @param name name of the menu
|
|
16
|
-
*/
|
|
17
|
-
function TouchHolographicMenu(name) {
|
|
18
|
-
var _this = _super.call(this, name) || this;
|
|
19
|
-
_this._backPlateMargin = 1.25;
|
|
20
|
-
return _this;
|
|
21
|
-
}
|
|
22
|
-
Object.defineProperty(TouchHolographicMenu.prototype, "backPlateMargin", {
|
|
23
|
-
/**
|
|
24
|
-
* Gets or sets the margin size of the backplate in button size units.
|
|
25
|
-
* Setting this to 1, will make the backPlate margin the size of 1 button
|
|
26
|
-
*/
|
|
27
|
-
get: function () {
|
|
28
|
-
return this._backPlateMargin;
|
|
29
|
-
},
|
|
30
|
-
set: function (value) {
|
|
31
|
-
var _this = this;
|
|
32
|
-
this._backPlateMargin = value;
|
|
33
|
-
if (this._children.length >= 1) {
|
|
34
|
-
this.children.forEach(function (control) {
|
|
35
|
-
_this._updateCurrentMinMax(control.position);
|
|
36
|
-
});
|
|
37
|
-
this._updateMargins();
|
|
38
|
-
}
|
|
39
|
-
},
|
|
40
|
-
enumerable: false,
|
|
41
|
-
configurable: true
|
|
42
|
-
});
|
|
43
|
-
TouchHolographicMenu.prototype._createNode = function (scene) {
|
|
44
|
-
var node = new Mesh("menu_".concat(this.name), scene);
|
|
45
|
-
this._backPlate = CreateBox("backPlate" + this.name, { size: 1 }, scene);
|
|
46
|
-
this._backPlate.parent = node;
|
|
47
|
-
return node;
|
|
48
|
-
};
|
|
49
|
-
TouchHolographicMenu.prototype._affectMaterial = function (mesh) {
|
|
50
|
-
var _this = this;
|
|
51
|
-
this._backPlateMaterial = new FluentMaterial(this.name + "backPlateMaterial", mesh.getScene());
|
|
52
|
-
this._backPlateMaterial.albedoColor = new Color3(0.08, 0.15, 0.55);
|
|
53
|
-
this._backPlateMaterial.renderBorders = true;
|
|
54
|
-
this._backPlateMaterial.renderHoverLight = true;
|
|
55
|
-
this._pickedPointObserver = this._host.onPickedPointChangedObservable.add(function (pickedPoint) {
|
|
56
|
-
if (pickedPoint) {
|
|
57
|
-
_this._backPlateMaterial.hoverPosition = pickedPoint;
|
|
58
|
-
_this._backPlateMaterial.hoverColor.a = 1.0;
|
|
59
|
-
}
|
|
60
|
-
else {
|
|
61
|
-
_this._backPlateMaterial.hoverColor.a = 0;
|
|
62
|
-
}
|
|
63
|
-
});
|
|
64
|
-
this._backPlate.material = this._backPlateMaterial;
|
|
65
|
-
};
|
|
66
|
-
TouchHolographicMenu.prototype._mapGridNode = function (control, nodePosition) {
|
|
67
|
-
// Simple plane mapping for the menu
|
|
68
|
-
var mesh = control.mesh;
|
|
69
|
-
if (!mesh) {
|
|
70
|
-
return;
|
|
71
|
-
}
|
|
72
|
-
control.position = nodePosition.clone();
|
|
73
|
-
this._updateCurrentMinMax(nodePosition);
|
|
74
|
-
};
|
|
75
|
-
TouchHolographicMenu.prototype._finalProcessing = function () {
|
|
76
|
-
this._updateMargins();
|
|
77
|
-
};
|
|
78
|
-
TouchHolographicMenu.prototype._updateCurrentMinMax = function (nodePosition) {
|
|
79
|
-
if (!this._currentMin) {
|
|
80
|
-
this._currentMin = nodePosition.clone();
|
|
81
|
-
this._currentMax = nodePosition.clone();
|
|
82
|
-
}
|
|
83
|
-
this._currentMin.minimizeInPlace(nodePosition);
|
|
84
|
-
this._currentMax.maximizeInPlace(nodePosition);
|
|
85
|
-
};
|
|
86
|
-
TouchHolographicMenu.prototype._updateMargins = function () {
|
|
87
|
-
if (this._children.length > 0) {
|
|
88
|
-
this._currentMin.addInPlaceFromFloats(-this._cellWidth / 2, -this._cellHeight / 2, 0);
|
|
89
|
-
this._currentMax.addInPlaceFromFloats(this._cellWidth / 2, this._cellHeight / 2, 0);
|
|
90
|
-
var extendSize = this._currentMax.subtract(this._currentMin);
|
|
91
|
-
// Also add a % margin
|
|
92
|
-
this._backPlate.scaling.x = extendSize.x + this._cellWidth * this.backPlateMargin;
|
|
93
|
-
this._backPlate.scaling.y = extendSize.y + this._cellHeight * this.backPlateMargin;
|
|
94
|
-
this._backPlate.scaling.z = 0.001;
|
|
95
|
-
for (var i = 0; i < this._children.length; i++) {
|
|
96
|
-
this._children[i].position.subtractInPlace(this._currentMin).subtractInPlace(extendSize.scale(0.5));
|
|
97
|
-
this._children[i].position.z -= 0.01;
|
|
98
|
-
}
|
|
99
|
-
}
|
|
100
|
-
this._currentMin = null;
|
|
101
|
-
this._currentMax = null;
|
|
102
|
-
};
|
|
103
|
-
/**
|
|
104
|
-
* Adds a button to the menu.
|
|
105
|
-
* Please note that the back material of the button will be set to transparent as it is attached to the menu.
|
|
106
|
-
*
|
|
107
|
-
* @param button Button to add
|
|
108
|
-
* @returns This menu
|
|
109
|
-
*/
|
|
110
|
-
TouchHolographicMenu.prototype.addButton = function (button) {
|
|
111
|
-
// Block updating the layout until the button is resized (which has to happen after node creation)
|
|
112
|
-
var wasLayoutBlocked = this.blockLayout;
|
|
113
|
-
if (!wasLayoutBlocked) {
|
|
114
|
-
this.blockLayout = true;
|
|
115
|
-
}
|
|
116
|
-
_super.prototype.addControl.call(this, button);
|
|
117
|
-
button.isBackplateVisible = false;
|
|
118
|
-
button.scaling.scaleInPlace(TouchHolographicMenu.MENU_BUTTON_SCALE);
|
|
119
|
-
// Unblocking the layout triggers the pending layout update that uses the size of the buttons to determine the size of the backing mesh
|
|
120
|
-
if (!wasLayoutBlocked) {
|
|
121
|
-
this.blockLayout = false;
|
|
122
|
-
}
|
|
123
|
-
return this;
|
|
124
|
-
};
|
|
125
|
-
/**
|
|
126
|
-
* This method should not be used directly. It is inherited from `Container3D`.
|
|
127
|
-
* Please use `addButton` instead.
|
|
128
|
-
* @param _control
|
|
129
|
-
* @returns
|
|
130
|
-
*/
|
|
131
|
-
TouchHolographicMenu.prototype.addControl = function (_control) {
|
|
132
|
-
Logger.Warn("TouchHolographicMenu can only contain buttons. Please use the method `addButton` instead.");
|
|
133
|
-
return this;
|
|
134
|
-
};
|
|
135
|
-
/**
|
|
136
|
-
* Disposes the menu
|
|
137
|
-
*/
|
|
138
|
-
TouchHolographicMenu.prototype.dispose = function () {
|
|
139
|
-
_super.prototype.dispose.call(this);
|
|
140
|
-
this._host.onPickedPointChangedObservable.remove(this._pickedPointObserver);
|
|
141
|
-
};
|
|
142
|
-
/**
|
|
143
|
-
* Scale for the buttons added to the menu
|
|
144
|
-
*/
|
|
145
|
-
// eslint-disable-next-line @typescript-eslint/naming-convention
|
|
146
|
-
TouchHolographicMenu.MENU_BUTTON_SCALE = 1;
|
|
147
|
-
return TouchHolographicMenu;
|
|
148
|
-
}(VolumeBasedPanel));
|
|
149
|
-
export { TouchHolographicMenu };
|
|
1
|
+
import { __extends } from "tslib";
|
|
2
|
+
import { VolumeBasedPanel } from "./volumeBasedPanel";
|
|
3
|
+
import { Mesh } from "@babylonjs/core/Meshes/mesh.js";
|
|
4
|
+
import { CreateBox } from "@babylonjs/core/Meshes/Builders/boxBuilder.js";
|
|
5
|
+
import { FluentMaterial } from "../materials/fluent/fluentMaterial";
|
|
6
|
+
import { Color3 } from "@babylonjs/core/Maths/math.color.js";
|
|
7
|
+
import { Logger } from "@babylonjs/core/Misc/logger.js";
|
|
8
|
+
/**
|
|
9
|
+
* Simple menu that can contain holographic buttons
|
|
10
|
+
*/
|
|
11
|
+
var TouchHolographicMenu = /** @class */ (function (_super) {
|
|
12
|
+
__extends(TouchHolographicMenu, _super);
|
|
13
|
+
/**
|
|
14
|
+
* Creates a holographic menu GUI 3D control
|
|
15
|
+
* @param name name of the menu
|
|
16
|
+
*/
|
|
17
|
+
function TouchHolographicMenu(name) {
|
|
18
|
+
var _this = _super.call(this, name) || this;
|
|
19
|
+
_this._backPlateMargin = 1.25;
|
|
20
|
+
return _this;
|
|
21
|
+
}
|
|
22
|
+
Object.defineProperty(TouchHolographicMenu.prototype, "backPlateMargin", {
|
|
23
|
+
/**
|
|
24
|
+
* Gets or sets the margin size of the backplate in button size units.
|
|
25
|
+
* Setting this to 1, will make the backPlate margin the size of 1 button
|
|
26
|
+
*/
|
|
27
|
+
get: function () {
|
|
28
|
+
return this._backPlateMargin;
|
|
29
|
+
},
|
|
30
|
+
set: function (value) {
|
|
31
|
+
var _this = this;
|
|
32
|
+
this._backPlateMargin = value;
|
|
33
|
+
if (this._children.length >= 1) {
|
|
34
|
+
this.children.forEach(function (control) {
|
|
35
|
+
_this._updateCurrentMinMax(control.position);
|
|
36
|
+
});
|
|
37
|
+
this._updateMargins();
|
|
38
|
+
}
|
|
39
|
+
},
|
|
40
|
+
enumerable: false,
|
|
41
|
+
configurable: true
|
|
42
|
+
});
|
|
43
|
+
TouchHolographicMenu.prototype._createNode = function (scene) {
|
|
44
|
+
var node = new Mesh("menu_".concat(this.name), scene);
|
|
45
|
+
this._backPlate = CreateBox("backPlate" + this.name, { size: 1 }, scene);
|
|
46
|
+
this._backPlate.parent = node;
|
|
47
|
+
return node;
|
|
48
|
+
};
|
|
49
|
+
TouchHolographicMenu.prototype._affectMaterial = function (mesh) {
|
|
50
|
+
var _this = this;
|
|
51
|
+
this._backPlateMaterial = new FluentMaterial(this.name + "backPlateMaterial", mesh.getScene());
|
|
52
|
+
this._backPlateMaterial.albedoColor = new Color3(0.08, 0.15, 0.55);
|
|
53
|
+
this._backPlateMaterial.renderBorders = true;
|
|
54
|
+
this._backPlateMaterial.renderHoverLight = true;
|
|
55
|
+
this._pickedPointObserver = this._host.onPickedPointChangedObservable.add(function (pickedPoint) {
|
|
56
|
+
if (pickedPoint) {
|
|
57
|
+
_this._backPlateMaterial.hoverPosition = pickedPoint;
|
|
58
|
+
_this._backPlateMaterial.hoverColor.a = 1.0;
|
|
59
|
+
}
|
|
60
|
+
else {
|
|
61
|
+
_this._backPlateMaterial.hoverColor.a = 0;
|
|
62
|
+
}
|
|
63
|
+
});
|
|
64
|
+
this._backPlate.material = this._backPlateMaterial;
|
|
65
|
+
};
|
|
66
|
+
TouchHolographicMenu.prototype._mapGridNode = function (control, nodePosition) {
|
|
67
|
+
// Simple plane mapping for the menu
|
|
68
|
+
var mesh = control.mesh;
|
|
69
|
+
if (!mesh) {
|
|
70
|
+
return;
|
|
71
|
+
}
|
|
72
|
+
control.position = nodePosition.clone();
|
|
73
|
+
this._updateCurrentMinMax(nodePosition);
|
|
74
|
+
};
|
|
75
|
+
TouchHolographicMenu.prototype._finalProcessing = function () {
|
|
76
|
+
this._updateMargins();
|
|
77
|
+
};
|
|
78
|
+
TouchHolographicMenu.prototype._updateCurrentMinMax = function (nodePosition) {
|
|
79
|
+
if (!this._currentMin) {
|
|
80
|
+
this._currentMin = nodePosition.clone();
|
|
81
|
+
this._currentMax = nodePosition.clone();
|
|
82
|
+
}
|
|
83
|
+
this._currentMin.minimizeInPlace(nodePosition);
|
|
84
|
+
this._currentMax.maximizeInPlace(nodePosition);
|
|
85
|
+
};
|
|
86
|
+
TouchHolographicMenu.prototype._updateMargins = function () {
|
|
87
|
+
if (this._children.length > 0) {
|
|
88
|
+
this._currentMin.addInPlaceFromFloats(-this._cellWidth / 2, -this._cellHeight / 2, 0);
|
|
89
|
+
this._currentMax.addInPlaceFromFloats(this._cellWidth / 2, this._cellHeight / 2, 0);
|
|
90
|
+
var extendSize = this._currentMax.subtract(this._currentMin);
|
|
91
|
+
// Also add a % margin
|
|
92
|
+
this._backPlate.scaling.x = extendSize.x + this._cellWidth * this.backPlateMargin;
|
|
93
|
+
this._backPlate.scaling.y = extendSize.y + this._cellHeight * this.backPlateMargin;
|
|
94
|
+
this._backPlate.scaling.z = 0.001;
|
|
95
|
+
for (var i = 0; i < this._children.length; i++) {
|
|
96
|
+
this._children[i].position.subtractInPlace(this._currentMin).subtractInPlace(extendSize.scale(0.5));
|
|
97
|
+
this._children[i].position.z -= 0.01;
|
|
98
|
+
}
|
|
99
|
+
}
|
|
100
|
+
this._currentMin = null;
|
|
101
|
+
this._currentMax = null;
|
|
102
|
+
};
|
|
103
|
+
/**
|
|
104
|
+
* Adds a button to the menu.
|
|
105
|
+
* Please note that the back material of the button will be set to transparent as it is attached to the menu.
|
|
106
|
+
*
|
|
107
|
+
* @param button Button to add
|
|
108
|
+
* @returns This menu
|
|
109
|
+
*/
|
|
110
|
+
TouchHolographicMenu.prototype.addButton = function (button) {
|
|
111
|
+
// Block updating the layout until the button is resized (which has to happen after node creation)
|
|
112
|
+
var wasLayoutBlocked = this.blockLayout;
|
|
113
|
+
if (!wasLayoutBlocked) {
|
|
114
|
+
this.blockLayout = true;
|
|
115
|
+
}
|
|
116
|
+
_super.prototype.addControl.call(this, button);
|
|
117
|
+
button.isBackplateVisible = false;
|
|
118
|
+
button.scaling.scaleInPlace(TouchHolographicMenu.MENU_BUTTON_SCALE);
|
|
119
|
+
// Unblocking the layout triggers the pending layout update that uses the size of the buttons to determine the size of the backing mesh
|
|
120
|
+
if (!wasLayoutBlocked) {
|
|
121
|
+
this.blockLayout = false;
|
|
122
|
+
}
|
|
123
|
+
return this;
|
|
124
|
+
};
|
|
125
|
+
/**
|
|
126
|
+
* This method should not be used directly. It is inherited from `Container3D`.
|
|
127
|
+
* Please use `addButton` instead.
|
|
128
|
+
* @param _control
|
|
129
|
+
* @returns
|
|
130
|
+
*/
|
|
131
|
+
TouchHolographicMenu.prototype.addControl = function (_control) {
|
|
132
|
+
Logger.Warn("TouchHolographicMenu can only contain buttons. Please use the method `addButton` instead.");
|
|
133
|
+
return this;
|
|
134
|
+
};
|
|
135
|
+
/**
|
|
136
|
+
* Disposes the menu
|
|
137
|
+
*/
|
|
138
|
+
TouchHolographicMenu.prototype.dispose = function () {
|
|
139
|
+
_super.prototype.dispose.call(this);
|
|
140
|
+
this._host.onPickedPointChangedObservable.remove(this._pickedPointObserver);
|
|
141
|
+
};
|
|
142
|
+
/**
|
|
143
|
+
* Scale for the buttons added to the menu
|
|
144
|
+
*/
|
|
145
|
+
// eslint-disable-next-line @typescript-eslint/naming-convention
|
|
146
|
+
TouchHolographicMenu.MENU_BUTTON_SCALE = 1;
|
|
147
|
+
return TouchHolographicMenu;
|
|
148
|
+
}(VolumeBasedPanel));
|
|
149
|
+
export { TouchHolographicMenu };
|
|
150
150
|
//# sourceMappingURL=touchHolographicMenu.js.map
|
|
@@ -1,21 +1,21 @@
|
|
|
1
|
-
import { TransformNode } from "@babylonjs/core/Meshes/transformNode.js";
|
|
2
|
-
import { AbstractMesh } from "@babylonjs/core/Meshes/abstractMesh.js";
|
|
3
|
-
import { Mesh } from "@babylonjs/core/Meshes/mesh.js";
|
|
4
|
-
import { TouchButton3D } from "./touchButton3D";
|
|
5
|
-
/**
|
|
6
|
-
* Class used to create an interactable object. It's a touchable 3D button using a mesh coming from the current scene
|
|
7
|
-
* @since 5.0.0
|
|
8
|
-
*/
|
|
9
|
-
export declare class TouchMeshButton3D extends TouchButton3D {
|
|
10
|
-
/** @hidden */
|
|
11
|
-
protected _currentMesh: Mesh;
|
|
12
|
-
/**
|
|
13
|
-
* Creates a new 3D button based on a mesh
|
|
14
|
-
* @param mesh mesh to become a 3D button. By default this is also the mesh for near interaction collision checking
|
|
15
|
-
* @param name defines the control name
|
|
16
|
-
*/
|
|
17
|
-
constructor(mesh: Mesh, name?: string);
|
|
18
|
-
protected _getTypeName(): string;
|
|
19
|
-
protected _createNode(): TransformNode;
|
|
20
|
-
protected _affectMaterial(mesh: AbstractMesh): void;
|
|
21
|
-
}
|
|
1
|
+
import { TransformNode } from "@babylonjs/core/Meshes/transformNode.js";
|
|
2
|
+
import { AbstractMesh } from "@babylonjs/core/Meshes/abstractMesh.js";
|
|
3
|
+
import { Mesh } from "@babylonjs/core/Meshes/mesh.js";
|
|
4
|
+
import { TouchButton3D } from "./touchButton3D";
|
|
5
|
+
/**
|
|
6
|
+
* Class used to create an interactable object. It's a touchable 3D button using a mesh coming from the current scene
|
|
7
|
+
* @since 5.0.0
|
|
8
|
+
*/
|
|
9
|
+
export declare class TouchMeshButton3D extends TouchButton3D {
|
|
10
|
+
/** @hidden */
|
|
11
|
+
protected _currentMesh: Mesh;
|
|
12
|
+
/**
|
|
13
|
+
* Creates a new 3D button based on a mesh
|
|
14
|
+
* @param mesh mesh to become a 3D button. By default this is also the mesh for near interaction collision checking
|
|
15
|
+
* @param name defines the control name
|
|
16
|
+
*/
|
|
17
|
+
constructor(mesh: Mesh, name?: string);
|
|
18
|
+
protected _getTypeName(): string;
|
|
19
|
+
protected _createNode(): TransformNode;
|
|
20
|
+
protected _affectMaterial(mesh: AbstractMesh): void;
|
|
21
|
+
}
|
|
@@ -1,63 +1,63 @@
|
|
|
1
|
-
import { __extends } from "tslib";
|
|
2
|
-
import { TouchButton3D } from "./touchButton3D
|
|
3
|
-
/**
|
|
4
|
-
* Class used to create an interactable object. It's a touchable 3D button using a mesh coming from the current scene
|
|
5
|
-
* @since 5.0.0
|
|
6
|
-
*/
|
|
7
|
-
var TouchMeshButton3D = /** @class */ (function (_super) {
|
|
8
|
-
__extends(TouchMeshButton3D, _super);
|
|
9
|
-
/**
|
|
10
|
-
* Creates a new 3D button based on a mesh
|
|
11
|
-
* @param mesh mesh to become a 3D button. By default this is also the mesh for near interaction collision checking
|
|
12
|
-
* @param name defines the control name
|
|
13
|
-
*/
|
|
14
|
-
function TouchMeshButton3D(mesh, name) {
|
|
15
|
-
var _this = _super.call(this, name, mesh) || this;
|
|
16
|
-
_this._currentMesh = mesh;
|
|
17
|
-
/**
|
|
18
|
-
* Provides a default behavior on hover/out & up/down
|
|
19
|
-
* Override those function to create your own desired behavior specific to your mesh
|
|
20
|
-
*/
|
|
21
|
-
_this.pointerEnterAnimation = function () {
|
|
22
|
-
if (!_this.mesh) {
|
|
23
|
-
return;
|
|
24
|
-
}
|
|
25
|
-
_this.mesh.scaling.scaleInPlace(1.1);
|
|
26
|
-
};
|
|
27
|
-
_this.pointerOutAnimation = function () {
|
|
28
|
-
if (!_this.mesh) {
|
|
29
|
-
return;
|
|
30
|
-
}
|
|
31
|
-
_this.mesh.scaling.scaleInPlace(1.0 / 1.1);
|
|
32
|
-
};
|
|
33
|
-
_this.pointerDownAnimation = function () {
|
|
34
|
-
if (!_this.mesh) {
|
|
35
|
-
return;
|
|
36
|
-
}
|
|
37
|
-
_this.mesh.scaling.scaleInPlace(0.95);
|
|
38
|
-
};
|
|
39
|
-
_this.pointerUpAnimation = function () {
|
|
40
|
-
if (!_this.mesh) {
|
|
41
|
-
return;
|
|
42
|
-
}
|
|
43
|
-
_this.mesh.scaling.scaleInPlace(1.0 / 0.95);
|
|
44
|
-
};
|
|
45
|
-
return _this;
|
|
46
|
-
}
|
|
47
|
-
TouchMeshButton3D.prototype._getTypeName = function () {
|
|
48
|
-
return "TouchMeshButton3D";
|
|
49
|
-
};
|
|
50
|
-
// Mesh association
|
|
51
|
-
TouchMeshButton3D.prototype._createNode = function () {
|
|
52
|
-
var _this = this;
|
|
53
|
-
this._currentMesh.getChildMeshes().forEach(function (mesh) {
|
|
54
|
-
_this._injectGUI3DReservedDataStore(mesh).control = _this;
|
|
55
|
-
});
|
|
56
|
-
return this._currentMesh;
|
|
57
|
-
};
|
|
58
|
-
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
59
|
-
TouchMeshButton3D.prototype._affectMaterial = function (mesh) { };
|
|
60
|
-
return TouchMeshButton3D;
|
|
61
|
-
}(TouchButton3D));
|
|
62
|
-
export { TouchMeshButton3D };
|
|
1
|
+
import { __extends } from "tslib";
|
|
2
|
+
import { TouchButton3D } from "./touchButton3D";
|
|
3
|
+
/**
|
|
4
|
+
* Class used to create an interactable object. It's a touchable 3D button using a mesh coming from the current scene
|
|
5
|
+
* @since 5.0.0
|
|
6
|
+
*/
|
|
7
|
+
var TouchMeshButton3D = /** @class */ (function (_super) {
|
|
8
|
+
__extends(TouchMeshButton3D, _super);
|
|
9
|
+
/**
|
|
10
|
+
* Creates a new 3D button based on a mesh
|
|
11
|
+
* @param mesh mesh to become a 3D button. By default this is also the mesh for near interaction collision checking
|
|
12
|
+
* @param name defines the control name
|
|
13
|
+
*/
|
|
14
|
+
function TouchMeshButton3D(mesh, name) {
|
|
15
|
+
var _this = _super.call(this, name, mesh) || this;
|
|
16
|
+
_this._currentMesh = mesh;
|
|
17
|
+
/**
|
|
18
|
+
* Provides a default behavior on hover/out & up/down
|
|
19
|
+
* Override those function to create your own desired behavior specific to your mesh
|
|
20
|
+
*/
|
|
21
|
+
_this.pointerEnterAnimation = function () {
|
|
22
|
+
if (!_this.mesh) {
|
|
23
|
+
return;
|
|
24
|
+
}
|
|
25
|
+
_this.mesh.scaling.scaleInPlace(1.1);
|
|
26
|
+
};
|
|
27
|
+
_this.pointerOutAnimation = function () {
|
|
28
|
+
if (!_this.mesh) {
|
|
29
|
+
return;
|
|
30
|
+
}
|
|
31
|
+
_this.mesh.scaling.scaleInPlace(1.0 / 1.1);
|
|
32
|
+
};
|
|
33
|
+
_this.pointerDownAnimation = function () {
|
|
34
|
+
if (!_this.mesh) {
|
|
35
|
+
return;
|
|
36
|
+
}
|
|
37
|
+
_this.mesh.scaling.scaleInPlace(0.95);
|
|
38
|
+
};
|
|
39
|
+
_this.pointerUpAnimation = function () {
|
|
40
|
+
if (!_this.mesh) {
|
|
41
|
+
return;
|
|
42
|
+
}
|
|
43
|
+
_this.mesh.scaling.scaleInPlace(1.0 / 0.95);
|
|
44
|
+
};
|
|
45
|
+
return _this;
|
|
46
|
+
}
|
|
47
|
+
TouchMeshButton3D.prototype._getTypeName = function () {
|
|
48
|
+
return "TouchMeshButton3D";
|
|
49
|
+
};
|
|
50
|
+
// Mesh association
|
|
51
|
+
TouchMeshButton3D.prototype._createNode = function () {
|
|
52
|
+
var _this = this;
|
|
53
|
+
this._currentMesh.getChildMeshes().forEach(function (mesh) {
|
|
54
|
+
_this._injectGUI3DReservedDataStore(mesh).control = _this;
|
|
55
|
+
});
|
|
56
|
+
return this._currentMesh;
|
|
57
|
+
};
|
|
58
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
59
|
+
TouchMeshButton3D.prototype._affectMaterial = function (mesh) { };
|
|
60
|
+
return TouchMeshButton3D;
|
|
61
|
+
}(TouchButton3D));
|
|
62
|
+
export { TouchMeshButton3D };
|
|
63
63
|
//# sourceMappingURL=touchMeshButton3D.js.map
|