circuit-json-to-gltf 0.0.10 → 0.0.12

package/dist/index.d.ts

@@ -76,7 +76,7 @@ interface Box3D {
     };
     mesh?: STLMesh | OBJMesh;
     meshUrl?: string;
-    meshType?: "stl" | "obj";
+    meshType?: "stl" | "obj" | "glb";
     label?: string;
     labelColor?: Color;
 }
@@ -135,6 +135,9 @@ declare function clearSTLCache(): void;
 declare function loadOBJ(url: string, transform?: CoordinateTransformConfig): Promise<OBJMesh>;
 declare function clearOBJCache(): void;
 
+declare function loadGLB(url: string, transform?: CoordinateTransformConfig): Promise<STLMesh>;
+declare function clearGLBCache(): void;
+
 declare function convertCircuitJsonTo3D(circuitJson: CircuitJson, options?: CircuitTo3DOptions): Promise<Scene3D>;
 
 declare function convertSceneToGLTF(scene: Scene3D, options?: GLTFExportOptions): Promise<ArrayBuffer | object>;
@@ -165,4 +168,4 @@ declare const COORDINATE_TRANSFORMS: {
 
 declare function convertCircuitJsonToGltf(circuitJson: CircuitJson, options?: ConversionOptions): Promise<ArrayBuffer | object>;
 
-export { type BoardRenderOptions, type BoundingBox, type Box3D, COORDINATE_TRANSFORMS, type Camera3D, type CircuitTo3DOptions, type Color, type ConversionOptions, type CoordinateTransformConfig, type GLTFExportOptions, type Light3D, type OBJMaterial, type OBJMesh, type Point3, type STLMesh, type Scene3D, type Size3, type Triangle, applyCoordinateTransform, clearOBJCache, clearSTLCache, convertCircuitJsonTo3D, convertCircuitJsonToGltf, convertSceneToGLTF, loadOBJ, loadSTL, renderBoardLayer, renderBoardTextures, transformTriangles };
+export { type BoardRenderOptions, type BoundingBox, type Box3D, COORDINATE_TRANSFORMS, type Camera3D, type CircuitTo3DOptions, type Color, type ConversionOptions, type CoordinateTransformConfig, type GLTFExportOptions, type Light3D, type OBJMaterial, type OBJMesh, type Point3, type STLMesh, type Scene3D, type Size3, type Triangle, applyCoordinateTransform, clearGLBCache, clearOBJCache, clearSTLCache, convertCircuitJsonTo3D, convertCircuitJsonToGltf, convertSceneToGLTF, loadGLB, loadOBJ, loadSTL, renderBoardLayer, renderBoardTextures, transformTriangles };

package/dist/index.js

@@ -480,6 +480,268 @@ function clearOBJCache() {
   objCache.clear();
 }
 
+// lib/loaders/glb.ts
+var glbCache = /* @__PURE__ */ new Map();
+async function loadGLB(url, transform) {
+  const cacheKey = `${url}:${JSON.stringify(transform ?? {})}`;
+  if (glbCache.has(cacheKey)) {
+    return glbCache.get(cacheKey);
+  }
+  const response = await fetch(url);
+  const buffer = await response.arrayBuffer();
+  const mesh = parseGLB(buffer, transform);
+  glbCache.set(cacheKey, mesh);
+  return mesh;
+}
+function parseGLB(buffer, transform) {
+  const view = new DataView(buffer);
+  let offset = 0;
+  const magic = view.getUint32(offset, true);
+  offset += 4;
+  if (magic !== 1179937895) {
+    throw new Error("Invalid GLB file: incorrect magic number");
+  }
+  const version = view.getUint32(offset, true);
+  offset += 4;
+  if (version !== 2) {
+    throw new Error(`Unsupported GLB version: ${version}`);
+  }
+  const length = view.getUint32(offset, true);
+  offset += 4;
+  const jsonChunkLength = view.getUint32(offset, true);
+  offset += 4;
+  const jsonChunkType = view.getUint32(offset, true);
+  offset += 4;
+  if (jsonChunkType !== 1313821514) {
+    throw new Error("Expected JSON chunk");
+  }
+  const jsonBytes = new Uint8Array(buffer, offset, jsonChunkLength);
+  const jsonString = new TextDecoder().decode(jsonBytes);
+  const gltf = JSON.parse(jsonString);
+  offset += jsonChunkLength;
+  let binaryBuffer;
+  if (offset < length) {
+    const binaryChunkLength = view.getUint32(offset, true);
+    offset += 4;
+    const binaryChunkType = view.getUint32(offset, true);
+    offset += 4;
+    if (binaryChunkType === 5130562) {
+      binaryBuffer = buffer.slice(offset, offset + binaryChunkLength);
+    }
+  }
+  const triangles = extractTrianglesFromGLTF(gltf, binaryBuffer);
+  const finalConfig = transform ?? {
+    axisMapping: { x: "x", y: "z", z: "y" }
+  };
+  const transformedTriangles = transformTriangles(triangles, finalConfig);
+  return {
+    triangles: transformedTriangles,
+    boundingBox: calculateBoundingBox3(transformedTriangles)
+  };
+}
+function extractTrianglesFromGLTF(gltf, binaryBuffer) {
+  const triangles = [];
+  if (!gltf.meshes || !gltf.accessors || !gltf.bufferViews) {
+    return triangles;
+  }
+  for (const mesh of gltf.meshes) {
+    for (const primitive of mesh.primitives) {
+      const mode = primitive.mode ?? 4;
+      if (mode !== 4) {
+        continue;
+      }
+      const positionAccessorIndex = primitive.attributes.POSITION;
+      if (positionAccessorIndex === void 0) {
+        continue;
+      }
+      const positionAccessor = gltf.accessors[positionAccessorIndex];
+      const positions = getAccessorData(
+        positionAccessor,
+        gltf.bufferViews,
+        binaryBuffer
+      );
+      let normals;
+      const normalAccessorIndex = primitive.attributes.NORMAL;
+      if (normalAccessorIndex !== void 0) {
+        const normalAccessor = gltf.accessors[normalAccessorIndex];
+        normals = getAccessorData(
+          normalAccessor,
+          gltf.bufferViews,
+          binaryBuffer
+        );
+      }
+      let indices;
+      if (primitive.indices !== void 0) {
+        const indexAccessor = gltf.accessors[primitive.indices];
+        const indexData = getAccessorData(
+          indexAccessor,
+          gltf.bufferViews,
+          binaryBuffer
+        );
+        indices = indexAccessor.componentType === 5123 ? new Uint16Array(
+          indexData.buffer,
+          indexData.byteOffset,
+          indexData.length
+        ) : new Uint32Array(
+          indexData.buffer,
+          indexData.byteOffset,
+          indexData.length
+        );
+      }
+      const vertexCount = positions.length / 3;
+      if (indices) {
+        for (let i = 0; i < indices.length; i += 3) {
+          const i0 = indices[i];
+          const i1 = indices[i + 1];
+          const i2 = indices[i + 2];
+          const v0 = {
+            x: positions[i0 * 3],
+            y: positions[i0 * 3 + 1],
+            z: positions[i0 * 3 + 2]
+          };
+          const v1 = {
+            x: positions[i1 * 3],
+            y: positions[i1 * 3 + 1],
+            z: positions[i1 * 3 + 2]
+          };
+          const v2 = {
+            x: positions[i2 * 3],
+            y: positions[i2 * 3 + 1],
+            z: positions[i2 * 3 + 2]
+          };
+          let normal;
+          if (normals) {
+            normal = {
+              x: (normals[i0 * 3] + normals[i1 * 3] + normals[i2 * 3]) / 3,
+              y: (normals[i0 * 3 + 1] + normals[i1 * 3 + 1] + normals[i2 * 3 + 1]) / 3,
+              z: (normals[i0 * 3 + 2] + normals[i1 * 3 + 2] + normals[i2 * 3 + 2]) / 3
+            };
+          } else {
+            normal = computeNormal(v0, v1, v2);
+          }
+          triangles.push({ vertices: [v0, v1, v2], normal });
+        }
+      } else {
+        for (let i = 0; i < vertexCount; i += 3) {
+          const v0 = {
+            x: positions[i * 3],
+            y: positions[i * 3 + 1],
+            z: positions[i * 3 + 2]
+          };
+          const v1 = {
+            x: positions[(i + 1) * 3],
+            y: positions[(i + 1) * 3 + 1],
+            z: positions[(i + 1) * 3 + 2]
+          };
+          const v2 = {
+            x: positions[(i + 2) * 3],
+            y: positions[(i + 2) * 3 + 1],
+            z: positions[(i + 2) * 3 + 2]
+          };
+          let normal;
+          if (normals) {
+            normal = {
+              x: (normals[i * 3] + normals[(i + 1) * 3] + normals[(i + 2) * 3]) / 3,
+              y: (normals[i * 3 + 1] + normals[(i + 1) * 3 + 1] + normals[(i + 2) * 3 + 1]) / 3,
+              z: (normals[i * 3 + 2] + normals[(i + 1) * 3 + 2] + normals[(i + 2) * 3 + 2]) / 3
+            };
+          } else {
+            normal = computeNormal(v0, v1, v2);
+          }
+          triangles.push({ vertices: [v0, v1, v2], normal });
+        }
+      }
+    }
+  }
+  return triangles;
+}
+function getAccessorData(accessor, bufferViews, binaryBuffer) {
+  const bufferView = bufferViews[accessor.bufferView];
+  if (!bufferView || !binaryBuffer) {
+    throw new Error("Missing buffer data");
+  }
+  const byteOffset = (bufferView.byteOffset ?? 0) + (accessor.byteOffset ?? 0);
+  const componentType = accessor.componentType;
+  const count = accessor.count;
+  const type = accessor.type;
+  const componentsPerElement = type === "SCALAR" ? 1 : type === "VEC2" ? 2 : type === "VEC3" ? 3 : type === "VEC4" ? 4 : 1;
+  const totalComponents = count * componentsPerElement;
+  if (componentType === 5126) {
+    return new Float32Array(binaryBuffer, byteOffset, totalComponents);
+  } else if (componentType === 5123) {
+    const uint16Array = new Uint16Array(
+      binaryBuffer,
+      byteOffset,
+      totalComponents
+    );
+    return new Float32Array(uint16Array);
+  } else if (componentType === 5125) {
+    const uint32Array = new Uint32Array(
+      binaryBuffer,
+      byteOffset,
+      totalComponents
+    );
+    return new Float32Array(uint32Array);
+  } else if (componentType === 5122) {
+    const int16Array = new Int16Array(binaryBuffer, byteOffset, totalComponents);
+    return new Float32Array(int16Array);
+  } else if (componentType === 5124) {
+    const int32Array = new Int32Array(binaryBuffer, byteOffset, totalComponents);
+    return new Float32Array(int32Array);
+  } else if (componentType === 5121) {
+    const uint8Array = new Uint8Array(binaryBuffer, byteOffset, totalComponents);
+    return new Float32Array(uint8Array);
+  } else if (componentType === 5120) {
+    const int8Array = new Int8Array(binaryBuffer, byteOffset, totalComponents);
+    return new Float32Array(int8Array);
+  }
+  throw new Error(`Unsupported component type: ${componentType}`);
+}
+function computeNormal(v0, v1, v2) {
+  const edge1 = {
+    x: v1.x - v0.x,
+    y: v1.y - v0.y,
+    z: v1.z - v0.z
+  };
+  const edge2 = {
+    x: v2.x - v0.x,
+    y: v2.y - v0.y,
+    z: v2.z - v0.z
+  };
+  return {
+    x: edge1.y * edge2.z - edge1.z * edge2.y,
+    y: edge1.z * edge2.x - edge1.x * edge2.z,
+    z: edge1.x * edge2.y - edge1.y * edge2.x
+  };
+}
+function calculateBoundingBox3(triangles) {
+  if (triangles.length === 0) {
+    return {
+      min: { x: 0, y: 0, z: 0 },
+      max: { x: 0, y: 0, z: 0 }
+    };
+  }
+  let minX = Infinity, minY = Infinity, minZ = Infinity;
+  let maxX = -Infinity, maxY = -Infinity, maxZ = -Infinity;
+  for (const triangle of triangles) {
+    for (const vertex of triangle.vertices) {
+      minX = Math.min(minX, vertex.x);
+      minY = Math.min(minY, vertex.y);
+      minZ = Math.min(minZ, vertex.z);
+      maxX = Math.max(maxX, vertex.x);
+      maxY = Math.max(maxY, vertex.y);
+      maxZ = Math.max(maxZ, vertex.z);
+    }
+  }
+  return {
+    min: { x: minX, y: minY, z: minZ },
+    max: { x: maxX, y: maxY, z: maxZ }
+  };
+}
+function clearGLBCache() {
+  glbCache.clear();
+}
+
 // lib/converters/board-renderer.ts
 import { convertCircuitJsonToPcbSvg } from "circuit-to-svg";
 async function renderBoardLayer(circuitJson, options) {
@@ -638,8 +900,12 @@ async function convertCircuitJsonTo3D(circuitJson, options = {}) {
   const cadComponents = db.cad_component?.list?.() ?? [];
   const pcbComponentIdsWith3D = /* @__PURE__ */ new Set();
   for (const cad of cadComponents) {
-    const { model_stl_url, model_obj_url } = cad;
-    if (!model_stl_url && !model_obj_url) continue;
+    let { model_stl_url, model_obj_url, model_glb_url } = cad;
+    const hasModelUrl = Boolean(model_stl_url || model_obj_url || model_glb_url);
+    if (!hasModelUrl && cad.footprinter_string) {
+      model_glb_url = `https://modelcdn.tscircuit.com/jscad_models/${cad.footprinter_string}.glb`;
+    }
+    if (!model_stl_url && !model_obj_url && !model_glb_url) continue;
     pcbComponentIdsWith3D.add(cad.pcb_component_id);
     const pcbComponent = db.pcb_component.get(cad.pcb_component_id);
     const size = cad.size ?? {
@@ -655,23 +921,27 @@ async function convertCircuitJsonTo3D(circuitJson, options = {}) {
     const box = {
       center,
       size,
-      color: componentColor,
-      meshUrl: model_stl_url || model_obj_url,
-      meshType: model_stl_url ? "stl" : "obj"
+      meshUrl: model_stl_url || model_obj_url || model_glb_url,
+      meshType: model_stl_url ? "stl" : model_obj_url ? "obj" : "glb"
     };
     if (cad.rotation) {
       box.rotation = convertRotationFromCadRotation(cad.rotation);
     }
-    const defaultTransform = coordinateTransform ?? COORDINATE_TRANSFORMS.Z_UP_TO_Y_UP_USB_FIX;
+    const defaultTransform = coordinateTransform ?? (model_glb_url ? void 0 : COORDINATE_TRANSFORMS.Z_UP_TO_Y_UP_USB_FIX);
     try {
       if (model_stl_url) {
         box.mesh = await loadSTL(model_stl_url, defaultTransform);
       } else if (model_obj_url) {
         box.mesh = await loadOBJ(model_obj_url, defaultTransform);
+      } else if (model_glb_url) {
+        box.mesh = await loadGLB(model_glb_url, defaultTransform);
       }
     } catch (error) {
       console.warn(`Failed to load 3D model: ${error}`);
     }
+    if (!box.mesh) {
+      box.color = componentColor;
+    }
     boxes.push(box);
   }
   for (const component of db.pcb_component.list()) {
@@ -1326,6 +1596,16 @@ var GLTFBuilder = class {
     let materialIndex = defaultMaterialIndex;
     if (box.color) {
       materialIndex = this.addMaterialFromColor(box.color, !box.mesh);
+    } else if (box.mesh) {
+      materialIndex = this.addMaterial({
+        name: `MeshMaterial_${this.materials.length}`,
+        pbrMetallicRoughness: {
+          baseColorFactor: [0.7, 0.7, 0.7, 1],
+          metallicFactor: 0.1,
+          roughnessFactor: 0.9
+        },
+        alphaMode: "OPAQUE"
+      });
     }
     const meshIndex = this.addMesh(meshData, materialIndex, box.label);
     const nodeIndex = this.nodes.length;
@@ -1852,11 +2132,13 @@ async function convertCircuitJsonToGltf(circuitJson, options = {}) {
 export {
   COORDINATE_TRANSFORMS,
   applyCoordinateTransform,
+  clearGLBCache,
   clearOBJCache,
   clearSTLCache,
   convertCircuitJsonTo3D,
   convertCircuitJsonToGltf,
   convertSceneToGLTF,
+  loadGLB,
   loadOBJ,
   loadSTL,
   renderBoardLayer,

package/package.json

@@ -2,7 +2,7 @@
   "name": "circuit-json-to-gltf",
   "main": "dist/index.js",
   "type": "module",
-  "version": "0.0.10",
+  "version": "0.0.12",
   "scripts": {
     "test": "bun test tests/",
     "format": "biome format --write .",
@@ -28,7 +28,7 @@
     "circuit-json": "^0.0.267",
     "circuit-to-svg": "^0.0.175",
     "looks-same": "^9.0.1",
-    "poppygl": "^0.0.6",
+    "poppygl": "^0.0.9",
     "react": "^19.1.1",
     "react-cosmos": "^7.0.0",
     "react-cosmos-plugin-vite": "^7.0.0",