depwire-cli 0.9.5 → 0.9.7

package/dist/viz/public/temporal.html

@@ -113,6 +113,22 @@
     </main>
   </div>
 
+  <script>
+// Catch any global errors and prevent them from breaking the page
+window.addEventListener('error', (event) => {
+  console.error('Global error caught:', event.error);
+  // Prevent default error handling that might crash the page
+  event.preventDefault();
+  return true;
+});
+
+// Catch unhandled promise rejections
+window.addEventListener('unhandledrejection', (event) => {
+  console.error('Unhandled promise rejection:', event.reason);
+  event.preventDefault();
+  return true;
+});
+</script>
   <script src="/temporal.js"></script>
 </body>
 </html>

package/dist/viz/public/temporal.js

@@ -10,7 +10,12 @@ let filePositions = new Map();
 async function init() {
   try {
     const response = await fetch('/api/data');
+    if (!response.ok) throw new Error(`HTTP ${response.status}`);
+    
     temporalData = await response.json();
+    if (!temporalData || !temporalData.snapshots || temporalData.snapshots.length === 0) {
+      throw new Error('No snapshot data received');
+    }
 
     document.getElementById('projectName').textContent = temporalData.projectName;
     document.getElementById('snapshotCount').textContent = temporalData.snapshots.length;
@@ -26,7 +31,14 @@ async function init() {
       renderSnapshot(currentIndex);
     });
   } catch (error) {
-    console.error('Failed to load temporal data:', error);
+    console.error('Failed to initialize temporal graph:', error);
+    document.body.innerHTML = `
+      <div style="display:flex;align-items:center;justify-content:center;height:100vh;background:#0a0f18;color:#fff;flex-direction:column;gap:20px;">
+        <h1 style="color:#ff4a4a;">⚠️ Failed to Load Temporal Graph</h1>
+        <p style="color:#888;">${error.message}</p>
+        <button onclick="location.reload()" style="padding:10px 20px;background:#4a9eff;border:none;color:#fff;border-radius:6px;cursor:pointer;">Reload Page</button>
+      </div>
+    `;
   }
 }
 
@@ -81,8 +93,14 @@ function setupTimeline() {
 
 function setupControls() {
   const playBtn = document.getElementById('playBtn');
+  
+  if (!playBtn) {
+    console.error('Play button not found in DOM');
+    return;
+  }
 
   playBtn.addEventListener('click', () => {
+    console.log('Play button clicked, isPlaying:', isPlaying); // Debug log
     if (isPlaying) {
       pausePlayback();
     } else {
@@ -130,6 +148,18 @@ function highlightSearchResults(query) {
 }
 
 function startPlayback() {
+  if (!temporalData || !temporalData.snapshots || temporalData.snapshots.length === 0) {
+    console.error('Cannot start playback: no temporal data loaded');
+    return;
+  }
+  
+  // If we're at the last snapshot, start from the beginning
+  if (currentIndex >= temporalData.snapshots.length - 1) {
+    currentIndex = 0;
+    goToSnapshot(0);
+  }
+  
+  console.log(`Temporal playback started: ${temporalData.snapshots.length} snapshots at ${playSpeed}x speed`);
   isPlaying = true;
   document.getElementById('playBtn').innerHTML = `
     <svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor">
@@ -246,13 +276,20 @@ function renderArcDiagram(snapshot) {
   const margin = { top: 60, right: 40, bottom: 120, left: 40 };
   const plotWidth = width - margin.left - margin.right;
   const plotHeight = height - margin.top - margin.bottom;
-  const baseline = margin.top + plotHeight;
+  const baseline = margin.top + plotHeight; // Position baseline at consistent percentage
 
   const totalSymbols = d3.sum(snapshot.files, (d) => d.symbols);
   const minBarWidth = 4;
   const gap = 2;
 
-  let x = margin.left;
+  // Calculate total width needed for all bars
+  const totalBarsWidth = snapshot.files.reduce((sum, file) => {
+    const barWidth = Math.max(minBarWidth, (file.symbols / totalSymbols) * plotWidth * 0.8);
+    return sum + barWidth + gap;
+  }, 0) - gap; // Remove last gap
+
+  // Center the bar group horizontally
+  let x = margin.left + (plotWidth - totalBarsWidth) / 2;
   filePositions.clear();
 
   snapshot.files.forEach((file) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "depwire-cli",
-  "version": "0.9.5",
+  "version": "0.9.7",
   "description": "Code cross-reference visualization and AI context engine for TypeScript, JavaScript, Python, Go, Rust, and C. Zero native dependencies — works on Windows, macOS, and Linux.",
   "type": "module",
   "bin": {