☰

Hide Youtube Player When Paused

Automatically hide the player when video is paused and mouse not hovering, as if the video is playing

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

  1. // ==UserScript==
  2. // @name         Hide Youtube Player When Paused
  3. // @namespace    PlanetXX2
  4. // @version      2024-11-10
  5. // @description  Automatically hide the player when video is paused and mouse not hovering, as if the video is playing
  6. // @license      MIT
  7. // @author       PlanetXX2
  8. // @match        https://*.youtube.com/watch?v=*
  9. // @match        https://*.youtube.com/live/*
  10. // @icon         https://www.google.com/s2/favicons?sz=64&domain=youtube.com
  11. // @grant        none
  12. // ==/UserScript==
  13.  
  14. (function () {
  15.     'use strict';
  16.  
  17.     let player = null;
  18.     let playerParent = null;
  19.     let isListening = false;
  20.     let waitForReadyInterval = null;
  21.     let lastState = "paused"; // paused, playing
  22.  
  23.     const eventListenerMouseOver = () => {
  24.         setTimeout(() => {
  25.             player.classList.remove("ytp-autohide");
  26.         }, 50);
  27.     }
  28.     const eventListenerMouseLeave = () => {
  29.         setTimeout(() => {
  30.             player.classList.add("ytp-autohide");
  31.         }, 50);
  32.     }
  33.  
  34.     function playerStateChanged() {
  35.         if (player.classList.contains("paused-mode") && !isListening) {
  36.             isListening = true;
  37.             playerParent.addEventListener("mouseover", eventListenerMouseOver);
  38.             playerParent.addEventListener("mouseleave", eventListenerMouseLeave);
  39.         } else if (isListening) {
  40.             isListening = false;
  41.             playerParent.removeEventListener("mouseover", eventListenerMouseOver);
  42.             playerParent.removeEventListener("mouseleave", eventListenerMouseLeave);
  43.         }
  44.     }
  45.  
  46.     function playerReady() {
  47.         let ob = new MutationObserver(() => {
  48.             if (player.classList.contains("paused-mode")) {
  49.                 if (lastState === "playing") {
  50.                     lastState = "paused";
  51.                     playerStateChanged();
  52.                 }
  53.             } else {
  54.                 if (lastState === "paused") {
  55.                     lastState = "playing";
  56.                     playerStateChanged();
  57.                 }
  58.             }
  59.         });
  60.         ob.observe(player, {
  61.             attributes: true,
  62.             attributeFilter: ["class"]
  63.         });
  64.     }
  65.  
  66.     // Wait for the player to be ready
  67.     function waitForReady() {
  68.         waitForReadyInterval = setInterval(function () {
  69.             player = document.getElementById("movie_player");
  70.             playerParent = player ? player.parentElement : null
  71.             if (player) {
  72.                 clearInterval(waitForReadyInterval);
  73.                 playerReady();
  74.                 console.log("Player ready");
  75.             }
  76.         }, 500);
  77.     }
  78.  
  79.     // reset the state when page navigate
  80.     window.navigation.addEventListener("navigate", () => {
  81.         playerParent.removeEventListener("mouseover", eventListenerMouseOver);
  82.         playerParent.removeEventListener("mouseleave", eventListenerMouseLeave);
  83.         player = null;
  84.         playerParent = null;
  85.         isListening = false;
  86.         lastState = "paused";
  87.  
  88.         clearInterval(waitForReadyInterval)
  89.         waitForReady();
  90.     });
  91.  
  92.     waitForReady();
  93.  
  94. })();