`;
document.body.appendChild(panel);
// 拖动逻辑
const header = panel.querySelector('.header');
let isDragging = false, startX, startY, initialX, initialY;
header.addEventListener('mousedown', (e) => {
isDragging = true;
startX = e.clientX; startY = e.clientY;
const rect = panel.getBoundingClientRect();
initialX = rect.left; initialY = rect.top;
panel.style.bottom = 'auto'; panel.style.left = initialX + 'px'; panel.style.top = initialY + 'px';
});
document.addEventListener('mousemove', (e) => {
if (!isDragging) return;
panel.style.left = `${initialX + e.clientX - startX}px`;
panel.style.top = `${initialY + e.clientY - startY}px`;
});
document.addEventListener('mouseup', () => isDragging = false);
// 交互逻辑
const dprSlider = panel.querySelector('#dpr-slider');
const dprVal = panel.querySelector('#dpr-val');
dprSlider.oninput = () => dprVal.textContent = dprSlider.value + 'x';
const sharpenBox = panel.querySelector('#sharpen-box');
sharpenBox.checked = GM_getValue('mc_sharpen_v3', true); // 默认开启锐化
// 应用滤镜的函数
function applySharpen(enable) {
const canvases = document.querySelectorAll('canvas');
canvases.forEach(c => {
if (enable) {
c.style.imageRendering = 'pixelated'; // 关键：保持像素风，防止变糊
c.style.filter = 'contrast(1.15) saturate(1.1)'; // 增强对比和色彩
} else {
c.style.imageRendering = 'auto';
c.style.filter = 'none';
}
});
}
// 初始应用锐化
applySharpen(sharpenBox.checked);
// 监听 DOM，新生成的 Canvas 也应用
const observer = new MutationObserver(() => {
applySharpen(sharpenBox.checked);
});
observer.observe(document.body, { childList: true, subtree: true });
panel.querySelector('#apply-btn').onclick = () => {
const newDpr = parseFloat(dprSlider.value);
const enableSharpen = sharpenBox.checked;
GM_setValue('mc_dpr_v3', newDpr);
GM_setValue('mc_sharpen_v3', enableSharpen);
// 提示并刷新
alert(`已应用优化设置：\\n分辨率缩放：${newDpr}x\\n画面锐化：${enableSharpen ? '开启' : '关闭'}\\n\\n即将刷新页面生效！`);
window.location.reload();
};
}
// ==================== 4. 初始化 ====================
function init() {
// 检测到 Canvas 后再出 UI
const checkCanvas = setInterval(() => {
if (document.querySelector('canvas')) {
createUI();
clearInterval(checkCanvas);
}
}, 500);
// 阻止在画布上右键弹出菜单
document.addEventListener('contextmenu', (e) => {
if (e.target.tagName.toLowerCase() === 'canvas') {
e.preventDefault();
}
});
}
if (document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', init);
} else {
init();
}
})();