Compare commits

...

2 Commits

Author SHA1 Message Date
0e1869aacf ストレージ権限を削除 2026-04-09 02:29:19 +09:00
2a94e1124c EN/JP対応 2026-04-09 02:28:44 +09:00
7 changed files with 73 additions and 54 deletions

View File

@ -3,7 +3,7 @@
"name": "YT Playlist Features",
"version": "0.1.0",
"description": "Extract and work with YouTube playlist data",
"permissions": ["storage"],
"permissions": [],
"background": {
"service_worker": "background/service-worker.js"
},

View File

@ -3,7 +3,7 @@
"name": "YT Playlist Features",
"version": "0.1.0",
"description": "Extract and work with YouTube playlist data",
"permissions": ["storage"],
"permissions": [],
"background": {
"scripts": ["background/service-worker.js"]
},

View File

@ -1,6 +1,5 @@
import browser from "webextension-polyfill";
import type { Message } from "../shared/messages";
import { savePlaylist, getPlaylist } from "../shared/storage";
const LOG_PREFIX = "[yt-playlist-features:bg]";
@ -11,15 +10,8 @@ browser.runtime.onMessage.addListener(
if (msg.type === "PLAYLIST_EXTRACTED") {
console.log(
LOG_PREFIX,
`Saving playlist: "${msg.data.metadata.title}" (${msg.data.extractedCount} videos)`,
`Playlist: "${msg.data.metadata.title}" (${msg.data.extractedCount} videos)`,
);
await savePlaylist(msg.data);
return;
}
if (msg.type === "GET_PLAYLIST") {
const data = await getPlaylist(msg.playlistId);
return { type: "PLAYLIST_RESPONSE", data } satisfies Message;
}
},
);

52
src/content/ui/i18n.ts Normal file
View File

@ -0,0 +1,52 @@
type MessageKey =
| "colIndex"
| "colTitle"
| "colChannel"
| "colDuration"
| "colAddedBy"
| "colVotes"
| "filterTitle"
| "filterChannel"
| "filterAddedBy"
| "badgeLive"
| "headerVideos";
const messages: Record<string, Record<MessageKey, string>> = {
ja: {
colIndex: "#",
colTitle: "タイトル",
colChannel: "チャンネル",
colDuration: "長さ",
colAddedBy: "追加者",
colVotes: "投票",
filterTitle: "タイトル検索...",
filterChannel: "チャンネル...",
filterAddedBy: "追加者...",
badgeLive: "ライブ",
headerVideos: "本の動画",
},
en: {
colIndex: "#",
colTitle: "Title",
colChannel: "Channel",
colDuration: "Duration",
colAddedBy: "Added by",
colVotes: "Votes",
filterTitle: "Search title...",
filterChannel: "Channel...",
filterAddedBy: "Added by...",
badgeLive: "LIVE",
headerVideos: "videos",
},
};
function detectLang(): string {
const htmlLang = document.documentElement.lang;
if (htmlLang?.startsWith("ja")) return "ja";
return "en";
}
export function t(key: MessageKey): string {
const lang = detectLang();
return (messages[lang] ?? messages.en)[key];
}

View File

