From 11c03e073153dca072cb6cdc63c8e87589dc0ae1 Mon Sep 17 00:00:00 2001 From: the1812 Date: Fri, 12 Mar 2021 20:08:01 +0800 Subject: [PATCH] Use player API --- min/frame-playback.min.js | 2 +- src/video/frame-playback/frame-playback.js | 8 ++++++-- 2 files changed, 7 insertions(+), 3 deletions(-) diff --git a/min/frame-playback.min.js b/min/frame-playback.min.js index 7cdfbe7f3..ba977b455 100644 --- a/min/frame-playback.min.js +++ b/min/frame-playback.min.js @@ -1 +1 @@ -(()=>(e,t)=>{const r=t.import("framePlaybackHtml");t.applyStyle("framePlaybackStyle");const l=async()=>{if(e.videoScreenshot){const e=await SpinQuery.select(".video-take-screenshot");if(e===null||document.querySelector(".frame-playback")){return}e.insertAdjacentHTML("afterend",r)}else{const e=await SpinQuery.select(".bilibili-player-video-time");if(e===null||document.querySelector(".frame-playback")){return}e.insertAdjacentHTML("afterend",r)}let t=0;const l=()=>dq("video").currentTime-=t;const i=()=>dq("video").currentTime+=t;Observer.attributesSubtree(".bilibili-player-video-quality-menu ul.bui-select-list",(()=>{const e=document.querySelector(".bilibili-player-video-quality-menu .bui-select-item-active");const r=e?parseInt(e.getAttribute("data-value")):0;const l=(()=>{switch(r){case 116:case 74:return 6e4/1001;default:return 3e4/1001}})();t=1/l}));document.querySelector(".prev-frame").addEventListener("click",l);document.querySelector(".next-frame").addEventListener("click",i);if(e.touchVideoPlayer){document.querySelectorAll(".frame-playback").forEach((e=>e.classList.add("touch")))}};Observer.videoChange(l);return{reload:()=>document.querySelectorAll(".bilibili-player-video-control-bottom .frame-playback").forEach((e=>e.setAttribute("style","display: flex !important"))),unload:()=>document.querySelectorAll(".bilibili-player-video-control-bottom .frame-playback").forEach((e=>e.setAttribute("style","display: none !important")))}})(); \ No newline at end of file +(()=>(e,t)=>{const r=t.import("framePlaybackHtml");t.applyStyle("framePlaybackStyle");const l=async()=>{if(e.videoScreenshot){const e=await SpinQuery.select(".video-take-screenshot");if(e===null||document.querySelector(".frame-playback")){return}e.insertAdjacentHTML("afterend",r)}else{const e=await SpinQuery.select(".bilibili-player-video-time");if(e===null||document.querySelector(".frame-playback")){return}e.insertAdjacentHTML("afterend",r)}let t=0;const l=e=>()=>{const r=dq("video");unsafeWindow.player.seek(r.currentTime+(e?1:-1)*t,r.paused)};const a=l(false);const i=l(true);Observer.attributesSubtree(".bilibili-player-video-quality-menu ul.bui-select-list",(()=>{const e=document.querySelector(".bilibili-player-video-quality-menu .bui-select-item-active");const r=e?parseInt(e.getAttribute("data-value")):0;const l=(()=>{switch(r){case 116:case 74:return 6e4/1001;default:return 3e4/1001}})();t=1/l}));document.querySelector(".prev-frame").addEventListener("click",a);document.querySelector(".next-frame").addEventListener("click",i);if(e.touchVideoPlayer){document.querySelectorAll(".frame-playback").forEach((e=>e.classList.add("touch")))}};Observer.videoChange(l);return{reload:()=>document.querySelectorAll(".bilibili-player-video-control-bottom .frame-playback").forEach((e=>e.setAttribute("style","display: flex !important"))),unload:()=>document.querySelectorAll(".bilibili-player-video-control-bottom .frame-playback").forEach((e=>e.setAttribute("style","display: none !important")))}})(); \ No newline at end of file diff --git a/src/video/frame-playback/frame-playback.js b/src/video/frame-playback/frame-playback.js index 8011e22a2..86bc2400e 100644 --- a/src/video/frame-playback/frame-playback.js +++ b/src/video/frame-playback/frame-playback.js @@ -17,8 +17,12 @@ const main = async () => { } let frameTime = 0 - const prevFrame = () => dq('video').currentTime -= frameTime - const nextFrame = () => dq('video').currentTime += frameTime + const seek = (forward) => () => { + const video = dq('video') + unsafeWindow.player.seek(video.currentTime + (forward ? 1 : -1) * frameTime, video.paused) + } + const prevFrame = seek(false) + const nextFrame = seek(true) Observer.attributesSubtree('.bilibili-player-video-quality-menu ul.bui-select-list', () => { const selectedQuality = document.querySelector('.bilibili-player-video-quality-menu .bui-select-item-active') const quality = selectedQuality ? parseInt(selectedQuality.getAttribute('data-value')) : 0