working blockstates

assets.js

@@ -35,9 +35,9 @@ export async function loadModel(id) {
         // Parents sometimes use block/ or item/ prefixes directly
         const parentId = model.parent.includes(':') ? model.parent : `minecraft:${model.parent}`;
         const parent = await loadModel(parentId);
-        
+
         // Merge textures
-        model.textures = { ...parent.textures, ...model.textures };
+        model.textures = {...parent.textures, ...model.textures};
         // Inherit elements if child doesn't override them
         if (!model.elements) model.elements = parent.elements;
     }
@@ -49,12 +49,8 @@ export class TextureAtlas {
         this.canvas = document.createElement('canvas');
         this.canvas.width = size;
         this.canvas.height = size;
-        this.ctx = this.canvas.getContext('2d', { willReadFrequently: true });
+        this.ctx = this.canvas.getContext('2d', {willReadFrequently: true});
         this.ctx.imageSmoothingEnabled = false;
-        
-        // Magenta background for missing textures
-        this.ctx.fillStyle = '#ff00ff';
-        this.ctx.fillRect(0, 0, size, size);
 
         this.map = new Map();
         this.cellSize = 16;
@@ -67,7 +63,17 @@ export class TextureAtlas {
         if (this.map.has(id)) return this.map.get(id);
 
         const url = resolveResourceLocation(id, 'textures', 'png');
-        
+
+        // Calculate position before trying to load, so we can draw a fallback if it fails
+        if (this.x + this.cellSize > this.canvas.width) {
+            this.x = 0;
+            this.y += this.rowHeight;
+            this.rowHeight = 0;
+        }
+
+        const currentX = this.x;
+        const currentY = this.y;
+
         try {
             const img = await new Promise((resolve, reject) => {
                 const i = new Image();
@@ -77,29 +83,32 @@ export class TextureAtlas {
                 i.src = url;
             });
 
-            if (this.x + this.cellSize > this.canvas.width) {
-                this.x = 0;
-                this.y += this.rowHeight;
-                this.rowHeight = 0;
-            }
-
-            this.ctx.drawImage(img, this.x, this.y, this.cellSize, this.cellSize);
-
-            const uvData = {
-                u: this.x / this.canvas.width,
-                v: this.y / this.canvas.height,
-                du: this.cellSize / this.canvas.width,
-                dv: this.cellSize / this.canvas.height
-            };
-
-            this.map.set(id, uvData);
-            this.x += this.cellSize;
-            this.rowHeight = Math.max(this.rowHeight, this.cellSize);
-            
-            return uvData;
+            this.ctx.drawImage(img, currentX, currentY, this.cellSize, this.cellSize);
         } catch (e) {
             console.warn(`Texture missing: ${id}`);
-            return null;
+            // Draw magenta square ONLY for missing textures
+            this.ctx.fillStyle = '#ff00ff';
+            this.ctx.fillRect(currentX, currentY, this.cellSize, this.cellSize);
         }
+
+        const epsU = 0.1 / this.canvas.width;
+        const epsV = 0.1 / this.canvas.height;
+
+        const uvData = {
+            // Push the start coordinate slightly inward
+            u: (currentX / this.canvas.width) + epsU,
+            v: (currentY / this.canvas.height) + epsV,
+            // Shrink the total width/height to account for the inset on both sides
+            du: (this.cellSize / this.canvas.width) - (epsU * 2),
+            dv: (this.cellSize / this.canvas.height) - (epsV * 2)
+        };
+
+        this.map.set(id, uvData);
+        this.map.set(id, uvData);
+
+        this.x += this.cellSize;
+        this.rowHeight = Math.max(this.rowHeight, this.cellSize);
+
+        return uvData;
     }
 }