120 lines
3.5 KiB
JavaScript
120 lines
3.5 KiB
JavaScript
"use strict";
|
|
|
|
const statusEl = document.getElementById("status");
|
|
const listEl = document.getElementById("urlList");
|
|
const openHistoryBtn = document.getElementById("openHistoryBtn");
|
|
|
|
function setStatus(message) {
|
|
statusEl.textContent = message;
|
|
}
|
|
|
|
function entryLabel(entry) {
|
|
return entry && entry.fullUrl ? "full candidate" : "preview fallback";
|
|
}
|
|
|
|
function formatMeta(entry) {
|
|
const key = entry && entry.key ? entry.key : "n/a";
|
|
const bpm = entry && entry.bpm ? entry.bpm : "n/a";
|
|
const tags = entry && Array.isArray(entry.tags) && entry.tags.length ? entry.tags.join(", ") : "n/a";
|
|
return `Key: ${key} | BPM: ${bpm} | Tags: ${tags}`;
|
|
}
|
|
|
|
function buildRow(entry) {
|
|
const li = document.createElement("li");
|
|
li.className = "url-item";
|
|
|
|
if (entry.coverImageUrl) {
|
|
const cover = document.createElement("img");
|
|
cover.className = "cover-image";
|
|
cover.src = entry.coverImageUrl;
|
|
cover.alt = "Cover art";
|
|
cover.loading = "lazy";
|
|
li.appendChild(cover);
|
|
}
|
|
|
|
const p = document.createElement("p");
|
|
p.className = "url-text";
|
|
p.textContent = entry.fileName || entry.sampleId || "(unknown filename)";
|
|
|
|
const status = document.createElement("p");
|
|
status.className = "status";
|
|
status.textContent = `Source: ${entry.source || "unknown"} | Mode: ${entryLabel(entry)} | ID: ${entry.sampleId || "n/a"}`;
|
|
|
|
const meta = document.createElement("p");
|
|
meta.className = "status";
|
|
meta.textContent = formatMeta(entry);
|
|
|
|
const actions = document.createElement("div");
|
|
actions.className = "actions";
|
|
|
|
const download = document.createElement("button");
|
|
download.type = "button";
|
|
download.textContent = "Download";
|
|
download.addEventListener("click", async () => {
|
|
const result = await browser.runtime.sendMessage({ type: "DOWNLOAD_ENTRY", entry });
|
|
if (!result || !result.ok) {
|
|
window.alert((result && result.error) || "Download failed.");
|
|
return;
|
|
}
|
|
setStatus(result.mode === "full" ? "Downloaded full file URL." : "Downloaded decoded preview fallback.");
|
|
});
|
|
|
|
const copy = document.createElement("button");
|
|
copy.type = "button";
|
|
copy.className = "secondary";
|
|
copy.textContent = "Copy URL";
|
|
copy.addEventListener("click", async () => {
|
|
const url = entry.fullUrl || entry.previewUrl || "";
|
|
await navigator.clipboard.writeText(url);
|
|
});
|
|
|
|
actions.appendChild(download);
|
|
actions.appendChild(copy);
|
|
li.appendChild(p);
|
|
li.appendChild(status);
|
|
li.appendChild(meta);
|
|
li.appendChild(actions);
|
|
return li;
|
|
}
|
|
|
|
async function loadCapturedUrls() {
|
|
const tabs = await browser.tabs.query({ active: true, currentWindow: true });
|
|
const activeTab = tabs[0];
|
|
|
|
if (!activeTab || typeof activeTab.id !== "number") {
|
|
setStatus("No active tab found.");
|
|
return;
|
|
}
|
|
|
|
const response = await browser.runtime.sendMessage({
|
|
type: "GET_TAB_URLS",
|
|
tabId: activeTab.id
|
|
});
|
|
|
|
if (!response || !response.ok) {
|
|
setStatus("Unable to load captured URLs.");
|
|
return;
|
|
}
|
|
|
|
listEl.innerHTML = "";
|
|
const entries = Array.isArray(response.entries) ? response.entries : [];
|
|
if (!entries.length) {
|
|
setStatus("No captured S3 URLs for this tab yet.");
|
|
return;
|
|
}
|
|
|
|
setStatus(`Captured samples for this tab: ${entries.length}`);
|
|
for (const entry of entries) {
|
|
listEl.appendChild(buildRow(entry));
|
|
}
|
|
}
|
|
|
|
openHistoryBtn.addEventListener("click", async () => {
|
|
await browser.runtime.sendMessage({ type: "OPEN_HISTORY" });
|
|
window.close();
|
|
});
|
|
|
|
loadCapturedUrls().catch(() => {
|
|
setStatus("Unexpected error while loading URLs.");
|
|
});
|