☰

B站动态、旧版播放页显示评论图片

B站动态、旧版播放页显示评论图片，另附强制显示“返回旧版”按钮功能。

目前為 2023-04-09 提交的版本，檢視 最新版本。

// ==UserScript==
// @name         B站动态、旧版播放页显示评论图片
// @namespace    http://tampermonkey.net/
// @version      1.41
// @description  B站动态、旧版播放页显示评论图片，另附强制显示“返回旧版”按钮功能。
// @author       CZX Fuckerman
// @match        *://*.bilibili.com/*
// @exclude      *://member.bilibili.com*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=bilibili.com
// @require      https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.min.js
// @run-at       document-body
// @license      GPL
// @grant        none
// @noframes
// ==/UserScript==

(function() {
    'use strict';

    let j3 = jQuery.noConflict(true);

    Function.prototype.clone = function() {
        var cloneObj = this;
        if(this.__isClone) {
            cloneObj = this.__clonedFrom;
        }

        var temp = function() { return cloneObj.apply(this, arguments); };
        for(var key in this) {
            temp[key] = this[key];
        }

        temp.__isClone = true;
        temp.__clonedFrom = cloneObj;

        return temp;
    };

    hackEle(document.querySelector("head"), "insertBefore", hack)
    hackEle(document.querySelector("head"), "appendChild", hack)


    function hackEle(ele, func, callback){
        const ori = ele[func];
        ele[func] = function(...args){
            //console.log(this, ...args)
            return callback(ori.bind(this), ...args)
        }
    };

    function injectbbComment(){
        const bbComment = window.bbComment;
        bbComment.prototype.j3 = j3;
        var oldFun = bbComment.prototype._createListCon.clone();
        bbComment.prototype._createListCon = function (item, i, pos) {
            let res = oldFun.apply(this, [item, i, pos]);
            if(typeof(item.content.pictures) != "undefined" || item.content.pictures != null){
                let domRes = this.j3.parseHTML(res);
                let replyDom = $(domRes).children("p.text");
                let containerDom = $("<div class=\"preview-image-container\"></div>")
                $.each(item.content.pictures, function(index, item) {
                    containerDom.append("<img class=\"custom-comment-picture\" src=\"" + item.img_src + "@120w_!web-comment-note.webp\" onclick=\"window.open('" + item.img_src + "')\"></img>");
                });

                if(typeof(item.content.rich_text) != "undefined" || item.content.rich_text != null){
                    if(typeof(item.content.rich_text.note) != "undefined" || item.content.rich_text.note != null){
                        if(typeof(item.content.rich_text.note.click_url) != "undefined" || item.content.rich_text.note.click_url != null){
                             replyDom.append("&nbsp;<a href=\"" + item.content.rich_text.note.click_url + "\" target=\"_blank\">展开</a>");
                        }
                    }
                }

                replyDom.after(containerDom);
                replyDom.wrap("<span></span>");
                replyDom.css("display", "inline");
                replyDom.before("<div class=\"note-prefix\"><img class=\"note-icon\" src=\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTUiIHZpZXdCb3g9IjAgMCAxNCAxNSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik03LjAwMDAyIDMuNDE2NjlDNS41MzEwNiAzLjQxNjY5IDQuMjQ4NDQgMy40OTE0MSAzLjM0MzA0IDMuNTY0ODRDMi43MTM4IDMuNjE1ODYgMi4yMjYwOCA0LjA5NjU0IDIuMTcwMDIgNC43MjAxNEMyLjEwMzU2IDUuNDU5MzcgMi4wNDE2OSA2LjQzNDIzIDIuMDQxNjkgNy41MDAwMkMyLjA0MTY5IDguNTY1ODEgMi4xMDM1NiA5LjU0MDY3IDIuMTcwMDIgMTAuMjc5OUMyLjIyNjA4IDEwLjkwMzUgMi43MTM3NCAxMS4zODQyIDMuMzQyOTUgMTEuNDM1MkM0LjE3NTE5IDExLjUwMjcgNS4zMjYzNSAxMS41NzEzIDYuNjQ4MDggMTEuNTgxOUM2Ljg4OTcgMTEuNTgzOSA3LjA4Mzk5IDExLjc4MTMgNy4wODIwNSAxMi4wMjI5QzcuMDgwMSAxMi4yNjQ2IDYuODgyNjYgMTIuNDU4OCA2LjY0MTA0IDEyLjQ1NjlDNS4yOTM4NCAxMi40NDYxIDQuMTIxIDEyLjM3NjIgMy4yNzIyMyAxMi4zMDczQzIuMjIzNiAxMi4yMjIzIDEuMzkzMiAxMS40MTEyIDEuMjk4NTMgMTAuMzU4M0MxLjIzMDM4IDkuNjAwMTIgMS4xNjY2OSA4LjU5ODI5IDEuMTY2NjkgNy41MDAwMkMxLjE2NjY5IDYuNDAxNzUgMS4yMzAzOCA1LjM5OTkyIDEuMjk4NTMgNC42NDE3OUMxLjM5MzIgMy41ODg4MSAyLjIyMzcyIDIuNzc3NzMgMy4yNzIzMSAyLjY5MjdDNC4xOTU1NCAyLjYxNzgzIDUuNTAyMzYgMi41NDE2OSA3LjAwMDAyIDIuNTQxNjlDOC40OTc4MyAyLjU0MTY5IDkuODA0NzYgMi42MTc4NSAxMC43MjggMi42OTI3MkMxMS43NzY0IDIuNzc3NzUgMTIuNjA2OSAzLjU4ODUxIDEyLjcwMTYgNC42NDE0MkMxMi43NTM2IDUuMjIwMzkgMTIuODAzIDUuOTQxMjYgMTIuODIzNSA2LjczODg2QzEyLjgyOTcgNi45ODA0MSAxMi42Mzg5IDcuMTgxMjQgMTIuMzk3MyA3LjE4NzQzQzEyLjE1NTggNy4xOTM2MyAxMS45NTQ5IDcuMDAyODQgMTEuOTQ4OCA2Ljc2MTI5QzExLjkyODkgNS45ODU3NSAxMS44ODA4IDUuMjgzODYgMTEuODMwMSA0LjcxOTc4QzExLjc3NCA0LjA5NjM2IDExLjI4NjQgMy42MTU4OCAxMC42NTczIDMuNTY0ODZDOS43NTE4NiAzLjQ5MTQzIDguNDY5MTIgMy40MTY2OSA3LjAwMDAyIDMuNDE2NjlaTTQuMzc1MDIgNS44OTU4NUM0LjEzMzQgNS44OTU4NSAzLjkzNzUyIDYuMDkxNzMgMy45Mzc1MiA2LjMzMzM1QzMuOTM3NTIgNi41NzQ5OCA0LjEzMzQgNi43NzA4NSA0LjM3NTAyIDYuNzcwODVIOS42MjUwMkM5Ljg2NjY0IDYuNzcwODUgMTAuMDYyNSA2LjU3NDk4IDEwLjA2MjUgNi4zMzMzNUMxMC4wNjI1IDYuMDkxNzMgOS44NjY2NCA1Ljg5NTg1IDkuNjI1MDIgNS44OTU4NUg0LjM3NTAyWk00LjM3NTAyIDguMjI5MTlDNC4xMzM0IDguMjI5MTkgMy45Mzc1MiA4LjQyNTA2IDMuOTM3NTIgOC42NjY2OUMzLjkzNzUyIDguOTA4MzEgNC4xMzM0IDkuMTA0MTkgNC4zNzUwMiA5LjEwNDE5SDcuNTgzMzVDNy44MjQ5OCA5LjEwNDE5IDguMDIwODUgOC45MDgzMSA4LjAyMDg1IDguNjY2NjlDOC4wMjA4NSA4LjQyNTA2IDcuODI0OTggOC4yMjkxOSA3LjU4MzM1IDguMjI5MTlINC4zNzUwMlpNMTIuMTk2MSA4LjM2NzQxQzExLjc5NzQgNy45Njg3NSAxMS4xNTEgNy45Njg3NSAxMC43NTI0IDguMzY3NDFMOC40NDgzNyAxMC42NzE0QzguMjU2OTIgMTAuODYyOSA4LjE0OTM3IDExLjEyMjUgOC4xNDkzNyAxMS4zOTMzVjEyLjU5NzRDOC4xNDkzNyAxMi45NTE4IDguNDM2NjYgMTMuMjM5MSA4Ljc5MTA0IDEzLjIzOTFIOS45OTUxNkMxMC4yNjU5IDEzLjIzOTEgMTAuNTI1NiAxMy4xMzE1IDEwLjcxNyAxMi45NDAxTDEzLjAyMSAxMC42MzZDMTMuNDE5NyAxMC4yMzc0IDEzLjQxOTcgOS41OTEwMyAxMy4wMjEgOS4xOTIzN0wxMi4xOTYxIDguMzY3NDFaTTExLjM3MTEgOC45ODYxM0MxMS40MjgxIDguOTI5MTcgMTEuNTIwNCA4LjkyOTE3IDExLjU3NzMgOC45ODYxM0wxMi40MDIzIDkuODExMDhDMTIuNDU5MyA5Ljg2ODAzIDEyLjQ1OTMgOS45NjAzNyAxMi40MDIzIDEwLjAxNzNMMTAuMDk4MyAxMi4zMjEzQzEwLjA3MDkgMTIuMzQ4NyAxMC4wMzM4IDEyLjM2NDEgOS45OTUxNiAxMi4zNjQxSDkuMDI0MzdMOS4wMjQzNyAxMS4zOTMzQzkuMDI0MzcgMTEuMzU0NiA5LjAzOTc0IDExLjMxNzUgOS4wNjcwOSAxMS4yOTAxTDExLjM3MTEgOC45ODYxM1oiIGZpbGw9IiM5NDk5QTAiLz4KPC9zdmc+Cg==\"><div>笔记</div></div>");
                res = $(domRes).prop('outerHTML');
            }
            return res;
        };

    };

    let styleDom = document.createElement("style");
    styleDom.innerText = ".preview-image-container{display:flex;flex-wrap:nowrap;margin-top:8px;}.custom-comment-picture{width:120px!important;height:120px!important;max-width:100%!important;max-height:100%!important;cursor:pointer!important;object-fit:cover!important;border-radius:2px!important;}.custom-comment-picture:nth-child(2){margin:0 5px;} .note-prefix {display: inline-flex;align-items: center;justify-content:center;padding:1px 4px;border-radius:4px;margin-right:8px;font-size:12px;color:#9499A0;line-height:20px;vertical-align:bottom;background-color:#F6F7F8;} .note-prefix.note-icon{width: 16px;height:16px;}";
    document.head.appendChild(styleDom);


    window.returnBackBtn = function(){
        window.__INITIAL_STATE__.abtest.storage_back_btn = "SHOW";
        window.__INITIAL_STATE__.abtest.remove_back_version = "SHOW";
    }

    setTimeout("returnBackBtn()", 5000);


    let injected = false;
    function hack(origin, ...args){



        const [ele, target] = [...args];
        if( ele.src && ~ele.src.indexOf("/x/v2/reply") && !injected){
            // 确定是评论类型，执行额外流程
            injectbbComment();
            injected = true;
        }
        let res = origin(...args);
        return res;
    }

})();