@ccp-nc/crystvis-js 0.4.13
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 +16 -0
- package/.github/workflows/test-mocha.yml +30 -0
- package/.vscode/settings.json +4 -0
- package/LICENSE +21 -0
- package/README.html +1127 -0
- package/README.md +76 -0
- package/demo/demo.css +30 -0
- package/demo/index.html +76 -0
- package/demo/main.js +143 -0
- package/docs/.nojekyll +0 -0
- package/docs-tutorials/Events.md +57 -0
- package/docs-tutorials/Queries.md +50 -0
- package/fonts/Rubik/OFL.txt +93 -0
- package/fonts/Rubik/README.txt +77 -0
- package/fonts/Rubik/Rubik-Italic-VariableFont_wght.ttf +0 -0
- package/fonts/Rubik/Rubik-VariableFont_wght.ttf +0 -0
- package/fonts/Rubik/static/Rubik-Black.ttf +0 -0
- package/fonts/Rubik/static/Rubik-BlackItalic.ttf +0 -0
- package/fonts/Rubik/static/Rubik-Bold.ttf +0 -0
- package/fonts/Rubik/static/Rubik-BoldItalic.ttf +0 -0
- package/fonts/Rubik/static/Rubik-ExtraBold.ttf +0 -0
- package/fonts/Rubik/static/Rubik-ExtraBoldItalic.ttf +0 -0
- package/fonts/Rubik/static/Rubik-Italic.ttf +0 -0
- package/fonts/Rubik/static/Rubik-Light.ttf +0 -0
- package/fonts/Rubik/static/Rubik-LightItalic.ttf +0 -0
- package/fonts/Rubik/static/Rubik-Medium.ttf +0 -0
- package/fonts/Rubik/static/Rubik-MediumItalic.ttf +0 -0
- package/fonts/Rubik/static/Rubik-Regular.ttf +0 -0
- package/fonts/Rubik/static/Rubik-SemiBold.ttf +0 -0
- package/fonts/Rubik/static/Rubik-SemiBoldItalic.ttf +0 -0
- package/index.html +25 -0
- package/index.js +11 -0
- package/jsconf.json +14 -0
- package/lib/assets/fonts/Rubik-Medium.fnt +297 -0
- package/lib/assets/fonts/Rubik-Medium.png +0 -0
- package/lib/assets/fonts/bmpfonts.in.js +16 -0
- package/lib/assets/fonts/bmpfonts.js +9 -0
- package/lib/assets/fonts/font.js +82 -0
- package/lib/assets/fonts/index.js +14 -0
- package/lib/assets/fonts/threebmfont.js +28 -0
- package/lib/data.js +125 -0
- package/lib/formats/cell.js +114 -0
- package/lib/formats/cif.js +22 -0
- package/lib/formats/magres.js +337 -0
- package/lib/formats/xyz.js +124 -0
- package/lib/loader.js +87 -0
- package/lib/model.js +2076 -0
- package/lib/modelview.js +382 -0
- package/lib/nmrdata.js +2898 -0
- package/lib/orbit.js +1233 -0
- package/lib/primitives/atoms.js +261 -0
- package/lib/primitives/cell.js +160 -0
- package/lib/primitives/dither.js +156 -0
- package/lib/primitives/ellipsoid.js +183 -0
- package/lib/primitives/geometries.js +20 -0
- package/lib/primitives/index.js +48 -0
- package/lib/primitives/isosurface.js +171 -0
- package/lib/primitives/shapes.js +100 -0
- package/lib/primitives/sprites.js +172 -0
- package/lib/query.js +158 -0
- package/lib/render.js +440 -0
- package/lib/selbox.js +361 -0
- package/lib/shaders/aura.frag +26 -0
- package/lib/shaders/aura.vert +37 -0
- package/lib/shaders/dither.frag +42 -0
- package/lib/shaders/dither.vert +8 -0
- package/lib/shaders/index.in.js +17 -0
- package/lib/shaders/index.js +25 -0
- package/lib/shaders/msdf300.frag +25 -0
- package/lib/shaders/msdf300.vert +45 -0
- package/lib/tensor.js +227 -0
- package/lib/utils.js +168 -0
- package/lib/visualizer.js +480 -0
- package/package.json +106 -0
- package/scripts/build-bundle.js +17 -0
- package/scripts/build-fonts.js +43 -0
- package/scripts/build-resources.js +46 -0
- package/scripts/plugins-shim.js +10 -0
- package/test/chemdata.js +69 -0
- package/test/data/CHA.cif +74 -0
- package/test/data/H2O.xyz +8 -0
- package/test/data/H2_bound.xyz +4 -0
- package/test/data/ethanol.cell +25 -0
- package/test/data/ethanol.magres +238 -0
- package/test/data/example_single.cif +789 -0
- package/test/data/frac.cell +8 -0
- package/test/data/org.cif +427 -0
- package/test/data/pyridine.xyz +13 -0
- package/test/data/si8.xyz +10 -0
- package/test/loader.js +107 -0
- package/test/model.js +368 -0
- package/test/query.js +135 -0
- package/test/tensor.js +133 -0
- package/test/test-html/examples.js +1485 -0
- package/test/test-html/index.html +33 -0
- package/test/test-html/index.js +279 -0
- package/tools/compile_colors.py +120 -0
- package/tools/compile_periodic.py +96 -0
- package/tools/ptable.json +497 -0
- package/tools/test +5844 -0
package/lib/orbit.js
ADDED
|
@@ -0,0 +1,1233 @@
|
|
|
1
|
+
import {
|
|
2
|
+
EventDispatcher,
|
|
3
|
+
MOUSE,
|
|
4
|
+
Quaternion,
|
|
5
|
+
Spherical,
|
|
6
|
+
TOUCH,
|
|
7
|
+
Vector2,
|
|
8
|
+
Vector3
|
|
9
|
+
} from 'three';
|
|
10
|
+
|
|
11
|
+
// This set of controls performs orbiting, dollying (zooming), and panning.
|
|
12
|
+
// Unlike TrackballControls, it maintains the "up" direction object.up (+Y by default).
|
|
13
|
+
//
|
|
14
|
+
// Orbit - left mouse / touch: one-finger move
|
|
15
|
+
// Zoom - middle mouse, or mousewheel / touch: two-finger spread or squish
|
|
16
|
+
// Pan - right mouse, or left mouse + ctrl/meta, or arrow keys / touch: two-finger move
|
|
17
|
+
|
|
18
|
+
var OrbitControls = function ( object, domElement ) {
|
|
19
|
+
|
|
20
|
+
if ( domElement === undefined ) console.warn( 'THREE.OrbitControls: The second parameter "domElement" is now mandatory.' );
|
|
21
|
+
if ( domElement === document ) console.error( 'THREE.OrbitControls: "document" should not be used as the target "domElement". Please use "renderer.domElement" instead.' );
|
|
22
|
+
|
|
23
|
+
this.object = object;
|
|
24
|
+
this.domElement = domElement;
|
|
25
|
+
|
|
26
|
+
// Set to false to disable this control
|
|
27
|
+
this.enabled = true;
|
|
28
|
+
|
|
29
|
+
// "target" sets the location of focus, where the object orbits around
|
|
30
|
+
this.target = new Vector3();
|
|
31
|
+
|
|
32
|
+
// How far you can dolly in and out ( PerspectiveCamera only )
|
|
33
|
+
this.minDistance = 0;
|
|
34
|
+
this.maxDistance = Infinity;
|
|
35
|
+
|
|
36
|
+
// How far you can zoom in and out ( OrthographicCamera only )
|
|
37
|
+
this.minZoom = 0;
|
|
38
|
+
this.maxZoom = Infinity;
|
|
39
|
+
|
|
40
|
+
// How far you can orbit vertically, upper and lower limits.
|
|
41
|
+
// Range is 0 to Math.PI radians.
|
|
42
|
+
this.minPolarAngle = 0; // radians
|
|
43
|
+
this.maxPolarAngle = Math.PI; // radians
|
|
44
|
+
|
|
45
|
+
// How far you can orbit horizontally, upper and lower limits.
|
|
46
|
+
// If set, the interval [ min, max ] must be a sub-interval of [ - 2 PI, 2 PI ], with ( max - min < 2 PI )
|
|
47
|
+
this.minAzimuthAngle = - Infinity; // radians
|
|
48
|
+
this.maxAzimuthAngle = Infinity; // radians
|
|
49
|
+
|
|
50
|
+
// Set to true to enable damping (inertia)
|
|
51
|
+
// If damping is enabled, you must call controls.update() in your animation loop
|
|
52
|
+
this.enableDamping = false;
|
|
53
|
+
this.dampingFactor = 0.05;
|
|
54
|
+
|
|
55
|
+
// This option actually enables dollying in and out; left as "zoom" for backwards compatibility.
|
|
56
|
+
// Set to false to disable zooming
|
|
57
|
+
this.enableZoom = true;
|
|
58
|
+
this.zoomSpeed = 1.0;
|
|
59
|
+
|
|
60
|
+
// Set to false to disable rotating
|
|
61
|
+
this.enableRotate = true;
|
|
62
|
+
this.rotateSpeed = 1.0;
|
|
63
|
+
|
|
64
|
+
// Set to false to disable panning
|
|
65
|
+
this.enablePan = true;
|
|
66
|
+
this.panSpeed = 1.0;
|
|
67
|
+
this.screenSpacePanning = true; // if false, pan orthogonal to world-space direction camera.up
|
|
68
|
+
this.keyPanSpeed = 7.0; // pixels moved per arrow key push
|
|
69
|
+
|
|
70
|
+
// Set to true to automatically rotate around the target
|
|
71
|
+
// If auto-rotate is enabled, you must call controls.update() in your animation loop
|
|
72
|
+
this.autoRotate = false;
|
|
73
|
+
this.autoRotateSpeed = 2.0; // 30 seconds per round when fps is 60
|
|
74
|
+
|
|
75
|
+
// Set to false to disable use of the keys
|
|
76
|
+
this.enableKeys = true;
|
|
77
|
+
|
|
78
|
+
// The four arrow keys
|
|
79
|
+
this.keys = { LEFT: 37, UP: 38, RIGHT: 39, BOTTOM: 40 };
|
|
80
|
+
|
|
81
|
+
// Mouse buttons
|
|
82
|
+
this.mouseButtons = { LEFT: MOUSE.ROTATE, MIDDLE: MOUSE.DOLLY, RIGHT: MOUSE.PAN };
|
|
83
|
+
|
|
84
|
+
// Touch fingers
|
|
85
|
+
this.touches = { ONE: TOUCH.ROTATE, TWO: TOUCH.DOLLY_PAN };
|
|
86
|
+
|
|
87
|
+
// for reset
|
|
88
|
+
this.target0 = this.target.clone();
|
|
89
|
+
this.position0 = this.object.position.clone();
|
|
90
|
+
this.zoom0 = this.object.zoom;
|
|
91
|
+
|
|
92
|
+
//
|
|
93
|
+
// public methods
|
|
94
|
+
//
|
|
95
|
+
|
|
96
|
+
this.getPolarAngle = function () {
|
|
97
|
+
|
|
98
|
+
return spherical.phi;
|
|
99
|
+
|
|
100
|
+
};
|
|
101
|
+
|
|
102
|
+
this.getAzimuthalAngle = function () {
|
|
103
|
+
|
|
104
|
+
return spherical.theta;
|
|
105
|
+
|
|
106
|
+
};
|
|
107
|
+
|
|
108
|
+
this.saveState = function () {
|
|
109
|
+
|
|
110
|
+
scope.target0.copy( scope.target );
|
|
111
|
+
scope.position0.copy( scope.object.position );
|
|
112
|
+
scope.zoom0 = scope.object.zoom;
|
|
113
|
+
|
|
114
|
+
};
|
|
115
|
+
|
|
116
|
+
this.reset = function () {
|
|
117
|
+
|
|
118
|
+
scope.target.copy( scope.target0 );
|
|
119
|
+
scope.object.position.copy( scope.position0 );
|
|
120
|
+
scope.object.zoom = scope.zoom0;
|
|
121
|
+
|
|
122
|
+
scope.object.updateProjectionMatrix();
|
|
123
|
+
scope.dispatchEvent( changeEvent );
|
|
124
|
+
|
|
125
|
+
scope.update();
|
|
126
|
+
|
|
127
|
+
state = STATE.NONE;
|
|
128
|
+
|
|
129
|
+
};
|
|
130
|
+
|
|
131
|
+
// this method is exposed, but perhaps it would be better if we can make it private...
|
|
132
|
+
this.update = function () {
|
|
133
|
+
|
|
134
|
+
var offset = new Vector3();
|
|
135
|
+
|
|
136
|
+
// so camera.up is the orbit axis
|
|
137
|
+
var quat = new Quaternion().setFromUnitVectors( object.up, new Vector3( 0, 1, 0 ) );
|
|
138
|
+
var quatInverse = quat.clone().invert();
|
|
139
|
+
|
|
140
|
+
var lastPosition = new Vector3();
|
|
141
|
+
var lastQuaternion = new Quaternion();
|
|
142
|
+
|
|
143
|
+
var twoPI = 2 * Math.PI;
|
|
144
|
+
|
|
145
|
+
return function update() {
|
|
146
|
+
|
|
147
|
+
var position = scope.object.position;
|
|
148
|
+
|
|
149
|
+
offset.copy( position ).sub( scope.target );
|
|
150
|
+
|
|
151
|
+
// rotate offset to "y-axis-is-up" space
|
|
152
|
+
offset.applyQuaternion( quat );
|
|
153
|
+
|
|
154
|
+
// angle from z-axis around y-axis
|
|
155
|
+
spherical.setFromVector3( offset );
|
|
156
|
+
|
|
157
|
+
if ( scope.autoRotate && state === STATE.NONE ) {
|
|
158
|
+
|
|
159
|
+
rotateLeft( getAutoRotationAngle() );
|
|
160
|
+
|
|
161
|
+
}
|
|
162
|
+
|
|
163
|
+
if ( scope.enableDamping ) {
|
|
164
|
+
|
|
165
|
+
spherical.theta += sphericalDelta.theta * scope.dampingFactor;
|
|
166
|
+
spherical.phi += sphericalDelta.phi * scope.dampingFactor;
|
|
167
|
+
|
|
168
|
+
} else {
|
|
169
|
+
|
|
170
|
+
spherical.theta += sphericalDelta.theta;
|
|
171
|
+
spherical.phi += sphericalDelta.phi;
|
|
172
|
+
|
|
173
|
+
}
|
|
174
|
+
|
|
175
|
+
// restrict theta to be between desired limits
|
|
176
|
+
|
|
177
|
+
var min = scope.minAzimuthAngle;
|
|
178
|
+
var max = scope.maxAzimuthAngle;
|
|
179
|
+
|
|
180
|
+
if ( isFinite( min ) && isFinite( max ) ) {
|
|
181
|
+
|
|
182
|
+
if ( min < - Math.PI ) min += twoPI; else if ( min > Math.PI ) min -= twoPI;
|
|
183
|
+
|
|
184
|
+
if ( max < - Math.PI ) max += twoPI; else if ( max > Math.PI ) max -= twoPI;
|
|
185
|
+
|
|
186
|
+
if ( min < max ) {
|
|
187
|
+
|
|
188
|
+
spherical.theta = Math.max( min, Math.min( max, spherical.theta ) );
|
|
189
|
+
|
|
190
|
+
} else {
|
|
191
|
+
|
|
192
|
+
spherical.theta = ( spherical.theta > ( min + max ) / 2 ) ?
|
|
193
|
+
Math.max( min, spherical.theta ) :
|
|
194
|
+
Math.min( max, spherical.theta );
|
|
195
|
+
|
|
196
|
+
}
|
|
197
|
+
|
|
198
|
+
}
|
|
199
|
+
|
|
200
|
+
// restrict phi to be between desired limits
|
|
201
|
+
spherical.phi = Math.max( scope.minPolarAngle, Math.min( scope.maxPolarAngle, spherical.phi ) );
|
|
202
|
+
|
|
203
|
+
spherical.makeSafe();
|
|
204
|
+
|
|
205
|
+
|
|
206
|
+
spherical.radius *= scale;
|
|
207
|
+
|
|
208
|
+
// restrict radius to be between desired limits
|
|
209
|
+
spherical.radius = Math.max( scope.minDistance, Math.min( scope.maxDistance, spherical.radius ) );
|
|
210
|
+
|
|
211
|
+
// move target to panned location
|
|
212
|
+
|
|
213
|
+
if ( scope.enableDamping === true ) {
|
|
214
|
+
|
|
215
|
+
scope.target.addScaledVector( panOffset, scope.dampingFactor );
|
|
216
|
+
|
|
217
|
+
} else {
|
|
218
|
+
|
|
219
|
+
scope.target.add( panOffset );
|
|
220
|
+
|
|
221
|
+
}
|
|
222
|
+
|
|
223
|
+
offset.setFromSpherical( spherical );
|
|
224
|
+
|
|
225
|
+
// rotate offset back to "camera-up-vector-is-up" space
|
|
226
|
+
offset.applyQuaternion( quatInverse );
|
|
227
|
+
|
|
228
|
+
position.copy( scope.target ).add( offset );
|
|
229
|
+
|
|
230
|
+
scope.object.lookAt( scope.target );
|
|
231
|
+
|
|
232
|
+
if ( scope.enableDamping === true ) {
|
|
233
|
+
|
|
234
|
+
sphericalDelta.theta *= ( 1 - scope.dampingFactor );
|
|
235
|
+
sphericalDelta.phi *= ( 1 - scope.dampingFactor );
|
|
236
|
+
|
|
237
|
+
panOffset.multiplyScalar( 1 - scope.dampingFactor );
|
|
238
|
+
|
|
239
|
+
} else {
|
|
240
|
+
|
|
241
|
+
sphericalDelta.set( 0, 0, 0 );
|
|
242
|
+
|
|
243
|
+
panOffset.set( 0, 0, 0 );
|
|
244
|
+
|
|
245
|
+
}
|
|
246
|
+
|
|
247
|
+
scale = 1;
|
|
248
|
+
|
|
249
|
+
// update condition is:
|
|
250
|
+
// min(camera displacement, camera rotation in radians)^2 > EPS
|
|
251
|
+
// using small-angle approximation cos(x/2) = 1 - x^2 / 8
|
|
252
|
+
|
|
253
|
+
if ( zoomChanged ||
|
|
254
|
+
lastPosition.distanceToSquared( scope.object.position ) > EPS ||
|
|
255
|
+
8 * ( 1 - lastQuaternion.dot( scope.object.quaternion ) ) > EPS ) {
|
|
256
|
+
|
|
257
|
+
scope.dispatchEvent( changeEvent );
|
|
258
|
+
|
|
259
|
+
lastPosition.copy( scope.object.position );
|
|
260
|
+
lastQuaternion.copy( scope.object.quaternion );
|
|
261
|
+
zoomChanged = false;
|
|
262
|
+
|
|
263
|
+
return true;
|
|
264
|
+
|
|
265
|
+
}
|
|
266
|
+
|
|
267
|
+
return false;
|
|
268
|
+
|
|
269
|
+
};
|
|
270
|
+
|
|
271
|
+
}();
|
|
272
|
+
|
|
273
|
+
this.dispose = function () {
|
|
274
|
+
|
|
275
|
+
scope.domElement.removeEventListener( 'contextmenu', onContextMenu, false );
|
|
276
|
+
|
|
277
|
+
scope.domElement.removeEventListener( 'pointerdown', onPointerDown, false );
|
|
278
|
+
scope.domElement.removeEventListener( 'wheel', onMouseWheel, false );
|
|
279
|
+
|
|
280
|
+
scope.domElement.removeEventListener( 'touchstart', onTouchStart, false );
|
|
281
|
+
scope.domElement.removeEventListener( 'touchend', onTouchEnd, false );
|
|
282
|
+
scope.domElement.removeEventListener( 'touchmove', onTouchMove, false );
|
|
283
|
+
|
|
284
|
+
scope.domElement.ownerDocument.removeEventListener( 'pointermove', onPointerMove, false );
|
|
285
|
+
scope.domElement.ownerDocument.removeEventListener( 'pointerup', onPointerUp, false );
|
|
286
|
+
|
|
287
|
+
scope.domElement.removeEventListener( 'keydown', onKeyDown, false );
|
|
288
|
+
|
|
289
|
+
//scope.dispatchEvent( { type: 'dispose' } ); // should this be added here?
|
|
290
|
+
|
|
291
|
+
};
|
|
292
|
+
|
|
293
|
+
//
|
|
294
|
+
// internals
|
|
295
|
+
//
|
|
296
|
+
|
|
297
|
+
var scope = this;
|
|
298
|
+
|
|
299
|
+
var changeEvent = { type: 'change' };
|
|
300
|
+
var startEvent = { type: 'start' };
|
|
301
|
+
var endEvent = { type: 'end' };
|
|
302
|
+
|
|
303
|
+
var STATE = {
|
|
304
|
+
NONE: - 1,
|
|
305
|
+
ROTATE: 0,
|
|
306
|
+
DOLLY: 1,
|
|
307
|
+
PAN: 2,
|
|
308
|
+
TOUCH_ROTATE: 3,
|
|
309
|
+
TOUCH_PAN: 4,
|
|
310
|
+
TOUCH_DOLLY_PAN: 5,
|
|
311
|
+
TOUCH_DOLLY_ROTATE: 6
|
|
312
|
+
};
|
|
313
|
+
|
|
314
|
+
var state = STATE.NONE;
|
|
315
|
+
|
|
316
|
+
var EPS = 0.000001;
|
|
317
|
+
|
|
318
|
+
// current position in spherical coordinates
|
|
319
|
+
var spherical = new Spherical();
|
|
320
|
+
var sphericalDelta = new Spherical();
|
|
321
|
+
|
|
322
|
+
var scale = 1;
|
|
323
|
+
var panOffset = new Vector3();
|
|
324
|
+
var zoomChanged = false;
|
|
325
|
+
|
|
326
|
+
var rotateStart = new Vector2();
|
|
327
|
+
var rotateEnd = new Vector2();
|
|
328
|
+
var rotateDelta = new Vector2();
|
|
329
|
+
|
|
330
|
+
var panStart = new Vector2();
|
|
331
|
+
var panEnd = new Vector2();
|
|
332
|
+
var panDelta = new Vector2();
|
|
333
|
+
|
|
334
|
+
var dollyStart = new Vector2();
|
|
335
|
+
var dollyEnd = new Vector2();
|
|
336
|
+
var dollyDelta = new Vector2();
|
|
337
|
+
|
|
338
|
+
function getAutoRotationAngle() {
|
|
339
|
+
|
|
340
|
+
return 2 * Math.PI / 60 / 60 * scope.autoRotateSpeed;
|
|
341
|
+
|
|
342
|
+
}
|
|
343
|
+
|
|
344
|
+
function getZoomScale() {
|
|
345
|
+
|
|
346
|
+
return Math.pow( 0.95, scope.zoomSpeed );
|
|
347
|
+
|
|
348
|
+
}
|
|
349
|
+
|
|
350
|
+
function rotateLeft( angle ) {
|
|
351
|
+
|
|
352
|
+
sphericalDelta.theta -= angle;
|
|
353
|
+
|
|
354
|
+
}
|
|
355
|
+
|
|
356
|
+
function rotateUp( angle ) {
|
|
357
|
+
|
|
358
|
+
sphericalDelta.phi -= angle;
|
|
359
|
+
|
|
360
|
+
}
|
|
361
|
+
|
|
362
|
+
var panLeft = function () {
|
|
363
|
+
|
|
364
|
+
var v = new Vector3();
|
|
365
|
+
|
|
366
|
+
return function panLeft( distance, objectMatrix ) {
|
|
367
|
+
|
|
368
|
+
v.setFromMatrixColumn( objectMatrix, 0 ); // get X column of objectMatrix
|
|
369
|
+
v.multiplyScalar( - distance );
|
|
370
|
+
|
|
371
|
+
panOffset.add( v );
|
|
372
|
+
|
|
373
|
+
};
|
|
374
|
+
|
|
375
|
+
}();
|
|
376
|
+
|
|
377
|
+
var panUp = function () {
|
|
378
|
+
|
|
379
|
+
var v = new Vector3();
|
|
380
|
+
|
|
381
|
+
return function panUp( distance, objectMatrix ) {
|
|
382
|
+
|
|
383
|
+
if ( scope.screenSpacePanning === true ) {
|
|
384
|
+
|
|
385
|
+
v.setFromMatrixColumn( objectMatrix, 1 );
|
|
386
|
+
|
|
387
|
+
} else {
|
|
388
|
+
|
|
389
|
+
v.setFromMatrixColumn( objectMatrix, 0 );
|
|
390
|
+
v.crossVectors( scope.object.up, v );
|
|
391
|
+
|
|
392
|
+
}
|
|
393
|
+
|
|
394
|
+
v.multiplyScalar( distance );
|
|
395
|
+
|
|
396
|
+
panOffset.add( v );
|
|
397
|
+
|
|
398
|
+
};
|
|
399
|
+
|
|
400
|
+
}();
|
|
401
|
+
|
|
402
|
+
// deltaX and deltaY are in pixels; right and down are positive
|
|
403
|
+
var pan = function () {
|
|
404
|
+
|
|
405
|
+
var offset = new Vector3();
|
|
406
|
+
|
|
407
|
+
return function pan( deltaX, deltaY ) {
|
|
408
|
+
|
|
409
|
+
var element = scope.domElement;
|
|
410
|
+
|
|
411
|
+
if ( scope.object.isPerspectiveCamera ) {
|
|
412
|
+
|
|
413
|
+
// perspective
|
|
414
|
+
var position = scope.object.position;
|
|
415
|
+
offset.copy( position ).sub( scope.target );
|
|
416
|
+
var targetDistance = offset.length();
|
|
417
|
+
|
|
418
|
+
// half of the fov is center to top of screen
|
|
419
|
+
targetDistance *= Math.tan( ( scope.object.fov / 2 ) * Math.PI / 180.0 );
|
|
420
|
+
|
|
421
|
+
// we use only clientHeight here so aspect ratio does not distort speed
|
|
422
|
+
panLeft( 2 * deltaX * targetDistance / element.clientHeight, scope.object.matrix );
|
|
423
|
+
panUp( 2 * deltaY * targetDistance / element.clientHeight, scope.object.matrix );
|
|
424
|
+
|
|
425
|
+
} else if ( scope.object.isOrthographicCamera ) {
|
|
426
|
+
|
|
427
|
+
// orthographic
|
|
428
|
+
panLeft( deltaX * ( scope.object.right - scope.object.left ) / scope.object.zoom / element.clientWidth, scope.object.matrix );
|
|
429
|
+
panUp( deltaY * ( scope.object.top - scope.object.bottom ) / scope.object.zoom / element.clientHeight, scope.object.matrix );
|
|
430
|
+
|
|
431
|
+
} else {
|
|
432
|
+
|
|
433
|
+
// camera neither orthographic nor perspective
|
|
434
|
+
console.warn( 'WARNING: OrbitControls.js encountered an unknown camera type - pan disabled.' );
|
|
435
|
+
scope.enablePan = false;
|
|
436
|
+
|
|
437
|
+
}
|
|
438
|
+
|
|
439
|
+
};
|
|
440
|
+
|
|
441
|
+
}();
|
|
442
|
+
|
|
443
|
+
function dollyOut( dollyScale ) {
|
|
444
|
+
|
|
445
|
+
if ( scope.object.isPerspectiveCamera ) {
|
|
446
|
+
|
|
447
|
+
scale /= dollyScale;
|
|
448
|
+
|
|
449
|
+
} else if ( scope.object.isOrthographicCamera ) {
|
|
450
|
+
|
|
451
|
+
scope.object.zoom = Math.max( scope.minZoom, Math.min( scope.maxZoom, scope.object.zoom * dollyScale ) );
|
|
452
|
+
scope.object.updateProjectionMatrix();
|
|
453
|
+
zoomChanged = true;
|
|
454
|
+
|
|
455
|
+
} else {
|
|
456
|
+
|
|
457
|
+
console.warn( 'WARNING: OrbitControls.js encountered an unknown camera type - dolly/zoom disabled.' );
|
|
458
|
+
scope.enableZoom = false;
|
|
459
|
+
|
|
460
|
+
}
|
|
461
|
+
|
|
462
|
+
}
|
|
463
|
+
|
|
464
|
+
function dollyIn( dollyScale ) {
|
|
465
|
+
|
|
466
|
+
if ( scope.object.isPerspectiveCamera ) {
|
|
467
|
+
|
|
468
|
+
scale *= dollyScale;
|
|
469
|
+
|
|
470
|
+
} else if ( scope.object.isOrthographicCamera ) {
|
|
471
|
+
|
|
472
|
+
scope.object.zoom = Math.max( scope.minZoom, Math.min( scope.maxZoom, scope.object.zoom / dollyScale ) );
|
|
473
|
+
scope.object.updateProjectionMatrix();
|
|
474
|
+
zoomChanged = true;
|
|
475
|
+
|
|
476
|
+
} else {
|
|
477
|
+
|
|
478
|
+
console.warn( 'WARNING: OrbitControls.js encountered an unknown camera type - dolly/zoom disabled.' );
|
|
479
|
+
scope.enableZoom = false;
|
|
480
|
+
|
|
481
|
+
}
|
|
482
|
+
|
|
483
|
+
}
|
|
484
|
+
|
|
485
|
+
//
|
|
486
|
+
// event callbacks - update the object state
|
|
487
|
+
//
|
|
488
|
+
|
|
489
|
+
function handleMouseDownRotate( event ) {
|
|
490
|
+
|
|
491
|
+
rotateStart.set( event.clientX, event.clientY );
|
|
492
|
+
|
|
493
|
+
}
|
|
494
|
+
|
|
495
|
+
function handleMouseDownDolly( event ) {
|
|
496
|
+
|
|
497
|
+
dollyStart.set( event.clientX, event.clientY );
|
|
498
|
+
|
|
499
|
+
}
|
|
500
|
+
|
|
501
|
+
function handleMouseDownPan( event ) {
|
|
502
|
+
|
|
503
|
+
panStart.set( event.clientX, event.clientY );
|
|
504
|
+
|
|
505
|
+
}
|
|
506
|
+
|
|
507
|
+
function handleMouseMoveRotate( event ) {
|
|
508
|
+
|
|
509
|
+
rotateEnd.set( event.clientX, event.clientY );
|
|
510
|
+
|
|
511
|
+
rotateDelta.subVectors( rotateEnd, rotateStart ).multiplyScalar( scope.rotateSpeed );
|
|
512
|
+
|
|
513
|
+
var element = scope.domElement;
|
|
514
|
+
|
|
515
|
+
rotateLeft( 2 * Math.PI * rotateDelta.x / element.clientHeight ); // yes, height
|
|
516
|
+
|
|
517
|
+
rotateUp( 2 * Math.PI * rotateDelta.y / element.clientHeight );
|
|
518
|
+
|
|
519
|
+
rotateStart.copy( rotateEnd );
|
|
520
|
+
|
|
521
|
+
scope.update();
|
|
522
|
+
|
|
523
|
+
}
|
|
524
|
+
|
|
525
|
+
function handleMouseMoveDolly( event ) {
|
|
526
|
+
|
|
527
|
+
dollyEnd.set( event.clientX, event.clientY );
|
|
528
|
+
|
|
529
|
+
dollyDelta.subVectors( dollyEnd, dollyStart );
|
|
530
|
+
|
|
531
|
+
if ( dollyDelta.y > 0 ) {
|
|
532
|
+
|
|
533
|
+
dollyOut( getZoomScale() );
|
|
534
|
+
|
|
535
|
+
} else if ( dollyDelta.y < 0 ) {
|
|
536
|
+
|
|
537
|
+
dollyIn( getZoomScale() );
|
|
538
|
+
|
|
539
|
+
}
|
|
540
|
+
|
|
541
|
+
dollyStart.copy( dollyEnd );
|
|
542
|
+
|
|
543
|
+
scope.update();
|
|
544
|
+
|
|
545
|
+
}
|
|
546
|
+
|
|
547
|
+
function handleMouseMovePan( event ) {
|
|
548
|
+
|
|
549
|
+
panEnd.set( event.clientX, event.clientY );
|
|
550
|
+
|
|
551
|
+
panDelta.subVectors( panEnd, panStart ).multiplyScalar( scope.panSpeed );
|
|
552
|
+
|
|
553
|
+
pan( panDelta.x, panDelta.y );
|
|
554
|
+
|
|
555
|
+
panStart.copy( panEnd );
|
|
556
|
+
|
|
557
|
+
scope.update();
|
|
558
|
+
|
|
559
|
+
}
|
|
560
|
+
|
|
561
|
+
function handleMouseUp( /*event*/ ) {
|
|
562
|
+
|
|
563
|
+
// no-op
|
|
564
|
+
|
|
565
|
+
}
|
|
566
|
+
|
|
567
|
+
function handleMouseWheel( event ) {
|
|
568
|
+
|
|
569
|
+
if ( event.deltaY < 0 ) {
|
|
570
|
+
|
|
571
|
+
dollyIn( getZoomScale() );
|
|
572
|
+
|
|
573
|
+
} else if ( event.deltaY > 0 ) {
|
|
574
|
+
|
|
575
|
+
dollyOut( getZoomScale() );
|
|
576
|
+
|
|
577
|
+
}
|
|
578
|
+
|
|
579
|
+
scope.update();
|
|
580
|
+
|
|
581
|
+
}
|
|
582
|
+
|
|
583
|
+
function handleKeyDown( event ) {
|
|
584
|
+
|
|
585
|
+
var needsUpdate = false;
|
|
586
|
+
|
|
587
|
+
switch ( event.keyCode ) {
|
|
588
|
+
|
|
589
|
+
case scope.keys.UP:
|
|
590
|
+
pan( 0, scope.keyPanSpeed );
|
|
591
|
+
needsUpdate = true;
|
|
592
|
+
break;
|
|
593
|
+
|
|
594
|
+
case scope.keys.BOTTOM:
|
|
595
|
+
pan( 0, - scope.keyPanSpeed );
|
|
596
|
+
needsUpdate = true;
|
|
597
|
+
break;
|
|
598
|
+
|
|
599
|
+
case scope.keys.LEFT:
|
|
600
|
+
pan( scope.keyPanSpeed, 0 );
|
|
601
|
+
needsUpdate = true;
|
|
602
|
+
break;
|
|
603
|
+
|
|
604
|
+
case scope.keys.RIGHT:
|
|
605
|
+
pan( - scope.keyPanSpeed, 0 );
|
|
606
|
+
needsUpdate = true;
|
|
607
|
+
break;
|
|
608
|
+
|
|
609
|
+
}
|
|
610
|
+
|
|
611
|
+
if ( needsUpdate ) {
|
|
612
|
+
|
|
613
|
+
// prevent the browser from scrolling on cursor keys
|
|
614
|
+
event.preventDefault();
|
|
615
|
+
|
|
616
|
+
scope.update();
|
|
617
|
+
|
|
618
|
+
}
|
|
619
|
+
|
|
620
|
+
|
|
621
|
+
}
|
|
622
|
+
|
|
623
|
+
function handleTouchStartRotate( event ) {
|
|
624
|
+
|
|
625
|
+
if ( event.touches.length == 1 ) {
|
|
626
|
+
|
|
627
|
+
rotateStart.set( event.touches[ 0 ].pageX, event.touches[ 0 ].pageY );
|
|
628
|
+
|
|
629
|
+
} else {
|
|
630
|
+
|
|
631
|
+
var x = 0.5 * ( event.touches[ 0 ].pageX + event.touches[ 1 ].pageX );
|
|
632
|
+
var y = 0.5 * ( event.touches[ 0 ].pageY + event.touches[ 1 ].pageY );
|
|
633
|
+
|
|
634
|
+
rotateStart.set( x, y );
|
|
635
|
+
|
|
636
|
+
}
|
|
637
|
+
|
|
638
|
+
}
|
|
639
|
+
|
|
640
|
+
function handleTouchStartPan( event ) {
|
|
641
|
+
|
|
642
|
+
if ( event.touches.length == 1 ) {
|
|
643
|
+
|
|
644
|
+
panStart.set( event.touches[ 0 ].pageX, event.touches[ 0 ].pageY );
|
|
645
|
+
|
|
646
|
+
} else {
|
|
647
|
+
|
|
648
|
+
var x = 0.5 * ( event.touches[ 0 ].pageX + event.touches[ 1 ].pageX );
|
|
649
|
+
var y = 0.5 * ( event.touches[ 0 ].pageY + event.touches[ 1 ].pageY );
|
|
650
|
+
|
|
651
|
+
panStart.set( x, y );
|
|
652
|
+
|
|
653
|
+
}
|
|
654
|
+
|
|
655
|
+
}
|
|
656
|
+
|
|
657
|
+
function handleTouchStartDolly( event ) {
|
|
658
|
+
|
|
659
|
+
var dx = event.touches[ 0 ].pageX - event.touches[ 1 ].pageX;
|
|
660
|
+
var dy = event.touches[ 0 ].pageY - event.touches[ 1 ].pageY;
|
|
661
|
+
|
|
662
|
+
var distance = Math.sqrt( dx * dx + dy * dy );
|
|
663
|
+
|
|
664
|
+
dollyStart.set( 0, distance );
|
|
665
|
+
|
|
666
|
+
}
|
|
667
|
+
|
|
668
|
+
function handleTouchStartDollyPan( event ) {
|
|
669
|
+
|
|
670
|
+
if ( scope.enableZoom ) handleTouchStartDolly( event );
|
|
671
|
+
|
|
672
|
+
if ( scope.enablePan ) handleTouchStartPan( event );
|
|
673
|
+
|
|
674
|
+
}
|
|
675
|
+
|
|
676
|
+
function handleTouchStartDollyRotate( event ) {
|
|
677
|
+
|
|
678
|
+
if ( scope.enableZoom ) handleTouchStartDolly( event );
|
|
679
|
+
|
|
680
|
+
if ( scope.enableRotate ) handleTouchStartRotate( event );
|
|
681
|
+
|
|
682
|
+
}
|
|
683
|
+
|
|
684
|
+
function handleTouchMoveRotate( event ) {
|
|
685
|
+
|
|
686
|
+
if ( event.touches.length == 1 ) {
|
|
687
|
+
|
|
688
|
+
rotateEnd.set( event.touches[ 0 ].pageX, event.touches[ 0 ].pageY );
|
|
689
|
+
|
|
690
|
+
} else {
|
|
691
|
+
|
|
692
|
+
var x = 0.5 * ( event.touches[ 0 ].pageX + event.touches[ 1 ].pageX );
|
|
693
|
+
var y = 0.5 * ( event.touches[ 0 ].pageY + event.touches[ 1 ].pageY );
|
|
694
|
+
|
|
695
|
+
rotateEnd.set( x, y );
|
|
696
|
+
|
|
697
|
+
}
|
|
698
|
+
|
|
699
|
+
rotateDelta.subVectors( rotateEnd, rotateStart ).multiplyScalar( scope.rotateSpeed );
|
|
700
|
+
|
|
701
|
+
var element = scope.domElement;
|
|
702
|
+
|
|
703
|
+
rotateLeft( 2 * Math.PI * rotateDelta.x / element.clientHeight ); // yes, height
|
|
704
|
+
|
|
705
|
+
rotateUp( 2 * Math.PI * rotateDelta.y / element.clientHeight );
|
|
706
|
+
|
|
707
|
+
rotateStart.copy( rotateEnd );
|
|
708
|
+
|
|
709
|
+
}
|
|
710
|
+
|
|
711
|
+
function handleTouchMovePan( event ) {
|
|
712
|
+
|
|
713
|
+
if ( event.touches.length == 1 ) {
|
|
714
|
+
|
|
715
|
+
panEnd.set( event.touches[ 0 ].pageX, event.touches[ 0 ].pageY );
|
|
716
|
+
|
|
717
|
+
} else {
|
|
718
|
+
|
|
719
|
+
var x = 0.5 * ( event.touches[ 0 ].pageX + event.touches[ 1 ].pageX );
|
|
720
|
+
var y = 0.5 * ( event.touches[ 0 ].pageY + event.touches[ 1 ].pageY );
|
|
721
|
+
|
|
722
|
+
panEnd.set( x, y );
|
|
723
|
+
|
|
724
|
+
}
|
|
725
|
+
|
|
726
|
+
panDelta.subVectors( panEnd, panStart ).multiplyScalar( scope.panSpeed );
|
|
727
|
+
|
|
728
|
+
pan( panDelta.x, panDelta.y );
|
|
729
|
+
|
|
730
|
+
panStart.copy( panEnd );
|
|
731
|
+
|
|
732
|
+
}
|
|
733
|
+
|
|
734
|
+
function handleTouchMoveDolly( event ) {
|
|
735
|
+
|
|
736
|
+
var dx = event.touches[ 0 ].pageX - event.touches[ 1 ].pageX;
|
|
737
|
+
var dy = event.touches[ 0 ].pageY - event.touches[ 1 ].pageY;
|
|
738
|
+
|
|
739
|
+
var distance = Math.sqrt( dx * dx + dy * dy );
|
|
740
|
+
|
|
741
|
+
dollyEnd.set( 0, distance );
|
|
742
|
+
|
|
743
|
+
dollyDelta.set( 0, Math.pow( dollyEnd.y / dollyStart.y, scope.zoomSpeed ) );
|
|
744
|
+
|
|
745
|
+
dollyOut( dollyDelta.y );
|
|
746
|
+
|
|
747
|
+
dollyStart.copy( dollyEnd );
|
|
748
|
+
|
|
749
|
+
}
|
|
750
|
+
|
|
751
|
+
function handleTouchMoveDollyPan( event ) {
|
|
752
|
+
|
|
753
|
+
if ( scope.enableZoom ) handleTouchMoveDolly( event );
|
|
754
|
+
|
|
755
|
+
if ( scope.enablePan ) handleTouchMovePan( event );
|
|
756
|
+
|
|
757
|
+
}
|
|
758
|
+
|
|
759
|
+
function handleTouchMoveDollyRotate( event ) {
|
|
760
|
+
|
|
761
|
+
if ( scope.enableZoom ) handleTouchMoveDolly( event );
|
|
762
|
+
|
|
763
|
+
if ( scope.enableRotate ) handleTouchMoveRotate( event );
|
|
764
|
+
|
|
765
|
+
}
|
|
766
|
+
|
|
767
|
+
function handleTouchEnd( /*event*/ ) {
|
|
768
|
+
|
|
769
|
+
// no-op
|
|
770
|
+
|
|
771
|
+
}
|
|
772
|
+
|
|
773
|
+
//
|
|
774
|
+
// event handlers - FSM: listen for events and reset state
|
|
775
|
+
//
|
|
776
|
+
|
|
777
|
+
function onPointerDown( event ) {
|
|
778
|
+
|
|
779
|
+
if ( scope.enabled === false ) return;
|
|
780
|
+
|
|
781
|
+
switch ( event.pointerType ) {
|
|
782
|
+
|
|
783
|
+
case 'mouse':
|
|
784
|
+
case 'pen':
|
|
785
|
+
onMouseDown( event );
|
|
786
|
+
break;
|
|
787
|
+
|
|
788
|
+
// TODO touch
|
|
789
|
+
|
|
790
|
+
}
|
|
791
|
+
|
|
792
|
+
}
|
|
793
|
+
|
|
794
|
+
function onPointerMove( event ) {
|
|
795
|
+
|
|
796
|
+
if ( scope.enabled === false ) return;
|
|
797
|
+
|
|
798
|
+
switch ( event.pointerType ) {
|
|
799
|
+
|
|
800
|
+
case 'mouse':
|
|
801
|
+
case 'pen':
|
|
802
|
+
onMouseMove( event );
|
|
803
|
+
break;
|
|
804
|
+
|
|
805
|
+
// TODO touch
|
|
806
|
+
|
|
807
|
+
}
|
|
808
|
+
|
|
809
|
+
}
|
|
810
|
+
|
|
811
|
+
function onPointerUp( event ) {
|
|
812
|
+
|
|
813
|
+
if ( scope.enabled === false ) return;
|
|
814
|
+
|
|
815
|
+
switch ( event.pointerType ) {
|
|
816
|
+
|
|
817
|
+
case 'mouse':
|
|
818
|
+
case 'pen':
|
|
819
|
+
onMouseUp( event );
|
|
820
|
+
break;
|
|
821
|
+
|
|
822
|
+
// TODO touch
|
|
823
|
+
|
|
824
|
+
}
|
|
825
|
+
|
|
826
|
+
}
|
|
827
|
+
|
|
828
|
+
function onMouseDown( event ) {
|
|
829
|
+
|
|
830
|
+
// Prevent the browser from scrolling.
|
|
831
|
+
event.preventDefault();
|
|
832
|
+
|
|
833
|
+
// Manually set the focus since calling preventDefault above
|
|
834
|
+
// prevents the browser from setting it automatically.
|
|
835
|
+
|
|
836
|
+
scope.domElement.focus ? scope.domElement.focus() : window.focus();
|
|
837
|
+
|
|
838
|
+
var mouseAction;
|
|
839
|
+
|
|
840
|
+
switch ( event.button ) {
|
|
841
|
+
|
|
842
|
+
case 0:
|
|
843
|
+
|
|
844
|
+
mouseAction = scope.mouseButtons.LEFT;
|
|
845
|
+
break;
|
|
846
|
+
|
|
847
|
+
case 1:
|
|
848
|
+
|
|
849
|
+
mouseAction = scope.mouseButtons.MIDDLE;
|
|
850
|
+
break;
|
|
851
|
+
|
|
852
|
+
case 2:
|
|
853
|
+
|
|
854
|
+
mouseAction = scope.mouseButtons.RIGHT;
|
|
855
|
+
break;
|
|
856
|
+
|
|
857
|
+
default:
|
|
858
|
+
|
|
859
|
+
mouseAction = - 1;
|
|
860
|
+
|
|
861
|
+
}
|
|
862
|
+
|
|
863
|
+
switch ( mouseAction ) {
|
|
864
|
+
|
|
865
|
+
case MOUSE.DOLLY:
|
|
866
|
+
|
|
867
|
+
if ( scope.enableZoom === false ) return;
|
|
868
|
+
|
|
869
|
+
handleMouseDownDolly( event );
|
|
870
|
+
|
|
871
|
+
state = STATE.DOLLY;
|
|
872
|
+
|
|
873
|
+
break;
|
|
874
|
+
|
|
875
|
+
case MOUSE.ROTATE:
|
|
876
|
+
|
|
877
|
+
if ( event.ctrlKey || event.metaKey ) {
|
|
878
|
+
|
|
879
|
+
if ( scope.enablePan === false ) return;
|
|
880
|
+
|
|
881
|
+
handleMouseDownPan( event );
|
|
882
|
+
|
|
883
|
+
state = STATE.PAN;
|
|
884
|
+
|
|
885
|
+
} else if (event.shiftKey) {
|
|
886
|
+
break;
|
|
887
|
+
} else {
|
|
888
|
+
|
|
889
|
+
if ( scope.enableRotate === false ) return;
|
|
890
|
+
|
|
891
|
+
handleMouseDownRotate( event );
|
|
892
|
+
|
|
893
|
+
state = STATE.ROTATE;
|
|
894
|
+
|
|
895
|
+
}
|
|
896
|
+
|
|
897
|
+
break;
|
|
898
|
+
|
|
899
|
+
case MOUSE.PAN:
|
|
900
|
+
|
|
901
|
+
if ( event.ctrlKey || event.metaKey ) {
|
|
902
|
+
|
|
903
|
+
if ( scope.enableRotate === false ) return;
|
|
904
|
+
|
|
905
|
+
handleMouseDownRotate( event );
|
|
906
|
+
|
|
907
|
+
state = STATE.ROTATE;
|
|
908
|
+
|
|
909
|
+
} else if (event.shiftKey) {
|
|
910
|
+
break;
|
|
911
|
+
} else {
|
|
912
|
+
|
|
913
|
+
if ( scope.enablePan === false ) return;
|
|
914
|
+
|
|
915
|
+
handleMouseDownPan( event );
|
|
916
|
+
|
|
917
|
+
state = STATE.PAN;
|
|
918
|
+
|
|
919
|
+
}
|
|
920
|
+
|
|
921
|
+
break;
|
|
922
|
+
|
|
923
|
+
default:
|
|
924
|
+
|
|
925
|
+
state = STATE.NONE;
|
|
926
|
+
|
|
927
|
+
}
|
|
928
|
+
|
|
929
|
+
if ( state !== STATE.NONE ) {
|
|
930
|
+
|
|
931
|
+
scope.domElement.ownerDocument.addEventListener( 'pointermove', onPointerMove, false );
|
|
932
|
+
scope.domElement.ownerDocument.addEventListener( 'pointerup', onPointerUp, false );
|
|
933
|
+
|
|
934
|
+
scope.dispatchEvent( startEvent );
|
|
935
|
+
|
|
936
|
+
}
|
|
937
|
+
|
|
938
|
+
}
|
|
939
|
+
|
|
940
|
+
function onMouseMove( event ) {
|
|
941
|
+
|
|
942
|
+
if ( scope.enabled === false ) return;
|
|
943
|
+
|
|
944
|
+
event.preventDefault();
|
|
945
|
+
|
|
946
|
+
switch ( state ) {
|
|
947
|
+
|
|
948
|
+
case STATE.ROTATE:
|
|
949
|
+
|
|
950
|
+
if ( scope.enableRotate === false ) return;
|
|
951
|
+
|
|
952
|
+
handleMouseMoveRotate( event );
|
|
953
|
+
|
|
954
|
+
break;
|
|
955
|
+
|
|
956
|
+
case STATE.DOLLY:
|
|
957
|
+
|
|
958
|
+
if ( scope.enableZoom === false ) return;
|
|
959
|
+
|
|
960
|
+
handleMouseMoveDolly( event );
|
|
961
|
+
|
|
962
|
+
break;
|
|
963
|
+
|
|
964
|
+
case STATE.PAN:
|
|
965
|
+
|
|
966
|
+
if ( scope.enablePan === false ) return;
|
|
967
|
+
|
|
968
|
+
handleMouseMovePan( event );
|
|
969
|
+
|
|
970
|
+
break;
|
|
971
|
+
|
|
972
|
+
}
|
|
973
|
+
|
|
974
|
+
}
|
|
975
|
+
|
|
976
|
+
function onMouseUp( event ) {
|
|
977
|
+
|
|
978
|
+
if ( scope.enabled === false ) return;
|
|
979
|
+
|
|
980
|
+
handleMouseUp( event );
|
|
981
|
+
|
|
982
|
+
scope.domElement.ownerDocument.removeEventListener( 'pointermove', onPointerMove, false );
|
|
983
|
+
scope.domElement.ownerDocument.removeEventListener( 'pointerup', onPointerUp, false );
|
|
984
|
+
|
|
985
|
+
scope.dispatchEvent( endEvent );
|
|
986
|
+
|
|
987
|
+
state = STATE.NONE;
|
|
988
|
+
|
|
989
|
+
}
|
|
990
|
+
|
|
991
|
+
function onMouseWheel( event ) {
|
|
992
|
+
|
|
993
|
+
if ( scope.enabled === false || scope.enableZoom === false || ( state !== STATE.NONE && state !== STATE.ROTATE ) ) return;
|
|
994
|
+
|
|
995
|
+
event.preventDefault();
|
|
996
|
+
event.stopPropagation();
|
|
997
|
+
|
|
998
|
+
scope.dispatchEvent( startEvent );
|
|
999
|
+
|
|
1000
|
+
handleMouseWheel( event );
|
|
1001
|
+
|
|
1002
|
+
scope.dispatchEvent( endEvent );
|
|
1003
|
+
|
|
1004
|
+
}
|
|
1005
|
+
|
|
1006
|
+
function onKeyDown( event ) {
|
|
1007
|
+
|
|
1008
|
+
if ( scope.enabled === false || scope.enableKeys === false || scope.enablePan === false ) return;
|
|
1009
|
+
|
|
1010
|
+
handleKeyDown( event );
|
|
1011
|
+
|
|
1012
|
+
}
|
|
1013
|
+
|
|
1014
|
+
function onTouchStart( event ) {
|
|
1015
|
+
|
|
1016
|
+
if ( scope.enabled === false ) return;
|
|
1017
|
+
|
|
1018
|
+
event.preventDefault(); // prevent scrolling
|
|
1019
|
+
|
|
1020
|
+
switch ( event.touches.length ) {
|
|
1021
|
+
|
|
1022
|
+
case 1:
|
|
1023
|
+
|
|
1024
|
+
switch ( scope.touches.ONE ) {
|
|
1025
|
+
|
|
1026
|
+
case TOUCH.ROTATE:
|
|
1027
|
+
|
|
1028
|
+
if ( scope.enableRotate === false ) return;
|
|
1029
|
+
|
|
1030
|
+
handleTouchStartRotate( event );
|
|
1031
|
+
|
|
1032
|
+
state = STATE.TOUCH_ROTATE;
|
|
1033
|
+
|
|
1034
|
+
break;
|
|
1035
|
+
|
|
1036
|
+
case TOUCH.PAN:
|
|
1037
|
+
|
|
1038
|
+
if ( scope.enablePan === false ) return;
|
|
1039
|
+
|
|
1040
|
+
handleTouchStartPan( event );
|
|
1041
|
+
|
|
1042
|
+
state = STATE.TOUCH_PAN;
|
|
1043
|
+
|
|
1044
|
+
break;
|
|
1045
|
+
|
|
1046
|
+
default:
|
|
1047
|
+
|
|
1048
|
+
state = STATE.NONE;
|
|
1049
|
+
|
|
1050
|
+
}
|
|
1051
|
+
|
|
1052
|
+
break;
|
|
1053
|
+
|
|
1054
|
+
case 2:
|
|
1055
|
+
|
|
1056
|
+
switch ( scope.touches.TWO ) {
|
|
1057
|
+
|
|
1058
|
+
case TOUCH.DOLLY_PAN:
|
|
1059
|
+
|
|
1060
|
+
if ( scope.enableZoom === false && scope.enablePan === false ) return;
|
|
1061
|
+
|
|
1062
|
+
handleTouchStartDollyPan( event );
|
|
1063
|
+
|
|
1064
|
+
state = STATE.TOUCH_DOLLY_PAN;
|
|
1065
|
+
|
|
1066
|
+
break;
|
|
1067
|
+
|
|
1068
|
+
case TOUCH.DOLLY_ROTATE:
|
|
1069
|
+
|
|
1070
|
+
if ( scope.enableZoom === false && scope.enableRotate === false ) return;
|
|
1071
|
+
|
|
1072
|
+
handleTouchStartDollyRotate( event );
|
|
1073
|
+
|
|
1074
|
+
state = STATE.TOUCH_DOLLY_ROTATE;
|
|
1075
|
+
|
|
1076
|
+
break;
|
|
1077
|
+
|
|
1078
|
+
default:
|
|
1079
|
+
|
|
1080
|
+
state = STATE.NONE;
|
|
1081
|
+
|
|
1082
|
+
}
|
|
1083
|
+
|
|
1084
|
+
break;
|
|
1085
|
+
|
|
1086
|
+
default:
|
|
1087
|
+
|
|
1088
|
+
state = STATE.NONE;
|
|
1089
|
+
|
|
1090
|
+
}
|
|
1091
|
+
|
|
1092
|
+
if ( state !== STATE.NONE ) {
|
|
1093
|
+
|
|
1094
|
+
scope.dispatchEvent( startEvent );
|
|
1095
|
+
|
|
1096
|
+
}
|
|
1097
|
+
|
|
1098
|
+
}
|
|
1099
|
+
|
|
1100
|
+
function onTouchMove( event ) {
|
|
1101
|
+
|
|
1102
|
+
if ( scope.enabled === false ) return;
|
|
1103
|
+
|
|
1104
|
+
event.preventDefault(); // prevent scrolling
|
|
1105
|
+
event.stopPropagation();
|
|
1106
|
+
|
|
1107
|
+
switch ( state ) {
|
|
1108
|
+
|
|
1109
|
+
case STATE.TOUCH_ROTATE:
|
|
1110
|
+
|
|
1111
|
+
if ( scope.enableRotate === false ) return;
|
|
1112
|
+
|
|
1113
|
+
handleTouchMoveRotate( event );
|
|
1114
|
+
|
|
1115
|
+
scope.update();
|
|
1116
|
+
|
|
1117
|
+
break;
|
|
1118
|
+
|
|
1119
|
+
case STATE.TOUCH_PAN:
|
|
1120
|
+
|
|
1121
|
+
if ( scope.enablePan === false ) return;
|
|
1122
|
+
|
|
1123
|
+
handleTouchMovePan( event );
|
|
1124
|
+
|
|
1125
|
+
scope.update();
|
|
1126
|
+
|
|
1127
|
+
break;
|
|
1128
|
+
|
|
1129
|
+
case STATE.TOUCH_DOLLY_PAN:
|
|
1130
|
+
|
|
1131
|
+
if ( scope.enableZoom === false && scope.enablePan === false ) return;
|
|
1132
|
+
|
|
1133
|
+
handleTouchMoveDollyPan( event );
|
|
1134
|
+
|
|
1135
|
+
scope.update();
|
|
1136
|
+
|
|
1137
|
+
break;
|
|
1138
|
+
|
|
1139
|
+
case STATE.TOUCH_DOLLY_ROTATE:
|
|
1140
|
+
|
|
1141
|
+
if ( scope.enableZoom === false && scope.enableRotate === false ) return;
|
|
1142
|
+
|
|
1143
|
+
handleTouchMoveDollyRotate( event );
|
|
1144
|
+
|
|
1145
|
+
scope.update();
|
|
1146
|
+
|
|
1147
|
+
break;
|
|
1148
|
+
|
|
1149
|
+
default:
|
|
1150
|
+
|
|
1151
|
+
state = STATE.NONE;
|
|
1152
|
+
|
|
1153
|
+
}
|
|
1154
|
+
|
|
1155
|
+
}
|
|
1156
|
+
|
|
1157
|
+
function onTouchEnd( event ) {
|
|
1158
|
+
|
|
1159
|
+
if ( scope.enabled === false ) return;
|
|
1160
|
+
|
|
1161
|
+
handleTouchEnd( event );
|
|
1162
|
+
|
|
1163
|
+
scope.dispatchEvent( endEvent );
|
|
1164
|
+
|
|
1165
|
+
state = STATE.NONE;
|
|
1166
|
+
|
|
1167
|
+
}
|
|
1168
|
+
|
|
1169
|
+
function onContextMenu( event ) {
|
|
1170
|
+
|
|
1171
|
+
if ( scope.enabled === false ) return;
|
|
1172
|
+
|
|
1173
|
+
event.preventDefault();
|
|
1174
|
+
|
|
1175
|
+
}
|
|
1176
|
+
|
|
1177
|
+
//
|
|
1178
|
+
|
|
1179
|
+
scope.domElement.addEventListener( 'contextmenu', onContextMenu, false );
|
|
1180
|
+
|
|
1181
|
+
scope.domElement.addEventListener( 'pointerdown', onPointerDown, false );
|
|
1182
|
+
scope.domElement.addEventListener( 'wheel', onMouseWheel, false );
|
|
1183
|
+
|
|
1184
|
+
scope.domElement.addEventListener( 'touchstart', onTouchStart, false );
|
|
1185
|
+
scope.domElement.addEventListener( 'touchend', onTouchEnd, false );
|
|
1186
|
+
scope.domElement.addEventListener( 'touchmove', onTouchMove, false );
|
|
1187
|
+
|
|
1188
|
+
scope.domElement.addEventListener( 'keydown', onKeyDown, false );
|
|
1189
|
+
|
|
1190
|
+
// make sure element can receive keys.
|
|
1191
|
+
|
|
1192
|
+
if ( scope.domElement.tabIndex === - 1 ) {
|
|
1193
|
+
|
|
1194
|
+
scope.domElement.tabIndex = 0;
|
|
1195
|
+
|
|
1196
|
+
}
|
|
1197
|
+
|
|
1198
|
+
// force an update at start
|
|
1199
|
+
|
|
1200
|
+
this.update();
|
|
1201
|
+
|
|
1202
|
+
};
|
|
1203
|
+
|
|
1204
|
+
OrbitControls.prototype = Object.create( EventDispatcher.prototype );
|
|
1205
|
+
OrbitControls.prototype.constructor = OrbitControls;
|
|
1206
|
+
|
|
1207
|
+
|
|
1208
|
+
// This set of controls performs orbiting, dollying (zooming), and panning.
|
|
1209
|
+
// Unlike TrackballControls, it maintains the "up" direction object.up (+Y by default).
|
|
1210
|
+
// This is very similar to OrbitControls, another set of touch behavior
|
|
1211
|
+
//
|
|
1212
|
+
// Orbit - right mouse, or left mouse + ctrl/meta / touch: two-finger rotate
|
|
1213
|
+
// Zoom - middle mouse, or mousewheel / touch: two-finger spread or squish
|
|
1214
|
+
// Pan - left mouse, or arrow keys / touch: one-finger move
|
|
1215
|
+
|
|
1216
|
+
var MapControls = function ( object, domElement ) {
|
|
1217
|
+
|
|
1218
|
+
OrbitControls.call( this, object, domElement );
|
|
1219
|
+
|
|
1220
|
+
this.screenSpacePanning = false; // pan orthogonal to world-space direction camera.up
|
|
1221
|
+
|
|
1222
|
+
this.mouseButtons.LEFT = MOUSE.PAN;
|
|
1223
|
+
this.mouseButtons.RIGHT = MOUSE.ROTATE;
|
|
1224
|
+
|
|
1225
|
+
this.touches.ONE = TOUCH.PAN;
|
|
1226
|
+
this.touches.TWO = TOUCH.DOLLY_ROTATE;
|
|
1227
|
+
|
|
1228
|
+
};
|
|
1229
|
+
|
|
1230
|
+
MapControls.prototype = Object.create( EventDispatcher.prototype );
|
|
1231
|
+
MapControls.prototype.constructor = MapControls;
|
|
1232
|
+
|
|
1233
|
+
export { OrbitControls, MapControls };
|