☰

Youtube Faster Fullscreen

Tries to replace player with embed player so we get faster fullscreen and

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

  1. // ==UserScript==
  2. // @name         Youtube Faster Fullscreen
  3. // @namespace    http://tampermonkey.net/
  4. // @version      0.11
  5. // @description  Tries to replace player with embed player so we get faster fullscreen and
  6. //               no scrolling/comments/description while in fullscreen.
  7. // @author       Filipe Henriques
  8. // @match        https://www.youtube.com/*
  9. // @icon         https://cdn-icons-png.flaticon.com/512/124/124015.png
  10. // @grant        none
  11. // @run-at       document-start
  12. // @noframes
  13. // ==/UserScript==
  14.  
  15. (function () {
  16.     // 'use strict';
  17.  
  18. // Only run the userscript outside iframes
  19. // if ( !(window.location !== window.parent.location) ) {
  20.  
  21.     // Keyboard shortcut support for the iframe
  22.     (window.opera ? document.body : document).addEventListener('keydown', function(e) {
  23.         console.log(e);
  24.         if (e.srcElement.nodeName == "INPUT" || e.srcElement.id == "contenteditable-root") {return false;}
  25.         if (e.key === "f" && !e.ctrlKey) {
  26.             e.cancelBubble = true;
  27.             e.stopImmediatePropagation();
  28.  
  29.             // we are outside the iframe. else -> inside iframe
  30.             if(!document.querySelector(".ytp-fullscreen-button.ytp-button")){
  31.                 let button = document.getElementById("myFrame").contentWindow.document.getElementsByClassName("ytp-fullscreen-button ytp-button")[0];
  32.                 button.click();
  33.             } else { document.querySelector(".ytp-fullscreen-button.ytp-button").click(); }
  34.         }
  35.         if (e.code === "Space" || e.code == "KeyK") {
  36.             e.cancelBubble = true;
  37.             e.stopImmediatePropagation();
  38.             e.preventDefault();
  39.             // outside iframe
  40.             if(!document.querySelector(".ytp-fullscreen-button.ytp-button")){
  41.                 let video = document.getElementById("myFrame").contentWindow.document.querySelector("video");
  42.                 if (video.paused) {video.play();}
  43.                 else {video.pause();}
  44.             }
  45.         // TODO ADD MUTE KEY (M) AND CAPTIONS KEY(C) SUPPORT
  46.         }
  47.         return false;
  48.     }, !window.opera);
  49.  
  50.     // ########################################################################
  51.  
  52.     // Global observer waits until elements we want appear
  53.     var href = document.location.href;
  54.     var ytd_found = false;        var ytd = null;
  55.     var player_found = false;     var player = null;
  56.     var orig_found = false;       var original_player = null;
  57.     var skeleton_found = false;   var skeleton_theater = null;
  58.     var watch_on_yt_fnd = false;  var watch_on_yt_bt = null;
  59.     var player_replaced = false;
  60.     var observer = new MutationObserver(function (mutations, me) {
  61.         // Check if we are navigating somewhere else and force page reload
  62.         if (href != document.location.href) {
  63.             href = document.location.href;
  64.             document.location.href = href;
  65.         }
  66.         // First original player in page
  67.         if (!orig_found) {original_player = document.querySelector("video");}
  68.         if (original_player && !orig_found) {
  69.  
  70.             orig_found = true;
  71.             original_player.pause();
  72.             original_player.addEventListener('play', (event) => {
  73.                 event.target.pause();
  74.             // }, { once: true });
  75.             });
  76.         }
  77.         // Intercept first appearance of skeleton theater
  78.         if (!skeleton_found) {skeleton_theater = document.querySelector('#player.skeleton.theater');}
  79.         if (skeleton_theater && !skeleton_found) {
  80.  
  81.             skeleton_found = true;
  82.             replacePlayer(skeleton_theater);
  83.             let o = new MutationObserver(function (mutations, me) {
  84.                 mutations[0].target.removeAttribute("hidden");
  85.                 document.getElementById("myFrame").style = 'width: 100%; height: 100%; position: relative';
  86.             });
  87.             o.observe(skeleton_theater, {attributes: true});
  88.  
  89.         }
  90.         // Remove player theater which is the final original player as soon as it appears
  91.         if (!player_found) { player = document.getElementById('player-theater-container');}
  92.         if (player && !player_found) {
  93.             player_found = true;
  94.             player.firstChild.remove();
  95.         }
  96.         // Remove Watch on Youtube button
  97.         if (!watch_on_yt_fnd) { watch_on_yt_bt = document.getElementById("myFrame").contentWindow.document.querySelector(".ytp-youtube-button.ytp-button.yt-uix-sessionlink");}
  98.         if ( watch_on_yt_bt && !watch_on_yt_fnd) {
  99.             watch_on_yt_bt.remove();
  100.         }
  101.         return;
  102.     });
  103.     observer.observe(document, {
  104.         childList: true,
  105.         subtree: true
  106.     });
  107.  
  108.  
  109.     // Replace player with an iframe embed player
  110.     function replacePlayer(element) {
  111.         var video_id = window.location.search.split('v=')[1];
  112.         var ampersandPosition = video_id.indexOf('&');
  113.         if(ampersandPosition != -1) {video_id = video_id.substring(0, ampersandPosition);}
  114.  
  115.         let iframe = document.createElement('iframe');
  116.         iframe.src = 'https://www.youtube.com/embed/' + video_id + '?autoplay=1&enablejsapi=1';
  117.         iframe.title = 'Youtube video player';
  118.         iframe.style = 'width: inherit; height: inherit; position: fixed';
  119.         iframe.frameborder = '0';
  120.         iframe.allow = 'accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture';
  121.         iframe.setAttribute('allowFullScreen', '');
  122.         iframe.id = 'myFrame';
  123.         element.prepend(iframe);
  124.     }
  125.  
  126.  
  127. // }
  128. }) ();