scrapes from all open tabs.
This commit is contained in:
1 parent
4a39065d90
commit
65fa2bddad
5 files changed
+141
-82
No files matched your search
@@ -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"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
@@ -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
@@ -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('');
|
||||
|
||||
@@ -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;
|
||||
|
||||
@@ -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');
|
||||
}
|
||||
|
||||
Reference in new issue
Block a user