🎉 欢迎访问GreasyFork.Org 镜像站!本镜像站由公众号【爱吃馍】搭建,用于分享脚本。联系邮箱📮

Greasy fork 爱吃馍镜像

CSDN 去广告沉浸阅读模式

沉浸式阅读 🌈 使用随机背景图片 🎬 重构页面布局 🎯 净化剪切板 🎨 屏蔽一切影响阅读的元素 🎧

Vous devrez installer une extension telle que Tampermonkey, Greasemonkey ou Violentmonkey pour installer ce script.

You will need to install an extension such as Tampermonkey to install this script.

Vous devrez installer une extension telle que Tampermonkey ou Violentmonkey pour installer ce script.

Vous devrez installer une extension telle que Tampermonkey ou Userscripts pour installer ce script.

Vous devrez installer une extension telle que Tampermonkey pour installer ce script.

Vous devrez installer une extension de gestionnaire de script utilisateur pour installer ce script.

(J'ai déjà un gestionnaire de scripts utilisateur, laissez-moi l'installer !)

🚀 安装遇到问题?关注公众号获取帮助

公众号二维码

扫码关注【爱吃馍】

回复【脚本】获取最新教程和防失联地址

Vous devrez installer une extension telle que Stylus pour installer ce style.

Vous devrez installer une extension telle que Stylus pour installer ce style.

Vous devrez installer une extension telle que Stylus pour installer ce style.

Vous devrez installer une extension du gestionnaire de style pour utilisateur pour installer ce style.

Vous devrez installer une extension du gestionnaire de style pour utilisateur pour installer ce style.

Vous devrez installer une extension du gestionnaire de style pour utilisateur pour installer ce style.

(J'ai déjà un gestionnaire de style utilisateur, laissez-moi l'installer!)

🚀 安装遇到问题?关注公众号获取帮助

公众号二维码

扫码关注【爱吃馍】

回复【脚本】获取最新教程和防失联地址

// ==UserScript==
// @name         CSDN 去广告沉浸阅读模式
// @namespace    http://tampermonkey.net/
// @version      3.0.18
// @license      GPL-3.0
// @description  沉浸式阅读 🌈 使用随机背景图片 🎬 重构页面布局 🎯 净化剪切板 🎨 屏蔽一切影响阅读的元素 🎧
// @description  背景图片取自 https://www.baidu.com/home/skin/data/skin
// @icon         https://g.csdnimg.cn/static/logo/favicon32.ico
// @author       SublimeCT
// @note         v3.0.18 隐藏其他代码块下的 AI写代码 推广按钮, 重置代码块中的一键复制按钮位置
// @note         v3.0.17 隐藏 AI写代码 推广按钮, 重置一键复制按钮位置
// @note         v3.0.16 修复在页面右侧显示相关专栏的问题; 修复复制按钮显示内容为登录复制的问题
// @note         v3.0.15 修复文章中的代码块高度未展开的问题
// @note         v3.0.14 修复文章内容部分显示多余的 margin-right 的问题; 修复文章顶部多余高度的问题
// @note         v3.0.13 修复与 dark reader 一起使用时背景图片被遮挡的问题; 修复目录高度异常导致的无法滚动的问题
// @note         v3.0.12 隐藏文章左侧顶部的推广, 隐藏右下角工的提问元素
// @note         v3.0.11 隐藏文章底部的创作提示框及提问推广元素
// @note         v3.0.10 隐藏文章底部和右下角工具栏中影响阅读的提示元素; 修复原文链接图标位置样式; 更新设置弹窗中的按钮样式
// @note         v3.0.9  隐藏右下角登录提示弹窗
// @note         v3.0.8  移除包含黑色样式的 skin css 文件; 固定背景图始终覆盖可视区域显示
// @note         v3.0.7  修复复制功能无法使用的问题
// @note         v3.0.6  自动展开被折叠的代码块内容
// @note         v3.0.5  将设置按钮图标替换为 SVG; 修复部分失效样式; 增加右下角广告屏蔽规则
// @note         v3.0.4  文中代码块解除选择禁用
// @note         v3.0.3  文章正文底部作者信息 footer fixed 定位改回 relative; 屏蔽打赏 box
// @note         v3.0.2  增加红包入口浮窗屏蔽规则
// @note         v3.0.1  增加目录是否存在的判断, 只在存在文章目录时才显示, 避免显示空白 sidebar 的问题
// @note         v3.0.0  增加目录显示功能, 修复 `firefox` 下 `fixed` 定位失效的问题
// @note         v2.7.7  屏蔽小店模块, 修复 bbs.csdn.net 下的样式问题, 感谢 `独自等待` 的反馈
// @note         v2.7.6  修复某些页面复制按钮依然显示登陆后复制的问题, 感谢 `JayYoung2021` 的反馈
// @note         v2.7.5  修复未登录状态下某些页面的一键复制无法使用的问题
// @note         v2.7.4  显示一键复制按钮, 未登录时已将登录后复制改为一键复制
// @note         v2.7.3  修改 interceptCSDN 中 `csdn` 取值逻辑, 修复刷新背景图片时图片名称不变的问题
// @note         v2.7.2  移除外链拦截行为; 增加部分元素的过渡效果;
// @note         v2.7.1  修复文章宽度 `<1320px` 时宽度设置无效的问题
// @note         v2.7.0  增加隐藏底部推荐文章和 footer 信息功能; 屏蔽 csdn skin css 文件; 修复设置弹窗 HTML 语法错误导致的标签解析异常;
// @note         v2.6.3  屏蔽 red pack 全屏红包广告
// @note         v2.6.2  屏蔽一键三连 tips, 屏蔽文章列表中的 `.recommend-item-box.type_other` 广告
// @note         v2.6.1  增加文章宽度设置, 引入 round-slider 组件
// @note         v2.6.0  增加纯色背景设置功能, 引入 a color picker 组件; 增加刷新背景图片功能; 增加设置弹窗内按钮样式
// @note         v2.5.10 修复在内容区时显示横向滚动条的问题, 修复原文链接的贪婪匹配(href)问题
// @note         v2.5.9  可以设置是否显示原文链接, 修复设置弹窗无法关闭的 bug, 调整评论区透明度并增加 hover 效果
// @note         v2.5.8  增加原文链接(从顶部折叠栏或文中提取原文链接), 显示在顶部 info-box 中; 屏蔽固定在页面底部的 toolbox; 底部作者信息右侧按钮只显示关注; 评论区输入框交叉轴对齐
// @note         v2.5.7  防止文章内容被黑白化处理(文中的图片被灰度处理后严重影响阅读), 适用于特殊日期; *2020-04-04 向疫情中付出努力的所有医务工作者及志愿者致敬!*
// @note         v2.5.6  覆盖所有 media query 样式以防止原有的自适应样式导致布局错乱; 评论区评论内容强制换行以保持一致性
// @note         v2.5.5  监听数据层变化并控制分页组件显示; 优化评论区样式
// @note         v2.5.4  显示评论列表分页组件; 继续更新广告屏蔽规则
// @note         v2.5.3  更新文章内容区域顶部的巨幅广告图屏蔽规则
// @note         v2.5.2  屏蔽 **的顶部巨幅广告图; 隐藏底部 more-toolbox 按钮组; 修改脚本描述
// @note         v2.5.1  修改正文底部 私信求帮助 按钮样式, 使其仅在 hover 状态下可见, 屏蔽底部 copyright 和 原皮肤信息
// @note         v2.5.0  增加 iteye.com 样式兼容, 使用 GM_setValue 实现跨域共享本地存储数据
// @note         v2.4.1  修复设置弹窗在特定页面下的宽度异常问题, 增加底部推荐文章 hover 效果
// @note         v2.4.0  增加隐藏设置按钮选项; 修复自定义链接取值错误的问题
// @note         v2.3.0  显示当前背景图名称, 完善自定义图片; 删除 `最近使用` 图片类目
// @note         v2.2.1  屏蔽 side toolbar 中的广告 icon
// @note         v2.2.0  增加设置入口 icon timeout
// @note         v2.1    修改脚本加载时机, 不会再出现先加载广告后屏蔽的情况了
// @note         v2.0    增加背景图设置入口按钮, 扩展 bottom tool bar
// @note         v1.11   更新 bbs.csdn.net 过滤规则; 增加底部 "底线" 描述
// @note         v1.10   增加 ask.csdn.net 支持
// @note         v1.9    解除跳转拦截; 增加新的广告过滤规则
// @note         v1.8    移除点击文章中的链接拦截, 直接跳转到目标链接, 建议使用鼠标中键在新窗口打开链接!; 更新右侧 toolkit 按钮组的屏蔽规则
// @match        *://blog.csdn.net/*/article/details/*
// @match        *://*.blog.csdn.net/article/details/*
// @require      https://unpkg.com/[email protected]/dist/acolorpicker.js
// @require      https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.min.js
// @require      https://cdn.jsdelivr.net/npm/[email protected]/dist/roundslider.min.js
// @include      https://bbs.csdn.net/topics/*
// @include      https://*.iteye.com/blog/*
// @include      https://*.iteye.com/news/*
// @include      https://ask.csdn.net/questions/*
// @grant        GM_getValue
// @grant        GM.getValue
// @grant        GM_setValue
// @grant        GM.setValue
// @run-at       document-start
// @match        <$URL$>
// ==/UserScript==

