☰

CSDN Blog Super Simplification

move comment area to left side & remove login requirement, move body area to right side & auto trigger read more button, remove author panel,recommendation panel etc..., change the background to default style, hide login pop up panel

目前为 2020-10-09 提交的版本。查看 最新版本。

// ==UserScript==
// @name         CSDN Blog Super Simplification
// @name:zh-CN   CSDN Blog 极致简化
// @namespace    csdn_blog_super_simplification
// @version      1.2
// @description  move comment area to left side & remove login requirement, move body area to right side & auto trigger read more button, remove author panel,recommendation panel etc..., change the background to default style, hide login pop up panel
// @description:zh-CN  move comment area to left side & remove login requirement, move body area to right side & auto trigger read more button, remove author panel,recommendation panel etc..., change the background to default style, hide login pop up panel
// @author       Xavier Wong
// @include      https://blog.csdn.net/*
// @exclude      https://www.csdn.net/*
// @grant        none
// ==/UserScript==
function getElements(type, names, elements) {
    if(type==="tag"){
        for(let idx = 0; idx < names.length; idx++){
            elements.push.apply(elements,document.getElementsByTagName(names[idx]));
        }
    }else if(type==="class"){
        for(let idx = 0; idx < names.length; idx++){
            elements.push.apply(elements,document.getElementsByClassName(names[idx]));
        }
    }else if(type==="id"){
        for(let idx = 0; idx < names.length; idx++){
            elements.push(document.getElementById(names[idx]));
        }
    }
    return elements;
}

(
    function() {
        'use strict';
        document.getElementsByTagName("body")[0].style.setProperty("background-color","#f5f6f7","important");
        document.getElementsByTagName("body")[0].style.setProperty("background-image","none","important");
        document.getElementsByClassName("main_father")[0].style.height = 'unset';

        // add remove elements by name
        const classes = ["hide-article-box", "csdn-side-toolbar", "recommend-box", "template-box", "footer-box"];
        const tags = ["aside"];
        const ids = ["rightAside", "btnMoreComment", "tip_comment", "quickComment"];

        // remove all
        let elementsToRemove = [];
        getElements("class", classes, elementsToRemove);
        getElements("tag", tags, elementsToRemove);
        getElements("id", ids, elementsToRemove);
        for(let idx = 0; idx < elementsToRemove.length; idx++){
            elementsToRemove[idx].remove();
        }

        // tags to extend to 100% width
        let elementsToExtend = [];
        getElements("id", ["mainBox","article_content"], elementsToExtend);
        getElements("tag", ["main"], elementsToExtend);
        for(let idx = 0; idx < elementsToExtend.length; idx++){
            elementsToExtend[idx].style.width = "100%";
            elementsToExtend[idx].style.height = "100%";
        }

        let elementsToChange = [];
        getElements("class", ["blog-content-box"], elementsToChange);
        for(let idx = 0; idx < elementsToChange.length; idx++){
            elementsToChange[idx].style.width = "70%";
            elementsToChange[idx].style.float = "right";
        }
        elementsToChange = [];
        getElements("class", ["more-toolbox", "left-toolbox"], elementsToChange);
        for(let idx = 0; idx < elementsToChange.length; idx++){
            elementsToChange[idx].style.width = "100%";
            elementsToChange[idx].style.float = "right";
        }

        elementsToChange = [];
        getElements("class", ["comment-box"], elementsToChange);
        for(let idx = 0; idx < elementsToChange.length; idx++){
            elementsToChange[idx].style.position = "static";
            elementsToChange[idx].style.float = "left";
            elementsToChange[idx].style.top = "52px";
            elementsToChange[idx].style.width = "calc(28vw)";
        }

        window.onclick = function(){
            var elementsToHide = [];
            var loginCleared = false;
            getElements("class", ["login-box", "login-mark"], elementsToHide);
            for(let idx = 0; idx < elementsToHide.length; idx++){
                elementsToHide[idx].style.visibility = "hidden";
                loginCleared = true;
            }
            if(loginCleared) {
                window.onclick = null;
            }
        }

        setTimeout(
            function(){
                document.getElementsByClassName("comment-list-box")[0].style.overflow = 'scroll';
                document.getElementsByClassName("comment-list-box")[0].style.maxHeight = 'calc(70vh)';
                document.getElementsByClassName("comment-list-box")[0].style.marginBottom = '10px';
                document.getElementById("commentPage").classList.remove('d-none')
                document.getElementById("commentPage").style.marginBottom='25px';
            }, 100);

        var toolbar = document.getElementById("csdn-toolbar");
        var main = document.getElementsByClassName("blog-content-box")[0];
        var comment = document.getElementsByClassName("comment-box")[0];
        main.parentNode.insertBefore(comment,main.nextSibling);
        window.onscroll = function(){
            if(toolbar.style.position !== comment.style.position){
                comment.style.position = toolbar.style.position;
            }
        }


    }
)();