Greasy Fork is available in English.
给B站多P视频下方添加一个总进度
当前为
// ==UserScript==
// @name B站视频观看总进度
// @namespace http://tampermonkey.net/
// @version 0.1
// @description 给B站多P视频下方添加一个总进度
// @author 汐涌及岸
// @match https://www.bilibili.com/video/*
// @icon https://www.bilibili.com/favicon.ico
// @grant none
// ==/UserScript==
//等待播放器加载完成
let waitPlayerLoad = setInterval(() => { if(!window.player) return; initTotalProgress(); clearInterval(waitPlayerLoad)}, 1000);
//格式化
const HHmmss = second => [Math.floor(second/3600),Math.floor(second/60)%60,second%60].map(n=>n.toString().padStart(2,0)).join(':')
//初始化
async function initTotalProgress() {
let data = await fetch('https://api.bilibili.com/x/web-interface/view?bvid='+bvid).then(resp=>resp.json()).then(json=>json.data)
if (data.pages.length<=1) return
let total_duration = data.duration
let multi_duration = data.pages.map(p=>p.duration)
let p = parseInt(new URLSearchParams(location.search).get('p'))||1
let before_duration = p>1?multi_duration.slice(0,p-1).reduce((t,d)=>t+d):0
//嵌入元素
document.querySelector('.bilibili-player-video-time').insertAdjacentHTML('beforeBegin', `<span id='video_watch_progress' style='color:#eee;padding-left:12px;'></span>`);
//进度条刷新
player.addEventListener(bPlayer.events.progressUpdate,()=>{
let now_duration = parseInt(player.getCurrentTime()) + before_duration
document.querySelector('#video_watch_progress').innerHTML =
'<b>总进度</b> ' + HHmmss(now_duration) + ' / ' + HHmmss(total_duration) + '<b> 百分比</b> ' + (now_duration / total_duration * 100).toFixed(2) + '%'
})
//切换分P时重新初始化
new MutationObserver(initTotalProgress).observe(document.querySelector(".bilibili-player-video"), { attributes: true, childList: true, subtree: true });
}