(function () {
    'use strict';
    (() => {
        // 爬到的所有现在可访问的背景图ID
        // const IMG_ID_LIST = [ 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32, 33, 34, 35, 36, 37, 38, 39, 40, 41, 42, 43, 44, 45, 46, 47, 48, 49, 50, 51, 52, 53, 54, 55, 56, 57, 58, 59, 60, 61, 62, 63, 64, 65, 66, 67, 68, 69, 70, 71, 72, 73, 74, 75, 76, 77, 78, 79, 80, 81, 82, 83, 84, 85, 86, 87, 88, 89, 90, 91, 92, 93, 94, 95, 96, 97, 98, 99, 100, 101, 102, 103, 104, 105, 106, 107, 108, 109, 110, 111, 112, 113, 114, 115, 116, 117, 118, 119, 120, 121, 122, 123, 124, 125, 126, 127, 128, 129, 130, 131, 132, 133, 134, 135, 136, 137, 138, 139, 140, 141, 142, 143, 144, 145, 146, 147, 148, 149, 150, 151, 152, 153, 154, 155, 156, 157, 158, 159, 160, 161, 162, 163, 164, 165, 166, 167, 168, 169, 170, 171, 172, 173, 174, 175, 176, 177, 178, 179, 180, 181, 182, 183, 184, 185, 186, 200, 201, 202, 203, 204, 205, 206, 207, 208, 209, 210, 211, 212, 213, 214, 215, 216, 217, 218, 219, 220, 221, 222, 223, 224, 225, 226, 227, 228, 229, 230, 231, 232, 233, 234, 235, 236, 237, 238, 239, 240, 241, 242, 243, 244, 245, 246, 247, 248, 249, 250, 251, 252, 253, 254, 255, 256, 257, 258, 259, 260, 261, 262, 263, 264, 265, 266, 267, 268, 269, 270, 271, 272, 273, 274, 275, 276, 277, 278, 279, 280, 281, 282, 283, 284, 285, 286, 287, 288, 289, 290, 291, 292, 293, 294, 295, 296, 297, 298, 299, 300, 301, 302, 303, 304, 305, 306, 307, 308, 309, 310, 311, 312, 313, 314, 315, 316, 317, 318, 319, 320, 321, 322, 323, 324, 325, 326, 327, 328, 329, 330, 331, 400, 401, 402, 403, 404, 405, 406, 407, 408, 409, 410, 411, 412, 413, 414, 415, 416, 417, 418, 419, 420, 421, 422, 423, 424, 425, 426, 427, 428, 429, 430, 431, 432, 433, 434, 435, 436, 437, 438, 439, 440, 441, 442, 443, 444, 445, 446, 447, 448, 449, 450, 451, 452, 453, 454, 455, 456, 457, 458, 459, 460, 461, 462, 463, 464, 465, 466, 467, 468, 469, 470, 471, 472, 473, 474, 475, 476, 477, 478, 479, 480, 481, 482, 483, 484, 485, 486, 487, 488, 489, 490, 491, 492, 493, 494, 495, 496, 497, 498, 499, 500, 501, 502, 503, 504, 505, 506, 507, 508, 509, 510, 511, 512, 513, 514, 515, 516, 517, 518, 519, 520, 521, 522, 523, 524, 525, 526, 527, 528, 529, 530, 531, 532, 533, 534, 535, 536, 537, 538, 539, 540, 541, 542, 543, 544, 608, 609, 610, 611, 620, 621, 622, 623, 624, 625, 626, 627, 628, 629, 630, 631, 632, 633, 634, 635, 636, 637, 638, 639, 640, 641, 642, 643, 644, 645, 646, 647, 648, 649, 650, 651, 652, 653, 654, 655, 656, 657, 658, 659, 660, 661, 662, 663, 664, 665, 666, 667, 668, 669, 670, 671, 672, 673, 674, 675, 676, 677, 678, 679, 680, 681, 682, 683, 684, 685, 686, 687, 688, 689, 690, 691, 692, 693, 694, 695, 696, 697, 698, 699, 700, 701, 702, 703, 704, 705, 706, 707, 708, 709, 710, 711, 712, 713, 714, 715, 716, 717, 718, 719, 720, 721, 722, 723, 724, 725, 726, 727, 728, 729, 730, 731, 732, 733, 734, 735, 736, 737, 738, 739, 740, 741, 742, 743, 744, 745, 746, 747, 748, 749, 750, 751, 752, 753, 754, 755, 756, 757, 758, 759, 760, 761, 762, 763, 764, 765, 766, 767, 768, 769, 770, 771, 772, 773, 774, 775, 776, 777, 778, 779, 780, 781, 782, 783, 784, 785, 786, 787, 788, 789, 790, 791, 792, 793, 794, 795, 796, 797, 798, 799, 800, 801, 802, 803, 804, 805, 806, 807, 808, 809, 810, 811, 812, 813, 814, 815, 816, 817, 818, 819, 820, 821, 822, 823, 824, 825, 826, 827, 828, 829, 830, 831, 832, 833, 834, 835, 836, 837, 838, 839, 840, 841, 842, 843, 844, 845, 846, 847, 848, 849, 850, 851, 852, 853, 854, 855, 856, 857, 858, 859, 860, 861, 862, 863, 864, 865, 866, 867, 868, 869, 870, 871, 872, 873, 874, 875, 876, 877, 878, 879, 880, 881, 882, 883, 884, 885, 886, 887, ]
        const IMG_CATEGORYS = { "热门": [887, 886, 883, 882, 881, 880, 879, 878, 877, 876, 874, 875, 872, 873, 859, 832, 833, 834, 827, 828, 829, 830, 831, 817, 818, 819, 820, 821, 805, 806, 807, 808, 809, 810, 811, 812, 813, 814, 815, 816, 796, 797, 798, 799, 800, 801, 802, 803, 804, 776, 777, 778, 781, 784, 765, 767, 768, 766, 611, 610, 608, 720], "冒险岛2": [860, 861, 862, 863, 864, 865, 866, 867, 868, 869, 870, 871], "守望先锋": [835, 836, 837, 838, 839, 840, 841, 842, 843, 844, 845, 846], "魔兽世界": [721, 722, 723, 724, 725, 726, 727, 728, 729, 730, 731, 732], "炉石传说": [733, 734, 735, 736, 737, 738, 739, 740, 741, 742, 743, 744], "风暴英雄": [660, 661, 662, 663, 664, 665, 666, 667, 668, 669, 670, 671], "暗黑破坏神Ⅲ": [672, 673, 674, 675, 676, 677, 678, 679, 680, 681, 682, 683], "星际争霸II": [684, 685, 686, 687, 688, 689, 690, 691, 692, 693, 694, 695], "冷兔": [749, 750, 751, 752, 753, 754, 755, 756, 757, 758, 759, 760], "阿狸": [521, 114, 523, 524, 525, 526, 527, 528, 529, 530, 531, 532], "炮炮兵": [540, 534, 535, 536, 537, 538, 539, 533, 541, 542, 543, 544], "林心如": [437, 438, 440, 439, 441, 443, 447, 444, 445, 446, 442, 448], "郑爽": [509, 510, 511, 512, 515, 514, 513, 516, 517, 518, 519, 520], "戚薇": [449, 456, 451, 452, 453, 454, 455, 450, 457, 459, 458, 460], "佟丽娅": [485, 486, 490, 488, 489, 487, 491, 492, 493, 494, 495, 496], "Angelababy": [400, 401, 402, 403, 407, 405, 406, 410, 404, 409, 408, 411], "唐嫣": [473, 474, 475, 482, 480, 478, 479, 477, 476, 481, 483, 484], "李冰冰": [424, 425, 427, 430, 426, 429, 428, 431, 432, 433, 434, 435], "高圆圆": [412, 413, 418, 415, 416, 417, 414, 419, 420, 421, 422, 423], "孙俪": [461, 462, 463, 464, 471, 466, 468, 467, 469, 470, 465, 472], "姚晨": [497, 498, 499, 506, 502, 501, 503, 504, 505, 507, 500, 508], "杨幂": [200, 201, 202, 203, 204, 205, 206, 207, 208, 209, 210, 211], "刘诗诗": [273, 274, 275, 276, 277, 278, 279, 280, 281, 282, 283], "胡歌": [260, 261, 262, 263, 628, 629, 630, 631, 268, 269, 270, 271], "邓紫棋": [320, 321, 322, 323, 324, 325, 326, 327, 328, 329, 330, 331], "赵丽颖": [249, 2481, 250, 251, 252, 253, 254, 255, 256, 257, 258, 259], "马天宇": [284, 285, 286, 287, 288, 289, 290, 291, 292, 293, 294, 295], "陈晓": [233, 225, 226, 227, 228, 229, 230, 231, 232, 224, 234, 235], "陈伟霆": [308, 309, 310, 311, 312, 313, 314, 315, 316, 317, 318, 319], "柳岩": [236, 2371, 238, 239, 240, 241, 242, 243, 244, 245, 246, 247], "吴奇隆": [297, 298, 299, 300, 301, 302, 304, 296, 305, 306, 307], "风景": [822, 823, 824, 825, 826, 54, 62, 5, 37, 115, 116, 117, 118, 120, 122, 123, 49, 25, 121, 26, 43, 45, 48, 51, 70, 4, 10, 11, 17, 23, 6, 28, 38, 16, 31, 42, 163, 164, 165, 166, 167, 168, 170, 171, 172, 174, 175, 177, 178, 179, 180, 181, 182, 184, 185, 186, 69, 57, 13, 67], "简约": [12, 111, 114, 53, 27, 33, 41, 35, 2, 14, 44, 21, 36, 8, 150, 125, 1, 169, 173, 176, 183, 46, 61, 47, 52, 64, 24, 58, 18, 59, 55, 9, 20], "小清新": [74, 71, 113, 119, 124, 29, 65, 32, 34, 39, 40, 50, 60, 73, 30, 63, 126, 128, 66, 19, 112, 22, 68, 7, 15, 3, 56] }
        const IMG_MAP = { "1": "原野 全景图片", "2": "银汉迢迢 全景图片", "3": "紫色郁金香 百度相册", "4": "飞瀑如练 全景图片", "5": "梦里水乡 探摄小子", "6": "长天一色 全景图片", "7": "春意浓 sprint207", "8": "暮色四合 探摄小子", "9": "出水芙蓉 探摄小子", "10": "壁立千仞 全景图片", "11": "廊桥遗梦 探摄小子", "12": "寥落星河 全景图片", "13": "层林尽染 全景图片", "14": "晨曦 探摄小子", "15": "早梅争春 探摄小子", "16": "千山雪 刘霄", "17": "海之梦 全景图片", "18": "白色飞羽 sprint207", "19": "在路上 jesse2young", "20": "锦鲤 sprint207", "21": "雨夜 yunxiaoqian", "22": "水墨江南 戈斯拉918", "23": "城市之光 戈斯拉918", "24": "三叶草 wanzathe", "25": " 全景图片", "26": " 全景图片", "27": " 全景图片", "28": " 全景图片", "29": " 全景图片", "30": " 全景图片", "31": " 全景图片", "32": " 全景图片", "33": " 全景图片", "34": " 全景图片", "35": " 全景图片", "36": " 全景图片", "37": " 全景图片", "38": " 全景图片", "39": " 全景图片", "40": " 全景图片", "41": " 全景图片", "42": " 全景图片", "43": " 全景图片", "44": " 全景图片", "45": " 全景图片", "46": " 全景图片", "47": " 全景图片", "48": " 全景图片", "49": " 全景图片", "50": " 全景图片", "51": " 全景图片", "52": " 全景图片", "53": " ranklau", "54": " silsnow", "55": " weifengqingyu", "56": " 张云洁01", "57": " tiffanywangbei", "58": " ying_ok_delang", "59": " sherry_dundun", "60": " 源形毕露", "61": " 路璐", "62": " richard-wang", "63": " 源形毕露", "64": " 圣名若瑟", "65": " 米壹映画", "66": " 米壹映画", "67": " 路璐", "68": " 路璐", "69": " 毛嘉文", "70": " richard-wang", "71": " fish,胡子鱼", "73": " fish,胡子鱼", "74": " fish,胡子鱼", "111": " 全景图片", "112": " fish,胡子鱼", "113": " fish,胡子鱼", "114": " 全景图片", "115": " 彼岸Claire", "116": " 落绪纷飞", "117": " 魔神咒", "118": " lemonchen07", "119": " 决明", "120": " 长老亮", "121": " 蓝月玩转西部", "122": " 小pie", "123": " woodfishbbi", "124": " 早川", "125": "波涛汹涌 全景", "126": "火车飞驰 全景", "128": "演唱会 全景", "150": "激情世界杯 ", "163": " shenmishashou", "164": " 我叫孟夕", "165": " 穷游晓明", "166": " 1024小虎牙", "167": " shenmishashou", "168": " shenmishashou", "169": " 0535xiaoyudi", "170": " 穷游晓明", "171": " 西西里玩不停", "172": " 西西里玩不停", "173": " 1024小虎牙", "174": " shenmishashou", "175": " 穷游晓明", "176": " 1024小虎牙", "177": " 我叫孟夕", "178": " 1024小虎牙", "179": " shenmishashou", "180": " 西西里玩不停", "181": " 我叫孟夕", "182": " 蓝色呓语", "183": " 西西里玩不停", "184": " 西西里玩不停", "185": " 我叫孟夕", "186": " 西西里玩不停", "200": "杨幂0", "201": "杨幂1", "202": "杨幂2", "203": "杨幂3", "204": "杨幂4", "205": "杨幂5", "206": "杨幂6", "207": "杨幂7", "208": "杨幂8", "209": "杨幂9", "210": "杨幂10", "211": "杨幂11", "224": "陈晓9", "225": "陈晓1", "226": "陈晓2", "227": "陈晓3", "228": "陈晓4", "229": "陈晓5", "230": "陈晓6", "231": "陈晓7", "232": "陈晓8", "233": "陈晓0", "234": "陈晓10", "235": "陈晓11", "236": "柳岩0", "238": "柳岩2", "239": "柳岩3", "240": "柳岩4", "241": "柳岩5", "242": "柳岩6", "243": "柳岩7", "244": "柳岩8", "245": "柳岩9", "246": "柳岩10", "247": "柳岩11", "249": "赵丽颖0", "250": "赵丽颖2", "251": "赵丽颖3", "252": "赵丽颖4", "253": "赵丽颖5", "254": "赵丽颖6", "255": "赵丽颖7", "256": "赵丽颖8", "257": "赵丽颖9", "258": "赵丽颖10", "259": "赵丽颖11", "260": "胡歌0", "261": "胡歌1", "262": "胡歌2", "263": "胡歌3", "268": "胡歌8", "269": "胡歌9", "270": "胡歌10", "271": "胡歌11", "273": "刘诗诗0", "274": "刘诗诗1", "275": "刘诗诗2", "276": "刘诗诗3", "277": "刘诗诗4", "278": "刘诗诗5", "279": "刘诗诗6", "280": "刘诗诗7", "281": "刘诗诗8", "282": "刘诗诗9", "283": "刘诗诗10", "284": "马天宇0", "285": "马天宇1", "286": "马天宇2", "287": "马天宇3", "288": "马天宇4", "289": "马天宇5", "290": "马天宇6", "291": "马天宇7", "292": "马天宇8", "293": "马天宇9", "294": "马天宇10", "295": "马天宇11", "296": "吴奇隆7", "297": "吴奇隆0", "298": "吴奇隆1", "299": "吴奇隆2", "300": "吴奇隆3", "301": "吴奇隆4", "302": "吴奇隆5", "304": "吴奇隆6", "305": "吴奇隆8", "306": "吴奇隆9", "307": "吴奇隆10", "308": "陈伟霆0", "309": "陈伟霆1", "310": "陈伟霆2", "311": "陈伟霆3", "312": "陈伟霆4", "313": "陈伟霆5", "314": "陈伟霆6", "315": "陈伟霆7", "316": "陈伟霆8", "317": "陈伟霆9", "318": "陈伟霆10", "319": "陈伟霆11", "320": "邓紫棋0", "321": "邓紫棋1", "322": "邓紫棋2", "323": "邓紫棋3", "324": "邓紫棋4", "325": "邓紫棋5", "326": "邓紫棋6", "327": "邓紫棋7", "328": "邓紫棋8", "329": "邓紫棋9", "330": "邓紫棋10", "331": "邓紫棋11", "400": "Angelababy0", "401": "Angelababy1", "402": "Angelababy2", "403": "Angelababy3", "404": "Angelababy8", "405": "Angelababy5", "406": "Angelababy6", "407": "Angelababy4", "408": "Angelababy10", "409": "Angelababy9", "410": "Angelababy7", "411": "Angelababy11", "412": "高圆圆0", "413": "高圆圆1", "414": "高圆圆6", "415": "高圆圆3", "416": "高圆圆4", "417": "高圆圆5", "418": "高圆圆2", "419": "高圆圆7", "420": "高圆圆8", "421": "高圆圆9", "422": "高圆圆10", "423": "高圆圆11", "424": "李冰冰0", "425": "李冰冰1", "426": "李冰冰4", "427": "李冰冰2", "428": "李冰冰6", "429": "李冰冰5", "430": "李冰冰3", "431": "李冰冰7", "432": "李冰冰8", "433": "李冰冰9", "434": "李冰冰10", "435": "李冰冰11", "437": "林心如0", "438": "林心如1", "439": "林心如3", "440": "林心如2", "441": "林心如4", "442": "林心如10", "443": "林心如5", "444": "林心如7", "445": "林心如8", "446": "林心如9", "447": "林心如6", "448": "林心如11", "449": "戚薇0", "450": "戚薇7", "451": "戚薇2", "452": "戚薇3", "453": "戚薇4", "454": "戚薇5", "455": "戚薇6", "456": "戚薇1", "457": "戚薇8", "458": "戚薇10", "459": "戚薇9", "460": "戚薇11", "461": " 陈漫", "462": "孙俪1", "463": "孙俪2", "464": "孙俪3", "465": "孙俪10", "466": "孙俪5", "467": "孙俪7", "468": " 陈漫", "469": " 陈漫", "470": "孙俪9", "471": "孙俪4", "472": "孙俪11", "473": "唐嫣0", "474": "唐嫣1", "475": "唐嫣2", "476": "唐嫣8", "477": "唐嫣7", "478": "唐嫣5", "479": "唐嫣6", "480": "唐嫣4", "481": "唐嫣9", "482": "唐嫣3", "483": "唐嫣10", "484": "唐嫣11", "485": "佟丽娅0", "486": "佟丽娅1", "487": "佟丽娅5", "488": "佟丽娅3", "489": "佟丽娅4", "490": "佟丽娅2", "491": "佟丽娅6", "492": "佟丽娅7", "493": "佟丽娅8", "494": "佟丽娅9", "495": "佟丽娅10", "496": "佟丽娅11", "497": "姚晨0", "498": "姚晨1", "499": "姚晨2", "500": "姚晨10", "501": "姚晨5", "502": "姚晨4", "503": "姚晨6", "504": "姚晨7", "505": "姚晨8", "506": "姚晨3", "507": "姚晨9", "508": "姚晨11", "509": "郑爽0", "510": "郑爽1", "511": "郑爽2", "512": "郑爽3", "513": "郑爽6", "514": "郑爽5", "515": "郑爽4", "516": "郑爽7", "517": "郑爽8", "518": "郑爽9", "519": "郑爽10", "520": "郑爽11", "521": "阿狸0", "523": "阿狸2", "524": "阿狸3", "525": "阿狸4", "526": "阿狸5", "527": "阿狸6", "528": "阿狸7", "529": "阿狸8", "530": "阿狸9", "531": "阿狸10", "532": "阿狸11", "533": "炮炮兵7", "534": "炮炮兵1", "535": "炮炮兵2", "536": "炮炮兵3", "537": "炮炮兵4", "538": "炮炮兵5", "539": "炮炮兵6", "540": "炮炮兵0", "541": "炮炮兵8", "542": "炮炮兵9", "543": "炮炮兵10", "544": "炮炮兵11", "608": "热门60", "610": "热门59", "611": "热门58", "628": "胡歌4", "629": "胡歌5", "630": "胡歌6", "631": "胡歌7", "660": "风暴英雄0", "661": "风暴英雄1", "662": "风暴英雄2", "663": "风暴英雄3", "664": "风暴英雄4", "665": "风暴英雄5", "666": "风暴英雄6", "667": "风暴英雄7", "668": "风暴英雄8", "669": "风暴英雄9", "670": "风暴英雄10", "671": "风暴英雄11", "672": "暗黑破坏神Ⅲ0", "673": "暗黑破坏神Ⅲ1", "674": "暗黑破坏神Ⅲ2", "675": "暗黑破坏神Ⅲ3", "676": "暗黑破坏神Ⅲ4", "677": "暗黑破坏神Ⅲ5", "678": "暗黑破坏神Ⅲ6", "679": "暗黑破坏神Ⅲ7", "680": "暗黑破坏神Ⅲ8", "681": "暗黑破坏神Ⅲ9", "682": "暗黑破坏神Ⅲ10", "683": "暗黑破坏神Ⅲ11", "684": "星际争霸II0", "685": "星际争霸II1", "686": "星际争霸II2", "687": "星际争霸II3", "688": "星际争霸II4", "689": "星际争霸II5", "690": "星际争霸II6", "691": "星际争霸II7", "692": "星际争霸II8", "693": "星际争霸II9", "694": "星际争霸II10", "695": "星际争霸II11", "720": "热门61", "721": "魔兽世界0", "722": "魔兽世界1", "723": "魔兽世界2", "724": "魔兽世界3", "725": "魔兽世界4", "726": "魔兽世界5", "727": "魔兽世界6", "728": "魔兽世界7", "729": "魔兽世界8", "730": "魔兽世界9", "731": "魔兽世界10", "732": "魔兽世界11", "733": "炉石传说0", "734": "炉石传说1", "735": "炉石传说2", "736": "炉石传说3", "737": "炉石传说4", "738": "炉石传说5", "739": "炉石传说6", "740": "炉石传说7", "741": "炉石传说8", "742": "炉石传说9", "743": "炉石传说10", "744": "炉石传说11", "749": "冷兔0", "750": "冷兔1", "751": "冷兔2", "752": "冷兔3", "753": "冷兔4", "754": "冷兔5", "755": "冷兔6", "756": "冷兔7", "757": "冷兔8", "758": "冷兔9", "759": "冷兔10", "760": "冷兔11", "765": "热门54", "766": "热门57", "767": "热门55", "768": "热门56", "776": " 光线影业", "777": " 光线影业", "778": " 光线影业", "781": " 光线影业", "784": " 枫海影业", "796": " 欢瑞世纪", "797": " 欢瑞世纪", "798": " 欢瑞世纪", "799": " 欢瑞世纪", "800": " 欢瑞世纪", "801": " 欢瑞世纪", "802": " 恒业影业", "803": " 周迅工作室", "804": " 华映传媒", "805": " 爱奇艺", "806": " 爱奇艺", "807": " 爱奇艺", "808": " 世纪长龙", "809": " 世纪长龙", "810": " 世纪长龙", "811": " 嘉映影业", "812": " 林心如工作室", "813": " 环球影业", "814": " 环球影业", "815": " 环球影业", "816": " 环球影业", "817": " 环球影业", "818": " 环球影业", "819": " 派拉蒙影业", "820": " 派拉蒙影业", "821": " 黄子韬工作室", "822": " 高品图像", "823": " 高品图像", "824": " 高品图像", "825": " 高品图像", "826": " 高品图像", "827": " 爱奇艺影业", "828": " 爱奇艺影业", "829": " 优酷", "830": " 基美影业", "831": " 基美影业", "832": " 魔威映画", "833": " 亚洲星光娱乐", "834": " 周冬雨工作室", "835": "守望先锋0", "836": "守望先锋1", "837": "守望先锋2", "838": "守望先锋3", "839": "守望先锋4", "840": "守望先锋5", "841": "守望先锋6", "842": "守望先锋7", "843": "守望先锋8", "844": "守望先锋9", "845": "守望先锋10", "846": "守望先锋11", "859": " 记忆大师", "860": "冒险岛20", "861": "冒险岛21", "862": "冒险岛22", "863": "冒险岛23", "864": "冒险岛24", "865": "冒险岛25", "866": "冒险岛26", "867": "冒险岛27", "868": "冒险岛28", "869": "冒险岛29", "870": "冒险岛210", "871": "冒险岛211", "872": " 天龙八部", "873": " 天龙八部", "874": " 变形金刚ol", "875": " 变形金刚ol", "876": " 一品芝麻狐", "877": " 一品芝麻狐", "878": " 一品芝麻狐", "879": " 一品芝麻狐", "880": " 一品芝麻狐", "881": " 一品芝麻狐", "882": " 白敬亭", "883": " 剑灵", "886": " 最强nba", "887": " 最强nba", "2371": "柳岩1", "2481": "赵丽颖1" }
        const LOCAL_STORAGE_PREFIX = '$CSDNCleaner_'
        /**
         * 设置按钮 SVG 图标
         */
        const SETTING_SVG_ICON = '<svg class="icon" style="width: 27px;height: 27px;vertical-align: middle;fill: #999aaa;overflow: hidden;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2365"><path d="M548.867967 1023.560304l-73.930219 0c-37.624653 0-68.23974-30.58441-68.23974-68.168161l0-44.240538c0-6.667013-6.973777-16.161371-13.3238-18.129776l-2.597272-0.930519-65.095405-26.90835c-1.80991-0.976533-4.550339-1.544047-7.525953-1.544047-6.396038 0-11.764415 2.449002-14.044697 4.729284l-31.545605 31.525154c-12.83809 12.843203-29.95043 19.914122-48.182461 19.914122-18.232031 0-35.349484-7.070919-48.202912-19.914122l-52.364682-52.339118c-26.443091-26.662939-26.437978-69.870704-0.076691-96.416049l31.560943-31.530267c4.678157-4.647481 6.339797-16.125582 3.221026-21.984782l-1.303749-2.76088-26.519782-64.579018c-1.958179-6.329572-11.426974-13.303349-18.093987-13.313575l-44.307004 0c-37.609315 0-68.209063-30.609974-68.209063-68.244852L0.086917 474.799704c0-37.604202 30.599748-68.193725 68.209063-68.193725l44.383695 0.046015c6.631224 0 16.120469-6.989115 18.099099-13.349364l0.945857-2.61261 26.846997-64.870444c3.103433-5.762058 1.400891-17.183919-3.236364-21.810948l-31.468914-31.53538c-26.560684-26.545346-26.565797-69.809351 0.015338-96.426275l52.272653-52.277766c12.878992-12.853428 29.991332-19.919235 48.228476-19.919235 18.232031 0 35.349484 7.076032 48.192686 19.919235l31.530267 31.422899c2.372311 2.377424 7.776477 4.846877 14.21853 4.846877 3.011404 0 5.80296-0.572627 7.66911-1.569611l2.878473-1.354876 64.538116-26.417527c6.334685-1.958179 13.298237-11.442312 13.298237-18.11955l0-44.368357c0-37.61954 30.615087-68.224401 68.23974-68.224401l73.930219 0c37.583751 0 68.14771 30.604861 68.14771 68.224401l0 44.368357c0 6.6619 6.999341 16.151145 13.374928 18.124663l2.633061 0.956082 64.660822 26.800983c1.876376 1.00721 4.68327 1.579837 7.699786 1.579837 6.498292 0 11.907571-2.474566 14.192966-4.770186l31.514929-31.504703c12.909668-12.853428 30.032234-19.914122 48.254039-19.914122 18.242256 0 35.369935 7.065807 48.208025 19.909009l52.32378 52.272653c12.884105 12.863654 19.970362 29.996445 19.970362 48.254039 0 18.247369-7.070919 35.395498-19.955024 48.259152l-31.499591 31.448463c-4.586128 4.601466-6.283557 16.08468-3.19035 21.867189l1.365102 2.878473 26.391963 64.466538c1.999081 6.390925 11.493439 13.405604 18.155339 13.405604l44.383695 0c37.568413 0 68.137485 30.589523 68.137485 68.193725l0 73.991572c0 37.609315-30.569072 68.209063-68.137485 68.209063l-44.383695 0c-6.6619 0-16.171596 6.999341-18.155339 13.390266l-0.930519 2.541032-26.806095 64.722175c-3.108546 5.843862-1.446905 17.337301 3.185237 21.969443l31.468914 31.438238c12.868766 12.83809 19.970362 29.955543 19.970362 48.213137 0.015338 18.242256-7.070919 35.400611-19.955024 48.279603l-52.32378 52.32378c-12.853428 12.858541-29.975994 19.914122-48.223363 19.924347-18.221805 0-35.344371-7.055581-48.213137-19.878333l-31.422899-31.612071c-2.208704-2.198478-7.653772-4.678157-14.131613-4.678157-3.021629 0-5.813185 0.562401-7.653772 1.574724l-3.006291 1.411116-64.502327 26.376625c-6.390925 1.999081-13.405604 11.493439-13.405604 18.145114l0 44.240538C617.015678 992.975894 586.451719 1023.560304 548.867967 1023.560304zM413.375247 833.867428c31.898384 10.675401 55.764654 43.601446 55.764654 77.284176l0 44.240538c0 3.093208 2.653512 5.721156 5.792734 5.721156l73.930219 0c3.031855 0 5.700705-2.66885 5.700705-5.721156l0-44.240538c0-33.636716 23.876495-66.567874 55.785105-77.284176l59.542969-24.454235c10.619161-5.378602 22.910188-8.216173 35.686925-8.216173 22.378463 0 43.632122 8.369555 58.300573 22.991991l31.422899 31.606958c2.561483 2.515468 5.399053 2.658625 8.129256-0.076691l52.308442-52.308442c1.385553-1.385553 1.676979-2.990953 1.66164-4.100417 0-1.099239-0.281201-2.684188-1.646302-4.039065l-31.484252-31.468914c-23.815142-23.799804-30.078249-63.883685-14.939426-93.977272l24.50025-59.573645c10.736754-31.847257 43.662799-55.693076 77.279064-55.693076l44.383695 0c3.036968 0 5.69048-2.699527 5.69048-5.762058L961.184877 474.799704c0-3.062531-2.658625-5.751832-5.69048-5.751832l-44.383695 0c-33.631603 0-66.562761-23.861157-77.279064-55.754429l-24.50025-59.548082c-15.108146-29.996445-8.875716-70.034311 14.862735-93.88013l31.560943-31.499591c1.354876-1.365102 1.646302-2.975615 1.646302-4.085079 0-1.099239-0.281201-2.699527-1.646302-4.064628l-52.32378-52.277766c-2.730203-2.730203-5.475744-2.689301-8.231511 0.030676l-31.422899 31.422899c-14.607098 14.663338-35.906772 23.099359-58.397715 23.099359-12.710271 0-24.975734-2.812007-35.58467-8.144595l-59.445827-24.495137c-31.90861-10.685626-55.785105-43.611671-55.785105-77.273951l0-44.368357c0-3.026742-2.714865-5.772283-5.700705-5.772283l-73.930219 0c-3.088095 0-5.792734 2.694414-5.792734 5.772283l0 44.368357c0 33.698069-23.861157 66.624114-55.754429 77.284176l-59.512293 24.484911c-10.59871 5.3377-22.843722 8.144595-35.553993 8.144595-22.444928 0-43.719039-8.430908-58.377264-23.145374l-31.484252-31.38711c-2.791556-2.765992-5.450181-2.730203-8.159933-0.015338L168.055761 220.19037c-2.203591 2.203591-2.218929 5.941004-0.005113 8.144595l31.422899 31.499591c23.845819 23.75379 30.15494 63.827445 14.954764 93.926145L189.933175 413.334345c-10.695852 31.903497-43.621897 55.764654-77.284176 55.764654l-44.383695-0.046015c-3.093208 0-5.731381 2.633061-5.731381 5.751832l0 73.925106c0 3.082982 2.689301 5.797847 5.756945 5.797847l44.353019 0c33.677618 0.046015 66.54231 23.907172 77.202373 55.754429l24.582053 59.542969c15.154161 30.165165 8.819476 70.284836-15.051906 94.023287l-31.422899 31.412674c-2.116674 2.132013-2.101336 6.022808 0.107368 8.241737l52.247089 52.236864c2.663737 2.66885 5.399053 2.699527 8.103693 0l31.530267-31.514929c14.612211-14.622436 35.835194-23.022668 58.203431-23.022668 12.751173 0 25.026862 2.842683 35.630684 8.216173L413.375247 833.867428zM511.969324 727.752511c-119.142178 0-216.074614-96.906872-216.074614-216.033712 0-119.121727 96.927323-216.028599 216.074614-216.028599 119.116614 0 216.043938 96.906872 216.043938 216.028599C728.013261 630.845639 631.085938 727.752511 511.969324 727.752511zM511.969324 358.142318c-84.707875 0-153.622496 68.889058-153.622496 153.576481 0 84.682311 68.914621 153.581594 153.622496 153.581594 84.687424 0 153.59182-68.899283 153.59182-153.581594C665.561143 427.031375 596.66186 358.142318 511.969324 358.142318z" p-id="2366"></path></svg>'
        const Toolkit = {
            delay(timeout) {
                return new Promise(resolve => setTimeout(resolve, timeout))
            },
            // 通过 LocalStorage / GM_getValue 赋值
            setValue(key, value) {
                localStorage.setItem(LOCAL_STORAGE_PREFIX + key, value)
                GM_setValue(LOCAL_STORAGE_PREFIX + key, value)
            },
            getValue(key, defaultValue = null) {
                return localStorage.getItem(LOCAL_STORAGE_PREFIX + key) || GM_getValue(LOCAL_STORAGE_PREFIX + key, defaultValue)
            },
            showDom(selector, isShow) {
                const domList = document.querySelectorAll(selector)
                if (!domList || !domList.length) return
                const method = isShow ? 'remove' : 'add'
                for (const d of domList) {
                    d.classList[method]('d-none')
                }
            }
        }
        const BackgroundImageRange = {
            idOrUrl: null, // 当前 image ID / 自定义 url, 用于标记当前显示的图片
            get currentUrl() {
                const result = { url: null, name: null, category: null, html: null }
                if (!this.idOrUrl) return result
                // window.$CSDNCleaner.BackgroundImageRange.range.bgColor
                //     ? `<span>${window.$CSDNCleaner.BackgroundImageRange.range.bgColor}</span>`
                //     : `<a class="link" target="_blank" href="${url}">${category ? '<' + category + '> ' : ''}${name}</a>`
                if (typeof this.idOrUrl === 'string') {
                    result.url = this.idOrUrl
                    result.name = '自定义图片'
                    result.html = `<span>自定义图片</span>`
                } else if (this.range.bgColor) {
                    result.name = this.range.bgColor
                    result.html = `<span>${this.range.bgColor}</span>`
                } else {
                    result.url = this.toBaiduUrl({ id: this.idOrUrl, cssWrap: false })
                    for (const categoryName in IMG_CATEGORYS) {
                        if (IMG_CATEGORYS[categoryName].includes(this.idOrUrl)) {
                            result.category = categoryName
                        }
                    }
                    // result.category
                    result.name = IMG_MAP[this.idOrUrl.toString()]
                    result.html = `<a class="link" target="_blank" href="${result.url}">${result.category ? '<' + result.category + '> ' : ''}${result.name}</a>`
                }
                return result
            },
            STATE_SELECTED_CATEGORY: 'STATE_SELECTED_CATEGORY',
            range: {
                categorys: [],              // 类目集合
                imgs: [],                   // 图片集合
                customUrl: '',              // 自定义链接
                bgColor: '',                // 纯色背景
                defaultHideMenu: false,     // 默认是否隐藏设置按钮
                hideRecommendBox: false,    // 默认是否隐藏底部推荐文章
                hideCopyright: false,       // 默认是否隐藏底部版权信息
                showCatalogue: false,       // 默认是否显示目录栏
                showSourceLink: true,       // 是否匹配原文链接
                articleWeightRate: '',      // 文章宽度百分比
            },
            init() {
                const range = Toolkit.getValue('background_ranges')
                if (range) {
                    try {
                        const _range = JSON.parse(range)
                        if (!_range || typeof _range !== 'object') throw new Error('range data error')
                        Object.assign(this.range, _range)
                    } catch (err) {
                        console.error(err)
                    }
                }
            },
            toCategoryHTML() {
                let html = ''
                for (const categoryName in IMG_CATEGORYS) {
                    html += `<div class="category ${this.range.categorys.includes(categoryName) ? this.STATE_SELECTED_CATEGORY : ''}" data-key="${categoryName}">${categoryName}</div>\n`
                }
                return html
            },
            save() {
                console.warn(`%c[${window.$CSDNCleaner.NAME}] 保存配置: `, 'color: teal', this)
                for (const optName in window.$CSDNCleaner.BackgroundImageRange.range) {
                    const syncMethodName = 'sync' + optName[0].toUpperCase() + optName.substr(1)
                    if (typeof window.$CSDNCleaner.BackgroundImageRange[syncMethodName] === 'function') window.$CSDNCleaner.BackgroundImageRange[syncMethodName]()
                }
                Toolkit.setValue('background_ranges', JSON.stringify(window.$CSDNCleaner.BackgroundImageRange.range))
            },
            getImgUrl() {
                const customUrl = this.range.customUrl
                let url = null
                let id = null
                if (customUrl) {
                    url = `url(${customUrl})`
                    this.idOrUrl = customUrl
                } else if (this.range.categorys && this.range.categorys.length) {
                    const idList = this._getAllImgIdsByCategorys()
                    const index = this.getRandomInterger(idList.length)
                    id = idList[index.toString()]
                    url = this.toBaiduUrl({ id })
                    this.idOrUrl = id || this.toBaiduUrl({ id, cssWrap: false })
                } else {
                    const allImgs = Object.keys(IMG_MAP).map(img => Number(img))
                    const index = this.getRandomInterger(allImgs.length)
                    id = allImgs[index.toString()]
                    url = this.toBaiduUrl({ id })
                    this.idOrUrl = id || this.toBaiduUrl({ id, cssWrap: false })
                }
                return url
            },
            toBaiduUrl({ id, cssWrap = true }) {
                const url = `https://ss2.bdstatic.com/lfoZeXSm1A5BphGlnYG/skin/${id}.jpg`
                return cssWrap ? `url(${url})` : url
            },
            _getAllImgIdsByCategorys() {
                const idList = []
                for (const categoryName in this.range.categorys) {
                    if (Array.isArray(IMG_CATEGORYS[this.range.categorys[categoryName]])) idList.push(...IMG_CATEGORYS[this.range.categorys[categoryName]])
                }
                return idList
            },
            getRandomInterger(size) {
                return Math.ceil(Math.random() * size) - 1
            },
            syncDefaultHideMenu() {
                const menu = document.querySelector('[data-type="$setting"]')
                if (!menu || !menu.classList) return
                const method = window.$CSDNCleaner.BackgroundImageRange.range.defaultHideMenu ? 'add' : 'remove'
                menu.classList[method]('defaultHideMenu')
            },
            getSourceLinkDisplay() {
                return this.range.showSourceLink ? 'inline-flex' : 'none'
            },
            getArticleWeight() {
                const weight = Number(this.range.articleWeightRate)
                return (weight || 100) + '%'
            },
            setBgColor(color) {
                this.range.bgColor = color || ''
                this.save()
                document.body.style.setProperty('--background-color', color || '#EAEAEA')
                this.updateBgImage(null, !!color)
            },
            get recommendBoxDisplayAttributes() { return ['--display-recommend-box', this.range.hideRecommendBox ? 'none' : 'block'] },
            syncHideRecommendBox() {
                document.body.style.setProperty(...this.recommendBoxDisplayAttributes)
            },
            get copyrightDisplayAttributes() { return ['--display-copyright', this.range.hideCopyright ? 'none' : 'block'] },
            syncHideCopyright() {
                document.body.style.setProperty(...this.copyrightDisplayAttributes)
            },
            get catalogueDisplayAttributes() { return ['--display-catalogue', this.range.showCatalogue ? 'block' : 'none'] },
            syncShowCatalogue() {
                document.body.style.setProperty(...this.catalogueDisplayAttributes)
                if (this.range.showCatalogue && document.getElementById('groupfile')) {
                    document.body.setAttribute('show-catalogue', '')
                    if (window.$csdn && window.$csdn.fixedSidebar) {
                        window.$csdn.fixedSidebar({
                            targetBox: $(".blog_container_aside"),
                            mainBox: $("main"),
                            sidebar: $(".blog_container_aside"),
                            direction: "left",
                            position: "fixed",
                            bottom: 0,
                            zIndex: 99,
                            sidebarRightMargin: 8,
                            sidebarLeftMargin: 8
                        })
                    }
                } else {
                    document.body.removeAttribute('show-catalogue')
                }
            },
            setArticleWeight(weight) {
                this.range.articleWeightRate = Number(weight) || 100
                this.save()
                document.body.style.setProperty('--article-weight', this.range.articleWeightRate + '%')
            },
            updateBgImage(url, disabled) {
                let imgUrl = url || window.$CSDNCleaner.BackgroundImageRange.getImgUrl()
                if (imgUrl.indexOf('url(') === -1) imgUrl = `url(${imgUrl})`
                document.body.style.setProperty('--background-image', disabled ? 'none' : imgUrl)
                const labelEl = document.getElementById('setting-background-label')
                labelEl.innerHTML = this.currentUrl.html
            }
        }
        window.$CSDNCleaner = {
            NAME: 'CSDN 去广告沉浸阅读模式',
            BackgroundImageRange,
            options: [],
            launch() {
                console.log(`%c[${window.$CSDNCleaner.NAME}] 感谢支持, 欢迎反馈: https://greasyfork.org/zh-CN/scripts/373457/feedback`, 'color: teal')
                window.addEventListener('DOMContentLoaded', window.$CSDNCleaner.onLoad)
                return this
            },
            init() {
                BackgroundImageRange.init() // 从本地存储中获取配置
                window.$CSDNCleaner
                    .initSettings() // 初始化按钮组
                    .appendSheets() // 添加样式
                    .cleanCopy() // 解禁复制功能
                    .removeSkinCss() // 移除黑色背景色的皮肤样式 css 文件
                    .launch() // DOM 初始化
                    .disabledDarkSkin() // 禁用 dark skin
                    .interceptCSDN() // 拦截 csdn 对象的赋值操作
            },
            removeSkinCss() {
                const linkElements = document.getElementsByTagName('link')
                if (linkElements && linkElements.length) {
                    for (let linkIndex = linkElements.length; linkIndex--;) {
                        const link = linkElements[linkIndex]
                        if (link.href && link.href.indexOf('/themesSkin/') !== -1) {
                            link.remove()
                        }
                    }
                }
                return this
            },
            /**
             * 拦截源码中对于 `window.csdn` 的赋值操作
             * @description 由于 `TamperMonkey` 中获取的 `window` 对象并不是真正的 `window` 对象, 所以不能直接 `Object.defineProperty(window, 'scdn')`
             * @description 所以用 `<script>` 注入的方式执行绑定拦截器的代码
             */
            interceptCSDN() {
                const script = document.createElement('script')
                script.innerText = `window.$csdn=window.csdn||{$intercept: true};$handleInterceptCSDN=0;Object.defineProperty(window, 'csdn', { set(val) { typeof window.$handleInterceptCSDN === 'function' ? window.$handleInterceptCSDN(val) : window.$csdn = val; }, get() { return window.$csdn } });`
                document.querySelector('head').appendChild(script)
                $handleInterceptCSDN = val => {
                    $csdn = val // 使用直接赋值的方式, 防止因某些属性无法遍历导致未赋值的情况
                    $csdn.$intercept = true // 标记为已启用拦截
                    $csdn.middleJump = null // 移除跳转链接时的事件绑定函数
                }
            },
            /** 生成 sheets */
            _getSheets() {
                // 若设置了背景色, 则使用纯色, 否则使用自定义图片或随机图片背景
                const bgColor = window.$CSDNCleaner.BackgroundImageRange.range.bgColor
                const imgUrl = window.$CSDNCleaner.BackgroundImageRange.getImgUrl()
                const catalogSheets = `
                    opacity: 0.75;
                    z-index: 233;
                    border-radius: 10px;
                    overflow: hidden;
                    transition: 0.2s opacity ease-in-out;
                `
                const catalogHoverSheets = `
                    opacity: 0.825;
                `
                const catalogTitleSheets = `
                    margin-bottom: 0;
                    background-image: none;
                    background-color: #FFF;
                    border-bottom: 1px solid #EAEAEA;
                    color: #222;
                `
                const rightCatalogueSheets = `
                    body[show-catalogue] aside.recommend-right_aside > #recommend-right > div:not(#groupfile) {
                        display: none !important;
                    }
                    body[show-catalogue] aside.recommend-right_aside > #recommend-right > #groupfile {
                        ${catalogSheets}
                        margin-top: 20px;
                    }
                    body[show-catalogue] aside.recommend-right_aside > #recommend-right > #groupfile > .groupfile-div {
                        max-height: 90vh;
                    }
                    body[show-catalogue] aside.recommend-right_aside > #recommend-right > #groupfile:hover {
                        ${catalogHoverSheets}
                    }
                    body[show-catalogue] aside.recommend-right_aside > #recommend-right > #groupfile > .groupfile-div > h3  {
                        ${catalogTitleSheets}
                    }
                    body[show-catalogue] aside.recommend-right_aside > #recommend-right > #groupfile ol > li {}
                `
                const leftCatalogueSheets = `
                    /* 除目录外的其他 card */
                    body[show-catalogue] #mainBox aside.blog_container_aside > div:not(#asidedirectory) {
                        display: none !important;
                        height: 0;
                        z-index: -32;
                        opacity: 0;
                        margin: 0;
                        visibility: hidden;
                    }
                    body[show-catalogue] #mainBox aside.blog_container_aside > div#asidedirectory {
                        ${catalogSheets}
                    }
                    body[show-catalogue] #mainBox aside.blog_container_aside > div#asidedirectory > .groupfile-div {
                        max-height: 90vh;
                    }
                    body[show-catalogue] #mainBox aside.blog_container_aside > div#asidedirectory:hover {
                        ${catalogHoverSheets}
                    }
                    body[show-catalogue] #mainBox aside.blog_container_aside > div#asidedirectory > #directory > h3 {
                        ${catalogTitleSheets}
                    }
                    body[show-catalogue] #mainBox aside.blog_container_aside > div#asidedirectory > #directory ol > li {}
                `
                const sheets = `
                    body {
                        --comments-avatar-size: 50px;
                        --source-link-wrapper-display: ${window.$CSDNCleaner.BackgroundImageRange.getSourceLinkDisplay()};
                        --background-color: ${bgColor || '#EAEAEA'};
                        --background-image: ${bgColor ? 'none' : imgUrl};
                        --article-weight: ${window.$CSDNCleaner.BackgroundImageRange.getArticleWeight()};
                        ${window.$CSDNCleaner.BackgroundImageRange.recommendBoxDisplayAttributes.join(': ')};
                        ${window.$CSDNCleaner.BackgroundImageRange.copyrightDisplayAttributes.join(': ')};
                        ${window.$CSDNCleaner.BackgroundImageRange.catalogueDisplayAttributes.join(': ')};
                    }
                    /* 修复文章内容部分显示多余的 margin-right 的问题 */
                    @media screen and (min-width: 1550px) {
                        body:not([show-catalogue]) #mainBox {
                            margin-right: 0;
                        }
                    }
                    /* 修复与 dark reader 一起使用时背景图片被遮挡的问题 */
                    html[data-darkreader-scheme] body {
                        height: auto;
                    }
                    body:not(.clean-mode) { background-color: var(--background-color) !important; background-image: var(--background-image) !important; background-attachment: fixed !important;background-size: cover; background-repeat: no-repeat; }
                    body>#page>#content, body>.container.container-box,main,body>.main.clearfix { opacity: 0.9; }
                    main {margin: 20px;}
                    #local { position: fixed; left: -99999px }
                    .recommend-item-box .content,.post_feed_box,.topic_r,#bbs_title_bar,#bbs_detail_wrap,#left-box {width: 100% !important;}
                    button.btn-code-notes, .recommend-column-box, #toolbarBox, .csdn-side-toolbar > div, .btn-side-chatdoc-contentbox, #remuneration, .recommend-ask-box, .write-guide-buttom-box, .tool-active-list, .sidetool-writeguide-box, .passport-auto-tip-login-container, .passport-login-tip-container, .hide-preCode-box,.passport-login-container,.csdn-common-logo-advert,#recommendNps,.reward-box-new,.csdn-redpack-lottery-btn-box,#csdn-shop-window-top,#csdn-shop-window,.csdn-redpack-time, #csdn-redpack, .recommend-item-box.type_other, .triplet-prompt, .column-advert-box, .comment-sofa-flag, #article_content .more-toolbox, .blog-content-box a[data-report-query],main .template-box, .blog-content-box>.postTime,.post_body div[data-pid],#unlogin-tip-box,.t0.clearfix,.recommend-item-box.recommend-recommend-box,.csdn-side-toolbar>a[data-type]:not([data-type=gotop]):not([data-type="$setting"]),a[href^="https://edu.csdn.net/topic"],.adsbygoogle,.mediav_ad,.bbs_feed_ad_box,.bbs_title_h,.title_bar_fixed,#adContent,.crumbs,#page>#content>#nav,#local,#reportContent,.comment-list-container>.opt-box.text-center,.type_hot_word,.blog-expert-recommend-box,.login-mark,#passportbox,.recommend-download-box,.recommend-ad-box,#dmp_ad_58,.blog_star_enter,#header,.blog-sidebar,#new_post.login,.mod_fun_wrap,.hide_topic_box,.bbs_bread_wrap,.news-nav,#rightList.right-box,aside,aside .aside-box.kind_person,#kp_box_476,.tool-box,.pulllog-box,.adblock,.fourth_column,.hide-article-box,#csdn-toolbar
                        {display: none !important;}
                    main div.blog-content-box pre.set-code-hide,.hide-main-content,#blog_content,#bbs_detail_wrap,.article_content {height: auto !important; max-height: inherit !important;}
                    .comment-list-box,#bbs_detail_wrap {max-height: none !important;}
                    #main {width: 100% !important;}
                    #page {width: 80vw !important;}
                    #bbs_title_bar {margin-top: 20px;}
                    #page>#content {margin-top: 0 !important;}
                    #content_views, #content_views * { user-select: auto !important; }

                    body > .container-box .container_main.clearfix { width: 100% !important; }
                    .csdn_main_container > .container_main > #left-box { width: 100% !important; }
                    #bbs_detail_wrap > .paginate_box { width: 100% !important; }
                    .mod_topic_wrap { width: 100% !important; }
                    .container_main > .mod_topic_wrap > .post_feed_box { width: 100% !important; }
                    .bbs-common-footer { width: 100% !important; }
                    .csdn_main_container > #navs { display: none; }

                    /* 重置一键复制按钮位置 | 2025-03-27 09:02:27 */
                    main div.blog-content-box pre .hljs-button.add_def[data-title] {
                        right: 8px !important;
                    }

                    /* 文中代码块解除选择禁用 | 2021-09-06 16:32:55 */
                    pre, pre code, #article_content pre.prettyprint, #article_content pre.prettyprint code {
                        user-select: auto !important;
                    }

                    /* 文章正文底部作者信息 footer fixed 定位改回 relative; 屏蔽打赏 box */
                    .more-toolbox-new > .left-toolbox {
                        position: relative !important;
                        left: 0 !important;
                    }
                    /* 推荐文章 hover 不改变标题颜色 */
                    .recommend-box .recommend-item-box .title-box .tit:hover {
                        color: inherit !important;
                    }
                    /* 图片预览底色 */
                    .imgViewDom.disnone { background-color: rgba(0, 0, 0, 0.5); }
                    /* 控制目录是否显示 */
                    /* .recommend-right,aside.recommend-right_aside { display: var(${window.$CSDNCleaner.BackgroundImageRange.catalogueDisplayAttributes[0]}) !important; } */
                    body[show-catalogue] .recommend-right .flex-column.aside-box {}
                    /* 在宽屏下显示在文章右侧 */
                    @media screen and (min-width: 1550px) {
                        body[show-catalogue] .nodata.recommend-right, aside.recommend-right_aside {
                            display: var(${window.$CSDNCleaner.BackgroundImageRange.catalogueDisplayAttributes[0]}) !important;
                        }
                        ${rightCatalogueSheets}
                        body[show-catalogue] #mainBox aside.blog_container_aside {
                            display: none !important;
                        }
                    }
                    /* 在小屏下显示在文章左侧 */
                    @media screen and (min-width: 1380px) and (max-width: 1550px) {
                        body[show-catalogue] #mainBox aside.blog_container_aside { display: var(${window.$CSDNCleaner.BackgroundImageRange.catalogueDisplayAttributes[0]}) !important; }
                    }
                    /* 在小屏下显示在文章左侧 */
                    @media screen and (max-width: 1380px) {
                        body[show-catalogue] #mainBox aside.blog_container_aside {
                            display: var(${window.$CSDNCleaner.BackgroundImageRange.catalogueDisplayAttributes[0]}) !important;
                        }
                        body[show-catalogue] .main_father > .container#mainBox > main {
                            float: right !important;
                        }
                    }
                    @media screen and (max-width: 1549px) and (min-width: 1380px) {
                        body[show-catalogue] .main_father > .container#mainBox > main {
                            float: right !important;
                        }
                    }
                    @media screen and (min-width: 0px) and (max-width: 1550px) {
                        /* aside */
                        body[show-catalogue] #mainBox aside.blog_container_aside {
                            position: fixed !important;
                            top: 28px !important;
                        }
                        ${leftCatalogueSheets}
                    }
                    body:not([show-catalogue]) .main_father > #mainBox > aside { display: none !important; }
                    body:not([show-catalogue]) .recommend-right { display: none !important; }

                    /* 复制按钮增加 !important, 修复在某些页面下样式被覆盖的问题 | 2021-01-23 13:12:57 */
                    /* 重写登录后复制按钮样式 | 2021-01-01 10:45:03 */
                    .hljs-button.signin[data-title="登录后复制"] { font-size: 0 !important; }
                    .hljs-button.signin[data-title="登录后复制"]:before { content: "一键复制"; font-size: 14px; vertical-align: middle; }
                    .hljs-button.signin[data-title="登录复制"] { font-size: 0 !important; }
                    .hljs-button.signin[data-title="登录复制"]:before { content: "一键复制"; font-size: 14px; vertical-align: middle; }
                    /* 增加隐藏底部推荐文章和版权信息功能 | 2020-11-11 21:03:10 */
                    .recommend-box { display: var(${window.$CSDNCleaner.BackgroundImageRange.recommendBoxDisplayAttributes[0]}) !important; }
                    .blog-footer-bottom { display: var(${window.$CSDNCleaner.BackgroundImageRange.copyrightDisplayAttributes[0]}) !important; }
                    /* 增加 round-slider 组件 | 2020-08-20 20:29:05 */
                    .round-slider-wrapper { margin: 15px auto !important; }
                    .round-slider-wrapper .rs-handle { background-color: transparent; border: 8px solid transparent; border-right-color: black; margin: -6px 0px 0px 14px !important; border-width: 6px 104px 6px 4px; }
                    .round-slider-wrapper .rs-handle:before { display: block; content: " "; position: absolute; height: 22px; width: 22px; background: black; right: -11px; bottom: -11px; border-radius: 100px; }
                    .round-slider-wrapper .rs-tooltip { top: 75% !important; font-size: 11px; }
                    .round-slider-wrapper .rs-full.rs-tooltip { top: 75% !important; }
                    .round-slider-wrapper .rs-tooltip > div { text-align: center; background: orange; color: white; border-radius: 4px; padding: 1px 5px 2px; margin-top: 4px; }
                    .round-slider-wrapper .rs-range-color { background-color: #DB5959; }
                    .round-slider-wrapper .rs-path-color { background-color: #F0C5C5; }
                    .color-picker-container { margin-left: 50%; transform: translateX(-50%); }
                    /* 评论区每行增加 hover 效果 | 2020-05-17 18:32:22 */
                    .comment-box { background-color: rgba(255,255,255,0.9) !important; }
                    .comment-list-box { padding: 0 !important; }
                    .comment-list-box > .comment-list { padding: 0 24px; margin-top: 0 !important; padding-top: 16px; }
                    .comment-list-box .comment-list { transition: all .2s ease-in-out; }
                    .comment-list-box > .comment-list:hover { background-color: rgba(255,255,255,0.7); }
                    .comment-list-box .comment-line-box:hover img.avatar { border-color: rgb(255, 198, 198, 0.95); }
                    /* 屏蔽固定在页面底部的 toolbox | 2020-05-17 18:28:03 */
                    .more-toolbox > .left-toolbox { position: relative !important; left: 0 !important; }
                    /* 底部作者信息右侧按钮只显示关注 | 2020-05-17 18:26:52 */
                    .right-message > a:not(.personal-watch) { display: none; }
                    /* 评论区输入框交叉轴对齐 | 2020-05-17 18:25:54 */
                    .comment-edit-box { display: flex; align-items: center; }
                    /* 原文链接样式 | 2020-05-17 17:41:11 */
                    .source-link-wrapper { display: var(--source-link-wrapper-display); align-items: center; vertical-align: top; }
                    .source-link-wrapper > .source-link-icon { margin-right: 5px; }
                    .source-link-wrapper > .source-link-label { }
                    .source-link-wrapper > .source-link-link {
                        overflow: hidden;
                        text-overflow:ellipsis;
                        white-space: nowrap;
                        width: 20vw;
                        max-width: 30vw;
                        min-width: 15vw;
                    }
                    .source-link-wrapper > .source-link-link:hover { color: #008eff !important; }
                    /* 防止网页主体内容被黑白处理, 适用于特殊日期; CSDN 真是太蠢了,只有 CSDN 把文章内容中的图片都显示成黑白的了, 严重影响阅读! | 2020-04-04 13:17:48 */
                    /* 经测试, firefox 下会导致子元素的 fixed 定位失效, 故将其改为 none */
                    html { filter: none !important; }
                    /* 评论区评论内容强制换行以保持一致性 | 2020-02-19 08:58:33 */
                    .comment-box .comment-list-container .comment-list .new-comment { display: block !important; }
                    /* 覆盖所有 media query 样式以防止原有的自适应样式导致布局错乱 | 2020-02-19 08:28:52 */
                    @media screen and (max-width: 1320px) {
                        .main_father > .container#mainBox > main, body:not([show-catalogue]) > .container-box.csdn_main_container {  float: none; margin: 0 auto !important; margin-top: 20px !important; }
                        body:not([show-catalogue]) > .container-box.csdn_main_container { width: var(--article-weight) !important; }
                        body > .container-box.csdn_main_container { width: calc(var(--article-weight) - 30%) !important; }
                    }
                    @media screen and (max-width: 1379px) and (min-width: 1320px) {
                        .main_father > .container#mainBox > main, body:not([show-catalogue]) > .container-box.csdn_main_container {  float: none; margin: 0 auto !important; margin-top: 20px !important; }
                        body:not([show-catalogue]) > .container-box.csdn_main_container { width: var(--article-weight) !important; }
                        body > .container-box.csdn_main_container { width: calc(var(--article-weight) - 30%) !important; }
                    }
                    @media screen and (max-width: 1699px) and (min-width: 1550px) {
                        .main_father > .container#mainBox > main, body:not([show-catalogue]) > .container-box.csdn_main_container { width: var(--article-weight) !important; float: none; margin: 0 auto !important; margin-top: 20px !important; }
                        /* body:not([show-catalogue]) > .container-box.csdn_main_container { width: var(--article-weight) !important; } */
                        body > .container-box.csdn_main_container { width: calc(var(--article-weight) - 30%) !important; }
                    }
                    @media screen and (max-width: 1549px) and (min-width: 1380px) {
                        .main_father > .container#mainBox > main, body:not([show-catalogue]) > .container-box.csdn_main_container {  float: none; margin: 0 auto !important; margin-top: 20px !important; }
                        body:not([show-catalogue]) > .container-box.csdn_main_container { width: var(--article-weight) !important; }
                        body > .container-box.csdn_main_container { width: calc(var(--article-weight) - 30%) !important; }
                    }
                    @media screen and (min-width: 1700px) {
                        .main_father > .container#mainBox > main, body:not([show-catalogue]) > .container-box.csdn_main_container { width: var(--article-weight) !important; float: none; margin: 0 auto !important; margin-top: 20px !important; }
                        /* body:not([show-catalogue]) > .container-box.csdn_main_container { width: var(--article-weight) !important; } */
                        body > .container-box.csdn_main_container { width: calc(var(--article-weight) - 30%) !important; }
                    }
                    /* 评论区样式重写 | 2019-12-27 21:32:24 */
                    .comment-list-container img.avatar {
                        width: var(--comments-avatar-size) !important;
                        height: var(--comments-avatar-size) !important;
                        margin-top: 4px;
                        margin-right: 15px !important;
                        border: 3px solid rgba(215, 215, 205, 0.7);
                        transition: border-color .2s ease-in-out;
                    }
                    .comment-edit-box img.show_loginbox {
                        width: var(--comments-avatar-size) !important;
                        height: var(--comments-avatar-size) !important;
                    }
                    /* 防止原有的自适应样式导致布局错乱 | 2019-12-27 21:08:09 */
                    @media screen and (min-width: 1700px) {
                        .recommend-right.align-items-stretch { color: teal; display: var(${window.$CSDNCleaner.BackgroundImageRange.catalogueDisplayAttributes[0]}) !important; }
                    }
                    /* 隐藏底部 more-toolbox 按钮组 ~~和底部作者 row 中的其他信息~~; 还是保留这一行吧 ... 以后可能会把更多对文章和作者的操作放到这里面 | 2019-12-17 22:18:16 */
                    /* 修改底部 私信求帮助 按钮样式 | 2019-11-23 17:37:52 */
                    .reward-user-box .reward-fexd { width: 100px !important; }
                    .reward-user-box .reward-word { display: none !important; }
                    .reward-user-box .reward-fexd { border: none !important; background: transparent !important; color: #B4B4B4 !important; font-size: 14px !important; line-height: 21px !important; height: 30px !important }
                    .reward-user-box .reward-fexd > div { color: transparent; }
                    .reward-user-box:hover .reward-fexd > div { color: #B4B4B4; }
                    /* iteye 样式重构 | 2019-11-02 11:19:43 */
                    body>#page>#content, body>#page>#content>#main .blog_comment { width: auto; }
                    body>#page>#content>#main .blog_bottom { height: 30px; }
                    body>#page>#content>#main .blog_comment .comment_content { background-color: rgba(255, 214, 173, 0.2); }
                    body>#page>#content, body>#page>#content>#main { border: none; }
                    body>#page>#content>#main #bottoms, body>#page>#content>#main .blog_nav { display: none; }
                    body>#page>#content>#main .blog_title h3 { font-size: 24px; word-wrap: break-word; margin-bottom: 25px; }
                    body>#page>#content>#main, #bbs_title_bar > .owner_top,.blog-content-box { border-top-left-radius: 8px !important; border-top-right-radius: 8px !important; }
                    body > div#page {background-color: transparent}
                    .dl_no_more:after { content: "上边是原话, 脚本作者原本想屏蔽这段话, 但是 CSDN 从未找到自己的底线;\\A 从阅读更多必须注册, 到验证手机号必须关注公众号, 再到大尺度H广告, 严重影响了用户体验;\\A 自从 CSDN 使用明文密码被脱库之后我就不再使用 CSDN 账号, 为了继续阅读 CSDN 内容我写了这个脚本  "; color: teal; display: block; width: 60%; margin: auto; white-space: pre; }
                    .recommend-box>.recommend-item-box { transition: all .2s ease-in-out; }
                    .recommend-box>.recommend-item-box:hover { background-color: rgba(255,255,255,0.8); }
                    /* 脚本设置弹窗 */
                    a.option-box[data-type="$setting"] > svg {
                        -webkit-transform: rotate(360deg);
                        animation: rotation 2.5s linear 1;
                        -moz-animation: rotation 2.5s linear 1;
                        -webkit-animation: rotation 2.5s linear 1;
                        -o-animation: rotation 2.5s linear 1;
                    }
                    a.option-box[data-type=gotop] + a.option-box[data-type="$setting"] {
                        display: flex;
                    }
                    a.go-top-hide.option-box[data-type=gotop] + a.defaultHideMenu.option-box[data-type="$setting"] {
                        display: none;
                    }
                    #setting-dialog {
                        z-index: 244;
                        display: block;
                        position: fixed;
                        top: 20vh;
                        width: 100%;
                        height: 100%;
                        display: flex;
                        justify-content: center;
                        transform: translateY(0) translateX(0) scale(1) skew(0);
                        transition: 0.65s all ease-in-out;
                    }
                    #setting-dialog button {
                        border: 2px solid #DADADA;
                    }
                    #setting-dialog.display-none {
                        transform: translateY(80vh) translateX(90vw) scale(0) skew(50deg, 10deg) !important;
                        display: flex !important;
                    }
                    #setting-dialog section {
                        opacity: 1;
                        transition: 0.25s opacity ease-in-out;
                    }
                    #setting-dialog section header {
                        max-width: 550px;
                        height: 50px;
                        font-size: 20px;
                        background: none;
                        padding: 0 15px;
                        display: flex;
                        justify-content: space-between;
                        padding: 0 15px;
                        align-items: center;
                        border-bottom: 1px solid #EEE;
                    }
                    #setting-dialog section header .icon-close > img {
                        width: 20px;
                        cursor: pointer;
                    }
                    #setting-dialog section article .row {
                        margin: 0;
                        margin-bottom: 10px;
                    }
                    #setting-dialog section article .row .color-picker-box {
                        margin-bottom: 10px;
                    }
                    #setting-dialog section article .row > label {
                        font-weight: bold;
                    }
                    #setting-dialog section article button { color: #409EFF; background-color: #FAFAFA; padding: 4px; margin: 2.5px; border: 1px solid: #EEE; border-radius: 3px; }
                    #setting-dialog section article button:hover { background-color: #EEE; }
                    #setting-dialog section article button#btn-clear-bg { color: #F56C6C; }
                    #setting-dialog section article button#btn-clear-bgColor { color: #F56C6C; }
                    #setting-dialog section article button#btn-update-bg { color: #E6A23C; }
                    /* #setting-dialog section article button#btn-use-current { color: #909399; } */
                    /* 链接输入框 */
                    #custom-bg-url {
                        width: 100%;
                        margin-right: 10px;
                        height: 25px;
                        border-radius: 3px;
                        border: 2px solid #DDD;
                    }
                    #setting-dialog section article .row#defaultHideMenu-wrap > .content > label {
                        cursor: pointer;
                        margin-right: 15px;
                    }
                    #setting-dialog section article .row#defaultHideMenu-wrap > .content > label >input {
                        vertical-align: middle;
                    }
                    #setting-dialog section article .row > .content {
                        display: flex;
                        width: 500px;
                        flex-wrap: wrap;
                        align-items: center;
                    }
                    #setting-dialog section article .row > .content > div {
                        color: grey;
                        margin-right: 10px;
                        cursor: pointer;
                    }
                    #setting-dialog section article .row > .content > div:hover {
                        color: #000;
                    }
                    #setting-dialog section article .row > .content > div.STATE_SELECTED_CATEGORY {
                        color: #F60;
                        font-size: 20px;
                        letter-spacing: 1px;
                    }
                    #setting-dialog section article {
                        max-width: 550px;
                        padding: 20px;
                        height: calc(100% - 50px);
                        overflow: auto;
                    }
                    #setting-dialog section article::-webkit-scrollbar {/*滚动条整体样式*/
                        width: 6px;     /*高宽分别对应横竖滚动条的尺寸*/
                        height: 6px;
                    }
                    #setting-dialog section article::-webkit-scrollbar-thumb {/*滚动条里面小方块*/
                        border-radius: 10%;
                        -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.3);
                        background: rgba(0,0,0,0.3);
                    }
                    #setting-dialog section article::-webkit-scrollbar-track {/*滚动条里面轨道*/
                        -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.3);
                        border-radius: 0;
                        background: rgba(0,0,0,0.1);
                    }
                    /* 弹窗内部样式 */
                    #setting-dialog section {
                        min-width: 500px;
                        height: 75vh;
                        max-height: 520px;
                        min-height: 370px;
                        /* overflow: auto; */
                        background-color: #FFF;
                        /* border-radius: 5px; */
                        border: 2px solid #EEE;
                    }
                    /* 自定义补充样式 */
                    .display-none {display: none !important;}
                    #setting-dialog .tips-line { color: grey; font-size: 12px }
                    #setting-dialog .link { color: blue; }
                    @-webkit-keyframes rotation{
                        from {-webkit-transform: rotate(0deg);}
                        to {-webkit-transform: rotate(360deg);}
                    }
                `
                return sheets
            },
            // 通过注入 css 实现隐藏广告并固定布局
            appendSheets() {
                const sheet = document.createTextNode(this._getSheets())
                const el = document.createElement('style')
                el.id = 'CSDM-cleaner-sheets'
                el.appendChild(sheet)
                document.getElementsByTagName('head')[0].appendChild(el)
                return this
            },
            injectScriptElement(id, scriptCode) {
                const existsScript = document.getElementById(id)
                if (existsScript) existsScript.remove()
                const head = document.querySelector('head')
                const script = document.createElement('script')
                // script.innerText = scriptCode
                script.id = id
                const code = document.createTextNode(scriptCode)
                script.appendChild(code)
                head.appendChild(script)
            },
            // 复制功能
            cleanCopy() {
                try {
                    window.$CSDNCleaner.injectScriptElement('clean-copy-script', `
                        /** 解禁复制功能 - ${window.$CSDNCleaner.NAME} */
                        try { if (window.hljs) window.hljs.signin = window.hljs.copyCode } catch(err) {};
                        try { if (window.mdcp) window.mdcp.signin = window.mdcp.copyCode } catch(err) {};
                        /** 将 copyright 改为不可写, 防止添加复制事件 */
                        if (window.csdn) {
                            try {
                                Object.defineProperty(window.csdn.copyright, 'init', {
                                    value: function() {
                                        $("#content_views").unbind("copy");
                                    },
                                    writable: false,
                                })
                                Object.defineProperty(window.csdn.copyright, 'textData', {
                                    value: '',
                                    writable: false,
                                })
                            } catch (err) {}
                            $("#content_views").bind('click', function() {
                                $("#content_views").unbind("copy");
                            });
                        }
                    `)
                } catch(err) {
                    console.log('cleanCopy() failed: ', err)
                }
                return this
            },
            onLoad() {
                /** 初始化目录 attribute */
                window.$CSDNCleaner.BackgroundImageRange.syncShowCatalogue()
                // 图片下的底色
                // document.body.setAttribute('style', 'background-color:#EAEAEA !important')
                // 解除跳转拦截
                $ && $("#content_views") && $("#content_views").off('click')
                // 初始化右侧 bottom menu tool bar
                window.$CSDNCleaner._loadSettings()
                window.$CSDNCleaner.cleanCopy() // 解禁复制功能
                window.$CSDNCleaner._launchPagintion() // 解禁并初始化分页组件
                window.$CSDNCleaner.showSourceLink() // 转载的文章显示原文链接
                window.$CSDNCleaner.loadColorPicker() // 加载 color picker
                window.$CSDNCleaner.disabledDarkSkin() // 禁用暗黑系 css 样式
                window.$CSDNCleaner.loadRoundSliderResources() // 加载 color picker
                    .then(() => {
                        window.$CSDNCleaner.initRoundSlider() // 加载 round slider
                    })
            },
            _launchPagintion() {
                // 监听数据层变动并动态控制分页组件显示
                if (!csdn.comments) return
                Object.defineProperty(csdn.comments, 'pageCount', {
                    get() { return this._$pageCount || 1 },
                    set(v) {
                        console.log('set pageCount: ', v)
                        this._$pageCount = v // 先保存页数
                        Toolkit.showDom('#commentPage', v > 1) // 1. 控制分页组件显示
                        window.$CSDNCleaner._initPagintion() // 2. 重构评论区样式
                    }
                })
            },
            _initPagintion() {
                // to bo continue ...
            },
            // 初始化 Options
            initSettings() {
                return this
            },
            async _loadSettings() {
                const settingOption = this._fetchSettingOption()
                for (let times = 20; times--;) {
                    await Toolkit.delay(300)
                    const wrapper = document.querySelector('.csdn-side-toolbar')
                    if (!wrapper) continue
                    wrapper.appendChild(settingOption)
                }
            },
            _fetchSettingOption() {
                const opt = this._getOption({ dataType: '$setting', img: SETTING_SVG_ICON, name: '脚本<br>设置' })
                // const opt = this._getOption({ dataType: '$setting', img: 'https://images.gitbook.cn/FuMNvLb25yJ4RiEg_2OnS8jpI8aB', name: '脚本<br>设置' })
                if (window.$CSDNCleaner.BackgroundImageRange.range.defaultHideMenu) opt.classList.add('defaultHideMenu')
                opt.addEventListener('click', evt => {
                    this.toggleDialog()
                })
                this._fetchSettingDialog()._bindDialogEvents()
                return opt
            },
            _fetchSettingDialog() {
                const settingDialog = document.createElement('div')
                settingDialog.id = 'setting-dialog'
                settingDialog.classList.add('display-none')
                const categorys = BackgroundImageRange.toCategoryHTML()
                const { url, name, category, html } = window.$CSDNCleaner.BackgroundImageRange.currentUrl
                const currentBackgroundHTML = html
                settingDialog.innerHTML = `
                    <section>
                        <header>
                            <div>
                                <span class="title">脚本设置</span>
                                <!-- <span> - </span> -->
                                <!-- <span class="script-name">[${this.NAME}]</span> -->
                            </div>
                            <div class="icon-close">
                                <img src="https://csdnimg.cn//cdn/content-toolbar/guide-close-btn.png">
                            </div>
                        </header>
                        <article>
                            <div class="row">
                                <label>当前背景图: </label>
                                <div class="content" id="setting-background-label">
                                    ${currentBackgroundHTML}
                                </div>
                                <button type="reset" id="btn-update-bg">刷新背景图片</button>
                            </div>
                            <div class="row">
                                <label>背景图片类目范围(点选): </label>
                                <div class="content">
                                    ${categorys}
                                </div>
                            </div>
                            <div class="row">
                                <label>自定义背景图片链接(固定使用此链接): </label>
                                <div class="tips-line">您可以选择上传百度首页自定义背景图片, 然后将链接填入</div>
                                <div class="content">
                                    <input id="custom-bg-url" value="${BackgroundImageRange.range.customUrl}"/>
                                    <button type="reset" id="btn-clear-bg">清除</button>
                                    <button type="button" id="btn-save-bg">保存</button>
                                    <button type="button" id="btn-use-current">使用当前图片</button>
                                </div>
                            </div>
                            <div class="row">
                                <label>文章宽度: </label>
                                <div class="color-picker-box">
                                    <div class="tips-line">
                                        <span>
                                            宽度基于源码中的
                                            <code>.container</code>
                                            的宽度, 详见
                                            <a href="https://github.com/SublimeCT/greasy_monkey_scripts/issues/4#issuecomment-675349913">#4</a>
                                        </span>
                                    </div>
                                    <div id="weight-slider" class="round-slider-wrapper"></div>
                                </div>
                            </div>
                            <div class="row">
                                <label>纯色背景(优先使用): </label>
                                <div class="color-picker-box">
                                    <div class="tips-line">
                                        <span>优先级高于自定义图片, 选择纯色背景将覆盖已添加的背景图片链接</span>
                                        <button type="reset" id="btn-clear-bgColor">清除</button>
                                    </div>
                                    <div class="content">
                                        <div class="color-picker-container"
                                            acp-palette="PALETTE_MATERIAL_CHROME"
                                            acp-palette-editable
                                            acp-color="${BackgroundImageRange.range.bgColor}"></div>
                                    </div>
                                </div
                            </div>
                            <div class="row" id="showSourceLink-wrap">
                                <label>是否显示 原文链接: </label>
                                <div class="tips-line">原文链接从顶部文章信息或原文中提取, 若作者直接文中写入原文链接(未在文章信息中标注), 有可能会匹配错误</div>
                                <div class="content">
                                    <label style="margin-right: 15px;">
                                        <input type="radio" value="0" ${BackgroundImageRange.range.showSourceLink ? '' : 'checked'} class="radio-showSourceLink" name="showSourceLink" />
                                        <span>隐藏</span>
                                    </label>
                                    <label style="margin-right: 15px;">
                                        <input type="radio" value="1" ${BackgroundImageRange.range.showSourceLink ? 'checked' : ''} class="radio-showSourceLink" name="showSourceLink" />
                                        <span>显示</span>
                                    </label>
                                </div>
                            </div>
                            <div class="row" id="defaultHideMenu-wrap">
                                <label>是否隐藏 设置(小齿轮)按钮: </label>
                                <div class="tips-line">隐藏之后设置(小齿轮)按钮会与回到顶部按钮同步显示和隐藏</div>
                                <div class="content">
                                    <label style="margin-right: 15px;">
                                        <input type="radio" value="1" ${BackgroundImageRange.range.defaultHideMenu ? 'checked' : ''} class="radio-defaultHideMenu" name="defaultHideMenu" />
                                        <span>隐藏</span>
                                    </label>
                                    <label>
                                        <input type="radio" value="0" ${BackgroundImageRange.range.defaultHideMenu ? '' : 'checked'} class="radio-defaultHideMenu" name="defaultHideMenu" />
                                        <span>显示</span>
                                    </label>
                                </div>
                            </div>
                            <div class="row" id="hideRecommendBox-wrap">
                                <label>是否隐藏所有 推荐文章: </label>
                                <div class="tips-line">隐藏之后将不会显示底部的推荐文章列表</div>
                                <div class="content">
                                    <label style="margin-right: 15px;">
                                        <input type="radio" value="1" ${BackgroundImageRange.range.hideRecommendBox ? 'checked' : ''} class="radio-hideRecommendBox" name="hideRecommendBox" />
                                        <span>隐藏</span>
                                    </label>
                                    <label>
                                        <input type="radio" value="0" ${BackgroundImageRange.range.hideRecommendBox ? '' : 'checked'} class="radio-hideRecommendBox" name="hideRecommendBox" />
                                        <span>显示</span>
                                    </label>
                                </div>
                            </div>
                            <div class="row" id="hideCopyright-wrap">
                                <label>是否隐藏最底部 csdn版权信息: </label>
                                <div class="tips-line">隐藏之后将不会显示页面最底部的 footer</div>
                                <div class="content">
                                    <label style="margin-right: 15px;">
                                        <input type="radio" value="1" ${BackgroundImageRange.range.hideCopyright ? 'checked' : ''} class="radio-hideCopyright" name="hideCopyright" />
                                        <span>隐藏</span>
                                    </label>
                                    <label>
                                        <input type="radio" value="0" ${BackgroundImageRange.range.hideCopyright ? '' : 'checked'} class="radio-hideCopyright" name="hideCopyright" />
                                        <span>显示</span>
                                    </label>
                                </div>
                            </div>
                            <div class="row" id="showCatalogue-wrap">
                                <label>是否显示目录栏: </label>
                                <div class="tips-line">开启之后会显示文章目录(若存在)</div>
                                <div class="content">
                                    <label style="margin-right: 15px;">
                                        <input type="radio" value="0" ${BackgroundImageRange.range.showCatalogue ? '' : 'checked'} class="radio-showCatalogue" name="showCatalogue" />
                                        <span>隐藏</span>
                                    </label>
                                    <label>
                                        <input type="radio" value="1" ${BackgroundImageRange.range.showCatalogue ? 'checked' : ''} class="radio-showCatalogue" name="showCatalogue" />
                                        <span>显示</span>
                                    </label>
                                </div>
                            </div>
                            <div class="row">
                                <label>联系作者: </label>
                                <div class="content">
                                    <div class="tips-line">源码:</div>
                                    <div class="tips-line">
                                        <a class="link" href="https://github.com/SublimeCT/greasy_monkey_scripts" target="_blank">Github</a>
                                    </div>
                                </div>
                                <div class="content">
                                    <div class="tips-line">反馈:</div>
                                    <div class="tips-line">
                                        <a class="link" href="https://greasyfork.org/zh-CN/scripts/373457-csdn-%E5%8E%BB%E5%B9%BF%E5%91%8A%E6%B2%89%E6%B5%B8%E9%98%85%E8%AF%BB%E6%A8%A1%E5%BC%8F/feedback" target="_blank">greasyfork page</a>
                                    </div>
                                </div>
                            </div>
                        </article>
                    </section>
                `
                document.body.appendChild(settingDialog)
                return this
            },
            _bindDialogEvents() {
                const dialogWrapper = document.getElementById('setting-dialog')
                const urlInput = document.getElementById('custom-bg-url')
                const saveUrlBtn = document.getElementById('btn-save-bg')
                const updateBgImageBtn = document.getElementById('btn-update-bg')
                const clearBgColorBtn = document.getElementById('btn-clear-bgColor')
                const saveCurrentImgBtn = document.getElementById('btn-use-current')
                const clearUrlBtn = document.getElementById('btn-clear-bg')
                const hideMenuWrap = document.getElementById('defaultHideMenu-wrap')
                const hideRecommendBox = document.getElementById('hideRecommendBox-wrap')
                const hideCopyright = document.getElementById('hideCopyright-wrap')
                const showCatalogue = document.getElementById('showCatalogue-wrap')
                const showSourceLinkWrap = document.getElementById('showSourceLink-wrap')
                if (!dialogWrapper) { console.error(`[${window.$CSDNCleaner.NAME}] Internal error. dialog init failed.`); return }
                dialogWrapper.addEventListener('click', evt => {
                    if (evt.target.id === 'setting-dialog' || evt.target.classList.contains('icon-close') || evt.target.parentNode.classList.contains('icon-close')) { // 关闭弹窗
                        window.$CSDNCleaner.toggleDialog()
                    } else if (evt.target.classList.contains('category')) { // 选择背景图片类目
                        const key = evt.target.attributes.getNamedItem('data-key').value
                        let existsIndex = -1
                        if (BackgroundImageRange.range.categorys.length > 0) {
                            for (let cIndex = BackgroundImageRange.range.categorys.length; cIndex--;) {
                                if (BackgroundImageRange.range.categorys[cIndex] === key) {
                                    existsIndex = cIndex
                                    break
                                }
                            }
                        }
                        if (existsIndex === -1) {
                            BackgroundImageRange.range.categorys.push(key)
                            evt.target.classList.add('STATE_SELECTED_CATEGORY')
                        } else {
                            BackgroundImageRange.range.categorys.splice(existsIndex, 1)
                            evt.target.classList.remove('STATE_SELECTED_CATEGORY')
                        }
                        BackgroundImageRange.save()
                    }
                })
                // urlInput.addEventListener('input', evt => {
                //     saveUrlBtn.setAttribute('disabled', urlInput.value != BackgroundImageRange.range.customUrl)
                // })
                saveUrlBtn.addEventListener('click', evt => {
                    if (urlInput.value && !/^http(s)?\:.+/.test(urlInput.value)) {
                        alert('请输入正确的图片链接')
                        return false
                    }
                    BackgroundImageRange.range.customUrl = urlInput.value
                    BackgroundImageRange.save()
                })
                saveCurrentImgBtn.addEventListener('click', evt => {
                    const { url } = window.$CSDNCleaner.BackgroundImageRange.currentUrl
                    if (!url) return false
                    urlInput.value = url
                    BackgroundImageRange.range.customUrl = url
                    BackgroundImageRange.save()
                    BackgroundImageRange.updateBgImage(url)
                })
                clearUrlBtn.addEventListener('click', evt => {
                    urlInput.value = BackgroundImageRange.range.customUrl = ''
                    BackgroundImageRange.save()
                })
                clearBgColorBtn.addEventListener('click', evt => {
                    BackgroundImageRange.setBgColor()
                })
                updateBgImageBtn.addEventListener('click', evt => {
                    BackgroundImageRange.updateBgImage(null, !!BackgroundImageRange.range.bgColor)
                })
                hideMenuWrap.addEventListener('change', evt => {
                    const dom = evt.target
                    if (!dom || !dom.classList || !dom.classList.contains('radio-defaultHideMenu')) return
                    const val = !!Number(dom.value)
                    urlInput.defaultHideMenu = BackgroundImageRange.range.defaultHideMenu = val
                    BackgroundImageRange.save()
                })
                hideRecommendBox.addEventListener('change', evt => {
                    const dom = evt.target
                    if (!dom || !dom.classList || !dom.classList.contains('radio-hideRecommendBox')) return
                    const val = !!Number(dom.value)
                    urlInput.hideRecommendBox = BackgroundImageRange.range.hideRecommendBox = val
                    BackgroundImageRange.save()
                })
                hideCopyright.addEventListener('change', evt => {
                    const dom = evt.target
                    if (!dom || !dom.classList || !dom.classList.contains('radio-hideCopyright')) return
                    const val = !!Number(dom.value)
                    urlInput.hideCopyright = BackgroundImageRange.range.hideCopyright = val
                    BackgroundImageRange.save()
                })
                showCatalogue.addEventListener('change', evt => {
                    const dom = evt.target
                    if (!dom || !dom.classList || !dom.classList.contains('radio-showCatalogue')) return
                    const val = !!Number(dom.value)
                    BackgroundImageRange.range.showCatalogue = val
                    BackgroundImageRange.save()
                })
                showSourceLinkWrap.addEventListener('change', evt => {
                    const dom = evt.target
                    if (!dom || !dom.classList || !dom.classList.contains('radio-showSourceLink')) return
                    const val = !!Number(dom.value)
                    // console.log('>>>', val, urlInput.showSourceLink, dom)
                    BackgroundImageRange.range.showSourceLink = val
                    document.body.style.setProperty('--source-link-wrapper-display', window.$CSDNCleaner.BackgroundImageRange.getSourceLinkDisplay())
                    BackgroundImageRange.save()
                })
            },
            toggleDialog() {
                const dialog = document.getElementById('setting-dialog')
                if (!dialog) throw new Error('dialog not found')
                dialog.classList.toggle('display-none')
            },
            _getOption({ dataType, img, name }) {
                const option = document.createElement('a')
                option.classList.add('option-box')
                option.setAttribute('data-type', dataType)
                const imgNode = document.createElement('img')
                if (img.indexOf('<svg') !== 0) {
                    imgNode.src = img
                }
                const optionName = document.createElement('span')
                optionName.classList.add('show-txt')
                optionName.innerHTML = name
                option.appendChild(imgNode)
                if (img.indexOf('<svg') === 0) {
                    imgNode.outerHTML = img
                }
                option.appendChild(optionName)
                return option
            },
            _sourceLinkKeywords: ['转载自', '转自', '原文地址', '原文链接', '转载地址', '转载链接', '原文:', '原文:'],
            _getSourceLink(row) {
                for (const keyword of this._sourceLinkKeywords) {
                    if (row.indexOf(keyword) === -1) continue
                    // 1. 尝试从 <a> 标签中获取链接
                    const attrMatchRes = row.match(/href="(.*?)"/)
                    const attr = attrMatchRes && attrMatchRes[1]
                    if (attr) return attr
                    // 2. 尝试获取整段链接内容
                    const partMatchRes = row.replace(/<\/?[\w|\d]+>/g, '').match(/(https?:\/\/.*)\s?.*$/)
                    const part = partMatchRes && partMatchRes[1]
                    if (part) return part
                }
            },
            showSourceLink() {
                const sourceDom = document.querySelector('.article-source-link')
                let sourceLink = ''
                if (sourceDom) { // 从顶部折叠面板中获取
                    let hasSourceLink = false
                    for (const keyword of this._sourceLinkKeywords) {
                        if (sourceDom.innerHTML.indexOf(keyword) !== -1) {
                            hasSourceLink = true
                            break
                        }
                    }
                    if (hasSourceLink) {
                        const linkDom = sourceDom.querySelector('a')
                        if (linkDom) sourceLink = linkDom && linkDom.innerText
                    }
                } else {
                    // 从文中匹配, 从文末取 _sourceLinkCheckLineSize 行, 若包含 _sourceLinkKeywords 中的内容则使用正则匹配该行中包含的链接
                    if (!document.getElementById('article_content')) return false
                    const articleRaw = document.getElementById('article_content').innerHTML
                    const articleLastLines = articleRaw.split('\n')
                    // 倒序遍历, 优先取文末的原文链接
                    for (const row of articleLastLines) {
                        const link = this._getSourceLink(row)
                        if (link) {
                            sourceLink = link
                            break
                        }
                    }
                }
                if (!sourceLink) return
                this.appendSourceLinkDom(sourceLink)
                console.log(`%c[${window.$CSDNCleaner.NAME}] 当前文章可能是转载的, 匹配到原文链接: ${sourceLink}`, 'color: teal')
            },
            appendSourceLinkDom(link) {
                const sourceLinkLabelWrapperDom = document.createElement('div')
                const sourceLinkIconDom = document.createElement('img')
                const sourceLinkLabelDom = document.createElement('span')
                const sourceLinkLinkDom = document.createElement('a')
                sourceLinkLabelWrapperDom.classList.add('source-link-wrapper')
                sourceLinkIconDom.classList.add('article-heard-img')
                sourceLinkIconDom.classList.add('source-link-icon')
                sourceLinkIconDom.setAttribute('src', 'https://csdnimg.cn/release/phoenix/template/new_img/shareWhite.png')
                sourceLinkLabelDom.classList.add('source-link-label')
                sourceLinkLabelDom.innerText = '转载自:'
                sourceLinkLinkDom.classList.add('follow-nickName')
                sourceLinkLinkDom.classList.add('source-link-link')
                sourceLinkLinkDom.innerText = link
                sourceLinkLinkDom.setAttribute('href', link)
                sourceLinkLinkDom.setAttribute('title', link)
                sourceLinkLinkDom.setAttribute('target', '_blank')

                sourceLinkLabelWrapperDom.appendChild(sourceLinkIconDom)
                sourceLinkLabelWrapperDom.appendChild(sourceLinkLabelDom)
                sourceLinkLabelWrapperDom.appendChild(sourceLinkLinkDom)
                // 插入页面中
                const wrapper = document.querySelector('.bar-content')
                // console.log(wrapper)
                if (wrapper) wrapper.appendChild(sourceLinkLabelWrapperDom)
            },
            loadColorPicker() {
                if (!window.AColorPicker) return
                window.AColorPicker.from('div.color-picker-container')
                    .on('change', (picker, color) => {
                        BackgroundImageRange.setBgColor(color)
                    })
            },
            disabledDarkSkin() {
                const sheets = document.querySelectorAll('link')
                for (const sheet of Array.from(sheets)) {
                    if (sheet.href.indexOf('template/themes_skin/skin-') > 0) {
                        sheet.setAttribute('disabled', 'disabled')
                    }
                }
                return this
            },
            async loadRoundSliderResources() {
                await this.loadResourcesFiles('link', 'https://cdn.jsdelivr.net/npm/[email protected]/dist/roundslider.min.css')
                // await this.loadResourcesFiles('script', 'https://cdn.jsdelivr.net/npm/[email protected]/dist/roundslider.min.js')
            },
            loadResourcesFiles(tagName = 'link', href, wait = true) {
                const tag = document.createElement(tagName)
                let hrefAttr = 'href'
                switch (tagName) {
                    case 'link':
                        tag.setAttribute('rel', 'stylesheet')
                        break;
                    case 'script':
                        hrefAttr = 'src'
                        break;
                }
                tag.setAttribute(hrefAttr, href)
                document.head.appendChild(tag)
                return new Promise((resolve, reject) => {
                    tag.addEventListener('load', evt => resolve(tag))
                    tag.addEventListener('error', evt => reject(tag))
                })
            },
            initRoundSlider() {
                if (!window.changeTooltip) window.changeTooltip = this.changeTooltip
                $('#weight-slider').roundSlider({
                    sliderType: 'min-range',
                    editableTooltip: false,
                    radius: 105,
                    width: 16,
                    value: window.$CSDNCleaner.BackgroundImageRange.range.articleWeightRate || 100,
                    handleSize: 0,
                    handleShape: 'square',
                    circleShape: 'pie',
                    startAngle: 315,
                    tooltipFormat: 'changeTooltip',
                    update: this.onUpdateRoundSlider
                })
            },
            onUpdateRoundSlider(evt) {
                window.$CSDNCleaner.BackgroundImageRange.setArticleWeight(evt.value)
            },
            changeTooltip(e) {
                const val = e.value
                let speed = '';
                if (val < 40) speed = 'Slow';
                else if (val < 65) speed = 'Normal';
                else if (val < 90) speed = 'Speed';
                else speed = 'Very Speed';

                return val + '%' + '<div>' + speed + '<div>';
            }
        }
        window.$CSDNCleaner.init()
    })()
})();