Bilibili 笔记功能扩展

恢复Bilibili笔记中被隐藏的功能

目前為 2022-02-20 提交的版本,檢視 最新版本

您需要先安裝使用者腳本管理器擴展,如 TampermonkeyGreasemonkeyViolentmonkey 之後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyViolentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyViolentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyUserscripts 後才能安裝該腳本。

你需要先安裝一款使用者腳本管理器擴展,比如 Tampermonkey,才能安裝此腳本

您需要先安裝使用者腳本管理器擴充功能後才能安裝該腳本。

(我已經安裝了使用者腳本管理器,讓我安裝!)

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

(我已經安裝了使用者樣式管理器,讓我安裝!)

// ==UserScript==
// @name         Bilibili 笔记功能扩展
// @namespace    http://tampermonkey.net/
// @version      0.1.0
// @description  恢复Bilibili笔记中被隐藏的功能
// @author       as042971
// @include      *://www.bilibili.com/video/av*
// @include      *://www.bilibili.com/video/BV*
// @license MIT
// @grant        none
// @esversion    8
// ==/UserScript==

(function() {
    'use strict';
    const inject = function(toolbar) {
        let quill = document.querySelector('.ql-container').__quill;
        let icons = quill.constructor.import('ui/icons');
        // Align
        let alignIcons = icons.align;
        let span = document.createElement('select');
        span.setAttribute('class', 'ql-align ql-bar');
        span.setAttribute('labeltooltip','对齐方式');
        [false, 'center', 'right', 'justify'].forEach(value => {
            const option = document.createElement('option');
            if (value === false) {
                option.setAttribute('selected', 'selected');
            } else {
                option.setAttribute('value', value);
            }
            span.appendChild(option);
        });
        toolbar.insertBefore(span, toolbar.childNodes[toolbar.childNodes.length-2]);
        let Picker = quill.constructor.import('ui/icon-picker');
        let picker = new Picker(span, alignIcons);
        picker.update();
        quill.theme.pickers.push(picker);
        quill.getModule('toolbar').attach(span);

        // Buttons
        let exButtons = [
            {id: 'link', icon: icons.link, tooltip: '标记为链接'},
            {id: 'video', icon: icons.video, tooltip: '嵌入视频'},
            {id: 'code-block', icon: icons.code, tooltip: '标记为代码块'}
        ];
        exButtons.forEach(input =>{
            let button = document.createElement('button');
            button.setAttribute('class', 'ql-' + input.id + ' ql-bar');
            button.setAttribute('type', 'button');
            button.setAttribute('labeltooltip', input.tooltip);
            button.innerHTML = input.icon;
            toolbar.insertBefore(button, toolbar.childNodes[toolbar.childNodes.length-1]);
            quill.getModule("toolbar").attach(button);
        });
    };
    let app = document.getElementById('app');
    let observerOptions = {
      childList: true,
      attributes: false,
      subtree: false
    };
    let observer = new MutationObserver((mutation_records) => {
        let toolbar = document.querySelector('.ql-toolbar');
        if (toolbar) {
            inject(toolbar);
            observer.disconnect();
        }
    });
    observer.observe(app, observerOptions);
})();