@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.
Files changed (180) hide show
  1. package/2D/adtInstrumentation.js +70 -90
  2. package/2D/adtInstrumentation.js.map +1 -1
  3. package/2D/advancedDynamicTexture.d.ts +8 -0
  4. package/2D/advancedDynamicTexture.js +559 -620
  5. package/2D/advancedDynamicTexture.js.map +1 -1
  6. package/2D/controls/button.js +76 -90
  7. package/2D/controls/button.js.map +1 -1
  8. package/2D/controls/checkbox.js +86 -106
  9. package/2D/controls/checkbox.js.map +1 -1
  10. package/2D/controls/colorpicker.js +395 -415
  11. package/2D/controls/colorpicker.js.map +1 -1
  12. package/2D/controls/container.js +187 -230
  13. package/2D/controls/container.js.map +1 -1
  14. package/2D/controls/control.js +1073 -1353
  15. package/2D/controls/control.js.map +1 -1
  16. package/2D/controls/displayGrid.js +152 -196
  17. package/2D/controls/displayGrid.js.map +1 -1
  18. package/2D/controls/ellipse.js +32 -40
  19. package/2D/controls/ellipse.js.map +1 -1
  20. package/2D/controls/focusableButton.js +30 -35
  21. package/2D/controls/focusableButton.js.map +1 -1
  22. package/2D/controls/grid.js +172 -212
  23. package/2D/controls/grid.js.map +1 -1
  24. package/2D/controls/image.js +489 -592
  25. package/2D/controls/image.js.map +1 -1
  26. package/2D/controls/inputPassword.js +9 -16
  27. package/2D/controls/inputPassword.js.map +1 -1
  28. package/2D/controls/inputText.js +380 -467
  29. package/2D/controls/inputText.js.map +1 -1
  30. package/2D/controls/inputTextArea.js +234 -273
  31. package/2D/controls/inputTextArea.js.map +1 -1
  32. package/2D/controls/line.js +147 -198
  33. package/2D/controls/line.js.map +1 -1
  34. package/2D/controls/multiLine.js +87 -113
  35. package/2D/controls/multiLine.js.map +1 -1
  36. package/2D/controls/radioButton.js +106 -127
  37. package/2D/controls/radioButton.js.map +1 -1
  38. package/2D/controls/rectangle.js +64 -76
  39. package/2D/controls/rectangle.js.map +1 -1
  40. package/2D/controls/scrollViewers/scrollViewer.js +439 -543
  41. package/2D/controls/scrollViewers/scrollViewer.js.map +1 -1
  42. package/2D/controls/scrollViewers/scrollViewerWindow.js +99 -118
  43. package/2D/controls/scrollViewers/scrollViewerWindow.js.map +1 -1
  44. package/2D/controls/selector.js +241 -329
  45. package/2D/controls/selector.js.map +1 -1
  46. package/2D/controls/sliders/baseSlider.js +182 -230
  47. package/2D/controls/sliders/baseSlider.js.map +1 -1
  48. package/2D/controls/sliders/imageBasedSlider.js +86 -109
  49. package/2D/controls/sliders/imageBasedSlider.js.map +1 -1
  50. package/2D/controls/sliders/imageScrollBar.d.ts +4 -0
  51. package/2D/controls/sliders/imageScrollBar.js +149 -163
  52. package/2D/controls/sliders/imageScrollBar.js.map +1 -1
  53. package/2D/controls/sliders/scrollBar.d.ts +4 -0
  54. package/2D/controls/sliders/scrollBar.js +65 -65
  55. package/2D/controls/sliders/scrollBar.js.map +1 -1
  56. package/2D/controls/sliders/slider.js +91 -115
  57. package/2D/controls/sliders/slider.js.map +1 -1
  58. package/2D/controls/stackPanel.js +114 -135
  59. package/2D/controls/stackPanel.js.map +1 -1
  60. package/2D/controls/statics.js +5 -5
  61. package/2D/controls/statics.js.map +1 -1
  62. package/2D/controls/textBlock.js +322 -384
  63. package/2D/controls/textBlock.js.map +1 -1
  64. package/2D/controls/textWrapper.js +27 -41
  65. package/2D/controls/textWrapper.js.map +1 -1
  66. package/2D/controls/toggleButton.js +105 -121
  67. package/2D/controls/toggleButton.js.map +1 -1
  68. package/2D/controls/virtualKeyboard.js +101 -123
  69. package/2D/controls/virtualKeyboard.js.map +1 -1
  70. package/2D/math2D.js +62 -70
  71. package/2D/math2D.js.map +1 -1
  72. package/2D/measure.js +30 -32
  73. package/2D/measure.js.map +1 -1
  74. package/2D/multiLinePoint.js +71 -89
  75. package/2D/multiLinePoint.js.map +1 -1
  76. package/2D/style.js +55 -73
  77. package/2D/style.js.map +1 -1
  78. package/2D/valueAndUnit.js +71 -104
  79. package/2D/valueAndUnit.js.map +1 -1
  80. package/2D/xmlLoader.js +70 -84
  81. package/2D/xmlLoader.js.map +1 -1
  82. package/3D/behaviors/defaultBehavior.js +40 -59
  83. package/3D/behaviors/defaultBehavior.js.map +1 -1
  84. package/3D/controls/abstractButton3D.js +8 -12
  85. package/3D/controls/abstractButton3D.js.map +1 -1
  86. package/3D/controls/button3D.js +30 -35
  87. package/3D/controls/button3D.js.map +1 -1
  88. package/3D/controls/container3D.js +57 -71
  89. package/3D/controls/container3D.js.map +1 -1
  90. package/3D/controls/contentDisplay3D.js +47 -60
  91. package/3D/controls/contentDisplay3D.js.map +1 -1
  92. package/3D/controls/control3D.js +123 -158
  93. package/3D/controls/control3D.js.map +1 -1
  94. package/3D/controls/cylinderPanel.js +28 -38
  95. package/3D/controls/cylinderPanel.js.map +1 -1
  96. package/3D/controls/handMenu.js +20 -29
  97. package/3D/controls/handMenu.js.map +1 -1
  98. package/3D/controls/holographicBackplate.js +52 -72
  99. package/3D/controls/holographicBackplate.js.map +1 -1
  100. package/3D/controls/holographicButton.js +160 -200
  101. package/3D/controls/holographicButton.js.map +1 -1
  102. package/3D/controls/holographicSlate.js +176 -206
  103. package/3D/controls/holographicSlate.js.map +1 -1
  104. package/3D/controls/meshButton3D.js +24 -30
  105. package/3D/controls/meshButton3D.js.map +1 -1
  106. package/3D/controls/nearMenu.js +57 -71
  107. package/3D/controls/nearMenu.js.map +1 -1
  108. package/3D/controls/planePanel.js +6 -13
  109. package/3D/controls/planePanel.js.map +1 -1
  110. package/3D/controls/scatterPanel.js +43 -54
  111. package/3D/controls/scatterPanel.js.map +1 -1
  112. package/3D/controls/slider3D.js +168 -222
  113. package/3D/controls/slider3D.js.map +1 -1
  114. package/3D/controls/spherePanel.js +29 -39
  115. package/3D/controls/spherePanel.js.map +1 -1
  116. package/3D/controls/stackPanel3D.js +36 -49
  117. package/3D/controls/stackPanel3D.js.map +1 -1
  118. package/3D/controls/touchButton3D.js +126 -154
  119. package/3D/controls/touchButton3D.js.map +1 -1
  120. package/3D/controls/touchHolographicButton.js +223 -272
  121. package/3D/controls/touchHolographicButton.js.map +1 -1
  122. package/3D/controls/touchHolographicMenu.js +55 -66
  123. package/3D/controls/touchHolographicMenu.js.map +1 -1
  124. package/3D/controls/touchMeshButton3D.js +24 -30
  125. package/3D/controls/touchMeshButton3D.js.map +1 -1
  126. package/3D/controls/volumeBasedPanel.js +85 -107
  127. package/3D/controls/volumeBasedPanel.js.map +1 -1
  128. package/3D/gizmos/gizmoHandle.js +68 -103
  129. package/3D/gizmos/gizmoHandle.js.map +1 -1
  130. package/3D/gizmos/slateGizmo.js +165 -182
  131. package/3D/gizmos/slateGizmo.js.map +1 -1
  132. package/3D/gui3DManager.js +76 -101
  133. package/3D/gui3DManager.js.map +1 -1
  134. package/3D/materials/fluent/fluentMaterial.js +110 -119
  135. package/3D/materials/fluent/fluentMaterial.js.map +1 -1
  136. package/3D/materials/fluent/shaders/fluent.fragment.js +20 -3
  137. package/3D/materials/fluent/shaders/fluent.fragment.js.map +1 -1
  138. package/3D/materials/fluent/shaders/fluent.vertex.js +11 -3
  139. package/3D/materials/fluent/shaders/fluent.vertex.js.map +1 -1
  140. package/3D/materials/fluentBackplate/fluentBackplateMaterial.js +168 -177
  141. package/3D/materials/fluentBackplate/fluentBackplateMaterial.js.map +1 -1
  142. package/3D/materials/fluentBackplate/shaders/fluentBackplate.fragment.js +9 -3
  143. package/3D/materials/fluentBackplate/shaders/fluentBackplate.fragment.js.map +1 -1
  144. package/3D/materials/fluentBackplate/shaders/fluentBackplate.vertex.js +15 -3
  145. package/3D/materials/fluentBackplate/shaders/fluentBackplate.vertex.js.map +1 -1
  146. package/3D/materials/fluentButton/fluentButtonMaterial.js +205 -213
  147. package/3D/materials/fluentButton/fluentButtonMaterial.js.map +1 -1
  148. package/3D/materials/fluentButton/shaders/fluentButton.fragment.js +6 -3
  149. package/3D/materials/fluentButton/shaders/fluentButton.fragment.js.map +1 -1
  150. package/3D/materials/fluentButton/shaders/fluentButton.vertex.js +6 -3
  151. package/3D/materials/fluentButton/shaders/fluentButton.vertex.js.map +1 -1
  152. package/3D/materials/handle/handleMaterial.js +56 -69
  153. package/3D/materials/handle/handleMaterial.js.map +1 -1
  154. package/3D/materials/handle/shaders/handle.fragment.js +3 -3
  155. package/3D/materials/handle/shaders/handle.fragment.js.map +1 -1
  156. package/3D/materials/handle/shaders/handle.vertex.js +3 -3
  157. package/3D/materials/handle/shaders/handle.vertex.js.map +1 -1
  158. package/3D/materials/mrdl/mrdlBackplateMaterial.js +158 -166
  159. package/3D/materials/mrdl/mrdlBackplateMaterial.js.map +1 -1
  160. package/3D/materials/mrdl/mrdlSliderBarMaterial.js +322 -330
  161. package/3D/materials/mrdl/mrdlSliderBarMaterial.js.map +1 -1
  162. package/3D/materials/mrdl/mrdlSliderThumbMaterial.js +322 -330
  163. package/3D/materials/mrdl/mrdlSliderThumbMaterial.js.map +1 -1
  164. package/3D/materials/mrdl/shaders/mrdlBackplate.fragment.js +9 -3
  165. package/3D/materials/mrdl/shaders/mrdlBackplate.fragment.js.map +1 -1
  166. package/3D/materials/mrdl/shaders/mrdlBackplate.vertex.js +6 -3
  167. package/3D/materials/mrdl/shaders/mrdlBackplate.vertex.js.map +1 -1
  168. package/3D/materials/mrdl/shaders/mrdlSliderBar.fragment.js +24 -3
  169. package/3D/materials/mrdl/shaders/mrdlSliderBar.fragment.js.map +1 -1
  170. package/3D/materials/mrdl/shaders/mrdlSliderBar.vertex.js +12 -3
  171. package/3D/materials/mrdl/shaders/mrdlSliderBar.vertex.js.map +1 -1
  172. package/3D/materials/mrdl/shaders/mrdlSliderThumb.fragment.js +24 -3
  173. package/3D/materials/mrdl/shaders/mrdlSliderThumb.fragment.js.map +1 -1
  174. package/3D/materials/mrdl/shaders/mrdlSliderThumb.vertex.js +12 -3
  175. package/3D/materials/mrdl/shaders/mrdlSliderThumb.vertex.js.map +1 -1
  176. package/3D/vector3WithInfo.js +6 -12
  177. package/3D/vector3WithInfo.js.map +1 -1
  178. package/legacy/legacy.js +1 -1
  179. package/legacy/legacy.js.map +1 -1
  180. 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
