cyclecad 0.1.9 → 0.2.0

package/app/index.html

@@ -1444,6 +1444,22 @@
         </button>
       </div>
 
+      <!-- Agent API Panel -->
+      <div class="toolbar-group">
+        <button class="toolbar-button" id="btn-agent-panel" title="Agent Command Panel (Test API)">
+          <span class="toolbar-icon">🤖</span>
+          <span class="toolbar-label">Agent</span>
+        </button>
+      </div>
+
+      <!-- Hard Reset -->
+      <div class="toolbar-group">
+        <button class="toolbar-button" id="btn-hard-reset" title="Clear cache and reload" style="color:#f55;">
+          <span class="toolbar-icon">🔄</span>
+          <span class="toolbar-label">Reset</span>
+        </button>
+      </div>
+
       <!-- Edit Operations -->
       <div class="toolbar-group">
         <button class="toolbar-button" id="btn-undo" title="Undo (Ctrl+Z)">
@@ -1589,6 +1605,36 @@
   <!-- Context Menu -->
   <div id="context-menu"></div>
 
+  <!-- Agent Command Panel -->
+  <div id="agent-panel" style="display:none;position:fixed;bottom:40px;right:20px;width:450px;max-height:600px;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:6px;box-shadow:var(--shadow-lg);z-index:1000;flex-direction:column;gap:0;">
+    <div style="padding:12px 16px;border-bottom:1px solid var(--border-color);display:flex;justify-content:space-between;align-items:center;user-select:none;">
+      <strong style="font-size:13px;">Agent Command Panel</strong>
+      <button onclick="document.getElementById('agent-panel').style.display='none'" style="background:transparent;border:none;color:var(--text-secondary);cursor:pointer;font-size:16px;padding:0;width:20px;height:20px;">✕</button>
+    </div>
+
+    <div style="flex:1;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:8px;min-height:0;">
+      <div id="agent-log" style="flex:1;display:flex;flex-direction:column;gap:6px;font-family:monospace;font-size:11px;color:var(--text-secondary);overflow-y:auto;min-height:100px;max-height:400px;">
+        <div style="color:var(--accent-green);">[Ready to accept commands]</div>
+      </div>
+    </div>
+
+    <div style="padding:12px;border-top:1px solid var(--border-color);display:flex;flex-direction:column;gap:8px;">
+      <!-- Command input -->
+      <input type="text" id="agent-command-input" placeholder="{ method: &quot;sketch.start&quot;, params: { plane: &quot;XY&quot; } }" style="width:100%;padding:8px 10px;background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:4px;color:var(--text-primary);font-family:monospace;font-size:11px;box-sizing:border-box;">
+
+      <!-- Quick command buttons -->
+      <div style="display:grid;grid-template-columns:1fr 1fr;gap:6px;font-size:11px;">
+        <button onclick="agentPanel.executeQuickCommand('ping')" style="padding:6px;background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:3px;color:var(--accent-blue);cursor:pointer;">Test (Ping)</button>
+        <button onclick="agentPanel.executeQuickCommand('schema')" style="padding:6px;background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:3px;color:var(--accent-blue);cursor:pointer;">Schema</button>
+        <button onclick="agentPanel.executeQuickCommand('newsketch')" style="padding:6px;background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:3px;color:var(--accent-green);cursor:pointer;">New Sketch</button>
+        <button onclick="agentPanel.executeQuickCommand('features')" style="padding:6px;background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:3px;color:var(--accent-green);cursor:pointer;">List Features</button>
+      </div>
+
+      <!-- Execute button -->
+      <button onclick="agentPanel.executeCommand()" style="width:100%;padding:8px;background:var(--accent-blue);color:#fff;border:none;border-radius:4px;cursor:pointer;font-weight:bold;font-size:12px;">Execute Command</button>
+    </div>
+  </div>
+
   <!-- Module Loader -->
   <script type="module">
     import * as THREE from 'https://cdn.jsdelivr.net/npm/three@0.170.0/build/three.module.js';
