feat: app <-> renderer REWORK. Add new layers for stability

.gitignore

@@ -10,7 +10,7 @@ localSettings.mjs
 dist*
 .DS_Store
 .idea/
-world
+/world
 data*.json
 out
 *.iml

README.MD

@@ -24,6 +24,7 @@ For building the project yourself / contributing, see [Development, Debugging &
 - Custom protocol channel extensions (eg for custom block models in the world)
 - Play with friends over internet! (P2P is powered by Peer.js discovery servers)
 - ~~Google Drive support for reading / saving worlds back to the cloud~~
+- Support for custom rendering 3D engines. Modular architecture.
 - even even more!
 
 All components that are in [Storybook](https://mcraft.fun/storybook) are published as npm module and can be used in other projects: [`minecraft-react`](https://npmjs.com/minecraft-react)

renderer/playground/baseScene.ts

@@ -1,3 +1,4 @@
+//@ts-nocheck
 import { Vec3 } from 'vec3'
 import * as THREE from 'three'
 import '../../src/getCollisionShapes'

renderer/playground/playground.ts

@@ -1,11 +1,12 @@
-import { BasePlaygroundScene } from './baseScene'
-import { playgroundGlobalUiState } from './playgroundUi'
-import * as scenes from './scenes'
+if (!new URL(location.href).searchParams.get('playground')) location.href = '/?playground=true'
+// import { BasePlaygroundScene } from './baseScene'
+// import { playgroundGlobalUiState } from './playgroundUi'
+// import * as scenes from './scenes'
 
-const qsScene = new URLSearchParams(window.location.search).get('scene')
-const Scene: typeof BasePlaygroundScene = qsScene ? scenes[qsScene] : scenes.main
-playgroundGlobalUiState.scenes = ['main', 'railsCobweb', 'floorRandom', 'lightingStarfield', 'transparencyIssue', 'entities', 'frequentUpdates', 'slabsOptimization', 'allEntities']
-playgroundGlobalUiState.selected = qsScene ?? 'main'
+// const qsScene = new URLSearchParams(window.location.search).get('scene')
+// const Scene: typeof BasePlaygroundScene = qsScene ? scenes[qsScene] : scenes.main
+// playgroundGlobalUiState.scenes = ['main', 'railsCobweb', 'floorRandom', 'lightingStarfield', 'transparencyIssue', 'entities', 'frequentUpdates', 'slabsOptimization', 'allEntities']
+// playgroundGlobalUiState.selected = qsScene ?? 'main'
 
-const scene = new Scene()
-globalThis.scene = scene
+// const scene = new Scene()
+// globalThis.scene = scene

renderer/playground/scenes/allEntities.ts

@@ -1,3 +1,4 @@
+//@ts-nocheck
 import { BasePlaygroundScene } from '../baseScene'
 import { EntityDebugFlags, EntityMesh, rendererSpecialHandled } from '../../viewer/lib/entity/EntityMesh'
 
@@ -42,7 +43,7 @@
       errors?: string[];
     }> = []
     const { mcData } = window
     const entityNames = Object.keys(mcData.entitiesArray.reduce((acc, entity) => {
       acc[entity.name] = true
       return acc
     }, {}))

renderer/playground/scenes/entities.ts

@@ -1,3 +1,4 @@
+//@ts-nocheck
 import * as THREE from 'three'
 import { Vec3 } from 'vec3'
 import { BasePlaygroundScene } from '../baseScene'

renderer/playground/scenes/frequentUpdates.ts

@@ -1,3 +1,4 @@
+//@ts-nocheck
 import { Vec3 } from 'vec3'
 import { BasePlaygroundScene } from '../baseScene'
 

renderer/playground/scenes/lightingStarfield.ts

@@ -1,3 +1,4 @@
+//@ts-nocheck
 import * as THREE from 'three'
 import { Vec3 } from 'vec3'
 import { BasePlaygroundScene } from '../baseScene'

renderer/playground/scenes/main.ts

@@ -1,3 +1,4 @@
+//@ts-nocheck
 // eslint-disable-next-line import/no-named-as-default
 import GUI, { Controller } from 'lil-gui'
 import * as THREE from 'three'
@@ -173,7 +174,6 @@
     canvas.height = size
     renderer.setSize(size, size)
 
-    //@ts-expect-error
     viewer.camera = new THREE.OrthographicCamera(-1, 1, 1, -1, 0, 10)
     viewer.scene.background = null
 
@@ -213,7 +213,7 @@
       })
       if (onlyCurrent) {
         viewer.render()
         onWorldUpdate()
       } else {
         // will be called on every render update
         viewer.world.renderUpdateEmitter.addListener('update', onWorldUpdate)
@@ -248,9 +248,9 @@
       zip.file(`${blockName}.png`, dataUrl.split(',')[1], { base64: true })
 
       if (onlyCurrent) {
         end()
       } else {
         nextBlock()
       }
     }
     const nextBlock = async () => {
@@ -264,7 +264,7 @@
       if (blockName) {
         updateBlock()
       } else {
         end()
       }
     }
   }

renderer/viewer/baseGraphicsBackend.ts

@@ -0,0 +1,15 @@
+import { RendererReactiveState } from '../../src/appViewer'
+
+export const getDefaultRendererState = (): RendererReactiveState => {
+  return {
+    world: {
+      chunksLoaded: [],
+      chunksTotalNumber: 0,
+      allChunksLoaded: true,
+      mesherWork: false,
+      intersectMedia: null
+    },
+    renderer: '',
+    preventEscapeMenu: false
+  }
+}

renderer/viewer/lib/basePlayerState.ts

@@ -3,6 +3,7 @@ import { Vec3 } from 'vec3'
 import TypedEmitter from 'typed-emitter'
 import { ItemSelector } from 'mc-assets/dist/itemDefinitions'
 import { proxy } from 'valtio'
+import { GameMode } from 'mineflayer'
 import { HandItemBlock } from './holdingBlock'
 
 export type MovementState = 'NOT_MOVING' | 'WALKING' | 'SPRINTING' | 'SNEAKING'
@@ -22,6 +23,7 @@ export interface IPlayerState {
   isFlying(): boolean
   isSprinting (): boolean
   getItemUsageTicks?(): number
+  getPosition(): Vec3
   // isUsingItem?(): boolean
   getHeldItem?(isLeftHand: boolean): HandItemBlock | undefined
   username?: string
@@ -31,12 +33,21 @@ export interface IPlayerState {
 
   reactive: {
     playerSkin: string | undefined
+    inWater: boolean
+    backgroundColor: [number, number, number]
+    ambientLight: number
+    directionalLight: number
+    gameMode?: GameMode
   }
 }
 
 export class BasePlayerState implements IPlayerState {
   reactive = proxy({
-    playerSkin: undefined
+    playerSkin: undefined as string | undefined,
+    inWater: false,
+    backgroundColor: [0, 0, 0] as [number, number, number],
+    ambientLight: 0,
+    directionalLight: 0,
   })
   protected movementState: MovementState = 'NOT_MOVING'
   protected velocity = new Vec3(0, 0, 0)
@@ -74,6 +85,10 @@ export class BasePlayerState implements IPlayerState {
     return this.sprinting
   }
 
+  getPosition (): Vec3 {
+    return new Vec3(0, 0, 0)
+  }
+
   // For testing purposes
   setState (state: Partial<{
     movementState: MovementState