almost ok for the app

prismarine-viewer/examples/_FragmentShader.frag

@@ -14,8 +14,8 @@ uniform sampler2D texture2;
 void main()
 {
 	vec2 position = vec2(1, 1);	// I assume gets tile at (1, 1) since the size of the tiles are 1/16
-	vec2 size = vec2(1.0/64.0f, 1.0/64.0f);
-    vec2 coord = size * vec2(int(TextureIndex)%64,int(TextureIndex)/64) + TexCoord * (1.0f/64.0f);
+	vec2 size = vec2(1.0/32.0f, 1.0/32.0f);
+    vec2 coord = size * vec2(int(TextureIndex)%64,int(TextureIndex)/64) + TexCoord * (1.0f/32.0f);
 
     FragColor = mix(texture(texture1, coord), texture(texture2, coord), 1.0);
 }

prismarine-viewer/examples/webglRenderer.ts

@@ -18,12 +18,18 @@ declare const viewer: Viewer
 
 let renderLoop
 export const makeRender = () => {
-    renderLoop()
+    renderLoop?.()
 }
 
-export const cubePositions = [] as [number, number, number, string | null][]
+let cubePositions
+let updateCubes
+export const updateCubePositions = () => {
+    updateCubes()
+}
+
+export const cubePositionsRaw = [] as [number, number, number, string | null][]
 