@@ -1778,11 +1824,65 @@
         // Initialize Agent API — the primary interface
         const agentImports = await import('./js/agent-api.js');
         const agentSession = initAgentAPI({
-          viewport: { getCamera, getControls, getScene, getRenderer: () => document.querySelector('#viewport-container canvas')?.getContext ? null : null, setView, fitToObject, addToScene, removeFromScene, toggleGrid: vpToggleGrid, toggleWireframe: (e) => {}, toggleAxisLines: () => {} },
-          sketch: { startSketch, endSketch, setTool, getEntities, clearSketch },
-          operations: { extrudeProfile, createPrimitive, rebuildFeature, createMaterial, fillet: () => {}, chamfer: () => {}, booleanUnion: () => {}, booleanCut: () => {}, booleanIntersect: () => {}, createShell: () => {}, createPattern: () => {}, getMaterialPresets: () => ({ steel: {}, aluminum: {}, plastic: {}, brass: {}, titanium: {}, nylon: {} }) },
-          advancedOps: { createSweep, createLoft, createBend, createFlange, createTab, createSlot, unfoldSheetMetal, createSpring, createThread },
-          exportModule: { exportSTL, exportOBJ, exportJSON, exportSTLBinary: exportSTL, exportGLTF: exportOBJ },
+          viewport: {
+            getCamera,
+            getControls,
+            getScene,
+            setView,
+            fitToObject,
+            addToScene,
+            removeFromScene,
+            toggleGrid: vpToggleGrid,
+            toggleWireframe: (e) => console.log('wireframe:', e),
+            toggleAxisLines: () => {},
+            getRenderer: () => null
+          },
+          sketch: {
+            startSketch,
+            endSketch,
+            setTool,
+            getEntities,
+            clearSketch
+          },
+          operations: {
+            extrudeProfile,
+            createPrimitive,
+            rebuildFeature,
+            createMaterial,
+            fillet: (mesh, edges, radius) => console.log('fillet:', mesh, edges, radius),
+            chamfer: (mesh, edges, dist) => console.log('chamfer:', mesh, edges, dist),
+            booleanUnion: (a, b) => { console.log('union:', a, b); return a; },
+            booleanCut: (a, b) => { console.log('cut:', a, b); return a; },
+            booleanIntersect: (a, b) => { console.log('intersect:', a, b); return a; },
+            createShell: (mesh, thickness) => console.log('shell:', mesh, thickness),
+            createPattern: (mesh, type, count, spacing) => { console.log('pattern:', mesh, type, count, spacing); return []; },
+            getMaterialPresets: () => ({
+              steel: { color: 0x7799bb, name: 'Steel' },
+              aluminum: { color: 0xccccdd, name: 'Aluminum' },
+              plastic: { color: 0x2c3e50, name: 'Plastic' },
+              brass: { color: 0xcd7f32, name: 'Brass' },
+              titanium: { color: 0x878786, name: 'Titanium' },
+              nylon: { color: 0xf5f5dc, name: 'Nylon' }
+            })
+          },
+          advancedOps: {
+            createSweep,
+            createLoft,
+            createBend,
+            createFlange,
+            createTab,
+            createSlot,
+            unfoldSheetMetal,
+            createSpring,
+            createThread
+          },
+          exportModule: {
+            exportSTL,
+            exportOBJ,
+            exportJSON,
+            exportSTLBinary: exportSTL,
+            exportGLTF: exportOBJ
+          },
           appState: APP
         });
         console.log(`[Agent API] Ready. Session: ${agentSession.sessionId}`);
@@ -2604,6 +2704,70 @@
 
     window.cycleCAD = { version: '1.0.0', APP, init };
 
