FirstPersonControls.js 6.5 KB
Newer Older
C
Chris Killpack 已提交
1 2 3 4 5 6
/**
 * @author mrdoob / http://mrdoob.com/
 * @author alteredq / http://alteredqualia.com/
 * @author paulirish / http://paulirish.com/
 */

7
THREE.FirstPersonControls = function ( object, domElement ) {
C
Chris Killpack 已提交
8

9
	this.object = object;
10
	this.target = new THREE.Vector3( 0, 0, 0 );
M
Mr.doob 已提交
11

12 13
	this.domElement = ( domElement !== undefined ) ? domElement : document;

C
Chris Killpack 已提交
14 15 16 17 18 19
	this.movementSpeed = 1.0;
	this.lookSpeed = 0.005;

	this.noFly = false;
	this.lookVertical = true;
	this.autoForward = false;
20
	// this.invertVertical = false;
C
Chris Killpack 已提交
21 22 23 24 25 26 27 28 29

	this.activeLook = true;

	this.heightSpeed = false;
	this.heightCoef = 1.0;
	this.heightMin = 0.0;

	this.constrainVertical = false;
	this.verticalMin = 0;
B
Bc. Jan Kaláb 已提交
30
	this.verticalMax = Math.PI;
C
Chris Killpack 已提交
31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49

	this.autoSpeedFactor = 0.0;

	this.mouseX = 0;
	this.mouseY = 0;

	this.lat = 0;
	this.lon = 0;
	this.phi = 0;
	this.theta = 0;

	this.moveForward = false;
	this.moveBackward = false;
	this.moveLeft = false;
	this.moveRight = false;
	this.freeze = false;

	this.mouseDragOn = false;

50 51
	this.viewHalfX = 0;
	this.viewHalfY = 0;
52

53
	if ( this.domElement !== document ) {
54

55
		this.domElement.setAttribute( 'tabindex', -1 );
56

57
	}
C
Chris Killpack 已提交
58

59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76
	//

	this.handleResize = function () {

		if ( this.domElement === document ) {

			this.viewHalfX = window.innerWidth / 2;
			this.viewHalfY = window.innerHeight / 2;

		} else {

			this.viewHalfX = this.domElement.offsetWidth / 2;
			this.viewHalfY = this.domElement.offsetHeight / 2;

		}

	};

C
Chris Killpack 已提交
77 78
	this.onMouseDown = function ( event ) {

79
		if ( this.domElement !== document ) {
80

81
			this.domElement.focus();
82

83
		}
84

C
Chris Killpack 已提交
85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124
		event.preventDefault();
		event.stopPropagation();

		if ( this.activeLook ) {

			switch ( event.button ) {

				case 0: this.moveForward = true; break;
				case 2: this.moveBackward = true; break;

			}

		}

		this.mouseDragOn = true;

	};

	this.onMouseUp = function ( event ) {

		event.preventDefault();
		event.stopPropagation();

		if ( this.activeLook ) {

			switch ( event.button ) {

				case 0: this.moveForward = false; break;
				case 2: this.moveBackward = false; break;

			}

		}

		this.mouseDragOn = false;

	};

	this.onMouseMove = function ( event ) {

125
		if ( this.domElement === document ) {
126

127 128
			this.mouseX = event.pageX - this.viewHalfX;
			this.mouseY = event.pageY - this.viewHalfY;
129

130
		} else {
131

132 133
			this.mouseX = event.pageX - this.domElement.offsetLeft - this.viewHalfX;
			this.mouseY = event.pageY - this.domElement.offsetTop - this.viewHalfY;
134

135
		}
C
Chris Killpack 已提交
136 137 138 139 140

	};

	this.onKeyDown = function ( event ) {

141
		//event.preventDefault();
142 143

		switch ( event.keyCode ) {
C
Chris Killpack 已提交
144 145

			case 38: /*up*/
146
			case 87: /*W*/ this.moveForward = true; break;
C
Chris Killpack 已提交
147 148

			case 37: /*left*/
149
			case 65: /*A*/ this.moveLeft = true; break;
C
Chris Killpack 已提交
150 151

			case 40: /*down*/
152
			case 83: /*S*/ this.moveBackward = true; break;
C
Chris Killpack 已提交
153 154

			case 39: /*right*/
155
			case 68: /*D*/ this.moveRight = true; break;
C
Chris Killpack 已提交
156

157 158
			case 82: /*R*/ this.moveUp = true; break;
			case 70: /*F*/ this.moveDown = true; break;
159

160
			case 81: /*Q*/ this.freeze = !this.freeze; break;
C
Chris Killpack 已提交
161 162 163 164 165 166 167 168 169 170

		}

	};

	this.onKeyUp = function ( event ) {

		switch( event.keyCode ) {

			case 38: /*up*/
171
			case 87: /*W*/ this.moveForward = false; break;
C
Chris Killpack 已提交
172 173

			case 37: /*left*/
174
			case 65: /*A*/ this.moveLeft = false; break;
C
Chris Killpack 已提交
175 176

			case 40: /*down*/
177
			case 83: /*S*/ this.moveBackward = false; break;
C
Chris Killpack 已提交
178 179

			case 39: /*right*/
180
			case 68: /*D*/ this.moveRight = false; break;
C
Chris Killpack 已提交
181

182 183
			case 82: /*R*/ this.moveUp = false; break;
			case 70: /*F*/ this.moveDown = false; break;
184

C
Chris Killpack 已提交
185 186 187 188
		}

	};

189
	this.update = function( delta ) {
190
		var actualMoveSpeed = 0;
191

Z
zz85 已提交
192
		if ( this.freeze ) {
193

Z
zz85 已提交
194
			return;
195

Z
zz85 已提交
196
		} else {
C
Chris Killpack 已提交
197 198 199

			if ( this.heightSpeed ) {

200 201
				var y = THREE.Math.clamp( this.object.position.y, this.heightMin, this.heightMax );
				var heightDelta = y - this.heightMin;
C
Chris Killpack 已提交
202

203
				this.autoSpeedFactor = delta * ( heightDelta * this.heightCoef );
C
Chris Killpack 已提交
204 205 206 207 208 209 210

			} else {

				this.autoSpeedFactor = 0.0;

			}

211
			actualMoveSpeed = delta * this.movementSpeed;
C
Chris Killpack 已提交
212

213 214
			if ( this.moveForward || ( this.autoForward && !this.moveBackward ) ) this.object.translateZ( - ( actualMoveSpeed + this.autoSpeedFactor ) );
			if ( this.moveBackward ) this.object.translateZ( actualMoveSpeed );
215

216 217
			if ( this.moveLeft ) this.object.translateX( - actualMoveSpeed );
			if ( this.moveRight ) this.object.translateX( actualMoveSpeed );
C
Chris Killpack 已提交
218

219 220
			if ( this.moveUp ) this.object.translateY( actualMoveSpeed );
			if ( this.moveDown ) this.object.translateY( - actualMoveSpeed );
221

222
			var actualLookSpeed = delta * this.lookSpeed;
C
Chris Killpack 已提交
223 224 225 226 227 228 229 230

			if ( !this.activeLook ) {

				actualLookSpeed = 0;

			}

			this.lon += this.mouseX * actualLookSpeed;
231
			if( this.lookVertical ) this.lat -= this.mouseY * actualLookSpeed; // * this.invertVertical?-1:1;
C
Chris Killpack 已提交
232 233 234 235 236

			this.lat = Math.max( - 85, Math.min( 85, this.lat ) );
			this.phi = ( 90 - this.lat ) * Math.PI / 180;
			this.theta = this.lon * Math.PI / 180;

237 238
			var targetPosition = this.target,
				position = this.object.position;
C
Chris Killpack 已提交
239 240 241 242 243 244 245

			targetPosition.x = position.x + 100 * Math.sin( this.phi ) * Math.cos( this.theta );
			targetPosition.y = position.y + 100 * Math.cos( this.phi );
			targetPosition.z = position.z + 100 * Math.sin( this.phi ) * Math.sin( this.theta );

		}

246 247 248 249
		var verticalLookRatio = 1;

		if ( this.constrainVertical ) {

B
Bc. Jan Kaláb 已提交
250
			verticalLookRatio = Math.PI / ( this.verticalMax - this.verticalMin );
251 252 253

		}

C
Chris Killpack 已提交
254
		this.lon += this.mouseX * actualLookSpeed;
255
		if( this.lookVertical ) this.lat -= this.mouseY * actualLookSpeed * verticalLookRatio;
C
Chris Killpack 已提交
256 257 258

		this.lat = Math.max( - 85, Math.min( 85, this.lat ) );
		this.phi = ( 90 - this.lat ) * Math.PI / 180;
259

C
Chris Killpack 已提交
260 261 262 263
		this.theta = this.lon * Math.PI / 180;

		if ( this.constrainVertical ) {

264
			this.phi = THREE.Math.mapLinear( this.phi, 0, Math.PI, this.verticalMin, this.verticalMax );
C
Chris Killpack 已提交
265 266 267

		}

268 269
		var targetPosition = this.target,
			position = this.object.position;
C
Chris Killpack 已提交
270 271 272 273 274

		targetPosition.x = position.x + 100 * Math.sin( this.phi ) * Math.cos( this.theta );
		targetPosition.y = position.y + 100 * Math.cos( this.phi );
		targetPosition.z = position.z + 100 * Math.sin( this.phi ) * Math.sin( this.theta );

275
		this.object.lookAt( targetPosition );
C
Chris Killpack 已提交
276 277 278 279 280 281 282 283 284 285 286 287 288 289 290 291 292 293 294 295 296 297

	};


	this.domElement.addEventListener( 'contextmenu', function ( event ) { event.preventDefault(); }, false );

	this.domElement.addEventListener( 'mousemove', bind( this, this.onMouseMove ), false );
	this.domElement.addEventListener( 'mousedown', bind( this, this.onMouseDown ), false );
	this.domElement.addEventListener( 'mouseup', bind( this, this.onMouseUp ), false );
	this.domElement.addEventListener( 'keydown', bind( this, this.onKeyDown ), false );
	this.domElement.addEventListener( 'keyup', bind( this, this.onKeyUp ), false );

	function bind( scope, fn ) {

		return function () {

			fn.apply( scope, arguments );

		};

	};

298 299
	this.handleResize();

C
Chris Killpack 已提交
300
};