bilibili增强

:zh-cn

2024-05-24 يوللانغان نەشرى. ئەڭ يېڭى نەشرىنى كۆرۈش.

// ==UserScript==
// @name         bilibili增强
// @license      MIT
// @namespace    http://tampermonkey.net/
// @version      2024-05-24
// @author       zyieng
// @description  :zh-cn
// @match        https://www.bilibili.com/*
// @icon         data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    // Your code here...
    function updateProgress() {
        // 获取class为cur-page的元素
        var curPageElement = document.querySelector('.cur-page');
        if (curPageElement) {
            // 检查是否已经有进度百分比元素,避免重复添加
            if (!curPageElement.querySelector('.progress-percentage')) {
                // 获取元素内容,假设内容格式为 "12/123"
                var content = curPageElement.textContent.trim();

                // 正则表达式提取当前观看的视频序列和总视频数量
                var match = content.match(/(\d+)\/(\d+)/);
                if (match) {
                    var current = parseInt(match[1], 10);
                    var total = parseInt(match[2], 10);

                    // 计算进度百分比
                    var progress = (current / total) * 100;

                    // 创建一个新的span元素来显示百分比
                    var progressElement = document.createElement('span');
                    progressElement.className = 'progress-percentage';
                    progressElement.style.marginLeft = '10px';
                    progressElement.style.color = 'green'; // 可以根据需要调整样式
                    progressElement.textContent = `(${progress.toFixed(2)}%)`;

                    // 将新的span元素添加到cur-page元素的右边
                    curPageElement.appendChild(progressElement);
                }
            }
        }
    }

    // 使用MutationObserver监听DOM变化
    var observer = new MutationObserver(function(mutations) {
        mutations.forEach(function(mutation) {
            if (mutation.type === 'childList' || mutation.type === 'subtree') {
                updateProgress();
            }
        });
    });

    // 配置MutationObserver监听整个body
    observer.observe(document.body, { childList: true, subtree: true });

    // 初始调用以确保在脚本加载时立即执行一次
    updateProgress();
})();