Editor: Changed object picking logic.

Objects need to be clicked first before moving. Hopefully this will avoid mistakingly moved object and will make undo less needed :P

editor/js/ui/Viewport.js

@@ -65,26 +65,26 @@ var Viewport = function ( signals ) {
 	var projector = new THREE.Projector();
 	var offset = new THREE.Vector3();
 
-	var cameraChanged = false;
-
-	//
-
-	var picked = null;
-	var selected = null;
+	var selected = camera;
 
 	// events
 
+	var onMouseDownPosition = new THREE.Vector2();
+	var onMouseUpPosition = new THREE.Vector2();
+
 	var onMouseDown = function ( event ) {
 
+		event.preventDefault();
+
 		container.dom.focus();
 
-		event.preventDefault();
+		onMouseDownPosition.set( event.layerX, event.layerY );
 
 		if ( event.button === 0 ) {
 
 			var vector = new THREE.Vector3(
-				( ( event.clientX - container.dom.offsetLeft ) / container.dom.offsetWidth ) * 2 - 1,
-				- ( ( event.clientY - container.dom.offsetTop ) / container.dom.offsetHeight ) * 2 + 1,
+				( event.layerX / container.dom.offsetWidth ) * 2 - 1,
+				- ( event.layerY / container.dom.offsetHeight ) * 2 + 1,
 				0.5
 			);
 
@@ -96,26 +96,21 @@ var Viewport = function ( signals ) {
 
 			if ( intersects.length > 0 ) {
 
-				controls.enabled = false;
-
-				selected = intersects[ 0 ].object;
-
-				if ( helpersToObjects[ selected.id ] !== undefined ) {
+				if ( intersects[ 0 ].object === selected ) {
 
-					selected = helpersToObjects[ selected.id ];
+					intersectionPlane.position.copy( selected.position );
+					intersectionPlane.lookAt( camera.position );
+					intersectionPlane.updateMatrixWorld();
 
-				}
+					var intersects = ray.intersectObject( intersectionPlane );
 
-				intersectionPlane.position.copy( selected.position );
-				intersectionPlane.lookAt( camera.position );
+					offset.copy( intersects[ 0 ].point ).sub( intersectionPlane.position );
 
-				signals.objectSelected.dispatch( selected );
+					document.addEventListener( 'mousemove', onMouseMove, false );
 
-				var intersects = ray.intersectObject( intersectionPlane );
-				offset.copy( intersects[ 0 ].point ).sub( intersectionPlane.position );
+					controls.enabled = false;
 
-				document.addEventListener( 'mousemove', onMouseMove, false );
-				document.addEventListener( 'mouseup', onMouseUp, false );
+				}
 
 			} else {
 
@@ -125,15 +120,15 @@ var Viewport = function ( signals ) {
 
 		}
 
-		cameraChanged = false;
+		document.addEventListener( 'mouseup', onMouseUp, false );
 
 	};
 
 	var onMouseMove = function ( event ) {
 
 		var vector = new THREE.Vector3(
-			( ( event.clientX - container.dom.offsetLeft ) / container.dom.offsetWidth ) * 2 - 1,
-			- ( ( event.clientY - container.dom.offsetTop ) / container.dom.offsetHeight ) * 2 + 1,
+			( event.layerX / container.dom.offsetWidth ) * 2 - 1,
+			- ( event.layerY / container.dom.offsetHeight ) * 2 + 1,
 			0.5
 		);
 
@@ -161,27 +156,23 @@ var Viewport = function ( signals ) {
 
 	var onMouseUp = function ( event ) {
 
-		document.removeEventListener( 'mousemove', onMouseMove );
-		document.removeEventListener( 'mouseup', onMouseUp );
-
-	};
-
-	var onClick = function ( event ) {
+		onMouseUpPosition.set( event.layerX, event.layerY );
 
-		if ( event.button == 0 && cameraChanged === false ) {
+		if ( onMouseDownPosition.distanceTo( onMouseUpPosition ) < 2 ) {
 
 			var vector = new THREE.Vector3(
-				( ( event.clientX - container.dom.offsetLeft ) / container.dom.offsetWidth ) * 2 - 1,
-				- ( ( event.clientY - container.dom.offsetTop ) / container.dom.offsetHeight ) * 2 + 1,
+				( event.layerX / container.dom.offsetWidth ) * 2 - 1,
+				- ( event.layerY / container.dom.offsetHeight ) * 2 + 1,
 				0.5
 			);
 
 			projector.unprojectVector( vector, camera );
 
 			ray.set( camera.position, vector.sub( camera.position ).normalize() );
+
 			var intersects = ray.intersectObjects( objects, true );
 
-			if ( intersects.length > 0 && ! controls.enabled ) {
+			if ( intersects.length > 0 ) {
 
 				selected = intersects[ 0 ].object;
 
@@ -191,22 +182,26 @@ var Viewport = function ( signals ) {
 
 				}
 
+				signals.objectSelected.dispatch( selected );
+
 			} else {
 
+				controls.enabled = true;
+
 				selected = camera;
 
-			}
+				signals.objectSelected.dispatch( selected );
 
-			signals.objectSelected.dispatch( selected );
+			}
 
 		}
 
-		controls.enabled = true;
+		document.removeEventListener( 'mousemove', onMouseMove );
+		document.removeEventListener( 'mouseup', onMouseUp );
 
 	};
 
 	container.dom.addEventListener( 'mousedown', onMouseDown, false );
-	container.dom.addEventListener( 'click', onClick, false );
 
 	// controls need to be added *after* main logic,
 	// otherwise controls.enabled doesn't work.
@@ -215,8 +210,6 @@ var Viewport = function ( signals ) {
 	controls.userPanSpeed = 4.0;
 	controls.addEventListener( 'change', function () {
 
-		cameraChanged = true;
-
 		signals.cameraChanged.dispatch( camera );
 		render();