You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1175 lines
304 KiB
1175 lines
304 KiB
<!DOCTYPE html><html lang="en"><head><script async="" src="https://www.googletagmanager.com/gtag/js?id=UA-140352188-1"></script><script>window.dataLayer = window.dataLayer || [];
|
|
function gtag(){dataLayer.push(arguments);}
|
|
gtag('js', new Date());
|
|
gtag('config', 'UA-140352188-1');</script><meta charSet="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/><meta name="description" content="The CDN for three"/><meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1"/><meta name="timestamp" content="2023-03-06T21:53:37.524Z"/><link rel="shortcut icon" href="/favicon.ico"/><title>UNPKG - three</title><script>window.Promise || document.write('\x3Cscript src="/es6-promise@4.2.5/dist/es6-promise.min.js">\x3C/script>\x3Cscript>ES6Promise.polyfill()\x3C/script>')</script><script>window.fetch || document.write('\x3Cscript src="/whatwg-fetch@3.0.0/dist/fetch.umd.js">\x3C/script>')</script><script>window.__DATA__ = {"packageName":"three","packageVersion":"0.132.0","availableVersions":["0.54.0-dev","0.54.0","0.54.1-dev","0.54.2-dev","0.54.3-dev","0.54.4-dev","0.54.5-dev","0.54.6-dev","0.54.7-dev","0.54.8-dev","0.54.9-dev","0.54.10-dev","0.54.11-dev","0.54.12-dev","0.55.0","0.56.0","0.56.1","0.56.2","0.56.3","0.56.4","0.56.7","0.58.1","0.58.2","0.58.3","0.58.4","0.58.5","0.58.6","0.58.7","0.58.8","0.58.9","0.58.10","0.66.0","0.66.1","0.66.2","0.66.6","0.66.7","0.66.8","0.66.9","0.66.10","0.66.11","0.66.12","0.66.13","0.66.14","0.66.15","0.66.16","0.66.17","0.66.18","0.66.19","0.66.20","0.66.21","0.66.22","0.66.23","0.66.24","0.66.25","0.66.26","0.66.27","0.66.28","0.66.29","0.66.30","0.66.31","0.66.32-dev","0.66.35","0.66.36","0.66.37","0.66.38","0.66.39","0.66.40","0.66.41","0.66.42","0.66.43","0.66.45","0.66.46","0.66.47","0.66.48","0.66.49","0.66.50","0.66.51","0.66.52","0.66.53","0.66.54","0.66.55","0.66.56","0.66.57","0.66.58","0.66.59","0.66.60","0.66.61","0.66.62","0.66.63","0.66.64","0.66.65","0.66.66","0.66.67","0.66.68","0.66.69","0.66.70","0.66.71","0.66.72","0.66.73","0.66.74","0.66.75","0.66.76","0.66.77","0.66.78","0.66.79","0.66.80","0.66.81","0.66.82","0.66.83","0.66.84","0.66.85","0.66.86","0.66.87","0.66.88","0.66.89","0.66.90","0.66.91","0.66.92","0.66.93","0.66.94","0.66.95","0.66.96","0.66.97","0.67.0","0.68.0","0.68.86","0.68.87","0.69.0","0.70.0","0.70.1","0.71.0","0.71.1","0.72.0","0.73.0","0.73.1","0.73.2","0.74.0","0.75.0","0.76.1","0.77.0","0.77.1","0.78.0","0.79.0","0.80.0","0.80.1","0.81.0","0.81.1","0.81.2","0.82.0","0.82.1","0.83.0","0.84.0","0.85.0","0.85.1","0.85.2","0.86.0","0.87.0","0.87.1","0.88.0","0.89.0","0.90.0","0.91.0","0.92.0","0.93.0","0.94.0","0.95.0","0.96.0","0.97.0","0.98.0","0.99.0","0.100.0","0.101.0","0.101.1","0.102.0","0.102.1","0.103.0","0.104.0","0.105.0","0.105.1","0.105.2","0.106.0","0.106.1","0.106.2","0.107.0","0.108.0","0.109.0","0.110.0","0.111.0","0.112.0","0.112.1","0.113.0","0.113.1","0.113.2","0.114.0","0.115.0","0.116.0","0.116.1","0.117.0","0.117.1","0.118.0","0.118.1","0.118.2","0.118.3","0.119.0","0.119.1","0.120.0","0.120.1","0.121.0","0.121.1","0.122.0","0.123.0","0.124.0","0.125.0","0.125.1","0.125.2","0.126.0","0.126.1","0.127.0","0.128.0","0.129.0","0.130.0","0.130.1","0.131.0","0.131.1","0.131.2","0.131.3","0.132.0","0.132.1","0.132.2","0.133.0","0.133.1","0.134.0","0.135.0","0.136.0","0.137.0","0.137.1","0.137.2","0.137.3","0.137.4","0.137.5","0.138.0","0.138.1","0.138.2","0.138.3","0.139.0","0.139.1","0.139.2","0.140.0","0.140.1","0.140.2","0.141.0","0.142.0","0.143.0","0.144.0","0.145.0","0.146.0","0.147.0","0.148.0","0.149.0","0.150.0","0.150.1"],"filename":"/examples/js/controls/OrbitControls.js","target":{"path":"/examples/js/controls/OrbitControls.js","type":"file","details":{"contentType":"application/javascript","integrity":"sha384-mILeTdmegYZNgUMx0H7JOtQKAERnHeBnM2wRe6kW4pPSlBgGAemoAPsUDbbOfdoE","language":"JavaScript","size":26609,"uri":null,"highlights":["( <span class=\"code-function\"><span class=\"code-keyword\">function</span> (<span class=\"code-params\"></span>) </span>{\n","\n","\t<span class=\"code-comment\">// Unlike TrackballControls, it maintains the \"up\" direction object.up (+Y by default).</span>\n","\t<span class=\"code-comment\">//</span>\n","\t<span class=\"code-comment\">// Orbit - left mouse / touch: one-finger move</span>\n","\t<span class=\"code-comment\">// Zoom - middle mouse, or mousewheel / touch: two-finger spread or squish</span>\n","\t<span class=\"code-comment\">// Pan - right mouse, or left mouse + ctrl/meta/shiftKey, or arrow keys / touch: two-finger move</span>\n","\n","\t<span class=\"code-keyword\">const</span> _changeEvent = {\n","\t\ttype: <span class=\"code-string\">'change'</span>\n","\t};\n","\t<span class=\"code-keyword\">const</span> _startEvent = {\n","\t\ttype: <span class=\"code-string\">'start'</span>\n","\t};\n","\t<span class=\"code-keyword\">const</span> _endEvent = {\n","\t\ttype: <span class=\"code-string\">'end'</span>\n","\t};\n","\n","\t<span class=\"code-class\"><span class=\"code-keyword\">class</span> <span class=\"code-title\">OrbitControls</span> <span class=\"code-keyword\">extends</span> <span class=\"code-title\">THREE</span>.<span class=\"code-title\">EventDispatcher</span> </span>{\n","\n","\t\t<span class=\"code-keyword\">constructor</span>( object, domElement ) {\n","\n","\t\t\t<span class=\"code-keyword\">super</span>();\n","\t\t\t<span class=\"code-keyword\">if</span> ( domElement === <span class=\"code-literal\">undefined</span> ) <span class=\"code-built_in\">console</span>.warn( <span class=\"code-string\">'THREE.OrbitControls: The second parameter \"domElement\" is now mandatory.'</span> );\n","\t\t\t<span class=\"code-keyword\">if</span> ( domElement === <span class=\"code-built_in\">document</span> ) <span class=\"code-built_in\">console</span>.error( <span class=\"code-string\">'THREE.OrbitControls: \"document\" should not be used as the target \"domElement\". Please use \"renderer.domElement\" instead.'</span> );\n","\t\t\t<span class=\"code-keyword\">this</span>.object = object;\n","\t\t\t<span class=\"code-keyword\">this</span>.domElement = domElement;\n","\t\t\t<span class=\"code-keyword\">this</span>.domElement.style.touchAction = <span class=\"code-string\">'none'</span>; <span class=\"code-comment\">// disable touch scroll</span>\n","\t\t\t<span class=\"code-comment\">// Set to false to disable this control</span>\n","\n","\t\t\t<span class=\"code-keyword\">this</span>.enabled = <span class=\"code-literal\">true</span>; <span class=\"code-comment\">// \"target\" sets the location of focus, where the object orbits around</span>\n","\n","\t\t\t<span class=\"code-keyword\">this</span>.target = <span class=\"code-keyword\">new</span> THREE.Vector3(); <span class=\"code-comment\">// How far you can dolly in and out ( PerspectiveCamera only )</span>\n","\n","\t\t\t<span class=\"code-keyword\">this</span>.minDistance = <span class=\"code-number\">0</span>;\n","\t\t\t<span class=\"code-keyword\">this</span>.maxDistance = <span class=\"code-literal\">Infinity</span>; <span class=\"code-comment\">// How far you can zoom in and out ( OrthographicCamera only )</span>\n","\n","\t\t\t<span class=\"code-keyword\">this</span>.minZoom = <span class=\"code-number\">0</span>;\n","\t\t\t<span class=\"code-keyword\">this</span>.maxZoom = <span class=\"code-literal\">Infinity</span>; <span class=\"code-comment\">// How far you can orbit vertically, upper and lower limits.</span>\n","\t\t\t<span class=\"code-comment\">// Range is 0 to Math.PI radians.</span>\n","\n","\t\t\t<span class=\"code-keyword\">this</span>.minPolarAngle = <span class=\"code-number\">0</span>; <span class=\"code-comment\">// radians</span>\n","\n","\t\t\t<span class=\"code-keyword\">this</span>.maxPolarAngle = <span class=\"code-built_in\">Math</span>.PI; <span class=\"code-comment\">// radians</span>\n","\t\t\t<span class=\"code-comment\">// How far you can orbit horizontally, upper and lower limits.</span>\n","\t\t\t<span class=\"code-comment\">// If set, the interval [ min, max ] must be a sub-interval of [ - 2 PI, 2 PI ], with ( max - min < 2 PI )</span>\n","\n","\t\t\t<span class=\"code-keyword\">this</span>.minAzimuthAngle = - <span class=\"code-literal\">Infinity</span>; <span class=\"code-comment\">// radians</span>\n","\n","\t\t\t<span class=\"code-keyword\">this</span>.maxAzimuthAngle = <span class=\"code-literal\">Infinity</span>; <span class=\"code-comment\">// radians</span>\n","\t\t\t<span class=\"code-comment\">// Set to true to enable damping (inertia)</span>\n","\t\t\t<span class=\"code-comment\">// If damping is enabled, you must call controls.update() in your animation loop</span>\n","\n","\t\t\t<span class=\"code-keyword\">this</span>.enableDamping = <span class=\"code-literal\">false</span>;\n","\t\t\t<span class=\"code-keyword\">this</span>.dampingFactor = <span class=\"code-number\">0.05</span>; <span class=\"code-comment\">// This option actually enables dollying in and out; left as \"zoom\" for backwards compatibility.</span>\n","\t\t\t<span class=\"code-comment\">// Set to false to disable zooming</span>\n","\n","\t\t\t<span class=\"code-keyword\">this</span>.enableZoom = <span class=\"code-literal\">true</span>;\n","\t\t\t<span class=\"code-keyword\">this</span>.zoomSpeed = <span class=\"code-number\">1.0</span>; <span class=\"code-comment\">// Set to false to disable rotating</span>\n","\n","\t\t\t<span class=\"code-keyword\">this</span>.enableRotate = <span class=\"code-literal\">true</span>;\n","\t\t\t<span class=\"code-keyword\">this</span>.rotateSpeed = <span class=\"code-number\">1.0</span>; <span class=\"code-comment\">// Set to false to disable panning</span>\n","\n","\t\t\t<span class=\"code-keyword\">this</span>.enablePan = <span class=\"code-literal\">true</span>;\n","\t\t\t<span class=\"code-keyword\">this</span>.panSpeed = <span class=\"code-number\">1.0</span>;\n","\t\t\t<span class=\"code-keyword\">this</span>.screenSpacePanning = <span class=\"code-literal\">true</span>; <span class=\"code-comment\">// if false, pan orthogonal to world-space direction camera.up</span>\n","\n","\t\t\t<span class=\"code-keyword\">this</span>.keyPanSpeed = <span class=\"code-number\">7.0</span>; <span class=\"code-comment\">// pixels moved per arrow key push</span>\n","\t\t\t<span class=\"code-comment\">// Set to true to automatically rotate around the target</span>\n","\t\t\t<span class=\"code-comment\">// If auto-rotate is enabled, you must call controls.update() in your animation loop</span>\n","\n","\t\t\t<span class=\"code-keyword\">this</span>.autoRotate = <span class=\"code-literal\">false</span>;\n","\t\t\t<span class=\"code-keyword\">this</span>.autoRotateSpeed = <span class=\"code-number\">2.0</span>; <span class=\"code-comment\">// 30 seconds per orbit when fps is 60</span>\n","\t\t\t<span class=\"code-comment\">// The four arrow keys</span>\n","\n","\t\t\t<span class=\"code-keyword\">this</span>.keys = {\n","\t\t\t\tLEFT: <span class=\"code-string\">'ArrowLeft'</span>,\n","\t\t\t\tUP: <span class=\"code-string\">'ArrowUp'</span>,\n","\t\t\t\tRIGHT: <span class=\"code-string\">'ArrowRight'</span>,\n","\t\t\t\tBOTTOM: <span class=\"code-string\">'ArrowDown'</span>\n","\t\t\t}; <span class=\"code-comment\">// Mouse buttons</span>\n","\n","\t\t\t<span class=\"code-keyword\">this</span>.mouseButtons = {\n","\t\t\t\tLEFT: THREE.MOUSE.ROTATE,\n","\t\t\t\tMIDDLE: THREE.MOUSE.DOLLY,\n","\t\t\t\tRIGHT: THREE.MOUSE.PAN\n","\t\t\t}; <span class=\"code-comment\">// Touch fingers</span>\n","\n","\t\t\t<span class=\"code-keyword\">this</span>.touches = {\n","\t\t\t\tONE: THREE.TOUCH.ROTATE,\n","\t\t\t\tTWO: THREE.TOUCH.DOLLY_PAN\n","\t\t\t}; <span class=\"code-comment\">// for reset</span>\n","\n","\t\t\t<span class=\"code-keyword\">this</span>.target0 = <span class=\"code-keyword\">this</span>.target.clone();\n","\t\t\t<span class=\"code-keyword\">this</span>.position0 = <span class=\"code-keyword\">this</span>.object.position.clone();\n","\t\t\t<span class=\"code-keyword\">this</span>.zoom0 = <span class=\"code-keyword\">this</span>.object.zoom; <span class=\"code-comment\">// the target DOM element for key events</span>\n","\n","\t\t\t<span class=\"code-keyword\">this</span>._domElementKeyEvents = <span class=\"code-literal\">null</span>; <span class=\"code-comment\">//</span>\n","\t\t\t<span class=\"code-comment\">// public methods</span>\n","\t\t\t<span class=\"code-comment\">//</span>\n","\n","\t\t\t<span class=\"code-keyword\">this</span>.getPolarAngle = <span class=\"code-function\"><span class=\"code-keyword\">function</span> (<span class=\"code-params\"></span>) </span>{\n","\n","\t\t\t\t<span class=\"code-keyword\">return</span> spherical.phi;\n","\n","\t\t\t};\n","\n","\t\t\t<span class=\"code-keyword\">this</span>.getAzimuthalAngle = <span class=\"code-function\"><span class=\"code-keyword\">function</span> (<span class=\"code-params\"></span>) </span>{\n","\n","\t\t\t\t<span class=\"code-keyword\">return</span> spherical.theta;\n","\n","\t\t\t};\n","\n","\t\t\t<span class=\"code-keyword\">this</span>.getDistance = <span class=\"code-function\"><span class=\"code-keyword\">function</span> (<span class=\"code-params\"></span>) </span>{\n","\n","\t\t\t\t<span class=\"code-keyword\">return</span> <span class=\"code-keyword\">this</span>.object.position.distanceTo( <span class=\"code-keyword\">this</span>.target );\n","\n","\t\t\t};\n","\n","\t\t\t<span class=\"code-keyword\">this</span>.listenToKeyEvents = <span class=\"code-function\"><span class=\"code-keyword\">function</span> (<span class=\"code-params\"> domElement </span>) </span>{\n","\n","\t\t\t\tdomElement.addEventListener( <span class=\"code-string\">'keydown'</span>, onKeyDown );\n","\t\t\t\t<span class=\"code-keyword\">this</span>._domElementKeyEvents = domElement;\n","\n","\t\t\t};\n","\n","\t\t\t<span class=\"code-keyword\">this</span>.saveState = <span class=\"code-function\"><span class=\"code-keyword\">function</span> (<span class=\"code-params\"></span>) </span>{\n","\n","\t\t\t\tscope.target0.copy( scope.target );\n","\t\t\t\tscope.position0.copy( scope.object.position );\n","\t\t\t\tscope.zoom0 = scope.object.zoom;\n","\n","\t\t\t};\n","\n","\t\t\t<span class=\"code-keyword\">this</span>.reset = <span class=\"code-function\"><span class=\"code-keyword\">function</span> (<span class=\"code-params\"></span>) </span>{\n","\n","\t\t\t\tscope.target.copy( scope.target0 );\n","\t\t\t\tscope.object.position.copy( scope.position0 );\n","\t\t\t\tscope.object.zoom = scope.zoom0;\n","\t\t\t\tscope.object.updateProjectionMatrix();\n","\t\t\t\tscope.dispatchEvent( _changeEvent );\n","\t\t\t\tscope.update();\n","\t\t\t\tstate = STATE.NONE;\n","\n","\t\t\t}; <span class=\"code-comment\">// this method is exposed, but perhaps it would be better if we can make it private...</span>\n","\n","\n","\t\t\t<span class=\"code-keyword\">this</span>.update = <span class=\"code-function\"><span class=\"code-keyword\">function</span> (<span class=\"code-params\"></span>) </span>{\n","\n","\t\t\t\t<span class=\"code-keyword\">const</span> offset = <span class=\"code-keyword\">new</span> THREE.Vector3(); <span class=\"code-comment\">// so camera.up is the orbit axis</span>\n","\n","\t\t\t\t<span class=\"code-keyword\">const</span> quat = <span class=\"code-keyword\">new</span> THREE.Quaternion().setFromUnitVectors( object.up, <span class=\"code-keyword\">new</span> THREE.Vector3( <span class=\"code-number\">0</span>, <span class=\"code-number\">1</span>, <span class=\"code-number\">0</span> ) );\n","\t\t\t\t<span class=\"code-keyword\">const</span> quatInverse = quat.clone().invert();\n","\t\t\t\t<span class=\"code-keyword\">const</span> lastPosition = <span class=\"code-keyword\">new</span> THREE.Vector3();\n","\t\t\t\t<span class=\"code-keyword\">const</span> lastQuaternion = <span class=\"code-keyword\">new</span> THREE.Quaternion();\n","\t\t\t\t<span class=\"code-keyword\">const</span> twoPI = <span class=\"code-number\">2</span> * <span class=\"code-built_in\">Math</span>.PI;\n","\t\t\t\t<span class=\"code-keyword\">return</span> <span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">update</span>(<span class=\"code-params\"></span>) </span>{\n","\n","\t\t\t\t\t<span class=\"code-keyword\">const</span> position = scope.object.position;\n","\t\t\t\t\toffset.copy( position ).sub( scope.target ); <span class=\"code-comment\">// rotate offset to \"y-axis-is-up\" space</span>\n","\n","\t\t\t\t\toffset.applyQuaternion( quat ); <span class=\"code-comment\">// angle from z-axis around y-axis</span>\n","\n","\t\t\t\t\tspherical.setFromVector3( offset );\n","\n","\t\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.autoRotate && state === STATE.NONE ) {\n","\n","\t\t\t\t\t\trotateLeft( getAutoRotationAngle() );\n","\n","\t\t\t\t\t}\n","\n","\t\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.enableDamping ) {\n","\n","\t\t\t\t\t\tspherical.theta += sphericalDelta.theta * scope.dampingFactor;\n","\t\t\t\t\t\tspherical.phi += sphericalDelta.phi * scope.dampingFactor;\n","\n","\t\t\t\t\t} <span class=\"code-keyword\">else</span> {\n","\n","\t\t\t\t\t\tspherical.theta += sphericalDelta.theta;\n","\t\t\t\t\t\tspherical.phi += sphericalDelta.phi;\n","\n","\t\t\t\t\t} <span class=\"code-comment\">// restrict theta to be between desired limits</span>\n","\n","\n","\t\t\t\t\t<span class=\"code-keyword\">let</span> min = scope.minAzimuthAngle;\n","\t\t\t\t\t<span class=\"code-keyword\">let</span> max = scope.maxAzimuthAngle;\n","\n","\t\t\t\t\t<span class=\"code-keyword\">if</span> ( <span class=\"code-built_in\">isFinite</span>( min ) && <span class=\"code-built_in\">isFinite</span>( max ) ) {\n","\n","\t\t\t\t\t\t<span class=\"code-keyword\">if</span> ( min < - <span class=\"code-built_in\">Math</span>.PI ) min += twoPI; <span class=\"code-keyword\">else</span> <span class=\"code-keyword\">if</span> ( min > <span class=\"code-built_in\">Math</span>.PI ) min -= twoPI;\n","\t\t\t\t\t\t<span class=\"code-keyword\">if</span> ( max < - <span class=\"code-built_in\">Math</span>.PI ) max += twoPI; <span class=\"code-keyword\">else</span> <span class=\"code-keyword\">if</span> ( max > <span class=\"code-built_in\">Math</span>.PI ) max -= twoPI;\n","\n","\t\t\t\t\t\t<span class=\"code-keyword\">if</span> ( min <= max ) {\n","\n","\t\t\t\t\t\t\tspherical.theta = <span class=\"code-built_in\">Math</span>.max( min, <span class=\"code-built_in\">Math</span>.min( max, spherical.theta ) );\n","\n","\t\t\t\t\t\t} <span class=\"code-keyword\">else</span> {\n","\n","\t\t\t\t\t\t\tspherical.theta = spherical.theta > ( min + max ) / <span class=\"code-number\">2</span> ? <span class=\"code-built_in\">Math</span>.max( min, spherical.theta ) : <span class=\"code-built_in\">Math</span>.min( max, spherical.theta );\n","\n","\t\t\t\t\t\t}\n","\n","\t\t\t\t\t} <span class=\"code-comment\">// restrict phi to be between desired limits</span>\n","\n","\n","\t\t\t\t\tspherical.phi = <span class=\"code-built_in\">Math</span>.max( scope.minPolarAngle, <span class=\"code-built_in\">Math</span>.min( scope.maxPolarAngle, spherical.phi ) );\n","\t\t\t\t\tspherical.makeSafe();\n","\t\t\t\t\tspherical.radius *= scale; <span class=\"code-comment\">// restrict radius to be between desired limits</span>\n","\n","\t\t\t\t\tspherical.radius = <span class=\"code-built_in\">Math</span>.max( scope.minDistance, <span class=\"code-built_in\">Math</span>.min( scope.maxDistance, spherical.radius ) ); <span class=\"code-comment\">// move target to panned location</span>\n","\n","\t\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.enableDamping === <span class=\"code-literal\">true</span> ) {\n","\n","\t\t\t\t\t\tscope.target.addScaledVector( panOffset, scope.dampingFactor );\n","\n","\t\t\t\t\t} <span class=\"code-keyword\">else</span> {\n","\n","\t\t\t\t\t\tscope.target.add( panOffset );\n","\n","\t\t\t\t\t}\n","\n","\t\t\t\t\toffset.setFromSpherical( spherical ); <span class=\"code-comment\">// rotate offset back to \"camera-up-vector-is-up\" space</span>\n","\n","\t\t\t\t\toffset.applyQuaternion( quatInverse );\n","\t\t\t\t\tposition.copy( scope.target ).add( offset );\n","\t\t\t\t\tscope.object.lookAt( scope.target );\n","\n","\t\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.enableDamping === <span class=\"code-literal\">true</span> ) {\n","\n","\t\t\t\t\t\tsphericalDelta.theta *= <span class=\"code-number\">1</span> - scope.dampingFactor;\n","\t\t\t\t\t\tsphericalDelta.phi *= <span class=\"code-number\">1</span> - scope.dampingFactor;\n","\t\t\t\t\t\tpanOffset.multiplyScalar( <span class=\"code-number\">1</span> - scope.dampingFactor );\n","\n","\t\t\t\t\t} <span class=\"code-keyword\">else</span> {\n","\n","\t\t\t\t\t\tsphericalDelta.set( <span class=\"code-number\">0</span>, <span class=\"code-number\">0</span>, <span class=\"code-number\">0</span> );\n","\t\t\t\t\t\tpanOffset.set( <span class=\"code-number\">0</span>, <span class=\"code-number\">0</span>, <span class=\"code-number\">0</span> );\n","\n","\t\t\t\t\t}\n","\n","\t\t\t\t\tscale = <span class=\"code-number\">1</span>; <span class=\"code-comment\">// update condition is:</span>\n","\t\t\t\t\t<span class=\"code-comment\">// min(camera displacement, camera rotation in radians)^2 > EPS</span>\n","\t\t\t\t\t<span class=\"code-comment\">// using small-angle approximation cos(x/2) = 1 - x^2 / 8</span>\n","\n","\t\t\t\t\t<span class=\"code-keyword\">if</span> ( zoomChanged || lastPosition.distanceToSquared( scope.object.position ) > EPS || <span class=\"code-number\">8</span> * ( <span class=\"code-number\">1</span> - lastQuaternion.dot( scope.object.quaternion ) ) > EPS ) {\n","\n","\t\t\t\t\t\tscope.dispatchEvent( _changeEvent );\n","\t\t\t\t\t\tlastPosition.copy( scope.object.position );\n","\t\t\t\t\t\tlastQuaternion.copy( scope.object.quaternion );\n","\t\t\t\t\t\tzoomChanged = <span class=\"code-literal\">false</span>;\n","\t\t\t\t\t\t<span class=\"code-keyword\">return</span> <span class=\"code-literal\">true</span>;\n","\n","\t\t\t\t\t}\n","\n","\t\t\t\t\t<span class=\"code-keyword\">return</span> <span class=\"code-literal\">false</span>;\n","\n","\t\t\t\t};\n","\n","\t\t\t}();\n","\n","\t\t\t<span class=\"code-keyword\">this</span>.dispose = <span class=\"code-function\"><span class=\"code-keyword\">function</span> (<span class=\"code-params\"></span>) </span>{\n","\n","\t\t\t\tscope.domElement.removeEventListener( <span class=\"code-string\">'contextmenu'</span>, onContextMenu );\n","\t\t\t\tscope.domElement.removeEventListener( <span class=\"code-string\">'pointerdown'</span>, onPointerDown );\n","\t\t\t\tscope.domElement.removeEventListener( <span class=\"code-string\">'pointercancel'</span>, onPointerCancel );\n","\t\t\t\tscope.domElement.removeEventListener( <span class=\"code-string\">'wheel'</span>, onMouseWheel );\n","\t\t\t\tscope.domElement.removeEventListener( <span class=\"code-string\">'pointermove'</span>, onPointerMove );\n","\t\t\t\tscope.domElement.removeEventListener( <span class=\"code-string\">'pointerup'</span>, onPointerUp );\n","\n","\t\t\t\t<span class=\"code-keyword\">if</span> ( scope._domElementKeyEvents !== <span class=\"code-literal\">null</span> ) {\n","\n","\t\t\t\t\tscope._domElementKeyEvents.removeEventListener( <span class=\"code-string\">'keydown'</span>, onKeyDown );\n","\n","\t\t\t\t} <span class=\"code-comment\">//scope.dispatchEvent( { type: 'dispose' } ); // should this be added here?</span>\n","\n","\t\t\t}; <span class=\"code-comment\">//</span>\n","\t\t\t<span class=\"code-comment\">// internals</span>\n","\t\t\t<span class=\"code-comment\">//</span>\n","\n","\n","\t\t\t<span class=\"code-keyword\">const</span> scope = <span class=\"code-keyword\">this</span>;\n","\t\t\t<span class=\"code-keyword\">const</span> STATE = {\n","\t\t\t\tNONE: - <span class=\"code-number\">1</span>,\n","\t\t\t\tROTATE: <span class=\"code-number\">0</span>,\n","\t\t\t\tDOLLY: <span class=\"code-number\">1</span>,\n","\t\t\t\tPAN: <span class=\"code-number\">2</span>,\n","\t\t\t\tTOUCH_ROTATE: <span class=\"code-number\">3</span>,\n","\t\t\t\tTOUCH_PAN: <span class=\"code-number\">4</span>,\n","\t\t\t\tTOUCH_DOLLY_PAN: <span class=\"code-number\">5</span>,\n","\t\t\t\tTOUCH_DOLLY_ROTATE: <span class=\"code-number\">6</span>\n","\t\t\t};\n","\t\t\t<span class=\"code-keyword\">let</span> state = STATE.NONE;\n","\t\t\t<span class=\"code-keyword\">const</span> EPS = <span class=\"code-number\">0.000001</span>; <span class=\"code-comment\">// current position in spherical coordinates</span>\n","\n","\t\t\t<span class=\"code-keyword\">const</span> spherical = <span class=\"code-keyword\">new</span> THREE.Spherical();\n","\t\t\t<span class=\"code-keyword\">const</span> sphericalDelta = <span class=\"code-keyword\">new</span> THREE.Spherical();\n","\t\t\t<span class=\"code-keyword\">let</span> scale = <span class=\"code-number\">1</span>;\n","\t\t\t<span class=\"code-keyword\">const</span> panOffset = <span class=\"code-keyword\">new</span> THREE.Vector3();\n","\t\t\t<span class=\"code-keyword\">let</span> zoomChanged = <span class=\"code-literal\">false</span>;\n","\t\t\t<span class=\"code-keyword\">const</span> rotateStart = <span class=\"code-keyword\">new</span> THREE.Vector2();\n","\t\t\t<span class=\"code-keyword\">const</span> rotateEnd = <span class=\"code-keyword\">new</span> THREE.Vector2();\n","\t\t\t<span class=\"code-keyword\">const</span> rotateDelta = <span class=\"code-keyword\">new</span> THREE.Vector2();\n","\t\t\t<span class=\"code-keyword\">const</span> panStart = <span class=\"code-keyword\">new</span> THREE.Vector2();\n","\t\t\t<span class=\"code-keyword\">const</span> panEnd = <span class=\"code-keyword\">new</span> THREE.Vector2();\n","\t\t\t<span class=\"code-keyword\">const</span> panDelta = <span class=\"code-keyword\">new</span> THREE.Vector2();\n","\t\t\t<span class=\"code-keyword\">const</span> dollyStart = <span class=\"code-keyword\">new</span> THREE.Vector2();\n","\t\t\t<span class=\"code-keyword\">const</span> dollyEnd = <span class=\"code-keyword\">new</span> THREE.Vector2();\n","\t\t\t<span class=\"code-keyword\">const</span> dollyDelta = <span class=\"code-keyword\">new</span> THREE.Vector2();\n","\t\t\t<span class=\"code-keyword\">const</span> pointers = [];\n","\t\t\t<span class=\"code-keyword\">const</span> pointerPositions = {};\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">getAutoRotationAngle</span>(<span class=\"code-params\"></span>) </span>{\n","\n","\t\t\t\t<span class=\"code-keyword\">return</span> <span class=\"code-number\">2</span> * <span class=\"code-built_in\">Math</span>.PI / <span class=\"code-number\">60</span> / <span class=\"code-number\">60</span> * scope.autoRotateSpeed;\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">getZoomScale</span>(<span class=\"code-params\"></span>) </span>{\n","\n","\t\t\t\t<span class=\"code-keyword\">return</span> <span class=\"code-built_in\">Math</span>.pow( <span class=\"code-number\">0.95</span>, scope.zoomSpeed );\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">rotateLeft</span>(<span class=\"code-params\"> angle </span>) </span>{\n","\n","\t\t\t\tsphericalDelta.theta -= angle;\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">rotateUp</span>(<span class=\"code-params\"> angle </span>) </span>{\n","\n","\t\t\t\tsphericalDelta.phi -= angle;\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-keyword\">const</span> panLeft = <span class=\"code-function\"><span class=\"code-keyword\">function</span> (<span class=\"code-params\"></span>) </span>{\n","\n","\t\t\t\t<span class=\"code-keyword\">const</span> v = <span class=\"code-keyword\">new</span> THREE.Vector3();\n","\t\t\t\t<span class=\"code-keyword\">return</span> <span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">panLeft</span>(<span class=\"code-params\"> distance, objectMatrix </span>) </span>{\n","\n","\t\t\t\t\tv.setFromMatrixColumn( objectMatrix, <span class=\"code-number\">0</span> ); <span class=\"code-comment\">// get X column of objectMatrix</span>\n","\n","\t\t\t\t\tv.multiplyScalar( - distance );\n","\t\t\t\t\tpanOffset.add( v );\n","\n","\t\t\t\t};\n","\n","\t\t\t}();\n","\n","\t\t\t<span class=\"code-keyword\">const</span> panUp = <span class=\"code-function\"><span class=\"code-keyword\">function</span> (<span class=\"code-params\"></span>) </span>{\n","\n","\t\t\t\t<span class=\"code-keyword\">const</span> v = <span class=\"code-keyword\">new</span> THREE.Vector3();\n","\t\t\t\t<span class=\"code-keyword\">return</span> <span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">panUp</span>(<span class=\"code-params\"> distance, objectMatrix </span>) </span>{\n","\n","\t\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.screenSpacePanning === <span class=\"code-literal\">true</span> ) {\n","\n","\t\t\t\t\t\tv.setFromMatrixColumn( objectMatrix, <span class=\"code-number\">1</span> );\n","\n","\t\t\t\t\t} <span class=\"code-keyword\">else</span> {\n","\n","\t\t\t\t\t\tv.setFromMatrixColumn( objectMatrix, <span class=\"code-number\">0</span> );\n","\t\t\t\t\t\tv.crossVectors( scope.object.up, v );\n","\n","\t\t\t\t\t}\n","\n","\t\t\t\t\tv.multiplyScalar( distance );\n","\t\t\t\t\tpanOffset.add( v );\n","\n","\t\t\t\t};\n","\n","\t\t\t}(); <span class=\"code-comment\">// deltaX and deltaY are in pixels; right and down are positive</span>\n","\n","\n","\t\t\t<span class=\"code-keyword\">const</span> pan = <span class=\"code-function\"><span class=\"code-keyword\">function</span> (<span class=\"code-params\"></span>) </span>{\n","\n","\t\t\t\t<span class=\"code-keyword\">const</span> offset = <span class=\"code-keyword\">new</span> THREE.Vector3();\n","\t\t\t\t<span class=\"code-keyword\">return</span> <span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">pan</span>(<span class=\"code-params\"> deltaX, deltaY </span>) </span>{\n","\n","\t\t\t\t\t<span class=\"code-keyword\">const</span> element = scope.domElement;\n","\n","\t\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.object.isPerspectiveCamera ) {\n","\n","\t\t\t\t\t\t<span class=\"code-comment\">// perspective</span>\n","\t\t\t\t\t\t<span class=\"code-keyword\">const</span> position = scope.object.position;\n","\t\t\t\t\t\toffset.copy( position ).sub( scope.target );\n","\t\t\t\t\t\t<span class=\"code-keyword\">let</span> targetDistance = offset.length(); <span class=\"code-comment\">// half of the fov is center to top of screen</span>\n","\n","\t\t\t\t\t\ttargetDistance *= <span class=\"code-built_in\">Math</span>.tan( scope.object.fov / <span class=\"code-number\">2</span> * <span class=\"code-built_in\">Math</span>.PI / <span class=\"code-number\">180.0</span> ); <span class=\"code-comment\">// we use only clientHeight here so aspect ratio does not distort speed</span>\n","\n","\t\t\t\t\t\tpanLeft( <span class=\"code-number\">2</span> * deltaX * targetDistance / element.clientHeight, scope.object.matrix );\n","\t\t\t\t\t\tpanUp( <span class=\"code-number\">2</span> * deltaY * targetDistance / element.clientHeight, scope.object.matrix );\n","\n","\t\t\t\t\t} <span class=\"code-keyword\">else</span> <span class=\"code-keyword\">if</span> ( scope.object.isOrthographicCamera ) {\n","\n","\t\t\t\t\t\t<span class=\"code-comment\">// orthographic</span>\n","\t\t\t\t\t\tpanLeft( deltaX * ( scope.object.right - scope.object.left ) / scope.object.zoom / element.clientWidth, scope.object.matrix );\n","\t\t\t\t\t\tpanUp( deltaY * ( scope.object.top - scope.object.bottom ) / scope.object.zoom / element.clientHeight, scope.object.matrix );\n","\n","\t\t\t\t\t} <span class=\"code-keyword\">else</span> {\n","\n","\t\t\t\t\t\t<span class=\"code-comment\">// camera neither orthographic nor perspective</span>\n","\t\t\t\t\t\t<span class=\"code-built_in\">console</span>.warn( <span class=\"code-string\">'WARNING: OrbitControls.js encountered an unknown camera type - pan disabled.'</span> );\n","\t\t\t\t\t\tscope.enablePan = <span class=\"code-literal\">false</span>;\n","\n","\t\t\t\t\t}\n","\n","\t\t\t\t};\n","\n","\t\t\t}();\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">dollyOut</span>(<span class=\"code-params\"> dollyScale </span>) </span>{\n","\n","\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.object.isPerspectiveCamera ) {\n","\n","\t\t\t\t\tscale /= dollyScale;\n","\n","\t\t\t\t} <span class=\"code-keyword\">else</span> <span class=\"code-keyword\">if</span> ( scope.object.isOrthographicCamera ) {\n","\n","\t\t\t\t\tscope.object.zoom = <span class=\"code-built_in\">Math</span>.max( scope.minZoom, <span class=\"code-built_in\">Math</span>.min( scope.maxZoom, scope.object.zoom * dollyScale ) );\n","\t\t\t\t\tscope.object.updateProjectionMatrix();\n","\t\t\t\t\tzoomChanged = <span class=\"code-literal\">true</span>;\n","\n","\t\t\t\t} <span class=\"code-keyword\">else</span> {\n","\n","\t\t\t\t\t<span class=\"code-built_in\">console</span>.warn( <span class=\"code-string\">'WARNING: OrbitControls.js encountered an unknown camera type - dolly/zoom disabled.'</span> );\n","\t\t\t\t\tscope.enableZoom = <span class=\"code-literal\">false</span>;\n","\n","\t\t\t\t}\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">dollyIn</span>(<span class=\"code-params\"> dollyScale </span>) </span>{\n","\n","\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.object.isPerspectiveCamera ) {\n","\n","\t\t\t\t\tscale *= dollyScale;\n","\n","\t\t\t\t} <span class=\"code-keyword\">else</span> <span class=\"code-keyword\">if</span> ( scope.object.isOrthographicCamera ) {\n","\n","\t\t\t\t\tscope.object.zoom = <span class=\"code-built_in\">Math</span>.max( scope.minZoom, <span class=\"code-built_in\">Math</span>.min( scope.maxZoom, scope.object.zoom / dollyScale ) );\n","\t\t\t\t\tscope.object.updateProjectionMatrix();\n","\t\t\t\t\tzoomChanged = <span class=\"code-literal\">true</span>;\n","\n","\t\t\t\t} <span class=\"code-keyword\">else</span> {\n","\n","\t\t\t\t\t<span class=\"code-built_in\">console</span>.warn( <span class=\"code-string\">'WARNING: OrbitControls.js encountered an unknown camera type - dolly/zoom disabled.'</span> );\n","\t\t\t\t\tscope.enableZoom = <span class=\"code-literal\">false</span>;\n","\n","\t\t\t\t}\n","\n","\t\t\t} <span class=\"code-comment\">//</span>\n","\t\t\t<span class=\"code-comment\">// event callbacks - update the object state</span>\n","\t\t\t<span class=\"code-comment\">//</span>\n","\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">handleMouseDownRotate</span>(<span class=\"code-params\"> event </span>) </span>{\n","\n","\t\t\t\trotateStart.set( event.clientX, event.clientY );\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">handleMouseDownDolly</span>(<span class=\"code-params\"> event </span>) </span>{\n","\n","\t\t\t\tdollyStart.set( event.clientX, event.clientY );\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">handleMouseDownPan</span>(<span class=\"code-params\"> event </span>) </span>{\n","\n","\t\t\t\tpanStart.set( event.clientX, event.clientY );\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">handleMouseMoveRotate</span>(<span class=\"code-params\"> event </span>) </span>{\n","\n","\t\t\t\trotateEnd.set( event.clientX, event.clientY );\n","\t\t\t\trotateDelta.subVectors( rotateEnd, rotateStart ).multiplyScalar( scope.rotateSpeed );\n","\t\t\t\t<span class=\"code-keyword\">const</span> element = scope.domElement;\n","\t\t\t\trotateLeft( <span class=\"code-number\">2</span> * <span class=\"code-built_in\">Math</span>.PI * rotateDelta.x / element.clientHeight ); <span class=\"code-comment\">// yes, height</span>\n","\n","\t\t\t\trotateUp( <span class=\"code-number\">2</span> * <span class=\"code-built_in\">Math</span>.PI * rotateDelta.y / element.clientHeight );\n","\t\t\t\trotateStart.copy( rotateEnd );\n","\t\t\t\tscope.update();\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">handleMouseMoveDolly</span>(<span class=\"code-params\"> event </span>) </span>{\n","\n","\t\t\t\tdollyEnd.set( event.clientX, event.clientY );\n","\t\t\t\tdollyDelta.subVectors( dollyEnd, dollyStart );\n","\n","\t\t\t\t<span class=\"code-keyword\">if</span> ( dollyDelta.y > <span class=\"code-number\">0</span> ) {\n","\n","\t\t\t\t\tdollyOut( getZoomScale() );\n","\n","\t\t\t\t} <span class=\"code-keyword\">else</span> <span class=\"code-keyword\">if</span> ( dollyDelta.y < <span class=\"code-number\">0</span> ) {\n","\n","\t\t\t\t\tdollyIn( getZoomScale() );\n","\n","\t\t\t\t}\n","\n","\t\t\t\tdollyStart.copy( dollyEnd );\n","\t\t\t\tscope.update();\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">handleMouseMovePan</span>(<span class=\"code-params\"> event </span>) </span>{\n","\n","\t\t\t\tpanEnd.set( event.clientX, event.clientY );\n","\t\t\t\tpanDelta.subVectors( panEnd, panStart ).multiplyScalar( scope.panSpeed );\n","\t\t\t\tpan( panDelta.x, panDelta.y );\n","\t\t\t\tpanStart.copy( panEnd );\n","\t\t\t\tscope.update();\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">handleMouseUp</span>(<span class=\"code-params\"></span>) </span>{ <span class=\"code-comment\">// no-op</span>\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">handleMouseWheel</span>(<span class=\"code-params\"> event </span>) </span>{\n","\n","\t\t\t\t<span class=\"code-keyword\">if</span> ( event.deltaY < <span class=\"code-number\">0</span> ) {\n","\n","\t\t\t\t\tdollyIn( getZoomScale() );\n","\n","\t\t\t\t} <span class=\"code-keyword\">else</span> <span class=\"code-keyword\">if</span> ( event.deltaY > <span class=\"code-number\">0</span> ) {\n","\n","\t\t\t\t\tdollyOut( getZoomScale() );\n","\n","\t\t\t\t}\n","\n","\t\t\t\tscope.update();\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">handleKeyDown</span>(<span class=\"code-params\"> event </span>) </span>{\n","\n","\t\t\t\t<span class=\"code-keyword\">let</span> needsUpdate = <span class=\"code-literal\">false</span>;\n","\n","\t\t\t\t<span class=\"code-keyword\">switch</span> ( event.code ) {\n","\n","\t\t\t\t\t<span class=\"code-keyword\">case</span> scope.keys.UP:\n","\t\t\t\t\t\tpan( <span class=\"code-number\">0</span>, scope.keyPanSpeed );\n","\t\t\t\t\t\tneedsUpdate = <span class=\"code-literal\">true</span>;\n","\t\t\t\t\t\t<span class=\"code-keyword\">break</span>;\n","\n","\t\t\t\t\t<span class=\"code-keyword\">case</span> scope.keys.BOTTOM:\n","\t\t\t\t\t\tpan( <span class=\"code-number\">0</span>, - scope.keyPanSpeed );\n","\t\t\t\t\t\tneedsUpdate = <span class=\"code-literal\">true</span>;\n","\t\t\t\t\t\t<span class=\"code-keyword\">break</span>;\n","\n","\t\t\t\t\t<span class=\"code-keyword\">case</span> scope.keys.LEFT:\n","\t\t\t\t\t\tpan( scope.keyPanSpeed, <span class=\"code-number\">0</span> );\n","\t\t\t\t\t\tneedsUpdate = <span class=\"code-literal\">true</span>;\n","\t\t\t\t\t\t<span class=\"code-keyword\">break</span>;\n","\n","\t\t\t\t\t<span class=\"code-keyword\">case</span> scope.keys.RIGHT:\n","\t\t\t\t\t\tpan( - scope.keyPanSpeed, <span class=\"code-number\">0</span> );\n","\t\t\t\t\t\tneedsUpdate = <span class=\"code-literal\">true</span>;\n","\t\t\t\t\t\t<span class=\"code-keyword\">break</span>;\n","\n","\t\t\t\t}\n","\n","\t\t\t\t<span class=\"code-keyword\">if</span> ( needsUpdate ) {\n","\n","\t\t\t\t\t<span class=\"code-comment\">// prevent the browser from scrolling on cursor keys</span>\n","\t\t\t\t\tevent.preventDefault();\n","\t\t\t\t\tscope.update();\n","\n","\t\t\t\t}\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">handleTouchStartRotate</span>(<span class=\"code-params\"></span>) </span>{\n","\n","\t\t\t\t<span class=\"code-keyword\">if</span> ( pointers.length === <span class=\"code-number\">1</span> ) {\n","\n","\t\t\t\t\trotateStart.set( pointers[ <span class=\"code-number\">0</span> ].pageX, pointers[ <span class=\"code-number\">0</span> ].pageY );\n","\n","\t\t\t\t} <span class=\"code-keyword\">else</span> {\n","\n","\t\t\t\t\t<span class=\"code-keyword\">const</span> x = <span class=\"code-number\">0.5</span> * ( pointers[ <span class=\"code-number\">0</span> ].pageX + pointers[ <span class=\"code-number\">1</span> ].pageX );\n","\t\t\t\t\t<span class=\"code-keyword\">const</span> y = <span class=\"code-number\">0.5</span> * ( pointers[ <span class=\"code-number\">0</span> ].pageY + pointers[ <span class=\"code-number\">1</span> ].pageY );\n","\t\t\t\t\trotateStart.set( x, y );\n","\n","\t\t\t\t}\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">handleTouchStartPan</span>(<span class=\"code-params\"></span>) </span>{\n","\n","\t\t\t\t<span class=\"code-keyword\">if</span> ( pointers.length === <span class=\"code-number\">1</span> ) {\n","\n","\t\t\t\t\tpanStart.set( pointers[ <span class=\"code-number\">0</span> ].pageX, pointers[ <span class=\"code-number\">0</span> ].pageY );\n","\n","\t\t\t\t} <span class=\"code-keyword\">else</span> {\n","\n","\t\t\t\t\t<span class=\"code-keyword\">const</span> x = <span class=\"code-number\">0.5</span> * ( pointers[ <span class=\"code-number\">0</span> ].pageX + pointers[ <span class=\"code-number\">1</span> ].pageX );\n","\t\t\t\t\t<span class=\"code-keyword\">const</span> y = <span class=\"code-number\">0.5</span> * ( pointers[ <span class=\"code-number\">0</span> ].pageY + pointers[ <span class=\"code-number\">1</span> ].pageY );\n","\t\t\t\t\tpanStart.set( x, y );\n","\n","\t\t\t\t}\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">handleTouchStartDolly</span>(<span class=\"code-params\"></span>) </span>{\n","\n","\t\t\t\t<span class=\"code-keyword\">const</span> dx = pointers[ <span class=\"code-number\">0</span> ].pageX - pointers[ <span class=\"code-number\">1</span> ].pageX;\n","\t\t\t\t<span class=\"code-keyword\">const</span> dy = pointers[ <span class=\"code-number\">0</span> ].pageY - pointers[ <span class=\"code-number\">1</span> ].pageY;\n","\t\t\t\t<span class=\"code-keyword\">const</span> distance = <span class=\"code-built_in\">Math</span>.sqrt( dx * dx + dy * dy );\n","\t\t\t\tdollyStart.set( <span class=\"code-number\">0</span>, distance );\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">handleTouchStartDollyPan</span>(<span class=\"code-params\"></span>) </span>{\n","\n","\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.enableZoom ) handleTouchStartDolly();\n","\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.enablePan ) handleTouchStartPan();\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">handleTouchStartDollyRotate</span>(<span class=\"code-params\"></span>) </span>{\n","\n","\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.enableZoom ) handleTouchStartDolly();\n","\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.enableRotate ) handleTouchStartRotate();\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">handleTouchMoveRotate</span>(<span class=\"code-params\"> event </span>) </span>{\n","\n","\t\t\t\t<span class=\"code-keyword\">if</span> ( pointers.length == <span class=\"code-number\">1</span> ) {\n","\n","\t\t\t\t\trotateEnd.set( event.pageX, event.pageY );\n","\n","\t\t\t\t} <span class=\"code-keyword\">else</span> {\n","\n","\t\t\t\t\t<span class=\"code-keyword\">const</span> position = getSecondPointerPosition( event );\n","\t\t\t\t\t<span class=\"code-keyword\">const</span> x = <span class=\"code-number\">0.5</span> * ( event.pageX + position.x );\n","\t\t\t\t\t<span class=\"code-keyword\">const</span> y = <span class=\"code-number\">0.5</span> * ( event.pageY + position.y );\n","\t\t\t\t\trotateEnd.set( x, y );\n","\n","\t\t\t\t}\n","\n","\t\t\t\trotateDelta.subVectors( rotateEnd, rotateStart ).multiplyScalar( scope.rotateSpeed );\n","\t\t\t\t<span class=\"code-keyword\">const</span> element = scope.domElement;\n","\t\t\t\trotateLeft( <span class=\"code-number\">2</span> * <span class=\"code-built_in\">Math</span>.PI * rotateDelta.x / element.clientHeight ); <span class=\"code-comment\">// yes, height</span>\n","\n","\t\t\t\trotateUp( <span class=\"code-number\">2</span> * <span class=\"code-built_in\">Math</span>.PI * rotateDelta.y / element.clientHeight );\n","\t\t\t\trotateStart.copy( rotateEnd );\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">handleTouchMovePan</span>(<span class=\"code-params\"> event </span>) </span>{\n","\n","\t\t\t\t<span class=\"code-keyword\">if</span> ( pointers.length === <span class=\"code-number\">1</span> ) {\n","\n","\t\t\t\t\tpanEnd.set( event.pageX, event.pageY );\n","\n","\t\t\t\t} <span class=\"code-keyword\">else</span> {\n","\n","\t\t\t\t\t<span class=\"code-keyword\">const</span> position = getSecondPointerPosition( event );\n","\t\t\t\t\t<span class=\"code-keyword\">const</span> x = <span class=\"code-number\">0.5</span> * ( event.pageX + position.x );\n","\t\t\t\t\t<span class=\"code-keyword\">const</span> y = <span class=\"code-number\">0.5</span> * ( event.pageY + position.y );\n","\t\t\t\t\tpanEnd.set( x, y );\n","\n","\t\t\t\t}\n","\n","\t\t\t\tpanDelta.subVectors( panEnd, panStart ).multiplyScalar( scope.panSpeed );\n","\t\t\t\tpan( panDelta.x, panDelta.y );\n","\t\t\t\tpanStart.copy( panEnd );\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">handleTouchMoveDolly</span>(<span class=\"code-params\"> event </span>) </span>{\n","\n","\t\t\t\t<span class=\"code-keyword\">const</span> position = getSecondPointerPosition( event );\n","\t\t\t\t<span class=\"code-keyword\">const</span> dx = event.pageX - position.x;\n","\t\t\t\t<span class=\"code-keyword\">const</span> dy = event.pageY - position.y;\n","\t\t\t\t<span class=\"code-keyword\">const</span> distance = <span class=\"code-built_in\">Math</span>.sqrt( dx * dx + dy * dy );\n","\t\t\t\tdollyEnd.set( <span class=\"code-number\">0</span>, distance );\n","\t\t\t\tdollyDelta.set( <span class=\"code-number\">0</span>, <span class=\"code-built_in\">Math</span>.pow( dollyEnd.y / dollyStart.y, scope.zoomSpeed ) );\n","\t\t\t\tdollyOut( dollyDelta.y );\n","\t\t\t\tdollyStart.copy( dollyEnd );\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">handleTouchMoveDollyPan</span>(<span class=\"code-params\"> event </span>) </span>{\n","\n","\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.enableZoom ) handleTouchMoveDolly( event );\n","\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.enablePan ) handleTouchMovePan( event );\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">handleTouchMoveDollyRotate</span>(<span class=\"code-params\"> event </span>) </span>{\n","\n","\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.enableZoom ) handleTouchMoveDolly( event );\n","\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.enableRotate ) handleTouchMoveRotate( event );\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">handleTouchEnd</span>(<span class=\"code-params\"></span>) </span>{ <span class=\"code-comment\">// no-op</span>\n","\t\t\t} <span class=\"code-comment\">//</span>\n","\t\t\t<span class=\"code-comment\">// event handlers - FSM: listen for events and reset state</span>\n","\t\t\t<span class=\"code-comment\">//</span>\n","\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">onPointerDown</span>(<span class=\"code-params\"> event </span>) </span>{\n","\n","\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.enabled === <span class=\"code-literal\">false</span> ) <span class=\"code-keyword\">return</span>;\n","\n","\t\t\t\t<span class=\"code-keyword\">if</span> ( pointers.length === <span class=\"code-number\">0</span> ) {\n","\n","\t\t\t\t\tscope.domElement.setPointerCapture( event.pointerId );\n","\t\t\t\t\tscope.domElement.addEventListener( <span class=\"code-string\">'pointermove'</span>, onPointerMove );\n","\t\t\t\t\tscope.domElement.addEventListener( <span class=\"code-string\">'pointerup'</span>, onPointerUp );\n","\n","\t\t\t\t} <span class=\"code-comment\">//</span>\n","\n","\n","\t\t\t\taddPointer( event );\n","\n","\t\t\t\t<span class=\"code-keyword\">if</span> ( event.pointerType === <span class=\"code-string\">'touch'</span> ) {\n","\n","\t\t\t\t\tonTouchStart( event );\n","\n","\t\t\t\t} <span class=\"code-keyword\">else</span> {\n","\n","\t\t\t\t\tonMouseDown( event );\n","\n","\t\t\t\t}\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">onPointerMove</span>(<span class=\"code-params\"> event </span>) </span>{\n","\n","\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.enabled === <span class=\"code-literal\">false</span> ) <span class=\"code-keyword\">return</span>;\n","\n","\t\t\t\t<span class=\"code-keyword\">if</span> ( event.pointerType === <span class=\"code-string\">'touch'</span> ) {\n","\n","\t\t\t\t\tonTouchMove( event );\n","\n","\t\t\t\t} <span class=\"code-keyword\">else</span> {\n","\n","\t\t\t\t\tonMouseMove( event );\n","\n","\t\t\t\t}\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">onPointerUp</span>(<span class=\"code-params\"> event </span>) </span>{\n","\n","\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.enabled === <span class=\"code-literal\">false</span> ) <span class=\"code-keyword\">return</span>;\n","\n","\t\t\t\t<span class=\"code-keyword\">if</span> ( event.pointerType === <span class=\"code-string\">'touch'</span> ) {\n","\n","\t\t\t\t\tonTouchEnd();\n","\n","\t\t\t\t} <span class=\"code-keyword\">else</span> {\n","\n","\t\t\t\t\tonMouseUp( event );\n","\n","\t\t\t\t}\n","\n","\t\t\t\tremovePointer( event ); <span class=\"code-comment\">//</span>\n","\n","\t\t\t\t<span class=\"code-keyword\">if</span> ( pointers.length === <span class=\"code-number\">0</span> ) {\n","\n","\t\t\t\t\tscope.domElement.releasePointerCapture( event.pointerId );\n","\t\t\t\t\tscope.domElement.removeEventListener( <span class=\"code-string\">'pointermove'</span>, onPointerMove );\n","\t\t\t\t\tscope.domElement.removeEventListener( <span class=\"code-string\">'pointerup'</span>, onPointerUp );\n","\n","\t\t\t\t}\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">onPointerCancel</span>(<span class=\"code-params\"> event </span>) </span>{\n","\n","\t\t\t\tremovePointer( event );\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">onMouseDown</span>(<span class=\"code-params\"> event </span>) </span>{\n","\n","\t\t\t\t<span class=\"code-keyword\">let</span> mouseAction;\n","\n","\t\t\t\t<span class=\"code-keyword\">switch</span> ( event.button ) {\n","\n","\t\t\t\t\t<span class=\"code-keyword\">case</span> <span class=\"code-number\">0</span>:\n","\t\t\t\t\t\tmouseAction = scope.mouseButtons.LEFT;\n","\t\t\t\t\t\t<span class=\"code-keyword\">break</span>;\n","\n","\t\t\t\t\t<span class=\"code-keyword\">case</span> <span class=\"code-number\">1</span>:\n","\t\t\t\t\t\tmouseAction = scope.mouseButtons.MIDDLE;\n","\t\t\t\t\t\t<span class=\"code-keyword\">break</span>;\n","\n","\t\t\t\t\t<span class=\"code-keyword\">case</span> <span class=\"code-number\">2</span>:\n","\t\t\t\t\t\tmouseAction = scope.mouseButtons.RIGHT;\n","\t\t\t\t\t\t<span class=\"code-keyword\">break</span>;\n","\n","\t\t\t\t\t<span class=\"code-keyword\">default</span>:\n","\t\t\t\t\t\tmouseAction = - <span class=\"code-number\">1</span>;\n","\n","\t\t\t\t}\n","\n","\t\t\t\t<span class=\"code-keyword\">switch</span> ( mouseAction ) {\n","\n","\t\t\t\t\t<span class=\"code-keyword\">case</span> THREE.MOUSE.DOLLY:\n","\t\t\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.enableZoom === <span class=\"code-literal\">false</span> ) <span class=\"code-keyword\">return</span>;\n","\t\t\t\t\t\thandleMouseDownDolly( event );\n","\t\t\t\t\t\tstate = STATE.DOLLY;\n","\t\t\t\t\t\t<span class=\"code-keyword\">break</span>;\n","\n","\t\t\t\t\t<span class=\"code-keyword\">case</span> THREE.MOUSE.ROTATE:\n","\t\t\t\t\t\t<span class=\"code-keyword\">if</span> ( event.ctrlKey || event.metaKey || event.shiftKey ) {\n","\n","\t\t\t\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.enablePan === <span class=\"code-literal\">false</span> ) <span class=\"code-keyword\">return</span>;\n","\t\t\t\t\t\t\thandleMouseDownPan( event );\n","\t\t\t\t\t\t\tstate = STATE.PAN;\n","\n","\t\t\t\t\t\t} <span class=\"code-keyword\">else</span> {\n","\n","\t\t\t\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.enableRotate === <span class=\"code-literal\">false</span> ) <span class=\"code-keyword\">return</span>;\n","\t\t\t\t\t\t\thandleMouseDownRotate( event );\n","\t\t\t\t\t\t\tstate = STATE.ROTATE;\n","\n","\t\t\t\t\t\t}\n","\n","\t\t\t\t\t\t<span class=\"code-keyword\">break</span>;\n","\n","\t\t\t\t\t<span class=\"code-keyword\">case</span> THREE.MOUSE.PAN:\n","\t\t\t\t\t\t<span class=\"code-keyword\">if</span> ( event.ctrlKey || event.metaKey || event.shiftKey ) {\n","\n","\t\t\t\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.enableRotate === <span class=\"code-literal\">false</span> ) <span class=\"code-keyword\">return</span>;\n","\t\t\t\t\t\t\thandleMouseDownRotate( event );\n","\t\t\t\t\t\t\tstate = STATE.ROTATE;\n","\n","\t\t\t\t\t\t} <span class=\"code-keyword\">else</span> {\n","\n","\t\t\t\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.enablePan === <span class=\"code-literal\">false</span> ) <span class=\"code-keyword\">return</span>;\n","\t\t\t\t\t\t\thandleMouseDownPan( event );\n","\t\t\t\t\t\t\tstate = STATE.PAN;\n","\n","\t\t\t\t\t\t}\n","\n","\t\t\t\t\t\t<span class=\"code-keyword\">break</span>;\n","\n","\t\t\t\t\t<span class=\"code-keyword\">default</span>:\n","\t\t\t\t\t\tstate = STATE.NONE;\n","\n","\t\t\t\t}\n","\n","\t\t\t\t<span class=\"code-keyword\">if</span> ( state !== STATE.NONE ) {\n","\n","\t\t\t\t\tscope.dispatchEvent( _startEvent );\n","\n","\t\t\t\t}\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">onMouseMove</span>(<span class=\"code-params\"> event </span>) </span>{\n","\n","\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.enabled === <span class=\"code-literal\">false</span> ) <span class=\"code-keyword\">return</span>;\n","\n","\t\t\t\t<span class=\"code-keyword\">switch</span> ( state ) {\n","\n","\t\t\t\t\t<span class=\"code-keyword\">case</span> STATE.ROTATE:\n","\t\t\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.enableRotate === <span class=\"code-literal\">false</span> ) <span class=\"code-keyword\">return</span>;\n","\t\t\t\t\t\thandleMouseMoveRotate( event );\n","\t\t\t\t\t\t<span class=\"code-keyword\">break</span>;\n","\n","\t\t\t\t\t<span class=\"code-keyword\">case</span> STATE.DOLLY:\n","\t\t\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.enableZoom === <span class=\"code-literal\">false</span> ) <span class=\"code-keyword\">return</span>;\n","\t\t\t\t\t\thandleMouseMoveDolly( event );\n","\t\t\t\t\t\t<span class=\"code-keyword\">break</span>;\n","\n","\t\t\t\t\t<span class=\"code-keyword\">case</span> STATE.PAN:\n","\t\t\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.enablePan === <span class=\"code-literal\">false</span> ) <span class=\"code-keyword\">return</span>;\n","\t\t\t\t\t\thandleMouseMovePan( event );\n","\t\t\t\t\t\t<span class=\"code-keyword\">break</span>;\n","\n","\t\t\t\t}\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">onMouseUp</span>(<span class=\"code-params\"> event </span>) </span>{\n","\n","\t\t\t\thandleMouseUp( event );\n","\t\t\t\tscope.dispatchEvent( _endEvent );\n","\t\t\t\tstate = STATE.NONE;\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">onMouseWheel</span>(<span class=\"code-params\"> event </span>) </span>{\n","\n","\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.enabled === <span class=\"code-literal\">false</span> || scope.enableZoom === <span class=\"code-literal\">false</span> || state !== STATE.NONE && state !== STATE.ROTATE ) <span class=\"code-keyword\">return</span>;\n","\t\t\t\tevent.preventDefault();\n","\t\t\t\tscope.dispatchEvent( _startEvent );\n","\t\t\t\thandleMouseWheel( event );\n","\t\t\t\tscope.dispatchEvent( _endEvent );\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">onKeyDown</span>(<span class=\"code-params\"> event </span>) </span>{\n","\n","\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.enabled === <span class=\"code-literal\">false</span> || scope.enablePan === <span class=\"code-literal\">false</span> ) <span class=\"code-keyword\">return</span>;\n","\t\t\t\thandleKeyDown( event );\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">onTouchStart</span>(<span class=\"code-params\"> event </span>) </span>{\n","\n","\t\t\t\ttrackPointer( event );\n","\n","\t\t\t\t<span class=\"code-keyword\">switch</span> ( pointers.length ) {\n","\n","\t\t\t\t\t<span class=\"code-keyword\">case</span> <span class=\"code-number\">1</span>:\n","\t\t\t\t\t\t<span class=\"code-keyword\">switch</span> ( scope.touches.ONE ) {\n","\n","\t\t\t\t\t\t\t<span class=\"code-keyword\">case</span> THREE.TOUCH.ROTATE:\n","\t\t\t\t\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.enableRotate === <span class=\"code-literal\">false</span> ) <span class=\"code-keyword\">return</span>;\n","\t\t\t\t\t\t\t\thandleTouchStartRotate();\n","\t\t\t\t\t\t\t\tstate = STATE.TOUCH_ROTATE;\n","\t\t\t\t\t\t\t\t<span class=\"code-keyword\">break</span>;\n","\n","\t\t\t\t\t\t\t<span class=\"code-keyword\">case</span> THREE.TOUCH.PAN:\n","\t\t\t\t\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.enablePan === <span class=\"code-literal\">false</span> ) <span class=\"code-keyword\">return</span>;\n","\t\t\t\t\t\t\t\thandleTouchStartPan();\n","\t\t\t\t\t\t\t\tstate = STATE.TOUCH_PAN;\n","\t\t\t\t\t\t\t\t<span class=\"code-keyword\">break</span>;\n","\n","\t\t\t\t\t\t\t<span class=\"code-keyword\">default</span>:\n","\t\t\t\t\t\t\t\tstate = STATE.NONE;\n","\n","\t\t\t\t\t\t}\n","\n","\t\t\t\t\t\t<span class=\"code-keyword\">break</span>;\n","\n","\t\t\t\t\t<span class=\"code-keyword\">case</span> <span class=\"code-number\">2</span>:\n","\t\t\t\t\t\t<span class=\"code-keyword\">switch</span> ( scope.touches.TWO ) {\n","\n","\t\t\t\t\t\t\t<span class=\"code-keyword\">case</span> THREE.TOUCH.DOLLY_PAN:\n","\t\t\t\t\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.enableZoom === <span class=\"code-literal\">false</span> && scope.enablePan === <span class=\"code-literal\">false</span> ) <span class=\"code-keyword\">return</span>;\n","\t\t\t\t\t\t\t\thandleTouchStartDollyPan();\n","\t\t\t\t\t\t\t\tstate = STATE.TOUCH_DOLLY_PAN;\n","\t\t\t\t\t\t\t\t<span class=\"code-keyword\">break</span>;\n","\n","\t\t\t\t\t\t\t<span class=\"code-keyword\">case</span> THREE.TOUCH.DOLLY_ROTATE:\n","\t\t\t\t\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.enableZoom === <span class=\"code-literal\">false</span> && scope.enableRotate === <span class=\"code-literal\">false</span> ) <span class=\"code-keyword\">return</span>;\n","\t\t\t\t\t\t\t\thandleTouchStartDollyRotate();\n","\t\t\t\t\t\t\t\tstate = STATE.TOUCH_DOLLY_ROTATE;\n","\t\t\t\t\t\t\t\t<span class=\"code-keyword\">break</span>;\n","\n","\t\t\t\t\t\t\t<span class=\"code-keyword\">default</span>:\n","\t\t\t\t\t\t\t\tstate = STATE.NONE;\n","\n","\t\t\t\t\t\t}\n","\n","\t\t\t\t\t\t<span class=\"code-keyword\">break</span>;\n","\n","\t\t\t\t\t<span class=\"code-keyword\">default</span>:\n","\t\t\t\t\t\tstate = STATE.NONE;\n","\n","\t\t\t\t}\n","\n","\t\t\t\t<span class=\"code-keyword\">if</span> ( state !== STATE.NONE ) {\n","\n","\t\t\t\t\tscope.dispatchEvent( _startEvent );\n","\n","\t\t\t\t}\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">onTouchMove</span>(<span class=\"code-params\"> event </span>) </span>{\n","\n","\t\t\t\ttrackPointer( event );\n","\n","\t\t\t\t<span class=\"code-keyword\">switch</span> ( state ) {\n","\n","\t\t\t\t\t<span class=\"code-keyword\">case</span> STATE.TOUCH_ROTATE:\n","\t\t\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.enableRotate === <span class=\"code-literal\">false</span> ) <span class=\"code-keyword\">return</span>;\n","\t\t\t\t\t\thandleTouchMoveRotate( event );\n","\t\t\t\t\t\tscope.update();\n","\t\t\t\t\t\t<span class=\"code-keyword\">break</span>;\n","\n","\t\t\t\t\t<span class=\"code-keyword\">case</span> STATE.TOUCH_PAN:\n","\t\t\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.enablePan === <span class=\"code-literal\">false</span> ) <span class=\"code-keyword\">return</span>;\n","\t\t\t\t\t\thandleTouchMovePan( event );\n","\t\t\t\t\t\tscope.update();\n","\t\t\t\t\t\t<span class=\"code-keyword\">break</span>;\n","\n","\t\t\t\t\t<span class=\"code-keyword\">case</span> STATE.TOUCH_DOLLY_PAN:\n","\t\t\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.enableZoom === <span class=\"code-literal\">false</span> && scope.enablePan === <span class=\"code-literal\">false</span> ) <span class=\"code-keyword\">return</span>;\n","\t\t\t\t\t\thandleTouchMoveDollyPan( event );\n","\t\t\t\t\t\tscope.update();\n","\t\t\t\t\t\t<span class=\"code-keyword\">break</span>;\n","\n","\t\t\t\t\t<span class=\"code-keyword\">case</span> STATE.TOUCH_DOLLY_ROTATE:\n","\t\t\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.enableZoom === <span class=\"code-literal\">false</span> && scope.enableRotate === <span class=\"code-literal\">false</span> ) <span class=\"code-keyword\">return</span>;\n","\t\t\t\t\t\thandleTouchMoveDollyRotate( event );\n","\t\t\t\t\t\tscope.update();\n","\t\t\t\t\t\t<span class=\"code-keyword\">break</span>;\n","\n","\t\t\t\t\t<span class=\"code-keyword\">default</span>:\n","\t\t\t\t\t\tstate = STATE.NONE;\n","\n","\t\t\t\t}\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">onTouchEnd</span>(<span class=\"code-params\"> event </span>) </span>{\n","\n","\t\t\t\thandleTouchEnd( event );\n","\t\t\t\tscope.dispatchEvent( _endEvent );\n","\t\t\t\tstate = STATE.NONE;\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">onContextMenu</span>(<span class=\"code-params\"> event </span>) </span>{\n","\n","\t\t\t\t<span class=\"code-keyword\">if</span> ( scope.enabled === <span class=\"code-literal\">false</span> ) <span class=\"code-keyword\">return</span>;\n","\t\t\t\tevent.preventDefault();\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">addPointer</span>(<span class=\"code-params\"> event </span>) </span>{\n","\n","\t\t\t\tpointers.push( event );\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">removePointer</span>(<span class=\"code-params\"> event </span>) </span>{\n","\n","\t\t\t\t<span class=\"code-keyword\">delete</span> pointerPositions[ event.pointerId ];\n","\n","\t\t\t\t<span class=\"code-keyword\">for</span> ( <span class=\"code-keyword\">let</span> i = <span class=\"code-number\">0</span>; i < pointers.length; i ++ ) {\n","\n","\t\t\t\t\t<span class=\"code-keyword\">if</span> ( pointers[ i ].pointerId == event.pointerId ) {\n","\n","\t\t\t\t\t\tpointers.splice( i, <span class=\"code-number\">1</span> );\n","\t\t\t\t\t\t<span class=\"code-keyword\">return</span>;\n","\n","\t\t\t\t\t}\n","\n","\t\t\t\t}\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">trackPointer</span>(<span class=\"code-params\"> event </span>) </span>{\n","\n","\t\t\t\t<span class=\"code-keyword\">let</span> position = pointerPositions[ event.pointerId ];\n","\n","\t\t\t\t<span class=\"code-keyword\">if</span> ( position === <span class=\"code-literal\">undefined</span> ) {\n","\n","\t\t\t\t\tposition = <span class=\"code-keyword\">new</span> THREE.Vector2();\n","\t\t\t\t\tpointerPositions[ event.pointerId ] = position;\n","\n","\t\t\t\t}\n","\n","\t\t\t\tposition.set( event.pageX, event.pageY );\n","\n","\t\t\t}\n","\n","\t\t\t<span class=\"code-function\"><span class=\"code-keyword\">function</span> <span class=\"code-title\">getSecondPointerPosition</span>(<span class=\"code-params\"> event </span>) </span>{\n","\n","\t\t\t\t<span class=\"code-keyword\">const</span> pointer = event.pointerId === pointers[ <span class=\"code-number\">0</span> ].pointerId ? pointers[ <span class=\"code-number\">1</span> ] : pointers[ <span class=\"code-number\">0</span> ];\n","\t\t\t\t<span class=\"code-keyword\">return</span> pointerPositions[ pointer.pointerId ];\n","\n","\t\t\t} <span class=\"code-comment\">//</span>\n","\n","\n","\t\t\tscope.domElement.addEventListener( <span class=\"code-string\">'contextmenu'</span>, onContextMenu );\n","\t\t\tscope.domElement.addEventListener( <span class=\"code-string\">'pointerdown'</span>, onPointerDown );\n","\t\t\tscope.domElement.addEventListener( <span class=\"code-string\">'pointercancel'</span>, onPointerCancel );\n","\t\t\tscope.domElement.addEventListener( <span class=\"code-string\">'wheel'</span>, onMouseWheel, {\n","\t\t\t\tpassive: <span class=\"code-literal\">false</span>\n","\t\t\t} ); <span class=\"code-comment\">// force an update at start</span>\n","\n","\t\t\t<span class=\"code-keyword\">this</span>.update();\n","\n","\t\t}\n","\n","\t} <span class=\"code-comment\">// This set of controls performs orbiting, dollying (zooming), and panning.</span>\n","\t<span class=\"code-comment\">// Unlike TrackballControls, it maintains the \"up\" direction object.up (+Y by default).</span>\n","\t<span class=\"code-comment\">// This is very similar to OrbitControls, another set of touch behavior</span>\n","\t<span class=\"code-comment\">//</span>\n","\t<span class=\"code-comment\">// Orbit - right mouse, or left mouse + ctrl/meta/shiftKey / touch: two-finger rotate</span>\n","\t<span class=\"code-comment\">// Zoom - middle mouse, or mousewheel / touch: two-finger spread or squish</span>\n","\t<span class=\"code-comment\">// Pan - left mouse, or arrow keys / touch: one-finger move</span>\n","\n","\n","\t<span class=\"code-class\"><span class=\"code-keyword\">class</span> <span class=\"code-title\">MapControls</span> <span class=\"code-keyword\">extends</span> <span class=\"code-title\">OrbitControls</span> </span>{\n","\n","\t\t<span class=\"code-keyword\">constructor</span>( object, domElement ) {\n","\n","\t\t\t<span class=\"code-keyword\">super</span>( object, domElement );\n","\t\t\t<span class=\"code-keyword\">this</span>.screenSpacePanning = <span class=\"code-literal\">false</span>; <span class=\"code-comment\">// pan orthogonal to world-space direction camera.up</span>\n","\n","\t\t\t<span class=\"code-keyword\">this</span>.mouseButtons.LEFT = THREE.MOUSE.PAN;\n","\t\t\t<span class=\"code-keyword\">this</span>.mouseButtons.RIGHT = THREE.MOUSE.ROTATE;\n","\t\t\t<span class=\"code-keyword\">this</span>.touches.ONE = THREE.TOUCH.PAN;\n","\t\t\t<span class=\"code-keyword\">this</span>.touches.TWO = THREE.TOUCH.DOLLY_ROTATE;\n","\n","\t\t}\n","\n","\t}\n","\n","\tTHREE.MapControls = MapControls;\n","\tTHREE.OrbitControls = OrbitControls;\n","\n","} )();\n",""]}}}</script></head><body><div id="root"><style data-emotion-css="gtfibm">html{box-sizing:border-box;}*,*:before,*:after{box-sizing:inherit;}html,body,#root{height:100%;margin:0;}body{font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;font-size:16px;line-height:1.5;overflow-wrap:break-word;background:white;color:black;}code{font-family:Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace;}th,td{padding:0;}select{font-size:inherit;}#root{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}</style><style data-emotion-css="1r6h1r6">.code-listing{background:#fbfdff;color:#383a42;}.code-comment,.code-quote{color:#a0a1a7;font-style:italic;}.code-doctag,.code-keyword,.code-link,.code-formula{color:#a626a4;}.code-section,.code-name,.code-selector-tag,.code-deletion,.code-subst{color:#e45649;}.code-literal{color:#0184bb;}.code-string,.code-regexp,.code-addition,.code-attribute,.code-meta-string{color:#50a14f;}.code-built_in,.code-class .code-title{color:#c18401;}.code-attr,.code-variable,.code-template-variable,.code-type,.code-selector-class,.code-selector-attr,.code-selector-pseudo,.code-number{color:#986801;}.code-symbol,.code-bullet,.code-meta,.code-selector-id,.code-title{color:#4078f2;}.code-emphasis{font-style:italic;}.code-strong{font-weight:bold;}</style><style data-emotion-css="1c3h18e">.css-1c3h18e{-webkit-flex:1 0 auto;-ms-flex:1 0 auto;flex:1 0 auto;}</style><div class="css-1c3h18e"><style data-emotion-css="1cfuj1t">.css-1cfuj1t{max-width:940px;padding:0 20px;margin:0 auto;}</style><div class="css-1cfuj1t"><style data-emotion-css="i51og3">.css-i51og3{margin-top:2rem;}</style><header class="css-i51og3"><style data-emotion-css="1y7u1xh">.css-1y7u1xh{text-align:center;font-size:3rem;-webkit-letter-spacing:0.05em;-moz-letter-spacing:0.05em;-ms-letter-spacing:0.05em;letter-spacing:0.05em;}</style><h1 class="css-1y7u1xh"><style data-emotion-css="1ydg16i">.css-1ydg16i{color:#000;-webkit-text-decoration:none;text-decoration:none;}</style><a href="/" class="css-1ydg16i">UNPKG</a></h1></header></div><div class="css-1cfuj1t"><style data-emotion-css="93o42g">.css-93o42g{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}@media (max-width:700px){.css-93o42g{-webkit-flex-direction:column-reverse;-ms-flex-direction:column-reverse;flex-direction:column-reverse;-webkit-align-items:flex-start;-webkit-box-align:flex-start;-ms-flex-align:flex-start;align-items:flex-start;}}</style><header class="css-93o42g"><style data-emotion-css="1dlpvgi">.css-1dlpvgi{font-size:1.5rem;font-weight:normal;-webkit-flex:1;-ms-flex:1;flex:1;word-break:break-all;}</style><h1 class="css-1dlpvgi"><nav><style data-emotion-css="xt128v">.css-xt128v{color:#0076ff;-webkit-text-decoration:none;text-decoration:none;}.css-xt128v:hover{-webkit-text-decoration:underline;text-decoration:underline;}</style><a href="/browse/three@0.132.0/" class="css-xt128v">three</a><style data-emotion-css="lllnmq">.css-lllnmq{padding-left:5px;padding-right:5px;}</style><span class="css-lllnmq">/</span><a href="/browse/three@0.132.0/examples/" class="css-xt128v">examples</a><span class="css-lllnmq">/</span><a href="/browse/three@0.132.0/examples/js/" class="css-xt128v">js</a><span class="css-lllnmq">/</span><a href="/browse/three@0.132.0/examples/js/controls/" class="css-xt128v">controls</a><span class="css-lllnmq">/</span><strong>OrbitControls.js</strong></nav></h1><style data-emotion-css="1nr3dab">.css-1nr3dab{margin-left:20px;}@media (max-width:700px){.css-1nr3dab{margin-left:0;margin-bottom:0;}}</style><p class="css-1nr3dab"><label>Version:<!-- --> <style data-emotion-css="un3bt6">.css-un3bt6{-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;padding:4px 24px 4px 8px;font-weight:600;font-size:0.9em;color:#24292e;border:1px solid rgba(27,31,35,.2);border-radius:3px;background-color:#eff3f6;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAKCAYAAAC9vt6cAAAAAXNSR0IArs4c6QAAARFJREFUKBVjZAACNS39RhBNKrh17WI9o4quoT3Dn78HSNUMUs/CzOTI/O7Vi4dCYpJ3/jP+92BkYGAlyiBGhm8MjIxJt65e3MQM0vDu9YvLYmISILYZELOBxHABRkaGr0yMzF23r12YDFIDNgDEePv65SEhEXENBkYGFSAXuyGMjF8Z/jOsvX3tYiFIDwgwQSgIaaijnvj/P8M5IO8HsjiY/f//D4b//88A1SQhywG9jQr09PS4v/1mPAeUUPzP8B8cJowMjL+Bqu6xMQmaXL164AuyDgwDQJLa2qYSP//9vARkCoMVMzK8YeVkNbh+9uxzMB+JwGoASF5Vx0jz/98/18BqmZi171w9D2EjaaYKEwAEK00XQLdJuwAAAABJRU5ErkJggg==);background-position:right 8px center;background-repeat:no-repeat;background-size:auto 25%;}.css-un3bt6:hover{background-color:#e6ebf1;border-color:rgba(27,31,35,.35);}.css-un3bt6:active{background-color:#e9ecef;border-color:rgba(27,31,35,.35);box-shadow:inset 0 0.15em 0.3em rgba(27,31,35,.15);}</style><select name="version" class="css-un3bt6"><option value="0.54.0-dev">0.54.0-dev</option><option value="0.54.0">0.54.0</option><option value="0.54.1-dev">0.54.1-dev</option><option value="0.54.2-dev">0.54.2-dev</option><option value="0.54.3-dev">0.54.3-dev</option><option value="0.54.4-dev">0.54.4-dev</option><option value="0.54.5-dev">0.54.5-dev</option><option value="0.54.6-dev">0.54.6-dev</option><option value="0.54.7-dev">0.54.7-dev</option><option value="0.54.8-dev">0.54.8-dev</option><option value="0.54.9-dev">0.54.9-dev</option><option value="0.54.10-dev">0.54.10-dev</option><option value="0.54.11-dev">0.54.11-dev</option><option value="0.54.12-dev">0.54.12-dev</option><option value="0.55.0">0.55.0</option><option value="0.56.0">0.56.0</option><option value="0.56.1">0.56.1</option><option value="0.56.2">0.56.2</option><option value="0.56.3">0.56.3</option><option value="0.56.4">0.56.4</option><option value="0.56.7">0.56.7</option><option value="0.58.1">0.58.1</option><option value="0.58.2">0.58.2</option><option value="0.58.3">0.58.3</option><option value="0.58.4">0.58.4</option><option value="0.58.5">0.58.5</option><option value="0.58.6">0.58.6</option><option value="0.58.7">0.58.7</option><option value="0.58.8">0.58.8</option><option value="0.58.9">0.58.9</option><option value="0.58.10">0.58.10</option><option value="0.66.0">0.66.0</option><option value="0.66.1">0.66.1</option><option value="0.66.2">0.66.2</option><option value="0.66.6">0.66.6</option><option value="0.66.7">0.66.7</option><option value="0.66.8">0.66.8</option><option value="0.66.9">0.66.9</option><option value="0.66.10">0.66.10</option><option value="0.66.11">0.66.11</option><option value="0.66.12">0.66.12</option><option value="0.66.13">0.66.13</option><option value="0.66.14">0.66.14</option><option value="0.66.15">0.66.15</option><option value="0.66.16">0.66.16</option><option value="0.66.17">0.66.17</option><option value="0.66.18">0.66.18</option><option value="0.66.19">0.66.19</option><option value="0.66.20">0.66.20</option><option value="0.66.21">0.66.21</option><option value="0.66.22">0.66.22</option><option value="0.66.23">0.66.23</option><option value="0.66.24">0.66.24</option><option value="0.66.25">0.66.25</option><option value="0.66.26">0.66.26</option><option value="0.66.27">0.66.27</option><option value="0.66.28">0.66.28</option><option value="0.66.29">0.66.29</option><option value="0.66.30">0.66.30</option><option value="0.66.31">0.66.31</option><option value="0.66.32-dev">0.66.32-dev</option><option value="0.66.35">0.66.35</option><option value="0.66.36">0.66.36</option><option value="0.66.37">0.66.37</option><option value="0.66.38">0.66.38</option><option value="0.66.39">0.66.39</option><option value="0.66.40">0.66.40</option><option value="0.66.41">0.66.41</option><option value="0.66.42">0.66.42</option><option value="0.66.43">0.66.43</option><option value="0.66.45">0.66.45</option><option value="0.66.46">0.66.46</option><option value="0.66.47">0.66.47</option><option value="0.66.48">0.66.48</option><option value="0.66.49">0.66.49</option><option value="0.66.50">0.66.50</option><option value="0.66.51">0.66.51</option><option value="0.66.52">0.66.52</option><option value="0.66.53">0.66.53</option><option value="0.66.54">0.66.54</option><option value="0.66.55">0.66.55</option><option value="0.66.56">0.66.56</option><option value="0.66.57">0.66.57</option><option value="0.66.58">0.66.58</option><option value="0.66.59">0.66.59</option><option value="0.66.60">0.66.60</option><option value="0.66.61">0.66.61</option><option value="0.66.62">0.66.62</option><option value="0.66.63">0.66.63</option><option value="0.66.64">0.66.64</option><option value="0.66.65">0.66.65</option><option value="0.66.66">0.66.66</option><option value="0.66.67">0.66.67</option><option value="0.66.68">0.66.68</option><option value="0.66.69">0.66.69</option><option value="0.66.70">0.66.70</option><option value="0.66.71">0.66.71</option><option value="0.66.72">0.66.72</option><option value="0.66.73">0.66.73</option><option value="0.66.74">0.66.74</option><option value="0.66.75">0.66.75</option><option value="0.66.76">0.66.76</option><option value="0.66.77">0.66.77</option><option value="0.66.78">0.66.78</option><option value="0.66.79">0.66.79</option><option value="0.66.80">0.66.80</option><option value="0.66.81">0.66.81</option><option value="0.66.82">0.66.82</option><option value="0.66.83">0.66.83</option><option value="0.66.84">0.66.84</option><option value="0.66.85">0.66.85</option><option value="0.66.86">0.66.86</option><option value="0.66.87">0.66.87</option><option value="0.66.88">0.66.88</option><option value="0.66.89">0.66.89</option><option value="0.66.90">0.66.90</option><option value="0.66.91">0.66.91</option><option value="0.66.92">0.66.92</option><option value="0.66.93">0.66.93</option><option value="0.66.94">0.66.94</option><option value="0.66.95">0.66.95</option><option value="0.66.96">0.66.96</option><option value="0.66.97">0.66.97</option><option value="0.67.0">0.67.0</option><option value="0.68.0">0.68.0</option><option value="0.68.86">0.68.86</option><option value="0.68.87">0.68.87</option><option value="0.69.0">0.69.0</option><option value="0.70.0">0.70.0</option><option value="0.70.1">0.70.1</option><option value="0.71.0">0.71.0</option><option value="0.71.1">0.71.1</option><option value="0.72.0">0.72.0</option><option value="0.73.0">0.73.0</option><option value="0.73.1">0.73.1</option><option value="0.73.2">0.73.2</option><option value="0.74.0">0.74.0</option><option value="0.75.0">0.75.0</option><option value="0.76.1">0.76.1</option><option value="0.77.0">0.77.0</option><option value="0.77.1">0.77.1</option><option value="0.78.0">0.78.0</option><option value="0.79.0">0.79.0</option><option value="0.80.0">0.80.0</option><option value="0.80.1">0.80.1</option><option value="0.81.0">0.81.0</option><option value="0.81.1">0.81.1</option><option value="0.81.2">0.81.2</option><option value="0.82.0">0.82.0</option><option value="0.82.1">0.82.1</option><option value="0.83.0">0.83.0</option><option value="0.84.0">0.84.0</option><option value="0.85.0">0.85.0</option><option value="0.85.1">0.85.1</option><option value="0.85.2">0.85.2</option><option value="0.86.0">0.86.0</option><option value="0.87.0">0.87.0</option><option value="0.87.1">0.87.1</option><option value="0.88.0">0.88.0</option><option value="0.89.0">0.89.0</option><option value="0.90.0">0.90.0</option><option value="0.91.0">0.91.0</option><option value="0.92.0">0.92.0</option><option value="0.93.0">0.93.0</option><option value="0.94.0">0.94.0</option><option value="0.95.0">0.95.0</option><option value="0.96.0">0.96.0</option><option value="0.97.0">0.97.0</option><option value="0.98.0">0.98.0</option><option value="0.99.0">0.99.0</option><option value="0.100.0">0.100.0</option><option value="0.101.0">0.101.0</option><option value="0.101.1">0.101.1</option><option value="0.102.0">0.102.0</option><option value="0.102.1">0.102.1</option><option value="0.103.0">0.103.0</option><option value="0.104.0">0.104.0</option><option value="0.105.0">0.105.0</option><option value="0.105.1">0.105.1</option><option value="0.105.2">0.105.2</option><option value="0.106.0">0.106.0</option><option value="0.106.1">0.106.1</option><option value="0.106.2">0.106.2</option><option value="0.107.0">0.107.0</option><option value="0.108.0">0.108.0</option><option value="0.109.0">0.109.0</option><option value="0.110.0">0.110.0</option><option value="0.111.0">0.111.0</option><option value="0.112.0">0.112.0</option><option value="0.112.1">0.112.1</option><option value="0.113.0">0.113.0</option><option value="0.113.1">0.113.1</option><option value="0.113.2">0.113.2</option><option value="0.114.0">0.114.0</option><option value="0.115.0">0.115.0</option><option value="0.116.0">0.116.0</option><option value="0.116.1">0.116.1</option><option value="0.117.0">0.117.0</option><option value="0.117.1">0.117.1</option><option value="0.118.0">0.118.0</option><option value="0.118.1">0.118.1</option><option value="0.118.2">0.118.2</option><option value="0.118.3">0.118.3</option><option value="0.119.0">0.119.0</option><option value="0.119.1">0.119.1</option><option value="0.120.0">0.120.0</option><option value="0.120.1">0.120.1</option><option value="0.121.0">0.121.0</option><option value="0.121.1">0.121.1</option><option value="0.122.0">0.122.0</option><option value="0.123.0">0.123.0</option><option value="0.124.0">0.124.0</option><option value="0.125.0">0.125.0</option><option value="0.125.1">0.125.1</option><option value="0.125.2">0.125.2</option><option value="0.126.0">0.126.0</option><option value="0.126.1">0.126.1</option><option value="0.127.0">0.127.0</option><option value="0.128.0">0.128.0</option><option value="0.129.0">0.129.0</option><option value="0.130.0">0.130.0</option><option value="0.130.1">0.130.1</option><option value="0.131.0">0.131.0</option><option value="0.131.1">0.131.1</option><option value="0.131.2">0.131.2</option><option value="0.131.3">0.131.3</option><option selected="" value="0.132.0">0.132.0</option><option value="0.132.1">0.132.1</option><option value="0.132.2">0.132.2</option><option value="0.133.0">0.133.0</option><option value="0.133.1">0.133.1</option><option value="0.134.0">0.134.0</option><option value="0.135.0">0.135.0</option><option value="0.136.0">0.136.0</option><option value="0.137.0">0.137.0</option><option value="0.137.1">0.137.1</option><option value="0.137.2">0.137.2</option><option value="0.137.3">0.137.3</option><option value="0.137.4">0.137.4</option><option value="0.137.5">0.137.5</option><option value="0.138.0">0.138.0</option><option value="0.138.1">0.138.1</option><option value="0.138.2">0.138.2</option><option value="0.138.3">0.138.3</option><option value="0.139.0">0.139.0</option><option value="0.139.1">0.139.1</option><option value="0.139.2">0.139.2</option><option value="0.140.0">0.140.0</option><option value="0.140.1">0.140.1</option><option value="0.140.2">0.140.2</option><option value="0.141.0">0.141.0</option><option value="0.142.0">0.142.0</option><option value="0.143.0">0.143.0</option><option value="0.144.0">0.144.0</option><option value="0.145.0">0.145.0</option><option value="0.146.0">0.146.0</option><option value="0.147.0">0.147.0</option><option value="0.148.0">0.148.0</option><option value="0.149.0">0.149.0</option><option value="0.150.0">0.150.0</option><option value="0.150.1">0.150.1</option></select></label></p></header></div><style data-emotion-css="107j3ms">.css-107j3ms{max-width:940px;padding:0 20px;margin:0 auto;}@media (max-width:700px){.css-107j3ms{padding:0;margin:0;}}</style><div class="css-107j3ms"><style data-emotion-css="q3frg4">.css-q3frg4{border:1px solid #dfe2e5;border-radius:3px;}@media (max-width:700px){.css-q3frg4{border-right-width:0;border-left-width:0;}}</style><div class="css-q3frg4"><style data-emotion-css="10o5omr">.css-10o5omr{padding:10px;background:#f6f8fa;color:#424242;border:1px solid #d1d5da;border-top-left-radius:3px;border-top-right-radius:3px;margin:-1px -1px 0;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;}@media (max-width:700px){.css-10o5omr{padding-right:20px;padding-left:20px;}}</style><div class="css-10o5omr"><span>26.6 kB</span><span>JavaScript</span><span><style data-emotion-css="18x593j">.css-18x593j{display:inline-block;margin-left:8px;padding:2px 8px;-webkit-text-decoration:none;text-decoration:none;font-weight:600;font-size:0.9rem;color:#24292e;background-color:#eff3f6;border:1px solid rgba(27,31,35,.2);border-radius:3px;}.css-18x593j:hover{background-color:#e6ebf1;border-color:rgba(27,31,35,.35);}.css-18x593j:active{background-color:#e9ecef;border-color:rgba(27,31,35,.35);box-shadow:inset 0 0.15em 0.3em rgba(27,31,35,.15);}</style><a href="/three@0.132.0/examples/js/controls/OrbitControls.js" class="css-18x593j">View Raw</a></span></div><style data-emotion-css="1i31ihw">.css-1i31ihw{overflow-x:auto;overflow-y:hidden;padding-top:5px;padding-bottom:5px;}</style><div class="code-listing css-1i31ihw"><style data-emotion-css="173nir8">.css-173nir8{border:none;border-collapse:collapse;border-spacing:0;}</style><table class="css-173nir8"><tbody><tr><style data-emotion-css="a4x74f">.css-a4x74f{padding-left:10px;padding-right:10px;color:rgba(27,31,35,.3);text-align:right;vertical-align:top;width:1%;min-width:50px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}</style><td id="L1" class="css-a4x74f"><span>1</span></td><style data-emotion-css="1dcdqdg">.css-1dcdqdg{padding-left:10px;padding-right:10px;color:#24292e;white-space:pre;}</style><td id="LC1" class="css-1dcdqdg"><code>( <span class="code-function"><span class="code-keyword">function</span> (<span class="code-params"></span>) </span>{
|
|
</code></td></tr><tr><td id="L2" class="css-a4x74f"><span>2</span></td><td id="LC2" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L3" class="css-a4x74f"><span>3</span></td><td id="LC3" class="css-1dcdqdg"><code> <span class="code-comment">// Unlike TrackballControls, it maintains the "up" direction object.up (+Y by default).</span>
|
|
</code></td></tr><tr><td id="L4" class="css-a4x74f"><span>4</span></td><td id="LC4" class="css-1dcdqdg"><code> <span class="code-comment">//</span>
|
|
</code></td></tr><tr><td id="L5" class="css-a4x74f"><span>5</span></td><td id="LC5" class="css-1dcdqdg"><code> <span class="code-comment">// Orbit - left mouse / touch: one-finger move</span>
|
|
</code></td></tr><tr><td id="L6" class="css-a4x74f"><span>6</span></td><td id="LC6" class="css-1dcdqdg"><code> <span class="code-comment">// Zoom - middle mouse, or mousewheel / touch: two-finger spread or squish</span>
|
|
</code></td></tr><tr><td id="L7" class="css-a4x74f"><span>7</span></td><td id="LC7" class="css-1dcdqdg"><code> <span class="code-comment">// Pan - right mouse, or left mouse + ctrl/meta/shiftKey, or arrow keys / touch: two-finger move</span>
|
|
</code></td></tr><tr><td id="L8" class="css-a4x74f"><span>8</span></td><td id="LC8" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L9" class="css-a4x74f"><span>9</span></td><td id="LC9" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> _changeEvent = {
|
|
</code></td></tr><tr><td id="L10" class="css-a4x74f"><span>10</span></td><td id="LC10" class="css-1dcdqdg"><code> type: <span class="code-string">'change'</span>
|
|
</code></td></tr><tr><td id="L11" class="css-a4x74f"><span>11</span></td><td id="LC11" class="css-1dcdqdg"><code> };
|
|
</code></td></tr><tr><td id="L12" class="css-a4x74f"><span>12</span></td><td id="LC12" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> _startEvent = {
|
|
</code></td></tr><tr><td id="L13" class="css-a4x74f"><span>13</span></td><td id="LC13" class="css-1dcdqdg"><code> type: <span class="code-string">'start'</span>
|
|
</code></td></tr><tr><td id="L14" class="css-a4x74f"><span>14</span></td><td id="LC14" class="css-1dcdqdg"><code> };
|
|
</code></td></tr><tr><td id="L15" class="css-a4x74f"><span>15</span></td><td id="LC15" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> _endEvent = {
|
|
</code></td></tr><tr><td id="L16" class="css-a4x74f"><span>16</span></td><td id="LC16" class="css-1dcdqdg"><code> type: <span class="code-string">'end'</span>
|
|
</code></td></tr><tr><td id="L17" class="css-a4x74f"><span>17</span></td><td id="LC17" class="css-1dcdqdg"><code> };
|
|
</code></td></tr><tr><td id="L18" class="css-a4x74f"><span>18</span></td><td id="LC18" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L19" class="css-a4x74f"><span>19</span></td><td id="LC19" class="css-1dcdqdg"><code> <span class="code-class"><span class="code-keyword">class</span> <span class="code-title">OrbitControls</span> <span class="code-keyword">extends</span> <span class="code-title">THREE</span>.<span class="code-title">EventDispatcher</span> </span>{
|
|
</code></td></tr><tr><td id="L20" class="css-a4x74f"><span>20</span></td><td id="LC20" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L21" class="css-a4x74f"><span>21</span></td><td id="LC21" class="css-1dcdqdg"><code> <span class="code-keyword">constructor</span>( object, domElement ) {
|
|
</code></td></tr><tr><td id="L22" class="css-a4x74f"><span>22</span></td><td id="LC22" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L23" class="css-a4x74f"><span>23</span></td><td id="LC23" class="css-1dcdqdg"><code> <span class="code-keyword">super</span>();
|
|
</code></td></tr><tr><td id="L24" class="css-a4x74f"><span>24</span></td><td id="LC24" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( domElement === <span class="code-literal">undefined</span> ) <span class="code-built_in">console</span>.warn( <span class="code-string">'THREE.OrbitControls: The second parameter "domElement" is now mandatory.'</span> );
|
|
</code></td></tr><tr><td id="L25" class="css-a4x74f"><span>25</span></td><td id="LC25" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( domElement === <span class="code-built_in">document</span> ) <span class="code-built_in">console</span>.error( <span class="code-string">'THREE.OrbitControls: "document" should not be used as the target "domElement". Please use "renderer.domElement" instead.'</span> );
|
|
</code></td></tr><tr><td id="L26" class="css-a4x74f"><span>26</span></td><td id="LC26" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.object = object;
|
|
</code></td></tr><tr><td id="L27" class="css-a4x74f"><span>27</span></td><td id="LC27" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.domElement = domElement;
|
|
</code></td></tr><tr><td id="L28" class="css-a4x74f"><span>28</span></td><td id="LC28" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.domElement.style.touchAction = <span class="code-string">'none'</span>; <span class="code-comment">// disable touch scroll</span>
|
|
</code></td></tr><tr><td id="L29" class="css-a4x74f"><span>29</span></td><td id="LC29" class="css-1dcdqdg"><code> <span class="code-comment">// Set to false to disable this control</span>
|
|
</code></td></tr><tr><td id="L30" class="css-a4x74f"><span>30</span></td><td id="LC30" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L31" class="css-a4x74f"><span>31</span></td><td id="LC31" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.enabled = <span class="code-literal">true</span>; <span class="code-comment">// "target" sets the location of focus, where the object orbits around</span>
|
|
</code></td></tr><tr><td id="L32" class="css-a4x74f"><span>32</span></td><td id="LC32" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L33" class="css-a4x74f"><span>33</span></td><td id="LC33" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.target = <span class="code-keyword">new</span> THREE.Vector3(); <span class="code-comment">// How far you can dolly in and out ( PerspectiveCamera only )</span>
|
|
</code></td></tr><tr><td id="L34" class="css-a4x74f"><span>34</span></td><td id="LC34" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L35" class="css-a4x74f"><span>35</span></td><td id="LC35" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.minDistance = <span class="code-number">0</span>;
|
|
</code></td></tr><tr><td id="L36" class="css-a4x74f"><span>36</span></td><td id="LC36" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.maxDistance = <span class="code-literal">Infinity</span>; <span class="code-comment">// How far you can zoom in and out ( OrthographicCamera only )</span>
|
|
</code></td></tr><tr><td id="L37" class="css-a4x74f"><span>37</span></td><td id="LC37" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L38" class="css-a4x74f"><span>38</span></td><td id="LC38" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.minZoom = <span class="code-number">0</span>;
|
|
</code></td></tr><tr><td id="L39" class="css-a4x74f"><span>39</span></td><td id="LC39" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.maxZoom = <span class="code-literal">Infinity</span>; <span class="code-comment">// How far you can orbit vertically, upper and lower limits.</span>
|
|
</code></td></tr><tr><td id="L40" class="css-a4x74f"><span>40</span></td><td id="LC40" class="css-1dcdqdg"><code> <span class="code-comment">// Range is 0 to Math.PI radians.</span>
|
|
</code></td></tr><tr><td id="L41" class="css-a4x74f"><span>41</span></td><td id="LC41" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L42" class="css-a4x74f"><span>42</span></td><td id="LC42" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.minPolarAngle = <span class="code-number">0</span>; <span class="code-comment">// radians</span>
|
|
</code></td></tr><tr><td id="L43" class="css-a4x74f"><span>43</span></td><td id="LC43" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L44" class="css-a4x74f"><span>44</span></td><td id="LC44" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.maxPolarAngle = <span class="code-built_in">Math</span>.PI; <span class="code-comment">// radians</span>
|
|
</code></td></tr><tr><td id="L45" class="css-a4x74f"><span>45</span></td><td id="LC45" class="css-1dcdqdg"><code> <span class="code-comment">// How far you can orbit horizontally, upper and lower limits.</span>
|
|
</code></td></tr><tr><td id="L46" class="css-a4x74f"><span>46</span></td><td id="LC46" class="css-1dcdqdg"><code> <span class="code-comment">// If set, the interval [ min, max ] must be a sub-interval of [ - 2 PI, 2 PI ], with ( max - min < 2 PI )</span>
|
|
</code></td></tr><tr><td id="L47" class="css-a4x74f"><span>47</span></td><td id="LC47" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L48" class="css-a4x74f"><span>48</span></td><td id="LC48" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.minAzimuthAngle = - <span class="code-literal">Infinity</span>; <span class="code-comment">// radians</span>
|
|
</code></td></tr><tr><td id="L49" class="css-a4x74f"><span>49</span></td><td id="LC49" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L50" class="css-a4x74f"><span>50</span></td><td id="LC50" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.maxAzimuthAngle = <span class="code-literal">Infinity</span>; <span class="code-comment">// radians</span>
|
|
</code></td></tr><tr><td id="L51" class="css-a4x74f"><span>51</span></td><td id="LC51" class="css-1dcdqdg"><code> <span class="code-comment">// Set to true to enable damping (inertia)</span>
|
|
</code></td></tr><tr><td id="L52" class="css-a4x74f"><span>52</span></td><td id="LC52" class="css-1dcdqdg"><code> <span class="code-comment">// If damping is enabled, you must call controls.update() in your animation loop</span>
|
|
</code></td></tr><tr><td id="L53" class="css-a4x74f"><span>53</span></td><td id="LC53" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L54" class="css-a4x74f"><span>54</span></td><td id="LC54" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.enableDamping = <span class="code-literal">false</span>;
|
|
</code></td></tr><tr><td id="L55" class="css-a4x74f"><span>55</span></td><td id="LC55" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.dampingFactor = <span class="code-number">0.05</span>; <span class="code-comment">// This option actually enables dollying in and out; left as "zoom" for backwards compatibility.</span>
|
|
</code></td></tr><tr><td id="L56" class="css-a4x74f"><span>56</span></td><td id="LC56" class="css-1dcdqdg"><code> <span class="code-comment">// Set to false to disable zooming</span>
|
|
</code></td></tr><tr><td id="L57" class="css-a4x74f"><span>57</span></td><td id="LC57" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L58" class="css-a4x74f"><span>58</span></td><td id="LC58" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.enableZoom = <span class="code-literal">true</span>;
|
|
</code></td></tr><tr><td id="L59" class="css-a4x74f"><span>59</span></td><td id="LC59" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.zoomSpeed = <span class="code-number">1.0</span>; <span class="code-comment">// Set to false to disable rotating</span>
|
|
</code></td></tr><tr><td id="L60" class="css-a4x74f"><span>60</span></td><td id="LC60" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L61" class="css-a4x74f"><span>61</span></td><td id="LC61" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.enableRotate = <span class="code-literal">true</span>;
|
|
</code></td></tr><tr><td id="L62" class="css-a4x74f"><span>62</span></td><td id="LC62" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.rotateSpeed = <span class="code-number">1.0</span>; <span class="code-comment">// Set to false to disable panning</span>
|
|
</code></td></tr><tr><td id="L63" class="css-a4x74f"><span>63</span></td><td id="LC63" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L64" class="css-a4x74f"><span>64</span></td><td id="LC64" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.enablePan = <span class="code-literal">true</span>;
|
|
</code></td></tr><tr><td id="L65" class="css-a4x74f"><span>65</span></td><td id="LC65" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.panSpeed = <span class="code-number">1.0</span>;
|
|
</code></td></tr><tr><td id="L66" class="css-a4x74f"><span>66</span></td><td id="LC66" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.screenSpacePanning = <span class="code-literal">true</span>; <span class="code-comment">// if false, pan orthogonal to world-space direction camera.up</span>
|
|
</code></td></tr><tr><td id="L67" class="css-a4x74f"><span>67</span></td><td id="LC67" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L68" class="css-a4x74f"><span>68</span></td><td id="LC68" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.keyPanSpeed = <span class="code-number">7.0</span>; <span class="code-comment">// pixels moved per arrow key push</span>
|
|
</code></td></tr><tr><td id="L69" class="css-a4x74f"><span>69</span></td><td id="LC69" class="css-1dcdqdg"><code> <span class="code-comment">// Set to true to automatically rotate around the target</span>
|
|
</code></td></tr><tr><td id="L70" class="css-a4x74f"><span>70</span></td><td id="LC70" class="css-1dcdqdg"><code> <span class="code-comment">// If auto-rotate is enabled, you must call controls.update() in your animation loop</span>
|
|
</code></td></tr><tr><td id="L71" class="css-a4x74f"><span>71</span></td><td id="LC71" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L72" class="css-a4x74f"><span>72</span></td><td id="LC72" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.autoRotate = <span class="code-literal">false</span>;
|
|
</code></td></tr><tr><td id="L73" class="css-a4x74f"><span>73</span></td><td id="LC73" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.autoRotateSpeed = <span class="code-number">2.0</span>; <span class="code-comment">// 30 seconds per orbit when fps is 60</span>
|
|
</code></td></tr><tr><td id="L74" class="css-a4x74f"><span>74</span></td><td id="LC74" class="css-1dcdqdg"><code> <span class="code-comment">// The four arrow keys</span>
|
|
</code></td></tr><tr><td id="L75" class="css-a4x74f"><span>75</span></td><td id="LC75" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L76" class="css-a4x74f"><span>76</span></td><td id="LC76" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.keys = {
|
|
</code></td></tr><tr><td id="L77" class="css-a4x74f"><span>77</span></td><td id="LC77" class="css-1dcdqdg"><code> LEFT: <span class="code-string">'ArrowLeft'</span>,
|
|
</code></td></tr><tr><td id="L78" class="css-a4x74f"><span>78</span></td><td id="LC78" class="css-1dcdqdg"><code> UP: <span class="code-string">'ArrowUp'</span>,
|
|
</code></td></tr><tr><td id="L79" class="css-a4x74f"><span>79</span></td><td id="LC79" class="css-1dcdqdg"><code> RIGHT: <span class="code-string">'ArrowRight'</span>,
|
|
</code></td></tr><tr><td id="L80" class="css-a4x74f"><span>80</span></td><td id="LC80" class="css-1dcdqdg"><code> BOTTOM: <span class="code-string">'ArrowDown'</span>
|
|
</code></td></tr><tr><td id="L81" class="css-a4x74f"><span>81</span></td><td id="LC81" class="css-1dcdqdg"><code> }; <span class="code-comment">// Mouse buttons</span>
|
|
</code></td></tr><tr><td id="L82" class="css-a4x74f"><span>82</span></td><td id="LC82" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L83" class="css-a4x74f"><span>83</span></td><td id="LC83" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.mouseButtons = {
|
|
</code></td></tr><tr><td id="L84" class="css-a4x74f"><span>84</span></td><td id="LC84" class="css-1dcdqdg"><code> LEFT: THREE.MOUSE.ROTATE,
|
|
</code></td></tr><tr><td id="L85" class="css-a4x74f"><span>85</span></td><td id="LC85" class="css-1dcdqdg"><code> MIDDLE: THREE.MOUSE.DOLLY,
|
|
</code></td></tr><tr><td id="L86" class="css-a4x74f"><span>86</span></td><td id="LC86" class="css-1dcdqdg"><code> RIGHT: THREE.MOUSE.PAN
|
|
</code></td></tr><tr><td id="L87" class="css-a4x74f"><span>87</span></td><td id="LC87" class="css-1dcdqdg"><code> }; <span class="code-comment">// Touch fingers</span>
|
|
</code></td></tr><tr><td id="L88" class="css-a4x74f"><span>88</span></td><td id="LC88" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L89" class="css-a4x74f"><span>89</span></td><td id="LC89" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.touches = {
|
|
</code></td></tr><tr><td id="L90" class="css-a4x74f"><span>90</span></td><td id="LC90" class="css-1dcdqdg"><code> ONE: THREE.TOUCH.ROTATE,
|
|
</code></td></tr><tr><td id="L91" class="css-a4x74f"><span>91</span></td><td id="LC91" class="css-1dcdqdg"><code> TWO: THREE.TOUCH.DOLLY_PAN
|
|
</code></td></tr><tr><td id="L92" class="css-a4x74f"><span>92</span></td><td id="LC92" class="css-1dcdqdg"><code> }; <span class="code-comment">// for reset</span>
|
|
</code></td></tr><tr><td id="L93" class="css-a4x74f"><span>93</span></td><td id="LC93" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L94" class="css-a4x74f"><span>94</span></td><td id="LC94" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.target0 = <span class="code-keyword">this</span>.target.clone();
|
|
</code></td></tr><tr><td id="L95" class="css-a4x74f"><span>95</span></td><td id="LC95" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.position0 = <span class="code-keyword">this</span>.object.position.clone();
|
|
</code></td></tr><tr><td id="L96" class="css-a4x74f"><span>96</span></td><td id="LC96" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.zoom0 = <span class="code-keyword">this</span>.object.zoom; <span class="code-comment">// the target DOM element for key events</span>
|
|
</code></td></tr><tr><td id="L97" class="css-a4x74f"><span>97</span></td><td id="LC97" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L98" class="css-a4x74f"><span>98</span></td><td id="LC98" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>._domElementKeyEvents = <span class="code-literal">null</span>; <span class="code-comment">//</span>
|
|
</code></td></tr><tr><td id="L99" class="css-a4x74f"><span>99</span></td><td id="LC99" class="css-1dcdqdg"><code> <span class="code-comment">// public methods</span>
|
|
</code></td></tr><tr><td id="L100" class="css-a4x74f"><span>100</span></td><td id="LC100" class="css-1dcdqdg"><code> <span class="code-comment">//</span>
|
|
</code></td></tr><tr><td id="L101" class="css-a4x74f"><span>101</span></td><td id="LC101" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L102" class="css-a4x74f"><span>102</span></td><td id="LC102" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.getPolarAngle = <span class="code-function"><span class="code-keyword">function</span> (<span class="code-params"></span>) </span>{
|
|
</code></td></tr><tr><td id="L103" class="css-a4x74f"><span>103</span></td><td id="LC103" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L104" class="css-a4x74f"><span>104</span></td><td id="LC104" class="css-1dcdqdg"><code> <span class="code-keyword">return</span> spherical.phi;
|
|
</code></td></tr><tr><td id="L105" class="css-a4x74f"><span>105</span></td><td id="LC105" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L106" class="css-a4x74f"><span>106</span></td><td id="LC106" class="css-1dcdqdg"><code> };
|
|
</code></td></tr><tr><td id="L107" class="css-a4x74f"><span>107</span></td><td id="LC107" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L108" class="css-a4x74f"><span>108</span></td><td id="LC108" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.getAzimuthalAngle = <span class="code-function"><span class="code-keyword">function</span> (<span class="code-params"></span>) </span>{
|
|
</code></td></tr><tr><td id="L109" class="css-a4x74f"><span>109</span></td><td id="LC109" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L110" class="css-a4x74f"><span>110</span></td><td id="LC110" class="css-1dcdqdg"><code> <span class="code-keyword">return</span> spherical.theta;
|
|
</code></td></tr><tr><td id="L111" class="css-a4x74f"><span>111</span></td><td id="LC111" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L112" class="css-a4x74f"><span>112</span></td><td id="LC112" class="css-1dcdqdg"><code> };
|
|
</code></td></tr><tr><td id="L113" class="css-a4x74f"><span>113</span></td><td id="LC113" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L114" class="css-a4x74f"><span>114</span></td><td id="LC114" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.getDistance = <span class="code-function"><span class="code-keyword">function</span> (<span class="code-params"></span>) </span>{
|
|
</code></td></tr><tr><td id="L115" class="css-a4x74f"><span>115</span></td><td id="LC115" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L116" class="css-a4x74f"><span>116</span></td><td id="LC116" class="css-1dcdqdg"><code> <span class="code-keyword">return</span> <span class="code-keyword">this</span>.object.position.distanceTo( <span class="code-keyword">this</span>.target );
|
|
</code></td></tr><tr><td id="L117" class="css-a4x74f"><span>117</span></td><td id="LC117" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L118" class="css-a4x74f"><span>118</span></td><td id="LC118" class="css-1dcdqdg"><code> };
|
|
</code></td></tr><tr><td id="L119" class="css-a4x74f"><span>119</span></td><td id="LC119" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L120" class="css-a4x74f"><span>120</span></td><td id="LC120" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.listenToKeyEvents = <span class="code-function"><span class="code-keyword">function</span> (<span class="code-params"> domElement </span>) </span>{
|
|
</code></td></tr><tr><td id="L121" class="css-a4x74f"><span>121</span></td><td id="LC121" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L122" class="css-a4x74f"><span>122</span></td><td id="LC122" class="css-1dcdqdg"><code> domElement.addEventListener( <span class="code-string">'keydown'</span>, onKeyDown );
|
|
</code></td></tr><tr><td id="L123" class="css-a4x74f"><span>123</span></td><td id="LC123" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>._domElementKeyEvents = domElement;
|
|
</code></td></tr><tr><td id="L124" class="css-a4x74f"><span>124</span></td><td id="LC124" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L125" class="css-a4x74f"><span>125</span></td><td id="LC125" class="css-1dcdqdg"><code> };
|
|
</code></td></tr><tr><td id="L126" class="css-a4x74f"><span>126</span></td><td id="LC126" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L127" class="css-a4x74f"><span>127</span></td><td id="LC127" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.saveState = <span class="code-function"><span class="code-keyword">function</span> (<span class="code-params"></span>) </span>{
|
|
</code></td></tr><tr><td id="L128" class="css-a4x74f"><span>128</span></td><td id="LC128" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L129" class="css-a4x74f"><span>129</span></td><td id="LC129" class="css-1dcdqdg"><code> scope.target0.copy( scope.target );
|
|
</code></td></tr><tr><td id="L130" class="css-a4x74f"><span>130</span></td><td id="LC130" class="css-1dcdqdg"><code> scope.position0.copy( scope.object.position );
|
|
</code></td></tr><tr><td id="L131" class="css-a4x74f"><span>131</span></td><td id="LC131" class="css-1dcdqdg"><code> scope.zoom0 = scope.object.zoom;
|
|
</code></td></tr><tr><td id="L132" class="css-a4x74f"><span>132</span></td><td id="LC132" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L133" class="css-a4x74f"><span>133</span></td><td id="LC133" class="css-1dcdqdg"><code> };
|
|
</code></td></tr><tr><td id="L134" class="css-a4x74f"><span>134</span></td><td id="LC134" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L135" class="css-a4x74f"><span>135</span></td><td id="LC135" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.reset = <span class="code-function"><span class="code-keyword">function</span> (<span class="code-params"></span>) </span>{
|
|
</code></td></tr><tr><td id="L136" class="css-a4x74f"><span>136</span></td><td id="LC136" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L137" class="css-a4x74f"><span>137</span></td><td id="LC137" class="css-1dcdqdg"><code> scope.target.copy( scope.target0 );
|
|
</code></td></tr><tr><td id="L138" class="css-a4x74f"><span>138</span></td><td id="LC138" class="css-1dcdqdg"><code> scope.object.position.copy( scope.position0 );
|
|
</code></td></tr><tr><td id="L139" class="css-a4x74f"><span>139</span></td><td id="LC139" class="css-1dcdqdg"><code> scope.object.zoom = scope.zoom0;
|
|
</code></td></tr><tr><td id="L140" class="css-a4x74f"><span>140</span></td><td id="LC140" class="css-1dcdqdg"><code> scope.object.updateProjectionMatrix();
|
|
</code></td></tr><tr><td id="L141" class="css-a4x74f"><span>141</span></td><td id="LC141" class="css-1dcdqdg"><code> scope.dispatchEvent( _changeEvent );
|
|
</code></td></tr><tr><td id="L142" class="css-a4x74f"><span>142</span></td><td id="LC142" class="css-1dcdqdg"><code> scope.update();
|
|
</code></td></tr><tr><td id="L143" class="css-a4x74f"><span>143</span></td><td id="LC143" class="css-1dcdqdg"><code> state = STATE.NONE;
|
|
</code></td></tr><tr><td id="L144" class="css-a4x74f"><span>144</span></td><td id="LC144" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L145" class="css-a4x74f"><span>145</span></td><td id="LC145" class="css-1dcdqdg"><code> }; <span class="code-comment">// this method is exposed, but perhaps it would be better if we can make it private...</span>
|
|
</code></td></tr><tr><td id="L146" class="css-a4x74f"><span>146</span></td><td id="LC146" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L147" class="css-a4x74f"><span>147</span></td><td id="LC147" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L148" class="css-a4x74f"><span>148</span></td><td id="LC148" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.update = <span class="code-function"><span class="code-keyword">function</span> (<span class="code-params"></span>) </span>{
|
|
</code></td></tr><tr><td id="L149" class="css-a4x74f"><span>149</span></td><td id="LC149" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L150" class="css-a4x74f"><span>150</span></td><td id="LC150" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> offset = <span class="code-keyword">new</span> THREE.Vector3(); <span class="code-comment">// so camera.up is the orbit axis</span>
|
|
</code></td></tr><tr><td id="L151" class="css-a4x74f"><span>151</span></td><td id="LC151" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L152" class="css-a4x74f"><span>152</span></td><td id="LC152" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> quat = <span class="code-keyword">new</span> THREE.Quaternion().setFromUnitVectors( object.up, <span class="code-keyword">new</span> THREE.Vector3( <span class="code-number">0</span>, <span class="code-number">1</span>, <span class="code-number">0</span> ) );
|
|
</code></td></tr><tr><td id="L153" class="css-a4x74f"><span>153</span></td><td id="LC153" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> quatInverse = quat.clone().invert();
|
|
</code></td></tr><tr><td id="L154" class="css-a4x74f"><span>154</span></td><td id="LC154" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> lastPosition = <span class="code-keyword">new</span> THREE.Vector3();
|
|
</code></td></tr><tr><td id="L155" class="css-a4x74f"><span>155</span></td><td id="LC155" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> lastQuaternion = <span class="code-keyword">new</span> THREE.Quaternion();
|
|
</code></td></tr><tr><td id="L156" class="css-a4x74f"><span>156</span></td><td id="LC156" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> twoPI = <span class="code-number">2</span> * <span class="code-built_in">Math</span>.PI;
|
|
</code></td></tr><tr><td id="L157" class="css-a4x74f"><span>157</span></td><td id="LC157" class="css-1dcdqdg"><code> <span class="code-keyword">return</span> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">update</span>(<span class="code-params"></span>) </span>{
|
|
</code></td></tr><tr><td id="L158" class="css-a4x74f"><span>158</span></td><td id="LC158" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L159" class="css-a4x74f"><span>159</span></td><td id="LC159" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> position = scope.object.position;
|
|
</code></td></tr><tr><td id="L160" class="css-a4x74f"><span>160</span></td><td id="LC160" class="css-1dcdqdg"><code> offset.copy( position ).sub( scope.target ); <span class="code-comment">// rotate offset to "y-axis-is-up" space</span>
|
|
</code></td></tr><tr><td id="L161" class="css-a4x74f"><span>161</span></td><td id="LC161" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L162" class="css-a4x74f"><span>162</span></td><td id="LC162" class="css-1dcdqdg"><code> offset.applyQuaternion( quat ); <span class="code-comment">// angle from z-axis around y-axis</span>
|
|
</code></td></tr><tr><td id="L163" class="css-a4x74f"><span>163</span></td><td id="LC163" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L164" class="css-a4x74f"><span>164</span></td><td id="LC164" class="css-1dcdqdg"><code> spherical.setFromVector3( offset );
|
|
</code></td></tr><tr><td id="L165" class="css-a4x74f"><span>165</span></td><td id="LC165" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L166" class="css-a4x74f"><span>166</span></td><td id="LC166" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.autoRotate && state === STATE.NONE ) {
|
|
</code></td></tr><tr><td id="L167" class="css-a4x74f"><span>167</span></td><td id="LC167" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L168" class="css-a4x74f"><span>168</span></td><td id="LC168" class="css-1dcdqdg"><code> rotateLeft( getAutoRotationAngle() );
|
|
</code></td></tr><tr><td id="L169" class="css-a4x74f"><span>169</span></td><td id="LC169" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L170" class="css-a4x74f"><span>170</span></td><td id="LC170" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L171" class="css-a4x74f"><span>171</span></td><td id="LC171" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L172" class="css-a4x74f"><span>172</span></td><td id="LC172" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.enableDamping ) {
|
|
</code></td></tr><tr><td id="L173" class="css-a4x74f"><span>173</span></td><td id="LC173" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L174" class="css-a4x74f"><span>174</span></td><td id="LC174" class="css-1dcdqdg"><code> spherical.theta += sphericalDelta.theta * scope.dampingFactor;
|
|
</code></td></tr><tr><td id="L175" class="css-a4x74f"><span>175</span></td><td id="LC175" class="css-1dcdqdg"><code> spherical.phi += sphericalDelta.phi * scope.dampingFactor;
|
|
</code></td></tr><tr><td id="L176" class="css-a4x74f"><span>176</span></td><td id="LC176" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L177" class="css-a4x74f"><span>177</span></td><td id="LC177" class="css-1dcdqdg"><code> } <span class="code-keyword">else</span> {
|
|
</code></td></tr><tr><td id="L178" class="css-a4x74f"><span>178</span></td><td id="LC178" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L179" class="css-a4x74f"><span>179</span></td><td id="LC179" class="css-1dcdqdg"><code> spherical.theta += sphericalDelta.theta;
|
|
</code></td></tr><tr><td id="L180" class="css-a4x74f"><span>180</span></td><td id="LC180" class="css-1dcdqdg"><code> spherical.phi += sphericalDelta.phi;
|
|
</code></td></tr><tr><td id="L181" class="css-a4x74f"><span>181</span></td><td id="LC181" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L182" class="css-a4x74f"><span>182</span></td><td id="LC182" class="css-1dcdqdg"><code> } <span class="code-comment">// restrict theta to be between desired limits</span>
|
|
</code></td></tr><tr><td id="L183" class="css-a4x74f"><span>183</span></td><td id="LC183" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L184" class="css-a4x74f"><span>184</span></td><td id="LC184" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L185" class="css-a4x74f"><span>185</span></td><td id="LC185" class="css-1dcdqdg"><code> <span class="code-keyword">let</span> min = scope.minAzimuthAngle;
|
|
</code></td></tr><tr><td id="L186" class="css-a4x74f"><span>186</span></td><td id="LC186" class="css-1dcdqdg"><code> <span class="code-keyword">let</span> max = scope.maxAzimuthAngle;
|
|
</code></td></tr><tr><td id="L187" class="css-a4x74f"><span>187</span></td><td id="LC187" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L188" class="css-a4x74f"><span>188</span></td><td id="LC188" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( <span class="code-built_in">isFinite</span>( min ) && <span class="code-built_in">isFinite</span>( max ) ) {
|
|
</code></td></tr><tr><td id="L189" class="css-a4x74f"><span>189</span></td><td id="LC189" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L190" class="css-a4x74f"><span>190</span></td><td id="LC190" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( min < - <span class="code-built_in">Math</span>.PI ) min += twoPI; <span class="code-keyword">else</span> <span class="code-keyword">if</span> ( min > <span class="code-built_in">Math</span>.PI ) min -= twoPI;
|
|
</code></td></tr><tr><td id="L191" class="css-a4x74f"><span>191</span></td><td id="LC191" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( max < - <span class="code-built_in">Math</span>.PI ) max += twoPI; <span class="code-keyword">else</span> <span class="code-keyword">if</span> ( max > <span class="code-built_in">Math</span>.PI ) max -= twoPI;
|
|
</code></td></tr><tr><td id="L192" class="css-a4x74f"><span>192</span></td><td id="LC192" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L193" class="css-a4x74f"><span>193</span></td><td id="LC193" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( min <= max ) {
|
|
</code></td></tr><tr><td id="L194" class="css-a4x74f"><span>194</span></td><td id="LC194" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L195" class="css-a4x74f"><span>195</span></td><td id="LC195" class="css-1dcdqdg"><code> spherical.theta = <span class="code-built_in">Math</span>.max( min, <span class="code-built_in">Math</span>.min( max, spherical.theta ) );
|
|
</code></td></tr><tr><td id="L196" class="css-a4x74f"><span>196</span></td><td id="LC196" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L197" class="css-a4x74f"><span>197</span></td><td id="LC197" class="css-1dcdqdg"><code> } <span class="code-keyword">else</span> {
|
|
</code></td></tr><tr><td id="L198" class="css-a4x74f"><span>198</span></td><td id="LC198" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L199" class="css-a4x74f"><span>199</span></td><td id="LC199" class="css-1dcdqdg"><code> spherical.theta = spherical.theta > ( min + max ) / <span class="code-number">2</span> ? <span class="code-built_in">Math</span>.max( min, spherical.theta ) : <span class="code-built_in">Math</span>.min( max, spherical.theta );
|
|
</code></td></tr><tr><td id="L200" class="css-a4x74f"><span>200</span></td><td id="LC200" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L201" class="css-a4x74f"><span>201</span></td><td id="LC201" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L202" class="css-a4x74f"><span>202</span></td><td id="LC202" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L203" class="css-a4x74f"><span>203</span></td><td id="LC203" class="css-1dcdqdg"><code> } <span class="code-comment">// restrict phi to be between desired limits</span>
|
|
</code></td></tr><tr><td id="L204" class="css-a4x74f"><span>204</span></td><td id="LC204" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L205" class="css-a4x74f"><span>205</span></td><td id="LC205" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L206" class="css-a4x74f"><span>206</span></td><td id="LC206" class="css-1dcdqdg"><code> spherical.phi = <span class="code-built_in">Math</span>.max( scope.minPolarAngle, <span class="code-built_in">Math</span>.min( scope.maxPolarAngle, spherical.phi ) );
|
|
</code></td></tr><tr><td id="L207" class="css-a4x74f"><span>207</span></td><td id="LC207" class="css-1dcdqdg"><code> spherical.makeSafe();
|
|
</code></td></tr><tr><td id="L208" class="css-a4x74f"><span>208</span></td><td id="LC208" class="css-1dcdqdg"><code> spherical.radius *= scale; <span class="code-comment">// restrict radius to be between desired limits</span>
|
|
</code></td></tr><tr><td id="L209" class="css-a4x74f"><span>209</span></td><td id="LC209" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L210" class="css-a4x74f"><span>210</span></td><td id="LC210" class="css-1dcdqdg"><code> spherical.radius = <span class="code-built_in">Math</span>.max( scope.minDistance, <span class="code-built_in">Math</span>.min( scope.maxDistance, spherical.radius ) ); <span class="code-comment">// move target to panned location</span>
|
|
</code></td></tr><tr><td id="L211" class="css-a4x74f"><span>211</span></td><td id="LC211" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L212" class="css-a4x74f"><span>212</span></td><td id="LC212" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.enableDamping === <span class="code-literal">true</span> ) {
|
|
</code></td></tr><tr><td id="L213" class="css-a4x74f"><span>213</span></td><td id="LC213" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L214" class="css-a4x74f"><span>214</span></td><td id="LC214" class="css-1dcdqdg"><code> scope.target.addScaledVector( panOffset, scope.dampingFactor );
|
|
</code></td></tr><tr><td id="L215" class="css-a4x74f"><span>215</span></td><td id="LC215" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L216" class="css-a4x74f"><span>216</span></td><td id="LC216" class="css-1dcdqdg"><code> } <span class="code-keyword">else</span> {
|
|
</code></td></tr><tr><td id="L217" class="css-a4x74f"><span>217</span></td><td id="LC217" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L218" class="css-a4x74f"><span>218</span></td><td id="LC218" class="css-1dcdqdg"><code> scope.target.add( panOffset );
|
|
</code></td></tr><tr><td id="L219" class="css-a4x74f"><span>219</span></td><td id="LC219" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L220" class="css-a4x74f"><span>220</span></td><td id="LC220" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L221" class="css-a4x74f"><span>221</span></td><td id="LC221" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L222" class="css-a4x74f"><span>222</span></td><td id="LC222" class="css-1dcdqdg"><code> offset.setFromSpherical( spherical ); <span class="code-comment">// rotate offset back to "camera-up-vector-is-up" space</span>
|
|
</code></td></tr><tr><td id="L223" class="css-a4x74f"><span>223</span></td><td id="LC223" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L224" class="css-a4x74f"><span>224</span></td><td id="LC224" class="css-1dcdqdg"><code> offset.applyQuaternion( quatInverse );
|
|
</code></td></tr><tr><td id="L225" class="css-a4x74f"><span>225</span></td><td id="LC225" class="css-1dcdqdg"><code> position.copy( scope.target ).add( offset );
|
|
</code></td></tr><tr><td id="L226" class="css-a4x74f"><span>226</span></td><td id="LC226" class="css-1dcdqdg"><code> scope.object.lookAt( scope.target );
|
|
</code></td></tr><tr><td id="L227" class="css-a4x74f"><span>227</span></td><td id="LC227" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L228" class="css-a4x74f"><span>228</span></td><td id="LC228" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.enableDamping === <span class="code-literal">true</span> ) {
|
|
</code></td></tr><tr><td id="L229" class="css-a4x74f"><span>229</span></td><td id="LC229" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L230" class="css-a4x74f"><span>230</span></td><td id="LC230" class="css-1dcdqdg"><code> sphericalDelta.theta *= <span class="code-number">1</span> - scope.dampingFactor;
|
|
</code></td></tr><tr><td id="L231" class="css-a4x74f"><span>231</span></td><td id="LC231" class="css-1dcdqdg"><code> sphericalDelta.phi *= <span class="code-number">1</span> - scope.dampingFactor;
|
|
</code></td></tr><tr><td id="L232" class="css-a4x74f"><span>232</span></td><td id="LC232" class="css-1dcdqdg"><code> panOffset.multiplyScalar( <span class="code-number">1</span> - scope.dampingFactor );
|
|
</code></td></tr><tr><td id="L233" class="css-a4x74f"><span>233</span></td><td id="LC233" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L234" class="css-a4x74f"><span>234</span></td><td id="LC234" class="css-1dcdqdg"><code> } <span class="code-keyword">else</span> {
|
|
</code></td></tr><tr><td id="L235" class="css-a4x74f"><span>235</span></td><td id="LC235" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L236" class="css-a4x74f"><span>236</span></td><td id="LC236" class="css-1dcdqdg"><code> sphericalDelta.set( <span class="code-number">0</span>, <span class="code-number">0</span>, <span class="code-number">0</span> );
|
|
</code></td></tr><tr><td id="L237" class="css-a4x74f"><span>237</span></td><td id="LC237" class="css-1dcdqdg"><code> panOffset.set( <span class="code-number">0</span>, <span class="code-number">0</span>, <span class="code-number">0</span> );
|
|
</code></td></tr><tr><td id="L238" class="css-a4x74f"><span>238</span></td><td id="LC238" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L239" class="css-a4x74f"><span>239</span></td><td id="LC239" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L240" class="css-a4x74f"><span>240</span></td><td id="LC240" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L241" class="css-a4x74f"><span>241</span></td><td id="LC241" class="css-1dcdqdg"><code> scale = <span class="code-number">1</span>; <span class="code-comment">// update condition is:</span>
|
|
</code></td></tr><tr><td id="L242" class="css-a4x74f"><span>242</span></td><td id="LC242" class="css-1dcdqdg"><code> <span class="code-comment">// min(camera displacement, camera rotation in radians)^2 > EPS</span>
|
|
</code></td></tr><tr><td id="L243" class="css-a4x74f"><span>243</span></td><td id="LC243" class="css-1dcdqdg"><code> <span class="code-comment">// using small-angle approximation cos(x/2) = 1 - x^2 / 8</span>
|
|
</code></td></tr><tr><td id="L244" class="css-a4x74f"><span>244</span></td><td id="LC244" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L245" class="css-a4x74f"><span>245</span></td><td id="LC245" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( zoomChanged || lastPosition.distanceToSquared( scope.object.position ) > EPS || <span class="code-number">8</span> * ( <span class="code-number">1</span> - lastQuaternion.dot( scope.object.quaternion ) ) > EPS ) {
|
|
</code></td></tr><tr><td id="L246" class="css-a4x74f"><span>246</span></td><td id="LC246" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L247" class="css-a4x74f"><span>247</span></td><td id="LC247" class="css-1dcdqdg"><code> scope.dispatchEvent( _changeEvent );
|
|
</code></td></tr><tr><td id="L248" class="css-a4x74f"><span>248</span></td><td id="LC248" class="css-1dcdqdg"><code> lastPosition.copy( scope.object.position );
|
|
</code></td></tr><tr><td id="L249" class="css-a4x74f"><span>249</span></td><td id="LC249" class="css-1dcdqdg"><code> lastQuaternion.copy( scope.object.quaternion );
|
|
</code></td></tr><tr><td id="L250" class="css-a4x74f"><span>250</span></td><td id="LC250" class="css-1dcdqdg"><code> zoomChanged = <span class="code-literal">false</span>;
|
|
</code></td></tr><tr><td id="L251" class="css-a4x74f"><span>251</span></td><td id="LC251" class="css-1dcdqdg"><code> <span class="code-keyword">return</span> <span class="code-literal">true</span>;
|
|
</code></td></tr><tr><td id="L252" class="css-a4x74f"><span>252</span></td><td id="LC252" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L253" class="css-a4x74f"><span>253</span></td><td id="LC253" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L254" class="css-a4x74f"><span>254</span></td><td id="LC254" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L255" class="css-a4x74f"><span>255</span></td><td id="LC255" class="css-1dcdqdg"><code> <span class="code-keyword">return</span> <span class="code-literal">false</span>;
|
|
</code></td></tr><tr><td id="L256" class="css-a4x74f"><span>256</span></td><td id="LC256" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L257" class="css-a4x74f"><span>257</span></td><td id="LC257" class="css-1dcdqdg"><code> };
|
|
</code></td></tr><tr><td id="L258" class="css-a4x74f"><span>258</span></td><td id="LC258" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L259" class="css-a4x74f"><span>259</span></td><td id="LC259" class="css-1dcdqdg"><code> }();
|
|
</code></td></tr><tr><td id="L260" class="css-a4x74f"><span>260</span></td><td id="LC260" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L261" class="css-a4x74f"><span>261</span></td><td id="LC261" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.dispose = <span class="code-function"><span class="code-keyword">function</span> (<span class="code-params"></span>) </span>{
|
|
</code></td></tr><tr><td id="L262" class="css-a4x74f"><span>262</span></td><td id="LC262" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L263" class="css-a4x74f"><span>263</span></td><td id="LC263" class="css-1dcdqdg"><code> scope.domElement.removeEventListener( <span class="code-string">'contextmenu'</span>, onContextMenu );
|
|
</code></td></tr><tr><td id="L264" class="css-a4x74f"><span>264</span></td><td id="LC264" class="css-1dcdqdg"><code> scope.domElement.removeEventListener( <span class="code-string">'pointerdown'</span>, onPointerDown );
|
|
</code></td></tr><tr><td id="L265" class="css-a4x74f"><span>265</span></td><td id="LC265" class="css-1dcdqdg"><code> scope.domElement.removeEventListener( <span class="code-string">'pointercancel'</span>, onPointerCancel );
|
|
</code></td></tr><tr><td id="L266" class="css-a4x74f"><span>266</span></td><td id="LC266" class="css-1dcdqdg"><code> scope.domElement.removeEventListener( <span class="code-string">'wheel'</span>, onMouseWheel );
|
|
</code></td></tr><tr><td id="L267" class="css-a4x74f"><span>267</span></td><td id="LC267" class="css-1dcdqdg"><code> scope.domElement.removeEventListener( <span class="code-string">'pointermove'</span>, onPointerMove );
|
|
</code></td></tr><tr><td id="L268" class="css-a4x74f"><span>268</span></td><td id="LC268" class="css-1dcdqdg"><code> scope.domElement.removeEventListener( <span class="code-string">'pointerup'</span>, onPointerUp );
|
|
</code></td></tr><tr><td id="L269" class="css-a4x74f"><span>269</span></td><td id="LC269" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L270" class="css-a4x74f"><span>270</span></td><td id="LC270" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope._domElementKeyEvents !== <span class="code-literal">null</span> ) {
|
|
</code></td></tr><tr><td id="L271" class="css-a4x74f"><span>271</span></td><td id="LC271" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L272" class="css-a4x74f"><span>272</span></td><td id="LC272" class="css-1dcdqdg"><code> scope._domElementKeyEvents.removeEventListener( <span class="code-string">'keydown'</span>, onKeyDown );
|
|
</code></td></tr><tr><td id="L273" class="css-a4x74f"><span>273</span></td><td id="LC273" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L274" class="css-a4x74f"><span>274</span></td><td id="LC274" class="css-1dcdqdg"><code> } <span class="code-comment">//scope.dispatchEvent( { type: 'dispose' } ); // should this be added here?</span>
|
|
</code></td></tr><tr><td id="L275" class="css-a4x74f"><span>275</span></td><td id="LC275" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L276" class="css-a4x74f"><span>276</span></td><td id="LC276" class="css-1dcdqdg"><code> }; <span class="code-comment">//</span>
|
|
</code></td></tr><tr><td id="L277" class="css-a4x74f"><span>277</span></td><td id="LC277" class="css-1dcdqdg"><code> <span class="code-comment">// internals</span>
|
|
</code></td></tr><tr><td id="L278" class="css-a4x74f"><span>278</span></td><td id="LC278" class="css-1dcdqdg"><code> <span class="code-comment">//</span>
|
|
</code></td></tr><tr><td id="L279" class="css-a4x74f"><span>279</span></td><td id="LC279" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L280" class="css-a4x74f"><span>280</span></td><td id="LC280" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L281" class="css-a4x74f"><span>281</span></td><td id="LC281" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> scope = <span class="code-keyword">this</span>;
|
|
</code></td></tr><tr><td id="L282" class="css-a4x74f"><span>282</span></td><td id="LC282" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> STATE = {
|
|
</code></td></tr><tr><td id="L283" class="css-a4x74f"><span>283</span></td><td id="LC283" class="css-1dcdqdg"><code> NONE: - <span class="code-number">1</span>,
|
|
</code></td></tr><tr><td id="L284" class="css-a4x74f"><span>284</span></td><td id="LC284" class="css-1dcdqdg"><code> ROTATE: <span class="code-number">0</span>,
|
|
</code></td></tr><tr><td id="L285" class="css-a4x74f"><span>285</span></td><td id="LC285" class="css-1dcdqdg"><code> DOLLY: <span class="code-number">1</span>,
|
|
</code></td></tr><tr><td id="L286" class="css-a4x74f"><span>286</span></td><td id="LC286" class="css-1dcdqdg"><code> PAN: <span class="code-number">2</span>,
|
|
</code></td></tr><tr><td id="L287" class="css-a4x74f"><span>287</span></td><td id="LC287" class="css-1dcdqdg"><code> TOUCH_ROTATE: <span class="code-number">3</span>,
|
|
</code></td></tr><tr><td id="L288" class="css-a4x74f"><span>288</span></td><td id="LC288" class="css-1dcdqdg"><code> TOUCH_PAN: <span class="code-number">4</span>,
|
|
</code></td></tr><tr><td id="L289" class="css-a4x74f"><span>289</span></td><td id="LC289" class="css-1dcdqdg"><code> TOUCH_DOLLY_PAN: <span class="code-number">5</span>,
|
|
</code></td></tr><tr><td id="L290" class="css-a4x74f"><span>290</span></td><td id="LC290" class="css-1dcdqdg"><code> TOUCH_DOLLY_ROTATE: <span class="code-number">6</span>
|
|
</code></td></tr><tr><td id="L291" class="css-a4x74f"><span>291</span></td><td id="LC291" class="css-1dcdqdg"><code> };
|
|
</code></td></tr><tr><td id="L292" class="css-a4x74f"><span>292</span></td><td id="LC292" class="css-1dcdqdg"><code> <span class="code-keyword">let</span> state = STATE.NONE;
|
|
</code></td></tr><tr><td id="L293" class="css-a4x74f"><span>293</span></td><td id="LC293" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> EPS = <span class="code-number">0.000001</span>; <span class="code-comment">// current position in spherical coordinates</span>
|
|
</code></td></tr><tr><td id="L294" class="css-a4x74f"><span>294</span></td><td id="LC294" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L295" class="css-a4x74f"><span>295</span></td><td id="LC295" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> spherical = <span class="code-keyword">new</span> THREE.Spherical();
|
|
</code></td></tr><tr><td id="L296" class="css-a4x74f"><span>296</span></td><td id="LC296" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> sphericalDelta = <span class="code-keyword">new</span> THREE.Spherical();
|
|
</code></td></tr><tr><td id="L297" class="css-a4x74f"><span>297</span></td><td id="LC297" class="css-1dcdqdg"><code> <span class="code-keyword">let</span> scale = <span class="code-number">1</span>;
|
|
</code></td></tr><tr><td id="L298" class="css-a4x74f"><span>298</span></td><td id="LC298" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> panOffset = <span class="code-keyword">new</span> THREE.Vector3();
|
|
</code></td></tr><tr><td id="L299" class="css-a4x74f"><span>299</span></td><td id="LC299" class="css-1dcdqdg"><code> <span class="code-keyword">let</span> zoomChanged = <span class="code-literal">false</span>;
|
|
</code></td></tr><tr><td id="L300" class="css-a4x74f"><span>300</span></td><td id="LC300" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> rotateStart = <span class="code-keyword">new</span> THREE.Vector2();
|
|
</code></td></tr><tr><td id="L301" class="css-a4x74f"><span>301</span></td><td id="LC301" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> rotateEnd = <span class="code-keyword">new</span> THREE.Vector2();
|
|
</code></td></tr><tr><td id="L302" class="css-a4x74f"><span>302</span></td><td id="LC302" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> rotateDelta = <span class="code-keyword">new</span> THREE.Vector2();
|
|
</code></td></tr><tr><td id="L303" class="css-a4x74f"><span>303</span></td><td id="LC303" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> panStart = <span class="code-keyword">new</span> THREE.Vector2();
|
|
</code></td></tr><tr><td id="L304" class="css-a4x74f"><span>304</span></td><td id="LC304" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> panEnd = <span class="code-keyword">new</span> THREE.Vector2();
|
|
</code></td></tr><tr><td id="L305" class="css-a4x74f"><span>305</span></td><td id="LC305" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> panDelta = <span class="code-keyword">new</span> THREE.Vector2();
|
|
</code></td></tr><tr><td id="L306" class="css-a4x74f"><span>306</span></td><td id="LC306" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> dollyStart = <span class="code-keyword">new</span> THREE.Vector2();
|
|
</code></td></tr><tr><td id="L307" class="css-a4x74f"><span>307</span></td><td id="LC307" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> dollyEnd = <span class="code-keyword">new</span> THREE.Vector2();
|
|
</code></td></tr><tr><td id="L308" class="css-a4x74f"><span>308</span></td><td id="LC308" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> dollyDelta = <span class="code-keyword">new</span> THREE.Vector2();
|
|
</code></td></tr><tr><td id="L309" class="css-a4x74f"><span>309</span></td><td id="LC309" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> pointers = [];
|
|
</code></td></tr><tr><td id="L310" class="css-a4x74f"><span>310</span></td><td id="LC310" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> pointerPositions = {};
|
|
</code></td></tr><tr><td id="L311" class="css-a4x74f"><span>311</span></td><td id="LC311" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L312" class="css-a4x74f"><span>312</span></td><td id="LC312" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">getAutoRotationAngle</span>(<span class="code-params"></span>) </span>{
|
|
</code></td></tr><tr><td id="L313" class="css-a4x74f"><span>313</span></td><td id="LC313" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L314" class="css-a4x74f"><span>314</span></td><td id="LC314" class="css-1dcdqdg"><code> <span class="code-keyword">return</span> <span class="code-number">2</span> * <span class="code-built_in">Math</span>.PI / <span class="code-number">60</span> / <span class="code-number">60</span> * scope.autoRotateSpeed;
|
|
</code></td></tr><tr><td id="L315" class="css-a4x74f"><span>315</span></td><td id="LC315" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L316" class="css-a4x74f"><span>316</span></td><td id="LC316" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L317" class="css-a4x74f"><span>317</span></td><td id="LC317" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L318" class="css-a4x74f"><span>318</span></td><td id="LC318" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">getZoomScale</span>(<span class="code-params"></span>) </span>{
|
|
</code></td></tr><tr><td id="L319" class="css-a4x74f"><span>319</span></td><td id="LC319" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L320" class="css-a4x74f"><span>320</span></td><td id="LC320" class="css-1dcdqdg"><code> <span class="code-keyword">return</span> <span class="code-built_in">Math</span>.pow( <span class="code-number">0.95</span>, scope.zoomSpeed );
|
|
</code></td></tr><tr><td id="L321" class="css-a4x74f"><span>321</span></td><td id="LC321" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L322" class="css-a4x74f"><span>322</span></td><td id="LC322" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L323" class="css-a4x74f"><span>323</span></td><td id="LC323" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L324" class="css-a4x74f"><span>324</span></td><td id="LC324" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">rotateLeft</span>(<span class="code-params"> angle </span>) </span>{
|
|
</code></td></tr><tr><td id="L325" class="css-a4x74f"><span>325</span></td><td id="LC325" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L326" class="css-a4x74f"><span>326</span></td><td id="LC326" class="css-1dcdqdg"><code> sphericalDelta.theta -= angle;
|
|
</code></td></tr><tr><td id="L327" class="css-a4x74f"><span>327</span></td><td id="LC327" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L328" class="css-a4x74f"><span>328</span></td><td id="LC328" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L329" class="css-a4x74f"><span>329</span></td><td id="LC329" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L330" class="css-a4x74f"><span>330</span></td><td id="LC330" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">rotateUp</span>(<span class="code-params"> angle </span>) </span>{
|
|
</code></td></tr><tr><td id="L331" class="css-a4x74f"><span>331</span></td><td id="LC331" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L332" class="css-a4x74f"><span>332</span></td><td id="LC332" class="css-1dcdqdg"><code> sphericalDelta.phi -= angle;
|
|
</code></td></tr><tr><td id="L333" class="css-a4x74f"><span>333</span></td><td id="LC333" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L334" class="css-a4x74f"><span>334</span></td><td id="LC334" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L335" class="css-a4x74f"><span>335</span></td><td id="LC335" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L336" class="css-a4x74f"><span>336</span></td><td id="LC336" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> panLeft = <span class="code-function"><span class="code-keyword">function</span> (<span class="code-params"></span>) </span>{
|
|
</code></td></tr><tr><td id="L337" class="css-a4x74f"><span>337</span></td><td id="LC337" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L338" class="css-a4x74f"><span>338</span></td><td id="LC338" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> v = <span class="code-keyword">new</span> THREE.Vector3();
|
|
</code></td></tr><tr><td id="L339" class="css-a4x74f"><span>339</span></td><td id="LC339" class="css-1dcdqdg"><code> <span class="code-keyword">return</span> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">panLeft</span>(<span class="code-params"> distance, objectMatrix </span>) </span>{
|
|
</code></td></tr><tr><td id="L340" class="css-a4x74f"><span>340</span></td><td id="LC340" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L341" class="css-a4x74f"><span>341</span></td><td id="LC341" class="css-1dcdqdg"><code> v.setFromMatrixColumn( objectMatrix, <span class="code-number">0</span> ); <span class="code-comment">// get X column of objectMatrix</span>
|
|
</code></td></tr><tr><td id="L342" class="css-a4x74f"><span>342</span></td><td id="LC342" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L343" class="css-a4x74f"><span>343</span></td><td id="LC343" class="css-1dcdqdg"><code> v.multiplyScalar( - distance );
|
|
</code></td></tr><tr><td id="L344" class="css-a4x74f"><span>344</span></td><td id="LC344" class="css-1dcdqdg"><code> panOffset.add( v );
|
|
</code></td></tr><tr><td id="L345" class="css-a4x74f"><span>345</span></td><td id="LC345" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L346" class="css-a4x74f"><span>346</span></td><td id="LC346" class="css-1dcdqdg"><code> };
|
|
</code></td></tr><tr><td id="L347" class="css-a4x74f"><span>347</span></td><td id="LC347" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L348" class="css-a4x74f"><span>348</span></td><td id="LC348" class="css-1dcdqdg"><code> }();
|
|
</code></td></tr><tr><td id="L349" class="css-a4x74f"><span>349</span></td><td id="LC349" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L350" class="css-a4x74f"><span>350</span></td><td id="LC350" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> panUp = <span class="code-function"><span class="code-keyword">function</span> (<span class="code-params"></span>) </span>{
|
|
</code></td></tr><tr><td id="L351" class="css-a4x74f"><span>351</span></td><td id="LC351" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L352" class="css-a4x74f"><span>352</span></td><td id="LC352" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> v = <span class="code-keyword">new</span> THREE.Vector3();
|
|
</code></td></tr><tr><td id="L353" class="css-a4x74f"><span>353</span></td><td id="LC353" class="css-1dcdqdg"><code> <span class="code-keyword">return</span> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">panUp</span>(<span class="code-params"> distance, objectMatrix </span>) </span>{
|
|
</code></td></tr><tr><td id="L354" class="css-a4x74f"><span>354</span></td><td id="LC354" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L355" class="css-a4x74f"><span>355</span></td><td id="LC355" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.screenSpacePanning === <span class="code-literal">true</span> ) {
|
|
</code></td></tr><tr><td id="L356" class="css-a4x74f"><span>356</span></td><td id="LC356" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L357" class="css-a4x74f"><span>357</span></td><td id="LC357" class="css-1dcdqdg"><code> v.setFromMatrixColumn( objectMatrix, <span class="code-number">1</span> );
|
|
</code></td></tr><tr><td id="L358" class="css-a4x74f"><span>358</span></td><td id="LC358" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L359" class="css-a4x74f"><span>359</span></td><td id="LC359" class="css-1dcdqdg"><code> } <span class="code-keyword">else</span> {
|
|
</code></td></tr><tr><td id="L360" class="css-a4x74f"><span>360</span></td><td id="LC360" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L361" class="css-a4x74f"><span>361</span></td><td id="LC361" class="css-1dcdqdg"><code> v.setFromMatrixColumn( objectMatrix, <span class="code-number">0</span> );
|
|
</code></td></tr><tr><td id="L362" class="css-a4x74f"><span>362</span></td><td id="LC362" class="css-1dcdqdg"><code> v.crossVectors( scope.object.up, v );
|
|
</code></td></tr><tr><td id="L363" class="css-a4x74f"><span>363</span></td><td id="LC363" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L364" class="css-a4x74f"><span>364</span></td><td id="LC364" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L365" class="css-a4x74f"><span>365</span></td><td id="LC365" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L366" class="css-a4x74f"><span>366</span></td><td id="LC366" class="css-1dcdqdg"><code> v.multiplyScalar( distance );
|
|
</code></td></tr><tr><td id="L367" class="css-a4x74f"><span>367</span></td><td id="LC367" class="css-1dcdqdg"><code> panOffset.add( v );
|
|
</code></td></tr><tr><td id="L368" class="css-a4x74f"><span>368</span></td><td id="LC368" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L369" class="css-a4x74f"><span>369</span></td><td id="LC369" class="css-1dcdqdg"><code> };
|
|
</code></td></tr><tr><td id="L370" class="css-a4x74f"><span>370</span></td><td id="LC370" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L371" class="css-a4x74f"><span>371</span></td><td id="LC371" class="css-1dcdqdg"><code> }(); <span class="code-comment">// deltaX and deltaY are in pixels; right and down are positive</span>
|
|
</code></td></tr><tr><td id="L372" class="css-a4x74f"><span>372</span></td><td id="LC372" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L373" class="css-a4x74f"><span>373</span></td><td id="LC373" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L374" class="css-a4x74f"><span>374</span></td><td id="LC374" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> pan = <span class="code-function"><span class="code-keyword">function</span> (<span class="code-params"></span>) </span>{
|
|
</code></td></tr><tr><td id="L375" class="css-a4x74f"><span>375</span></td><td id="LC375" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L376" class="css-a4x74f"><span>376</span></td><td id="LC376" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> offset = <span class="code-keyword">new</span> THREE.Vector3();
|
|
</code></td></tr><tr><td id="L377" class="css-a4x74f"><span>377</span></td><td id="LC377" class="css-1dcdqdg"><code> <span class="code-keyword">return</span> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">pan</span>(<span class="code-params"> deltaX, deltaY </span>) </span>{
|
|
</code></td></tr><tr><td id="L378" class="css-a4x74f"><span>378</span></td><td id="LC378" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L379" class="css-a4x74f"><span>379</span></td><td id="LC379" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> element = scope.domElement;
|
|
</code></td></tr><tr><td id="L380" class="css-a4x74f"><span>380</span></td><td id="LC380" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L381" class="css-a4x74f"><span>381</span></td><td id="LC381" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.object.isPerspectiveCamera ) {
|
|
</code></td></tr><tr><td id="L382" class="css-a4x74f"><span>382</span></td><td id="LC382" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L383" class="css-a4x74f"><span>383</span></td><td id="LC383" class="css-1dcdqdg"><code> <span class="code-comment">// perspective</span>
|
|
</code></td></tr><tr><td id="L384" class="css-a4x74f"><span>384</span></td><td id="LC384" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> position = scope.object.position;
|
|
</code></td></tr><tr><td id="L385" class="css-a4x74f"><span>385</span></td><td id="LC385" class="css-1dcdqdg"><code> offset.copy( position ).sub( scope.target );
|
|
</code></td></tr><tr><td id="L386" class="css-a4x74f"><span>386</span></td><td id="LC386" class="css-1dcdqdg"><code> <span class="code-keyword">let</span> targetDistance = offset.length(); <span class="code-comment">// half of the fov is center to top of screen</span>
|
|
</code></td></tr><tr><td id="L387" class="css-a4x74f"><span>387</span></td><td id="LC387" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L388" class="css-a4x74f"><span>388</span></td><td id="LC388" class="css-1dcdqdg"><code> targetDistance *= <span class="code-built_in">Math</span>.tan( scope.object.fov / <span class="code-number">2</span> * <span class="code-built_in">Math</span>.PI / <span class="code-number">180.0</span> ); <span class="code-comment">// we use only clientHeight here so aspect ratio does not distort speed</span>
|
|
</code></td></tr><tr><td id="L389" class="css-a4x74f"><span>389</span></td><td id="LC389" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L390" class="css-a4x74f"><span>390</span></td><td id="LC390" class="css-1dcdqdg"><code> panLeft( <span class="code-number">2</span> * deltaX * targetDistance / element.clientHeight, scope.object.matrix );
|
|
</code></td></tr><tr><td id="L391" class="css-a4x74f"><span>391</span></td><td id="LC391" class="css-1dcdqdg"><code> panUp( <span class="code-number">2</span> * deltaY * targetDistance / element.clientHeight, scope.object.matrix );
|
|
</code></td></tr><tr><td id="L392" class="css-a4x74f"><span>392</span></td><td id="LC392" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L393" class="css-a4x74f"><span>393</span></td><td id="LC393" class="css-1dcdqdg"><code> } <span class="code-keyword">else</span> <span class="code-keyword">if</span> ( scope.object.isOrthographicCamera ) {
|
|
</code></td></tr><tr><td id="L394" class="css-a4x74f"><span>394</span></td><td id="LC394" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L395" class="css-a4x74f"><span>395</span></td><td id="LC395" class="css-1dcdqdg"><code> <span class="code-comment">// orthographic</span>
|
|
</code></td></tr><tr><td id="L396" class="css-a4x74f"><span>396</span></td><td id="LC396" class="css-1dcdqdg"><code> panLeft( deltaX * ( scope.object.right - scope.object.left ) / scope.object.zoom / element.clientWidth, scope.object.matrix );
|
|
</code></td></tr><tr><td id="L397" class="css-a4x74f"><span>397</span></td><td id="LC397" class="css-1dcdqdg"><code> panUp( deltaY * ( scope.object.top - scope.object.bottom ) / scope.object.zoom / element.clientHeight, scope.object.matrix );
|
|
</code></td></tr><tr><td id="L398" class="css-a4x74f"><span>398</span></td><td id="LC398" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L399" class="css-a4x74f"><span>399</span></td><td id="LC399" class="css-1dcdqdg"><code> } <span class="code-keyword">else</span> {
|
|
</code></td></tr><tr><td id="L400" class="css-a4x74f"><span>400</span></td><td id="LC400" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L401" class="css-a4x74f"><span>401</span></td><td id="LC401" class="css-1dcdqdg"><code> <span class="code-comment">// camera neither orthographic nor perspective</span>
|
|
</code></td></tr><tr><td id="L402" class="css-a4x74f"><span>402</span></td><td id="LC402" class="css-1dcdqdg"><code> <span class="code-built_in">console</span>.warn( <span class="code-string">'WARNING: OrbitControls.js encountered an unknown camera type - pan disabled.'</span> );
|
|
</code></td></tr><tr><td id="L403" class="css-a4x74f"><span>403</span></td><td id="LC403" class="css-1dcdqdg"><code> scope.enablePan = <span class="code-literal">false</span>;
|
|
</code></td></tr><tr><td id="L404" class="css-a4x74f"><span>404</span></td><td id="LC404" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L405" class="css-a4x74f"><span>405</span></td><td id="LC405" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L406" class="css-a4x74f"><span>406</span></td><td id="LC406" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L407" class="css-a4x74f"><span>407</span></td><td id="LC407" class="css-1dcdqdg"><code> };
|
|
</code></td></tr><tr><td id="L408" class="css-a4x74f"><span>408</span></td><td id="LC408" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L409" class="css-a4x74f"><span>409</span></td><td id="LC409" class="css-1dcdqdg"><code> }();
|
|
</code></td></tr><tr><td id="L410" class="css-a4x74f"><span>410</span></td><td id="LC410" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L411" class="css-a4x74f"><span>411</span></td><td id="LC411" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">dollyOut</span>(<span class="code-params"> dollyScale </span>) </span>{
|
|
</code></td></tr><tr><td id="L412" class="css-a4x74f"><span>412</span></td><td id="LC412" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L413" class="css-a4x74f"><span>413</span></td><td id="LC413" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.object.isPerspectiveCamera ) {
|
|
</code></td></tr><tr><td id="L414" class="css-a4x74f"><span>414</span></td><td id="LC414" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L415" class="css-a4x74f"><span>415</span></td><td id="LC415" class="css-1dcdqdg"><code> scale /= dollyScale;
|
|
</code></td></tr><tr><td id="L416" class="css-a4x74f"><span>416</span></td><td id="LC416" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L417" class="css-a4x74f"><span>417</span></td><td id="LC417" class="css-1dcdqdg"><code> } <span class="code-keyword">else</span> <span class="code-keyword">if</span> ( scope.object.isOrthographicCamera ) {
|
|
</code></td></tr><tr><td id="L418" class="css-a4x74f"><span>418</span></td><td id="LC418" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L419" class="css-a4x74f"><span>419</span></td><td id="LC419" class="css-1dcdqdg"><code> scope.object.zoom = <span class="code-built_in">Math</span>.max( scope.minZoom, <span class="code-built_in">Math</span>.min( scope.maxZoom, scope.object.zoom * dollyScale ) );
|
|
</code></td></tr><tr><td id="L420" class="css-a4x74f"><span>420</span></td><td id="LC420" class="css-1dcdqdg"><code> scope.object.updateProjectionMatrix();
|
|
</code></td></tr><tr><td id="L421" class="css-a4x74f"><span>421</span></td><td id="LC421" class="css-1dcdqdg"><code> zoomChanged = <span class="code-literal">true</span>;
|
|
</code></td></tr><tr><td id="L422" class="css-a4x74f"><span>422</span></td><td id="LC422" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L423" class="css-a4x74f"><span>423</span></td><td id="LC423" class="css-1dcdqdg"><code> } <span class="code-keyword">else</span> {
|
|
</code></td></tr><tr><td id="L424" class="css-a4x74f"><span>424</span></td><td id="LC424" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L425" class="css-a4x74f"><span>425</span></td><td id="LC425" class="css-1dcdqdg"><code> <span class="code-built_in">console</span>.warn( <span class="code-string">'WARNING: OrbitControls.js encountered an unknown camera type - dolly/zoom disabled.'</span> );
|
|
</code></td></tr><tr><td id="L426" class="css-a4x74f"><span>426</span></td><td id="LC426" class="css-1dcdqdg"><code> scope.enableZoom = <span class="code-literal">false</span>;
|
|
</code></td></tr><tr><td id="L427" class="css-a4x74f"><span>427</span></td><td id="LC427" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L428" class="css-a4x74f"><span>428</span></td><td id="LC428" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L429" class="css-a4x74f"><span>429</span></td><td id="LC429" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L430" class="css-a4x74f"><span>430</span></td><td id="LC430" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L431" class="css-a4x74f"><span>431</span></td><td id="LC431" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L432" class="css-a4x74f"><span>432</span></td><td id="LC432" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">dollyIn</span>(<span class="code-params"> dollyScale </span>) </span>{
|
|
</code></td></tr><tr><td id="L433" class="css-a4x74f"><span>433</span></td><td id="LC433" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L434" class="css-a4x74f"><span>434</span></td><td id="LC434" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.object.isPerspectiveCamera ) {
|
|
</code></td></tr><tr><td id="L435" class="css-a4x74f"><span>435</span></td><td id="LC435" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L436" class="css-a4x74f"><span>436</span></td><td id="LC436" class="css-1dcdqdg"><code> scale *= dollyScale;
|
|
</code></td></tr><tr><td id="L437" class="css-a4x74f"><span>437</span></td><td id="LC437" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L438" class="css-a4x74f"><span>438</span></td><td id="LC438" class="css-1dcdqdg"><code> } <span class="code-keyword">else</span> <span class="code-keyword">if</span> ( scope.object.isOrthographicCamera ) {
|
|
</code></td></tr><tr><td id="L439" class="css-a4x74f"><span>439</span></td><td id="LC439" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L440" class="css-a4x74f"><span>440</span></td><td id="LC440" class="css-1dcdqdg"><code> scope.object.zoom = <span class="code-built_in">Math</span>.max( scope.minZoom, <span class="code-built_in">Math</span>.min( scope.maxZoom, scope.object.zoom / dollyScale ) );
|
|
</code></td></tr><tr><td id="L441" class="css-a4x74f"><span>441</span></td><td id="LC441" class="css-1dcdqdg"><code> scope.object.updateProjectionMatrix();
|
|
</code></td></tr><tr><td id="L442" class="css-a4x74f"><span>442</span></td><td id="LC442" class="css-1dcdqdg"><code> zoomChanged = <span class="code-literal">true</span>;
|
|
</code></td></tr><tr><td id="L443" class="css-a4x74f"><span>443</span></td><td id="LC443" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L444" class="css-a4x74f"><span>444</span></td><td id="LC444" class="css-1dcdqdg"><code> } <span class="code-keyword">else</span> {
|
|
</code></td></tr><tr><td id="L445" class="css-a4x74f"><span>445</span></td><td id="LC445" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L446" class="css-a4x74f"><span>446</span></td><td id="LC446" class="css-1dcdqdg"><code> <span class="code-built_in">console</span>.warn( <span class="code-string">'WARNING: OrbitControls.js encountered an unknown camera type - dolly/zoom disabled.'</span> );
|
|
</code></td></tr><tr><td id="L447" class="css-a4x74f"><span>447</span></td><td id="LC447" class="css-1dcdqdg"><code> scope.enableZoom = <span class="code-literal">false</span>;
|
|
</code></td></tr><tr><td id="L448" class="css-a4x74f"><span>448</span></td><td id="LC448" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L449" class="css-a4x74f"><span>449</span></td><td id="LC449" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L450" class="css-a4x74f"><span>450</span></td><td id="LC450" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L451" class="css-a4x74f"><span>451</span></td><td id="LC451" class="css-1dcdqdg"><code> } <span class="code-comment">//</span>
|
|
</code></td></tr><tr><td id="L452" class="css-a4x74f"><span>452</span></td><td id="LC452" class="css-1dcdqdg"><code> <span class="code-comment">// event callbacks - update the object state</span>
|
|
</code></td></tr><tr><td id="L453" class="css-a4x74f"><span>453</span></td><td id="LC453" class="css-1dcdqdg"><code> <span class="code-comment">//</span>
|
|
</code></td></tr><tr><td id="L454" class="css-a4x74f"><span>454</span></td><td id="LC454" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L455" class="css-a4x74f"><span>455</span></td><td id="LC455" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L456" class="css-a4x74f"><span>456</span></td><td id="LC456" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">handleMouseDownRotate</span>(<span class="code-params"> event </span>) </span>{
|
|
</code></td></tr><tr><td id="L457" class="css-a4x74f"><span>457</span></td><td id="LC457" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L458" class="css-a4x74f"><span>458</span></td><td id="LC458" class="css-1dcdqdg"><code> rotateStart.set( event.clientX, event.clientY );
|
|
</code></td></tr><tr><td id="L459" class="css-a4x74f"><span>459</span></td><td id="LC459" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L460" class="css-a4x74f"><span>460</span></td><td id="LC460" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L461" class="css-a4x74f"><span>461</span></td><td id="LC461" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L462" class="css-a4x74f"><span>462</span></td><td id="LC462" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">handleMouseDownDolly</span>(<span class="code-params"> event </span>) </span>{
|
|
</code></td></tr><tr><td id="L463" class="css-a4x74f"><span>463</span></td><td id="LC463" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L464" class="css-a4x74f"><span>464</span></td><td id="LC464" class="css-1dcdqdg"><code> dollyStart.set( event.clientX, event.clientY );
|
|
</code></td></tr><tr><td id="L465" class="css-a4x74f"><span>465</span></td><td id="LC465" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L466" class="css-a4x74f"><span>466</span></td><td id="LC466" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L467" class="css-a4x74f"><span>467</span></td><td id="LC467" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L468" class="css-a4x74f"><span>468</span></td><td id="LC468" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">handleMouseDownPan</span>(<span class="code-params"> event </span>) </span>{
|
|
</code></td></tr><tr><td id="L469" class="css-a4x74f"><span>469</span></td><td id="LC469" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L470" class="css-a4x74f"><span>470</span></td><td id="LC470" class="css-1dcdqdg"><code> panStart.set( event.clientX, event.clientY );
|
|
</code></td></tr><tr><td id="L471" class="css-a4x74f"><span>471</span></td><td id="LC471" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L472" class="css-a4x74f"><span>472</span></td><td id="LC472" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L473" class="css-a4x74f"><span>473</span></td><td id="LC473" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L474" class="css-a4x74f"><span>474</span></td><td id="LC474" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">handleMouseMoveRotate</span>(<span class="code-params"> event </span>) </span>{
|
|
</code></td></tr><tr><td id="L475" class="css-a4x74f"><span>475</span></td><td id="LC475" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L476" class="css-a4x74f"><span>476</span></td><td id="LC476" class="css-1dcdqdg"><code> rotateEnd.set( event.clientX, event.clientY );
|
|
</code></td></tr><tr><td id="L477" class="css-a4x74f"><span>477</span></td><td id="LC477" class="css-1dcdqdg"><code> rotateDelta.subVectors( rotateEnd, rotateStart ).multiplyScalar( scope.rotateSpeed );
|
|
</code></td></tr><tr><td id="L478" class="css-a4x74f"><span>478</span></td><td id="LC478" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> element = scope.domElement;
|
|
</code></td></tr><tr><td id="L479" class="css-a4x74f"><span>479</span></td><td id="LC479" class="css-1dcdqdg"><code> rotateLeft( <span class="code-number">2</span> * <span class="code-built_in">Math</span>.PI * rotateDelta.x / element.clientHeight ); <span class="code-comment">// yes, height</span>
|
|
</code></td></tr><tr><td id="L480" class="css-a4x74f"><span>480</span></td><td id="LC480" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L481" class="css-a4x74f"><span>481</span></td><td id="LC481" class="css-1dcdqdg"><code> rotateUp( <span class="code-number">2</span> * <span class="code-built_in">Math</span>.PI * rotateDelta.y / element.clientHeight );
|
|
</code></td></tr><tr><td id="L482" class="css-a4x74f"><span>482</span></td><td id="LC482" class="css-1dcdqdg"><code> rotateStart.copy( rotateEnd );
|
|
</code></td></tr><tr><td id="L483" class="css-a4x74f"><span>483</span></td><td id="LC483" class="css-1dcdqdg"><code> scope.update();
|
|
</code></td></tr><tr><td id="L484" class="css-a4x74f"><span>484</span></td><td id="LC484" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L485" class="css-a4x74f"><span>485</span></td><td id="LC485" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L486" class="css-a4x74f"><span>486</span></td><td id="LC486" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L487" class="css-a4x74f"><span>487</span></td><td id="LC487" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">handleMouseMoveDolly</span>(<span class="code-params"> event </span>) </span>{
|
|
</code></td></tr><tr><td id="L488" class="css-a4x74f"><span>488</span></td><td id="LC488" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L489" class="css-a4x74f"><span>489</span></td><td id="LC489" class="css-1dcdqdg"><code> dollyEnd.set( event.clientX, event.clientY );
|
|
</code></td></tr><tr><td id="L490" class="css-a4x74f"><span>490</span></td><td id="LC490" class="css-1dcdqdg"><code> dollyDelta.subVectors( dollyEnd, dollyStart );
|
|
</code></td></tr><tr><td id="L491" class="css-a4x74f"><span>491</span></td><td id="LC491" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L492" class="css-a4x74f"><span>492</span></td><td id="LC492" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( dollyDelta.y > <span class="code-number">0</span> ) {
|
|
</code></td></tr><tr><td id="L493" class="css-a4x74f"><span>493</span></td><td id="LC493" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L494" class="css-a4x74f"><span>494</span></td><td id="LC494" class="css-1dcdqdg"><code> dollyOut( getZoomScale() );
|
|
</code></td></tr><tr><td id="L495" class="css-a4x74f"><span>495</span></td><td id="LC495" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L496" class="css-a4x74f"><span>496</span></td><td id="LC496" class="css-1dcdqdg"><code> } <span class="code-keyword">else</span> <span class="code-keyword">if</span> ( dollyDelta.y < <span class="code-number">0</span> ) {
|
|
</code></td></tr><tr><td id="L497" class="css-a4x74f"><span>497</span></td><td id="LC497" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L498" class="css-a4x74f"><span>498</span></td><td id="LC498" class="css-1dcdqdg"><code> dollyIn( getZoomScale() );
|
|
</code></td></tr><tr><td id="L499" class="css-a4x74f"><span>499</span></td><td id="LC499" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L500" class="css-a4x74f"><span>500</span></td><td id="LC500" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L501" class="css-a4x74f"><span>501</span></td><td id="LC501" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L502" class="css-a4x74f"><span>502</span></td><td id="LC502" class="css-1dcdqdg"><code> dollyStart.copy( dollyEnd );
|
|
</code></td></tr><tr><td id="L503" class="css-a4x74f"><span>503</span></td><td id="LC503" class="css-1dcdqdg"><code> scope.update();
|
|
</code></td></tr><tr><td id="L504" class="css-a4x74f"><span>504</span></td><td id="LC504" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L505" class="css-a4x74f"><span>505</span></td><td id="LC505" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L506" class="css-a4x74f"><span>506</span></td><td id="LC506" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L507" class="css-a4x74f"><span>507</span></td><td id="LC507" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">handleMouseMovePan</span>(<span class="code-params"> event </span>) </span>{
|
|
</code></td></tr><tr><td id="L508" class="css-a4x74f"><span>508</span></td><td id="LC508" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L509" class="css-a4x74f"><span>509</span></td><td id="LC509" class="css-1dcdqdg"><code> panEnd.set( event.clientX, event.clientY );
|
|
</code></td></tr><tr><td id="L510" class="css-a4x74f"><span>510</span></td><td id="LC510" class="css-1dcdqdg"><code> panDelta.subVectors( panEnd, panStart ).multiplyScalar( scope.panSpeed );
|
|
</code></td></tr><tr><td id="L511" class="css-a4x74f"><span>511</span></td><td id="LC511" class="css-1dcdqdg"><code> pan( panDelta.x, panDelta.y );
|
|
</code></td></tr><tr><td id="L512" class="css-a4x74f"><span>512</span></td><td id="LC512" class="css-1dcdqdg"><code> panStart.copy( panEnd );
|
|
</code></td></tr><tr><td id="L513" class="css-a4x74f"><span>513</span></td><td id="LC513" class="css-1dcdqdg"><code> scope.update();
|
|
</code></td></tr><tr><td id="L514" class="css-a4x74f"><span>514</span></td><td id="LC514" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L515" class="css-a4x74f"><span>515</span></td><td id="LC515" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L516" class="css-a4x74f"><span>516</span></td><td id="LC516" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L517" class="css-a4x74f"><span>517</span></td><td id="LC517" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">handleMouseUp</span>(<span class="code-params"></span>) </span>{ <span class="code-comment">// no-op</span>
|
|
</code></td></tr><tr><td id="L518" class="css-a4x74f"><span>518</span></td><td id="LC518" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L519" class="css-a4x74f"><span>519</span></td><td id="LC519" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L520" class="css-a4x74f"><span>520</span></td><td id="LC520" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">handleMouseWheel</span>(<span class="code-params"> event </span>) </span>{
|
|
</code></td></tr><tr><td id="L521" class="css-a4x74f"><span>521</span></td><td id="LC521" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L522" class="css-a4x74f"><span>522</span></td><td id="LC522" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( event.deltaY < <span class="code-number">0</span> ) {
|
|
</code></td></tr><tr><td id="L523" class="css-a4x74f"><span>523</span></td><td id="LC523" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L524" class="css-a4x74f"><span>524</span></td><td id="LC524" class="css-1dcdqdg"><code> dollyIn( getZoomScale() );
|
|
</code></td></tr><tr><td id="L525" class="css-a4x74f"><span>525</span></td><td id="LC525" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L526" class="css-a4x74f"><span>526</span></td><td id="LC526" class="css-1dcdqdg"><code> } <span class="code-keyword">else</span> <span class="code-keyword">if</span> ( event.deltaY > <span class="code-number">0</span> ) {
|
|
</code></td></tr><tr><td id="L527" class="css-a4x74f"><span>527</span></td><td id="LC527" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L528" class="css-a4x74f"><span>528</span></td><td id="LC528" class="css-1dcdqdg"><code> dollyOut( getZoomScale() );
|
|
</code></td></tr><tr><td id="L529" class="css-a4x74f"><span>529</span></td><td id="LC529" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L530" class="css-a4x74f"><span>530</span></td><td id="LC530" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L531" class="css-a4x74f"><span>531</span></td><td id="LC531" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L532" class="css-a4x74f"><span>532</span></td><td id="LC532" class="css-1dcdqdg"><code> scope.update();
|
|
</code></td></tr><tr><td id="L533" class="css-a4x74f"><span>533</span></td><td id="LC533" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L534" class="css-a4x74f"><span>534</span></td><td id="LC534" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L535" class="css-a4x74f"><span>535</span></td><td id="LC535" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L536" class="css-a4x74f"><span>536</span></td><td id="LC536" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">handleKeyDown</span>(<span class="code-params"> event </span>) </span>{
|
|
</code></td></tr><tr><td id="L537" class="css-a4x74f"><span>537</span></td><td id="LC537" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L538" class="css-a4x74f"><span>538</span></td><td id="LC538" class="css-1dcdqdg"><code> <span class="code-keyword">let</span> needsUpdate = <span class="code-literal">false</span>;
|
|
</code></td></tr><tr><td id="L539" class="css-a4x74f"><span>539</span></td><td id="LC539" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L540" class="css-a4x74f"><span>540</span></td><td id="LC540" class="css-1dcdqdg"><code> <span class="code-keyword">switch</span> ( event.code ) {
|
|
</code></td></tr><tr><td id="L541" class="css-a4x74f"><span>541</span></td><td id="LC541" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L542" class="css-a4x74f"><span>542</span></td><td id="LC542" class="css-1dcdqdg"><code> <span class="code-keyword">case</span> scope.keys.UP:
|
|
</code></td></tr><tr><td id="L543" class="css-a4x74f"><span>543</span></td><td id="LC543" class="css-1dcdqdg"><code> pan( <span class="code-number">0</span>, scope.keyPanSpeed );
|
|
</code></td></tr><tr><td id="L544" class="css-a4x74f"><span>544</span></td><td id="LC544" class="css-1dcdqdg"><code> needsUpdate = <span class="code-literal">true</span>;
|
|
</code></td></tr><tr><td id="L545" class="css-a4x74f"><span>545</span></td><td id="LC545" class="css-1dcdqdg"><code> <span class="code-keyword">break</span>;
|
|
</code></td></tr><tr><td id="L546" class="css-a4x74f"><span>546</span></td><td id="LC546" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L547" class="css-a4x74f"><span>547</span></td><td id="LC547" class="css-1dcdqdg"><code> <span class="code-keyword">case</span> scope.keys.BOTTOM:
|
|
</code></td></tr><tr><td id="L548" class="css-a4x74f"><span>548</span></td><td id="LC548" class="css-1dcdqdg"><code> pan( <span class="code-number">0</span>, - scope.keyPanSpeed );
|
|
</code></td></tr><tr><td id="L549" class="css-a4x74f"><span>549</span></td><td id="LC549" class="css-1dcdqdg"><code> needsUpdate = <span class="code-literal">true</span>;
|
|
</code></td></tr><tr><td id="L550" class="css-a4x74f"><span>550</span></td><td id="LC550" class="css-1dcdqdg"><code> <span class="code-keyword">break</span>;
|
|
</code></td></tr><tr><td id="L551" class="css-a4x74f"><span>551</span></td><td id="LC551" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L552" class="css-a4x74f"><span>552</span></td><td id="LC552" class="css-1dcdqdg"><code> <span class="code-keyword">case</span> scope.keys.LEFT:
|
|
</code></td></tr><tr><td id="L553" class="css-a4x74f"><span>553</span></td><td id="LC553" class="css-1dcdqdg"><code> pan( scope.keyPanSpeed, <span class="code-number">0</span> );
|
|
</code></td></tr><tr><td id="L554" class="css-a4x74f"><span>554</span></td><td id="LC554" class="css-1dcdqdg"><code> needsUpdate = <span class="code-literal">true</span>;
|
|
</code></td></tr><tr><td id="L555" class="css-a4x74f"><span>555</span></td><td id="LC555" class="css-1dcdqdg"><code> <span class="code-keyword">break</span>;
|
|
</code></td></tr><tr><td id="L556" class="css-a4x74f"><span>556</span></td><td id="LC556" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L557" class="css-a4x74f"><span>557</span></td><td id="LC557" class="css-1dcdqdg"><code> <span class="code-keyword">case</span> scope.keys.RIGHT:
|
|
</code></td></tr><tr><td id="L558" class="css-a4x74f"><span>558</span></td><td id="LC558" class="css-1dcdqdg"><code> pan( - scope.keyPanSpeed, <span class="code-number">0</span> );
|
|
</code></td></tr><tr><td id="L559" class="css-a4x74f"><span>559</span></td><td id="LC559" class="css-1dcdqdg"><code> needsUpdate = <span class="code-literal">true</span>;
|
|
</code></td></tr><tr><td id="L560" class="css-a4x74f"><span>560</span></td><td id="LC560" class="css-1dcdqdg"><code> <span class="code-keyword">break</span>;
|
|
</code></td></tr><tr><td id="L561" class="css-a4x74f"><span>561</span></td><td id="LC561" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L562" class="css-a4x74f"><span>562</span></td><td id="LC562" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L563" class="css-a4x74f"><span>563</span></td><td id="LC563" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L564" class="css-a4x74f"><span>564</span></td><td id="LC564" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( needsUpdate ) {
|
|
</code></td></tr><tr><td id="L565" class="css-a4x74f"><span>565</span></td><td id="LC565" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L566" class="css-a4x74f"><span>566</span></td><td id="LC566" class="css-1dcdqdg"><code> <span class="code-comment">// prevent the browser from scrolling on cursor keys</span>
|
|
</code></td></tr><tr><td id="L567" class="css-a4x74f"><span>567</span></td><td id="LC567" class="css-1dcdqdg"><code> event.preventDefault();
|
|
</code></td></tr><tr><td id="L568" class="css-a4x74f"><span>568</span></td><td id="LC568" class="css-1dcdqdg"><code> scope.update();
|
|
</code></td></tr><tr><td id="L569" class="css-a4x74f"><span>569</span></td><td id="LC569" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L570" class="css-a4x74f"><span>570</span></td><td id="LC570" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L571" class="css-a4x74f"><span>571</span></td><td id="LC571" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L572" class="css-a4x74f"><span>572</span></td><td id="LC572" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L573" class="css-a4x74f"><span>573</span></td><td id="LC573" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L574" class="css-a4x74f"><span>574</span></td><td id="LC574" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">handleTouchStartRotate</span>(<span class="code-params"></span>) </span>{
|
|
</code></td></tr><tr><td id="L575" class="css-a4x74f"><span>575</span></td><td id="LC575" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L576" class="css-a4x74f"><span>576</span></td><td id="LC576" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( pointers.length === <span class="code-number">1</span> ) {
|
|
</code></td></tr><tr><td id="L577" class="css-a4x74f"><span>577</span></td><td id="LC577" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L578" class="css-a4x74f"><span>578</span></td><td id="LC578" class="css-1dcdqdg"><code> rotateStart.set( pointers[ <span class="code-number">0</span> ].pageX, pointers[ <span class="code-number">0</span> ].pageY );
|
|
</code></td></tr><tr><td id="L579" class="css-a4x74f"><span>579</span></td><td id="LC579" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L580" class="css-a4x74f"><span>580</span></td><td id="LC580" class="css-1dcdqdg"><code> } <span class="code-keyword">else</span> {
|
|
</code></td></tr><tr><td id="L581" class="css-a4x74f"><span>581</span></td><td id="LC581" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L582" class="css-a4x74f"><span>582</span></td><td id="LC582" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> x = <span class="code-number">0.5</span> * ( pointers[ <span class="code-number">0</span> ].pageX + pointers[ <span class="code-number">1</span> ].pageX );
|
|
</code></td></tr><tr><td id="L583" class="css-a4x74f"><span>583</span></td><td id="LC583" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> y = <span class="code-number">0.5</span> * ( pointers[ <span class="code-number">0</span> ].pageY + pointers[ <span class="code-number">1</span> ].pageY );
|
|
</code></td></tr><tr><td id="L584" class="css-a4x74f"><span>584</span></td><td id="LC584" class="css-1dcdqdg"><code> rotateStart.set( x, y );
|
|
</code></td></tr><tr><td id="L585" class="css-a4x74f"><span>585</span></td><td id="LC585" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L586" class="css-a4x74f"><span>586</span></td><td id="LC586" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L587" class="css-a4x74f"><span>587</span></td><td id="LC587" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L588" class="css-a4x74f"><span>588</span></td><td id="LC588" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L589" class="css-a4x74f"><span>589</span></td><td id="LC589" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L590" class="css-a4x74f"><span>590</span></td><td id="LC590" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">handleTouchStartPan</span>(<span class="code-params"></span>) </span>{
|
|
</code></td></tr><tr><td id="L591" class="css-a4x74f"><span>591</span></td><td id="LC591" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L592" class="css-a4x74f"><span>592</span></td><td id="LC592" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( pointers.length === <span class="code-number">1</span> ) {
|
|
</code></td></tr><tr><td id="L593" class="css-a4x74f"><span>593</span></td><td id="LC593" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L594" class="css-a4x74f"><span>594</span></td><td id="LC594" class="css-1dcdqdg"><code> panStart.set( pointers[ <span class="code-number">0</span> ].pageX, pointers[ <span class="code-number">0</span> ].pageY );
|
|
</code></td></tr><tr><td id="L595" class="css-a4x74f"><span>595</span></td><td id="LC595" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L596" class="css-a4x74f"><span>596</span></td><td id="LC596" class="css-1dcdqdg"><code> } <span class="code-keyword">else</span> {
|
|
</code></td></tr><tr><td id="L597" class="css-a4x74f"><span>597</span></td><td id="LC597" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L598" class="css-a4x74f"><span>598</span></td><td id="LC598" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> x = <span class="code-number">0.5</span> * ( pointers[ <span class="code-number">0</span> ].pageX + pointers[ <span class="code-number">1</span> ].pageX );
|
|
</code></td></tr><tr><td id="L599" class="css-a4x74f"><span>599</span></td><td id="LC599" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> y = <span class="code-number">0.5</span> * ( pointers[ <span class="code-number">0</span> ].pageY + pointers[ <span class="code-number">1</span> ].pageY );
|
|
</code></td></tr><tr><td id="L600" class="css-a4x74f"><span>600</span></td><td id="LC600" class="css-1dcdqdg"><code> panStart.set( x, y );
|
|
</code></td></tr><tr><td id="L601" class="css-a4x74f"><span>601</span></td><td id="LC601" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L602" class="css-a4x74f"><span>602</span></td><td id="LC602" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L603" class="css-a4x74f"><span>603</span></td><td id="LC603" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L604" class="css-a4x74f"><span>604</span></td><td id="LC604" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L605" class="css-a4x74f"><span>605</span></td><td id="LC605" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L606" class="css-a4x74f"><span>606</span></td><td id="LC606" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">handleTouchStartDolly</span>(<span class="code-params"></span>) </span>{
|
|
</code></td></tr><tr><td id="L607" class="css-a4x74f"><span>607</span></td><td id="LC607" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L608" class="css-a4x74f"><span>608</span></td><td id="LC608" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> dx = pointers[ <span class="code-number">0</span> ].pageX - pointers[ <span class="code-number">1</span> ].pageX;
|
|
</code></td></tr><tr><td id="L609" class="css-a4x74f"><span>609</span></td><td id="LC609" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> dy = pointers[ <span class="code-number">0</span> ].pageY - pointers[ <span class="code-number">1</span> ].pageY;
|
|
</code></td></tr><tr><td id="L610" class="css-a4x74f"><span>610</span></td><td id="LC610" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> distance = <span class="code-built_in">Math</span>.sqrt( dx * dx + dy * dy );
|
|
</code></td></tr><tr><td id="L611" class="css-a4x74f"><span>611</span></td><td id="LC611" class="css-1dcdqdg"><code> dollyStart.set( <span class="code-number">0</span>, distance );
|
|
</code></td></tr><tr><td id="L612" class="css-a4x74f"><span>612</span></td><td id="LC612" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L613" class="css-a4x74f"><span>613</span></td><td id="LC613" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L614" class="css-a4x74f"><span>614</span></td><td id="LC614" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L615" class="css-a4x74f"><span>615</span></td><td id="LC615" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">handleTouchStartDollyPan</span>(<span class="code-params"></span>) </span>{
|
|
</code></td></tr><tr><td id="L616" class="css-a4x74f"><span>616</span></td><td id="LC616" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L617" class="css-a4x74f"><span>617</span></td><td id="LC617" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.enableZoom ) handleTouchStartDolly();
|
|
</code></td></tr><tr><td id="L618" class="css-a4x74f"><span>618</span></td><td id="LC618" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.enablePan ) handleTouchStartPan();
|
|
</code></td></tr><tr><td id="L619" class="css-a4x74f"><span>619</span></td><td id="LC619" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L620" class="css-a4x74f"><span>620</span></td><td id="LC620" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L621" class="css-a4x74f"><span>621</span></td><td id="LC621" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L622" class="css-a4x74f"><span>622</span></td><td id="LC622" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">handleTouchStartDollyRotate</span>(<span class="code-params"></span>) </span>{
|
|
</code></td></tr><tr><td id="L623" class="css-a4x74f"><span>623</span></td><td id="LC623" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L624" class="css-a4x74f"><span>624</span></td><td id="LC624" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.enableZoom ) handleTouchStartDolly();
|
|
</code></td></tr><tr><td id="L625" class="css-a4x74f"><span>625</span></td><td id="LC625" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.enableRotate ) handleTouchStartRotate();
|
|
</code></td></tr><tr><td id="L626" class="css-a4x74f"><span>626</span></td><td id="LC626" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L627" class="css-a4x74f"><span>627</span></td><td id="LC627" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L628" class="css-a4x74f"><span>628</span></td><td id="LC628" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L629" class="css-a4x74f"><span>629</span></td><td id="LC629" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">handleTouchMoveRotate</span>(<span class="code-params"> event </span>) </span>{
|
|
</code></td></tr><tr><td id="L630" class="css-a4x74f"><span>630</span></td><td id="LC630" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L631" class="css-a4x74f"><span>631</span></td><td id="LC631" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( pointers.length == <span class="code-number">1</span> ) {
|
|
</code></td></tr><tr><td id="L632" class="css-a4x74f"><span>632</span></td><td id="LC632" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L633" class="css-a4x74f"><span>633</span></td><td id="LC633" class="css-1dcdqdg"><code> rotateEnd.set( event.pageX, event.pageY );
|
|
</code></td></tr><tr><td id="L634" class="css-a4x74f"><span>634</span></td><td id="LC634" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L635" class="css-a4x74f"><span>635</span></td><td id="LC635" class="css-1dcdqdg"><code> } <span class="code-keyword">else</span> {
|
|
</code></td></tr><tr><td id="L636" class="css-a4x74f"><span>636</span></td><td id="LC636" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L637" class="css-a4x74f"><span>637</span></td><td id="LC637" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> position = getSecondPointerPosition( event );
|
|
</code></td></tr><tr><td id="L638" class="css-a4x74f"><span>638</span></td><td id="LC638" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> x = <span class="code-number">0.5</span> * ( event.pageX + position.x );
|
|
</code></td></tr><tr><td id="L639" class="css-a4x74f"><span>639</span></td><td id="LC639" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> y = <span class="code-number">0.5</span> * ( event.pageY + position.y );
|
|
</code></td></tr><tr><td id="L640" class="css-a4x74f"><span>640</span></td><td id="LC640" class="css-1dcdqdg"><code> rotateEnd.set( x, y );
|
|
</code></td></tr><tr><td id="L641" class="css-a4x74f"><span>641</span></td><td id="LC641" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L642" class="css-a4x74f"><span>642</span></td><td id="LC642" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L643" class="css-a4x74f"><span>643</span></td><td id="LC643" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L644" class="css-a4x74f"><span>644</span></td><td id="LC644" class="css-1dcdqdg"><code> rotateDelta.subVectors( rotateEnd, rotateStart ).multiplyScalar( scope.rotateSpeed );
|
|
</code></td></tr><tr><td id="L645" class="css-a4x74f"><span>645</span></td><td id="LC645" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> element = scope.domElement;
|
|
</code></td></tr><tr><td id="L646" class="css-a4x74f"><span>646</span></td><td id="LC646" class="css-1dcdqdg"><code> rotateLeft( <span class="code-number">2</span> * <span class="code-built_in">Math</span>.PI * rotateDelta.x / element.clientHeight ); <span class="code-comment">// yes, height</span>
|
|
</code></td></tr><tr><td id="L647" class="css-a4x74f"><span>647</span></td><td id="LC647" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L648" class="css-a4x74f"><span>648</span></td><td id="LC648" class="css-1dcdqdg"><code> rotateUp( <span class="code-number">2</span> * <span class="code-built_in">Math</span>.PI * rotateDelta.y / element.clientHeight );
|
|
</code></td></tr><tr><td id="L649" class="css-a4x74f"><span>649</span></td><td id="LC649" class="css-1dcdqdg"><code> rotateStart.copy( rotateEnd );
|
|
</code></td></tr><tr><td id="L650" class="css-a4x74f"><span>650</span></td><td id="LC650" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L651" class="css-a4x74f"><span>651</span></td><td id="LC651" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L652" class="css-a4x74f"><span>652</span></td><td id="LC652" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L653" class="css-a4x74f"><span>653</span></td><td id="LC653" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">handleTouchMovePan</span>(<span class="code-params"> event </span>) </span>{
|
|
</code></td></tr><tr><td id="L654" class="css-a4x74f"><span>654</span></td><td id="LC654" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L655" class="css-a4x74f"><span>655</span></td><td id="LC655" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( pointers.length === <span class="code-number">1</span> ) {
|
|
</code></td></tr><tr><td id="L656" class="css-a4x74f"><span>656</span></td><td id="LC656" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L657" class="css-a4x74f"><span>657</span></td><td id="LC657" class="css-1dcdqdg"><code> panEnd.set( event.pageX, event.pageY );
|
|
</code></td></tr><tr><td id="L658" class="css-a4x74f"><span>658</span></td><td id="LC658" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L659" class="css-a4x74f"><span>659</span></td><td id="LC659" class="css-1dcdqdg"><code> } <span class="code-keyword">else</span> {
|
|
</code></td></tr><tr><td id="L660" class="css-a4x74f"><span>660</span></td><td id="LC660" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L661" class="css-a4x74f"><span>661</span></td><td id="LC661" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> position = getSecondPointerPosition( event );
|
|
</code></td></tr><tr><td id="L662" class="css-a4x74f"><span>662</span></td><td id="LC662" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> x = <span class="code-number">0.5</span> * ( event.pageX + position.x );
|
|
</code></td></tr><tr><td id="L663" class="css-a4x74f"><span>663</span></td><td id="LC663" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> y = <span class="code-number">0.5</span> * ( event.pageY + position.y );
|
|
</code></td></tr><tr><td id="L664" class="css-a4x74f"><span>664</span></td><td id="LC664" class="css-1dcdqdg"><code> panEnd.set( x, y );
|
|
</code></td></tr><tr><td id="L665" class="css-a4x74f"><span>665</span></td><td id="LC665" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L666" class="css-a4x74f"><span>666</span></td><td id="LC666" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L667" class="css-a4x74f"><span>667</span></td><td id="LC667" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L668" class="css-a4x74f"><span>668</span></td><td id="LC668" class="css-1dcdqdg"><code> panDelta.subVectors( panEnd, panStart ).multiplyScalar( scope.panSpeed );
|
|
</code></td></tr><tr><td id="L669" class="css-a4x74f"><span>669</span></td><td id="LC669" class="css-1dcdqdg"><code> pan( panDelta.x, panDelta.y );
|
|
</code></td></tr><tr><td id="L670" class="css-a4x74f"><span>670</span></td><td id="LC670" class="css-1dcdqdg"><code> panStart.copy( panEnd );
|
|
</code></td></tr><tr><td id="L671" class="css-a4x74f"><span>671</span></td><td id="LC671" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L672" class="css-a4x74f"><span>672</span></td><td id="LC672" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L673" class="css-a4x74f"><span>673</span></td><td id="LC673" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L674" class="css-a4x74f"><span>674</span></td><td id="LC674" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">handleTouchMoveDolly</span>(<span class="code-params"> event </span>) </span>{
|
|
</code></td></tr><tr><td id="L675" class="css-a4x74f"><span>675</span></td><td id="LC675" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L676" class="css-a4x74f"><span>676</span></td><td id="LC676" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> position = getSecondPointerPosition( event );
|
|
</code></td></tr><tr><td id="L677" class="css-a4x74f"><span>677</span></td><td id="LC677" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> dx = event.pageX - position.x;
|
|
</code></td></tr><tr><td id="L678" class="css-a4x74f"><span>678</span></td><td id="LC678" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> dy = event.pageY - position.y;
|
|
</code></td></tr><tr><td id="L679" class="css-a4x74f"><span>679</span></td><td id="LC679" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> distance = <span class="code-built_in">Math</span>.sqrt( dx * dx + dy * dy );
|
|
</code></td></tr><tr><td id="L680" class="css-a4x74f"><span>680</span></td><td id="LC680" class="css-1dcdqdg"><code> dollyEnd.set( <span class="code-number">0</span>, distance );
|
|
</code></td></tr><tr><td id="L681" class="css-a4x74f"><span>681</span></td><td id="LC681" class="css-1dcdqdg"><code> dollyDelta.set( <span class="code-number">0</span>, <span class="code-built_in">Math</span>.pow( dollyEnd.y / dollyStart.y, scope.zoomSpeed ) );
|
|
</code></td></tr><tr><td id="L682" class="css-a4x74f"><span>682</span></td><td id="LC682" class="css-1dcdqdg"><code> dollyOut( dollyDelta.y );
|
|
</code></td></tr><tr><td id="L683" class="css-a4x74f"><span>683</span></td><td id="LC683" class="css-1dcdqdg"><code> dollyStart.copy( dollyEnd );
|
|
</code></td></tr><tr><td id="L684" class="css-a4x74f"><span>684</span></td><td id="LC684" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L685" class="css-a4x74f"><span>685</span></td><td id="LC685" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L686" class="css-a4x74f"><span>686</span></td><td id="LC686" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L687" class="css-a4x74f"><span>687</span></td><td id="LC687" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">handleTouchMoveDollyPan</span>(<span class="code-params"> event </span>) </span>{
|
|
</code></td></tr><tr><td id="L688" class="css-a4x74f"><span>688</span></td><td id="LC688" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L689" class="css-a4x74f"><span>689</span></td><td id="LC689" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.enableZoom ) handleTouchMoveDolly( event );
|
|
</code></td></tr><tr><td id="L690" class="css-a4x74f"><span>690</span></td><td id="LC690" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.enablePan ) handleTouchMovePan( event );
|
|
</code></td></tr><tr><td id="L691" class="css-a4x74f"><span>691</span></td><td id="LC691" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L692" class="css-a4x74f"><span>692</span></td><td id="LC692" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L693" class="css-a4x74f"><span>693</span></td><td id="LC693" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L694" class="css-a4x74f"><span>694</span></td><td id="LC694" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">handleTouchMoveDollyRotate</span>(<span class="code-params"> event </span>) </span>{
|
|
</code></td></tr><tr><td id="L695" class="css-a4x74f"><span>695</span></td><td id="LC695" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L696" class="css-a4x74f"><span>696</span></td><td id="LC696" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.enableZoom ) handleTouchMoveDolly( event );
|
|
</code></td></tr><tr><td id="L697" class="css-a4x74f"><span>697</span></td><td id="LC697" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.enableRotate ) handleTouchMoveRotate( event );
|
|
</code></td></tr><tr><td id="L698" class="css-a4x74f"><span>698</span></td><td id="LC698" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L699" class="css-a4x74f"><span>699</span></td><td id="LC699" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L700" class="css-a4x74f"><span>700</span></td><td id="LC700" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L701" class="css-a4x74f"><span>701</span></td><td id="LC701" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">handleTouchEnd</span>(<span class="code-params"></span>) </span>{ <span class="code-comment">// no-op</span>
|
|
</code></td></tr><tr><td id="L702" class="css-a4x74f"><span>702</span></td><td id="LC702" class="css-1dcdqdg"><code> } <span class="code-comment">//</span>
|
|
</code></td></tr><tr><td id="L703" class="css-a4x74f"><span>703</span></td><td id="LC703" class="css-1dcdqdg"><code> <span class="code-comment">// event handlers - FSM: listen for events and reset state</span>
|
|
</code></td></tr><tr><td id="L704" class="css-a4x74f"><span>704</span></td><td id="LC704" class="css-1dcdqdg"><code> <span class="code-comment">//</span>
|
|
</code></td></tr><tr><td id="L705" class="css-a4x74f"><span>705</span></td><td id="LC705" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L706" class="css-a4x74f"><span>706</span></td><td id="LC706" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L707" class="css-a4x74f"><span>707</span></td><td id="LC707" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">onPointerDown</span>(<span class="code-params"> event </span>) </span>{
|
|
</code></td></tr><tr><td id="L708" class="css-a4x74f"><span>708</span></td><td id="LC708" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L709" class="css-a4x74f"><span>709</span></td><td id="LC709" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.enabled === <span class="code-literal">false</span> ) <span class="code-keyword">return</span>;
|
|
</code></td></tr><tr><td id="L710" class="css-a4x74f"><span>710</span></td><td id="LC710" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L711" class="css-a4x74f"><span>711</span></td><td id="LC711" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( pointers.length === <span class="code-number">0</span> ) {
|
|
</code></td></tr><tr><td id="L712" class="css-a4x74f"><span>712</span></td><td id="LC712" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L713" class="css-a4x74f"><span>713</span></td><td id="LC713" class="css-1dcdqdg"><code> scope.domElement.setPointerCapture( event.pointerId );
|
|
</code></td></tr><tr><td id="L714" class="css-a4x74f"><span>714</span></td><td id="LC714" class="css-1dcdqdg"><code> scope.domElement.addEventListener( <span class="code-string">'pointermove'</span>, onPointerMove );
|
|
</code></td></tr><tr><td id="L715" class="css-a4x74f"><span>715</span></td><td id="LC715" class="css-1dcdqdg"><code> scope.domElement.addEventListener( <span class="code-string">'pointerup'</span>, onPointerUp );
|
|
</code></td></tr><tr><td id="L716" class="css-a4x74f"><span>716</span></td><td id="LC716" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L717" class="css-a4x74f"><span>717</span></td><td id="LC717" class="css-1dcdqdg"><code> } <span class="code-comment">//</span>
|
|
</code></td></tr><tr><td id="L718" class="css-a4x74f"><span>718</span></td><td id="LC718" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L719" class="css-a4x74f"><span>719</span></td><td id="LC719" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L720" class="css-a4x74f"><span>720</span></td><td id="LC720" class="css-1dcdqdg"><code> addPointer( event );
|
|
</code></td></tr><tr><td id="L721" class="css-a4x74f"><span>721</span></td><td id="LC721" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L722" class="css-a4x74f"><span>722</span></td><td id="LC722" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( event.pointerType === <span class="code-string">'touch'</span> ) {
|
|
</code></td></tr><tr><td id="L723" class="css-a4x74f"><span>723</span></td><td id="LC723" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L724" class="css-a4x74f"><span>724</span></td><td id="LC724" class="css-1dcdqdg"><code> onTouchStart( event );
|
|
</code></td></tr><tr><td id="L725" class="css-a4x74f"><span>725</span></td><td id="LC725" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L726" class="css-a4x74f"><span>726</span></td><td id="LC726" class="css-1dcdqdg"><code> } <span class="code-keyword">else</span> {
|
|
</code></td></tr><tr><td id="L727" class="css-a4x74f"><span>727</span></td><td id="LC727" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L728" class="css-a4x74f"><span>728</span></td><td id="LC728" class="css-1dcdqdg"><code> onMouseDown( event );
|
|
</code></td></tr><tr><td id="L729" class="css-a4x74f"><span>729</span></td><td id="LC729" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L730" class="css-a4x74f"><span>730</span></td><td id="LC730" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L731" class="css-a4x74f"><span>731</span></td><td id="LC731" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L732" class="css-a4x74f"><span>732</span></td><td id="LC732" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L733" class="css-a4x74f"><span>733</span></td><td id="LC733" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L734" class="css-a4x74f"><span>734</span></td><td id="LC734" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">onPointerMove</span>(<span class="code-params"> event </span>) </span>{
|
|
</code></td></tr><tr><td id="L735" class="css-a4x74f"><span>735</span></td><td id="LC735" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L736" class="css-a4x74f"><span>736</span></td><td id="LC736" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.enabled === <span class="code-literal">false</span> ) <span class="code-keyword">return</span>;
|
|
</code></td></tr><tr><td id="L737" class="css-a4x74f"><span>737</span></td><td id="LC737" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L738" class="css-a4x74f"><span>738</span></td><td id="LC738" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( event.pointerType === <span class="code-string">'touch'</span> ) {
|
|
</code></td></tr><tr><td id="L739" class="css-a4x74f"><span>739</span></td><td id="LC739" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L740" class="css-a4x74f"><span>740</span></td><td id="LC740" class="css-1dcdqdg"><code> onTouchMove( event );
|
|
</code></td></tr><tr><td id="L741" class="css-a4x74f"><span>741</span></td><td id="LC741" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L742" class="css-a4x74f"><span>742</span></td><td id="LC742" class="css-1dcdqdg"><code> } <span class="code-keyword">else</span> {
|
|
</code></td></tr><tr><td id="L743" class="css-a4x74f"><span>743</span></td><td id="LC743" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L744" class="css-a4x74f"><span>744</span></td><td id="LC744" class="css-1dcdqdg"><code> onMouseMove( event );
|
|
</code></td></tr><tr><td id="L745" class="css-a4x74f"><span>745</span></td><td id="LC745" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L746" class="css-a4x74f"><span>746</span></td><td id="LC746" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L747" class="css-a4x74f"><span>747</span></td><td id="LC747" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L748" class="css-a4x74f"><span>748</span></td><td id="LC748" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L749" class="css-a4x74f"><span>749</span></td><td id="LC749" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L750" class="css-a4x74f"><span>750</span></td><td id="LC750" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">onPointerUp</span>(<span class="code-params"> event </span>) </span>{
|
|
</code></td></tr><tr><td id="L751" class="css-a4x74f"><span>751</span></td><td id="LC751" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L752" class="css-a4x74f"><span>752</span></td><td id="LC752" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.enabled === <span class="code-literal">false</span> ) <span class="code-keyword">return</span>;
|
|
</code></td></tr><tr><td id="L753" class="css-a4x74f"><span>753</span></td><td id="LC753" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L754" class="css-a4x74f"><span>754</span></td><td id="LC754" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( event.pointerType === <span class="code-string">'touch'</span> ) {
|
|
</code></td></tr><tr><td id="L755" class="css-a4x74f"><span>755</span></td><td id="LC755" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L756" class="css-a4x74f"><span>756</span></td><td id="LC756" class="css-1dcdqdg"><code> onTouchEnd();
|
|
</code></td></tr><tr><td id="L757" class="css-a4x74f"><span>757</span></td><td id="LC757" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L758" class="css-a4x74f"><span>758</span></td><td id="LC758" class="css-1dcdqdg"><code> } <span class="code-keyword">else</span> {
|
|
</code></td></tr><tr><td id="L759" class="css-a4x74f"><span>759</span></td><td id="LC759" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L760" class="css-a4x74f"><span>760</span></td><td id="LC760" class="css-1dcdqdg"><code> onMouseUp( event );
|
|
</code></td></tr><tr><td id="L761" class="css-a4x74f"><span>761</span></td><td id="LC761" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L762" class="css-a4x74f"><span>762</span></td><td id="LC762" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L763" class="css-a4x74f"><span>763</span></td><td id="LC763" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L764" class="css-a4x74f"><span>764</span></td><td id="LC764" class="css-1dcdqdg"><code> removePointer( event ); <span class="code-comment">//</span>
|
|
</code></td></tr><tr><td id="L765" class="css-a4x74f"><span>765</span></td><td id="LC765" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L766" class="css-a4x74f"><span>766</span></td><td id="LC766" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( pointers.length === <span class="code-number">0</span> ) {
|
|
</code></td></tr><tr><td id="L767" class="css-a4x74f"><span>767</span></td><td id="LC767" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L768" class="css-a4x74f"><span>768</span></td><td id="LC768" class="css-1dcdqdg"><code> scope.domElement.releasePointerCapture( event.pointerId );
|
|
</code></td></tr><tr><td id="L769" class="css-a4x74f"><span>769</span></td><td id="LC769" class="css-1dcdqdg"><code> scope.domElement.removeEventListener( <span class="code-string">'pointermove'</span>, onPointerMove );
|
|
</code></td></tr><tr><td id="L770" class="css-a4x74f"><span>770</span></td><td id="LC770" class="css-1dcdqdg"><code> scope.domElement.removeEventListener( <span class="code-string">'pointerup'</span>, onPointerUp );
|
|
</code></td></tr><tr><td id="L771" class="css-a4x74f"><span>771</span></td><td id="LC771" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L772" class="css-a4x74f"><span>772</span></td><td id="LC772" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L773" class="css-a4x74f"><span>773</span></td><td id="LC773" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L774" class="css-a4x74f"><span>774</span></td><td id="LC774" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L775" class="css-a4x74f"><span>775</span></td><td id="LC775" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L776" class="css-a4x74f"><span>776</span></td><td id="LC776" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">onPointerCancel</span>(<span class="code-params"> event </span>) </span>{
|
|
</code></td></tr><tr><td id="L777" class="css-a4x74f"><span>777</span></td><td id="LC777" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L778" class="css-a4x74f"><span>778</span></td><td id="LC778" class="css-1dcdqdg"><code> removePointer( event );
|
|
</code></td></tr><tr><td id="L779" class="css-a4x74f"><span>779</span></td><td id="LC779" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L780" class="css-a4x74f"><span>780</span></td><td id="LC780" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L781" class="css-a4x74f"><span>781</span></td><td id="LC781" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L782" class="css-a4x74f"><span>782</span></td><td id="LC782" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">onMouseDown</span>(<span class="code-params"> event </span>) </span>{
|
|
</code></td></tr><tr><td id="L783" class="css-a4x74f"><span>783</span></td><td id="LC783" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L784" class="css-a4x74f"><span>784</span></td><td id="LC784" class="css-1dcdqdg"><code> <span class="code-keyword">let</span> mouseAction;
|
|
</code></td></tr><tr><td id="L785" class="css-a4x74f"><span>785</span></td><td id="LC785" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L786" class="css-a4x74f"><span>786</span></td><td id="LC786" class="css-1dcdqdg"><code> <span class="code-keyword">switch</span> ( event.button ) {
|
|
</code></td></tr><tr><td id="L787" class="css-a4x74f"><span>787</span></td><td id="LC787" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L788" class="css-a4x74f"><span>788</span></td><td id="LC788" class="css-1dcdqdg"><code> <span class="code-keyword">case</span> <span class="code-number">0</span>:
|
|
</code></td></tr><tr><td id="L789" class="css-a4x74f"><span>789</span></td><td id="LC789" class="css-1dcdqdg"><code> mouseAction = scope.mouseButtons.LEFT;
|
|
</code></td></tr><tr><td id="L790" class="css-a4x74f"><span>790</span></td><td id="LC790" class="css-1dcdqdg"><code> <span class="code-keyword">break</span>;
|
|
</code></td></tr><tr><td id="L791" class="css-a4x74f"><span>791</span></td><td id="LC791" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L792" class="css-a4x74f"><span>792</span></td><td id="LC792" class="css-1dcdqdg"><code> <span class="code-keyword">case</span> <span class="code-number">1</span>:
|
|
</code></td></tr><tr><td id="L793" class="css-a4x74f"><span>793</span></td><td id="LC793" class="css-1dcdqdg"><code> mouseAction = scope.mouseButtons.MIDDLE;
|
|
</code></td></tr><tr><td id="L794" class="css-a4x74f"><span>794</span></td><td id="LC794" class="css-1dcdqdg"><code> <span class="code-keyword">break</span>;
|
|
</code></td></tr><tr><td id="L795" class="css-a4x74f"><span>795</span></td><td id="LC795" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L796" class="css-a4x74f"><span>796</span></td><td id="LC796" class="css-1dcdqdg"><code> <span class="code-keyword">case</span> <span class="code-number">2</span>:
|
|
</code></td></tr><tr><td id="L797" class="css-a4x74f"><span>797</span></td><td id="LC797" class="css-1dcdqdg"><code> mouseAction = scope.mouseButtons.RIGHT;
|
|
</code></td></tr><tr><td id="L798" class="css-a4x74f"><span>798</span></td><td id="LC798" class="css-1dcdqdg"><code> <span class="code-keyword">break</span>;
|
|
</code></td></tr><tr><td id="L799" class="css-a4x74f"><span>799</span></td><td id="LC799" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L800" class="css-a4x74f"><span>800</span></td><td id="LC800" class="css-1dcdqdg"><code> <span class="code-keyword">default</span>:
|
|
</code></td></tr><tr><td id="L801" class="css-a4x74f"><span>801</span></td><td id="LC801" class="css-1dcdqdg"><code> mouseAction = - <span class="code-number">1</span>;
|
|
</code></td></tr><tr><td id="L802" class="css-a4x74f"><span>802</span></td><td id="LC802" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L803" class="css-a4x74f"><span>803</span></td><td id="LC803" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L804" class="css-a4x74f"><span>804</span></td><td id="LC804" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L805" class="css-a4x74f"><span>805</span></td><td id="LC805" class="css-1dcdqdg"><code> <span class="code-keyword">switch</span> ( mouseAction ) {
|
|
</code></td></tr><tr><td id="L806" class="css-a4x74f"><span>806</span></td><td id="LC806" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L807" class="css-a4x74f"><span>807</span></td><td id="LC807" class="css-1dcdqdg"><code> <span class="code-keyword">case</span> THREE.MOUSE.DOLLY:
|
|
</code></td></tr><tr><td id="L808" class="css-a4x74f"><span>808</span></td><td id="LC808" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.enableZoom === <span class="code-literal">false</span> ) <span class="code-keyword">return</span>;
|
|
</code></td></tr><tr><td id="L809" class="css-a4x74f"><span>809</span></td><td id="LC809" class="css-1dcdqdg"><code> handleMouseDownDolly( event );
|
|
</code></td></tr><tr><td id="L810" class="css-a4x74f"><span>810</span></td><td id="LC810" class="css-1dcdqdg"><code> state = STATE.DOLLY;
|
|
</code></td></tr><tr><td id="L811" class="css-a4x74f"><span>811</span></td><td id="LC811" class="css-1dcdqdg"><code> <span class="code-keyword">break</span>;
|
|
</code></td></tr><tr><td id="L812" class="css-a4x74f"><span>812</span></td><td id="LC812" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L813" class="css-a4x74f"><span>813</span></td><td id="LC813" class="css-1dcdqdg"><code> <span class="code-keyword">case</span> THREE.MOUSE.ROTATE:
|
|
</code></td></tr><tr><td id="L814" class="css-a4x74f"><span>814</span></td><td id="LC814" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( event.ctrlKey || event.metaKey || event.shiftKey ) {
|
|
</code></td></tr><tr><td id="L815" class="css-a4x74f"><span>815</span></td><td id="LC815" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L816" class="css-a4x74f"><span>816</span></td><td id="LC816" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.enablePan === <span class="code-literal">false</span> ) <span class="code-keyword">return</span>;
|
|
</code></td></tr><tr><td id="L817" class="css-a4x74f"><span>817</span></td><td id="LC817" class="css-1dcdqdg"><code> handleMouseDownPan( event );
|
|
</code></td></tr><tr><td id="L818" class="css-a4x74f"><span>818</span></td><td id="LC818" class="css-1dcdqdg"><code> state = STATE.PAN;
|
|
</code></td></tr><tr><td id="L819" class="css-a4x74f"><span>819</span></td><td id="LC819" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L820" class="css-a4x74f"><span>820</span></td><td id="LC820" class="css-1dcdqdg"><code> } <span class="code-keyword">else</span> {
|
|
</code></td></tr><tr><td id="L821" class="css-a4x74f"><span>821</span></td><td id="LC821" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L822" class="css-a4x74f"><span>822</span></td><td id="LC822" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.enableRotate === <span class="code-literal">false</span> ) <span class="code-keyword">return</span>;
|
|
</code></td></tr><tr><td id="L823" class="css-a4x74f"><span>823</span></td><td id="LC823" class="css-1dcdqdg"><code> handleMouseDownRotate( event );
|
|
</code></td></tr><tr><td id="L824" class="css-a4x74f"><span>824</span></td><td id="LC824" class="css-1dcdqdg"><code> state = STATE.ROTATE;
|
|
</code></td></tr><tr><td id="L825" class="css-a4x74f"><span>825</span></td><td id="LC825" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L826" class="css-a4x74f"><span>826</span></td><td id="LC826" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L827" class="css-a4x74f"><span>827</span></td><td id="LC827" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L828" class="css-a4x74f"><span>828</span></td><td id="LC828" class="css-1dcdqdg"><code> <span class="code-keyword">break</span>;
|
|
</code></td></tr><tr><td id="L829" class="css-a4x74f"><span>829</span></td><td id="LC829" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L830" class="css-a4x74f"><span>830</span></td><td id="LC830" class="css-1dcdqdg"><code> <span class="code-keyword">case</span> THREE.MOUSE.PAN:
|
|
</code></td></tr><tr><td id="L831" class="css-a4x74f"><span>831</span></td><td id="LC831" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( event.ctrlKey || event.metaKey || event.shiftKey ) {
|
|
</code></td></tr><tr><td id="L832" class="css-a4x74f"><span>832</span></td><td id="LC832" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L833" class="css-a4x74f"><span>833</span></td><td id="LC833" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.enableRotate === <span class="code-literal">false</span> ) <span class="code-keyword">return</span>;
|
|
</code></td></tr><tr><td id="L834" class="css-a4x74f"><span>834</span></td><td id="LC834" class="css-1dcdqdg"><code> handleMouseDownRotate( event );
|
|
</code></td></tr><tr><td id="L835" class="css-a4x74f"><span>835</span></td><td id="LC835" class="css-1dcdqdg"><code> state = STATE.ROTATE;
|
|
</code></td></tr><tr><td id="L836" class="css-a4x74f"><span>836</span></td><td id="LC836" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L837" class="css-a4x74f"><span>837</span></td><td id="LC837" class="css-1dcdqdg"><code> } <span class="code-keyword">else</span> {
|
|
</code></td></tr><tr><td id="L838" class="css-a4x74f"><span>838</span></td><td id="LC838" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L839" class="css-a4x74f"><span>839</span></td><td id="LC839" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.enablePan === <span class="code-literal">false</span> ) <span class="code-keyword">return</span>;
|
|
</code></td></tr><tr><td id="L840" class="css-a4x74f"><span>840</span></td><td id="LC840" class="css-1dcdqdg"><code> handleMouseDownPan( event );
|
|
</code></td></tr><tr><td id="L841" class="css-a4x74f"><span>841</span></td><td id="LC841" class="css-1dcdqdg"><code> state = STATE.PAN;
|
|
</code></td></tr><tr><td id="L842" class="css-a4x74f"><span>842</span></td><td id="LC842" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L843" class="css-a4x74f"><span>843</span></td><td id="LC843" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L844" class="css-a4x74f"><span>844</span></td><td id="LC844" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L845" class="css-a4x74f"><span>845</span></td><td id="LC845" class="css-1dcdqdg"><code> <span class="code-keyword">break</span>;
|
|
</code></td></tr><tr><td id="L846" class="css-a4x74f"><span>846</span></td><td id="LC846" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L847" class="css-a4x74f"><span>847</span></td><td id="LC847" class="css-1dcdqdg"><code> <span class="code-keyword">default</span>:
|
|
</code></td></tr><tr><td id="L848" class="css-a4x74f"><span>848</span></td><td id="LC848" class="css-1dcdqdg"><code> state = STATE.NONE;
|
|
</code></td></tr><tr><td id="L849" class="css-a4x74f"><span>849</span></td><td id="LC849" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L850" class="css-a4x74f"><span>850</span></td><td id="LC850" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L851" class="css-a4x74f"><span>851</span></td><td id="LC851" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L852" class="css-a4x74f"><span>852</span></td><td id="LC852" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( state !== STATE.NONE ) {
|
|
</code></td></tr><tr><td id="L853" class="css-a4x74f"><span>853</span></td><td id="LC853" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L854" class="css-a4x74f"><span>854</span></td><td id="LC854" class="css-1dcdqdg"><code> scope.dispatchEvent( _startEvent );
|
|
</code></td></tr><tr><td id="L855" class="css-a4x74f"><span>855</span></td><td id="LC855" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L856" class="css-a4x74f"><span>856</span></td><td id="LC856" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L857" class="css-a4x74f"><span>857</span></td><td id="LC857" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L858" class="css-a4x74f"><span>858</span></td><td id="LC858" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L859" class="css-a4x74f"><span>859</span></td><td id="LC859" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L860" class="css-a4x74f"><span>860</span></td><td id="LC860" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">onMouseMove</span>(<span class="code-params"> event </span>) </span>{
|
|
</code></td></tr><tr><td id="L861" class="css-a4x74f"><span>861</span></td><td id="LC861" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L862" class="css-a4x74f"><span>862</span></td><td id="LC862" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.enabled === <span class="code-literal">false</span> ) <span class="code-keyword">return</span>;
|
|
</code></td></tr><tr><td id="L863" class="css-a4x74f"><span>863</span></td><td id="LC863" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L864" class="css-a4x74f"><span>864</span></td><td id="LC864" class="css-1dcdqdg"><code> <span class="code-keyword">switch</span> ( state ) {
|
|
</code></td></tr><tr><td id="L865" class="css-a4x74f"><span>865</span></td><td id="LC865" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L866" class="css-a4x74f"><span>866</span></td><td id="LC866" class="css-1dcdqdg"><code> <span class="code-keyword">case</span> STATE.ROTATE:
|
|
</code></td></tr><tr><td id="L867" class="css-a4x74f"><span>867</span></td><td id="LC867" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.enableRotate === <span class="code-literal">false</span> ) <span class="code-keyword">return</span>;
|
|
</code></td></tr><tr><td id="L868" class="css-a4x74f"><span>868</span></td><td id="LC868" class="css-1dcdqdg"><code> handleMouseMoveRotate( event );
|
|
</code></td></tr><tr><td id="L869" class="css-a4x74f"><span>869</span></td><td id="LC869" class="css-1dcdqdg"><code> <span class="code-keyword">break</span>;
|
|
</code></td></tr><tr><td id="L870" class="css-a4x74f"><span>870</span></td><td id="LC870" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L871" class="css-a4x74f"><span>871</span></td><td id="LC871" class="css-1dcdqdg"><code> <span class="code-keyword">case</span> STATE.DOLLY:
|
|
</code></td></tr><tr><td id="L872" class="css-a4x74f"><span>872</span></td><td id="LC872" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.enableZoom === <span class="code-literal">false</span> ) <span class="code-keyword">return</span>;
|
|
</code></td></tr><tr><td id="L873" class="css-a4x74f"><span>873</span></td><td id="LC873" class="css-1dcdqdg"><code> handleMouseMoveDolly( event );
|
|
</code></td></tr><tr><td id="L874" class="css-a4x74f"><span>874</span></td><td id="LC874" class="css-1dcdqdg"><code> <span class="code-keyword">break</span>;
|
|
</code></td></tr><tr><td id="L875" class="css-a4x74f"><span>875</span></td><td id="LC875" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L876" class="css-a4x74f"><span>876</span></td><td id="LC876" class="css-1dcdqdg"><code> <span class="code-keyword">case</span> STATE.PAN:
|
|
</code></td></tr><tr><td id="L877" class="css-a4x74f"><span>877</span></td><td id="LC877" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.enablePan === <span class="code-literal">false</span> ) <span class="code-keyword">return</span>;
|
|
</code></td></tr><tr><td id="L878" class="css-a4x74f"><span>878</span></td><td id="LC878" class="css-1dcdqdg"><code> handleMouseMovePan( event );
|
|
</code></td></tr><tr><td id="L879" class="css-a4x74f"><span>879</span></td><td id="LC879" class="css-1dcdqdg"><code> <span class="code-keyword">break</span>;
|
|
</code></td></tr><tr><td id="L880" class="css-a4x74f"><span>880</span></td><td id="LC880" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L881" class="css-a4x74f"><span>881</span></td><td id="LC881" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L882" class="css-a4x74f"><span>882</span></td><td id="LC882" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L883" class="css-a4x74f"><span>883</span></td><td id="LC883" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L884" class="css-a4x74f"><span>884</span></td><td id="LC884" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L885" class="css-a4x74f"><span>885</span></td><td id="LC885" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">onMouseUp</span>(<span class="code-params"> event </span>) </span>{
|
|
</code></td></tr><tr><td id="L886" class="css-a4x74f"><span>886</span></td><td id="LC886" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L887" class="css-a4x74f"><span>887</span></td><td id="LC887" class="css-1dcdqdg"><code> handleMouseUp( event );
|
|
</code></td></tr><tr><td id="L888" class="css-a4x74f"><span>888</span></td><td id="LC888" class="css-1dcdqdg"><code> scope.dispatchEvent( _endEvent );
|
|
</code></td></tr><tr><td id="L889" class="css-a4x74f"><span>889</span></td><td id="LC889" class="css-1dcdqdg"><code> state = STATE.NONE;
|
|
</code></td></tr><tr><td id="L890" class="css-a4x74f"><span>890</span></td><td id="LC890" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L891" class="css-a4x74f"><span>891</span></td><td id="LC891" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L892" class="css-a4x74f"><span>892</span></td><td id="LC892" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L893" class="css-a4x74f"><span>893</span></td><td id="LC893" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">onMouseWheel</span>(<span class="code-params"> event </span>) </span>{
|
|
</code></td></tr><tr><td id="L894" class="css-a4x74f"><span>894</span></td><td id="LC894" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L895" class="css-a4x74f"><span>895</span></td><td id="LC895" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.enabled === <span class="code-literal">false</span> || scope.enableZoom === <span class="code-literal">false</span> || state !== STATE.NONE && state !== STATE.ROTATE ) <span class="code-keyword">return</span>;
|
|
</code></td></tr><tr><td id="L896" class="css-a4x74f"><span>896</span></td><td id="LC896" class="css-1dcdqdg"><code> event.preventDefault();
|
|
</code></td></tr><tr><td id="L897" class="css-a4x74f"><span>897</span></td><td id="LC897" class="css-1dcdqdg"><code> scope.dispatchEvent( _startEvent );
|
|
</code></td></tr><tr><td id="L898" class="css-a4x74f"><span>898</span></td><td id="LC898" class="css-1dcdqdg"><code> handleMouseWheel( event );
|
|
</code></td></tr><tr><td id="L899" class="css-a4x74f"><span>899</span></td><td id="LC899" class="css-1dcdqdg"><code> scope.dispatchEvent( _endEvent );
|
|
</code></td></tr><tr><td id="L900" class="css-a4x74f"><span>900</span></td><td id="LC900" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L901" class="css-a4x74f"><span>901</span></td><td id="LC901" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L902" class="css-a4x74f"><span>902</span></td><td id="LC902" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L903" class="css-a4x74f"><span>903</span></td><td id="LC903" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">onKeyDown</span>(<span class="code-params"> event </span>) </span>{
|
|
</code></td></tr><tr><td id="L904" class="css-a4x74f"><span>904</span></td><td id="LC904" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L905" class="css-a4x74f"><span>905</span></td><td id="LC905" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.enabled === <span class="code-literal">false</span> || scope.enablePan === <span class="code-literal">false</span> ) <span class="code-keyword">return</span>;
|
|
</code></td></tr><tr><td id="L906" class="css-a4x74f"><span>906</span></td><td id="LC906" class="css-1dcdqdg"><code> handleKeyDown( event );
|
|
</code></td></tr><tr><td id="L907" class="css-a4x74f"><span>907</span></td><td id="LC907" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L908" class="css-a4x74f"><span>908</span></td><td id="LC908" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L909" class="css-a4x74f"><span>909</span></td><td id="LC909" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L910" class="css-a4x74f"><span>910</span></td><td id="LC910" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">onTouchStart</span>(<span class="code-params"> event </span>) </span>{
|
|
</code></td></tr><tr><td id="L911" class="css-a4x74f"><span>911</span></td><td id="LC911" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L912" class="css-a4x74f"><span>912</span></td><td id="LC912" class="css-1dcdqdg"><code> trackPointer( event );
|
|
</code></td></tr><tr><td id="L913" class="css-a4x74f"><span>913</span></td><td id="LC913" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L914" class="css-a4x74f"><span>914</span></td><td id="LC914" class="css-1dcdqdg"><code> <span class="code-keyword">switch</span> ( pointers.length ) {
|
|
</code></td></tr><tr><td id="L915" class="css-a4x74f"><span>915</span></td><td id="LC915" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L916" class="css-a4x74f"><span>916</span></td><td id="LC916" class="css-1dcdqdg"><code> <span class="code-keyword">case</span> <span class="code-number">1</span>:
|
|
</code></td></tr><tr><td id="L917" class="css-a4x74f"><span>917</span></td><td id="LC917" class="css-1dcdqdg"><code> <span class="code-keyword">switch</span> ( scope.touches.ONE ) {
|
|
</code></td></tr><tr><td id="L918" class="css-a4x74f"><span>918</span></td><td id="LC918" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L919" class="css-a4x74f"><span>919</span></td><td id="LC919" class="css-1dcdqdg"><code> <span class="code-keyword">case</span> THREE.TOUCH.ROTATE:
|
|
</code></td></tr><tr><td id="L920" class="css-a4x74f"><span>920</span></td><td id="LC920" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.enableRotate === <span class="code-literal">false</span> ) <span class="code-keyword">return</span>;
|
|
</code></td></tr><tr><td id="L921" class="css-a4x74f"><span>921</span></td><td id="LC921" class="css-1dcdqdg"><code> handleTouchStartRotate();
|
|
</code></td></tr><tr><td id="L922" class="css-a4x74f"><span>922</span></td><td id="LC922" class="css-1dcdqdg"><code> state = STATE.TOUCH_ROTATE;
|
|
</code></td></tr><tr><td id="L923" class="css-a4x74f"><span>923</span></td><td id="LC923" class="css-1dcdqdg"><code> <span class="code-keyword">break</span>;
|
|
</code></td></tr><tr><td id="L924" class="css-a4x74f"><span>924</span></td><td id="LC924" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L925" class="css-a4x74f"><span>925</span></td><td id="LC925" class="css-1dcdqdg"><code> <span class="code-keyword">case</span> THREE.TOUCH.PAN:
|
|
</code></td></tr><tr><td id="L926" class="css-a4x74f"><span>926</span></td><td id="LC926" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.enablePan === <span class="code-literal">false</span> ) <span class="code-keyword">return</span>;
|
|
</code></td></tr><tr><td id="L927" class="css-a4x74f"><span>927</span></td><td id="LC927" class="css-1dcdqdg"><code> handleTouchStartPan();
|
|
</code></td></tr><tr><td id="L928" class="css-a4x74f"><span>928</span></td><td id="LC928" class="css-1dcdqdg"><code> state = STATE.TOUCH_PAN;
|
|
</code></td></tr><tr><td id="L929" class="css-a4x74f"><span>929</span></td><td id="LC929" class="css-1dcdqdg"><code> <span class="code-keyword">break</span>;
|
|
</code></td></tr><tr><td id="L930" class="css-a4x74f"><span>930</span></td><td id="LC930" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L931" class="css-a4x74f"><span>931</span></td><td id="LC931" class="css-1dcdqdg"><code> <span class="code-keyword">default</span>:
|
|
</code></td></tr><tr><td id="L932" class="css-a4x74f"><span>932</span></td><td id="LC932" class="css-1dcdqdg"><code> state = STATE.NONE;
|
|
</code></td></tr><tr><td id="L933" class="css-a4x74f"><span>933</span></td><td id="LC933" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L934" class="css-a4x74f"><span>934</span></td><td id="LC934" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L935" class="css-a4x74f"><span>935</span></td><td id="LC935" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L936" class="css-a4x74f"><span>936</span></td><td id="LC936" class="css-1dcdqdg"><code> <span class="code-keyword">break</span>;
|
|
</code></td></tr><tr><td id="L937" class="css-a4x74f"><span>937</span></td><td id="LC937" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L938" class="css-a4x74f"><span>938</span></td><td id="LC938" class="css-1dcdqdg"><code> <span class="code-keyword">case</span> <span class="code-number">2</span>:
|
|
</code></td></tr><tr><td id="L939" class="css-a4x74f"><span>939</span></td><td id="LC939" class="css-1dcdqdg"><code> <span class="code-keyword">switch</span> ( scope.touches.TWO ) {
|
|
</code></td></tr><tr><td id="L940" class="css-a4x74f"><span>940</span></td><td id="LC940" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L941" class="css-a4x74f"><span>941</span></td><td id="LC941" class="css-1dcdqdg"><code> <span class="code-keyword">case</span> THREE.TOUCH.DOLLY_PAN:
|
|
</code></td></tr><tr><td id="L942" class="css-a4x74f"><span>942</span></td><td id="LC942" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.enableZoom === <span class="code-literal">false</span> && scope.enablePan === <span class="code-literal">false</span> ) <span class="code-keyword">return</span>;
|
|
</code></td></tr><tr><td id="L943" class="css-a4x74f"><span>943</span></td><td id="LC943" class="css-1dcdqdg"><code> handleTouchStartDollyPan();
|
|
</code></td></tr><tr><td id="L944" class="css-a4x74f"><span>944</span></td><td id="LC944" class="css-1dcdqdg"><code> state = STATE.TOUCH_DOLLY_PAN;
|
|
</code></td></tr><tr><td id="L945" class="css-a4x74f"><span>945</span></td><td id="LC945" class="css-1dcdqdg"><code> <span class="code-keyword">break</span>;
|
|
</code></td></tr><tr><td id="L946" class="css-a4x74f"><span>946</span></td><td id="LC946" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L947" class="css-a4x74f"><span>947</span></td><td id="LC947" class="css-1dcdqdg"><code> <span class="code-keyword">case</span> THREE.TOUCH.DOLLY_ROTATE:
|
|
</code></td></tr><tr><td id="L948" class="css-a4x74f"><span>948</span></td><td id="LC948" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.enableZoom === <span class="code-literal">false</span> && scope.enableRotate === <span class="code-literal">false</span> ) <span class="code-keyword">return</span>;
|
|
</code></td></tr><tr><td id="L949" class="css-a4x74f"><span>949</span></td><td id="LC949" class="css-1dcdqdg"><code> handleTouchStartDollyRotate();
|
|
</code></td></tr><tr><td id="L950" class="css-a4x74f"><span>950</span></td><td id="LC950" class="css-1dcdqdg"><code> state = STATE.TOUCH_DOLLY_ROTATE;
|
|
</code></td></tr><tr><td id="L951" class="css-a4x74f"><span>951</span></td><td id="LC951" class="css-1dcdqdg"><code> <span class="code-keyword">break</span>;
|
|
</code></td></tr><tr><td id="L952" class="css-a4x74f"><span>952</span></td><td id="LC952" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L953" class="css-a4x74f"><span>953</span></td><td id="LC953" class="css-1dcdqdg"><code> <span class="code-keyword">default</span>:
|
|
</code></td></tr><tr><td id="L954" class="css-a4x74f"><span>954</span></td><td id="LC954" class="css-1dcdqdg"><code> state = STATE.NONE;
|
|
</code></td></tr><tr><td id="L955" class="css-a4x74f"><span>955</span></td><td id="LC955" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L956" class="css-a4x74f"><span>956</span></td><td id="LC956" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L957" class="css-a4x74f"><span>957</span></td><td id="LC957" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L958" class="css-a4x74f"><span>958</span></td><td id="LC958" class="css-1dcdqdg"><code> <span class="code-keyword">break</span>;
|
|
</code></td></tr><tr><td id="L959" class="css-a4x74f"><span>959</span></td><td id="LC959" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L960" class="css-a4x74f"><span>960</span></td><td id="LC960" class="css-1dcdqdg"><code> <span class="code-keyword">default</span>:
|
|
</code></td></tr><tr><td id="L961" class="css-a4x74f"><span>961</span></td><td id="LC961" class="css-1dcdqdg"><code> state = STATE.NONE;
|
|
</code></td></tr><tr><td id="L962" class="css-a4x74f"><span>962</span></td><td id="LC962" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L963" class="css-a4x74f"><span>963</span></td><td id="LC963" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L964" class="css-a4x74f"><span>964</span></td><td id="LC964" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L965" class="css-a4x74f"><span>965</span></td><td id="LC965" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( state !== STATE.NONE ) {
|
|
</code></td></tr><tr><td id="L966" class="css-a4x74f"><span>966</span></td><td id="LC966" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L967" class="css-a4x74f"><span>967</span></td><td id="LC967" class="css-1dcdqdg"><code> scope.dispatchEvent( _startEvent );
|
|
</code></td></tr><tr><td id="L968" class="css-a4x74f"><span>968</span></td><td id="LC968" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L969" class="css-a4x74f"><span>969</span></td><td id="LC969" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L970" class="css-a4x74f"><span>970</span></td><td id="LC970" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L971" class="css-a4x74f"><span>971</span></td><td id="LC971" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L972" class="css-a4x74f"><span>972</span></td><td id="LC972" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L973" class="css-a4x74f"><span>973</span></td><td id="LC973" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">onTouchMove</span>(<span class="code-params"> event </span>) </span>{
|
|
</code></td></tr><tr><td id="L974" class="css-a4x74f"><span>974</span></td><td id="LC974" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L975" class="css-a4x74f"><span>975</span></td><td id="LC975" class="css-1dcdqdg"><code> trackPointer( event );
|
|
</code></td></tr><tr><td id="L976" class="css-a4x74f"><span>976</span></td><td id="LC976" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L977" class="css-a4x74f"><span>977</span></td><td id="LC977" class="css-1dcdqdg"><code> <span class="code-keyword">switch</span> ( state ) {
|
|
</code></td></tr><tr><td id="L978" class="css-a4x74f"><span>978</span></td><td id="LC978" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L979" class="css-a4x74f"><span>979</span></td><td id="LC979" class="css-1dcdqdg"><code> <span class="code-keyword">case</span> STATE.TOUCH_ROTATE:
|
|
</code></td></tr><tr><td id="L980" class="css-a4x74f"><span>980</span></td><td id="LC980" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.enableRotate === <span class="code-literal">false</span> ) <span class="code-keyword">return</span>;
|
|
</code></td></tr><tr><td id="L981" class="css-a4x74f"><span>981</span></td><td id="LC981" class="css-1dcdqdg"><code> handleTouchMoveRotate( event );
|
|
</code></td></tr><tr><td id="L982" class="css-a4x74f"><span>982</span></td><td id="LC982" class="css-1dcdqdg"><code> scope.update();
|
|
</code></td></tr><tr><td id="L983" class="css-a4x74f"><span>983</span></td><td id="LC983" class="css-1dcdqdg"><code> <span class="code-keyword">break</span>;
|
|
</code></td></tr><tr><td id="L984" class="css-a4x74f"><span>984</span></td><td id="LC984" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L985" class="css-a4x74f"><span>985</span></td><td id="LC985" class="css-1dcdqdg"><code> <span class="code-keyword">case</span> STATE.TOUCH_PAN:
|
|
</code></td></tr><tr><td id="L986" class="css-a4x74f"><span>986</span></td><td id="LC986" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.enablePan === <span class="code-literal">false</span> ) <span class="code-keyword">return</span>;
|
|
</code></td></tr><tr><td id="L987" class="css-a4x74f"><span>987</span></td><td id="LC987" class="css-1dcdqdg"><code> handleTouchMovePan( event );
|
|
</code></td></tr><tr><td id="L988" class="css-a4x74f"><span>988</span></td><td id="LC988" class="css-1dcdqdg"><code> scope.update();
|
|
</code></td></tr><tr><td id="L989" class="css-a4x74f"><span>989</span></td><td id="LC989" class="css-1dcdqdg"><code> <span class="code-keyword">break</span>;
|
|
</code></td></tr><tr><td id="L990" class="css-a4x74f"><span>990</span></td><td id="LC990" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L991" class="css-a4x74f"><span>991</span></td><td id="LC991" class="css-1dcdqdg"><code> <span class="code-keyword">case</span> STATE.TOUCH_DOLLY_PAN:
|
|
</code></td></tr><tr><td id="L992" class="css-a4x74f"><span>992</span></td><td id="LC992" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.enableZoom === <span class="code-literal">false</span> && scope.enablePan === <span class="code-literal">false</span> ) <span class="code-keyword">return</span>;
|
|
</code></td></tr><tr><td id="L993" class="css-a4x74f"><span>993</span></td><td id="LC993" class="css-1dcdqdg"><code> handleTouchMoveDollyPan( event );
|
|
</code></td></tr><tr><td id="L994" class="css-a4x74f"><span>994</span></td><td id="LC994" class="css-1dcdqdg"><code> scope.update();
|
|
</code></td></tr><tr><td id="L995" class="css-a4x74f"><span>995</span></td><td id="LC995" class="css-1dcdqdg"><code> <span class="code-keyword">break</span>;
|
|
</code></td></tr><tr><td id="L996" class="css-a4x74f"><span>996</span></td><td id="LC996" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L997" class="css-a4x74f"><span>997</span></td><td id="LC997" class="css-1dcdqdg"><code> <span class="code-keyword">case</span> STATE.TOUCH_DOLLY_ROTATE:
|
|
</code></td></tr><tr><td id="L998" class="css-a4x74f"><span>998</span></td><td id="LC998" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.enableZoom === <span class="code-literal">false</span> && scope.enableRotate === <span class="code-literal">false</span> ) <span class="code-keyword">return</span>;
|
|
</code></td></tr><tr><td id="L999" class="css-a4x74f"><span>999</span></td><td id="LC999" class="css-1dcdqdg"><code> handleTouchMoveDollyRotate( event );
|
|
</code></td></tr><tr><td id="L1000" class="css-a4x74f"><span>1000</span></td><td id="LC1000" class="css-1dcdqdg"><code> scope.update();
|
|
</code></td></tr><tr><td id="L1001" class="css-a4x74f"><span>1001</span></td><td id="LC1001" class="css-1dcdqdg"><code> <span class="code-keyword">break</span>;
|
|
</code></td></tr><tr><td id="L1002" class="css-a4x74f"><span>1002</span></td><td id="LC1002" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1003" class="css-a4x74f"><span>1003</span></td><td id="LC1003" class="css-1dcdqdg"><code> <span class="code-keyword">default</span>:
|
|
</code></td></tr><tr><td id="L1004" class="css-a4x74f"><span>1004</span></td><td id="LC1004" class="css-1dcdqdg"><code> state = STATE.NONE;
|
|
</code></td></tr><tr><td id="L1005" class="css-a4x74f"><span>1005</span></td><td id="LC1005" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1006" class="css-a4x74f"><span>1006</span></td><td id="LC1006" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L1007" class="css-a4x74f"><span>1007</span></td><td id="LC1007" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1008" class="css-a4x74f"><span>1008</span></td><td id="LC1008" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L1009" class="css-a4x74f"><span>1009</span></td><td id="LC1009" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1010" class="css-a4x74f"><span>1010</span></td><td id="LC1010" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">onTouchEnd</span>(<span class="code-params"> event </span>) </span>{
|
|
</code></td></tr><tr><td id="L1011" class="css-a4x74f"><span>1011</span></td><td id="LC1011" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1012" class="css-a4x74f"><span>1012</span></td><td id="LC1012" class="css-1dcdqdg"><code> handleTouchEnd( event );
|
|
</code></td></tr><tr><td id="L1013" class="css-a4x74f"><span>1013</span></td><td id="LC1013" class="css-1dcdqdg"><code> scope.dispatchEvent( _endEvent );
|
|
</code></td></tr><tr><td id="L1014" class="css-a4x74f"><span>1014</span></td><td id="LC1014" class="css-1dcdqdg"><code> state = STATE.NONE;
|
|
</code></td></tr><tr><td id="L1015" class="css-a4x74f"><span>1015</span></td><td id="LC1015" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1016" class="css-a4x74f"><span>1016</span></td><td id="LC1016" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L1017" class="css-a4x74f"><span>1017</span></td><td id="LC1017" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1018" class="css-a4x74f"><span>1018</span></td><td id="LC1018" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">onContextMenu</span>(<span class="code-params"> event </span>) </span>{
|
|
</code></td></tr><tr><td id="L1019" class="css-a4x74f"><span>1019</span></td><td id="LC1019" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1020" class="css-a4x74f"><span>1020</span></td><td id="LC1020" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( scope.enabled === <span class="code-literal">false</span> ) <span class="code-keyword">return</span>;
|
|
</code></td></tr><tr><td id="L1021" class="css-a4x74f"><span>1021</span></td><td id="LC1021" class="css-1dcdqdg"><code> event.preventDefault();
|
|
</code></td></tr><tr><td id="L1022" class="css-a4x74f"><span>1022</span></td><td id="LC1022" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1023" class="css-a4x74f"><span>1023</span></td><td id="LC1023" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L1024" class="css-a4x74f"><span>1024</span></td><td id="LC1024" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1025" class="css-a4x74f"><span>1025</span></td><td id="LC1025" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">addPointer</span>(<span class="code-params"> event </span>) </span>{
|
|
</code></td></tr><tr><td id="L1026" class="css-a4x74f"><span>1026</span></td><td id="LC1026" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1027" class="css-a4x74f"><span>1027</span></td><td id="LC1027" class="css-1dcdqdg"><code> pointers.push( event );
|
|
</code></td></tr><tr><td id="L1028" class="css-a4x74f"><span>1028</span></td><td id="LC1028" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1029" class="css-a4x74f"><span>1029</span></td><td id="LC1029" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L1030" class="css-a4x74f"><span>1030</span></td><td id="LC1030" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1031" class="css-a4x74f"><span>1031</span></td><td id="LC1031" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">removePointer</span>(<span class="code-params"> event </span>) </span>{
|
|
</code></td></tr><tr><td id="L1032" class="css-a4x74f"><span>1032</span></td><td id="LC1032" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1033" class="css-a4x74f"><span>1033</span></td><td id="LC1033" class="css-1dcdqdg"><code> <span class="code-keyword">delete</span> pointerPositions[ event.pointerId ];
|
|
</code></td></tr><tr><td id="L1034" class="css-a4x74f"><span>1034</span></td><td id="LC1034" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1035" class="css-a4x74f"><span>1035</span></td><td id="LC1035" class="css-1dcdqdg"><code> <span class="code-keyword">for</span> ( <span class="code-keyword">let</span> i = <span class="code-number">0</span>; i < pointers.length; i ++ ) {
|
|
</code></td></tr><tr><td id="L1036" class="css-a4x74f"><span>1036</span></td><td id="LC1036" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1037" class="css-a4x74f"><span>1037</span></td><td id="LC1037" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( pointers[ i ].pointerId == event.pointerId ) {
|
|
</code></td></tr><tr><td id="L1038" class="css-a4x74f"><span>1038</span></td><td id="LC1038" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1039" class="css-a4x74f"><span>1039</span></td><td id="LC1039" class="css-1dcdqdg"><code> pointers.splice( i, <span class="code-number">1</span> );
|
|
</code></td></tr><tr><td id="L1040" class="css-a4x74f"><span>1040</span></td><td id="LC1040" class="css-1dcdqdg"><code> <span class="code-keyword">return</span>;
|
|
</code></td></tr><tr><td id="L1041" class="css-a4x74f"><span>1041</span></td><td id="LC1041" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1042" class="css-a4x74f"><span>1042</span></td><td id="LC1042" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L1043" class="css-a4x74f"><span>1043</span></td><td id="LC1043" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1044" class="css-a4x74f"><span>1044</span></td><td id="LC1044" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L1045" class="css-a4x74f"><span>1045</span></td><td id="LC1045" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1046" class="css-a4x74f"><span>1046</span></td><td id="LC1046" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L1047" class="css-a4x74f"><span>1047</span></td><td id="LC1047" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1048" class="css-a4x74f"><span>1048</span></td><td id="LC1048" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">trackPointer</span>(<span class="code-params"> event </span>) </span>{
|
|
</code></td></tr><tr><td id="L1049" class="css-a4x74f"><span>1049</span></td><td id="LC1049" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1050" class="css-a4x74f"><span>1050</span></td><td id="LC1050" class="css-1dcdqdg"><code> <span class="code-keyword">let</span> position = pointerPositions[ event.pointerId ];
|
|
</code></td></tr><tr><td id="L1051" class="css-a4x74f"><span>1051</span></td><td id="LC1051" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1052" class="css-a4x74f"><span>1052</span></td><td id="LC1052" class="css-1dcdqdg"><code> <span class="code-keyword">if</span> ( position === <span class="code-literal">undefined</span> ) {
|
|
</code></td></tr><tr><td id="L1053" class="css-a4x74f"><span>1053</span></td><td id="LC1053" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1054" class="css-a4x74f"><span>1054</span></td><td id="LC1054" class="css-1dcdqdg"><code> position = <span class="code-keyword">new</span> THREE.Vector2();
|
|
</code></td></tr><tr><td id="L1055" class="css-a4x74f"><span>1055</span></td><td id="LC1055" class="css-1dcdqdg"><code> pointerPositions[ event.pointerId ] = position;
|
|
</code></td></tr><tr><td id="L1056" class="css-a4x74f"><span>1056</span></td><td id="LC1056" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1057" class="css-a4x74f"><span>1057</span></td><td id="LC1057" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L1058" class="css-a4x74f"><span>1058</span></td><td id="LC1058" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1059" class="css-a4x74f"><span>1059</span></td><td id="LC1059" class="css-1dcdqdg"><code> position.set( event.pageX, event.pageY );
|
|
</code></td></tr><tr><td id="L1060" class="css-a4x74f"><span>1060</span></td><td id="LC1060" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1061" class="css-a4x74f"><span>1061</span></td><td id="LC1061" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L1062" class="css-a4x74f"><span>1062</span></td><td id="LC1062" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1063" class="css-a4x74f"><span>1063</span></td><td id="LC1063" class="css-1dcdqdg"><code> <span class="code-function"><span class="code-keyword">function</span> <span class="code-title">getSecondPointerPosition</span>(<span class="code-params"> event </span>) </span>{
|
|
</code></td></tr><tr><td id="L1064" class="css-a4x74f"><span>1064</span></td><td id="LC1064" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1065" class="css-a4x74f"><span>1065</span></td><td id="LC1065" class="css-1dcdqdg"><code> <span class="code-keyword">const</span> pointer = event.pointerId === pointers[ <span class="code-number">0</span> ].pointerId ? pointers[ <span class="code-number">1</span> ] : pointers[ <span class="code-number">0</span> ];
|
|
</code></td></tr><tr><td id="L1066" class="css-a4x74f"><span>1066</span></td><td id="LC1066" class="css-1dcdqdg"><code> <span class="code-keyword">return</span> pointerPositions[ pointer.pointerId ];
|
|
</code></td></tr><tr><td id="L1067" class="css-a4x74f"><span>1067</span></td><td id="LC1067" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1068" class="css-a4x74f"><span>1068</span></td><td id="LC1068" class="css-1dcdqdg"><code> } <span class="code-comment">//</span>
|
|
</code></td></tr><tr><td id="L1069" class="css-a4x74f"><span>1069</span></td><td id="LC1069" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1070" class="css-a4x74f"><span>1070</span></td><td id="LC1070" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1071" class="css-a4x74f"><span>1071</span></td><td id="LC1071" class="css-1dcdqdg"><code> scope.domElement.addEventListener( <span class="code-string">'contextmenu'</span>, onContextMenu );
|
|
</code></td></tr><tr><td id="L1072" class="css-a4x74f"><span>1072</span></td><td id="LC1072" class="css-1dcdqdg"><code> scope.domElement.addEventListener( <span class="code-string">'pointerdown'</span>, onPointerDown );
|
|
</code></td></tr><tr><td id="L1073" class="css-a4x74f"><span>1073</span></td><td id="LC1073" class="css-1dcdqdg"><code> scope.domElement.addEventListener( <span class="code-string">'pointercancel'</span>, onPointerCancel );
|
|
</code></td></tr><tr><td id="L1074" class="css-a4x74f"><span>1074</span></td><td id="LC1074" class="css-1dcdqdg"><code> scope.domElement.addEventListener( <span class="code-string">'wheel'</span>, onMouseWheel, {
|
|
</code></td></tr><tr><td id="L1075" class="css-a4x74f"><span>1075</span></td><td id="LC1075" class="css-1dcdqdg"><code> passive: <span class="code-literal">false</span>
|
|
</code></td></tr><tr><td id="L1076" class="css-a4x74f"><span>1076</span></td><td id="LC1076" class="css-1dcdqdg"><code> } ); <span class="code-comment">// force an update at start</span>
|
|
</code></td></tr><tr><td id="L1077" class="css-a4x74f"><span>1077</span></td><td id="LC1077" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1078" class="css-a4x74f"><span>1078</span></td><td id="LC1078" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.update();
|
|
</code></td></tr><tr><td id="L1079" class="css-a4x74f"><span>1079</span></td><td id="LC1079" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1080" class="css-a4x74f"><span>1080</span></td><td id="LC1080" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L1081" class="css-a4x74f"><span>1081</span></td><td id="LC1081" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1082" class="css-a4x74f"><span>1082</span></td><td id="LC1082" class="css-1dcdqdg"><code> } <span class="code-comment">// This set of controls performs orbiting, dollying (zooming), and panning.</span>
|
|
</code></td></tr><tr><td id="L1083" class="css-a4x74f"><span>1083</span></td><td id="LC1083" class="css-1dcdqdg"><code> <span class="code-comment">// Unlike TrackballControls, it maintains the "up" direction object.up (+Y by default).</span>
|
|
</code></td></tr><tr><td id="L1084" class="css-a4x74f"><span>1084</span></td><td id="LC1084" class="css-1dcdqdg"><code> <span class="code-comment">// This is very similar to OrbitControls, another set of touch behavior</span>
|
|
</code></td></tr><tr><td id="L1085" class="css-a4x74f"><span>1085</span></td><td id="LC1085" class="css-1dcdqdg"><code> <span class="code-comment">//</span>
|
|
</code></td></tr><tr><td id="L1086" class="css-a4x74f"><span>1086</span></td><td id="LC1086" class="css-1dcdqdg"><code> <span class="code-comment">// Orbit - right mouse, or left mouse + ctrl/meta/shiftKey / touch: two-finger rotate</span>
|
|
</code></td></tr><tr><td id="L1087" class="css-a4x74f"><span>1087</span></td><td id="LC1087" class="css-1dcdqdg"><code> <span class="code-comment">// Zoom - middle mouse, or mousewheel / touch: two-finger spread or squish</span>
|
|
</code></td></tr><tr><td id="L1088" class="css-a4x74f"><span>1088</span></td><td id="LC1088" class="css-1dcdqdg"><code> <span class="code-comment">// Pan - left mouse, or arrow keys / touch: one-finger move</span>
|
|
</code></td></tr><tr><td id="L1089" class="css-a4x74f"><span>1089</span></td><td id="LC1089" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1090" class="css-a4x74f"><span>1090</span></td><td id="LC1090" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1091" class="css-a4x74f"><span>1091</span></td><td id="LC1091" class="css-1dcdqdg"><code> <span class="code-class"><span class="code-keyword">class</span> <span class="code-title">MapControls</span> <span class="code-keyword">extends</span> <span class="code-title">OrbitControls</span> </span>{
|
|
</code></td></tr><tr><td id="L1092" class="css-a4x74f"><span>1092</span></td><td id="LC1092" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1093" class="css-a4x74f"><span>1093</span></td><td id="LC1093" class="css-1dcdqdg"><code> <span class="code-keyword">constructor</span>( object, domElement ) {
|
|
</code></td></tr><tr><td id="L1094" class="css-a4x74f"><span>1094</span></td><td id="LC1094" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1095" class="css-a4x74f"><span>1095</span></td><td id="LC1095" class="css-1dcdqdg"><code> <span class="code-keyword">super</span>( object, domElement );
|
|
</code></td></tr><tr><td id="L1096" class="css-a4x74f"><span>1096</span></td><td id="LC1096" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.screenSpacePanning = <span class="code-literal">false</span>; <span class="code-comment">// pan orthogonal to world-space direction camera.up</span>
|
|
</code></td></tr><tr><td id="L1097" class="css-a4x74f"><span>1097</span></td><td id="LC1097" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1098" class="css-a4x74f"><span>1098</span></td><td id="LC1098" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.mouseButtons.LEFT = THREE.MOUSE.PAN;
|
|
</code></td></tr><tr><td id="L1099" class="css-a4x74f"><span>1099</span></td><td id="LC1099" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.mouseButtons.RIGHT = THREE.MOUSE.ROTATE;
|
|
</code></td></tr><tr><td id="L1100" class="css-a4x74f"><span>1100</span></td><td id="LC1100" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.touches.ONE = THREE.TOUCH.PAN;
|
|
</code></td></tr><tr><td id="L1101" class="css-a4x74f"><span>1101</span></td><td id="LC1101" class="css-1dcdqdg"><code> <span class="code-keyword">this</span>.touches.TWO = THREE.TOUCH.DOLLY_ROTATE;
|
|
</code></td></tr><tr><td id="L1102" class="css-a4x74f"><span>1102</span></td><td id="LC1102" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1103" class="css-a4x74f"><span>1103</span></td><td id="LC1103" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L1104" class="css-a4x74f"><span>1104</span></td><td id="LC1104" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1105" class="css-a4x74f"><span>1105</span></td><td id="LC1105" class="css-1dcdqdg"><code> }
|
|
</code></td></tr><tr><td id="L1106" class="css-a4x74f"><span>1106</span></td><td id="LC1106" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1107" class="css-a4x74f"><span>1107</span></td><td id="LC1107" class="css-1dcdqdg"><code> THREE.MapControls = MapControls;
|
|
</code></td></tr><tr><td id="L1108" class="css-a4x74f"><span>1108</span></td><td id="LC1108" class="css-1dcdqdg"><code> THREE.OrbitControls = OrbitControls;
|
|
</code></td></tr><tr><td id="L1109" class="css-a4x74f"><span>1109</span></td><td id="LC1109" class="css-1dcdqdg"><code>
|
|
</code></td></tr><tr><td id="L1110" class="css-a4x74f"><span>1110</span></td><td id="LC1110" class="css-1dcdqdg"><code>} )();
|
|
</code></td></tr></tbody></table></div></div></div></div><style data-emotion-css="1teho9j">.css-1teho9j{margin-top:5rem;background:black;color:#aaa;}</style><footer class="css-1teho9j"><style data-emotion-css="1ui8put">.css-1ui8put{max-width:940px;padding:10px 20px;margin:0 auto;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;}</style><div class="css-1ui8put"><p><span>Build: <!-- -->a7ebffa</span></p><p><span>© <!-- -->2023<!-- --> UNPKG</span></p><style data-emotion-css="la3nd4">.css-la3nd4{font-size:1.5rem;}</style><p class="css-la3nd4"><style data-emotion-css="bogekj">.css-bogekj{color:#aaa;display:inline-block;}.css-bogekj:hover{color:white;}</style><a href="https://twitter.com/unpkg" class="css-bogekj"><style data-emotion-css="i6dzq1">.css-i6dzq1{vertical-align:text-bottom;}</style><svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 512 512" class="css-i6dzq1" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"><path d="M459.37 151.716c.325 4.548.325 9.097.325 13.645 0 138.72-105.583 298.558-298.558 298.558-59.452 0-114.68-17.219-161.137-47.106 8.447.974 16.568 1.299 25.34 1.299 49.055 0 94.213-16.568 130.274-44.832-46.132-.975-84.792-31.188-98.112-72.772 6.498.974 12.995 1.624 19.818 1.624 9.421 0 18.843-1.3 27.614-3.573-48.081-9.747-84.143-51.98-84.143-102.985v-1.299c13.969 7.797 30.214 12.67 47.431 13.319-28.264-18.843-46.781-51.005-46.781-87.391 0-19.492 5.197-37.36 14.294-52.954 51.655 63.675 129.3 105.258 216.365 109.807-1.624-7.797-2.599-15.918-2.599-24.04 0-57.828 46.782-104.934 104.934-104.934 30.213 0 57.502 12.67 76.67 33.137 23.715-4.548 46.456-13.32 66.599-25.34-7.798 24.366-24.366 44.833-46.132 57.827 21.117-2.273 41.584-8.122 60.426-16.243-14.292 20.791-32.161 39.308-52.628 54.253z"></path></svg></a><style data-emotion-css="3czw03">.css-3czw03{color:#aaa;display:inline-block;margin-left:1rem;}.css-3czw03:hover{color:white;}</style><a href="https://github.com/mjackson/unpkg" class="css-3czw03"><svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 496 512" class="css-i6dzq1" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"><path d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3.3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5.3-6.2 2.3zm44.2-1.7c-2.9.7-4.9 2.6-4.6 4.9.3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3.7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3.3 2.9 2.3 3.9 1.6 1 3.6.7 4.3-.7.7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3.7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3.7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z"></path></svg></a></p></div></footer></div><script src="/react@16.8.6/umd/react.production.min.js"></script><script src="/react-dom@16.8.6/umd/react-dom.production.min.js"></script><script src="/@emotion/core@10.0.6/dist/core.umd.min.js"></script><script>'use strict';(function(t,A,c){function w(){w=Object.assign||function(a){for(var b=1;b<arguments.length;b++){var e=arguments[b],c;for(c in e)Object.prototype.hasOwnProperty.call(e,c)&&(a[c]=e[c])}return a};return w.apply(this,arguments)}function P(a,b){if(null==a)return{};var e={},c=Object.keys(a),d;for(d=0;d<c.length;d++){var h=c[d];0<=b.indexOf(h)||(e[h]=a[h])}return e}function Q(a,b){b||(b=a.slice(0));a.raw=b;return a}function R(a){return a&&a.__esModule&&Object.prototype.hasOwnProperty.call(a,
|
|
"default")?a["default"]:a}function D(a,b){return b={exports:{}},a(b,b.exports),b.exports}function J(a,b,e,c,d){for(var g in a)if(ua(a,g)){try{if("function"!==typeof a[g]){var r=Error((c||"React class")+": "+e+" type `"+g+"` is invalid; it must be a function, usually from the `prop-types` package, but received `"+typeof a[g]+"`.");r.name="Invariant Violation";throw r;}var k=a[g](b,g,c,e,null,"SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED")}catch(q){k=q}!k||k instanceof Error||K((c||"React class")+": type specification of "+
|
|
e+" `"+g+"` is invalid; the type checker function must return `null` or an `Error` but returned a "+typeof k+". You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).");if(k instanceof Error&&!(k.message in L)){L[k.message]=!0;var B=d?d():"";K("Failed "+e+" type: "+k.message+(null!=B?B:""))}}}function G(){return null}function S(a){var b,e=a.children;a=a.css;return c.jsx("div",{css:w((b={border:"1px solid #dfe2e5",
|
|
borderRadius:3},b["@media (max-width: 700px)"]={borderRightWidth:0,borderLeftWidth:0},b),a)},e)}function T(a){var b,e=a.children;a=a.css;return c.jsx("div",{css:w((b={padding:10,background:"#f6f8fa",color:"#424242",border:"1px solid #d1d5da",borderTopLeftRadius:3,borderTopRightRadius:3,margin:"-1px -1px 0",display:"flex",flexDirection:"row",alignItems:"center",justifyContent:"space-between"},b["@media (max-width: 700px)"]={paddingRight:20,paddingLeft:20},b),a)},e)}function U(a){return a&&a.map(function(a,
|
|
c){return t.createElement(a.tag,z({key:c},a.attr),U(a.child))})}function E(a){return function(b){return t.createElement(va,z({attr:z({},a.attr)},b),U(a.child))}}function va(a){var b=function(b){var c=a.size||b.size||"1em";if(b.className)var e=b.className;a.className&&(e=(e?e+" ":"")+a.className);var h=a.attr,r=a.title,k=["attr","title"],B={},q;for(q in a)Object.prototype.hasOwnProperty.call(a,q)&&0>k.indexOf(q)&&(B[q]=a[q]);if(null!=a&&"function"===typeof Object.getOwnPropertySymbols){var p=0;for(q=
|
|
Object.getOwnPropertySymbols(a);p<q.length;p++)0>k.indexOf(q[p])&&(B[q[p]]=a[q[p]])}return t.createElement("svg",z({stroke:"currentColor",fill:"currentColor",strokeWidth:"0"},b.attr,h,B,{className:e,style:z({color:a.color||b.color},b.style,a.style),height:c,width:c,xmlns:"http://www.w3.org/2000/svg"}),r&&t.createElement("title",null,r),a.children)};return void 0!==V?t.createElement(V.Consumer,null,function(a){return b(a)}):b(W)}function F(a,b){var e=b.css;b=P(b,["css"]);return c.jsx(a,w({css:w({},
|
|
e,{verticalAlign:"text-bottom"})},b))}function wa(a){return F(X,a)}function xa(a){return F(Y,a)}function ya(a){return F(Z,a)}function za(a){return F(aa,a)}function Aa(a){return F(ba,a)}function ca(a){var b=a.path,e=a.details,g=Object.keys(e).reduce(function(a,b){var c=a.subdirs,g=a.files;b=e[b];"directory"===b.type?c.push(b):"file"===b.type&&g.push(b);return a},{subdirs:[],files:[]});a=g.subdirs;g=g.files;a.sort(da("path"));g.sort(da("path"));var d=[];"/"!==b&&d.push(c.jsx("tr",{key:".."},c.jsx("td",
|
|
{css:M}),c.jsx("td",{css:y},c.jsx("a",{title:"Parent directory",href:"../",css:N},"..")),c.jsx("td",{css:y}),c.jsx("td",{css:O})));a.forEach(function(a){a=a.path.substr(1<b.length?b.length+1:1);var e=a+"/";d.push(c.jsx("tr",{key:a},c.jsx("td",{css:M},c.jsx(ya,null)),c.jsx("td",{css:y},c.jsx("a",{title:a,href:e,css:N},a)),c.jsx("td",{css:y},"-"),c.jsx("td",{css:O},"-")))});g.forEach(function(a){var e=a.size,g=a.contentType;a=a.path.substr(1<b.length?b.length+1:1);d.push(c.jsx("tr",{key:a},c.jsx("td",
|
|
{css:M},"text/plain"===g||"text/markdown"===g?c.jsx(wa,null):c.jsx(xa,null)),c.jsx("td",{css:y},c.jsx("a",{title:a,href:a,css:N},a)),c.jsx("td",{css:y},ea(e)),c.jsx("td",{css:O},g)))});var h=[];0<g.length&&h.push(g.length+" file"+(1===g.length?"":"s"));0<a.length&&h.push(a.length+" folder"+(1===a.length?"":"s"));return c.jsx(S,null,c.jsx(T,null,c.jsx("span",null,h.join(", "))),c.jsx("table",{css:{width:"100%",borderCollapse:"collapse",borderRadius:2,background:"#fff","@media (max-width: 700px)":{"& th + th + th + th, & td + td + td + td":{display:"none"}},
|
|
"& tr:first-of-type td":{borderTop:0}}},c.jsx("thead",null,c.jsx("tr",null,c.jsx("th",null,c.jsx(H,null,"Icon")),c.jsx("th",null,c.jsx(H,null,"Name")),c.jsx("th",null,c.jsx(H,null,"Size")),c.jsx("th",null,c.jsx(H,null,"Content Type")))),c.jsx("tbody",null,d)))}function Ba(a){a=a.split("/");return a[a.length-1]}function Ca(a){var b=a.uri;return c.jsx("div",{css:{padding:20,textAlign:"center"}},c.jsx("img",{alt:Ba(a.path),src:b}))}function Da(a){a=a.highlights.slice(0);var b=a.length&&""===a[a.length-
|
|
1];b&&a.pop();return c.jsx("div",{className:"code-listing",css:{overflowX:"auto",overflowY:"hidden",paddingTop:5,paddingBottom:5}},c.jsx("table",{css:{border:"none",borderCollapse:"collapse",borderSpacing:0}},c.jsx("tbody",null,a.map(function(a,b){var e=b+1;return c.jsx("tr",{key:b},c.jsx("td",{id:"L"+e,css:{paddingLeft:10,paddingRight:10,color:"rgba(27,31,35,.3)",textAlign:"right",verticalAlign:"top",width:"1%",minWidth:50,userSelect:"none"}},c.jsx("span",null,e)),c.jsx("td",{id:"LC"+e,css:{paddingLeft:10,
|
|
paddingRight:10,color:"#24292e",whiteSpace:"pre"}},c.jsx("code",{dangerouslySetInnerHTML:{__html:a}})))}),!b&&c.jsx("tr",{key:"no-newline"},c.jsx("td",{css:{paddingLeft:10,paddingRight:10,color:"rgba(27,31,35,.3)",textAlign:"right",verticalAlign:"top",width:"1%",minWidth:50,userSelect:"none"}},"\\"),c.jsx("td",{css:{paddingLeft:10,color:"rgba(27,31,35,.3)",userSelect:"none"}},"No newline at end of file")))))}function Ea(){return c.jsx("div",{css:{padding:20}},c.jsx("p",{css:{textAlign:"center"}},
|
|
"No preview available."))}function fa(a){var b=a.packageName,e=a.packageVersion,g=a.path;a=a.details;var d=a.highlights,h=a.uri,r=a.language;return c.jsx(S,null,c.jsx(T,null,c.jsx("span",null,ea(a.size)),c.jsx("span",null,r),c.jsx("span",null,c.jsx("a",{href:"/"+b+"@"+e+g,css:{display:"inline-block",marginLeft:8,padding:"2px 8px",textDecoration:"none",fontWeight:600,fontSize:"0.9rem",color:"#24292e",backgroundColor:"#eff3f6",border:"1px solid rgba(27,31,35,.2)",borderRadius:3,":hover":{backgroundColor:"#e6ebf1",
|
|
borderColor:"rgba(27,31,35,.35)"},":active":{backgroundColor:"#e9ecef",borderColor:"rgba(27,31,35,.35)",boxShadow:"inset 0 0.15em 0.3em rgba(27,31,35,.15)"}}},"View Raw"))),d?c.jsx(Da,{highlights:d}):h?c.jsx(Ca,{path:g,uri:h}):c.jsx(Ea,null))}function ha(){var a=Q(["\n .code-listing {\n background: #fbfdff;\n color: #383a42;\n }\n .code-comment,\n .code-quote {\n color: #a0a1a7;\n font-style: italic;\n }\n .code-doctag,\n .code-keyword,\n .code-link,\n .code-formula {\n color: #a626a4;\n }\n .code-section,\n .code-name,\n .code-selector-tag,\n .code-deletion,\n .code-subst {\n color: #e45649;\n }\n .code-literal {\n color: #0184bb;\n }\n .code-string,\n .code-regexp,\n .code-addition,\n .code-attribute,\n .code-meta-string {\n color: #50a14f;\n }\n .code-built_in,\n .code-class .code-title {\n color: #c18401;\n }\n .code-attr,\n .code-variable,\n .code-template-variable,\n .code-type,\n .code-selector-class,\n .code-selector-attr,\n .code-selector-pseudo,\n .code-number {\n color: #986801;\n }\n .code-symbol,\n .code-bullet,\n .code-meta,\n .code-selector-id,\n .code-title {\n color: #4078f2;\n }\n .code-emphasis {\n font-style: italic;\n }\n .code-strong {\n font-weight: bold;\n }\n"]);
|
|
ha=function(){return a};return a}function ia(){var a=Q(["\n html {\n box-sizing: border-box;\n }\n *,\n *:before,\n *:after {\n box-sizing: inherit;\n }\n\n html,\n body,\n #root {\n height: 100%;\n margin: 0;\n }\n\n body {\n ","\n font-size: 16px;\n line-height: 1.5;\n overflow-wrap: break-word;\n background: white;\n color: black;\n }\n\n code {\n ","\n }\n\n th,\n td {\n padding: 0;\n }\n\n select {\n font-size: inherit;\n }\n\n #root {\n display: flex;\n flex-direction: column;\n }\n"]);
|
|
ia=function(){return a};return a}function ja(a){var b=a.css;a=P(a,["css"]);return c.jsx("a",w({},a,{css:w({color:"#0076ff",textDecoration:"none",":hover":{textDecoration:"underline"}},b)}))}function Fa(){return c.jsx("header",{css:{marginTop:"2rem"}},c.jsx("h1",{css:{textAlign:"center",fontSize:"3rem",letterSpacing:"0.05em"}},c.jsx("a",{href:"/",css:{color:"#000",textDecoration:"none"}},"UNPKG")))}function Ga(a){var b=a.packageName,e=a.packageVersion,g=a.availableVersions;a=a.filename;var d=[];if("/"===
|
|
a)d.push(b);else{var h="/browse/"+b+"@"+e;d.push(c.jsx(ja,{href:h+"/"},b));b=a.replace(/^\/+/,"").replace(/\/+$/,"").split("/");a=b.pop();b.forEach(function(a){h+="/"+a;d.push(c.jsx(ja,{href:h+"/"},a))});d.push(a)}return c.jsx("header",{css:{display:"flex",flexDirection:"row",alignItems:"center","@media (max-width: 700px)":{flexDirection:"column-reverse",alignItems:"flex-start"}}},c.jsx("h1",{css:{fontSize:"1.5rem",fontWeight:"normal",flex:1,wordBreak:"break-all"}},c.jsx("nav",null,d.map(function(a,
|
|
b,e){return c.jsx(t.Fragment,{key:b},0!==b&&c.jsx("span",{css:{paddingLeft:5,paddingRight:5}},"/"),b===e.length-1?c.jsx("strong",null,a):a)}))),c.jsx(Ha,{packageVersion:e,availableVersions:g,onChange:function(a){window.location.href=window.location.href.replace("@"+e,"@"+a)}}))}function Ha(a){var b=a.onChange;return c.jsx("p",{css:{marginLeft:20,"@media (max-width: 700px)":{marginLeft:0,marginBottom:0}}},c.jsx("label",null,"Version:"," ",c.jsx("select",{name:"version",defaultValue:a.packageVersion,
|
|
onChange:function(a){b&&b(a.target.value)},css:{appearance:"none",cursor:"pointer",padding:"4px 24px 4px 8px",fontWeight:600,fontSize:"0.9em",color:"#24292e",border:"1px solid rgba(27,31,35,.2)",borderRadius:3,backgroundColor:"#eff3f6",backgroundImage:"url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAKCAYAAAC9vt6cAAAAAXNSR0IArs4c6QAAARFJREFUKBVjZAACNS39RhBNKrh17WI9o4quoT3Dn78HSNUMUs/CzOTI/O7Vi4dCYpJ3/jP+92BkYGAlyiBGhm8MjIxJt65e3MQM0vDu9YvLYmISILYZELOBxHABRkaGr0yMzF23r12YDFIDNgDEePv65SEhEXENBkYGFSAXuyGMjF8Z/jOsvX3tYiFIDwgwQSgIaaijnvj/P8M5IO8HsjiY/f//D4b//88A1SQhywG9jQr09PS4v/1mPAeUUPzP8B8cJowMjL+Bqu6xMQmaXL164AuyDgwDQJLa2qYSP//9vARkCoMVMzK8YeVkNbh+9uxzMB+JwGoASF5Vx0jz/98/18BqmZi171w9D2EjaaYKEwAEK00XQLdJuwAAAABJRU5ErkJggg==)",
|
|
backgroundPosition:"right 8px center",backgroundRepeat:"no-repeat",backgroundSize:"auto 25%",":hover":{backgroundColor:"#e6ebf1",borderColor:"rgba(27,31,35,.35)"},":active":{backgroundColor:"#e9ecef",borderColor:"rgba(27,31,35,.35)",boxShadow:"inset 0 0.15em 0.3em rgba(27,31,35,.15)"}}},a.availableVersions.map(function(a){return c.jsx("option",{key:a,value:a},a)}))))}function Ia(a){var b=a.packageName,e=a.packageVersion;a=a.target;return"directory"===a.type?c.jsx(ca,{path:a.path,details:a.details}):
|
|
"file"===a.type?c.jsx(fa,{packageName:b,packageVersion:e,path:a.path,details:a.details}):null}function ka(a){var b=a.packageName,e=a.packageVersion,g=a.availableVersions;g=void 0===g?[]:g;var d=a.filename;a=a.target;return c.jsx(t.Fragment,null,c.jsx(c.Global,{styles:Ja}),c.jsx(c.Global,{styles:Ka}),c.jsx("div",{css:{flex:"1 0 auto"}},c.jsx("div",{css:{maxWidth:940,padding:"0 20px",margin:"0 auto"}},c.jsx(Fa,null)),c.jsx("div",{css:{maxWidth:940,padding:"0 20px",margin:"0 auto"}},c.jsx(Ga,{packageName:b,
|
|
packageVersion:e,availableVersions:g,filename:d})),c.jsx("div",{css:{maxWidth:940,padding:"0 20px",margin:"0 auto","@media (max-width: 700px)":{padding:0,margin:0}}},c.jsx(Ia,{packageName:b,packageVersion:e,target:a}))),c.jsx("footer",{css:{marginTop:"5rem",background:"black",color:"#aaa"}},c.jsx("div",{css:{maxWidth:940,padding:"10px 20px",margin:"0 auto",display:"flex",flexDirection:"row",alignItems:"center",justifyContent:"space-between"}},c.jsx("p",null,c.jsx("span",null,"Build: ","a7ebffa")),
|
|
c.jsx("p",null,c.jsx("span",null,"\u00a9 ",(new Date).getFullYear()," UNPKG")),c.jsx("p",{css:{fontSize:"1.5rem"}},c.jsx("a",{href:"https://twitter.com/unpkg",css:{color:"#aaa",display:"inline-block",":hover":{color:"white"}}},c.jsx(za,null)),c.jsx("a",{href:"https://github.com/mjackson/unpkg",css:{color:"#aaa",display:"inline-block",":hover":{color:"white"},marginLeft:"1rem"}},c.jsx(Aa,null))))))}var la="default"in t?t["default"]:t;A=A&&A.hasOwnProperty("default")?A["default"]:A;var La="undefined"!==
|
|
typeof globalThis?globalThis:"undefined"!==typeof window?window:"undefined"!==typeof global?global:"undefined"!==typeof self?self:{},m=D(function(a,b){function c(a){if("object"===typeof a&&null!==a){var b=a.$$typeof;switch(b){case d:switch(a=a.type,a){case l:case f:case r:case m:case k:case v:return a;default:switch(a=a&&a.$$typeof,a){case p:case n:case q:return a;default:return b}}case x:case u:case h:return b}}}function g(a){return c(a)===f}Object.defineProperty(b,"__esModule",{value:!0});var d=
|
|
(a="function"===typeof Symbol&&Symbol.for)?Symbol.for("react.element"):60103,h=a?Symbol.for("react.portal"):60106,r=a?Symbol.for("react.fragment"):60107,k=a?Symbol.for("react.strict_mode"):60108,m=a?Symbol.for("react.profiler"):60114,q=a?Symbol.for("react.provider"):60109,p=a?Symbol.for("react.context"):60110,l=a?Symbol.for("react.async_mode"):60111,f=a?Symbol.for("react.concurrent_mode"):60111,n=a?Symbol.for("react.forward_ref"):60112,v=a?Symbol.for("react.suspense"):60113,u=a?Symbol.for("react.memo"):
|
|
60115,x=a?Symbol.for("react.lazy"):60116;b.typeOf=c;b.AsyncMode=l;b.ConcurrentMode=f;b.ContextConsumer=p;b.ContextProvider=q;b.Element=d;b.ForwardRef=n;b.Fragment=r;b.Lazy=x;b.Memo=u;b.Portal=h;b.Profiler=m;b.StrictMode=k;b.Suspense=v;b.isValidElementType=function(a){return"string"===typeof a||"function"===typeof a||a===r||a===f||a===m||a===k||a===v||"object"===typeof a&&null!==a&&(a.$$typeof===x||a.$$typeof===u||a.$$typeof===q||a.$$typeof===p||a.$$typeof===n)};b.isAsyncMode=function(a){return g(a)||
|
|
c(a)===l};b.isConcurrentMode=g;b.isContextConsumer=function(a){return c(a)===p};b.isContextProvider=function(a){return c(a)===q};b.isElement=function(a){return"object"===typeof a&&null!==a&&a.$$typeof===d};b.isForwardRef=function(a){return c(a)===n};b.isFragment=function(a){return c(a)===r};b.isLazy=function(a){return c(a)===x};b.isMemo=function(a){return c(a)===u};b.isPortal=function(a){return c(a)===h};b.isProfiler=function(a){return c(a)===m};b.isStrictMode=function(a){return c(a)===k};b.isSuspense=
|
|
function(a){return c(a)===v}});R(m);var na=D(function(a,b){(function(){function a(a){if("object"===typeof a&&null!==a){var b=a.$$typeof;switch(b){case h:switch(a=a.type,a){case f:case n:case k:case q:case m:case u:return a;default:switch(a=a&&a.$$typeof,a){case l:case v:case p:return a;default:return b}}case I:case x:case r:return b}}}function c(b){return a(b)===n}Object.defineProperty(b,"__esModule",{value:!0});var d="function"===typeof Symbol&&Symbol.for,h=d?Symbol.for("react.element"):60103,r=
|
|
d?Symbol.for("react.portal"):60106,k=d?Symbol.for("react.fragment"):60107,m=d?Symbol.for("react.strict_mode"):60108,q=d?Symbol.for("react.profiler"):60114,p=d?Symbol.for("react.provider"):60109,l=d?Symbol.for("react.context"):60110,f=d?Symbol.for("react.async_mode"):60111,n=d?Symbol.for("react.concurrent_mode"):60111,v=d?Symbol.for("react.forward_ref"):60112,u=d?Symbol.for("react.suspense"):60113,x=d?Symbol.for("react.memo"):60115,I=d?Symbol.for("react.lazy"):60116;d=function(){};var Ma=function(a){for(var b=
|
|
arguments.length,f=Array(1<b?b-1:0),c=1;c<b;c++)f[c-1]=arguments[c];var n=0;b="Warning: "+a.replace(/%s/g,function(){return f[n++]});"undefined"!==typeof console&&console.warn(b);try{throw Error(b);}catch(Xa){}},Na=d=function(a,b){if(void 0===b)throw Error("`lowPriorityWarning(condition, format, ...args)` requires a warning message argument");if(!a){for(var f=arguments.length,c=Array(2<f?f-2:0),n=2;n<f;n++)c[n-2]=arguments[n];Ma.apply(void 0,[b].concat(c))}},ma=!1;b.typeOf=a;b.AsyncMode=f;b.ConcurrentMode=
|
|
n;b.ContextConsumer=l;b.ContextProvider=p;b.Element=h;b.ForwardRef=v;b.Fragment=k;b.Lazy=I;b.Memo=x;b.Portal=r;b.Profiler=q;b.StrictMode=m;b.Suspense=u;b.isValidElementType=function(a){return"string"===typeof a||"function"===typeof a||a===k||a===n||a===q||a===m||a===u||"object"===typeof a&&null!==a&&(a.$$typeof===I||a.$$typeof===x||a.$$typeof===p||a.$$typeof===l||a.$$typeof===v)};b.isAsyncMode=function(b){ma||(ma=!0,Na(!1,"The ReactIs.isAsyncMode() alias has been deprecated, and will be removed in React 17+. Update your code to use ReactIs.isConcurrentMode() instead. It has the exact same API."));
|
|
return c(b)||a(b)===f};b.isConcurrentMode=c;b.isContextConsumer=function(b){return a(b)===l};b.isContextProvider=function(b){return a(b)===p};b.isElement=function(a){return"object"===typeof a&&null!==a&&a.$$typeof===h};b.isForwardRef=function(b){return a(b)===v};b.isFragment=function(b){return a(b)===k};b.isLazy=function(b){return a(b)===I};b.isMemo=function(b){return a(b)===x};b.isPortal=function(b){return a(b)===r};b.isProfiler=function(b){return a(b)===q};b.isStrictMode=function(b){return a(b)===
|
|
m};b.isSuspense=function(b){return a(b)===u}})()});R(na);var oa=D(function(a){a.exports=na}),pa=Object.getOwnPropertySymbols,Oa=Object.prototype.hasOwnProperty,Pa=Object.prototype.propertyIsEnumerable,Qa=function(){try{if(!Object.assign)return!1;var a=new String("abc");a[5]="de";if("5"===Object.getOwnPropertyNames(a)[0])return!1;var b={};for(a=0;10>a;a++)b["_"+String.fromCharCode(a)]=a;if("0123456789"!==Object.getOwnPropertyNames(b).map(function(a){return b[a]}).join(""))return!1;var c={};"abcdefghijklmnopqrst".split("").forEach(function(a){c[a]=
|
|
a});return"abcdefghijklmnopqrst"!==Object.keys(Object.assign({},c)).join("")?!1:!0}catch(g){return!1}}()?Object.assign:function(a,b){if(null===a||void 0===a)throw new TypeError("Object.assign cannot be called with null or undefined");var c=Object(a);for(var g,d=1;d<arguments.length;d++){var h=Object(arguments[d]);for(var r in h)Oa.call(h,r)&&(c[r]=h[r]);if(pa){g=pa(h);for(var k=0;k<g.length;k++)Pa.call(h,g[k])&&(c[g[k]]=h[g[k]])}}return c},K=function(){},L={},ua=Function.call.bind(Object.prototype.hasOwnProperty);
|
|
K=function(a){a="Warning: "+a;"undefined"!==typeof console&&console.error(a);try{throw Error(a);}catch(b){}};J.resetWarningCache=function(){L={}};var Ra=Function.call.bind(Object.prototype.hasOwnProperty),C=function(){};C=function(a){a="Warning: "+a;"undefined"!==typeof console&&console.error(a);try{throw Error(a);}catch(b){}};var Sa=function(a,b){function c(a,b){return a===b?0!==a||1/a===1/b:a!==a&&b!==b}function g(a){this.message=a;this.stack=""}function d(a){function c(c,n,v,d,e,u,h){d=d||"<<anonymous>>";
|
|
u=u||v;if("SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"!==h){if(b)throw c=Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use `PropTypes.checkPropTypes()` to call them. Read more at http://fb.me/use-check-prop-types"),c.name="Invariant Violation",c;"undefined"!==typeof console&&(h=d+":"+v,!f[h]&&3>l&&(C("You are manually calling a React.PropTypes validation function for the `"+u+"` prop on `"+d+"`. This is deprecated and will throw in the standalone `prop-types` package. You may be seeing this warning due to a third-party PropTypes library. See https://fb.me/react-warning-dont-call-proptypes for details."),
|
|
f[h]=!0,l++))}return null==n[v]?c?null===n[v]?new g("The "+e+" `"+u+"` is marked as required "+("in `"+d+"`, but its value is `null`.")):new g("The "+e+" `"+u+"` is marked as required in "+("`"+d+"`, but its value is `undefined`.")):null:a(n,v,d,e,u)}var f={},l=0,d=c.bind(null,!1);d.isRequired=c.bind(null,!0);return d}function h(a){return d(function(b,c,f,d,l,e){b=b[c];return k(b)!==a?(b=m(b),new g("Invalid "+d+" `"+l+"` of type "+("`"+b+"` supplied to `"+f+"`, expected ")+("`"+a+"`."))):null})}function r(b){switch(typeof b){case "number":case "string":case "undefined":return!0;
|
|
case "boolean":return!b;case "object":if(Array.isArray(b))return b.every(r);if(null===b||a(b))return!0;var c=b&&(p&&b[p]||b["@@iterator"]);var f="function"===typeof c?c:void 0;if(f)if(c=f.call(b),f!==b.entries)for(;!(b=c.next()).done;){if(!r(b.value))return!1}else for(;!(b=c.next()).done;){if((b=b.value)&&!r(b[1]))return!1}else return!1;return!0;default:return!1}}function k(a){var b=typeof a;return Array.isArray(a)?"array":a instanceof RegExp?"object":"symbol"===b||a&&("Symbol"===a["@@toStringTag"]||
|
|
"function"===typeof Symbol&&a instanceof Symbol)?"symbol":b}function m(a){if("undefined"===typeof a||null===a)return""+a;var b=k(a);if("object"===b){if(a instanceof Date)return"date";if(a instanceof RegExp)return"regexp"}return b}function q(a){a=m(a);switch(a){case "array":case "object":return"an "+a;case "boolean":case "date":case "regexp":return"a "+a;default:return a}}var p="function"===typeof Symbol&&Symbol.iterator,l={array:h("array"),bool:h("boolean"),func:h("function"),number:h("number"),object:h("object"),
|
|
string:h("string"),symbol:h("symbol"),any:d(G),arrayOf:function(a){return d(function(b,c,f,d,l){if("function"!==typeof a)return new g("Property `"+l+"` of component `"+f+"` has invalid PropType notation inside arrayOf.");b=b[c];if(!Array.isArray(b))return b=k(b),new g("Invalid "+d+" `"+l+"` of type "+("`"+b+"` supplied to `"+f+"`, expected an array."));for(c=0;c<b.length;c++){var n=a(b,c,f,d,l+"["+c+"]","SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED");if(n instanceof Error)return n}return null})},
|
|
element:function(){return d(function(b,c,d,l,e){b=b[c];return a(b)?null:(b=k(b),new g("Invalid "+l+" `"+e+"` of type "+("`"+b+"` supplied to `"+d+"`, expected a single ReactElement.")))})}(),elementType:function(){return d(function(a,b,c,d,l){a=a[b];return oa.isValidElementType(a)?null:(a=k(a),new g("Invalid "+d+" `"+l+"` of type "+("`"+a+"` supplied to `"+c+"`, expected a single ReactElement type.")))})}(),instanceOf:function(a){return d(function(b,c,f,d,l){if(!(b[c]instanceof a)){var n=a.name||
|
|
"<<anonymous>>";b=b[c];b=b.constructor&&b.constructor.name?b.constructor.name:"<<anonymous>>";return new g("Invalid "+d+" `"+l+"` of type "+("`"+b+"` supplied to `"+f+"`, expected ")+("instance of `"+n+"`."))}return null})},node:function(){return d(function(a,b,c,d,l){return r(a[b])?null:new g("Invalid "+d+" `"+l+"` supplied to "+("`"+c+"`, expected a ReactNode."))})}(),objectOf:function(a){return d(function(b,c,f,d,l){if("function"!==typeof a)return new g("Property `"+l+"` of component `"+f+"` has invalid PropType notation inside objectOf.");
|
|
b=b[c];c=k(b);if("object"!==c)return new g("Invalid "+d+" `"+l+"` of type "+("`"+c+"` supplied to `"+f+"`, expected an object."));for(var n in b)if(Ra(b,n)&&(c=a(b,n,f,d,l+"."+n,"SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"),c instanceof Error))return c;return null})},oneOf:function(a){return Array.isArray(a)?d(function(b,f,d,l,e){b=b[f];for(f=0;f<a.length;f++)if(c(b,a[f]))return null;f=JSON.stringify(a,function(a,b){return"symbol"===m(b)?String(b):b});return new g("Invalid "+l+" `"+e+"` of value `"+
|
|
String(b)+"` "+("supplied to `"+d+"`, expected one of "+f+"."))}):(1<arguments.length?C("Invalid arguments supplied to oneOf, expected an array, got "+arguments.length+" arguments. A common mistake is to write oneOf(x, y, z) instead of oneOf([x, y, z])."):C("Invalid argument supplied to oneOf, expected an array."),G)},oneOfType:function(a){if(!Array.isArray(a))return C("Invalid argument supplied to oneOfType, expected an instance of array."),G;for(var b=0;b<a.length;b++){var c=a[b];if("function"!==
|
|
typeof c)return C("Invalid argument supplied to oneOfType. Expected an array of check functions, but received "+q(c)+" at index "+b+"."),G}return d(function(b,c,f,d,l){for(var e=0;e<a.length;e++)if(null==(0,a[e])(b,c,f,d,l,"SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"))return null;return new g("Invalid "+d+" `"+l+"` supplied to "+("`"+f+"`."))})},shape:function(a){return d(function(b,c,d,l,f){b=b[c];c=k(b);if("object"!==c)return new g("Invalid "+l+" `"+f+"` of type `"+c+"` "+("supplied to `"+d+"`, expected `object`."));
|
|
for(var e in a)if(c=a[e])if(c=c(b,e,d,l,f+"."+e,"SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"))return c;return null})},exact:function(a){return d(function(b,c,d,l,f){var e=b[c],n=k(e);if("object"!==n)return new g("Invalid "+l+" `"+f+"` of type `"+n+"` "+("supplied to `"+d+"`, expected `object`."));n=Qa({},b[c],a);for(var h in n){n=a[h];if(!n)return new g("Invalid "+l+" `"+f+"` key `"+h+"` supplied to `"+d+"`.\nBad object: "+JSON.stringify(b[c],null," ")+"\nValid keys: "+JSON.stringify(Object.keys(a),
|
|
null," "));if(n=n(e,h,d,l,f+"."+h,"SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"))return n}return null})}};g.prototype=Error.prototype;l.checkPropTypes=J;l.resetWarningCache=J.resetWarningCache;return l.PropTypes=l};m=D(function(a){a.exports=Sa(oa.isElement,!0)});var Ta=Object.assign||function(a){for(var b=1;b<arguments.length;b++){var c=arguments[b],g;for(g in c)Object.prototype.hasOwnProperty.call(c,g)&&(a[g]=c[g])}return a},Ua={border:0,clip:"rect(0 0 0 0)",height:"1px",width:"1px",margin:"-1px",
|
|
padding:0,overflow:"hidden",position:"absolute"},H=function(a){return la.createElement("div",Ta({style:Ua},a))},qa=D(function(a){(function(b,c){a.exports=c()})(La,function(){function a(a){if(!a)return!0;if(!d(a)||0!==a.length)for(var b in a)if(q.call(a,b))return!1;return!0}function c(a){return"number"===typeof a||"[object Number]"===t.call(a)}function g(a){return"string"===typeof a||"[object String]"===t.call(a)}function d(a){return"object"===typeof a&&"number"===typeof a.length&&"[object Array]"===
|
|
t.call(a)}function h(a){var b=parseInt(a);return b.toString()===a?b:a}function m(b,d,e,k){c(d)&&(d=[d]);if(a(d))return b;if(g(d))return m(b,d.split("."),e,k);var f=h(d[0]);if(1===d.length)return d=b[f],void 0!==d&&k||(b[f]=e),d;void 0===b[f]&&(c(f)?b[f]=[]:b[f]={});return m(b[f],d.slice(1),e,k)}function k(b,f){c(f)&&(f=[f]);if(!a(b)){if(a(f))return b;if(g(f))return k(b,f.split("."));var e=h(f[0]),l=b[e];if(1===f.length)void 0!==l&&(d(b)?b.splice(e,1):delete b[e]);else if(void 0!==b[e])return k(b[e],
|
|
f.slice(1));return b}}var t=Object.prototype.toString,q=Object.prototype.hasOwnProperty,p={ensureExists:function(a,b,c){return m(a,b,c,!0)},set:function(a,b,c,d){return m(a,b,c,d)},insert:function(a,b,c,e){var f=p.get(a,b);e=~~e;d(f)||(f=[],p.set(a,b,f));f.splice(e,0,c)},empty:function(b,f){if(a(f))return b;if(!a(b)){var e,h;if(!(e=p.get(b,f)))return b;if(g(e))return p.set(b,f,"");if("boolean"===typeof e||"[object Boolean]"===t.call(e))return p.set(b,f,!1);if(c(e))return p.set(b,f,0);if(d(e))e.length=
|
|
0;else if("object"===typeof e&&"[object Object]"===t.call(e))for(h in e)q.call(e,h)&&delete e[h];else return p.set(b,f,null)}},push:function(a,b){var c=p.get(a,b);d(c)||(c=[],p.set(a,b,c));c.push.apply(c,Array.prototype.slice.call(arguments,2))},coalesce:function(a,b,c){for(var d,e=0,f=b.length;e<f;e++)if(void 0!==(d=p.get(a,b[e])))return d;return c},get:function(b,d,e){c(d)&&(d=[d]);if(a(d))return b;if(a(b))return e;if(g(d))return p.get(b,d.split("."),e);var f=h(d[0]);return 1===d.length?void 0===
|
|
b[f]?e:b[f]:p.get(b[f],d.slice(1),e)},del:function(a,b){return k(a,b)}};return p})});var ra=function(a){return function(b){return typeof b===a}};var Va=function(a,b){var c=1,g=b||function(a,b){return b};"-"===a[0]&&(c=-1,a=a.substr(1));return function(b,e){var d;b=g(a,qa.get(b,a));e=g(a,qa.get(e,a));b<e&&(d=-1);b>e&&(d=1);b===e&&(d=0);return d*c}};var da=function(){var a=Array.prototype.slice.call(arguments),b=a.filter(ra("string")),c=a.filter(ra("function"))[0];return function(a,d){for(var e=b.length,
|
|
g=0,k=0;0===g&&k<e;)g=Va(b[k],c)(a,d),k++;return g}};let sa="B kB MB GB TB PB EB ZB YB".split(" "),ta=(a,b)=>{let c=a;"string"===typeof b?c=a.toLocaleString(b):!0===b&&(c=a.toLocaleString());return c};var ea=(a,b)=>{if(!Number.isFinite(a))throw new TypeError(`Expected a finite number, got ${typeof a}: ${a}`);b=Object.assign({},b);if(b.signed&&0===a)return" 0 B";var c=0>a;let g=c?"-":b.signed?"+":"";c&&(a=-a);if(1>a)return a=ta(a,b.locale),g+a+" B";c=Math.min(Math.floor(Math.log10(a)/3),sa.length-
|
|
1);a=Number((a/Math.pow(1E3,c)).toPrecision(3));a=ta(a,b.locale);return g+a+" "+sa[c]},W={color:void 0,size:void 0,className:void 0,style:void 0,attr:void 0},V=t.createContext&&t.createContext(W),z=function(){z=Object.assign||function(a){for(var b,c=1,g=arguments.length;c<g;c++){b=arguments[c];for(var d in b)Object.prototype.hasOwnProperty.call(b,d)&&(a[d]=b[d])}return a};return z.apply(this,arguments)},Y=function(a){return E({tag:"svg",attr:{viewBox:"0 0 12 16"},child:[{tag:"path",attr:{fillRule:"evenodd",
|
|
d:"M8.5 1H1c-.55 0-1 .45-1 1v12c0 .55.45 1 1 1h10c.55 0 1-.45 1-1V4.5L8.5 1zM11 14H1V2h7l3 3v9zM5 6.98L3.5 8.5 5 10l-.5 1L2 8.5 4.5 6l.5.98zM7.5 6L10 8.5 7.5 11l-.5-.98L8.5 8.5 7 7l.5-1z"}}]})(a)};Y.displayName="GoFileCode";var Z=function(a){return E({tag:"svg",attr:{viewBox:"0 0 14 16"},child:[{tag:"path",attr:{fillRule:"evenodd",d:"M13 4H7V3c0-.66-.31-1-1-1H1c-.55 0-1 .45-1 1v10c0 .55.45 1 1 1h12c.55 0 1-.45 1-1V5c0-.55-.45-1-1-1zM6 4H1V3h5v1z"}}]})(a)};Z.displayName="GoFileDirectory";var X=function(a){return E({tag:"svg",
|
|
attr:{viewBox:"0 0 12 16"},child:[{tag:"path",attr:{fillRule:"evenodd",d:"M6 5H2V4h4v1zM2 8h7V7H2v1zm0 2h7V9H2v1zm0 2h7v-1H2v1zm10-7.5V14c0 .55-.45 1-1 1H1c-.55 0-1-.45-1-1V2c0-.55.45-1 1-1h7.5L12 4.5zM11 5L8 2H1v12h10V5z"}}]})(a)};X.displayName="GoFile";var ba=function(a){return E({tag:"svg",attr:{viewBox:"0 0 496 512"},child:[{tag:"path",attr:{d:"M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3.3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5.3-6.2 2.3zm44.2-1.7c-2.9.7-4.9 2.6-4.6 4.9.3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3.7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3.3 2.9 2.3 3.9 1.6 1 3.6.7 4.3-.7.7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3.7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3.7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z"}}]})(a)};
|
|
ba.displayName="FaGithub";var aa=function(a){return E({tag:"svg",attr:{viewBox:"0 0 512 512"},child:[{tag:"path",attr:{d:"M459.37 151.716c.325 4.548.325 9.097.325 13.645 0 138.72-105.583 298.558-298.558 298.558-59.452 0-114.68-17.219-161.137-47.106 8.447.974 16.568 1.299 25.34 1.299 49.055 0 94.213-16.568 130.274-44.832-46.132-.975-84.792-31.188-98.112-72.772 6.498.974 12.995 1.624 19.818 1.624 9.421 0 18.843-1.3 27.614-3.573-48.081-9.747-84.143-51.98-84.143-102.985v-1.299c13.969 7.797 30.214 12.67 47.431 13.319-28.264-18.843-46.781-51.005-46.781-87.391 0-19.492 5.197-37.36 14.294-52.954 51.655 63.675 129.3 105.258 216.365 109.807-1.624-7.797-2.599-15.918-2.599-24.04 0-57.828 46.782-104.934 104.934-104.934 30.213 0 57.502 12.67 76.67 33.137 23.715-4.548 46.456-13.32 66.599-25.34-7.798 24.366-24.366 44.833-46.132 57.827 21.117-2.273 41.584-8.122 60.426-16.243-14.292 20.791-32.161 39.308-52.628 54.253z"}}]})(a)};
|
|
aa.displayName="FaTwitter";var N={color:"#0076ff",textDecoration:"none",":hover":{textDecoration:"underline"}},y={paddingTop:6,paddingRight:3,paddingBottom:6,paddingLeft:3,borderTop:"1px solid #eaecef"},M=w({},y,{color:"#424242",width:17,paddingRight:2,paddingLeft:10,"@media (max-width: 700px)":{paddingLeft:20}}),O=w({},y,{textAlign:"right",paddingRight:10,"@media (max-width: 700px)":{paddingRight:20}});ca.propTypes={path:m.string.isRequired,details:m.objectOf(m.shape({path:m.string.isRequired,type:m.oneOf(["directory",
|
|
"file"]).isRequired,contentType:m.string,integrity:m.string,size:m.number})).isRequired};fa.propTypes={path:m.string.isRequired,details:m.shape({contentType:m.string.isRequired,highlights:m.arrayOf(m.string),uri:m.string,integrity:m.string.isRequired,language:m.string.isRequired,size:m.number.isRequired}).isRequired};var Ja=c.css(ia(),'\nfont-family: -apple-system,\n BlinkMacSystemFont,\n "Segoe UI",\n "Roboto",\n "Oxygen",\n "Ubuntu",\n "Cantarell",\n "Fira Sans",\n "Droid Sans",\n "Helvetica Neue",\n sans-serif;\n',
|
|
"\nfont-family: Menlo,\n Monaco,\n Lucida Console,\n Liberation Mono,\n DejaVu Sans Mono,\n Bitstream Vera Sans Mono,\n Courier New,\n monospace;\n"),Ka=c.css(ha()),Wa=m.shape({path:m.string.isRequired,type:m.oneOf(["directory","file"]).isRequired,details:m.object.isRequired});ka.propTypes={packageName:m.string.isRequired,packageVersion:m.string.isRequired,availableVersions:m.arrayOf(m.string),filename:m.string.isRequired,target:Wa.isRequired};A.hydrate(la.createElement(ka,window.__DATA__||
|
|
{}),document.getElementById("root"))})(React,ReactDOM,emotionCore);
|
|
</script></body></html>
|