Greasy Fork is available in English.

bilibili plus

提供B站截图、获取封面、逐帧等功能,以及默认宽屏模式

// ==UserScript==
// @name         bilibili plus
// @version      0.4.3
// @description  提供B站截图、获取封面、逐帧等功能,以及默认宽屏模式
// @namespace    https://greasyfork.org/zh-CN/users/215623-christian-chen
// @author       化猫之宿
// @encoding     utf-8
//
// @match        *://www.bilibili.com/video/*
// @match        *://www.bilibili.com/bangumi/play/*
// @match        *://www.bilibili.com/blackboard/
//
// @compatible   chrome 54+
// @compatible   firefox 49+
//
// @grant        GM_getValue
// @grant        GM_setValue
// ==/UserScript==

!function(modules) {
    var installedModules = {};
    function __webpack_require__(moduleId) {
        if (installedModules[moduleId]) return installedModules[moduleId].exports;
        var module = installedModules[moduleId] = {
            i: moduleId,
            l: !1,
            exports: {}
        };
        return modules[moduleId].call(module.exports, module, module.exports, __webpack_require__), 
        module.l = !0, module.exports;
    }
    __webpack_require__.m = modules, __webpack_require__.c = installedModules, __webpack_require__.d = function(exports, name, getter) {
        __webpack_require__.o(exports, name) || Object.defineProperty(exports, name, {
            enumerable: !0,
            get: getter
        });
    }, __webpack_require__.r = function(exports) {
        "undefined" != typeof Symbol && Symbol.toStringTag && Object.defineProperty(exports, Symbol.toStringTag, {
            value: "Module"
        }), Object.defineProperty(exports, "__esModule", {
            value: !0
        });
    }, __webpack_require__.t = function(value, mode) {
        if (1 & mode && (value = __webpack_require__(value)), 8 & mode) return value;
        if (4 & mode && "object" == typeof value && value && value.__esModule) return value;
        var ns = Object.create(null);
        if (__webpack_require__.r(ns), Object.defineProperty(ns, "default", {
            enumerable: !0,
            value: value
        }), 2 & mode && "string" != typeof value) for (var key in value) __webpack_require__.d(ns, key, function(key) {
            return value[key];
        }.bind(null, key));
        return ns;
    }, __webpack_require__.n = function(module) {
        var getter = module && module.__esModule ? function() {
            return module.default;
        } : function() {
            return module;
        };
        return __webpack_require__.d(getter, "a", getter), getter;
    }, __webpack_require__.o = function(object, property) {
        return Object.prototype.hasOwnProperty.call(object, property);
    }, __webpack_require__.p = "", __webpack_require__(__webpack_require__.s = 0);
}([ function(module, exports) {
    ({
        inject: function(is_userscript) {
            const BILINAMES = {
                menuBar: "bpx-player-dm-root",
                bilibiliPlayer: "bilibili-player",
                playerArea: "bpx-player-container",
                playPause: [ "bpx-player-ctrl-play", "squirtle-play-wrap" ],
                wideBtn: [ "bpx-player-ctrl-wide", "squirtle-video-widescreen" ],
                wideExtend: [ "bpx-state-entered", "active" ],
                sideBar: "bui-collapse-wrap",
                sideBarClose: "bui-collapse-wrap-folded",
                sideBarArrow: "bui-collapse-arrow",
                videoInfo: "bpx-player-video-info",
                btnClass: [ "button-mode", "button-pic", "button-screen", "button-pre", "button-next" ]
            };
            let user_settings, fps, side_bar, root, player_area, counter;
            fps = 29.97, counter = 0, user_settings = JSON.parse(document.documentElement.dataset.localsettings);
            const set = (setting, new_value) => {
                "user_settings" !== setting ? user_settings[setting] = new_value : user_settings = setting, 
                document.documentElement.dataset.localsettings = JSON.stringify(user_settings);
            }, key = {
                fullscreenEnabled: 0,
                fullscreenchange: 1
            }, webkit = [ "webkitFullscreenEnabled", "webkitfullscreenchange" ], eventKeys = ("fullscreenEnabled" in document && Object.keys(key) || webkit[0] in document && webkit || document, 
            e => {
                switch (e.code.toLowerCase()) {
                  case "period":
                    root.querySelector(".button-next").click();
                    break;

                  case "comma":
                    root.querySelector(".button-pre").click();
                }
            });
            function modeWide(e, flag = !0) {
                let player, playerArea, btn_wide, wide_flag;
                if (player = document.querySelector("#" + BILINAMES.bilibiliPlayer), playerArea = document.querySelector("." + BILINAMES.playerArea), 
                player && "wide" != playerArea.dataset.screen) {
                    for (let i = 0; i < BILINAMES.wideBtn.length && (wide_flag = i, btn_wide = player.querySelector("." + BILINAMES.wideBtn[i]), 
                    !btn_wide); i++) ;
                    btn_wide && !btn_wide.classList.contains("." + BILINAMES.wideExtend[wide_flag]) && btn_wide.click();
                }
                e.querySelectorAll(".button-mode-svg").forEach(element => {
                    element.classList.toggle("svg-display");
                }), flag && (user_settings.MODE_WIDE ? user_settings.MODE_WIDE = !1 : user_settings.MODE_WIDE = !0, 
                user_settings.MODE_WIDE && user_settings.MODE_DOWN && modeDown(e.parentNode.querySelector(".button-mode-dropdown")), 
                set("MODE_WIDE", user_settings.MODE_WIDE));
            }
            function modeDown(e, flag = !0) {
                let side_column, expand;
                side_column = document.querySelector("." + BILINAMES.sideBar), side_column && side_column.classList.contains(BILINAMES.sideBarClose) && (expand = side_column.querySelector("." + BILINAMES.sideBarArrow), 
                expand.click()), e.querySelectorAll(".button-mode-svg").forEach(element => {
                    element.classList.toggle("svg-display");
                }), flag && (user_settings.MODE_DOWN ? user_settings.MODE_DOWN = !1 : user_settings.MODE_DOWN = !0, 
                user_settings.MODE_DOWN && user_settings.MODE_WIDE && modeWide(e.parentNode.querySelector(".button-mode-wide")), 
                set("MODE_DOWN", user_settings.MODE_DOWN));
            }
            const pauseVideo = video => {
                let btnStart;
                for (let i = 0; i < BILINAMES.playPause.length && (btnStart = document.querySelector("." + BILINAMES.playPause), 
                !btnStart); i++) ;
                btnStart && player_area && !player_area.classList.contains("bpx-state-paused") ? btnStart.click() : video.pause();
            }, popPage = (obj, x, y) => {
                let popOut, width, height, pop_url;
                return width = x, height = y, "string" == typeof obj ? (pop_url = obj, popOut = window.open(pop_url, "popOut", "width=" + width + ",height=" + height)) : "object" == typeof obj && (popOut = window.open("", "_blank", "width=" + width + ",height=" + height), 
                popOut.document.body.appendChild(obj)), popOut.focus(), popOut;
            }, getScreenshot = () => {
                let video, canvas, context, width, height, pop, style;
                video = document.querySelector("video"), canvas = document.createElement("canvas"), 
                context = canvas.getContext("2d"), width = video.videoWidth, height = video.videoHeight, 
                canvas.width = width, canvas.height = height, context.drawImage(video, 0, 0, width, height), 
                pauseVideo(video), pop = popPage(canvas, width, height), style = document.createElement("style"), 
                style.type = "text/css", style.innerHTML = "body {\n              margin: 0;\n              width: 100%;\n              height: 100%;\n              display: flex;\n              justify-content: center;\n              align-items: center;\n              background-color: #ccc;\n             }\n             canvas {\n              max-width: 100%;\n              max-height: 100%;\n             }", 
                pop.document.head.appendChild(style);
            }, getThumb = () => {
                const queryList = [ '[itemprop="image"]', '[itemprop="thumbnailUrl"]', '[property="og:image"]' ];
                let thumbnail_url;
                for (let i = 0; i < queryList.length && (thumbnail_url = document.querySelector(queryList[i]), 
                !thumbnail_url); i++) ;
                thumbnail_url = thumbnail_url && thumbnail_url.getAttribute("content"), thumbnail_url ? popPage(thumbnail_url, 881, 551) : alert("未找到缩略图!");
            }, seekFrame = (direction, fps) => {
                let video;
                video = document.querySelector("video"), pauseVideo(video), "forward" === direction ? video.currentTime = video.currentTime + 1 / fps : "backward" === direction && (video.currentTime = video.currentTime - 1 / fps);
            }, main = () => {
                if (root = document.querySelector("." + BILINAMES.menuBar), player_area = document.querySelector("." + BILINAMES.playerArea), 
                side_bar = document.querySelector("." + BILINAMES.sideBar), root && side_bar && player_area) (() => {
                    const infoArea = document.querySelector("." + BILINAMES.videoInfo), divide = infoArea.querySelector(".bpx-player-video-info-divide");
                    infoArea.removeChild(divide), infoArea.style.flexDirection = "column", infoArea.style.height = "100%", 
                    infoArea.style.marginRight = "10px", infoArea.style.fontSize = "10px", infoArea.style.justifyContent = "center";
                })(), (() => {
                    let button_next, button_pre, button_pic, button_screen, button_mode;
                    document.querySelector(".button-next") || (button_next = document.createElement("div"), 
                    button_next.className = "bpx-player-dm-switch bui-danmaku-switch button-pre", button_next.innerHTML = '<span class="bp-svgicon">\n                <svg viewBox="0 0 1024 1024"  xmlns="http://www.w3.org/2000/svg">\n                  <path d="M780.288 767.082667c40.405333 40.725333 40.512 106.645333 0.192 147.264l-36.096 36.373333a103.36 103.36 0 0 1-146.944-0.085333L249.685333 600.213333a125.290667 125.290667 0 0 1 0-176.490666L597.44 73.322667a103.466667 103.466667 0 0 1 146.944-0.085334l36.096 36.352c40.362667 40.682667 40.192 106.56-0.192 147.264L527.104 511.978667l253.184 255.104zM436.693333 542.016a42.666667 42.666667 0 0 1 0-60.096L719.722667 196.736a19.328 19.328 0 0 0 0.192-27.029333l-36.096-36.352a18.154667 18.154667 0 0 0-25.813334 0.064L310.250667 483.84a39.957333 39.957333 0 0 0 0 56.256l347.754666 350.421333a18.026667 18.026667 0 0 0 25.813334 0.085334l36.096-36.373334a19.349333 19.349333 0 0 0-0.192-27.029333L436.693333 542.037333z">\n                  </path>\n                </svg>\n              </span>\n              <span class="bpx-player-tooltip-item">逐帧后退 &lt;</span>', 
                    button_pre = document.createElement("div"), button_pre.className = "bpx-player-dm-switch bui-danmaku-switch button-next", 
                    button_pre.innerHTML = '<span class="bp-svgicon">\n                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024">\n                  <path d="M304.085333 854.229333l36.096 36.373334a18.026667 18.026667 0 0 0 25.813334-0.085334l347.754666-350.421333a39.957333 39.957333 0 0 0 0-56.256L365.994667 133.418667a18.154667 18.154667 0 0 0-25.813334-0.064l-36.096 36.352a19.328 19.328 0 0 0 0.192 27.029333L587.306667 481.92a42.666667 42.666667 0 0 1 0 60.117333L304.277333 827.2a19.349333 19.349333 0 0 0-0.192 27.029333zM496.896 512L243.712 256.853333c-40.384-40.682667-40.533333-106.56-0.192-147.242666l36.096-36.352a103.466667 103.466667 0 0 1 146.944 0.085333l347.754667 350.4a125.290667 125.290667 0 0 1 0 176.490667L426.56 950.634667a103.36 103.36 0 0 1-146.944 0.085333l-36.096-36.373333c-40.32-40.618667-40.213333-106.538667 0.192-147.264L496.896 512z">\n                  </path>\n                </svg>\n              </span>\n              <span class="bpx-player-tooltip-item">逐帧前进 &gt;</span>', 
                    button_pic = document.createElement("div"), button_pic.className = "bpx-player-dm-switch bui-danmaku-switch button-pic", 
                    button_pic.innerHTML = '<span class="bp-svgicon">\n                <svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg">\n                  <path d="M42.666667 149.482667A106.752 106.752 0 0 1 149.482667 42.666667h725.034666A106.752 106.752 0 0 1 981.333333 149.482667v725.034666A106.752 106.752 0 0 1 874.517333 981.333333H149.482667A106.752 106.752 0 0 1 42.666667 874.517333V149.482667z m853.333333 430.186666V149.482667C896 137.578667 886.421333 128 874.517333 128H149.482667C137.578667 128 128 137.578667 128 149.482667v515.52l97.834667-97.834667A42.666667 42.666667 0 0 1 281.6 563.2l138.666667 104.021333 229.994666-268.330666a42.666667 42.666667 0 0 1 62.570667-2.389334L896 579.669333zM128 874.624C128 886.485333 137.557333 896 149.482667 896h725.034666A21.333333 21.333333 0 0 0 896 874.730667v-174.4l-210.922667-210.922667-226.005333 263.68a42.666667 42.666667 0 0 1-58.005333 6.378667l-141.056-105.813334L128 785.685333v88.96zM341.333333 426.666667a85.333333 85.333333 0 1 1 0-170.666667 85.333333 85.333333 0 0 1 0 170.666667z">\n                  </path>\n                </svg>\n              </span>\n              <span class="bpx-player-tooltip-item">缩略图</span>', 
                    button_screen = document.createElement("div"), button_screen.className = "bpx-player-dm-switch bui-danmaku-switch button-screen", 
                    button_screen.innerHTML = '<span class="bp-svgicon">\n                <svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg">\n                  <path d="M329.344 165.333333A42.666667 42.666667 0 0 1 362.666667 149.333333h298.666666a42.666667 42.666667 0 0 1 33.322667 16l72.533333 90.666667H874.666667a106.666667 106.666667 0 0 1 106.666666 106.474667V768.213333A106.56 106.56 0 0 1 874.752 874.666667H149.205333A106.538667 106.538667 0 0 1 42.666667 768.192V362.453333A106.666667 106.666667 0 0 1 149.333333 256h107.498667l72.533333-90.666667zM383.168 234.666667l-72.533333 90.666666A42.666667 42.666667 0 0 1 277.333333 341.333333H149.333333a21.333333 21.333333 0 0 0-21.333333 21.141334V768.213333c0 11.626667 9.514667 21.141333 21.205333 21.141334h725.546667c11.733333 0 21.248-9.514667 21.248-21.141334V362.453333A21.333333 21.333333 0 0 0 874.666667 341.333333h-128a42.666667 42.666667 0 0 1-33.322667-16l-72.533333-90.666666H383.189333zM512 725.333333a192 192 0 1 1 0-384 192 192 0 0 1 0 384z m0-85.333333a106.666667 106.666667 0 1 0 0-213.333333 106.666667 106.666667 0 0 0 0 213.333333z">\n                  </path>\n                </svg>\n              </span>\n              <span class="bpx-player-tooltip-item">截图</span>', 
                    button_mode = document.createElement("div"), button_mode.className = "bpx-player-dm-switch bui-danmaku-switch button-mode", 
                    button_mode.innerHTML = '<span class="bp-svgicon">\n                <svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg">\n                  <path d="M42.666667 149.376A106.645333 106.645333 0 0 1 149.376 42.666667h42.581333A106.645333 106.645333 0 0 1 298.666667 149.376v42.581333A106.645333 106.645333 0 0 1 191.957333 298.666667H149.376A106.645333 106.645333 0 0 1 42.666667 191.957333V149.376z m85.333333 0v42.581333A21.312 21.312 0 0 0 149.376 213.333333h42.581333A21.312 21.312 0 0 0 213.333333 191.957333V149.376A21.312 21.312 0 0 0 191.957333 128H149.376A21.312 21.312 0 0 0 128 149.376z m-85.333333 341.333333A106.645333 106.645333 0 0 1 149.376 384h42.581333A106.645333 106.645333 0 0 1 298.666667 490.709333v42.581334A106.645333 106.645333 0 0 1 191.957333 640H149.376A106.645333 106.645333 0 0 1 42.666667 533.290667v-42.581334z m85.333333 0v42.581334A21.312 21.312 0 0 0 149.376 554.666667h42.581333A21.312 21.312 0 0 0 213.333333 533.290667v-42.581334A21.312 21.312 0 0 0 191.957333 469.333333H149.376A21.312 21.312 0 0 0 128 490.709333z m-85.333333 341.333334A106.645333 106.645333 0 0 1 149.376 725.333333h42.581333A106.645333 106.645333 0 0 1 298.666667 832.042667v42.581333A106.645333 106.645333 0 0 1 191.957333 981.333333H149.376A106.645333 106.645333 0 0 1 42.666667 874.624v-42.581333z m85.333333 0v42.581333A21.312 21.312 0 0 0 149.376 896h42.581333A21.312 21.312 0 0 0 213.333333 874.624v-42.581333A21.312 21.312 0 0 0 191.957333 810.666667H149.376A21.312 21.312 0 0 0 128 832.042667z m256-682.666667A106.624 106.624 0 0 1 490.474667 42.666667H874.88A106.517333 106.517333 0 0 1 981.333333 149.376v42.581333A106.624 106.624 0 0 1 874.858667 298.666667H490.453333A106.517333 106.517333 0 0 1 384 191.957333V149.376z m85.333333 0v42.581333A21.184 21.184 0 0 0 490.474667 213.333333H874.88A21.290667 21.290667 0 0 0 896 191.957333V149.376A21.184 21.184 0 0 0 874.858667 128H490.453333A21.290667 21.290667 0 0 0 469.333333 149.376z m-85.333333 341.333333A106.624 106.624 0 0 1 490.474667 384H874.88A106.517333 106.517333 0 0 1 981.333333 490.709333v42.581334A106.624 106.624 0 0 1 874.858667 640H490.453333A106.517333 106.517333 0 0 1 384 533.290667v-42.581334z m85.333333 0v42.581334A21.184 21.184 0 0 0 490.474667 554.666667H874.88A21.290667 21.290667 0 0 0 896 533.290667v-42.581334A21.184 21.184 0 0 0 874.858667 469.333333H490.453333A21.290667 21.290667 0 0 0 469.333333 490.709333z m-85.333333 341.333334A106.624 106.624 0 0 1 490.474667 725.333333H874.88A106.517333 106.517333 0 0 1 981.333333 832.042667v42.581333A106.624 106.624 0 0 1 874.858667 981.333333H490.453333A106.517333 106.517333 0 0 1 384 874.624v-42.581333z m85.333333 0v42.581333A21.184 21.184 0 0 0 490.474667 896H874.88A21.290667 21.290667 0 0 0 896 874.624v-42.581333A21.184 21.184 0 0 0 874.858667 810.666667H490.453333A21.290667 21.290667 0 0 0 469.333333 832.042667z">\n                  </path>\n                </svg>\n              </span>\n              <div class="show-mode" style="display: none;">\n                <div class="show-mode-wrap">\n                  <div style="text-align: center;width: max-content;margin: 0 auto;">模式选择</div>\n                  <div class="button-mode-selects button-mode-wide"> \n                      <span class="button-mode-svg"> \n                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 896.2">\n                          <path d="M903.5,552.2c-73.2,0-121.4,60.4-120.5,120.5c-1.2,66.4,54.1,120.5,120.5,120.5s120.5-54,120.5-120.5\n                            S969.9,552.2,903.5,552.2z M903.5,766.5c-51.7,0-93.7-42-93.7-93.7c0-20.9,7-40.4,18.7-56L959.7,748\n                            C944,759.5,924.7,766.5,903.5,766.5z M978.5,728.7L847.3,597.5c15.5-11.8,35.1-18.7,56-18.7c51.7,0,93.7,42,93.7,93.7\n                            C997.3,693.9,990.3,713.2,978.5,728.7z"/>\n                          <path d="M832,87H192C86.7,87,0,149.8,0,226.2v371.3C0,674,86.7,736.8,192,736.8h572.1c-16.8-63.5,6.8-139.8,27.6-165.4\n                            c59.6-73.6,199.3-50.7,232.3,23.1V226.2C1024,149.8,937.3,87,832,87z M933.6,226.9l-2.9,262.9c-83.4-5.4-125,4-158.6,34.9\n                            c-34.8,32-53.7,80.6-57.7,148.1L192,673.1c-37.7,3.5-106.3-46.8-103.9-75.6l0.5-370.4c-5.6-46.6,70.3-78.1,104.9-76.9l0,0l637.8,0.5\n                            C870.9,148.8,938.2,199.5,933.6,226.9z"/>\n                          <path d="M817.3,409.6L672,312.2c-8.8-5.9-20.2-9.2-32-9.2c-26.5,0-48.3,16.6-48.3,36.8c0,10.5,5.9,20.6,16.3,27.5l105,70.2\n                            l-105,70.2c-10.2,6.9-16.1,16.9-16.1,27.3c0,20,21.7,36.5,48,36.5h0.1c11.8,0.1,23.2-3.2,32-9.3l145.3-97.4\n                            c10.4-6.9,16.4-17,16.4-27.5C833.7,426.6,827.7,416.6,817.3,409.6z"/>\n                          <path d="M449.6,339.7c0-20.2-21.8-36.8-48.3-36.8c-11.8,0-23.2,3.3-32,9.2L224,409.6c-10.4,6.9-16.4,17-16.4,27.5\n                            c0,10.5,6,20.6,16.4,27.5l145.3,97.4c8.8,6,20.2,9.3,32,9.3h0h0.1c26.3,0,48-16.5,48-36.5c0-10.4-5.9-20.4-16.1-27.3l-105-70.2\n                            l105-70.2C443.6,360.3,449.6,350.3,449.6,339.7z"/>\n                        </svg>\n                      </span>\n                      <span class="button-mode-svg svg-display" style="fill: #00a1d6;"> \n                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 896.2">\n                          <path d="M832,87H192C86.7,87,0,149.8,0,226.2v371.3C0,674,86.7,736.8,192,736.8h640c105.3,0,192-62.9,192-139.3V226.2\n                            C1024,149.8,937.3,87,832,87z M830.7,673.4L192,673.1c-37.7,3.5-106.3-46.8-103.9-75.6l0.5-370.4c-5.6-46.6,70.3-78.1,104.9-76.9\n                            l0,0l637.8,0.5c39.7-1.9,106.9,48.8,102.4,76.2l0,370.5C937.8,627.8,869.1,677.3,830.7,673.4z"/>\n                          <path d="M449.6,339.7c0-20.2-21.8-36.8-48.3-36.8c-11.8,0-23.2,3.3-32,9.2L224,409.6c-10.4,6.9-16.4,17-16.4,27.5\n                            c0,10.5,6,20.6,16.4,27.5l145.3,97.4c8.8,6,20.2,9.3,32,9.3h0h0.1c26.3,0,48-16.5,48-36.5c0-10.4-5.9-20.4-16.1-27.3l-105-70.2\n                            l105-70.2C443.6,360.3,449.6,350.3,449.6,339.7z"/>\n                          <path d="M817.3,409.6L672,312.2c-8.8-5.9-20.2-9.2-32-9.2c-26.5,0-48.3,16.6-48.3,36.8c0,10.5,5.9,20.6,16.3,27.5l105,70.2\n                            l-105,70.2c-10.2,6.9-16.1,16.9-16.1,27.3c0,20,21.7,36.5,48,36.5h0.1c11.8,0.1,23.2-3.2,32-9.3l145.3-97.4\n                            c10.4-6.9,16.4-17,16.4-27.5C833.7,426.6,827.7,416.6,817.3,409.6z"/>\n                        </svg>\n                      </span>\n                      <span class="button-mode-text">宽屏</span>\n                  </div>\n                  <div class="button-mode-selects button-mode-dropdown"> \n                      <span class="button-mode-svg"> \n                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024">\n                          <path d="M722.2,762.5c-73.2,0-121.4,60.4-120.5,120.5c-1.2,66.4,54.1,120.5,120.5,120.5s120.5-54,120.5-120.5\n                            S788.6,762.5,722.2,762.5z M722.2,976.8c-51.7,0-93.7-42-93.7-93.7c0-20.9,7-40.4,18.7-56l131.2,131.2\n                            C762.7,969.8,743.4,976.8,722.2,976.8z M797.2,939L666,807.8c15.5-11.8,35.1-18.7,56-18.7c51.7,0,93.7,42,93.7,93.7\n                            C816,904.2,809,923.5,797.2,939z"/>\n                          <path d="M442.4,376.3l16.4-18.1l-46.9-45.5l-26.2,26H372l6.2-58.5h13.3v19l54.3-8.4v-118l12.1-16.3l-43.3-40.4l-23.8,23.7h-70.3\n                            l7.4,33.4h63.6v73.2h-9.7l0.4-1.9l-52.7-10.2c-4.7,38.4-10,84.6-16,138.4h54.7v-0.5h18.3l-1.6,78.5c-0.3,19.8-2.6,29.7-7,29.7\n                            c-15.4,0-28.6-1.9-39.8-5.6l-2,28.8c16.1,5.9,24.5,19.5,25,40.9h26.2C424,544.5,442.4,488.4,442.4,376.3z"/>\n                          <path d="M513,376.4h25.4V414h-88.6l7,34.4h81.6v87.8l52.7-6v-81.8h77.7l16.8-19.5l-29.7-37.6l-18,22.8H591v-37.7h25.4v13.5l48.8-7\n                            V243.6l13.7-16.7l-43.3-39.5l-22.3,20h-7c21.9-22,41.4-45.4,58.6-70.2l-61.3-26c-14.8,39-30.8,71.1-48,96.2h-41.8l44.1-40.4\n                            c-28.1-28.8-48.4-46.8-60.9-53.9l-29.3,26c13.8,15.2,26.8,34.4,39,57.6l-43.3-6.1v207.7l49.6-7.4V376.4z M591.1,239.4h25.4v34.8\n                            h-25.4V239.4z M591.1,306.8h25.4V343h-25.4V306.8z M513,239.4h25.4v34.8H513V239.4z M513,306.8h25.4V343H513V306.8z"/>\n                          <polygon points="362.1,612.5 499.5,750.5 641.1,612.5 "/>\n                          <path d="M622.6,780c44.5-51.1,150.1-63.7,212.3,6l8.1-433.9c0-131.8-73.6-250.7-186.8-301.6l-42.1-18.9\n                            C542.4-0.7,462.1-2.3,389.4,27l-35.9,14.5C234.9,89.4,156.3,211.4,156.3,347.6l0,340.5c0,156,102.5,290.2,244.9,320.7l41.5,8.9\n                            c38.8,8.3,79.1,2.5,117.5,0.3l90.5-9.3C552.4,958.9,573.5,836.3,622.6,780z M563.1,989.4c-41.5,9.4-84.3,9.3-125.7-0.2l-3.2-0.7\n                            C293.6,956.4,193,823,193,668.6V367.1c0-134.2,76.3-254.8,192.5-304.1l0,0c72.9-30.9,154-30.5,226.6,1.2l9.2,4\n                            c114.7,50.1,189.7,169.9,189.7,302.9l0.8,351c-82.7-29.4-174.7-18-220.5,40.5c-42.7,54.5-55.6,131-22.1,225.5L563.1,989.4z"/>\n                        </svg>\n                      </span>\n                      <span class="button-mode-svg svg-display" style="fill: #00a1d6;"> \n                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024">\n                          <path d="M681.6,44.3l-42.1-18.9c-71.6-32.2-152-33.8-224.7-4.5L379,35.4C260.3,83.3,181.8,205.3,181.8,341.5l0,340.5\n                              c0,156,102.5,290.2,244.9,320.7l41.5,8.9c38.8,8.3,78.7,8.4,117.5,0.3l36.5-7.6c143-29.9,246.3-164.5,246.3-321V346\n                              C868.4,214.2,794.8,95.3,681.6,44.3z M836.4,661.8c0,154.7-100.9,288.2-241.8,320l-6,1.4c-41.5,9.4-84.3,9.3-125.7-0.2l-3.2-0.7\n                              c-140.6-32.1-241.1-165.5-241.1-319.9V360.9c0-134.2,76.3-254.8,192.5-304.1l0,0c72.9-30.9,154-30.5,226.6,1.2l9.2,4\n                              c114.7,50.1,189.7,169.9,189.7,302.9V661.8z"/>\n                          <polygon points="525,750.5 666.6,612.5 387.6,612.5 "/>\n                          <path d="M663.4,414.1h-46.9v-37.7h25.4v13.5l48.8-7V243.6l13.7-16.7l-43.3-39.5l-22.3,20h-7c21.9-22,41.4-45.4,58.6-70.2l-61.3-26\n                              c-14.8,39-30.8,71.1-48,96.2h-41.8l44.1-40.4c-28.1-28.8-48.4-46.8-60.9-53.9l-29.3,26c13.8,15.2,26.8,34.4,39,57.6l-43.3-6.1v207.7\n                              l49.6-7.4v-14.5h25.4V414h-88.6l7,34.4h81.6v87.8l52.7-6v-81.8h77.7l16.8-19.5l-29.7-37.6L663.4,414.1z M616.6,239.4H642v34.8h-25.4\n                              V239.4z M616.6,306.8H642V343h-25.4V306.8z M563.9,343h-25.4v-36.2h25.4V343z M563.9,274.2h-25.4v-34.8h25.4V274.2z"/>\n                          <path d="M467.9,376.3l16.4-18.1l-46.9-45.5l-26.2,26h-13.7l6.2-58.5H417v19l54.3-8.4v-118l12.1-16.3l-43.3-40.4l-23.8,23.7H346\n                              l7.4,33.4H417v73.2h-9.7l0.4-1.9L355,234.3c-4.7,38.4-10,84.6-16,138.4h54.7v-0.5H412l-1.6,78.5c-0.3,19.8-2.6,29.7-7,29.7\n                              c-15.4,0-28.6-1.9-39.8-5.6l-2,28.8c16.1,5.9,24.5,19.5,25,40.9h26.2C449.5,544.5,467.9,488.4,467.9,376.3z"/>\n                      </svg>\n                      </span>\n                      <span class="button-mode-text">下拉</span>\n                  </div>\n                </div>  \n                <div class="show-mode-bridge"></div>\n              </div>', 
                    root.prepend(button_mode, button_pic, button_screen, button_next, button_pre));
                })(), (root_el => {
                    root_el.addEventListener("click", ("fullscreenEnabled" in document && Object.keys(key) || webkit[0] in document && webkit || document, 
                    e => {
                        for (let el = e.target; el !== e.currentTarget; el = el.parentElement) el.classList.contains("button-pic") && getThumb(), 
                        el.classList.contains("button-screen") && getScreenshot(), el.classList.contains("button-next") && seekFrame("forward", 29.97), 
                        el.classList.contains("button-pre") && seekFrame("backward", 29.97), el.classList.contains("button-mode-wide") && modeWide(el), 
                        el.classList.contains("button-mode-dropdown") && modeDown(el);
                    })), root_el.addEventListener("mouseover", (function(e) {
                        for (let el = e.target; el !== e.currentTarget; el = el.parentElement) el.classList.contains(BILINAMES.btnClass[0]) && (el.querySelector(".show-mode").style.display = "block"), 
                        BILINAMES.btnClass.forEach((btn, ind) => {
                            if (0 != ind && el.classList.contains(btn)) {
                                const item = el.querySelector(".bpx-player-tooltip-item");
                                item.style.position = "absolute", item.style.width = "max-content", item.style.visibility = "visible", 
                                item.style.opacity = 1, item.style.top = "-35px", item.style.left = "-20px";
                            }
                        });
                    })), root_el.addEventListener("mouseout", (function(e) {
                        for (let el = e.target; el !== e.currentTarget; el = el.parentElement) el.classList.contains(BILINAMES.btnClass[0]) && (el.querySelector(".show-mode").style.display = "none"), 
                        BILINAMES.btnClass.forEach((btn, ind) => {
                            0 != ind && el.classList.contains(btn) && (el.querySelector(".bpx-player-tooltip-item").style = "");
                        });
                    }));
                    const eventClick = () => {
                        window.removeEventListener("keydown", eventKeys);
                    };
                    player_area.addEventListener("click", e => {
                        window.addEventListener("keydown", eventKeys), document.addEventListener("click", eventClick, {
                            once: !0
                        }), e.stopPropagation();
                    });
                })(root), (settings => {
                    let button_mode;
                    button_mode = root.querySelector(".button-mode"), setTimeout(() => {
                        settings.MODE_WIDE && modeWide(button_mode.querySelector(".button-mode-wide"), !1), 
                        settings.MODE_DOWN && modeDown(button_mode.querySelector(".button-mode-dropdown"), !1);
                    }, 500);
                })(user_settings), ((playerArea, setting) => {
                    let currentVideo = null;
                    const player = document.querySelector("#" + BILINAMES.bilibiliPlayer), video = playerArea.querySelector("video");
                    video && video.addEventListener("loadedmetadata", e => {
                        let btn_wide, wide_flag;
                        for (let i = 0; i < BILINAMES.wideBtn.length && (wide_flag = i, btn_wide = player.querySelector("." + BILINAMES.wideBtn[i]), 
                        !btn_wide); i++) ;
                        currentVideo != e.target.src && (currentVideo = e.target.src, "wide" != playerArea.dataset.screen && setting.MODE_WIDE && btn_wide && !btn_wide.classList.contains("." + BILINAMES.wideExtend[wide_flag]) && btn_wide.click());
                    });
                })(player_area, user_settings), new MutationObserver(() => {
                    counter = 0, setTimeout(main, 100);
                }).observe(document.querySelector(".bpx-player-video-wrap"), {
                    childList: !0
                }); else {
                    if (counter++, counter > 30) return;
                    setTimeout(main, 300);
                }
            };
            main();
        },
        setup: function() {
            let css_holder, holder;
            css_holder = document.createElement("style"), css_holder.type = "text/css", css_holder.innerHTML = ".show-mode {\n            display: flex;\n            flex-direction: column;\n            align-items: center;\n            position: absolute;\n            z-index: 71;\n            bottom: 46px;\n            left: -40px;\n            background-color: rgba(0, 0, 0, 0.8);\n            font-size: 12px;\n            padding: 5px 15px;\n            color: hsla(0,0%,100%,.8);\n            fill: hsla(0,0%,100%,.8);\n            cursor: auto;\n          }\n          \n          .show-mode .show-mode-bridge {\n            width: 100%;\n            height: 23px;\n            position: absolute;\n            top: 132px;\n          }\n         \n          .button-mode-selects {\n            width: max-content;\n            height: 46px;\n            cursor: pointer;\n            text-align: left;\n          }\n          \n          .button-mode-selects.opened {\n            fill:#00a1d6; \n          }\n          \n          .button-mode-selects:hover {\n            color: hsla(0,0%,100%,1);\n            fill: hsla(0,0%,100%,1);\n          }\n          .button-mode-selects.opened:hover {\n            color: hsla(0,0%,100%,1);\n            fill:#00a1d6; \n          }\n          \n          .button-mode-svg {\n            display: inline-block;\n            font-size: 0;\n            vertical-align: middle;\n            height: 32px;\n            width: 32px;\n          }\n          \n          .bp-svgicon svg {\n            width: 100%;\n            height: 100%;\n          }\n          \n          .button-mode-text {\n            display: inline-block;\n            height: 16px;\n            line-height: 16px;\n            padding-left: 10px;\n          }\n          \n          .svg-display {\n            display: none;\n          }\n          \n          @media screen and (min-width: 1681px)\n          {\n            .bpx-player-dm-switch {\n              margin-right: 12px;\n            }\n          }\n\n          @media screen and (max-width: 860px) {\n            .bpx-player-container[data-screen=full] .bpx-player-control-bottom .bpx-player-control-bottom-left {\n              min-width: 108px;\n            }\n            .bpx-player-container[data-screen=full] .bpx-player-control-bottom .bpx-player-control-bottom-left .bpx-player-ctrl-time {\n              position: absolute;\n              top: 40px;\n            }\n            .bpx-player-container[data-screen=full] .bpx-player-control-bottom .bpx-player-control-bottom-center {\n              min-width: 150px;\n              padding: 0 2px;\n            }\n            .bpx-player-container[data-screen=full] .bpx-player-control-bottom .bpx-player-control-bottom-center .bpx-player-dm-root {\n              width: 100%;\n            }\n            .bpx-player-container[data-screen=full] .bpx-player-control-bottom .bpx-player-control-bottom-center .bpx-player-dm-root div {\n              margin-right: 2px;\n            }\n            .bpx-player-container[data-screen=full] .bpx-player-control-bottom .bpx-player-control-bottom-right {\n              min-width: 150px;\n            }\n          }\n          .bpx-player-container[data-screen=full] .bpx-player-control-bottom .bpx-player-control-bottom-right .bpx-player-ctrl-eplist {\n            width: max-content;\n          }\n          .bpx-player-container[data-screen=full] .bpx-player-control-bottom .bpx-player-control-bottom-right .bpx-player-ctrl-eplist .bpx-player-ctrl-eplist-result {\n            width: max-content;\n          }\n          .bpx-player-container[data-screen=full] .bpx-player-control-bottom .bpx-player-control-bottom-right .bpx-player-ctrl-playbackrate {\n            width: max-content;\n          }\n          .bpx-player-container[data-screen=full] .bpx-player-control-bottom .bpx-player-control-bottom-right .bpx-player-ctrl-playbackrate .bpx-player-ctrl-playbackrate-result {\n            width: max-content;\n          }\n          ", 
            holder = document.createElement("script"), holder.textContent = `(${this.inject}(${this.is_userscript}))`, 
            document.head.appendChild(css_holder), document.documentElement.appendChild(holder);
        },
        conveyMeassge: function() {
            let data_key, gate, sets, observe, default_settings;
            data_key = "localsettings", gate = document.documentElement, sets = JSON.parse(gate.dataset.localsettings || null), 
            default_settings = {
                MODE_WIDE: !1,
                MODE_DANMU_CLOSE: !1,
                MODE_DOWN: !1
            }, sets || (gate.dataset.localsettings = JSON.stringify(this.GM_getValue(this.data, default_settings))), 
            observe = new MutationObserver(() => {
                this.GM_setValue(this.data, JSON.parse(gate.dataset.localsettings || null));
            }), observe.observe(gate, {
                attributes: !0,
                attributeFilter: [ "data-localsettings" ]
            });
        },
        ini: function() {
            this.is_userscript = "object" == typeof GM_info, this.data = "userSettings", this.GM_setValue = GM_setValue, 
            this.GM_getValue = GM_getValue, this.conveyMeassge(), this.setup();
        }
    }).ini();
} ]);