diff --git a/Chaturbate/chaturbate-thumbnails-2x.user.js b/Chaturbate/chaturbate-thumbnails-2x.user.js index d2a2d1c..0977528 100644 --- a/Chaturbate/chaturbate-thumbnails-2x.user.js +++ b/Chaturbate/chaturbate-thumbnails-2x.user.js @@ -12,17 +12,25 @@ (function () { "use strict"; - const SCALE = 2; + // ========== 配置项 ========== + // 放大倍数(宽度和高度都会按此倍数放大) + const SCALE = 1.5; + + // 调试开关(true: 输出调试信息,false: 静默运行) + const DEBUG = false; + // =========================== + + // ========== 内部常量 ========== const SCALED_ATTR = "data-tm-scaled"; const BASE_W_ATTR = "data-tm-base-w"; const BASE_H_ATTR = "data-tm-base-h"; - const DEBUG = true; + // =========================== // 提前注入 CSS,避免闪烁 const injectCSS = () => { const style = document.createElement("style"); style.id = "tm-thumb-scale-style"; - style.textContent = ` + const css = ` img.room_thumbnail:not([${SCALED_ATTR}="1"]) { opacity: 0; transition: opacity 0.1s; @@ -36,67 +44,29 @@ flex-wrap: wrap !important; gap: 0 !important; } - ul.list li.roomCard, - ul.list.endless_page_template li.roomCard { - position: relative !important; - flex-shrink: 0 !important; - flex-grow: 0 !important; - margin: 0 !important; - padding: 0 !important; - } `; - if (document.head) { + + style.textContent = css; + const inject = () => { if (!document.getElementById("tm-thumb-scale-style")) { - document.head.appendChild(style); + (document.head || document.documentElement).appendChild(style); } + }; + if (document.head) { + inject(); } else { - document.addEventListener("DOMContentLoaded", () => { - if (!document.getElementById("tm-thumb-scale-style")) { - document.head.appendChild(style); - } - }); + document.addEventListener("DOMContentLoaded", inject); } }; injectCSS(); - const relaxBox = (el) => { - if (!el) return; - el.style.overflow = "visible"; - el.style.maxWidth = "none"; - }; - - const relaxAncestors = (el, depth = 6) => { - let current = el?.parentElement; - let steps = 0; - while (current && steps < depth && current !== document.body) { - relaxBox(current); - current = current.parentElement; - steps += 1; - } - }; - const relaxKnownOuter = () => { - const selectors = [ - "#roomlist_content_wrapper", - "#roomlist_root", - ".BaseRoomContents", - "[data-testid='room-list']", - "ul.list", - "ul.list.endless_page_template", - ]; - selectors.forEach((selector) => { - document.querySelectorAll(selector).forEach((el) => { - relaxBox(el); - // 如果是列表容器,确保布局能容纳更大的卡片 - if (el.matches?.("ul.list, ul.list.endless_page_template")) { - el.style.width = "100%"; - el.style.maxWidth = "none"; - el.style.boxSizing = "border-box"; - el.style.display = "flex"; - el.style.flexWrap = "wrap"; - el.style.gap = "0"; - } - }); + // 确保列表容器能容纳更大的卡片 + document.querySelectorAll("ul.list, ul.list.endless_page_template").forEach((el) => { + el.style.width = "100%"; + el.style.maxWidth = "none"; + el.style.boxSizing = "border-box"; + el.style.overflow = "visible"; }); }; @@ -140,13 +110,10 @@ container.style.minWidth = `${scaledW}px`; container.style.maxWidth = `${scaledW}px`; container.style.minHeight = `${scaledH}px`; - container.style.maxHeight = "none"; container.style.overflow = "visible"; container.style.display = "block"; - container.style.position = "relative"; container.style.boxSizing = "border-box"; container.style.flexShrink = "0"; - container.style.margin = "0"; const card = container.closest("li.roomCard"); if (card) { @@ -156,16 +123,11 @@ card.style.minHeight = `${scaledH}px`; card.style.height = "auto"; card.style.overflow = "visible"; - card.style.position = "relative"; card.style.flexShrink = "0"; card.style.flexGrow = "0"; card.style.flexBasis = `${scaledW}px`; card.style.boxSizing = "border-box"; - card.style.margin = "0"; - card.style.padding = "0"; - relaxAncestors(card); } - relaxAncestors(container); }); }; @@ -193,23 +155,17 @@ // MutationObserver 监听动态添加的内容 const observer = new MutationObserver((mutations) => { - let shouldScale = false; - mutations.forEach((mutation) => { - mutation.addedNodes.forEach((node) => { - if (node.nodeType === 1) { - if ( - node.matches?.("a.room_thumbnail_container") || - node.matches?.("li.roomCard") || - node.querySelector?.("a.room_thumbnail_container") - ) { - shouldScale = true; - } + for (const mutation of mutations) { + for (const node of mutation.addedNodes) { + if (node.nodeType === 1 && ( + node.matches?.("a.room_thumbnail_container, li.roomCard") || + node.querySelector?.("a.room_thumbnail_container") + )) { + if (DEBUG) console.log("[tm] new content detected, scaling..."); + scale(); + return; } - }); - }); - if (shouldScale) { - if (DEBUG) console.log("[tm] new content detected, scaling..."); - scale(); + } } }); @@ -217,14 +173,10 @@ const startObserving = () => { const target = document.body || document.documentElement; if (target) { - observer.observe(target, { - childList: true, - subtree: true, - }); + observer.observe(target, { childList: true, subtree: true }); if (DEBUG) console.log("[tm] MutationObserver started"); } }; - if (document.body) { startObserving(); } else {