mirror of
https://github.com/the1812/Bilibili-Evolved.git
synced 2025-11-04 21:22:45 +08:00
feat: 自动暂停
This commit is contained in:
parent
cb086664f4
commit
530fea0cc3
@ -678,5 +678,15 @@ Resource.manifest = {
|
||||
},
|
||||
},
|
||||
autoPlayControl: '传统连播模式',
|
||||
autoPauseVideo: {
|
||||
displayNames: {
|
||||
autoPauseVideo: '自动暂停视频',
|
||||
triggerPausePlace: '触发暂停位置'
|
||||
},
|
||||
dropdown:{
|
||||
key: 'triggerPausePlace',
|
||||
items: ['视频顶部' ,'视频中间', '视频底部']
|
||||
}
|
||||
}
|
||||
}
|
||||
export const resourceManifest = Resource.manifest
|
||||
|
||||
@ -256,6 +256,8 @@ export const settings = {
|
||||
fullscreenGiftBox: false,
|
||||
autoPlayControl: true,
|
||||
cache: {},
|
||||
autoPauseVideo: true,
|
||||
triggerPausePlace: '视频中间',
|
||||
}
|
||||
const fixedSettings = {
|
||||
seedsToCoins: false,
|
||||
|
||||
2
src/global.d.ts
vendored
2
src/global.d.ts
vendored
@ -518,6 +518,8 @@ declare global {
|
||||
liveSpeedBoost: boolean,
|
||||
checkInCenter: boolean,
|
||||
fullscreenGiftBox: boolean,
|
||||
autoPauseVideo: boolean,
|
||||
triggerPausePlace: string[],
|
||||
}
|
||||
const GM_info: MonkeyInfo
|
||||
function GM_xmlhttpRequest(details: MonkeyXhrDetails): { abort: () => void }
|
||||
|
||||
@ -75,6 +75,8 @@
|
||||
<checkbox indent="0" key="removeVideoPopup" dependencies=""></checkbox>
|
||||
<checkbox indent="0" key="removeVotePopup" dependencies=""></checkbox>
|
||||
<checkbox indent="0" key="autoPlayControl" dependencies=""></checkbox>
|
||||
<checkbox indent="0" key="autoPauseVideo" dependencies=""></checkbox>
|
||||
<dropdown indent="1" key="triggerPausePlace" dependencies="autoPauseVideo"></dropdown>
|
||||
<category icon="style">样式</category>
|
||||
<li class="indent-0 folded">
|
||||
<label class="gui-settings-textbox-container">
|
||||
|
||||
74
src/video/auto-pause-video.ts
Normal file
74
src/video/auto-pause-video.ts
Normal file
@ -0,0 +1,74 @@
|
||||
const video = dq('.bilibili-player-video video') as HTMLVideoElement;
|
||||
let mode = '视频中间';
|
||||
|
||||
enum MODE {
|
||||
TOP = '视频顶部',
|
||||
MID = '视频中间',
|
||||
BOT = '视频底部',
|
||||
}
|
||||
|
||||
function getToTop(_mode: string, client: DOMRect): number {
|
||||
switch (_mode) {
|
||||
case MODE.TOP:
|
||||
return client?.top;
|
||||
case MODE.MID:
|
||||
return client?.top + client?.height / 2;
|
||||
case MODE.BOT:
|
||||
return client?.top + client?.height;
|
||||
default:
|
||||
return 0;
|
||||
}
|
||||
}
|
||||
|
||||
// run callback when video el scroll out.
|
||||
/**
|
||||
*
|
||||
* @param _mode - when callback should trigger
|
||||
* @param callback
|
||||
* @param handelScrollBack - a func which called onVideoBack
|
||||
*/
|
||||
function onVideoOut(_mode: string, callback?: () => void) {
|
||||
const videoClient = video?.getBoundingClientRect();
|
||||
if (videoClient?.top && videoClient.height) {
|
||||
let toTop = getToTop(_mode, videoClient);
|
||||
if (!video.paused && toTop <= 0) {
|
||||
callback ? callback() : '';
|
||||
window.removeEventListener('scroll', onVideoOutEvent);
|
||||
// get ready to check when the video el came back.
|
||||
window.addEventListener('scroll', onVideoBackEvent, {
|
||||
passive: true,
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function onVideoOutEvent() {
|
||||
onVideoOut(mode, () => video.pause());
|
||||
}
|
||||
|
||||
// run callback when video el scroll back.
|
||||
function onVideoBack(_mode: string, callback?: () => void) {
|
||||
const videoClient = video?.getBoundingClientRect();
|
||||
if (videoClient?.top && videoClient.height) {
|
||||
let toTop = getToTop(_mode, videoClient);
|
||||
if (video.paused && toTop >= 0) {
|
||||
callback ? callback() : '';
|
||||
// this is do by
|
||||
// window.addEventListener('scroll',onVideoOut)
|
||||
window.removeEventListener('scroll', onVideoBackEvent);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function onVideoBackEvent() {
|
||||
onVideoBack(mode, () => video.play());
|
||||
}
|
||||
|
||||
(async () => {
|
||||
addSettingsListener('triggerPausePlace', (value) => (mode = value));
|
||||
Observer.videoChange(async () => {
|
||||
video.addEventListener('play', () => {
|
||||
window.addEventListener('scroll', onVideoOutEvent, { passive: true });
|
||||
});
|
||||
});
|
||||
})();
|
||||
Loading…
Reference in New Issue
Block a user