commit before I break

poly_mesh kinda working. translations are broken. doesn't work on all of the sample strucutres yet

Author: SuperLlama88888

pipeline/build.js

@@ -94,7 +94,6 @@ function findProcessingFunction(filename) {
  * @returns {{ code: string }}
  */
 function processHTML(code, filename) {
-	// code = code.replaceAll(/<style>([^]+?)<\/style>/g, (_, css) => `<style>${processCSS(css, filename, true).code}</style>`);
 	code = code.replaceAll(/<script type="(importmap|application\/ld\+json)">([^]+?)<\/script>/g, (_, scriptType, json) => `<script type="${scriptType}">${processJSON(json).code}</script>`);
 	code = minifyHTML(code, {
 		removeComments: true,

src/BlockGeoMaker.js

@@ -0,0 +1,50 @@
+import { JSONSet } from "./utils.js";
+
+export default class PolyMeshMaker {
+	/** @type {JSONSet<Vec3>} */
+	#positions = new JSONSet();
+	/** @type {JSONSet<Vec3>} */
+	#normals = new JSONSet();
+	/** @type {JSONSet<Vec2>} */
+	#uvs = new JSONSet();
+	/** @type {Array<PolyMeshFace>} */
+	#polys = [];
+	
+	/**
+	 * Adds templates faces to the poly mesh, with an optional position offset.
+	 * @param {Array<PolyMeshTemplateFaceWithUvs>} faces
+	 * @param {Vec3} [positionOffset]
+	 */
+	add(faces, positionOffset = [0, 0, 0]) {
+		faces.forEach(face => {
+			let newPoly = [];
+			let normalI = this.#normals.addI(face["normal"]);
+			for(let i = 0; i < 4; i++) {
+				let vertex = face["vertices"][i];
+				let pos = [vertex["pos"][0] + positionOffset[0], vertex["pos"][1] + positionOffset[1], vertex["pos"][2] + positionOffset[2]];
+				let posI = this.#positions.addI(pos);
+				let uvI = this.#uvs.addI(vertex["uv"]);
+				newPoly.push([posI, normalI, uvI]);
+			}
+			this.#polys.push(newPoly);
+		});
+	}
+	/** @returns {PolyMesh} */
+	export() {
+		return {
+			"normalized_uvs": true,
+			"positions": Array.from(this.#positions),
+			"normals": Array.from(this.#normals),
+			"uvs": Array.from(this.#uvs),
+			"polys": this.#polys
+		};
+	}
+	clear() {
+		this.#positions.clear();
+		this.#normals.clear();
+		this.#uvs.clear();
+		this.#polys = [];
+	}
+}
+
+/** @import { Vec3, Vec2, PolyMeshTemplateFaceWithUvs, PolyMeshFace, PolyMesh } from "./HoloPrint.js" */

src/HoloPrint.js

@@ -36,7 +36,7 @@ export default class PreviewRenderer extends AsyncFactory {
 	cont;
 	packName;
 	textureAtlas;
-	boneTemplatePalette;
+	polyMeshTemplatePalette;
 	structureSize;
 	options = {
 		showSkybox: true,
@@ -88,17 +88,17 @@ export default class PreviewRenderer extends AsyncFactory {
 	 * @param {import("./TextureAtlas.js").default} textureAtlas
 	 * @param {I32Vec3} structureSize
 	 * @param {Array<Block>} blockPalette
-	 * @param {Array<BoneTemplate>} boneTemplatePalette
+	 * @param {Array<import("./HoloPrint.js").PolyMeshTemplateFaceWithUvs>} polyMeshTemplatePalette
 	 * @param {[Int32Array, Int32Array]} blockIndices
 	 * @param {Partial<typeof this.options>} [options]
 	 */
-	constructor(cont, packName, textureAtlas, structureSize, blockPalette, boneTemplatePalette, blockIndices, options = {}) {
+	constructor(cont, packName, textureAtlas, structureSize, blockPalette, polyMeshTemplatePalette, blockIndices, options = {}) {
 		super();
 		this.cont = cont;
 		this.packName = packName;
 		this.textureAtlas = textureAtlas;
 		this.structureSize = structureSize;
-		this.boneTemplatePalette = boneTemplatePalette;
+		this.polyMeshTemplatePalette = polyMeshTemplatePalette;
 		this.options = { ...this.options, ...options };
 
 		this.#can = document.createElement("canvas");
@@ -153,7 +153,7 @@ export default class PreviewRenderer extends AsyncFactory {
 					let blockI = (x * this.structureSize[1] + y) * this.structureSize[2] + z;
 					for(let layerI = 0; layerI < 2; layerI++) {
 						let paletteI = blockIndices[layerI][blockI];
-						if(!(paletteI in this.boneTemplatePalette)) {
+						if(!(paletteI in this.polyMeshTemplatePalette)) {
 							continue;
 						}
 						this.#blockPositions[paletteI] ??= [];
@@ -253,8 +253,8 @@ export default class PreviewRenderer extends AsyncFactory {
 		// animator.play("spawn");
 
 		for(let i in this.#blockPositions) {
-			let boneTemplate = this.boneTemplatePalette[i];
-			let geo = this.#boneTemplateToGeo(boneTemplate);
+			let boneTemplate = this.polyMeshTemplatePalette[i];
+			let geo = this.#polyMeshTemplateToGeo(boneTemplate);
 			let model = new Model(geo, imageUrl);
 			let group = model.getGroup();
 			group.rotation.set(0, pi, 0);
@@ -501,7 +501,7 @@ export default class PreviewRenderer extends AsyncFactory {
 	 * @param {BoneTemplate} boneTemplate
 	 * @returns {import("@bridge-editor/model-viewer").IGeoSchema}
 	 */
-	#boneTemplateToGeo(boneTemplate) {
+	#polyMeshTemplateToGeo(boneTemplate) {
 		return {
 			"description": {
 				"texture_width": this.textureAtlas.atlasWidth,

src/PolyMeshMaker.js

@@ -19,8 +19,11 @@ export default class TextureAtlas extends AsyncFactory {
 	config;
 	resourcePackStack;
 
-	/** When makeAtlas() is called, this will contain UV coordinates and sizes for texture references passed as input, as well as cropping information. */
-	textures;
+	/**
+	 * When makeAtlas() is called, this will contain UV coordinates and sizes for texture references passed as input, as well as cropping information.
+	 * @type {Array<{ uv: Vec2, uv_size: Vec2, crop?: Rectangle }>}
+	 */
+	uvs;
 
 	/**
 	 * Contains the actual texture atlas images: [textureName, imageBlob]
@@ -123,8 +126,7 @@ export default class TextureAtlas extends AsyncFactory {
 				"tint_like_png": tintLikePng,
 				"opacity": opacity,
 				"uv": textureRef["uv"],
-				"uv_size": textureRef["uv_size"],
-				"croppable": textureRef["croppable"]
+				"uv_size": textureRef["uv_size"]
 			};
 			allTextureFragments.add(textureFragment);
 			textureImageIndices.push(allTextureFragments.indexOf(textureFragment));
@@ -146,7 +148,7 @@ export default class TextureAtlas extends AsyncFactory {
 		let imageUvs = await this.#stitchTextureAtlas(imageFragments);
 		console.log("Image UVs:", imageUvs);
 
-		this.textures = textureImageIndices.map(i => imageUvs[i]);
+		this.uvs = textureImageIndices.map(i => imageUvs[i]);
 	}
 
 	/**
@@ -306,7 +308,7 @@ export default class TextureAtlas extends AsyncFactory {
 			return { imageData, imageIsTga, imageNotFound };
 		}));
 		let imageDataByTexturePath = new Map(allTexturePaths.map((texturePath, i) => [texturePath, allImageData[i]]));
-		return await Promise.all(Array.from(textureFragments).map(async ({ texturePath, tint, tint_like_png: tintLikePng, opacity, uv: sourceUv, uv_size: uvSize, croppable }) => {
+		return await Promise.all(Array.from(textureFragments).map(async ({ texturePath, tint, tint_like_png: tintLikePng, opacity, uv: sourceUv, uv_size: uvSize }) => {
 			let { imageData, imageIsTga, imageNotFound } = imageDataByTexturePath.get(texturePath);
 			if(imageNotFound) {
 				sourceUv = [0, 0];
@@ -336,9 +338,8 @@ export default class TextureAtlas extends AsyncFactory {
 			let sourceY = sourceUv[1] * imageH;
 			let w = uvSize[0] * imageW;
 			let h = uvSize[1] * imageH;
-			let crop;
-			// croppable = false;
-			if(croppable) {
+			let crop = null;
+			if(true) {
 				let old = { sourceX, sourceY, w, h };
 				let extremePixels = this.#findMostExtremePixels(image, sourceX, sourceY, w, h);
 				sourceX = extremePixels["minX"];
@@ -353,6 +354,8 @@ export default class TextureAtlas extends AsyncFactory {
 				};
 				if(crop["x"] != 0 || crop["y"] != 0 || crop["w"] != 1 || crop["h"] != 1) {
 					console.debug(`Cropped part of image ${texturePath} to`, crop);
+				} else {
+					crop = null;
 				}
 			}
 			let imageFragment = {
@@ -362,7 +365,7 @@ export default class TextureAtlas extends AsyncFactory {
 				"w": w,
 				"h": h
 			};
-			if(croppable) {
+			if(crop) {
 				imageFragment["crop"] = crop;
 			}
 			return imageFragment;
@@ -396,7 +399,7 @@ export default class TextureAtlas extends AsyncFactory {
 				imageFragment["h"] = ceil(imageFragment["h"]);
 			}
 		});
-		let imageFragments2 = imageFragments.map(imageFragment => ({ ... imageFragment }));
+		let imageFragments2 = imageFragments.map(imageFragment => ({ ...imageFragment }));
 		let packing1 = potpack(imageFragments);
 		let packing2 = potpack(imageFragments2.sort((a, b) => b.h - a.h || b.w - a.w)); // width presort
 		let packing = packing1.fill > packing2.fill? packing1 : packing2; // In my testing on 100 structures, 10 times no width presort was better, 17 times width presort was better, and the rest they were equal. On average, width presorting improved space efficiency by 0.1385%. Since potpack takes just a couple ms, it's best to look at both and take the better one.
@@ -432,10 +435,14 @@ export default class TextureAtlas extends AsyncFactory {
 			return imageUv;
 		});
 
+		ctx = can.getContext("2d");
+		ctx.fillStyle = "#00f3";
+		// ctx.fillRect(0, 0, can.width, can.height);
 		if(this.config.TEXTURE_OUTLINE_WIDTH != 0) {
 			can = TextureAtlas.addTextureOutlines(can, imageFragments, this.config);
 		}
 
+		
 		if(this.config.MULTIPLE_OPACITIES) {
 			let opacities = range(4, 10).map(x => x / 10); // lowest is 40% opacity. note that we do division after to avoid floating-point errors.
 			this.imageBlobs = await Promise.all(opacities.map(async opacity => [`hologram_opacity_${opacity}`, await this.#setCanvasOpacity(can, opacity).convertToBlob()]));
@@ -461,6 +468,7 @@ export default class TextureAtlas extends AsyncFactory {
 		let can = new OffscreenCanvas(imageW, imageH);
 		let ctx = can.getContext("2d");
 		ctx.drawImage(image, startX, startY, imageW, imageH, 0, 0, imageW, imageH);
+		// console.log(imageW, imageH, can.width, can.height)
 		let imageData = ctx.getImageData(0, 0, imageW, imageH).data;
 
 		let minX = imageW, minY = imageH, maxX = 0, maxY = 0;
@@ -599,18 +607,4 @@ export default class TextureAtlas extends AsyncFactory {
 	}
 }
 
-/**
- * @typedef {import("./HoloPrint.js").TextureReference} TextureReference
- */
-/**
- * @typedef {import("./HoloPrint.js").TextureFragment} TextureFragment
- */
-/**
- * @typedef {import("./HoloPrint.js").ImageFragment} ImageFragment
- */
-/**
- * @typedef {import("./HoloPrint.js").HoloPrintConfig} HoloPrintConfig
- */
-/**
- * @typedef {import("./HoloPrint.js").Vec3} Vec3
- */
+/** @import { TextureReference, TextureFragment, ImageFragment, HoloPrintConfig, Vec3, Vec2, Rectangle } from "./HoloPrint.js" */

src/PreviewRenderer.js

@@ -12,7 +12,7 @@ import SimpleLogger from "./components/SimpleLogger.js";
 import LilGui from "./components/LilGui.js";
 
 const IN_PRODUCTION = false;
-const ACTUAL_CONSOLE_LOG = false;
+const ACTUAL_CONSOLE_LOG = true;
 
 const supabaseProjectUrl = "https://gnzyfffwvulwxbczqpgl.supabase.co";
 const supabaseApiKey = "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6ImduenlmZmZ3dnVsd3hiY3pxcGdsIiwicm9sZSI6ImFub24iLCJpYXQiOjE3MjMwMjE3NzgsImV4cCI6MjAzODU5Nzc3OH0.AWMhFcP3PiMD3dMC_SeIVuPx128KVpgfkZ5qBStDuVw";

src/TextureAtlas.js

@@ -168,6 +168,30 @@ export function cosDeg(deg) {
 export function tanDeg(deg) {
 	return tan(deg * pi / 180);
 }
+export function rotate([x, y], angle) {
+    let c = cos(angle);
+    let s = sin(angle);
+    return [x * c - y * s, x * s + y * c];
+}
+export function rotateDeg(p, deg) {
+	return rotate(p, deg * pi / 180);
+}
+/**
+ * @param {Vec3} a
+ * @param {Vec3} b
+ * @returns {Vec3}
+ */
+export function addVec3(a, b) {
+	return [a[0] + b[0], a[1] + b[1], a[2] + b[2]];
+}
+/**
+ * @param {Vec3} vec
+ * @param {number} factor
+ * @returns {Vec3}
+ */
+export function mulVec3(vec, factor) {
+	return [vec[0] * factor, vec[1] * factor, vec[2] * factor];
+}
 
 export function arrayMin(arr) {
 	let min = Infinity;
@@ -713,20 +737,37 @@ function stringifyJsonBigIntSafe(value) {
 function parseJsonBigIntSafe(value) { // this function is unused but I'm keeping it here because it works well with the function above
 	return JSON.parse(value, (_, x, context) => context && Number.isInteger(x) && !Number.isSafeInteger(x)? BigInt(context.source) : x);
 }
+/**
+ * @template T
+ * @extends {Set<T>}
+ */
 export class JSONSet extends Set {
+	/** @type {Map<string, number>} */
+	#indices = new Map();
 	#actualValues = new Map();
 	constructor(values) {
 		super();
 		values?.forEach(value => this.add(value));
 	}
-	indexOf(value) { // not part of sets normally! but they keep their order anyway so...
-		let stringifiedValues = Array.from(super[Symbol.iterator]());
-		return stringifiedValues.indexOf(this.#stringify(value));
+	/** Not part of regular sets! Constant time indexing. */
+	indexOf(value) {
+		return this.#indices.get(this.#stringify(value));
+	}
+	addI(value) {
+		let stringifiedValue = this.#stringify(value);
+		super.add(stringifiedValue);
+		if(!this.#actualValues.has(stringifiedValue)) {
+			this.#actualValues.set(stringifiedValue, structuredClone(value));
+			this.#indices.set(stringifiedValue, this.size - 1);
+			return this.size - 1;
+		}
+		return this.#indices.get(stringifiedValue);
 	}
 	add(value) {
 		let stringifiedValue = this.#stringify(value);
 		if(!this.#actualValues.has(stringifiedValue)) {
 			this.#actualValues.set(stringifiedValue, structuredClone(value));
+			this.#indices.set(stringifiedValue, this.size);
 		}
 		return super.add(stringifiedValue);
 	}
@@ -736,6 +777,11 @@ export class JSONSet extends Set {
 	has(value) {
 		return super.has(this.#stringify(value))
 	}
+	clear() {
+		this.#indices.clear();
+		this.#actualValues.clear();
+		return super.clear();
+	}
 	[Symbol.iterator]() {
 		return this.#actualValues.values();
 	}
@@ -781,6 +827,21 @@ export class JSONMap extends Map { // very barebones
 		return stringifyJsonBigIntSafe(value);
 	}
 }
+export class JSONMultiSet {
+	#freqs = new JSONMap();
+	#indices = new Map();
+	add(key) {
+		let stringifiedKey = this.#stringify(key);
+		this.#freqs.set(stringifiedKey, (this.#freqs.get(stringifiedKey) ?? 0) + 1);
+		if(this.#indices.has(stringifiedKey)) {
+			return this.#indices.get(stringifiedKey);
+		}
+		this.#indices.set(stringifiedKey, this.#indices.size);
+	}
+	#stringify(value) {
+		return stringifyJsonBigIntSafe(value);
+	}
+}
 export class CachingFetcher extends AsyncFactory {
 	static URL_PREFIX = "https://cache/";
 	static BAD_STATUS_CODES = [429];