YouTube Playback Speed Buttons

Adds playback speed buttons to youtube player control bar.

目前为 2023-09-22 提交的版本。查看 最新版本

// ==UserScript==
// @name         YouTube Playback Speed Buttons
// @description  Adds playback speed buttons to youtube player control bar.
// @version      0.1.3
// @license      MIT
// @author       bowencool
// @match        https://www.youtube.com/watch*
// @namespace    https://www.youtube.com/
// @author       bowencool
// @license      MIT
// @supportURL   https://github.com/bowencool/Tampermonkey-Scripts/issues
// @icon         https://www.google.com/s2/favicons?sz=64&domain=youtube.com
// @run-at       document-end
// ==/UserScript==
"use strict";

function waitForElementToExist(selector) {
  return new Promise((resolve) => {
    if (document.querySelector(selector)) {
      return resolve(document.querySelector(selector));
    }

    const observer = new MutationObserver(() => {
      if (document.querySelector(selector)) {
        resolve(document.querySelector(selector));
        observer.disconnect();
      }
    });

    observer.observe(document.body, {
      subtree: true,
      childList: true,
    });
  });
}

function setPlayerSpeed(newSpeed) {
  document.getElementsByClassName("html5-main-video")[0].playbackRate =
    newSpeed;
}
function insertStyle() {
  const head = document.head;
  const style = document.createElement("style");
  style.innerHTML = `
.speed-button {

}
.speed-button.active, .speed-button:hover {
  color: white;
}
  `;
  head.appendChild(style);
  console.log({ style });
}
async function main() {
  const menuR = await waitForElementToExist(".ytp-right-controls");
  console.log({ menuR });
  insertStyle();
  if (typeof menuR !== "undefined" && menuR !== null) {
    [2, 1.5, 1.25, 1, 0.75, 0.5].forEach((speed) => {
      const button = document.createElement("button");
      button.innerText = `x${speed}`;
      button.classList.add("ytp-button speed-button");
      button.onclick = () => setPlayerSpeed(speed);
      menuR.prepend(button);
      console.log(button);
    });
  }
}
main();