Greasy Fork is available in English.
Batch download all images and videos from a Twitter/X account, including withheld accounts, in original quality.
当前为
// ==UserScript== // @name Twitter/X Media Batch Downloader // @description Batch download all images and videos from a Twitter/X account, including withheld accounts, in original quality. // @icon https://raw.githubusercontent.com/afkarxyz/Twitter-X-Media-Batch-Downloader/refs/heads/main/Archived/icon.svg // @version 4.5 // @author afkarxyz // @namespace https://github.com/afkarxyz/userscripts/ // @supportURL https://github.com/afkarxyz/userscripts/issues // @homepageURL https://www.patreon.com/exyezed // @antifeature payment // @license MIT // @match https://twitter.com/* // @match https://x.com/* // @grant GM_xmlhttpRequest // @grant GM_setValue // @grant GM_getValue // @grant GM_download // @connect api.xbatch.online // @connect backup.xbatch.online // @connect pbs.twimg.com // @connect video.twimg.com // @require https://cdn.jsdelivr.net/npm/[email protected]/dist/jszip.min.js // ==/UserScript== (() => { const JSZip = window.JSZip; const API_URLS = { DEFAULT: "https://api.xbatch.online", BACKUP: "https://backup.xbatch.online", }; const ICONS = { PREV: `<svg style="width: 12px; height: 12px; margin-right: 6px; display: inline-block; vertical-align: middle;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"> <path fill="currentColor" d="M9.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l192 192c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L77.3 256 246.6 86.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-192 192z"/> </svg>`, NEXT: `<svg style="width: 12px; height: 12px; margin-left: 6px; display: inline-block; vertical-align: middle;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"> <path fill="currentColor" d="M310.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-192 192c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L242.7 256 73.4 86.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l192 192z"/> </svg>`, AUTO: `<svg style="width: 12px; height: 12px; margin-right: 6px; display: inline-block; vertical-align: middle;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"> <path fill="currentColor" d="M327.5 85.2c-4.5 1.7-7.5 6-7.5 10.8s3 9.1 7.5 10.8L384 128l21.2 56.5c1.7 4.5 6 7.5 10.8 7.5s9.1-3 10.8-7.5L448 128l56.5-21.2c4.5-1.7 7.5-6 7.5-10.8s-3-9.1-7.5-10.8L448 64 426.8 7.5C425.1 3 420.8 0 416 0s-9.1 3-10.8 7.5L384 64 327.5 85.2zM205.1 73.3c-2.6-5.7-8.3-9.3-14.5-9.3s-11.9 3.6-14.5 9.3L123.3 187.3 9.3 240C3.6 242.6 0 248.3 0 254.6s3.6 11.9 9.3 14.5l114.1 52.7L176 435.8c2.6 5.7 8.3 9.3 14.5 9.3s11.9-3.6 14.5-9.3l52.7-114.1 114.1-52.7c5.7-2.6 9.3-8.3 9.3-14.5s-3.6-11.9-9.3-14.5L257.8 187.4 205.1 73.3zM384 384l-56.5 21.2c-4.5 1.7-7.5 6-7.5 10.8s3 9.1 7.5 10.8L384 448l21.2 56.5c1.7 4.5 6 7.5 10.8 7.5s9.1-3 10.8-7.5L448 448l56.5-21.2c4.5-1.7 7.5-6 7.5-10.8s-3-9.1-7.5-10.8L448 384l-21.2-56.5c-1.7-4.5-6-7.5-10.8-7.5s-9.1 3-10.8 7.5L384 384z"/> </svg>`, STOP: `<svg style="width: 12px; height: 12px; margin-right: 6px; display: inline-block; vertical-align: middle;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512"> <path fill="currentColor" d="M0 128C0 92.7 28.7 64 64 64H320c35.3 0 64 28.7 64 64V384c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V128z"/> </svg>`, CLEAR: { PATH: "M135.2 17.7C140.6 6.8 151.7 0 163.8 0L284.2 0c12.1 0 23.2 6.8 28.6 17.7L320 32l96 0c17.7 0 32 14.3 32 32s-14.3 32-32 32L32 96C14.3 96 0 81.7 0 64S14.3 32 32 32l96 0 7.2-14.3zM32 128l384 0 0 320c0 35.3-28.7 64-64 64L96 512c-35.3 0-64-28.7-64-64l0-320zm96 64c-8.8 0-16 7.2-16 16l0 224c0 8.8 7.2 16 16 16s16-7.2 16-16l0-224c0-8.8-7.2-16-16-16zm96 0c-8.8 0-16 7.2-16 16l0 224c0 8.8 7.2 16 16 16s16-7.2 16-16l0-224c0-8.8-7.2-16-16-16zm96 0c-8.8 0-16 7.2-16 16l0 224c0 8.8 7.2 16 16 16s16-7.2 16-16l0-224c0-8.8-7.2-16-16-16z", VIEWBOX: "0 0 448 512", }, RESET: { PATH: "M463.5 224l8.5 0c13.3 0 24-10.7 24-24l0-128c0-9.7-5.8-18.5-14.8-22.2s-19.3-1.7-26.2 5.2L413.4 96.6c-87.6-86.5-228.7-86.2-315.8 1c-87.5 87.5-87.5 229.3 0 316.8s229.3 87.5 316.8 0c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0c-62.5 62.5-163.8 62.5-226.3 0s-62.5-163.8 0-226.3c62.2-62.2 162.7-62.5 225.3-1L327 183c-6.9 6.9-8.9 17.2-5.2 26.2s12.5 14.8 22.2 14.8l119.5 0z", VIEWBOX: "0 0 512 512", }, PATREON: { PATH: "M489.7 153.8c-.1-65.4-51-119-110.7-138.3C304.8-8.5 207-5 136.1 28.4C50.3 68.9 23.3 157.7 22.3 246.2C21.5 319 28.7 510.6 136.9 512c80.3 1 92.3-102.5 129.5-152.3c26.4-35.5 60.5-45.5 102.4-55.9c72-17.8 121.1-74.7 121-150z", VIEWBOX: "0 0 512 512", }, INFO: { PATH: "M256 48a208 208 0 1 1 0 416 208 208 0 1 1 0-416zm0 464A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM216 336c-13.3 0-24 10.7-24 24s10.7 24 24 24l80 0c13.3 0 24-10.7 24-24s-10.7-24-24-24l-8 0 0-88c0-13.3-10.7-24-24-24l-48 0c-13.3 0-24 10.7-24 24s10.7 24 24 24l24 0 0 64-24 0zm40-144a32 32 0 1 0 0-64 32 32 0 1 0 0 64z", VIEWBOX: "0 0 512 512", }, DOWNLOAD: { SECONDARY_PATH: "M0 256C0 397.4 114.6 512 256 512s256-114.6 256-256c0-17.7-14.3-32-32-32s-32 14.3-32 32c0 106-86 192-192 192S64 362 64 256c0-17.7-14.3-32-32-32s-32 14.3-32 32z", PRIMARY_PATH: "M390.6 185.4c12.5 12.5 12.5 32.8 0 45.3l-112 112c-12.5 12.5-32.8 12.5-45.3 0l-112-112c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L224 242.7 224 32c0-17.7 14.3-32 32-32s32 14.3 32 32l0 210.7 57.4-57.4c12.5-12.5 32.8-12.5 45.3 0z", VIEWBOX: "0 0 512 512", }, FETCH: { PATH: "M374.6 214.6l-128 128c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L192 242.7 192 32c0-17.7 14.3-32 32-32s32 14.3 32 32l0 210.7 73.4-73.4c12.5-12.5 32.8-12.5 45.3 0s12.5 32.8 0 45.3zM64 352l0 64c0 17.7 14.3 32 32 32l256 0c17.7 0 32-14.3 32-32l0-64c0-17.7 14.3-32 32-32s32 14.3 32 32l0 64c0 53-43 96-96 96L96 512c-53 0-96-43-96-96l0-64c0-17.7 14.3-32 32-32s32 14.3 32 32z", VIEWBOX: "0 0 448 512", }, ACCOUNT: { PATH: "M412.1 416.6C398.1 361.1 347.9 320 288 320l-64 0c-59.9 0-110.1 41.1-124.1 96.6C58 375.9 32 319 32 256C32 132.3 132.3 32 256 32s224 100.3 224 224c0 63-26 119.9-67.9 160.6zm-28.5 23.4C347.5 465.2 303.5 480 256 480s-91.5-14.8-127.7-39.9c4-49.3 45.3-88.1 95.7-88.1l64 0c50.4 0 91.6 38.8 95.7 88.1zM256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zm0-256a48 48 0 1 1 0-96 48 48 0 1 1 0 96zm-80-48a80 80 0 1 0 160 0 80 80 0 1 0 -160 0z", VIEWBOX: "0 0 512 512", }, TOTAL: { PATH: "M320 464c8.8 0 16-7.2 16-16l0-288-80 0c-17.7 0-32-14.3-32-32l0-80L64 48c-8.8 0-16 7.2-16 16l0 384c0 8.8 7.2 16 16 16l256 0zM0 64C0 28.7 28.7 0 64 0L229.5 0c17 0 33.3 6.7 45.3 18.7l90.5 90.5c12 12 18.7 28.3 18.7 45.3L384 448c0 35.3-28.7 64-64 64L64 512c-35.3 0-64-28.7-64-64L0 64z", VIEWBOX: "0 0 384 512", }, BATCH: { PATH: "M48 272L48 64c0-8.8 7.2-16 16-16l160 0 0 80c0 17.7 14.3 32 32 32l80 0 0 112L48 272zm288 48l16 0 32 0 0-165.5c0-17-6.7-33.3-18.7-45.3L274.7 18.7C262.7 6.7 246.5 0 229.5 0L64 0C28.7 0 0 28.7 0 64L0 320l32 0 16 0 288 0zM0 352l0 64 48 0 0-64L0 352zM64 512l0-48c-8.8 0-16-7.2-16-16L0 448c0 35.3 28.7 64 64 64zm256-48l0 48c35.3 0 64-28.7 64-64l-48 0c0 8.8-7.2 16-16 16zm64-112l-48 0 0 64 48 0 0-64zM96 464l0 48 80 0 0-48-80 0zm112 0l0 48 80 0 0-48-80 0z", VIEWBOX: "0 0 384 512", }, ZIP: { PATH: "M64 464c-8.8 0-16-7.2-16-16L48 64c0-8.8 7.2-16 16-16l48 0c0 8.8 7.2 16 16 16l32 0c8.8 0 16-7.2 16-16l48 0 0 80c0 17.7 14.3 32 32 32l80 0 0 288c0 8.8-7.2 16-16 16L64 464zM64 0C28.7 0 0 28.7 0 64L0 448c0 35.3 28.7 64 64 64l256 0c35.3 0 64-28.7 64-64l0-293.5c0-17-6.7-33.3-18.7-45.3L274.7 18.7C262.7 6.7 246.5 0 229.5 0L64 0zm48 112c0 8.8 7.2 16 16 16l32 0c8.8 0 16-7.2 16-16s-7.2-16-16-16l-32 0c-8.8 0-16 7.2-16 16zm0 64c0 8.8 7.2 16 16 16l32 0c8.8 0 16-7.2 16-16s-7.2-16-16-16l-32 0c-8.8 0-16 7.2-16 16zm-6.3 71.8L82.1 335.9c-1.4 5.4-2.1 10.9-2.1 16.4c0 35.2 28.8 63.7 64 63.7s64-28.5 64-63.7c0-5.5-.7-11.1-2.1-16.4l-23.5-88.2c-3.7-14-16.4-23.8-30.9-23.8l-14.8 0c-14.5 0-27.2 9.7-30.9 23.8zM128 336l32 0c8.8 0 16 7.2 16 16s-7.2 16-16 16l-32 0c-8.8 0-16-7.2-16-16s7.2-16 16-16z", VIEWBOX: "0 0 384 512", }, MEDIA_TYPE: { ALL: { PATH: "M256 48c-8.8 0-16 7.2-16 16l0 224c0 8.7 6.9 15.8 15.6 16l69.1-94.2c4.5-6.2 11.7-9.8 19.4-9.8s14.8 3.6 19.4 9.8L380 232.4l56-85.6c4.4-6.8 12-10.9 20.1-10.9s15.7 4.1 20.1 10.9L578.7 303.8c7.6-1.3 13.3-7.9 13.3-15.8l0-224c0-8.8-7.2-16-16-16L256 48zM192 64c0-35.3 28.7-64 64-64L576 0c35.3 0 64 28.7 64 64l0 224c0 35.3-28.7 64-64 64l-320 0c-35.3 0-64-28.7-64-64l0-224zm-56 64l24 0 0 48 0 88 0 112 0 8 0 80 192 0 0-80 48 0 0 80 48 0c8.8 0 16-7.2 16-16l0-64 48 0 0 64c0 35.3-28.7 64-64 64l-48 0-24 0-24 0-192 0-24 0-24 0-48 0c-35.3 0-64-28.7-64-64L0 192c0-35.3 28.7-64 64-64l48 0 24 0zm-24 48l-48 0c-8.8 0-16 7.2-16 16l0 48 64 0 0-64zm0 288l0-64-64 0 0 48c0 8.8 7.2 16 16 16l48 0zM48 352l64 0 0-64-64 0 0 64zM304 80a32 32 0 1 1 0 64 32 32 0 1 1 0-64z", VIEWBOX: "0 0 640 512", }, IMAGE: { PATH: "M448 80c8.8 0 16 7.2 16 16l0 319.8-5-6.5-136-176c-4.5-5.9-11.6-9.3-19-9.3s-14.4 3.4-19 9.3L202 340.7l-30.5-42.7C167 291.7 159.8 288 152 288s-15 3.7-19.5 10.1l-80 112L48 416.3l0-.3L48 96c0-8.8 7.2-16 16-16l384 0zM64 32C28.7 32 0 60.7 0 96L0 416c0 35.3 28.7 64 64 64l384 0c35.3 0 64-28.7 64-64l0-320c0-35.3-28.7-64-64-64L64 32zm80 192a48 48 0 1 0 0-96 48 48 0 1 0 0 96z", VIEWBOX: "0 0 512 512", }, VIDEO: { PATH: "M352 432l-192 0 0-112 0-40 192 0 0 40 0 112zm0-200l-192 0 0-40 0-112 192 0 0 112 0 40zM64 80l48 0 0 88-64 0 0-72c0-8.8 7.2-16 16-16zM48 216l64 0 0 80-64 0 0-80zm64 216l-48 0c-8.8 0-16-7.2-16-16l0-72 64 0 0 88zM400 168l0-88 48 0c8.8 0 16 7.2 16 16l0 72-64 0zm0 48l64 0 0 80-64 0 0-80zm0 128l64 0 0 72c0 8.8-7.2 16-16 16l-48 0 0-88zM448 32L64 32C28.7 32 0 60.7 0 96L0 416c0 35.3 28.7 64 64 64l384 0c35.3 0 64-28.7 64-64l0-320c0-35.3-28.7-64-64-64z", VIEWBOX: "0 0 512 512", }, GIF: { PATH: "M512 80c8.8 0 16 7.2 16 16l0 320c0 8.8-7.2 16-16 16L64 432c-8.8 0-16-7.2-16-16L48 96c0-8.8 7.2-16 16-16l448 0zM64 32C28.7 32 0 60.7 0 96L0 416c0 35.3 28.7 64 64 64l448 0c35.3 0 64-28.7 64-64l0-320c0-35.3-28.7-64-64-64L64 32zM296 160c-13.3 0-24 10.7-24 24l0 144c0 13.3 10.7 24 24 24s24-10.7 24-24l0-144c0-13.3-10.7-24-24-24zm56 24l0 80 0 64c0 13.3 10.7 24 24 24s24-10.7 24-24l0-40 40 0c13.3 0 24-10.7 24-24s-10.7-24-24-24l-40 0 0-32 64 0c13.3 0 24-10.7 24-24s-10.7-24-24-24l-88 0c-13.3 0-24 10.7-24 24zM128 256c0-26.5 21.5-48 48-48c8 0 15.4 1.9 22 5.3c11.8 6.1 26.3 1.5 32.3-10.3s1.5-26.3-10.3-32.3c-13.2-6.8-28.2-10.7-44-10.7c-53 0-96 43-96 96s43 96 96 96c19.6 0 37.5-6.1 52.8-15.8c7-4.4 11.2-12.1 11.2-20.3l0-51.9c0-13.3-10.7-24-24-24l-32 0c-13.3 0-24 10.7-24 24s10.7 24 24 24l8 0 0 13.1c-5.3 1.9-10.6 2.9-16 2.9c-26.5 0-48-21.5-48-48z", VIEWBOX: "0 0 576 512", }, MEDIA: { PATH: "M160 80l352 0c8.8 0 16 7.2 16 16l0 224c0 8.8-7.2 16-16 16l-21.2 0L388.1 178.9c-4.4-6.8-12-10.9-20.1-10.9s-15.7 4.1-20.1 10.9l-52.2 79.8-12.4-16.9c-4.5-6.2-11.7-9.8-19.4-9.8s-14.8 3.6-19.4 9.8L175.6 336 160 336c-8.8 0-16-7.2-16-16l0-224c0-8.8 7.2-16 16-16zM96 96l0 224c0 35.3 28.7 64 64 64l352 0c35.3 0 64-28.7 64-64l0-224c0-35.3-28.7-64-64-64L160 32c-35.3 0-64 28.7-64 64zM48 120c0-13.3-10.7-24-24-24S0 106.7 0 120L0 344c0 75.1 60.9 136 136 136l320 0c13.3 0 24-10.7 24-24s-10.7-24-24-24l-320 0c-48.6 0-88-39.4-88-88l0-224zm208 24a32 32 0 1 0 -64 0 32 32 0 1 0 64 0z", VIEWBOX: "0 0 576 512", }, POST: { PATH: "M168 80c-13.3 0-24 10.7-24 24l0 304c0 8.4-1.4 16.5-4.1 24L440 432c13.3 0 24-10.7 24-24l0-304c0-13.3-10.7-24-24-24L168 80zM72 480c-39.8 0-72-32.2-72-72L0 112C0 98.7 10.7 88 24 88s24 10.7 24 24l0 296c0 13.3 10.7 24 24 24s24-10.7 24-24l0-304c0-39.8 32.2-72 72-72l272 0c39.8 0 72 32.2 72 72l0 304c0 39.8-32.2 72-72 72L72 480zM176 136c0-13.3 10.7-24 24-24l96 0c13.3 0 24 10.7 24 24l0 80c0 13.3-10.7 24-24 24l-96 0c-13.3 0-24-10.7-24-24l0-80zm200-24l32 0c13.3 0 24 10.7 24 24s-10.7 24-24 24l-32 0c-13.3 0-24-10.7-24-24s10.7-24 24-24zm0 80l32 0c13.3 0 24 10.7 24 24s-10.7 24-24 24l-32 0c-13.3 0-24-10.7-24-24s10.7-24 24-24zM200 272l208 0c13.3 0 24 10.7 24 24s-10.7 24-24 24l-208 0c-13.3 0-24-10.7-24-24s10.7-24 24-24zm0 80l208 0c13.3 0 24 10.7 24 24s-10.7 24-24 24l-208 0c-13.3 0-24-10.7-24-24s10.7-24 24-24z", VIEWBOX: "0 0 512 512", }, TWEETS: { PATH: "M88.2 309.1c9.8-18.3 6.8-40.8-7.5-55.8C59.4 230.9 48 204 48 176c0-63.5 63.8-128 160-128s160 64.5 160 128s-63.8 128-160 128c-13.1 0-25.8-1.3-37.8-3.6c-10.4-2-21.2-.6-30.7 4.2c-4.1 2.1-8.3 4.1-12.6 6c-16 7.2-32.9 13.5-49.9 18c2.8-4.6 5.4-9.1 7.9-13.6c1.1-1.9 2.2-3.9 3.2-5.9zM208 352c114.9 0 208-78.8 208-176S322.9 0 208 0S0 78.8 0 176c0 41.8 17.2 80.1 45.9 110.3c-.9 1.7-1.9 3.5-2.8 5.1c-10.3 18.4-22.3 36.5-36.6 52.1c-6.6 7-8.3 17.2-4.6 25.9C5.8 378.3 14.4 384 24 384c43 0 86.5-13.3 122.7-29.7c4.8-2.2 9.6-4.5 14.2-6.8c15.1 3 30.9 4.5 47.1 4.5zM432 480c16.2 0 31.9-1.6 47.1-4.5c4.6 2.3 9.4 4.6 14.2 6.8C529.5 498.7 573 512 616 512c9.6 0 18.2-5.7 22-14.5c3.8-8.8 2-19-4.6-25.9c-14.2-15.6-26.2-33.7-36.6-52.1c-.9-1.7-1.9-3.4-2.8-5.1C622.8 384.1 640 345.8 640 304c0-94.4-87.9-171.5-198.2-175.8c4.1 15.2 6.2 31.2 6.2 47.8l0 .6c87.2 6.7 144 67.5 144 127.4c0 28-11.4 54.9-32.7 77.2c-14.3 15-17.3 37.6-7.5 55.8c1.1 2 2.2 4 3.2 5.9c2.5 4.5 5.2 9 7.9 13.6c-17-4.5-33.9-10.7-49.9-18c-4.3-1.9-8.5-3.9-12.6-6c-9.5-4.8-20.3-6.2-30.7-4.2c-12.1 2.4-24.8 3.6-37.8 3.6c-61.7 0-110-26.5-136.8-62.3c-16 5.4-32.8 9.4-50 11.8C279 439.8 350 480 432 480z", VIEWBOX: "0 0 640 512", }, REPLIES: { PATH: "M224 240l96 0c66.2 0 122 44.7 138.8 105.5c3.3-12.4 5.2-26.2 5.2-41.5c0-70.7-57.3-128-128-128l-112 0-24 0c-13.3 0-24-10.7-24-24l0-24 0-28.1L55.9 208 176 316.1l0-28.1 0-24c0-13.3 10.7-24 24-24l24 0zm0 48l0 48 0 16c0 12.6-7.4 24.1-19 29.2s-25 3-34.4-5.4l-160-144C3.9 225.7 0 217.1 0 208s3.9-17.7 10.6-23.8l160-144c9.4-8.5 22.9-10.6 34.4-5.4s19 16.6 19 29.2l0 16 0 48 48 0 64 0c97.2 0 176 78.8 176 176c0 78-38.6 126.2-68.7 152.1c-4.1 3.5-8.1 6.6-11.7 9.3c-3.2 2.4-6.2 4.4-8.9 6.2c-4.5 3-8.3 5.1-10.8 6.5c-2.5 1.4-5.3 1.9-8.1 1.9c-10.9 0-19.7-8.9-19.7-19.7c0-6.8 3.6-13.2 8.3-18.1c.5-.5 .9-.9 1.4-1.4c2.4-2.3 5.1-5.1 7.7-8.6c1.7-2.3 3.4-5 5-7.9c5.3-9.7 9.5-22.9 9.5-40.2c0-53-43-96-96-96l-48 0-48 0z", VIEWBOX: "0 0 512 512", }, }, }; const defaultSettings = { patreonAuth: "", authToken: "", batchEnabled: false, autoBatchEnabled: false, batchSize: 100, startingBatch: 0, timelineType: "media", mediaType: "all", concurrentDownloads: 50, cacheDuration: 360, apiServer: "default", darkTheme: false, }; const batchSizes = [25, 50, 100, 200]; const cacheDurations = [60, 120, 180, 240, 300, 360, 720, 1440]; function getSettings() { return { patreonAuth: GM_getValue("patreonAuth", defaultSettings.patreonAuth), authToken: GM_getValue("authToken", defaultSettings.authToken), batchEnabled: GM_getValue("batchEnabled", defaultSettings.batchEnabled), autoBatchEnabled: GM_getValue( "autoBatchEnabled", defaultSettings.autoBatchEnabled ), batchSize: GM_getValue("batchSize", defaultSettings.batchSize), startingBatch: GM_getValue( "startingBatch", defaultSettings.startingBatch ), timelineType: GM_getValue("timelineType", defaultSettings.timelineType), mediaType: GM_getValue("mediaType", defaultSettings.mediaType), concurrentDownloads: GM_getValue( "concurrentDownloads", defaultSettings.concurrentDownloads ), cacheDuration: GM_getValue( "cacheDuration", defaultSettings.cacheDuration ), apiServer: GM_getValue("apiServer", defaultSettings.apiServer), darkTheme: GM_getValue("darkTheme", defaultSettings.darkTheme), }; } function saveSettings(settings) { GM_setValue("patreonAuth", settings.patreonAuth); GM_setValue("authToken", settings.authToken); GM_setValue("batchEnabled", settings.batchEnabled); GM_setValue("autoBatchEnabled", settings.autoBatchEnabled); GM_setValue("batchSize", settings.batchSize); GM_setValue("startingBatch", settings.startingBatch); GM_setValue("timelineType", settings.timelineType); GM_setValue("mediaType", settings.mediaType); GM_setValue("concurrentDownloads", settings.concurrentDownloads); GM_setValue("cacheDuration", settings.cacheDuration); GM_setValue("apiServer", settings.apiServer); GM_setValue("darkTheme", settings.darkTheme); } function getServiceBaseUrl() { const settings = getSettings(); return settings.apiServer === "default" ? API_URLS.DEFAULT : API_URLS.BACKUP; } function formatNumber(num) { return num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ","); } const cacheManager = { set: (key, data, success = true) => { if (!success) return; const settings = getSettings(); const cacheItem = { data: data, timestamp: Date.now(), expiry: Date.now() + settings.cacheDuration * 60 * 1000, }; localStorage.setItem(`twitter_dl_${key}`, JSON.stringify(cacheItem)); }, get: (key) => { const cacheItem = localStorage.getItem(`twitter_dl_${key}`); if (!cacheItem) return null; try { const parsed = JSON.parse(cacheItem); if (Date.now() > parsed.expiry) { localStorage.removeItem(`twitter_dl_${key}`); return null; } return parsed.data; } catch (e) { localStorage.removeItem(`twitter_dl_${key}`); return null; } }, clear: () => { const keysToRemove = []; for (let i = 0; i < localStorage.length; i++) { const key = localStorage.key(i); if (key.startsWith("twitter_dl_")) { keysToRemove.push(key); } } keysToRemove.forEach((key) => localStorage.removeItem(key)); }, }; function createDownloadIcon() { const svg = document.createElementNS("http://www.w3.org/2000/svg", "svg"); svg.setAttribute("xmlns", "http://www.w3.org/2000/svg"); svg.setAttribute("viewBox", ICONS.DOWNLOAD.VIEWBOX); svg.setAttribute("width", "18"); svg.setAttribute("height", "18"); svg.style.verticalAlign = "middle"; svg.style.cursor = "pointer"; const defs = document.createElementNS("http://www.w3.org/2000/svg", "defs"); const style = document.createElementNS( "http://www.w3.org/2000/svg", "style" ); style.textContent = ".fa-secondary{opacity:.4}"; defs.appendChild(style); svg.appendChild(defs); const secondaryPath = document.createElementNS( "http://www.w3.org/2000/svg", "path" ); secondaryPath.setAttribute("class", "fa-secondary"); secondaryPath.setAttribute("fill", "currentColor"); secondaryPath.setAttribute("d", ICONS.DOWNLOAD.SECONDARY_PATH); svg.appendChild(secondaryPath); const primaryPath = document.createElementNS( "http://www.w3.org/2000/svg", "path" ); primaryPath.setAttribute("class", "fa-primary"); primaryPath.setAttribute("fill", "currentColor"); primaryPath.setAttribute("d", ICONS.DOWNLOAD.PRIMARY_PATH); svg.appendChild(primaryPath); return svg; } function createPatreonIcon() { const svg = document.createElementNS("http://www.w3.org/2000/svg", "svg"); svg.setAttribute("xmlns", "http://www.w3.org/2000/svg"); svg.setAttribute("viewBox", ICONS.PATREON.VIEWBOX); svg.setAttribute("width", "18"); svg.setAttribute("height", "18"); svg.style.verticalAlign = "middle"; svg.style.marginRight = "8px"; const path = document.createElementNS("http://www.w3.org/2000/svg", "path"); path.setAttribute("fill", "currentColor"); path.setAttribute("d", ICONS.PATREON.PATH); svg.appendChild(path); return svg; } function createInfoIcon() { const svg = document.createElementNS("http://www.w3.org/2000/svg", "svg"); svg.setAttribute("xmlns", "http://www.w3.org/2000/svg"); svg.setAttribute("viewBox", ICONS.INFO.VIEWBOX); svg.setAttribute("width", "16"); svg.setAttribute("height", "16"); svg.style.marginLeft = "8px"; svg.style.cursor = "pointer"; svg.style.color = "#64748b"; svg.style.transition = "color 0.2s ease"; const path = document.createElementNS("http://www.w3.org/2000/svg", "path"); path.setAttribute("fill", "currentColor"); path.setAttribute("d", ICONS.INFO.PATH); svg.appendChild(path); svg.addEventListener("mouseenter", () => { svg.style.color = "#0ea5e9"; }); svg.addEventListener("mouseleave", () => { svg.style.color = "#64748b"; }); return svg; } function createInfoTooltip(message) { let activeTooltip = null; function showTooltip(e) { if (activeTooltip) { document.body.removeChild(activeTooltip); } const tooltip = document.createElement("div"); tooltip.textContent = message; tooltip.style.cssText = ` position: fixed; background-color: #1f2937; color: white; padding: 8px 12px; border-radius: 6px; font-size: 12px; line-height: 1.4; max-width: 300px; z-index: 10003; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); pointer-events: none; white-space: normal; word-wrap: break-word; `; document.body.appendChild(tooltip); activeTooltip = tooltip; const rect = e.target.getBoundingClientRect(); const tooltipRect = tooltip.getBoundingClientRect(); let top = rect.bottom + 8; let left = rect.left + rect.width / 2 - tooltipRect.width / 2; if (left < 8) left = 8; if (left + tooltipRect.width > window.innerWidth - 8) { left = window.innerWidth - tooltipRect.width - 8; } if (top + tooltipRect.height > window.innerHeight - 8) { top = rect.top - tooltipRect.height - 8; } tooltip.style.top = top + "px"; tooltip.style.left = left + "px"; } function hideTooltip() { if (activeTooltip) { document.body.removeChild(activeTooltip); activeTooltip = null; } } return { showTooltip, hideTooltip }; } function createAccountIcon(isDarkTheme = false) { const svg = document.createElementNS("http://www.w3.org/2000/svg", "svg"); svg.setAttribute("xmlns", "http://www.w3.org/2000/svg"); svg.setAttribute("viewBox", ICONS.ACCOUNT.VIEWBOX); svg.setAttribute("width", "12"); svg.setAttribute("height", "12"); svg.style.marginRight = "6px"; svg.style.color = isDarkTheme ? "#ffffff" : "#64748b"; svg.style.verticalAlign = "middle"; svg.style.display = "inline-block"; const path = document.createElementNS("http://www.w3.org/2000/svg", "path"); path.setAttribute("fill", "currentColor"); path.setAttribute("d", ICONS.ACCOUNT.PATH); svg.appendChild(path); return svg; } function createTotalItemsIcon(isDarkTheme = false) { const svg = document.createElementNS("http://www.w3.org/2000/svg", "svg"); svg.setAttribute("xmlns", "http://www.w3.org/2000/svg"); svg.setAttribute("viewBox", ICONS.TOTAL.VIEWBOX); svg.setAttribute("width", "12"); svg.setAttribute("height", "12"); svg.style.marginRight = "6px"; svg.style.color = isDarkTheme ? "#ffffff" : "#64748b"; svg.style.verticalAlign = "middle"; svg.style.display = "inline-block"; const path = document.createElementNS("http://www.w3.org/2000/svg", "path"); path.setAttribute("fill", "currentColor"); path.setAttribute("d", ICONS.TOTAL.PATH); svg.appendChild(path); return svg; } function createCurrentBatchIcon(isDarkTheme = false) { const svg = document.createElementNS("http://www.w3.org/2000/svg", "svg"); svg.setAttribute("xmlns", "http://www.w3.org/2000/svg"); svg.setAttribute("viewBox", ICONS.BATCH.VIEWBOX); svg.setAttribute("width", "12"); svg.setAttribute("height", "12"); svg.style.marginRight = "6px"; svg.style.color = isDarkTheme ? "#ffffff" : "#64748b"; svg.style.verticalAlign = "middle"; svg.style.display = "inline-block"; const path = document.createElementNS("http://www.w3.org/2000/svg", "path"); path.setAttribute("fill", "currentColor"); path.setAttribute("d", ICONS.BATCH.PATH); svg.appendChild(path); return svg; } function createTotalZipIcon(isDarkTheme = false) { const svg = document.createElementNS("http://www.w3.org/2000/svg", "svg"); svg.setAttribute("xmlns", "http://www.w3.org/2000/svg"); svg.setAttribute("viewBox", ICONS.ZIP.VIEWBOX); svg.setAttribute("width", "12"); svg.setAttribute("height", "12"); svg.style.marginRight = "6px"; svg.style.color = isDarkTheme ? "#ffffff" : "#64748b"; svg.style.verticalAlign = "middle"; svg.style.display = "inline-block"; const path = document.createElementNS("http://www.w3.org/2000/svg", "path"); path.setAttribute("fill", "currentColor"); path.setAttribute("d", ICONS.ZIP.PATH); svg.appendChild(path); return svg; } function createMediaTypeIcon(mediaType, isDarkTheme = false) { let iconData; switch (mediaType) { case "image": iconData = ICONS.MEDIA_TYPE.IMAGE; break; case "video": iconData = ICONS.MEDIA_TYPE.VIDEO; break; case "gif": iconData = ICONS.MEDIA_TYPE.GIF; break; default: iconData = ICONS.MEDIA_TYPE.ALL; } const svg = document.createElementNS("http://www.w3.org/2000/svg", "svg"); svg.setAttribute("xmlns", "http://www.w3.org/2000/svg"); svg.setAttribute("viewBox", iconData.VIEWBOX); svg.setAttribute("width", "12"); svg.setAttribute("height", "12"); svg.style.marginRight = "6px"; svg.style.color = isDarkTheme ? "#ffffff" : "#64748b"; svg.style.verticalAlign = "middle"; svg.style.display = "inline-block"; const path = document.createElementNS("http://www.w3.org/2000/svg", "path"); path.setAttribute("fill", "currentColor"); path.setAttribute("d", iconData.PATH); svg.appendChild(path); return svg; } function createTimelineTypeIcon(timelineType, isDarkTheme = false) { let iconData; switch (timelineType) { case "media": iconData = ICONS.MEDIA_TYPE.MEDIA; break; case "timeline": iconData = ICONS.MEDIA_TYPE.POST; break; case "tweets": iconData = ICONS.MEDIA_TYPE.TWEETS; break; case "with_replies": iconData = ICONS.MEDIA_TYPE.REPLIES; break; default: iconData = ICONS.MEDIA_TYPE.MEDIA; } const svg = document.createElementNS("http://www.w3.org/2000/svg", "svg"); svg.setAttribute("xmlns", "http://www.w3.org/2000/svg"); svg.setAttribute("viewBox", iconData.VIEWBOX); svg.setAttribute("width", "16"); svg.setAttribute("height", "16"); svg.style.marginRight = "6px"; svg.style.color = isDarkTheme ? "#ffffff" : "#64748b"; svg.style.verticalAlign = "middle"; svg.style.display = "inline-block"; const path = document.createElementNS("http://www.w3.org/2000/svg", "path"); path.setAttribute("fill", "currentColor"); path.setAttribute("d", iconData.PATH); svg.appendChild(path); return svg; } function createAuthTokenPopup() { const settings = getSettings(); const overlay = document.createElement("div"); overlay.style.cssText = ` position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.35); backdrop-filter: blur(2.5px); display: flex; justify-content: center; align-items: center; z-index: 10001; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; `; const popup = document.createElement("div"); popup.style.cssText = ` background-color: ${settings.darkTheme ? "#1f2937" : "#ffffff"}; color: ${settings.darkTheme ? "#f1f5f9" : "#0f172a"}; border-radius: 16px; width: 300px; max-width: 90%; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); overflow: hidden; `; const header = document.createElement("div"); header.style.cssText = ` padding: 16px; border-bottom: 1px solid ${settings.darkTheme ? "#374151" : "#e2e8f0"}; font-weight: bold; font-size: 16px; text-align: center; background-color: ${settings.darkTheme ? "#374151" : "#f8fafc"}; `; header.textContent = "Authentication Required"; const content = document.createElement("div"); content.style.cssText = ` padding: 16px; text-align: center; `; const authLink = document.createElement("a"); authLink.href = "https://www.patreon.com/posts/127206894"; authLink.target = "_blank"; authLink.textContent = "How to Obtain Auth Token"; authLink.style.cssText = ` color: #0ea5e9; text-decoration: none; cursor: pointer; `; content.appendChild(authLink); const buttonContainer = document.createElement("div"); buttonContainer.style.cssText = ` padding: 16px; display: flex; justify-content: center; border-top: 1px solid ${settings.darkTheme ? "#374151" : "#e2e8f0"}; `; const okButton = document.createElement("button"); okButton.style.cssText = ` background-color: #0ea5e9; color: white; border: none; border-radius: 6px; padding: 8px 24px; font-weight: bold; cursor: pointer; transition: background-color 0.2s; `; okButton.textContent = "OK"; okButton.addEventListener("mouseenter", () => { okButton.style.backgroundColor = "#0284c7"; }); okButton.addEventListener("mouseleave", () => { okButton.style.backgroundColor = "#0ea5e9"; }); okButton.onclick = () => { document.body.removeChild(overlay); }; buttonContainer.appendChild(okButton); popup.appendChild(header); popup.appendChild(content); popup.appendChild(buttonContainer); overlay.appendChild(popup); document.body.appendChild(overlay); return overlay; } function createPatreonAuthPopup() { const settings = getSettings(); const overlay = document.createElement("div"); overlay.style.cssText = ` position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.35); backdrop-filter: blur(2.5px); display: flex; justify-content: center; align-items: center; z-index: 10001; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; `; const popup = document.createElement("div"); popup.style.cssText = ` background-color: ${settings.darkTheme ? "#1f2937" : "#ffffff"}; color: ${settings.darkTheme ? "#f1f5f9" : "#0f172a"}; border-radius: 16px; width: 320px; max-width: 90%; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); overflow: hidden; `; const header = document.createElement("div"); header.style.cssText = ` padding: 16px; border-bottom: 1px solid ${settings.darkTheme ? "#374151" : "#e2e8f0"}; font-weight: bold; font-size: 16px; text-align: center; background-color: ${settings.darkTheme ? "#374151" : "#f8fafc"}; `; header.textContent = "Patreon Authentication Required"; const content = document.createElement("div"); content.style.cssText = ` padding: 16px; text-align: center; `; const message = document.createElement("p"); message.style.cssText = ` margin-bottom: 16px; line-height: 1.5; `; message.textContent = "Please enter your Patreon authentication code. This feature requires a paid membership to access."; content.appendChild(message); const patreonButton = document.createElement("a"); patreonButton.href = "https://www.patreon.com/exyezed"; patreonButton.target = "_blank"; patreonButton.style.cssText = ` display: flex; align-items: center; justify-content: center; background-color: ${settings.darkTheme ? "#374151" : "#f1f5f9"}; color: ${settings.darkTheme ? "#f1f5f9" : "#0f172a"}; text-decoration: none; padding: 10px 16px; border-radius: 8px; margin-top: 8px; transition: background-color 0.2s; `; patreonButton.innerHTML = createPatreonIcon().outerHTML + "Join Patreon Membership"; patreonButton.addEventListener("mouseenter", () => { patreonButton.style.backgroundColor = settings.darkTheme ? "#4b5563" : "#e2e8f0"; }); patreonButton.addEventListener("mouseleave", () => { patreonButton.style.backgroundColor = settings.darkTheme ? "#374151" : "#f1f5f9"; }); content.appendChild(patreonButton); const buttonContainer = document.createElement("div"); buttonContainer.style.cssText = ` padding: 16px; display: flex; justify-content: center; border-top: 1px solid ${settings.darkTheme ? "#374151" : "#e2e8f0"}; `; const okButton = document.createElement("button"); okButton.style.cssText = ` background-color: #0ea5e9; color: white; border: none; border-radius: 6px; padding: 8px 24px; font-weight: bold; cursor: pointer; transition: background-color 0.2s; `; okButton.textContent = "OK"; okButton.addEventListener("mouseenter", () => { okButton.style.backgroundColor = "#0284c7"; }); okButton.addEventListener("mouseleave", () => { okButton.style.backgroundColor = "#0ea5e9"; }); okButton.onclick = () => { document.body.removeChild(overlay); }; buttonContainer.appendChild(okButton); popup.appendChild(header); popup.appendChild(content); popup.appendChild(buttonContainer); overlay.appendChild(popup); document.body.appendChild(overlay); return overlay; } function createInfoDialog(message, title = "Information") { const settings = getSettings(); const overlay = document.createElement("div"); overlay.style.cssText = ` position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.35); backdrop-filter: blur(2.5px); display: flex; justify-content: center; align-items: center; z-index: 10001; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; `; const dialog = document.createElement("div"); dialog.style.cssText = ` background-color: ${settings.darkTheme ? "#1f2937" : "#ffffff"}; color: ${settings.darkTheme ? "#f1f5f9" : "#334155"}; border-radius: 16px; width: 300px; max-width: 90%; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); overflow: hidden; `; const header = document.createElement("div"); header.style.cssText = ` padding: 16px; border-bottom: 1px solid ${settings.darkTheme ? "#374151" : "#e2e8f0"}; font-weight: bold; font-size: 16px; text-align: center; background-color: ${settings.darkTheme ? "#374151" : "#f8fafc"}; `; header.textContent = title; const content = document.createElement("div"); content.style.cssText = ` padding: 20px 16px; text-align: center; line-height: 1.5; `; content.textContent = message; const buttonContainer = document.createElement("div"); buttonContainer.style.cssText = ` padding: 16px; display: flex; justify-content: center; border-top: 1px solid ${settings.darkTheme ? "#374151" : "#e2e8f0"}; `; const okButton = document.createElement("button"); okButton.style.cssText = ` background-color: #22c55e; color: white; border: none; border-radius: 6px; padding: 8px 24px; font-weight: bold; cursor: pointer; transition: background-color 0.2s; `; okButton.textContent = "OK"; okButton.addEventListener("mouseenter", () => { okButton.style.backgroundColor = "#16a34a"; }); okButton.addEventListener("mouseleave", () => { okButton.style.backgroundColor = "#22c55e"; }); okButton.onclick = () => { document.body.removeChild(overlay); }; buttonContainer.appendChild(okButton); dialog.appendChild(header); dialog.appendChild(content); dialog.appendChild(buttonContainer); overlay.appendChild(dialog); document.body.appendChild(overlay); return overlay; } function createConfirmDialog(message, onConfirm, onCancel) { const settings = getSettings(); const overlay = document.createElement("div"); overlay.style.cssText = ` position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.35); backdrop-filter: blur(2.5px); display: flex; justify-content: center; align-items: center; z-index: 10001; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; `; const dialog = document.createElement("div"); dialog.style.cssText = ` background-color: ${settings.darkTheme ? "#1f2937" : "#ffffff"}; color: ${settings.darkTheme ? "#f1f5f9" : "#334155"}; border-radius: 16px; width: 300px; max-width: 90%; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); overflow: hidden; `; const header = document.createElement("div"); header.style.cssText = ` padding: 16px; border-bottom: 1px solid ${settings.darkTheme ? "#374151" : "#e2e8f0"}; font-weight: bold; font-size: 16px; text-align: center; background-color: ${settings.darkTheme ? "#374151" : "#f8fafc"}; `; header.textContent = "Confirmation"; const content = document.createElement("div"); content.style.cssText = ` padding: 16px; text-align: center; `; content.textContent = message; const buttons = document.createElement("div"); buttons.style.cssText = ` display: flex; padding: 16px; border-top: 1px solid ${settings.darkTheme ? "#374151" : "#e2e8f0"}; `; const cancelButton = document.createElement("button"); cancelButton.style.cssText = ` flex: 1; background-color: ${settings.darkTheme ? "#374151" : "#94a3b8"}; color: white; border: none; border-radius: 6px; padding: 8px 16px; margin-right: 8px; font-weight: bold; cursor: pointer; text-align: center; transition: background-color 0.2s; `; cancelButton.textContent = "No"; cancelButton.addEventListener("mouseenter", () => { cancelButton.style.backgroundColor = settings.darkTheme ? "#4b5563" : "#64748b"; }); cancelButton.addEventListener("mouseleave", () => { cancelButton.style.backgroundColor = settings.darkTheme ? "#374151" : "#94a3b8"; }); cancelButton.onclick = () => { document.body.removeChild(overlay); if (onCancel) onCancel(); }; const confirmButton = document.createElement("button"); confirmButton.style.cssText = ` flex: 1; background-color: #ef4444; color: white; border: none; border-radius: 6px; padding: 8px 16px; font-weight: bold; cursor: pointer; text-align: center; transition: background-color 0.2s; `; confirmButton.textContent = "Yes"; confirmButton.addEventListener("mouseenter", () => { confirmButton.style.backgroundColor = "#dc2626"; }); confirmButton.addEventListener("mouseleave", () => { confirmButton.style.backgroundColor = "#ef4444"; }); confirmButton.onclick = () => { document.body.removeChild(overlay); if (onConfirm) onConfirm(); }; buttons.appendChild(cancelButton); buttons.appendChild(confirmButton); dialog.appendChild(header); dialog.appendChild(content); dialog.appendChild(buttons); overlay.appendChild(dialog); document.body.appendChild(overlay); } function formatDate(dateString) { const date = new Date(dateString); const year = date.getFullYear(); const month = String(date.getMonth() + 1).padStart(2, "0"); const day = String(date.getDate()).padStart(2, "0"); const hours = String(date.getHours()).padStart(2, "0"); const minutes = String(date.getMinutes()).padStart(2, "0"); const seconds = String(date.getSeconds()).padStart(2, "0"); return `${year}${month}${day}_${hours}${minutes}${seconds}`; } function getCurrentTimestamp() { const now = new Date(); const year = now.getFullYear(); const month = String(now.getMonth() + 1).padStart(2, "0"); const day = String(now.getDate()).padStart(2, "0"); const hours = String(now.getHours()).padStart(2, "0"); const minutes = String(now.getMinutes()).padStart(2, "0"); const seconds = String(now.getSeconds()).padStart(2, "0"); return `${year}${month}${day}_${hours}${minutes}${seconds}`; } function fetchData(url) { return new Promise((resolve, reject) => { GM_xmlhttpRequest({ method: "GET", url: url, responseType: "json", onload: (response) => { if (response.status >= 200 && response.status < 300) { resolve(response.response); } else { reject(new Error(`Request failed with status ${response.status}`)); } }, onerror: (error) => { reject( new Error(`Network error: ${error?.message || "Unknown error"}`) ); }, ontimeout: () => { reject(new Error("Request timed out")); }, }); }); } function fetchBinary(url) { return new Promise((resolve, reject) => { GM_xmlhttpRequest({ method: "GET", url: url, responseType: "blob", onload: (response) => { if (response.status >= 200 && response.status < 300) { resolve(response.response); } else { reject(new Error(`Request failed with status ${response.status}`)); } }, onerror: () => { reject(new Error("Network error")); }, }); }); } function getMediaTypeLabel(mediaType) { switch (mediaType) { case "image": return "Image"; case "video": return "Video"; case "gif": return "GIF"; default: return "Media"; } } function createToggleSwitch(options, selectedValue, onChange) { const settings = getSettings(); const toggleWrapper = document.createElement("div"); toggleWrapper.style.cssText = ` position: relative; height: 40px; background-color: ${settings.darkTheme ? "#374151" : "#f1f5f9"}; border-radius: 8px; padding: 0; cursor: pointer; width: 100%; margin-bottom: 16px; overflow: hidden; `; const toggleSlider = document.createElement("div"); toggleSlider.style.cssText = ` position: absolute; height: 100%; background-color: #0ea5e9; border-radius: 8px; transition: transform 0.3s ease, width 0.3s ease; z-index: 1; `; const optionsContainer = document.createElement("div"); optionsContainer.style.cssText = ` position: relative; display: flex; height: 100%; z-index: 2; width: 100%; `; const selectedIndex = options.findIndex( (option) => option.value === selectedValue ); const optionWidth = 100 / options.length; toggleSlider.style.width = `${optionWidth}%`; toggleSlider.style.transform = `translateX(${selectedIndex * 100}%)`; options.forEach((option, index) => { const optionElement = document.createElement("div"); optionElement.style.cssText = ` flex: 1; display: flex; align-items: center; justify-content: center; font-size: 14px; transition: color 0.3s ease; color: ${option.value === selectedValue ? "white" : "#64748b"}; cursor: pointer; user-select: none; text-align: center; height: 100%; padding: 0 4px; `; if (option.icon) { const iconContainer = document.createElement("span"); iconContainer.style.cssText = ` display: flex; align-items: center; justify-content: center; margin-right: 6px; `; const iconClone = option.icon.cloneNode(true); const paths = iconClone.querySelectorAll("path"); paths.forEach((path) => { path.setAttribute( "fill", option.value === selectedValue ? "white" : "#64748b" ); }); iconContainer.appendChild(iconClone); optionElement.appendChild(iconContainer); } const text = document.createElement("span"); text.textContent = option.label; text.style.cssText = ` display: inline-block; text-align: center; `; optionElement.appendChild(text); optionElement.addEventListener("click", (e) => { e.stopPropagation(); onChange(option.value); toggleSlider.style.transform = `translateX(${index * 100}%)`; optionsContainer.querySelectorAll("div").forEach((opt, i) => { opt.style.color = i === index ? "white" : "#64748b"; const optIcon = opt.querySelector("svg"); if (optIcon) { const optPaths = optIcon.querySelectorAll("path"); optPaths.forEach((path) => { path.setAttribute("fill", i === index ? "white" : "#64748b"); }); } }); }); optionsContainer.appendChild(optionElement); }); toggleWrapper.appendChild(toggleSlider); toggleWrapper.appendChild(optionsContainer); return toggleWrapper; } function createMediaTypeIcons() { const allIcon = document.createElementNS( "http://www.w3.org/2000/svg", "svg" ); allIcon.setAttribute("xmlns", "http://www.w3.org/2000/svg"); allIcon.setAttribute("viewBox", ICONS.MEDIA_TYPE.ALL.VIEWBOX); allIcon.setAttribute("width", "16"); allIcon.setAttribute("height", "16"); allIcon.style.verticalAlign = "middle"; const allPath = document.createElementNS( "http://www.w3.org/2000/svg", "path" ); allPath.setAttribute("fill", "#64748b"); allPath.setAttribute("d", ICONS.MEDIA_TYPE.ALL.PATH); allIcon.appendChild(allPath); const imageIcon = document.createElementNS( "http://www.w3.org/2000/svg", "svg" ); imageIcon.setAttribute("xmlns", "http://www.w3.org/2000/svg"); imageIcon.setAttribute("viewBox", ICONS.MEDIA_TYPE.IMAGE.VIEWBOX); imageIcon.setAttribute("width", "16"); imageIcon.setAttribute("height", "16"); imageIcon.style.verticalAlign = "middle"; const imagePath = document.createElementNS( "http://www.w3.org/2000/svg", "path" ); imagePath.setAttribute("fill", "#64748b"); imagePath.setAttribute("d", ICONS.MEDIA_TYPE.IMAGE.PATH); imageIcon.appendChild(imagePath); const videoIcon = document.createElementNS( "http://www.w3.org/2000/svg", "svg" ); videoIcon.setAttribute("xmlns", "http://www.w3.org/2000/svg"); videoIcon.setAttribute("viewBox", ICONS.MEDIA_TYPE.VIDEO.VIEWBOX); videoIcon.setAttribute("width", "16"); videoIcon.setAttribute("height", "16"); videoIcon.style.verticalAlign = "middle"; const videoPath = document.createElementNS( "http://www.w3.org/2000/svg", "path" ); videoPath.setAttribute("fill", "#64748b"); videoPath.setAttribute("d", ICONS.MEDIA_TYPE.VIDEO.PATH); videoIcon.appendChild(videoPath); const gifIcon = document.createElementNS( "http://www.w3.org/2000/svg", "svg" ); gifIcon.setAttribute("xmlns", "http://www.w3.org/2000/svg"); gifIcon.setAttribute("viewBox", ICONS.MEDIA_TYPE.GIF.VIEWBOX); gifIcon.setAttribute("width", "16"); gifIcon.setAttribute("height", "16"); gifIcon.style.verticalAlign = "middle"; const gifPath = document.createElementNS( "http://www.w3.org/2000/svg", "path" ); gifPath.setAttribute("fill", "#64748b"); gifPath.setAttribute("d", ICONS.MEDIA_TYPE.GIF.PATH); gifIcon.appendChild(gifPath); return { all: allIcon, image: imageIcon, video: videoIcon, gif: gifIcon, }; } function createSlider(options, selectedValue, onChange) { const toggleOptions = options.map((option) => { let label = option.toString(); if (typeof option === "number" && option >= 60 && option % 60 === 0) { label = `${option / 60}h`; } return { value: option, label: label }; }); return createToggleSwitch(toggleOptions, selectedValue, onChange); } function createModal(username) { let autoBatchStarted = false; let autoBatchCancelled = false; const existingModal = document.getElementById("media-downloader-modal"); if (existingModal) { existingModal.remove(); } const settings = getSettings(); const modal = document.createElement("div"); modal.id = "media-downloader-modal"; modal.style.cssText = ` position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.35); backdrop-filter: blur(2.5px); display: flex; justify-content: center; align-items: center; z-index: 10000; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; `; const modalContent = document.createElement("div"); modalContent.style.cssText = ` background-color: ${settings.darkTheme ? "#1f2937" : "#ffffff"}; color: ${settings.darkTheme ? "#f1f5f9" : "#334155"}; border-radius: 16px; width: 500px; max-width: 90%; max-height: 90vh; overflow-y: auto; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); `; const header = document.createElement("div"); header.style.cssText = ` display: flex; justify-content: space-between; align-items: center; padding: 16px; border-bottom: 1px solid ${settings.darkTheme ? "#374151" : "#e2e8f0"}; `; const title = document.createElement("h2"); title.innerHTML = `Download ${getMediaTypeLabel( settings.mediaType )}: <span style="color: #0ea5e9">${username}</span>`; title.style.cssText = ` margin: 0; font-size: 18px; font-weight: bold; color: ${settings.darkTheme ? "#f1f5f9" : "#334155"}; `; const closeButton = document.createElement("button"); closeButton.innerHTML = "×"; closeButton.style.cssText = ` background: none; border: none; color: ${settings.darkTheme ? "#f1f5f9" : "#0f172a"}; font-size: 24px; cursor: pointer; padding: 0; line-height: 1; transition: color 0.2s; `; closeButton.addEventListener("mouseenter", () => { closeButton.style.color = "#0ea5e9"; }); closeButton.addEventListener("mouseleave", () => { closeButton.style.color = settings.darkTheme ? "#f1f5f9" : "#0f172a"; }); closeButton.onclick = () => modal.remove(); header.appendChild(title); header.appendChild(closeButton); const tabs = document.createElement("div"); tabs.style.cssText = ` display: flex; border-bottom: 1px solid ${settings.darkTheme ? "#374151" : "#e2e8f0"}; `; const mainTab = document.createElement("div"); mainTab.textContent = "Main"; mainTab.className = "active-tab"; mainTab.style.cssText = ` padding: 12px 16px; cursor: pointer; flex: 1; text-align: center; border-bottom: 2px solid #0ea5e9; color: ${settings.darkTheme ? "#f1f5f9" : "#0f172a"}; `; const settingsTab = document.createElement("div"); settingsTab.textContent = "Settings"; settingsTab.style.cssText = ` padding: 12px 16px; cursor: pointer; flex: 1; text-align: center; color: #64748b; `; tabs.appendChild(mainTab); tabs.appendChild(settingsTab); const mainContent = document.createElement("div"); mainContent.style.cssText = ` padding: 16px; `; const settingsContent = document.createElement("div"); settingsContent.style.cssText = ` padding: 16px; display: none; `; const fetchButton = document.createElement("button"); const mediaTypeLabelText = getMediaTypeLabel( settings.mediaType ).toLowerCase(); const fetchIcon = document.createElementNS( "http://www.w3.org/2000/svg", "svg" ); fetchIcon.setAttribute("xmlns", "http://www.w3.org/2000/svg"); fetchIcon.setAttribute("viewBox", ICONS.FETCH.VIEWBOX); fetchIcon.setAttribute("width", "16"); fetchIcon.setAttribute("height", "16"); fetchIcon.style.marginRight = "8px"; const fetchPath = document.createElementNS( "http://www.w3.org/2000/svg", "path" ); fetchPath.setAttribute("fill", "currentColor"); fetchPath.setAttribute("d", ICONS.FETCH.PATH); fetchIcon.appendChild(fetchPath); const fetchButtonText = document.createElement("span"); fetchButtonText.textContent = settings.autoBatchEnabled ? "Auto Fetch" : settings.mediaType === "all" ? "Fetch Media" : `Fetch ${ mediaTypeLabelText === "gif" ? "GIF" : mediaTypeLabelText.charAt(0).toUpperCase() + mediaTypeLabelText.slice(1) }`; fetchButton.innerHTML = ""; fetchButton.appendChild(fetchIcon); fetchButton.appendChild(fetchButtonText); fetchButton.style.cssText = ` background-color: #22c55e; color: white; border: none; border-radius: 6px; padding: 8px 16px; font-weight: bold; cursor: pointer; margin: 0; width: 48%; display: flex; justify-content: center; align-items: center; text-align: center; transition: background-color 0.2s; `; fetchButton.addEventListener("mouseenter", () => { fetchButton.style.backgroundColor = "#16a34a"; }); fetchButton.addEventListener("mouseleave", () => { fetchButton.style.backgroundColor = "#22c55e"; }); const infoContainer = document.createElement("div"); infoContainer.style.cssText = ` background-color: ${settings.darkTheme ? "#374151" : "#f1f5f9"}; border-radius: 8px; padding: 12px; margin-bottom: 16px; display: none; `; const buttonContainer = document.createElement("div"); buttonContainer.style.cssText = ` display: none; gap: 8px; margin-bottom: 16px; `; const batchNavContainer = document.createElement("div"); batchNavContainer.style.cssText = ` display: none; flex-direction: column; gap: 8px; margin-bottom: 16px; `; const prevBatchButton = document.createElement("button"); prevBatchButton.innerHTML = `<span style="display: flex; align-items: center; justify-content: center; gap: 6px; white-space: nowrap;">${ICONS.PREV}<span>Prev Batch</span></span>`; prevBatchButton.style.cssText = ` background-color: #6366f1; color: white; border: none; border-radius: 6px; padding: 8px 16px; font-weight: bold; cursor: pointer; width: 40%; display: flex; align-items: center; justify-content: center; text-align: center; transition: background-color 0.2s; `; prevBatchButton.addEventListener("mouseenter", () => { prevBatchButton.style.backgroundColor = "#4f46e5"; }); prevBatchButton.addEventListener("mouseleave", () => { prevBatchButton.style.backgroundColor = "#6366f1"; }); const nextBatchButton = document.createElement("button"); nextBatchButton.innerHTML = `<span style="display: flex; align-items: center; justify-content: center; gap: 6px; white-space: nowrap;"><span>Next Batch</span>${ICONS.NEXT}</span>`; nextBatchButton.style.cssText = ` background-color: #6366f1; color: white; border: none; border-radius: 6px; padding: 8px 16px; font-weight: bold; cursor: pointer; width: 40%; display: flex; align-items: center; justify-content: center; text-align: center; transition: background-color 0.2s; `; nextBatchButton.addEventListener("mouseenter", () => { nextBatchButton.style.backgroundColor = "#4f46e5"; }); nextBatchButton.addEventListener("mouseleave", () => { nextBatchButton.style.backgroundColor = "#6366f1"; }); const buttonWrapper = document.createElement("div"); buttonWrapper.style.cssText = ` display: flex; gap: 8px; justify-content: center; width: 100%; `; buttonWrapper.appendChild(prevBatchButton); buttonWrapper.appendChild(nextBatchButton); batchNavContainer.appendChild(buttonWrapper); const stopFetchButton = document.createElement("button"); stopFetchButton.innerHTML = `<span style="display: flex; align-items: center; justify-content: center; gap: 6px; white-space: nowrap;">${ICONS.STOP}<span>Stop Fetch</span></span>`; stopFetchButton.style.cssText = ` background-color: #ef4444; color: white; border: none; border-radius: 6px; padding: 8px 16px; font-weight: bold; cursor: pointer; width: 140px; /* Fixed width instead of percentage */ display: none; align-items: center; justify-content: center; text-align: center; transition: background-color 0.2s; `; stopFetchButton.addEventListener("mouseenter", () => { stopFetchButton.style.backgroundColor = "#dc2626"; }); stopFetchButton.addEventListener("mouseleave", () => { stopFetchButton.style.backgroundColor = "#ef4444"; }); stopFetchButton.addEventListener("click", () => { autoBatchCancelled = true; autoBatchStarted = false; batchNavContainer.style.display = "flex"; prevBatchButton.style.display = mediaData.currentPage > getSettings().startingBatch ? "block" : "none"; nextBatchButton.style.display = mediaData.hasMore ? "block" : "none"; stopFetchButton.style.display = "none"; batchInfoContainer.style.display = "flex"; infoContainer.style.display = "block"; fetchButtonText.textContent = "Auto Fetch"; }); const stopFetchWrapper = document.createElement("div"); stopFetchWrapper.style.cssText = ` display: flex; justify-content: center; width: 100%; margin-top: 8px; /* Add spacing between button rows */ `; stopFetchWrapper.appendChild(stopFetchButton); batchNavContainer.appendChild(stopFetchWrapper); const batchInfoContainer = document.createElement("div"); batchInfoContainer.style.cssText = ` display: none; flex-direction: column; gap: 8px; margin-bottom: 16px; padding: 12px; background-color: ${settings.darkTheme ? "#374151" : "#f8fafc"}; border-radius: 8px; border: 1px solid ${settings.darkTheme ? "#4b5563" : "#e2e8f0"}; `; const batchStatsRow = document.createElement("div"); batchStatsRow.style.cssText = ` display: flex; justify-content: space-between; align-items: center; `; const currentBatchLabel = document.createElement("div"); currentBatchLabel.style.cssText = ` font-size: 14px; color: ${settings.darkTheme ? "#ffffff" : "#475569"}; `; const totalBatchLabel = document.createElement("div"); totalBatchLabel.style.cssText = ` font-size: 14px; color: ${settings.darkTheme ? "#ffffff" : "#475569"}; `; batchStatsRow.appendChild(currentBatchLabel); batchStatsRow.appendChild(totalBatchLabel); const downloadButtonsRow = document.createElement("div"); downloadButtonsRow.style.cssText = ` display: flex; gap: 8px; justify-content: center; `; const downloadCurrentButton = document.createElement("button"); downloadCurrentButton.innerHTML = ""; const currentIcon = createDownloadIcon(); currentIcon.style.width = "12px"; currentIcon.style.height = "12px"; currentIcon.style.marginRight = "4px"; const currentText = document.createElement("span"); currentText.textContent = "Download Current"; downloadCurrentButton.appendChild(currentIcon); downloadCurrentButton.appendChild(currentText); downloadCurrentButton.style.cssText = ` background-color: #0ea5e9; color: white; border: none; border-radius: 6px; padding: 6px 12px; font-weight: bold; cursor: pointer; font-size: 12px; transition: background-color 0.2s; flex: 1; display: flex; align-items: center; justify-content: center; `; downloadCurrentButton.addEventListener("mouseenter", () => { downloadCurrentButton.style.backgroundColor = "#0284c7"; }); downloadCurrentButton.addEventListener("mouseleave", () => { downloadCurrentButton.style.backgroundColor = "#0ea5e9"; }); const downloadAllButton = document.createElement("button"); downloadAllButton.innerHTML = ""; const allIcon = createDownloadIcon(); allIcon.style.width = "12px"; allIcon.style.height = "12px"; allIcon.style.marginRight = "4px"; const allText = document.createElement("span"); allText.textContent = "Download All"; downloadAllButton.appendChild(allIcon); downloadAllButton.appendChild(allText); downloadAllButton.style.cssText = ` background-color: #0ea5e9; color: white; border: none; border-radius: 6px; padding: 6px 12px; font-weight: bold; cursor: pointer; font-size: 12px; transition: background-color 0.2s; flex: 1; display: flex; align-items: center; justify-content: center; `; downloadAllButton.addEventListener("mouseenter", () => { downloadAllButton.style.backgroundColor = "#0284c7"; }); downloadAllButton.addEventListener("mouseleave", () => { downloadAllButton.style.backgroundColor = "#0ea5e9"; }); downloadButtonsRow.appendChild(downloadCurrentButton); downloadButtonsRow.appendChild(downloadAllButton); batchInfoContainer.appendChild(batchStatsRow); batchInfoContainer.appendChild(downloadButtonsRow); const downloadButton = document.createElement("button"); const downloadIcon = createDownloadIcon(); downloadIcon.style.width = "16px"; downloadIcon.style.height = "16px"; downloadIcon.style.marginRight = "8px"; downloadButton.innerHTML = ""; downloadButton.appendChild(downloadIcon); downloadButton.appendChild(document.createTextNode("Download")); downloadButton.style.cssText = ` background-color: #0ea5e9; color: white; border: none; border-radius: 6px; padding: 8px 16px; font-weight: bold; cursor: pointer; width: 50%; margin-left: auto; margin-right: auto; display: flex; align-items: center; justify-content: center; text-align: center; transition: background-color 0.2s; `; downloadButton.addEventListener("mouseenter", () => { downloadButton.style.backgroundColor = "#0284c7"; }); downloadButton.addEventListener("mouseleave", () => { downloadButton.style.backgroundColor = "#0ea5e9"; }); downloadButton.onclick = () => downloadMedia(false); if (settings.batchEnabled) { buttonContainer.style.display = "none"; } else { buttonContainer.appendChild(downloadButton); } const batchButtonsContainer = document.createElement("div"); batchButtonsContainer.style.cssText = ` display: none; gap: 8px; margin-bottom: 16px; `; const progressContainer = document.createElement("div"); progressContainer.style.cssText = ` margin-top: 16px; display: none; `; const progressText = document.createElement("div"); progressText.style.cssText = ` margin-bottom: 8px; font-size: 14px; text-align: center; `; progressText.textContent = "Downloading..."; const progressBar = document.createElement("div"); progressBar.style.cssText = ` width: 100%; height: 8px; background-color: ${settings.darkTheme ? "#374151" : "#f1f5f9"}; border-radius: 4px; overflow: hidden; `; const progressFill = document.createElement("div"); progressFill.style.cssText = ` height: 100%; width: 0%; background-color: #0ea5e9; transition: width 0.3s ease-in-out; will-change: width; `; progressBar.appendChild(progressFill); progressContainer.appendChild(progressText); progressContainer.appendChild(progressBar); const convertGifButton = document.createElement("button"); const convertGifIcon = document.createElementNS( "http://www.w3.org/2000/svg", "svg" ); convertGifIcon.setAttribute("xmlns", "http://www.w3.org/2000/svg"); convertGifIcon.setAttribute("viewBox", ICONS.MEDIA_TYPE.GIF.VIEWBOX); convertGifIcon.setAttribute("width", "16"); convertGifIcon.setAttribute("height", "16"); convertGifIcon.style.marginRight = "8px"; const convertGifPath = document.createElementNS( "http://www.w3.org/2000/svg", "path" ); convertGifPath.setAttribute("fill", "currentColor"); convertGifPath.setAttribute("d", ICONS.MEDIA_TYPE.GIF.PATH); convertGifIcon.appendChild(convertGifPath); const convertGifButtonText = document.createElement("span"); convertGifButtonText.textContent = "Convert GIF"; convertGifButton.innerHTML = ""; convertGifButton.appendChild(convertGifIcon); convertGifButton.appendChild(convertGifButtonText); convertGifButton.style.cssText = ` background-color: #3b82f6; color: white; border: none; border-radius: 6px; padding: 8px 16px; font-weight: bold; cursor: pointer; margin: 0; width: 48%; display: flex; justify-content: center; align-items: center; text-align: center; transition: background-color 0.2s; `; convertGifButton.addEventListener("mouseenter", () => { convertGifButton.style.backgroundColor = "#2563eb"; }); convertGifButton.addEventListener("mouseleave", () => { convertGifButton.style.backgroundColor = "#3b82f6"; }); convertGifButton.addEventListener("click", () => { const convertUrl = `https://convert.xbatch.online/${username}`; window.open(convertUrl, "_blank"); }); const mainButtonsContainer = document.createElement("div"); mainButtonsContainer.style.cssText = ` display: flex; gap: 4%; margin: 16px 0; width: 100%; `; mainButtonsContainer.appendChild(fetchButton); mainButtonsContainer.appendChild(convertGifButton); mainContent.appendChild(mainButtonsContainer); mainContent.appendChild(infoContainer); mainContent.appendChild(batchInfoContainer); mainContent.appendChild(batchNavContainer); mainContent.appendChild(buttonContainer); mainContent.appendChild(batchButtonsContainer); mainContent.appendChild(progressContainer); const settingsTabs = document.createElement("div"); settingsTabs.style.cssText = ` display: flex; border-bottom: 1px solid ${settings.darkTheme ? "#374151" : "#e2e8f0"}; margin-bottom: 16px; width: 100%; `; const fetchTab = document.createElement("button"); fetchTab.textContent = "Fetch"; fetchTab.style.cssText = ` background: none; border: none; padding: 12px 16px; cursor: pointer; color: ${settings.darkTheme ? "#f1f5f9" : "#0f172a"}; border-bottom: 2px solid #0ea5e9; font-weight: bold; font-size: 14px; flex: 1; text-align: center; `; const authTab = document.createElement("button"); authTab.textContent = "Auth"; authTab.style.cssText = ` background: none; border: none; padding: 12px 16px; cursor: pointer; color: #64748b; border-bottom: none; font-weight: bold; font-size: 14px; flex: 1; text-align: center; `; const advancedTab = document.createElement("button"); advancedTab.textContent = "Advanced"; advancedTab.style.cssText = ` background: none; border: none; padding: 12px 16px; cursor: pointer; color: #64748b; border-bottom: none; font-weight: bold; font-size: 14px; flex: 1; text-align: center; `; settingsTabs.appendChild(fetchTab); settingsTabs.appendChild(authTab); settingsTabs.appendChild(advancedTab); const fetchTabContent = document.createElement("div"); fetchTabContent.style.cssText = ` display: flex; flex-direction: column; gap: ${settings.batchEnabled ? "16px" : "8px"}; `; const downloadTabContent = document.createElement("div"); downloadTabContent.style.cssText = ` display: none; flex-direction: column; gap: 16px; `; const authTabContent = document.createElement("div"); authTabContent.style.cssText = ` display: none; flex-direction: column; gap: 16px; `; const advancedTabContent = document.createElement("div"); advancedTabContent.style.cssText = ` display: none; flex-direction: column; gap: 0px; `; const patreonAuthGroup = document.createElement("div"); patreonAuthGroup.style.cssText = ` display: flex; flex-direction: column; gap: 8px; `; const patreonAuthLabel = document.createElement("label"); patreonAuthLabel.textContent = "Patreon Auth:"; patreonAuthLabel.style.cssText = ` font-size: 14px; font-weight: bold; color: ${settings.darkTheme ? "#f1f5f9" : "#334155"}; `; const patreonAuthInputContainer = document.createElement("div"); patreonAuthInputContainer.style.cssText = ` position: relative; display: flex; align-items: center; `; const patreonAuthInput = document.createElement("input"); patreonAuthInput.type = "text"; patreonAuthInput.value = settings.patreonAuth; patreonAuthInput.style.cssText = ` background-color: ${settings.darkTheme ? "#374151" : "#f1f5f9"}; border: 1px solid transparent; border-radius: 4px; padding: 8px 12px; color: ${settings.darkTheme ? "#cbd5e1" : "#64748b"}; width: 100%; box-sizing: border-box; transition: all 0.2s ease; `; patreonAuthInput.addEventListener("focus", () => { patreonAuthInput.style.border = "1px solid #0ea5e9"; patreonAuthInput.style.outline = "none"; }); patreonAuthInput.addEventListener("blur", () => { patreonAuthInput.style.border = "1px solid transparent"; }); patreonAuthInput.addEventListener("input", () => { const newSettings = getSettings(); newSettings.patreonAuth = patreonAuthInput.value; saveSettings(newSettings); patreonAuthClearButton.style.display = patreonAuthInput.value ? "block" : "none"; }); const patreonAuthClearButton = document.createElement("button"); patreonAuthClearButton.innerHTML = "×"; patreonAuthClearButton.style.cssText = ` position: absolute; right: 8px; background: none; border: none; color: #64748b; font-size: 18px; cursor: pointer; padding: 0; display: ${settings.patreonAuth ? "block" : "none"}; `; patreonAuthClearButton.addEventListener("click", () => { patreonAuthInput.value = ""; const newSettings = getSettings(); newSettings.patreonAuth = ""; saveSettings(newSettings); patreonAuthClearButton.style.display = "none"; }); patreonAuthInputContainer.appendChild(patreonAuthInput); patreonAuthInputContainer.appendChild(patreonAuthClearButton); patreonAuthGroup.appendChild(patreonAuthLabel); patreonAuthGroup.appendChild(patreonAuthInputContainer); const tokenGroup = document.createElement("div"); tokenGroup.style.cssText = ` display: flex; flex-direction: column; gap: 8px; `; const tokenLabel = document.createElement("label"); tokenLabel.textContent = "Auth Token:"; tokenLabel.style.cssText = ` font-size: 14px; font-weight: bold; color: ${settings.darkTheme ? "#f1f5f9" : "#334155"}; `; const tokenInputContainer = document.createElement("div"); tokenInputContainer.style.cssText = ` position: relative; display: flex; align-items: center; `; const tokenInput = document.createElement("input"); tokenInput.type = "text"; tokenInput.value = settings.authToken; tokenInput.style.cssText = ` background-color: ${settings.darkTheme ? "#374151" : "#f1f5f9"}; border: 1px solid transparent; border-radius: 4px; padding: 8px 12px; color: ${settings.darkTheme ? "#cbd5e1" : "#64748b"}; width: 100%; box-sizing: border-box; transition: all 0.2s ease; `; tokenInput.addEventListener("focus", () => { tokenInput.style.border = "1px solid #0ea5e9"; tokenInput.style.outline = "none"; }); tokenInput.addEventListener("blur", () => { tokenInput.style.border = "1px solid transparent"; }); tokenInput.addEventListener("input", () => { const newSettings = getSettings(); newSettings.authToken = tokenInput.value; saveSettings(newSettings); tokenClearButton.style.display = tokenInput.value ? "block" : "none"; }); const tokenClearButton = document.createElement("button"); tokenClearButton.innerHTML = "×"; tokenClearButton.style.cssText = ` position: absolute; right: 8px; background: none; border: none; color: #64748b; font-size: 18px; cursor: pointer; padding: 0; display: ${settings.authToken ? "block" : "none"}; `; tokenClearButton.addEventListener("click", () => { tokenInput.value = ""; const newSettings = getSettings(); newSettings.authToken = ""; saveSettings(newSettings); tokenClearButton.style.display = "none"; }); tokenInputContainer.appendChild(tokenInput); tokenInputContainer.appendChild(tokenClearButton); tokenGroup.appendChild(tokenLabel); tokenGroup.appendChild(tokenInputContainer); const apiServerGroup = document.createElement("div"); apiServerGroup.style.cssText = ` display: flex; flex-direction: column; gap: 8px; `; const apiServerLabel = document.createElement("label"); apiServerLabel.textContent = "Service:"; apiServerLabel.style.cssText = ` font-size: 14px; font-weight: bold; color: ${settings.darkTheme ? "#f1f5f9" : "#334155"}; `; const apiServerOptions = [ { value: "default", label: "Default" }, { value: "backup", label: "Backup" }, ]; const apiServerToggle = createToggleSwitch( apiServerOptions, settings.apiServer, (value) => { const newSettings = getSettings(); newSettings.apiServer = value; saveSettings(newSettings); settings.apiServer = value; } ); apiServerGroup.appendChild(apiServerLabel); apiServerGroup.appendChild(apiServerToggle); const batchGroup = document.createElement("div"); batchGroup.style.cssText = ` display: flex; align-items: center; gap: 8px; `; const batchLabel = document.createElement("label"); batchLabel.style.cssText = ` font-size: 14px; font-weight: bold; color: ${settings.darkTheme ? "#f1f5f9" : "#334155"}; flex: 1; display: flex; align-items: center; `; const batchLabelText = document.createElement("span"); batchLabelText.textContent = "Batch:"; batchLabel.appendChild(batchLabelText); const batchInfoIcon = createInfoIcon(); const batchTooltip = createInfoTooltip( "When enabled, the media fetching process is performed in batches" ); batchInfoIcon.addEventListener("mouseenter", batchTooltip.showTooltip); batchInfoIcon.addEventListener("mouseleave", batchTooltip.hideTooltip); batchLabel.appendChild(batchInfoIcon); const batchToggle = document.createElement("div"); batchToggle.style.cssText = ` position: relative; width: 50px; height: 24px; background-color: ${settings.batchEnabled ? "#22c55e" : "#cbd5e1"}; border-radius: 12px; cursor: pointer; transition: background-color 0.3s; `; const batchToggleHandle = document.createElement("div"); batchToggleHandle.style.cssText = ` position: absolute; top: 2px; left: ${settings.batchEnabled ? "28px" : "2px"}; width: 20px; height: 20px; background-color: white; border-radius: 50%; transition: left 0.3s; `; batchToggle.appendChild(batchToggleHandle); batchToggle.addEventListener("click", () => { const newSettings = getSettings(); newSettings.batchEnabled = !newSettings.batchEnabled; saveSettings(newSettings); batchToggle.style.backgroundColor = newSettings.batchEnabled ? "#22c55e" : "#cbd5e1"; batchToggleHandle.style.left = newSettings.batchEnabled ? "28px" : "2px"; autoBatchGroup.style.display = newSettings.batchEnabled ? "flex" : "none"; batchSizeGroup.style.display = newSettings.batchEnabled ? "flex" : "none"; startingBatchGroup.style.display = newSettings.batchEnabled ? "flex" : "none"; if (!newSettings.batchEnabled) { fetchTabContent.style.gap = "8px"; newSettings.autoBatchEnabled = false; saveSettings(newSettings); autoBatchToggle.style.backgroundColor = "#cbd5e1"; autoBatchHandle.style.left = "2px"; const mt = getSettings().mediaType; const mtLabel = getMediaTypeLabel(mt).toLowerCase(); const labelText = mt === "all" ? "Fetch Media" : `Fetch ${ mtLabel === "gif" ? "GIF" : mtLabel.charAt(0).toUpperCase() + mtLabel.slice(1) }`; fetchButtonText.textContent = labelText; fetchButton.innerHTML = ""; let updatedFetchIcon = fetchIcon.cloneNode(true); fetchButton.appendChild(updatedFetchIcon); fetchButton.appendChild(fetchButtonText); if (typeof stopFetchButton !== "undefined") stopFetchButton.style.display = "none"; if (typeof prevBatchButton !== "undefined") prevBatchButton.style.display = "block"; if (typeof nextBatchButton !== "undefined") nextBatchButton.style.display = "block"; } else { fetchTabContent.style.gap = "16px"; } }); batchGroup.appendChild(batchLabel); batchGroup.appendChild(batchToggle); const autoBatchGroup = document.createElement("div"); autoBatchGroup.style.cssText = ` display: ${settings.batchEnabled ? "flex" : "none"}; align-items: center; gap: 8px; `; const autoBatchLabel = document.createElement("label"); autoBatchLabel.style.cssText = ` font-size: 14px; font-weight: bold; color: ${settings.darkTheme ? "#f1f5f9" : "#334155"}; flex: 1; display: flex; align-items: center; `; autoBatchLabel.textContent = "Auto Fetch"; const autoBatchToggle = document.createElement("div"); autoBatchToggle.style.cssText = ` position: relative; width: 50px; height: 24px; background-color: ${settings.autoBatchEnabled ? "#22c55e" : "#cbd5e1"}; border-radius: 12px; cursor: pointer; transition: background-color 0.3s; `; const autoBatchHandle = document.createElement("div"); autoBatchHandle.style.cssText = ` position: absolute; top: 2px; left: ${settings.autoBatchEnabled ? "28px" : "2px"}; width: 20px; height: 20px; background-color: white; border-radius: 50%; transition: left 0.3s; `; autoBatchToggle.appendChild(autoBatchHandle); autoBatchToggle.addEventListener("click", () => { const newSettings = getSettings(); const willEnable = !newSettings.autoBatchEnabled; newSettings.autoBatchEnabled = willEnable; saveSettings(newSettings); autoBatchCancelled = false; autoBatchStarted = false; autoBatchToggle.style.backgroundColor = willEnable ? "#22c55e" : "#cbd5e1"; autoBatchHandle.style.left = willEnable ? "28px" : "2px"; const label = willEnable ? "Auto Fetch" : newSettings.mediaType === "all" ? "Fetch Media" : newSettings.mediaType === "image" ? "Fetch Photos" : "Fetch Videos"; fetchButtonText.textContent = label; if (willEnable) { const keyPrefix = `twitter_dl_${newSettings.timelineType}_${newSettings.mediaType}_${username}_`; const keySuffix = `_${newSettings.batchSize}_batch_true`; for (let i = 0; i < localStorage.length; i++) { const key = localStorage.key(i); if (key.startsWith(keyPrefix) && key.endsWith(keySuffix)) { const pageNum = parseInt( key.slice(keyPrefix.length, key.length - keySuffix.length), 10 ); if (!isNaN(pageNum)) { const cachedData = cacheManager.get(key); if (cachedData && cachedData.timeline) { mediaData.batchData[pageNum] = cachedData.timeline; } } } } const batchNums = Object.keys(mediaData.batchData).map(Number); mediaData.currentPage = batchNums.length > 0 ? Math.max(...batchNums) + 1 : 0; fetchButtonText.textContent = "Auto Fetch"; } else { const mt = newSettings.mediaType; const label = mt === "all" ? "Fetch Media" : `Fetch ${getMediaTypeLabel(mt).toUpperCase()}`; fetchButtonText.textContent = label; } }); autoBatchGroup.appendChild(autoBatchLabel); autoBatchGroup.appendChild(autoBatchToggle); const batchSizeGroup = document.createElement("div"); batchSizeGroup.style.cssText = ` display: ${settings.batchEnabled ? "flex" : "none"}; flex-direction: column; gap: 8px; `; const batchSizeLabel = document.createElement("label"); batchSizeLabel.style.cssText = ` font-size: 14px; font-weight: bold; color: ${settings.darkTheme ? "#f1f5f9" : "#334155"}; display: flex; align-items: center; `; const batchSizeLabelText = document.createElement("span"); batchSizeLabelText.textContent = "Batch Size:"; batchSizeLabel.appendChild(batchSizeLabelText); const batchSizeInfoIcon = createInfoIcon(); const batchSizeTooltip = createInfoTooltip( "Number of media items fetched in a single request" ); batchSizeInfoIcon.addEventListener( "mouseenter", batchSizeTooltip.showTooltip ); batchSizeInfoIcon.addEventListener( "mouseleave", batchSizeTooltip.hideTooltip ); batchSizeLabel.appendChild(batchSizeInfoIcon); const batchSizeToggle = createSlider( batchSizes, settings.batchSize, (value) => { const newSettings = getSettings(); newSettings.batchSize = value; saveSettings(newSettings); settings.batchSize = value; } ); batchSizeGroup.appendChild(batchSizeLabel); batchSizeGroup.appendChild(batchSizeToggle); const startingBatchGroup = document.createElement("div"); startingBatchGroup.style.cssText = ` display: ${settings.batchEnabled ? "flex" : "none"}; flex-direction: column; gap: 8px; `; const startingBatchLabel = document.createElement("label"); startingBatchLabel.style.cssText = ` font-size: 14px; font-weight: bold; color: ${settings.darkTheme ? "#f1f5f9" : "#334155"}; display: flex; align-items: center; `; const startingBatchLabelText = document.createElement("span"); startingBatchLabelText.textContent = "Starting Batch:"; startingBatchLabel.appendChild(startingBatchLabelText); const startingBatchInfoIcon = createInfoIcon(); const startingBatchTooltip = createInfoTooltip( "Determines which batch number to start fetching from" ); startingBatchInfoIcon.addEventListener( "mouseenter", startingBatchTooltip.showTooltip ); startingBatchInfoIcon.addEventListener( "mouseleave", startingBatchTooltip.hideTooltip ); startingBatchLabel.appendChild(startingBatchInfoIcon); const startingBatchInput = document.createElement("input"); startingBatchInput.type = "number"; startingBatchInput.value = settings.startingBatch; startingBatchInput.min = "0"; startingBatchInput.style.cssText = ` background-color: ${settings.darkTheme ? "#374151" : "#f1f5f9"}; border: 1px solid transparent; border-radius: 4px; padding: 8px 12px; color: ${settings.darkTheme ? "#cbd5e1" : "#64748b"}; width: 100%; box-sizing: border-box; transition: all 0.2s ease; `; startingBatchInput.addEventListener("focus", () => { startingBatchInput.style.border = "1px solid #0ea5e9"; startingBatchInput.style.outline = "none"; }); startingBatchInput.addEventListener("blur", () => { startingBatchInput.style.border = "1px solid transparent"; }); startingBatchInput.addEventListener("input", () => { const newSettings = getSettings(); newSettings.startingBatch = parseInt(startingBatchInput.value) || 0; saveSettings(newSettings); settings.startingBatch = newSettings.startingBatch; }); startingBatchGroup.appendChild(startingBatchLabel); startingBatchGroup.appendChild(startingBatchInput); const timelineTypeGroup = document.createElement("div"); timelineTypeGroup.style.cssText = ` display: flex; flex-direction: column; gap: 8px; `; const timelineTypeLabel = document.createElement("label"); timelineTypeLabel.textContent = "Timeline Type:"; timelineTypeLabel.style.cssText = ` font-size: 14px; font-weight: bold; color: ${settings.darkTheme ? "#f1f5f9" : "#334155"}; `; const timelineTypeOptions = [ { value: "media", label: "Media", icon: createTimelineTypeIcon("media") }, { value: "timeline", label: "Post", icon: createTimelineTypeIcon("timeline"), }, { value: "tweets", label: "Tweets", icon: createTimelineTypeIcon("tweets"), }, { value: "with_replies", label: "Replies", icon: createTimelineTypeIcon("with_replies"), }, ]; const timelineTypeToggle = createToggleSwitch( timelineTypeOptions, settings.timelineType, (value) => { const newSettings = getSettings(); newSettings.timelineType = value; saveSettings(newSettings); settings.timelineType = value; } ); timelineTypeGroup.appendChild(timelineTypeLabel); timelineTypeGroup.appendChild(timelineTypeToggle); const mediaTypeGroup = document.createElement("div"); mediaTypeGroup.style.cssText = ` display: flex; flex-direction: column; gap: 8px; `; const mediaTypeLabel = document.createElement("label"); mediaTypeLabel.textContent = "Media Type:"; mediaTypeLabel.style.cssText = ` font-size: 14px; font-weight: bold; color: ${settings.darkTheme ? "#f1f5f9" : "#334155"}; `; const mediaTypeIcons = createMediaTypeIcons(); const mediaTypeOptions = [ { value: "all", label: "All", icon: mediaTypeIcons.all }, { value: "image", label: "Image", icon: mediaTypeIcons.image }, { value: "video", label: "Video", icon: mediaTypeIcons.video }, { value: "gif", label: "GIF", icon: mediaTypeIcons.gif }, ]; const mediaTypeToggle = createToggleSwitch( mediaTypeOptions, settings.mediaType, (value) => { const newSettings = getSettings(); newSettings.mediaType = value; saveSettings(newSettings); settings.mediaType = value; const newMediaTypeLabel = getMediaTypeLabel(value).toLowerCase(); const newFetchButtonText = value === "all" ? "Fetch Media" : `Fetch ${ newMediaTypeLabel === "gif" ? "GIF" : newMediaTypeLabel.charAt(0).toUpperCase() + newMediaTypeLabel.slice(1) }`; fetchButton.innerHTML = ""; const newFetchIcon = fetchIcon.cloneNode(true); fetchButton.appendChild(newFetchIcon); fetchButton.appendChild(document.createTextNode(newFetchButtonText)); title.innerHTML = `Download ${getMediaTypeLabel( value )}: <span style="color: #0ea5e9">${username}</span>`; } ); mediaTypeGroup.appendChild(mediaTypeLabel); mediaTypeGroup.appendChild(mediaTypeToggle); const concurrentGroup = document.createElement("div"); concurrentGroup.style.cssText = ` display: flex; flex-direction: column; gap: 8px; `; const concurrentLabel = document.createElement("label"); concurrentLabel.style.cssText = ` font-size: 14px; font-weight: bold; color: ${settings.darkTheme ? "#f1f5f9" : "#334155"}; display: flex; align-items: center; `; const concurrentLabelText = document.createElement("span"); concurrentLabelText.textContent = "Batch Download Items:"; concurrentLabel.appendChild(concurrentLabelText); const concurrentInfoIcon = createInfoIcon(); const concurrentTooltip = createInfoTooltip( "Total item that are downloaded in a single request" ); concurrentInfoIcon.addEventListener( "mouseenter", concurrentTooltip.showTooltip ); concurrentInfoIcon.addEventListener( "mouseleave", concurrentTooltip.hideTooltip ); concurrentLabel.appendChild(concurrentInfoIcon); const concurrentToggle = document.createElement("div"); concurrentToggle.textContent = "Fixed to 50 concurrent downloads"; concurrentToggle.style.cssText = ` padding: 10px; background-color: ${settings.darkTheme ? "#374151" : "#f1f5f9"}; color: ${settings.darkTheme ? "#f1f5f9" : "#334155"}; border-radius: 8px; text-align: center; `; concurrentGroup.appendChild(concurrentLabel); concurrentGroup.appendChild(concurrentToggle); const cacheDurationGroup = document.createElement("div"); cacheDurationGroup.style.cssText = ` display: flex; flex-direction: column; gap: 8px; `; const cacheDurationLabel = document.createElement("label"); cacheDurationLabel.textContent = "Cache Duration:"; cacheDurationLabel.style.cssText = ` font-size: 14px; font-weight: bold; color: ${settings.darkTheme ? "#f1f5f9" : "#334155"}; `; const cacheDurationOptions = cacheDurations.map((duration) => { let label = duration.toString() + "m"; if (duration >= 60 && duration % 60 === 0) { label = `${duration / 60}h`; } return { value: duration, label: label }; }); const cacheDurationToggle = createToggleSwitch( cacheDurationOptions, settings.cacheDuration, (value) => { const newSettings = getSettings(); newSettings.cacheDuration = value; saveSettings(newSettings); settings.cacheDuration = value; } ); cacheDurationGroup.appendChild(cacheDurationLabel); cacheDurationGroup.appendChild(cacheDurationToggle); const darkThemeGroup = document.createElement("div"); darkThemeGroup.style.cssText = ` display: flex; align-items: center; gap: 8px; `; const darkThemeLabel = document.createElement("label"); darkThemeLabel.style.cssText = ` font-size: 14px; font-weight: bold; color: ${settings.darkTheme ? "#f1f5f9" : "#334155"}; flex: 1; display: flex; align-items: center; `; const darkThemeLabelText = document.createElement("span"); darkThemeLabelText.textContent = "Dark Theme:"; darkThemeLabel.appendChild(darkThemeLabelText); const darkThemeToggle = document.createElement("div"); darkThemeToggle.style.cssText = ` position: relative; width: 50px; height: 24px; background-color: ${settings.darkTheme ? "#22c55e" : "#cbd5e1"}; border-radius: 12px; cursor: pointer; transition: background-color 0.3s; `; const darkThemeToggleHandle = document.createElement("div"); darkThemeToggleHandle.style.cssText = ` position: absolute; top: 2px; left: ${settings.darkTheme ? "28px" : "2px"}; width: 20px; height: 20px; background-color: white; border-radius: 50%; transition: left 0.3s; `; darkThemeToggle.appendChild(darkThemeToggleHandle); darkThemeToggle.addEventListener("click", () => { const newSettings = getSettings(); newSettings.darkTheme = !newSettings.darkTheme; saveSettings(newSettings); settings.darkTheme = newSettings.darkTheme; darkThemeToggle.style.backgroundColor = newSettings.darkTheme ? "#22c55e" : "#cbd5e1"; darkThemeToggleHandle.style.left = newSettings.darkTheme ? "28px" : "2px"; updateTheme(); }); darkThemeGroup.appendChild(darkThemeLabel); darkThemeGroup.appendChild(darkThemeToggle); const buttonsContainer = document.createElement("div"); buttonsContainer.style.cssText = ` display: flex; gap: 16px; margin-top: 16px; width: 100%; justify-content: center; align-items: center; `; const clearCacheButton = document.createElement("button"); const trashIcon = document.createElementNS( "http://www.w3.org/2000/svg", "svg" ); trashIcon.setAttribute("xmlns", "http://www.w3.org/2000/svg"); trashIcon.setAttribute("viewBox", ICONS.CLEAR.VIEWBOX); trashIcon.setAttribute("width", "16"); trashIcon.setAttribute("height", "16"); trashIcon.style.marginRight = "8px"; const trashPath = document.createElementNS( "http://www.w3.org/2000/svg", "path" ); trashPath.setAttribute("fill", "currentColor"); trashPath.setAttribute("d", ICONS.CLEAR.PATH); trashIcon.appendChild(trashPath); clearCacheButton.appendChild(trashIcon); clearCacheButton.appendChild(document.createTextNode("Clear Cache")); clearCacheButton.style.cssText = ` background-color: #ef4444; color: white; border: none; border-radius: 6px; padding: 8px 16px; font-weight: bold; cursor: pointer; flex: 1; display: flex; align-items: center; justify-content: center; text-align: center; transition: background-color 0.2s; `; const resetDefaultButton = document.createElement("button"); const resetIcon = document.createElementNS( "http://www.w3.org/2000/svg", "svg" ); resetIcon.setAttribute("xmlns", "http://www.w3.org/2000/svg"); resetIcon.setAttribute("viewBox", ICONS.RESET.VIEWBOX); resetIcon.setAttribute("width", "16"); resetIcon.setAttribute("height", "16"); resetIcon.style.marginRight = "8px"; const resetPath = document.createElementNS( "http://www.w3.org/2000/svg", "path" ); resetPath.setAttribute("fill", "currentColor"); resetPath.setAttribute("d", ICONS.RESET.PATH); resetIcon.appendChild(resetPath); resetDefaultButton.appendChild(resetIcon); resetDefaultButton.appendChild(document.createTextNode("Reset Default")); resetDefaultButton.style.cssText = ` background-color: #6366f1; color: white; border: none; border-radius: 6px; padding: 8px 16px; font-weight: bold; cursor: pointer; flex: 1; display: flex; align-items: center; justify-content: center; text-align: center; transition: background-color 0.2s; `; buttonsContainer.appendChild(clearCacheButton); buttonsContainer.appendChild(resetDefaultButton); clearCacheButton.addEventListener("mouseenter", () => { clearCacheButton.style.backgroundColor = "#dc2626"; }); clearCacheButton.addEventListener("mouseleave", () => { clearCacheButton.style.backgroundColor = "#ef4444"; }); resetDefaultButton.addEventListener("mouseenter", () => { resetDefaultButton.style.backgroundColor = "#5b56f4"; }); resetDefaultButton.addEventListener("mouseleave", () => { resetDefaultButton.style.backgroundColor = "#6366f1"; }); clearCacheButton.addEventListener("click", () => { createConfirmDialog("Are you sure about clearing the cache?", () => { cacheManager.clear(); createInfoDialog( "Cache has been successfully cleared.", "Clear Successful" ); }); }); resetDefaultButton.addEventListener("click", () => { createConfirmDialog( "Are you sure you want to reset all settings to default values?", () => { const currentSettings = getSettings(); const preservedPatreonAuth = currentSettings.patreonAuth; const preservedAuthToken = currentSettings.authToken; const resetSettings = { ...defaultSettings }; resetSettings.patreonAuth = preservedPatreonAuth; resetSettings.authToken = preservedAuthToken; saveSettings(resetSettings); startingBatchInput.value = defaultSettings.startingBatch; batchToggle.style.backgroundColor = defaultSettings.batchEnabled ? "#22c55e" : "#cbd5e1"; batchToggleHandle.style.left = defaultSettings.batchEnabled ? "28px" : "2px"; batchSizeGroup.style.display = defaultSettings.batchEnabled ? "flex" : "none"; startingBatchGroup.style.display = defaultSettings.batchEnabled ? "flex" : "none"; autoBatchGroup.style.display = defaultSettings.batchEnabled ? "flex" : "none"; patreonAuthClearButton.style.display = preservedPatreonAuth ? "block" : "none"; tokenClearButton.style.display = preservedAuthToken ? "block" : "none"; const timelineTypeOptions = [ "media", "timeline", "tweets", "with_replies", ]; const timelineTypeIndex = timelineTypeOptions.indexOf( defaultSettings.timelineType ); const timelineTypeSlider = timelineTypeToggle.querySelector("div:first-child"); const timelineTypeContainer = timelineTypeToggle.querySelector("div:last-child"); if ( timelineTypeSlider && timelineTypeContainer && timelineTypeIndex !== -1 ) { timelineTypeSlider.style.transform = `translateX(${ timelineTypeIndex * 100 }%)`; timelineTypeContainer.querySelectorAll("div").forEach((opt, i) => { opt.style.color = i === timelineTypeIndex ? "white" : "#64748b"; const optIcon = opt.querySelector("svg"); if (optIcon) { const optPaths = optIcon.querySelectorAll("path"); optPaths.forEach((path) => { path.setAttribute( "fill", i === timelineTypeIndex ? "white" : "#64748b" ); }); } }); } const mediaTypeOptions = ["all", "image", "video", "gif"]; const mediaTypeIndex = mediaTypeOptions.indexOf( defaultSettings.mediaType ); const mediaTypeSlider = mediaTypeToggle.querySelector("div:first-child"); const mediaTypeContainer = mediaTypeToggle.querySelector("div:last-child"); if (mediaTypeSlider && mediaTypeContainer && mediaTypeIndex !== -1) { mediaTypeSlider.style.transform = `translateX(${ mediaTypeIndex * 100 }%)`; mediaTypeContainer.querySelectorAll("div").forEach((opt, i) => { opt.style.color = i === mediaTypeIndex ? "white" : "#64748b"; const optIcon = opt.querySelector("svg"); if (optIcon) { const optPaths = optIcon.querySelectorAll("path"); optPaths.forEach((path) => { path.setAttribute( "fill", i === mediaTypeIndex ? "white" : "#64748b" ); }); } }); } const batchSizeIndex = batchSizes.indexOf(defaultSettings.batchSize); const batchSizeSlider = batchSizeToggle.querySelector("div:first-child"); const batchSizeContainer = batchSizeToggle.querySelector("div:last-child"); if (batchSizeSlider && batchSizeContainer && batchSizeIndex !== -1) { batchSizeSlider.style.transform = `translateX(${ batchSizeIndex * 100 }%)`; batchSizeContainer.querySelectorAll("div").forEach((opt, i) => { opt.style.color = i === batchSizeIndex ? "white" : "#64748b"; const optIcon = opt.querySelector("svg"); if (optIcon) { const optPaths = optIcon.querySelectorAll("path"); optPaths.forEach((path) => { path.setAttribute( "fill", i === batchSizeIndex ? "white" : "#64748b" ); }); } }); } const cacheDurationIndex = cacheDurations.indexOf( defaultSettings.cacheDuration ); const cacheDurationSlider = cacheDurationToggle.querySelector("div:first-child"); const cacheDurationContainer = cacheDurationToggle.querySelector("div:last-child"); if ( cacheDurationSlider && cacheDurationContainer && cacheDurationIndex !== -1 ) { cacheDurationSlider.style.transform = `translateX(${ cacheDurationIndex * 100 }%)`; cacheDurationContainer.querySelectorAll("div").forEach((opt, i) => { opt.style.color = i === cacheDurationIndex ? "white" : "#64748b"; const optIcon = opt.querySelector("svg"); if (optIcon) { const optPaths = optIcon.querySelectorAll("path"); optPaths.forEach((path) => { path.setAttribute( "fill", i === cacheDurationIndex ? "white" : "#64748b" ); }); } }); } const apiServerOptions = ["default", "backup"]; const apiServerIndex = apiServerOptions.indexOf( defaultSettings.apiServer ); const apiServerSlider = apiServerToggle.querySelector("div:first-child"); const apiServerContainer = apiServerToggle.querySelector("div:last-child"); if (apiServerSlider && apiServerContainer && apiServerIndex !== -1) { apiServerSlider.style.transform = `translateX(${ apiServerIndex * 100 }%)`; apiServerContainer.querySelectorAll("div").forEach((opt, i) => { opt.style.color = i === apiServerIndex ? "white" : "#64748b"; const optIcon = opt.querySelector("svg"); if (optIcon) { const optPaths = optIcon.querySelectorAll("path"); optPaths.forEach((path) => { path.setAttribute( "fill", i === apiServerIndex ? "white" : "#64748b" ); }); } }); } darkThemeToggle.style.backgroundColor = defaultSettings.darkTheme ? "#22c55e" : "#cbd5e1"; darkThemeToggleHandle.style.left = defaultSettings.darkTheme ? "28px" : "2px"; settings.darkTheme = defaultSettings.darkTheme; updateTheme(); const newMediaTypeLabel = getMediaTypeLabel( defaultSettings.mediaType ).toLowerCase(); const newFetchButtonText = defaultSettings.mediaType === "all" ? "Fetch Media" : `Fetch ${ newMediaTypeLabel === "gif" ? "GIF" : newMediaTypeLabel.charAt(0).toUpperCase() + newMediaTypeLabel.slice(1) }`; fetchButton.innerHTML = ""; const newFetchIcon = fetchIcon.cloneNode(true); fetchButton.appendChild(newFetchIcon); fetchButton.appendChild(document.createTextNode(newFetchButtonText)); title.innerHTML = `Download ${getMediaTypeLabel( defaultSettings.mediaType )}: <span style="color: #0ea5e9">${username}</span>`; setTimeout(() => { createInfoDialog( "Settings have been successfully reset to default values.", "Reset Successful" ); }, 100); } ); }); const patreonLink = document.createElement("a"); patreonLink.href = "https://www.patreon.com/exyezed"; patreonLink.target = "_blank"; patreonLink.style.cssText = ` display: flex; align-items: center; justify-content: center; color: #64748b; text-decoration: none; margin-top: 16px; padding: 8px; border-radius: 8px; transition: background-color 0.2s, color 0.2s; `; patreonLink.innerHTML = createPatreonIcon().outerHTML + "Patreon Authentication"; patreonLink.addEventListener("mouseenter", () => { patreonLink.style.backgroundColor = settings.darkTheme ? "#374151" : "#f1f5f9"; patreonLink.style.color = "#0ea5e9"; }); patreonLink.addEventListener("mouseleave", () => { patreonLink.style.backgroundColor = "transparent"; patreonLink.style.color = "#64748b"; }); const batchSizeStartingContainer = document.createElement("div"); batchSizeStartingContainer.style.cssText = ` display: flex; flex-direction: column; gap: 0px; `; batchSizeStartingContainer.appendChild(batchSizeGroup); batchSizeStartingContainer.appendChild(startingBatchGroup); const mediaTimelineContainer = document.createElement("div"); mediaTimelineContainer.style.cssText = ` display: flex; flex-direction: column; gap: 0px; `; mediaTimelineContainer.appendChild(mediaTypeGroup); mediaTimelineContainer.appendChild(timelineTypeGroup); fetchTabContent.appendChild(batchGroup); fetchTabContent.appendChild(autoBatchGroup); fetchTabContent.appendChild(batchSizeStartingContainer); fetchTabContent.appendChild(mediaTimelineContainer); authTabContent.appendChild(patreonAuthGroup); authTabContent.appendChild(tokenGroup); authTabContent.appendChild(patreonLink); advancedTabContent.appendChild(darkThemeGroup); apiServerGroup.style.marginTop = "16px"; advancedTabContent.appendChild(apiServerGroup); cacheDurationGroup.style.marginTop = "0px"; advancedTabContent.appendChild(cacheDurationGroup); buttonsContainer.style.marginTop = "16px"; advancedTabContent.appendChild(buttonsContainer); function switchTab(activeTab, activeContent) { const allTabs = [fetchTab, authTab, advancedTab]; const allContents = [fetchTabContent, authTabContent, advancedTabContent]; allTabs.forEach((tab) => { if (tab && tab.style) { tab.style.color = "#64748b"; tab.style.borderBottom = "none"; } }); allContents.forEach((content) => { if (content && content.style) { content.style.display = "none"; } }); if (activeTab && activeTab.style) { activeTab.style.color = settings.darkTheme ? "#f1f5f9" : "#0f172a"; activeTab.style.borderBottom = "2px solid #0ea5e9"; } if (activeContent && activeContent.style) { activeContent.style.display = "flex"; } } fetchTab.addEventListener("click", function () { switchTab(fetchTab, fetchTabContent); }); authTab.addEventListener("click", function () { switchTab(authTab, authTabContent); }); advancedTab.addEventListener("click", function () { switchTab(advancedTab, advancedTabContent); }); const settingsForm = document.createElement("div"); settingsForm.style.cssText = ` display: flex; flex-direction: column; `; settingsForm.appendChild(settingsTabs); settingsForm.appendChild(fetchTabContent); settingsForm.appendChild(authTabContent); settingsForm.appendChild(advancedTabContent); settingsContent.appendChild(settingsForm); mainTab.addEventListener("click", function () { mainTab.style.borderBottom = "2px solid #0ea5e9"; mainTab.style.color = settings.darkTheme ? "#f1f5f9" : "#0f172a"; settingsTab.style.borderBottom = "none"; settingsTab.style.color = "#64748b"; mainContent.style.display = "block"; settingsContent.style.display = "none"; }); settingsTab.addEventListener("click", function () { settingsTab.style.borderBottom = "2px solid #0ea5e9"; settingsTab.style.color = settings.darkTheme ? "#f1f5f9" : "#0f172a"; mainTab.style.borderBottom = "none"; mainTab.style.color = "#64748b"; settingsContent.style.display = "block"; mainContent.style.display = "none"; switchTab(fetchTab, fetchTabContent); }); modalContent.appendChild(header); modalContent.appendChild(tabs); modalContent.appendChild(mainContent); modalContent.appendChild(settingsContent); modal.appendChild(modalContent); const mediaData = { username: username, currentPage: getSettings().startingBatch, mediaItems: [], allMediaItems: [], batchData: {}, hasMore: false, downloading: false, totalDownloaded: 0, totalToDownload: 0, totalItems: 0, nextBatchClicked: false, }; function refreshInfoDisplays() { const isDark = getSettings().darkTheme; if (infoContainer.innerHTML && mediaData.totalItems > 0) { const settings = getSettings(); const mediaTypeLabel = getMediaTypeLabel(settings.mediaType); if ( settings.batchEnabled && mediaData.mediaItems && mediaData.mediaItems.length > 0 ) { const accountIconHtml = createAccountIcon(isDark).outerHTML; const mediaIconHtml = createMediaTypeIcon( settings.mediaType, isDark ).outerHTML; const totalItemsIconHtml = createTotalItemsIcon(isDark).outerHTML; infoContainer.innerHTML = ` <div style="margin-bottom: 8px; display: flex; align-items: center;">${accountIconHtml}<strong style="margin-right: 6px;">Account:</strong><span>${ mediaData.username }</span></div> <div style="margin-bottom: 8px; display: flex; align-items: center;">${mediaIconHtml}<strong style="margin-right: 6px;">${mediaTypeLabel} Found:</strong><span>${formatNumber( mediaData.totalItems )}</span></div> <div style="margin-bottom: 8px; display: flex; align-items: center;">${totalItemsIconHtml}<strong style="margin-right: 6px;">Total Items:</strong><span>${formatNumber( mediaData.allMediaItems.length )}</span></div> `; } else if ( mediaData.allMediaItems && mediaData.allMediaItems.length > 0 ) { const accountIconHtml = createAccountIcon(isDark).outerHTML; const mediaIconHtml = createMediaTypeIcon( settings.mediaType, isDark ).outerHTML; const totalZipIconHtml = createTotalZipIcon(isDark).outerHTML; const currentPart = Math.floor(mediaData.allMediaItems.length / 500) + 1; infoContainer.innerHTML = ` <div style="margin-bottom: 8px; display: flex; align-items: center;">${accountIconHtml}<strong style="margin-right: 6px;">Account:</strong><span>${ mediaData.username }</span></div> <div style="margin-bottom: 8px; display: flex; align-items: center;">${mediaIconHtml}<strong style="margin-right: 6px;">${mediaTypeLabel} Found:</strong><span>${formatNumber( mediaData.totalItems )}</span></div> <div style="margin-top: 8px; display: flex; align-items: center;">${totalZipIconHtml}<strong style="margin-right: 6px;">Total ZIP ${ currentPart === 1 ? "File" : "Files" }:</strong><span>${currentPart}</span></div> `; } } if (infoContainer.innerHTML) { const accountIcons = infoContainer.querySelectorAll( 'svg[viewBox="0 0 24 24"]' ); accountIcons.forEach((icon) => { icon.style.color = isDark ? "#ffffff" : "#64748b"; }); const mediaIcons = infoContainer.querySelectorAll( 'svg[viewBox="0 0 576 512"], svg[viewBox="0 0 512 512"], svg[viewBox="0 0 640 512"]' ); mediaIcons.forEach((icon) => { icon.style.color = isDark ? "#ffffff" : "#64748b"; }); const totalIcons = infoContainer.querySelectorAll( 'svg[viewBox="0 0 448 512"]' ); totalIcons.forEach((icon) => { icon.style.color = isDark ? "#ffffff" : "#64748b"; }); } } function updateBatchLabels() { const isDark = getSettings().darkTheme; const settings = getSettings(); if (currentBatchLabel && currentBatchLabel.innerHTML) { const currentBatchIconHtml = createCurrentBatchIcon(isDark).outerHTML; currentBatchLabel.innerHTML = `<div style="display: flex; align-items: center;">${currentBatchIconHtml}<strong style="margin-right: 6px; color: ${ settings.darkTheme ? "#ffffff" : "#475569" };">Current Batch:</strong><span style="color: ${ settings.darkTheme ? "#ffffff" : "#475569" };">${mediaData.currentPage + 1}</span></div>`; } if ( totalBatchLabel && totalBatchLabel.innerHTML && mediaData.totalItems > 0 ) { const totalBatches = Math.ceil( mediaData.totalItems / settings.batchSize ); const totalZipIconHtml = createTotalZipIcon(isDark).outerHTML; totalBatchLabel.innerHTML = `<div style="display: flex; align-items: center;">${totalZipIconHtml}<strong style="margin-right: 6px; color: ${ settings.darkTheme ? "#ffffff" : "#475569" };">Total ZIP ${ totalBatches === 1 ? "File" : "Files" }:</strong><span style="color: ${ settings.darkTheme ? "#ffffff" : "#475569" };">${totalBatches}</span></div>`; } if (currentBatchLabel && currentBatchLabel.innerHTML) { const batchIcons = currentBatchLabel.querySelectorAll("svg"); batchIcons.forEach((icon) => { icon.style.color = isDark ? "#ffffff" : "#64748b"; }); } if (totalBatchLabel && totalBatchLabel.innerHTML) { const zipIcons = totalBatchLabel.querySelectorAll("svg"); zipIcons.forEach((icon) => { icon.style.color = isDark ? "#ffffff" : "#64748b"; }); } } function updateTheme() { const isDark = getSettings().darkTheme; modalContent.style.backgroundColor = isDark ? "#1f2937" : "#ffffff"; modalContent.style.color = isDark ? "#f1f5f9" : "#334155"; header.style.borderBottom = `1px solid ${isDark ? "#374151" : "#e2e8f0"}`; title.style.color = isDark ? "#f1f5f9" : "#334155"; closeButton.style.color = isDark ? "#f1f5f9" : "#0f172a"; tabs.style.borderBottom = `1px solid ${isDark ? "#374151" : "#e2e8f0"}`; mainTab.style.color = mainContent.style.display === "block" ? isDark ? "#f1f5f9" : "#0f172a" : "#64748b"; settingsTab.style.color = settingsContent.style.display === "block" ? isDark ? "#f1f5f9" : "#0f172a" : "#64748b"; infoContainer.style.backgroundColor = isDark ? "#374151" : "#f1f5f9"; batchInfoContainer.style.backgroundColor = isDark ? "#374151" : "#f8fafc"; batchInfoContainer.style.border = `1px solid ${ isDark ? "#4b5563" : "#e2e8f0" }`; settingsTabs.style.borderBottom = `1px solid ${ isDark ? "#374151" : "#e2e8f0" }`; const allSettingTabs = [fetchTab, authTab, advancedTab]; allSettingTabs.forEach((tab) => { if (tab.style.borderBottom.includes("solid")) { tab.style.color = isDark ? "#f1f5f9" : "#0f172a"; } }); patreonAuthLabel.style.color = isDark ? "#f1f5f9" : "#334155"; patreonAuthInput.style.backgroundColor = isDark ? "#374151" : "#f1f5f9"; autoBatchLabel.style.color = isDark ? "#f1f5f9" : "#334155"; patreonAuthInput.style.color = isDark ? "#cbd5e1" : "#64748b"; tokenLabel.style.color = isDark ? "#f1f5f9" : "#334155"; tokenInput.style.backgroundColor = isDark ? "#374151" : "#f1f5f9"; tokenInput.style.color = isDark ? "#cbd5e1" : "#64748b"; apiServerLabel.style.color = isDark ? "#f1f5f9" : "#334155"; batchLabel.style.color = isDark ? "#f1f5f9" : "#334155"; batchSizeLabel.style.color = isDark ? "#f1f5f9" : "#334155"; startingBatchLabel.style.color = isDark ? "#f1f5f9" : "#334155"; startingBatchInput.style.backgroundColor = isDark ? "#374151" : "#f1f5f9"; startingBatchInput.style.color = isDark ? "#cbd5e1" : "#64748b"; timelineTypeLabel.style.color = isDark ? "#f1f5f9" : "#334155"; mediaTypeLabel.style.color = isDark ? "#f1f5f9" : "#334155"; concurrentLabel.style.color = isDark ? "#f1f5f9" : "#334155"; cacheDurationLabel.style.color = isDark ? "#f1f5f9" : "#334155"; darkThemeLabel.style.color = isDark ? "#f1f5f9" : "#334155"; const toggleSwitches = [ timelineTypeToggle, mediaTypeToggle, batchSizeToggle, concurrentToggle, cacheDurationToggle, apiServerToggle, ]; toggleSwitches.forEach((toggle) => { if (toggle) { toggle.style.backgroundColor = isDark ? "#374151" : "#f1f5f9"; } }); if (progressBar) { progressBar.style.backgroundColor = isDark ? "#374151" : "#f1f5f9"; } if (currentBatchLabel) { currentBatchLabel.style.color = isDark ? "#ffffff" : "#475569"; } if (totalBatchLabel) { totalBatchLabel.style.color = isDark ? "#ffffff" : "#475569"; } refreshInfoDisplays(); updateBatchLabels(); } fetchButton.addEventListener("click", async () => { const settings = getSettings(); if (!settings.authToken) { createAuthTokenPopup(); return; } if (!settings.patreonAuth) { createPatreonAuthPopup(); return; } if (settings.autoBatchEnabled && !autoBatchStarted) { autoBatchCancelled = false; autoBatchStarted = true; const batchNums = Object.keys(mediaData.batchData).map(Number); mediaData.currentPage = batchNums.length > 0 ? Math.max(...batchNums) + 1 : 0; } if ( !settings.autoBatchEnabled || (settings.autoBatchEnabled && !autoBatchStarted && Object.keys(mediaData.batchData).length === 0) ) { infoContainer.style.display = "none"; buttonContainer.style.display = "none"; nextBatchButton.style.display = "none"; prevBatchButton.style.display = "none"; progressContainer.style.display = "none"; if (settings.autoBatchEnabled) { autoBatchStarted = true; mediaData.currentPage = 0; } } fetchButton.disabled = true; fetchButton.innerHTML = ""; fetchButton.appendChild(document.createTextNode("Fetching...")); try { const cacheKey = `${settings.timelineType}_${settings.mediaType}_${username}_${mediaData.currentPage}_${settings.batchSize}_batch_${settings.batchEnabled}`; let data = cacheManager.get(cacheKey); if (!data) { let url; if (settings.batchEnabled) { url = `${getServiceBaseUrl()}/metadata/${settings.timelineType}/${ settings.batchSize }/${mediaData.currentPage}/${settings.mediaType}/${username}/${ settings.authToken }/${settings.patreonAuth || ""}`; } else { url = `${getServiceBaseUrl()}/metadata/${settings.timelineType}/${ settings.mediaType }/${username}/${settings.authToken}/${settings.patreonAuth || ""}`; } data = await fetchData(url); if (data && data.timeline && data.timeline.length > 0) { cacheManager.set(cacheKey, data, true); } } if (data.timeline && data.timeline.length > 0) { mediaData.mediaItems = data.timeline; mediaData.hasMore = data.metadata.has_more; mediaData.totalItems = data.total_urls; mediaData.batchData[mediaData.currentPage] = [...data.timeline]; const currentBatchKeys = Object.keys(mediaData.batchData).map(Number); for (const batchNum of currentBatchKeys) { if (batchNum > mediaData.currentPage) { delete mediaData.batchData[batchNum]; } } mediaData.allMediaItems = []; const maxBatch = Math.max( ...Object.keys(mediaData.batchData).map(Number) ); for (let i = 0; i <= maxBatch; i++) { if (mediaData.batchData[i]) { mediaData.allMediaItems = [ ...mediaData.allMediaItems, ...mediaData.batchData[i], ]; } } const mediaTypeLabel = getMediaTypeLabel(settings.mediaType); if (settings.batchEnabled) { const accountIconHtml = createAccountIcon( settings.darkTheme ).outerHTML; const mediaIconHtml = createMediaTypeIcon( settings.mediaType, settings.darkTheme ).outerHTML; const totalItemsIconHtml = createTotalItemsIcon( settings.darkTheme ).outerHTML; infoContainer.innerHTML = ` <div style="margin-bottom: 8px; display: flex; align-items: center;">${accountIconHtml}<strong style="margin-right: 6px;">Account:</strong><span>${ data.account_info.name }</span></div> <div style="margin-bottom: 8px; display: flex; align-items: center;">${mediaIconHtml}<strong style="margin-right: 6px;">${mediaTypeLabel} Found:</strong><span>${formatNumber( data.total_urls )}</span></div> <div style="margin-bottom: 8px; display: flex; align-items: center;">${totalItemsIconHtml}<strong style="margin-right: 6px;">Total Items:</strong><span>${formatNumber( mediaData.allMediaItems.length )}</span></div> `; const currentBatchIconHtml = createCurrentBatchIcon( settings.darkTheme ).outerHTML; currentBatchLabel.innerHTML = `<div style="display: flex; align-items: center;">${currentBatchIconHtml}<strong style="margin-right: 6px; color: ${ settings.darkTheme ? "#ffffff" : "#475569" };">Current Batch:</strong><span style="color: ${ settings.darkTheme ? "#ffffff" : "#475569" };">${mediaData.currentPage + 1}</span></div>`; const totalBatches = Math.ceil( data.total_urls / settings.batchSize ); const totalZipIconHtml = createTotalZipIcon( settings.darkTheme ).outerHTML; totalBatchLabel.innerHTML = `<div style="display: flex; align-items: center;">${totalZipIconHtml}<strong style="margin-right: 6px; color: ${ settings.darkTheme ? "#ffffff" : "#475569" };">Total ZIP ${ totalBatches === 1 ? "File" : "Files" }:</strong><span style="color: ${ settings.darkTheme ? "#ffffff" : "#475569" };">${totalBatches}</span></div>`; batchInfoContainer.style.display = "flex"; batchNavContainer.style.display = "flex"; } else { const currentPart = Math.floor(mediaData.allMediaItems.length / 500) + 1; const accountIconHtml = createAccountIcon( settings.darkTheme ).outerHTML; const mediaIconHtml = createMediaTypeIcon( settings.mediaType, settings.darkTheme ).outerHTML; const totalZipIconHtml = createTotalZipIcon( settings.darkTheme ).outerHTML; infoContainer.innerHTML = ` <div style="margin-bottom: 8px; display: flex; align-items: center;">${accountIconHtml}<strong style="margin-right: 6px;">Account:</strong><span>${ data.account_info.name }</span></div> <div style="margin-bottom: 8px; display: flex; align-items: center;">${mediaIconHtml}<strong style="margin-right: 6px;">${mediaTypeLabel} Found:</strong><span>${formatNumber( data.total_urls )}</span></div> <div style="margin-top: 8px; display: flex; align-items: center;">${totalZipIconHtml}<strong style="margin-right: 6px;">Total ZIP ${ currentPart === 1 ? "File" : "Files" }:</strong><span>${currentPart}</span></div> `; batchInfoContainer.style.display = "none"; batchNavContainer.style.display = "none"; } infoContainer.style.display = "block"; if (settings.batchEnabled) { buttonContainer.style.display = "none"; } else { buttonContainer.innerHTML = ""; buttonContainer.appendChild(downloadButton); buttonContainer.style.display = "block"; } if (settings.batchEnabled && mediaData.hasMore) { nextBatchButton.style.display = "block"; } if ( settings.batchEnabled && mediaData.currentPage > getSettings().startingBatch ) { prevBatchButton.style.display = "block"; } reassignDownloadHandlers(); fetchButton.disabled = false; const currentMediaTypeLabel = getMediaTypeLabel( settings.mediaType ).toLowerCase(); const updatedFetchButtonText = settings.autoBatchEnabled ? "Auto Fetch" : settings.mediaType === "all" ? "Fetch Media" : `Fetch ${ currentMediaTypeLabel === "gif" ? "GIF" : currentMediaTypeLabel.charAt(0).toUpperCase() + currentMediaTypeLabel.slice(1) }`; fetchButton.innerHTML = ""; let updatedFetchIcon1 = fetchIcon.cloneNode(true); fetchButton.appendChild(updatedFetchIcon1); fetchButton.appendChild( document.createTextNode(updatedFetchButtonText) ); console.log("Fetch success - Next Batch Debug:", { hasMore: mediaData.hasMore, nextBatchClicked: mediaData.nextBatchClicked, shouldShowPopup: !mediaData.hasMore && mediaData.nextBatchClicked, autoBatchEnabled: settings.autoBatchEnabled, }); if ( !mediaData.hasMore && mediaData.nextBatchClicked && !settings.autoBatchEnabled ) { console.log( "Showing next batch completion popup after successful fetch" ); createInfoDialog( "Next batch has completed! All available batches have been fetched." ); } if (mediaData.nextBatchClicked) { console.log( "Resetting nextBatchClicked flag after successful fetch" ); mediaData.nextBatchClicked = false; } if (settings.autoBatchEnabled && !autoBatchCancelled) { prevBatchButton.style.display = "none"; nextBatchButton.style.display = "none"; stopFetchButton.style.display = "block"; if (mediaData.hasMore) { setTimeout(() => { if (settings.autoBatchEnabled && !autoBatchCancelled) { mediaData.currentPage++; fetchButton.click(); } }, 1000); } else { stopFetchButton.style.display = "none"; prevBatchButton.style.display = mediaData.currentPage > 0 ? "block" : "none"; nextBatchButton.style.display = "none"; autoBatchStarted = false; createInfoDialog( "Auto fetch has completed! All available batches have been fetched." ); } } } else { console.log("No media found branch:", { nextBatchClicked: mediaData.nextBatchClicked, }); if (mediaData.nextBatchClicked) { console.log( "Showing next batch completion popup from no media found branch" ); createInfoDialog( "Next batch has completed! All available batches have been fetched." ); mediaData.nextBatchClicked = false; } infoContainer.innerHTML = '<div style="color: #ef4444;">No media found, invalid token, or invalid Patreon authentication.</div>'; infoContainer.style.display = "block"; fetchButton.disabled = false; const currentMediaTypeLabel = getMediaTypeLabel( settings.mediaType ).toLowerCase(); const updatedFetchButtonText = settings.mediaType === "all" ? "Fetch Media" : `Fetch ${ currentMediaTypeLabel === "gif" ? "GIF" : currentMediaTypeLabel.charAt(0).toUpperCase() + currentMediaTypeLabel.slice(1) }`; fetchButton.innerHTML = ""; let updatedFetchIcon2 = fetchIcon.cloneNode(true); fetchButton.appendChild(updatedFetchIcon2); fetchButton.appendChild( document.createTextNode(updatedFetchButtonText) ); } } catch (error) { infoContainer.innerHTML = `<div style="color: #ef4444;">Error: ${error.message}</div>`; infoContainer.style.display = "block"; fetchButton.disabled = false; if (mediaData.currentPage > getSettings().startingBatch) { prevBatchButton.style.display = "block"; } const currentMediaTypeLabel = getMediaTypeLabel( settings.mediaType ).toLowerCase(); const updatedFetchButtonText = settings.mediaType === "all" ? "Fetch Media" : `Fetch ${ currentMediaTypeLabel === "gif" ? "GIF" : currentMediaTypeLabel.charAt(0).toUpperCase() + currentMediaTypeLabel.slice(1) }`; fetchButton.innerHTML = ""; let updatedFetchIcon3 = fetchIcon.cloneNode(true); fetchButton.appendChild(updatedFetchIcon3); fetchButton.appendChild( document.createTextNode(updatedFetchButtonText) ); } }); nextBatchButton.addEventListener("click", () => { console.log("Next Batch Button clicked, setting flag to true"); mediaData.nextBatchClicked = true; mediaData.currentPage++; autoBatchCancelled = true; autoBatchStarted = false; const settings = getSettings(); const cacheKey = `${settings.timelineType}_${settings.mediaType}_${username}_${mediaData.currentPage}_${settings.batchSize}_batch_${settings.batchEnabled}`; const cachedData = cacheManager.get(cacheKey); if (cachedData && cachedData.timeline && cachedData.timeline.length > 0) { mediaData.mediaItems = cachedData.timeline; mediaData.hasMore = cachedData.metadata.has_more; mediaData.totalItems = cachedData.total_urls; mediaData.batchData[mediaData.currentPage] = [...cachedData.timeline]; mediaData.allMediaItems = []; const maxBatch = Math.max( ...Object.keys(mediaData.batchData).map(Number) ); for (let i = 0; i <= maxBatch; i++) { if (mediaData.batchData[i]) { mediaData.allMediaItems = [ ...mediaData.allMediaItems, ...mediaData.batchData[i], ]; } } refreshInfoDisplays(); if (settings.batchEnabled) { prevBatchButton.style.display = mediaData.currentPage > 0 ? "block" : "none"; nextBatchButton.style.display = mediaData.hasMore ? "block" : "none"; infoContainer.style.display = "block"; buttonContainer.style.display = "none"; batchInfoContainer.style.display = "flex"; batchNavContainer.style.display = "flex"; } const currentBatchIconHtml = createCurrentBatchIcon( settings.darkTheme ).outerHTML; currentBatchLabel.innerHTML = `<div style="display: flex; align-items: center;">${currentBatchIconHtml}<strong style="margin-right: 6px; color: ${ settings.darkTheme ? "#ffffff" : "#475569" };">Current Batch:</strong><span style="color: ${ settings.darkTheme ? "#ffffff" : "#475569" };">${mediaData.currentPage + 1}</span></div>`; const totalBatches = Math.ceil( cachedData.total_urls / settings.batchSize ); const totalZipIconHtml = createTotalZipIcon( settings.darkTheme ).outerHTML; totalBatchLabel.innerHTML = `<div style="display: flex; align-items: center;">${totalZipIconHtml}<strong style="margin-right: 6px; color: ${ settings.darkTheme ? "#ffffff" : "#475569" };">Total ZIP ${ totalBatches === 1 ? "File" : "Files" }:</strong><span style="color: ${ settings.darkTheme ? "#ffffff" : "#475569" };">${totalBatches}</span></div>`; console.log("Next Batch Debug:", { hasMore: mediaData.hasMore, nextBatchClicked: mediaData.nextBatchClicked, shouldShowPopup: !mediaData.hasMore && mediaData.nextBatchClicked, }); if (!mediaData.hasMore && mediaData.nextBatchClicked) { console.log("Showing next batch completion popup"); createInfoDialog( "Next batch has completed! All available batches have been fetched." ); } console.log("Resetting nextBatchClicked flag to false"); mediaData.nextBatchClicked = false; reassignDownloadHandlers(); } else { const wasAutoBatchEnabled = getSettings().autoBatchEnabled; if (wasAutoBatchEnabled) { const newSettings = getSettings(); newSettings.autoBatchEnabled = false; saveSettings(newSettings); } fetchButton.click(); if (wasAutoBatchEnabled) { setTimeout(() => { const newSettings = getSettings(); newSettings.autoBatchEnabled = true; saveSettings(newSettings); autoBatchCancelled = true; autoBatchStarted = false; }, 100); } } }); prevBatchButton.addEventListener("click", () => { if (mediaData.currentPage > 0) { mediaData.currentPage--; autoBatchCancelled = true; autoBatchStarted = false; const settings = getSettings(); const cacheKey = `${settings.timelineType}_${settings.mediaType}_${username}_${mediaData.currentPage}_${settings.batchSize}_batch_${settings.batchEnabled}`; let data = cacheManager.get(cacheKey); if (data && data.timeline && data.timeline.length > 0) { mediaData.mediaItems = data.timeline; mediaData.hasMore = data.metadata.has_more; mediaData.totalItems = data.total_urls; mediaData.batchData[mediaData.currentPage] = [...data.timeline]; const currentBatchKeys = Object.keys(mediaData.batchData).map(Number); for (const batchNum of currentBatchKeys) { if (batchNum > mediaData.currentPage) { delete mediaData.batchData[batchNum]; } } mediaData.allMediaItems = []; const maxBatch = Math.max( ...Object.keys(mediaData.batchData).map(Number) ); for (let i = 0; i <= maxBatch; i++) { if (mediaData.batchData[i]) { mediaData.allMediaItems = [ ...mediaData.allMediaItems, ...mediaData.batchData[i], ]; } } const mediaTypeLabel = getMediaTypeLabel(settings.mediaType); if (settings.batchEnabled) { const accountIconHtml = createAccountIcon( settings.darkTheme ).outerHTML; const mediaIconHtml = createMediaTypeIcon( settings.mediaType, settings.darkTheme ).outerHTML; const totalItemsIconHtml = createTotalItemsIcon( settings.darkTheme ).outerHTML; infoContainer.innerHTML = ` <div style="margin-bottom: 8px; display: flex; align-items: center;">${accountIconHtml}<strong style="margin-right: 6px;">Account:</strong><span>${ data.account_info.name }</span></div> <div style="margin-bottom: 8px; display: flex; align-items: center;">${mediaIconHtml}<strong style="margin-right: 6px;">${mediaTypeLabel} Found:</strong><span>${formatNumber( data.total_urls )}</span></div> <div style="margin-bottom: 8px; display: flex; align-items: center;">${totalItemsIconHtml}<strong style="margin-right: 6px;">Total Items:</strong><span>${formatNumber( mediaData.allMediaItems.length )}</span></div> `; const currentBatchIconHtml = createCurrentBatchIcon( settings.darkTheme ).outerHTML; currentBatchLabel.innerHTML = `<div style="display: flex; align-items: center;">${currentBatchIconHtml}<strong style="margin-right: 6px; color: ${ settings.darkTheme ? "#ffffff" : "#475569" };">Current Batch:</strong><span style="color: ${ settings.darkTheme ? "#ffffff" : "#475569" };">${mediaData.currentPage + 1}</span></div>`; const totalBatches = Math.ceil( data.total_urls / settings.batchSize ); const totalZipIconHtml = createTotalZipIcon( settings.darkTheme ).outerHTML; totalBatchLabel.innerHTML = `<div style="display: flex; align-items: center;">${totalZipIconHtml}<strong style="margin-right: 6px; color: ${ settings.darkTheme ? "#ffffff" : "#475569" };">Total ZIP ${ totalBatches === 1 ? "File" : "Files" }:</strong><span style="color: ${ settings.darkTheme ? "#ffffff" : "#475569" };">${totalBatches}</span></div>`; batchInfoContainer.style.display = "flex"; batchNavContainer.style.display = "flex"; } infoContainer.style.display = "block"; if (settings.batchEnabled) { buttonContainer.style.display = "none"; } else { buttonContainer.innerHTML = ""; buttonContainer.appendChild(downloadButton); buttonContainer.style.display = "block"; } if (settings.batchEnabled && mediaData.hasMore) { nextBatchButton.style.display = "block"; } if (settings.batchEnabled && mediaData.currentPage > 0) { prevBatchButton.style.display = "block"; } reassignDownloadHandlers(); } else { fetchButton.click(); } } }); function chunkMediaItems(items) { const chunks = []; for (let i = 0; i < items.length; i += 500) { chunks.push(items.slice(i, i + 500)); } return chunks; } function reassignDownloadHandlers() { const settings = getSettings(); if (settings.batchEnabled) { downloadCurrentButton.onclick = () => downloadMedia(false); downloadAllButton.onclick = () => downloadMedia(true); } } async function downloadMedia(downloadAll) { if (mediaData.downloading) return; mediaData.downloading = true; const settings = getSettings(); const timestamp = getCurrentTimestamp(); let itemsToDownload; if (downloadAll) { itemsToDownload = mediaData.allMediaItems; } else { itemsToDownload = mediaData.mediaItems; } mediaData.totalToDownload = itemsToDownload.length; mediaData.totalDownloaded = 0; progressText.textContent = `Downloading 0/${formatNumber( mediaData.totalToDownload )}`; progressFill.style.width = "0%"; progressContainer.style.display = "block"; fetchButton.disabled = true; if (settings.batchEnabled) { downloadCurrentButton.disabled = true; downloadAllButton.disabled = true; } else { downloadButton.disabled = true; } nextBatchButton.disabled = true; const chunks = chunkMediaItems(itemsToDownload); for (let chunkIndex = 0; chunkIndex < chunks.length; chunkIndex++) { const chunk = chunks[chunkIndex]; if (chunk.length === 1 && chunks.length === 1) { try { const item = chunk[0]; const formattedDate = formatDate(item.date); const baseFilename = `${username}_${formattedDate}_${item.tweet_id}`; const fileExtension = item.type === "photo" ? "jpg" : "mp4"; const filename = `${baseFilename}.${fileExtension}`; progressText.textContent = `Downloading 0/1`; const blob = await fetchBinary(item.url); const downloadLink = document.createElement("a"); downloadLink.href = URL.createObjectURL(blob); downloadLink.download = filename; document.body.appendChild(downloadLink); downloadLink.click(); document.body.removeChild(downloadLink); mediaData.totalDownloaded = 1; progressText.textContent = `Downloading 1/1`; progressFill.style.width = "100%"; continue; } catch (error) {} } const zip = new JSZip(); const hasImages = chunk.some((item) => item.type === "photo"); const hasVideos = chunk.some((item) => item.type === "video"); const hasGifs = chunk.some((item) => item.type === "gif"); let imageFolder, videoFolder, gifFolder; if (settings.mediaType === "all") { if (hasImages) imageFolder = zip.folder("image"); if (hasVideos) videoFolder = zip.folder("video"); if (hasGifs) gifFolder = zip.folder("gif"); } const filenameMap = {}; const downloadInBatches = async (items, batchSize) => { for (let i = 0; i < items.length; i += batchSize) { const batch = items.slice(i, i + batchSize); const downloadPromises = batch.map(async (item) => { try { const formattedDate = formatDate(item.date); let baseFilename = `${username}_${formattedDate}_${item.tweet_id}`; if (filenameMap[baseFilename] !== undefined) { filenameMap[baseFilename]++; baseFilename = `${baseFilename}_${String( filenameMap[baseFilename] ).padStart(2, "0")}`; } else { filenameMap[baseFilename] = 0; } const fileExtension = item.type === "photo" ? "jpg" : "mp4"; const filename = `${baseFilename}.${fileExtension}`; const blob = await fetchBinary(item.url); if (settings.mediaType === "all") { if (item.type === "photo") { imageFolder.file(filename, blob); } else if (item.type === "video") { videoFolder.file(filename, blob); } else if (item.type === "gif") { gifFolder.file(filename, blob); } } else { zip.file(filename, blob); } mediaData.totalDownloaded++; const completedCount = mediaData.totalDownloaded; progressText.textContent = `Downloading ${formatNumber( completedCount )}/${formatNumber(mediaData.totalToDownload)}`; progressFill.style.width = `${ (completedCount / mediaData.totalToDownload) * 100 }%`; } catch (error) { console.error("Error downloading item:", error); mediaData.totalDownloaded++; } }); await Promise.all(downloadPromises); } }; await downloadInBatches(chunk, settings.concurrentDownloads); progressText.textContent = `Creating ZIP file ${chunkIndex + 1}/${ chunks.length }...`; try { const zipBlob = await zip.generateAsync({ type: "blob" }); let zipFilename; if (chunks.length === 1 && chunk.length < 500) { zipFilename = `${username}_${timestamp}.zip`; } else if (settings.batchEnabled && !downloadAll) { zipFilename = `${username}_${timestamp}_part_${String( mediaData.currentPage + 1 ).padStart(2, "0")}.zip`; } else { zipFilename = `${username}_${timestamp}_part_${String( chunkIndex + 1 ).padStart(2, "0")}.zip`; } const downloadLink = document.createElement("a"); downloadLink.href = URL.createObjectURL(zipBlob); downloadLink.download = zipFilename; document.body.appendChild(downloadLink); downloadLink.click(); document.body.removeChild(downloadLink); } catch (error) { progressText.textContent = `Error creating ZIP ${chunkIndex + 1}: ${ error.message }`; } } mediaData.downloading = false; progressContainer.style.display = "none"; fetchButton.disabled = false; if (settings.batchEnabled) { downloadCurrentButton.disabled = false; downloadAllButton.disabled = false; reassignDownloadHandlers(); } else { downloadButton.disabled = false; } nextBatchButton.disabled = false; createInfoDialog( "All media downloaded successfully.", "Download Complete" ); return; } document.body.appendChild(modal); } function extractUsername() { const pathParts = window.location.pathname .split("/") .filter((part) => part); if (pathParts.length > 0) { return pathParts[0]; } return null; } function insertDownloadIconOnWithheld() { const withheldHeaders = document.querySelectorAll( '[data-testid="empty_state_header_text"]' ); withheldHeaders.forEach((headerDiv) => { if (!headerDiv.querySelector(".download-icon-withheld")) { const accountWithheldSpan = headerDiv.querySelector("span"); if ( accountWithheldSpan && accountWithheldSpan.textContent.includes("Account Withheld") ) { const username = extractUsername(); if (!username) return; const downloadIcon = createDownloadIcon(); const iconDiv = document.createElement("div"); iconDiv.className = "download-icon-withheld css-175oi2r r-1awozwy r-xoduu5"; iconDiv.style.cssText = ` display: inline-flex; align-items: center; margin-left: 12px; gap: 6px; padding: 0 3px; transition: transform 0.2s, color 0.2s; `; iconDiv.appendChild(downloadIcon); iconDiv.addEventListener("mouseenter", () => { iconDiv.style.transform = "scale(1.1)"; iconDiv.style.color = "#0ea5e9"; }); iconDiv.addEventListener("mouseleave", () => { iconDiv.style.transform = "scale(1)"; iconDiv.style.color = ""; }); iconDiv.addEventListener("click", (e) => { e.stopPropagation(); createModal(username); }); headerDiv.appendChild(iconDiv); } } }); } function insertDownloadIcon() { const usernameDivs = document.querySelectorAll('[data-testid="UserName"]'); usernameDivs.forEach((usernameDiv) => { if (!usernameDiv.querySelector(".download-icon")) { const username = extractUsername(); if (!username) return; const verifiedButton = usernameDiv .querySelector('[aria-label*="verified"], [aria-label*="Verified"]') ?.closest("button"); const targetElement = verifiedButton ? verifiedButton.parentElement : usernameDiv.querySelector(".css-1jxf684")?.closest("span"); if (targetElement) { const downloadIcon = createDownloadIcon(); const iconDiv = document.createElement("div"); iconDiv.className = "download-icon css-175oi2r r-1awozwy r-xoduu5"; iconDiv.style.cssText = ` display: inline-flex; align-items: center; margin-left: 6px; margin-right: 6px; gap: 6px; padding: 0 3px; transition: transform 0.2s, color 0.2s; `; iconDiv.appendChild(downloadIcon); iconDiv.addEventListener("mouseenter", () => { iconDiv.style.transform = "scale(1.1)"; iconDiv.style.color = "#0ea5e9"; }); iconDiv.addEventListener("mouseleave", () => { iconDiv.style.transform = "scale(1)"; iconDiv.style.color = ""; }); iconDiv.addEventListener("click", (e) => { e.stopPropagation(); createModal(username); }); const wrapperDiv = document.createElement("div"); wrapperDiv.style.cssText = ` display: inline-flex; align-items: center; gap: 4px; `; wrapperDiv.appendChild(iconDiv); targetElement.parentNode.insertBefore( wrapperDiv, targetElement.nextSibling ); } } }); } insertDownloadIcon(); insertDownloadIconOnWithheld(); function checkForUserNameElement() { const usernameDivs = document.querySelectorAll('[data-testid="UserName"]'); if (usernameDivs.length > 0) { insertDownloadIcon(); } const withheldHeaders = document.querySelectorAll( '[data-testid="empty_state_header_text"]' ); if (withheldHeaders.length > 0) { insertDownloadIconOnWithheld(); } } setInterval(checkForUserNameElement, 100); let lastUrl = location.href; let lastUsername = extractUsername(); function checkForChanges() { const currentUrl = location.href; const currentUsername = extractUsername(); if (currentUrl !== lastUrl || currentUsername !== lastUsername) { lastUrl = currentUrl; lastUsername = currentUsername; document.querySelectorAll(".download-icon").forEach((icon) => { const wrapper = icon.closest("div[style*='display: inline-flex']"); if (wrapper) { wrapper.remove(); } }); document.querySelectorAll(".download-icon-withheld").forEach((icon) => { icon.remove(); }); setTimeout(() => { insertDownloadIcon(); insertDownloadIconOnWithheld(); }, 50); } } const observer = new MutationObserver(() => { checkForChanges(); checkForUserNameElement(); }); observer.observe(document.body, { childList: true, subtree: true, attributes: true, characterData: true, }); setInterval(checkForChanges, 300); const originalPushState = history.pushState; const originalReplaceState = history.replaceState; history.pushState = function () { originalPushState.apply(this, arguments); checkForChanges(); insertDownloadIcon(); insertDownloadIconOnWithheld(); }; history.replaceState = function () { originalReplaceState.apply(this, arguments); checkForChanges(); insertDownloadIcon(); insertDownloadIconOnWithheld(); }; window.addEventListener("popstate", () => { checkForChanges(); insertDownloadIcon(); insertDownloadIconOnWithheld(); }); })();