// ==UserScript==
// @name CSDN Blog 极致简化
// @name:en CSDN Blog Super Simplification
// @namespace csdn_blog_super_simplification
// @version 4.1.1
// @description 去除作者信息面板、广告,评论区移至左侧 & 免登陆查看评论, 免登录复制, 自动阅读全文, 去除登陆弹窗(如需登陆点右上角)
// @description:en remove author panel/remove ads/move comment area to left & remove login requirement/auto trigger read more button/hide login pop up panel
// @author Xavier Wong
// @run-at document-start
// @include https://*blog.csdn.net/*
// @exclude https://www.csdn.net/*
// @grant GM_addStyle
// @license Xavier Wong
// ==/UserScript==
GM_addStyle(
'#commentSideBoxshadow{display:block !important;width:unset !important;}' +
'#commentSideBoxshadow>.comment-side-content{right: unset !important; top: 48px !important; margin-top: 8px !important;height:calc(100% - 68px) !important;overflow: hidden !important; width:30% !important}' +
'.comment-side-tit-close{display: none !important}' +
'.comment-side-box-shadow{position: static !important; height: unset !important}' +
'#pcCommentSideBox{height: 100% !important;overflow-y:scroll !important; padding: 0 !important}' +
// Background & Color
'[id^="dmp_ad"] {display:none}'+
'#csdn-toolbar{position:static !important}'+
'.toolbar-inside{background: #fff !important}' +
'.toolbar-container{width: fit-content !important}'+
'.toolbar-search{width: auto !important;flex: unset !important}'+
'#mainBox{margin-left: 0 !important; width:100% !important;overflow:hidden;}' +
'body{background-color:#f5f6f7 !important;background-image:none !important; overflow-y:auto; overflow-x:auto}' +
// Layout Rearrangement
'.has-comment,.unhas-comment,#recommendNps,#csdn-shop-window,#toolBarBox,.reward-box-new,#rightAside,#btnMoreComment,#tip_comment,#quickComment,.hide-article-box,.csdn-side-toolbar,.recommend-box,.template-box,.footer-box,.blog-footer-bottom,aside,.toolbar-advert{display:none !important}' +
'.main_father{height: calc(100% - 60px) !important;}' +
'#article_content{width:100% !important;height:100% !important}' +
'main{width:100% !important;height:100% !important;margin-bottom: unset !important}'+
'.blog-content-box{width:70%;float:right;z-index:1;height: 100%;overflow-y: auto;-webkit-box-shadow: 0 2px 4px 0 rgba(0,0,0,0.05);box-shadow: 0 2px 4px 0 rgba(0,0,0,0.05);}' +
// Toolbox
'.more-toolbox{width:98.5% !important;position:fixed !important;bottom:0;left:unset !important;-webkit-box-shadow: 0 0 10px 3px rgba(0,0,0,0.05);box-shadow: 0 0 10px 3px rgba(0,0,0,0.05);}' +
// Comment Area
'#pcCommentBox{display: block!important;margin-top:0px !important;position:relative;width:29% !important;height:100%;overflow:hidden;}' +
'.comment-list-box{overflow-y:auto !important;height: 100%;max-height:unset !important;margin-bottom:10px !important;}' +
'.comment-list-container{overflow:scroll !important;padding-bottom:57px}' +
'#commentPage{top:15px;width:100%;margin-bottom:25px !important;display:block !important}' +
'.bt-comment-show{display: none !important} .opt-box{display: block !important}' +
'#myDrap>a{box-shadow: none;border: 1px solid #dadde0;} #myDrap>a>svg{color: #999aaa;width: 2rem;height: 2rem;} #comment_content{height:64px}' +
'.comment-operate-box{bottom: 8px; top: unset !important}' +
'.new-comment{display:block !important;text-align: justify;}'+
// Login Box
'.login-box,.login-mark{visibility:hidden !important}' +
'#commentControl{position:absolute;right: 0; top:50%;width:30px;height:30px}' +
'#hideCom{position:absolute;right:0;top:50%;line-height:50px;height:50px;width:25px;background:#f5f6f7;cursor:pointer;color:darkgrey;padding-left:10px;font-weight:bolder;border-radius:50px 0 0 50px}' +
'#hideCom:hover{width:40px;}' +
'#showCom{display:none;position:fixed;left:12px;top:50%;line-height:50px;height:50px;width:25px;background:#f5f6f7;cursor:pointer;color:darkgrey;padding-right:10px;text-align:end;font-weight:bolder;border-radius:0 50px 50px 0}' +
'#showCom:hover{width:40px;}' +
'#moveCom{position:absolute; right:0;top:0;width:0;height:0;border-top: 15px solid red;border-left: 15px solid transparent;cursor:move}' +
'#resizeCom{display:none;position:absolute; right:0;bottom:0;width:0;height:0;border-bottom: 15px solid red;border-left: 15px solid transparent;cursor:nwse-resize}' +
'.new-info-box{padding-right:0px !important}'+
// Code Copy
'code{user-select: text !important}'
);
function scrollToTop(){
document.querySelector('.article-header-box').scrollIntoView()
}
function commentArea(toolbar, comment){
if(toolbar.style.position !== comment.style.position){
comment.style.position = toolbar.style.position;
}
if(comment.style.position === "fixed"){
if(document.getElementsByTagName("main")[0].offsetWidth*0.28 !== comment.offsetWidth){
comment.style.width = document.getElementsByTagName("main")[0].offsetWidth*0.28 + "px";
}
}else{
comment.style.width = "28%";
}
}
function scrollToTopF(){
document.querySelector('.blog-content-box').scrollTo({
left: 0,
top: 0,
behavior: 'smooth'
});
}
function showComment(){
let commentBox = document.querySelector('#pcCommentBox');
commentBox.style.left = 'unset';
commentBox.style.top = 'unset';
commentBox.style.width = '29%';
commentBox.style.height = '100%';
GM_addStyle(".blog-content-box{width:70%} #showCom{display:none !important}");
}
(
function() {
var scrollToTop = document.createElement("div");
scrollToTop.id = 'scrollToTop';
scrollToTop.innerHTML = '<div style="z-index: 999;position: fixed;right: 50px;bottom: 50px;border-radius: 10px; background: #dcdcdc8a;cursor: pointer;padding: 0 10px;font-size: 30px">🔝</div>';
scrollToTop.onclick = scrollToTopF;
GM_addStyle('#scrollToTop{visibility: hidden');
var isComFloat = false;
var hideCom = document.createElement('div');
hideCom.id = 'hideCom';
hideCom.innerHTML = '<';
hideCom.onclick = function(){
if(isComFloat){
GM_addStyle("#pcCommentBox{position:relative; width:0; height:100%; border-color: unset;border:0;} #resizeCom{display:none !important}");
isComFloat = false;
showComment();
return;
}
GM_addStyle("#pcCommentBox, #commentSideBoxshadow>.comment-side-content{display: none !important;} .blog-content-box{width:100%} #showCom{display:block !important}");
}
var showCom = document.createElement('div');
showCom.id = 'showCom';
showCom.innerHTML = '>';
showCom.onclick = function(){
let commentBox = document.querySelector('#pcCommentBox, #commentSideBoxshadow>.comment-side-content');
commentBox.style.width = '29%';
commentBox.style.height = '100%';
GM_addStyle("#pcCommentBox, #commentSideBoxshadow>.comment-side-content{display: block !important;} .blog-content-box{width:70%} #showCom{display:none !important}");
}
var moveCom = document.createElement('div');
moveCom.id = 'moveCom';
moveCom.title = '移动';
var x = 0;
var y = 0;
var l = 0;
var t = 0;
var w = 0;
var h = 0;
var resizeCom = document.createElement('div');
resizeCom.id = 'resizeCom';
resizeCom.title = '调节';
var isMoving = false, isResizing = false;
moveCom.onmousedown = function(e){
let commentBox = document.querySelector('#pcCommentBox');
if(!isComFloat){
commentBox.style.width = '60%';
commentBox.style.height = '50%';
}
GM_addStyle("#pcCommentBox{position:fixed;float:left;z-index:10;border:4px solid;border-color: rgb(235,67,82) rgb(243,164,85) rgb(243,164,85) rgb(235,67,82);} .blog-content-box{width:100%} #resizeCom{display:block !important}");
//获取x坐标和y坐标
x = e.clientX;
y = e.clientY;
//获取左部和顶部的偏移量
l = commentBox.offsetLeft;
t = commentBox.offsetTop;
//开关打开
isMoving = true;
isComFloat = true;
e.preventDefault();
}
resizeCom.onmousedown = function(e){
let commentBox = document.querySelector('#pcCommentBox');
//获取x坐标和y坐标
x = e.clientX;
y = e.clientY;
//获取左部和顶部的偏移量
w = commentBox.offsetWidth;
h = commentBox.offsetHeight;
//开关打开
isResizing = true;
e.preventDefault();
}
window.onmousemove = function(e) {
if (isMoving) {
let commentBox = document.querySelector('#pcCommentBox');
//获取x和y
let nx = e.clientX;
let ny = e.clientY;
//计算移动后的左偏移量和顶部的偏移量
let nl = nx - (x - l);
let nt = ny - (y - t);
var sw = document.documentElement.offsetWidth || document.body.offsetWidth ;
var sh = document.documentElement.offsetHeight || document.body.offsetHeight ;
if(commentBox.offsetWidth + nl < 100 ) nl = 100 - commentBox.offsetWidth;
if(nt < 0 ) nt = 0;
if(nl+commentBox.offsetWidth > sw) nl = sw - commentBox.offsetWidth;
if(sh - nt < 100 ) nt = sh - 100;
commentBox.style.left = nl + 'px';
commentBox.style.top = nt + 'px';
}
if (isResizing) {
let commentBox = document.querySelector('#pcCommentBox');
//获取x和y
let nx = e.clientX;
let ny = e.clientY;
//计算移动后的左偏移量和顶部的偏移量
let nw = w + (nx - x);
let nh = h + (ny - y);
commentBox.style.width = nw + 'px';
commentBox.style.height = nh + 'px';
}
}
//鼠标抬起事件
window.onmouseup = function() {
if(isMoving){
isMoving = false;
let commentBox = document.querySelector('#pcCommentBox');
commentBox.style.cursor = 'default';
}
if(isResizing){
isResizing = false;
let commentBox = document.querySelector('#pcCommentBox');
commentBox.style.cursor = 'default';
}
}
let darkToolbarCss = document.querySelector('link[href*="csdn-toolbar-dark"]');
if(darkToolbarCss){
darkToolbarCss.href = darkToolbarCss.href.replace('dark', 'default')
}
let darkSkinCss = document.querySelector('link[href*="skin-blackaction"]');
if(darkSkinCss){
darkSkinCss.href = ""
}
let darkLogo = document.querySelector('img[title="CSDN首页"]');
if(darkLogo){
darkLogo.src="https://img-home.csdnimg.cn/images/20201124032511.png"
}
window.onload = function(){
'use strict';
document.getElementsByTagName('body')[0].appendChild(scrollToTop);
document.querySelector('.blog-content-box').onscroll = function(){
let scrollTop = this.scrollTop || document.body.scrollTop;
// console.log("st:"+scrollTop+";ch:"+clientHeight+";sh:"+scrollHeight)
if(scrollTop <= 200) {
GM_addStyle('#scrollToTop{visibility: hidden');
}
if(scrollTop > 200) {
GM_addStyle('#scrollToTop{visibility: visible');
}
}
let darkToolbarCss = document.querySelector('link[href*="csdn-toolbar-dark"]');
if(darkToolbarCss){
darkToolbarCss.href = darkToolbarCss.href.replace('dark', 'default')
}
let darkSkinCss = document.querySelector('link[href*="skin-blackaction"]');
if(darkSkinCss){
darkSkinCss.href = ""
}
let darkLogo = document.querySelector('img[title="CSDN首页"]');
if(darkLogo){
darkLogo.src="https://img-home.csdnimg.cn/images/20201124032511.png"
}
//document.querySelector('#pcCommentBox').innerHTML = `<div class="unlogin-comment-model"><span>评论加载中...</span></div>`;
let bodyLayout = document.querySelector('body');
bodyLayout.style.setProperty('background-image', 'none', 'important');
bodyLayout.style.setProperty('background-color', '#f5f6f7', 'important');
let blogBox = document.querySelector('.blog-content-box');
blogBox.appendChild(showCom);
let commentBox = document.querySelector('#commentSideBoxshadow>.comment-side-content');
commentBox.appendChild(hideCom);
// commentBox.appendChild(moveCom);
// commentBox.appendChild(resizeCom);
if(getCookie('UserName') == null){
$.ajax({
url: 'https://blog.csdn.net/phoenix/web/v1/comment/list/'+articleId+'?page=0&size=3000',
type: "POST",
success: function (data) {
// console.log(data);
let commentCustom = document.querySelector('#commentSideBoxshadow>.comment-side-content').outerHTML + `<div class="comment-list-container"><div class="comment-list-box">`;
$.each(data.data.list, function(i, r){
commentCustom = `${commentCustom}<ul class="comment-list">` +
`<li class="comment-line-box">` +
`<div class="comment-list-item">` +
`<a class="comment-list-href" target="_blank" href="https://blog.csdn.net/${r.info.userName}">` +
`<img src="${r.info.avatar}" username="${r.info.userName}" alt="${r.info.userName}" class="avatar">` +
`</a>` +
`<div class="right-box">` +
`<div class="new-info-box clearfix">` +
`<div class="comment-top">` +
`<div class="user-box">` +
`<a class="name-href" target="_blank" href="https://blog.csdn.net/${r.info.userName}">` +
`<span class="name ">${r.info.nickName}</span>` +
`</a>` +
`<span class="date" title="${r.info.postTime}">${r.info.dateFormat}</span>` +
`</div>` +
`</div>` +
`<div class="comment-center">` +
`<div class="new-comment">${r.info.content}</div>` +
`</div>` +
`</div>` +
`</div>` +
`</div>` +
`</li>` +
`<li class="replay-box" style="display:block"><ul class="comment-list">`;
$.each(r.sub, function(i1, r1){
commentCustom = `${commentCustom}<li class="comment-line-box">` +
`<div class="comment-list-item">` +
`<a class="comment-list-href" target="_blank" href="https://blog.csdn.net/${r1.userName}">` +
`<img src="${r1.avatar}" username="${r1.userName}" alt="${r1.userName}" class="avatar">` +
`</a>` +
`<div class="right-box">` +
`<div class="new-info-box clearfix">` +
`<div class="comment-top">` +
`<div class="user-box">` +
`<a class="name-href" target="_blank" href="https://blog.csdn.net/${r1.userName}">` +
`<span class="name ">${r1.nickName}</span>` +
`</a>` +
`<span class="date" title="${r1.postTime}">${r1.dateFormat}</span>` +
`</div>` +
`</div>` +
`<div class="comment-center">` +
`<div class="new-comment">${r1.content}</div>` +
`</div>` +
`</div>` +
`</div>` +
`</div>` +
`</li>`;
});
commentCustom = `${commentCustom}</ul></li></ul>`;
});
commentCustom = `${commentCustom}</div></div>`;
document.querySelector('#pcCommentSideBox').innerHTML = commentCustom; //`<div class="unlogin-comment-model">` + commentCustom + `</div>`;
document.querySelector('#pcCommentSideBox').style.display = 'block';
let commentBox = document.querySelector('#commentSideBoxshadow>.comment-side-content');
commentBox.appendChild(hideCom);
// commentBox.appendChild(moveCom);
// commentBox.appendChild(resizeCom);
//document.querySelector('.has-comment').innerHTML = null;
//document.querySelector('.has-comment').innerHTML = commentCustom;
}
});
}
// modify directory jump
let directory = document.querySelectorAll('#content_views a[target=_self]');
$.each(directory,function(i, r){
r.onclick = function() {
if(!!document.querySelector('[name="'+$(r).attr('href').replace('#', '')+'"]')) {
document.querySelector('[name="'+$(r).attr('href').replace('#', '')+'"]').scrollIntoView()
}
if(!!document.querySelector('[id="'+$(r).attr('href').replace('#', '')+'"]')) {
document.querySelector('[id="'+$(r).attr('href').replace('#', '')+'"]').scrollIntoView()
}
}
// console.log($(r).attr('href'))
})
// monitor copy
document.addEventListener('copy',function(e){
let clipboardData = e.clipboardData || window.clipboardData;
if(!clipboardData) return ;
clipboardData.setData('text/plain', window.getSelection().toString())
})
}
}
)();