Editor: more intuitive selection behavior.

Clicking in empty space now clears selection and selections stays on/off through dragging as expected.

editor/js/ui/Viewport.js

@@ -82,6 +82,8 @@ var Viewport = function ( signals ) {
 	var offset = new THREE.Vector3();
 	var picked = null;
 
+	var oldMouseX = 0, oldMouseY = 0;
+
 	// events
 
 	var onMouseDown = function ( event ) {
@@ -117,8 +119,8 @@ var Viewport = function ( signals ) {
 				var intersects = ray.intersectObject( intersectionPlane );
 				offset.copy( intersects[ 0 ].point ).subSelf( intersectionPlane.position );
 
-				document.addEventListener( 'mousemove', onMouseMove, false );
-				document.addEventListener( 'mouseup', onMouseUp, false );
+				document.addEventListener( 'mousemove', onMouseMoveDrag, false );
+				document.addEventListener( 'mouseup', onMouseUpDrag, false );
 
 			} else {
 
@@ -128,9 +130,16 @@ var Viewport = function ( signals ) {
 
 		}
 
+		if ( controls.enabled ) {
+
+			oldMouseX = event.clientX;
+			oldMouseY = event.clientY;
+
+		}
+
 	};
 
-	var onMouseMove = function ( event ) {
+	var onMouseMoveDrag = function ( event ) {
 
 		var vector = new THREE.Vector3(
 			( ( event.clientX - container.dom.offsetLeft ) / container.dom.offsetWidth ) * 2 - 1,
@@ -156,10 +165,23 @@ var Viewport = function ( signals ) {
 
 	};
 
+	var onMouseUpDrag = function ( event ) {
+
+		document.removeEventListener( 'mousemove', onMouseMoveDrag );
+		document.removeEventListener( 'mouseup', onMouseUpDrag );
+
+	};
+
 	var onMouseUp = function ( event ) {
 
-		document.removeEventListener( 'mousemove', onMouseMove );
-		document.removeEventListener( 'mouseup', onMouseUp );
+		// clear selection when clicking in empty space
+
+		if ( controls.enabled && event.clientX === oldMouseX && event.clientY === oldMouseY ) {
+
+			selected = null;
+			signals.objectSelected.dispatch( selected );
+
+		}
 
 	};
 
@@ -178,7 +200,7 @@ var Viewport = function ( signals ) {
 			ray.set( camera.position, vector.subSelf( camera.position ).normalize() );
 			var intersects = ray.intersectObjects( objects, true );
 
-			if ( intersects.length > 0 ) {
+			if ( intersects.length > 0 && ! controls.enabled ) {
 
 				selected = intersects[ 0 ].object;
 				signals.objectSelected.dispatch( selected );
@@ -192,6 +214,7 @@ var Viewport = function ( signals ) {
 	};
 
 	container.dom.addEventListener( 'mousedown', onMouseDown, false );
+	container.dom.addEventListener( 'mouseup', onMouseUp, false );
 	container.dom.addEventListener( 'click', onClick, false );
 
 	// controls need to be added *after* main logic,