minerender 2.0.0-alpha.0 → 2.0.0-alpha.1

package/dist/cjs/UVMapper.js

@@ -1,430 +1,434 @@
-"use strict";
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.MinecraftFaceUV = exports.UVMapper = exports.DEFAULT_UV = void 0;
-const three_1 = require("three");
-const CubeFace_1 = require("./CubeFace");
-const ModelTextures_1 = require("./assets/ModelTextures");
-const WrappedImage_1 = require("./WrappedImage");
-const CanvasImage_1 = require("./canvas/CanvasImage");
-const TextureAtlas_1 = require("./texture/TextureAtlas");
-const Caching_1 = require("./cache/Caching");
-const ImageLoader_1 = require("./image/ImageLoader");
-const AssetKey_1 = require("./assets/AssetKey");
-const ModelGenerator_1 = require("./model/ModelGenerator");
-const log_1 = require("./util/log");
-const p = log_1.prefix("UVMapper");
-exports.DEFAULT_UV = [0, 0, 16, 16];
-const X = 0;
-const Y = 1;
-const Z = 2;
-/*
- * - Minecraft Block UVs are from the top-left to bottom-right
- * - three.js UVs are from the bottom-left to top-right
- * - canvas coordinates are from the top-left to bottom-right
- */
-// noinspection PointlessArithmeticExpressionJS
-class UVMapper {
-    static makeUv(uvCoord, originalTextureSize, actualTextureSize) {
-        if (uvCoord === 0)
-            return 0;
-        return (actualTextureSize / originalTextureSize) * (uvCoord / originalTextureSize);
-    }
-    static makeUvCoords([originalTextureWidth, originalTextureHeight], [actualTextureWidth, actualTextureHeight], [x1, y1, x2, y2]) {
-        // Flip from top-to-bottom coordinates to bottom-to-top ones
-        y1 = originalTextureHeight - y1;
-        y2 = originalTextureHeight - y2;
-        const u1 = this.makeUv(x1, originalTextureWidth, actualTextureWidth);
-        const v1 = this.makeUv(y1, originalTextureHeight, actualTextureHeight);
-        const u2 = this.makeUv(x2, originalTextureWidth, actualTextureWidth);
-        const v2 = this.makeUv(y2, originalTextureHeight, actualTextureHeight);
-        return [u1, v1, u2, v2];
-    }
-    static rotateSingleUv([u, v], [px, py], radians) {
-        const sin = Math.sin(radians);
-        const cos = Math.cos(radians);
-        u -= px;
-        v -= py;
-        const uc = u;
-        const vc = v;
-        u = cos * uc - sin * vc;
-        v = cos * vc + sin * uc;
-        u += px;
-        v += py;
-        // return [parseFloat(u.toFixed(8)), parseFloat(v.toFixed(8))];
-        return [u, v];
-    }
-    static addCubeFaceUvToArray(array, faceIndex, originalTextureSize, actualTextureSize, originalCoords) {
-        const uv = this.makeUvCoords(originalTextureSize, actualTextureSize, originalCoords);
-        this.setCubeFaceUvInArray(array, faceIndex, uv);
-    }
-    static setCubeFaceUvInArray(array, faceIndex, [u1, v1, u2, v2]) {
-        let a = [u1, v1]; // top left
-        let b = [u2, v1]; // top right
-        let c = [u1, v2]; // bottom left
-        let d = [u2, v2]; // bottom right
-        let uvs = [a, b, c, d];
-        this.setFaceUvInArray(array, faceIndex, uvs);
-    }
-    static setFaceUvInArrayV(array, faceIndex, uvs) {
-        array[((faceIndex + 0) * 2) + 0] = uvs[0].x;
-        array[((faceIndex + 0) * 2) + 1] = uvs[0].y;
-        array[((faceIndex + 1) * 2) + 0] = uvs[1].x;
-        array[((faceIndex + 1) * 2) + 1] = uvs[1].y;
-        array[((faceIndex + 2) * 2) + 0] = uvs[2].x;
-        array[((faceIndex + 2) * 2) + 1] = uvs[2].y;
-        array[((faceIndex + 3) * 2) + 0] = uvs[3].x;
-        array[((faceIndex + 3) * 2) + 1] = uvs[3].y;
-    }
-    static setFaceUvInArray(array, faceIndex, uvs) {
-        array[((faceIndex + 0) * 2) + 0] = uvs[0][0];
-        array[((faceIndex + 0) * 2) + 1] = uvs[0][1];
-        array[((faceIndex + 1) * 2) + 0] = uvs[1][0];
-        array[((faceIndex + 1) * 2) + 1] = uvs[1][1];
-        array[((faceIndex + 2) * 2) + 0] = uvs[2][0];
-        array[((faceIndex + 2) * 2) + 1] = uvs[2][1];
-        array[((faceIndex + 3) * 2) + 0] = uvs[3][0];
-        array[((faceIndex + 3) * 2) + 1] = uvs[3][1];
-    }
-    static setCubeFaceUvAttribute(attributes, faceIndex, originalTextureSize, actualTextureSize, originalCoords) {
-        const uv = this.makeUvCoords(originalTextureSize, actualTextureSize, originalCoords);
-        this.setCubeFaceUvInAttribute(attributes, faceIndex, uv);
-    }
-    static setCubeFaceUvInAttribute(attributes, faceIndex, [u1, v1, u2, v2]) {
-        attributes.setXY(faceIndex + 0, u1, v1);
-        attributes.setXY(faceIndex + 1, u2, v1);
-        attributes.setXY(faceIndex + 2, u1, v2);
-        attributes.setXY(faceIndex + 3, u2, v2);
-    }
-    static setCubeUvs(geometry, originalTextureSize, actualTextureSize, faces) {
-        const attributes = geometry.getAttribute("uv");
-        for (let faceIndex = 0; faceIndex < CubeFace_1.CUBE_FACES.length; faceIndex++) {
-            let faceName = CubeFace_1.CUBE_FACES[faceIndex];
-            let face = faces[faceName];
-            if (!face)
-                continue;
-            if (!face.uv) {
-                face.uv = exports.DEFAULT_UV;
-            }
-            this.setCubeFaceUvAttribute(attributes, faceIndex * 4, originalTextureSize, actualTextureSize, face.uv);
-        }
-    }
-    static facesToUvArray(faces, originalTextureSize, actualTextureSize) {
-        const array = [];
-        for (let faceIndex = 0; faceIndex < CubeFace_1.CUBE_FACES.length; faceIndex++) {
-            let faceName = CubeFace_1.CUBE_FACES[faceIndex];
-            let face = faces[faceName];
-            if (!face)
-                continue;
-            if (!face.uv) {
-                face.uv = exports.DEFAULT_UV;
-            }
-            this.addCubeFaceUvToArray(array, faceIndex * 4, originalTextureSize, actualTextureSize, face.uv);
-        }
-        return array;
-    }
-    static facesToUv(faces, originalTextureSize, actualTextureSize) {
-        return new three_1.Float32BufferAttribute(this.facesToUvArray(faces, originalTextureSize, actualTextureSize), 2);
-    }
-    static getAtlas(model) {
-        return __awaiter(this, void 0, void 0, function* () {
-            const keyStr = model.key.serialize();
-            return Caching_1.Caching.modelTextureAtlasCache.get(keyStr, k => {
-                return this.createAtlas(model);
-            });
-        });
-    }
-    static fillMissingTextureKeys(textures, target) {
-        for (let faceName of CubeFace_1.CUBE_FACES) {
-            let v = textures[faceName];
-            if (v && v.startsWith("#")) {
-                target[faceName] = target[v.substr(1)];
-            }
-        }
-        return target;
-    }
-    // https://yeleha.co/3qlboGS
-    static getFallbackUv(element, faceName) {
-        switch (faceName) {
-            case CubeFace_1.CubeFace.DOWN:
-                return [element.from[X], 16 - element.to[Z], element.to[X], 16 - element.from[Z]];
-            case CubeFace_1.CubeFace.UP:
-                return [element.from[X], element.from[Z], element.to[X], element.to[Z]];
-            case CubeFace_1.CubeFace.NORTH:
-            default:
-                return [16 - element.to[X], 16 - element.to[Y], 16 - element.from[X], 16 - element.from[Y]];
-            case CubeFace_1.CubeFace.SOUTH:
-                return [element.from[X], 16 - element.to[Y], element.to[X], 16 - element.from[Y]];
-            case CubeFace_1.CubeFace.WEST:
-                return [element.from[Z], 16 - element.to[Y], element.to[Z], 16 - element.from[Y]];
-            case CubeFace_1.CubeFace.EAST:
-                return [16 - element.to[Z], 16 - element.to[Y], 16 - element.from[Z], 16 - element.from[Y]];
-        }
-    }
-    static expandAndRotateMcUvs([u1, v1, u2, v2], rotation = 0, actualWidth, actualHeight) {
-        // Resize coordinates to actual texture size
-        const scaleU = actualWidth / 16;
-        const scaleV = actualHeight / 16;
-        u1 *= scaleU;
-        v1 *= scaleV;
-        u2 *= scaleU;
-        v2 *= scaleV;
-        let tl = new three_1.Vector2(u1, v1); // top left
-        let tr = new three_1.Vector2(u2, v1); // top right
-        let bl = new three_1.Vector2(u1, v2); // bottom left
-        let br = new three_1.Vector2(u2, v2); // bottom right
-        switch (rotation) {
-            case 0:
-            case 360:
-            default:
-                break;
-            case 90:
-                tl = new three_1.Vector2(u1, v2);
-                tr = new three_1.Vector2(u1, v1);
-                bl = new three_1.Vector2(u2, v2);
-                br = new three_1.Vector2(u2, v1);
-                break;
-            case 180:
-                tl = new three_1.Vector2(u2, v2);
-                tr = new three_1.Vector2(u1, v2);
-                bl = new three_1.Vector2(u2, v1);
-                br = new three_1.Vector2(u1, v1);
-                break;
-            case 270:
-                tl = new three_1.Vector2(u2, v1);
-                tr = new three_1.Vector2(u2, v2);
-                bl = new three_1.Vector2(u1, v1);
-                br = new three_1.Vector2(u1, v2);
-                break;
-        }
-        return [tl, tr, bl, br];
-    }
-    static createAtlas(originalModel) {
-        var _a, _b;
-        return __awaiter(this, void 0, void 0, function* () {
-            const textureMap = {};
-            const metaMap = {};
-            const model = Object.assign({}, originalModel);
-            const isItemModel = !("elements" in model);
-            console.debug(p, "Creating Atlas for", model.key);
-            if (model.textures) {
-                const promises = [];
-                const uniqueTextureNames = []; // TODO: make these actually unique
-                const textureReferences = {};
-                for (let textureKey in model.textures) {
-                    let textureValue = model.textures[textureKey];
-                    if (textureValue.startsWith("#")) {
-                        textureReferences[textureKey] = textureValue.substr(1);
-                    }
-                    else {
-                        uniqueTextureNames.push(textureKey);
-                        const assetKey = AssetKey_1.AssetKey.parse("textures", textureValue, model.key);
-                        promises.push(ModelTextures_1.ModelTextures.get(assetKey).then(asset => {
-                            textureMap[textureKey] = new WrappedImage_1.WrappedImage(asset);
-                        }));
-                        promises.push(ModelTextures_1.ModelTextures.getMeta(assetKey).then(meta => {
-                            metaMap[textureKey] = meta;
-                        }));
-                    }
-                }
-                yield Promise.all(promises);
-                const textureCount = uniqueTextureNames.length;
-                console.debug(p, "Creating Atlas for", textureCount, "textures");
-                // console.log(model.textures)
-                this.fillMissingTextureKeys(model.textures, textureMap);
-                this.fillMissingTextureKeys(model.textures, metaMap);
-                const sizes = {};
-                // Find largest texture dimensions
-                let maxWidth = 0;
-                let maxHeight = 0;
-                for (let textureKey of uniqueTextureNames) {
-                    let texture = textureMap[textureKey];
-                    if (!texture)
-                        continue;
-                    sizes[textureKey] = [texture.width, texture.height];
-                    if (texture.width > maxWidth) {
-                        maxWidth = texture.width;
-                    }
-                    if (texture.height > maxHeight) {
-                        maxHeight = texture.height;
-                    }
-                }
-                this.fillMissingTextureKeys(model.textures, sizes);
-                // console.log(sizes);
-                const s = (Math.ceil(Math.sqrt(textureCount + 1))); // +1 for transparency
-                const size = Math.ceil(s * maxWidth);
-                console.debug(p, "Atlas size:", size);
-                // console.log("size: " + size);
-                const squaredSize = size * size;
-                const missing = yield ImageLoader_1.ImageLoader.getData("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABAAQMAAACQp+OdAAAABlBMVEX/AP8AAACfphTyAAAAFUlEQVQoz2MIhQKGVVAwKjIqQrwIAHRz/wFI17TEAAAAAElFTkSuQmCC");
-                const empty = yield ImageLoader_1.ImageLoader.getData("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABAAQMAAACQp+OdAAAAA1BMVEUAAACnej3aAAAAAXRSTlMAQObYZgAAAA5JREFUKM9jGAWjgAIAAAJAAAFSSwuTAAAAAElFTkSuQmCC");
-                //TODO: add transparent texture and use as default uv
-                // Create image
-                const image = new CanvasImage_1.CanvasImage(size, size);
-                image.putData(missing, 0, 0); // fill with invalid texture image
-                image.putData(empty, 0, 0, 0, 0, maxWidth, maxWidth); // add transparent section in the top-left corner
-                const positions = {};
-                let hasTransparency = false;
-                let hasAnimation = false;
-                const animatorFunctions = {};
-                // Draw all textures onto a single image
-                let tx = 1; // start one over to leave room for the transparent space
-                let ty = 0;
-                for (let textureIndex = 0; textureIndex < uniqueTextureNames.length; textureIndex++) {
-                    let textureKey = uniqueTextureNames[textureIndex];
-                    let texture = textureMap[textureKey];
-                    let x = tx * maxWidth;
-                    let y = ty * maxWidth;
-                    if (texture) {
-                        positions[textureKey] = [x, y];
-                        image.putData(texture.data, x, y, 0, 0, maxWidth, maxWidth);
-                        // console.log(image.toDataURL())
-                        //TODO: only first frame for animated textures
-                        if (texture.hasTransparency) {
-                            hasTransparency = true;
-                        }
-                        if (texture.animated) {
-                            hasAnimation = true;
-                            const meta = metaMap[textureKey];
-                            const frameTime = (_b = (_a = meta === null || meta === void 0 ? void 0 : meta.animation) === null || _a === void 0 ? void 0 : _a.frametime) !== null && _b !== void 0 ? _b : 1;
-                            let t = 0;
-                            let f = 0;
-                            animatorFunctions[textureKey] = () => {
-                                var _a;
-                                //TODO: use mcmeta for frame count, delays, etc
-                                //TODO: interpolate?
-                                if (t++ >= frameTime) {
-                                    t = 0;
-                                    const frames = (_a = meta === null || meta === void 0 ? void 0 : meta.animation) === null || _a === void 0 ? void 0 : _a.frames;
-                                    const frame = frames ? frames[f] : f; //TODO: frame.time support
-                                    image.putData(texture.getFrameSectionData(frame), x, y, 0, 0, maxWidth, maxWidth);
-                                    f++;
-                                    if (f >= (frames ? frames.length : texture.frameCount)) {
-                                        f = 0;
-                                    }
-                                }
-                            };
-                        }
-                    }
-                    tx++;
-                    if (tx >= s) {
-                        tx = 0;
-                        ty++;
-                    }
-                }
-                const atlasImageData = image.toDataURL();
-                console.log(p, "Atlas Image for", model.key, atlasImageData);
-                this.fillMissingTextureKeys(model.textures, positions);
-                // console.log(positions);
-                if (isItemModel) {
-                    console.debug(p, "Generating item model for", model);
-                    model.elements = [];
-                    for (let layerName of ModelGenerator_1.ModelGenerator.ITEM_LAYERS) {
-                        const textureImage = textureMap[layerName];
-                        if (textureImage) {
-                            model.elements.push(...ModelGenerator_1.ModelGenerator.generateItemModel(textureImage.data, layerName));
-                        }
-                    }
-                    console.debug(p, "Item model elements", model.elements);
-                }
-                if (!model.elements) {
-                    //TODO: default elements
-                }
-                // Adjust UV positions
-                if (model.elements) {
-                    for (let elementIndex = 0; elementIndex < model.elements.length; elementIndex++) {
-                        let element = model.elements[elementIndex];
-                        let uv = [];
-                        // Set default uvs to missing texture
-                        for (let i = 0; i < CubeFace_1.CUBE_FACES.length; i++) {
-                            this.setCubeFaceUvInArray(uv, i * 4, [0, 0, 8 / size, 8 / size]);
-                        }
-                        for (let faceIndex = 0; faceIndex < CubeFace_1.CUBE_FACES.length; faceIndex++) {
-                            let faceName = CubeFace_1.CUBE_FACES[faceIndex];
-                            // console.log(faceName)
-                            let face = element.faces[faceName];
-                            if (!face) {
-                                // set uv transparent
-                                this.setCubeFaceUvInArray(uv, faceIndex * 4, [0, 1, 8 / size, (size - 8) / size]);
-                                continue;
-                            }
-                            if (!face.uv) {
-                                face.uv = this.getFallbackUv(element, faceName);
-                            }
-                            let faceTexture = face.texture;
-                            let texPosition;
-                            let texSize;
-                            if (faceTexture) {
-                                faceTexture = faceTexture.substr(1); // remove #
-                                texPosition = positions[faceTexture] || [0, 0];
-                                texSize = sizes[faceTexture] || [16, 16];
-                            }
-                            let texPosV = new three_1.Vector2(texPosition[0], texPosition[1]);
-                            const [tl, tr, bl, br] = this.expandAndRotateMcUvs(face.uv, face.rotation, texSize[0], texSize[1]);
-                            // move to atlas position
-                            tl.add(texPosV);
-                            tr.add(texPosV);
-                            bl.add(texPosV);
-                            br.add(texPosV);
-                            // divide to 0-1
-                            tl.divideScalar(size);
-                            tr.divideScalar(size);
-                            bl.divideScalar(size);
-                            br.divideScalar(size);
-                            // flip y coordinates
-                            tl.y = 1 - tl.y;
-                            tr.y = 1 - tr.y;
-                            bl.y = 1 - bl.y;
-                            br.y = 1 - br.y;
-                            //TODO: figure out how uv lock works
-                            let uvs = [tl, tr, bl, br];
-                            // console.log("uvs", uvs);
-                            this.setFaceUvInArrayV(uv, faceIndex * 4, uvs);
-                        }
-                        element.mappedUv = uv;
-                    }
-                }
-                else {
-                    //TODO: item model
-                }
-                return new TextureAtlas_1.TextureAtlas(model, image, sizes, positions, hasAnimation, animatorFunctions, hasTransparency);
-            }
-            else {
-                console.warn(p, "Model does not have any textures", model);
-            }
-            return undefined;
-        });
-    }
-}
-exports.UVMapper = UVMapper;
-// Based on net.minecraft.client.renderer.block.model.BlockFaceUV
-class MinecraftFaceUV {
-    constructor(uv = [0, 0, 16, 16], rotation = 0) {
-        this.uv = uv;
-        this.rotation = rotation;
-    }
-    getU(index) {
-        const shiftedIndex = this.getShiftedIndex(index);
-        return this.uv[shiftedIndex !== 0 && index !== 1 ? 2 : 0];
-    }
-    getV(index) {
-        const shiftedIndex = this.getShiftedIndex(index);
-        return this.uv[shiftedIndex !== 0 && index !== 3 ? 3 : 1];
-    }
-    getShiftedIndex(index) {
-        return (index + this.rotation / 90) % 40;
-    }
-    getReverseIndex(index) {
-        return (index + 4 - this.rotation / 90) % 4;
-    }
-}
-exports.MinecraftFaceUV = MinecraftFaceUV;
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MinecraftFaceUV = exports.UVMapper = exports.DEFAULT_UV = void 0;
+const three_1 = require("three");
+const CubeFace_1 = require("./CubeFace");
+const ModelTextures_1 = require("./assets/ModelTextures");
+const WrappedImage_1 = require("./WrappedImage");
+const CanvasImage_1 = require("./canvas/CanvasImage");
+const TextureAtlas_1 = require("./texture/TextureAtlas");
+const Caching_1 = require("./cache/Caching");
+const ImageLoader_1 = require("./image/ImageLoader");
+const AssetKey_1 = require("./assets/AssetKey");
+const ModelGenerator_1 = require("./model/ModelGenerator");
+const log_1 = require("./util/log");
+const p = log_1.prefix("UVMapper");
+exports.DEFAULT_UV = [0, 0, 16, 16];
+const X = 0;
+const Y = 1;
+const Z = 2;
+/*
+ * - Minecraft Block UVs are from the top-left to bottom-right
+ * - three.js UVs are from the bottom-left to top-right
+ * - canvas coordinates are from the top-left to bottom-right
+ */
+// noinspection PointlessArithmeticExpressionJS
+class UVMapper {
+    static makeUv(uvCoord, originalTextureSize, actualTextureSize) {
+        if (uvCoord === 0)
+            return 0;
+        return (actualTextureSize / originalTextureSize) * (uvCoord / originalTextureSize);
+    }
+    static makeUvCoords([originalTextureWidth, originalTextureHeight], [actualTextureWidth, actualTextureHeight], [x1, y1, x2, y2]) {
+        // Flip from top-to-bottom coordinates to bottom-to-top ones
+        y1 = originalTextureHeight - y1;
+        y2 = originalTextureHeight - y2;
+        const u1 = this.makeUv(x1, originalTextureWidth, actualTextureWidth);
+        const v1 = this.makeUv(y1, originalTextureHeight, actualTextureHeight);
+        const u2 = this.makeUv(x2, originalTextureWidth, actualTextureWidth);
+        const v2 = this.makeUv(y2, originalTextureHeight, actualTextureHeight);
+        return [u1, v1, u2, v2];
+    }
+    static rotateSingleUv([u, v], [px, py], radians) {
+        const sin = Math.sin(radians);
+        const cos = Math.cos(radians);
+        u -= px;
+        v -= py;
+        const uc = u;
+        const vc = v;
+        u = cos * uc - sin * vc;
+        v = cos * vc + sin * uc;
+        u += px;
+        v += py;
+        // return [parseFloat(u.toFixed(8)), parseFloat(v.toFixed(8))];
+        return [u, v];
+    }
+    static addCubeFaceUvToArray(array, faceIndex, originalTextureSize, actualTextureSize, originalCoords) {
+        const uv = this.makeUvCoords(originalTextureSize, actualTextureSize, originalCoords);
+        this.setCubeFaceUvInArray(array, faceIndex, uv);
+    }
+    static setCubeFaceUvInArray(array, faceIndex, [u1, v1, u2, v2]) {
+        let a = [u1, v1]; // top left
+        let b = [u2, v1]; // top right
+        let c = [u1, v2]; // bottom left
+        let d = [u2, v2]; // bottom right
+        let uvs = [a, b, c, d];
+        this.setFaceUvInArray(array, faceIndex, uvs);
+    }
+    static setFaceUvInArrayV(array, faceIndex, uvs) {
+        array[((faceIndex + 0) * 2) + 0] = uvs[0].x;
+        array[((faceIndex + 0) * 2) + 1] = uvs[0].y;
+        array[((faceIndex + 1) * 2) + 0] = uvs[1].x;
+        array[((faceIndex + 1) * 2) + 1] = uvs[1].y;
+        array[((faceIndex + 2) * 2) + 0] = uvs[2].x;
+        array[((faceIndex + 2) * 2) + 1] = uvs[2].y;
+        array[((faceIndex + 3) * 2) + 0] = uvs[3].x;
+        array[((faceIndex + 3) * 2) + 1] = uvs[3].y;
+    }
+    static setFaceUvInArray(array, faceIndex, uvs) {
+        array[((faceIndex + 0) * 2) + 0] = uvs[0][0];
+        array[((faceIndex + 0) * 2) + 1] = uvs[0][1];
+        array[((faceIndex + 1) * 2) + 0] = uvs[1][0];
+        array[((faceIndex + 1) * 2) + 1] = uvs[1][1];
+        array[((faceIndex + 2) * 2) + 0] = uvs[2][0];
+        array[((faceIndex + 2) * 2) + 1] = uvs[2][1];
+        array[((faceIndex + 3) * 2) + 0] = uvs[3][0];
+        array[((faceIndex + 3) * 2) + 1] = uvs[3][1];
+    }
+    static setCubeFaceUvAttribute(attributes, faceIndex, originalTextureSize, actualTextureSize, originalCoords) {
+        const uv = this.makeUvCoords(originalTextureSize, actualTextureSize, originalCoords);
+        this.setCubeFaceUvInAttribute(attributes, faceIndex, uv);
+    }
+    static setCubeFaceUvInAttribute(attributes, faceIndex, [u1, v1, u2, v2]) {
+        attributes.setXY(faceIndex + 0, u1, v1);
+        attributes.setXY(faceIndex + 1, u2, v1);
+        attributes.setXY(faceIndex + 2, u1, v2);
+        attributes.setXY(faceIndex + 3, u2, v2);
+    }
+    static setCubeUvs(geometry, originalTextureSize, actualTextureSize, faces) {
+        const attributes = geometry.getAttribute("uv");
+        for (let faceIndex = 0; faceIndex < CubeFace_1.CUBE_FACES.length; faceIndex++) {
+            let faceName = CubeFace_1.CUBE_FACES[faceIndex];
+            let face = faces[faceName];
+            if (!face)
+                continue;
+            if (!face.uv) {
+                face.uv = exports.DEFAULT_UV;
+            }
+            this.setCubeFaceUvAttribute(attributes, faceIndex * 4, originalTextureSize, actualTextureSize, face.uv);
+        }
+    }
+    static facesToUvArray(faces, originalTextureSize, actualTextureSize) {
+        const array = [];
+        for (let faceIndex = 0; faceIndex < CubeFace_1.CUBE_FACES.length; faceIndex++) {
+            let faceName = CubeFace_1.CUBE_FACES[faceIndex];
+            let face = faces[faceName];
+            if (!face)
+                continue;
+            if (!face.uv) {
+                face.uv = exports.DEFAULT_UV;
+            }
+            this.addCubeFaceUvToArray(array, faceIndex * 4, originalTextureSize, actualTextureSize, face.uv);
+        }
+        return array;
+    }
+    static facesToUv(faces, originalTextureSize, actualTextureSize) {
+        return new three_1.Float32BufferAttribute(this.facesToUvArray(faces, originalTextureSize, actualTextureSize), 2);
+    }
+    static getAtlas(model) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const keyStr = model.key.serialize();
+            return Caching_1.Caching.modelTextureAtlasCache.get(keyStr, k => {
+                return this.createAtlas(model);
+            });
+        });
+    }
+    static fillMissingTextureKeys(textures, target) {
+        for (let faceName of CubeFace_1.CUBE_FACES) {
+            let v = textures[faceName];
+            if (v && v.startsWith("#")) {
+                target[faceName] = target[v.substr(1)];
+            }
+        }
+        return target;
+    }
+    // https://yeleha.co/3qlboGS
+    static getFallbackUv(element, faceName) {
+        switch (faceName) {
+            case CubeFace_1.CubeFace.DOWN:
+                return [element.from[X], 16 - element.to[Z], element.to[X], 16 - element.from[Z]];
+            case CubeFace_1.CubeFace.UP:
+                return [element.from[X], element.from[Z], element.to[X], element.to[Z]];
+            case CubeFace_1.CubeFace.NORTH:
+            default:
+                return [16 - element.to[X], 16 - element.to[Y], 16 - element.from[X], 16 - element.from[Y]];
+            case CubeFace_1.CubeFace.SOUTH:
+                return [element.from[X], 16 - element.to[Y], element.to[X], 16 - element.from[Y]];
+            case CubeFace_1.CubeFace.WEST:
+                return [element.from[Z], 16 - element.to[Y], element.to[Z], 16 - element.from[Y]];
+            case CubeFace_1.CubeFace.EAST:
+                return [16 - element.to[Z], 16 - element.to[Y], 16 - element.from[Z], 16 - element.from[Y]];
+        }
+    }
+    static expandAndRotateMcUvs([u1, v1, u2, v2], rotation = 0, actualWidth, actualHeight) {
+        // Resize coordinates to actual texture size
+        const scaleU = actualWidth / 16;
+        const scaleV = actualHeight / 16;
+        u1 *= scaleU;
+        v1 *= scaleV;
+        u2 *= scaleU;
+        v2 *= scaleV;
+        let tl = new three_1.Vector2(u1, v1); // top left
+        let tr = new three_1.Vector2(u2, v1); // top right
+        let bl = new three_1.Vector2(u1, v2); // bottom left
+        let br = new three_1.Vector2(u2, v2); // bottom right
+        switch (rotation) {
+            case 0:
+            case 360:
+            default:
+                break;
+            case 90:
+                tl = new three_1.Vector2(u1, v2);
+                tr = new three_1.Vector2(u1, v1);
+                bl = new three_1.Vector2(u2, v2);
+                br = new three_1.Vector2(u2, v1);
+                break;
+            case 180:
+                tl = new three_1.Vector2(u2, v2);
+                tr = new three_1.Vector2(u1, v2);
+                bl = new three_1.Vector2(u2, v1);
+                br = new three_1.Vector2(u1, v1);
+                break;
+            case 270:
+                tl = new three_1.Vector2(u2, v1);
+                tr = new three_1.Vector2(u2, v2);
+                bl = new three_1.Vector2(u1, v1);
+                br = new three_1.Vector2(u1, v2);
+                break;
+        }
+        return [tl, tr, bl, br];
+    }
+    static createAtlas(originalModel) {
+        var _a, _b;
+        return __awaiter(this, void 0, void 0, function* () {
+            const textureMap = {};
+            const metaMap = {};
+            const model = Object.assign({}, originalModel);
+            const isItemModel = !("elements" in model);
+            console.debug(p, "Creating Atlas for", model.key);
+            if (model.textures) {
+                const promises = [];
+                const uniqueTextureNames = []; // TODO: make these actually unique
+                const textureReferences = {};
+                for (let textureKey in model.textures) {
+                    let textureValue = model.textures[textureKey];
+                    if (textureValue.startsWith("#")) {
+                        textureReferences[textureKey] = textureValue.substr(1);
+                    }
+                    else {
+                        uniqueTextureNames.push(textureKey);
+                        const assetKey = AssetKey_1.AssetKey.parse("textures", textureValue, model.key);
+                        promises.push(ModelTextures_1.ModelTextures.get(assetKey).then(asset => {
+                            textureMap[textureKey] = new WrappedImage_1.WrappedImage(asset);
+                        }));
+                        promises.push(ModelTextures_1.ModelTextures.getMeta(assetKey).then(meta => {
+                            metaMap[textureKey] = meta;
+                        }));
+                    }
+                }
+                yield Promise.all(promises);
+                const textureCount = uniqueTextureNames.length;
+                console.debug(p, "Creating Atlas for", textureCount, "textures");
+                // console.log(model.textures)
+                this.fillMissingTextureKeys(model.textures, textureMap);
+                this.fillMissingTextureKeys(model.textures, metaMap);
+                const sizes = {};
+                // Find largest texture dimensions
+                let maxWidth = 0;
+                let maxHeight = 0;
+                for (let textureKey of uniqueTextureNames) {
+                    let texture = textureMap[textureKey];
+                    if (!texture)
+                        continue;
+                    sizes[textureKey] = [texture.width, texture.height];
+                    if (texture.width > maxWidth) {
+                        maxWidth = texture.width;
+                    }
+                    if (texture.height > maxHeight) {
+                        maxHeight = texture.height;
+                    }
+                }
+                this.fillMissingTextureKeys(model.textures, sizes);
+                // console.log(sizes);
+                const s = (Math.ceil(Math.sqrt(textureCount + 1))); // +1 for transparency
+                const size = Math.ceil(s * maxWidth);
+                console.debug(p, "Atlas size:", size);
+                // console.log("size: " + size);
+                const squaredSize = size * size;
+                const missing = yield ImageLoader_1.ImageLoader.getData("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABAAQMAAACQp+OdAAAABlBMVEX/AP8AAACfphTyAAAAFUlEQVQoz2MIhQKGVVAwKjIqQrwIAHRz/wFI17TEAAAAAElFTkSuQmCC");
+                const empty = yield ImageLoader_1.ImageLoader.getData("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABAAQMAAACQp+OdAAAAA1BMVEUAAACnej3aAAAAAXRSTlMAQObYZgAAAA5JREFUKM9jGAWjgAIAAAJAAAFSSwuTAAAAAElFTkSuQmCC");
+                //TODO: add transparent texture and use as default uv
+                // Create image
+                const image = new CanvasImage_1.CanvasImage(size, size);
+                image.putData(missing, 0, 0); // fill with invalid texture image
+                image.putData(empty, 0, 0, 0, 0, maxWidth, maxWidth); // add transparent section in the top-left corner
+                const positions = {};
+                let hasTransparency = false;
+                let hasAnimation = false;
+                const animatorFunctions = {};
+                // Draw all textures onto a single image
+                let tx = 1; // start one over to leave room for the transparent space
+                let ty = 0;
+                for (let textureIndex = 0; textureIndex < uniqueTextureNames.length; textureIndex++) {
+                    let textureKey = uniqueTextureNames[textureIndex];
+                    let texture = textureMap[textureKey];
+                    let x = tx * maxWidth;
+                    let y = ty * maxWidth;
+                    if (texture) {
+                        console.log(texture);
+                        positions[textureKey] = [x, y];
+                        image.putData(texture.data, x, y, 0, 0, maxWidth, maxWidth);
+                        // console.log(image.toDataURL())
+                        //TODO: only first frame for animated textures
+                        if (texture.hasTransparency) {
+                            hasTransparency = true;
+                        }
+                        if (texture.animated) {
+                            hasAnimation = true;
+                            const meta = metaMap[textureKey];
+                            const frameTime = (_b = (_a = meta === null || meta === void 0 ? void 0 : meta.animation) === null || _a === void 0 ? void 0 : _a.frametime) !== null && _b !== void 0 ? _b : 1;
+                            console.log(meta);
+                            console.log(frameTime);
+                            let t = 0;
+                            let f = 0;
+                            animatorFunctions[textureKey] = () => {
+                                var _a;
+                                console.log("animating", textureKey);
+                                //TODO: use mcmeta for frame count, delays, etc
+                                //TODO: interpolate?
+                                if (t++ >= frameTime) {
+                                    t = 0;
+                                    const frames = (_a = meta === null || meta === void 0 ? void 0 : meta.animation) === null || _a === void 0 ? void 0 : _a.frames;
+                                    const frame = frames ? frames[f] : f; //TODO: frame.time support
+                                    image.putData(texture.getFrameSectionData(frame), x, y, 0, 0, maxWidth, maxWidth);
+                                    f++;
+                                    if (f >= (frames ? frames.length : texture.frameCount)) {
+                                        f = 0;
+                                    }
+                                }
+                            };
+                        }
+                    }
+                    tx++;
+                    if (tx >= s) {
+                        tx = 0;
+                        ty++;
+                    }
+                }
+                const atlasImageData = image.toDataURL();
+                console.log(p, "Atlas Image for", model.key, atlasImageData);
+                this.fillMissingTextureKeys(model.textures, positions);
+                // console.log(positions);
+                if (isItemModel) {
+                    console.debug(p, "Generating item model for", model);
+                    model.elements = [];
+                    for (let layerName of ModelGenerator_1.ModelGenerator.ITEM_LAYERS) {
+                        const textureImage = textureMap[layerName];
+                        if (textureImage) {
+                            model.elements.push(...ModelGenerator_1.ModelGenerator.generateItemModel(textureImage.data, layerName));
+                        }
+                    }
+                    console.debug(p, "Item model elements", model.elements);
+                }
+                if (!model.elements) {
+                    //TODO: default elements
+                }
+                // Adjust UV positions
+                if (model.elements) {
+                    for (let elementIndex = 0; elementIndex < model.elements.length; elementIndex++) {
+                        let element = model.elements[elementIndex];
+                        let uv = [];
+                        // Set default uvs to missing texture
+                        for (let i = 0; i < CubeFace_1.CUBE_FACES.length; i++) {
+                            this.setCubeFaceUvInArray(uv, i * 4, [0, 0, 8 / size, 8 / size]);
+                        }
+                        for (let faceIndex = 0; faceIndex < CubeFace_1.CUBE_FACES.length; faceIndex++) {
+                            let faceName = CubeFace_1.CUBE_FACES[faceIndex];
+                            // console.log(faceName)
+                            let face = element.faces[faceName];
+                            if (!face) {
+                                // set uv transparent
+                                this.setCubeFaceUvInArray(uv, faceIndex * 4, [0, 1, 8 / size, (size - 8) / size]);
+                                continue;
+                            }
+                            if (!face.uv) {
+                                face.uv = this.getFallbackUv(element, faceName);
+                            }
+                            let faceTexture = face.texture;
+                            let texPosition;
+                            let texSize;
+                            if (faceTexture) {
+                                faceTexture = faceTexture.substr(1); // remove #
+                                texPosition = positions[faceTexture] || [0, 0];
+                                texSize = sizes[faceTexture] || [16, 16];
+                            }
+                            let texPosV = new three_1.Vector2(texPosition[0], texPosition[1]);
+                            const [tl, tr, bl, br] = this.expandAndRotateMcUvs(face.uv, face.rotation, texSize[0], texSize[1]);
+                            // move to atlas position
+                            tl.add(texPosV);
+                            tr.add(texPosV);
+                            bl.add(texPosV);
+                            br.add(texPosV);
+                            // divide to 0-1
+                            tl.divideScalar(size);
+                            tr.divideScalar(size);
+                            bl.divideScalar(size);
+                            br.divideScalar(size);
+                            // flip y coordinates
+                            tl.y = 1 - tl.y;
+                            tr.y = 1 - tr.y;
+                            bl.y = 1 - bl.y;
+                            br.y = 1 - br.y;
+                            //TODO: figure out how uv lock works
+                            let uvs = [tl, tr, bl, br];
+                            // console.log("uvs", uvs);
+                            this.setFaceUvInArrayV(uv, faceIndex * 4, uvs);
+                        }
+                        element.mappedUv = uv;
+                    }
+                }
+                else {
+                    //TODO: item model
+                }
+                return new TextureAtlas_1.TextureAtlas(model, image, sizes, positions, hasAnimation, animatorFunctions, hasTransparency);
+            }
+            else {
+                console.warn(p, "Model does not have any textures", model);
+            }
+            return undefined;
+        });
+    }
+}
+exports.UVMapper = UVMapper;
+// Based on net.minecraft.client.renderer.block.model.BlockFaceUV
+class MinecraftFaceUV {
+    constructor(uv = [0, 0, 16, 16], rotation = 0) {
+        this.uv = uv;
+        this.rotation = rotation;
+    }
+    getU(index) {
+        const shiftedIndex = this.getShiftedIndex(index);
+        return this.uv[shiftedIndex !== 0 && index !== 1 ? 2 : 0];
+    }
+    getV(index) {
+        const shiftedIndex = this.getShiftedIndex(index);
+        return this.uv[shiftedIndex !== 0 && index !== 3 ? 3 : 1];
+    }
+    getShiftedIndex(index) {
+        return (index + this.rotation / 90) % 40;
+    }
+    getReverseIndex(index) {
+        return (index + 4 - this.rotation / 90) % 4;
+    }
+}
+exports.MinecraftFaceUV = MinecraftFaceUV;
 //# sourceMappingURL=UVMapper.js.map