Video Speed Control with Keyboard

Controls any HTML5 video playback speed by pressing shortcut keys. See source code comment for the shortcut keymap.

您需要先安装一个扩展,例如 篡改猴Greasemonkey暴力猴,之后才能安装此脚本。

You will need to install an extension such as Tampermonkey to install this script.

您需要先安装一个扩展,例如 篡改猴暴力猴,之后才能安装此脚本。

您需要先安装一个扩展,例如 篡改猴Userscripts ,之后才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey,才能安装此脚本。

您需要先安装用户脚本管理器扩展后才能安装此脚本。

(我已经安装了用户脚本管理器,让我安装!)

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

(我已经安装了用户样式管理器,让我安装!)

// ==UserScript==

// @name                Video Speed Control with Keyboard
// @description         Controls any HTML5 video playback speed by pressing shortcut keys. See source code comment for the shortcut keymap.
// @version             3.1

// @namespace           io.github.ni554n
// @include             *

// @supportURL          https://github.com/ni554n/userscripts/issues
// @license             MIT

// @author              Nissan Ahmed
// @homepageURL         https://ni554n.github.io/
// @contributionURL     https://paypal.me/ni554n

// ==/UserScript==

/* Keymap:
 * ┌─────┬───────┐
 * │ Key │ Speed │
 * ├─────┼───────┤
 * │  ,  │ -0.5x │
 * ├─────┼───────┤
 * │  .  │ +0.5x │
 * ├─────┼───────┤
 * │  ;  │   1x  │
 * ├─────┼───────┤
 * │  '  │  2.5x │
 * ├─────┼───────┤
 * │  [  │   2x  │
 * ├─────┼───────┤
 * │  ]  │ 1.75x │
 * └─────┴───────┘
 */

// Stores currently playing video element reference for changing the speed later.
let video;

// Stores currently selected speed. Also acts as default / initial playback speed for all video.
let speed = 1;

/* The "playing" event always fires automatically at the start of a video but "play" event is not.
 * After using the event for the initial key registration, "play" event is used for capturing the active video reference.
 */
document.addEventListener("playing", registerShortcutKeys, { capture: true, once: true });
document.addEventListener("playing", restoreSpeed, { capture: true });
document.addEventListener("play", captureActiveVideoElement, true);

function registerShortcutKeys(event) {
  captureActiveVideoElement(event);

  document.addEventListener("keydown", handlePressedKey);
}

function restoreSpeed(event) {
  if (event.target.playbackRate !== speed) event.target.playbackRate = speed;
}

function captureActiveVideoElement(event) {
  video = event.target;
  speed = video.playbackRate;
}

function handlePressedKey(event) {
  // If the pressed key is coming from any input field, do nothing.
  const target = event.target;
  if (target.localName === "input" || target.localName === "textarea" || target.isContentEditable) return;

  // Mapping keys with actions.
  const key = event.key;
  if (key === ",") video.playbackRate -= 0.5;
  else if (key === ".") video.playbackRate += 0.5;
  else if (key === ";") video.playbackRate = 1;
  else if (key === "\'") video.playbackRate = 2.5;
  else if (key === "[") video.playbackRate = 2;
  else if (key === "]") video.playbackRate = 1.75;

  // Saving the speed for next resume or video playback.
  speed = video.playbackRate;
}