minecraft-renderer 0.1.78 → 0.1.80

package/src/playerState/playerState.ts

@@ -3,57 +3,62 @@ import { proxy } from 'valtio'
 import type { GameMode, HandItemBlock, BlocksShapes, BlockShape, MovementState, CameraPerspective, Team, ItemSpecificContextProperties } from './types'
 
 // edit src/mineflayer/playerState.ts for implementation of player state from mineflayer
-export const getInitialPlayerState = () => proxy({
-  playerSkin: undefined as string | undefined,
-  inWater: false,
-  waterBreathing: false,
-  backgroundColor: [0, 0, 0] as [number, number, number],
-  ambientLight: 0,
-  directionalLight: 0,
-  eyeHeight: 0,
-  gameMode: undefined as GameMode | undefined,
-  lookingAtBlock: undefined as {
-    x: number
-    y: number
-    z: number
-    face?: number
-    shapes: BlocksShapes
-  } | undefined,
-  diggingBlock: undefined as {
-    x: number
-    y: number
-    z: number
-    stage: number
-    face?: number
-    mergedShape: BlockShape | undefined
-  } | undefined,
-  movementState: 'NOT_MOVING' as MovementState,
-  onGround: true,
-  sneaking: false,
-  flying: false,
-  sprinting: false,
-  walkDist: 0,
-  prevWalkDist: 0,
-  bob: 0,
-  prevBob: 0,
-  itemUsageTicks: 0,
-  username: '',
-  onlineMode: false,
-  /** Dimension ambient lighting preset (e.g. nether) — from login/respawn dimension data when available */
-  cardinalLight: 'default' as string,
-  lightingDisabled: false,
-  shouldHideHand: false,
-  heldItemMain: undefined as HandItemBlock | undefined,
-  heldItemOff: undefined as HandItemBlock | undefined,
-  perspective: 'first_person' as CameraPerspective,
-  onFire: false,
-  /** Gameplay FOV scale (sprint, bow, zoom, etc.); base FOV comes from renderer options. */
-  fovMultiplier: 1,
+export const getInitialPlayerState = () =>
+  proxy({
+    playerSkin: undefined as string | undefined,
+    inWater: false,
+    waterBreathing: false,
+    backgroundColor: [0, 0, 0] as [number, number, number],
+    ambientLight: 0,
+    directionalLight: 0,
+    eyeHeight: 0,
+    gameMode: undefined as GameMode | undefined,
+    lookingAtBlock: undefined as
+      | {
+          x: number
+          y: number
+          z: number
+          face?: number
+          shapes: BlocksShapes
+        }
+      | undefined,
+    diggingBlock: undefined as
+      | {
+          x: number
+          y: number
+          z: number
+          stage: number
+          face?: number
+          mergedShape: BlockShape | undefined
+        }
+      | undefined,
+    movementState: 'NOT_MOVING' as MovementState,
+    onGround: true,
+    sneaking: false,
+    flying: false,
+    sprinting: false,
+    walkDist: 0,
+    prevWalkDist: 0,
+    bob: 0,
+    prevBob: 0,
+    itemUsageTicks: 0,
+    username: '',
+    onlineMode: false,
+    /** Dimension ambient lighting preset (e.g. nether) — from login/respawn dimension data when available */
+    cardinalLight: 'default' as string,
+    lightingDisabled: false,
+    shouldHideHand: false,
+    heldItemMain: undefined as HandItemBlock | undefined,
+    heldItemOff: undefined as HandItemBlock | undefined,
+    perspective: 'first_person' as CameraPerspective,
+    onFire: false,
+    /** Gameplay FOV scale (sprint, bow, zoom, etc.); base FOV comes from renderer options. */
+    fovMultiplier: 1,
 
-  cameraSpectatingEntity: undefined as number | undefined,
+    cameraSpectatingEntity: undefined as number | undefined,
 
-  team: undefined as Team | undefined,
-})
+    team: undefined as Team | undefined
+  })
 
 export const getPlayerStateUtils = (reactive: PlayerStateReactive) => ({
   isSpectator() {
@@ -80,7 +85,7 @@ export type PlayerStateRenderer = PlayerStateReactive
 export const getItemSelector = (playerState: PlayerStateRenderer, specificProperties: ItemSpecificContextProperties, item?: import('prismarine-item').Item) => {
   return {
     ...specificProperties,
-    'minecraft:date': new Date(),
+    'minecraft:date': new Date()
     // "minecraft:context_dimension": bot.entityp,
     // 'minecraft:time': bot.time.timeOfDay / 24_000,
   }

package/src/playerState/types.ts

@@ -23,15 +23,9 @@ export interface HandItemBlock {
 
 export type MovementState = 'NOT_MOVING' | 'WALKING' | 'SPRINTING' | 'SNEAKING'
 export type ItemSpecificContextProperties = Partial<
-  Pick<
-    ItemSelector['properties'],
-    | 'minecraft:using_item'
-    | 'minecraft:use_duration'
-    | 'minecraft:use_cycle'
-    | 'minecraft:display_context'
-  >
+  Pick<ItemSelector['properties'], 'minecraft:using_item' | 'minecraft:use_duration' | 'minecraft:use_cycle' | 'minecraft:display_context'>
 >
 export type CameraPerspective = 'first_person' | 'third_person_back' | 'third_person_front'
 
-export type BlockShape = { position: { x: number, y: number, z: number }; width: number; height: number; depth: number; }
+export type BlockShape = { position: { x: number; y: number; z: number }; width: number; height: number; depth: number }
 export type BlocksShapes = BlockShape[]

package/src/playground/allEntitiesDebug.ts

@@ -32,17 +32,19 @@ export const displayEntitiesDebugList = (mcData: IndexedData) => {
 
   // Test entities
   const results: Array<{
-    entity: string;
-    supported: boolean;
-    type?: 'obj' | 'bedrock' | 'gltf' | 'special';
-    mappedFrom?: string;
-    textureMap?: boolean;
-    errors?: string[];
+    entity: string
+    supported: boolean
+    type?: 'obj' | 'bedrock' | 'gltf' | 'special'
+    mappedFrom?: string
+    textureMap?: boolean
+    errors?: string[]
   }> = []
-  const entityNames = Object.keys(mcData.entitiesArray.reduce((acc, entity) => {
-    acc[entity.name] = true
-    return acc
-  }, {}))
+  const entityNames = Object.keys(
+    mcData.entitiesArray.reduce((acc, entity) => {
+      acc[entity.name] = true
+      return acc
+    }, {})
+  )
 
   // Add loading indicator
   const loading = document.createElement('div')
@@ -57,13 +59,12 @@ export const displayEntitiesDebugList = (mcData: IndexedData) => {
       results.push({
         entity,
         supported: true,
-        type: 'special',
+        type: 'special'
       })
       continue
     }
 
     try {
-
       const { mesh: entityMesh } = new EntityMesh(version, entity, undefined, {}, debugFlags)
       // find the most distant pos child
       globalThis.objects ??= {}
@@ -165,9 +166,11 @@ export const displayEntitiesDebugList = (mcData: IndexedData) => {
   }
 
   // log object with errors per entity
-  const errors = results.filter(r => r.errors).map(r => ({
-    entity: r.entity,
-    errors: r.errors
-  }))
+  const errors = results
+    .filter(r => r.errors)
+    .map(r => ({
+      entity: r.entity,
+      errors: r.errors
+    }))
   console.log(errors)
 }

package/src/playground/baseScene.ts

@@ -35,7 +35,7 @@ export interface PlaygroundSceneConfig {
 }
 
 const appGraphicBackends = [
-  createGraphicsBackendSingleThread,
+  createGraphicsBackendSingleThread
   // createGraphicsBackendOffThread
 ]
 
@@ -44,7 +44,7 @@ const includedVersions = globalThis.includedVersions
 export class BasePlaygroundScene {
   appViewer = new AppViewer({
     config: {
-      statsVisible: 2,
+      statsVisible: 2
     }
   })
 
@@ -68,13 +68,18 @@ export class BasePlaygroundScene {
   // GUI
   gui = new GUI()
   params = {} as Record<string, any>
-  paramOptions = {} as Partial<Record<keyof typeof this.params, {
-    hide?: boolean
-    options?: string[]
-    min?: number
-    max?: number
-    reloadOnChange?: boolean
-  }>>
+  paramOptions = {} as Partial<
+    Record<
+      keyof typeof this.params,
+      {
+        hide?: boolean
+        options?: string[]
+        min?: number
+        max?: number
+        reloadOnChange?: boolean
+      }
+    >
+  >
   onParamUpdate = {} as Record<string, () => void>
   alwaysIgnoreQs = [] as string[]
   skipUpdateQs = false
@@ -141,7 +146,7 @@ export class BasePlaygroundScene {
     })
   }
 
-  onParamsUpdate(paramName: string, object: any) { }
+  onParamsUpdate(paramName: string, object: any) {}
 
   updateQs(paramName: string, valueSet: any) {
     if (this.skipUpdateQs) return
@@ -201,16 +206,15 @@ export class BasePlaygroundScene {
   }
 
   // Overridable methods
-  setupWorld() { }
-  sceneReset() { }
+  setupWorld() {}
+  sceneReset() {}
 
   // eslint-disable-next-line max-params
   addWorldBlock(xOffset: number, yOffset: number, zOffset: number, blockName: BlockNames, properties?: Record<string, any>) {
     if (xOffset > 16 || yOffset > 16 || zOffset > 16) throw new Error('Offset too big')
-    const block =
-      properties ?
-        this.Block.fromProperties(this.mcData.blocksByName[blockName].id, properties ?? {}, 0) :
-        this.Block.fromStateId(this.mcData.blocksByName[blockName].defaultState, 0)
+    const block = properties
+      ? this.Block.fromProperties(this.mcData.blocksByName[blockName].id, properties ?? {}, 0)
+      : this.Block.fromStateId(this.mcData.blocksByName[blockName].defaultState, 0)
     this.world.setBlock(this.targetPos.offset(xOffset, yOffset, zOffset), block)
   }
 
@@ -291,12 +295,7 @@ export class BasePlaygroundScene {
 
     // Create our own camera for OrbitControls - this is separate from the internal worldRenderer camera
     // We sync our camera state to the backend via updateCamera()
-    this.camera = new THREE.PerspectiveCamera(
-      this.appViewer.inWorldRenderingConfig.fov || 75,
-      window.innerWidth / window.innerHeight,
-      0.1,
-      1000
-    )
+    this.camera = new THREE.PerspectiveCamera(this.appViewer.inWorldRenderingConfig.fov || 75, window.innerWidth / window.innerHeight, 0.1, 1000)
 
     // Setup world (adds blocks, etc.)
     this.setupWorld()
@@ -311,9 +310,7 @@ export class BasePlaygroundScene {
     if (this.enableCameraControls) {
       const canvas = document.querySelector('#viewer-canvas')
       if (canvas) {
-        const controls = this.enableCameraOrbitControl
-          ? new OrbitControls(this.camera, canvas as HTMLElement)
-          : undefined
+        const controls = this.enableCameraOrbitControl ? new OrbitControls(this.camera, canvas as HTMLElement) : undefined
         this.controls = controls
 
         this.resetCamera()
@@ -335,7 +332,7 @@ export class BasePlaygroundScene {
             this.camera.position.y.toFixed(2),
             this.camera.position.z.toFixed(2),
             this.camera.rotation.x.toFixed(2),
-            this.camera.rotation.y.toFixed(2),
+            this.camera.rotation.y.toFixed(2)
           ].join(',')
         }, 200)
 
@@ -483,9 +480,7 @@ export class BasePlaygroundScene {
     this.currentFps = fps
 
     const isSeriousDelay = this.maxFrameDelay > 150
-    const delayText = isSeriousDelay
-      ? `<span style="color: #ff4444;">${this.maxFrameDelay.toFixed(0)}ms</span>`
-      : `${this.maxFrameDelay.toFixed(0)}ms`
+    const delayText = isSeriousDelay ? `<span style="color: #ff4444;">${this.maxFrameDelay.toFixed(0)}ms</span>` : `${this.maxFrameDelay.toFixed(0)}ms`
 
     // Update the DOM element directly - single line format
     this.debugFpsElement.innerHTML = `FPS: ${fps} | Max Delay: ${delayText}`
@@ -502,16 +497,18 @@ export class BasePlaygroundScene {
   }
 
   addKeyboardShortcuts() {
-    document.addEventListener('keydown', (e) => {
+    document.addEventListener('keydown', e => {
       if (!e.shiftKey && !e.ctrlKey && !e.altKey && !e.metaKey) {
         if (e.code === 'KeyR') {
           this.controls?.reset()
           this.resetCamera()
         }
-        if (e.code === 'KeyE') { // refresh block (main)
+        if (e.code === 'KeyE') {
+          // refresh block (main)
           this.worldView!.setBlockStateId(this.targetPos, this.world.getBlockStateId(this.targetPos))
         }
-        if (e.code === 'KeyF') { // reload all chunks
+        if (e.code === 'KeyF') {
+          // reload all chunks
           this.sceneReset()
           this.worldView!.unloadAllChunks()
           void this.worldView!.init(this.targetPos)

package/src/playground/mobileControls.tsx

@@ -4,15 +4,15 @@ import { proxy, ref, useSnapshot } from 'valtio'
 export type ButtonName = 'jump' | 'sneak'
 
 export const joystickPointer = proxy({
-  pointer: null as { x: number, y: number, pointerId: number } | null,
-  joystickInner: null as HTMLDivElement | null,
+  pointer: null as { x: number; y: number; pointerId: number } | null,
+  joystickInner: null as HTMLDivElement | null
 })
 
 export const cameraPointer = proxy({
-  pointer: null as { x: number, y: number, pointerId: number } | null,
+  pointer: null as { x: number; y: number; pointerId: number } | null
 })
 
-export const handleMovementStickDelta = (e?: { clientX: number, clientY: number }) => {
+export const handleMovementStickDelta = (e?: { clientX: number; clientY: number }) => {
   const max = 32
   let x = 0
   let y = 0
@@ -31,7 +31,7 @@ export const handleMovementStickDelta = (e?: { clientX: number, clientY: number
   const vector = {
     x: x / max,
     y: 0,
-    z: y / max,
+    z: y / max
   }
 
   console.log('Movement vector:', vector)
@@ -81,12 +81,12 @@ export const MobileControls = () => {
 
     const buttonPositions = {
       jump: [85, 60],
-      sneak: [85, 75],
+      sneak: [85, 75]
     }
 
     const buttonIcons = {
       jump: '↑',
-      sneak: '↓',
+      sneak: '↓'
     }
 
     return {
@@ -107,7 +107,7 @@ export const MobileControls = () => {
         fontSize: '16px',
         userSelect: 'none',
         transform: 'translate(-50%, -50%)',
-        border: '2px solid rgba(255, 255, 255, 0.3)',
+        border: '2px solid rgba(255, 255, 255, 0.3)'
       } satisfies CSSProperties,
       onPointerDown(e: PType) {
         const elem = e.currentTarget as HTMLElement
@@ -117,7 +117,7 @@ export const MobileControls = () => {
       },
       onPointerUp: pointerup,
       onLostPointerCapture: pointerup,
-      children: buttonIcons[name],
+      children: buttonIcons[name]
     }
   }
 
@@ -129,140 +129,144 @@ export const MobileControls = () => {
 
   if (!usingTouch) return null
 
-  return <div>
-    {/* Movement Joystick */}
-    <div
-      className='movement_joystick_outer'
-      ref={joystickOuter}
-      style={{
-        display: movementPointer ? 'flex' : 'none',
-        borderRadius: '50%',
-        width: joystickSize,
-        height: joystickSize,
-        border: '2px solid rgba(0, 0, 0, 0.5)',
-        backgroundColor: 'rgba(255, 255, 255, 0.3)',
-        position: 'fixed',
-        justifyContent: 'center',
-        alignItems: 'center',
-        transform: 'translate(-50%, -50%)',
-        zIndex: Z_INDEX_INTERACTIBLE,
-        ...(movementPointer ? {
-          left: `${movementPointer.x / window.innerWidth * 100}%`,
-          top: `${movementPointer.y / window.innerHeight * 100}%`
-        } : {}),
-      }}
-    >
+  return (
+    <div>
+      {/* Movement Joystick */}
       <div
-        className='movement_joystick_inner'
+        className="movement_joystick_outer"
+        ref={joystickOuter}
         style={{
+          display: movementPointer ? 'flex' : 'none',
           borderRadius: '50%',
-          width: joystickSize * 0.35,
-          height: joystickSize * 0.35,
-          backgroundColor: 'rgba(0, 0, 0, 0.5)',
-          position: 'absolute',
+          width: joystickSize,
+          height: joystickSize,
+          border: '2px solid rgba(0, 0, 0, 0.5)',
+          backgroundColor: 'rgba(255, 255, 255, 0.3)',
+          position: 'fixed',
+          justifyContent: 'center',
+          alignItems: 'center',
+          transform: 'translate(-50%, -50%)',
+          zIndex: Z_INDEX_INTERACTIBLE,
+          ...(movementPointer
+            ? {
+                left: `${(movementPointer.x / window.innerWidth) * 100}%`,
+                top: `${(movementPointer.y / window.innerHeight) * 100}%`
+              }
+            : {})
         }}
-        ref={joystickInner}
-      />
-    </div>
+      >
+        <div
+          className="movement_joystick_inner"
+          style={{
+            borderRadius: '50%',
+            width: joystickSize * 0.35,
+            height: joystickSize * 0.35,
+            backgroundColor: 'rgba(0, 0, 0, 0.5)',
+            position: 'absolute'
+          }}
+          ref={joystickInner}
+        />
+      </div>
+
+      {/* Up/Down Action Buttons */}
+      <div {...buttonProps('jump')} />
+      <div {...buttonProps('sneak')} />
+
+      {/* Movement touch area (left half of screen) */}
+      <div
+        style={{
+          position: 'fixed',
+          left: '0',
+          top: '0',
+          width: '50%',
+          height: '100%',
+          zIndex: Z_INDEX_INTERACTIBLE - 1
+        }}
+        onPointerDown={e => {
+          if (joystickPointer.pointer) return
 
-    {/* Up/Down Action Buttons */}
-    <div {...buttonProps('jump')} />
-    <div {...buttonProps('sneak')} />
+          joystickPointer.pointer = {
+            x: e.clientX,
+            y: e.clientY,
+            pointerId: e.pointerId
+          }
 
-    {/* Movement touch area (left half of screen) */}
-    <div
-      style={{
-        position: 'fixed',
-        left: '0',
-        top: '0',
-        width: '50%',
-        height: '100%',
-        zIndex: Z_INDEX_INTERACTIBLE - 1,
-      }}
-      onPointerDown={(e) => {
-        if (joystickPointer.pointer) return
-
-        joystickPointer.pointer = {
-          x: e.clientX,
-          y: e.clientY,
-          pointerId: e.pointerId,
-        }
+          const elem = e.currentTarget as HTMLElement
+          elem.setPointerCapture(e.pointerId)
+        }}
+        onPointerMove={e => {
+          if (!joystickPointer.pointer || e.pointerId !== joystickPointer.pointer.pointerId) return
 
-        const elem = e.currentTarget as HTMLElement
-        elem.setPointerCapture(e.pointerId)
-      }}
-      onPointerMove={(e) => {
-        if (!joystickPointer.pointer || e.pointerId !== joystickPointer.pointer.pointerId) return
+          handleMovementStickDelta({
+            clientX: e.clientX,
+            clientY: e.clientY
+          })
+        }}
+        onPointerUp={e => {
+          if (!joystickPointer.pointer || e.pointerId !== joystickPointer.pointer.pointerId) return
 
-        handleMovementStickDelta({
-          clientX: e.clientX,
-          clientY: e.clientY,
-        })
-      }}
-      onPointerUp={(e) => {
-        if (!joystickPointer.pointer || e.pointerId !== joystickPointer.pointer.pointerId) return
+          joystickPointer.pointer = null
+          handleMovementStickDelta() // Reset position
 
-        joystickPointer.pointer = null
-        handleMovementStickDelta() // Reset position
+          const elem = e.currentTarget as HTMLElement
+          elem.releasePointerCapture(e.pointerId)
+        }}
+        onLostPointerCapture={e => {
+          if (!joystickPointer.pointer || e.pointerId !== joystickPointer.pointer.pointerId) return
 
-        const elem = e.currentTarget as HTMLElement
-        elem.releasePointerCapture(e.pointerId)
-      }}
-      onLostPointerCapture={(e) => {
-        if (!joystickPointer.pointer || e.pointerId !== joystickPointer.pointer.pointerId) return
-
-        joystickPointer.pointer = null
-        handleMovementStickDelta() // Reset position
-      }}
-    />
-
-    {/* Camera rotation touch area (right half of screen, excluding buttons) */}
-    <div
-      style={{
-        position: 'fixed',
-        right: '0',
-        top: '0',
-        width: '50%',
-        height: '100%',
-        zIndex: Z_INDEX_INTERACTIBLE - 2,
-      }}
-      onPointerDown={(e) => {
-        if (cameraPointer.pointer) return
-
-        cameraPointer.pointer = {
-          x: e.clientX,
-          y: e.clientY,
-          pointerId: e.pointerId,
-        }
+          joystickPointer.pointer = null
+          handleMovementStickDelta() // Reset position
+        }}
+      />
 
-        const elem = e.currentTarget as HTMLElement
-        elem.setPointerCapture(e.pointerId)
-      }}
-      onPointerMove={(e) => {
-        if (!cameraPointer.pointer || e.pointerId !== cameraPointer.pointer.pointerId) return
+      {/* Camera rotation touch area (right half of screen, excluding buttons) */}
+      <div
+        style={{
+          position: 'fixed',
+          right: '0',
+          top: '0',
+          width: '50%',
+          height: '100%',
+          zIndex: Z_INDEX_INTERACTIBLE - 2
+        }}
+        onPointerDown={e => {
+          if (cameraPointer.pointer) return
+
+          cameraPointer.pointer = {
+            x: e.clientX,
+            y: e.clientY,
+            pointerId: e.pointerId
+          }
 
-        const deltaX = e.clientX - cameraPointer.pointer.x
-        const deltaY = e.clientY - cameraPointer.pointer.y
+          const elem = e.currentTarget as HTMLElement
+          elem.setPointerCapture(e.pointerId)
+        }}
+        onPointerMove={e => {
+          if (!cameraPointer.pointer || e.pointerId !== cameraPointer.pointer.pointerId) return
 
-        handleCameraRotation(deltaX, deltaY)
+          const deltaX = e.clientX - cameraPointer.pointer.x
+          const deltaY = e.clientY - cameraPointer.pointer.y
 
-        // Update pointer position for continuous rotation
-        cameraPointer.pointer.x = e.clientX
-        cameraPointer.pointer.y = e.clientY
-      }}
-      onPointerUp={(e) => {
-        if (!cameraPointer.pointer || e.pointerId !== cameraPointer.pointer.pointerId) return
+          handleCameraRotation(deltaX, deltaY)
 
-        cameraPointer.pointer = null
+          // Update pointer position for continuous rotation
+          cameraPointer.pointer.x = e.clientX
+          cameraPointer.pointer.y = e.clientY
+        }}
+        onPointerUp={e => {
+          if (!cameraPointer.pointer || e.pointerId !== cameraPointer.pointer.pointerId) return
 
-        const elem = e.currentTarget as HTMLElement
-        elem.releasePointerCapture(e.pointerId)
-      }}
-      onLostPointerCapture={(e) => {
-        if (!cameraPointer.pointer || e.pointerId !== cameraPointer.pointer.pointerId) return
-
-        cameraPointer.pointer = null
-      }}
-    />
-  </div>
+          cameraPointer.pointer = null
+
+          const elem = e.currentTarget as HTMLElement
+          elem.releasePointerCapture(e.pointerId)
+        }}
+        onLostPointerCapture={e => {
+          if (!cameraPointer.pointer || e.pointerId !== cameraPointer.pointer.pointerId) return
+
+          cameraPointer.pointer = null
+        }}
+      />
+    </div>
+  )
 }