// ==UserScript==
// @name Youtube Bilibili Video Player Enhancer Tools
// @name:zh 油管哔哩哔哩视频播放器增强工具
// @name:zh-CN 油管哔哩哔哩视频播放器增强工具
// @name:en Youtube Bilibili Video Player Enhancer Tools
// @name:en-US Youtube Bilibili Video Player Enhancer Tools
// @description Adds more speed buttons and more settings to YouTube and Bilibili video players.
// @description:en Adds more speed buttons and more settings to YouTube and Bilibili video players.
// @description:en-US Adds more speed buttons and more settings to YouTube and Bilibili video players.
// @description:zh 油管哔哩哔哩视频播放器下添加更多倍速播放按钮及更多配置。
// @description:zh-CN 油管哔哩哔哩视频播放器下添加更多倍速播放按钮及更多配置。
// @namespace com.julong.tampermonkey.TubeBiliVideoPlayerEnhancerTools
// @version 1.0.5
// @author [email protected]
// @homepage https://github.com/julong111/tampermonkey-TubeBili
// @supportURL https://github.com/julong111/tampermonkey-TubeBili/issues
// @match *://*.youtube.com*
// @match *://*.bilibili.com*
// @include *://*.youtube.com*
// @include *://*.bilibili.com*
// @grant GM_addStyle
// @grant GM_setValue
// @grant GM_getValue
// @grant GM_registerMenuCommand
// @icon https://www.youtube.com/s/desktop/3748dff5/img/favicon_48.png
// @charset UTF-8
// @require https://scriptcat.org/lib/513/2.1.0/ElementGetter.js#sha256=aQF7JFfhQ7Hi+weLrBlOsY24Z2ORjaxgZNoni7pAz5U=
// @license MIT
// ==/UserScript==
// 广告跳过，自动网页全屏(待实现)
//<div class="ytp-skip-ad" id="skip-ad:r" style="">
//<button class="ytp-skip-ad-button ytp-ad-component--clickable" id="skip-button:s" style="opacity: 0.5;">
//<div class="ytp-skip-ad-button__text">Skip</div>
//<span class="ytp-skip-ad-button__icon">
//<svg height="100%" viewBox="-6 -6 36 36" width="100%"><path d="M5,18l10-6L5,6V18L5,18z M19,6h-2v12h2V6z" fill="#fff"></path></svg></span></button></div>
(function () {
'use strict';
const i18nConfig = {
// 中文配置
zh: {
menu_settings: "设置面板",
menu_save: "保存",
menu_close: "关闭",
Youtube_AutoTheaterMode: "Youtube - 自动视频网页全屏",
Youtube_AutoRate2x: "Youtube - 自动2倍速播放",
Youtube_AutoRemoveMiniplayer: "Youtube - 自动移除MiniPlayer按钮",
Bilibili_AutoWebFullscreen: "Bilibili - 自动视频网页全屏",
Bilibili_AutoRate2x: "Bilibili - 自动2倍速播放",
Bilibili_AutoRemovePip: "Bilibili - 自动移除画中画按钮",
Bilibili_AutoRemoveWide: "Bilibili - 自动移除宽屏按钮",
Bilibili_AutoRemoveSpeed: "Bilibili - 自动移除原始倍速按钮",
Bilibili_AutoRemoveComments: "Bilibili - 自动移除评论输入区",
Bilibili_AutoRemoveSettings: "Bilibili - 自动移除设置按钮",
},
// 英文配置
en: {
menu_settings: "Settings Panel",
menu_save: "Save",
menu_close: "Close",
Youtube_AutoTheaterMode: "Youtube - Auto Theater Mode",
Youtube_AutoRate2x: "Youtube - Auto 2x Playback",
Youtube_AutoRemoveMiniplayer: "Youtube - Auto Remove MiniPlayer Button",
Bilibili_AutoWebFullscreen: "Bilibili - Auto Web Fullscreen",
Bilibili_AutoRate2x: "Bilibili - Auto 2x Playback",
Bilibili_AutoRemovePip: "Bilibili - Auto Remove Picture-in-Picture Button",
Bilibili_AutoRemoveWide: "Bilibili - Auto Remove Wide Button",
Bilibili_AutoRemoveSpeed: "Bilibili - Auto Remove Original Speed Button",
Bilibili_AutoRemoveComments: "Bilibili - Auto Remove Comments Input Area",
Bilibili_AutoRemoveSettings: "Bilibili - Auto Remove Settings Button",
}
};
const settingPanelStyles = `
#minimalSettingsPanel {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 350px;
padding: 15px;
background-color: #f9f9f9;
border: 1px solid #ccc;
border-radius: 5px;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
z-index: 99999;
font-family: sans-serif;
display: none;
}
#minimalSettingsPanel.show {
display: block;
}
#minimalSettingsPanel h2 {
margin: 0 0 10px;
font-size: 1.1em;
text-align: center;
}
#minimalSettingsPanel .setting-item {
margin-bottom: 10px;
}
#minimalSettingsPanel .buttons {
margin-top: 15px;
text-align: right;
}
#minimalSettingsPanel button {
padding: 5px 10px;
cursor: pointer;
border: 1px solid #ccc;
background-color: #eee;
border-radius: 3px;
}`;
let isYoutubeListenerRegistered = false;
let youtubeLiveStreamCheck = null;
let currentVideoTitle = document.querySelector('title').text;
const Common = {
speeds: [0.5, 1.0, 1.5, 2.0, 3.0],
colors: ['#072525', '#287F54', '#C22544'],
currentLang: 'en',
settingPanelItems: [],
settingPanelInitialized: false,
settingPanelElement: null,
detectLanguage: function () {
let userLang = navigator.language.toLowerCase();
if (userLang.startsWith('zh')) {
return 'zh';
}
if (userLang.startsWith('en')) {
return 'en';
}
return 'en';
},
geti18nText: function (key) {
return i18nConfig[Common.currentLang][key];
},
initializePanel: function () {
let panel = document.createElement("div");
panel.id = "minimalSettingsPanel";
let title = document.createElement("h2");
title.textContent = Common.geti18nText("menu_settings");
panel.appendChild(title);
for (const [key, item] of Object.entries(Common.settingPanelItems)) {
let functionDiv = document.createElement("div");
functionDiv.className = "setting-item";
panel.appendChild(functionDiv);
let functionValue = GM_getValue(item.dataKey, false);
let input1 = document.createElement("input");
input1.type = "checkbox";
input1.checked = functionValue;
input1.id = item.classId;
functionDiv.appendChild(input1);
let label1 = document.createElement("label");
label1.setAttribute("for", item.classId);
label1.textContent = item.text;
functionDiv.appendChild(label1);
}
let buttons = document.createElement("div");
buttons.className = "buttons";
let saveBtn = document.createElement("button");
saveBtn.id = "saveBtn";
saveBtn.textContent = Common.geti18nText("menu_save");
saveBtn.addEventListener("click", () => {
Common.saveSettings();
});
let closeBtn = document.createElement("button");
closeBtn.id = "closeBtn";
closeBtn.textContent = Common.geti18nText("menu_close");
closeBtn.addEventListener("click", () => {
Common.togglePanel();
});
buttons.appendChild(saveBtn);
buttons.appendChild(closeBtn);
panel.appendChild(buttons);
document.body.appendChild(panel);
Common.settingPanelElement = panel;
Common.settingPanelInitialized = true;
},
saveSettings: function () {
for (const [key, item] of Object.entries(Common.settingPanelItems)) {
const isChecked = document.getElementById(item.classId).checked;
GM_setValue(item.dataKey, isChecked);
}
Common.settingPanelElement.classList.toggle('show');
},
togglePanel: function () {
if (!Common.settingPanelInitialized) {
Common.initializePanel();
}
Common.settingPanelElement.classList.toggle('show');
},
initSettingItems: function (currentUrl) {
if (currentUrl.includes("youtube.com")) {
Common.settingPanelItems = {
// Youtube_AutoTheaterMode: {
// classId: "Youtube-AutoTheaterMode",
// text: geti18nText("Youtube_AutoTheaterMode"),
// dataKey: "Youtube-AutoTheaterMode",
// },
Youtube_AutoRate2x: {
classId: "Youtube-AutoRate2x",
text: Common.geti18nText("Youtube_AutoRate2x"),
dataKey: "Youtube-AutoRate2x",
},
Youtube_AutoRemoveMiniplayer: {
classId: "Youtube-AutoRemoveMiniplayer",
text: Common.geti18nText("Youtube_AutoRemoveMiniplayer"),
dataKey: "Youtube-AutoRemoveMiniplayer",
},
};
} else if (currentUrl.includes("bilibili.com")) {
Common.settingPanelItems = {
Bilibili_AutoWebFullscreen: {
classId: "Bilibili-AutoWebFullscreen",
text: Common.geti18nText("Bilibili_AutoWebFullscreen"),
dataKey: "Bilibili-AutoWebFullscreen",
},
Bilibili_AutoRate2x: {
classId: "Bilibili-AutoRate2x",
text: Common.geti18nText("Bilibili_AutoRate2x"),
dataKey: "Bilibili-AutoRate2x",
},
Bilibili_AutoRemovePip: {
classId: "Bilibili-AutoRemovePip",
text: Common.geti18nText("Bilibili_AutoRemovePip"),
dataKey: "Bilibili-AutoRemovePip",
},
Bilibili_AutoRemoveWide: {
classId: "Bilibili-AutoRemoveWide",
text: Common.geti18nText("Bilibili_AutoRemoveWide"),
dataKey: "Bilibili-AutoRemoveWide",
},
Bilibili_AutoRemoveSpeed: {
classId: "Bilibili-AutoRemoveSpeed",
text: Common.geti18nText("Bilibili_AutoRemoveSpeed"),
dataKey: "Bilibili-AutoRemoveSpeed",
},
Bilibili_AutoRemoveComments: {
classId: "Bilibili-AutoRemoveComments",
text: Common.geti18nText("Bilibili_AutoRemoveComments"),
dataKey: "Bilibili-AutoRemoveComments",
},
Bilibili_AutoRemoveSettings: {
classId: "Bilibili-AutoRemoveSettings",
text: Common.geti18nText("Bilibili_AutoRemoveSettings"),
dataKey: "Bilibili-AutoRemoveSettings",
},
};
};
},
createSpeedButtons: function (selector, panelCallback, btnClickCallback) {
let bgColor = Common.colors[0];
let speedListDiv = document.createElement('div');
speedListDiv.id = 'speedButtons';
speedListDiv.style.display = 'flex';
speedListDiv.style.alignItems = 'center';
speedListDiv.style.justifyContent = 'center';
speedListDiv.style.height = '100%';
const handleButtonClick = (speed) => {
document.getElementsByTagName('video')[0].playbackRate = speed;
};
for (let i = 0; i < Common.speeds.length; i++) {
if (Common.speeds[i] >= 1) { bgColor = Common.colors[1]; }
if (Common.speeds[i] >= 1.5) { bgColor = Common.colors[2]; }
let btn = document.createElement('button');
btn.style.backgroundColor = bgColor;
btn.style.marginRight = '1px';
btn.style.border = '1px solid #D3D3D3';
btn.style.borderRadius = '2px';
btn.style.color = '#ffffff';
btn.style.cursor = 'pointer';
btn.style.fontFamily = 'Arial, "Helvetica Neue", Helvetica, sans-serif';
btn.style.display = 'flex';
btn.style.justifyContent = 'center';
btn.style.alignItems = 'center';
btn.style.width = '38px';
btn.style.height = '24px';
btn.style.fontSize = '14px';
btn.textContent = Common.speeds[i].toString() + '×';
btn.addEventListener('click', () => {
btnClickCallback ? btnClickCallback(Common.speeds[i]) : handleButtonClick(Common.speeds[i]);
});
speedListDiv.appendChild(btn);
}
panelCallback(speedListDiv);
},
removeSelector: function (selector) {
let ele = document.querySelector(selector);
if (ele) {
ele.remove();
}
},
setPlaybackRate: function (rate) {
document.getElementsByTagName('video')[0].playbackRate = rate;
},
};
const WebSite = {
data: {
youtubeLiveStreamStatus: false,
},
selectors: {
youtube: {
// YouTube selectors listeners
videoPanel: '#movie_player > div.ytp-chrome-bottom > div.ytp-chrome-controls > div.ytp-right-controls',
liveStreamIcon: '#movie_player > div.ytp-chrome-bottom > div.ytp-chrome-controls > div.ytp-left-controls > div.ytp-time-display.notranslate.ytp-live > button', // Youtube Live Stream check
miniPlayerBtn: '#movie_player > div.ytp-chrome-bottom > div.ytp-chrome-controls > div.ytp-right-controls > button.ytp-miniplayer-button.ytp-button',
finishListener: 'yt-navigate-finish',
liveStreamClass: 'ytp-live-badge-is-livehead',
},
bilibili: {
/// Bilibili selectors
playerContainer: '#bilibili-player',
webFullClass: 'mode-webscreen',
speedBtn: '.bpx-player-control-bottom-left',
videoPanel: '.bilibili-player, .bpx-player-container, #bilibiliPlayer',
commentsPanel: '#bilibili-player > div > div > div.bpx-player-primary-area > div.bpx-player-video-area > div.bpx-player-control-wrap > div.bpx-player-control-entity > div.bpx-player-control-bottom > div.bpx-player-control-bottom-center',
webFullBtn: '#bilibili-player > div > div > div.bpx-player-primary-area > div.bpx-player-video-area > div.bpx-player-control-wrap > div.bpx-player-control-entity > div.bpx-player-control-bottom > div.bpx-player-control-bottom-right > div.bpx-player-ctrl-btn.bpx-player-ctrl-web',
pipBtn: '#bilibili-player > div > div > div.bpx-player-primary-area > div.bpx-player-video-area > div.bpx-player-control-wrap > div.bpx-player-control-entity > div.bpx-player-control-bottom > div.bpx-player-control-bottom-right > div.bpx-player-ctrl-btn.bpx-player-ctrl-pip',
wideBtn: '#bilibili-player > div > div > div.bpx-player-primary-area > div.bpx-player-video-area > div.bpx-player-control-wrap > div.bpx-player-control-entity > div.bpx-player-control-bottom > div.bpx-player-control-bottom-right > div.bpx-player-ctrl-btn.bpx-player-ctrl-wide',
speedsListBtn: '#bilibili-player > div > div > div.bpx-player-primary-area > div.bpx-player-video-area > div.bpx-player-control-wrap > div.bpx-player-control-entity > div.bpx-player-control-bottom > div.bpx-player-control-bottom-right > div.bpx-player-ctrl-btn.bpx-player-ctrl-playbackrate',
settingsBtn: '#bilibili-player > div > div > div.bpx-player-primary-area > div.bpx-player-video-area > div.bpx-player-control-wrap > div.bpx-player-control-entity > div.bpx-player-control-bottom > div.bpx-player-control-bottom-right > div.bpx-player-ctrl-btn.bpx-player-ctrl-setting',
}
},
youtube: function () {
const handleYoutubePage = async () => {
console.log('执行Youtube页面脚本handler');
currentVideoTitle = document.querySelector('title').text;
if (!document.querySelector('#speedButtons')) {
try {
let videopanel = await elmGetter.get(WebSite.selectors.youtube.videoPanel);
console.log('添加更多倍速按钮');
Common.createSpeedButtons(WebSite.selectors.youtube.videoPanel, (moreSpeedsDiv) => {
videopanel.before(moreSpeedsDiv);
}, (speed) => {
document.getElementsByTagName('video')[0].playbackRate = speed;
WebSite.data.youtubeLiveStreamStatus = false;
});
} catch (error) {
console.error('Failed create speed button elements:', error);
}
}
try {
const removalConfigs = {
Youtube_AutoRemoveMiniplayer: WebSite.selectors.youtube.miniPlayerBtn,
};
for (const key in removalConfigs) {
if (GM_getValue(Common.settingPanelItems[key].dataKey, false)) {
elmGetter.get(removalConfigs[key]).then(item => {
console.log('移除按钮:', removalConfigs[key]);
item.remove();
});
}
}
} catch (error) {
console.error('Failed autoremove buttons:', error);
}
if (GM_getValue(Common.settingPanelItems.Youtube_AutoRate2x.dataKey, false)) {
console.log('设置2倍速播放');
Common.setPlaybackRate(2.0);
WebSite.data.youtubeLiveStreamStatus = false;
}
};
if (!isYoutubeListenerRegistered) {
console.log('注册Youtube监听器');
window.addEventListener(WebSite.selectors.youtube.finishListener, handleYoutubePage);
isYoutubeListenerRegistered = true;
}
// 启动直播状态检测
youtubeLiveStreamCheck = setInterval(() => {
let element = document.querySelector(WebSite.selectors.youtube.liveStreamIcon);
if (element) {
if (element.classList.contains(WebSite.selectors.youtube.liveStreamClass) && !WebSite.data.youtubeLiveStreamStatus && window.location.href.includes("youtube.com/watch")) {
document.getElementsByTagName('video')[0].playbackRate = 1.0;
console.log('已检测到直播，重置播放速度为1.0');
WebSite.data.youtubeLiveStreamStatus = true;
}
}
}, 1000);
},
bilibili: function () {
const handleBilibiliPage = async () => {
if (!document.querySelector('#speedButtons')) {
try {
await elmGetter.get(WebSite.selectors.bilibili.videoPanel);
Common.createSpeedButtons(WebSite.selectors.bilibili.videoPanel, (moreSpeedsDiv) => {
let ele = document.querySelector(WebSite.selectors.bilibili.speedBtn);
if (ele) {
ele.after(moreSpeedsDiv);
}
});
} catch (error) {
console.error('Failed create speed button elements:', error);
}
}
try {
const removalConfigs = {
Bilibili_AutoRemoveComments: WebSite.selectors.bilibili.commentsPanel,
Bilibili_AutoRemovePip: WebSite.selectors.bilibili.pipBtn,
Bilibili_AutoRemoveWide: WebSite.selectors.bilibili.wideBtn,
Bilibili_AutoRemoveSpeed: WebSite.selectors.bilibili.speedsListBtn,
Bilibili_AutoRemoveSettings: WebSite.selectors.bilibili.settingsBtn,
};
for (const key in removalConfigs) {
if (GM_getValue(Common.settingPanelItems[key].dataKey, false)) {
elmGetter.get(removalConfigs[key]).then(item => {
item.remove();
});
}
}
} catch (error) {
console.error('Failed autoremove buttons:', error);
}
try {
if (GM_getValue(Common.settingPanelItems.Bilibili_AutoWebFullscreen.dataKey, false)) {
elmGetter.get(WebSite.selectors.bilibili.playerContainer).then(playItem => {
if (playItem.classList.contains(WebSite.selectors.bilibili.webFullClass)) {
return;
}
elmGetter.get(WebSite.selectors.bilibili.webFullBtn).then(item => {
item.click();
});
});
}
} catch (error) {
console.error('Failed webfull or auto rate:', error);
}
if (GM_getValue(Common.settingPanelItems.Bilibili_AutoRate2x.dataKey, false)) {
Common.setPlaybackRate(2.0);
}
currentVideoTitle = document.querySelector('title').text;
};
handleBilibiliPage();
}
}
function main() {
// 每次页面加载时，都先清理所有可能存在的定时器
if (youtubeLiveStreamCheck !== null) {
clearInterval(youtubeLiveStreamCheck);
youtubeLiveStreamCheck = null;
}
Common.currentLang = Common.detectLanguage();
Common.initSettingItems(window.location.href);
GM_addStyle(settingPanelStyles);
GM_registerMenuCommand(Common.geti18nText("menu_settings"), Common.togglePanel);
const observerConfig = { childList: true };
const observer = new MutationObserver((mutations, observer) => {
for (const mutation of mutations) {
if (mutation.type === "childList") {
if (currentVideoTitle !== mutation.addedNodes[0].data) {
console.log('检测到页面变化，重新执行脚本');
console.log('Old Title:', currentVideoTitle);
console.log('New Title:', mutation.addedNodes[0].data);
console.log('---');
if (window.location.href.includes("youtube.com/watch")) {
console.log('ob 执行Youtube脚本');
WebSite.youtube();
} else if (window.location.href.includes("bilibili.com/video")) {
WebSite.bilibili();
}
}
}
}
});
const target = document.querySelector('title');
observer.observe(target, observerConfig);
// 首次执行
if (window.location.href.includes("youtube.com/watch")) {
console.log('main 执行Youtube脚本');
WebSite.youtube();
} else if (window.location.href.includes("bilibili.com/video")) {
WebSite.bilibili();
}
}
main();
})();
