Blocks with sides !

client/blocks/chest.ts

@@ -8,7 +8,7 @@ interface TileChestData {
 }
 
 EverythingRegistry.register<BlockRegistry<TileChestData>>("blocks", "bworld:chest", {
-	texture_id: "bworld:chest",
+	textures: "bworld:chest",
 	has_collision: false,
 
 	on_interact(world, tile) {

client/blocks/crops.ts

@@ -67,7 +67,7 @@ interface TileCropData {
 	current_stage: number;
 	growth_time: number;
 }
-
+/*
 function create_crop_tile(crop_id: string) {
 	const crop_info = EverythingRegistry.get<CropsRegistry>("crops", crop_id);
 
@@ -144,3 +144,4 @@ EverythingRegistry.register<BlockRegistry<TileCropData>>(
 	"bworld:pumpkin_crop",
 	create_crop_tile("bworld:pumpkin"),
 );
+*/

client/blocks/dirt.ts

@@ -3,7 +3,7 @@ import { WateringCanData } from "../items/watering_can.ts";
 import { PlayerComponent } from "../player.ts";
 
 EverythingRegistry.register<BlockRegistry>("blocks", "bworld:dirt", {
-	texture_id: "bworld:dirt",
+	textures: "bworld:dirt",
 	has_collision: false,
 
 	on_interact(world, tile) {
@@ -17,7 +17,7 @@ EverythingRegistry.register<BlockRegistry>("blocks", "bworld:dirt", {
 });
 
 EverythingRegistry.register<BlockRegistry>("blocks", "bworld:hoed_dirt", {
-	texture_id: "bworld:hoed_dirt",
+	textures: "bworld:hoed_dirt",
 	has_collision: false,
 
 	on_click(world, tile) {
@@ -51,7 +51,7 @@ EverythingRegistry.register<BlockRegistry>("blocks", "bworld:hoed_dirt", {
 });
 
 EverythingRegistry.register<BlockRegistry>("blocks", "bworld:hoed_watered_dirt", {
-	texture_id: "bworld:hoed_watered_dirt",
+	textures: "bworld:hoed_watered_dirt",
 	has_collision: false,
 
 	on_click(world, tile) {

client/blocks/furnace.ts

@@ -67,7 +67,7 @@ interface TileChestData {
 }
 
 EverythingRegistry.register<BlockRegistry<TileChestData>>("blocks", "bworld:furnace", {
-	texture_id: "bworld:furnace",
+	textures: "bworld:furnace",
 	has_collision: false,
 
 	on_interact(world, tile) {

client/blocks/grass.ts

@@ -2,7 +2,7 @@ import { BlockRegistry, EverythingRegistry } from "$/common/everything_registry.
 import { PlayerComponent } from "../player.ts";
 
 EverythingRegistry.register<BlockRegistry>("blocks", "bworld:grass", {
-	texture_id: "bworld:grass",
+	textures: { top: "bworld:grass_top", bottom: "bworld:dirt", "side": "bworld:grass_side" },
 	has_collision: false,
 
 	on_interact(world, tile) {

client/blocks/log.ts

@@ -1,12 +1,12 @@
 import { BlockRegistry, EverythingRegistry } from "$/common/everything_registry.ts";
 
 EverythingRegistry.register<BlockRegistry>("blocks", "bworld:log", {
-	texture_id: "bworld:log_side",
+	textures: { side: "bworld:log_side", top: "bworld:log_top", bottom: "bworld:log_top" },
 	has_collision: true,
 });
 
 EverythingRegistry.register<BlockRegistry>("blocks", "bworld:leaves", {
-	texture_id: "bworld:leaves",
+	textures: "bworld:leaves",
 	has_collision: true,
 	transparent: true,
 });

client/blocks/mod.ts

@@ -1,6 +1,5 @@
 import "./grass.ts";
 import "./dirt.ts";
-import "./tree.ts";
 import "./crops.ts";
 import "./water.ts";
 import "./chest.ts";

client/blocks/sand.ts

@@ -1,6 +1,6 @@
 import { BlockRegistry, EverythingRegistry } from "$/common/everything_registry.ts";
 
 EverythingRegistry.register<BlockRegistry>("blocks", "bworld:sand", {
-	texture_id: "bworld:sand",
+	textures: "bworld:sand",
 	has_collision: true,
 });

client/blocks/snow.ts

@@ -1,6 +1,6 @@
 import { BlockRegistry, EverythingRegistry } from "$/common/everything_registry.ts";
 
 EverythingRegistry.register<BlockRegistry>("blocks", "bworld:snow", {
-	texture_id: "bworld:snow",
+	textures: "bworld:snow",
 	has_collision: true,
 });

client/blocks/stone.ts

@@ -1,6 +1,6 @@
 import { BlockRegistry, EverythingRegistry } from "$/common/everything_registry.ts";
 
 EverythingRegistry.register<BlockRegistry>("blocks", "bworld:stone", {
-	texture_id: "bworld:stone",
+	textures: "bworld:stone",
 	has_collision: true,
 });

client/blocks/tree.ts

@@ -1,18 +0,0 @@
-import { BlockRegistry, EverythingRegistry } from "$/common/everything_registry.ts";
-import { ItemStack } from "../inventory.ts";
-import { PlayerComponent } from "../player.ts";
-
-EverythingRegistry.register<BlockRegistry>("blocks", "bworld:tree", {
-	texture_id: "bworld:tree",
-	has_collision: false,
-
-	on_click(world, tile) {
-		const [player] = world.get_tag("player")!;
-		const player_inventory = player.get(PlayerComponent)!.player_inventory;
-		const maybe_item = player_inventory.container.get_item(player_inventory.hotbar_selected);
-		if (maybe_item && maybe_item.type_id === "bworld:axe") {
-			tile.id = "bworld:grass";
-			player_inventory.container.add_item(new ItemStack("bworld:log", 7));
-		}
-	},
-});

client/blocks/water.ts

@@ -1,6 +1,6 @@
 import { BlockRegistry, EverythingRegistry } from "$/common/everything_registry.ts";
 
 EverythingRegistry.register<BlockRegistry>("blocks", "bworld:water", {
-	texture_id: "bworld:water",
+	textures: "bworld:water",
 	has_collision: false,
 });

client/renderer/models.ts

@@ -1,8 +1,34 @@
 import { Texture } from "./types.ts";
 
-export function push_cube_to_mesh(
+function push_vertex(
 	vertices: Float32Array,
-	vertex_count: number,
+	i: number,
+	px: number,
+	py: number,
+	pz: number,
+	u: number,
+	v: number,
+	r: number,
+	g: number,
+	b: number,
+	a: number,
+) {
+	vertices[i++] = px;
+	vertices[i++] = py;
+	vertices[i++] = pz;
+	vertices[i++] = u;
+	vertices[i++] = v;
+	vertices[i++] = r;
+	vertices[i++] = g;
+	vertices[i++] = b;
+	vertices[i++] = a;
+
+	return i;
+}
+
+export function pushFrontFace(
+	vertices: Float32Array,
+	i: number,
 	texture: Texture,
 	x: number,
 	y: number,
@@ -18,12 +44,6 @@ export function push_cube_to_mesh(
 	g = 1,
 	b = 1,
 	a = 1,
-	front = true,
-	back = true,
-	left = true,
-	right = true,
-	top = true,
-	bottom = true,
 ) {
 	const x2 = x + w;
 	const y2 = y + h;
@@ -34,85 +54,199 @@ export function push_cube_to_mesh(
 	const u1 = (sx + sw) / texture.width;
 	const v1 = (sy + sh) / texture.height;
 
-	let i = vertex_count;
+	i = push_vertex(vertices, i, x, y, z2, u0, v1, r, g, b, a);
+	i = push_vertex(vertices, i, x2, y, z2, u1, v1, r, g, b, a);
+	i = push_vertex(vertices, i, x2, y2, z2, u1, v0, r, g, b, a);
 
-	const push = (px: number, py: number, pz: number, u: number, vv: number) => {
+	i = push_vertex(vertices, i, x, y, z2, u0, v1, r, g, b, a);
-		vertices[i++] = px;
+	i = push_vertex(vertices, i, x2, y2, z2, u1, v0, r, g, b, a);
-		vertices[i++] = py;
+	i = push_vertex(vertices, i, x, y2, z2, u0, v0, r, g, b, a);
-		vertices[i++] = pz;
+
-		vertices[i++] = u;
+	return i;
-		vertices[i++] = vv;
+}
-		vertices[i++] = r;
+
-		vertices[i++] = g;
+export function pushBackFace(
-		vertices[i++] = b;
+	vertices: Float32Array,
-		vertices[i++] = a;
+	i: number,
-	};
+	texture: Texture,
-
+	x: number,
-	// front (+z)
+	y: number,
-	if (front) {
+	z: number,
-		push(x, y, z2, u0, v1);
+	w: number,
-		push(x2, y, z2, u1, v1);
+	h: number,
-		push(x2, y2, z2, u1, v0);
+	d: number,
-
+	sx: number,
-		push(x, y, z2, u0, v1);
+	sy: number,
-		push(x2, y2, z2, u1, v0);
+	sw: number,
-		push(x, y2, z2, u0, v0);
+	sh: number,
-	}
+	r = 1,
-
+	g = 1,
-	// back (-z)
+	b = 1,
-	if (back) {
+	a = 1,
-		push(x2, y, z, u0, v1);
+) {
-		push(x, y, z, u1, v1);
+	const x2 = x + w, y2 = y + h;
-		push(x, y2, z, u1, v0);
+
-
+	const u0 = sx / texture.width;
-		push(x2, y, z, u0, v1);
+	const v0 = sy / texture.height;
-		push(x, y2, z, u1, v0);
+	const u1 = (sx + sw) / texture.width;
-		push(x2, y2, z, u0, v0);
+	const v1 = (sy + sh) / texture.height;
-	}
+
-
+	i = push_vertex(vertices, i, x2, y, z, u0, v1, r, g, b, a);
-	// left (-x)
+	i = push_vertex(vertices, i, x, y, z, u1, v1, r, g, b, a);
-	if (left) {
+	i = push_vertex(vertices, i, x, y2, z, u1, v0, r, g, b, a);
-		push(x, y, z, u0, v1);
+
-		push(x, y, z2, u1, v1);
+	i = push_vertex(vertices, i, x2, y, z, u0, v1, r, g, b, a);
-		push(x, y2, z2, u1, v0);
+	i = push_vertex(vertices, i, x, y2, z, u1, v0, r, g, b, a);
-
+	i = push_vertex(vertices, i, x2, y2, z, u0, v0, r, g, b, a);
-		push(x, y, z, u0, v1);
+
-		push(x, y2, z2, u1, v0);
+	return i;
-		push(x, y2, z, u0, v0);
+}
-	}
+
-
+export function pushLeftFace(
-	// right (+x)
+	vertices: Float32Array,
-	if (right) {
+	i: number,
-		push(x2, y, z2, u0, v1);
+	texture: Texture,
-		push(x2, y, z, u1, v1);
+	x: number,
-		push(x2, y2, z, u1, v0);
+	y: number,
-
+	z: number,
-		push(x2, y, z2, u0, v1);
+	w: number,
-		push(x2, y2, z, u1, v0);
+	h: number,
-		push(x2, y2, z2, u0, v0);
+	d: number,
-	}
+	sx: number,
-
+	sy: number,
-	// top (+y)
+	sw: number,
-	if (top) {
+	sh: number,
-		push(x, y2, z2, u0, v1);
+	r = 1,
-		push(x2, y2, z2, u1, v1);
+	g = 1,
-		push(x2, y2, z, u1, v0);
+	b = 1,
-
+	a = 1,
-		push(x, y2, z2, u0, v1);
+) {
-		push(x2, y2, z, u1, v0);
+	const y2 = y + h;
-		push(x, y2, z, u0, v0);
+	const z2 = z + d;
-	}
+
-
+	const u0 = sx / texture.width;
-	// bottom (-y)
+	const v0 = sy / texture.height;
-	if (bottom) {
+	const u1 = (sx + sw) / texture.width;
-		push(x, y, z, u0, v1);
+	const v1 = (sy + sh) / texture.height;
-		push(x2, y, z, u1, v1);
+
-		push(x2, y, z2, u1, v0);
+	i = push_vertex(vertices, i, x, y, z, u0, v1, r, g, b, a);
-
+	i = push_vertex(vertices, i, x, y, z2, u1, v1, r, g, b, a);
-		push(x, y, z, u0, v1);
+	i = push_vertex(vertices, i, x, y2, z2, u1, v0, r, g, b, a);
-		push(x2, y, z2, u1, v0);
+
-		push(x, y, z2, u0, v0);
+	i = push_vertex(vertices, i, x, y, z, u0, v1, r, g, b, a);
-	}
+	i = push_vertex(vertices, i, x, y2, z2, u1, v0, r, g, b, a);
+	i = push_vertex(vertices, i, x, y2, z, u0, v0, r, g, b, a);
+
+	return i;
+}
+
+export function pushRightFace(
+	vertices: Float32Array,
+	i: number,
+	texture: Texture,
+	x: number,
+	y: number,
+	z: number,
+	w: number,
+	h: number,
+	d: number,
+	sx: number,
+	sy: number,
+	sw: number,
+	sh: number,
+	r = 1,
+	g = 1,
+	b = 1,
+	a = 1,
+) {
+	const x2 = x + w, y2 = y + h;
+
+	const u0 = sx / texture.width;
+	const v0 = sy / texture.height;
+	const u1 = (sx + sw) / texture.width;
+	const v1 = (sy + sh) / texture.height;
+
+	i = push_vertex(vertices, i, x2, y, z + d, u0, v1, r, g, b, a);
+	i = push_vertex(vertices, i, x2, y, z, u1, v1, r, g, b, a);
+	i = push_vertex(vertices, i, x2, y2, z, u1, v0, r, g, b, a);
+
+	i = push_vertex(vertices, i, x2, y, z + d, u0, v1, r, g, b, a);
+	i = push_vertex(vertices, i, x2, y2, z, u1, v0, r, g, b, a);
+	i = push_vertex(vertices, i, x2, y2, z + d, u0, v0, r, g, b, a);
+
+	return i;
+}
+
+export function pushTopFace(
+	vertices: Float32Array,
+	i: number,
+	texture: Texture,
+	x: number,
+	y: number,
+	z: number,
+	w: number,
+	h: number,
+	d: number,
+	sx: number,
+	sy: number,
+	sw: number,
+	sh: number,
+	r = 1,
+	g = 1,
+	b = 1,
+	a = 1,
+) {
+	const x2 = x + w, z2 = z + d, y2 = y + h;
+
+	const u0 = sx / texture.width;
+	const v0 = sy / texture.height;
+	const u1 = (sx + sw) / texture.width;
+	const v1 = (sy + sh) / texture.height;
+
+	i = push_vertex(vertices, i, x, y2, z2, u0, v1, r, g, b, a);
+	i = push_vertex(vertices, i, x2, y2, z2, u1, v1, r, g, b, a);
+	i = push_vertex(vertices, i, x2, y2, z, u1, v0, r, g, b, a);
+
+	i = push_vertex(vertices, i, x, y2, z2, u0, v1, r, g, b, a);
+	i = push_vertex(vertices, i, x2, y2, z, u1, v0, r, g, b, a);
+	i = push_vertex(vertices, i, x, y2, z, u0, v0, r, g, b, a);
+
+	return i;
+}
+
+export function pushBottomFace(
+	vertices: Float32Array,
+	i: number,
+	texture: Texture,
+	x: number,
+	y: number,
+	z: number,
+	w: number,
+	h: number,
+	d: number,
+	sx: number,
+	sy: number,
+	sw: number,
+	sh: number,
+	r = 1,
+	g = 1,
+	b = 1,
+	a = 1,
+) {
+	const x2 = x + w, z2 = z + d;
+
+	const u0 = sx / texture.width;
+	const v0 = sy / texture.height;
+	const u1 = (sx + sw) / texture.width;
+	const v1 = (sy + sh) / texture.height;
+
+	i = push_vertex(vertices, i, x, y, z, u0, v1, r, g, b, a);
+	i = push_vertex(vertices, i, x2, y, z, u1, v1, r, g, b, a);
+	i = push_vertex(vertices, i, x2, y, z2, u1, v0, r, g, b, a);
+
+	i = push_vertex(vertices, i, x, y, z, u0, v1, r, g, b, a);
+	i = push_vertex(vertices, i, x2, y, z2, u1, v0, r, g, b, a);
+	i = push_vertex(vertices, i, x, y, z2, u0, v0, r, g, b, a);
 
 	return i;
 }

client/systems/rendering/dimension.ts

@@ -2,7 +2,17 @@ import { get_sprite_region } from "$/common/utils.ts";
 import { Chunk, CHUNK_AREA, CHUNK_SIZE, Dimension } from "$/client/components/dimension.ts";
 import { TEXTURE_SIZE } from "$/common/constants.ts";
 import { BlockRegistry, EverythingRegistry } from "$/common/everything_registry.ts";
-import { flush_buffer, gl, push_cube_to_mesh, set_current_texture } from "$/client/renderer/mod.ts";
+import {
+	flush_buffer,
+	gl,
+	pushBackFace,
+	pushBottomFace,
+	pushFrontFace,
+	pushLeftFace,
+	pushRightFace,
+	pushTopFace,
+	set_current_texture,
+} from "$/client/renderer/mod.ts";
 import { Camera } from "$/client/components/camera.ts";
 
 export function render_dimension(dimension: Dimension, camera: Camera) {
@@ -29,6 +39,15 @@ function render_chunk_opaque(chunk: Chunk) {
 	flush_buffer(chunk.vertex_buffer, chunk.vertex_count);
 }
 
+const FACE_PUSHING_FUNCTIONS = {
+	top: pushTopFace,
+	bottom: pushBottomFace,
+	front: pushFrontFace,
+	back: pushBackFace,
+	left: pushLeftFace,
+	right: pushRightFace,
+} as const;
+
 function make_chunk_mesh(chunk: Chunk, dimension: Dimension, camera: Camera) {
 	let vertices = new Float32Array(CHUNK_AREA * 24 * 6 * 9);
 	let count = 0;
@@ -57,13 +76,41 @@ function make_chunk_mesh(chunk: Chunk, dimension: Dimension, camera: Camera) {
 
 		const block_info = blocks_registry[block_nid];
 
-		let texture_id = "bworld:missing";
+		const texture_ids = {
-		if (block_info?.texture_id) {
+			top: "bworld:missing",
-			if (typeof block_info.texture_id === "string") {
+			bottom: "bworld:missing",
-				texture_id = block_info.texture_id;
+			front: "bworld:missing",
-			} else {
+			back: "bworld:missing",
-				// texture_id = block_info.texture_id(block);
+			left: "bworld:missing",
-			}
+			right: "bworld:missing",
+		};
+
+		const textures = block_info.textures;
+		if (!textures) {
+			throw new Error(`no textures for ${block_nid}`);
+		}
+
+		if (typeof textures === "string") {
+			texture_ids.top = textures;
+			texture_ids.bottom = textures;
+			texture_ids.front = textures;
+			texture_ids.back = textures;
+			texture_ids.left = textures;
+			texture_ids.right = textures;
+		} else if ("top" in textures && "bottom" in textures && "side" in textures) {
+			texture_ids.top = textures.top;
+			texture_ids.bottom = textures.bottom;
+			texture_ids.front = textures.side;
+			texture_ids.back = textures.side;
+			texture_ids.left = textures.side;
+			texture_ids.right = textures.side;
+		} else if ("front" in textures && "side" in textures) {
+			texture_ids.top = textures.side;
+			texture_ids.bottom = textures.side;
+			texture_ids.front = textures.front;
+			texture_ids.back = textures.side;
+			texture_ids.left = textures.side;
+			texture_ids.right = textures.side;
 		}
 
 		const [x, y, z] = dimension.index_to_xyz(i);
@@ -71,41 +118,41 @@ function make_chunk_mesh(chunk: Chunk, dimension: Dimension, camera: Camera) {
 		const wx = chunk.x * CHUNK_SIZE + x;
 		const wz = chunk.z * CHUNK_SIZE + z;
 
-		const front = show_face(wx, y, wz + 1);
+		const faces = {
-		const back = show_face(wx, y, wz - 1);
+			front: show_face(wx, y, wz + 1),
-		const left = show_face(wx - 1, y, wz);
+			back: show_face(wx, y, wz - 1),
-		const right = show_face(wx + 1, y, wz);
+			left: show_face(wx - 1, y, wz),
-		const top = show_face(wx, y + 1, wz);
+			right: show_face(wx + 1, y, wz),
-		const bottom = show_face(wx, y - 1, wz);
+			top: show_face(wx, y + 1, wz),
+			bottom: show_face(wx, y - 1, wz),
+		} as const;
 
-		const region = get_sprite_region(texture_id);
+		for (const side of ["front", "back", "left", "right", "top", "bottom"] as const) {
+			if (faces[side]) {
+				const region = get_sprite_region(texture_ids[side]);
 
-		vertices = ensure_capacity(vertices, count + (6 * 6 * 9));
+				vertices = ensure_capacity(vertices, count + (6 * 6 * 9));
-		count = push_cube_to_mesh(
+				count = FACE_PUSHING_FUNCTIONS[side](
-			vertices,
+					vertices,
-			count,
+					count,
-			dimension.image,
+					dimension.image,
-			wx,
+					wx,
-			y,
+					y,
-			wz,
+					wz,
-			1,
+					1,
-			1,
+					1,
-			1,
+					1,
-			region.x * TEXTURE_SIZE,
+					region.x * TEXTURE_SIZE,
-			region.y * TEXTURE_SIZE,
+					region.y * TEXTURE_SIZE,
-			TEXTURE_SIZE,
+					TEXTURE_SIZE,
-			TEXTURE_SIZE,
+					TEXTURE_SIZE,
-			1,
+					1,
-			1,
+					1,
-			1,
+					1,
-			1,
+					1,
-			front,
+				);
-			back,
+			}
-			left,
+		}
-			right,
-			top,
-			bottom,
-		);
 	}
 
 	chunk.vertex_buffer = gl.createBuffer();

common/everything_registry.ts

@@ -49,8 +49,19 @@ export class EverythingRegistry {
 	}
 }
 
+interface TextureSideTopBottom {
+	top: string;
+	bottom: string;
+	side: string;
+}
+
+interface TextureFront {
+	front: string;
+	side: string;
+}
+
 export interface BlockRegistry<T = unknown | undefined> {
-	texture_id: string | ((block: Block<T>) => string);
+	textures: string | TextureSideTopBottom | TextureFront;
 	has_collision: boolean;
 	transparent?: boolean;