☰

影片播放速度

2021/7/25 下午5:48:09

目前為 2021-07-29 提交的版本，檢視 最新版本。

// ==UserScript==
// @name        影片播放速度
// @namespace   Violentmonkey Scripts
// @match       https://ani.gamer.com.tw/animeVideo.php
// @grant       none
// @version     1.0
// @author      bigiCrab
// @description 2021/7/25 下午5:48:09
// 1. 自動使用上次的撥放速度
// 2. shift+滾輪調整撥放速度(0.1~16)
//
// ==/UserScript==

// videojs 仔很慢
$(window).load(() => {
  // 有時video更慢，不確定這有沒有用
  $("video").ready(() => {
    console.log("window load");
    main();
  });
});
async function main() {
  const ani_video = videojs.getPlayer("ani_video");
  if (!ani_video) {
    console.error("video element not found", ani_video);
    return;
  }
  // 看videojs有甚麼狀態可用
  //   test_trackAllEvent();

  loadAndTrackSavePlayRate();

  scrollToAdjustSpeed();

  function loadAndTrackSavePlayRate() {
    //   上次存的撥放速度
    const lastTimePlayBackRate = localStorage.getItem("bigi_videoPlayBackRate");
    //   apply play rate
    ani_video.on("canplay", (e) => {
      if (lastTimePlayBackRate !== null) {
        console.log(`設定為上次的撥放速度:${lastTimePlayBackRate}`);
        ani_video.playbackRate(lastTimePlayBackRate);
      }
    });
    //   save play rate
    ani_video.on("ratechange", (e) => {
      let newestRate = ani_video.playbackRate();
      // console.log(`撥放速度變動..存起來:${newestRate}`);
      localStorage.setItem("bigi_videoPlayBackRate", newestRate);
    });
  }

  function scrollToAdjustSpeed() {
    const speedStap = 0.1;
    $("video").on("wheel", (event) => {
      if (event.shiftKey) {
        event.preventDefault();
        // console.log("shift捲動", event.originalEvent);

        let speedVector = event.originalEvent.deltaY < 0 ? 1 : -1;
        let newestRate = ani_video.playbackRate();
        let calcSpeed =
          Math.round((newestRate + speedVector * speedStap) * 100) / 100;
        calcSpeed = Math.min(Math.max(0.1, calcSpeed), 16);
        ani_video.playbackRate(calcSpeed);
      }
    });
  }

  function test_trackAllEvent() {
    //   找到的都在上面
    let events = [
      "subtitles",
      "captions",
      "descriptions",
      "chapters",
      "metadata",
      "none",
      "metadata",
      "auto",
      "alternative",
      "captions",
      "descriptions",
      "main",
      "main-desc",
      "sign",
      "subtitles",
      "translation",
      "commentary",
      "onchange",
      "onaddtrack",
      "onremovetrack",
      "onchange",
      "onaddtrack",
      "onremovetrack",
      "oncuechange",
      "onenter",
      "onexit",
      "loadstart",
      "progress",
      "suspend",
      "abort",
      "error",
      "emptied",
      "stalled",
      "loadedmetadata",
      "loadeddata",
      "canplay",
      "canplaythrough",
      "playing",
      "waiting",
      "seeking",
      "seeked",
      "ended",
      "durationchange",
      "timeupdate",
      "play",
      "pause",
      "ratechange",
      "resize",
      "volumechange",
      "error",
      "change",
      "addtrack",
      "removetrack",
      "cuechange",
      "error",
      "load",
      "enter",
      "exit",
    ];
    ani_video.on(events, (e) => {
      console.log(e);
    });
  }
}