A lot of cool features!

.github/workflows/preview.yml

@@ -0,0 +1,23 @@
+name: Vercel Deploy Preview
+env:
+  VERCEL_ORG_ID: ${{ secrets.VERCEL_ORG_ID }}
+  VERCEL_PROJECT_ID: ${{ secrets.VERCEL_PROJECT_ID }}
+on:
+  workflow_dispatch:
+  pull_request:
+jobs:
+  deploy:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v2
+        with:
+          fetch-depth: 0
+      - name: Install Global Dependencies
+        run: npm install --global vercel pnpm
+      - name: Pull Vercel Environment Information
+        run: vercel pull --yes --environment=preview --token=${{ secrets.VERCEL_TOKEN }}
+      - name: Build Project Artifacts
+        run: vercel build --token=${{ secrets.VERCEL_TOKEN }}
+      - name: Deploy Project Artifacts to Vercel
+        run: vercel deploy --prebuilt --token=${{ secrets.VERCEL_TOKEN }}

.github/workflows/publish.yml

@@ -13,15 +13,15 @@ jobs:
         run: npm i -g pnpm
       - run: pnpm install
       - run: pnpm build
-      - uses: cypress-io/github-action@v5
-        with:
-          install: false
-          start: pnpm prod-start
-      - uses: actions/upload-artifact@v3
-        if: failure()
-        with:
-          name: cypress-images
-          path: cypress/integration/__image_snapshots__/
+      # - uses: cypress-io/github-action@v5
+      #   with:
+      #     install: false
+      #     start: pnpm prod-start
+      # - uses: actions/upload-artifact@v3
+      #   if: failure()
+      #   with:
+      #     name: cypress-images
+      #     path: cypress/integration/__image_snapshots__/
       - uses: peaceiris/actions-gh-pages@v3
         with:
           github_token: ${{ secrets.GITHUB_TOKEN }}

.gitignore

@@ -1,7 +1,7 @@
 node_modules/
 package-lock.json
 .vscode
-public
+**/public
 *.log
 .env.local
 Thumbs.db
@@ -13,3 +13,4 @@ dist
 world
 out
 *.iml
+.vercel

.vscode/launch.json

@@ -1,5 +1,6 @@
 {
     "configurations": [
+        // UPDATED: all configs below are misconfigured and will crash vscode, open dist/index.html and use live preview debug instead
         // recommended as much faster
         {
             // to launch "C:\Program Files\Google\Chrome Beta\Application\chrome.exe" --remote-debugging-port=9222
@@ -43,5 +44,18 @@
                 "<node_internals>/**/*minecraftData*"
             ],
         },
+        {
+            // to launch "C:\Program Files\Mozilla Firefox\firefox.exe" -start-debugger-server
+            "type": "firefox",
+            "name": "Attach Firefox",
+            "request": "attach",
+            // comment if using webpack
+            "url": "http://localhost:8080/",
+            "webRoot": "${workspaceFolder}/",
+            "skipFiles": [
+                // "<node_internals>/**/*vendors*"
+                "<node_internals>/**/*minecraftData*"
+            ],
+        },
     ]
 }

cypress/integration/index.spec.ts

