efactor(extension): modularize dashboard, background, and docs

Split monolithic dashboard.js (2753 lines) into 18 focused modules under dashboard/{core,data,ui,pages}/ with refresh.js and events.js as orchestrators. Extracted ~900-line inline <style> into dashboard.css and moved dashboard.html to dashboard/dashboard.html. Split background.js (609 lines) into background/{logs,state,proxy, native-messaging,tab-lifecycle,message-router}.js with a thin entry point using importScripts(). Deleted dead files: wrong-domain.js (duplicate of inline script). Updated manifest.json web_accessible_resources for new paths. Updated docs/ARCHITECTURE.md to reflect the new file structure. No functionality changed. No build step introduced.
2026-02-28 23:02:52 -05:00
parent f5c349a4a3
commit 5c4f0b4aba
35 changed files with 4276 additions and 4240 deletions
@@ -0,0 +1,74 @@
+// Depends on: core/utils.js ($, escapeHtml), ui/toast.js (showToast)
+
+function setupLogsEvents() {
+  let logs = [];
+  let autoScroll = true;
+  let logFilter = '';
+
+  chrome.runtime.sendMessage(
+    { target: 'holesail-native', action: 'registerDashboard' },
+    (response) => {
+      if (response && response.logs) { logs = response.logs; updateLogsDisplay(); }
+    }
+  );
+
+  chrome.runtime.onMessage.addListener((message) => {
+    if (message.type === 'holesail-logs' && message.logs) {
+      logs = message.logs;
+      updateLogsDisplay();
+    }
+  });
+
+  function getLogClass(msg) {
+    const m = (msg || '').toLowerCase();
+    if (m.includes('error') || m.includes('fail') || m.includes('err:')) return 'is-error';
+    if (m.includes('warn') || m.includes('warning')) return 'is-warn';
+    return '';
+  }
+
+  function updateLogsDisplay() {
+    const container = $('logsContainer');
+    if (!container) return;
+    const filtered = logFilter
+      ? logs.filter(e => (e.message || '').toLowerCase().includes(logFilter.toLowerCase()))
+      : logs;
+    if (filtered.length === 0) {
+      container.innerHTML = `
+        <div class="empty-state">
+          <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><polyline points="22,12 18,12 15,21 9,3 6,12 2,12"/></svg>
+          <div class="empty-state-title">${logFilter ? 'No matching logs' : 'No logs yet'}</div>
+          <div class="empty-state-desc">${logFilter ? 'Try a different filter' : 'Logs will appear here as the extension runs'}</div>
+        </div>`;
+      return;
+    }
+    container.innerHTML = filtered.map(entry => {
+      const time = new Date(entry.timestamp).toLocaleTimeString();
+      const cls = getLogClass(entry.message);
+      return `<div class="log-entry">
+        <span class="log-time">${time}</span>
+        <span class="log-msg ${cls}">${escapeHtml(entry.message)}</span>
+      </div>`;
+    }).join('');
+    if (autoScroll) container.scrollTop = container.scrollHeight;
+  }
+
+  $('btnClearLogs')?.addEventListener('click', () => { logs = []; updateLogsDisplay(); });
+
+  $('btnAutoScroll')?.addEventListener('click', () => {
+    autoScroll = !autoScroll;
+    const btn = $('btnAutoScroll');
+    if (btn) {
+      const svgPart = btn.querySelector('svg')?.outerHTML || '';
+      btn.innerHTML = svgPart + ' Auto-scroll: ' + (autoScroll ? 'ON' : 'OFF');
+    }
+  });
+
+  $('logsFilter')?.addEventListener('input', (e) => {
+    logFilter = e.target.value;
+    updateLogsDisplay();
+  });
+
+  window.addEventListener('beforeunload', () => {
+    chrome.runtime.sendMessage({ target: 'holesail-native', action: 'unregisterDashboard' }, () => {});
+  });
+}