@pmndrs/viverse 0.1.3 → 0.1.5

package/README.md

@@ -1,5 +1,5 @@
 <h1 align="center">@pmndrs/viverse</h1>
-<h3 align="center">Build 3D web games with threejs and viverse.</h3>
+<h3 align="center">Toolkit for building Three.js Apps for Viverse and beyond.</h3>
 <br/>
 
 <p align="center">
@@ -26,7 +26,7 @@ npm install three @react-three/fiber @react-three/viverse
 | A prototype map with the `SimpleCharacter` class and its default model. | ![render of the code below](../../docs/getting-started/basic-example.gif) |
 | --------------------------------------------------------------------------- | --------------------------------------------------------------------- |
 
-```jsx
+```tsx
 const world = new BvhPhysicsWorld()
 world.addFixedBody(ground.scene)
 const character = new SimpleCharacter(camera, world, canvas, { model: { url: profile.activeAvatar?.vrmUrl } })

package/dist/camera.d.ts

@@ -1,5 +1,5 @@
 import { Object3D, Vector3, Vector3Tuple, Ray } from 'three';
-import { type InputSystem } from './input/index.js';
+import { SimpleCharacter } from './simple-character.js';
 export declare const FirstPersonCharacterCameraBehavior: SimpleCharacterCameraBehaviorOptions;
 export type SimpleCharacterCameraBehaviorOptions = {
     /**
@@ -57,15 +57,14 @@ export type SimpleCharacterCameraBehaviorOptions = {
 } | boolean;
 export declare class SimpleCharacterCameraBehavior {
     camera: Object3D;
-    character: Object3D;
-    inputSystem: InputSystem;
+    character: SimpleCharacter;
     private readonly raycast?;
     rotationPitch: number;
     rotationYaw: number;
     zoomDistance: number;
     private collisionFreeZoomDistance;
     private firstUpdate;
-    constructor(camera: Object3D, character: Object3D, inputSystem: InputSystem, raycast?: ((ray: Ray, far: number) => number | undefined) | undefined);
+    constructor(camera: Object3D, character: SimpleCharacter, raycast?: ((ray: Ray, far: number) => number | undefined) | undefined);
     private setRotationFromDelta;
     private setDistanceFromDelta;
     private computeCharacterBaseOffset;

package/dist/camera.js

@@ -14,7 +14,6 @@ const rayHelper = new Ray();
 export class SimpleCharacterCameraBehavior {
     camera;
     character;
-    inputSystem;
     raycast;
     rotationPitch = (-20 * Math.PI) / 180;
     rotationYaw = 0;
@@ -22,10 +21,9 @@ export class SimpleCharacterCameraBehavior {
     //internal state
     collisionFreeZoomDistance = this.zoomDistance;
     firstUpdate = true;
-    constructor(camera, character, inputSystem, raycast) {
+    constructor(camera, character, raycast) {
         this.camera = camera;
         this.character = character;
-        this.inputSystem = inputSystem;
         this.raycast = raycast;
     }
     setRotationFromDelta(delta, rotationOptions) {
@@ -85,8 +83,8 @@ export class SimpleCharacterCameraBehavior {
         if (!this.firstUpdate && rotationOptions !== false) {
             rotationOptions = rotationOptions === true ? {} : rotationOptions;
             const rotationSpeed = rotationOptions.speed ?? 1000.0;
-            const deltaYaw = this.inputSystem.get(DeltaYawField);
-            const deltaPitch = this.inputSystem.get(DeltaPitchField);
+            const deltaYaw = this.character.inputSystem.get(DeltaYawField);
+            const deltaPitch = this.character.inputSystem.get(DeltaPitchField);
             this.rotationYaw = this.clampYaw(this.rotationYaw + deltaYaw * rotationSpeed * deltaTime, rotationOptions);
             this.rotationPitch = this.clampPitch(this.rotationPitch + deltaPitch * rotationSpeed * deltaTime, rotationOptions);
         }
@@ -102,7 +100,7 @@ export class SimpleCharacterCameraBehavior {
         if (!this.firstUpdate && zoomOptions !== false) {
             zoomOptions = zoomOptions === true ? {} : zoomOptions;
             const zoomSpeed = zoomOptions.speed ?? 1000.0;
-            const deltaZoom = this.inputSystem.get(DeltaZoomField);
+            const deltaZoom = this.character.inputSystem.get(DeltaZoomField);
             const zoomFactor = 1 + deltaZoom * zoomSpeed * deltaTime;
             if (deltaZoom >= 0) {
                 this.zoomDistance *= zoomFactor;

package/dist/input/pointer-lock.js

@@ -12,8 +12,10 @@ export class PointerLockInput {
             if (document.pointerLockElement != domElement) {
                 return;
             }
-            this.deltaYaw -= (0.4 * event.movementX) / window.innerHeight;
-            this.deltaPitch -= (0.4 * event.movementY) / window.innerHeight;
+            // Compute based on domElement bounds instead of window.innerHeight
+            const rect = domElement.getBoundingClientRect();
+            this.deltaYaw -= (0.4 * event.movementX) / rect.height;
+            this.deltaPitch -= (0.4 * event.movementY) / rect.height;
         }, {
             signal: this.abortController.signal,
         });

package/dist/simple-character.js

@@ -288,7 +288,7 @@ export class SimpleCharacter extends Group {
                 : new InputSystem(domElement, options.input ?? [LocomotionKeyboardInput, PointerCaptureInput]);
         options.physics ??= {};
         // camera behavior
-        this.cameraBehavior = new SimpleCharacterCameraBehavior(camera, this, this.inputSystem, world.raycast.bind(world));
+        this.cameraBehavior = new SimpleCharacterCameraBehavior(camera, this, world.raycast.bind(world));
         // physics
         this.physics = new BvhCharacterPhysics(this, world);
         this.init(camera, options).catch(console.error);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pmndrs/viverse",
-  "description": "Toolkit for building and publishing Threejs Apps to Viverse.",
+  "description": "Toolkit for building Three.js Apps for Viverse and beyond.",
   "author": "Bela Bohlender",
   "license": "SEE LICENSE IN LICENSE",
   "homepage": "https://github.com/pmndrs/viverse",
@@ -21,7 +21,7 @@
   "peerDependencies": {
     "three": "*"
   },
-  "version": "0.1.3",
+  "version": "0.1.5",
   "type": "module",
   "dependencies": {
     "@pixiv/three-vrm": "^3.4.2",