import * as RE from "rogue-engine"; import { Object3D, Vector3 } from "three"; const fwdDirection = new Vector3(0, 0, -1); const bwdDirection = new Vector3(0, 0, 1); const leftDirection = new Vector3(-1, 0, 0); const rightDirection = new Vector3(1, 0, 0); const upDirection = new Vector3(0, 1, 0); const downDirection = new Vector3(0, -1, 0); export default class WorldFPSController extends RE.Component { @RE.props.object3d() mainCamera: Object3D; @RE.props.num() horizontalLookSpeed: number = 360; @RE.props.num() verticalLookSpeed: number = 180; @RE.props.num(-Math.PI / 2, 0) minCameraRotY: number = -1.5708; @RE.props.num(0, Math.PI / 2) maxCameraRotY: number = 1.5708; @RE.props.num() cameraHeight: number = 0.4; @RE.props.num() walkSpeed: number = 2; @RE.props.num() fwdSpeedMultiplier: number = 1.3; @RE.props.num() runSpeedMultiplier: number = 1.8; @RE.props.object3d() character: Object3D; @RE.props.list.object3d() worldObjects: Object3D[]; @RE.props.vector3() characterOffsetPosition: Vector3; @RE.props.vector3() characterRotatePosition: Vector3; characterOffset: Object3D = new Object3D(); awake() { RE.Input.mouse.lock(); this.characterOffset.position.copy(this.character.position); this.mainCamera.position.set(0,0,0); this.character.position.set(0,0,0); this.mainCamera.position.y += this.cameraHeight; this.mainCamera.rotation.copy(this.character.rotation); this.worldObjects.forEach(worldObject => { worldObject.position.set( -this.characterOffset.position.x, -this.characterOffset.position.y, -this.characterOffset.position.z ); }); const appContainer = document.getElementById("rogue-app"); if (!appContainer) return; appContainer.onmousedown = e => { RE.Input.mouse.lock(); }; RE.Runtime.onStop(() => { if (!appContainer) return; appContainer.onmousedown = null; }); this.mainCamera.rotation.order = "YXZ"; this.character.rotation.order = "YXZ"; this.mainCamera.up.set(0, 1, 0); } update() { const deltaTime = RE.Runtime.deltaTime; const appContainer = document.getElementById("rogue-app"); if (!appContainer) return; if (RE.Input.mouse.isMoving && document.pointerLockElement) { console.log("movement Ratio", (RE.Input.mouse.movementX / appContainer.clientWidth), (RE.Input.mouse.movementY/ appContainer.clientHeight)) const mouseDeltaX = (RE.Input.mouse.movementX / appContainer.clientWidth) * this.horizontalLookSpeed * deltaTime; const mouseDeltaY = (RE.Input.mouse.movementY/ appContainer.clientHeight) * this.verticalLookSpeed * deltaTime; this.character.rotation.set( this.character.rotation.x, this.character.rotation.y - mouseDeltaX, this.character.rotation.z ); this.mainCamera.rotation.set( this.mainCamera.rotation.x - mouseDeltaY, this.character.rotation.y, this.mainCamera.rotation.z ); this.mainCamera.rotation.x = Math.max(this.minCameraRotY, Math.min(this.maxCameraRotY, this.mainCamera.rotation.x)); } RE.Input.keyboard.getKeyPressed("Escape") && RE.Input.mouse.unlock(); let actualSpeed = this.walkSpeed; let onlyFwd = true; const movementVector = new Vector3(); // if (RE.Input.keyboard.getKeyDown("Space")) { // //jump logic here // movementVector.add(upDirection); // } if (RE.Input.keyboard.getKeyPressed("Space")) { movementVector.add(upDirection); } if (RE.Input.keyboard.getKeyPressed("ControlLeft")) { movementVector.add(downDirection); } if (RE.Input.keyboard.getKeyPressed("KeyW")) { movementVector.add(fwdDirection); } else if (RE.Input.keyboard.getKeyPressed("KeyS")) { movementVector.add(bwdDirection); onlyFwd = false; } if (RE.Input.keyboard.getKeyPressed("KeyA")) { movementVector.add(leftDirection); onlyFwd = false; } else if (RE.Input.keyboard.getKeyPressed("KeyD")) { movementVector.add(rightDirection); onlyFwd = false; } if (onlyFwd) { if (RE.Input.keyboard.getKeyPressed("ShiftLeft")) { actualSpeed *= this.runSpeedMultiplier; } else { actualSpeed *= this.fwdSpeedMultiplier; } } movementVector.normalize(); if (movementVector.length() > 0) { movementVector.copy( movementVector .transformDirection(this.character.matrix) .multiplyScalar(actualSpeed * deltaTime) ); this.characterOffset.position.x += movementVector.x; this.characterOffset.position.y += movementVector.y; this.characterOffset.position.z += movementVector.z; this.worldObjects.forEach(worldObject => { worldObject.position.set( -this.characterOffset.position.x, -this.characterOffset.position.y, -this.characterOffset.position.z ); }); } this.characterOffsetPosition.set( this.characterOffset.position.x, this.characterOffset.position.y, this.characterOffset.position.z ); this.characterRotatePosition.set( this.characterOffset.rotation.x, this.characterOffset.rotation.y, this.characterOffset.rotation.z ); } } RE.registerComponent(WorldFPSController);