@ -1,4 +1,5 @@
import type { PlaylistData, PlaylistVideo } from "../../types/playlist";
import { t } from "./i18n";
type SortKey = "index" | "title" | "channel" | "duration" | "addedBy" | "votes";
type SortDir = "asc" | "desc";
@ -10,14 +11,16 @@ interface Column {
collab?: boolean; // only shown for collaborative playlists
}
const allColumns: Column[] = [
{ label: "#", cls: "ytpf-col-index", key: "index" },
{ label: "Title", cls: "ytpf-col-title", key: "title" },
{ label: "Channel", cls: "ytpf-col-channel", key: "channel" },
{ label: "Duration", cls: "ytpf-col-duration", key: "duration" },
{ label: "Added by", cls: "ytpf-col-addedby", key: "addedBy", collab: true },
{ label: "Votes", cls: "ytpf-col-votes", key: "votes", collab: true },
];
function getAllColumns(): Column[] {
return [
{ label: t("colIndex"), cls: "ytpf-col-index", key: "index" },
{ label: t("colTitle"), cls: "ytpf-col-title", key: "title" },
{ label: t("colChannel"), cls: "ytpf-col-channel", key: "channel" },
{ label: t("colDuration"), cls: "ytpf-col-duration", key: "duration" },
{ label: t("colAddedBy"), cls: "ytpf-col-addedby", key: "addedBy", collab: true },
{ label: t("colVotes"), cls: "ytpf-col-votes", key: "votes", collab: true },
];
}
interface TagInput {
container: HTMLElement;
@ -251,7 +254,7 @@ function buildRow(
if (video.isLive) {
const badge = document.createElement("span");
badge.className = "ytpf-live";
badge.textContent = "LIVE";
badge.textContent = t("badgeLive");
tdDuration.appendChild(badge);
} else {
tdDuration.textContent = video.durationText ?? "--";
@ -279,7 +282,7 @@ export function renderPlaylistTable(data: PlaylistData): HTMLElement {
const isCollab = data.videos.some(
(v) => v.addedBy != null || v.voteCount != null,
);
const columns = allColumns.filter((c) => !c.collab || isCollab);
const columns = getAllColumns().filter((c) => !c.collab || isCollab);
const wrapper = document.createElement("div");
wrapper.className = "ytpf-wrapper";
@ -290,7 +293,7 @@ export function renderPlaylistTable(data: PlaylistData): HTMLElement {
const titleSpan = document.createElement("span");
titleSpan.className = "ytpf-header-title";
titleSpan.textContent = `${data.metadata.title}${data.extractedCount} videos`;
titleSpan.textContent = `${data.metadata.title}${data.extractedCount} ${t("headerVideos")}`;
const metaSpan = document.createElement("span");
metaSpan.className = "ytpf-header-meta";
@ -313,12 +316,12 @@ export function renderPlaylistTable(data: PlaylistData): HTMLElement {
titleInput.className = "ytpf-filter-input";
titleInput.type = "text";
titleInput.name = "ytpf-title-filter";
titleInput.placeholder = "タイトル検索...";
titleInput.placeholder = t("filterTitle");
filters.appendChild(titleInput);
// Channel tag input
const channelNames = [...new Set(data.videos.map((v) => v.channel.name))].sort();
const channelTagInput = createTagInput("チャンネル...", channelNames, () => applyFilters());
const channelTagInput = createTagInput(t("filterChannel"), channelNames, () => applyFilters());
filters.appendChild(channelTagInput.container);
// Added-by tag input (collab only)
@ -327,7 +330,7 @@ export function renderPlaylistTable(data: PlaylistData): HTMLElement {
const addedByNames = [...new Set(
data.videos.map((v) => v.addedBy).filter((n): n is string => n != null),
)].sort();
addedByTagInput = createTagInput("追加者...", addedByNames, () => applyFilters());
addedByTagInput = createTagInput(t("filterAddedBy"), addedByNames, () => applyFilters());
filters.appendChild(addedByTagInput.container);
}

View File

@ -1,6 +1,3 @@
import type { PlaylistData } from "../types/playlist";
export type Message =
| { type: "PLAYLIST_EXTRACTED"; data: PlaylistData }
| { type: "GET_PLAYLIST"; playlistId: string }
| { type: "PLAYLIST_RESPONSE"; data: PlaylistData | null };
export type Message = { type: "PLAYLIST_EXTRACTED"; data: PlaylistData };

View File

@ -1,25 +0,0 @@
import browser from "webextension-polyfill";
import type { PlaylistData } from "../types/playlist";
const STORAGE_PREFIX = "playlist:";
export async function savePlaylist(data: PlaylistData): Promise<void> {
await browser.storage.local.set({
[STORAGE_PREFIX + data.metadata.playlistId]: data,
});
}
export async function getPlaylist(
playlistId: string,
): Promise<PlaylistData | null> {
const key = STORAGE_PREFIX + playlistId;
const result = await browser.storage.local.get(key);
return (result[key] as PlaylistData) ?? null;
}
export async function getAllPlaylists(): Promise<PlaylistData[]> {
const all = await browser.storage.local.get(null);
return Object.entries(all)
.filter(([key]) => key.startsWith(STORAGE_PREFIX))
.map(([, value]) => value as PlaylistData);
}