diff --git a/src/components/InteractiveObjects/MazeQuizGame/MazeQuizGame.js b/src/components/InteractiveObjects/MazeQuizGame/MazeQuizGame.js index a191dfd..9954e5f 100644 --- a/src/components/InteractiveObjects/MazeQuizGame/MazeQuizGame.js +++ b/src/components/InteractiveObjects/MazeQuizGame/MazeQuizGame.js @@ -28,10 +28,11 @@ class MazeQuizGame { return this.object; } - generate(questions, idx = 0, len){ - let cq = questions[idx] - if (!cq) return { + generate(questions, qid = 0, len){ + let question = questions[qid] + if (!question) return { len:3, + finish: true, objects:[ { type: 'gltf', @@ -51,15 +52,15 @@ class MazeQuizGame { let directions = Utils.shuffleArray( ['l', 'r', 'f'] ) let mo = { - len, + len, question, qid, objects:[ { - type: 'text', text: cq.q, fontSize:0.033, width:0.5, position:[0,.33,len + .96], rotation:[0,Math.PI, 0] + type: 'text', text: question.q, fontSize:0.033, width:0.5, position:[0,.33,len + .96], rotation:[0,Math.PI, 0] } ] } - cq.a.forEach((a, i)=>{ + question.a.forEach((a, i)=>{ let d = directions[i]; mo.objects.push( defaults.arrows[d](len), @@ -74,7 +75,7 @@ class MazeQuizGame { if (i == 0){ mo[d] = { len: 3, - [dd]: this.generate(questions, idx + 1, 3) + [dd]: this.generate(questions, qid + 1, 3) } }else{ mo[d] = { @@ -83,7 +84,7 @@ class MazeQuizGame { len: 2, objects:[ { - type: 'text', width:0.5, color:0xff0000, text: cq.h, fontSize:0.033, position:[0,.44,2+.96], rotation:[0,Math.PI, 0] + type: 'text', width:0.5, color:0xff0000, text: question.h, fontSize:0.033, position:[0,.44,2+.96], rotation:[0,Math.PI, 0] } ] } diff --git a/src/lib/CharacterControls.js b/src/lib/CharacterControls.js index def9183..74a786e 100644 --- a/src/lib/CharacterControls.js +++ b/src/lib/CharacterControls.js @@ -45,6 +45,8 @@ export class CharacterControls { this.direction = this.model.rotation.y; this.directionVelocity = 0; this.actionStart = 0; + this.cameraDelta = 0; + this.cameraIdleDelta = 0; //this.toggleRun = true } @@ -53,7 +55,7 @@ export class CharacterControls { } update(world, delta, pointerControls) { - const directionPressed = pointerControls.moving() + const directionPressed = pointerControls.moving let input = this.getInput(pointerControls) let play = this.currentAction || 'idle', velocity = this.walkVelocity; @@ -84,12 +86,18 @@ export class CharacterControls { this.fadeDuration = 1; } + if (this.currentAction.startsWith('idle') && play != 'idle'){ + this.cameraIdleDelta += delta * 0.33; + }else { + this.cameraIdleDelta = 0; + } + if (this.currentAction != play) { const toPlay = this.animationsMap[play] const current = this.animationsMap[this.currentAction] current.fadeOut(this.fadeDuration) - toPlay.timeScale = 0.77; + toPlay.timeScale = 0.5; toPlay.reset().fadeIn(this.fadeDuration).play(); this.currentAction = play @@ -99,6 +107,8 @@ export class CharacterControls { this.mixer.update(delta) this.actionStart += delta; + this.cameraDelta += delta * ( pointerControls.cameraLeft * -1 + pointerControls.cameraRight * 1) + this.walkDirection.x = this.walkDirection.y = this.walkDirection.z = 0 if (directionPressed) { @@ -142,9 +152,9 @@ export class CharacterControls { let cameraPosition = new THREE.Vector3().copy(this.camera.position) let cameraDesiredPosition = new THREE.Vector3( - this.model.position.x + 5* Math.sin(this.model.rotation.y + Math.PI), + this.model.position.x + 5* Math.sin(this.model.rotation.y + Math.PI + this.cameraDelta + this.cameraIdleDelta), 3, - this.model.position.z + 5* Math.cos(this.model.rotation.y + Math.PI) + this.model.position.z + 5* Math.cos(this.model.rotation.y + Math.PI + this.cameraDelta + this.cameraIdleDelta) ) cameraPosition.lerp(cameraDesiredPosition, delta*2) diff --git a/src/lib/PointerControls.js b/src/lib/PointerControls.js index 76b566e..2022516 100644 --- a/src/lib/PointerControls.js +++ b/src/lib/PointerControls.js @@ -7,16 +7,7 @@ import { PointerLockControls } from 'three/examples/jsm/Addons.js'; class PointerControls { constructor(camera, hero, domElement) { - this.moveForward = false; - this.moveBackward = false; - this.moveLeft = false; - this.moveRight = false; - - this.moveUp = false; - this.moveDown = false; - - this.rotateLeft = false; - this.rotateRight = false; + this.kb = {}; this.canJump = false; this.velocity = new Vector3(); @@ -33,37 +24,8 @@ class PointerControls { this.controls = new PointerLockControls(camera, domElement); const onKeyDown = (event) => { + this.kb[event.code] = true; switch (event.code) { - case 'ArrowUp': - case 'KeyW': - this.moveForward = true; - break; - case 'ArrowLeft': - case 'KeyA': - this.moveLeft = true; - this.rotateLeft = true; - break; - case 'ArrowDown': - case 'KeyS': - this.moveBackward = true; - break; - case 'ArrowRight': - case 'KeyD': - this.moveRight = true; - this.rotateRight = true; - break; - case 'KeyQ': - this.rotateLeft = true; - break; - case 'KeyE': - this.rotateRight = true; - break; - case 'KeyR': - this.moveUp = true; - break; - case 'KeyF': - this.moveDown = true; - break; case 'Space': if (this.canJump === true) this.velocity.y += 350; this.canJump = false; @@ -72,38 +34,7 @@ class PointerControls { }; const onKeyUp = (event) => { - switch (event.code) { - case 'ArrowUp': - case 'KeyW': - this.moveForward = false; - break; - case 'ArrowLeft': - case 'KeyA': - this.moveLeft = false; - this.rotateLeft = false; - break; - case 'ArrowDown': - case 'KeyS': - this.moveBackward = false; - break; - case 'ArrowRight': - case 'KeyD': - this.moveRight = false; - this.rotateRight = false; - break; - case 'KeyQ': - this.rotateLeft = false; - break; - case 'KeyE': - this.rotateRight = false; - break; - case 'KeyR': - this.moveUp = false; - break; - case 'KeyF': - this.moveDown = false; - break; - } + this.kb[event.code] = false; }; document.addEventListener('keydown', onKeyDown); @@ -167,7 +98,47 @@ class PointerControls { } - moving(){ + get moveForward(){ + return this.kb['ArrowUp'] || this.kb['KeyW'] || false + } + + get moveLeft(){ + return this.kb['ArrowLeft'] || this.kb['KeyA'] || false + } + + get rotateLeft(){ + return this.moveLeft; + } + + get moveRight(){ + return this.kb['ArrowRight'] || this.kb['KeyD'] || false + } + + get rotateRight(){ + return this.moveRight; + } + + get moveBackward(){ + return this.kb['ArrowDown'] || this.kb['KeyS'] || false + } + + get moveUp(){ + return this.kb['KeyR'] || false + } + + get moveDown(){ + return this.kb['KeyF'] || false + } + + get cameraLeft(){ + return this.kb['KeyQ'] || false + } + + get cameraRight(){ + return this.kb['KeyE'] || false + } + + get moving(){ return this.moveForward || this.moveBackward || this.moveLeft || this.moveRight; } }