You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
80 lines
2.8 KiB
80 lines
2.8 KiB
(function() {
|
|
// ボタン群を包むコンテナのID
|
|
const CONTAINER_ID = 'yt-swift-control-container';
|
|
|
|
function updateSpeedButtonStyle(btn, rate) {
|
|
if (rate === 2) {
|
|
btn.style.backgroundColor = "#ff0000";
|
|
btn.style.color = "#ffffff";
|
|
btn.style.fontWeight = "bold";
|
|
btn.innerHTML = '2.0x';
|
|
} else {
|
|
btn.style.backgroundColor = "rgba(255, 255, 255, 0.1)";
|
|
btn.style.color = "#ffffff";
|
|
btn.style.fontWeight = "normal";
|
|
btn.innerHTML = '1.0x';
|
|
}
|
|
}
|
|
|
|
function createControlBtn(text, title, onClick) {
|
|
const btn = document.createElement('button');
|
|
btn.className = 'ytp-button';
|
|
btn.innerHTML = text;
|
|
btn.title = title;
|
|
btn.style.width = 'auto';
|
|
btn.style.minWidth = '45px';
|
|
btn.style.height = '30px';
|
|
btn.style.marginTop = '8px';
|
|
btn.style.marginRight = '5px';
|
|
btn.style.borderRadius = '4px';
|
|
btn.style.fontSize = '12px';
|
|
btn.style.display = 'inline-flex';
|
|
btn.style.alignItems = 'center';
|
|
btn.style.justifyContent = 'center';
|
|
btn.style.transition = 'background-color 0.2s';
|
|
btn.style.verticalAlign = 'top';
|
|
btn.onclick = onClick;
|
|
return btn;
|
|
}
|
|
|
|
function injectControls() {
|
|
const controls = document.querySelector('.ytp-right-controls');
|
|
if (!controls || document.getElementById(CONTAINER_ID)) return;
|
|
|
|
const container = document.createElement('div');
|
|
container.id = CONTAINER_ID;
|
|
container.style.display = 'inline-flex';
|
|
container.style.marginRight = '10px';
|
|
container.style.verticalAlign = 'top';
|
|
|
|
const video = document.querySelector('video');
|
|
|
|
// 1. 10秒巻き戻しボタン
|
|
const prevBtn = createControlBtn('←10', '10秒巻き戻す', () => {
|
|
if (video) video.currentTime -= 10;
|
|
});
|
|
|
|
// 2. 速度切り替えボタン
|
|
const speedBtn = createControlBtn('1.0x', '再生速度を1x/2xで切り替え', () => {
|
|
if (video) {
|
|
const newRate = video.playbackRate === 1 ? 2 : 1;
|
|
video.playbackRate = newRate;
|
|
updateSpeedButtonStyle(speedBtn, newRate);
|
|
}
|
|
});
|
|
updateSpeedButtonStyle(speedBtn, video ? video.playbackRate : 1);
|
|
|
|
// 3. 10秒スキップボタン
|
|
const nextBtn = createControlBtn('10→', '10秒スキップ', () => {
|
|
if (video) video.currentTime += 10;
|
|
});
|
|
|
|
container.appendChild(prevBtn);
|
|
container.appendChild(speedBtn);
|
|
container.appendChild(nextBtn);
|
|
controls.prepend(container);
|
|
}
|
|
|
|
const observer = new MutationObserver(injectControls);
|
|
observer.observe(document.body, { childList: true, subtree: true });
|
|
})(); |