@configura/babylon-view 1.6.1 → 2.0.0-alpha.2
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/.eslintrc.json +18 -18
- package/LICENSE +201 -201
- package/README.md +1 -1
- package/dist/animation/AnimatableObject.d.ts +8 -8
- package/dist/animation/AnimatableObject.js +3 -3
- package/dist/animation/animator/Animator.d.ts +33 -33
- package/dist/animation/animator/Animator.js +58 -58
- package/dist/animation/animator/AnimatorEasing.d.ts +16 -16
- package/dist/animation/animator/AnimatorEasing.js +31 -31
- package/dist/animation/animator/AnimatorEasingMatrix.d.ts +14 -14
- package/dist/animation/animator/AnimatorEasingMatrix.js +16 -16
- package/dist/animation/animator/AnimatorHighlight.d.ts +16 -16
- package/dist/animation/animator/AnimatorHighlight.js +32 -32
- package/dist/animation/animator/AnimatorPointToPoint.d.ts +8 -8
- package/dist/animation/animator/AnimatorPointToPoint.js +14 -14
- package/dist/animation/animator/AnimatorQueue.d.ts +13 -13
- package/dist/animation/animator/AnimatorQueue.js +57 -57
- package/dist/animation/animator/AnimatorScale.d.ts +8 -8
- package/dist/animation/animator/AnimatorScale.js +13 -13
- package/dist/animation/animator/AnimatorSpin.d.ts +10 -10
- package/dist/animation/animator/AnimatorSpin.js +13 -13
- package/dist/animation/animator/EasingFunctions.d.ts +35 -35
- package/dist/animation/animator/EasingFunctions.js +137 -137
- package/dist/animation/coordinator/Coordinator.d.ts +28 -28
- package/dist/animation/coordinator/Coordinator.js +53 -53
- package/dist/animation/coordinator/CoordinatorDropAndSpin.d.ts +22 -22
- package/dist/animation/coordinator/CoordinatorDropAndSpin.js +138 -138
- package/dist/animation/coordinator/CoordinatorIdentity.d.ts +11 -11
- package/dist/animation/coordinator/CoordinatorIdentity.js +14 -14
- package/dist/animation/coordinator/CoordinatorNodeQueues.d.ts +18 -18
- package/dist/animation/coordinator/CoordinatorNodeQueues.js +50 -50
- package/dist/animation/coordinator/CoordinatorPulse.d.ts +21 -21
- package/dist/animation/coordinator/CoordinatorPulse.js +47 -47
- package/dist/animation/coordinator/CoordinatorPulseBounce.d.ts +14 -14
- package/dist/animation/coordinator/CoordinatorPulseBounce.js +35 -35
- package/dist/animation/coordinator/CoordinatorPulseHighlight.d.ts +13 -13
- package/dist/animation/coordinator/CoordinatorPulseHighlight.js +29 -29
- package/dist/animation/coordinator/CoordinatorPulseInflate.d.ts +14 -14
- package/dist/animation/coordinator/CoordinatorPulseInflate.js +23 -23
- package/dist/camera/CameraCreator.d.ts +5 -5
- package/dist/camera/CameraCreator.js +4 -4
- package/dist/camera/CfgArcRotateCameraPointersInput.d.ts +26 -26
- package/dist/camera/CfgArcRotateCameraPointersInput.js +266 -266
- package/dist/camera/CfgOrbitalCamera.d.ts +73 -68
- package/dist/camera/CfgOrbitalCamera.js +260 -250
- package/dist/camera/CfgOrbitalCameraControlProps.d.ts +11 -6
- package/dist/camera/CfgOrbitalCameraControlProps.js +6 -3
- package/dist/camera/GradingApplier.d.ts +3 -3
- package/dist/camera/GradingApplier.js +48 -48
- package/dist/engine/EngineCreator.d.ts +3 -3
- package/dist/engine/EngineCreator.js +10 -10
- package/dist/geometry/CfgGeometry.d.ts +29 -29
- package/dist/geometry/CfgGeometry.js +146 -146
- package/dist/geometry/CfgMesh.d.ts +10 -10
- package/dist/geometry/CfgMesh.js +38 -38
- package/dist/geometry/geoSplitter.d.ts +8 -8
- package/dist/geometry/geoSplitter.js +192 -192
- package/dist/geometry/stretch/CfgMorphTarget.d.ts +15 -15
- package/dist/geometry/stretch/CfgMorphTarget.js +65 -65
- package/dist/geometry/stretch/CfgStretchData.d.ts +116 -116
- package/dist/geometry/stretch/CfgStretchData.js +350 -350
- package/dist/geometry/stretch/CfgStretchMorphGeometry.d.ts +16 -16
- package/dist/geometry/stretch/CfgStretchMorphGeometry.js +95 -95
- package/dist/index.d.ts +16 -13
- package/dist/index.js +16 -13
- package/dist/io/CfgHistoryToCameraConfConnector.d.ts +30 -0
- package/dist/io/CfgHistoryToCameraConfConnector.js +80 -0
- package/dist/io/CfgIOCameraConfConnector.d.ts +36 -0
- package/dist/io/CfgIOCameraConfConnector.js +82 -0
- package/dist/io/CfgObservableStateToCameraConfConnector.d.ts +11 -0
- package/dist/io/CfgObservableStateToCameraConfConnector.js +11 -0
- package/dist/io/CfgWindowMessageToCameraConfConnector.d.ts +11 -0
- package/dist/io/CfgWindowMessageToCameraConfConnector.js +11 -0
- package/dist/light/CfgDirectionalLight.d.ts +8 -8
- package/dist/light/CfgDirectionalLight.js +18 -18
- package/dist/light/CfgHemisphericLight.d.ts +7 -7
- package/dist/light/CfgHemisphericLight.js +17 -17
- package/dist/light/CfgPointLight.d.ts +8 -8
- package/dist/light/CfgPointLight.js +18 -18
- package/dist/light/DefaultLightRig.d.ts +19 -19
- package/dist/light/DefaultLightRig.js +77 -77
- package/dist/light/LightRigCreator.d.ts +9 -9
- package/dist/light/LightRigCreator.js +3 -3
- package/dist/material/CfgMaterial.d.ts +68 -68
- package/dist/material/CfgMaterial.js +482 -482
- package/dist/material/DummyMaterialCreator.d.ts +4 -4
- package/dist/material/DummyMaterialCreator.js +15 -15
- package/dist/material/material.d.ts +18 -18
- package/dist/material/material.js +128 -128
- package/dist/material/texture.d.ts +14 -14
- package/dist/material/texture.js +306 -306
- package/dist/nodes/CfgContentRootNode.d.ts +19 -19
- package/dist/nodes/CfgContentRootNode.js +75 -75
- package/dist/nodes/CfgDeferredMeshNode.d.ts +55 -55
- package/dist/nodes/CfgDeferredMeshNode.js +378 -378
- package/dist/nodes/CfgProductNode.d.ts +127 -127
- package/dist/nodes/CfgProductNode.js +598 -598
- package/dist/nodes/CfgSymNode.d.ts +50 -50
- package/dist/nodes/CfgSymNode.js +249 -249
- package/dist/nodes/CfgSymRootNode.d.ts +45 -45
- package/dist/nodes/CfgSymRootNode.js +229 -229
- package/dist/nodes/CfgTransformNode.d.ts +33 -33
- package/dist/nodes/CfgTransformNode.js +83 -83
- package/dist/scene/SceneCreator.d.ts +6 -6
- package/dist/scene/SceneCreator.js +22 -22
- package/dist/utilities/CfgBoundingBox.d.ts +21 -21
- package/dist/utilities/CfgBoundingBox.js +81 -81
- package/dist/utilities/anchor/anchor.d.ts +50 -50
- package/dist/utilities/anchor/anchor.js +133 -133
- package/dist/utilities/anchor/anchorMap.d.ts +20 -20
- package/dist/utilities/anchor/anchorMap.js +111 -111
- package/dist/utilities/utilities3D.d.ts +70 -70
- package/dist/utilities/utilities3D.js +265 -265
- package/dist/utilities/utilitiesColor.d.ts +18 -18
- package/dist/utilities/utilitiesColor.js +50 -50
- package/dist/utilities/utilitiesImage.d.ts +6 -6
- package/dist/utilities/utilitiesImage.js +107 -107
- package/dist/utilities/utilitiesSymRootIdentifier.d.ts +7 -7
- package/dist/utilities/utilitiesSymRootIdentifier.js +26 -26
- package/dist/view/BaseView.d.ts +78 -78
- package/dist/view/BaseView.js +303 -303
- package/dist/view/BaseViewConfiguration.d.ts +32 -32
- package/dist/view/BaseViewConfiguration.js +10 -10
- package/dist/view/RenderEnv.d.ts +43 -43
- package/dist/view/RenderEnv.js +7 -7
- package/dist/view/SingleProductDefaultCameraView.d.ts +37 -34
- package/dist/view/SingleProductDefaultCameraView.js +145 -141
- package/dist/view/SingleProductDefaultCameraViewConfiguration.d.ts +42 -46
- package/dist/view/SingleProductDefaultCameraViewConfiguration.js +11 -11
- package/dist/view/SingleProductView.d.ts +44 -42
- package/dist/view/SingleProductView.js +212 -207
- package/dist/view/SingleProductViewConfiguration.d.ts +32 -32
- package/dist/view/SingleProductViewConfiguration.js +19 -19
- package/package.json +5 -5
|
@@ -1,266 +1,266 @@
|
|
|
1
|
-
// Disable eslint since this (mostly) isn't our code
|
|
2
|
-
/* eslint-disable */
|
|
3
|
-
import { ArcRotateCameraPointersInput } from "@babylonjs/core/Cameras/Inputs/arcRotateCameraPointersInput.js";
|
|
4
|
-
import "@babylonjs/core/Engines/Extensions/engine.webVR.js"; // isInVRExclusivePointerMode
|
|
5
|
-
import { PointerEventTypes, } from "@babylonjs/core/Events/pointerEvents.js";
|
|
6
|
-
import { Tools } from "@babylonjs/core/Misc/tools.js";
|
|
7
|
-
/**
|
|
8
|
-
* This class exists to workaround a severe touch input issue that exists on at least iOS 13.4 in
|
|
9
|
-
* Babylon release 4.1.0 and possibly later.
|
|
10
|
-
*
|
|
11
|
-
* The main workaround is marked with "--- START OF WORKAROUND ---" in the source below.
|
|
12
|
-
*
|
|
13
|
-
* Most of the code below is copied from the Babylon source class BaseCameraPointersInput.ts,
|
|
14
|
-
* which ArcRotateCameraPointersInput extends. Some additional private support code from
|
|
15
|
-
* BaseCameraPointersInput is also included and suffixed with "CfgPatch".
|
|
16
|
-
*
|
|
17
|
-
* @warning: DO NOT do any other changes to this file! They WILL be lost when this workaround is no
|
|
18
|
-
* longer needed.
|
|
19
|
-
*
|
|
20
|
-
* @todo Every time the babylon module is updated to a new release, test if the workaround is still
|
|
21
|
-
* needed. If not, simply remove this file and update CfgOrbitalCamera.ts to not use it.
|
|
22
|
-
*/
|
|
23
|
-
export class CfgArcRotateCameraPointersInput extends ArcRotateCameraPointersInput {
|
|
24
|
-
constructor() {
|
|
25
|
-
super(...arguments);
|
|
26
|
-
this._observerCfgPatch = null;
|
|
27
|
-
this._onLostFocusCfgPatch = null;
|
|
28
|
-
this._pointA = null;
|
|
29
|
-
this._pointB = null;
|
|
30
|
-
}
|
|
31
|
-
attachControl(noPreventDefault) {
|
|
32
|
-
noPreventDefault = Tools.BackCompatCameraNoPreventDefault(arguments);
|
|
33
|
-
var engine = this.camera.getEngine();
|
|
34
|
-
const element = engine.getInputElement();
|
|
35
|
-
var previousPinchSquaredDistance = 0;
|
|
36
|
-
var previousMultiTouchPanPosition = null;
|
|
37
|
-
this._pointA = null;
|
|
38
|
-
this._pointB = null;
|
|
39
|
-
this._altKey = false;
|
|
40
|
-
this._ctrlKey = false;
|
|
41
|
-
this._metaKey = false;
|
|
42
|
-
this._shiftKey = false;
|
|
43
|
-
this._buttonsPressed = 0;
|
|
44
|
-
const pointerInput = (p, s) => {
|
|
45
|
-
var evt = p.event;
|
|
46
|
-
let isTouch = evt.pointerType === "touch";
|
|
47
|
-
if (engine.isInVRExclusivePointerMode) {
|
|
48
|
-
return;
|
|
49
|
-
}
|
|
50
|
-
if (p.type !== PointerEventTypes.POINTERMOVE &&
|
|
51
|
-
this.buttons.indexOf(evt.button) === -1) {
|
|
52
|
-
return;
|
|
53
|
-
}
|
|
54
|
-
let srcElement = (evt.srcElement || evt.target);
|
|
55
|
-
this._altKey = evt.altKey;
|
|
56
|
-
this._ctrlKey = evt.ctrlKey;
|
|
57
|
-
this._metaKey = evt.metaKey;
|
|
58
|
-
this._shiftKey = evt.shiftKey;
|
|
59
|
-
this._buttonsPressed = evt.buttons;
|
|
60
|
-
if (engine.isPointerLock) {
|
|
61
|
-
let offsetX = evt.movementX ||
|
|
62
|
-
evt.mozMovementX ||
|
|
63
|
-
evt.webkitMovementX ||
|
|
64
|
-
evt.msMovementX ||
|
|
65
|
-
0;
|
|
66
|
-
let offsetY = evt.movementY ||
|
|
67
|
-
evt.mozMovementY ||
|
|
68
|
-
evt.webkitMovementY ||
|
|
69
|
-
evt.msMovementY ||
|
|
70
|
-
0;
|
|
71
|
-
this.onTouch(null, offsetX, offsetY);
|
|
72
|
-
this._pointA = null;
|
|
73
|
-
this._pointB = null;
|
|
74
|
-
}
|
|
75
|
-
else if (p.type === PointerEventTypes.POINTERDOWN && srcElement) {
|
|
76
|
-
try {
|
|
77
|
-
srcElement.setPointerCapture(evt.pointerId);
|
|
78
|
-
}
|
|
79
|
-
catch (e) {
|
|
80
|
-
//Nothing to do with the error. Execution will continue.
|
|
81
|
-
}
|
|
82
|
-
if (this._pointA === null) {
|
|
83
|
-
this._pointA = {
|
|
84
|
-
x: evt.clientX,
|
|
85
|
-
y: evt.clientY,
|
|
86
|
-
pointerId: evt.pointerId,
|
|
87
|
-
type: evt.pointerType,
|
|
88
|
-
};
|
|
89
|
-
}
|
|
90
|
-
else if (this._pointB === null) {
|
|
91
|
-
this._pointB = {
|
|
92
|
-
x: evt.clientX,
|
|
93
|
-
y: evt.clientY,
|
|
94
|
-
pointerId: evt.pointerId,
|
|
95
|
-
type: evt.pointerType,
|
|
96
|
-
};
|
|
97
|
-
}
|
|
98
|
-
this.onButtonDown(evt);
|
|
99
|
-
if (!noPreventDefault) {
|
|
100
|
-
evt.preventDefault();
|
|
101
|
-
element && element.focus();
|
|
102
|
-
}
|
|
103
|
-
}
|
|
104
|
-
else if (p.type === PointerEventTypes.POINTERDOUBLETAP) {
|
|
105
|
-
this.onDoubleTap(evt.pointerType);
|
|
106
|
-
}
|
|
107
|
-
else if (p.type === PointerEventTypes.POINTERUP && srcElement) {
|
|
108
|
-
try {
|
|
109
|
-
srcElement.releasePointerCapture(evt.pointerId);
|
|
110
|
-
}
|
|
111
|
-
catch (e) {
|
|
112
|
-
//Nothing to do with the error.
|
|
113
|
-
}
|
|
114
|
-
if (!isTouch) {
|
|
115
|
-
this._pointB = null; // Mouse and pen are mono pointer
|
|
116
|
-
}
|
|
117
|
-
//would be better to use pointers.remove(evt.pointerId) for multi-touch gestures,
|
|
118
|
-
//but emptying completely pointers collection is required to fix a bug on iPhone :
|
|
119
|
-
//when changing orientation while pinching camera,
|
|
120
|
-
//one pointer stay pressed forever if we don't release all pointers
|
|
121
|
-
//will be ok to put back pointers.remove(evt.pointerId); when iPhone bug corrected
|
|
122
|
-
if (engine._badOS) {
|
|
123
|
-
this._pointA = this._pointB = null;
|
|
124
|
-
}
|
|
125
|
-
else {
|
|
126
|
-
//only remove the impacted pointer in case of multi-touch allowing on most
|
|
127
|
-
//platforms switching from rotate to zoom and pan seamlessly.
|
|
128
|
-
if (this._pointB && this._pointA && this._pointA.pointerId === evt.pointerId) {
|
|
129
|
-
this._pointA = this._pointB;
|
|
130
|
-
this._pointB = null;
|
|
131
|
-
}
|
|
132
|
-
else if (this._pointA &&
|
|
133
|
-
this._pointB &&
|
|
134
|
-
this._pointB.pointerId === evt.pointerId) {
|
|
135
|
-
this._pointB = null;
|
|
136
|
-
}
|
|
137
|
-
else {
|
|
138
|
-
this._pointA = this._pointB = null;
|
|
139
|
-
}
|
|
140
|
-
}
|
|
141
|
-
if (previousPinchSquaredDistance !== 0 || previousMultiTouchPanPosition) {
|
|
142
|
-
// Previous pinch data is populated but a button has been lifted
|
|
143
|
-
// so pinch has ended.
|
|
144
|
-
this.onMultiTouch(this._pointA, this._pointB, previousPinchSquaredDistance, 0, // pinchSquaredDistance
|
|
145
|
-
previousMultiTouchPanPosition, null // multiTouchPanPosition
|
|
146
|
-
);
|
|
147
|
-
previousPinchSquaredDistance = 0;
|
|
148
|
-
previousMultiTouchPanPosition = null;
|
|
149
|
-
}
|
|
150
|
-
this.onButtonUp(evt);
|
|
151
|
-
if (!noPreventDefault) {
|
|
152
|
-
evt.preventDefault();
|
|
153
|
-
}
|
|
154
|
-
}
|
|
155
|
-
else if (p.type === PointerEventTypes.POINTERMOVE) {
|
|
156
|
-
if (!noPreventDefault) {
|
|
157
|
-
evt.preventDefault();
|
|
158
|
-
}
|
|
159
|
-
// --- START OF WORKAROUND ---
|
|
160
|
-
// At least iOS 13.4 has problems where some touches generates pointer move events
|
|
161
|
-
// without a starting pointer down event nor a finishing pointer up. It appears
|
|
162
|
-
// that the triggering cause is using two fingers at almost the same time.
|
|
163
|
-
//
|
|
164
|
-
// Babylon.js (version 4.1.0 as of this writing) does not gracefully handle this
|
|
165
|
-
// but instead starts flickering between the two different touch points since it
|
|
166
|
-
// does not validate that the pointerID matches the stored point A.
|
|
167
|
-
//
|
|
168
|
-
// Babylon also doesn't properly handle when more than two fingers gets pressed or
|
|
169
|
-
// a third finger gets added, again starting to flicker between the touch points
|
|
170
|
-
// since it only checks if the pointerID is "point A" and assumes that all other
|
|
171
|
-
// touches are "point B".
|
|
172
|
-
//
|
|
173
|
-
// The short code snippet below provides some filtering and workarounds not yet
|
|
174
|
-
// present in Babylon. All other code around this workaround comes from the release
|
|
175
|
-
// version of Babylon 4.1.0, class ArcRotateCameraPointerInput.ts
|
|
176
|
-
if (engine._badOS) {
|
|
177
|
-
// Unknown touch when only one touch is registered, register as second touch
|
|
178
|
-
if (this._pointA && !this._pointB && evt.pointerId !== this._pointA.pointerId) {
|
|
179
|
-
this._pointB = {
|
|
180
|
-
x: evt.clientX,
|
|
181
|
-
y: evt.clientY,
|
|
182
|
-
pointerId: evt.pointerId,
|
|
183
|
-
type: evt.pointerType,
|
|
184
|
-
};
|
|
185
|
-
}
|
|
186
|
-
}
|
|
187
|
-
// The touch does not match either of the registered touches, ignore it
|
|
188
|
-
if (!((this._pointA && this._pointA.pointerId === evt.pointerId) ||
|
|
189
|
-
(this._pointB && this._pointB.pointerId === evt.pointerId))) {
|
|
190
|
-
return;
|
|
191
|
-
}
|
|
192
|
-
// --- END OF WORKAROUND ---
|
|
193
|
-
// One button down
|
|
194
|
-
if (this._pointA && this._pointB === null) {
|
|
195
|
-
var offsetX = evt.clientX - this._pointA.x;
|
|
196
|
-
var offsetY = evt.clientY - this._pointA.y;
|
|
197
|
-
this.onTouch(this._pointA, offsetX, offsetY);
|
|
198
|
-
this._pointA.x = evt.clientX;
|
|
199
|
-
this._pointA.y = evt.clientY;
|
|
200
|
-
}
|
|
201
|
-
// Two buttons down: pinch
|
|
202
|
-
else if (this._pointA && this._pointB) {
|
|
203
|
-
var ed = this._pointA.pointerId === evt.pointerId ? this._pointA : this._pointB;
|
|
204
|
-
ed.x = evt.clientX;
|
|
205
|
-
ed.y = evt.clientY;
|
|
206
|
-
var distX = this._pointA.x - this._pointB.x;
|
|
207
|
-
var distY = this._pointA.y - this._pointB.y;
|
|
208
|
-
var pinchSquaredDistance = distX * distX + distY * distY;
|
|
209
|
-
var multiTouchPanPosition = {
|
|
210
|
-
x: (this._pointA.x + this._pointB.x) / 2,
|
|
211
|
-
y: (this._pointA.y + this._pointB.y) / 2,
|
|
212
|
-
pointerId: evt.pointerId,
|
|
213
|
-
type: p.type,
|
|
214
|
-
};
|
|
215
|
-
this.onMultiTouch(this._pointA, this._pointB, previousPinchSquaredDistance, pinchSquaredDistance, previousMultiTouchPanPosition, multiTouchPanPosition);
|
|
216
|
-
previousMultiTouchPanPosition = multiTouchPanPosition;
|
|
217
|
-
previousPinchSquaredDistance = pinchSquaredDistance;
|
|
218
|
-
}
|
|
219
|
-
}
|
|
220
|
-
};
|
|
221
|
-
this._observerCfgPatch = this.camera
|
|
222
|
-
.getScene()
|
|
223
|
-
.onPointerObservable.add(pointerInput, PointerEventTypes.POINTERDOWN |
|
|
224
|
-
PointerEventTypes.POINTERUP |
|
|
225
|
-
PointerEventTypes.POINTERMOVE);
|
|
226
|
-
this._onLostFocusCfgPatch = () => {
|
|
227
|
-
this._pointA = this._pointB = null;
|
|
228
|
-
previousPinchSquaredDistance = 0;
|
|
229
|
-
previousMultiTouchPanPosition = null;
|
|
230
|
-
this.onLostFocus();
|
|
231
|
-
};
|
|
232
|
-
element &&
|
|
233
|
-
element.addEventListener("contextmenu", this.onContextMenu.bind(this), false);
|
|
234
|
-
let hostWindow = this.camera.getScene().getEngine().getHostWindow();
|
|
235
|
-
if (hostWindow) {
|
|
236
|
-
Tools.RegisterTopRootEvents(hostWindow, [
|
|
237
|
-
{ name: "blur", handler: this._onLostFocusCfgPatch },
|
|
238
|
-
]);
|
|
239
|
-
}
|
|
240
|
-
}
|
|
241
|
-
detachControl(ignored) {
|
|
242
|
-
if (this._onLostFocusCfgPatch) {
|
|
243
|
-
let hostWindow = this.camera.getScene().getEngine().getHostWindow();
|
|
244
|
-
if (hostWindow) {
|
|
245
|
-
Tools.UnregisterTopRootEvents(hostWindow, [
|
|
246
|
-
{ name: "blur", handler: this._onLostFocusCfgPatch },
|
|
247
|
-
]);
|
|
248
|
-
}
|
|
249
|
-
}
|
|
250
|
-
if (this._observerCfgPatch) {
|
|
251
|
-
this.camera.getScene().onPointerObservable.remove(this._observerCfgPatch);
|
|
252
|
-
this._observerCfgPatch = null;
|
|
253
|
-
if (this.onContextMenu) {
|
|
254
|
-
const inputElement = this.camera.getScene().getEngine().getInputElement();
|
|
255
|
-
inputElement &&
|
|
256
|
-
inputElement.removeEventListener("contextmenu", this.onContextMenu);
|
|
257
|
-
}
|
|
258
|
-
this._onLostFocusCfgPatch = null;
|
|
259
|
-
}
|
|
260
|
-
this._altKey = false;
|
|
261
|
-
this._ctrlKey = false;
|
|
262
|
-
this._metaKey = false;
|
|
263
|
-
this._shiftKey = false;
|
|
264
|
-
this._buttonsPressed = 0;
|
|
265
|
-
}
|
|
266
|
-
}
|
|
1
|
+
// Disable eslint since this (mostly) isn't our code
|
|
2
|
+
/* eslint-disable */
|
|
3
|
+
import { ArcRotateCameraPointersInput } from "@babylonjs/core/Cameras/Inputs/arcRotateCameraPointersInput.js";
|
|
4
|
+
import "@babylonjs/core/Engines/Extensions/engine.webVR.js"; // isInVRExclusivePointerMode
|
|
5
|
+
import { PointerEventTypes, } from "@babylonjs/core/Events/pointerEvents.js";
|
|
6
|
+
import { Tools } from "@babylonjs/core/Misc/tools.js";
|
|
7
|
+
/**
|
|
8
|
+
* This class exists to workaround a severe touch input issue that exists on at least iOS 13.4 in
|
|
9
|
+
* Babylon release 4.1.0 and possibly later.
|
|
10
|
+
*
|
|
11
|
+
* The main workaround is marked with "--- START OF WORKAROUND ---" in the source below.
|
|
12
|
+
*
|
|
13
|
+
* Most of the code below is copied from the Babylon source class BaseCameraPointersInput.ts,
|
|
14
|
+
* which ArcRotateCameraPointersInput extends. Some additional private support code from
|
|
15
|
+
* BaseCameraPointersInput is also included and suffixed with "CfgPatch".
|
|
16
|
+
*
|
|
17
|
+
* @warning: DO NOT do any other changes to this file! They WILL be lost when this workaround is no
|
|
18
|
+
* longer needed.
|
|
19
|
+
*
|
|
20
|
+
* @todo Every time the babylon module is updated to a new release, test if the workaround is still
|
|
21
|
+
* needed. If not, simply remove this file and update CfgOrbitalCamera.ts to not use it.
|
|
22
|
+
*/
|
|
23
|
+
export class CfgArcRotateCameraPointersInput extends ArcRotateCameraPointersInput {
|
|
24
|
+
constructor() {
|
|
25
|
+
super(...arguments);
|
|
26
|
+
this._observerCfgPatch = null;
|
|
27
|
+
this._onLostFocusCfgPatch = null;
|
|
28
|
+
this._pointA = null;
|
|
29
|
+
this._pointB = null;
|
|
30
|
+
}
|
|
31
|
+
attachControl(noPreventDefault) {
|
|
32
|
+
noPreventDefault = Tools.BackCompatCameraNoPreventDefault(arguments);
|
|
33
|
+
var engine = this.camera.getEngine();
|
|
34
|
+
const element = engine.getInputElement();
|
|
35
|
+
var previousPinchSquaredDistance = 0;
|
|
36
|
+
var previousMultiTouchPanPosition = null;
|
|
37
|
+
this._pointA = null;
|
|
38
|
+
this._pointB = null;
|
|
39
|
+
this._altKey = false;
|
|
40
|
+
this._ctrlKey = false;
|
|
41
|
+
this._metaKey = false;
|
|
42
|
+
this._shiftKey = false;
|
|
43
|
+
this._buttonsPressed = 0;
|
|
44
|
+
const pointerInput = (p, s) => {
|
|
45
|
+
var evt = p.event;
|
|
46
|
+
let isTouch = evt.pointerType === "touch";
|
|
47
|
+
if (engine.isInVRExclusivePointerMode) {
|
|
48
|
+
return;
|
|
49
|
+
}
|
|
50
|
+
if (p.type !== PointerEventTypes.POINTERMOVE &&
|
|
51
|
+
this.buttons.indexOf(evt.button) === -1) {
|
|
52
|
+
return;
|
|
53
|
+
}
|
|
54
|
+
let srcElement = (evt.srcElement || evt.target);
|
|
55
|
+
this._altKey = evt.altKey;
|
|
56
|
+
this._ctrlKey = evt.ctrlKey;
|
|
57
|
+
this._metaKey = evt.metaKey;
|
|
58
|
+
this._shiftKey = evt.shiftKey;
|
|
59
|
+
this._buttonsPressed = evt.buttons;
|
|
60
|
+
if (engine.isPointerLock) {
|
|
61
|
+
let offsetX = evt.movementX ||
|
|
62
|
+
evt.mozMovementX ||
|
|
63
|
+
evt.webkitMovementX ||
|
|
64
|
+
evt.msMovementX ||
|
|
65
|
+
0;
|
|
66
|
+
let offsetY = evt.movementY ||
|
|
67
|
+
evt.mozMovementY ||
|
|
68
|
+
evt.webkitMovementY ||
|
|
69
|
+
evt.msMovementY ||
|
|
70
|
+
0;
|
|
71
|
+
this.onTouch(null, offsetX, offsetY);
|
|
72
|
+
this._pointA = null;
|
|
73
|
+
this._pointB = null;
|
|
74
|
+
}
|
|
75
|
+
else if (p.type === PointerEventTypes.POINTERDOWN && srcElement) {
|
|
76
|
+
try {
|
|
77
|
+
srcElement.setPointerCapture(evt.pointerId);
|
|
78
|
+
}
|
|
79
|
+
catch (e) {
|
|
80
|
+
//Nothing to do with the error. Execution will continue.
|
|
81
|
+
}
|
|
82
|
+
if (this._pointA === null) {
|
|
83
|
+
this._pointA = {
|
|
84
|
+
x: evt.clientX,
|
|
85
|
+
y: evt.clientY,
|
|
86
|
+
pointerId: evt.pointerId,
|
|
87
|
+
type: evt.pointerType,
|
|
88
|
+
};
|
|
89
|
+
}
|
|
90
|
+
else if (this._pointB === null) {
|
|
91
|
+
this._pointB = {
|
|
92
|
+
x: evt.clientX,
|
|
93
|
+
y: evt.clientY,
|
|
94
|
+
pointerId: evt.pointerId,
|
|
95
|
+
type: evt.pointerType,
|
|
96
|
+
};
|
|
97
|
+
}
|
|
98
|
+
this.onButtonDown(evt);
|
|
99
|
+
if (!noPreventDefault) {
|
|
100
|
+
evt.preventDefault();
|
|
101
|
+
element && element.focus();
|
|
102
|
+
}
|
|
103
|
+
}
|
|
104
|
+
else if (p.type === PointerEventTypes.POINTERDOUBLETAP) {
|
|
105
|
+
this.onDoubleTap(evt.pointerType);
|
|
106
|
+
}
|
|
107
|
+
else if (p.type === PointerEventTypes.POINTERUP && srcElement) {
|
|
108
|
+
try {
|
|
109
|
+
srcElement.releasePointerCapture(evt.pointerId);
|
|
110
|
+
}
|
|
111
|
+
catch (e) {
|
|
112
|
+
//Nothing to do with the error.
|
|
113
|
+
}
|
|
114
|
+
if (!isTouch) {
|
|
115
|
+
this._pointB = null; // Mouse and pen are mono pointer
|
|
116
|
+
}
|
|
117
|
+
//would be better to use pointers.remove(evt.pointerId) for multi-touch gestures,
|
|
118
|
+
//but emptying completely pointers collection is required to fix a bug on iPhone :
|
|
119
|
+
//when changing orientation while pinching camera,
|
|
120
|
+
//one pointer stay pressed forever if we don't release all pointers
|
|
121
|
+
//will be ok to put back pointers.remove(evt.pointerId); when iPhone bug corrected
|
|
122
|
+
if (engine._badOS) {
|
|
123
|
+
this._pointA = this._pointB = null;
|
|
124
|
+
}
|
|
125
|
+
else {
|
|
126
|
+
//only remove the impacted pointer in case of multi-touch allowing on most
|
|
127
|
+
//platforms switching from rotate to zoom and pan seamlessly.
|
|
128
|
+
if (this._pointB && this._pointA && this._pointA.pointerId === evt.pointerId) {
|
|
129
|
+
this._pointA = this._pointB;
|
|
130
|
+
this._pointB = null;
|
|
131
|
+
}
|
|
132
|
+
else if (this._pointA &&
|
|
133
|
+
this._pointB &&
|
|
134
|
+
this._pointB.pointerId === evt.pointerId) {
|
|
135
|
+
this._pointB = null;
|
|
136
|
+
}
|
|
137
|
+
else {
|
|
138
|
+
this._pointA = this._pointB = null;
|
|
139
|
+
}
|
|
140
|
+
}
|
|
141
|
+
if (previousPinchSquaredDistance !== 0 || previousMultiTouchPanPosition) {
|
|
142
|
+
// Previous pinch data is populated but a button has been lifted
|
|
143
|
+
// so pinch has ended.
|
|
144
|
+
this.onMultiTouch(this._pointA, this._pointB, previousPinchSquaredDistance, 0, // pinchSquaredDistance
|
|
145
|
+
previousMultiTouchPanPosition, null // multiTouchPanPosition
|
|
146
|
+
);
|
|
147
|
+
previousPinchSquaredDistance = 0;
|
|
148
|
+
previousMultiTouchPanPosition = null;
|
|
149
|
+
}
|
|
150
|
+
this.onButtonUp(evt);
|
|
151
|
+
if (!noPreventDefault) {
|
|
152
|
+
evt.preventDefault();
|
|
153
|
+
}
|
|
154
|
+
}
|
|
155
|
+
else if (p.type === PointerEventTypes.POINTERMOVE) {
|
|
156
|
+
if (!noPreventDefault) {
|
|
157
|
+
evt.preventDefault();
|
|
158
|
+
}
|
|
159
|
+
// --- START OF WORKAROUND ---
|
|
160
|
+
// At least iOS 13.4 has problems where some touches generates pointer move events
|
|
161
|
+
// without a starting pointer down event nor a finishing pointer up. It appears
|
|
162
|
+
// that the triggering cause is using two fingers at almost the same time.
|
|
163
|
+
//
|
|
164
|
+
// Babylon.js (version 4.1.0 as of this writing) does not gracefully handle this
|
|
165
|
+
// but instead starts flickering between the two different touch points since it
|
|
166
|
+
// does not validate that the pointerID matches the stored point A.
|
|
167
|
+
//
|
|
168
|
+
// Babylon also doesn't properly handle when more than two fingers gets pressed or
|
|
169
|
+
// a third finger gets added, again starting to flicker between the touch points
|
|
170
|
+
// since it only checks if the pointerID is "point A" and assumes that all other
|
|
171
|
+
// touches are "point B".
|
|
172
|
+
//
|
|
173
|
+
// The short code snippet below provides some filtering and workarounds not yet
|
|
174
|
+
// present in Babylon. All other code around this workaround comes from the release
|
|
175
|
+
// version of Babylon 4.1.0, class ArcRotateCameraPointerInput.ts
|
|
176
|
+
if (engine._badOS) {
|
|
177
|
+
// Unknown touch when only one touch is registered, register as second touch
|
|
178
|
+
if (this._pointA && !this._pointB && evt.pointerId !== this._pointA.pointerId) {
|
|
179
|
+
this._pointB = {
|
|
180
|
+
x: evt.clientX,
|
|
181
|
+
y: evt.clientY,
|
|
182
|
+
pointerId: evt.pointerId,
|
|
183
|
+
type: evt.pointerType,
|
|
184
|
+
};
|
|
185
|
+
}
|
|
186
|
+
}
|
|
187
|
+
// The touch does not match either of the registered touches, ignore it
|
|
188
|
+
if (!((this._pointA && this._pointA.pointerId === evt.pointerId) ||
|
|
189
|
+
(this._pointB && this._pointB.pointerId === evt.pointerId))) {
|
|
190
|
+
return;
|
|
191
|
+
}
|
|
192
|
+
// --- END OF WORKAROUND ---
|
|
193
|
+
// One button down
|
|
194
|
+
if (this._pointA && this._pointB === null) {
|
|
195
|
+
var offsetX = evt.clientX - this._pointA.x;
|
|
196
|
+
var offsetY = evt.clientY - this._pointA.y;
|
|
197
|
+
this.onTouch(this._pointA, offsetX, offsetY);
|
|
198
|
+
this._pointA.x = evt.clientX;
|
|
199
|
+
this._pointA.y = evt.clientY;
|
|
200
|
+
}
|
|
201
|
+
// Two buttons down: pinch
|
|
202
|
+
else if (this._pointA && this._pointB) {
|
|
203
|
+
var ed = this._pointA.pointerId === evt.pointerId ? this._pointA : this._pointB;
|
|
204
|
+
ed.x = evt.clientX;
|
|
205
|
+
ed.y = evt.clientY;
|
|
206
|
+
var distX = this._pointA.x - this._pointB.x;
|
|
207
|
+
var distY = this._pointA.y - this._pointB.y;
|
|
208
|
+
var pinchSquaredDistance = distX * distX + distY * distY;
|
|
209
|
+
var multiTouchPanPosition = {
|
|
210
|
+
x: (this._pointA.x + this._pointB.x) / 2,
|
|
211
|
+
y: (this._pointA.y + this._pointB.y) / 2,
|
|
212
|
+
pointerId: evt.pointerId,
|
|
213
|
+
type: p.type,
|
|
214
|
+
};
|
|
215
|
+
this.onMultiTouch(this._pointA, this._pointB, previousPinchSquaredDistance, pinchSquaredDistance, previousMultiTouchPanPosition, multiTouchPanPosition);
|
|
216
|
+
previousMultiTouchPanPosition = multiTouchPanPosition;
|
|
217
|
+
previousPinchSquaredDistance = pinchSquaredDistance;
|
|
218
|
+
}
|
|
219
|
+
}
|
|
220
|
+
};
|
|
221
|
+
this._observerCfgPatch = this.camera
|
|
222
|
+
.getScene()
|
|
223
|
+
.onPointerObservable.add(pointerInput, PointerEventTypes.POINTERDOWN |
|
|
224
|
+
PointerEventTypes.POINTERUP |
|
|
225
|
+
PointerEventTypes.POINTERMOVE);
|
|
226
|
+
this._onLostFocusCfgPatch = () => {
|
|
227
|
+
this._pointA = this._pointB = null;
|
|
228
|
+
previousPinchSquaredDistance = 0;
|
|
229
|
+
previousMultiTouchPanPosition = null;
|
|
230
|
+
this.onLostFocus();
|
|
231
|
+
};
|
|
232
|
+
element &&
|
|
233
|
+
element.addEventListener("contextmenu", this.onContextMenu.bind(this), false);
|
|
234
|
+
let hostWindow = this.camera.getScene().getEngine().getHostWindow();
|
|
235
|
+
if (hostWindow) {
|
|
236
|
+
Tools.RegisterTopRootEvents(hostWindow, [
|
|
237
|
+
{ name: "blur", handler: this._onLostFocusCfgPatch },
|
|
238
|
+
]);
|
|
239
|
+
}
|
|
240
|
+
}
|
|
241
|
+
detachControl(ignored) {
|
|
242
|
+
if (this._onLostFocusCfgPatch) {
|
|
243
|
+
let hostWindow = this.camera.getScene().getEngine().getHostWindow();
|
|
244
|
+
if (hostWindow) {
|
|
245
|
+
Tools.UnregisterTopRootEvents(hostWindow, [
|
|
246
|
+
{ name: "blur", handler: this._onLostFocusCfgPatch },
|
|
247
|
+
]);
|
|
248
|
+
}
|
|
249
|
+
}
|
|
250
|
+
if (this._observerCfgPatch) {
|
|
251
|
+
this.camera.getScene().onPointerObservable.remove(this._observerCfgPatch);
|
|
252
|
+
this._observerCfgPatch = null;
|
|
253
|
+
if (this.onContextMenu) {
|
|
254
|
+
const inputElement = this.camera.getScene().getEngine().getInputElement();
|
|
255
|
+
inputElement &&
|
|
256
|
+
inputElement.removeEventListener("contextmenu", this.onContextMenu);
|
|
257
|
+
}
|
|
258
|
+
this._onLostFocusCfgPatch = null;
|
|
259
|
+
}
|
|
260
|
+
this._altKey = false;
|
|
261
|
+
this._ctrlKey = false;
|
|
262
|
+
this._metaKey = false;
|
|
263
|
+
this._shiftKey = false;
|
|
264
|
+
this._buttonsPressed = 0;
|
|
265
|
+
}
|
|
266
|
+
}
|