Compare commits
16 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 0c5dd2e375 | |||
| 3635b58fed | |||
| 980bc54f33 | |||
| 80d14f7a9d | |||
| 87f5cbc75c | |||
| 4c19c6491c | |||
| 4fbf98897c | |||
| b38b39dab3 | |||
| 177a98d312 | |||
| 1289f1a374 | |||
| 4f401356cd | |||
| 668574341e | |||
| 9c4ea9dd4d | |||
| 38dbd504d6 | |||
| b23de0741a | |||
| 65e2f28f8e |
|
|
@ -30,8 +30,16 @@ async function build(browser) {
|
|||
outfile: `${outdir}/injected/page-script.js`,
|
||||
format: "iife",
|
||||
}),
|
||||
esbuild.build({
|
||||
...common,
|
||||
entryPoints: ["src/options/options.ts"],
|
||||
outfile: `${outdir}/options/options.js`,
|
||||
format: "iife",
|
||||
}),
|
||||
]);
|
||||
|
||||
cpSync("src/options/options.html", `${outdir}/options/options.html`);
|
||||
|
||||
cpSync(`manifest.${browser}.json`, `${outdir}/manifest.json`);
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,9 +1,9 @@
|
|||
{
|
||||
"manifest_version": 3,
|
||||
"name": "YT Playlist Features",
|
||||
"version": "0.1.0",
|
||||
"version": "0.3.0",
|
||||
"description": "Extract and work with YouTube playlist data",
|
||||
"permissions": [],
|
||||
"permissions": ["storage"],
|
||||
"background": {
|
||||
"service_worker": "background/service-worker.js"
|
||||
},
|
||||
|
|
@ -14,6 +14,13 @@
|
|||
"run_at": "document_idle"
|
||||
}
|
||||
],
|
||||
"action": {
|
||||
"default_popup": "options/options.html"
|
||||
},
|
||||
"options_ui": {
|
||||
"page": "options/options.html",
|
||||
"open_in_tab": false
|
||||
},
|
||||
"web_accessible_resources": [
|
||||
{
|
||||
"resources": ["injected/page-script.js"],
|
||||
|
|
|
|||
|
|
@ -1,9 +1,9 @@
|
|||
{
|
||||
"manifest_version": 3,
|
||||
"name": "YT Playlist Features",
|
||||
"version": "0.1.0",
|
||||
"version": "0.3.0",
|
||||
"description": "Extract and work with YouTube playlist data",
|
||||
"permissions": [],
|
||||
"permissions": ["storage"],
|
||||
"background": {
|
||||
"scripts": ["background/service-worker.js"]
|
||||
},
|
||||
|
|
@ -14,6 +14,13 @@
|
|||
"run_at": "document_idle"
|
||||
}
|
||||
],
|
||||
"action": {
|
||||
"default_popup": "options/options.html"
|
||||
},
|
||||
"options_ui": {
|
||||
"page": "options/options.html",
|
||||
"open_in_tab": false
|
||||
},
|
||||
"web_accessible_resources": [
|
||||
{
|
||||
"resources": ["injected/page-script.js"],
|
||||
|
|
|
|||
230
package-lock.json
generated
230
package-lock.json
generated
|
|
@ -1,25 +1,25 @@
|
|||
{
|
||||
"name": "yt-playlist-features",
|
||||
"version": "0.1.0",
|
||||
"version": "0.3.0",
|
||||
"lockfileVersion": 3,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "yt-playlist-features",
|
||||
"version": "0.1.0",
|
||||
"version": "0.3.0",
|
||||
"dependencies": {
|
||||
"webextension-polyfill": "^0.12.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/webextension-polyfill": "^0.12.1",
|
||||
"esbuild": "^0.25.0",
|
||||
"typescript": "^5.7.0"
|
||||
"@types/webextension-polyfill": "^0.12.5",
|
||||
"esbuild": "^0.28.0",
|
||||
"typescript": "^6.0.2"
|
||||
}
|
||||
},
|
||||
"node_modules/@esbuild/aix-ppc64": {
|
||||
"version": "0.25.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.25.12.tgz",
|
||||
"integrity": "sha512-Hhmwd6CInZ3dwpuGTF8fJG6yoWmsToE+vYgD4nytZVxcu1ulHpUQRAB1UJ8+N1Am3Mz4+xOByoQoSZf4D+CpkA==",
|
||||
"version": "0.28.0",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.28.0.tgz",
|
||||
"integrity": "sha512-lhRUCeuOyJQURhTxl4WkpFTjIsbDayJHih5kZC1giwE+MhIzAb7mEsQMqMf18rHLsrb5qI1tafG20mLxEWcWlA==",
|
||||
"cpu": [
|
||||
"ppc64"
|
||||
],
|
||||
|
|
@ -34,9 +34,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/@esbuild/android-arm": {
|
||||
"version": "0.25.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.25.12.tgz",
|
||||
"integrity": "sha512-VJ+sKvNA/GE7Ccacc9Cha7bpS8nyzVv0jdVgwNDaR4gDMC/2TTRc33Ip8qrNYUcpkOHUT5OZ0bUcNNVZQ9RLlg==",
|
||||
"version": "0.28.0",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.28.0.tgz",
|
||||
"integrity": "sha512-wqh0ByljabXLKHeWXYLqoJ5jKC4XBaw6Hk08OfMrCRd2nP2ZQ5eleDZC41XHyCNgktBGYMbqnrJKq/K/lzPMSQ==",
|
||||
"cpu": [
|
||||
"arm"
|
||||
],
|
||||
|
|
@ -51,9 +51,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/@esbuild/android-arm64": {
|
||||
"version": "0.25.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.25.12.tgz",
|
||||
"integrity": "sha512-6AAmLG7zwD1Z159jCKPvAxZd4y/VTO0VkprYy+3N2FtJ8+BQWFXU+OxARIwA46c5tdD9SsKGZ/1ocqBS/gAKHg==",
|
||||
"version": "0.28.0",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.28.0.tgz",
|
||||
"integrity": "sha512-+WzIXQOSaGs33tLEgYPYe/yQHf0WTU0X42Jca3y8NWMbUVhp7rUnw+vAsRC/QiDrdD31IszMrZy+qwPOPjd+rw==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
|
|
@ -68,9 +68,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/@esbuild/android-x64": {
|
||||
"version": "0.25.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.25.12.tgz",
|
||||
"integrity": "sha512-5jbb+2hhDHx5phYR2By8GTWEzn6I9UqR11Kwf22iKbNpYrsmRB18aX/9ivc5cabcUiAT/wM+YIZ6SG9QO6a8kg==",
|
||||
"version": "0.28.0",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.28.0.tgz",
|
||||
"integrity": "sha512-+VJggoaKhk2VNNqVL7f6S189UzShHC/mR9EE8rDdSkdpN0KflSwWY/gWjDrNxxisg8Fp1ZCD9jLMo4m0OUfeUA==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
|
|
@ -85,9 +85,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/@esbuild/darwin-arm64": {
|
||||
"version": "0.25.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.25.12.tgz",
|
||||
"integrity": "sha512-N3zl+lxHCifgIlcMUP5016ESkeQjLj/959RxxNYIthIg+CQHInujFuXeWbWMgnTo4cp5XVHqFPmpyu9J65C1Yg==",
|
||||
"version": "0.28.0",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.28.0.tgz",
|
||||
"integrity": "sha512-0T+A9WZm+bZ84nZBtk1ckYsOvyA3x7e2Acj1KdVfV4/2tdG4fzUp91YHx+GArWLtwqp77pBXVCPn2We7Letr0Q==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
|
|
@ -102,9 +102,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/@esbuild/darwin-x64": {
|
||||
"version": "0.25.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.25.12.tgz",
|
||||
"integrity": "sha512-HQ9ka4Kx21qHXwtlTUVbKJOAnmG1ipXhdWTmNXiPzPfWKpXqASVcWdnf2bnL73wgjNrFXAa3yYvBSd9pzfEIpA==",
|
||||
"version": "0.28.0",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.28.0.tgz",
|
||||
"integrity": "sha512-fyzLm/DLDl/84OCfp2f/XQ4flmORsjU7VKt8HLjvIXChJoFFOIL6pLJPH4Yhd1n1gGFF9mPwtlN5Wf82DZs+LQ==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
|
|
@ -119,9 +119,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/@esbuild/freebsd-arm64": {
|
||||
"version": "0.25.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.25.12.tgz",
|
||||
"integrity": "sha512-gA0Bx759+7Jve03K1S0vkOu5Lg/85dou3EseOGUes8flVOGxbhDDh/iZaoek11Y8mtyKPGF3vP8XhnkDEAmzeg==",
|
||||
"version": "0.28.0",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.28.0.tgz",
|
||||
"integrity": "sha512-l9GeW5UZBT9k9brBYI+0WDffcRxgHQD8ShN2Ur4xWq/NFzUKm3k5lsH4PdaRgb2w7mI9u61nr2gI2mLI27Nh3Q==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
|
|
@ -136,9 +136,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/@esbuild/freebsd-x64": {
|
||||
"version": "0.25.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.25.12.tgz",
|
||||
"integrity": "sha512-TGbO26Yw2xsHzxtbVFGEXBFH0FRAP7gtcPE7P5yP7wGy7cXK2oO7RyOhL5NLiqTlBh47XhmIUXuGciXEqYFfBQ==",
|
||||
"version": "0.28.0",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.28.0.tgz",
|
||||
"integrity": "sha512-BXoQai/A0wPO6Es3yFJ7APCiKGc1tdAEOgeTNy3SsB491S3aHn4S4r3e976eUnPdU+NbdtmBuLncYir2tMU9Nw==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
|
|
@ -153,9 +153,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/@esbuild/linux-arm": {
|
||||
"version": "0.25.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.25.12.tgz",
|
||||
"integrity": "sha512-lPDGyC1JPDou8kGcywY0YILzWlhhnRjdof3UlcoqYmS9El818LLfJJc3PXXgZHrHCAKs/Z2SeZtDJr5MrkxtOw==",
|
||||
"version": "0.28.0",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.28.0.tgz",
|
||||
"integrity": "sha512-CjaaREJagqJp7iTaNQjjidaNbCKYcd4IDkzbwwxtSvjI7NZm79qiHc8HqciMddQ6CKvJT6aBd8lO9kN/ZudLlw==",
|
||||
"cpu": [
|
||||
"arm"
|
||||
],
|
||||
|
|
@ -170,9 +170,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/@esbuild/linux-arm64": {
|
||||
"version": "0.25.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.25.12.tgz",
|
||||
"integrity": "sha512-8bwX7a8FghIgrupcxb4aUmYDLp8pX06rGh5HqDT7bB+8Rdells6mHvrFHHW2JAOPZUbnjUpKTLg6ECyzvas2AQ==",
|
||||
"version": "0.28.0",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.28.0.tgz",
|
||||
"integrity": "sha512-RVyzfb3FWsGA55n6WY0MEIEPURL1FcbhFE6BffZEMEekfCzCIMtB5yyDcFnVbTnwk+CLAgTujmV/Lgvih56W+A==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
|
|
@ -187,9 +187,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/@esbuild/linux-ia32": {
|
||||
"version": "0.25.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.25.12.tgz",
|
||||
"integrity": "sha512-0y9KrdVnbMM2/vG8KfU0byhUN+EFCny9+8g202gYqSSVMonbsCfLjUO+rCci7pM0WBEtz+oK/PIwHkzxkyharA==",
|
||||
"version": "0.28.0",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.28.0.tgz",
|
||||
"integrity": "sha512-KBnSTt1kxl9x70q+ydterVdl+Cn0H18ngRMRCEQfrbqdUuntQQ0LoMZv47uB97NljZFzY6HcfqEZ2SAyIUTQBQ==",
|
||||
"cpu": [
|
||||
"ia32"
|
||||
],
|
||||
|
|
@ -204,9 +204,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/@esbuild/linux-loong64": {
|
||||
"version": "0.25.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.25.12.tgz",
|
||||
"integrity": "sha512-h///Lr5a9rib/v1GGqXVGzjL4TMvVTv+s1DPoxQdz7l/AYv6LDSxdIwzxkrPW438oUXiDtwM10o9PmwS/6Z0Ng==",
|
||||
"version": "0.28.0",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.28.0.tgz",
|
||||
"integrity": "sha512-zpSlUce1mnxzgBADvxKXX5sl8aYQHo2ezvMNI8I0lbblJtp8V4odlm3Yzlj7gPyt3T8ReksE6bK+pT3WD+aJRg==",
|
||||
"cpu": [
|
||||
"loong64"
|
||||
],
|
||||
|
|
@ -221,9 +221,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/@esbuild/linux-mips64el": {
|
||||
"version": "0.25.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.25.12.tgz",
|
||||
"integrity": "sha512-iyRrM1Pzy9GFMDLsXn1iHUm18nhKnNMWscjmp4+hpafcZjrr2WbT//d20xaGljXDBYHqRcl8HnxbX6uaA/eGVw==",
|
||||
"version": "0.28.0",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.28.0.tgz",
|
||||
"integrity": "sha512-2jIfP6mmjkdmeTlsX/9vmdmhBmKADrWqN7zcdtHIeNSCH1SqIoNI63cYsjQR8J+wGa4Y5izRcSHSm8K3QWmk3w==",
|
||||
"cpu": [
|
||||
"mips64el"
|
||||
],
|
||||
|
|
@ -238,9 +238,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/@esbuild/linux-ppc64": {
|
||||
"version": "0.25.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.25.12.tgz",
|
||||
"integrity": "sha512-9meM/lRXxMi5PSUqEXRCtVjEZBGwB7P/D4yT8UG/mwIdze2aV4Vo6U5gD3+RsoHXKkHCfSxZKzmDssVlRj1QQA==",
|
||||
"version": "0.28.0",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.28.0.tgz",
|
||||
"integrity": "sha512-bc0FE9wWeC0WBm49IQMPSPILRocGTQt3j5KPCA8os6VprfuJ7KD+5PzESSrJ6GmPIPJK965ZJHTUlSA6GNYEhg==",
|
||||
"cpu": [
|
||||
"ppc64"
|
||||
],
|
||||
|
|
@ -255,9 +255,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/@esbuild/linux-riscv64": {
|
||||
"version": "0.25.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.25.12.tgz",
|
||||
"integrity": "sha512-Zr7KR4hgKUpWAwb1f3o5ygT04MzqVrGEGXGLnj15YQDJErYu/BGg+wmFlIDOdJp0PmB0lLvxFIOXZgFRrdjR0w==",
|
||||
"version": "0.28.0",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.28.0.tgz",
|
||||
"integrity": "sha512-SQPZOwoTTT/HXFXQJG/vBX8sOFagGqvZyXcgLA3NhIqcBv1BJU1d46c0rGcrij2B56Z2rNiSLaZOYW5cUk7yLQ==",
|
||||
"cpu": [
|
||||
"riscv64"
|
||||
],
|
||||
|
|
@ -272,9 +272,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/@esbuild/linux-s390x": {
|
||||
"version": "0.25.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.25.12.tgz",
|
||||
"integrity": "sha512-MsKncOcgTNvdtiISc/jZs/Zf8d0cl/t3gYWX8J9ubBnVOwlk65UIEEvgBORTiljloIWnBzLs4qhzPkJcitIzIg==",
|
||||
"version": "0.28.0",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.28.0.tgz",
|
||||
"integrity": "sha512-SCfR0HN8CEEjnYnySJTd2cw0k9OHB/YFzt5zgJEwa+wL/T/raGWYMBqwDNAC6dqFKmJYZoQBRfHjgwLHGSrn3Q==",
|
||||
"cpu": [
|
||||
"s390x"
|
||||
],
|
||||
|
|
@ -289,9 +289,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/@esbuild/linux-x64": {
|
||||
"version": "0.25.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.25.12.tgz",
|
||||
"integrity": "sha512-uqZMTLr/zR/ed4jIGnwSLkaHmPjOjJvnm6TVVitAa08SLS9Z0VM8wIRx7gWbJB5/J54YuIMInDquWyYvQLZkgw==",
|
||||
"version": "0.28.0",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.28.0.tgz",
|
||||
"integrity": "sha512-us0dSb9iFxIi8srnpl931Nvs65it/Jd2a2K3qs7fz2WfGPHqzfzZTfec7oxZJRNPXPnNYZtanmRc4AL/JwVzHQ==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
|
|
@ -306,9 +306,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/@esbuild/netbsd-arm64": {
|
||||
"version": "0.25.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.25.12.tgz",
|
||||
"integrity": "sha512-xXwcTq4GhRM7J9A8Gv5boanHhRa/Q9KLVmcyXHCTaM4wKfIpWkdXiMog/KsnxzJ0A1+nD+zoecuzqPmCRyBGjg==",
|
||||
"version": "0.28.0",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.28.0.tgz",
|
||||
"integrity": "sha512-CR/RYotgtCKwtftMwJlUU7xCVNg3lMYZ0RzTmAHSfLCXw3NtZtNpswLEj/Kkf6kEL3Gw+BpOekRX0BYCtklhUw==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
|
|
@ -323,9 +323,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/@esbuild/netbsd-x64": {
|
||||
"version": "0.25.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.25.12.tgz",
|
||||
"integrity": "sha512-Ld5pTlzPy3YwGec4OuHh1aCVCRvOXdH8DgRjfDy/oumVovmuSzWfnSJg+VtakB9Cm0gxNO9BzWkj6mtO1FMXkQ==",
|
||||
"version": "0.28.0",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.28.0.tgz",
|
||||
"integrity": "sha512-nU1yhmYutL+fQ71Kxnhg8uEOdC0pwEW9entHykTgEbna2pw2dkbFSMeqjjyHZoCmt8SBkOSvV+yNmm94aUrrqw==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
|
|
@ -340,9 +340,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/@esbuild/openbsd-arm64": {
|
||||
"version": "0.25.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.25.12.tgz",
|
||||
"integrity": "sha512-fF96T6KsBo/pkQI950FARU9apGNTSlZGsv1jZBAlcLL1MLjLNIWPBkj5NlSz8aAzYKg+eNqknrUJ24QBybeR5A==",
|
||||
"version": "0.28.0",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.28.0.tgz",
|
||||
"integrity": "sha512-cXb5vApOsRsxsEl4mcZ1XY3D4DzcoMxR/nnc4IyqYs0rTI8ZKmW6kyyg+11Z8yvgMfAEldKzP7AdP64HnSC/6g==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
|
|
@ -357,9 +357,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/@esbuild/openbsd-x64": {
|
||||
"version": "0.25.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.25.12.tgz",
|
||||
"integrity": "sha512-MZyXUkZHjQxUvzK7rN8DJ3SRmrVrke8ZyRusHlP+kuwqTcfWLyqMOE3sScPPyeIXN/mDJIfGXvcMqCgYKekoQw==",
|
||||
"version": "0.28.0",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.28.0.tgz",
|
||||
"integrity": "sha512-8wZM2qqtv9UP3mzy7HiGYNH/zjTA355mpeuA+859TyR+e+Tc08IHYpLJuMsfpDJwoLo1ikIJI8jC3GFjnRClzA==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
|
|
@ -374,9 +374,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/@esbuild/openharmony-arm64": {
|
||||
"version": "0.25.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/openharmony-arm64/-/openharmony-arm64-0.25.12.tgz",
|
||||
"integrity": "sha512-rm0YWsqUSRrjncSXGA7Zv78Nbnw4XL6/dzr20cyrQf7ZmRcsovpcRBdhD43Nuk3y7XIoW2OxMVvwuRvk9XdASg==",
|
||||
"version": "0.28.0",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/openharmony-arm64/-/openharmony-arm64-0.28.0.tgz",
|
||||
"integrity": "sha512-FLGfyizszcef5C3YtoyQDACyg95+dndv79i2EekILBofh5wpCa1KuBqOWKrEHZg3zrL3t5ouE5jgr94vA+Wb2w==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
|
|
@ -391,9 +391,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/@esbuild/sunos-x64": {
|
||||
"version": "0.25.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.25.12.tgz",
|
||||
"integrity": "sha512-3wGSCDyuTHQUzt0nV7bocDy72r2lI33QL3gkDNGkod22EsYl04sMf0qLb8luNKTOmgF/eDEDP5BFNwoBKH441w==",
|
||||
"version": "0.28.0",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.28.0.tgz",
|
||||
"integrity": "sha512-1ZgjUoEdHZZl/YlV76TSCz9Hqj9h9YmMGAgAPYd+q4SicWNX3G5GCyx9uhQWSLcbvPW8Ni7lj4gDa1T40akdlw==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
|
|
@ -408,9 +408,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/@esbuild/win32-arm64": {
|
||||
"version": "0.25.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.25.12.tgz",
|
||||
"integrity": "sha512-rMmLrur64A7+DKlnSuwqUdRKyd3UE7oPJZmnljqEptesKM8wx9J8gx5u0+9Pq0fQQW8vqeKebwNXdfOyP+8Bsg==",
|
||||
"version": "0.28.0",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.28.0.tgz",
|
||||
"integrity": "sha512-Q9StnDmQ/enxnpxCCLSg0oo4+34B9TdXpuyPeTedN/6+iXBJ4J+zwfQI28u/Jl40nOYAxGoNi7mFP40RUtkmUA==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
|
|
@ -425,9 +425,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/@esbuild/win32-ia32": {
|
||||
"version": "0.25.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.25.12.tgz",
|
||||
"integrity": "sha512-HkqnmmBoCbCwxUKKNPBixiWDGCpQGVsrQfJoVGYLPT41XWF8lHuE5N6WhVia2n4o5QK5M4tYr21827fNhi4byQ==",
|
||||
"version": "0.28.0",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.28.0.tgz",
|
||||
"integrity": "sha512-zF3ag/gfiCe6U2iczcRzSYJKH1DCI+ByzSENHlM2FcDbEeo5Zd2C86Aq0tKUYAJJ1obRP84ymxIAksZUcdztHA==",
|
||||
"cpu": [
|
||||
"ia32"
|
||||
],
|
||||
|
|
@ -442,9 +442,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/@esbuild/win32-x64": {
|
||||
"version": "0.25.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.25.12.tgz",
|
||||
"integrity": "sha512-alJC0uCZpTFrSL0CCDjcgleBXPnCrEAhTBILpeAp7M/OFgoqtAetfBzX0xM00MUsVVPpVjlPuMbREqnZCXaTnA==",
|
||||
"version": "0.28.0",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.28.0.tgz",
|
||||
"integrity": "sha512-pEl1bO9mfAmIC+tW5btTmrKaujg3zGtUmWNdCw/xs70FBjwAL3o9OEKNHvNmnyylD6ubxUERiEhdsL0xBQ9efw==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
|
|
@ -466,9 +466,9 @@
|
|||
"license": "MIT"
|
||||
},
|
||||
"node_modules/esbuild": {
|
||||
"version": "0.25.12",
|
||||
"resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.25.12.tgz",
|
||||
"integrity": "sha512-bbPBYYrtZbkt6Os6FiTLCTFxvq4tt3JKall1vRwshA3fdVztsLAatFaZobhkBC8/BrPetoa0oksYoKXoG4ryJg==",
|
||||
"version": "0.28.0",
|
||||
"resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.28.0.tgz",
|
||||
"integrity": "sha512-sNR9MHpXSUV/XB4zmsFKN+QgVG82Cc7+/aaxJ8Adi8hyOac+EXptIp45QBPaVyX3N70664wRbTcLTOemCAnyqw==",
|
||||
"dev": true,
|
||||
"hasInstallScript": true,
|
||||
"license": "MIT",
|
||||
|
|
@ -479,38 +479,38 @@
|
|||
"node": ">=18"
|
||||
},
|
||||
"optionalDependencies": {
|
||||
"@esbuild/aix-ppc64": "0.25.12",
|
||||
"@esbuild/android-arm": "0.25.12",
|
||||
"@esbuild/android-arm64": "0.25.12",
|
||||
"@esbuild/android-x64": "0.25.12",
|
||||
"@esbuild/darwin-arm64": "0.25.12",
|
||||
"@esbuild/darwin-x64": "0.25.12",
|
||||
"@esbuild/freebsd-arm64": "0.25.12",
|
||||
"@esbuild/freebsd-x64": "0.25.12",
|
||||
"@esbuild/linux-arm": "0.25.12",
|
||||
"@esbuild/linux-arm64": "0.25.12",
|
||||
"@esbuild/linux-ia32": "0.25.12",
|
||||
"@esbuild/linux-loong64": "0.25.12",
|
||||
"@esbuild/linux-mips64el": "0.25.12",
|
||||
"@esbuild/linux-ppc64": "0.25.12",
|
||||
"@esbuild/linux-riscv64": "0.25.12",
|
||||
"@esbuild/linux-s390x": "0.25.12",
|
||||
"@esbuild/linux-x64": "0.25.12",
|
||||
"@esbuild/netbsd-arm64": "0.25.12",
|
||||
"@esbuild/netbsd-x64": "0.25.12",
|
||||
"@esbuild/openbsd-arm64": "0.25.12",
|
||||
"@esbuild/openbsd-x64": "0.25.12",
|
||||
"@esbuild/openharmony-arm64": "0.25.12",
|
||||
"@esbuild/sunos-x64": "0.25.12",
|
||||
"@esbuild/win32-arm64": "0.25.12",
|
||||
"@esbuild/win32-ia32": "0.25.12",
|
||||
"@esbuild/win32-x64": "0.25.12"
|
||||
"@esbuild/aix-ppc64": "0.28.0",
|
||||
"@esbuild/android-arm": "0.28.0",
|
||||
"@esbuild/android-arm64": "0.28.0",
|
||||
"@esbuild/android-x64": "0.28.0",
|
||||
"@esbuild/darwin-arm64": "0.28.0",
|
||||
"@esbuild/darwin-x64": "0.28.0",
|
||||
"@esbuild/freebsd-arm64": "0.28.0",
|
||||
"@esbuild/freebsd-x64": "0.28.0",
|
||||
"@esbuild/linux-arm": "0.28.0",
|
||||
"@esbuild/linux-arm64": "0.28.0",
|
||||
"@esbuild/linux-ia32": "0.28.0",
|
||||
"@esbuild/linux-loong64": "0.28.0",
|
||||
"@esbuild/linux-mips64el": "0.28.0",
|
||||
"@esbuild/linux-ppc64": "0.28.0",
|
||||
"@esbuild/linux-riscv64": "0.28.0",
|
||||
"@esbuild/linux-s390x": "0.28.0",
|
||||
"@esbuild/linux-x64": "0.28.0",
|
||||
"@esbuild/netbsd-arm64": "0.28.0",
|
||||
"@esbuild/netbsd-x64": "0.28.0",
|
||||
"@esbuild/openbsd-arm64": "0.28.0",
|
||||
"@esbuild/openbsd-x64": "0.28.0",
|
||||
"@esbuild/openharmony-arm64": "0.28.0",
|
||||
"@esbuild/sunos-x64": "0.28.0",
|
||||
"@esbuild/win32-arm64": "0.28.0",
|
||||
"@esbuild/win32-ia32": "0.28.0",
|
||||
"@esbuild/win32-x64": "0.28.0"
|
||||
}
|
||||
},
|
||||
"node_modules/typescript": {
|
||||
"version": "5.9.3",
|
||||
"resolved": "https://registry.npmjs.org/typescript/-/typescript-5.9.3.tgz",
|
||||
"integrity": "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==",
|
||||
"version": "6.0.2",
|
||||
"resolved": "https://registry.npmjs.org/typescript/-/typescript-6.0.2.tgz",
|
||||
"integrity": "sha512-bGdAIrZ0wiGDo5l8c++HWtbaNCWTS4UTv7RaTH/ThVIgjkveJt83m74bBHMJkuCbslY8ixgLBVZJIOiQlQTjfQ==",
|
||||
"dev": true,
|
||||
"license": "Apache-2.0",
|
||||
"bin": {
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "yt-playlist-features",
|
||||
"version": "0.1.0",
|
||||
"version": "0.3.0",
|
||||
"private": true,
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
|
|
@ -9,9 +9,9 @@
|
|||
"typecheck": "tsc --noEmit"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/webextension-polyfill": "^0.12.1",
|
||||
"esbuild": "^0.25.0",
|
||||
"typescript": "^5.7.0"
|
||||
"@types/webextension-polyfill": "^0.12.5",
|
||||
"esbuild": "^0.28.0",
|
||||
"typescript": "^6.0.2"
|
||||
},
|
||||
"dependencies": {
|
||||
"webextension-polyfill": "^0.12.0"
|
||||
|
|
|
|||
|
|
@ -1,19 +1,121 @@
|
|||
import browser from "webextension-polyfill";
|
||||
import type { Message } from "../shared/messages";
|
||||
import type { DetailUpdate } from "../types/playlist";
|
||||
import { CATEGORY_MAP } from "../shared/category-map";
|
||||
|
||||
const LOG_PREFIX = "[yt-playlist-features:bg]";
|
||||
const LOG = "[yt-playlist-features:bg]";
|
||||
const DEFAULT_API_KEY = "AIzaSyDPyWG3ABnVV3en_KBhIxUH6O2_A0oP4Wk";
|
||||
const BATCH_SIZE = 50;
|
||||
|
||||
async function getApiKey(): Promise<string> {
|
||||
const result = await browser.storage.sync.get("apiKey");
|
||||
return (result.apiKey as string) || DEFAULT_API_KEY;
|
||||
}
|
||||
|
||||
const BATCH_DELAY = 500; // ms between batches
|
||||
const RETRY_DELAY = 5000; // ms before retrying after rate limit
|
||||
const MAX_RETRIES = 3;
|
||||
|
||||
async function fetchVideoDetails(
|
||||
videoIds: string[],
|
||||
tabId: number,
|
||||
): Promise<void> {
|
||||
const apiKey = await getApiKey();
|
||||
if (!apiKey) {
|
||||
browser.tabs.sendMessage(tabId, {
|
||||
type: "VIDEO_DETAILS_ERROR",
|
||||
error: "no-api-key",
|
||||
} satisfies Message);
|
||||
return;
|
||||
}
|
||||
|
||||
for (let i = 0; i < videoIds.length; i += BATCH_SIZE) {
|
||||
if (i > 0) await new Promise((r) => setTimeout(r, BATCH_DELAY));
|
||||
|
||||
const batch = videoIds.slice(i, i + BATCH_SIZE);
|
||||
const ids = batch.join(",");
|
||||
const url = `https://www.googleapis.com/youtube/v3/videos?part=snippet,statistics&id=${ids}&key=${apiKey}`;
|
||||
|
||||
let success = false;
|
||||
for (let attempt = 0; attempt < MAX_RETRIES; attempt++) {
|
||||
try {
|
||||
if (attempt > 0) {
|
||||
console.log(LOG, `Retry ${attempt} after rate limit, waiting ${RETRY_DELAY}ms...`);
|
||||
await new Promise((r) => setTimeout(r, RETRY_DELAY));
|
||||
}
|
||||
|
||||
const res = await fetch(url);
|
||||
if (res.status === 403) {
|
||||
console.warn(LOG, `Rate limited (attempt ${attempt + 1}/${MAX_RETRIES})`);
|
||||
continue;
|
||||
}
|
||||
if (!res.ok) {
|
||||
const body = await res.text();
|
||||
console.error(LOG, `API error ${res.status}:`, body);
|
||||
browser.tabs.sendMessage(tabId, {
|
||||
type: "VIDEO_DETAILS_ERROR",
|
||||
error: `api-error-${res.status}`,
|
||||
} satisfies Message);
|
||||
return;
|
||||
}
|
||||
|
||||
const data = await res.json();
|
||||
const updates: DetailUpdate[] = (data.items ?? []).map((item: any) => ({
|
||||
videoId: item.id,
|
||||
viewCountText: item.statistics?.viewCount
|
||||
? parseInt(item.statistics.viewCount, 10).toLocaleString()
|
||||
: null,
|
||||
publishedAt: item.snippet?.publishedAt?.slice(0, 10) ?? null,
|
||||
category: CATEGORY_MAP[item.snippet?.categoryId] ?? null,
|
||||
likeCount: item.statistics?.likeCount
|
||||
? parseInt(item.statistics.likeCount, 10)
|
||||
: null,
|
||||
}));
|
||||
|
||||
browser.tabs.sendMessage(tabId, {
|
||||
type: "VIDEO_DETAILS_UPDATE",
|
||||
updates,
|
||||
} satisfies Message);
|
||||
success = true;
|
||||
break;
|
||||
} catch (e) {
|
||||
console.error(LOG, "Fetch failed:", e);
|
||||
browser.tabs.sendMessage(tabId, {
|
||||
type: "VIDEO_DETAILS_ERROR",
|
||||
error: "network-error",
|
||||
} satisfies Message);
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
if (!success) {
|
||||
console.error(LOG, "Max retries exceeded for batch");
|
||||
browser.tabs.sendMessage(tabId, {
|
||||
type: "VIDEO_DETAILS_ERROR",
|
||||
error: "rate-limit-exceeded",
|
||||
} satisfies Message);
|
||||
return;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
browser.runtime.onMessage.addListener(
|
||||
async (message: unknown, _sender: browser.Runtime.MessageSender) => {
|
||||
async (message: unknown, sender: browser.Runtime.MessageSender) => {
|
||||
const msg = message as Message;
|
||||
|
||||
if (msg.type === "PLAYLIST_EXTRACTED") {
|
||||
console.log(
|
||||
LOG_PREFIX,
|
||||
LOG,
|
||||
`Playlist: "${msg.data.metadata.title}" (${msg.data.extractedCount} videos)`,
|
||||
);
|
||||
}
|
||||
|
||||
if (msg.type === "FETCH_VIDEO_DETAILS") {
|
||||
const tabId = sender.tab?.id;
|
||||
if (!tabId) return;
|
||||
fetchVideoDetails(msg.videoIds, tabId);
|
||||
}
|
||||
},
|
||||
);
|
||||
|
||||
console.log(LOG_PREFIX, "Service worker started.");
|
||||
console.log(LOG, "Service worker started.");
|
||||
|
|
|
|||
|
|
@ -175,6 +175,14 @@ function parseVideo(renderer: any): PlaylistVideo | null {
|
|||
(b: any) =>
|
||||
b.metadataBadgeRenderer?.style === "BADGE_STYLE_TYPE_LIVE_NOW",
|
||||
) ?? false,
|
||||
viewCountText: null,
|
||||
publishedAt: null,
|
||||
category: null,
|
||||
addedBy: null,
|
||||
voteCount: null,
|
||||
likeCount: null,
|
||||
setVideoId: null,
|
||||
voteStatus: null,
|
||||
};
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -3,13 +3,46 @@ import { onPlaylistPageReady, getPlaylistId } from "./navigation";
|
|||
import { parseInitialData, buildPlaylistData } from "./extractor";
|
||||
import type { PlaylistVideo } from "../types/playlist";
|
||||
import type { Message } from "../shared/messages";
|
||||
import { mountTable } from "./ui/lifecycle";
|
||||
import { mountTable, appendToTable, setTableComplete, updateTableDetails, updateVoteStatuses } from "./ui/lifecycle";
|
||||
|
||||
const LOG = "[yt-playlist-features]";
|
||||
|
||||
let lastExtractedId: string | null = null;
|
||||
let pageScriptInjected = false;
|
||||
|
||||
function mapRawVideo(v: any): PlaylistVideo {
|
||||
const bylineRun = v.shortBylineText?.runs?.[0];
|
||||
const bylineEndpoint = bylineRun?.navigationEndpoint?.browseEndpoint;
|
||||
return {
|
||||
videoId: v.videoId,
|
||||
title: v.title,
|
||||
index: v.index,
|
||||
durationSeconds: v.lengthSeconds,
|
||||
durationText: v.lengthText || null,
|
||||
thumbnails: v.thumbnails,
|
||||
channel: {
|
||||
name: bylineRun?.text ?? "",
|
||||
channelId: bylineEndpoint?.browseId ?? "",
|
||||
url: bylineRun?.navigationEndpoint?.commandMetadata
|
||||
?.webCommandMetadata?.url ?? "",
|
||||
},
|
||||
isPlayable: v.isPlayable,
|
||||
isLive:
|
||||
v.badges?.some(
|
||||
(b: any) =>
|
||||
b.metadataBadgeRenderer?.style === "BADGE_STYLE_TYPE_LIVE_NOW",
|
||||
) ?? false,
|
||||
viewCountText: v.viewCountText ?? null,
|
||||
publishedAt: v.publishedAt ?? null,
|
||||
category: v.category ?? null,
|
||||
addedBy: v.addedBy ?? null,
|
||||
voteCount: v.voteCount ?? null,
|
||||
likeCount: v.likeCount ?? null,
|
||||
setVideoId: v.setVideoId ?? null,
|
||||
voteStatus: v.voteStatus ?? null,
|
||||
} satisfies PlaylistVideo;
|
||||
}
|
||||
|
||||
function ensurePageScript(): void {
|
||||
if (pageScriptInjected) return;
|
||||
const script = document.createElement("script");
|
||||
|
|
@ -31,6 +64,9 @@ function handlePlaylistData(event: Event): void {
|
|||
return;
|
||||
}
|
||||
|
||||
// Skip append messages — handled separately
|
||||
if (payload.type === "append") return;
|
||||
|
||||
if (payload.error) {
|
||||
console.warn(LOG, "Page script error:", payload.error);
|
||||
return;
|
||||
|
|
@ -47,35 +83,9 @@ function handlePlaylistData(event: Event): void {
|
|||
}
|
||||
|
||||
// Convert DOM-extracted videos to PlaylistVideo[]
|
||||
const videos: PlaylistVideo[] = domVideos.map((v: any) => {
|
||||
const bylineRun = v.shortBylineText?.runs?.[0];
|
||||
const bylineEndpoint = bylineRun?.navigationEndpoint?.browseEndpoint;
|
||||
const videos: PlaylistVideo[] = domVideos.map(mapRawVideo);
|
||||
|
||||
return {
|
||||
videoId: v.videoId,
|
||||
title: v.title,
|
||||
index: v.index,
|
||||
durationSeconds: v.lengthSeconds,
|
||||
durationText: v.lengthText || null,
|
||||
thumbnails: v.thumbnails,
|
||||
channel: {
|
||||
name: bylineRun?.text ?? "",
|
||||
channelId: bylineEndpoint?.browseId ?? "",
|
||||
url: bylineRun?.navigationEndpoint?.commandMetadata
|
||||
?.webCommandMetadata?.url ?? "",
|
||||
},
|
||||
isPlayable: v.isPlayable,
|
||||
isLive:
|
||||
v.badges?.some(
|
||||
(b: any) =>
|
||||
b.metadataBadgeRenderer?.style === "BADGE_STYLE_TYPE_LIVE_NOW",
|
||||
) ?? false,
|
||||
addedBy: v.addedBy ?? null,
|
||||
voteCount: v.voteCount ?? null,
|
||||
} satisfies PlaylistVideo;
|
||||
});
|
||||
|
||||
const playlistData = buildPlaylistData(metadata, videos, true);
|
||||
const playlistData = buildPlaylistData(metadata, videos, payload.isComplete !== false);
|
||||
|
||||
console.log(
|
||||
LOG,
|
||||
|
|
@ -90,8 +100,41 @@ function handlePlaylistData(event: Event): void {
|
|||
});
|
||||
}
|
||||
|
||||
function handlePlaylistAppend(event: Event): void {
|
||||
const detail = (event as CustomEvent).detail;
|
||||
if (!detail) return;
|
||||
|
||||
let payload: any;
|
||||
try {
|
||||
payload = JSON.parse(detail);
|
||||
} catch {
|
||||
return;
|
||||
}
|
||||
|
||||
if (payload.type === "append") {
|
||||
const newVideos: PlaylistVideo[] = payload.videos.map(mapRawVideo);
|
||||
appendToTable(newVideos);
|
||||
if (payload.isComplete) {
|
||||
setTableComplete(payload.totalCount);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Listen for data from the injected page script
|
||||
document.addEventListener("__yt_playlist_ext_data", handlePlaylistData);
|
||||
document.addEventListener("__yt_playlist_ext_data", handlePlaylistAppend);
|
||||
|
||||
|
||||
// Listen for detail updates from background service worker
|
||||
browser.runtime.onMessage.addListener((message: unknown) => {
|
||||
const msg = message as Message;
|
||||
if (msg.type === "VIDEO_DETAILS_UPDATE") {
|
||||
updateTableDetails(msg.updates);
|
||||
}
|
||||
if (msg.type === "VIDEO_DETAILS_ERROR") {
|
||||
console.error(LOG, "Detail fetch error:", msg.error);
|
||||
}
|
||||
});
|
||||
|
||||
// Detect playlist page navigation and trigger extraction
|
||||
onPlaylistPageReady(() => {
|
||||
|
|
|
|||
|
|
@ -3,13 +3,35 @@ type MessageKey =
|
|||
| "colTitle"
|
||||
| "colChannel"
|
||||
| "colDuration"
|
||||
| "colViews"
|
||||
| "colPublished"
|
||||
| "colCategory"
|
||||
| "colLikes"
|
||||
| "colAddedBy"
|
||||
| "colVotes"
|
||||
| "filterTitle"
|
||||
| "filterChannel"
|
||||
| "filterAddedBy"
|
||||
| "filterCategory"
|
||||
| "badgeLive"
|
||||
| "headerVideos";
|
||||
| "headerVideos"
|
||||
| "headerLoading"
|
||||
| "fetchViews"
|
||||
| "fetchViewsProgress"
|
||||
| "fetchViewsDone"
|
||||
| "colSettings"
|
||||
| "colSettingsReset"
|
||||
| "statsDuration"
|
||||
| "statsChannels"
|
||||
| "statsPlayable"
|
||||
| "statsTotalViews"
|
||||
| "statsDetail"
|
||||
| "statsDetailChannelRank"
|
||||
| "statsDetailAddedByRank"
|
||||
| "statsDetailCategoryBreak"
|
||||
| "statsDetailDurationAvg"
|
||||
| "statsDetailDurationMedian"
|
||||
| "statsDetailVideos";
|
||||
|
||||
const messages: Record<string, Record<MessageKey, string>> = {
|
||||
ja: {
|
||||
|
|
@ -17,26 +39,70 @@ const messages: Record<string, Record<MessageKey, string>> = {
|
|||
colTitle: "タイトル",
|
||||
colChannel: "チャンネル",
|
||||
colDuration: "長さ",
|
||||
colViews: "再生数",
|
||||
colPublished: "公開日",
|
||||
colCategory: "カテゴリ",
|
||||
colLikes: "高評価",
|
||||
colAddedBy: "追加者",
|
||||
colVotes: "投票",
|
||||
filterTitle: "タイトル検索...",
|
||||
filterChannel: "チャンネル...",
|
||||
filterAddedBy: "追加者...",
|
||||
filterCategory: "カテゴリ...",
|
||||
badgeLive: "ライブ",
|
||||
headerVideos: "本の動画",
|
||||
headerLoading: "読み込み中…",
|
||||
fetchViews: "全件詳細を取得",
|
||||
fetchViewsProgress: "取得中…",
|
||||
fetchViewsDone: "取得完了",
|
||||
colSettings: "表示",
|
||||
colSettingsReset: "リセット",
|
||||
statsDuration: "合計時間",
|
||||
statsChannels: "チャンネル",
|
||||
statsPlayable: "再生可能",
|
||||
statsTotalViews: "総再生数",
|
||||
statsDetail: "詳細",
|
||||
statsDetailChannelRank: "チャンネル別",
|
||||
statsDetailAddedByRank: "追加者別",
|
||||
statsDetailCategoryBreak: "カテゴリ別",
|
||||
statsDetailDurationAvg: "平均再生時間",
|
||||
statsDetailDurationMedian: "中央値",
|
||||
statsDetailVideos: "本",
|
||||
},
|
||||
en: {
|
||||
colIndex: "#",
|
||||
colTitle: "Title",
|
||||
colChannel: "Channel",
|
||||
colDuration: "Duration",
|
||||
colViews: "Views",
|
||||
colPublished: "Published",
|
||||
colCategory: "Category",
|
||||
colLikes: "Likes",
|
||||
colAddedBy: "Added by",
|
||||
colVotes: "Votes",
|
||||
filterTitle: "Search title...",
|
||||
filterChannel: "Channel...",
|
||||
filterAddedBy: "Added by...",
|
||||
filterCategory: "Category...",
|
||||
badgeLive: "LIVE",
|
||||
headerVideos: "videos",
|
||||
headerLoading: "loading…",
|
||||
fetchViews: "Fetch all details",
|
||||
fetchViewsProgress: "Fetching…",
|
||||
fetchViewsDone: "Done",
|
||||
colSettings: "View",
|
||||
colSettingsReset: "Reset",
|
||||
statsDuration: "Total",
|
||||
statsChannels: "Channels",
|
||||
statsPlayable: "Playable",
|
||||
statsTotalViews: "Total views",
|
||||
statsDetail: "Details",
|
||||
statsDetailChannelRank: "By channel",
|
||||
statsDetailAddedByRank: "By contributor",
|
||||
statsDetailCategoryBreak: "By category",
|
||||
statsDetailDurationAvg: "Avg. duration",
|
||||
statsDetailDurationMedian: "Median",
|
||||
statsDetailVideos: "videos",
|
||||
},
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -1,21 +1,19 @@
|
|||
import type { PlaylistData } from "../../types/playlist";
|
||||
import type { PlaylistData, PlaylistVideo } from "../../types/playlist";
|
||||
import { injectStyles } from "./styles";
|
||||
import { renderPlaylistTable } from "./table-renderer";
|
||||
import type { DetailUpdate } from "../../types/playlist";
|
||||
import { renderPlaylistTable, loadColumnPrefs, type PlaylistTableHandle } from "./table-renderer";
|
||||
|
||||
const CONTAINER_ID = "ytpf-playlist-table";
|
||||
|
||||
export function mountTable(data: PlaylistData): void {
|
||||
unmountTable();
|
||||
injectStyles();
|
||||
let currentHandle: PlaylistTableHandle | null = null;
|
||||
|
||||
const el = renderPlaylistTable(data);
|
||||
el.id = CONTAINER_ID;
|
||||
|
||||
// Primary: before ytd-playlist-video-list-renderer (sibling)
|
||||
const videoList = document.querySelector("ytd-playlist-video-list-renderer");
|
||||
if (videoList?.parentElement) {
|
||||
videoList.parentElement.insertBefore(el, videoList);
|
||||
return;
|
||||
function findAnchor(): { parent: Element; before: Element | null } | null {
|
||||
// Primary: top of ytd-item-section-renderer (before any header/content)
|
||||
const itemSection = document.querySelector(
|
||||
"ytd-section-list-renderer ytd-item-section-renderer",
|
||||
);
|
||||
if (itemSection) {
|
||||
return { parent: itemSection, before: itemSection.firstElementChild };
|
||||
}
|
||||
|
||||
// Fallback: end of ytd-section-list-renderer > #contents
|
||||
|
|
@ -23,8 +21,7 @@ export function mountTable(data: PlaylistData): void {
|
|||
"ytd-section-list-renderer > #contents",
|
||||
);
|
||||
if (sectionContents) {
|
||||
sectionContents.appendChild(el);
|
||||
return;
|
||||
return { parent: sectionContents, before: null };
|
||||
}
|
||||
|
||||
// Last resort: #primary
|
||||
|
|
@ -32,14 +29,67 @@ export function mountTable(data: PlaylistData): void {
|
|||
"ytd-two-column-browse-results-renderer > #primary",
|
||||
);
|
||||
if (primary) {
|
||||
primary.appendChild(el);
|
||||
return { parent: primary, before: null };
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
|
||||
function insertAt(el: HTMLElement, anchor: { parent: Element; before: Element | null }): void {
|
||||
anchor.parent.insertBefore(el, anchor.before);
|
||||
}
|
||||
|
||||
let pendingObserver: MutationObserver | null = null;
|
||||
|
||||
export async function mountTable(data: PlaylistData): Promise<void> {
|
||||
unmountTable();
|
||||
injectStyles();
|
||||
|
||||
const prefs = await loadColumnPrefs();
|
||||
currentHandle = renderPlaylistTable(data, prefs);
|
||||
const el = currentHandle.element;
|
||||
el.id = CONTAINER_ID;
|
||||
|
||||
const anchor = findAnchor();
|
||||
if (anchor) {
|
||||
insertAt(el, anchor);
|
||||
return;
|
||||
}
|
||||
|
||||
console.warn("[yt-playlist-features] Could not find anchor to mount table");
|
||||
// DOM not ready yet — wait for the anchor element to appear
|
||||
pendingObserver = new MutationObserver(() => {
|
||||
const a = findAnchor();
|
||||
if (a) {
|
||||
pendingObserver!.disconnect();
|
||||
pendingObserver = null;
|
||||
insertAt(el, a);
|
||||
}
|
||||
});
|
||||
pendingObserver.observe(document.body, { childList: true, subtree: true });
|
||||
}
|
||||
|
||||
export function appendToTable(newVideos: PlaylistVideo[]): void {
|
||||
currentHandle?.appendVideos(newVideos);
|
||||
}
|
||||
|
||||
export function setTableComplete(extractedCount: number): void {
|
||||
currentHandle?.setComplete(extractedCount);
|
||||
}
|
||||
|
||||
export function updateTableDetails(updates: DetailUpdate[]): void {
|
||||
currentHandle?.updateDetails(updates);
|
||||
}
|
||||
|
||||
export function updateVoteStatuses(statuses: { setVideoId: string; voteStatus: "up" | "down" | null }[]): void {
|
||||
currentHandle?.updateVoteStatuses(statuses);
|
||||
}
|
||||
|
||||
export function unmountTable(): void {
|
||||
if (pendingObserver) {
|
||||
pendingObserver.disconnect();
|
||||
pendingObserver = null;
|
||||
}
|
||||
currentHandle = null;
|
||||
document.getElementById(CONTAINER_ID)?.remove();
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -49,6 +49,208 @@ html[dark] .ytpf-toggle {
|
|||
transform: rotate(-90deg);
|
||||
}
|
||||
|
||||
.ytpf-stats {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
padding: 6px 16px;
|
||||
flex-wrap: wrap;
|
||||
border-bottom: 1px solid var(--yt-spec-10-percent-layer, rgba(0,0,0,0.06));
|
||||
}
|
||||
|
||||
html[dark] .ytpf-stats {
|
||||
border-bottom-color: rgba(255,255,255,0.06);
|
||||
}
|
||||
|
||||
.ytpf-stats--hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.ytpf-stat {
|
||||
font-size: 12px;
|
||||
color: var(--yt-spec-text-secondary, #606060);
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
html[dark] .ytpf-stat {
|
||||
color: #aaa;
|
||||
}
|
||||
|
||||
.ytpf-stat-value {
|
||||
font-family: "Roboto Mono", monospace;
|
||||
color: var(--yt-spec-text-primary, #0f0f0f);
|
||||
}
|
||||
|
||||
html[dark] .ytpf-stat-value {
|
||||
color: #f1f1f1;
|
||||
}
|
||||
|
||||
.ytpf-stats-detail-btn {
|
||||
padding: 2px 8px;
|
||||
border: 1px solid var(--yt-spec-10-percent-layer, rgba(0,0,0,0.2));
|
||||
border-radius: 12px;
|
||||
background: transparent;
|
||||
color: var(--yt-spec-text-secondary, #606060);
|
||||
font-size: 11px;
|
||||
font-family: "Roboto", "Arial", sans-serif;
|
||||
cursor: pointer;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
html[dark] .ytpf-stats-detail-btn {
|
||||
border-color: rgba(255,255,255,0.2);
|
||||
color: #aaa;
|
||||
}
|
||||
|
||||
.ytpf-stats-detail-btn:hover {
|
||||
background: var(--yt-spec-badge-chip-background, #f2f2f2);
|
||||
}
|
||||
|
||||
html[dark] .ytpf-stats-detail-btn:hover {
|
||||
background: #3e3e3e;
|
||||
}
|
||||
|
||||
.ytpf-stats-spacer {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.ytpf-detail-popup {
|
||||
position: fixed;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
background: #fff;
|
||||
border: 1px solid rgba(0,0,0,0.1);
|
||||
border-radius: 12px;
|
||||
padding: 20px 24px;
|
||||
min-width: 360px;
|
||||
max-width: 560px;
|
||||
max-height: 70vh;
|
||||
overflow-y: auto;
|
||||
z-index: 3000;
|
||||
box-shadow: 0 8px 24px rgba(0,0,0,0.2);
|
||||
font-family: "Roboto", "Arial", sans-serif;
|
||||
font-size: 13px;
|
||||
color: var(--yt-spec-text-primary, #0f0f0f);
|
||||
}
|
||||
|
||||
html[dark] .ytpf-detail-popup {
|
||||
background: #212121;
|
||||
border-color: rgba(255,255,255,0.1);
|
||||
box-shadow: 0 8px 24px rgba(0,0,0,0.5);
|
||||
color: #f1f1f1;
|
||||
}
|
||||
|
||||
.ytpf-detail-popup-backdrop {
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
background: rgba(0,0,0,0.4);
|
||||
z-index: 2999;
|
||||
}
|
||||
|
||||
.ytpf-detail-popup h3 {
|
||||
font-size: 15px;
|
||||
font-weight: 500;
|
||||
margin: 0 0 16px;
|
||||
}
|
||||
|
||||
.ytpf-detail-section {
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.ytpf-detail-section:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.ytpf-detail-section-title {
|
||||
font-size: 12px;
|
||||
font-weight: 500;
|
||||
color: var(--yt-spec-text-secondary, #606060);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
html[dark] .ytpf-detail-section-title {
|
||||
color: #aaa;
|
||||
}
|
||||
|
||||
.ytpf-detail-bar-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
margin-bottom: 3px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.ytpf-detail-bar-label {
|
||||
width: 140px;
|
||||
flex-shrink: 0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.ytpf-detail-bar-track {
|
||||
flex: 1;
|
||||
height: 14px;
|
||||
background: var(--yt-spec-10-percent-layer, rgba(0,0,0,0.06));
|
||||
border-radius: 3px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
html[dark] .ytpf-detail-bar-track {
|
||||
background: rgba(255,255,255,0.08);
|
||||
}
|
||||
|
||||
.ytpf-detail-bar-fill {
|
||||
height: 100%;
|
||||
border-radius: 3px;
|
||||
background: var(--yt-spec-call-to-action, #065fd4);
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
html[dark] .ytpf-detail-bar-fill {
|
||||
background: #3ea6ff;
|
||||
}
|
||||
|
||||
.ytpf-detail-bar-count {
|
||||
width: 48px;
|
||||
flex-shrink: 0;
|
||||
text-align: right;
|
||||
font-family: "Roboto Mono", monospace;
|
||||
font-size: 11px;
|
||||
color: var(--yt-spec-text-secondary, #606060);
|
||||
}
|
||||
|
||||
html[dark] .ytpf-detail-bar-count {
|
||||
color: #aaa;
|
||||
}
|
||||
|
||||
.ytpf-detail-kv {
|
||||
display: flex;
|
||||
gap: 12px;
|
||||
flex-wrap: wrap;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.ytpf-detail-kv-item {
|
||||
color: var(--yt-spec-text-secondary, #606060);
|
||||
}
|
||||
|
||||
html[dark] .ytpf-detail-kv-item {
|
||||
color: #aaa;
|
||||
}
|
||||
|
||||
.ytpf-detail-kv-value {
|
||||
font-family: "Roboto Mono", monospace;
|
||||
color: var(--yt-spec-text-primary, #0f0f0f);
|
||||
}
|
||||
|
||||
html[dark] .ytpf-detail-kv-value {
|
||||
color: #f1f1f1;
|
||||
}
|
||||
|
||||
.ytpf-filters {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
|
|
@ -242,6 +444,7 @@ html[dark] .ytpf-filter-count {
|
|||
}
|
||||
|
||||
.ytpf-th {
|
||||
position: relative;
|
||||
text-align: left;
|
||||
padding: 8px 12px;
|
||||
font-weight: 500;
|
||||
|
|
@ -307,8 +510,249 @@ html[dark] .ytpf-tr:hover {
|
|||
.ytpf-col-title { width: auto; }
|
||||
.ytpf-col-channel { width: 180px; }
|
||||
.ytpf-col-duration { width: 80px; font-family: "Roboto Mono", monospace; }
|
||||
.ytpf-col-views { width: 120px; text-align: right; font-family: "Roboto Mono", monospace; }
|
||||
.ytpf-col-published { width: 110px; font-family: "Roboto Mono", monospace; }
|
||||
.ytpf-col-category { width: 120px; }
|
||||
.ytpf-col-likes { width: 90px; text-align: right; font-family: "Roboto Mono", monospace; }
|
||||
.ytpf-col-addedby { width: 140px; }
|
||||
.ytpf-col-votes { width: 60px; text-align: center; font-family: "Roboto Mono", monospace; }
|
||||
.ytpf-col-votes { width: 90px; text-align: center; font-family: "Roboto Mono", monospace; }
|
||||
|
||||
.ytpf-vote {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 2px;
|
||||
}
|
||||
|
||||
.ytpf-vote-btn {
|
||||
padding: 0;
|
||||
border: none;
|
||||
background: transparent;
|
||||
color: var(--yt-spec-text-secondary, #606060);
|
||||
font-size: 10px;
|
||||
line-height: 1;
|
||||
cursor: pointer;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
html[dark] .ytpf-vote-btn {
|
||||
color: #aaa;
|
||||
}
|
||||
|
||||
.ytpf-vote-btn:hover:not(:disabled) {
|
||||
background: var(--yt-spec-badge-chip-background, #f2f2f2);
|
||||
color: var(--yt-spec-text-primary, #0f0f0f);
|
||||
}
|
||||
|
||||
html[dark] .ytpf-vote-btn:hover:not(:disabled) {
|
||||
background: #3e3e3e;
|
||||
color: #f1f1f1;
|
||||
}
|
||||
|
||||
.ytpf-vote-btn:disabled {
|
||||
opacity: 0.3;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.ytpf-vote-count {
|
||||
min-width: 16px;
|
||||
text-align: center;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.ytpf-vote-count--voted {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.ytpf-vote-btn--active {
|
||||
color: var(--yt-spec-call-to-action, #065fd4);
|
||||
}
|
||||
|
||||
html[dark] .ytpf-vote-btn--active {
|
||||
color: #3ea6ff;
|
||||
}
|
||||
|
||||
.ytpf-vote-btn--dim {
|
||||
opacity: 0.25;
|
||||
}
|
||||
|
||||
.ytpf-fetch-views-btn {
|
||||
padding: 4px 12px;
|
||||
border: 1px solid var(--yt-spec-10-percent-layer, rgba(0,0,0,0.2));
|
||||
border-radius: 16px;
|
||||
background: transparent;
|
||||
color: var(--yt-spec-text-secondary, #606060);
|
||||
font-size: 12px;
|
||||
font-family: "Roboto", "Arial", sans-serif;
|
||||
cursor: pointer;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
html[dark] .ytpf-fetch-views-btn {
|
||||
border-color: rgba(255,255,255,0.2);
|
||||
color: #aaa;
|
||||
}
|
||||
|
||||
.ytpf-fetch-views-btn:hover:not(:disabled) {
|
||||
background: var(--yt-spec-badge-chip-background, #f2f2f2);
|
||||
}
|
||||
|
||||
html[dark] .ytpf-fetch-views-btn:hover:not(:disabled) {
|
||||
background: #3e3e3e;
|
||||
}
|
||||
|
||||
.ytpf-fetch-views-btn:disabled {
|
||||
opacity: 0.6;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.ytpf-menu-anchor {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.ytpf-menu-btn {
|
||||
padding: 4px 8px;
|
||||
border: none;
|
||||
background: transparent;
|
||||
color: var(--yt-spec-text-secondary, #606060);
|
||||
font-size: 20px;
|
||||
line-height: 1;
|
||||
cursor: pointer;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.ytpf-menu-btn:hover {
|
||||
background: var(--yt-spec-badge-chip-background, #f2f2f2);
|
||||
}
|
||||
|
||||
html[dark] .ytpf-menu-btn {
|
||||
color: #aaa;
|
||||
}
|
||||
|
||||
html[dark] .ytpf-menu-btn:hover {
|
||||
background: #3e3e3e;
|
||||
}
|
||||
|
||||
.ytpf-menu {
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
right: 0;
|
||||
margin-top: 4px;
|
||||
background: #fff;
|
||||
border: 1px solid rgba(0,0,0,0.1);
|
||||
border-radius: 8px;
|
||||
padding: 4px 0;
|
||||
min-width: 160px;
|
||||
z-index: 2001;
|
||||
box-shadow: 0 4px 12px rgba(0,0,0,0.15);
|
||||
}
|
||||
|
||||
html[dark] .ytpf-menu {
|
||||
background: #282828;
|
||||
border-color: rgba(255,255,255,0.1);
|
||||
box-shadow: 0 4px 12px rgba(0,0,0,0.4);
|
||||
}
|
||||
|
||||
.ytpf-menu-heading {
|
||||
padding: 6px 12px 2px;
|
||||
font-size: 11px;
|
||||
font-weight: 500;
|
||||
color: var(--yt-spec-text-secondary, #606060);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
}
|
||||
|
||||
html[dark] .ytpf-menu-heading {
|
||||
color: #aaa;
|
||||
}
|
||||
|
||||
.ytpf-menu-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
padding: 5px 12px;
|
||||
font-size: 13px;
|
||||
color: var(--yt-spec-text-primary, #0f0f0f);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
html[dark] .ytpf-menu-item {
|
||||
color: #f1f1f1;
|
||||
}
|
||||
|
||||
.ytpf-menu-item:hover {
|
||||
background: var(--yt-spec-badge-chip-background, #f2f2f2);
|
||||
}
|
||||
|
||||
html[dark] .ytpf-menu-item:hover {
|
||||
background: #3e3e3e;
|
||||
}
|
||||
|
||||
.ytpf-menu-item input[type="checkbox"] {
|
||||
margin: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.ytpf-menu-sep {
|
||||
height: 1px;
|
||||
margin: 4px 0;
|
||||
background: var(--yt-spec-10-percent-layer, rgba(0,0,0,0.1));
|
||||
}
|
||||
|
||||
html[dark] .ytpf-menu-sep {
|
||||
background: rgba(255,255,255,0.1);
|
||||
}
|
||||
|
||||
.ytpf-menu-action {
|
||||
display: block;
|
||||
width: 100%;
|
||||
padding: 5px 12px;
|
||||
border: none;
|
||||
background: transparent;
|
||||
color: var(--yt-spec-text-secondary, #606060);
|
||||
font-size: 12px;
|
||||
font-family: "Roboto", "Arial", sans-serif;
|
||||
cursor: pointer;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
html[dark] .ytpf-menu-action {
|
||||
color: #aaa;
|
||||
}
|
||||
|
||||
.ytpf-menu-action:hover {
|
||||
background: var(--yt-spec-badge-chip-background, #f2f2f2);
|
||||
}
|
||||
|
||||
html[dark] .ytpf-menu-action:hover {
|
||||
background: #3e3e3e;
|
||||
}
|
||||
|
||||
.ytpf-resize-handle {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: -2px;
|
||||
width: 5px;
|
||||
height: 100%;
|
||||
cursor: col-resize;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.ytpf-resize-handle:hover,
|
||||
.ytpf-resize-handle--active {
|
||||
background: var(--yt-spec-call-to-action, #065fd4);
|
||||
opacity: 0.4;
|
||||
}
|
||||
|
||||
html[dark] .ytpf-resize-handle:hover,
|
||||
html[dark] .ytpf-resize-handle--active {
|
||||
background: #3ea6ff;
|
||||
opacity: 0.4;
|
||||
}
|
||||
.ytpf-tr--unplayable {
|
||||
opacity: 0.45;
|
||||
}
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
|
|
@ -16,9 +16,58 @@
|
|||
w.__yt_playlist_ext_injected = true;
|
||||
|
||||
let extractingUrl: string | null = null;
|
||||
let isInitialLoad = true;
|
||||
let collabCache: Map<string, string> = new Map();
|
||||
let collabCachePlaylistId: string | null = null;
|
||||
|
||||
// Cache vote feedback tokens per setVideoId
|
||||
interface VoteFeedback {
|
||||
upToken: string | null;
|
||||
upToggledToken: string | null;
|
||||
downToken: string | null;
|
||||
downToggledToken: string | null;
|
||||
isUpToggled: boolean;
|
||||
isDownToggled: boolean;
|
||||
}
|
||||
const voteFeedbackCache = new Map<string, VoteFeedback>();
|
||||
|
||||
function extractTokenFromButtonVM(model: any): string | null {
|
||||
return model?.buttonViewModel?.onTap?.innertubeCommand
|
||||
?.feedbackEndpoint?.feedbackToken ?? null;
|
||||
}
|
||||
|
||||
/** Extract vote feedback tokens from playlistVideoRenderer.engagementBar */
|
||||
function extractVoteInfo(renderer: any): "up" | "down" | null {
|
||||
const setVideoId = renderer.setVideoId;
|
||||
if (!setVideoId) return null;
|
||||
|
||||
const actions = renderer.engagementBar?.engagementBarViewModel?.actions;
|
||||
if (!actions) return null;
|
||||
|
||||
for (const action of actions) {
|
||||
const voting = action.votingViewModel;
|
||||
if (!voting) continue;
|
||||
|
||||
const up = voting.upvoteButton?.toggleButtonViewModel;
|
||||
const down = voting.downvoteButton?.toggleButtonViewModel;
|
||||
|
||||
const info: VoteFeedback = {
|
||||
upToken: extractTokenFromButtonVM(up?.defaultButtonViewModel),
|
||||
upToggledToken: extractTokenFromButtonVM(up?.toggledButtonViewModel),
|
||||
downToken: extractTokenFromButtonVM(down?.defaultButtonViewModel),
|
||||
downToggledToken: extractTokenFromButtonVM(down?.toggledButtonViewModel),
|
||||
isUpToggled: !!up?.isToggled,
|
||||
isDownToggled: !!down?.isToggled,
|
||||
};
|
||||
|
||||
if (info.upToken || info.downToken) {
|
||||
voteFeedbackCache.set(setVideoId, info);
|
||||
return info.isUpToggled ? "up" : info.isDownToggled ? "down" : null;
|
||||
}
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
function runExtraction() {
|
||||
if (!isPlaylistUrl()) return;
|
||||
const url = window.location.href;
|
||||
|
|
@ -64,12 +113,13 @@
|
|||
const { cfg, apiKey, baseContext } = getConfig();
|
||||
const authHeaders = buildAuthHeaders(cfg, baseContext);
|
||||
|
||||
// Try ytInitialData first (works on initial page load)
|
||||
let initialData = w.ytInitialData;
|
||||
// Try ytInitialData only on initial page load.
|
||||
// On SPA navigation ytInitialData is stale (still holds the previous page's data),
|
||||
// so we must always fetch fresh data via the browse API.
|
||||
let initialData = isInitialLoad ? w.ytInitialData : null;
|
||||
let videoList = initialData ? findVideoListContents(initialData) : null;
|
||||
isInitialLoad = false;
|
||||
|
||||
// If ytInitialData doesn't have the video list (SPA navigation),
|
||||
// fetch the playlist data ourselves via the browse API
|
||||
if (!videoList) {
|
||||
const playlistId = getPlaylistId();
|
||||
if (!playlistId) {
|
||||
|
|
@ -94,13 +144,13 @@
|
|||
}
|
||||
}
|
||||
|
||||
const allRenderers: any[] = [];
|
||||
const firstPageRenderers: any[] = [];
|
||||
let continuation: string | null = null;
|
||||
let continuationClickTracking: string | null = null;
|
||||
|
||||
for (const item of videoList) {
|
||||
if (item.playlistVideoRenderer) {
|
||||
allRenderers.push(item.playlistVideoRenderer);
|
||||
firstPageRenderers.push(item.playlistVideoRenderer);
|
||||
}
|
||||
if (item.continuationItemRenderer) {
|
||||
const extracted = extractContinuationInfo(item.continuationItemRenderer);
|
||||
|
|
@ -109,7 +159,60 @@
|
|||
}
|
||||
}
|
||||
|
||||
// Fetch remaining pages
|
||||
// Fetch collaborator names for collaborative playlists
|
||||
const avatarToName = await fetchCollaboratorMap(initialData, cfg, baseContext, authHeaders);
|
||||
|
||||
function parseVideoInfo(videoInfo: any): { viewCountText: string | null } {
|
||||
if (!videoInfo) return { viewCountText: null };
|
||||
if (!videoInfo.runs) {
|
||||
const text = textOf(videoInfo);
|
||||
return { viewCountText: text || null };
|
||||
}
|
||||
const runs: string[] = videoInfo.runs.map((r: any) => r.text);
|
||||
// Runs format: ["126万 回視聴", " · ", "6年前"]
|
||||
return { viewCountText: runs[0]?.trim() || null };
|
||||
}
|
||||
|
||||
function mapRenderers(renderers: any[], startIndex: number) {
|
||||
return renderers.map((d, i) => {
|
||||
const { viewCountText } = parseVideoInfo(d.videoInfo);
|
||||
const voteStatus = extractVoteInfo(d);
|
||||
return {
|
||||
videoId: d.videoId,
|
||||
title: textOf(d.title),
|
||||
index: startIndex + i,
|
||||
lengthSeconds: d.lengthSeconds ? parseInt(d.lengthSeconds, 10) : null,
|
||||
lengthText: textOf(d.lengthText),
|
||||
thumbnails: d.thumbnail?.thumbnails ?? [],
|
||||
shortBylineText: d.shortBylineText,
|
||||
isPlayable: d.isPlayable !== false,
|
||||
badges: d.badges ?? [],
|
||||
viewCountText,
|
||||
publishedAt: null as string | null,
|
||||
category: null as string | null,
|
||||
voteCount: typeof d.voteCount === "number" ? d.voteCount : null,
|
||||
addedBy: resolveAddedBy(d, avatarToName),
|
||||
setVideoId: d.setVideoId ?? null,
|
||||
voteStatus,
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
// Send first page immediately
|
||||
const hasContinuation = !!continuation;
|
||||
const firstPageVideos = mapRenderers(firstPageRenderers, 0);
|
||||
console.log(LOG, `First page: ${firstPageVideos.length} videos (has more: ${hasContinuation})`);
|
||||
|
||||
sendResult({
|
||||
videos: firstPageVideos,
|
||||
initialData,
|
||||
innertubeApiKey: apiKey,
|
||||
innertubeContext: baseContext,
|
||||
isComplete: !hasContinuation,
|
||||
});
|
||||
|
||||
// Fetch remaining pages lazily and send incremental updates
|
||||
let totalCount = firstPageVideos.length;
|
||||
let page = 1;
|
||||
while (continuation && page < 50) {
|
||||
try {
|
||||
|
|
@ -132,12 +235,13 @@
|
|||
continuation = null;
|
||||
continuationClickTracking = null;
|
||||
|
||||
const pageRenderers: any[] = [];
|
||||
for (const action of data.onResponseReceivedActions ?? []) {
|
||||
const items = action?.appendContinuationItemsAction?.continuationItems;
|
||||
if (!items) continue;
|
||||
for (const item of items) {
|
||||
if (item.playlistVideoRenderer) {
|
||||
allRenderers.push(item.playlistVideoRenderer);
|
||||
pageRenderers.push(item.playlistVideoRenderer);
|
||||
}
|
||||
if (item.continuationItemRenderer) {
|
||||
const extracted = extractContinuationInfo(item.continuationItemRenderer);
|
||||
|
|
@ -146,38 +250,27 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
const pageVideos = mapRenderers(pageRenderers, totalCount);
|
||||
totalCount += pageVideos.length;
|
||||
|
||||
console.log(LOG, `Continuation page ${page}: +${pageVideos.length} videos (total: ${totalCount})`);
|
||||
sendResult({
|
||||
type: "append",
|
||||
videos: pageVideos,
|
||||
isComplete: !continuation,
|
||||
totalCount,
|
||||
});
|
||||
|
||||
page++;
|
||||
} catch (e) {
|
||||
console.error(LOG, `Continuation page ${page} failed:`, e);
|
||||
// Send completion even on error so the loading indicator goes away
|
||||
sendResult({ type: "append", videos: [], isComplete: true, totalCount });
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
// Fetch collaborator names for collaborative playlists
|
||||
const avatarToName = await fetchCollaboratorMap(initialData, cfg, baseContext, authHeaders);
|
||||
|
||||
const videos = allRenderers.map((d, i) => ({
|
||||
videoId: d.videoId,
|
||||
title: textOf(d.title),
|
||||
index: i,
|
||||
lengthSeconds: d.lengthSeconds ? parseInt(d.lengthSeconds, 10) : null,
|
||||
lengthText: textOf(d.lengthText),
|
||||
thumbnails: d.thumbnail?.thumbnails ?? [],
|
||||
shortBylineText: d.shortBylineText,
|
||||
isPlayable: d.isPlayable !== false,
|
||||
badges: d.badges ?? [],
|
||||
voteCount: typeof d.voteCount === "number" ? d.voteCount : null,
|
||||
addedBy: resolveAddedBy(d, avatarToName),
|
||||
}));
|
||||
|
||||
console.log(LOG, `Extraction: ${videos.length} videos (${page - 1} continuation pages)`);
|
||||
|
||||
sendResult({
|
||||
videos,
|
||||
initialData,
|
||||
innertubeApiKey: apiKey,
|
||||
innertubeContext: baseContext,
|
||||
});
|
||||
}
|
||||
|
||||
// --- helpers ---
|
||||
|
|
@ -487,4 +580,82 @@
|
|||
}),
|
||||
);
|
||||
}
|
||||
|
||||
// Vote handler: content script dispatches this event to vote on collaborative playlist videos
|
||||
document.addEventListener("__yt_playlist_ext_vote", async (event: Event) => {
|
||||
const { setVideoId, action } = JSON.parse(
|
||||
(event as CustomEvent).detail,
|
||||
);
|
||||
const { cfg, baseContext } = getConfig();
|
||||
const authHeaders = buildAuthHeaders(cfg, baseContext);
|
||||
|
||||
const cached = voteFeedbackCache.get(setVideoId);
|
||||
if (!cached) {
|
||||
console.warn(LOG, `No vote feedback tokens for ${setVideoId}`);
|
||||
sendVoteResult(setVideoId, false, null);
|
||||
return;
|
||||
}
|
||||
|
||||
// Pick the correct feedbackToken based on action and current toggle state
|
||||
let feedbackToken: string | null = null;
|
||||
if (action === "up") {
|
||||
feedbackToken = cached.isUpToggled ? cached.upToggledToken : cached.upToken;
|
||||
} else {
|
||||
feedbackToken = cached.isDownToggled ? cached.downToggledToken : cached.downToken;
|
||||
}
|
||||
|
||||
if (!feedbackToken) {
|
||||
console.warn(LOG, `No feedback token for ${action} on ${setVideoId}`);
|
||||
sendVoteResult(setVideoId, false, null);
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
const res = await fetch(
|
||||
"https://www.youtube.com/youtubei/v1/feedback?prettyPrint=false",
|
||||
{
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
...authHeaders,
|
||||
},
|
||||
credentials: "same-origin",
|
||||
body: JSON.stringify({
|
||||
context: baseContext,
|
||||
feedbackTokens: [feedbackToken],
|
||||
isFeedbackTokenUnencrypted: false,
|
||||
}),
|
||||
},
|
||||
);
|
||||
|
||||
const data = await res.json();
|
||||
const success = res.ok && Array.isArray(data?.feedbackResponses);
|
||||
|
||||
if (success) {
|
||||
// Update cached toggle state
|
||||
if (action === "up") {
|
||||
cached.isUpToggled = !cached.isUpToggled;
|
||||
if (cached.isUpToggled) cached.isDownToggled = false;
|
||||
} else {
|
||||
cached.isDownToggled = !cached.isDownToggled;
|
||||
if (cached.isDownToggled) cached.isUpToggled = false;
|
||||
}
|
||||
}
|
||||
|
||||
const newStatus = cached.isUpToggled ? "up" : cached.isDownToggled ? "down" : null;
|
||||
console.log(LOG, `Vote ${action} on ${setVideoId}: ${success ? "OK" : "FAILED"} → ${newStatus}`);
|
||||
sendVoteResult(setVideoId, success, newStatus);
|
||||
} catch (e) {
|
||||
console.error(LOG, "Vote failed:", e);
|
||||
sendVoteResult(setVideoId, false, null);
|
||||
}
|
||||
});
|
||||
|
||||
function sendVoteResult(setVideoId: string, success: boolean, newVoteStatus: string | null) {
|
||||
document.dispatchEvent(
|
||||
new CustomEvent("__yt_playlist_ext_vote_result", {
|
||||
detail: JSON.stringify({ setVideoId, success, newVoteStatus }),
|
||||
}),
|
||||
);
|
||||
}
|
||||
})();
|
||||
|
|
|
|||
87
src/options/options.html
Normal file
87
src/options/options.html
Normal file
|
|
@ -0,0 +1,87 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<style>
|
||||
body {
|
||||
font-family: "Roboto", "Arial", sans-serif;
|
||||
font-size: 14px;
|
||||
padding: 16px;
|
||||
min-width: 360px;
|
||||
color: #333;
|
||||
}
|
||||
h2 {
|
||||
font-size: 16px;
|
||||
margin: 0 0 12px;
|
||||
}
|
||||
label {
|
||||
display: block;
|
||||
font-size: 12px;
|
||||
color: #606060;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
input[type="text"] {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 8px 10px;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 6px;
|
||||
font-size: 13px;
|
||||
font-family: "Roboto Mono", monospace;
|
||||
}
|
||||
.hint {
|
||||
font-size: 11px;
|
||||
color: #999;
|
||||
margin-top: 4px;
|
||||
}
|
||||
.actions {
|
||||
margin-top: 12px;
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
}
|
||||
button {
|
||||
padding: 6px 16px;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 16px;
|
||||
background: #fff;
|
||||
font-size: 13px;
|
||||
cursor: pointer;
|
||||
}
|
||||
button:hover {
|
||||
background: #f2f2f2;
|
||||
}
|
||||
button.primary {
|
||||
background: #065fd4;
|
||||
color: #fff;
|
||||
border-color: #065fd4;
|
||||
}
|
||||
button.primary:hover {
|
||||
background: #0554b8;
|
||||
}
|
||||
.status {
|
||||
font-size: 12px;
|
||||
margin-top: 8px;
|
||||
color: #1a8a1a;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<h2>YT Playlist Features</h2>
|
||||
<label for="apiKey">YouTube Data API Key</label>
|
||||
<input type="text" id="apiKey" placeholder="..." />
|
||||
<div class="hint">
|
||||
Leave blank to use the default key.
|
||||
<a
|
||||
href="https://console.cloud.google.com/apis/credentials"
|
||||
target="_blank"
|
||||
>Get your own key</a
|
||||
>
|
||||
</div>
|
||||
<div class="actions">
|
||||
<button class="primary" id="save">Save</button>
|
||||
<button id="clear">Clear</button>
|
||||
</div>
|
||||
<div class="status" id="status"></div>
|
||||
<script src="options.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
32
src/options/options.ts
Normal file
32
src/options/options.ts
Normal file
|
|
@ -0,0 +1,32 @@
|
|||
import browser from "webextension-polyfill";
|
||||
|
||||
const input = document.getElementById("apiKey") as HTMLInputElement;
|
||||
const saveBtn = document.getElementById("save") as HTMLButtonElement;
|
||||
const clearBtn = document.getElementById("clear") as HTMLButtonElement;
|
||||
const status = document.getElementById("status") as HTMLDivElement;
|
||||
|
||||
function flash(text: string) {
|
||||
status.textContent = text;
|
||||
setTimeout(() => { status.textContent = ""; }, 2000);
|
||||
}
|
||||
|
||||
// Load
|
||||
browser.storage.sync.get("apiKey").then((result) => {
|
||||
input.value = (result.apiKey as string) || "";
|
||||
});
|
||||
|
||||
// Save
|
||||
saveBtn.addEventListener("click", () => {
|
||||
const key = input.value.trim();
|
||||
if (key) {
|
||||
browser.storage.sync.set({ apiKey: key }).then(() => flash("Saved"));
|
||||
} else {
|
||||
browser.storage.sync.remove("apiKey").then(() => flash("Using default key"));
|
||||
}
|
||||
});
|
||||
|
||||
// Clear
|
||||
clearBtn.addEventListener("click", () => {
|
||||
input.value = "";
|
||||
browser.storage.sync.remove("apiKey").then(() => flash("Cleared"));
|
||||
});
|
||||
18
src/shared/category-map.ts
Normal file
18
src/shared/category-map.ts
Normal file
|
|
@ -0,0 +1,18 @@
|
|||
/** YouTube video category ID to name mapping */
|
||||
export const CATEGORY_MAP: Record<string, string> = {
|
||||
"1": "Film & Animation",
|
||||
"2": "Autos & Vehicles",
|
||||
"10": "Music",
|
||||
"15": "Pets & Animals",
|
||||
"17": "Sports",
|
||||
"19": "Travel & Events",
|
||||
"20": "Gaming",
|
||||
"22": "People & Blogs",
|
||||
"23": "Comedy",
|
||||
"24": "Entertainment",
|
||||
"25": "News & Politics",
|
||||
"26": "Howto & Style",
|
||||
"27": "Education",
|
||||
"28": "Science & Technology",
|
||||
"29": "Nonprofits & Activism",
|
||||
};
|
||||
|
|
@ -1,3 +1,7 @@
|
|||
import type { PlaylistData } from "../types/playlist";
|
||||
import type { PlaylistData, DetailUpdate } from "../types/playlist";
|
||||
|
||||
export type Message = { type: "PLAYLIST_EXTRACTED"; data: PlaylistData };
|
||||
export type Message =
|
||||
| { type: "PLAYLIST_EXTRACTED"; data: PlaylistData }
|
||||
| { type: "FETCH_VIDEO_DETAILS"; videoIds: string[] }
|
||||
| { type: "VIDEO_DETAILS_UPDATE"; updates: DetailUpdate[] }
|
||||
| { type: "VIDEO_DETAILS_ERROR"; error: string };
|
||||
|
|
|
|||
|
|
@ -21,10 +21,22 @@ export interface PlaylistVideo {
|
|||
};
|
||||
isPlayable: boolean;
|
||||
isLive: boolean;
|
||||
/** Human-readable view count text */
|
||||
viewCountText: string | null;
|
||||
/** Publication date, e.g. "2019-01-15" */
|
||||
publishedAt: string | null;
|
||||
/** Video category, e.g. "Music", "Gaming" */
|
||||
category: string | null;
|
||||
/** Name of the collaborator who added this video (collaborative playlists only) */
|
||||
addedBy: string | null;
|
||||
/** Vote count / approvals (collaborative playlists only) */
|
||||
voteCount: number | null;
|
||||
/** Playlist-specific video ID for operations (vote, reorder, etc.) */
|
||||
setVideoId: string | null;
|
||||
/** Current user's vote status on collaborative playlists */
|
||||
voteStatus: "up" | "down" | null;
|
||||
/** Like count from Data API */
|
||||
likeCount: number | null;
|
||||
}
|
||||
|
||||
export interface PlaylistMetadata {
|
||||
|
|
@ -44,6 +56,14 @@ export interface PlaylistMetadata {
|
|||
privacy: "public" | "unlisted" | "private" | "unknown";
|
||||
}
|
||||
|
||||
export interface DetailUpdate {
|
||||
videoId: string;
|
||||
viewCountText: string | null;
|
||||
publishedAt: string | null;
|
||||
category: string | null;
|
||||
likeCount: number | null;
|
||||
}
|
||||
|
||||
export interface PlaylistData {
|
||||
metadata: PlaylistMetadata;
|
||||
videos: PlaylistVideo[];
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user