hyperbook 0.91.0 → 0.92.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/assets/directive-openscad/OrbitControls.js +1523 -0
- package/dist/assets/directive-openscad/STLLoader.js +411 -0
- package/dist/assets/directive-openscad/client.js +983 -0
- package/dist/assets/directive-openscad/openscad.js +16 -0
- package/dist/assets/directive-openscad/openscad.wasm +0 -0
- package/dist/assets/directive-openscad/style.css +371 -0
- package/dist/assets/directive-openscad/three.module.js +54571 -0
- package/dist/assets/directive-pyide/client.js +11 -2
- package/dist/assets/store.js +2 -1
- package/dist/index.js +221 -1
- package/dist/locales/de.json +14 -0
- package/dist/locales/en.json +14 -0
- package/package.json +4 -4
|
@@ -0,0 +1,1523 @@
|
|
|
1
|
+
import {
|
|
2
|
+
Controls,
|
|
3
|
+
MOUSE,
|
|
4
|
+
Quaternion,
|
|
5
|
+
Spherical,
|
|
6
|
+
TOUCH,
|
|
7
|
+
Vector2,
|
|
8
|
+
Vector3,
|
|
9
|
+
Plane,
|
|
10
|
+
Ray,
|
|
11
|
+
MathUtils
|
|
12
|
+
} from './three.module.js';
|
|
13
|
+
|
|
14
|
+
// OrbitControls performs orbiting, dollying (zooming), and panning.
|
|
15
|
+
// Unlike TrackballControls, it maintains the "up" direction object.up (+Y by default).
|
|
16
|
+
//
|
|
17
|
+
// Orbit - left mouse / touch: one-finger move
|
|
18
|
+
// Zoom - middle mouse, or mousewheel / touch: two-finger spread or squish
|
|
19
|
+
// Pan - right mouse, or left mouse + ctrl/meta/shiftKey, or arrow keys / touch: two-finger move
|
|
20
|
+
|
|
21
|
+
const _changeEvent = { type: 'change' };
|
|
22
|
+
const _startEvent = { type: 'start' };
|
|
23
|
+
const _endEvent = { type: 'end' };
|
|
24
|
+
const _ray = new Ray();
|
|
25
|
+
const _plane = new Plane();
|
|
26
|
+
const _TILT_LIMIT = Math.cos( 70 * MathUtils.DEG2RAD );
|
|
27
|
+
|
|
28
|
+
const _v = new Vector3();
|
|
29
|
+
const _twoPI = 2 * Math.PI;
|
|
30
|
+
|
|
31
|
+
const _STATE = {
|
|
32
|
+
NONE: - 1,
|
|
33
|
+
ROTATE: 0,
|
|
34
|
+
DOLLY: 1,
|
|
35
|
+
PAN: 2,
|
|
36
|
+
TOUCH_ROTATE: 3,
|
|
37
|
+
TOUCH_PAN: 4,
|
|
38
|
+
TOUCH_DOLLY_PAN: 5,
|
|
39
|
+
TOUCH_DOLLY_ROTATE: 6
|
|
40
|
+
};
|
|
41
|
+
const _EPS = 0.000001;
|
|
42
|
+
|
|
43
|
+
class OrbitControls extends Controls {
|
|
44
|
+
|
|
45
|
+
constructor( object, domElement = null ) {
|
|
46
|
+
|
|
47
|
+
super( object, domElement );
|
|
48
|
+
|
|
49
|
+
this.state = _STATE.NONE;
|
|
50
|
+
|
|
51
|
+
// Set to false to disable this control
|
|
52
|
+
this.enabled = true;
|
|
53
|
+
|
|
54
|
+
// "target" sets the location of focus, where the object orbits around
|
|
55
|
+
this.target = new Vector3();
|
|
56
|
+
|
|
57
|
+
// Sets the 3D cursor (similar to Blender), from which the maxTargetRadius takes effect
|
|
58
|
+
this.cursor = new Vector3();
|
|
59
|
+
|
|
60
|
+
// How far you can dolly in and out ( PerspectiveCamera only )
|
|
61
|
+
this.minDistance = 0;
|
|
62
|
+
this.maxDistance = Infinity;
|
|
63
|
+
|
|
64
|
+
// How far you can zoom in and out ( OrthographicCamera only )
|
|
65
|
+
this.minZoom = 0;
|
|
66
|
+
this.maxZoom = Infinity;
|
|
67
|
+
|
|
68
|
+
// Limit camera target within a spherical area around the cursor
|
|
69
|
+
this.minTargetRadius = 0;
|
|
70
|
+
this.maxTargetRadius = Infinity;
|
|
71
|
+
|
|
72
|
+
// How far you can orbit vertically, upper and lower limits.
|
|
73
|
+
// Range is 0 to Math.PI radians.
|
|
74
|
+
this.minPolarAngle = 0; // radians
|
|
75
|
+
this.maxPolarAngle = Math.PI; // radians
|
|
76
|
+
|
|
77
|
+
// How far you can orbit horizontally, upper and lower limits.
|
|
78
|
+
// If set, the interval [ min, max ] must be a sub-interval of [ - 2 PI, 2 PI ], with ( max - min < 2 PI )
|
|
79
|
+
this.minAzimuthAngle = - Infinity; // radians
|
|
80
|
+
this.maxAzimuthAngle = Infinity; // radians
|
|
81
|
+
|
|
82
|
+
// Set to true to enable damping (inertia)
|
|
83
|
+
// If damping is enabled, you must call controls.update() in your animation loop
|
|
84
|
+
this.enableDamping = false;
|
|
85
|
+
this.dampingFactor = 0.05;
|
|
86
|
+
|
|
87
|
+
// This option actually enables dollying in and out; left as "zoom" for backwards compatibility.
|
|
88
|
+
// Set to false to disable zooming
|
|
89
|
+
this.enableZoom = true;
|
|
90
|
+
this.zoomSpeed = 1.0;
|
|
91
|
+
|
|
92
|
+
// Set to false to disable rotating
|
|
93
|
+
this.enableRotate = true;
|
|
94
|
+
this.rotateSpeed = 1.0;
|
|
95
|
+
|
|
96
|
+
// Set to false to disable panning
|
|
97
|
+
this.enablePan = true;
|
|
98
|
+
this.panSpeed = 1.0;
|
|
99
|
+
this.screenSpacePanning = true; // if false, pan orthogonal to world-space direction camera.up
|
|
100
|
+
this.keyPanSpeed = 7.0; // pixels moved per arrow key push
|
|
101
|
+
this.zoomToCursor = false;
|
|
102
|
+
|
|
103
|
+
// Set to true to automatically rotate around the target
|
|
104
|
+
// If auto-rotate is enabled, you must call controls.update() in your animation loop
|
|
105
|
+
this.autoRotate = false;
|
|
106
|
+
this.autoRotateSpeed = 2.0; // 30 seconds per orbit when fps is 60
|
|
107
|
+
|
|
108
|
+
// The four arrow keys
|
|
109
|
+
this.keys = { LEFT: 'ArrowLeft', UP: 'ArrowUp', RIGHT: 'ArrowRight', BOTTOM: 'ArrowDown' };
|
|
110
|
+
|
|
111
|
+
// Mouse buttons
|
|
112
|
+
this.mouseButtons = { LEFT: MOUSE.ROTATE, MIDDLE: MOUSE.DOLLY, RIGHT: MOUSE.PAN };
|
|
113
|
+
|
|
114
|
+
// Touch fingers
|
|
115
|
+
this.touches = { ONE: TOUCH.ROTATE, TWO: TOUCH.DOLLY_PAN };
|
|
116
|
+
|
|
117
|
+
// for reset
|
|
118
|
+
this.target0 = this.target.clone();
|
|
119
|
+
this.position0 = this.object.position.clone();
|
|
120
|
+
this.zoom0 = this.object.zoom;
|
|
121
|
+
|
|
122
|
+
// the target DOM element for key events
|
|
123
|
+
this._domElementKeyEvents = null;
|
|
124
|
+
|
|
125
|
+
// internals
|
|
126
|
+
|
|
127
|
+
this._lastPosition = new Vector3();
|
|
128
|
+
this._lastQuaternion = new Quaternion();
|
|
129
|
+
this._lastTargetPosition = new Vector3();
|
|
130
|
+
|
|
131
|
+
// so camera.up is the orbit axis
|
|
132
|
+
this._quat = new Quaternion().setFromUnitVectors( object.up, new Vector3( 0, 1, 0 ) );
|
|
133
|
+
this._quatInverse = this._quat.clone().invert();
|
|
134
|
+
|
|
135
|
+
// current position in spherical coordinates
|
|
136
|
+
this._spherical = new Spherical();
|
|
137
|
+
this._sphericalDelta = new Spherical();
|
|
138
|
+
|
|
139
|
+
this._scale = 1;
|
|
140
|
+
this._panOffset = new Vector3();
|
|
141
|
+
|
|
142
|
+
this._rotateStart = new Vector2();
|
|
143
|
+
this._rotateEnd = new Vector2();
|
|
144
|
+
this._rotateDelta = new Vector2();
|
|
145
|
+
|
|
146
|
+
this._panStart = new Vector2();
|
|
147
|
+
this._panEnd = new Vector2();
|
|
148
|
+
this._panDelta = new Vector2();
|
|
149
|
+
|
|
150
|
+
this._dollyStart = new Vector2();
|
|
151
|
+
this._dollyEnd = new Vector2();
|
|
152
|
+
this._dollyDelta = new Vector2();
|
|
153
|
+
|
|
154
|
+
this._dollyDirection = new Vector3();
|
|
155
|
+
this._mouse = new Vector2();
|
|
156
|
+
this._performCursorZoom = false;
|
|
157
|
+
|
|
158
|
+
this._pointers = [];
|
|
159
|
+
this._pointerPositions = {};
|
|
160
|
+
|
|
161
|
+
this._controlActive = false;
|
|
162
|
+
|
|
163
|
+
// event listeners
|
|
164
|
+
|
|
165
|
+
this._onPointerMove = onPointerMove.bind( this );
|
|
166
|
+
this._onPointerDown = onPointerDown.bind( this );
|
|
167
|
+
this._onPointerUp = onPointerUp.bind( this );
|
|
168
|
+
this._onContextMenu = onContextMenu.bind( this );
|
|
169
|
+
this._onMouseWheel = onMouseWheel.bind( this );
|
|
170
|
+
this._onKeyDown = onKeyDown.bind( this );
|
|
171
|
+
|
|
172
|
+
this._onTouchStart = onTouchStart.bind( this );
|
|
173
|
+
this._onTouchMove = onTouchMove.bind( this );
|
|
174
|
+
|
|
175
|
+
this._onMouseDown = onMouseDown.bind( this );
|
|
176
|
+
this._onMouseMove = onMouseMove.bind( this );
|
|
177
|
+
|
|
178
|
+
this._interceptControlDown = interceptControlDown.bind( this );
|
|
179
|
+
this._interceptControlUp = interceptControlUp.bind( this );
|
|
180
|
+
|
|
181
|
+
//
|
|
182
|
+
|
|
183
|
+
if ( this.domElement !== null ) {
|
|
184
|
+
|
|
185
|
+
this.connect();
|
|
186
|
+
|
|
187
|
+
}
|
|
188
|
+
|
|
189
|
+
this.update();
|
|
190
|
+
|
|
191
|
+
}
|
|
192
|
+
|
|
193
|
+
connect() {
|
|
194
|
+
|
|
195
|
+
this.domElement.addEventListener( 'pointerdown', this._onPointerDown );
|
|
196
|
+
this.domElement.addEventListener( 'pointercancel', this._onPointerUp );
|
|
197
|
+
|
|
198
|
+
this.domElement.addEventListener( 'contextmenu', this._onContextMenu );
|
|
199
|
+
this.domElement.addEventListener( 'wheel', this._onMouseWheel, { passive: false } );
|
|
200
|
+
|
|
201
|
+
const document = this.domElement.getRootNode(); // offscreen canvas compatibility
|
|
202
|
+
document.addEventListener( 'keydown', this._interceptControlDown, { passive: true, capture: true } );
|
|
203
|
+
|
|
204
|
+
this.domElement.style.touchAction = 'none'; // disable touch scroll
|
|
205
|
+
|
|
206
|
+
}
|
|
207
|
+
|
|
208
|
+
disconnect() {
|
|
209
|
+
|
|
210
|
+
this.domElement.removeEventListener( 'pointerdown', this._onPointerDown );
|
|
211
|
+
this.domElement.removeEventListener( 'pointermove', this._onPointerMove );
|
|
212
|
+
this.domElement.removeEventListener( 'pointerup', this._onPointerUp );
|
|
213
|
+
this.domElement.removeEventListener( 'pointercancel', this._onPointerUp );
|
|
214
|
+
|
|
215
|
+
this.domElement.removeEventListener( 'wheel', this._onMouseWheel );
|
|
216
|
+
this.domElement.removeEventListener( 'contextmenu', this._onContextMenu );
|
|
217
|
+
|
|
218
|
+
this.stopListenToKeyEvents();
|
|
219
|
+
|
|
220
|
+
const document = this.domElement.getRootNode(); // offscreen canvas compatibility
|
|
221
|
+
document.removeEventListener( 'keydown', this._interceptControlDown, { capture: true } );
|
|
222
|
+
|
|
223
|
+
this.domElement.style.touchAction = 'auto';
|
|
224
|
+
|
|
225
|
+
}
|
|
226
|
+
|
|
227
|
+
dispose() {
|
|
228
|
+
|
|
229
|
+
this.disconnect();
|
|
230
|
+
|
|
231
|
+
}
|
|
232
|
+
|
|
233
|
+
getPolarAngle() {
|
|
234
|
+
|
|
235
|
+
return this._spherical.phi;
|
|
236
|
+
|
|
237
|
+
}
|
|
238
|
+
|
|
239
|
+
getAzimuthalAngle() {
|
|
240
|
+
|
|
241
|
+
return this._spherical.theta;
|
|
242
|
+
|
|
243
|
+
}
|
|
244
|
+
|
|
245
|
+
getDistance() {
|
|
246
|
+
|
|
247
|
+
return this.object.position.distanceTo( this.target );
|
|
248
|
+
|
|
249
|
+
}
|
|
250
|
+
|
|
251
|
+
listenToKeyEvents( domElement ) {
|
|
252
|
+
|
|
253
|
+
domElement.addEventListener( 'keydown', this._onKeyDown );
|
|
254
|
+
this._domElementKeyEvents = domElement;
|
|
255
|
+
|
|
256
|
+
}
|
|
257
|
+
|
|
258
|
+
stopListenToKeyEvents() {
|
|
259
|
+
|
|
260
|
+
if ( this._domElementKeyEvents !== null ) {
|
|
261
|
+
|
|
262
|
+
this._domElementKeyEvents.removeEventListener( 'keydown', this._onKeyDown );
|
|
263
|
+
this._domElementKeyEvents = null;
|
|
264
|
+
|
|
265
|
+
}
|
|
266
|
+
|
|
267
|
+
}
|
|
268
|
+
|
|
269
|
+
saveState() {
|
|
270
|
+
|
|
271
|
+
this.target0.copy( this.target );
|
|
272
|
+
this.position0.copy( this.object.position );
|
|
273
|
+
this.zoom0 = this.object.zoom;
|
|
274
|
+
|
|
275
|
+
}
|
|
276
|
+
|
|
277
|
+
reset() {
|
|
278
|
+
|
|
279
|
+
this.target.copy( this.target0 );
|
|
280
|
+
this.object.position.copy( this.position0 );
|
|
281
|
+
this.object.zoom = this.zoom0;
|
|
282
|
+
|
|
283
|
+
this.object.updateProjectionMatrix();
|
|
284
|
+
this.dispatchEvent( _changeEvent );
|
|
285
|
+
|
|
286
|
+
this.update();
|
|
287
|
+
|
|
288
|
+
this.state = _STATE.NONE;
|
|
289
|
+
|
|
290
|
+
}
|
|
291
|
+
|
|
292
|
+
update( deltaTime = null ) {
|
|
293
|
+
|
|
294
|
+
const position = this.object.position;
|
|
295
|
+
|
|
296
|
+
_v.copy( position ).sub( this.target );
|
|
297
|
+
|
|
298
|
+
// rotate offset to "y-axis-is-up" space
|
|
299
|
+
_v.applyQuaternion( this._quat );
|
|
300
|
+
|
|
301
|
+
// angle from z-axis around y-axis
|
|
302
|
+
this._spherical.setFromVector3( _v );
|
|
303
|
+
|
|
304
|
+
if ( this.autoRotate && this.state === _STATE.NONE ) {
|
|
305
|
+
|
|
306
|
+
this._rotateLeft( this._getAutoRotationAngle( deltaTime ) );
|
|
307
|
+
|
|
308
|
+
}
|
|
309
|
+
|
|
310
|
+
if ( this.enableDamping ) {
|
|
311
|
+
|
|
312
|
+
this._spherical.theta += this._sphericalDelta.theta * this.dampingFactor;
|
|
313
|
+
this._spherical.phi += this._sphericalDelta.phi * this.dampingFactor;
|
|
314
|
+
|
|
315
|
+
} else {
|
|
316
|
+
|
|
317
|
+
this._spherical.theta += this._sphericalDelta.theta;
|
|
318
|
+
this._spherical.phi += this._sphericalDelta.phi;
|
|
319
|
+
|
|
320
|
+
}
|
|
321
|
+
|
|
322
|
+
// restrict theta to be between desired limits
|
|
323
|
+
|
|
324
|
+
let min = this.minAzimuthAngle;
|
|
325
|
+
let max = this.maxAzimuthAngle;
|
|
326
|
+
|
|
327
|
+
if ( isFinite( min ) && isFinite( max ) ) {
|
|
328
|
+
|
|
329
|
+
if ( min < - Math.PI ) min += _twoPI; else if ( min > Math.PI ) min -= _twoPI;
|
|
330
|
+
|
|
331
|
+
if ( max < - Math.PI ) max += _twoPI; else if ( max > Math.PI ) max -= _twoPI;
|
|
332
|
+
|
|
333
|
+
if ( min <= max ) {
|
|
334
|
+
|
|
335
|
+
this._spherical.theta = Math.max( min, Math.min( max, this._spherical.theta ) );
|
|
336
|
+
|
|
337
|
+
} else {
|
|
338
|
+
|
|
339
|
+
this._spherical.theta = ( this._spherical.theta > ( min + max ) / 2 ) ?
|
|
340
|
+
Math.max( min, this._spherical.theta ) :
|
|
341
|
+
Math.min( max, this._spherical.theta );
|
|
342
|
+
|
|
343
|
+
}
|
|
344
|
+
|
|
345
|
+
}
|
|
346
|
+
|
|
347
|
+
// restrict phi to be between desired limits
|
|
348
|
+
this._spherical.phi = Math.max( this.minPolarAngle, Math.min( this.maxPolarAngle, this._spherical.phi ) );
|
|
349
|
+
|
|
350
|
+
this._spherical.makeSafe();
|
|
351
|
+
|
|
352
|
+
|
|
353
|
+
// move target to panned location
|
|
354
|
+
|
|
355
|
+
if ( this.enableDamping === true ) {
|
|
356
|
+
|
|
357
|
+
this.target.addScaledVector( this._panOffset, this.dampingFactor );
|
|
358
|
+
|
|
359
|
+
} else {
|
|
360
|
+
|
|
361
|
+
this.target.add( this._panOffset );
|
|
362
|
+
|
|
363
|
+
}
|
|
364
|
+
|
|
365
|
+
// Limit the target distance from the cursor to create a sphere around the center of interest
|
|
366
|
+
this.target.sub( this.cursor );
|
|
367
|
+
this.target.clampLength( this.minTargetRadius, this.maxTargetRadius );
|
|
368
|
+
this.target.add( this.cursor );
|
|
369
|
+
|
|
370
|
+
let zoomChanged = false;
|
|
371
|
+
// adjust the camera position based on zoom only if we're not zooming to the cursor or if it's an ortho camera
|
|
372
|
+
// we adjust zoom later in these cases
|
|
373
|
+
if ( this.zoomToCursor && this._performCursorZoom || this.object.isOrthographicCamera ) {
|
|
374
|
+
|
|
375
|
+
this._spherical.radius = this._clampDistance( this._spherical.radius );
|
|
376
|
+
|
|
377
|
+
} else {
|
|
378
|
+
|
|
379
|
+
const prevRadius = this._spherical.radius;
|
|
380
|
+
this._spherical.radius = this._clampDistance( this._spherical.radius * this._scale );
|
|
381
|
+
zoomChanged = prevRadius != this._spherical.radius;
|
|
382
|
+
|
|
383
|
+
}
|
|
384
|
+
|
|
385
|
+
_v.setFromSpherical( this._spherical );
|
|
386
|
+
|
|
387
|
+
// rotate offset back to "camera-up-vector-is-up" space
|
|
388
|
+
_v.applyQuaternion( this._quatInverse );
|
|
389
|
+
|
|
390
|
+
position.copy( this.target ).add( _v );
|
|
391
|
+
|
|
392
|
+
this.object.lookAt( this.target );
|
|
393
|
+
|
|
394
|
+
if ( this.enableDamping === true ) {
|
|
395
|
+
|
|
396
|
+
this._sphericalDelta.theta *= ( 1 - this.dampingFactor );
|
|
397
|
+
this._sphericalDelta.phi *= ( 1 - this.dampingFactor );
|
|
398
|
+
|
|
399
|
+
this._panOffset.multiplyScalar( 1 - this.dampingFactor );
|
|
400
|
+
|
|
401
|
+
} else {
|
|
402
|
+
|
|
403
|
+
this._sphericalDelta.set( 0, 0, 0 );
|
|
404
|
+
|
|
405
|
+
this._panOffset.set( 0, 0, 0 );
|
|
406
|
+
|
|
407
|
+
}
|
|
408
|
+
|
|
409
|
+
// adjust camera position
|
|
410
|
+
if ( this.zoomToCursor && this._performCursorZoom ) {
|
|
411
|
+
|
|
412
|
+
let newRadius = null;
|
|
413
|
+
if ( this.object.isPerspectiveCamera ) {
|
|
414
|
+
|
|
415
|
+
// move the camera down the pointer ray
|
|
416
|
+
// this method avoids floating point error
|
|
417
|
+
const prevRadius = _v.length();
|
|
418
|
+
newRadius = this._clampDistance( prevRadius * this._scale );
|
|
419
|
+
|
|
420
|
+
const radiusDelta = prevRadius - newRadius;
|
|
421
|
+
this.object.position.addScaledVector( this._dollyDirection, radiusDelta );
|
|
422
|
+
this.object.updateMatrixWorld();
|
|
423
|
+
|
|
424
|
+
zoomChanged = !! radiusDelta;
|
|
425
|
+
|
|
426
|
+
} else if ( this.object.isOrthographicCamera ) {
|
|
427
|
+
|
|
428
|
+
// adjust the ortho camera position based on zoom changes
|
|
429
|
+
const mouseBefore = new Vector3( this._mouse.x, this._mouse.y, 0 );
|
|
430
|
+
mouseBefore.unproject( this.object );
|
|
431
|
+
|
|
432
|
+
const prevZoom = this.object.zoom;
|
|
433
|
+
this.object.zoom = Math.max( this.minZoom, Math.min( this.maxZoom, this.object.zoom / this._scale ) );
|
|
434
|
+
this.object.updateProjectionMatrix();
|
|
435
|
+
|
|
436
|
+
zoomChanged = prevZoom !== this.object.zoom;
|
|
437
|
+
|
|
438
|
+
const mouseAfter = new Vector3( this._mouse.x, this._mouse.y, 0 );
|
|
439
|
+
mouseAfter.unproject( this.object );
|
|
440
|
+
|
|
441
|
+
this.object.position.sub( mouseAfter ).add( mouseBefore );
|
|
442
|
+
this.object.updateMatrixWorld();
|
|
443
|
+
|
|
444
|
+
newRadius = _v.length();
|
|
445
|
+
|
|
446
|
+
} else {
|
|
447
|
+
|
|
448
|
+
console.warn( 'WARNING: OrbitControls.js encountered an unknown camera type - zoom to cursor disabled.' );
|
|
449
|
+
this.zoomToCursor = false;
|
|
450
|
+
|
|
451
|
+
}
|
|
452
|
+
|
|
453
|
+
// handle the placement of the target
|
|
454
|
+
if ( newRadius !== null ) {
|
|
455
|
+
|
|
456
|
+
if ( this.screenSpacePanning ) {
|
|
457
|
+
|
|
458
|
+
// position the orbit target in front of the new camera position
|
|
459
|
+
this.target.set( 0, 0, - 1 )
|
|
460
|
+
.transformDirection( this.object.matrix )
|
|
461
|
+
.multiplyScalar( newRadius )
|
|
462
|
+
.add( this.object.position );
|
|
463
|
+
|
|
464
|
+
} else {
|
|
465
|
+
|
|
466
|
+
// get the ray and translation plane to compute target
|
|
467
|
+
_ray.origin.copy( this.object.position );
|
|
468
|
+
_ray.direction.set( 0, 0, - 1 ).transformDirection( this.object.matrix );
|
|
469
|
+
|
|
470
|
+
// if the camera is 20 degrees above the horizon then don't adjust the focus target to avoid
|
|
471
|
+
// extremely large values
|
|
472
|
+
if ( Math.abs( this.object.up.dot( _ray.direction ) ) < _TILT_LIMIT ) {
|
|
473
|
+
|
|
474
|
+
this.object.lookAt( this.target );
|
|
475
|
+
|
|
476
|
+
} else {
|
|
477
|
+
|
|
478
|
+
_plane.setFromNormalAndCoplanarPoint( this.object.up, this.target );
|
|
479
|
+
_ray.intersectPlane( _plane, this.target );
|
|
480
|
+
|
|
481
|
+
}
|
|
482
|
+
|
|
483
|
+
}
|
|
484
|
+
|
|
485
|
+
}
|
|
486
|
+
|
|
487
|
+
} else if ( this.object.isOrthographicCamera ) {
|
|
488
|
+
|
|
489
|
+
const prevZoom = this.object.zoom;
|
|
490
|
+
this.object.zoom = Math.max( this.minZoom, Math.min( this.maxZoom, this.object.zoom / this._scale ) );
|
|
491
|
+
|
|
492
|
+
if ( prevZoom !== this.object.zoom ) {
|
|
493
|
+
|
|
494
|
+
this.object.updateProjectionMatrix();
|
|
495
|
+
zoomChanged = true;
|
|
496
|
+
|
|
497
|
+
}
|
|
498
|
+
|
|
499
|
+
}
|
|
500
|
+
|
|
501
|
+
this._scale = 1;
|
|
502
|
+
this._performCursorZoom = false;
|
|
503
|
+
|
|
504
|
+
// update condition is:
|
|
505
|
+
// min(camera displacement, camera rotation in radians)^2 > EPS
|
|
506
|
+
// using small-angle approximation cos(x/2) = 1 - x^2 / 8
|
|
507
|
+
|
|
508
|
+
if ( zoomChanged ||
|
|
509
|
+
this._lastPosition.distanceToSquared( this.object.position ) > _EPS ||
|
|
510
|
+
8 * ( 1 - this._lastQuaternion.dot( this.object.quaternion ) ) > _EPS ||
|
|
511
|
+
this._lastTargetPosition.distanceToSquared( this.target ) > _EPS ) {
|
|
512
|
+
|
|
513
|
+
this.dispatchEvent( _changeEvent );
|
|
514
|
+
|
|
515
|
+
this._lastPosition.copy( this.object.position );
|
|
516
|
+
this._lastQuaternion.copy( this.object.quaternion );
|
|
517
|
+
this._lastTargetPosition.copy( this.target );
|
|
518
|
+
|
|
519
|
+
return true;
|
|
520
|
+
|
|
521
|
+
}
|
|
522
|
+
|
|
523
|
+
return false;
|
|
524
|
+
|
|
525
|
+
}
|
|
526
|
+
|
|
527
|
+
_getAutoRotationAngle( deltaTime ) {
|
|
528
|
+
|
|
529
|
+
if ( deltaTime !== null ) {
|
|
530
|
+
|
|
531
|
+
return ( _twoPI / 60 * this.autoRotateSpeed ) * deltaTime;
|
|
532
|
+
|
|
533
|
+
} else {
|
|
534
|
+
|
|
535
|
+
return _twoPI / 60 / 60 * this.autoRotateSpeed;
|
|
536
|
+
|
|
537
|
+
}
|
|
538
|
+
|
|
539
|
+
}
|
|
540
|
+
|
|
541
|
+
_getZoomScale( delta ) {
|
|
542
|
+
|
|
543
|
+
const normalizedDelta = Math.abs( delta * 0.01 );
|
|
544
|
+
return Math.pow( 0.95, this.zoomSpeed * normalizedDelta );
|
|
545
|
+
|
|
546
|
+
}
|
|
547
|
+
|
|
548
|
+
_rotateLeft( angle ) {
|
|
549
|
+
|
|
550
|
+
this._sphericalDelta.theta -= angle;
|
|
551
|
+
|
|
552
|
+
}
|
|
553
|
+
|
|
554
|
+
_rotateUp( angle ) {
|
|
555
|
+
|
|
556
|
+
this._sphericalDelta.phi -= angle;
|
|
557
|
+
|
|
558
|
+
}
|
|
559
|
+
|
|
560
|
+
_panLeft( distance, objectMatrix ) {
|
|
561
|
+
|
|
562
|
+
_v.setFromMatrixColumn( objectMatrix, 0 ); // get X column of objectMatrix
|
|
563
|
+
_v.multiplyScalar( - distance );
|
|
564
|
+
|
|
565
|
+
this._panOffset.add( _v );
|
|
566
|
+
|
|
567
|
+
}
|
|
568
|
+
|
|
569
|
+
_panUp( distance, objectMatrix ) {
|
|
570
|
+
|
|
571
|
+
if ( this.screenSpacePanning === true ) {
|
|
572
|
+
|
|
573
|
+
_v.setFromMatrixColumn( objectMatrix, 1 );
|
|
574
|
+
|
|
575
|
+
} else {
|
|
576
|
+
|
|
577
|
+
_v.setFromMatrixColumn( objectMatrix, 0 );
|
|
578
|
+
_v.crossVectors( this.object.up, _v );
|
|
579
|
+
|
|
580
|
+
}
|
|
581
|
+
|
|
582
|
+
_v.multiplyScalar( distance );
|
|
583
|
+
|
|
584
|
+
this._panOffset.add( _v );
|
|
585
|
+
|
|
586
|
+
}
|
|
587
|
+
|
|
588
|
+
// deltaX and deltaY are in pixels; right and down are positive
|
|
589
|
+
_pan( deltaX, deltaY ) {
|
|
590
|
+
|
|
591
|
+
const element = this.domElement;
|
|
592
|
+
|
|
593
|
+
if ( this.object.isPerspectiveCamera ) {
|
|
594
|
+
|
|
595
|
+
// perspective
|
|
596
|
+
const position = this.object.position;
|
|
597
|
+
_v.copy( position ).sub( this.target );
|
|
598
|
+
let targetDistance = _v.length();
|
|
599
|
+
|
|
600
|
+
// half of the fov is center to top of screen
|
|
601
|
+
targetDistance *= Math.tan( ( this.object.fov / 2 ) * Math.PI / 180.0 );
|
|
602
|
+
|
|
603
|
+
// we use only clientHeight here so aspect ratio does not distort speed
|
|
604
|
+
this._panLeft( 2 * deltaX * targetDistance / element.clientHeight, this.object.matrix );
|
|
605
|
+
this._panUp( 2 * deltaY * targetDistance / element.clientHeight, this.object.matrix );
|
|
606
|
+
|
|
607
|
+
} else if ( this.object.isOrthographicCamera ) {
|
|
608
|
+
|
|
609
|
+
// orthographic
|
|
610
|
+
this._panLeft( deltaX * ( this.object.right - this.object.left ) / this.object.zoom / element.clientWidth, this.object.matrix );
|
|
611
|
+
this._panUp( deltaY * ( this.object.top - this.object.bottom ) / this.object.zoom / element.clientHeight, this.object.matrix );
|
|
612
|
+
|
|
613
|
+
} else {
|
|
614
|
+
|
|
615
|
+
// camera neither orthographic nor perspective
|
|
616
|
+
console.warn( 'WARNING: OrbitControls.js encountered an unknown camera type - pan disabled.' );
|
|
617
|
+
this.enablePan = false;
|
|
618
|
+
|
|
619
|
+
}
|
|
620
|
+
|
|
621
|
+
}
|
|
622
|
+
|
|
623
|
+
_dollyOut( dollyScale ) {
|
|
624
|
+
|
|
625
|
+
if ( this.object.isPerspectiveCamera || this.object.isOrthographicCamera ) {
|
|
626
|
+
|
|
627
|
+
this._scale /= dollyScale;
|
|
628
|
+
|
|
629
|
+
} else {
|
|
630
|
+
|
|
631
|
+
console.warn( 'WARNING: OrbitControls.js encountered an unknown camera type - dolly/zoom disabled.' );
|
|
632
|
+
this.enableZoom = false;
|
|
633
|
+
|
|
634
|
+
}
|
|
635
|
+
|
|
636
|
+
}
|
|
637
|
+
|
|
638
|
+
_dollyIn( dollyScale ) {
|
|
639
|
+
|
|
640
|
+
if ( this.object.isPerspectiveCamera || this.object.isOrthographicCamera ) {
|
|
641
|
+
|
|
642
|
+
this._scale *= dollyScale;
|
|
643
|
+
|
|
644
|
+
} else {
|
|
645
|
+
|
|
646
|
+
console.warn( 'WARNING: OrbitControls.js encountered an unknown camera type - dolly/zoom disabled.' );
|
|
647
|
+
this.enableZoom = false;
|
|
648
|
+
|
|
649
|
+
}
|
|
650
|
+
|
|
651
|
+
}
|
|
652
|
+
|
|
653
|
+
_updateZoomParameters( x, y ) {
|
|
654
|
+
|
|
655
|
+
if ( ! this.zoomToCursor ) {
|
|
656
|
+
|
|
657
|
+
return;
|
|
658
|
+
|
|
659
|
+
}
|
|
660
|
+
|
|
661
|
+
this._performCursorZoom = true;
|
|
662
|
+
|
|
663
|
+
const rect = this.domElement.getBoundingClientRect();
|
|
664
|
+
const dx = x - rect.left;
|
|
665
|
+
const dy = y - rect.top;
|
|
666
|
+
const w = rect.width;
|
|
667
|
+
const h = rect.height;
|
|
668
|
+
|
|
669
|
+
this._mouse.x = ( dx / w ) * 2 - 1;
|
|
670
|
+
this._mouse.y = - ( dy / h ) * 2 + 1;
|
|
671
|
+
|
|
672
|
+
this._dollyDirection.set( this._mouse.x, this._mouse.y, 1 ).unproject( this.object ).sub( this.object.position ).normalize();
|
|
673
|
+
|
|
674
|
+
}
|
|
675
|
+
|
|
676
|
+
_clampDistance( dist ) {
|
|
677
|
+
|
|
678
|
+
return Math.max( this.minDistance, Math.min( this.maxDistance, dist ) );
|
|
679
|
+
|
|
680
|
+
}
|
|
681
|
+
|
|
682
|
+
//
|
|
683
|
+
// event callbacks - update the object state
|
|
684
|
+
//
|
|
685
|
+
|
|
686
|
+
_handleMouseDownRotate( event ) {
|
|
687
|
+
|
|
688
|
+
this._rotateStart.set( event.clientX, event.clientY );
|
|
689
|
+
|
|
690
|
+
}
|
|
691
|
+
|
|
692
|
+
_handleMouseDownDolly( event ) {
|
|
693
|
+
|
|
694
|
+
this._updateZoomParameters( event.clientX, event.clientX );
|
|
695
|
+
this._dollyStart.set( event.clientX, event.clientY );
|
|
696
|
+
|
|
697
|
+
}
|
|
698
|
+
|
|
699
|
+
_handleMouseDownPan( event ) {
|
|
700
|
+
|
|
701
|
+
this._panStart.set( event.clientX, event.clientY );
|
|
702
|
+
|
|
703
|
+
}
|
|
704
|
+
|
|
705
|
+
_handleMouseMoveRotate( event ) {
|
|
706
|
+
|
|
707
|
+
this._rotateEnd.set( event.clientX, event.clientY );
|
|
708
|
+
|
|
709
|
+
this._rotateDelta.subVectors( this._rotateEnd, this._rotateStart ).multiplyScalar( this.rotateSpeed );
|
|
710
|
+
|
|
711
|
+
const element = this.domElement;
|
|
712
|
+
|
|
713
|
+
this._rotateLeft( _twoPI * this._rotateDelta.x / element.clientHeight ); // yes, height
|
|
714
|
+
|
|
715
|
+
this._rotateUp( _twoPI * this._rotateDelta.y / element.clientHeight );
|
|
716
|
+
|
|
717
|
+
this._rotateStart.copy( this._rotateEnd );
|
|
718
|
+
|
|
719
|
+
this.update();
|
|
720
|
+
|
|
721
|
+
}
|
|
722
|
+
|
|
723
|
+
_handleMouseMoveDolly( event ) {
|
|
724
|
+
|
|
725
|
+
this._dollyEnd.set( event.clientX, event.clientY );
|
|
726
|
+
|
|
727
|
+
this._dollyDelta.subVectors( this._dollyEnd, this._dollyStart );
|
|
728
|
+
|
|
729
|
+
if ( this._dollyDelta.y > 0 ) {
|
|
730
|
+
|
|
731
|
+
this._dollyOut( this._getZoomScale( this._dollyDelta.y ) );
|
|
732
|
+
|
|
733
|
+
} else if ( this._dollyDelta.y < 0 ) {
|
|
734
|
+
|
|
735
|
+
this._dollyIn( this._getZoomScale( this._dollyDelta.y ) );
|
|
736
|
+
|
|
737
|
+
}
|
|
738
|
+
|
|
739
|
+
this._dollyStart.copy( this._dollyEnd );
|
|
740
|
+
|
|
741
|
+
this.update();
|
|
742
|
+
|
|
743
|
+
}
|
|
744
|
+
|
|
745
|
+
_handleMouseMovePan( event ) {
|
|
746
|
+
|
|
747
|
+
this._panEnd.set( event.clientX, event.clientY );
|
|
748
|
+
|
|
749
|
+
this._panDelta.subVectors( this._panEnd, this._panStart ).multiplyScalar( this.panSpeed );
|
|
750
|
+
|
|
751
|
+
this._pan( this._panDelta.x, this._panDelta.y );
|
|
752
|
+
|
|
753
|
+
this._panStart.copy( this._panEnd );
|
|
754
|
+
|
|
755
|
+
this.update();
|
|
756
|
+
|
|
757
|
+
}
|
|
758
|
+
|
|
759
|
+
_handleMouseWheel( event ) {
|
|
760
|
+
|
|
761
|
+
this._updateZoomParameters( event.clientX, event.clientY );
|
|
762
|
+
|
|
763
|
+
if ( event.deltaY < 0 ) {
|
|
764
|
+
|
|
765
|
+
this._dollyIn( this._getZoomScale( event.deltaY ) );
|
|
766
|
+
|
|
767
|
+
} else if ( event.deltaY > 0 ) {
|
|
768
|
+
|
|
769
|
+
this._dollyOut( this._getZoomScale( event.deltaY ) );
|
|
770
|
+
|
|
771
|
+
}
|
|
772
|
+
|
|
773
|
+
this.update();
|
|
774
|
+
|
|
775
|
+
}
|
|
776
|
+
|
|
777
|
+
_handleKeyDown( event ) {
|
|
778
|
+
|
|
779
|
+
let needsUpdate = false;
|
|
780
|
+
|
|
781
|
+
switch ( event.code ) {
|
|
782
|
+
|
|
783
|
+
case this.keys.UP:
|
|
784
|
+
|
|
785
|
+
if ( event.ctrlKey || event.metaKey || event.shiftKey ) {
|
|
786
|
+
|
|
787
|
+
this._rotateUp( _twoPI * this.rotateSpeed / this.domElement.clientHeight );
|
|
788
|
+
|
|
789
|
+
} else {
|
|
790
|
+
|
|
791
|
+
this._pan( 0, this.keyPanSpeed );
|
|
792
|
+
|
|
793
|
+
}
|
|
794
|
+
|
|
795
|
+
needsUpdate = true;
|
|
796
|
+
break;
|
|
797
|
+
|
|
798
|
+
case this.keys.BOTTOM:
|
|
799
|
+
|
|
800
|
+
if ( event.ctrlKey || event.metaKey || event.shiftKey ) {
|
|
801
|
+
|
|
802
|
+
this._rotateUp( - _twoPI * this.rotateSpeed / this.domElement.clientHeight );
|
|
803
|
+
|
|
804
|
+
} else {
|
|
805
|
+
|
|
806
|
+
this._pan( 0, - this.keyPanSpeed );
|
|
807
|
+
|
|
808
|
+
}
|
|
809
|
+
|
|
810
|
+
needsUpdate = true;
|
|
811
|
+
break;
|
|
812
|
+
|
|
813
|
+
case this.keys.LEFT:
|
|
814
|
+
|
|
815
|
+
if ( event.ctrlKey || event.metaKey || event.shiftKey ) {
|
|
816
|
+
|
|
817
|
+
this._rotateLeft( _twoPI * this.rotateSpeed / this.domElement.clientHeight );
|
|
818
|
+
|
|
819
|
+
} else {
|
|
820
|
+
|
|
821
|
+
this._pan( this.keyPanSpeed, 0 );
|
|
822
|
+
|
|
823
|
+
}
|
|
824
|
+
|
|
825
|
+
needsUpdate = true;
|
|
826
|
+
break;
|
|
827
|
+
|
|
828
|
+
case this.keys.RIGHT:
|
|
829
|
+
|
|
830
|
+
if ( event.ctrlKey || event.metaKey || event.shiftKey ) {
|
|
831
|
+
|
|
832
|
+
this._rotateLeft( - _twoPI * this.rotateSpeed / this.domElement.clientHeight );
|
|
833
|
+
|
|
834
|
+
} else {
|
|
835
|
+
|
|
836
|
+
this._pan( - this.keyPanSpeed, 0 );
|
|
837
|
+
|
|
838
|
+
}
|
|
839
|
+
|
|
840
|
+
needsUpdate = true;
|
|
841
|
+
break;
|
|
842
|
+
|
|
843
|
+
}
|
|
844
|
+
|
|
845
|
+
if ( needsUpdate ) {
|
|
846
|
+
|
|
847
|
+
// prevent the browser from scrolling on cursor keys
|
|
848
|
+
event.preventDefault();
|
|
849
|
+
|
|
850
|
+
this.update();
|
|
851
|
+
|
|
852
|
+
}
|
|
853
|
+
|
|
854
|
+
|
|
855
|
+
}
|
|
856
|
+
|
|
857
|
+
_handleTouchStartRotate( event ) {
|
|
858
|
+
|
|
859
|
+
if ( this._pointers.length === 1 ) {
|
|
860
|
+
|
|
861
|
+
this._rotateStart.set( event.pageX, event.pageY );
|
|
862
|
+
|
|
863
|
+
} else {
|
|
864
|
+
|
|
865
|
+
const position = this._getSecondPointerPosition( event );
|
|
866
|
+
|
|
867
|
+
const x = 0.5 * ( event.pageX + position.x );
|
|
868
|
+
const y = 0.5 * ( event.pageY + position.y );
|
|
869
|
+
|
|
870
|
+
this._rotateStart.set( x, y );
|
|
871
|
+
|
|
872
|
+
}
|
|
873
|
+
|
|
874
|
+
}
|
|
875
|
+
|
|
876
|
+
_handleTouchStartPan( event ) {
|
|
877
|
+
|
|
878
|
+
if ( this._pointers.length === 1 ) {
|
|
879
|
+
|
|
880
|
+
this._panStart.set( event.pageX, event.pageY );
|
|
881
|
+
|
|
882
|
+
} else {
|
|
883
|
+
|
|
884
|
+
const position = this._getSecondPointerPosition( event );
|
|
885
|
+
|
|
886
|
+
const x = 0.5 * ( event.pageX + position.x );
|
|
887
|
+
const y = 0.5 * ( event.pageY + position.y );
|
|
888
|
+
|
|
889
|
+
this._panStart.set( x, y );
|
|
890
|
+
|
|
891
|
+
}
|
|
892
|
+
|
|
893
|
+
}
|
|
894
|
+
|
|
895
|
+
_handleTouchStartDolly( event ) {
|
|
896
|
+
|
|
897
|
+
const position = this._getSecondPointerPosition( event );
|
|
898
|
+
|
|
899
|
+
const dx = event.pageX - position.x;
|
|
900
|
+
const dy = event.pageY - position.y;
|
|
901
|
+
|
|
902
|
+
const distance = Math.sqrt( dx * dx + dy * dy );
|
|
903
|
+
|
|
904
|
+
this._dollyStart.set( 0, distance );
|
|
905
|
+
|
|
906
|
+
}
|
|
907
|
+
|
|
908
|
+
_handleTouchStartDollyPan( event ) {
|
|
909
|
+
|
|
910
|
+
if ( this.enableZoom ) this._handleTouchStartDolly( event );
|
|
911
|
+
|
|
912
|
+
if ( this.enablePan ) this._handleTouchStartPan( event );
|
|
913
|
+
|
|
914
|
+
}
|
|
915
|
+
|
|
916
|
+
_handleTouchStartDollyRotate( event ) {
|
|
917
|
+
|
|
918
|
+
if ( this.enableZoom ) this._handleTouchStartDolly( event );
|
|
919
|
+
|
|
920
|
+
if ( this.enableRotate ) this._handleTouchStartRotate( event );
|
|
921
|
+
|
|
922
|
+
}
|
|
923
|
+
|
|
924
|
+
_handleTouchMoveRotate( event ) {
|
|
925
|
+
|
|
926
|
+
if ( this._pointers.length == 1 ) {
|
|
927
|
+
|
|
928
|
+
this._rotateEnd.set( event.pageX, event.pageY );
|
|
929
|
+
|
|
930
|
+
} else {
|
|
931
|
+
|
|
932
|
+
const position = this._getSecondPointerPosition( event );
|
|
933
|
+
|
|
934
|
+
const x = 0.5 * ( event.pageX + position.x );
|
|
935
|
+
const y = 0.5 * ( event.pageY + position.y );
|
|
936
|
+
|
|
937
|
+
this._rotateEnd.set( x, y );
|
|
938
|
+
|
|
939
|
+
}
|
|
940
|
+
|
|
941
|
+
this._rotateDelta.subVectors( this._rotateEnd, this._rotateStart ).multiplyScalar( this.rotateSpeed );
|
|
942
|
+
|
|
943
|
+
const element = this.domElement;
|
|
944
|
+
|
|
945
|
+
this._rotateLeft( _twoPI * this._rotateDelta.x / element.clientHeight ); // yes, height
|
|
946
|
+
|
|
947
|
+
this._rotateUp( _twoPI * this._rotateDelta.y / element.clientHeight );
|
|
948
|
+
|
|
949
|
+
this._rotateStart.copy( this._rotateEnd );
|
|
950
|
+
|
|
951
|
+
}
|
|
952
|
+
|
|
953
|
+
_handleTouchMovePan( event ) {
|
|
954
|
+
|
|
955
|
+
if ( this._pointers.length === 1 ) {
|
|
956
|
+
|
|
957
|
+
this._panEnd.set( event.pageX, event.pageY );
|
|
958
|
+
|
|
959
|
+
} else {
|
|
960
|
+
|
|
961
|
+
const position = this._getSecondPointerPosition( event );
|
|
962
|
+
|
|
963
|
+
const x = 0.5 * ( event.pageX + position.x );
|
|
964
|
+
const y = 0.5 * ( event.pageY + position.y );
|
|
965
|
+
|
|
966
|
+
this._panEnd.set( x, y );
|
|
967
|
+
|
|
968
|
+
}
|
|
969
|
+
|
|
970
|
+
this._panDelta.subVectors( this._panEnd, this._panStart ).multiplyScalar( this.panSpeed );
|
|
971
|
+
|
|
972
|
+
this._pan( this._panDelta.x, this._panDelta.y );
|
|
973
|
+
|
|
974
|
+
this._panStart.copy( this._panEnd );
|
|
975
|
+
|
|
976
|
+
}
|
|
977
|
+
|
|
978
|
+
_handleTouchMoveDolly( event ) {
|
|
979
|
+
|
|
980
|
+
const position = this._getSecondPointerPosition( event );
|
|
981
|
+
|
|
982
|
+
const dx = event.pageX - position.x;
|
|
983
|
+
const dy = event.pageY - position.y;
|
|
984
|
+
|
|
985
|
+
const distance = Math.sqrt( dx * dx + dy * dy );
|
|
986
|
+
|
|
987
|
+
this._dollyEnd.set( 0, distance );
|
|
988
|
+
|
|
989
|
+
this._dollyDelta.set( 0, Math.pow( this._dollyEnd.y / this._dollyStart.y, this.zoomSpeed ) );
|
|
990
|
+
|
|
991
|
+
this._dollyOut( this._dollyDelta.y );
|
|
992
|
+
|
|
993
|
+
this._dollyStart.copy( this._dollyEnd );
|
|
994
|
+
|
|
995
|
+
const centerX = ( event.pageX + position.x ) * 0.5;
|
|
996
|
+
const centerY = ( event.pageY + position.y ) * 0.5;
|
|
997
|
+
|
|
998
|
+
this._updateZoomParameters( centerX, centerY );
|
|
999
|
+
|
|
1000
|
+
}
|
|
1001
|
+
|
|
1002
|
+
_handleTouchMoveDollyPan( event ) {
|
|
1003
|
+
|
|
1004
|
+
if ( this.enableZoom ) this._handleTouchMoveDolly( event );
|
|
1005
|
+
|
|
1006
|
+
if ( this.enablePan ) this._handleTouchMovePan( event );
|
|
1007
|
+
|
|
1008
|
+
}
|
|
1009
|
+
|
|
1010
|
+
_handleTouchMoveDollyRotate( event ) {
|
|
1011
|
+
|
|
1012
|
+
if ( this.enableZoom ) this._handleTouchMoveDolly( event );
|
|
1013
|
+
|
|
1014
|
+
if ( this.enableRotate ) this._handleTouchMoveRotate( event );
|
|
1015
|
+
|
|
1016
|
+
}
|
|
1017
|
+
|
|
1018
|
+
// pointers
|
|
1019
|
+
|
|
1020
|
+
_addPointer( event ) {
|
|
1021
|
+
|
|
1022
|
+
this._pointers.push( event.pointerId );
|
|
1023
|
+
|
|
1024
|
+
}
|
|
1025
|
+
|
|
1026
|
+
_removePointer( event ) {
|
|
1027
|
+
|
|
1028
|
+
delete this._pointerPositions[ event.pointerId ];
|
|
1029
|
+
|
|
1030
|
+
for ( let i = 0; i < this._pointers.length; i ++ ) {
|
|
1031
|
+
|
|
1032
|
+
if ( this._pointers[ i ] == event.pointerId ) {
|
|
1033
|
+
|
|
1034
|
+
this._pointers.splice( i, 1 );
|
|
1035
|
+
return;
|
|
1036
|
+
|
|
1037
|
+
}
|
|
1038
|
+
|
|
1039
|
+
}
|
|
1040
|
+
|
|
1041
|
+
}
|
|
1042
|
+
|
|
1043
|
+
_isTrackingPointer( event ) {
|
|
1044
|
+
|
|
1045
|
+
for ( let i = 0; i < this._pointers.length; i ++ ) {
|
|
1046
|
+
|
|
1047
|
+
if ( this._pointers[ i ] == event.pointerId ) return true;
|
|
1048
|
+
|
|
1049
|
+
}
|
|
1050
|
+
|
|
1051
|
+
return false;
|
|
1052
|
+
|
|
1053
|
+
}
|
|
1054
|
+
|
|
1055
|
+
_trackPointer( event ) {
|
|
1056
|
+
|
|
1057
|
+
let position = this._pointerPositions[ event.pointerId ];
|
|
1058
|
+
|
|
1059
|
+
if ( position === undefined ) {
|
|
1060
|
+
|
|
1061
|
+
position = new Vector2();
|
|
1062
|
+
this._pointerPositions[ event.pointerId ] = position;
|
|
1063
|
+
|
|
1064
|
+
}
|
|
1065
|
+
|
|
1066
|
+
position.set( event.pageX, event.pageY );
|
|
1067
|
+
|
|
1068
|
+
}
|
|
1069
|
+
|
|
1070
|
+
_getSecondPointerPosition( event ) {
|
|
1071
|
+
|
|
1072
|
+
const pointerId = ( event.pointerId === this._pointers[ 0 ] ) ? this._pointers[ 1 ] : this._pointers[ 0 ];
|
|
1073
|
+
|
|
1074
|
+
return this._pointerPositions[ pointerId ];
|
|
1075
|
+
|
|
1076
|
+
}
|
|
1077
|
+
|
|
1078
|
+
//
|
|
1079
|
+
|
|
1080
|
+
_customWheelEvent( event ) {
|
|
1081
|
+
|
|
1082
|
+
const mode = event.deltaMode;
|
|
1083
|
+
|
|
1084
|
+
// minimal wheel event altered to meet delta-zoom demand
|
|
1085
|
+
const newEvent = {
|
|
1086
|
+
clientX: event.clientX,
|
|
1087
|
+
clientY: event.clientY,
|
|
1088
|
+
deltaY: event.deltaY,
|
|
1089
|
+
};
|
|
1090
|
+
|
|
1091
|
+
switch ( mode ) {
|
|
1092
|
+
|
|
1093
|
+
case 1: // LINE_MODE
|
|
1094
|
+
newEvent.deltaY *= 16;
|
|
1095
|
+
break;
|
|
1096
|
+
|
|
1097
|
+
case 2: // PAGE_MODE
|
|
1098
|
+
newEvent.deltaY *= 100;
|
|
1099
|
+
break;
|
|
1100
|
+
|
|
1101
|
+
}
|
|
1102
|
+
|
|
1103
|
+
// detect if event was triggered by pinching
|
|
1104
|
+
if ( event.ctrlKey && ! this._controlActive ) {
|
|
1105
|
+
|
|
1106
|
+
newEvent.deltaY *= 10;
|
|
1107
|
+
|
|
1108
|
+
}
|
|
1109
|
+
|
|
1110
|
+
return newEvent;
|
|
1111
|
+
|
|
1112
|
+
}
|
|
1113
|
+
|
|
1114
|
+
}
|
|
1115
|
+
|
|
1116
|
+
function onPointerDown( event ) {
|
|
1117
|
+
|
|
1118
|
+
if ( this.enabled === false ) return;
|
|
1119
|
+
|
|
1120
|
+
if ( this._pointers.length === 0 ) {
|
|
1121
|
+
|
|
1122
|
+
this.domElement.setPointerCapture( event.pointerId );
|
|
1123
|
+
|
|
1124
|
+
this.domElement.addEventListener( 'pointermove', this._onPointerMove );
|
|
1125
|
+
this.domElement.addEventListener( 'pointerup', this._onPointerUp );
|
|
1126
|
+
|
|
1127
|
+
}
|
|
1128
|
+
|
|
1129
|
+
//
|
|
1130
|
+
|
|
1131
|
+
if ( this._isTrackingPointer( event ) ) return;
|
|
1132
|
+
|
|
1133
|
+
//
|
|
1134
|
+
|
|
1135
|
+
this._addPointer( event );
|
|
1136
|
+
|
|
1137
|
+
if ( event.pointerType === 'touch' ) {
|
|
1138
|
+
|
|
1139
|
+
this._onTouchStart( event );
|
|
1140
|
+
|
|
1141
|
+
} else {
|
|
1142
|
+
|
|
1143
|
+
this._onMouseDown( event );
|
|
1144
|
+
|
|
1145
|
+
}
|
|
1146
|
+
|
|
1147
|
+
}
|
|
1148
|
+
|
|
1149
|
+
function onPointerMove( event ) {
|
|
1150
|
+
|
|
1151
|
+
if ( this.enabled === false ) return;
|
|
1152
|
+
|
|
1153
|
+
if ( event.pointerType === 'touch' ) {
|
|
1154
|
+
|
|
1155
|
+
this._onTouchMove( event );
|
|
1156
|
+
|
|
1157
|
+
} else {
|
|
1158
|
+
|
|
1159
|
+
this._onMouseMove( event );
|
|
1160
|
+
|
|
1161
|
+
}
|
|
1162
|
+
|
|
1163
|
+
}
|
|
1164
|
+
|
|
1165
|
+
function onPointerUp( event ) {
|
|
1166
|
+
|
|
1167
|
+
this._removePointer( event );
|
|
1168
|
+
|
|
1169
|
+
switch ( this._pointers.length ) {
|
|
1170
|
+
|
|
1171
|
+
case 0:
|
|
1172
|
+
|
|
1173
|
+
this.domElement.releasePointerCapture( event.pointerId );
|
|
1174
|
+
|
|
1175
|
+
this.domElement.removeEventListener( 'pointermove', this._onPointerMove );
|
|
1176
|
+
this.domElement.removeEventListener( 'pointerup', this._onPointerUp );
|
|
1177
|
+
|
|
1178
|
+
this.dispatchEvent( _endEvent );
|
|
1179
|
+
|
|
1180
|
+
this.state = _STATE.NONE;
|
|
1181
|
+
|
|
1182
|
+
break;
|
|
1183
|
+
|
|
1184
|
+
case 1:
|
|
1185
|
+
|
|
1186
|
+
const pointerId = this._pointers[ 0 ];
|
|
1187
|
+
const position = this._pointerPositions[ pointerId ];
|
|
1188
|
+
|
|
1189
|
+
// minimal placeholder event - allows state correction on pointer-up
|
|
1190
|
+
this._onTouchStart( { pointerId: pointerId, pageX: position.x, pageY: position.y } );
|
|
1191
|
+
|
|
1192
|
+
break;
|
|
1193
|
+
|
|
1194
|
+
}
|
|
1195
|
+
|
|
1196
|
+
}
|
|
1197
|
+
|
|
1198
|
+
function onMouseDown( event ) {
|
|
1199
|
+
|
|
1200
|
+
let mouseAction;
|
|
1201
|
+
|
|
1202
|
+
switch ( event.button ) {
|
|
1203
|
+
|
|
1204
|
+
case 0:
|
|
1205
|
+
|
|
1206
|
+
mouseAction = this.mouseButtons.LEFT;
|
|
1207
|
+
break;
|
|
1208
|
+
|
|
1209
|
+
case 1:
|
|
1210
|
+
|
|
1211
|
+
mouseAction = this.mouseButtons.MIDDLE;
|
|
1212
|
+
break;
|
|
1213
|
+
|
|
1214
|
+
case 2:
|
|
1215
|
+
|
|
1216
|
+
mouseAction = this.mouseButtons.RIGHT;
|
|
1217
|
+
break;
|
|
1218
|
+
|
|
1219
|
+
default:
|
|
1220
|
+
|
|
1221
|
+
mouseAction = - 1;
|
|
1222
|
+
|
|
1223
|
+
}
|
|
1224
|
+
|
|
1225
|
+
switch ( mouseAction ) {
|
|
1226
|
+
|
|
1227
|
+
case MOUSE.DOLLY:
|
|
1228
|
+
|
|
1229
|
+
if ( this.enableZoom === false ) return;
|
|
1230
|
+
|
|
1231
|
+
this._handleMouseDownDolly( event );
|
|
1232
|
+
|
|
1233
|
+
this.state = _STATE.DOLLY;
|
|
1234
|
+
|
|
1235
|
+
break;
|
|
1236
|
+
|
|
1237
|
+
case MOUSE.ROTATE:
|
|
1238
|
+
|
|
1239
|
+
if ( event.ctrlKey || event.metaKey || event.shiftKey ) {
|
|
1240
|
+
|
|
1241
|
+
if ( this.enablePan === false ) return;
|
|
1242
|
+
|
|
1243
|
+
this._handleMouseDownPan( event );
|
|
1244
|
+
|
|
1245
|
+
this.state = _STATE.PAN;
|
|
1246
|
+
|
|
1247
|
+
} else {
|
|
1248
|
+
|
|
1249
|
+
if ( this.enableRotate === false ) return;
|
|
1250
|
+
|
|
1251
|
+
this._handleMouseDownRotate( event );
|
|
1252
|
+
|
|
1253
|
+
this.state = _STATE.ROTATE;
|
|
1254
|
+
|
|
1255
|
+
}
|
|
1256
|
+
|
|
1257
|
+
break;
|
|
1258
|
+
|
|
1259
|
+
case MOUSE.PAN:
|
|
1260
|
+
|
|
1261
|
+
if ( event.ctrlKey || event.metaKey || event.shiftKey ) {
|
|
1262
|
+
|
|
1263
|
+
if ( this.enableRotate === false ) return;
|
|
1264
|
+
|
|
1265
|
+
this._handleMouseDownRotate( event );
|
|
1266
|
+
|
|
1267
|
+
this.state = _STATE.ROTATE;
|
|
1268
|
+
|
|
1269
|
+
} else {
|
|
1270
|
+
|
|
1271
|
+
if ( this.enablePan === false ) return;
|
|
1272
|
+
|
|
1273
|
+
this._handleMouseDownPan( event );
|
|
1274
|
+
|
|
1275
|
+
this.state = _STATE.PAN;
|
|
1276
|
+
|
|
1277
|
+
}
|
|
1278
|
+
|
|
1279
|
+
break;
|
|
1280
|
+
|
|
1281
|
+
default:
|
|
1282
|
+
|
|
1283
|
+
this.state = _STATE.NONE;
|
|
1284
|
+
|
|
1285
|
+
}
|
|
1286
|
+
|
|
1287
|
+
if ( this.state !== _STATE.NONE ) {
|
|
1288
|
+
|
|
1289
|
+
this.dispatchEvent( _startEvent );
|
|
1290
|
+
|
|
1291
|
+
}
|
|
1292
|
+
|
|
1293
|
+
}
|
|
1294
|
+
|
|
1295
|
+
function onMouseMove( event ) {
|
|
1296
|
+
|
|
1297
|
+
switch ( this.state ) {
|
|
1298
|
+
|
|
1299
|
+
case _STATE.ROTATE:
|
|
1300
|
+
|
|
1301
|
+
if ( this.enableRotate === false ) return;
|
|
1302
|
+
|
|
1303
|
+
this._handleMouseMoveRotate( event );
|
|
1304
|
+
|
|
1305
|
+
break;
|
|
1306
|
+
|
|
1307
|
+
case _STATE.DOLLY:
|
|
1308
|
+
|
|
1309
|
+
if ( this.enableZoom === false ) return;
|
|
1310
|
+
|
|
1311
|
+
this._handleMouseMoveDolly( event );
|
|
1312
|
+
|
|
1313
|
+
break;
|
|
1314
|
+
|
|
1315
|
+
case _STATE.PAN:
|
|
1316
|
+
|
|
1317
|
+
if ( this.enablePan === false ) return;
|
|
1318
|
+
|
|
1319
|
+
this._handleMouseMovePan( event );
|
|
1320
|
+
|
|
1321
|
+
break;
|
|
1322
|
+
|
|
1323
|
+
}
|
|
1324
|
+
|
|
1325
|
+
}
|
|
1326
|
+
|
|
1327
|
+
function onMouseWheel( event ) {
|
|
1328
|
+
|
|
1329
|
+
if ( this.enabled === false || this.enableZoom === false || this.state !== _STATE.NONE ) return;
|
|
1330
|
+
|
|
1331
|
+
event.preventDefault();
|
|
1332
|
+
|
|
1333
|
+
this.dispatchEvent( _startEvent );
|
|
1334
|
+
|
|
1335
|
+
this._handleMouseWheel( this._customWheelEvent( event ) );
|
|
1336
|
+
|
|
1337
|
+
this.dispatchEvent( _endEvent );
|
|
1338
|
+
|
|
1339
|
+
}
|
|
1340
|
+
|
|
1341
|
+
function onKeyDown( event ) {
|
|
1342
|
+
|
|
1343
|
+
if ( this.enabled === false || this.enablePan === false ) return;
|
|
1344
|
+
|
|
1345
|
+
this._handleKeyDown( event );
|
|
1346
|
+
|
|
1347
|
+
}
|
|
1348
|
+
|
|
1349
|
+
function onTouchStart( event ) {
|
|
1350
|
+
|
|
1351
|
+
this._trackPointer( event );
|
|
1352
|
+
|
|
1353
|
+
switch ( this._pointers.length ) {
|
|
1354
|
+
|
|
1355
|
+
case 1:
|
|
1356
|
+
|
|
1357
|
+
switch ( this.touches.ONE ) {
|
|
1358
|
+
|
|
1359
|
+
case TOUCH.ROTATE:
|
|
1360
|
+
|
|
1361
|
+
if ( this.enableRotate === false ) return;
|
|
1362
|
+
|
|
1363
|
+
this._handleTouchStartRotate( event );
|
|
1364
|
+
|
|
1365
|
+
this.state = _STATE.TOUCH_ROTATE;
|
|
1366
|
+
|
|
1367
|
+
break;
|
|
1368
|
+
|
|
1369
|
+
case TOUCH.PAN:
|
|
1370
|
+
|
|
1371
|
+
if ( this.enablePan === false ) return;
|
|
1372
|
+
|
|
1373
|
+
this._handleTouchStartPan( event );
|
|
1374
|
+
|
|
1375
|
+
this.state = _STATE.TOUCH_PAN;
|
|
1376
|
+
|
|
1377
|
+
break;
|
|
1378
|
+
|
|
1379
|
+
default:
|
|
1380
|
+
|
|
1381
|
+
this.state = _STATE.NONE;
|
|
1382
|
+
|
|
1383
|
+
}
|
|
1384
|
+
|
|
1385
|
+
break;
|
|
1386
|
+
|
|
1387
|
+
case 2:
|
|
1388
|
+
|
|
1389
|
+
switch ( this.touches.TWO ) {
|
|
1390
|
+
|
|
1391
|
+
case TOUCH.DOLLY_PAN:
|
|
1392
|
+
|
|
1393
|
+
if ( this.enableZoom === false && this.enablePan === false ) return;
|
|
1394
|
+
|
|
1395
|
+
this._handleTouchStartDollyPan( event );
|
|
1396
|
+
|
|
1397
|
+
this.state = _STATE.TOUCH_DOLLY_PAN;
|
|
1398
|
+
|
|
1399
|
+
break;
|
|
1400
|
+
|
|
1401
|
+
case TOUCH.DOLLY_ROTATE:
|
|
1402
|
+
|
|
1403
|
+
if ( this.enableZoom === false && this.enableRotate === false ) return;
|
|
1404
|
+
|
|
1405
|
+
this._handleTouchStartDollyRotate( event );
|
|
1406
|
+
|
|
1407
|
+
this.state = _STATE.TOUCH_DOLLY_ROTATE;
|
|
1408
|
+
|
|
1409
|
+
break;
|
|
1410
|
+
|
|
1411
|
+
default:
|
|
1412
|
+
|
|
1413
|
+
this.state = _STATE.NONE;
|
|
1414
|
+
|
|
1415
|
+
}
|
|
1416
|
+
|
|
1417
|
+
break;
|
|
1418
|
+
|
|
1419
|
+
default:
|
|
1420
|
+
|
|
1421
|
+
this.state = _STATE.NONE;
|
|
1422
|
+
|
|
1423
|
+
}
|
|
1424
|
+
|
|
1425
|
+
if ( this.state !== _STATE.NONE ) {
|
|
1426
|
+
|
|
1427
|
+
this.dispatchEvent( _startEvent );
|
|
1428
|
+
|
|
1429
|
+
}
|
|
1430
|
+
|
|
1431
|
+
}
|
|
1432
|
+
|
|
1433
|
+
function onTouchMove( event ) {
|
|
1434
|
+
|
|
1435
|
+
this._trackPointer( event );
|
|
1436
|
+
|
|
1437
|
+
switch ( this.state ) {
|
|
1438
|
+
|
|
1439
|
+
case _STATE.TOUCH_ROTATE:
|
|
1440
|
+
|
|
1441
|
+
if ( this.enableRotate === false ) return;
|
|
1442
|
+
|
|
1443
|
+
this._handleTouchMoveRotate( event );
|
|
1444
|
+
|
|
1445
|
+
this.update();
|
|
1446
|
+
|
|
1447
|
+
break;
|
|
1448
|
+
|
|
1449
|
+
case _STATE.TOUCH_PAN:
|
|
1450
|
+
|
|
1451
|
+
if ( this.enablePan === false ) return;
|
|
1452
|
+
|
|
1453
|
+
this._handleTouchMovePan( event );
|
|
1454
|
+
|
|
1455
|
+
this.update();
|
|
1456
|
+
|
|
1457
|
+
break;
|
|
1458
|
+
|
|
1459
|
+
case _STATE.TOUCH_DOLLY_PAN:
|
|
1460
|
+
|
|
1461
|
+
if ( this.enableZoom === false && this.enablePan === false ) return;
|
|
1462
|
+
|
|
1463
|
+
this._handleTouchMoveDollyPan( event );
|
|
1464
|
+
|
|
1465
|
+
this.update();
|
|
1466
|
+
|
|
1467
|
+
break;
|
|
1468
|
+
|
|
1469
|
+
case _STATE.TOUCH_DOLLY_ROTATE:
|
|
1470
|
+
|
|
1471
|
+
if ( this.enableZoom === false && this.enableRotate === false ) return;
|
|
1472
|
+
|
|
1473
|
+
this._handleTouchMoveDollyRotate( event );
|
|
1474
|
+
|
|
1475
|
+
this.update();
|
|
1476
|
+
|
|
1477
|
+
break;
|
|
1478
|
+
|
|
1479
|
+
default:
|
|
1480
|
+
|
|
1481
|
+
this.state = _STATE.NONE;
|
|
1482
|
+
|
|
1483
|
+
}
|
|
1484
|
+
|
|
1485
|
+
}
|
|
1486
|
+
|
|
1487
|
+
function onContextMenu( event ) {
|
|
1488
|
+
|
|
1489
|
+
if ( this.enabled === false ) return;
|
|
1490
|
+
|
|
1491
|
+
event.preventDefault();
|
|
1492
|
+
|
|
1493
|
+
}
|
|
1494
|
+
|
|
1495
|
+
function interceptControlDown( event ) {
|
|
1496
|
+
|
|
1497
|
+
if ( event.key === 'Control' ) {
|
|
1498
|
+
|
|
1499
|
+
this._controlActive = true;
|
|
1500
|
+
|
|
1501
|
+
const document = this.domElement.getRootNode(); // offscreen canvas compatibility
|
|
1502
|
+
|
|
1503
|
+
document.addEventListener( 'keyup', this._interceptControlUp, { passive: true, capture: true } );
|
|
1504
|
+
|
|
1505
|
+
}
|
|
1506
|
+
|
|
1507
|
+
}
|
|
1508
|
+
|
|
1509
|
+
function interceptControlUp( event ) {
|
|
1510
|
+
|
|
1511
|
+
if ( event.key === 'Control' ) {
|
|
1512
|
+
|
|
1513
|
+
this._controlActive = false;
|
|
1514
|
+
|
|
1515
|
+
const document = this.domElement.getRootNode(); // offscreen canvas compatibility
|
|
1516
|
+
|
|
1517
|
+
document.removeEventListener( 'keyup', this._interceptControlUp, { passive: true, capture: true } );
|
|
1518
|
+
|
|
1519
|
+
}
|
|
1520
|
+
|
|
1521
|
+
}
|
|
1522
|
+
|
|
1523
|
+
export { OrbitControls };
|