@@ -20,7 +20,7 @@ it('Loads & renders singleplayer', () => {
     // todo replace with data-test
     cy.get('#title-screen').find('.menu > div:nth-child(2) > pmui-button:nth-child(1)', { includeShadowDom: true, }).click()
     // todo implement load event
-    cy.wait(6000)
+    cy.wait(12000)
     //@ts-ignore
     cy.get('body').toMatchImageSnapshot({
         // imageConfig: {

esbuild.mjs

@@ -10,20 +10,6 @@ import { getSwAdditionalEntries } from './scripts/build.js'
 /** @type {import('esbuild').BuildOptions} */
 let baseConfig = {}
 
-// // legacy html config
-// baseConfig = {
-//   entryPoints: ['index.html'],
-//   assetNames: 'assets/[name]',
-//   chunkNames: '[ext]/[name]',
-//   outdir: 'dist',
-//   outfile: undefined,
-//   plugins: [
-//     htmlPlugin({
-//       scriptsTarget: 'esnext',
-//     })
-//   ],
-// }
-
 // // testing config
 // baseConfig = {
 //   entryPoints: ['files/index.js'],
@@ -35,8 +21,7 @@ try {
   await import('./localSettings.mjs')
 } catch { }
 
-fs.copyFileSync('index.html', 'dist/index.html')
-fs.writeFileSync('dist/index.html', fs.readFileSync('dist/index.html', 'utf8').replace('<!-- inject script -->', '<script src="index.js"></script>'), 'utf8')
+fs.writeFileSync('dist/index.html', fs.readFileSync('index.html', 'utf8').replace('<!-- inject script -->', '<script src="index.js"></script>'), 'utf8')
 
 const watch = process.argv.includes('--watch') || process.argv.includes('-w')
 const prod = process.argv.includes('--prod')
@@ -142,6 +127,7 @@ if (watch) {
       skipWaiting: true,
       clientsClaim: true,
       additionalManifestEntries: getSwAdditionalEntries(),
+      globPatterns: [],
       swDest: 'dist/service-worker.js',
     })
   }

index.html

@@ -1,6 +1,19 @@
 <!DOCTYPE html>
 <html>
   <head>
+    <script>
+      window.startLoad = Date.now()
+    </script>
+    <script type="module">
+      window.addEventListener('hashchange', (e) => {
+        if (e.newURL.endsWith('#dev')) {
+          // todo precache (check offline)?
+          import('https://cdn.skypack.dev/eruda').then(({ default: eruda }) => {
+            eruda.init()
+          })
+        }
+      })
+    </script>
     <title>Prismarine Web Client</title>
     <link rel="stylesheet" href="index.css">
     <link rel="favicon" href="favicon.ico">

package.json

@@ -3,9 +3,9 @@
   "version": "1.5.0",
   "description": "A minecraft client running in a browser",
   "scripts": {
-    "start": "node scripts/build.js copyFilesDev && node esbuild.mjs --minify --watch",
+    "start": "node scripts/build.js copyFilesDev && node scripts/prepareData.mjs && node esbuild.mjs --minify --watch",
     "start-watch-script": "nodemon -w esbuild.mjs esbuild.mjs",
-    "build": "node scripts/build.js copyFiles && node esbuild.mjs --minify --prod",
+    "build": "node scripts/build.js copyFiles && node scripts/prepareData.mjs && node esbuild.mjs --minify --prod",
     "watch": "node scripts/build.js copyFilesDev && webpack serve --config webpack.dev.js --progress",
     "test:cypress": "cypress run",
     "test:e2e": "start-test http-get://localhost:8080 test:cypress",
@@ -20,7 +20,7 @@
   "author": "PrismarineJS",
   "license": "MIT",
   "dependencies": {
-    "@dimaka/interface": "0.0.0-dev",
+    "@dimaka/interface": "0.0.1",
     "@emotion/css": "^11.11.2",
     "@pmmmwh/react-refresh-webpack-plugin": "^0.5.11",
     "@types/react": "^18.2.20",
@@ -32,6 +32,7 @@
     "compression": "^1.7.4",
     "cypress-plugin-snapshots": "^1.4.4",
     "diamond-square": "^1.2.0",
+    "eruda": "^3.0.1",
     "esbuild": "^0.19.2",
     "esbuild-loader": "^4.0.0",
     "esbuild-plugin-polyfill-node": "^0.3.0",
@@ -47,7 +48,7 @@
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-refresh": "^0.14.0",
-    "space-squid": "github:zardoy/space-squid",
+    "space-squid": "github:zardoy/space-squid#everything",
     "speed-measure-webpack-plugin": "^1.5.0",
     "stats.js": "^0.17.0",
     "url": "^0.11.1",
@@ -61,8 +62,10 @@
     "buffer": "^6.0.3",
     "clean-webpack-plugin": "^4.0.0",
     "constants-browserify": "^1.0.0",
+    "contro-max": "^0.1.1",
     "copy-webpack-plugin": "^11.0.0",
     "crypto-browserify": "^3.12.0",
+    "css-loader": "^6.8.1",
     "cypress": "^9.5.4",
     "cypress-esbuild-preprocessor": "^1.0.2",
     "events": "^3.3.0",
@@ -73,27 +76,28 @@
     "https-browserify": "^1.0.0",
     "lodash-webpack-plugin": "^0.11.6",
     "memfs": "^3.5.3",
+    "minecraft-inventory-gui": "github:zardoy/minecraft-inventory-gui#next",
     "mineflayer": "github:zardoy/mineflayer#custom",
     "mineflayer-pathfinder": "^2.4.4",
     "npm-run-all": "^4.1.5",
     "os-browserify": "^0.3.0",
     "path-browserify": "^1.0.1",
     "prismarine-viewer": "./prismarine-viewer",
-    "prismarine-viewer2": "github:PrismarineJS/prismarine-viewer",
     "process": "github:PrismarineJS/node-process",
     "rimraf": "^5.0.1",
     "stream-browserify": "^3.0.0",
+    "style-loader": "^3.3.3",
     "three": "0.128.0",
     "timers-browserify": "^2.0.12",
+    "url-loader": "^4.1.1",
     "use-typed-event-listener": "^4.0.2",
     "vite": "^4.4.9",
     "webpack": "^5.88.2",
     "webpack-cli": "^5.1.4",
     "webpack-dev-middleware": "^6.1.1",
     "webpack-dev-server": "^4.15.1",
     "webpack-merge": "^5.9.0",
-    "workbox-webpack-plugin": "^6.6.0",
-    "minecraft-inventory-gui": "github:zardoy/minecraft-inventory-gui#next"
+    "workbox-webpack-plugin": "^6.6.0"
   },
   "pnpm": {
     "overrides": {

prismarine-viewer/buildWorker.mjs

@@ -0,0 +1,62 @@
+import { context } from 'esbuild'
+import { build } from 'esbuild'
+import { polyfillNode } from 'esbuild-plugin-polyfill-node'
+import path from 'path'
+import { fileURLToPath } from 'url'
+
+const allowedWorkerFiles = ['blocks', 'blockCollisionShapes', 'tints', 'blockStates',
+  'biomes', 'features', 'version', 'legacy', 'versions', 'version', 'protocolVersions']
+
+const __dirname = path.dirname(fileURLToPath(new URL(import.meta.url)))
+
+/** @type {import('esbuild').BuildOptions} */
+const buildOptions = {
+  bundle: true,
+  banner: {
+    js: 'globalThis.global = globalThis;process = {env: {}, versions: {}, };',
+  },
+  platform: 'browser',
+  entryPoints: [path.join(__dirname, './viewer/lib/worker.js')],
+  outfile: path.join(__dirname, './public/worker.js'),
+  minify: true,
+  drop: [
+    'debugger'
+  ],
+  sourcemap: true,
+  plugins: [
+    {
+      name: 'external-json',
+      setup (build) {
+        build.onResolve({ filter: /\.json$/ }, args => {
+          const fileName = args.path.split('/').pop().replace('.json', '')
+          if (args.resolveDir.includes('minecraft-data') && !allowedWorkerFiles.includes(fileName)) {
+            // console.log('skipped', fileName)
+            return { path: args.path, namespace: 'empty-file', }
+          }
+        })
+        build.onResolve({
+          filter: /^zlib$/,
+        }, ({ path }) => {
+          return {
+            path,
+            namespace: 'empty-file',
+          }
+        })
+        build.onLoad({
+          filter: /.*/,
+          namespace: 'empty-file',
+        }, () => {
+          return { contents: 'module.exports = undefined', loader: 'js' }
+        })
+      }
+    },
+    polyfillNode(),
+  ],
+}
+
+if (process.argv.includes('-w')) {
+  const ctx = await context(buildOptions)
+  await ctx.watch()
+} else {
+  await build(buildOptions)
+}