Upload fastsearch-tauri/ui/app.js

fastsearch-tauri/ui/app.js

@@ -1,9 +1,21 @@
+// ── Tauri v2 API wrapper ───────────────────────────────────────────
+const TAURI = typeof window.__TAURI__ !== 'undefined' ? window.__TAURI__ : null;
+
+// v2: __TAURI__.core.invoke | v1 fallback: __TAURI__.invoke
+const invoke = (TAURI && TAURI.core && TAURI.core.invoke)
+  ? TAURI.core.invoke
+  : (TAURI ? TAURI.invoke : null);
+
+// v2: __TAURI__.event.listen | v1 fallback: __TAURI__.event.listen
+const listen = (TAURI && TAURI.event && TAURI.event.listen)
+  ? TAURI.event.listen
+  : (TAURI && TAURI.event ? TAURI.event.listen : null);
+
 // ── DOM Elements ───────────────────────────────────────────────────
 const searchInput = document.getElementById('searchInput');
 const loadingSpinner = document.getElementById('loadingSpinner');
 const resultsContainer = document.getElementById('resultsContainer');
 const resultsList = document.getElementById('resultsList');
-const resultsFooter = document.getElementById('resultsFooter');
 const footerStats = document.getElementById('footerStats');
 const emptyState = document.getElementById('emptyState');
 const noResults = document.getElementById('noResults');
@@ -17,16 +29,10 @@ let totalIndexed = 0;
 // ── Icon helpers ───────────────────────────────────────────────────
 function getFileIcon(name, isDir) {
   if (isDir) return '📁';
-  
   const ext = name.split('.').pop()?.toLowerCase() || '';
-  
   const iconMap = {
-    exe: '⚙️',
-    lnk: '🔗',
-    pdf: '📄',
-    doc: '📝', docx: '📝',
-    xls: '📊', xlsx: '📊',
-    ppt: '📊', pptx: '📊',
+    exe: '⚙️', lnk: '🔗', pdf: '📄',
+    doc: '📝', docx: '📝', xls: '📊', xlsx: '📊', ppt: '📊', pptx: '📊',
     jpg: '🖼️', jpeg: '🖼️', png: '🖼️', gif: '🖼️', bmp: '🖼️', svg: '🖼️', webp: '🖼️',
     mp4: '🎬', mov: '🎬', avi: '🎬', mkv: '🎬',
     mp3: '🎵', wav: '🎵', flac: '🎵', aac: '🎵',
@@ -38,7 +44,6 @@ function getFileIcon(name, isDir) {
     db: '🗄️', sql: '🗄️',
     ini: '⚙️', cfg: '⚙️', conf: '⚙️',
   };
-  
   return iconMap[ext] || '📄';
 }
 
@@ -65,29 +70,32 @@ function highlightMatch(name, query) {
   );
 }
 
+function escapeHtml(text) {
+  const div = document.createElement('div');
+  div.textContent = text;
+  return div.innerHTML;
+}
+
 // ── Render results ────────────────────────────────────────────────
 function renderResults() {
   resultsList.innerHTML = '';
-  
   results.forEach((item, idx) => {
     const el = document.createElement('div');
     el.className = 'result-item' + (idx === selectedIndex ? ' selected' : '');
     el.dataset.index = idx;
     el.addEventListener('click', () => selectAndOpen(idx));
     el.addEventListener('dblclick', () => openItem(idx, true));
-    
+
     const iconClass = getFileClass(item.name, item.is_dir);
     const icon = getFileIcon(item.name, item.is_dir);
-    
     const query = searchInput.value.trim();
     const highlightedName = highlightMatch(item.name, query);
-    
-    // Format path - shorten if too long
+
     let displayPath = item.path;
     if (displayPath.length > 80) {
       displayPath = '...' + displayPath.slice(-77);
     }
-    
+
     el.innerHTML = `
       <div class="result-icon ${iconClass}">${icon}</div>
       <div class="result-info">
@@ -96,25 +104,15 @@ function renderResults() {
       </div>
       <div class="result-meta">${item.is_dir ? 'DIR' : 'FILE'}</div>
     `;
-    
     resultsList.appendChild(el);
   });
 }
 
