OrbitControls: get keydown events from scope.domElement

Binding to window has issue that keys events are received
even when not meant for OrbitControls. It also means arrow
keys can be blocked since when an arrow key is pressed
the OrbitControls call event.preventDefault so that the
page does not scroll.

Binding to scope.domElement is either the document if no
element is passed in (in which case the same issue as mentioned
above exists) but if you pass in an element like the canvas
itself then you can receive keyboard events on other elements
providing a workaround when needed to the issue mentioned
above.

examples/js/controls/OrbitControls.js

@@ -234,7 +234,7 @@ THREE.OrbitControls = function ( object, domElement ) {
 		document.removeEventListener( 'mousemove', onMouseMove, false );
 		document.removeEventListener( 'mouseup', onMouseUp, false );
 
-		window.removeEventListener( 'keydown', onKeyDown, false );
+		scope.domElement.removeEventListener( 'keydown', onKeyDown, false );
 
 		//scope.dispatchEvent( { type: 'dispose' } ); // should this be added here?
 
@@ -933,7 +933,15 @@ THREE.OrbitControls = function ( object, domElement ) {
 	scope.domElement.addEventListener( 'touchend', onTouchEnd, false );
 	scope.domElement.addEventListener( 'touchmove', onTouchMove, false );
 
-	window.addEventListener( 'keydown', onKeyDown, false );
+	scope.domElement.addEventListener( 'keydown', onKeyDown, false );
+
+	// make sure element can receive keys.
+
+	if ( scope.domElement !== document && scope.domElement.tabIndex === -1) {
+
+		scope.domElement.tabIndex = 0;
+
+	}
 
 	// force an update at start