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.
@@ -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 };