-export const initWeblRenderer = async (version) => {
+export const initWebglRenderer = async (version) => {
     const stats = new Stats()
     const canvas = document.createElement('canvas')
     const gl = canvas.getContext('webgl2')!
@@ -76,7 +82,7 @@ export const initWeblRenderer = async (version) => {
 
     let NumberOfCube = 1_000_000
 
-    let cubePositions = new Float32Array(NumberOfCube * 3)
+    cubePositions = new Float32Array(NumberOfCube * 3)
     let cubeTextureIndices = new Float32Array(NumberOfCube);
 
 
@@ -85,21 +91,40 @@ export const initWeblRenderer = async (version) => {
         cubePositions[i] = Math.random() * 1000 - 500;
         cubePositions[i + 1] = Math.random() * 1000 - 500;
         cubePositions[i + 2] = Math.random() * 100 - 100;
-        cubeTextureIndices[i / 3] = Math.floor(Math.random() * 400 + 400);
+        // cubeTextureIndices[i / 3] = Math.floor(Math.random() * 400 + 400);
+        cubeTextureIndices[i / 3] = 0;
     }
     cubePositions[0] = 0;
     cubePositions[1] = 0;
     cubePositions[2] = 0;
 
     let instanceVBO = gl.createBuffer();
-    gl.bindBuffer(gl.ARRAY_BUFFER, instanceVBO);
-    gl.bufferData(gl.ARRAY_BUFFER, cubePositions, gl.STATIC_DRAW);
-    gl.bindBuffer(gl.ARRAY_BUFFER, null);
-
     let instanceTextureID = gl.createBuffer();
-    gl.bindBuffer(gl.ARRAY_BUFFER, instanceTextureID);
-    gl.bufferData(gl.ARRAY_BUFFER, cubeTextureIndices, gl.STATIC_DRAW);
-    gl.bindBuffer(gl.ARRAY_BUFFER, null);
+    updateCubes = () => {
+        cubePositions = new Float32Array(cubePositionsRaw.length * 3)
+        cubeTextureIndices = new Float32Array(cubePositionsRaw.length);
+
+        cubePositionsRaw.forEach(([x, y, z, name], i) => {
+            cubePositions[i * 3] = x
+            cubePositions[i * 3 + 1] = y
+            cubePositions[i * 3 + 2] = z
+            // just set index to 0 for now
+            cubeTextureIndices[i] = 0
+        })
+
+
+        gl.bindBuffer(gl.ARRAY_BUFFER, instanceVBO);
+        gl.bufferData(gl.ARRAY_BUFFER, cubePositions, gl.STATIC_DRAW);
+        gl.bindBuffer(gl.ARRAY_BUFFER, null);
+
+        gl.bindBuffer(gl.ARRAY_BUFFER, instanceTextureID);
+        gl.bufferData(gl.ARRAY_BUFFER, cubeTextureIndices, gl.STATIC_DRAW);
+        gl.bindBuffer(gl.ARRAY_BUFFER, null);
+    }
+
+    updateCubes()
+    globalThis.updateCubes = updateCubes
+
 
     let VBO, VAO = gl.createVertexArray();
     VBO = gl.createBuffer();
@@ -299,9 +324,6 @@ export const initWeblRenderer = async (version) => {
         //gl.bindVertexArray(null)
 
         //let i = 0
-        // CubePositions = [[
-        //     2, 90, 2
-        // ]]
         // const cubePositions = Object.values(viewer.world.newChunks).map((chunk: any) => {
         //     return Object.entries(chunk.blocks).map(([pos, block]) => {
         //         return [...pos.split(',').map(Number), block] as [number, number, number, string]

prismarine-viewer/viewer/lib/models.ts

@@ -418,7 +418,6 @@ export function getSectionGeometry (sx, sy, sz, world: World) {
         }
 
         for (const variant of block.variant) {
-          console.log(variant)
           if (!variant || !variant.model) continue
 
           if (block.name !== 'water' && block.name !== 'lava'/*  && block.isCube */) {
@@ -455,7 +454,8 @@ export function getSectionGeometry (sx, sy, sz, world: World) {
                   }
                 }
 
-                attr.blocks[`${cursor.x},${cursor.y},${cursor.z}`] = block.name
+                const pos = block.position
+                attr.blocks[`${pos.x},${pos.y},${pos.z}`] = block.name
               }
             }
           }

prismarine-viewer/viewer/lib/worldrenderer.ts

@@ -10,7 +10,7 @@ import { toMajor } from './version.js'
 import PrismarineChatLoader from 'prismarine-chat'
 import { renderSign } from '../sign-renderer/'
 import { chunkPos, sectionPos } from './simpleUtils'
-import { addCubes, cubePositions } from '../../examples/webglRenderer'
+import { cubePositionsRaw, updateCubePositions } from '../../examples/webglRenderer'
 
 function mod (x, n) {
   return ((x % n) + n) % n
@@ -90,10 +90,10 @@ export class WorldRenderer {
           if (/* !this.loadedChunks[chunkCoords[0] + ',' + chunkCoords[2]] ||  */ !this.active) return
 
           this.newChunks[data.key] = data.geometry
-          // cubePositions.push(...Object.entries(data.geometry.blocks).map(([pos, block]) => {
-          //   return [...pos.split(',').map(Number), block] as [number, number, number, string]
-          // }))
-
+          cubePositionsRaw.push(...Object.entries(data.geometry.blocks).map(([pos, block]) => {
+            return [...pos.split(',').map(Number), block] as [number, number, number, string]
+          }))
+          updateCubePositions()
 
           // if (!this.initialChunksLoad && this.enableChunksLoadDelay) {
           //   const newPromise = new Promise(resolve => {

src/index.ts

@@ -96,6 +96,7 @@ import { handleMovementStickDelta, joystickPointer } from './react/TouchAreasCon
 import { possiblyHandleStateVariable } from './googledrive'
 import flyingSquidEvents from './flyingSquidEvents'
 import { hideNotification, notificationProxy } from './react/NotificationProvider'
+import { initWebglRenderer } from 'prismarine-viewer/examples/webglRenderer'
 
 window.debug = debug
 window.THREE = THREE
@@ -178,11 +179,18 @@ let previousWindowWidth = window.innerWidth
 let previousWindowHeight = window.innerHeight
 let max = 0
 let rendered = 0
+let windowFocused = true
+window.addEventListener('focus', () => {
+  windowFocused = true
+})
+window.addEventListener('blur', () => {
+  windowFocused = false
+})
 const renderFrame = (time: DOMHighResTimeStamp) => {
   if (window.stopLoop) return
   for (const fn of beforeRenderFrame) fn()
   window.requestAnimationFrame(renderFrame)
-  if (window.stopRender || renderer.xr.isPresenting) return
+  if (window.stopRender || renderer.xr.isPresenting || !windowFocused) return
   if (renderInterval) {
     delta += time - lastTime
     lastTime = time
@@ -228,6 +236,7 @@ const resizeHandler = () => {
   }
 }
 
+initWebglRenderer('1.14.4')
 const hud = document.getElementById('hud')
 const pauseMenu = document.getElementById('pause-screen')
 
@@ -440,6 +449,7 @@ async function connect (connectOptions: {
       viewer.setVersion(version)
     }
 
+    serverOptions.version = '1.14.4'
     const downloadVersion = connectOptions.botVersion || (singleplayer ? serverOptions.version : undefined)
     if (downloadVersion) {
       await downloadMcData(downloadVersion)