- var AdvancedDynamicTexture = /** @class */ (function (_super) {
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
- function AdvancedDynamicTexture(name, width, height, scene, generateMipMaps, samplingMode, invertY) {
38
- if (width === void 0) { width = 0; }
39
- if (height === void 0) { height = 0; }
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;
38
+ /** @hidden */
39
+ this._rootContainer = new Container("root");
45
40
  /** @hidden */
46
- _this._rootContainer = new Container("root");
41
+ this._lastControlOver = {};
47
42
  /** @hidden */
48
- _this._lastControlOver = {};
43
+ this._lastControlDown = {};
49
44
  /** @hidden */
50
- _this._lastControlDown = {};
45
+ this._capturingControl = {};
51
46
  /** @hidden */
52
- _this._capturingControl = {};
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
- _this._linkedControls = new Array();
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
- _this._numLayoutCalls = 0;
61
+ this._numLayoutCalls = 0;
67
62
  /** @hidden */
68
- _this._numRenderCalls = 0;
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
- _this._clipboardData = "";
68
+ this._clipboardData = "";
74
69
  /**
75
70
  * Observable event triggered each time an clipboard event is received from the rendering canvas
76
71
  */
77
- _this.onClipboardObservable = new Observable();
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
- _this.onControlPickedObservable = new Observable();
76
+ this.onControlPickedObservable = new Observable();
82
77
  /**
83
78
  * Observable event triggered before layout is evaluated
84
79
  */
85
- _this.onBeginLayoutObservable = new Observable();
80
+ this.onBeginLayoutObservable = new Observable();
86
81
  /**
87
82
  * Observable event triggered after the layout was evaluated
88
83
  */
89
- _this.onEndLayoutObservable = new Observable();
84
+ this.onEndLayoutObservable = new Observable();
90
85
  /**
91
86
  * Observable event triggered before the texture is rendered
92
87
  */
93
- _this.onBeginRenderObservable = new Observable();
88
+ this.onBeginRenderObservable = new Observable();
94
89
  /**
95
90
  * Observable event triggered after the texture was rendered
96
91
  */
97
- _this.onEndRenderObservable = new Observable();
92
+ this.onEndRenderObservable = new Observable();
98
93
  /**
99
94
  * Gets or sets a boolean defining if alpha is stored as premultiplied
100
95
  */
101
- _this.premulAlpha = false;
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
- _this.applyYInversionOnUpdate = true;
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
- _this.checkPointerEveryFrame = false;
113
- _this._useInvalidateRectOptimization = true;
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
- _this._invalidatedRectangle = null;
116
- _this._clearMeasure = new Measure(0, 0, 0, 0);
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
- _this._onClipboardCopy = function (rawEvt) {
122
- var evt = rawEvt;
123
- var ev = new ClipboardInfo(ClipboardEventTypes.COPY, evt);
124
- _this.onClipboardObservable.notifyObservers(ev);
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
- _this._onClipboardCut = function (rawEvt) {
132
- var evt = rawEvt;
133
- var ev = new ClipboardInfo(ClipboardEventTypes.CUT, evt);
134
- _this.onClipboardObservable.notifyObservers(ev);
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
- _this._onClipboardPaste = function (rawEvt) {
142
- var evt = rawEvt;
143
- var ev = new ClipboardInfo(ClipboardEventTypes.PASTE, evt);
144
- _this.onClipboardObservable.notifyObservers(ev);
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
- _this.parseContent = _this.parseSerializedObject;
154
- scene = _this.getScene();
155
- if (!scene || !_this._texture) {
156
- return _this;
157
- }
158
- _this.applyYInversionOnUpdate = invertY;
159
- _this._rootElement = scene.getEngine().getInputElement();
160
- _this._renderObserver = scene.onBeforeCameraRenderObservable.add(function (camera) { return _this._checkUpdate(camera); });
161
- _this._preKeyboardObserver = scene.onPreKeyboardObservable.add(function (info) {
162
- if (!_this._focusedControl) {
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
- _this._focusedControl.processKeyboard(info.event);
161
+ this._focusedControl.processKeyboard(info.event);
167
162
  }
168
163
  info.skipOnPointerObservable = true;
169
164
  });
170
- _this._rootContainer._link(_this);
171
- _this.hasAlpha = true;
165
+ this._rootContainer._link(this);
166
+ this.hasAlpha = true;
172
167
  if (!width || !height) {
173
- _this._resizeObserver = scene.getEngine().onResizeObservable.add(function () { return _this._onResize(); });
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
- enumerable: false,
211
- configurable: true
212
- });
213
- Object.defineProperty(AdvancedDynamicTexture.prototype, "background", {
214
- /** Gets or sets the background color */
215
- get: function () {
216
- return this._background;
217
- },
218
- set: function (value) {
219
- if (this._background === value) {
220
- return;
221
- }
222
- this._background = value;
223
- this.markAsDirty();
224
- },
225
- enumerable: false,
226
- configurable: true
227
- });
228
- Object.defineProperty(AdvancedDynamicTexture.prototype, "idealWidth", {
229
- /**
230
- * Gets or sets the ideal width used to design controls.
231
- * The GUI will then rescale everything accordingly
232
- * @see https://doc.babylonjs.com/how_to/gui#adaptive-scaling
233
- */
234
- get: function () {
235
- return this._idealWidth;
236
- },
237
- set: function (value) {
238
- if (this._idealWidth === value) {
239
- return;
240
- }
241
- this._idealWidth = value;
242
- this.markAsDirty();
243
- this._rootContainer._markAllAsDirty();
244
- },
245
- enumerable: false,
246
- configurable: true
247
- });
248
- Object.defineProperty(AdvancedDynamicTexture.prototype, "idealHeight", {
249
- /**
250
- * Gets or sets the ideal height used to design controls.
251
- * The GUI will then rescale everything accordingly
252
- * @see https://doc.babylonjs.com/how_to/gui#adaptive-scaling
253
- */
254
- get: function () {
255
- return this._idealHeight;
256
- },
257
- set: function (value) {
258
- if (this._idealHeight === value) {
259
- return;
260
- }
261
- this._idealHeight = value;
262
- this.markAsDirty();
263
- this._rootContainer._markAllAsDirty();
264
- },
265
- enumerable: false,
266
- configurable: true
267
- });
268
- Object.defineProperty(AdvancedDynamicTexture.prototype, "useSmallestIdeal", {
269
- /**
270
- * Gets or sets a boolean indicating if the smallest ideal value must be used if idealWidth and idealHeight are both set
271
- * @see https://doc.babylonjs.com/how_to/gui#adaptive-scaling
272
- */
273
- get: function () {
274
- return this._useSmallestIdeal;
275
- },
276
- set: function (value) {
277
- if (this._useSmallestIdeal === value) {
278
- return;
279
- }
280
- this._useSmallestIdeal = value;
281
- this.markAsDirty();
282
- this._rootContainer._markAllAsDirty();
283
- },
284
- enumerable: false,
285
- configurable: true
286
- });
287
- Object.defineProperty(AdvancedDynamicTexture.prototype, "renderAtIdealSize", {
288
- /**
289
- * Gets or sets a boolean indicating if adaptive scaling must be used
290
- * @see https://doc.babylonjs.com/how_to/gui#adaptive-scaling
291
- */
292
- get: function () {
293
- return this._renderAtIdealSize;
294
- },
295
- set: function (value) {
296
- if (this._renderAtIdealSize === value) {
297
- return;
298
- }
299
- this._renderAtIdealSize = value;
300
- this._onResize();
301
- },
302
- enumerable: false,
303
- configurable: true
304
- });
305
- Object.defineProperty(AdvancedDynamicTexture.prototype, "idealRatio", {
306
- /**
307
- * Gets the ratio used when in "ideal mode"
308
- * @see https://doc.babylonjs.com/how_to/gui#adaptive-scaling
309
- * */
310
- get: function () {
311
- var rwidth = 0;
312
- var rheight = 0;
313
- if (this._idealWidth) {
314
- rwidth = this.getSize().width / this._idealWidth;
315
- }
316
- if (this._idealHeight) {
317
- rheight = this.getSize().height / this._idealHeight;
318
- }
319
- if (this._useSmallestIdeal && this._idealWidth && this._idealHeight) {
320
- return window.innerWidth < window.innerHeight ? rwidth : rheight;
321
- }
322
- if (this._idealWidth) {
323
- // horizontal
324
- return rwidth;
325
- }
326
- if (this._idealHeight) {
327
- // vertical
328
- return rheight;
329
- }
330
- return 1;
331
- },
332
- enumerable: false,
333
- configurable: true
334
- });
335
- Object.defineProperty(AdvancedDynamicTexture.prototype, "layer", {
336
- /**
337
- * Gets the underlying layer used to render the texture when in fullscreen mode
338
- */
339
- get: function () {
340
- return this._layerToDispose;
341
- },
342
- enumerable: false,
343
- configurable: true
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
- AdvancedDynamicTexture.prototype.getChildren = function () {
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
- AdvancedDynamicTexture.prototype.getDescendants = function (directDescendantsOnly, predicate) {
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
- AdvancedDynamicTexture.prototype.getControlsByType = function (typeName) {
378
- return this._rootContainer.getDescendants(false, function (control) { return control.typeName === typeName; });
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
- AdvancedDynamicTexture.prototype.getControlByName = function (name) {
335
+ getControlByName(name) {
386
336
  return this._getControlByKey("name", name);
387
- };
388
- AdvancedDynamicTexture.prototype._getControlByKey = function (key, value) {
389
- return this._rootContainer.getDescendants().find(function (control) { return control[key] === value; }) || null;
390
- };
391
- Object.defineProperty(AdvancedDynamicTexture.prototype, "focusedControl", {
392
- /**
393
- * Gets or sets the current focused control
394
- */
395
- get: function () {
396
- return this._focusedControl;
397
- },
398
- set: function (control) {
399
- if (this._focusedControl == control) {
400
- return;
401
- }
402
- if (this._focusedControl) {
403
- this._focusedControl.onBlur();
404
- }
405
- if (control) {
406
- control.onFocus();
407
- }
408
- this._focusedControl = control;
409
- },
410
- enumerable: false,
411
- configurable: true
412
- });
413
- Object.defineProperty(AdvancedDynamicTexture.prototype, "isForeground", {
414
- /**
415
- * Gets or sets a boolean indicating if the texture must be rendered in background or foreground when in fullscreen mode
416
- */
417
- get: function () {
418
- if (!this.layer) {
419
- return true;
420
- }
421
- return !this.layer.isBackground;
422
- },
423
- set: function (value) {
424
- if (!this.layer) {
425
- return;
426
- }
427
- if (this.layer.isBackground === !value) {
428
- return;
429
- }
430
- this.layer.isBackground = !value;
431
- },
432
- enumerable: false,
433
- configurable: true
434
- });
435
- Object.defineProperty(AdvancedDynamicTexture.prototype, "clipboardData", {
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
- AdvancedDynamicTexture.prototype.getClassName = function () {
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
- AdvancedDynamicTexture.prototype.executeOnAllControls = function (func, container) {
398
+ executeOnAllControls(func, container) {
461
399
  if (!container) {
462
400
  container = this._rootContainer;
463
401
  }
464
402
  func(container);
465
- for (var _i = 0, _a = container.children; _i < _a.length; _i++) {
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
- Object.defineProperty(AdvancedDynamicTexture.prototype, "useInvalidateRectOptimization", {
475
- /**
476
- * Gets or sets a boolean indicating if the InvalidateRect optimization should be turned on
477
- */
478
- get: function () {
479
- return this._useInvalidateRectOptimization;
480
- },
481
- set: function (value) {
482
- this._useInvalidateRectOptimization = value;
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
- AdvancedDynamicTexture.prototype.invalidateRect = function (invalidMinX, invalidMinY, invalidMaxX, invalidMaxY) {
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
- var maxX = Math.ceil(Math.max(this._invalidatedRectangle.left + this._invalidatedRectangle.width - 1, invalidMaxX));
504
- var maxY = Math.ceil(Math.max(this._invalidatedRectangle.top + this._invalidatedRectangle.height - 1, invalidMaxY));
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
- AdvancedDynamicTexture.prototype.markAsDirty = function () {
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
- AdvancedDynamicTexture.prototype.createStyle = function () {
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
- AdvancedDynamicTexture.prototype.addControl = function (control) {
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
- AdvancedDynamicTexture.prototype.removeControl = function (control) {
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
- AdvancedDynamicTexture.prototype.moveToNonOverlappedPosition = function (overlapGroup, deltaStep, repelFactor) {
551
- if (deltaStep === void 0) { deltaStep = 1; }
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
- var descendants = this.getDescendants(true);
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(function (c) { return c.overlapGroup !== undefined; }) : descendants.filter(function (c) { return c.overlapGroup === overlapGroup; });
492
+ controlsForGroup = overlapGroup === undefined ? descendants.filter((c) => c.overlapGroup !== undefined) : descendants.filter((c) => c.overlapGroup === overlapGroup);
562
493
  }
563
- controlsForGroup.forEach(function (control1) {
564
- var _a;
565
- var velocity = Vector2.Zero();
566
- var center = new Vector2(control1.centerX, control1.centerY);
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
- var diff = center.subtract(new Vector2(control2.centerX, control2.centerY));
571
- var diffLength = diff.length();
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 * ((_a = control1.overlapDeltaMultiplier) !== null && _a !== void 0 ? _a : 1));
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
- AdvancedDynamicTexture.prototype.dispose = function () {
590
- var scene = this.getScene();
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
- _super.prototype.dispose.call(this);
630
- };
631
- AdvancedDynamicTexture.prototype._onResize = function () {
632
- var scene = this.getScene();
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
- var engine = scene.getEngine();
638
- var textureSize = this.getSize();
639
- var renderWidth = engine.getRenderWidth() * this._renderScale;
640
- var renderHeight = engine.getRenderHeight() * this._renderScale;
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
- AdvancedDynamicTexture.prototype._getGlobalViewport = function () {
662
- var size = this.getSize();
663
- var globalViewPort = this._fullscreenViewport.toGlobal(size.width, size.height);
664
- var targetX = Math.round(globalViewPort.width * (1 / this.rootContainer.scaleX));
665
- var targetY = Math.round(globalViewPort.height * (1 / this.rootContainer.scaleY));
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
- AdvancedDynamicTexture.prototype.getProjectedPosition = function (position, worldMatrix) {
679
- var result = this.getProjectedPositionWithZ(position, worldMatrix);
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
- AdvancedDynamicTexture.prototype.getProjectedPositionWithZ = function (position, worldMatrix) {
689
- var scene = this.getScene();
618
+ getProjectedPositionWithZ(position, worldMatrix) {
619
+ const scene = this.getScene();
690
620
  if (!scene) {
691
621
  return Vector3.Zero();
692
622
  }
693
- var globalViewport = this._getGlobalViewport();
694
- var projectedPosition = Vector3.Project(position, worldMatrix, scene.getTransformMatrix(), globalViewport);
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
- AdvancedDynamicTexture.prototype._checkUpdate = function (camera) {
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
- var scene = this.getScene();
634
+ const scene = this.getScene();
705
635
  if (!scene) {
706
636
  return;
707
637
  }
708
- var globalViewport = this._getGlobalViewport();
709
- var _loop_1 = function (control) {
638
+ const globalViewport = this._getGlobalViewport();
639
+ for (const control of this._linkedControls) {
710
640
  if (!control.isVisible) {
711
- return "continue";
641
+ continue;
712
642
  }
713
- var mesh = control._linkedMesh;
643
+ const mesh = control._linkedMesh;
714
644
  if (!mesh || mesh.isDisposed()) {
715
- Tools.SetImmediate(function () {
645
+ Tools.SetImmediate(() => {
716
646
  control.linkWithMesh(null);
717
647
  });
718
- return "continue";
648
+ continue;
719
649
  }
720
- var position = mesh.getBoundingInfo ? mesh.getBoundingInfo().boundingSphere.center : Vector3.ZeroReadOnly;
721
- var projectedPosition = Vector3.Project(position, mesh.getWorldMatrix(), scene.getTransformMatrix(), globalViewport);
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
- return "continue";
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
- AdvancedDynamicTexture.prototype._render = function () {
742
- var textureSize = this.getSize();
743
- var renderWidth = textureSize.width;
744
- var renderHeight = textureSize.height;
745
- var context = this.getContext();
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
- var measure = new Measure(0, 0, renderWidth, renderHeight);
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
- AdvancedDynamicTexture.prototype._changeCursor = function (cursor) {
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
- AdvancedDynamicTexture.prototype._registerLastControlDown = function (control, pointerId) {
717
+ _registerLastControlDown(control, pointerId) {
792
718
  this._lastControlDown[pointerId] = control;
793
719
  this.onControlPickedObservable.notifyObservers(control);
794
- };
795
- AdvancedDynamicTexture.prototype._doPicking = function (x, y, pi, type, pointerId, buttonIndex, deltaX, deltaY) {
796
- var scene = this.getScene();
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
- var engine = scene.getEngine();
801
- var textureSize = this.getSize();
726
+ const engine = scene.getEngine();
727
+ const textureSize = this.getSize();
802
728
  if (this._isFullscreen) {
803
- var camera = scene.cameraToUseForPointers || scene.activeCamera;
729
+ const camera = scene.cameraToUseForPointers || scene.activeCamera;
804
730
  if (!camera) {
805
731
  return;
806
732
  }
807
- var viewport = camera.viewport;
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
- AdvancedDynamicTexture.prototype._cleanControlAfterRemovalFromList = function (list, control) {
841
- for (var pointerId in list) {
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
- var lastControlOver = list[pointerId];
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
- AdvancedDynamicTexture.prototype._cleanControlAfterRemoval = function (control) {
781
+ _cleanControlAfterRemoval(control) {
856
782
  this._cleanControlAfterRemovalFromList(this._lastControlDown, control);
857
783
  this._cleanControlAfterRemovalFromList(this._lastControlOver, control);
858
- };
859
- AdvancedDynamicTexture.prototype._translateToPicking = function (scene, tempViewport, pi) {
860
- var camera = scene.cameraToUseForPointers || scene.activeCamera;
861
- var engine = scene.getEngine();
862
- var originalCameraToUseForPointers = scene.cameraToUseForPointers;
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
- var rigViewport_1 = new Viewport(0, 0, 1, 1);
873
- camera.rigCameras.forEach(function (rigCamera) {
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(), rigViewport_1);
876
- var x = scene.pointerX / engine.getHardwareScalingLevel() - rigViewport_1.x;
877
- var y = scene.pointerY / engine.getHardwareScalingLevel() - (engine.getRenderHeight() - rigViewport_1.y - rigViewport_1.height);
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 > rigViewport_1.width || y > rigViewport_1.height) {
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 = rigViewport_1.x;
887
- tempViewport.y = rigViewport_1.y;
888
- tempViewport.width = rigViewport_1.width;
889
- tempViewport.height = rigViewport_1.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
- var x = scene.pointerX / engine.getHardwareScalingLevel() - tempViewport.x;
897
- var y = scene.pointerY / engine.getHardwareScalingLevel() - (engine.getRenderHeight() - tempViewport.y - tempViewport.height);
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
- var pointerId = pi.event.pointerId || this._defaultMousePointerId;
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
- AdvancedDynamicTexture.prototype.attach = function () {
916
- var _this = this;
917
- var scene = this.getScene();
841
+ attach() {
842
+ const scene = this.getScene();
918
843
  if (!scene) {
919
844
  return;
920
845
  }
921
- var tempViewport = new Viewport(0, 0, 0, 0);
922
- this._prePointerObserver = scene.onPrePointerObservable.add(function (pi) {
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
- _this._defaultMousePointerId = pi.event.pointerId; // This is required to make sure we have the correct pointer ID for wheel
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
- _this._translateToPicking(scene, tempViewport, pi);
868
+ this._translateToPicking(scene, tempViewport, pi);
939
869
  });
940
- this._attachPickingToSceneRender(scene, function () { return _this._translateToPicking(scene, tempViewport, null); }, false);
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
- AdvancedDynamicTexture.prototype.registerClipboardEvents = function () {
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
- AdvancedDynamicTexture.prototype.unRegisterClipboardEvents = function () {
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
- AdvancedDynamicTexture.prototype.attachToMesh = function (mesh, supportPointerMove) {
966
- var _this = this;
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(function (pi) {
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
- _this._defaultMousePointerId = pi.event.pointerId; // This is required to make sure we have the correct pointer ID for wheel
957
+ this._defaultMousePointerId = pi.event.pointerId; // This is required to make sure we have the correct pointer ID for wheel
981
958
  }
982
- var pointerId = pi.event.pointerId || _this._defaultMousePointerId;
959
+ const pointerId = pi.event.pointerId || this._defaultMousePointerId;
983
960
  if (pi.pickInfo && pi.pickInfo.hit && pi.pickInfo.pickedMesh === mesh) {
984
- var uv = pi.pickInfo.getTextureCoordinates();
961
+ let uv = pi.pickInfo.getTextureCoordinates();
985
962
  if (uv) {
986
- var size = _this.getSize();
987
- _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);
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 (_this._lastControlDown[pointerId]) {
992
- _this._lastControlDown[pointerId]._forcePointerUp(pointerId);
969
+ if (this._lastControlDown[pointerId]) {
970
+ this._lastControlDown[pointerId]._forcePointerUp(pointerId);
993
971
  }
994
- delete _this._lastControlDown[pointerId];
995
- if (_this.focusedControl) {
996
- var friendlyControls = _this.focusedControl.keepsFocusWith();
997
- var canMoveFocus = true;
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 (var _i = 0, friendlyControls_1 = friendlyControls; _i < friendlyControls_1.length; _i++) {
1000
- var control = friendlyControls_1[_i];
977
+ for (const control of friendlyControls) {
1001
978
  // Same host, no need to keep the focus
1002
- if (_this === control._host) {
979
+ if (this === control._host) {
1003
980
  continue;
1004
981
  }
1005
982
  // Different hosts
1006
- var otherHost = control._host;
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
- _this.focusedControl = null;
991
+ this.focusedControl = null;
1015
992
  }
1016
993
  }
1017
994
  }
1018
995
  else if (pi.type === PointerEventTypes.POINTERMOVE) {
1019
- if (_this._lastControlOver[pointerId]) {
1020
- _this._lastControlOver[pointerId]._onPointerOut(_this._lastControlOver[pointerId], pi, true);
996
+ if (this._lastControlOver[pointerId]) {
997
+ this._lastControlOver[pointerId]._onPointerOut(this._lastControlOver[pointerId], pi, true);
1021
998
  }
1022
- delete _this._lastControlOver[pointerId];
999
+ delete this._lastControlOver[pointerId];
1023
1000
  }
1024
1001
  });
1025
1002
  mesh.enablePointerMoveEvents = supportPointerMove;
1026
- this._attachPickingToSceneRender(scene, function () {
1027
- var pointerId = _this._defaultMousePointerId;
1028
- var pick = scene === null || scene === void 0 ? void 0 : scene.pick(scene.pointerX, scene.pointerY);
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
- var uv = pick.getTextureCoordinates();
1007
+ let uv = pick.getTextureCoordinates();
1031
1008
  if (uv) {
1032
- var size = _this.getSize();
1033
- _this._doPicking(uv.x * size.width, (_this.applyYInversionOnUpdate ? 1.0 - uv.y : uv.y) * size.height, null, PointerEventTypes.POINTERMOVE, pointerId, 0);
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 (_this._lastControlOver[pointerId]) {
1038
- _this._lastControlOver[pointerId]._onPointerOut(_this._lastControlOver[pointerId], null, true);
1015
+ if (this._lastControlOver[pointerId]) {
1016
+ this._lastControlOver[pointerId]._onPointerOut(this._lastControlOver[pointerId], null, true);
1039
1017
  }
1040
- delete _this._lastControlOver[pointerId];
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
- AdvancedDynamicTexture.prototype.moveFocusToControl = function (control) {
1028
+ moveFocusToControl(control) {
1051
1029
  this.focusedControl = control;
1052
1030
  this._lastPickedControl = control;
1053
1031
  this._blockNextFocusCheck = true;
1054
- };
1055
- AdvancedDynamicTexture.prototype._manageFocus = function () {
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
- AdvancedDynamicTexture.prototype._attachPickingToSceneRender = function (scene, pickFunction, forcePicking) {
1072
- var _this = this;
1073
- this._sceneRenderObserver = scene.onBeforeRenderObservable.add(function () {
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 (_this._linkedControls.length > 0 || forcePicking) {
1054
+ if (this._linkedControls.length > 0 || forcePicking) {
1078
1055
  pickFunction();
1079
1056
  }
1080
1057
  });
1081
- };
1082
- AdvancedDynamicTexture.prototype._attachToOnPointerOut = function (scene) {
1083
- var _this = this;
1084
- this._canvasPointerOutObserver = scene.getEngine().onCanvasPointerOutObservable.add(function (pointerEvent) {
1085
- if (_this._lastControlOver[pointerEvent.pointerId]) {
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 _this._lastControlOver[pointerEvent.pointerId];
1089
- if (_this._lastControlDown[pointerEvent.pointerId] && _this._lastControlDown[pointerEvent.pointerId] !== _this._capturingControl[pointerEvent.pointerId]) {
1090
- _this._lastControlDown[pointerEvent.pointerId]._forcePointerUp(pointerEvent.pointerId);
1091
- delete _this._lastControlDown[pointerEvent.pointerId];
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
- AdvancedDynamicTexture.prototype._attachToOnBlur = function (scene) {
1096
- var _this = this;
1097
- this._canvasBlurObserver = scene.getEngine().onCanvasBlurObservable.add(function () {
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
- _this.focusedControl = null;
1103
- _this._lastControlDown = {};
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
- AdvancedDynamicTexture.prototype.serializeContent = function () {
1111
- var size = this.getSize();
1112
- var serializationObject = {
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
- AdvancedDynamicTexture.prototype.parseSerializedObject = function (serializedObject, scaleToSize) {
1099
+ parseSerializedObject(serializedObject, scaleToSize) {
1126
1100
  this._rootContainer = Control.Parse(serializedObject.root, this);
1127
1101
  if (scaleToSize) {
1128
- var width = serializedObject.width;
1129
- var height = serializedObject.height;
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
- AdvancedDynamicTexture.ParseFromSnippetAsync = function (snippetId, scaleToSize, appendToAdt) {
1147
- return __awaiter(this, void 0, void 0, function () {
1148
- var adt, serialized;
1149
- return __generator(this, function (_a) {
1150
- switch (_a.label) {
1151
- case 0:
1152
- adt = appendToAdt !== null && appendToAdt !== void 0 ? appendToAdt : AdvancedDynamicTexture.CreateFullscreenUI("ADT from snippet");
1153
- if (snippetId === "_BLANK") {
1154
- return [2 /*return*/, adt];
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
- AdvancedDynamicTexture.prototype.parseFromSnippetAsync = function (snippetId, scaleToSize) {
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
- AdvancedDynamicTexture.ParseFromFileAsync = function (url, scaleToSize, appendToAdt) {
1182
- return __awaiter(this, void 0, void 0, function () {
1183
- var adt, serialized;
1184
- return __generator(this, function (_a) {
1185
- switch (_a.label) {
1186
- case 0:
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
- AdvancedDynamicTexture.prototype.parseFromURLAsync = function (url, scaleToSize) {
1157
+ parseFromURLAsync(url, scaleToSize) {
1204
1158
  return AdvancedDynamicTexture.ParseFromFileAsync(url, scaleToSize, this);
1205
- };
1206
- AdvancedDynamicTexture._LoadURLContentAsync = function (url, snippet) {
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(function (resolve, reject) {
1212
- var request = new WebRequest();
1213
- request.addEventListener("readystatechange", function () {
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
- var gui = snippet ? JSON.parse(JSON.parse(request.responseText).jsonPayload).gui : request.responseText;
1217
- var serializationObject = JSON.parse(gui);
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
- AdvancedDynamicTexture._Overlaps = function (control1, control2) {
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
- AdvancedDynamicTexture.CreateForMesh = function (mesh, width, height, supportPointerMove, onlyAlphaTesting, invertY, materialSetupCallback) {
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
- var uniqueId = RandomGUID();
1261
- var result = new AdvancedDynamicTexture("AdvancedDynamicTexture for ".concat(mesh.name, " [").concat(uniqueId, "]"), width, height, mesh.getScene(), true, Texture.TRILINEAR_SAMPLINGMODE, invertY);
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
- AdvancedDynamicTexture._CreateMaterial = function (mesh, uniqueId, texture, onlyAlphaTesting) {
1267
- var internalClassType = GetClass("BABYLON.StandardMaterial");
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
- var material = new internalClassType("AdvancedDynamicTextureMaterial for ".concat(mesh.name, " [").concat(uniqueId, "]"), mesh.getScene());
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
- AdvancedDynamicTexture.CreateForMeshTexture = function (mesh, width, height, supportPointerMove, invertY) {
1296
- if (width === void 0) { width = 1024; }
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
- AdvancedDynamicTexture.CreateFullscreenUI = function (name, foreground, scene, sampling, adaptiveScaling) {
1317
- if (foreground === void 0) { foreground = true; }
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
- var resultScene = result.getScene();
1324
- var layer = new Layer(name + "_layer", null, resultScene, !foreground);
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
- var newScale = 1 / resultScene.getEngine().getHardwareScalingLevel();
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
- AdvancedDynamicTexture.prototype.scale = function (ratio) {
1342
- _super.prototype.scale.call(this, ratio);
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
- AdvancedDynamicTexture.prototype.scaleTo = function (width, height) {
1351
- _super.prototype.scaleTo.call(this, width, height);
1291
+ scaleTo(width, height) {
1292
+ super.scaleTo(width, height);
1352
1293
  this.markAsDirty();
1353
- };
1354
- /** Define the Uurl to load snippets */
1355
- AdvancedDynamicTexture.SnippetUrl = Constants.SnippetUrl;
1356
- /** Indicates if some optimizations can be performed in GUI GPU management (the downside is additional memory/GPU texture memory used) */
1357
- AdvancedDynamicTexture.AllowGPUOptimizations = true;
1358
- return AdvancedDynamicTexture;
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