☰

XYD Better v5.0

新增透明度调整！去除页面干扰！完全自然的自定义背景，极其便捷的扩展页面！

  1. // ==UserScript==
  2. // @name         XYD Better v5.0
  3. // @namespace    https://tampermonkey.net/
  4. // @version      5.0
  5. // @license      MIT
  6. // @description  新增透明度调整！去除页面干扰！完全自然的自定义背景，极其便捷的扩展页面！
  7. // @author       xk2013
  8. // @match        https://discourse.xinyoudui.com/*
  9. // @grant        GM_addStyle
  10. // ==/UserScript==
  11. var FontName,FontSize,BackGroundName,IsSelf,CodeFontName,K;
  12. function Init() {
  13.     FontName = localStorage.getItem("userFont");
  14.     FontSize = localStorage.getItem("userFontSize");
  15.     IsSelf = localStorage.getItem("userSelf");
  16.     BackGroundName = localStorage.getItem("userBackground");
  17.     CodeFontName = localStorage.getItem("userCodeFont");
  18.     K = localStorage.getItem("userK");
  19.     if (FontName === null) { FontName = "Consolas,'微软雅黑'"; localStorage.setItem("userFont",FontName); }
  20.     if (FontSize === null) { FontSize = "14"; localStorage.setItem("userFontSize",FontSize); }
  21.     if (IsSelf === null) { IsSelf = "false"; localStorage.setItem("userSelf",IsSelf); }
  22.     if (BackGroundName === null) { BackGroundName = "http://pic.soutu123.com/back_pic/04/20/21/10582d77456bc74.jpg%21/fw/700/quality/90/unsharp/true/compress/true"; localStorage.setItem("userBackground",BackGroundName); }
  23.     if (CodeFontName === null) { CodeFontName = "Consolas,'微软雅黑'"; localStorage.setItem("userCodeFont",CodeFontName); }
  24.     if (K === null) { K = "0.8"; localStorage.setItem("userK",K); }
  25.     // console.log(IsSelf); console.log(BackGroundName);
  26. }
  27. function addStyle() {
  28.     const elements = document.querySelectorAll('*');
  29.     elements.forEach(element => {
  30.         console.log(element)
  31.         element.style.opacity = 0.999;
  32.     });
  33.     const Special = document.querySelectorAll('#main'); // 挖坑
  34.     Special.forEach(element => {
  35.         console.log(element)
  36.         element.style.opacity = Number(K);
  37.     });
  38. }
  39. function addButton() {
  40.     const button = document.createElement("button");
  41.     button.textContent = "扩展设置";
  42.     button.style.position = "fixed";
  43.     button.style.top = "4px";
  44.     button.style.fontSize = '16px';
  45.     button.style.zIndex = "9999";
  46.     button.style.background = 'linear-gradient(to bottom, #ffffff00, #ffffff00)';
  47.     button.style.border = 'none';
  48.     button.style.color = 'rgba(0,0,1,1)';
  49.     button.style.padding = '10px 20px';
  50.     button.style.cursor = 'pointer';
  51.     button.style.position = 'fixed';
  52.     button.style.right = `130px`;
  53.     document.body.appendChild(button); button.id = 'BUTTON';
  54.     /*
  55.     // 创建一个函数来处理窗口大小变化的事件
  56.     function handleResize() {
  57.         const follow = document.querySelector("a.icon");
  58.         button.style.right = follow.style.right;
  59.         button.style.left = follow.style.left;
  60.         console.log("change");
  61.     }
  62.  
  63.     // 监听窗口大小变化的事件
  64.     window.addEventListener("resize", handleResize);
  65. */
  66. }
  67. function RemoveText() {
  68.     const TopText = document.getElementById('main-container');
  69.     TopText.remove();
  70. }
  71. function createCustomEvent(eventName) {
  72.     const customEvent = new Event(eventName);
  73.     return customEvent;
  74. }
  75. function findElementsWithText(text,notext) {
  76.     if (notext === '114514') {
  77.         const elementsWithText = [];
  78.         const allElements = document.getElementsByTagName('*');
  79.  
  80.         for (const element of allElements) {
  81.             if (element.textContent.includes(text)) {
  82.                 elementsWithText.push(element);
  83.             }
  84.         }
  85.         return elementsWithText;
  86.     }
  87.     const elementsWithText = [];
  88.     const allElements = document.getElementsByTagName('*');
  89.  
  90.     for (const element of allElements) {
  91.         if (element.textContent.includes(text) && !element.textContent.includes(notext)) {
  92.             elementsWithText.push(element);
  93.         }
  94.     }
  95.     return elementsWithText;
  96. }
  97. function setTitleColor() {
  98.     const Clicker = findElementsWithText("话题","114514");
  99.     console.log(Clicker);
  100.     const customEventName = "TITLE";
  101.     Clicker.forEach(element => {
  102.         if (element.id.length >= 5 && element.id.substring(0,5) === "ember") {
  103.             element.addEventListener('click', function() {
  104.                 const customEvent = createCustomEvent(customEventName);
  105.                 element.dispatchEvent(customEvent);
  106.             });
  107.  
  108.             element.addEventListener(customEventName, function() {
  109.                 setTimeout(function(){
  110.                     const TITLE1 = document.querySelector('.custom-search-banner-wrap > h1:nth-child(1)');
  111.                     TITLE1.style.color = "rgba(0,0,0,0.999)";
  112.                     const TITLE2 = document.querySelector('.custom-search-banner-wrap > p:nth-child(2)');
  113.                     TITLE2.style.color = "rgba(0,0,0,0.999)";
  114.                 },2000);
  115.                 // 在这里你可以根据需求执行自定义的操作
  116.             });
  117.         }
  118.     });
  119.     setTimeout(function(){
  120.         const TITLE1 = document.querySelector('.custom-search-banner-wrap > h1:nth-child(1)');
  121.         TITLE1.style.color = "rgba(0,0,0,0.999)";
  122.         const TITLE2 = document.querySelector('.custom-search-banner-wrap > p:nth-child(2)');
  123.         TITLE2.style.color = "rgba(0,0,0,0.999)";
  124.     },2000);
  125. }
  126. function SettingButton() {
  127.     const overlay = document.createElement('div'); let content2;
  128.     if (localStorage.getItem("userSelf") === "true") content2 = "自定义";
  129.     else content2 = "随机漫画";
  130.     overlay.id = 'popup-overlay';
  131.     overlay.innerHTML = `
  132.         <div id="popup-container">
  133.             <div id="popup-content">
  134.                 <h1 style = "color: black;font-size:18px;">XYD Better扩展设置面板，更改在刷新后生效</h1>
  135.                 <p style = "color: green;font-size:16px;">\n字体 [字体需要提前安装到本地] \n</p>
  136.                 <button id="font-change-button">更改文本字体</button>
  137.                 <button id="font-size-change-button">更改文本字体大小</button>
  138.                 <button id="code-font-change-button">更改代码字体</button>
  139.                 <p style = "color: green;font-size:16px;">\n壁纸 [自定义壁纸如果不显示则说明自定义壁纸不兼容qwq] \n</p>
  140.                 <button id="self-change-button">当前为${content2}壁纸，点击更改</button>
  141.                 <button id="background-change-button">更改自定义壁纸</button>
  142.                 <p style = "color: green;font-size:16px;">\n界面美化 \n</p>
  143.                 <button id="K-change-button">更改界面透明度</button>
  144.                 <button id="close-button">X</button>
  145.             </div>
  146.         </div>
  147.     `;
  148.  
  149.     // 添加样式
  150.     GM_addStyle(`
  151.         #popup-overlay {
  152.             position: fixed;
  153.             top: 0;
  154.             left: 0;
  155.             width: 100%;
  156.             height: 100%;
  157.             background: rgba(0, 0, 0, 0.5);
  158.             display: none;
  159.             justify-content: center;
  160.             align-items: center;
  161.             z-index: 9999;
  162.         }
  163.  
  164.         #popup-container {
  165.             width: 66%;
  166.             background: rgba(255, 255, 255, 0.9);
  167.             border: 1px solid #ccc;
  168.             padding: 20px;
  169.             border-radius: 10px;
  170.             position: relative;
  171.         }
  172.  
  173.         #popup-content {
  174.             text-align: center;
  175.         }
  176.  
  177.         #font-change-button {
  178.             background-color: #007bff;
  179.             color: #fff;
  180.             padding: 10px 20px;
  181.             border: none;
  182.             border-radius: 5px;
  183.             cursor: pointer;
  184.             margin-right: 10px;
  185.         }
  186.  
  187.         #font-size-change-button {
  188.             background-color: #007bff;
  189.             color: #fff;
  190.             padding: 10px 20px;
  191.             border: none;
  192.             border-radius: 5px;
  193.             cursor: pointer;
  194.             margin-right: 10px;
  195.         }
  196.  
  197.         #code-font-change-button {
  198.             background-color: #007bff;
  199.             color: #fff;
  200.             padding: 10px 20px;
  201.             border: none;
  202.             border-radius: 5px;
  203.             cursor: pointer;
  204.             margin-right: 10px;
  205.         }
  206.  
  207.         #close-button {
  208.             position: absolute;
  209.             top: 10px;
  210.             right: 10px;
  211.             cursor: pointer;
  212.         }
  213.  
  214.         #self-change-button {
  215.             background-color: #007bff;
  216.             color: #fff;
  217.             padding: 10px 20px;
  218.             border: none;
  219.             border-radius: 5px;
  220.             cursor: pointer;
  221.             margin-right: 10px;
  222.         }
  223.  
  224.         #background-change-button {
  225.             background-color: #007bff;
  226.             color: #fff;
  227.             padding: 10px 20px;
  228.             border: none;
  229.             border-radius: 5px;
  230.             cursor: pointer;
  231.             margin-right: 10px;
  232.         }
  233.  
  234.         #K-change-button {
  235.             background-color: #007bff;
  236.             color: #fff;
  237.             padding: 10px 20px;
  238.             border: none;
  239.             border-radius: 5px;
  240.             cursor: pointer;
  241.             margin-right: 10px;
  242.         }
  243.     `);
  244.  
  245.     // 添加弹出矩形到页面
  246.     document.body.appendChild(overlay);
  247.     // 获取关闭按钮、自定义按钮和弹出矩形
  248.     const closeButton = document.getElementById('close-button');
  249.     const fontButton = document.getElementById('font-change-button');
  250.     const fontSizeButton = document.getElementById('font-size-change-button');
  251.     const codeFontButton = document.getElementById('code-font-change-button');
  252.     const selfButton = document.getElementById('self-change-button');
  253.     const backgroundButton = document.getElementById('background-change-button');
  254.     const KButton = document.getElementById('K-change-button');
  255.     if (content2 === "随机漫画") {
  256.         backgroundButton.style.color = "rgb(100,0,0)";
  257.         backgroundButton.style.backgroundColor = "rgb(100,0,0)";
  258.         backgroundButton.style.opacity = "0.3";
  259.     }
  260.     const popupOverlay = document.getElementById('popup-overlay');
  261.     // 监听指定元素的点击事件
  262.     const targetElement = document.getElementById('BUTTON');
  263.     if (targetElement) {
  264.         targetElement.addEventListener('click', () => {
  265.             // 显示弹出矩形
  266.             popupOverlay.style.display = 'flex';
  267.         });
  268.     }
  269.  
  270.     // 监听关闭按钮的点击事件
  271.     closeButton.addEventListener('click', () => {
  272.         // 隐藏弹出矩形
  273.         popupOverlay.style.display = 'none';
  274.     });
  275.     // 监听自定义按钮的点击事件
  276.     fontButton.addEventListener('click', () => {
  277.         // 在这里添加自定义按钮的点击逻辑
  278.         const newFont = prompt("请输入文本字体，保证字体已经保存在本地：", localStorage.getItem("userFont"));
  279.         if (newFont !== null) {
  280.             localStorage.setItem("userFont", newFont);
  281.             alert(`您的信息已保存：\n${newFont}`);
  282.         }
  283.     });
  284.     codeFontButton.addEventListener('click', () => {
  285.         // 在这里添加自定义按钮的点击逻辑
  286.         const newCodeFont = prompt("请输入代码字体，保证字体已经保存在本地，最好是等宽字体：", localStorage.getItem("userCodeFont"));
  287.         if (newCodeFont !== null) {
  288.             localStorage.setItem("userCodeFont", newCodeFont);
  289.             alert(`您的信息已保存：\n${newCodeFont}`);
  290.         }
  291.     });
  292.     fontSizeButton.addEventListener('click', () => {
  293.         // 在这里添加自定义按钮的点击逻辑
  294.         const newSizeFont = prompt("请输入字体大小，单位px（只用输入数字）：", localStorage.getItem("userFontSize"));
  295.         if (newSizeFont !== null) {
  296.             localStorage.setItem("userFontSize", newSizeFont);
  297.             alert(`您的信息已保存：\n${newSizeFont}`);
  298.         }
  299.     });
  300.     selfButton.addEventListener('click', () => {
  301.         // 在这里添加自定义按钮的点击逻辑
  302.         let nowSelf = localStorage.getItem("userSelf");
  303.         if (nowSelf === "true") nowSelf = "false";
  304.         else nowSelf = "true";
  305.         localStorage.setItem("userSelf",nowSelf);
  306.         if (localStorage.getItem("userSelf") === "true") content2 = '自定义';
  307.         else content2 = '随机漫画';
  308.         selfButton.textContent = `当前为${content2}壁纸，点击更改`;
  309.         alert(`您的信息已保存：\n${content2}`);
  310.         if (content2 === "随机漫画") {
  311.             backgroundButton.style.color = "rgb(100,0,0)";
  312.             backgroundButton.style.backgroundColor = "rgb(100,0,0)";
  313.             backgroundButton.style.opacity = "0.3";
  314.         } else {
  315.             backgroundButton.style.color = "#fff";
  316.             backgroundButton.style.backgroundColor = "#007bff";
  317.             backgroundButton.style.opacity = "0.85";
  318.         }
  319.     });
  320.     backgroundButton.addEventListener('click', () => {
  321.         if (content2 === "随机漫画") return ;
  322.         // 在这里添加自定义按钮的点击逻辑
  323.         const newBackground = prompt("请输入自定义背景图url：", localStorage.getItem("userBackground"));
  324.         if (newBackground !== null) {
  325.             localStorage.setItem("userBackground", newBackground);
  326.             alert(`您的信息已保存：\n${newBackground}`);
  327.         }
  328.     });
  329.     KButton.addEventListener('click', () => {
  330.         // 在这里添加自定义按钮的点击逻辑
  331.         const newK = prompt("请输入透明度，在 0 和 1 之间：", localStorage.getItem("userK"));
  332.         if (newK !== null) {
  333.             localStorage.setItem("userK", newK);
  334.             alert(`您的信息已保存：\n${newK}`);
  335.         }
  336.     });
  337.     fontButton.style.opacity = 0.85;
  338.     fontButton.addEventListener('mouseover', () => { fontButton.style.opacity = 1; });
  339.     fontButton.addEventListener('mouseout', () => { fontButton.style.opacity = 0.85; });
  340.     codeFontButton.style.opacity = 0.85;
  341.     codeFontButton.addEventListener('mouseover', () => { codeFontButton.style.opacity = 1; });
  342.     codeFontButton.addEventListener('mouseout', () => { codeFontButton.style.opacity = 0.85; });
  343.     closeButton.style.opacity = 0.85;
  344.     closeButton.addEventListener('mouseover', () => { closeButton.style.opacity = 1; });
  345.     closeButton.addEventListener('mouseout', () => { closeButton.style.opacity = 0.85; });
  346.     fontSizeButton.style.opacity = 0.85;
  347.     fontSizeButton.addEventListener('mouseover', () => { fontSizeButton.style.opacity = 1; });
  348.     fontSizeButton.addEventListener('mouseout', () => { fontSizeButton.style.opacity = 0.85; });
  349.     selfButton.style.opacity = 0.85;
  350.     selfButton.addEventListener('mouseover', () => { selfButton.style.opacity = 1; });
  351.     selfButton.addEventListener('mouseout', () => { selfButton.style.opacity = 0.85; });
  352.     KButton.style.opacity = 0.85;
  353.     KButton.addEventListener('mouseover', () => { KButton.style.opacity = 1; });
  354.     KButton.addEventListener('mouseout', () => { KButton.style.opacity = 0.85; });
  355.     if (content2 === "自定义") backgroundButton.style.opacity = 0.85;
  356.     backgroundButton.addEventListener('mouseover', () => { if (content2 === "自定义") backgroundButton.style.opacity = 1; });
  357.     backgroundButton.addEventListener('mouseout', () => { if (content2 === "自定义") backgroundButton.style.opacity = 0.85; });
  358. }
  359. (function() {
  360.     Init();
  361.     window.addEventListener('load', function(){
  362.         'use strict';
  363.         addButton(); addStyle(); SettingButton();
  364.         if (IsSelf === "false") {
  365.             let zindex = -10;
  366.             let body = document.querySelector('body');
  367.             let bg = "https://t.mwm.moe/pc/";
  368.             console.log(bg);
  369.             let opacity = "0.3";
  370.             let bgBox = document.createElement('div');
  371.             // window.location.reload(); console.log('asdf');
  372.             bgBox.style = "z-index: " + zindex + ";width: 100vw; height: 100vh;position: fixed;top: 0;left: 0;pointer-events: none;opacity: " + opacity + ";background-image: url(" + bg + ") ;background-attachment: fixed;background-size: cover;";
  373.             console.log('reload'); body.insertBefore(bgBox,body.children[0]);
  374.         } else {
  375.             let zindex = -10;
  376.             let body = document.querySelector('body');
  377.             let bg = BackGroundName;
  378.             console.log(bg);
  379.             let opacity = "0.3";
  380.             let bgBox = document.createElement('div');
  381.             // window.location.reload(); console.log('asdf');
  382.             bgBox.style = "z-index: " + zindex + ";width: 100vw; height: 100vh;position: fixed;top: 0;left: 0;pointer-events: none;opacity: " + opacity + ";background-image: url(" + bg + ") ;background-attachment: fixed;background-size: cover;";
  383.             body.insertBefore(bgBox,body.children[0]);
  384.         }
  385.         document.body.style.fontFamily = FontName;
  386.         document.body.style.fontSize = FontSize + 'px';
  387.         GM_addStyle(`
  388.         code {
  389.             font-family: '${CodeFontName}', '微软雅黑' !important;
  390.         }
  391.     `);
  392.         GM_addStyle(`
  393.         body {
  394.             background-color: rgba(255,255,255,0.6);
  395.         }
  396.         .d-header,
  397.         .d-editor-wrapper,
  398.         .d-editor-preview,
  399.         .d-sidekiq-stats,
  400.         .d-footer {
  401.             background-color: rgba(255,255,255,0.6) !important;
  402.         }
  403.     `);
  404.         // 使用CSS选择器选择所有匹配的元素
  405.         const element = document.querySelector(".background-container");
  406.         // 循环遍历这些元素并设置它们的透明度
  407.         element.style.opacity = 0; // 0 表示完全透明，1 表示完全不透明
  408.         setTitleColor();
  409.         RemoveText();
  410.     });
  411.  
  412. })();