cyclecad 3.9.3 → 3.9.6

package/CLAUDE.md

@@ -953,5 +953,169 @@ rm -f ~/explodeview/.git/index.lock ~/explodeview/.git/HEAD.lock && cd ~/explode
 - [ ] Build Photo-to-CAD Reverse Engineering
 - [ ] Build Instant Manufacturability Feedback
 
+## Session 2026-04-01 — Critical Bug Fixes + Sketch Wiring + cycleWASH Prospects
+
+### Problem Evolution (Chronological)
+1. **cycleWASH prospect spreadsheet** — Built `cycleWASH-NRW-Prospects.xlsx` with 36 leads (bike shops/rentals in NRW), email templates (DE+EN), follow-up tracker. Created with openpyxl, 3 sheets, color-coded priorities.
+2. **TextToCAD syntax error** — `app/js/modules/text-to-cad.js` line 215 had missing `(` after `if` in regex test. Fixed, pushed.
+3. **Splash screen missing** — App launched showing demo geometry (blue box + green cylinder) instead of welcome splash. Built splash with 4 buttons (New Sketch, Open/Import, Text-to-CAD, Inventor Project).
+4. **Splash buttons not responding (3 attempts)** — Root cause: `<script type="module">` creates its own scope. Functions inside cannot be called from inline HTML `onclick`. Solution: regular `<script>` IIFE with `addEventListener` on `id`-based buttons.
+5. **VM mount is copy-on-write** — CRITICAL LESSON: Files edited via Edit tool exist only in VM overlay, NOT on user's Mac. `git status` on Mac shows "nothing to commit". Only reliable delivery: `write_clipboard` → user pastes in Terminal.
+6. **Dialog selectors wrong** — All 12 Tools menu handlers used `.dialog-content` (doesn't exist). Correct selector: `#dialog-body`. Fixed via clipboard Python command.
+7. **Demo geometry removal** — Removed hardcoded `BoxGeometry(60,40,80)` + `CylinderGeometry(20,20,60)`.
+8. **ViewCube click-only** — Only had click-to-snap-to-face. Added drag-to-rotate with pointer events (pointerdown/pointermove/pointerup), spherical coordinate rotation of main camera. Enlarged 90px → 120px.
+9. **Hard Reset button missing** — Added to Help menu (red text). Clears Service Workers, Cache API, localStorage, sessionStorage, IndexedDB. Works in Safari/Chrome/Firefox.
+10. **GitHub Pages CDN cache** — All fixes deployed to GitHub but Pages CDN served stale version. Added `<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">` to prevent future caching.
+11. **Sketch tools not wired** — Sketch menu items (Line/Circle/Rectangle/Arc/Polyline) existed in UI but `handleMenuAction` only showed toasts. `sketch.js` module was never imported. Wired all tools with auto-enter sketch mode on XY plane.
+12. **CRITICAL: Wrong import names killed entire module** — Imported `entitiesToShape` and `getSketchEntities` from `sketch.js`, but actual exports are `entitiesToGeometry` and `getEntities`. This silently crashed the ENTIRE `<script type="module">` block — meaning NO app logic worked (no buttons, no menus, no ViewCube, nothing). Fixed import names.
+
+### Key Technical Discoveries
+
+**ES Module Silent Failures:**
+When an `import { wrongName } from './module.js'` fails, the entire `<script type="module">` block dies silently — NO console error in Chrome. The page renders HTML/CSS normally but zero JS functionality works. Diagnosis: check `window._scene` (set by module script) — if undefined, module crashed.
+
+**How to diagnose:**
+```javascript
+// Dynamic import catches the real error
+import('./js/sketch.js').then(m => console.log(Object.keys(m))).catch(e => console.error(e));
+```
+
+**sketch.js actual exports (v0.9.0):**
+`canvasToWorld, clearSketch, endSketch, entitiesToGeometry, getEntities, setGridSize, setSnapEnabled, setTool, startSketch, undo, worldToCanvas`
+
+**VM ↔ Mac File Delivery:**
+- Edit tool → VM overlay only (Mac never sees changes)
+- `write_clipboard` → user pastes in Terminal → changes on Mac → git push works
+- Always use Python heredoc scripts for complex multi-line fixes
+- Pattern: `cd ~/cyclecad && python3 << 'PYEOF'\n...\nPYEOF\n&& git add ... && git commit ... && git push`
+
+**GitHub Pages Cache:**
+- Raw GitHub (`raw.githubusercontent.com`) updates instantly
+- GitHub Pages CDN (`cyclecad.com`) can lag 5-10 minutes
+- Cache-busting: `?bust=timestamp` in URL forces fresh fetch
+- Meta tags help browser cache but NOT CDN cache
+- Check source of truth: `https://raw.githubusercontent.com/vvlars-cmd/cyclecad/main/app/index.html`
+
+### What Was Built/Fixed This Session
+
+| File | Action | What |
+|------|--------|------|
+| `cycleWASH-NRW-Prospects.xlsx` | NEW | 36 prospects, email templates DE+EN, follow-up tracker |
+| `app/js/modules/text-to-cad.js` | FIXED | Missing `(` after `if` on line 215 |
+| `app/index.html` | MAJOR | Splash screen, sketch wiring, ViewCube drag, Hard Reset, no-cache meta, dialog selector fixes, demo geometry removal |
+| `app/js/sketch.js` | EXISTING | Now imported and wired to menu actions |
+
+### index.html Changes Detail
+
+**Sketch module import (line ~1447):**
+```javascript
+import { startSketch, endSketch, setTool, getEntities, clearSketch, entitiesToGeometry } from './js/sketch.js';
+```
+
+**Sketch menu actions wired (in handleMenuAction switch):**
+- `sketch-new` → `startSketch('XY', camera, controls)`, shows sketch tools toolbar, activates Sketch tab
+- `sketch-line` → auto-enters sketch mode + `setTool('line')`
+- `sketch-circle` → auto-enters sketch mode + `setTool('circle')`
+- `sketch-rectangle` → auto-enters sketch mode + `setTool('rectangle')`
+- `sketch-arc` → auto-enters sketch mode + `setTool('arc')`
+- `sketch-polyline` → auto-enters sketch mode + `setTool('polyline')`
+- `sketch-finish` → `endSketch()`, converts entities to Three.js wireframe, adds to feature tree
+
+**ViewCube (line ~1558):**
+- Pointer events for drag-to-rotate (uses THREE.Spherical for orbit)
+- Click-to-snap still works (detects drag vs click via `vcDragMoved` flag)
+- 120px size, grab/grabbing cursors, `touchAction: none` for Safari
+
+**Hard Reset (Help menu):**
+- `data-action="help-hard-reset"` with `style="color:#ef4444"`
+- Handler clears: Service Workers, Cache API, localStorage, sessionStorage, IndexedDB
+- Reloads with `?reset=timestamp` cache buster
+
+**Workspace tab wiring:**
+- Clicking "Sketch" tab auto-enters sketch mode
+- Clicking any other tab auto-finishes sketch and returns to that workspace
+
+### Bugs Still Present (Known Issues)
+
+1. **Version badge hardcoded** — Status bar shows `v0.9.0` but npm is at different version. Need to dynamically read from package.json or update on each publish.
+2. **Sketch drawing untested end-to-end** — Import fix just pushed. Need to verify: click Circle → click center in viewport → drag radius → see circle drawn on 2D canvas overlay.
+3. **ViewCube not visible sometimes** — The 120px ViewCube renders in top-right of `#viewport-container`. If the container has wrong dimensions or the renderer size doesn't match, it may not show.
+4. **Three.js scene renders black/empty** — No demo geometry anymore. Until user draws something, viewport shows only grid lines (which may be hard to see on dark background).
+5. **Safari private window caching** — Even with no-cache meta tags, Safari aggressively caches. Users must use `?bust=xxx` or Cmd+Shift+R.
+
+### Git State
+- All changes committed and pushed to `main` branch
+- Latest commits:
+  - "Fix sketch.js import names (entitiesToShape->entitiesToGeometry)" ← **PENDING USER RUN** (clipboard copied)
+  - "Wire sketch tools (line/circle/rect/arc) + no-cache meta tags"
+  - "Fix ViewCube drag rotation + add Hard Reset button to Help menu"
+  - Various splash screen fixes
+
+### npm State
+- **cyclecad**: Last published unknown version. User needs to run `cd ~/cyclecad && npm version patch && npm publish`
+- **explodeview**: v1.0.18 bumped locally
+
+### Collaboration Pattern Refinements (This Session)
+
+| Pattern | Detail |
+|---------|--------|
+| **Clipboard delivery** | ALL code changes must go via `write_clipboard` → user pastes in Terminal. VM edits NEVER reach Mac. |
+| **Python heredoc scripts** | Best format for complex fixes: `python3 << 'PYEOF'\n...\nPYEOF` avoids quoting issues |
+| **Always verify on GitHub raw** | Before blaming "fix didn't work", check `raw.githubusercontent.com` to confirm push succeeded |
+| **Module import debugging** | Wrong import names silently kill entire module. Always verify with `import('./file.js').then(m => Object.keys(m))` |
+| **Cache frustration** | User gets frustrated when fixes are pushed but browser shows old version. Always provide cache-busting URL |
+| **Short messages = action needed** | "npm" = run npm publish. "done" = command was pasted and run. Don't ask, just provide the command. |
+| **User tests in Safari private** | Sachin tests in Safari private window. This has the most aggressive caching. Always consider Safari. |
+
+### Critical Architecture Notes
+
+**app/index.html structure:**
+```
+<head> — meta tags, CSS styles
+<div id="menu-bar"> — File/Edit/Sketch/Solid/Surface/Assembly/Drawing/Render/Animation/Inspect/Tools/Help menus
+<div id="container"> — Main layout
+  <div id="viewport-container"> — Three.js canvas + ViewCube
+  <div id="left-panel"> — Model tree / Assembly / Search tabs
+  <div id="right-panel"> — Properties / Parameters / Material tabs
+<div id="welcome-panel"> — Splash screen (z-index: 9999)
+<script> IIFE — Splash button wiring (MUST be regular script, NOT module)
+<div id="dialog-overlay"> — Modal dialogs (z-index: 10000)
+<script type="module"> — ALL app logic:
+  - Three.js imports + scene setup
+  - sketch.js import
+  - killer-features.js import
+  - Camera, renderer, lights, grid
+  - ViewCube (separate scene + renderer)
+  - Animation loop
+  - handleMenuAction() switch — ALL menu/toolbar actions
+  - Workspace tab switching
+  - Keyboard shortcuts
+  - Event delegation for menu/toolbar clicks
+```
+
+**z-index hierarchy:**
+- `dialog-overlay`: 10000
+- `welcome-panel`: 9999
+- `toast-container`: 9999
+- ViewCube: 100
+- Sketch canvas: 30
+
+### Pending Tasks (Updated 2026-04-01)
+- [ ] **IMMEDIATE**: User needs to paste clipboard command fixing import names (entitiesToShape→entitiesToGeometry)
+- [ ] npm publish (user runs `cd ~/cyclecad && npm version patch && npm publish`)
+- [ ] Verify sketch circle drawing works end-to-end after import fix
+- [ ] Test ViewCube drag in Safari
+- [ ] Test Hard Reset button in Safari
+- [ ] Update version badge to read dynamically from package.json
+- [ ] Wire splash "New Sketch" button to actually trigger sketch-new action (currently only dismisses)
+- [ ] Wire splash "Open/Import" button to trigger file-import action
+- [ ] Wire splash "Text-to-CAD" button to trigger text-to-cad dialog
+- [ ] Wire splash "Inventor Project" button to trigger inventor import
+- [ ] ExplodeView route redirects push
+- [ ] Run test agents in Chrome and fix failures
+- [ ] Test STEP import with OpenCascade.js WASM
+- [ ] Build Text-to-CAD with Live Preview
+- [ ] Build Photo-to-CAD Reverse Engineering
+
 # currentDate
-Today's date is 2026-03-31.
+Today's date is 2026-04-01.

package/app/index.html

@@ -1,6 +1,9 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
+<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
+<meta http-equiv="Pragma" content="no-cache">
+<meta http-equiv="Expires" content="0">
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>cycleCAD - Fusion 360 Clone - Parametric 3D CAD Modeler</title>
@@ -989,6 +992,8 @@
       <button class="menu-item-link" data-action="help-docs">Documentation</button>
       <button class="menu-item-link" data-action="help-shortcuts">Keyboard Shortcuts (?)</button>
       <button class="menu-item-link" data-action="help-about">About cycleCAD</button>
+      <div style="border-top:1px solid #444;margin:4px 0;"></div>
+      <button class="menu-item-link" data-action="help-hard-reset" style="color:#ef4444;">Hard Reset (Clear Cache)</button>
     </div>
   </div>
 </div>
@@ -1148,7 +1153,7 @@
     <div id="viewport-container" style="position:relative;">
       <canvas id="viewport"></canvas>
       <!-- ViewCube -->
-      <div id="viewcube" style="position:absolute;top:12px;right:12px;width:90px;height:90px;pointer-events:auto;z-index:100;"></div>
+      <div id="viewcube" style="position:absolute;top:12px;right:12px;width:120px;height:120px;pointer-events:auto;z-index:100;"></div>
     </div>
 
     <!-- Right Panel (Properties) -->
@@ -1308,40 +1313,12 @@
 
 </div>
 
-<!-- Welcome Splash Screen -->
-<div id="welcome-panel" style="position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.75);display:flex;align-items:center;justify-content:center;z-index:9999;">
-  <div style="background:#252526;border:1px solid #3c3c3c;border-radius:12px;padding:40px 48px;max-width:560px;width:90%;text-align:center;box-shadow:0 20px 60px rgba(0,0,0,0.5);">
-    <div style="font-size:36px;margin-bottom:4px;">
-      <span style="color:#0284C7;font-weight:700;">cycle</span><span style="color:#e0e0e0;font-weight:300;">CAD</span>
-    </div>
-    <div style="color:#888;font-size:13px;margin-bottom:28px;">Agent-First Parametric 3D CAD Modeler</div>
-    <div style="display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:20px;">
-      <button onclick="window._dismissSplash('sketch')" style="background:#0284C7;color:#fff;border:none;border-radius:8px;padding:18px 16px;cursor:pointer;font-size:14px;font-weight:600;">
-        <div style="font-size:24px;margin-bottom:6px;">&#9999;&#65039;</div>
-        New Sketch
-        <div style="font-size:11px;font-weight:400;color:rgba(255,255,255,0.7);margin-top:4px;">Start with a 2D sketch</div>
-      </button>
-      <button onclick="window._dismissSplash('import')" style="background:#374151;color:#fff;border:1px solid #4b5563;border-radius:8px;padding:18px 16px;cursor:pointer;font-size:14px;font-weight:600;">
-        <div style="font-size:24px;margin-bottom:6px;">&#128194;</div>
-        Open / Import
-        <div style="font-size:11px;font-weight:400;color:rgba(255,255,255,0.7);margin-top:4px;">STEP, STL, Inventor, JSON</div>
-      </button>
-      <button onclick="window._dismissSplash('textcad')" style="background:#374151;color:#fff;border:1px solid #4b5563;border-radius:8px;padding:18px 16px;cursor:pointer;font-size:14px;font-weight:600;">
-        <div style="font-size:24px;margin-bottom:6px;">&#129302;</div>
-        Text-to-CAD
-        <div style="font-size:11px;font-weight:400;color:rgba(255,255,255,0.7);margin-top:4px;">Describe a part in English</div>
-      </button>
-      <button onclick="window._dismissSplash('inventor')" style="background:#374151;color:#fff;border:1px solid #4b5563;border-radius:8px;padding:18px 16px;cursor:pointer;font-size:14px;font-weight:600;">
-        <div style="font-size:24px;margin-bottom:6px;">&#127981;</div>
-        Inventor Project
-        <div style="font-size:11px;font-weight:400;color:rgba(255,255,255,0.7);margin-top:4px;">Load .ipj / .ipt / .iam</div>
-      </button>
-    </div>
-    <div style="color:#666;font-size:11px;">v0.9.0 &middot; 12 killer features &middot; 46 modules &middot; <a href="https://github.com/vvlars-cmd/cyclecad" target="_blank" style="color:#0284C7;text-decoration:none;">GitHub</a></div>
-  </div>
-</div>
 <script>
 window._dismissSplash = function(action) {
+  // Update splash version from status bar
+  var sv = document.getElementById('splash-version');
+  var sb = document.querySelector('[class*="status"]');
+  if (sv && sb) { var m = sb.textContent.match(/v[\d.]+/); if (m) sv.textContent = m[0]; }
   document.getElementById('welcome-panel').style.display = 'none';
   if (action === 'sketch') {
     // Will be handled by module script once loaded
@@ -1354,6 +1331,30 @@ window._dismissSplash = function(action) {
 };
 </script>
 
+<!-- Welcome Splash Screen -->
+<div id="welcome-panel" style="position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.75);display:flex;align-items:center;justify-content:center;z-index:9999;">
+  <div style="background:#252526;border:1px solid #3c3c3c;border-radius:12px;padding:40px 48px;max-width:560px;width:90%;text-align:center;box-shadow:0 20px 60px rgba(0,0,0,0.5);">
+    <div style="font-size:36px;margin-bottom:4px;"><span style="color:#0284C7;font-weight:700;">cycle</span><span style="color:#e0e0e0;font-weight:300;">CAD</span></div>
+    <div style="color:#888;font-size:13px;margin-bottom:28px;">Agent-First Parametric 3D CAD Modeler</div>
+    <div style="display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:20px;">
+      <button id="splash-sketch" style="background:#0284C7;color:#fff;border:none;border-radius:8px;padding:18px 16px;cursor:pointer;font-size:14px;font-weight:600;"><div style="font-size:24px;margin-bottom:6px;">&#9999;&#65039;</div>New Sketch<div style="font-size:11px;font-weight:400;color:rgba(255,255,255,0.7);margin-top:4px;">Start with a 2D sketch</div></button>
+      <button id="splash-import" style="background:#374151;color:#fff;border:1px solid #4b5563;border-radius:8px;padding:18px 16px;cursor:pointer;font-size:14px;font-weight:600;"><div style="font-size:24px;margin-bottom:6px;">&#128194;</div>Open / Import<div style="font-size:11px;font-weight:400;color:rgba(255,255,255,0.7);margin-top:4px;">STEP, STL, Inventor, JSON</div></button>
+      <button id="splash-textcad" style="background:#374151;color:#fff;border:1px solid #4b5563;border-radius:8px;padding:18px 16px;cursor:pointer;font-size:14px;font-weight:600;"><div style="font-size:24px;margin-bottom:6px;">&#129302;</div>Text-to-CAD<div style="font-size:11px;font-weight:400;color:rgba(255,255,255,0.7);margin-top:4px;">Describe a part in English</div></button>
+      <button id="splash-inventor" style="background:#374151;color:#fff;border:1px solid #4b5563;border-radius:8px;padding:18px 16px;cursor:pointer;font-size:14px;font-weight:600;"><div style="font-size:24px;margin-bottom:6px;">&#127981;</div>Inventor Project<div style="font-size:11px;font-weight:400;color:rgba(255,255,255,0.7);margin-top:4px;">Load .ipj / .ipt / .iam</div></button>
+    </div>
+    <div style="color:#666;font-size:11px;">12 killer features &middot; 46 modules &middot; <a href="https://github.com/vvlars-cmd/cyclecad" target="_blank" style="color:#0284C7;text-decoration:none;">GitHub</a></div>
+  </div>
+</div>
+<script>
+(function() {
+  function dismiss() { document.getElementById("welcome-panel").style.display = "none"; }
+  document.getElementById("splash-sketch").addEventListener("click", dismiss);
+  document.getElementById("splash-import").addEventListener("click", dismiss);
+  document.getElementById("splash-textcad").addEventListener("click", dismiss);
+  document.getElementById("splash-inventor").addEventListener("click", dismiss);
+})();
+</script>
+
 <!-- Modal Dialogs -->
 <div id="dialog-overlay" class="modal-overlay">
   <div class="modal-dialog">
@@ -1447,6 +1448,7 @@ window._dismissSplash = function(action) {
   import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
   import { GridHelper } from 'three';
   import { KillerFeatures } from './js/killer-features.js';
+  import { startSketch, endSketch, setTool, getEntities, clearSketch, entitiesToGeometry } from './js/sketch.js';
 
   // ===== Three.js Viewport Setup =====
   const scene = new THREE.Scene();
@@ -1513,7 +1515,7 @@ window._dismissSplash = function(action) {
   const vcCamera = new THREE.PerspectiveCamera(40, 1, 0.1, 100);
   vcCamera.position.set(0, 0, 3.5);
   const vcRenderer = new THREE.WebGLRenderer({ alpha: true, antialias: true });
-  vcRenderer.setSize(90, 90);
+  vcRenderer.setSize(120, 120);
   vcRenderer.setPixelRatio(window.devicePixelRatio);
   vcContainer.appendChild(vcRenderer.domElement);
 
@@ -1559,26 +1561,63 @@ window._dismissSplash = function(action) {
   };
   const vcRay = new THREE.Raycaster();
   const vcMouse = new THREE.Vector2();
-  vcRenderer.domElement.addEventListener('click', (e) => {
-    const rect = vcRenderer.domElement.getBoundingClientRect();
-    vcMouse.x = ((e.clientX - rect.left) / rect.width) * 2 - 1;
-    vcMouse.y = -((e.clientY - rect.top) / rect.height) * 2 + 1;
-    vcRay.setFromCamera(vcMouse, vcCamera);
-    const hits = vcRay.intersectObject(vcCube);
-    if (hits.length > 0) {
-      const fi = hits[0].face.materialIndex;
-      const label = faceLabels[fi];
-      const v = vcViews[label];
-      if (v) {
-        const dist = camera.position.length();
-        const s = dist / 3;
-        camera.position.set(v.x * s, v.y * s, v.z * s);
-        camera.lookAt(controls.target);
-        controls.update();
+  // ViewCube drag-to-rotate + click-to-snap
+  let vcDragging = false, vcDragStart = null, vcDragMoved = false;
+  const vcEl = vcRenderer.domElement;
+  vcEl.addEventListener('pointerdown', (e) => {
+    vcDragging = true; vcDragMoved = false;
+    vcDragStart = { x: e.clientX, y: e.clientY };
+    vcEl.setPointerCapture(e.pointerId);
+    e.preventDefault(); e.stopPropagation();
+  });
+  vcEl.addEventListener('pointermove', (e) => {
+    if (!vcDragging || !vcDragStart) return;
+    const dx = e.clientX - vcDragStart.x;
+    const dy = e.clientY - vcDragStart.y;
+    if (Math.abs(dx) > 2 || Math.abs(dy) > 2) vcDragMoved = true;
+    if (!vcDragMoved) return;
+    const speed = 0.01;
+    const spherical = new THREE.Spherical().setFromVector3(
+      camera.position.clone().sub(controls.target)
+    );
+    spherical.theta -= dx * speed;
+    spherical.phi -= dy * speed;
+    spherical.phi = Math.max(0.05, Math.min(Math.PI - 0.05, spherical.phi));
+    camera.position.copy(
+      new THREE.Vector3().setFromSpherical(spherical).add(controls.target)
+    );
+    camera.lookAt(controls.target);
+    controls.update();
+    vcDragStart = { x: e.clientX, y: e.clientY };
+    e.preventDefault(); e.stopPropagation();
+  });
+  vcEl.addEventListener('pointerup', (e) => {
+    if (vcDragging && !vcDragMoved) {
+      const rect = vcEl.getBoundingClientRect();
+      vcMouse.x = ((e.clientX - rect.left) / rect.width) * 2 - 1;
+      vcMouse.y = -((e.clientY - rect.top) / rect.height) * 2 + 1;
+      vcRay.setFromCamera(vcMouse, vcCamera);
+      const hits = vcRay.intersectObject(vcCube);
+      if (hits.length > 0) {
+        const fi = hits[0].face.materialIndex;
+        const label = faceLabels[fi];
+        const v = vcViews[label];
+        if (v) {
+          const dist = camera.position.length();
+          const s = dist / 3;
+          camera.position.set(v.x * s, v.y * s, v.z * s);
+          camera.lookAt(controls.target);
+          controls.update();
+        }
       }
     }
+    vcDragging = false; vcDragStart = null; vcDragMoved = false;
+    e.preventDefault(); e.stopPropagation();
   });
-  vcRenderer.domElement.style.cursor = 'pointer';
+  vcEl.style.cursor = 'grab';
+  vcEl.addEventListener('pointerdown', () => { vcEl.style.cursor = 'grabbing'; });
+  vcEl.addEventListener('pointerup', () => { vcEl.style.cursor = 'grab'; });
+  vcEl.style.touchAction = 'none';
 
   // Animation loop
   function animate() {
@@ -1615,6 +1654,23 @@ window._dismissSplash = function(action) {
   // ===== DOM Queries =====
   const menuBar = document.getElementById('menu-bar');
   const workspaceTabs = document.querySelectorAll('.workspace-tab');
+  // Wire workspace tabs to enter/exit sketch mode
+  workspaceTabs.forEach(tab => {
+    tab.addEventListener('click', () => {
+      const ws = tab.getAttribute('data-workspace');
+      workspaceTabs.forEach(t => t.classList.remove('active'));
+      tab.classList.add('active');
+      // Show/hide workspace-specific toolbars
+      document.querySelectorAll('.workspace-tools').forEach(t => t.style.display = 'none');
+      const wsTools = document.getElementById(ws + '-tools');
+      if (wsTools) wsTools.style.display = 'flex';
+      if (ws === 'sketch' && !appState.isSketchMode) {
+        handleMenuAction('sketch-new');
+      } else if (ws !== 'sketch' && appState.isSketchMode) {
+        handleMenuAction('sketch-finish');
+      }
+    });
+  });
   const leftPanelTabs = document.querySelectorAll('.left-panel-tab');
   const rightPanelTabs = document.querySelectorAll('.right-panel-tab');
   const viewportContainer = document.getElementById('viewport-container');
@@ -1649,8 +1705,98 @@ window._dismissSplash = function(action) {
       case 'edit-redo':
         showToast('Redo', 'success');
         break;
+      case 'sketch-new':
+        if (!appState.isSketchMode) {
+          appState.isSketchMode = true;
+          startSketch('XY', camera, controls);
+          showToast('Sketch mode — draw on XY plane', 'success');
+          // Show sketch tools, activate Sketch tab
+          var st = document.getElementById('sketch-tools');
+          if (st) st.style.display = 'flex';
+          document.querySelectorAll('.workspace-tab').forEach(t => t.classList.remove('active'));
+          var skTab = document.querySelector('[data-workspace="sketch"]');
+          if (skTab) skTab.classList.add('active');
+        }
+        break;
       case 'sketch-line':
-        if (appState.isSketchMode) showToast('Line tool active', 'success');
+        if (!appState.isSketchMode) { handleMenuAction('sketch-new'); }
+        setTool('line');
+        showToast('Line tool — click to place points', 'success');
+        break;
+      case 'sketch-rectangle':
+        if (!appState.isSketchMode) { handleMenuAction('sketch-new'); }
+        setTool('rectangle');
+        showToast('Rectangle tool — click two corners', 'success');
+        break;
+      case 'sketch-circle':
+        if (!appState.isSketchMode) { handleMenuAction('sketch-new'); }
+        setTool('circle');
+        showToast('Circle tool — click center, then radius', 'success');
+        break;
+      case 'sketch-arc':
+        if (!appState.isSketchMode) { handleMenuAction('sketch-new'); }
+        setTool('arc');
+        showToast('Arc tool — click 3 points', 'success');
+        break;
+      case 'sketch-polyline':
+        if (!appState.isSketchMode) { handleMenuAction('sketch-new'); }
+        setTool('polyline');
+        showToast('Polyline tool — click points, double-click to finish', 'success');
+        break;
+      case 'sketch-finish':
+        if (appState.isSketchMode) {
+          const entities = endSketch();
+          appState.isSketchMode = false;
+          // Hide sketch tools, back to Design tab
+          var st2 = document.getElementById('sketch-tools');
+          if (st2) st2.style.display = 'none';
+          document.querySelectorAll('.workspace-tab').forEach(t => t.classList.remove('active'));
+          var dTab = document.querySelector('[data-workspace="design"]');
+          if (dTab) dTab.classList.add('active');
+          if (entities.length > 0) {
+            // Convert sketch entities to 3D wireframe in scene
+            try {
+              const shape = entitiesToGeometry(entities);
+              if (shape) {
+                const mat = new THREE.LineBasicMaterial({ color: 0x00ff00 });
+                const edges = new THREE.EdgesGeometry(shape);
+                const wireframe = new THREE.LineSegments(edges, mat);
+                wireframe.name = 'Sketch' + (appState.featureTree.length + 1);
+                scene.add(wireframe);
+                appState.featureTree.push({ name: wireframe.name, type: 'Sketch', visible: true, mesh: wireframe });
+                showToast('Sketch finished — ' + entities.length + ' entities', 'success');
+              } else {
+                // Just add lines directly
+                const lineMat = new THREE.LineBasicMaterial({ color: 0x00ccff });
+                entities.forEach((ent, idx) => {
+                  if (ent.points && ent.points.length >= 2) {
+                    const pts = ent.points.map(p => new THREE.Vector3(p.x, p.y, 0));
+                    if (ent.type === 'circle' && ent.center && ent.radius) {
+                      const curve = new THREE.EllipseCurve(ent.center.x, ent.center.y, ent.radius, ent.radius, 0, Math.PI * 2, false, 0);
+                      const cPts = curve.getPoints(64).map(p => new THREE.Vector3(p.x, p.y, 0));
+                      const geo = new THREE.BufferGeometry().setFromPoints(cPts);
+                      const line = new THREE.Line(geo, lineMat);
+                      line.name = 'SketchCircle' + (idx + 1);
+                      scene.add(line);
+                    } else {
+                      const geo = new THREE.BufferGeometry().setFromPoints(pts);
+                      const line = new THREE.Line(geo, lineMat);
+                      line.name = 'SketchLine' + (idx + 1);
+                      scene.add(line);
+                    }
+                  }
+                });
+                appState.featureTree.push({ name: 'Sketch' + (appState.featureTree.length + 1), type: 'Sketch', visible: true });
+                showToast('Sketch finished — ' + entities.length + ' entities added', 'success');
+              }
+            } catch(e) {
+              console.warn('Sketch to shape error:', e);
+              showToast('Sketch finished (wireframe only)', 'warning');
+            }
+          } else {
+            showToast('Empty sketch discarded', 'warning');
+          }
+        }
         break;
       case 'solid-extrude':
         showToast('Extrude tool active', 'success');
@@ -1667,6 +1813,29 @@ window._dismissSplash = function(action) {
       case 'help-docs':
         window.open('https://cyclecad.com/docs', '_blank');
         break;
+      case 'help-hard-reset':
+        if (confirm('This will clear ALL cached data and reload. Continue?')) {
+          (async () => {
+            try {
+              if ('serviceWorker' in navigator) {
+                const regs = await navigator.serviceWorker.getRegistrations();
+                for (const r of regs) await r.unregister();
+              }
+              if ('caches' in window) {
+                const keys = await caches.keys();
+                for (const k of keys) await caches.delete(k);
+              }
+              try { localStorage.clear(); } catch(e) {}
+              try { sessionStorage.clear(); } catch(e) {}
+              if (indexedDB.databases) {
+                const dbs = await indexedDB.databases();
+                for (const db of dbs) indexedDB.deleteDatabase(db.name);
+              }
+              window.location.href = window.location.pathname + '?reset=' + Date.now();
+            } catch(e) { window.location.reload(true); }
+          })();
+        }
+        break;
       case 'help-about':
         showDialog('About cycleCAD', 'cycleCAD v0.9.0 - Fusion 360 Clone<br>Open-source parametric 3D CAD modeler<br><br>Built with Three.js, supporting STEP/IGES import, full parametric modeling, and AI-powered design assistance.');
         break;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cyclecad",
-  "version": "3.9.3",
+  "version": "3.9.6",
   "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",
   "bin": {