core functionality complete

src/viewer/index.js

@@ -0,0 +1,191 @@
+/**
+ * index.js — Popup logic for the Goon Plugin.
+ * Runs inside the popup; scans the current tab for videos and opens the viewer.
+ */
+
+const STORAGE_KEY = 'goon_videos';
+
+const findBtn = document.getElementById('find-btn');
+const clearBtn = document.getElementById('clear-btn');
+const openBtn = document.getElementById('open-btn');
+const statusEl = document.getElementById('status');
+const listEl = document.getElementById('video-list');
+const btnRow = document.getElementById('btn-row');
+
+listEl.style.wordBreak = 'break-word';
+listEl.style.whiteSpace = 'pre-wrap';
+
+function setStatus(msg) {
+  statusEl.textContent = msg;
+  console.log('[goon]', msg);
+}
+
+/** Load the current video list from storage. */
+function loadVideos() {
+  return chrome.storage.local.get(STORAGE_KEY).then(data => data[STORAGE_KEY] || []);
+}
+
+/** Render the video list UI from stored URLs. */
+function renderList(urls) {
+  listEl.innerHTML = '';
+  if (!urls || urls.length === 0) {
+    listEl.style.display = 'none';
+    return;
+  }
+  listEl.style.display = 'block';
+
+  for (const url of urls) {
+    const item = document.createElement('a');
+    item.className = 'video-item';
+    item.href = url;
+    item.textContent = url;
+    item.target = '_blank';
+    listEl.appendChild(item);
+  }
+
+  // Copy all URLs button
+  const copyBtn = document.createElement('button');
+  copyBtn.className = 'copy-btn';
+  copyBtn.textContent = 'Copy All URLs';
+  copyBtn.addEventListener('click', () => {
+    navigator.clipboard.writeText(urls.join('\n')).then(() => {
+      copyBtn.textContent = 'Copied!';
+      setTimeout(() => { copyBtn.textContent = 'Copy All URLs'; }, 1500);
+    });
+  });
+  listEl.appendChild(copyBtn);
+}
+
+/** Show the main button row. */
+function showActions() {
+  btnRow.style.display = 'flex';
+  loadVideos().then(urls => {
+    if (urls.length > 0) {
+      renderList(urls);
+      setStatus(`Using ${urls.length} video(s) from last search.`);
+    } else {
+      setStatus('');
+    }
+  });
+}
+
+/* === "Find Videos" — scan the current tab === */
+findBtn.addEventListener('click', async () => {
+  setStatus('Scanning current tab…');
+
+  const tabs = await chrome.tabs.query({ active: true, currentWindow: true });
+  const tab = tabs[0];
+  if (!tab || !tab.url) {
+    setStatus('Cannot access the current tab.');
+    return;
+  }
+
+  // Skip chrome-internal pages
+  if (tab.url.startsWith('chrome://') || tab.url.startsWith('chrome-extension://')
+      || tab.url.startsWith('edge://') || tab.url.startsWith('about:')
+      || tab.url.startsWith('view-source:')) {
+    setStatus('This page cannot be scanned.');
+    return;
+  }
+
+  try {
+    // Check the main frame first, then iframes
+    const results = await chrome.scripting.executeScript({
+      target: { tabId: tab.id, allFrames: true },
+      func: () => {
+        // Count both <video> and elements that might be video-like
+        const videos = Array.from(document.querySelectorAll('video')).map(v => ({
+          src: v.currentSrc || v.src || null,
+          poster: v.poster || null,
+        }));
+        const videoCount = videos.length;
+
+        // Also count <source> tags inside video elements (they point to actual media)
+        const sources = Array.from(document.querySelectorAll('video source[src]')).map(s => s.src);
+
+        // Also check <audio> elements (might have videos inside too)
+        const audios = Array.from(document.querySelectorAll('audio')).length;
+
+        return { videos, videoCount, sources, audios };
+      },
+    });
+
+    // With allFrames: true, results contains one entry per frame (main + iframes)
+    // Dedup by (src, poster) pair to avoid counting same video in multiple frames
+    const seen = new Map();
+    let totalFound = 0;
+    let totalSources = 0;
+    let totalAudios = 0;
+    for (const r of results) {
+      if (!r.result) continue;
+      console.log('[goon] frame:', r.frameId, 'videos:', r.result.videoCount, 'sources:', r.result.sources.length, 'audios:', r.result.audios);
+      for (const v of r.result.videos) {
+        totalFound++;
+        const key = (v.src || '(empty)') + '||' + (v.poster || '(none)');
+        if (!seen.has(key)) {
+          seen.set(key, v);
+        }
+        console.log('[goon] video element:', 'src=', v.src, 'poster=', v.poster);
+      }
+      totalAudios += r.result.audios;
+    }
+    const videoUrls = [...seen.values()].map(v => v.src || v.poster || '').filter(Boolean);
+
+    console.log('[goon] ===== Found', totalFound, 'video elements, unique:', videoUrls.length, 'audio tags:', totalAudios);
+    console.log('[goon] URLs:', videoUrls);
+
+    // Append to existing list (dedup to avoid same video from same page)
+    const existing = await chrome.storage.local.get(STORAGE_KEY);
+    const existingUrls = existing[STORAGE_KEY] || [];
+    const merged = [...existingUrls, ...videoUrls];
+    const deduped = [...new Set(merged)];
+    console.log('[goon] merged', existingUrls.length, '+', videoUrls.length, '→', deduped.length, 'unique total');
+
+    await chrome.storage.local.set({ [STORAGE_KEY]: deduped });
+
+    setStatus(`Found ${videoUrls.length} video(s) in the current tab.`);
+    renderList(videoUrls);
+    btnRow.style.display = 'flex';
+  } catch (e) {
+    setStatus(`Scan failed: ${e.message}`);
+    console.warn('[goon] executeScript failed:', e);
+  }
+});
+
+/* === "Open Viewer" — launch the 2x2 grid === */
+openBtn.addEventListener('click', async () => {
+  const videos = await loadVideos();
+  console.log('[goon] Open Viewer clicked, loaded from storage:', videos, 'count:', videos?.length);
+
+  if (!videos || videos.length === 0) {
+    setStatus('No videos found. Click "Find Videos" first.');
+    return;
+  }
+
+  // Take the first 4 (viewer grid is 2x2)
+  const ids = videos.slice(0, 4);
+  console.log('[goon] opening viewer with', ids.length, 'video URLs:', ids);
+
+  const id = 'goonViewer_' + Date.now();
+  await chrome.storage.local.set({ [id]: ids });
+
+  // Verify write
+  const verify = await chrome.storage.local.get([id]);
+  console.log('[goon] viewer storage verified:', verify[id]?.length, 'entries');
+
+  await new Promise(r => setTimeout(r, 100));
+
+  const viewerUrl = chrome.runtime.getURL('viewer/viewer.html') + '?id=' + id;
+  chrome.windows.create({ url: viewerUrl, width: 1400, height: 900 });
+});
+
+/* === "Clear" — reset the stored list === */
+clearBtn.addEventListener('click', async () => {
+  await chrome.storage.local.remove([STORAGE_KEY]);
+  listEl.style.display = 'none';
+  listEl.innerHTML = '';
+  setStatus('');
+});
+
+/* === Init — restore saved list === */
+showActions();