-function escapeHtml(text) {
-  const div = document.createElement('div');
-  div.textContent = text;
-  return div.innerHTML;
-}
-
-// ── Update selection ────────────────────────────────────────────
 function updateSelection() {
   const items = resultsList.querySelectorAll('.result-item');
   items.forEach((el, idx) => {
     el.classList.toggle('selected', idx === selectedIndex);
   });
-  
-  // Scroll into view
   if (selectedIndex >= 0) {
     const selected = items[selectedIndex];
     if (selected) {
@@ -145,47 +143,32 @@ function selectAndOpen(index) {
 function openItem(index, reveal) {
   if (index < 0 || index >= results.length) return;
   const item = results[index];
-  
-  if (typeof window.__TAURI__ !== 'undefined') {
+  if (invoke) {
     if (reveal || item.is_dir) {
-      window.__TAURI__.invoke('cmd_open_folder', { path: item.path });
+      invoke('cmd_open_folder', { path: item.path });
     } else {
-      window.__TAURI__.invoke('cmd_open_file', { path: item.path });
+      invoke('cmd_open_file', { path: item.path });
     }
   } else {
-    // Fallback for dev
     console.log('Open:', item.path);
   }
-  
-  // Hide window after opening
   setTimeout(() => {
-    if (typeof window.__TAURI__ !== 'undefined') {
-      window.__TAURI__.invoke('cmd_toggle_window');
-    }
+    if (invoke) invoke('cmd_toggle_window');
   }, 100);
 }
 
 // ── Perform search ───────────────────────────────────────────────
 function performSearch(query) {
-  if (!query) {
-    showEmptyState();
-    return;
-  }
-  
+  if (!query) { showEmptyState(); return; }
   loadingSpinner.classList.add('active');
-  
-  if (typeof window.__TAURI__ !== 'undefined') {
-    window.__TAURI__.invoke('cmd_search', {
-      request: {
-        query: query,
-        limit: 50,
-        case_sensitive: false
-      }
+
+  if (invoke) {
+    invoke('cmd_search', {
+      request: { query: query, limit: 50, case_sensitive: false }
     }).then(response => {
       loadingSpinner.classList.remove('active');
       results = response.results || [];
       totalIndexed = response.total_indexed;
-      
       if (results.length > 0) {
         showResults();
         selectedIndex = 0;
@@ -199,7 +182,6 @@ function performSearch(query) {
       console.error('Search error:', err);
     });
   } else {
-    // Dev mode - show empty
     loadingSpinner.classList.remove('active');
     showEmptyState();
   }
@@ -235,67 +217,35 @@ function updateFooter(elapsedMs) {
 // ── Search input handler ─────────────────────────────────────────
 searchInput.addEventListener('input', (e) => {
   const query = e.target.value.trim();
-  
   clearTimeout(searchTimeout);
-  
-  if (!query) {
-    showEmptyState();
-    return;
-  }
-  
-  searchTimeout = setTimeout(() => {
-    performSearch(query);
-  }, 50); // 50ms debounce for instant feel
+  if (!query) { showEmptyState(); return; }
+  searchTimeout = setTimeout(() => performSearch(query), 50);
 });
 
 // ── Keyboard navigation ──────────────────────────────────────────
 document.addEventListener('keydown', (e) => {
-  // ESC - close window
   if (e.key === 'Escape') {
-    if (typeof window.__TAURI__ !== 'undefined') {
-      window.__TAURI__.invoke('cmd_toggle_window');
-    }
+    if (invoke) invoke('cmd_toggle_window');
     return;
   }
-  
-  // Arrow down - next result
-  if (e.key === 'ArrowDown') {
-    e.preventDefault();
-    selectNext();
-    return;
-  }
-  
-  // Arrow up - previous result
-  if (e.key === 'ArrowUp') {
-    e.preventDefault();
-    selectPrev();
-    return;
-  }
-  
-  // Enter - open selected
+  if (e.key === 'ArrowDown') { e.preventDefault(); selectNext(); return; }
+  if (e.key === 'ArrowUp') { e.preventDefault(); selectPrev(); return; }
   if (e.key === 'Enter') {
     e.preventDefault();
-    const reveal = e.ctrlKey || e.metaKey;
-    openItem(selectedIndex, reveal);
+    openItem(selectedIndex, e.ctrlKey || e.metaKey);
     return;
   }
-  
-  // Tab - focus search input (if not focused)
   if (e.key === 'Tab') {
     e.preventDefault();
     searchInput.focus();
     return;
   }
-  
-  // Any printable key - focus search input
   if (e.key.length === 1 && !e.ctrlKey && !e.metaKey && !e.altKey) {
-    if (document.activeElement !== searchInput) {
-      searchInput.focus();
-    }
+    if (document.activeElement !== searchInput) searchInput.focus();
   }
 });
 
-// ── Focus search on show ──────────────────────────────────────────
+// ── Reset & focus ──────────────────────────────────────────────────
 function resetSearch() {
   searchInput.value = '';
   searchInput.focus();
@@ -303,15 +253,9 @@ function resetSearch() {
 }
 
 // ── Listen for toggle event from Rust ────────────────────────────
-if (typeof window.__TAURI__ !== 'undefined') {
-  window.__TAURI__.event.listen('toggle-search', () => {
-    resetSearch();
-  });
-  
-  // Load stats on startup
-  window.__TAURI__.invoke('cmd_get_stats').then(stats => {
-    totalIndexed = stats.total_indexed;
-  });
+if (listen) {
+  listen('toggle-search', () => resetSearch());
+  invoke('cmd_get_stats').then(stats => { totalIndexed = stats.total_indexed; });
 }
 
 // Focus input on load