☰

Bilibili上下弹幕变字幕

用于突出显示B站的顶部弹幕与底部弹幕，使其呈现Youtube字幕的效果。适用于一些有字幕弹幕的生肉视频。

目前為 2017-11-23 提交的版本，檢視 最新版本。

// ==UserScript==
// @name         Bilibili上下弹幕变字幕
// @namespace    https://space.bilibili.com/68391#!/
// @version      0.2
// @description  用于突出显示B站的顶部弹幕与底部弹幕，使其呈现Youtube字幕的效果。适用于一些有字幕弹幕的生肉视频。
// @author       剧情帝
// @match        https://www.bilibili.com/video/av*
// @match        http://www.bilibili.com/video/av*
// @match        https://www.bilibili.com/watchlater/#/av*
// @match        http://www.bilibili.com/watchlater/#/av*
// @run-at       document-end
// @create       2017-11-16
// @lastmodified 2017-11-24
// ==/UserScript==

(function() {
    'use strict';

    var $style = $('<style id="testStyle" type="text/css"></style>');
    $('head').append($style);
    var sheet = $style[0].sheet;
    var cssRule = '#bofqi .bilibili-player-video-danmaku .bilibili-danmaku:not([style*="transform"]) {';
    cssRule += 'background-color:rgba(0,0,0,0.75);';
    cssRule += ' padding:4px 10px;';
    cssRule += ' opacity:1 !important;';
    cssRule += ' border-radius:3px;';
    cssRule += ' font-size:36px !important;';
    cssRule += ' line-height:1 !important}';
    sheet.insertRule( cssRule);

    function calLight (rgb) {
        rgb = rgb.replace('rgb(', '');
        rgb = rgb.replace(')', '');
        rgb = rgb.split(', ');
        return ((parseInt(rgb[0]) * 0.3 + parseInt(rgb[1]) * 0.6 + parseInt(rgb[2]) * 0.1) / 255);
    }

    var $damunContainer, $currentDanmu;
    //监测弹幕变化
    var observer = new MutationObserver(function(records){
        records.map(function(record){
            if(record.addedNodes.length > 0){
                for (var i = record.addedNodes.length - 1; i >= 0; i--) {
                    $currentDanmu = $(record.addedNodes[i]);
                    if($currentDanmu.css('transform') == 'none'){ //不移动的弹幕，也就是顶端和底端弹幕
                        if(calLight($currentDanmu.css('color')) < 0.5)
                            $currentDanmu.css('text-shadow', 'rgb(255, 255, 255) 1px 0px 1px, rgb(255, 255, 255) 0px 1px 1px, rgb(255, 255, 255) 0px -1px 1px, rgb(255, 255, 255) -1px 0px 1px');
                    }
                }
            }
        });
    });

    //等待弹幕图层的加载
    var damunContainerWaiter = new MutationObserver(function(records){
        $damunContainer = $('#bofqi .bilibili-player-video-danmaku');
        if($damunContainer.length > 0){ //弹幕图层加载完毕
            damunContainerWaiter.disconnect();
            observer.observe($damunContainer[0], {'childList':true});
        }
    });

    damunContainerWaiter.observe($("#bofqi")[0], {'childList':true, 'subtree':true});
})();