debug toggles note: changing most of these WILL reload the page


about
controls
  • click the canvas to start controlling the game. w/a/s/d = move, q/e or mouse = turn, left click = break block, shift/space = fly up/down
  • you can turn on the fast_movement debug toggle to navigate the world faster
technical details
  • world is split into 16x16x256 chunks, chunks split into 16x16x16 vertical chunks
  • each vertical chunk has a mesh generated for it, containing just the block faces which aren't occluded by other blocks in that v-chunk. meshes are re-generated before rendering if any blocks have been changed
  • world is saved to & loaded from disk using IndexedDB api
    • (currently only happens when chunks are unloaded from leaving render distance, so you'll need to walk away until the chunk exits render distance, but after that you can reload the window and any changes made will still be there)
  • texture atlases are generated at runtime, and mipmap generation is done manually to avoid any bleed between the aliased textures
    • as you can see below, some of the higher mipmap levels (the ones outlined in red) are too small and wouldn't look right when rendered. I use two different methods for solving this
      • if webgl 2 is supported by the browser I use that and set the maximum LOD for the texture (not supported on webgl 1)
      • if webgl 2 isn't supported but certain opengl extensions are available, I use some shader code to manually calculate the lod, clamp it, then sample the texture with that lod
      • if neither are available then it'll just look bad far away, but most browsers should support at least one (you can see what this looks like by enabling the debug flags force_no_gl_extensions and force_webgl_1_only)
    • currently there's quite a bit of padding added to each texture in the atlas, that could probably be decreased a lot or avoided entirely but I haven't gotten around to that yet
  • the code was written in typescript, then transpiled to javascript. for the typescript sources, look at the sources in your browser's dev tools (assuming source mapping is working), or see the ts directory here
known bugs
  • looking directly up results in nothing being rendered
  • camera direction sometimes jumps around when exiting pointer capture
missing features/stuff I wanted to add but didn't get around to
  • ability to place blocks
  • collision/physics
  • player position saving (currently you're always reset to a hardcoded location
credits
  • algorithm used for packing textures into the texture atlas is the MAXRECTS algorithm from "A Thousand Ways to Pack the Bin - A Practical Approach to Two-Dimensional Rectangle Bin Packing" by Jukka Jylänki
  • there's some others but i'm writing this at the last minute so I don't have time to finish this section