+    // ========== Hard Reset (with browser detection) ==========
+    const hardResetBtn = document.getElementById('btn-hard-reset');
+    if (hardResetBtn) {
+      function detectBrowserCC() {
+        const ua = navigator.userAgent;
+        if (/Edg\//i.test(ua)) return 'Edge';
+        if (/Chrome\//i.test(ua) && !/Edg\//i.test(ua)) return 'Chrome';
+        if (/Safari\//i.test(ua) && !/Chrome\//i.test(ua)) return 'Safari';
+        if (/Firefox\//i.test(ua)) return 'Firefox';
+        return 'Unknown';
+      }
+      hardResetBtn.addEventListener('click', async () => {
+        const browser = detectBrowserCC();
+        const msg = `Clear ALL cached data and reload?\n\nDetected browser: ${browser}\n\nThis will clear:\n• Service Workers\n• Cache API storage\n• IndexedDB databases\n• OPFS storage\n• localStorage & sessionStorage`;
+        if (!confirm(msg)) return;
+        const log = [];
+        // 1. Unregister service workers
+        try {
+          if ('serviceWorker' in navigator) {
+            const regs = await navigator.serviceWorker.getRegistrations();
+            for (const r of regs) await r.unregister();
+            log.push('SW: ' + regs.length);
+          }
+        } catch(e) {}
+        // 2. Cache API
+        try {
+          if ('caches' in window) {
+            const names = await caches.keys();
+            for (const n of names) await caches.delete(n);
+            log.push('Caches: ' + names.length);
+          }
+        } catch(e) {}
+        // 3. IndexedDB — clear all
+        try {
+          if (indexedDB.databases) {
+            const allDBs = await indexedDB.databases();
+            for (const db of allDBs) { if (db.name) indexedDB.deleteDatabase(db.name); }
+            log.push('IDB: ' + allDBs.length);
+          }
+        } catch(e) {}
+        // 4. OPFS
+        try {
+          if (navigator.storage && navigator.storage.getDirectory) {
+            const root = await navigator.storage.getDirectory();
+            for await (const [name] of root.entries()) {
+              try { await root.removeEntry(name, { recursive: true }); } catch(e) {}
+            }
+            log.push('OPFS: cleared');
+          }
+        } catch(e) {}
+        // 5. Storage
+        try { localStorage.clear(); } catch(e) {}
+        try { sessionStorage.clear(); } catch(e) {}
+        log.push('Storage: cleared');
+        console.log('[Hard Reset]', browser, log.join(' | '));
+        // 6. Browser-specific reload
+        if (browser === 'Safari') {
+          window.location.href = window.location.pathname + '?cachebust=' + Date.now();
+        } else {
+          setTimeout(() => { window.location.reload(true); }, 300);
+        }
+      });
+    }
+
     // ========== Operation Dialog Management ==========
     let currentDialogId = null;
 
@@ -2889,6 +3053,72 @@
       }
     });
 
+    // ========== Agent Command Panel ==========
+    const agentPanel = {
+      executeCommand() {
+        const input = document.getElementById('agent-command-input');
+        const cmd = input.value.trim();
+        if (!cmd) return;
+
+        this.log(`> ${cmd}`, 'input');
+        try {
+          const parsed = JSON.parse(cmd);
+          if (!window.cycleCAD || !window.cycleCAD.execute) {
+            this.log('❌ Agent API not initialized', 'error');
+            return;
+          }
+          const result = window.cycleCAD.execute(parsed);
+          this.log(`✓ ${JSON.stringify(result, null, 2)}`, 'output');
+          input.value = '';
+        } catch (e) {
+          this.log(`❌ ${e.message}`, 'error');
+        }
+      },
+
+      executeQuickCommand(cmd) {
+        const input = document.getElementById('agent-command-input');
+        const commands = {
+          'ping': { method: 'meta.ping', params: {} },
+          'schema': { method: 'meta.schema', params: {} },
+          'newsketch': { method: 'sketch.start', params: { plane: 'XY' } },
+          'features': { method: 'query.features', params: {} },
+        };
+        const cmdObj = commands[cmd];
+        if (cmdObj) {
+          input.value = JSON.stringify(cmdObj);
+          setTimeout(() => this.executeCommand(), 0);
+        }
+      },
+
+      log(msg, type = 'info') {
+        const logEl = document.getElementById('agent-log');
+        const div = document.createElement('div');
+        if (type === 'input') div.style.color = 'var(--accent-blue)';
+        if (type === 'output') div.style.color = 'var(--accent-green)';
+        if (type === 'error') div.style.color = 'var(--accent-red)';
+        div.textContent = msg;
+        logEl.appendChild(div);
+        logEl.scrollTop = logEl.scrollHeight;
+      },
+    };
+
+    // Wire Agent Panel button
+    const agentPanelBtn = document.getElementById('btn-agent-panel');
+    if (agentPanelBtn) {
+      agentPanelBtn.addEventListener('click', () => {
+        const panel = document.getElementById('agent-panel');
+        panel.style.display = panel.style.display === 'none' ? 'flex' : 'none';
+      });
+    }
+
+    // Wire Enter key in command input
+    document.getElementById('agent-command-input')?.addEventListener('keydown', (e) => {
+      if (e.key === 'Enter') {
+        e.preventDefault();
+        agentPanel.executeCommand();
+      }
+    });
+
   </script>
 
   <!-- Operation Dialogs -->
@@ -3238,5 +3468,6 @@
     </div>
   </div>
 
+  <span id="version-badge" style="position:fixed;bottom:10px;left:50%;transform:translateX(-50%);z-index:70;font-size:0.85rem;color:rgba(255,255,255,0.7);letter-spacing:0.1em;white-space:nowrap;padding:5px 14px;user-select:all;pointer-events:auto;font-family:monospace;font-weight:600;background:rgba(0,0,0,0.5);border:1px solid rgba(255,255,255,0.15);border-radius:6px;text-shadow:0 1px 3px rgba(0,0,0,0.5);" title="cycleCAD version">cycleCAD v0.2.0</span>
 </body>
 </html>