☰

YouTube Speed-Adjusted Time Display

Shows speed-adjusted time for YouTube videos

当前为 2024-10-22 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name         YouTube Speed-Adjusted Time Display
  3. // @namespace    http://tampermonkey.net/
  4. // @version      1.0
  5. // @description  Shows speed-adjusted time for YouTube videos
  6. // @author       kavinned
  7. // @match        https://www.youtube.com/*
  8. // @grant        none
  9. // @icon         https://www.google.com/s2/favicons?sz=64&domain=YouTube.com
  10. // @license      MIT
  11. // ==/UserScript==
  12.  
  13. (function() {
  14.     'use strict';
  15.  
  16.     function updateTimeDisplay() {
  17.         const video = document.querySelector('video');
  18.         if (!video) return;
  19.  
  20.         const currentTimeDisplay = document.querySelector('.ytp-time-current');
  21.         const durationDisplay = document.querySelector('.ytp-time-duration');
  22.  
  23.         if (!currentTimeDisplay || !durationDisplay) return;
  24.  
  25.         const currentTime = video.currentTime;
  26.         const duration = video.duration;
  27.         const playbackRate = video.playbackRate;
  28.  
  29.         const adjustedCurrentTime = currentTime / playbackRate;
  30.         const adjustedDuration = duration / playbackRate;
  31.  
  32.         function formatTime(seconds) {
  33.             const hours = Math.floor(seconds / 3600);
  34.             const minutes = Math.floor((seconds % 3600) / 60);
  35.             const secs = Math.floor(seconds % 60);
  36.  
  37.             if (hours > 0) {
  38.                 return `${hours}:${minutes.toString().padStart(2, '0')}:${secs.toString().padStart(2, '0')}`;
  39.             } else {
  40.                 return `${minutes}:${secs.toString().padStart(2, '0')}`;
  41.             }
  42.         }
  43.  
  44.         currentTimeDisplay.textContent = formatTime(adjustedCurrentTime);
  45.         durationDisplay.textContent = formatTime(adjustedDuration);
  46.     }
  47.  
  48.     function createSpeedTimeDisplay() {
  49.         const timeDisplay = document.querySelector('.ytp-time-display');
  50.         if (!timeDisplay || document.querySelector('.speed-adjusted-time')) return;
  51.  
  52.         const speedTimeDiv = document.createElement('div');
  53.         speedTimeDiv.className = 'speed-adjusted-time ytp-time-display';
  54.         speedTimeDiv.style.marginLeft = '10px';
  55.         speedTimeDiv.style.color = '#fff';
  56.         speedTimeDiv.style.fontSize = '14px';
  57.         timeDisplay.parentNode.insertBefore(speedTimeDiv, timeDisplay.nextSibling);
  58.     }
  59.  
  60.     const observer = new MutationObserver((mutations) => {
  61.         if (document.querySelector('video')) {
  62.             createSpeedTimeDisplay();
  63.             updateTimeDisplay();
  64.         }
  65.     });
  66.  
  67.     observer.observe(document.body, {
  68.         childList: true,
  69.         subtree: true
  70.     });
  71.  
  72.     setInterval(updateTimeDisplay, 1000);
  73.  
  74.     document.addEventListener('ratechange', updateTimeDisplay, true);
  75. })();