bilibili播放视频倍速自定义,刷新浏览器也不会丢失之前设置的速度
// ==UserScript== // @name bilibili播放视频倍速自定义,可记忆,简化版 // @description bilibili播放视频倍速自定义,刷新浏览器也不会丢失之前设置的速度 // @namespace bilibiliVideoSpeed1 // @version 2.1.7 // @author echo // @icon https://static.hdslb.com/images/favicon.ico // @match https://www.bilibili.com/bangumi/* // @match https://www.bilibili.com/video/* // @match https://www.bilibili.com/list/* // @grant GM_getValue // @grant GM_setValue // @run-at document-end // @sandbox JavaScript // @compatible firefox // @license AGPL // ==/UserScript== (() => { "use strict"; const THIRD_VIDEO_PLUGIN_SPEED = "third_video_plugin_speed"; const THIRD_VIDEO_PLUGIN_SPEEDS = "third_video_plugin_speeds"; const videoSpeedElement = document.createElement("div"); videoSpeedElement.id = "video_speed_div"; const style = document.createElement("style"); style.type = "text/css"; style.textContent = ` .video-info-container, #viewbox_report { height: auto!important; } #video_speed_div { width: 100%; height: 24px; margin: 8px 0; } #video_speed_div button, #third_video_plugin_btn { outline: 0; padding: 4px 9px; margin-left: 10px; background-color: #f1f2f3; border: 0; color: #222; cursor: pointer; border-radius: 6px; } #third_video_plugin_btn:first-child { margin-left: 0; background-color: #000!important; } .video_speed_div-button-active { border: 0!important; background-color: #00aeec!important; color: #fff!important; } `; document.head.appendChild(style); let keypressed = false; document.addEventListener("keydown", e => keypressed = !!e.keyCode); document.addEventListener("keyup", e => keypressed = false); const observer = new MutationObserver(mutations => { mutations.forEach(mutation => { if (mutation.addedNodes.length) { const hasComments = document.querySelector("bili-comments") || document.querySelector(".bili-comment") || document.querySelector(".bb-comment"); const hasVideoSpeedDiv = document.getElementById("video_speed_div"); if (hasComments && !hasVideoSpeedDiv) { addSpeedBtns(); observer.disconnect(); } } }); }); observer.observe(document.body, { childList: true, subtree: true }); function applySpeed(speed) { let videoObj = document.querySelector("video") || document.querySelector("bwp-video"); if (videoObj) { videoObj.playbackRate = parseFloat(speed); videoObj.onloadstart = () => { videoObj.playbackRate = parseFloat(getThirdVideoPluginSpeed()); }; } } function addSpeedBtns() { const playerWrap = document.getElementById("playerWrap"); if (playerWrap) { playerWrap.insertAdjacentElement('afterend', videoSpeedElement); }else{ document.getElementById("bilibili-player-wrap").insertAdjacentElement('afterend', videoSpeedElement); } const speedsettingsbtn = document.createElement("button"); speedsettingsbtn.textContent = " S "; speedsettingsbtn.style.backgroundColor = "black"; speedsettingsbtn.style.color = "white"; speedsettingsbtn.id = "third_video_plugin_btn"; speedsettingsbtn.addEventListener("click", speedsettingsevent); videoSpeedElement.appendChild(speedsettingsbtn); initBtn(); videoSpeedElement.style.width = "100%"; videoSpeedElement.style.height = "24px"; setTimeout(() => { if (keypressed) return; const speed = getThirdVideoPluginSpeed(); hightlightBtn(speed); applySpeed(speed); }, 500); } function getThirdVideoPluginSpeed() { let speed = GM_getValue(THIRD_VIDEO_PLUGIN_SPEED, "1"); GM_setValue(THIRD_VIDEO_PLUGIN_SPEED, speed); return speed; } function initBtn() { let speedArr = getStorageSpeeds(); if (!speedArr.length) { speedArr = [0.5, 1, 1.5, 2, 2.5, 3, 4, 5]; saveSpeed(speedArr); } speedArr.forEach(speed => { const btn = document.createElement("button"); btn.textContent = `x${speed}`; btn.style.width = "50px"; btn.id = `third_video_plugin_btn_${speed}`; btn.addEventListener("click", changeVideoSpeed); videoSpeedElement.appendChild(btn); }); } function saveSpeed(speeds) { GM_setValue(THIRD_VIDEO_PLUGIN_SPEEDS, speeds.join(",")); } function getStorageSpeeds() { return (GM_getValue(THIRD_VIDEO_PLUGIN_SPEEDS, "") || "").split(","); } function speedsettingsevent() { let speeds = window.prompt("输入倍速,以英文逗号隔开。", getStorageSpeeds().join(",")).replace(/\s+/g, "").split(","); if (!speeds.every(speed => !isNaN(parseFloat(speed)))) return; GM_setValue(THIRD_VIDEO_PLUGIN_SPEEDS, speeds.join(",")); const currentSpeed = GM_getValue(THIRD_VIDEO_PLUGIN_SPEED); if (!speeds.includes(currentSpeed)) GM_setValue(THIRD_VIDEO_PLUGIN_SPEED, "1"); videoSpeedElement.querySelectorAll("button:not(#third_video_plugin_btn)").forEach(btn => videoSpeedElement.removeChild(btn)); initBtn(); } function changeVideoSpeed(e) { const speed = parseFloat(e.target.textContent.replace("x", "")); GM_setValue(THIRD_VIDEO_PLUGIN_SPEED, speed); hightlightBtn(speed); applySpeed(speed); } function hightlightBtn(speed) { const currentSpeedBtn = document.getElementById(`third_video_plugin_btn_${speed}`); if (currentSpeedBtn && !currentSpeedBtn.classList.contains("video_speed_div-button-active")) { videoSpeedElement.querySelectorAll("button").forEach(btn => btn.classList.remove("video_speed_div-button-active")); currentSpeedBtn.classList.add("video_speed_div-button-active"); } } })();