FPV

src/components/InteractiveObjects/VideoPlayer.js

@@ -77,6 +77,7 @@ class VideoPlayer extends EventManager {
                 }
                 
                 resolve(this);
+                console.log('VI', vi)
             })
             vi.src = engine.assetPath + data.$go.asset.name;
         })

src/lib/GameEngine.js

@@ -137,7 +137,7 @@ class GameEngine extends EventManager{
             const geometry = new THREE.BufferGeometry().setFromPoints([new THREE.Vector3(0, 0, 0), new THREE.Vector3(0, 0, - 1)]);
 
             let line = new THREE.Line(geometry);
-            line.scale.z = 5;
+            line.scale.z = 7;
 
             this.controllerLine = line;
         }
@@ -247,20 +247,22 @@ class GameEngine extends EventManager{
 
         domNode.appendChild(renderer.domElement);
 
-        renderer.domElement.addEventListener('wheel', (event) => {
+        this._wheelEvent = ((event) => {
             event.preventDefault();
-            if (gameEngine.hero){
+            if (this.hero){
-                if (!gameEngine.pointerControls.isLocked){
+                if (!this.pointerControls.isLocked){
-                    gameEngine.hero.cameraZ += event.deltaY / 100;
+                    this.hero.cameraZ += event.deltaY / 100;
                 }
             }else{
-                gameEngine.camera.zoom -= event.deltaY / (1000 / gameEngine.camera.zoom);
+                this.camera.zoom -= event.deltaY / (1000 / this.camera.zoom);
-                gameEngine.camera.zoom = Math.max(gameEngine.camera.zoom, .01);
+                this.camera.zoom = Math.max(this.camera.zoom, .01);
                 //controls.rotateSpeed = 1 / Math.sqrt(gameEngine.camera.zoom);
-                gameEngine.camera.updateProjectionMatrix();
+                this.camera.updateProjectionMatrix();
-                gameEngine.orbitControls.panSpeed = 1 / gameEngine.camera.zoom;
+                this.orbitControls.panSpeed = 1 / this.camera.zoom;
             }
-        })
+        }).bind(this)
+
+        renderer.domElement.addEventListener('wheel', this._wheelEvent)
 
         GameEngine.ktxLoader.detectSupport(renderer);
     }
@@ -685,6 +687,7 @@ class GameEngine extends EventManager{
     clearScene(){
         this.hero?.dispose();
         this.dashboard?.reset();
+        this.transformControls?.dispose();
         this.pointerControls.dispose();
         //this.activeObjects.clear();
         this.physics.stop();
@@ -722,6 +725,7 @@ class GameEngine extends EventManager{
         this.arBtn?.remove();
         this.xrBtn?.remove();
         this.stats?.dom?.remove();
+        this.renderer.domElement.removeEventListener('wheel', this._wheelEvent)
         this.renderer.domElement.remove();
         //console.log('Engine Disposed', this.renderer.info.memory.textures );
     }

src/lib/Hero.js

@@ -15,25 +15,30 @@ class Hero{
 
     set cameraZ(v){
         this.#cameraZ = Math.min(Math.max(v, 1), 12);
-        if (this.#cameraZ == 1){
+        if (this.#cameraZ == 1 && !this.fpv){
             if (this.engine.renderer.xr.isPresenting){
                 this.#cameraZ = 0;
                 this.fpv = true;
+                this.cameraY = this.size.y*0.9;
                 this.camera.rotation.set(0,0,0);
             }else{
                 this.engine.pointerControls.lock(true).then(()=>{
                     this.#cameraZ = 0;
                     this.fpv = true;
+                    this.cameraY = this.size.y*0.9;
                     this.engine.pointerControls.once('unlock', ()=>{
                         this.fpv = false;
+                        this.cameraY = this.size.y*1.5;
                     })
                 }).catch(err=>{
                     console.log(err);
                 })
             }
-        }else if(this.fpv){
+        }else if(this.#cameraZ > 1 && this.fpv){
             this.fpv = false;
+            this.cameraY = this.size.y*1.5;
         }
+        //this.engine.dashboard.updateText(this.#cameraZ);
     }
     
     fadeDuration = 0.2
@@ -116,6 +121,9 @@ class Hero{
                 //this.camera = this.engine.cameraWorld;
                 // this.engine.activeObjects.position.x = -this.camera.position.x;
                 // this.engine.activeObjects.position.z = -this.camera.position.z;
+            }else if (this.engine.renderer.xr.isPresenting){
+                this.cameraMode = 'rotate'
+                this.engine.cameraRig.position.y = - this.engine.camera.position.y;
             }else{
                 this.cameraMode = 'rotate'
                 this.engine.cameraRig.position.y = 0;
@@ -277,9 +285,9 @@ class Hero{
         let cameraDesiredPosition;
         if (this.cameraMode == 'rotate'){
             cameraDesiredPosition = new Vector3(
-                this.model.position.x + this.#cameraZ* Math.sin(this.model.rotation.y + Math.PI + this.cameraDelta + this.cameraIdleDelta),
+                this.model.position.x + this.cameraZ* Math.sin(this.model.rotation.y + Math.PI + this.cameraDelta + this.cameraIdleDelta),
-                this.model.position.y + (this.fpv? this.size.y*0.9 : this.cameraY),
+                this.model.position.y + this.cameraY,
-                this.model.position.z + this.#cameraZ* Math.cos(this.model.rotation.y + Math.PI + this.cameraDelta + this.cameraIdleDelta)
+                this.model.position.z + this.cameraZ* Math.cos(this.model.rotation.y + Math.PI + this.cameraDelta + this.cameraIdleDelta)
             )
         } else {
             // cameraDesiredPosition = new Vector3(
@@ -288,9 +296,9 @@ class Hero{
             //     this.model.position.z - this.#cameraZ
             // )
             cameraDesiredPosition = new Vector3(
-                this.model.position.x + this.#cameraZ* Math.sin(0+ Math.PI + this.cameraDelta + this.cameraIdleDelta),
+                this.model.position.x + this.cameraZ* Math.sin(0+ Math.PI + this.cameraDelta + this.cameraIdleDelta),
-                this.model.position.y + (this.fpv? this.size.y*0.9 : this.cameraY),
+                this.model.position.y + this.cameraY,
-                this.model.position.z + this.#cameraZ* Math.cos(0+ Math.PI + this.cameraDelta + this.cameraIdleDelta)
+                this.model.position.z + this.cameraZ* Math.cos(0+ Math.PI + this.cameraDelta + this.cameraIdleDelta)
             )
         }
 

src/lib/PointerControls.js

@@ -31,7 +31,7 @@ class PointerControls extends EventManager {
 		this._onPointerlockChange = onPointerlockChange.bind( this );
 		this._onPointerlockError = onPointerlockError.bind( this );
 
-        const onKeyDown = (event) => {
+        this.onKeyDown = (event) => {
             this.kb[event.code] = true;
             switch (event.code) {
                 case 'Space':
@@ -41,32 +41,36 @@ class PointerControls extends EventManager {
             }
         };
 
-        const onKeyUp = (event) => {
+        this.onKeyUp = (event) => {
             this.kb[event.code] = false;
         };
 
-        this.dom.ownerDocument.addEventListener('keydown', onKeyDown);
+        this.fnClick = () => {
-        this.dom.ownerDocument.addEventListener('keyup', onKeyUp);
-
-        this.dom.addEventListener('click', () => {
             this.isLocked && this.clicked && this.clicked();
-        });
+        }
 
-        this.dom.addEventListener('mousedown', () => {
+        this.fnMouseDown = () => {
             this.isLocked && this.onpointer && this.onpointer('start');
-        });
+        }
 
-        this.dom.addEventListener('mousemove', () => {
+        this.fnMouseMove = () => {
             this.isLocked && this.onpointer && this.onpointer('drag');
-        });
+        }
 
-        this.dom.addEventListener('mouseup', () => {
+        this.fnMouseUp = () => {
             this.isLocked && this.onpointer && this.onpointer('end');
-        });
+        }
 
         this.update = () => { };
 
         this.object = engine.cameraWorld;
+
+        this.dom.ownerDocument.addEventListener('keydown', this.onKeyDown);
+        this.dom.ownerDocument.addEventListener('keyup', this.onKeyUp);
+        this.dom.addEventListener('click', this.fnClick);
+        this.dom.addEventListener('mousedown', this.fnMouseDown);
+        this.dom.addEventListener('mousemove', this.fnMouseMove);
+        this.dom.addEventListener('mouseup', this.fnMouseUp);
 		this.dom.ownerDocument.addEventListener( 'wheel', this._onMouseWheel );
 		this.dom.ownerDocument.addEventListener( 'mousemove', this._onMouseMove );
 		this.dom.ownerDocument.addEventListener( 'pointerlockchange', this._onPointerlockChange );
@@ -74,12 +78,16 @@ class PointerControls extends EventManager {
     }
 
 	dispose() {
+		this.dom.ownerDocument.removeEventListener( 'keydown', this.onKeyDown );
+		this.dom.ownerDocument.removeEventListener( 'keyup', this.onKeyUp );
+        this.dom.removeEventListener('click', this.fnClick);
+        this.dom.removeEventListener('mousedown', this.fnMouseDown);
+        this.dom.removeEventListener('mousemove', this.fnMouseMove);
+        this.dom.removeEventListener('mouseup', this.fnMouseUp);
 		this.dom.ownerDocument.removeEventListener( 'wheel', this._onMouseWheel );
 		this.dom.ownerDocument.removeEventListener( 'mousemove', this._onMouseMove );
 		this.dom.ownerDocument.removeEventListener( 'pointerlockchange', this._onPointerlockChange );
 		this.dom.ownerDocument.removeEventListener( 'pointerlockerror', this._onPointerlockError );
-		this.dom.ownerDocument.removeEventListener( 'keydown', this.onKeyDown );
-		this.dom.ownerDocument.removeEventListener( 'keyup', this.onKeyUp );
 	}
 
     get moveForward(){