scrapes from all open tabs.

This commit is contained in:
2026-05-31 20:20:55 -07:00
parent 4a39065d90
commit 65fa2bddad
5 changed files with 141 additions and 82 deletions
+21 -1
View File
@@ -18,6 +18,26 @@
"editor.formatOnSave": true,
"editor.defaultFormatter": "esbenp.prettier-vscode",
"eslint.validate": ["javascript", "typescript"],
"typescript.tsdk": "node_modules/typescript/lib"
"typescript.tsdk": "node_modules/typescript/lib",
"claudeCode.environmentVariables": [
{
"name":"ANTHROPIC_BASE_URL",
"value":"http://192.168.1.109:11434"
},
{
"name":"ANTHROPIC_AUTH_TOKEN",
"value":"ollama"
},
{
"name":"ANTHROPIC_API_KEY",
"value": ""
},
{
"name":"ANTHROPIC_MODEL",
"value": "qwen3.6"
}
]
}
}
+1 -1
View File
@@ -9,7 +9,7 @@
<body>
<div id="app">
<h1>Goon Plugin</h1>
<button id="find-btn">Find Videos</button>
<button id="find-btn">Find Videos (4 tabs)</button>
<div id="video-list" class="video-list" style="display:none;"></div>
<div id="status" class="status" style="min-height:16px;"></div>
<div id="btn-row" class="btn-row" style="display:none;">
+91 -80
View File
@@ -4,6 +4,7 @@
*/
const STORAGE_KEY = 'goon_videos';
const TAGGED_KEY = 'goon_tagged';
const findBtn = document.getElementById('find-btn');
const clearBtn = document.getElementById('clear-btn');
@@ -20,27 +21,30 @@ function setStatus(msg) {
console.log('[goon]', msg);
}
/** Load the current video list from storage. */
/** Load the current video list and tags from storage. */
function loadVideos() {
return chrome.storage.local.get(STORAGE_KEY).then(data => data[STORAGE_KEY] || []);
return chrome.storage.local.get([STORAGE_KEY, TAGGED_KEY]).then(data => ({
urls: data[STORAGE_KEY] || [],
tags: data[TAGGED_KEY] || [],
}));
}
/** Render the video list UI from stored URLs. */
function renderList(urls) {
/** Render the video list UI from stored {url, label} objects. */
function renderList(items) {
listEl.innerHTML = '';
if (!urls || urls.length === 0) {
if (!items || items.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);
for (const item of items) {
const link = document.createElement('a');
link.className = 'video-item';
link.href = item.url;
link.textContent = item.label ? `${item.label}: ${item.url}` : item.url;
link.target = '_blank';
listEl.appendChild(link);
}
// Copy all URLs button
@@ -48,6 +52,7 @@ function renderList(urls) {
copyBtn.className = 'copy-btn';
copyBtn.textContent = 'Copy All URLs';
copyBtn.addEventListener('click', () => {
const urls = items.map(v => v.url);
navigator.clipboard.writeText(urls.join('\n')).then(() => {
copyBtn.textContent = 'Copied!';
setTimeout(() => { copyBtn.textContent = 'Copy All URLs'; }, 1500);
@@ -59,9 +64,10 @@ function renderList(urls) {
/** Show the main button row. */
function showActions() {
btnRow.style.display = 'flex';
loadVideos().then(urls => {
loadVideos().then(({ urls, tags }) => {
if (urls.length > 0) {
renderList(urls);
const items = urls.map((url, i) => ({ url, label: tags[i] }));
renderList(items);
setStatus(`Using ${urls.length} video(s) from last search.`);
} else {
setStatus('');
@@ -69,82 +75,85 @@ function showActions() {
});
}
/* === "Find Videos" — scan the current tab === */
/* === "Find Videos" — scan up to 4 tabs === */
findBtn.addEventListener('click', async () => {
setStatus('Scanning current tab…');
setStatus('Scanning tabs…');
const tabs = await chrome.tabs.query({ active: true, currentWindow: true });
const tab = tabs[0];
if (!tab || !tab.url) {
setStatus('Cannot access the current tab.');
// Get all tabs in the current window
const allTabs = await chrome.tabs.query({ currentWindow: true });
// Filter out chrome/system pages
const validTabs = allTabs.filter(t =>
t.url &&
!t.url.startsWith('chrome://') &&
!t.url.startsWith('chrome-extension://') &&
!t.url.startsWith('edge://') &&
!t.url.startsWith('about:') &&
!t.url.startsWith('view-source:')
);
if (validTabs.length === 0) {
setStatus('No browsable tabs found.');
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;
}
// Limit to 4 tabs
const tabsToScan = validTabs.slice(0, 4);
setStatus(`Scanning ${tabsToScan.length} tab(s)…`);
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;
// Execute scraping on all tabs in parallel
const scrapeFn = () => {
const videos = Array.from(document.querySelectorAll('video')).map(v => ({
src: v.currentSrc || v.src || null,
poster: v.poster || null,
}));
const videoCount = videos.length;
const sources = Array.from(document.querySelectorAll('video source[src]')).map(s => s.src);
const audios = Array.from(document.querySelectorAll('audio')).length;
return { videos, videoCount, sources, audios };
};
const results = await Promise.all(
tabsToScan.map(t => chrome.scripting.executeScript({
target: { tabId: t.id, allFrames: true },
func: scrapeFn,
}))
);
// 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);
// Dedup across all tabs by (src+poster) key
// Each tab's results array is grouped with its tab title
const tabResults = tabsToScan.map((tab, i) => ({
tabTitle: tab.title || 'Unknown',
frames: results[i]?.filter(Boolean) || [],
}));
// 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);
for (const group of tabResults) {
for (const r of group.frames) {
if (!r.result) continue;
for (const v of r.result.videos) {
totalFound++;
const key = (v.src || '(empty)') + '||' + (v.poster || '(none)');
if (!seen.has(key)) {
seen.set(key, { url: v.src || v.poster || '', tab: group.tabTitle });
}
}
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);
const items = [...seen.values()];
// 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');
console.log('[goon] ===== Found', totalFound, 'video elements across', tabsToScan.length, 'tabs, unique:', items.length);
await chrome.storage.local.set({ [STORAGE_KEY]: deduped });
// Replace the entire list (fresh scan)
await chrome.storage.local.set({
[STORAGE_KEY]: items.map(v => v.url),
[TAGGED_KEY]: items.map(v => v.tab),
});
setStatus(`Found ${videoUrls.length} video(s) in the current tab.`);
renderList(videoUrls);
setStatus(`Found ${items.length} video(s) across ${tabsToScan.length} tab(s).`);
renderList(items.map(v => ({ url: v.url, label: v.tab })));
btnRow.style.display = 'flex';
} catch (e) {
setStatus(`Scan failed: ${e.message}`);
@@ -154,20 +163,21 @@ findBtn.addEventListener('click', async () => {
/* === "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);
const { urls, tags } = await loadVideos();
console.log('[goon] Open Viewer clicked, loaded from storage:', urls, 'tags:', tags);
if (!videos || videos.length === 0) {
if (!urls || urls.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 videoUrls = urls.slice(0, 4);
const videoTags = tags ? tags.slice(0, 4) : [];
console.log('[goon] opening viewer with', videoUrls.length, 'video URLs:', videoUrls);
const id = 'goonViewer_' + Date.now();
await chrome.storage.local.set({ [id]: ids });
await chrome.storage.local.set({ [id]: videoUrls });
// Verify write
const verify = await chrome.storage.local.get([id]);
@@ -175,13 +185,14 @@ openBtn.addEventListener('click', async () => {
await new Promise(r => setTimeout(r, 100));
const viewerUrl = chrome.runtime.getURL('viewer/viewer.html') + '?id=' + id;
const tagsParam = videoTags.length > 0 ? '&tags=' + encodeURIComponent(JSON.stringify(videoTags)) : '';
const viewerUrl = chrome.runtime.getURL('viewer/viewer.html') + '?id=' + id + tagsParam;
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]);
await chrome.storage.local.remove([STORAGE_KEY, TAGGED_KEY]);
listEl.style.display = 'none';
listEl.innerHTML = '';
setStatus('');
+19
View File
@@ -40,6 +40,25 @@ body {
opacity: 0.3;
}
.panel-label {
position: absolute;
bottom: 6px;
left: 8px;
right: 8px;
background: rgba(0, 0, 0, 0.7);
color: #e2e8f0;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
font-size: 11px;
padding: 3px 8px;
border-radius: 4px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
z-index: 10;
pointer-events: none;
text-align: center;
}
.panel.empty::after {
content: 'No video';
color: #64748b;
+9
View File
@@ -5,6 +5,7 @@
const params = new URLSearchParams(location.search);
const id = params.get('id');
const tags = params.get('tags') ? JSON.parse(params.get('tags')) : [];
const panelsEl = document.getElementById('panels');
// Fetch stored video URLs and render panels
@@ -43,6 +44,14 @@ async function init() {
video.playsInline = true;
console.log('[goon-viewer] panel', i + '/4:', videoUrls[i]);
panel.appendChild(video);
// Add tab label if available
if (tags[i]) {
const label = document.createElement('div');
label.className = 'panel-label';
label.textContent = tags[i];
panel.appendChild(label);
}
} else {
panel.classList.add('empty');
}