cyclecad 0.1.4 → 0.1.5

package/app/js/viewport.js

@@ -29,6 +29,9 @@ let isAnimating = false;
 let gridHelper = null;
 let axisLines = null;
 let referencePlanes = {};
+let groundPlane = null;
+let selectionOutline = null;
+let hemiLight = null;
 
 // Camera animation state
 let cameraAnimationState = {
@@ -181,6 +184,10 @@ function setupLighting() {
   const fillLight = new THREE.DirectionalLight(COLORS.fill, 0.3);
   fillLight.position.set(-100, 50, -100);
   scene.add(fillLight);
+
+  // Hemisphere light for natural environment feel (sky blue → ground grey)
+  hemiLight = new THREE.HemisphereLight(0x4488cc, 0x222222, 0.25);
+  scene.add(hemiLight);
 }
 
 // ============================================================================
@@ -238,6 +245,16 @@ function setupGridAndOrigin() {
   axisLines = new THREE.LineSegments(axisGeometry, axisMaterial);
   scene.add(axisLines);
 
+  // Ground shadow plane (invisible but receives shadows)
+  const groundGeom = new THREE.PlaneGeometry(GRID_SIZE * 2, GRID_SIZE * 2);
+  const groundMat = new THREE.ShadowMaterial({ opacity: 0.15 });
+  groundPlane = new THREE.Mesh(groundGeom, groundMat);
+  groundPlane.rotation.x = -Math.PI / 2;
+  groundPlane.position.y = -0.01; // Just below grid to avoid z-fighting
+  groundPlane.receiveShadow = true;
+  groundPlane.userData.isGround = true;
+  scene.add(groundPlane);
+
   // Create reference planes (semi-transparent quads)
   createReferencePlanes();
 }
@@ -426,6 +443,13 @@ function calculateOptimalDistance() {
  */
 export function addToScene(object) {
   if (scene) {
+    // Auto-enable shadows on meshes
+    object.traverse((child) => {
+      if (child.isMesh) {
+        child.castShadow = true;
+        child.receiveShadow = true;
+      }
+    });
     scene.add(object);
   }
 }
@@ -516,6 +540,62 @@ export function toggleWireframe(enabled) {
   }
 }
 
+// ============================================================================
+// Selection Highlighting
+// ============================================================================
+
+/**
+ * Highlight a mesh with a colored outline/glow effect
+ * @param {THREE.Mesh} mesh - Mesh to highlight
+ * @param {number} color - Highlight color (default: blue)
+ */
+export function highlightMesh(mesh, color = 0x58a6ff) {
+  // Remove existing highlight
+  clearHighlight();
+
+  if (!mesh || !mesh.geometry) return;
+
+  // Create outline using scaled clone with BackSide rendering
+  const outlineMat = new THREE.MeshBasicMaterial({
+    color: color,
+    side: THREE.BackSide,
+    transparent: true,
+    opacity: 0.4,
+  });
+
+  selectionOutline = new THREE.Mesh(mesh.geometry.clone(), outlineMat);
+  selectionOutline.scale.copy(mesh.scale).multiplyScalar(1.03);
+  selectionOutline.position.copy(mesh.position);
+  selectionOutline.rotation.copy(mesh.rotation);
+  selectionOutline.userData.isHighlight = true;
+  scene.add(selectionOutline);
+}
+
+/**
+ * Clear the current selection highlight
+ */
+export function clearHighlight() {
+  if (selectionOutline) {
+    scene.remove(selectionOutline);
+    if (selectionOutline.geometry) selectionOutline.geometry.dispose();
+    if (selectionOutline.material) selectionOutline.material.dispose();
+    selectionOutline = null;
+  }
+}
+
+/**
+ * Enable castShadow on a mesh (call after adding to scene)
+ * @param {THREE.Object3D} object - Object to enable shadows on
+ */
+export function enableShadows(object) {
+  object.traverse((child) => {
+    if (child.isMesh) {
+      child.castShadow = true;
+      child.receiveShadow = true;
+    }
+  });
+}
+
 // ============================================================================
 // Accessors
 // ============================================================================
@@ -664,4 +744,7 @@ export function dispose() {
   gridHelper = null;
   axisLines = null;
   referencePlanes = {};
+  groundPlane = null;
+  selectionOutline = null;
+  hemiLight = null;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cyclecad",
-  "version": "0.1.4",
+  "version": "0.1.5",
   "description": "Browser-based parametric 3D CAD modeler with AI-powered tools, native Inventor file parsing, and smart assembly management. No install required.",
   "main": "index.html",
   "scripts": {

package/DUO-MANIFEST-README.md

@@ -1,233 +0,0 @@
-# DUO Inventor Project Manifest
-
-## Overview
-
-A complete JSON manifest of the cycleWASH DUO Inventor project has been generated and is ready for browser-based loading without requiring File System Access API.
-
-**Files Generated:**
-- `/app/duo-manifest.json` — Complete project structure (313 KB)
-- `/app/duo-manifest-demo.html` — Interactive viewer (9.3 KB)
-
-## Project Statistics
-
-| Metric | Value |
-|--------|-------|
-| **Total Files** | 474 |
-| **Parts (.ipt)** | 393 |
-| **Assemblies (.iam)** | 80 |
-| **Custom Parts** | 214 |
-| **Standard Parts (DIN/ISO)** | 51 |
-| **Vendor/Buyout Parts** | 128 |
-| **Main Assembly Size** | 9.07 MB |
-
-## Manifest Structure
-
-```json
-{
-  "name": "DUO Durchgehend Inventor",
-  "description": "cycleWASH DUO — Automatic Bicycle Washing Machine",
-  "ipj": "D-ZBG-DUO-Anlage.ipj",
-  "workspace": "Workspaces/Arbeitsbereich",
-  "contentCenter": "Libraries/Content Center Files",
-  "stats": {
-    "total": 474,
-    "parts": 393,
-    "assemblies": 80,
-    "custom": 214,
-    "standard": 51,
-    "vendor": 128
-  },
-  "tree": {
-    "name": "DUO Durchgehend Inventor",
-    "type": "folder",
-    "children": [ /* hierarchical folder structure */ ]
-  },
-  "assemblies": [
-    {
-      "name": "D-ZBG-DUO-Anlage.iam",
-      "path": "Workspaces/Arbeitsbereich/Zusatzoptionen/DUOdurch/D-ZBG-DUO-Anlage.iam",
-      "size": 9500000,
-      "isMain": true
-    },
-    /* ... 79 more assemblies ... */
-  ],
-  "parts": [
-    {
-      "name": "TrägerHöhe1.ipt",
-      "path": "Workspaces/Arbeitsbereich/DUO Anlage/Gestell/TrägerHöhe1.ipt",
-      "category": "custom",
-      "size": 237568
-    },
-    /* ... 392 more parts ... */
-  ]
-}
-```
-
-## Usage in Browser
-
-### Load the Manifest
-```javascript
-// Fetch the manifest in your app
-fetch('./duo-manifest.json')
-  .then(r => r.json())
-  .then(manifest => {
-    console.log('Loaded', manifest.stats.parts, 'parts');
-    console.log('Assemblies:', manifest.assemblies.length);
-  });
-```
-
-### Query the Data
-```javascript
-// Find all custom parts
-const customParts = manifest.parts.filter(p => p.category === 'custom');
-
-// Find the main assembly
-const mainAssembly = manifest.assemblies.find(a => a.isMain);
-
-// Get parts in a specific folder
-const frameparts = manifest.parts.filter(p => 
-  p.path.includes('Gestell')
-);
-
-// Sort by size
-const largestParts = [...manifest.parts]
-  .sort((a, b) => b.size - a.size)
-  .slice(0, 10);
-```
-
-## File Categories
-
-### Custom Parts (214)
-Parts designed for cycleWASH DUO, typically with "D-" prefix:
-- `D-TrägerHöhe1.ipt`
-- `D-Wanne v2.ipt`
-- `D-Deckblech.ipt`
-
-Location: `Workspaces/Arbeitsbereich/`
-
-### Standard Parts (51)
-DIN/ISO standard hardware from Inventor's Content Center:
-- `ISO 4017 - M6 x 12 - A2.ipt` (hex cap screws)
-- `DIN 6912 - M6 x 10 - A2.ipt` (socket cap screws)
-- `DIN 912 - M3 x 8 - A2.ipt`
-
-Location: `Libraries/Content Center Files/de-DE/`
-
-### Vendor Parts (128)
-Bought-in/standard components from suppliers:
-- igus linear guides
-- Interroll rollers
-- WEG electric motors
-- Rittal electrical enclosures
-- UNISTAR_2000B components
-
-Location: `Workspaces/Arbeitsbereich/Zukaufteile/`
-
-## Largest Components
-
-| Part | Size | Category |
-|------|------|----------|
-| KD-161083.ipt | 21.5 MB | Vendor |
-| Rampe NX.ipt | 10.9 MB | Custom |
-| 502PU AND MOTOR.ipt | 10.9 MB | Vendor |
-| KD-158948.ipt | 9.3 MB | Vendor |
-| Große Ecke neuer Beschnitt alleine2.ipt | 5.0 MB | Custom |
-
-## Main Assembly
-
-**Name:** D-ZBG-DUO-Anlage.iam  
-**Path:** `Workspaces/Arbeitsbereich/Zusatzoptionen/DUOdurch/D-ZBG-DUO-Anlage.iam`  
-**Size:** 9.07 MB  
-**Components:** 47 (per parsing)
-
-## Folder Structure
-
-```
-DUO Durchgehend Inventor/
-├── D-ZBG-DUO-Anlage.ipj (project file)
-├── Libraries/
-│   └── Content Center Files/
-│       └── de-DE/
-│           ├── DIN 1587/
-│           ├── DIN 580/
-│           ├── DIN 6912/
-│           ├── DIN 7349 ees/
-│           ├── ISO 4017/
-│           ├── ISO 4762/
-│           └── ... (other DIN/ISO standards)
-└── Workspaces/
-    └── Arbeitsbereich/
-        ├── DUO Anlage/
-        │   ├── Gestell/ (frame components)
-        │   ├── Lenkerhalterung/ (handlebar holder)
-        │   └── ... (other subsystems)
-        ├── MiniDuo NX_11/ (smaller variant)
-        ├── Übernommen/ (legacy parts)
-        ├── Zukaufteile/ (vendor parts)
-        │   ├── igus/
-        │   ├── Interroll/
-        │   ├── Rittal/
-        │   ├── WEG/
-        │   └── UNISTAR_2000B/
-        └── Zusatzoptionen/ (optional modules)
-            └── DUOdurch/
-                ├── Gestell/
-                ├── Raddreheinheit/
-                ├── Schiebebürsten/
-                └── D-ZBG-DUO-Anlage.iam (main assembly)
-```
-
-## Integration Points
-
-### cyclecad Project Browser
-The manifest is designed to integrate with `project-browser.js`:
-- Load manifest at startup
-- Render folder tree with file type icons
-- Filter by category (custom/standard/vendor)
-- Search parts by name
-- Display statistics dashboard
-
-### Assembly Resolver
-The manifest enables `assembly-resolver.js` to:
-- Quickly reference assembly paths
-- Build dependency graphs
-- Generate BOMs without parsing binary files
-- Map component relationships
-
-### Browser UI
-No File System Access API needed:
-- All 393 parts queryable client-side
-- Manifest loads as JSON (standard XHR/Fetch)
-- Works on static hosting (GitHub Pages, CDN)
-- Progressive loading for large assemblies
-
-## Demo Viewer
-
-Open `duo-manifest-demo.html` in a browser to:
-- View project statistics
-- Browse all assemblies
-- Search parts (first 50 shown)
-- Explore folder hierarchy
-- Copy file paths for integration
-
-## Manifest Generation
-
-**Source:** `/sessions/sharp-modest-allen/mnt/cyclecad/example/DUO Durchgehend Inventor/`
-
-**Generated with:**
-```bash
-node build-manifest.js > duo-manifest.json
-```
-
-**Validation:**
-- ✅ 393 .ipt files parsed and categorized
-- ✅ 80 .iam assemblies indexed
-- ✅ Folder hierarchy preserved
-- ✅ File sizes included (bytes)
-- ✅ Relative paths normalized
-
----
-
-**Last Updated:** 2026-03-24  
-**Manifest Size:** 313 KB  
-**Format:** JSON (UTF-8, no compression)

package/app/duo-manifest-demo.html

@@ -1,337 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>DUO Manifest Viewer</title>
-  <style>
-    body {
-      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
-      margin: 0;
-      padding: 20px;
-      background: #f5f5f5;
-      color: #333;
-    }
-    .container {
-      max-width: 1200px;
-      margin: 0 auto;
-      background: white;
-      padding: 20px;
-      border-radius: 8px;
-      box-shadow: 0 2px 8px rgba(0,0,0,0.1);
-    }
-    h1 {
-      margin-top: 0;
-      color: #0066cc;
-    }
-    .stats {
-      display: grid;
-      grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
-      gap: 20px;
-      margin: 20px 0;
-    }
-    .stat-box {
-      background: #f9f9f9;
-      border-left: 4px solid #0066cc;
-      padding: 15px;
-      border-radius: 4px;
-    }
-    .stat-box h3 {
-      margin: 0 0 10px 0;
-      color: #666;
-      font-size: 12px;
-      text-transform: uppercase;
-      letter-spacing: 0.5px;
-    }
-    .stat-box .value {
-      font-size: 32px;
-      font-weight: bold;
-      color: #0066cc;
-    }
-    .stat-box .sublabel {
-      font-size: 12px;
-      color: #999;
-      margin-top: 5px;
-    }
-    .tabs {
-      display: flex;
-      gap: 0;
-      border-bottom: 2px solid #eee;
-      margin: 20px 0;
-    }
-    .tab-btn {
-      padding: 10px 20px;
-      background: none;
-      border: none;
-      cursor: pointer;
-      font-size: 14px;
-      color: #666;
-      border-bottom: 2px solid transparent;
-      margin-bottom: -2px;
-      transition: all 0.2s;
-    }
-    .tab-btn:hover {
-      color: #0066cc;
-    }
-    .tab-btn.active {
-      color: #0066cc;
-      border-bottom-color: #0066cc;
-    }
-    .tab-content {
-      display: none;
-    }
-    .tab-content.active {
-      display: block;
-    }
-    table {
-      width: 100%;
-      border-collapse: collapse;
-      font-size: 13px;
-    }
-    th {
-      background: #f5f5f5;
-      padding: 10px;
-      text-align: left;
-      font-weight: 600;
-      border-bottom: 1px solid #ddd;
-    }
-    td {
-      padding: 10px;
-      border-bottom: 1px solid #eee;
-    }
-    tr:hover {
-      background: #fafafa;
-    }
-    .category-badge {
-      display: inline-block;
-      padding: 2px 8px;
-      border-radius: 3px;
-      font-size: 11px;
-      font-weight: 600;
-      text-transform: uppercase;
-      letter-spacing: 0.3px;
-    }
-    .category-badge.custom {
-      background: #e3f2fd;
-      color: #1976d2;
-    }
-    .category-badge.standard {
-      background: #f3e5f5;
-      color: #7b1fa2;
-    }
-    .category-badge.vendor {
-      background: #fff3e0;
-      color: #e65100;
-    }
-    .tree-view {
-      margin: 20px 0;
-    }
-    .tree-item {
-      margin-left: 20px;
-      padding: 5px 0;
-      font-size: 13px;
-    }
-    .tree-folder {
-      font-weight: 600;
-      color: #0066cc;
-      margin-top: 10px;
-    }
-    .file-size {
-      color: #999;
-      font-size: 12px;
-    }
-    .loading {
-      text-align: center;
-      color: #999;
-      padding: 40px;
-    }
-    .error {
-      background: #ffebee;
-      color: #c62828;
-      padding: 15px;
-      border-radius: 4px;
-      margin: 20px 0;
-    }
-  </style>
-</head>
-<body>
-  <div class="container">
-    <h1>DUO Durchgehend Inventor — Manifest Viewer</h1>
-    <div class="loading">Loading manifest...</div>
-  </div>
-
-  <script>
-    async function loadManifest() {
-      try {
-        const response = await fetch('./duo-manifest.json');
-        if (!response.ok) throw new Error(`HTTP ${response.status}`);
-        
-        const manifest = await response.json();
-        renderManifest(manifest);
-      } catch (error) {
-        document.querySelector('.container').innerHTML = `
-          <h1>DUO Durchgehend Inventor — Manifest Viewer</h1>
-          <div class="error">Error loading manifest: ${error.message}</div>
-        `;
-      }
-    }
-
-    function formatSize(bytes) {
-      if (bytes === 0) return '0 B';
-      const k = 1024;
-      const sizes = ['B', 'KB', 'MB', 'GB'];
-      const i = Math.floor(Math.log(bytes) / Math.log(k));
-      return Math.round(bytes / Math.pow(k, i) * 100) / 100 + ' ' + sizes[i];
-    }
-
-    function renderManifest(manifest) {
-      const s = manifest.stats;
-      const html = `
-        <h1>${manifest.name}</h1>
-        <p><strong>${manifest.description}</strong></p>
-
-        <div class="stats">
-          <div class="stat-box">
-            <h3>Total Files</h3>
-            <div class="value">${s.total}</div>
-          </div>
-          <div class="stat-box">
-            <h3>Parts (.ipt)</h3>
-            <div class="value">${s.parts}</div>
-            <div class="sublabel">Custom: ${s.custom} • Standard: ${s.standard} • Vendor: ${s.vendor}</div>
-          </div>
-          <div class="stat-box">
-            <h3>Assemblies (.iam)</h3>
-            <div class="value">${s.assemblies}</div>
-          </div>
-        </div>
-
-        <div class="tabs">
-          <button class="tab-btn active" data-tab="project">Project Info</button>
-          <button class="tab-btn" data-tab="assemblies">Assemblies</button>
-          <button class="tab-btn" data-tab="parts">Parts</button>
-          <button class="tab-btn" data-tab="tree">Folder Tree</button>
-        </div>
-
-        <div id="project" class="tab-content active">
-          <table>
-            <tr>
-              <th>Property</th>
-              <th>Value</th>
-            </tr>
-            <tr>
-              <td>Project File</td>
-              <td><code>${manifest.ipj}</code></td>
-            </tr>
-            <tr>
-              <td>Workspace</td>
-              <td><code>${manifest.workspace}</code></td>
-            </tr>
-            <tr>
-              <td>Content Center</td>
-              <td><code>${manifest.contentCenter}</code></td>
-            </tr>
-            <tr>
-              <td>Total Components</td>
-              <td>${s.total}</td>
-            </tr>
-            <tr>
-              <td>Main Assembly</td>
-              <td><code>${manifest.assemblies.find(a => a.isMain)?.path || 'N/A'}</code></td>
-            </tr>
-          </table>
-        </div>
-
-        <div id="assemblies" class="tab-content">
-          <table>
-            <tr>
-              <th>Assembly Name</th>
-              <th>Path</th>
-              <th>Size</th>
-              <th></th>
-            </tr>
-            ${manifest.assemblies.map(a => `
-              <tr>
-                <td><strong>${a.name}</strong></td>
-                <td><code style="font-size: 11px">${a.path}</code></td>
-                <td>${formatSize(a.size)}</td>
-                <td>${a.isMain ? '<span style="color: #d32f2f; font-weight: 600;">● MAIN</span>' : ''}</td>
-              </tr>
-            `).join('')}
-          </table>
-        </div>
-
-        <div id="parts" class="tab-content">
-          <table>
-            <tr>
-              <th>Part Name</th>
-              <th>Category</th>
-              <th>Path</th>
-              <th>Size</th>
-            </tr>
-            ${manifest.parts.slice(0, 50).map(p => `
-              <tr>
-                <td>${p.name}</td>
-                <td><span class="category-badge ${p.category}">${p.category}</span></td>
-                <td><code style="font-size: 11px">${p.path}</code></td>
-                <td>${formatSize(p.size)}</td>
-              </tr>
-            `).join('')}
-            <tr>
-              <td colspan="4" style="text-align: center; color: #999; font-size: 12px;">
-                Showing 50 of ${manifest.parts.length} parts
-              </td>
-            </tr>
-          </table>
-        </div>
-
-        <div id="tree" class="tab-content">
-          <div class="tree-view">
-            ${renderTree(manifest.tree, 0)}
-          </div>
-        </div>
-      `;
-      
-      document.querySelector('.container').innerHTML = html;
-      
-      // Tab switching
-      document.querySelectorAll('.tab-btn').forEach(btn => {
-        btn.addEventListener('click', (e) => {
-          document.querySelectorAll('.tab-btn').forEach(b => b.classList.remove('active'));
-          document.querySelectorAll('.tab-content').forEach(c => c.classList.remove('active'));
-          e.target.classList.add('active');
-          document.getElementById(e.target.dataset.tab).classList.add('active');
-        });
-      });
-    }
-
-    function renderTree(node, depth, limit = 100, count = { n: 0 }) {
-      if (count.n >= limit) return '';
-      count.n++;
-
-      if (node.type === 'folder') {
-        const margin = depth * 20;
-        const items = (node.children || []).slice(0, 50);
-        return `
-          <div class="tree-item" style="margin-left: ${margin}px; font-weight: 600; color: #0066cc;">
-            📁 ${node.name}
-          </div>
-          ${items.map(child => renderTree(child, depth + 1, limit, count)).join('')}
-          ${(node.children || []).length > 50 ? `<div class="tree-item" style="margin-left: ${(depth+1)*20}px; color: #999;">... and ${node.children.length - 50} more</div>` : ''}
-        `;
-      } else {
-        const margin = depth * 20;
-        const badge = node.category ? `<span class="category-badge ${node.category}" style="margin-left: 10px">${node.category}</span>` : '';
-        return `
-          <div class="tree-item" style="margin-left: ${margin}px;">
-            📄 ${node.name} <span class="file-size">${formatSize(node.size)}</span>${badge}
-          </div>
-        `;
-      }
-    }
-
-    // Load on page load
-    loadManifest();
-  </script>
-</body>
-</html>