diff --git a/src/extras/cameras/FirstPersonCamera.js b/src/extras/cameras/FirstPersonCamera.js index 3aa478a6..05593a6f 100644 --- a/src/extras/cameras/FirstPersonCamera.js +++ b/src/extras/cameras/FirstPersonCamera.js @@ -98,11 +98,21 @@ THREE.FirstPersonCamera = function ( parameters ) { this.mouseDragOn = false; - this.windowHalfX = window.innerWidth / 2; - this.windowHalfY = window.innerHeight / 2; + 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; + this.domElement.setAttribute( 'tabindex', -1 ); + } this.onMouseDown = function ( event ) { + if ( this.domElement !== document ) { + this.domElement.focus(); + } + event.preventDefault(); event.stopPropagation(); @@ -143,8 +153,13 @@ THREE.FirstPersonCamera = function ( parameters ) { this.onMouseMove = function ( event ) { - this.mouseX = event.clientX - this.windowHalfX; - this.mouseY = event.clientY - this.windowHalfY; + if ( this.domElement === document ) { + this.mouseX = event.pageX - this.viewHalfX; + this.mouseY = event.pageY - this.viewHalfY; + } else { + this.mouseX = event.pageX - this.domElement.offsetLeft - this.viewHalfX; + this.mouseY = event.pageY - this.domElement.offsetTop - this.viewHalfY; + } }; diff --git a/src/extras/cameras/FlyCamera.js b/src/extras/cameras/FlyCamera.js index 0f4da483..294ca313 100644 --- a/src/extras/cameras/FlyCamera.js +++ b/src/extras/cameras/FlyCamera.js @@ -61,6 +61,12 @@ THREE.FlyCamera = function ( parameters ) { this.lastUpdate = -1; this.tdiff = 0; + + if ( this.domElement === document ) { + + } else { + this.domElement.setAttribute( 'tabindex', -1 ); + } this.handleEvent = function ( event ) { @@ -141,7 +147,11 @@ THREE.FlyCamera = function ( parameters ) { }; this.mousedown = function(event) { - + + if ( this.domElement !== document ) { + this.domElement.focus(); + } + event.preventDefault(); event.stopPropagation(); @@ -170,8 +180,9 @@ THREE.FlyCamera = function ( parameters ) { var halfWidth = container.size[ 0 ] / 2; var halfHeight = container.size[ 1 ] / 2; - this.moveState.yawLeft = - ( ( event.clientX - container.offset[ 0 ] ) - halfWidth ) / halfWidth; - this.moveState.pitchDown = ( ( event.clientY - container.offset[ 1 ] ) - halfHeight ) / halfHeight; + this.moveState.yawLeft = - ( ( event.pageX - container.offset[ 0 ] ) - halfWidth ) / halfWidth; + this.moveState.pitchDown = ( ( event.pageY - container.offset[ 1 ] ) - halfHeight ) / halfHeight; + this.updateRotationVector(); } @@ -187,7 +198,6 @@ THREE.FlyCamera = function ( parameters ) { this.mouseStatus --; - //this.mouseX = this.mouseY = 0; this.moveState.yawLeft = this.moveState.pitchDown = 0; } else { @@ -214,7 +224,6 @@ THREE.FlyCamera = function ( parameters ) { this.tdiff = ( now - this.lastUpdate ) / 1000; this.lastUpdate = now; - //this.position.addSelf( this.moveVector.multiplyScalar( tdiff ) ); var moveMult = this.tdiff * this.movementSpeed; var rotMult = this.tdiff * this.rollSpeed; @@ -289,8 +298,8 @@ THREE.FlyCamera = function ( parameters ) { this.domElement.addEventListener( 'mousedown', bind( this, this.mousedown ), false ); this.domElement.addEventListener( 'mouseup', bind( this, this.mouseup ), false ); - window.addEventListener( 'keydown', bind( this, this.keydown ), false ); - window.addEventListener( 'keyup', bind( this, this.keyup ), false ); + this.domElement.addEventListener( 'keydown', bind( this, this.keydown ), false ); + this.domElement.addEventListener( 'keyup', bind( this, this.keyup ), false ); this.updateMovementVector(); this.updateRotationVector(); diff --git a/src/extras/cameras/PathCamera.js b/src/extras/cameras/PathCamera.js index 3f555845..9f2b4604 100644 --- a/src/extras/cameras/PathCamera.js +++ b/src/extras/cameras/PathCamera.js @@ -82,8 +82,14 @@ THREE.PathCamera = function ( parameters ) { this.phi = 0; this.theta = 0; - this.windowHalfX = window.innerWidth / 2; - this.windowHalfY = window.innerHeight / 2; + 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; + this.domElement.setAttribute( 'tabindex', -1 ); + } var PI2 = Math.PI * 2, PI180 = Math.PI / 180; @@ -150,8 +156,13 @@ THREE.PathCamera = function ( parameters ) { this.onMouseMove = function ( event ) { - this.mouseX = event.clientX - this.windowHalfX; - this.mouseY = event.clientY - this.windowHalfY; + if ( this.domElement === document ) { + this.mouseX = event.pageX - this.viewHalfX; + this.mouseY = event.pageY - this.viewHalfY; + } else { + this.mouseX = event.pageX - this.domElement.offsetLeft - this.viewHalfX; + this.mouseY = event.pageY - this.domElement.offsetTop - this.viewHalfY; + } }; diff --git a/src/extras/loaders/ColladaLoader.js b/src/extras/loaders/ColladaLoader.js index 5fae9c49..c69c1eaa 100644 --- a/src/extras/loaders/ColladaLoader.js +++ b/src/extras/loaders/ColladaLoader.js @@ -2,7 +2,7 @@ * @author Tim Knip / http://www.floorplanner.com/ / tim at floorplanner.com */ -var ColladaLoader = function () { +THREE.ColladaLoader = function () { var COLLADA = null; var scene = null;