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