diff --git a/src/components/InteractiveObjects/VideoPlayer.js b/src/components/InteractiveObjects/VideoPlayer.js index cc9106b..edac860 100644 --- a/src/components/InteractiveObjects/VideoPlayer.js +++ b/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; }) diff --git a/src/lib/GameEngine.js b/src/lib/GameEngine.js index 00851d8..5f8d239 100644 --- a/src/lib/GameEngine.js +++ b/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 (!gameEngine.pointerControls.isLocked){ - gameEngine.hero.cameraZ += event.deltaY / 100; + if (this.hero){ + if (!this.pointerControls.isLocked){ + this.hero.cameraZ += event.deltaY / 100; } }else{ - gameEngine.camera.zoom -= event.deltaY / (1000 / gameEngine.camera.zoom); - gameEngine.camera.zoom = Math.max(gameEngine.camera.zoom, .01); + this.camera.zoom -= event.deltaY / (1000 / this.camera.zoom); + this.camera.zoom = Math.max(this.camera.zoom, .01); //controls.rotateSpeed = 1 / Math.sqrt(gameEngine.camera.zoom); - gameEngine.camera.updateProjectionMatrix(); - gameEngine.orbitControls.panSpeed = 1 / gameEngine.camera.zoom; + this.camera.updateProjectionMatrix(); + 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 ); } diff --git a/src/lib/Hero.js b/src/lib/Hero.js index 0718861..4f4a931 100644 --- a/src/lib/Hero.js +++ b/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; @@ -212,11 +220,11 @@ class Hero{ } if (pc.moveCloser){ - this.cameraZ+=delta; + this.cameraZ += delta; } if (pc.moveAway){ - this.cameraZ-=delta; + this.cameraZ -= delta; } if (pc.motion){ @@ -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.y + (this.fpv? this.size.y*0.9 : this.cameraY), - this.model.position.z + this.#cameraZ* Math.cos(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.cameraY, + 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.y + (this.fpv? this.size.y*0.9 : this.cameraY), - this.model.position.z + this.#cameraZ* Math.cos(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.cameraY, + this.model.position.z + this.cameraZ* Math.cos(0+ Math.PI + this.cameraDelta + this.cameraIdleDelta) ) } diff --git a/src/lib/PointerControls.js b/src/lib/PointerControls.js index 1933986..eaad3d2 100644 --- a/src/lib/PointerControls.js +++ b/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.dom.ownerDocument.addEventListener('keyup', onKeyUp); - - this.dom.addEventListener('click', () => { + this.fnClick = () => { 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(){