Adds EventDispatcher and change event to DeviceOrientationControls and FlyControls

examples/jsm/controls/DeviceOrientationControls.d.ts

@@ -1,8 +1,6 @@
-import {
-	Camera
-} from '../../../src/Three';
+import { Camera, EventDispatcher } from "../../../src/Three";
 
-export class DeviceOrientationControls {
+export class DeviceOrientationControls extends EventDispatcher {
 
 	constructor( object: Camera );
 

examples/jsm/controls/DeviceOrientationControls.js

@@ -5,12 +5,7 @@
  * W3C Device Orientation control (http://w3c.github.io/deviceorientation/spec-source-orientation.html)
  */
 
-import {
-	Euler,
-	MathUtils,
-	Quaternion,
-	Vector3
-} from "../../../build/three.module.js";
+import { EventDispatcher, Euler, MathUtils, Quaternion, Vector3 } from '../../../build/three.module.js';
 
 var DeviceOrientationControls = function ( object ) {
 
@@ -26,6 +21,10 @@ var DeviceOrientationControls = function ( object ) {
 
 	this.alphaOffset = 0; // radians
 
+	var changeEvent = { type: 'change' };
+
+	var EPS = 0.000001;
+
 	var onDeviceOrientationChangeEvent = function ( event ) {
 
 		scope.deviceOrientation = event;
@@ -40,7 +39,7 @@ var DeviceOrientationControls = function ( object ) {
 
 	// The angles alpha, beta and gamma form a set of intrinsic Tait-Bryan angles of type Z-X'-Y''
 
-	var setObjectQuaternion = function () {
+	var setObjectQuaternion = (function () {
 
 		var zee = new Vector3( 0, 0, 1 );
 
@@ -62,7 +61,7 @@ var DeviceOrientationControls = function ( object ) {
 
 		};
 
-	}();
+	})();
 
 	this.connect = function () {
 
@@ -107,28 +106,40 @@ var DeviceOrientationControls = function ( object ) {
 
 	};
 
-	this.update = function () {
+	this.update = ( function () {
 
-		if ( scope.enabled === false ) return;
+		const lastQuaternion = new Quaternion();
 
-		var device = scope.deviceOrientation;
+		return () => {
 
-		if ( device ) {
+			if ( scope.enabled === false ) return;
 
-			var alpha = device.alpha ? MathUtils.degToRad( device.alpha ) + scope.alphaOffset : 0; // Z
+			var device = scope.deviceOrientation;
 
-			var beta = device.beta ? MathUtils.degToRad( device.beta ) : 0; // X'
+			if ( device ) {
 
-			var gamma = device.gamma ? MathUtils.degToRad( device.gamma ) : 0; // Y''
+				var alpha = device.alpha ? MathUtils.degToRad( device.alpha ) + scope.alphaOffset : 0; // Z
 
-			var orient = scope.screenOrientation ? MathUtils.degToRad( scope.screenOrientation ) : 0; // O
+				var beta = device.beta ? MathUtils.degToRad( device.beta ) : 0; // X'
 
-			setObjectQuaternion( scope.object.quaternion, alpha, beta, gamma, orient );
+				var gamma = device.gamma ? MathUtils.degToRad( device.gamma ) : 0; // Y''
 
-		}
+				var orient = scope.screenOrientation ? MathUtils.degToRad( scope.screenOrientation ) : 0; // O
 
+				setObjectQuaternion( scope.object.quaternion, alpha, beta, gamma, orient );
 
-	};
+				if ( 8 * ( 1 - lastQuaternion.dot( scope.object.quaternion ) ) > EPS ) {
+
+					lastQuaternion.copy( scope.object.quaternion );
+					scope.dispatchEvent( changeEvent );
+
+				}
+
+			}
+
+		};
+
+	} )();
 
 	this.dispose = function () {
 
@@ -140,4 +151,7 @@ var DeviceOrientationControls = function ( object ) {
 
 };
 
+DeviceOrientationControls.prototype = Object.create( EventDispatcher.prototype );
+DeviceOrientationControls.prototype.constructor = DeviceOrientationControls;
+
 export { DeviceOrientationControls };

examples/jsm/controls/FlyControls.d.ts

@@ -1,8 +1,8 @@
 import {
-	Camera
+	Camera, EventDispatcher
 } from '../../../src/Three';
 
-export class FlyControls {
+export class FlyControls extends EventDispatcher {
 
 	constructor( object: Camera, domElement?: HTMLElement );
 

examples/jsm/controls/FlyControls.js

@@ -2,10 +2,7 @@
  * @author James Baicoianu / http://www.baicoianu.com/
  */
 
-import {
-	Quaternion,
-	Vector3
-} from "../../../build/three.module.js";
+import { EventDispatcher, Quaternion, Vector3 } from '../../../build/three.module.js';
 
 var FlyControls = function ( object, domElement ) {
 
@@ -33,6 +30,10 @@ var FlyControls = function ( object, domElement ) {
 
 	// internals
 
+	var changeEvent = { type: 'change' };
+
+	var EPS = 0.000001;
+
 	this.tmpQuaternion = new Quaternion();
 
 	this.mouseStatus = 0;
@@ -186,23 +187,40 @@ var FlyControls = function ( object, domElement ) {
 
 	};
 
-	this.update = function ( delta ) {
+	this.update = ( () => {
 
-		var moveMult = delta * this.movementSpeed;
-		var rotMult = delta * this.rollSpeed;
+		var lastQuaternion = new Quaternion();
+		var lastPosition = new Vector3();
 
-		this.object.translateX( this.moveVector.x * moveMult );
-		this.object.translateY( this.moveVector.y * moveMult );
-		this.object.translateZ( this.moveVector.z * moveMult );
+		return ( delta ) => {
 
-		this.tmpQuaternion.set( this.rotationVector.x * rotMult, this.rotationVector.y * rotMult, this.rotationVector.z * rotMult, 1 ).normalize();
-		this.object.quaternion.multiply( this.tmpQuaternion );
+			var moveMult = delta * this.movementSpeed;
+			var rotMult = delta * this.rollSpeed;
 
-		// expose the rotation vector for convenience
-		this.object.rotation.setFromQuaternion( this.object.quaternion, this.object.rotation.order );
+			this.object.translateX( this.moveVector.x * moveMult );
+			this.object.translateY( this.moveVector.y * moveMult );
+			this.object.translateZ( this.moveVector.z * moveMult );
 
+			this.tmpQuaternion.set( this.rotationVector.x * rotMult, this.rotationVector.y * rotMult, this.rotationVector.z * rotMult, 1 ).normalize();
+			this.object.quaternion.multiply( this.tmpQuaternion );
 
-	};
+			// expose the rotation vector for convenience
+			this.object.rotation.setFromQuaternion( this.object.quaternion, this.object.rotation.order );
+
+			if (
+				lastPosition.distanceToSquared( this.object.position ) > EPS ||
+				8 * ( 1 - lastQuaternion.dot( this.object.quaternion ) ) > EPS
+			) {
+
+				this.dispatchEvent( changeEvent );
+				lastQuaternion.copy( this.object.quaternion );
+				lastPosition.copy( this.object.position );
+
+			}
+
+		};
+
+	} )();
 
 	this.updateMovementVector = function () {
 
@@ -294,4 +312,7 @@ var FlyControls = function ( object, domElement ) {
 
 };
 
+FlyControls.prototype = Object.create( EventDispatcher.prototype );
+FlyControls.prototype.constructor = FlyControls;
+
 export { FlyControls };