@babylonjs/gui 5.19.0 → 5.22.0
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.js +70 -90
- package/2D/adtInstrumentation.js.map +1 -1
- package/2D/advancedDynamicTexture.d.ts +8 -0
- package/2D/advancedDynamicTexture.js +559 -620
- package/2D/advancedDynamicTexture.js.map +1 -1
- package/2D/controls/button.js +76 -90
- package/2D/controls/button.js.map +1 -1
- package/2D/controls/checkbox.js +86 -106
- package/2D/controls/checkbox.js.map +1 -1
- package/2D/controls/colorpicker.js +395 -415
- package/2D/controls/colorpicker.js.map +1 -1
- package/2D/controls/container.js +187 -230
- package/2D/controls/container.js.map +1 -1
- package/2D/controls/control.js +1073 -1353
- package/2D/controls/control.js.map +1 -1
- package/2D/controls/displayGrid.js +152 -196
- package/2D/controls/displayGrid.js.map +1 -1
- package/2D/controls/ellipse.js +32 -40
- package/2D/controls/ellipse.js.map +1 -1
- package/2D/controls/focusableButton.js +30 -35
- package/2D/controls/focusableButton.js.map +1 -1
- package/2D/controls/grid.js +172 -212
- package/2D/controls/grid.js.map +1 -1
- package/2D/controls/image.js +489 -592
- package/2D/controls/image.js.map +1 -1
- package/2D/controls/inputPassword.js +9 -16
- package/2D/controls/inputPassword.js.map +1 -1
- package/2D/controls/inputText.js +380 -467
- package/2D/controls/inputText.js.map +1 -1
- package/2D/controls/inputTextArea.js +234 -273
- package/2D/controls/inputTextArea.js.map +1 -1
- package/2D/controls/line.js +147 -198
- package/2D/controls/line.js.map +1 -1
- package/2D/controls/multiLine.js +87 -113
- package/2D/controls/multiLine.js.map +1 -1
- package/2D/controls/radioButton.js +106 -127
- package/2D/controls/radioButton.js.map +1 -1
- package/2D/controls/rectangle.js +64 -76
- package/2D/controls/rectangle.js.map +1 -1
- package/2D/controls/scrollViewers/scrollViewer.js +439 -543
- package/2D/controls/scrollViewers/scrollViewer.js.map +1 -1
- package/2D/controls/scrollViewers/scrollViewerWindow.js +99 -118
- package/2D/controls/scrollViewers/scrollViewerWindow.js.map +1 -1
- package/2D/controls/selector.js +241 -329
- package/2D/controls/selector.js.map +1 -1
- package/2D/controls/sliders/baseSlider.js +182 -230
- package/2D/controls/sliders/baseSlider.js.map +1 -1
- package/2D/controls/sliders/imageBasedSlider.js +86 -109
- package/2D/controls/sliders/imageBasedSlider.js.map +1 -1
- package/2D/controls/sliders/imageScrollBar.d.ts +4 -0
- package/2D/controls/sliders/imageScrollBar.js +149 -163
- package/2D/controls/sliders/imageScrollBar.js.map +1 -1
- package/2D/controls/sliders/scrollBar.d.ts +4 -0
- package/2D/controls/sliders/scrollBar.js +65 -65
- package/2D/controls/sliders/scrollBar.js.map +1 -1
- package/2D/controls/sliders/slider.js +91 -115
- package/2D/controls/sliders/slider.js.map +1 -1
- package/2D/controls/stackPanel.js +114 -135
- package/2D/controls/stackPanel.js.map +1 -1
- package/2D/controls/statics.js +5 -5
- package/2D/controls/statics.js.map +1 -1
- package/2D/controls/textBlock.js +322 -384
- package/2D/controls/textBlock.js.map +1 -1
- package/2D/controls/textWrapper.js +27 -41
- package/2D/controls/textWrapper.js.map +1 -1
- package/2D/controls/toggleButton.js +105 -121
- package/2D/controls/toggleButton.js.map +1 -1
- package/2D/controls/virtualKeyboard.js +101 -123
- package/2D/controls/virtualKeyboard.js.map +1 -1
- package/2D/math2D.js +62 -70
- package/2D/math2D.js.map +1 -1
- package/2D/measure.js +30 -32
- package/2D/measure.js.map +1 -1
- package/2D/multiLinePoint.js +71 -89
- package/2D/multiLinePoint.js.map +1 -1
- package/2D/style.js +55 -73
- package/2D/style.js.map +1 -1
- package/2D/valueAndUnit.js +71 -104
- package/2D/valueAndUnit.js.map +1 -1
- package/2D/xmlLoader.js +70 -84
- package/2D/xmlLoader.js.map +1 -1
- package/3D/behaviors/defaultBehavior.js +40 -59
- package/3D/behaviors/defaultBehavior.js.map +1 -1
- package/3D/controls/abstractButton3D.js +8 -12
- package/3D/controls/abstractButton3D.js.map +1 -1
- package/3D/controls/button3D.js +30 -35
- package/3D/controls/button3D.js.map +1 -1
- package/3D/controls/container3D.js +57 -71
- package/3D/controls/container3D.js.map +1 -1
- package/3D/controls/contentDisplay3D.js +47 -60
- package/3D/controls/contentDisplay3D.js.map +1 -1
- package/3D/controls/control3D.js +123 -158
- package/3D/controls/control3D.js.map +1 -1
- package/3D/controls/cylinderPanel.js +28 -38
- package/3D/controls/cylinderPanel.js.map +1 -1
- package/3D/controls/handMenu.js +20 -29
- package/3D/controls/handMenu.js.map +1 -1
- package/3D/controls/holographicBackplate.js +52 -72
- package/3D/controls/holographicBackplate.js.map +1 -1
- package/3D/controls/holographicButton.js +160 -200
- package/3D/controls/holographicButton.js.map +1 -1
- package/3D/controls/holographicSlate.js +176 -206
- package/3D/controls/holographicSlate.js.map +1 -1
- package/3D/controls/meshButton3D.js +24 -30
- package/3D/controls/meshButton3D.js.map +1 -1
- package/3D/controls/nearMenu.js +57 -71
- package/3D/controls/nearMenu.js.map +1 -1
- package/3D/controls/planePanel.js +6 -13
- package/3D/controls/planePanel.js.map +1 -1
- package/3D/controls/scatterPanel.js +43 -54
- package/3D/controls/scatterPanel.js.map +1 -1
- package/3D/controls/slider3D.js +168 -222
- package/3D/controls/slider3D.js.map +1 -1
- package/3D/controls/spherePanel.js +29 -39
- package/3D/controls/spherePanel.js.map +1 -1
- package/3D/controls/stackPanel3D.js +36 -49
- package/3D/controls/stackPanel3D.js.map +1 -1
- package/3D/controls/touchButton3D.js +126 -154
- package/3D/controls/touchButton3D.js.map +1 -1
- package/3D/controls/touchHolographicButton.js +223 -272
- package/3D/controls/touchHolographicButton.js.map +1 -1
- package/3D/controls/touchHolographicMenu.js +55 -66
- package/3D/controls/touchHolographicMenu.js.map +1 -1
- package/3D/controls/touchMeshButton3D.js +24 -30
- package/3D/controls/touchMeshButton3D.js.map +1 -1
- package/3D/controls/volumeBasedPanel.js +85 -107
- package/3D/controls/volumeBasedPanel.js.map +1 -1
- package/3D/gizmos/gizmoHandle.js +68 -103
- package/3D/gizmos/gizmoHandle.js.map +1 -1
- package/3D/gizmos/slateGizmo.js +165 -182
- package/3D/gizmos/slateGizmo.js.map +1 -1
- package/3D/gui3DManager.js +76 -101
- package/3D/gui3DManager.js.map +1 -1
- package/3D/materials/fluent/fluentMaterial.js +110 -119
- package/3D/materials/fluent/fluentMaterial.js.map +1 -1
- package/3D/materials/fluent/shaders/fluent.fragment.js +20 -3
- package/3D/materials/fluent/shaders/fluent.fragment.js.map +1 -1
- package/3D/materials/fluent/shaders/fluent.vertex.js +11 -3
- package/3D/materials/fluent/shaders/fluent.vertex.js.map +1 -1
- package/3D/materials/fluentBackplate/fluentBackplateMaterial.js +168 -177
- package/3D/materials/fluentBackplate/fluentBackplateMaterial.js.map +1 -1
- package/3D/materials/fluentBackplate/shaders/fluentBackplate.fragment.js +9 -3
- package/3D/materials/fluentBackplate/shaders/fluentBackplate.fragment.js.map +1 -1
- package/3D/materials/fluentBackplate/shaders/fluentBackplate.vertex.js +15 -3
- package/3D/materials/fluentBackplate/shaders/fluentBackplate.vertex.js.map +1 -1
- package/3D/materials/fluentButton/fluentButtonMaterial.js +205 -213
- package/3D/materials/fluentButton/fluentButtonMaterial.js.map +1 -1
- package/3D/materials/fluentButton/shaders/fluentButton.fragment.js +6 -3
- package/3D/materials/fluentButton/shaders/fluentButton.fragment.js.map +1 -1
- package/3D/materials/fluentButton/shaders/fluentButton.vertex.js +6 -3
- package/3D/materials/fluentButton/shaders/fluentButton.vertex.js.map +1 -1
- package/3D/materials/handle/handleMaterial.js +56 -69
- package/3D/materials/handle/handleMaterial.js.map +1 -1
- package/3D/materials/handle/shaders/handle.fragment.js +3 -3
- package/3D/materials/handle/shaders/handle.fragment.js.map +1 -1
- package/3D/materials/handle/shaders/handle.vertex.js +3 -3
- package/3D/materials/handle/shaders/handle.vertex.js.map +1 -1
- package/3D/materials/mrdl/mrdlBackplateMaterial.js +158 -166
- package/3D/materials/mrdl/mrdlBackplateMaterial.js.map +1 -1
- package/3D/materials/mrdl/mrdlSliderBarMaterial.js +322 -330
- package/3D/materials/mrdl/mrdlSliderBarMaterial.js.map +1 -1
- package/3D/materials/mrdl/mrdlSliderThumbMaterial.js +322 -330
- package/3D/materials/mrdl/mrdlSliderThumbMaterial.js.map +1 -1
- package/3D/materials/mrdl/shaders/mrdlBackplate.fragment.js +9 -3
- package/3D/materials/mrdl/shaders/mrdlBackplate.fragment.js.map +1 -1
- package/3D/materials/mrdl/shaders/mrdlBackplate.vertex.js +6 -3
- package/3D/materials/mrdl/shaders/mrdlBackplate.vertex.js.map +1 -1
- package/3D/materials/mrdl/shaders/mrdlSliderBar.fragment.js +24 -3
- package/3D/materials/mrdl/shaders/mrdlSliderBar.fragment.js.map +1 -1
- package/3D/materials/mrdl/shaders/mrdlSliderBar.vertex.js +12 -3
- package/3D/materials/mrdl/shaders/mrdlSliderBar.vertex.js.map +1 -1
- package/3D/materials/mrdl/shaders/mrdlSliderThumb.fragment.js +24 -3
- package/3D/materials/mrdl/shaders/mrdlSliderThumb.fragment.js.map +1 -1
- package/3D/materials/mrdl/shaders/mrdlSliderThumb.vertex.js +12 -3
- package/3D/materials/mrdl/shaders/mrdlSliderThumb.vertex.js.map +1 -1
- package/3D/vector3WithInfo.js +6 -12
- package/3D/vector3WithInfo.js.map +1 -1
- package/legacy/legacy.js +1 -1
- package/legacy/legacy.js.map +1 -1
- package/package.json +2 -5
|
@@ -1,6 +1,5 @@
|
|
|
1
|
-
import { __awaiter, __extends, __generator } from "tslib";
|
|
2
1
|
import { Observable } from "@babylonjs/core/Misc/observable.js";
|
|
3
|
-
import { Vector2, Vector3 } from "@babylonjs/core/Maths/math.vector.js";
|
|
2
|
+
import { Vector2, Vector3, TmpVectors } from "@babylonjs/core/Maths/math.vector.js";
|
|
4
3
|
import { Tools } from "@babylonjs/core/Misc/tools.js";
|
|
5
4
|
import { PointerEventTypes } from "@babylonjs/core/Events/pointerEvents.js";
|
|
6
5
|
import { ClipboardEventTypes, ClipboardInfo } from "@babylonjs/core/Events/clipboardEvents.js";
|
|
@@ -22,8 +21,7 @@ import { GetClass } from "@babylonjs/core/Misc/typeStore.js";
|
|
|
22
21
|
* Class used to create texture to support 2D GUI elements
|
|
23
22
|
* @see https://doc.babylonjs.com/how_to/gui
|
|
24
23
|
*/
|
|
25
|
-
|
|
26
|
-
__extends(AdvancedDynamicTexture, _super);
|
|
24
|
+
export class AdvancedDynamicTexture extends DynamicTexture {
|
|
27
25
|
/**
|
|
28
26
|
* Creates a new AdvancedDynamicTexture
|
|
29
27
|
* @param name defines the name of the texture
|
|
@@ -34,114 +32,111 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
|
|
|
34
32
|
* @param samplingMode defines the texture sampling mode (Texture.NEAREST_SAMPLINGMODE by default)
|
|
35
33
|
* @param invertY defines if the texture needs to be inverted on the y axis during loading (true by default)
|
|
36
34
|
*/
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
if (invertY === void 0) { invertY = true; }
|
|
43
|
-
var _this = _super.call(this, name, { width: width, height: height }, scene, generateMipMaps, samplingMode, Constants.TEXTUREFORMAT_RGBA, invertY) || this;
|
|
44
|
-
_this._isDirty = false;
|
|
35
|
+
constructor(name, width = 0, height = 0, scene, generateMipMaps = false, samplingMode = Texture.NEAREST_SAMPLINGMODE, invertY = true) {
|
|
36
|
+
super(name, { width: width, height: height }, scene, generateMipMaps, samplingMode, Constants.TEXTUREFORMAT_RGBA, invertY);
|
|
37
|
+
this._isDirty = false;
|
|
38
|
+
/** @hidden */
|
|
39
|
+
this._rootContainer = new Container("root");
|
|
45
40
|
/** @hidden */
|
|
46
|
-
|
|
41
|
+
this._lastControlOver = {};
|
|
47
42
|
/** @hidden */
|
|
48
|
-
|
|
43
|
+
this._lastControlDown = {};
|
|
49
44
|
/** @hidden */
|
|
50
|
-
|
|
45
|
+
this._capturingControl = {};
|
|
51
46
|
/** @hidden */
|
|
52
|
-
|
|
47
|
+
this._linkedControls = new Array();
|
|
48
|
+
this._isFullscreen = false;
|
|
49
|
+
this._fullscreenViewport = new Viewport(0, 0, 1, 1);
|
|
50
|
+
this._idealWidth = 0;
|
|
51
|
+
this._idealHeight = 0;
|
|
52
|
+
this._useSmallestIdeal = false;
|
|
53
|
+
this._renderAtIdealSize = false;
|
|
54
|
+
this._blockNextFocusCheck = false;
|
|
55
|
+
this._renderScale = 1;
|
|
56
|
+
this._cursorChanged = false;
|
|
57
|
+
this._defaultMousePointerId = 0;
|
|
53
58
|
/** @hidden */
|
|
54
|
-
|
|
55
|
-
_this._isFullscreen = false;
|
|
56
|
-
_this._fullscreenViewport = new Viewport(0, 0, 1, 1);
|
|
57
|
-
_this._idealWidth = 0;
|
|
58
|
-
_this._idealHeight = 0;
|
|
59
|
-
_this._useSmallestIdeal = false;
|
|
60
|
-
_this._renderAtIdealSize = false;
|
|
61
|
-
_this._blockNextFocusCheck = false;
|
|
62
|
-
_this._renderScale = 1;
|
|
63
|
-
_this._cursorChanged = false;
|
|
64
|
-
_this._defaultMousePointerId = 0;
|
|
59
|
+
this._capturedPointerIds = new Set();
|
|
65
60
|
/** @hidden */
|
|
66
|
-
|
|
61
|
+
this._numLayoutCalls = 0;
|
|
67
62
|
/** @hidden */
|
|
68
|
-
|
|
63
|
+
this._numRenderCalls = 0;
|
|
69
64
|
/**
|
|
70
65
|
* Define type to string to ensure compatibility across browsers
|
|
71
66
|
* Safari doesn't support DataTransfer constructor
|
|
72
67
|
*/
|
|
73
|
-
|
|
68
|
+
this._clipboardData = "";
|
|
74
69
|
/**
|
|
75
70
|
* Observable event triggered each time an clipboard event is received from the rendering canvas
|
|
76
71
|
*/
|
|
77
|
-
|
|
72
|
+
this.onClipboardObservable = new Observable();
|
|
78
73
|
/**
|
|
79
74
|
* Observable event triggered each time a pointer down is intercepted by a control
|
|
80
75
|
*/
|
|
81
|
-
|
|
76
|
+
this.onControlPickedObservable = new Observable();
|
|
82
77
|
/**
|
|
83
78
|
* Observable event triggered before layout is evaluated
|
|
84
79
|
*/
|
|
85
|
-
|
|
80
|
+
this.onBeginLayoutObservable = new Observable();
|
|
86
81
|
/**
|
|
87
82
|
* Observable event triggered after the layout was evaluated
|
|
88
83
|
*/
|
|
89
|
-
|
|
84
|
+
this.onEndLayoutObservable = new Observable();
|
|
90
85
|
/**
|
|
91
86
|
* Observable event triggered before the texture is rendered
|
|
92
87
|
*/
|
|
93
|
-
|
|
88
|
+
this.onBeginRenderObservable = new Observable();
|
|
94
89
|
/**
|
|
95
90
|
* Observable event triggered after the texture was rendered
|
|
96
91
|
*/
|
|
97
|
-
|
|
92
|
+
this.onEndRenderObservable = new Observable();
|
|
98
93
|
/**
|
|
99
94
|
* Gets or sets a boolean defining if alpha is stored as premultiplied
|
|
100
95
|
*/
|
|
101
|
-
|
|
96
|
+
this.premulAlpha = false;
|
|
102
97
|
/**
|
|
103
98
|
* Gets or sets a boolean indicating that the canvas must be reverted on Y when updating the texture
|
|
104
99
|
*/
|
|
105
|
-
|
|
100
|
+
this.applyYInversionOnUpdate = true;
|
|
106
101
|
/**
|
|
107
102
|
* If set to true, every scene render will trigger a pointer event for the GUI
|
|
108
103
|
* if it is linked to a mesh or has controls linked to a mesh. This will allow
|
|
109
104
|
* you to catch the pointer moving around the GUI due to camera or mesh movements,
|
|
110
105
|
* but it has a performance cost.
|
|
111
106
|
*/
|
|
112
|
-
|
|
113
|
-
|
|
107
|
+
this.checkPointerEveryFrame = false;
|
|
108
|
+
this._useInvalidateRectOptimization = true;
|
|
114
109
|
// Invalidated rectangle which is the combination of all invalidated controls after they have been rotated into absolute position
|
|
115
|
-
|
|
116
|
-
|
|
110
|
+
this._invalidatedRectangle = null;
|
|
111
|
+
this._clearMeasure = new Measure(0, 0, 0, 0);
|
|
117
112
|
/**
|
|
118
113
|
* @param rawEvt
|
|
119
114
|
* @hidden
|
|
120
115
|
*/
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
116
|
+
this._onClipboardCopy = (rawEvt) => {
|
|
117
|
+
const evt = rawEvt;
|
|
118
|
+
const ev = new ClipboardInfo(ClipboardEventTypes.COPY, evt);
|
|
119
|
+
this.onClipboardObservable.notifyObservers(ev);
|
|
125
120
|
evt.preventDefault();
|
|
126
121
|
};
|
|
127
122
|
/**
|
|
128
123
|
* @param rawEvt
|
|
129
124
|
* @hidden
|
|
130
125
|
*/
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
126
|
+
this._onClipboardCut = (rawEvt) => {
|
|
127
|
+
const evt = rawEvt;
|
|
128
|
+
const ev = new ClipboardInfo(ClipboardEventTypes.CUT, evt);
|
|
129
|
+
this.onClipboardObservable.notifyObservers(ev);
|
|
135
130
|
evt.preventDefault();
|
|
136
131
|
};
|
|
137
132
|
/**
|
|
138
133
|
* @param rawEvt
|
|
139
134
|
* @hidden
|
|
140
135
|
*/
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
136
|
+
this._onClipboardPaste = (rawEvt) => {
|
|
137
|
+
const evt = rawEvt;
|
|
138
|
+
const ev = new ClipboardInfo(ClipboardEventTypes.PASTE, evt);
|
|
139
|
+
this.onClipboardObservable.notifyObservers(ev);
|
|
145
140
|
evt.preventDefault();
|
|
146
141
|
};
|
|
147
142
|
/**
|
|
@@ -150,340 +145,278 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
|
|
|
150
145
|
* @param scaleToSize defines whether to scale to texture to the saved size
|
|
151
146
|
* @deprecated Please use parseSerializedObject instead
|
|
152
147
|
*/
|
|
153
|
-
|
|
154
|
-
scene =
|
|
155
|
-
if (!scene || !
|
|
156
|
-
return
|
|
157
|
-
}
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
if (!
|
|
148
|
+
this.parseContent = this.parseSerializedObject;
|
|
149
|
+
scene = this.getScene();
|
|
150
|
+
if (!scene || !this._texture) {
|
|
151
|
+
return;
|
|
152
|
+
}
|
|
153
|
+
this.applyYInversionOnUpdate = invertY;
|
|
154
|
+
this._rootElement = scene.getEngine().getInputElement();
|
|
155
|
+
this._renderObserver = scene.onBeforeCameraRenderObservable.add((camera) => this._checkUpdate(camera));
|
|
156
|
+
this._preKeyboardObserver = scene.onPreKeyboardObservable.add((info) => {
|
|
157
|
+
if (!this._focusedControl) {
|
|
163
158
|
return;
|
|
164
159
|
}
|
|
165
160
|
if (info.type === KeyboardEventTypes.KEYDOWN) {
|
|
166
|
-
|
|
161
|
+
this._focusedControl.processKeyboard(info.event);
|
|
167
162
|
}
|
|
168
163
|
info.skipOnPointerObservable = true;
|
|
169
164
|
});
|
|
170
|
-
|
|
171
|
-
|
|
165
|
+
this._rootContainer._link(this);
|
|
166
|
+
this.hasAlpha = true;
|
|
172
167
|
if (!width || !height) {
|
|
173
|
-
|
|
174
|
-
_this._onResize();
|
|
175
|
-
}
|
|
176
|
-
_this._texture.isReady = true;
|
|
177
|
-
return _this;
|
|
178
|
-
}
|
|
179
|
-
Object.defineProperty(AdvancedDynamicTexture.prototype, "numLayoutCalls", {
|
|
180
|
-
/** Gets the number of layout calls made the last time the ADT has been rendered */
|
|
181
|
-
get: function () {
|
|
182
|
-
return this._numLayoutCalls;
|
|
183
|
-
},
|
|
184
|
-
enumerable: false,
|
|
185
|
-
configurable: true
|
|
186
|
-
});
|
|
187
|
-
Object.defineProperty(AdvancedDynamicTexture.prototype, "numRenderCalls", {
|
|
188
|
-
/** Gets the number of render calls made the last time the ADT has been rendered */
|
|
189
|
-
get: function () {
|
|
190
|
-
return this._numRenderCalls;
|
|
191
|
-
},
|
|
192
|
-
enumerable: false,
|
|
193
|
-
configurable: true
|
|
194
|
-
});
|
|
195
|
-
Object.defineProperty(AdvancedDynamicTexture.prototype, "renderScale", {
|
|
196
|
-
/**
|
|
197
|
-
* Gets or sets a number used to scale rendering size (2 means that the texture will be twice bigger).
|
|
198
|
-
* Useful when you want more antialiasing
|
|
199
|
-
*/
|
|
200
|
-
get: function () {
|
|
201
|
-
return this._renderScale;
|
|
202
|
-
},
|
|
203
|
-
set: function (value) {
|
|
204
|
-
if (value === this._renderScale) {
|
|
205
|
-
return;
|
|
206
|
-
}
|
|
207
|
-
this._renderScale = value;
|
|
168
|
+
this._resizeObserver = scene.getEngine().onResizeObservable.add(() => this._onResize());
|
|
208
169
|
this._onResize();
|
|
209
|
-
}
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
return
|
|
256
|
-
}
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
});
|
|
345
|
-
Object.defineProperty(AdvancedDynamicTexture.prototype, "rootContainer", {
|
|
346
|
-
/**
|
|
347
|
-
* Gets the root container control
|
|
348
|
-
*/
|
|
349
|
-
get: function () {
|
|
350
|
-
return this._rootContainer;
|
|
351
|
-
},
|
|
352
|
-
enumerable: false,
|
|
353
|
-
configurable: true
|
|
354
|
-
});
|
|
170
|
+
}
|
|
171
|
+
this._texture.isReady = true;
|
|
172
|
+
}
|
|
173
|
+
/** Gets the number of layout calls made the last time the ADT has been rendered */
|
|
174
|
+
get numLayoutCalls() {
|
|
175
|
+
return this._numLayoutCalls;
|
|
176
|
+
}
|
|
177
|
+
/** Gets the number of render calls made the last time the ADT has been rendered */
|
|
178
|
+
get numRenderCalls() {
|
|
179
|
+
return this._numRenderCalls;
|
|
180
|
+
}
|
|
181
|
+
/**
|
|
182
|
+
* Gets or sets a number used to scale rendering size (2 means that the texture will be twice bigger).
|
|
183
|
+
* Useful when you want more antialiasing
|
|
184
|
+
*/
|
|
185
|
+
get renderScale() {
|
|
186
|
+
return this._renderScale;
|
|
187
|
+
}
|
|
188
|
+
set renderScale(value) {
|
|
189
|
+
if (value === this._renderScale) {
|
|
190
|
+
return;
|
|
191
|
+
}
|
|
192
|
+
this._renderScale = value;
|
|
193
|
+
this._onResize();
|
|
194
|
+
}
|
|
195
|
+
/** Gets or sets the background color */
|
|
196
|
+
get background() {
|
|
197
|
+
return this._background;
|
|
198
|
+
}
|
|
199
|
+
set background(value) {
|
|
200
|
+
if (this._background === value) {
|
|
201
|
+
return;
|
|
202
|
+
}
|
|
203
|
+
this._background = value;
|
|
204
|
+
this.markAsDirty();
|
|
205
|
+
}
|
|
206
|
+
/**
|
|
207
|
+
* Gets or sets the ideal width used to design controls.
|
|
208
|
+
* The GUI will then rescale everything accordingly
|
|
209
|
+
* @see https://doc.babylonjs.com/how_to/gui#adaptive-scaling
|
|
210
|
+
*/
|
|
211
|
+
get idealWidth() {
|
|
212
|
+
return this._idealWidth;
|
|
213
|
+
}
|
|
214
|
+
set idealWidth(value) {
|
|
215
|
+
if (this._idealWidth === value) {
|
|
216
|
+
return;
|
|
217
|
+
}
|
|
218
|
+
this._idealWidth = value;
|
|
219
|
+
this.markAsDirty();
|
|
220
|
+
this._rootContainer._markAllAsDirty();
|
|
221
|
+
}
|
|
222
|
+
/**
|
|
223
|
+
* Gets or sets the ideal height used to design controls.
|
|
224
|
+
* The GUI will then rescale everything accordingly
|
|
225
|
+
* @see https://doc.babylonjs.com/how_to/gui#adaptive-scaling
|
|
226
|
+
*/
|
|
227
|
+
get idealHeight() {
|
|
228
|
+
return this._idealHeight;
|
|
229
|
+
}
|
|
230
|
+
set idealHeight(value) {
|
|
231
|
+
if (this._idealHeight === value) {
|
|
232
|
+
return;
|
|
233
|
+
}
|
|
234
|
+
this._idealHeight = value;
|
|
235
|
+
this.markAsDirty();
|
|
236
|
+
this._rootContainer._markAllAsDirty();
|
|
237
|
+
}
|
|
238
|
+
/**
|
|
239
|
+
* Gets or sets a boolean indicating if the smallest ideal value must be used if idealWidth and idealHeight are both set
|
|
240
|
+
* @see https://doc.babylonjs.com/how_to/gui#adaptive-scaling
|
|
241
|
+
*/
|
|
242
|
+
get useSmallestIdeal() {
|
|
243
|
+
return this._useSmallestIdeal;
|
|
244
|
+
}
|
|
245
|
+
set useSmallestIdeal(value) {
|
|
246
|
+
if (this._useSmallestIdeal === value) {
|
|
247
|
+
return;
|
|
248
|
+
}
|
|
249
|
+
this._useSmallestIdeal = value;
|
|
250
|
+
this.markAsDirty();
|
|
251
|
+
this._rootContainer._markAllAsDirty();
|
|
252
|
+
}
|
|
253
|
+
/**
|
|
254
|
+
* Gets or sets a boolean indicating if adaptive scaling must be used
|
|
255
|
+
* @see https://doc.babylonjs.com/how_to/gui#adaptive-scaling
|
|
256
|
+
*/
|
|
257
|
+
get renderAtIdealSize() {
|
|
258
|
+
return this._renderAtIdealSize;
|
|
259
|
+
}
|
|
260
|
+
set renderAtIdealSize(value) {
|
|
261
|
+
if (this._renderAtIdealSize === value) {
|
|
262
|
+
return;
|
|
263
|
+
}
|
|
264
|
+
this._renderAtIdealSize = value;
|
|
265
|
+
this._onResize();
|
|
266
|
+
}
|
|
267
|
+
/**
|
|
268
|
+
* Gets the ratio used when in "ideal mode"
|
|
269
|
+
* @see https://doc.babylonjs.com/how_to/gui#adaptive-scaling
|
|
270
|
+
* */
|
|
271
|
+
get idealRatio() {
|
|
272
|
+
let rwidth = 0;
|
|
273
|
+
let rheight = 0;
|
|
274
|
+
if (this._idealWidth) {
|
|
275
|
+
rwidth = this.getSize().width / this._idealWidth;
|
|
276
|
+
}
|
|
277
|
+
if (this._idealHeight) {
|
|
278
|
+
rheight = this.getSize().height / this._idealHeight;
|
|
279
|
+
}
|
|
280
|
+
if (this._useSmallestIdeal && this._idealWidth && this._idealHeight) {
|
|
281
|
+
return window.innerWidth < window.innerHeight ? rwidth : rheight;
|
|
282
|
+
}
|
|
283
|
+
if (this._idealWidth) {
|
|
284
|
+
// horizontal
|
|
285
|
+
return rwidth;
|
|
286
|
+
}
|
|
287
|
+
if (this._idealHeight) {
|
|
288
|
+
// vertical
|
|
289
|
+
return rheight;
|
|
290
|
+
}
|
|
291
|
+
return 1;
|
|
292
|
+
}
|
|
293
|
+
/**
|
|
294
|
+
* Gets the underlying layer used to render the texture when in fullscreen mode
|
|
295
|
+
*/
|
|
296
|
+
get layer() {
|
|
297
|
+
return this._layerToDispose;
|
|
298
|
+
}
|
|
299
|
+
/**
|
|
300
|
+
* Gets the root container control
|
|
301
|
+
*/
|
|
302
|
+
get rootContainer() {
|
|
303
|
+
return this._rootContainer;
|
|
304
|
+
}
|
|
355
305
|
/**
|
|
356
306
|
* Returns an array containing the root container.
|
|
357
307
|
* This is mostly used to let the Inspector introspects the ADT
|
|
358
308
|
* @returns an array containing the rootContainer
|
|
359
309
|
*/
|
|
360
|
-
|
|
310
|
+
getChildren() {
|
|
361
311
|
return [this._rootContainer];
|
|
362
|
-
}
|
|
312
|
+
}
|
|
363
313
|
/**
|
|
364
314
|
* Will return all controls that are inside this texture
|
|
365
315
|
* @param directDescendantsOnly defines if true only direct descendants of 'this' will be considered, if false direct and also indirect (children of children, an so on in a recursive manner) descendants of 'this' will be considered
|
|
366
316
|
* @param predicate defines an optional predicate that will be called on every evaluated child, the predicate must return true for a given child to be part of the result, otherwise it will be ignored
|
|
367
317
|
* @return all child controls
|
|
368
318
|
*/
|
|
369
|
-
|
|
319
|
+
getDescendants(directDescendantsOnly, predicate) {
|
|
370
320
|
return this._rootContainer.getDescendants(directDescendantsOnly, predicate);
|
|
371
|
-
}
|
|
321
|
+
}
|
|
372
322
|
/**
|
|
373
323
|
* Will return all controls with the given type name
|
|
374
324
|
* @param typeName defines the type name to search for
|
|
375
325
|
* @returns an array of all controls found
|
|
376
326
|
*/
|
|
377
|
-
|
|
378
|
-
return this._rootContainer.getDescendants(false,
|
|
379
|
-
}
|
|
327
|
+
getControlsByType(typeName) {
|
|
328
|
+
return this._rootContainer.getDescendants(false, (control) => control.typeName === typeName);
|
|
329
|
+
}
|
|
380
330
|
/**
|
|
381
331
|
* Will return the first control with the given name
|
|
382
332
|
* @param name defines the name to search for
|
|
383
333
|
* @return the first control found or null
|
|
384
334
|
*/
|
|
385
|
-
|
|
335
|
+
getControlByName(name) {
|
|
386
336
|
return this._getControlByKey("name", name);
|
|
387
|
-
}
|
|
388
|
-
|
|
389
|
-
return this._rootContainer.getDescendants().find(
|
|
390
|
-
}
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
395
|
-
|
|
396
|
-
|
|
397
|
-
|
|
398
|
-
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
|
|
420
|
-
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
|
|
424
|
-
|
|
425
|
-
|
|
426
|
-
|
|
427
|
-
|
|
428
|
-
|
|
429
|
-
|
|
430
|
-
|
|
431
|
-
|
|
432
|
-
|
|
433
|
-
|
|
434
|
-
|
|
435
|
-
|
|
436
|
-
/**
|
|
437
|
-
* Gets or set information about clipboardData
|
|
438
|
-
*/
|
|
439
|
-
get: function () {
|
|
440
|
-
return this._clipboardData;
|
|
441
|
-
},
|
|
442
|
-
set: function (value) {
|
|
443
|
-
this._clipboardData = value;
|
|
444
|
-
},
|
|
445
|
-
enumerable: false,
|
|
446
|
-
configurable: true
|
|
447
|
-
});
|
|
337
|
+
}
|
|
338
|
+
_getControlByKey(key, value) {
|
|
339
|
+
return this._rootContainer.getDescendants().find((control) => control[key] === value) || null;
|
|
340
|
+
}
|
|
341
|
+
/**
|
|
342
|
+
* Gets or sets the current focused control
|
|
343
|
+
*/
|
|
344
|
+
get focusedControl() {
|
|
345
|
+
return this._focusedControl;
|
|
346
|
+
}
|
|
347
|
+
set focusedControl(control) {
|
|
348
|
+
if (this._focusedControl == control) {
|
|
349
|
+
return;
|
|
350
|
+
}
|
|
351
|
+
if (this._focusedControl) {
|
|
352
|
+
this._focusedControl.onBlur();
|
|
353
|
+
}
|
|
354
|
+
if (control) {
|
|
355
|
+
control.onFocus();
|
|
356
|
+
}
|
|
357
|
+
this._focusedControl = control;
|
|
358
|
+
}
|
|
359
|
+
/**
|
|
360
|
+
* Gets or sets a boolean indicating if the texture must be rendered in background or foreground when in fullscreen mode
|
|
361
|
+
*/
|
|
362
|
+
get isForeground() {
|
|
363
|
+
if (!this.layer) {
|
|
364
|
+
return true;
|
|
365
|
+
}
|
|
366
|
+
return !this.layer.isBackground;
|
|
367
|
+
}
|
|
368
|
+
set isForeground(value) {
|
|
369
|
+
if (!this.layer) {
|
|
370
|
+
return;
|
|
371
|
+
}
|
|
372
|
+
if (this.layer.isBackground === !value) {
|
|
373
|
+
return;
|
|
374
|
+
}
|
|
375
|
+
this.layer.isBackground = !value;
|
|
376
|
+
}
|
|
377
|
+
/**
|
|
378
|
+
* Gets or set information about clipboardData
|
|
379
|
+
*/
|
|
380
|
+
get clipboardData() {
|
|
381
|
+
return this._clipboardData;
|
|
382
|
+
}
|
|
383
|
+
set clipboardData(value) {
|
|
384
|
+
this._clipboardData = value;
|
|
385
|
+
}
|
|
448
386
|
/**
|
|
449
387
|
* Get the current class name of the texture useful for serialization or dynamic coding.
|
|
450
388
|
* @returns "AdvancedDynamicTexture"
|
|
451
389
|
*/
|
|
452
|
-
|
|
390
|
+
getClassName() {
|
|
453
391
|
return "AdvancedDynamicTexture";
|
|
454
|
-
}
|
|
392
|
+
}
|
|
455
393
|
/**
|
|
456
394
|
* Function used to execute a function on all controls
|
|
457
395
|
* @param func defines the function to execute
|
|
458
396
|
* @param container defines the container where controls belong. If null the root container will be used
|
|
459
397
|
*/
|
|
460
|
-
|
|
398
|
+
executeOnAllControls(func, container) {
|
|
461
399
|
if (!container) {
|
|
462
400
|
container = this._rootContainer;
|
|
463
401
|
}
|
|
464
402
|
func(container);
|
|
465
|
-
for (
|
|
466
|
-
var child = _a[_i];
|
|
403
|
+
for (const child of container.children) {
|
|
467
404
|
if (child.children) {
|
|
468
405
|
this.executeOnAllControls(func, child);
|
|
469
406
|
continue;
|
|
470
407
|
}
|
|
471
408
|
func(child);
|
|
472
409
|
}
|
|
473
|
-
}
|
|
474
|
-
|
|
475
|
-
|
|
476
|
-
|
|
477
|
-
|
|
478
|
-
|
|
479
|
-
|
|
480
|
-
|
|
481
|
-
|
|
482
|
-
|
|
483
|
-
},
|
|
484
|
-
enumerable: false,
|
|
485
|
-
configurable: true
|
|
486
|
-
});
|
|
410
|
+
}
|
|
411
|
+
/**
|
|
412
|
+
* Gets or sets a boolean indicating if the InvalidateRect optimization should be turned on
|
|
413
|
+
*/
|
|
414
|
+
get useInvalidateRectOptimization() {
|
|
415
|
+
return this._useInvalidateRectOptimization;
|
|
416
|
+
}
|
|
417
|
+
set useInvalidateRectOptimization(value) {
|
|
418
|
+
this._useInvalidateRectOptimization = value;
|
|
419
|
+
}
|
|
487
420
|
/**
|
|
488
421
|
* Invalidates a rectangle area on the gui texture
|
|
489
422
|
* @param invalidMinX left most position of the rectangle to invalidate in the texture
|
|
@@ -491,7 +424,7 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
|
|
|
491
424
|
* @param invalidMaxX right most position of the rectangle to invalidate in the texture
|
|
492
425
|
* @param invalidMaxY bottom most position of the rectangle to invalidate in the texture
|
|
493
426
|
*/
|
|
494
|
-
|
|
427
|
+
invalidateRect(invalidMinX, invalidMinY, invalidMaxX, invalidMaxY) {
|
|
495
428
|
if (!this._useInvalidateRectOptimization) {
|
|
496
429
|
return;
|
|
497
430
|
}
|
|
@@ -500,46 +433,46 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
|
|
|
500
433
|
}
|
|
501
434
|
else {
|
|
502
435
|
// Compute intersection
|
|
503
|
-
|
|
504
|
-
|
|
436
|
+
const maxX = Math.ceil(Math.max(this._invalidatedRectangle.left + this._invalidatedRectangle.width - 1, invalidMaxX));
|
|
437
|
+
const maxY = Math.ceil(Math.max(this._invalidatedRectangle.top + this._invalidatedRectangle.height - 1, invalidMaxY));
|
|
505
438
|
this._invalidatedRectangle.left = Math.floor(Math.min(this._invalidatedRectangle.left, invalidMinX));
|
|
506
439
|
this._invalidatedRectangle.top = Math.floor(Math.min(this._invalidatedRectangle.top, invalidMinY));
|
|
507
440
|
this._invalidatedRectangle.width = maxX - this._invalidatedRectangle.left + 1;
|
|
508
441
|
this._invalidatedRectangle.height = maxY - this._invalidatedRectangle.top + 1;
|
|
509
442
|
}
|
|
510
|
-
}
|
|
443
|
+
}
|
|
511
444
|
/**
|
|
512
445
|
* Marks the texture as dirty forcing a complete update
|
|
513
446
|
*/
|
|
514
|
-
|
|
447
|
+
markAsDirty() {
|
|
515
448
|
this._isDirty = true;
|
|
516
|
-
}
|
|
449
|
+
}
|
|
517
450
|
/**
|
|
518
451
|
* Helper function used to create a new style
|
|
519
452
|
* @returns a new style
|
|
520
453
|
* @see https://doc.babylonjs.com/how_to/gui#styles
|
|
521
454
|
*/
|
|
522
|
-
|
|
455
|
+
createStyle() {
|
|
523
456
|
return new Style(this);
|
|
524
|
-
}
|
|
457
|
+
}
|
|
525
458
|
/**
|
|
526
459
|
* Adds a new control to the root container
|
|
527
460
|
* @param control defines the control to add
|
|
528
461
|
* @returns the current texture
|
|
529
462
|
*/
|
|
530
|
-
|
|
463
|
+
addControl(control) {
|
|
531
464
|
this._rootContainer.addControl(control);
|
|
532
465
|
return this;
|
|
533
|
-
}
|
|
466
|
+
}
|
|
534
467
|
/**
|
|
535
468
|
* Removes a control from the root container
|
|
536
469
|
* @param control defines the control to remove
|
|
537
470
|
* @returns the current texture
|
|
538
471
|
*/
|
|
539
|
-
|
|
472
|
+
removeControl(control) {
|
|
540
473
|
this._rootContainer.removeControl(control);
|
|
541
474
|
return this;
|
|
542
|
-
}
|
|
475
|
+
}
|
|
543
476
|
/**
|
|
544
477
|
* Moves overlapped controls towards a position where it is not overlapping anymore.
|
|
545
478
|
* Please note that this method alters linkOffsetXInPixels and linkOffsetYInPixels.
|
|
@@ -547,28 +480,25 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
|
|
|
547
480
|
* @param deltaStep the step size (speed) to reach the target non overlapping position (default 0.1)
|
|
548
481
|
* @param repelFactor how much is the control repelled by other controls
|
|
549
482
|
*/
|
|
550
|
-
|
|
551
|
-
|
|
552
|
-
if (repelFactor === void 0) { repelFactor = 1; }
|
|
553
|
-
var controlsForGroup;
|
|
483
|
+
moveToNonOverlappedPosition(overlapGroup, deltaStep = 1, repelFactor = 1) {
|
|
484
|
+
let controlsForGroup;
|
|
554
485
|
if (Array.isArray(overlapGroup)) {
|
|
555
486
|
controlsForGroup = overlapGroup;
|
|
556
487
|
}
|
|
557
488
|
else {
|
|
558
|
-
|
|
489
|
+
const descendants = this.getDescendants(true);
|
|
559
490
|
// get only the controls with an overlapGroup property set
|
|
560
491
|
// if the overlapGroup parameter is set, filter the controls and get only the controls belonging to that overlapGroup
|
|
561
|
-
controlsForGroup = overlapGroup === undefined ? descendants.filter(
|
|
492
|
+
controlsForGroup = overlapGroup === undefined ? descendants.filter((c) => c.overlapGroup !== undefined) : descendants.filter((c) => c.overlapGroup === overlapGroup);
|
|
562
493
|
}
|
|
563
|
-
controlsForGroup.forEach(
|
|
564
|
-
|
|
565
|
-
|
|
566
|
-
|
|
567
|
-
controlsForGroup.forEach(function (control2) {
|
|
494
|
+
controlsForGroup.forEach((control1) => {
|
|
495
|
+
let velocity = Vector2.Zero();
|
|
496
|
+
const center = new Vector2(control1.centerX, control1.centerY);
|
|
497
|
+
controlsForGroup.forEach((control2) => {
|
|
568
498
|
if (control1 !== control2 && AdvancedDynamicTexture._Overlaps(control1, control2)) {
|
|
569
499
|
// if the two controls overlaps get a direction vector from one control's center to another control's center
|
|
570
|
-
|
|
571
|
-
|
|
500
|
+
const diff = center.subtract(new Vector2(control2.centerX, control2.centerY));
|
|
501
|
+
const diffLength = diff.length();
|
|
572
502
|
if (diffLength > 0) {
|
|
573
503
|
// calculate the velocity
|
|
574
504
|
velocity = velocity.add(diff.normalize().scale(repelFactor / diffLength));
|
|
@@ -577,17 +507,17 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
|
|
|
577
507
|
});
|
|
578
508
|
if (velocity.length() > 0) {
|
|
579
509
|
// move the control along the direction vector away from the overlapping control
|
|
580
|
-
velocity = velocity.normalize().scale(deltaStep * (
|
|
510
|
+
velocity = velocity.normalize().scale(deltaStep * (control1.overlapDeltaMultiplier ?? 1));
|
|
581
511
|
control1.linkOffsetXInPixels += velocity.x;
|
|
582
512
|
control1.linkOffsetYInPixels += velocity.y;
|
|
583
513
|
}
|
|
584
514
|
});
|
|
585
|
-
}
|
|
515
|
+
}
|
|
586
516
|
/**
|
|
587
517
|
* Release all resources
|
|
588
518
|
*/
|
|
589
|
-
|
|
590
|
-
|
|
519
|
+
dispose() {
|
|
520
|
+
const scene = this.getScene();
|
|
591
521
|
if (!scene) {
|
|
592
522
|
return;
|
|
593
523
|
}
|
|
@@ -626,18 +556,18 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
|
|
|
626
556
|
this.onEndRenderObservable.clear();
|
|
627
557
|
this.onBeginLayoutObservable.clear();
|
|
628
558
|
this.onEndLayoutObservable.clear();
|
|
629
|
-
|
|
630
|
-
}
|
|
631
|
-
|
|
632
|
-
|
|
559
|
+
super.dispose();
|
|
560
|
+
}
|
|
561
|
+
_onResize() {
|
|
562
|
+
const scene = this.getScene();
|
|
633
563
|
if (!scene) {
|
|
634
564
|
return;
|
|
635
565
|
}
|
|
636
566
|
// Check size
|
|
637
|
-
|
|
638
|
-
|
|
639
|
-
|
|
640
|
-
|
|
567
|
+
const engine = scene.getEngine();
|
|
568
|
+
const textureSize = this.getSize();
|
|
569
|
+
let renderWidth = engine.getRenderWidth() * this._renderScale;
|
|
570
|
+
let renderHeight = engine.getRenderHeight() * this._renderScale;
|
|
641
571
|
if (this._renderAtIdealSize) {
|
|
642
572
|
if (this._idealWidth) {
|
|
643
573
|
renderHeight = (renderHeight * this._idealWidth) / renderWidth;
|
|
@@ -656,79 +586,75 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
|
|
|
656
586
|
}
|
|
657
587
|
}
|
|
658
588
|
this.invalidateRect(0, 0, textureSize.width - 1, textureSize.height - 1);
|
|
659
|
-
}
|
|
589
|
+
}
|
|
660
590
|
/** @hidden */
|
|
661
|
-
|
|
662
|
-
|
|
663
|
-
|
|
664
|
-
|
|
665
|
-
|
|
591
|
+
_getGlobalViewport() {
|
|
592
|
+
const size = this.getSize();
|
|
593
|
+
const globalViewPort = this._fullscreenViewport.toGlobal(size.width, size.height);
|
|
594
|
+
const targetX = Math.round(globalViewPort.width * (1 / this.rootContainer.scaleX));
|
|
595
|
+
const targetY = Math.round(globalViewPort.height * (1 / this.rootContainer.scaleY));
|
|
666
596
|
globalViewPort.x += (globalViewPort.width - targetX) / 2;
|
|
667
597
|
globalViewPort.y += (globalViewPort.height - targetY) / 2;
|
|
668
598
|
globalViewPort.width = targetX;
|
|
669
599
|
globalViewPort.height = targetY;
|
|
670
600
|
return globalViewPort;
|
|
671
|
-
}
|
|
601
|
+
}
|
|
672
602
|
/**
|
|
673
603
|
* Get screen coordinates for a vector3
|
|
674
604
|
* @param position defines the position to project
|
|
675
605
|
* @param worldMatrix defines the world matrix to use
|
|
676
606
|
* @returns the projected position
|
|
677
607
|
*/
|
|
678
|
-
|
|
679
|
-
|
|
608
|
+
getProjectedPosition(position, worldMatrix) {
|
|
609
|
+
const result = this.getProjectedPositionWithZ(position, worldMatrix);
|
|
680
610
|
return new Vector2(result.x, result.y);
|
|
681
|
-
}
|
|
611
|
+
}
|
|
682
612
|
/**
|
|
683
613
|
* Get screen coordinates for a vector3
|
|
684
614
|
* @param position defines the position to project
|
|
685
615
|
* @param worldMatrix defines the world matrix to use
|
|
686
616
|
* @returns the projected position with Z
|
|
687
617
|
*/
|
|
688
|
-
|
|
689
|
-
|
|
618
|
+
getProjectedPositionWithZ(position, worldMatrix) {
|
|
619
|
+
const scene = this.getScene();
|
|
690
620
|
if (!scene) {
|
|
691
621
|
return Vector3.Zero();
|
|
692
622
|
}
|
|
693
|
-
|
|
694
|
-
|
|
623
|
+
const globalViewport = this._getGlobalViewport();
|
|
624
|
+
const projectedPosition = Vector3.Project(position, worldMatrix, scene.getTransformMatrix(), globalViewport);
|
|
695
625
|
return new Vector3(projectedPosition.x, projectedPosition.y, projectedPosition.z);
|
|
696
|
-
}
|
|
697
|
-
|
|
626
|
+
}
|
|
627
|
+
_checkUpdate(camera) {
|
|
698
628
|
if (this._layerToDispose) {
|
|
699
629
|
if ((camera.layerMask & this._layerToDispose.layerMask) === 0) {
|
|
700
630
|
return;
|
|
701
631
|
}
|
|
702
632
|
}
|
|
703
633
|
if (this._isFullscreen && this._linkedControls.length) {
|
|
704
|
-
|
|
634
|
+
const scene = this.getScene();
|
|
705
635
|
if (!scene) {
|
|
706
636
|
return;
|
|
707
637
|
}
|
|
708
|
-
|
|
709
|
-
|
|
638
|
+
const globalViewport = this._getGlobalViewport();
|
|
639
|
+
for (const control of this._linkedControls) {
|
|
710
640
|
if (!control.isVisible) {
|
|
711
|
-
|
|
641
|
+
continue;
|
|
712
642
|
}
|
|
713
|
-
|
|
643
|
+
const mesh = control._linkedMesh;
|
|
714
644
|
if (!mesh || mesh.isDisposed()) {
|
|
715
|
-
Tools.SetImmediate(
|
|
645
|
+
Tools.SetImmediate(() => {
|
|
716
646
|
control.linkWithMesh(null);
|
|
717
647
|
});
|
|
718
|
-
|
|
648
|
+
continue;
|
|
719
649
|
}
|
|
720
|
-
|
|
721
|
-
|
|
650
|
+
const position = mesh.getBoundingInfo ? mesh.getBoundingInfo().boundingSphere.center : Vector3.ZeroReadOnly;
|
|
651
|
+
const projectedPosition = Vector3.Project(position, mesh.getWorldMatrix(), scene.getTransformMatrix(), globalViewport);
|
|
722
652
|
if (projectedPosition.z < 0 || projectedPosition.z > 1) {
|
|
723
653
|
control.notRenderable = true;
|
|
724
|
-
|
|
654
|
+
continue;
|
|
725
655
|
}
|
|
726
656
|
control.notRenderable = false;
|
|
727
657
|
control._moveToProjectedPosition(projectedPosition);
|
|
728
|
-
};
|
|
729
|
-
for (var _i = 0, _a = this._linkedControls; _i < _a.length; _i++) {
|
|
730
|
-
var control = _a[_i];
|
|
731
|
-
_loop_1(control);
|
|
732
658
|
}
|
|
733
659
|
}
|
|
734
660
|
if (!this._isDirty && !this._rootContainer.isDirty) {
|
|
@@ -737,17 +663,17 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
|
|
|
737
663
|
this._isDirty = false;
|
|
738
664
|
this._render();
|
|
739
665
|
this.update(this.applyYInversionOnUpdate, this.premulAlpha, AdvancedDynamicTexture.AllowGPUOptimizations);
|
|
740
|
-
}
|
|
741
|
-
|
|
742
|
-
|
|
743
|
-
|
|
744
|
-
|
|
745
|
-
|
|
666
|
+
}
|
|
667
|
+
_render() {
|
|
668
|
+
const textureSize = this.getSize();
|
|
669
|
+
const renderWidth = textureSize.width;
|
|
670
|
+
const renderHeight = textureSize.height;
|
|
671
|
+
const context = this.getContext();
|
|
746
672
|
context.font = "18px Arial";
|
|
747
673
|
context.strokeStyle = "white";
|
|
748
674
|
// Layout
|
|
749
675
|
this.onBeginLayoutObservable.notifyObservers(this);
|
|
750
|
-
|
|
676
|
+
const measure = new Measure(0, 0, renderWidth, renderHeight);
|
|
751
677
|
this._numLayoutCalls = 0;
|
|
752
678
|
this._rootContainer._layout(measure, context);
|
|
753
679
|
this.onEndLayoutObservable.notifyObservers(this);
|
|
@@ -772,39 +698,39 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
|
|
|
772
698
|
this._rootContainer._render(context, this._invalidatedRectangle);
|
|
773
699
|
this.onEndRenderObservable.notifyObservers(this);
|
|
774
700
|
this._invalidatedRectangle = null;
|
|
775
|
-
}
|
|
701
|
+
}
|
|
776
702
|
/**
|
|
777
703
|
* @param cursor
|
|
778
704
|
* @hidden
|
|
779
705
|
*/
|
|
780
|
-
|
|
706
|
+
_changeCursor(cursor) {
|
|
781
707
|
if (this._rootElement) {
|
|
782
708
|
this._rootElement.style.cursor = cursor;
|
|
783
709
|
this._cursorChanged = true;
|
|
784
710
|
}
|
|
785
|
-
}
|
|
711
|
+
}
|
|
786
712
|
/**
|
|
787
713
|
* @param control
|
|
788
714
|
* @param pointerId
|
|
789
715
|
* @hidden
|
|
790
716
|
*/
|
|
791
|
-
|
|
717
|
+
_registerLastControlDown(control, pointerId) {
|
|
792
718
|
this._lastControlDown[pointerId] = control;
|
|
793
719
|
this.onControlPickedObservable.notifyObservers(control);
|
|
794
|
-
}
|
|
795
|
-
|
|
796
|
-
|
|
720
|
+
}
|
|
721
|
+
_doPicking(x, y, pi, type, pointerId, buttonIndex, deltaX, deltaY) {
|
|
722
|
+
const scene = this.getScene();
|
|
797
723
|
if (!scene) {
|
|
798
724
|
return;
|
|
799
725
|
}
|
|
800
|
-
|
|
801
|
-
|
|
726
|
+
const engine = scene.getEngine();
|
|
727
|
+
const textureSize = this.getSize();
|
|
802
728
|
if (this._isFullscreen) {
|
|
803
|
-
|
|
729
|
+
const camera = scene.cameraToUseForPointers || scene.activeCamera;
|
|
804
730
|
if (!camera) {
|
|
805
731
|
return;
|
|
806
732
|
}
|
|
807
|
-
|
|
733
|
+
const viewport = camera.viewport;
|
|
808
734
|
x = x * (textureSize.width / (engine.getRenderWidth() * viewport.width));
|
|
809
735
|
y = y * (textureSize.height / (engine.getRenderHeight() * viewport.height));
|
|
810
736
|
}
|
|
@@ -831,35 +757,35 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
|
|
|
831
757
|
this._changeCursor("");
|
|
832
758
|
}
|
|
833
759
|
this._manageFocus();
|
|
834
|
-
}
|
|
760
|
+
}
|
|
835
761
|
/**
|
|
836
762
|
* @param list
|
|
837
763
|
* @param control
|
|
838
764
|
* @hidden
|
|
839
765
|
*/
|
|
840
|
-
|
|
841
|
-
for (
|
|
766
|
+
_cleanControlAfterRemovalFromList(list, control) {
|
|
767
|
+
for (const pointerId in list) {
|
|
842
768
|
if (!Object.prototype.hasOwnProperty.call(list, pointerId)) {
|
|
843
769
|
continue;
|
|
844
770
|
}
|
|
845
|
-
|
|
771
|
+
const lastControlOver = list[pointerId];
|
|
846
772
|
if (lastControlOver === control) {
|
|
847
773
|
delete list[pointerId];
|
|
848
774
|
}
|
|
849
775
|
}
|
|
850
|
-
}
|
|
776
|
+
}
|
|
851
777
|
/**
|
|
852
778
|
* @param control
|
|
853
779
|
* @hidden
|
|
854
780
|
*/
|
|
855
|
-
|
|
781
|
+
_cleanControlAfterRemoval(control) {
|
|
856
782
|
this._cleanControlAfterRemovalFromList(this._lastControlDown, control);
|
|
857
783
|
this._cleanControlAfterRemovalFromList(this._lastControlOver, control);
|
|
858
|
-
}
|
|
859
|
-
|
|
860
|
-
|
|
861
|
-
|
|
862
|
-
|
|
784
|
+
}
|
|
785
|
+
_translateToPicking(scene, tempViewport, pi) {
|
|
786
|
+
const camera = scene.cameraToUseForPointers || scene.activeCamera;
|
|
787
|
+
const engine = scene.getEngine();
|
|
788
|
+
const originalCameraToUseForPointers = scene.cameraToUseForPointers;
|
|
863
789
|
if (!camera) {
|
|
864
790
|
tempViewport.x = 0;
|
|
865
791
|
tempViewport.y = 0;
|
|
@@ -869,36 +795,36 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
|
|
|
869
795
|
else {
|
|
870
796
|
if (camera.rigCameras.length) {
|
|
871
797
|
// rig camera - we need to find the camera to use for this event
|
|
872
|
-
|
|
873
|
-
camera.rigCameras.forEach(
|
|
798
|
+
const rigViewport = new Viewport(0, 0, 1, 1);
|
|
799
|
+
camera.rigCameras.forEach((rigCamera) => {
|
|
874
800
|
// generate the viewport of this camera
|
|
875
|
-
rigCamera.viewport.toGlobalToRef(engine.getRenderWidth(), engine.getRenderHeight(),
|
|
876
|
-
|
|
877
|
-
|
|
801
|
+
rigCamera.viewport.toGlobalToRef(engine.getRenderWidth(), engine.getRenderHeight(), rigViewport);
|
|
802
|
+
const x = scene.pointerX / engine.getHardwareScalingLevel() - rigViewport.x;
|
|
803
|
+
const y = scene.pointerY / engine.getHardwareScalingLevel() - (engine.getRenderHeight() - rigViewport.y - rigViewport.height);
|
|
878
804
|
// check if the pointer is in the camera's viewport
|
|
879
|
-
if (x < 0 || y < 0 || x >
|
|
805
|
+
if (x < 0 || y < 0 || x > rigViewport.width || y > rigViewport.height) {
|
|
880
806
|
// out of viewport - don't use this camera
|
|
881
807
|
return;
|
|
882
808
|
}
|
|
883
809
|
// set the camera to use for pointers until this pointer loop is over
|
|
884
810
|
scene.cameraToUseForPointers = rigCamera;
|
|
885
811
|
// set the viewport
|
|
886
|
-
tempViewport.x =
|
|
887
|
-
tempViewport.y =
|
|
888
|
-
tempViewport.width =
|
|
889
|
-
tempViewport.height =
|
|
812
|
+
tempViewport.x = rigViewport.x;
|
|
813
|
+
tempViewport.y = rigViewport.y;
|
|
814
|
+
tempViewport.width = rigViewport.width;
|
|
815
|
+
tempViewport.height = rigViewport.height;
|
|
890
816
|
});
|
|
891
817
|
}
|
|
892
818
|
else {
|
|
893
819
|
camera.viewport.toGlobalToRef(engine.getRenderWidth(), engine.getRenderHeight(), tempViewport);
|
|
894
820
|
}
|
|
895
821
|
}
|
|
896
|
-
|
|
897
|
-
|
|
822
|
+
const x = scene.pointerX / engine.getHardwareScalingLevel() - tempViewport.x;
|
|
823
|
+
const y = scene.pointerY / engine.getHardwareScalingLevel() - (engine.getRenderHeight() - tempViewport.y - tempViewport.height);
|
|
898
824
|
this._shouldBlockPointer = false;
|
|
899
825
|
// Do picking modifies _shouldBlockPointer
|
|
900
826
|
if (pi) {
|
|
901
|
-
|
|
827
|
+
const pointerId = pi.event.pointerId || this._defaultMousePointerId;
|
|
902
828
|
this._doPicking(x, y, pi, pi.type, pointerId, pi.event.button, pi.event.deltaX, pi.event.deltaY);
|
|
903
829
|
// Avoid overwriting a true skipOnPointerObservable to false
|
|
904
830
|
if (this._shouldBlockPointer || this._capturingControl[pointerId]) {
|
|
@@ -910,16 +836,20 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
|
|
|
910
836
|
}
|
|
911
837
|
// if overridden by a rig camera - reset back to the original value
|
|
912
838
|
scene.cameraToUseForPointers = originalCameraToUseForPointers;
|
|
913
|
-
}
|
|
839
|
+
}
|
|
914
840
|
/** Attach to all scene events required to support pointer events */
|
|
915
|
-
|
|
916
|
-
|
|
917
|
-
var scene = this.getScene();
|
|
841
|
+
attach() {
|
|
842
|
+
const scene = this.getScene();
|
|
918
843
|
if (!scene) {
|
|
919
844
|
return;
|
|
920
845
|
}
|
|
921
|
-
|
|
922
|
-
this._prePointerObserver = scene.onPrePointerObservable.add(
|
|
846
|
+
const tempViewport = new Viewport(0, 0, 0, 0);
|
|
847
|
+
this._prePointerObserver = scene.onPrePointerObservable.add((pi) => {
|
|
848
|
+
if (scene.isPointerCaptured(pi.event.pointerId) &&
|
|
849
|
+
pi.type === PointerEventTypes.POINTERUP &&
|
|
850
|
+
!this._capturedPointerIds.has(pi.event.pointerId)) {
|
|
851
|
+
return;
|
|
852
|
+
}
|
|
923
853
|
if (pi.type !== PointerEventTypes.POINTERMOVE &&
|
|
924
854
|
pi.type !== PointerEventTypes.POINTERUP &&
|
|
925
855
|
pi.type !== PointerEventTypes.POINTERDOWN &&
|
|
@@ -932,44 +862,91 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
|
|
|
932
862
|
return;
|
|
933
863
|
}
|
|
934
864
|
if (pi.event.pointerId) {
|
|
935
|
-
|
|
865
|
+
this._defaultMousePointerId = pi.event.pointerId; // This is required to make sure we have the correct pointer ID for wheel
|
|
936
866
|
}
|
|
937
867
|
}
|
|
938
|
-
|
|
868
|
+
this._translateToPicking(scene, tempViewport, pi);
|
|
939
869
|
});
|
|
940
|
-
this._attachPickingToSceneRender(scene,
|
|
870
|
+
this._attachPickingToSceneRender(scene, () => this._translateToPicking(scene, tempViewport, null), false);
|
|
941
871
|
this._attachToOnPointerOut(scene);
|
|
942
872
|
this._attachToOnBlur(scene);
|
|
943
|
-
}
|
|
873
|
+
}
|
|
944
874
|
/**
|
|
945
875
|
* Register the clipboard Events onto the canvas
|
|
946
876
|
*/
|
|
947
|
-
|
|
877
|
+
registerClipboardEvents() {
|
|
948
878
|
self.addEventListener("copy", this._onClipboardCopy, false);
|
|
949
879
|
self.addEventListener("cut", this._onClipboardCut, false);
|
|
950
880
|
self.addEventListener("paste", this._onClipboardPaste, false);
|
|
951
|
-
}
|
|
881
|
+
}
|
|
952
882
|
/**
|
|
953
883
|
* Unregister the clipboard Events from the canvas
|
|
954
884
|
*/
|
|
955
|
-
|
|
885
|
+
unRegisterClipboardEvents() {
|
|
956
886
|
self.removeEventListener("copy", this._onClipboardCopy);
|
|
957
887
|
self.removeEventListener("cut", this._onClipboardCut);
|
|
958
888
|
self.removeEventListener("paste", this._onClipboardPaste);
|
|
959
|
-
}
|
|
889
|
+
}
|
|
890
|
+
/**
|
|
891
|
+
* Transform uvs from mesh space to texture space, taking the texture into account
|
|
892
|
+
* @param uv the uvs in mesh space
|
|
893
|
+
* @returns the uvs in texture space
|
|
894
|
+
*/
|
|
895
|
+
_transformUvs(uv) {
|
|
896
|
+
const textureMatrix = this.getTextureMatrix();
|
|
897
|
+
let result;
|
|
898
|
+
if (textureMatrix.isIdentityAs3x2()) {
|
|
899
|
+
result = uv;
|
|
900
|
+
}
|
|
901
|
+
else {
|
|
902
|
+
const homogeneousTextureMatrix = TmpVectors.Matrix[0];
|
|
903
|
+
textureMatrix.getRowToRef(0, TmpVectors.Vector4[0]);
|
|
904
|
+
textureMatrix.getRowToRef(1, TmpVectors.Vector4[1]);
|
|
905
|
+
textureMatrix.getRowToRef(2, TmpVectors.Vector4[2]);
|
|
906
|
+
const r0 = TmpVectors.Vector4[0];
|
|
907
|
+
const r1 = TmpVectors.Vector4[1];
|
|
908
|
+
const r2 = TmpVectors.Vector4[2];
|
|
909
|
+
homogeneousTextureMatrix.setRowFromFloats(0, r0.x, r0.y, 0, 0);
|
|
910
|
+
homogeneousTextureMatrix.setRowFromFloats(1, r1.x, r1.y, 0, 0);
|
|
911
|
+
homogeneousTextureMatrix.setRowFromFloats(2, 0, 0, 1, 0);
|
|
912
|
+
homogeneousTextureMatrix.setRowFromFloats(3, r2.x, r2.y, 0, 1);
|
|
913
|
+
result = TmpVectors.Vector2[0];
|
|
914
|
+
Vector2.TransformToRef(uv, homogeneousTextureMatrix, result);
|
|
915
|
+
}
|
|
916
|
+
// In wrap and mirror mode, the texture coordinate for coordinates more than 1 is the fractional part of the coordinate
|
|
917
|
+
if (this.wrapU === Texture.WRAP_ADDRESSMODE || this.wrapU === Texture.MIRROR_ADDRESSMODE) {
|
|
918
|
+
if (result.x > 1) {
|
|
919
|
+
let fX = result.x - Math.trunc(result.x);
|
|
920
|
+
// In mirror mode, the sign of the texture coordinate depends on the integer part -
|
|
921
|
+
// odd integers means it is mirrored from the original coordinate
|
|
922
|
+
if (this.wrapU === Texture.MIRROR_ADDRESSMODE && Math.trunc(result.x) % 2 === 1) {
|
|
923
|
+
fX = 1 - fX;
|
|
924
|
+
}
|
|
925
|
+
result.x = fX;
|
|
926
|
+
}
|
|
927
|
+
}
|
|
928
|
+
if (this.wrapV === Texture.WRAP_ADDRESSMODE || this.wrapV === Texture.MIRROR_ADDRESSMODE) {
|
|
929
|
+
if (result.y > 1) {
|
|
930
|
+
let fY = result.y - Math.trunc(result.y);
|
|
931
|
+
if (this.wrapV === Texture.MIRROR_ADDRESSMODE && Math.trunc(result.x) % 2 === 1) {
|
|
932
|
+
fY = 1 - fY;
|
|
933
|
+
}
|
|
934
|
+
result.y = fY;
|
|
935
|
+
}
|
|
936
|
+
}
|
|
937
|
+
return result;
|
|
938
|
+
}
|
|
960
939
|
/**
|
|
961
940
|
* Connect the texture to a hosting mesh to enable interactions
|
|
962
941
|
* @param mesh defines the mesh to attach to
|
|
963
942
|
* @param supportPointerMove defines a boolean indicating if pointer move events must be catched as well
|
|
964
943
|
*/
|
|
965
|
-
|
|
966
|
-
|
|
967
|
-
if (supportPointerMove === void 0) { supportPointerMove = true; }
|
|
968
|
-
var scene = this.getScene();
|
|
944
|
+
attachToMesh(mesh, supportPointerMove = true) {
|
|
945
|
+
const scene = this.getScene();
|
|
969
946
|
if (!scene) {
|
|
970
947
|
return;
|
|
971
948
|
}
|
|
972
|
-
this._pointerObserver = scene.onPointerObservable.add(
|
|
949
|
+
this._pointerObserver = scene.onPointerObservable.add((pi) => {
|
|
973
950
|
if (pi.type !== PointerEventTypes.POINTERMOVE &&
|
|
974
951
|
pi.type !== PointerEventTypes.POINTERUP &&
|
|
975
952
|
pi.type !== PointerEventTypes.POINTERDOWN &&
|
|
@@ -977,33 +954,33 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
|
|
|
977
954
|
return;
|
|
978
955
|
}
|
|
979
956
|
if (pi.type === PointerEventTypes.POINTERMOVE && pi.event.pointerId) {
|
|
980
|
-
|
|
957
|
+
this._defaultMousePointerId = pi.event.pointerId; // This is required to make sure we have the correct pointer ID for wheel
|
|
981
958
|
}
|
|
982
|
-
|
|
959
|
+
const pointerId = pi.event.pointerId || this._defaultMousePointerId;
|
|
983
960
|
if (pi.pickInfo && pi.pickInfo.hit && pi.pickInfo.pickedMesh === mesh) {
|
|
984
|
-
|
|
961
|
+
let uv = pi.pickInfo.getTextureCoordinates();
|
|
985
962
|
if (uv) {
|
|
986
|
-
|
|
987
|
-
|
|
963
|
+
uv = this._transformUvs(uv);
|
|
964
|
+
const size = this.getSize();
|
|
965
|
+
this._doPicking(uv.x * size.width, (this.applyYInversionOnUpdate ? 1.0 - uv.y : uv.y) * size.height, pi, pi.type, pointerId, pi.event.button, pi.event.deltaX, pi.event.deltaY);
|
|
988
966
|
}
|
|
989
967
|
}
|
|
990
968
|
else if (pi.type === PointerEventTypes.POINTERUP) {
|
|
991
|
-
if (
|
|
992
|
-
|
|
969
|
+
if (this._lastControlDown[pointerId]) {
|
|
970
|
+
this._lastControlDown[pointerId]._forcePointerUp(pointerId);
|
|
993
971
|
}
|
|
994
|
-
delete
|
|
995
|
-
if (
|
|
996
|
-
|
|
997
|
-
|
|
972
|
+
delete this._lastControlDown[pointerId];
|
|
973
|
+
if (this.focusedControl) {
|
|
974
|
+
const friendlyControls = this.focusedControl.keepsFocusWith();
|
|
975
|
+
let canMoveFocus = true;
|
|
998
976
|
if (friendlyControls) {
|
|
999
|
-
for (
|
|
1000
|
-
var control = friendlyControls_1[_i];
|
|
977
|
+
for (const control of friendlyControls) {
|
|
1001
978
|
// Same host, no need to keep the focus
|
|
1002
|
-
if (
|
|
979
|
+
if (this === control._host) {
|
|
1003
980
|
continue;
|
|
1004
981
|
}
|
|
1005
982
|
// Different hosts
|
|
1006
|
-
|
|
983
|
+
const otherHost = control._host;
|
|
1007
984
|
if (otherHost._lastControlOver[pointerId] && otherHost._lastControlOver[pointerId].isAscendant(control)) {
|
|
1008
985
|
canMoveFocus = false;
|
|
1009
986
|
break;
|
|
@@ -1011,48 +988,49 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
|
|
|
1011
988
|
}
|
|
1012
989
|
}
|
|
1013
990
|
if (canMoveFocus) {
|
|
1014
|
-
|
|
991
|
+
this.focusedControl = null;
|
|
1015
992
|
}
|
|
1016
993
|
}
|
|
1017
994
|
}
|
|
1018
995
|
else if (pi.type === PointerEventTypes.POINTERMOVE) {
|
|
1019
|
-
if (
|
|
1020
|
-
|
|
996
|
+
if (this._lastControlOver[pointerId]) {
|
|
997
|
+
this._lastControlOver[pointerId]._onPointerOut(this._lastControlOver[pointerId], pi, true);
|
|
1021
998
|
}
|
|
1022
|
-
delete
|
|
999
|
+
delete this._lastControlOver[pointerId];
|
|
1023
1000
|
}
|
|
1024
1001
|
});
|
|
1025
1002
|
mesh.enablePointerMoveEvents = supportPointerMove;
|
|
1026
|
-
this._attachPickingToSceneRender(scene,
|
|
1027
|
-
|
|
1028
|
-
|
|
1003
|
+
this._attachPickingToSceneRender(scene, () => {
|
|
1004
|
+
const pointerId = this._defaultMousePointerId;
|
|
1005
|
+
const pick = scene?.pick(scene.pointerX, scene.pointerY);
|
|
1029
1006
|
if (pick && pick.hit && pick.pickedMesh === mesh) {
|
|
1030
|
-
|
|
1007
|
+
let uv = pick.getTextureCoordinates();
|
|
1031
1008
|
if (uv) {
|
|
1032
|
-
|
|
1033
|
-
|
|
1009
|
+
uv = this._transformUvs(uv);
|
|
1010
|
+
const size = this.getSize();
|
|
1011
|
+
this._doPicking(uv.x * size.width, (this.applyYInversionOnUpdate ? 1.0 - uv.y : uv.y) * size.height, null, PointerEventTypes.POINTERMOVE, pointerId, 0);
|
|
1034
1012
|
}
|
|
1035
1013
|
}
|
|
1036
1014
|
else {
|
|
1037
|
-
if (
|
|
1038
|
-
|
|
1015
|
+
if (this._lastControlOver[pointerId]) {
|
|
1016
|
+
this._lastControlOver[pointerId]._onPointerOut(this._lastControlOver[pointerId], null, true);
|
|
1039
1017
|
}
|
|
1040
|
-
delete
|
|
1018
|
+
delete this._lastControlOver[pointerId];
|
|
1041
1019
|
}
|
|
1042
1020
|
}, true);
|
|
1043
1021
|
this._attachToOnPointerOut(scene);
|
|
1044
1022
|
this._attachToOnBlur(scene);
|
|
1045
|
-
}
|
|
1023
|
+
}
|
|
1046
1024
|
/**
|
|
1047
1025
|
* Move the focus to a specific control
|
|
1048
1026
|
* @param control defines the control which will receive the focus
|
|
1049
1027
|
*/
|
|
1050
|
-
|
|
1028
|
+
moveFocusToControl(control) {
|
|
1051
1029
|
this.focusedControl = control;
|
|
1052
1030
|
this._lastPickedControl = control;
|
|
1053
1031
|
this._blockNextFocusCheck = true;
|
|
1054
|
-
}
|
|
1055
|
-
|
|
1032
|
+
}
|
|
1033
|
+
_manageFocus() {
|
|
1056
1034
|
if (this._blockNextFocusCheck) {
|
|
1057
1035
|
this._blockNextFocusCheck = false;
|
|
1058
1036
|
this._lastPickedControl = this._focusedControl;
|
|
@@ -1067,66 +1045,62 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
|
|
|
1067
1045
|
this.focusedControl = null;
|
|
1068
1046
|
}
|
|
1069
1047
|
}
|
|
1070
|
-
}
|
|
1071
|
-
|
|
1072
|
-
|
|
1073
|
-
|
|
1074
|
-
if (!_this.checkPointerEveryFrame) {
|
|
1048
|
+
}
|
|
1049
|
+
_attachPickingToSceneRender(scene, pickFunction, forcePicking) {
|
|
1050
|
+
this._sceneRenderObserver = scene.onBeforeRenderObservable.add(() => {
|
|
1051
|
+
if (!this.checkPointerEveryFrame) {
|
|
1075
1052
|
return;
|
|
1076
1053
|
}
|
|
1077
|
-
if (
|
|
1054
|
+
if (this._linkedControls.length > 0 || forcePicking) {
|
|
1078
1055
|
pickFunction();
|
|
1079
1056
|
}
|
|
1080
1057
|
});
|
|
1081
|
-
}
|
|
1082
|
-
|
|
1083
|
-
|
|
1084
|
-
|
|
1085
|
-
|
|
1086
|
-
_this._lastControlOver[pointerEvent.pointerId]._onPointerOut(_this._lastControlOver[pointerEvent.pointerId], null);
|
|
1058
|
+
}
|
|
1059
|
+
_attachToOnPointerOut(scene) {
|
|
1060
|
+
this._canvasPointerOutObserver = scene.getEngine().onCanvasPointerOutObservable.add((pointerEvent) => {
|
|
1061
|
+
if (this._lastControlOver[pointerEvent.pointerId]) {
|
|
1062
|
+
this._lastControlOver[pointerEvent.pointerId]._onPointerOut(this._lastControlOver[pointerEvent.pointerId], null);
|
|
1087
1063
|
}
|
|
1088
|
-
delete
|
|
1089
|
-
if (
|
|
1090
|
-
|
|
1091
|
-
delete
|
|
1064
|
+
delete this._lastControlOver[pointerEvent.pointerId];
|
|
1065
|
+
if (this._lastControlDown[pointerEvent.pointerId] && this._lastControlDown[pointerEvent.pointerId] !== this._capturingControl[pointerEvent.pointerId]) {
|
|
1066
|
+
this._lastControlDown[pointerEvent.pointerId]._forcePointerUp(pointerEvent.pointerId);
|
|
1067
|
+
delete this._lastControlDown[pointerEvent.pointerId];
|
|
1092
1068
|
}
|
|
1093
1069
|
});
|
|
1094
|
-
}
|
|
1095
|
-
|
|
1096
|
-
|
|
1097
|
-
|
|
1098
|
-
Object.entries(_this._lastControlDown).forEach(function (_a) {
|
|
1099
|
-
var value = _a[1];
|
|
1070
|
+
}
|
|
1071
|
+
_attachToOnBlur(scene) {
|
|
1072
|
+
this._canvasBlurObserver = scene.getEngine().onCanvasBlurObservable.add(() => {
|
|
1073
|
+
Object.entries(this._lastControlDown).forEach(([, value]) => {
|
|
1100
1074
|
value._onCanvasBlur();
|
|
1101
1075
|
});
|
|
1102
|
-
|
|
1103
|
-
|
|
1076
|
+
this.focusedControl = null;
|
|
1077
|
+
this._lastControlDown = {};
|
|
1104
1078
|
});
|
|
1105
|
-
}
|
|
1079
|
+
}
|
|
1106
1080
|
/**
|
|
1107
1081
|
* Serializes the entire GUI system
|
|
1108
1082
|
* @returns an object with the JSON serialized data
|
|
1109
1083
|
*/
|
|
1110
|
-
|
|
1111
|
-
|
|
1112
|
-
|
|
1084
|
+
serializeContent() {
|
|
1085
|
+
const size = this.getSize();
|
|
1086
|
+
const serializationObject = {
|
|
1113
1087
|
root: {},
|
|
1114
1088
|
width: size.width,
|
|
1115
1089
|
height: size.height,
|
|
1116
1090
|
};
|
|
1117
1091
|
this._rootContainer.serialize(serializationObject.root);
|
|
1118
1092
|
return serializationObject;
|
|
1119
|
-
}
|
|
1093
|
+
}
|
|
1120
1094
|
/**
|
|
1121
1095
|
* Recreate the content of the ADT from a JSON object
|
|
1122
1096
|
* @param serializedObject define the JSON serialized object to restore from
|
|
1123
1097
|
* @param scaleToSize defines whether to scale to texture to the saved size
|
|
1124
1098
|
*/
|
|
1125
|
-
|
|
1099
|
+
parseSerializedObject(serializedObject, scaleToSize) {
|
|
1126
1100
|
this._rootContainer = Control.Parse(serializedObject.root, this);
|
|
1127
1101
|
if (scaleToSize) {
|
|
1128
|
-
|
|
1129
|
-
|
|
1102
|
+
const width = serializedObject.width;
|
|
1103
|
+
const height = serializedObject.height;
|
|
1130
1104
|
if (typeof width === "number" && typeof height === "number" && width >= 0 && height >= 0) {
|
|
1131
1105
|
this.scaleTo(width, height);
|
|
1132
1106
|
}
|
|
@@ -1135,7 +1109,7 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
|
|
|
1135
1109
|
this.scaleTo(1920, 1080);
|
|
1136
1110
|
}
|
|
1137
1111
|
}
|
|
1138
|
-
}
|
|
1112
|
+
}
|
|
1139
1113
|
/**
|
|
1140
1114
|
* Recreate the content of the ADT from a snippet saved by the GUI editor
|
|
1141
1115
|
* @param snippetId defines the snippet to load
|
|
@@ -1143,34 +1117,24 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
|
|
|
1143
1117
|
* @param appendToAdt if provided the snippet will be appended to the adt. Otherwise a fullscreen ADT will be created.
|
|
1144
1118
|
* @returns a promise that will resolve on success
|
|
1145
1119
|
*/
|
|
1146
|
-
|
|
1147
|
-
|
|
1148
|
-
|
|
1149
|
-
return
|
|
1150
|
-
|
|
1151
|
-
|
|
1152
|
-
|
|
1153
|
-
|
|
1154
|
-
|
|
1155
|
-
}
|
|
1156
|
-
return [4 /*yield*/, AdvancedDynamicTexture._LoadURLContentAsync(AdvancedDynamicTexture.SnippetUrl + "/" + snippetId.replace(/#/g, "/"), true)];
|
|
1157
|
-
case 1:
|
|
1158
|
-
serialized = _a.sent();
|
|
1159
|
-
adt.parseSerializedObject(serialized, scaleToSize);
|
|
1160
|
-
return [2 /*return*/, adt];
|
|
1161
|
-
}
|
|
1162
|
-
});
|
|
1163
|
-
});
|
|
1164
|
-
};
|
|
1120
|
+
static async ParseFromSnippetAsync(snippetId, scaleToSize, appendToAdt) {
|
|
1121
|
+
const adt = appendToAdt ?? AdvancedDynamicTexture.CreateFullscreenUI("ADT from snippet");
|
|
1122
|
+
if (snippetId === "_BLANK") {
|
|
1123
|
+
return adt;
|
|
1124
|
+
}
|
|
1125
|
+
const serialized = await AdvancedDynamicTexture._LoadURLContentAsync(AdvancedDynamicTexture.SnippetUrl + "/" + snippetId.replace(/#/g, "/"), true);
|
|
1126
|
+
adt.parseSerializedObject(serialized, scaleToSize);
|
|
1127
|
+
return adt;
|
|
1128
|
+
}
|
|
1165
1129
|
/**
|
|
1166
1130
|
* Recreate the content of the ADT from a snippet saved by the GUI editor
|
|
1167
1131
|
* @param snippetId defines the snippet to load
|
|
1168
1132
|
* @param scaleToSize defines whether to scale to texture to the saved size
|
|
1169
1133
|
* @returns a promise that will resolve on success
|
|
1170
1134
|
*/
|
|
1171
|
-
|
|
1135
|
+
parseFromSnippetAsync(snippetId, scaleToSize) {
|
|
1172
1136
|
return AdvancedDynamicTexture.ParseFromSnippetAsync(snippetId, scaleToSize, this);
|
|
1173
|
-
}
|
|
1137
|
+
}
|
|
1174
1138
|
/**
|
|
1175
1139
|
* Recreate the content of the ADT from a url json
|
|
1176
1140
|
* @param url defines the url to load
|
|
@@ -1178,43 +1142,32 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
|
|
|
1178
1142
|
* @param appendToAdt if provided the snippet will be appended to the adt. Otherwise a fullscreen ADT will be created.
|
|
1179
1143
|
* @returns a promise that will resolve on success
|
|
1180
1144
|
*/
|
|
1181
|
-
|
|
1182
|
-
|
|
1183
|
-
|
|
1184
|
-
|
|
1185
|
-
|
|
1186
|
-
|
|
1187
|
-
adt = appendToAdt !== null && appendToAdt !== void 0 ? appendToAdt : AdvancedDynamicTexture.CreateFullscreenUI("ADT from URL");
|
|
1188
|
-
return [4 /*yield*/, AdvancedDynamicTexture._LoadURLContentAsync(url)];
|
|
1189
|
-
case 1:
|
|
1190
|
-
serialized = _a.sent();
|
|
1191
|
-
adt.parseSerializedObject(serialized, scaleToSize);
|
|
1192
|
-
return [2 /*return*/, adt];
|
|
1193
|
-
}
|
|
1194
|
-
});
|
|
1195
|
-
});
|
|
1196
|
-
};
|
|
1145
|
+
static async ParseFromFileAsync(url, scaleToSize, appendToAdt) {
|
|
1146
|
+
const adt = appendToAdt ?? AdvancedDynamicTexture.CreateFullscreenUI("ADT from URL");
|
|
1147
|
+
const serialized = await AdvancedDynamicTexture._LoadURLContentAsync(url);
|
|
1148
|
+
adt.parseSerializedObject(serialized, scaleToSize);
|
|
1149
|
+
return adt;
|
|
1150
|
+
}
|
|
1197
1151
|
/**
|
|
1198
1152
|
* Recreate the content of the ADT from a url json
|
|
1199
1153
|
* @param url defines the url to load
|
|
1200
1154
|
* @param scaleToSize defines whether to scale to texture to the saved size
|
|
1201
1155
|
* @returns a promise that will resolve on success
|
|
1202
1156
|
*/
|
|
1203
|
-
|
|
1157
|
+
parseFromURLAsync(url, scaleToSize) {
|
|
1204
1158
|
return AdvancedDynamicTexture.ParseFromFileAsync(url, scaleToSize, this);
|
|
1205
|
-
}
|
|
1206
|
-
|
|
1207
|
-
if (snippet === void 0) { snippet = false; }
|
|
1159
|
+
}
|
|
1160
|
+
static _LoadURLContentAsync(url, snippet = false) {
|
|
1208
1161
|
if (url === "") {
|
|
1209
1162
|
return Promise.reject("No URL provided");
|
|
1210
1163
|
}
|
|
1211
|
-
return new Promise(
|
|
1212
|
-
|
|
1213
|
-
request.addEventListener("readystatechange",
|
|
1164
|
+
return new Promise((resolve, reject) => {
|
|
1165
|
+
const request = new WebRequest();
|
|
1166
|
+
request.addEventListener("readystatechange", () => {
|
|
1214
1167
|
if (request.readyState == 4) {
|
|
1215
1168
|
if (request.status == 200) {
|
|
1216
|
-
|
|
1217
|
-
|
|
1169
|
+
const gui = snippet ? JSON.parse(JSON.parse(request.responseText).jsonPayload).gui : request.responseText;
|
|
1170
|
+
const serializationObject = JSON.parse(gui);
|
|
1218
1171
|
resolve(serializationObject);
|
|
1219
1172
|
}
|
|
1220
1173
|
else {
|
|
@@ -1225,7 +1178,7 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
|
|
|
1225
1178
|
request.open("GET", url);
|
|
1226
1179
|
request.send();
|
|
1227
1180
|
});
|
|
1228
|
-
}
|
|
1181
|
+
}
|
|
1229
1182
|
// Statics
|
|
1230
1183
|
/**
|
|
1231
1184
|
* Compares two rectangle based controls for pixel overlap
|
|
@@ -1233,12 +1186,12 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
|
|
|
1233
1186
|
* @param control2 The second control to compare
|
|
1234
1187
|
* @returns true if overlaps, otherwise false
|
|
1235
1188
|
*/
|
|
1236
|
-
|
|
1189
|
+
static _Overlaps(control1, control2) {
|
|
1237
1190
|
return !(control1.centerX > control2.centerX + control2.widthInPixels ||
|
|
1238
1191
|
control1.centerX + control1.widthInPixels < control2.centerX ||
|
|
1239
1192
|
control1.centerY + control1.heightInPixels < control2.centerY ||
|
|
1240
1193
|
control1.centerY > control2.centerY + control2.heightInPixels);
|
|
1241
|
-
}
|
|
1194
|
+
}
|
|
1242
1195
|
/**
|
|
1243
1196
|
* Creates a new AdvancedDynamicTexture in projected mode (ie. attached to a mesh)
|
|
1244
1197
|
* @param mesh defines the mesh which will receive the texture
|
|
@@ -1250,25 +1203,20 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
|
|
|
1250
1203
|
* @param materialSetupCallback defines a custom way of creating and setting up the material on the mesh
|
|
1251
1204
|
* @returns a new AdvancedDynamicTexture
|
|
1252
1205
|
*/
|
|
1253
|
-
|
|
1254
|
-
if (width === void 0) { width = 1024; }
|
|
1255
|
-
if (height === void 0) { height = 1024; }
|
|
1256
|
-
if (supportPointerMove === void 0) { supportPointerMove = true; }
|
|
1257
|
-
if (onlyAlphaTesting === void 0) { onlyAlphaTesting = false; }
|
|
1258
|
-
if (materialSetupCallback === void 0) { materialSetupCallback = this._CreateMaterial; }
|
|
1206
|
+
static CreateForMesh(mesh, width = 1024, height = 1024, supportPointerMove = true, onlyAlphaTesting = false, invertY, materialSetupCallback = this._CreateMaterial) {
|
|
1259
1207
|
// use a unique ID in name so serialization will work even if you create two ADTs for a single mesh
|
|
1260
|
-
|
|
1261
|
-
|
|
1208
|
+
const uniqueId = RandomGUID();
|
|
1209
|
+
const result = new AdvancedDynamicTexture(`AdvancedDynamicTexture for ${mesh.name} [${uniqueId}]`, width, height, mesh.getScene(), true, Texture.TRILINEAR_SAMPLINGMODE, invertY);
|
|
1262
1210
|
materialSetupCallback(mesh, uniqueId, result, onlyAlphaTesting);
|
|
1263
1211
|
result.attachToMesh(mesh, supportPointerMove);
|
|
1264
1212
|
return result;
|
|
1265
|
-
}
|
|
1266
|
-
|
|
1267
|
-
|
|
1213
|
+
}
|
|
1214
|
+
static _CreateMaterial(mesh, uniqueId, texture, onlyAlphaTesting) {
|
|
1215
|
+
const internalClassType = GetClass("BABYLON.StandardMaterial");
|
|
1268
1216
|
if (!internalClassType) {
|
|
1269
1217
|
throw "StandardMaterial needs to be imported before as it contains a side-effect required by your code.";
|
|
1270
1218
|
}
|
|
1271
|
-
|
|
1219
|
+
const material = new internalClassType(`AdvancedDynamicTextureMaterial for ${mesh.name} [${uniqueId}]`, mesh.getScene());
|
|
1272
1220
|
material.backFaceCulling = false;
|
|
1273
1221
|
material.diffuseColor = Color3.Black();
|
|
1274
1222
|
material.specularColor = Color3.Black();
|
|
@@ -1282,7 +1230,7 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
|
|
|
1282
1230
|
material.opacityTexture = texture;
|
|
1283
1231
|
}
|
|
1284
1232
|
mesh.material = material;
|
|
1285
|
-
}
|
|
1233
|
+
}
|
|
1286
1234
|
/**
|
|
1287
1235
|
* Creates a new AdvancedDynamicTexture in projected mode (ie. attached to a mesh) BUT do not create a new material for the mesh. You will be responsible for connecting the texture
|
|
1288
1236
|
* @param mesh defines the mesh which will receive the texture
|
|
@@ -1292,14 +1240,11 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
|
|
|
1292
1240
|
* @param invertY defines if the texture needs to be inverted on the y axis during loading (true by default)
|
|
1293
1241
|
* @returns a new AdvancedDynamicTexture
|
|
1294
1242
|
*/
|
|
1295
|
-
|
|
1296
|
-
|
|
1297
|
-
if (height === void 0) { height = 1024; }
|
|
1298
|
-
if (supportPointerMove === void 0) { supportPointerMove = true; }
|
|
1299
|
-
var result = new AdvancedDynamicTexture(mesh.name + " AdvancedDynamicTexture", width, height, mesh.getScene(), true, Texture.TRILINEAR_SAMPLINGMODE, invertY);
|
|
1243
|
+
static CreateForMeshTexture(mesh, width = 1024, height = 1024, supportPointerMove = true, invertY) {
|
|
1244
|
+
const result = new AdvancedDynamicTexture(mesh.name + " AdvancedDynamicTexture", width, height, mesh.getScene(), true, Texture.TRILINEAR_SAMPLINGMODE, invertY);
|
|
1300
1245
|
result.attachToMesh(mesh, supportPointerMove);
|
|
1301
1246
|
return result;
|
|
1302
|
-
}
|
|
1247
|
+
}
|
|
1303
1248
|
/**
|
|
1304
1249
|
* Creates a new AdvancedDynamicTexture in fullscreen mode.
|
|
1305
1250
|
* In this mode the texture will rely on a layer for its rendering.
|
|
@@ -1313,49 +1258,43 @@ var AdvancedDynamicTexture = /** @class */ (function (_super) {
|
|
|
1313
1258
|
* @param adaptiveScaling defines whether to automatically scale root to match hardwarescaling (false by default)
|
|
1314
1259
|
* @returns a new AdvancedDynamicTexture
|
|
1315
1260
|
*/
|
|
1316
|
-
|
|
1317
|
-
|
|
1318
|
-
if (scene === void 0) { scene = null; }
|
|
1319
|
-
if (sampling === void 0) { sampling = Texture.BILINEAR_SAMPLINGMODE; }
|
|
1320
|
-
if (adaptiveScaling === void 0) { adaptiveScaling = false; }
|
|
1321
|
-
var result = new AdvancedDynamicTexture(name, 0, 0, scene, false, sampling);
|
|
1261
|
+
static CreateFullscreenUI(name, foreground = true, scene = null, sampling = Texture.BILINEAR_SAMPLINGMODE, adaptiveScaling = false) {
|
|
1262
|
+
const result = new AdvancedDynamicTexture(name, 0, 0, scene, false, sampling);
|
|
1322
1263
|
// Display
|
|
1323
|
-
|
|
1324
|
-
|
|
1264
|
+
const resultScene = result.getScene();
|
|
1265
|
+
const layer = new Layer(name + "_layer", null, resultScene, !foreground);
|
|
1325
1266
|
layer.texture = result;
|
|
1326
1267
|
result._layerToDispose = layer;
|
|
1327
1268
|
result._isFullscreen = true;
|
|
1328
1269
|
if (adaptiveScaling && resultScene) {
|
|
1329
|
-
|
|
1270
|
+
const newScale = 1 / resultScene.getEngine().getHardwareScalingLevel();
|
|
1330
1271
|
result._rootContainer.scaleX = newScale;
|
|
1331
1272
|
result._rootContainer.scaleY = newScale;
|
|
1332
1273
|
}
|
|
1333
1274
|
// Attach
|
|
1334
1275
|
result.attach();
|
|
1335
1276
|
return result;
|
|
1336
|
-
}
|
|
1277
|
+
}
|
|
1337
1278
|
/**
|
|
1338
1279
|
* Scales the texture
|
|
1339
1280
|
* @param ratio the scale factor to apply to both width and height
|
|
1340
1281
|
*/
|
|
1341
|
-
|
|
1342
|
-
|
|
1282
|
+
scale(ratio) {
|
|
1283
|
+
super.scale(ratio);
|
|
1343
1284
|
this.markAsDirty();
|
|
1344
|
-
}
|
|
1285
|
+
}
|
|
1345
1286
|
/**
|
|
1346
1287
|
* Resizes the texture
|
|
1347
1288
|
* @param width the new width
|
|
1348
1289
|
* @param height the new height
|
|
1349
1290
|
*/
|
|
1350
|
-
|
|
1351
|
-
|
|
1291
|
+
scaleTo(width, height) {
|
|
1292
|
+
super.scaleTo(width, height);
|
|
1352
1293
|
this.markAsDirty();
|
|
1353
|
-
}
|
|
1354
|
-
|
|
1355
|
-
|
|
1356
|
-
|
|
1357
|
-
|
|
1358
|
-
|
|
1359
|
-
}(DynamicTexture));
|
|
1360
|
-
export { AdvancedDynamicTexture };
|
|
1294
|
+
}
|
|
1295
|
+
}
|
|
1296
|
+
/** Define the Uurl to load snippets */
|
|
1297
|
+
AdvancedDynamicTexture.SnippetUrl = Constants.SnippetUrl;
|
|
1298
|
+
/** Indicates if some optimizations can be performed in GUI GPU management (the downside is additional memory/GPU texture memory used) */
|
|
1299
|
+
AdvancedDynamicTexture.AllowGPUOptimizations = true;
|
|
1361
1300
|
//# sourceMappingURL=advancedDynamicTexture.js.map
|