feat: minimap and full screen map (disabled by default)

.eslintignore

@@ -4,3 +4,4 @@ rsbuild.config.ts
 *.generated.ts
 generated
 public
+**/*/rsbuildSharedConfig.ts

package.json

@@ -93,6 +93,7 @@
     "react-dom": "^18.2.0",
     "react-select": "^5.8.0",
     "react-transition-group": "^4.4.5",
+    "react-zoom-pan-pinch": "3.4.4",
     "remark": "^15.0.1",
     "sanitize-filename": "^1.6.3",
     "skinview3d": "^3.0.1",

prismarine-viewer/viewer/lib/mesher/models.ts

@@ -4,8 +4,10 @@
 import { BlockType } from '../../../examples/shared'
 import { World, BlockModelPartsResolved, WorldBlock as Block } from './world'
 import { BlockElement, buildRotationMatrix, elemFaces, matmul3, matmulmat3, vecadd3, vecsub3 } from './modelsGeometryCommon'
+import { INVISIBLE_BLOCKS } from './worldConstants'
 import { MesherGeometryOutput } from './shared'
 
+
 let blockProvider: WorldBlockProvider
 
 const tints: any = {}
@@ -126,7 +128,7 @@
   }))
 }
 
 function renderLiquid (world: World, cursor: Vec3, texture: any | undefined, type: number, biome: string, water: boolean, attr: Record<string, any>) {
   const heights: number[] = []
   for (let z = -1; z <= 1; z++) {
     for (let x = -1; x <= 1; x++) {
@@ -198,7 +200,7 @@
 
 let needRecompute = false
 
 function renderElement (world: World, cursor: Vec3, element: BlockElement, doAO: boolean, attr: MesherGeometryOutput, globalMatrix: any, globalShift: any, block: Block, biome: string) {
   const position = cursor
   // const key = `${position.x},${position.y},${position.z}`
   // if (!globalThis.allowedBlocks.includes(key)) return
@@ -386,8 +388,6 @@
   }
 }
 
-const invisibleBlocks = new Set(['air', 'cave_air', 'void_air', 'barrier'])
-
 const isBlockWaterlogged = (block: Block) => block.getProperties().waterlogged === true || block.getProperties().waterlogged === 'true'
 
 let unknownBlockModel: BlockModelPartsResolved
@@ -421,7 +421,7 @@
     for (cursor.z = sz; cursor.z < sz + 16; cursor.z++) {
       for (cursor.x = sx; cursor.x < sx + 16; cursor.x++) {
         const block = world.getBlock(cursor)!
-        if (!invisibleBlocks.has(block.name)) {
+        if (!INVISIBLE_BLOCKS.has(block.name)) {
           const highest = attr.highestBlocks[`${cursor.x},${cursor.z}`]
           if (!highest || highest.y < cursor.y) {
             attr.highestBlocks[`${cursor.x},${cursor.z}`] = {
@@ -430,7 +430,7 @@
             }
           }
         }
-        if (invisibleBlocks.has(block.name)) continue
+        if (INVISIBLE_BLOCKS.has(block.name)) continue
         if (block.name.includes('_sign') || block.name === 'sign') {
           const key = `${cursor.x},${cursor.y},${cursor.z}`
           const props: any = block.getProperties()
@@ -475,7 +475,7 @@
         } else if (block.name === 'lava') {
           renderLiquid(world, cursor, blockProvider.getTextureInfo('lava_still'), block.type, biome, false, attr)
         }
-        if (block.name !== 'water' && block.name !== 'lava' && !invisibleBlocks.has(block.name)) {
+        if (block.name !== 'water' && block.name !== 'lava' && !INVISIBLE_BLOCKS.has(block.name)) {
           // cache
           let { models } = block
           if (block.models === undefined) {

prismarine-viewer/viewer/lib/mesher/test/tests.test.ts

@@ -1,5 +1,6 @@
 import { test, expect } from 'vitest'
 import supportedVersions from '../../../../../src/supportedVersions.mjs'
+import { INVISIBLE_BLOCKS } from '../worldConstants'
 import { setup } from './mesherTester'
 
 const lastVersion = supportedVersions.at(-1)
@@ -16,7 +17,7 @@ const addPositions = [
 
 test('Known blocks are not rendered', () => {
   const { mesherWorld, getGeometry, pos, mcData } = setup(lastVersion, addPositions as any)
-  const ignoreAsExpected = new Set(['air', 'cave_air', 'void_air', 'barrier', 'water', 'lava', 'moving_piston', 'light'])
+  const ignoreAsExpected = new Set([...INVISIBLE_BLOCKS, 'water', 'lava', 'moving_piston', 'light'])
 
   let time = 0
   let times = 0

prismarine-viewer/viewer/lib/mesher/worldConstants.ts

@@ -0,0 +1 @@
+export const INVISIBLE_BLOCKS = new Set(['air', 'void_air', 'cave_air', 'barrier'])

src/controls.ts

@@ -52,6 +52,7 @@ export const contro = new ControMax({
     },
     ui: {
       back: [null/* 'Escape' */, 'B'],
+      toggleMap: ['KeyM'],
       leftClick: [null, 'A'],
       rightClick: [null, 'Y'],
       speedupCursor: [null, 'Left Stick'],

src/globalState.ts

@@ -1,6 +1,7 @@
 //@ts-check
 
 import { proxy, ref, subscribe } from 'valtio'
+import { WorldWarp } from 'flying-squid/dist/lib/modules/warps'
 import { pointerLock } from './utils'
 import type { OptionsGroupType } from './optionsGuiScheme'
 
@@ -150,6 +151,7 @@ export const gameAdditionalState = proxy({
   isFlying: false,
   isSprinting: false,
   isSneaking: false,
+  warps: [] as WorldWarp[]
 })
 
 window.gameAdditionalState = gameAdditionalState

src/optionsGuiScheme.tsx

@@ -232,6 +232,27 @@ export const guiOptionsScheme: {
         ],
       },
     },
+    {
+      custom () {
+        return <Category>Map</Category>
+      },
+      showMinimap: {
+        text: 'Show minimap',
+        values: [
+          'always',
+          'singleplayer',
+          'never'
+        ],
+      },
+      showFullmap: {
+        text: 'Show fullmap',
+        values: [
+          'always',
+          'singleplayer',
+          'never'
+        ],
+      },
+    },
     {
       custom () {
         return <Category>Experimental</Category>

src/optionsStorage.ts

@@ -82,6 +82,8 @@ const defaultOptions = {
   /** Wether to popup sign editor on server action */
   autoSignEditor: true,
   wysiwygSignEditor: 'auto' as 'auto' | 'always' | 'never',
+  showMinimap: 'always' as 'always' | 'singleplayer' | 'never',
+  showFullmap: 'always' as 'always' | 'singleplayer' | 'never',
   displayBossBars: false, // boss bar overlay was removed for some reason, enable safely
   disabledUiParts: [] as string[],
   neighborChunkUpdates: true

src/react/Fullmap.css

@@ -0,0 +1,13 @@
+
+.map {
+  width: 70% !important;
+  height: 80% !important;
+  border: 1px solid black;
+}
+
+@media (max-width: 500px) {
+  .map {
+    width: 100% !important;
+    height: 100% !important;
+  }
+}