Greasy Fork

Greasy Fork is available in English.

哔哩哔哩PWA

立刻将哔哩哔哩网页变为轻量的、简洁的软件界面

目前为 2022-08-04 提交的版本。查看 最新版本

// ==UserScript==
// @name         哔哩哔哩PWA
// @namespace    https://ez118.github.io/
// @version      0.8
// @description  立刻将哔哩哔哩网页变为轻量的、简洁的软件界面
// @author       ZZY_WISU
// @match        https://*.bilibili.com/*
// @match        http://*.bilibili.com/*
// @icon         https://www.bilibili.com/favicon.ico?v=114514
// @license      GNU GPLv3
// @grant        GM_xmlhttpRequest
// @grant        GM_download
// @grant        GM_registerMenuCommand
// @grant        GM_unregisterMenuCommand
// @grant        GM_setValue
// @grant        GM_getValue
// @grant        GM_addStyle
// ==/UserScript==

function runAsync(url,send_type,data_ry) {
    var p = new Promise((resolve, reject)=> {
        GM_xmlhttpRequest({
            method: send_type,
            url: url,
            headers: {"Content-Type": "application/x-www-form-urlencoded;charset=utf-8"},
            data:data_ry,
            onload: function(response){resolve(response.responseText);},
            onerror: function(response){reject("请求失败");}
        });
    })
    return p;
}

function Add2Page(result){
    var tjlist = eval("("+result+")");
    var WebList = "";
    for(var i = 0; i < 10; i++){
         WebList += `<div class='dynamic_singlebox'>
                     <a onclick='window.open("https://player.bilibili.com/player.html?bvid=` + tjlist.data.item[i].bvid + `&page=1&danmaku=0", "Player", "height=500,width=800,top=50,left=250")' target='_blank'>
                         <img src='` + tjlist.data.item[i].pic + `@412w_232h_1c.webp'><br>
                         <div class="dynamic_singlebox_vt">` + tjlist.data.item[i].title + `</div>
                     </a>
                     <a onclick='window.open("https://space.bilibili.com/` + tjlist.data.item[i].owner.mid + `", "Player", "height=500,width=800,top=50,left=250")' target='_blank'><div class="dynamic_singlebox_un">🔘&nbsp;` + tjlist.data.item[i].owner.name + `</div></a>
                 </div>
             `;
    }
    document.getElementsByTagName("body")[0].innerHTML += WebList;
    document.getElementById("dynamic_loader").style.display = "none";
}

function GetAjax(url, func) {
    runAsync(url,"GET","").then((result)=> {return result;}).then(function(result){
        func(result);
    });
}

function IfFirstPage() {
    let a = window.location.href.replace(".com/", ".com").split("/");
    if (a.length == 3) {return true;}
    else {return false;}
}

(function() {
    'use strict';
    var PageUrl = window.location.href;
    var domain = PageUrl.split("/")[2];

    if((domain == "www.bilibili.com" || domain == "bilibili.com") && IfFirstPage() == true) {
            document.head.innerHTML = `<meta charset='utf-8'>
                <title>哔哩哔哩</title>
                <style></style>
                `;
            document.getElementsByTagName("body")[0].innerHTML = `<div id="dynamic_container">
                    <iframe width="200px" height="400px" id="dynamic_frame"src="https://t.bilibili.com/pages/nav/index_new#/video"></iframe>
                </div>
                <button id="RefreshBtn" class="Btn" title="刷新" onclick="location.reload(); ">🔃</button>
                <div class="Search">
                    <input id="SIpt" style="width:100px;height:100%;" placeholder="搜索...">
                    <label onclick="">🔎</label>
                </div>
                <i id="dynamic_loader" style="display:block;">正在加载,请等待...</i>
                `;

            GM_addStyle("img{width:100%;border-radius:10px;-webkit-user-drag:none;}");
            GM_addStyle("a{text-decoration:none; color:#FFF;}");
            GM_addStyle("body{margin:5px;background-color:#18181c;color:#FFF;font-size:15px;user-select:none;}");
            GM_addStyle(".dynamic_singlebox{height:210px;width:190px;float:left;background:#18181c;overflow:hidden;border-radius:12px;margin:8px;padding:5px;transition:all 0.3s;cursor:pointer;}");
            GM_addStyle(".dynamic_singlebox:hover{transform:scale(1.1,1.1);transform-origin:center center;background:#3b3b3b;}");
            GM_addStyle(".dynamic_singlebox_un{color:#848484;font-size:10px;position:relative;top:8px;width:100%;overflow:hidden;}");
            GM_addStyle(".dynamic_singlebox_vt{color:#FFFFFF;width:100%;height:60px;overflow:hidden;}");
            GM_addStyle("#dynamic_container{background:#3b3b3b;height:100%;width:30%;position:fixed;top:0px;left:98%;z-index:100;transition:all 0.3s;overflow:hidden;border-radius:15px;border-left:1px solid #CCC;}");
            GM_addStyle("#dynamic_container:hover{left:72%;border-radius:1px}");
            GM_addStyle("#dynamic_frame{margin-left:8%;border:none;border-radius:5px;}");
            GM_addStyle(".Btn{position:fixed;right:30px;bottom:30px;z-index:101;height:40px;width:40px;border-radius:12px;background:#f25d8e;color:#FFF;padding:10px;border:none;}");
            GM_addStyle(".Search{position:fixed;right:30px;top:30px;z-index:99;height:25px;width:25px;text-align:right;border-radius:12px;background:#00a1d6;padding:10px;overflow:hidden;transition:all 0.3s;}");
            GM_addStyle(".Search:hover{width:150px;text-align:left;}");

            let w = document.documentElement.clientWidth; let h = document.documentElement.clientHeight;
            document.getElementById("dynamic_frame").height = h; document.getElementById("dynamic_frame").width = w * 0.25;

            for(let i = 0; i < 4; i ++) {
                GetAjax("https://api.bilibili.com/x/web-interface/index/top/rcmd?fresh_type=3", Add2Page);
            }
    } else if(domain == "player.bilibili.com") {
        setTimeout(function() {
            try {
                document.getElementsByClassName("bilibili-player-video-sendjumpbar")[0].remove();
                document.getElementsByClassName("bilibili-player-video-pause-panel-container-qrcode")[0].remove();
            } catch{}
            document.getElementsByTagName("title")[0].innerText = "哔哩哔哩视频播放器";
        }, 1100);

        setTimeout(function() {
            let rlinks = document.getElementsByClassName("bilibili-player-ending-panel-box-recommend");
            for(let i = 0; i < rlinks.length; i ++) {
                rlinks[i].RemoveAttribute("target");
            }
        }, 5000);
    }
})();