☰

Greasy Fork 还支持 简体中文。

YouTube Web Tweaks

This script optimizes YouTube's performance by modified configs, shorts redirect and much more!

  1. // ==UserScript==
  2. // @name         YouTube Web Tweaks
  3. // @version      4.2.0
  4. // @description  This script optimizes YouTube's performance by modified configs, shorts redirect and much more!
  5. // @author       Magma_Craft
  6. // @license MIT
  7. // @match        *://www.youtube.com/*
  8. // @namespace    https://greasyfork.org/en/users/933798
  9. // @icon         https://www.youtube.com/favicon.ico
  10. // @unwrap
  11. // @run-at       document-end
  12. // @unwrap
  13. // @grant        none
  14. // @require      https://cdnjs.cloudflare.com/ajax/libs/arrive/2.4.1/arrive.min.js
  15. // ==/UserScript==
  16.  
  17. // Enable strict mode to catch common coding mistakes
  18. "use strict";
  19.  
  20. // Define the flags to assign to the EXPERIMENT_FLAGS object
  21. const flagsToAssign = {
  22.   // Standard tweaks (YT config editor + Disable animations)
  23.   IS_TABLET: true,
  24.   DISABLE_YT_IMG_DELAY_LOADING: true,
  25.   polymer_verifiy_app_state: false,
  26.   desktop_delay_player_resizing: false,
  27.   web_animated_actions: false,
  28.   web_animated_like: false,
  29.   web_animated_like_lazy_load: false,
  30.   render_unicode_emojis_as_small_images: true,
  31.   smartimation_background: false,
  32.   kevlar_refresh_on_theme_change: false,
  33.   // Disable cinematics (aka ambient lighting)
  34.   kevlar_measure_ambient_mode_idle: false,
  35.   kevlar_watch_cinematics_invisible: false,
  36.   web_cinematic_theater_mode: false,
  37.   web_cinematic_fullscreen: false,
  38.   enable_cinematic_blur_desktop_loading: false,
  39.   kevlar_watch_cinematics: false,
  40.   web_cinematic_masthead: false,
  41.   web_watch_cinematics_preferred_reduced_motion_default_disabled: false
  42. };
  43.  
  44. const updateFlags = () => {
  45.   // Check if the EXPERIMENT_FLAGS object exists in the window.yt.config_ property chain
  46.   const expFlags = window?.yt?.config_?.EXPERIMENT_FLAGS;
  47.  
  48.   // If EXPERIMENT_FLAGS is not found, exit the function
  49.   if (!expFlags) return;
  50.  
  51.   // Assign the defined flags to the EXPERIMENT_FLAGS object
  52.   Object.assign(expFlags, flagsToAssign);
  53. };
  54.  
  55. // Create a MutationObserver that calls the updateFlags function when changes occur in the document's subtree
  56. const mutationObserver = new MutationObserver(updateFlags);
  57. mutationObserver.observe(document, { subtree: true, childList: true });
  58.  
  59. // Fully replace shorts links with regular videos
  60. /**
  61.  * Shorts URL redirect.
  62.  *
  63.  * This is called on initial visit only. Successive navigations
  64.  * are managed by modifying the YouTube Desktop application.
  65.  */
  66. (function(){
  67.  
  68. /** @type {string} */
  69. var path = window.location.pathname;
  70.  
  71. if (0 == path.search("/shorts"))
  72. {
  73.     // Extract the video ID from the shorts link and redirect.
  74.  
  75.     /** @type {string} */
  76.     var id = path.replace(/\/|shorts|\?.*/g, "");
  77.  
  78.     window.location.replace("https://www.youtube.com/watch?v=" + id);
  79. }
  80.  
  81. })();
  82.  
  83. /**
  84.  * YouTube Desktop Shorts remover.
  85.  *
  86.  * If the initial URL was not a shorts link, traditional redirection
  87.  * will not work. This instead modifies video elements to replace them with
  88.  * regular links.
  89.  */
  90. (function(){
  91.  
  92. /**
  93.  * @param {string} selector (CSS-style) of the element
  94.  * @return {Promise<Element>}
  95.  */
  96. async function querySelectorAsync(selector)
  97. {
  98.     while (null == document.querySelector(selector))
  99.     {
  100.         // Pause for a frame and let other code go on.
  101.         await new Promise(r => requestAnimationFrame(r));
  102.     }
  103.  
  104.     return document.querySelector(selector);
  105. }
  106.  
  107. /**
  108.  * Small toolset for interacting with the Polymer
  109.  * YouTube Desktop application.
  110.  *
  111.  * @author Taniko Yamamoto <kirasicecreamm@gmail.com>
  112.  * @version 1.0
  113.  */
  114. class YtdTools
  115. {
  116.     /** @type {string} Page data updated event */
  117.     static EVT_DATA_UPDATE = "yt-page-data-updated";
  118.  
  119.     /** @type {Element} Main YT Polymer manager */
  120.     static YtdApp;
  121.  
  122.     /** @type {bool} */
  123.     static hasInitialLoaded = false;
  124.  
  125.     /** @return {Promise<bool>} */
  126.     static async isPolymer()
  127.     {
  128.         /** @return {Promise<void>} */
  129.         function waitForBody() // nice hack lazy ass
  130.         {
  131.             return new Promise(r => {
  132.                 document.addEventListener("DOMContentLoaded", function a(){
  133.                     document.removeEventListener("DOMContentLoaded", a);
  134.                     r();
  135.                 });
  136.             });
  137.         }
  138.  
  139.         await waitForBody();
  140.  
  141.         if ("undefined" != typeof document.querySelector("ytd-app"))
  142.         {
  143.             this.YtdApp = document.querySelector("ytd-app");
  144.             return true;
  145.         }
  146.         return false;
  147.     }
  148.  
  149.     /** @async @return {Promise<void|string>} */
  150.     static waitForInitialLoad()
  151.     {
  152.         var updateEvent = this.EVT_DATA_UPDATE;
  153.         return new Promise((resolve, reject) => {
  154.             if (!this.isPolymer())
  155.             {
  156.                 reject("Not Polymer :(");
  157.             }
  158.  
  159.             function _listenerCb()
  160.             {
  161.                 document.removeEventListener(updateEvent, _listenerCb);
  162.                 resolve();
  163.             }
  164.  
  165.             document.addEventListener(updateEvent, _listenerCb);
  166.         });
  167.     }
  168.  
  169.     /** @return {string} */
  170.     static getPageType()
  171.     {
  172.         return this.YtdApp.data.page;
  173.     }
  174. }
  175.  
  176. class ShortsTools
  177. {
  178.     /** @type {MutationObserver} */
  179.     static mo = new MutationObserver(muts => {
  180.         muts.forEach(mut => {
  181.             Array.from(mut.addedNodes).forEach(node => {
  182.                 if (node instanceof HTMLElement) {
  183.                     this.onMutation(node);
  184.                 }
  185.             });
  186.         });
  187.     });
  188.  
  189.     /** @return {void} */
  190.     static watchForShorts()
  191.     {
  192.         /*
  193.         this.mo.observe(YtdTools.YtdApp, {
  194.             childList: true,
  195.             subtree: true
  196.         });
  197.         */
  198.         var me = this;
  199.         YtdTools.YtdApp.arrive("ytd-video-renderer, ytd-grid-video-renderer", function() {
  200.             me.onMutation(this);
  201.  
  202.             // This is literally the worst hack I ever wrote, but it works ig...
  203.             (new MutationObserver(function(){
  204.                 if (me.isShortsRenderer(this))
  205.                 {
  206.                     me.onMutation(this);
  207.                 }
  208.             }.bind(this))).observe(this, {"subtree": true, "childList": true, "characterData": "true"});
  209.         });
  210.     }
  211.  
  212.     /** @return {void} */
  213.     static stopWatchingForShorts()
  214.     {
  215.         this.mo.disconnect();
  216.     }
  217.  
  218.     /**
  219.      * @param {HTMLElement} node
  220.      * @return {void}
  221.      */
  222.     static onMutation(node)
  223.     {
  224.         if (node.tagName.search("VIDEO-RENDERER") > -1 && this.isShortsRenderer(node))
  225.         {
  226.             this.transformShortsRenderer(node);
  227.         }
  228.     }
  229.  
  230.     /** @return {bool} */
  231.     static isShortsRenderer(videoRenderer)
  232.     {
  233.         return "WEB_PAGE_TYPE_SHORTS" == videoRenderer?.data?.navigationEndpoint?.commandMetadata?.webCommandMetadata?.webPageType;
  234.     }
  235.  
  236.     /** @return {string} */
  237.     static extractLengthFromA11y(videoData)
  238.     {
  239.         // A11y = {title} by {creator} {date} {*length*} {viewCount} - play Short
  240.         // tho hopefully this works in more than just English
  241.         var a11yTitle = videoData.title.accessibility.accessibilityData.label;
  242.  
  243.         var publishedTimeText = videoData.publishedTimeText.simpleText;
  244.         var viewCountText = videoData.viewCountText.simpleText;
  245.  
  246.         var isolatedLengthStr = a11yTitle.split(publishedTimeText)[1].split(viewCountText)[0]
  247.             .replace(/\s/g, "");
  248.  
  249.         var numbers = isolatedLengthStr.split(/\D/g);
  250.  
  251.         var string = "";
  252.  
  253.         // Remove all empties before iterating it
  254.         for (var i = 0; i < numbers.length; i++)
  255.         {
  256.             if ("" === numbers[i])
  257.             {
  258.                 numbers.splice(i, 1);
  259.                 i--;
  260.             }
  261.         }
  262.  
  263.         for (var i = 0; i < numbers.length; i++)
  264.         {
  265.             // Lazy 0 handling idc im tired
  266.             if (1 == numbers.length)
  267.             {
  268.                 string += "0:";
  269.                 if (1 == numbers[i].length)
  270.                 {
  271.                     string += "0" + numbers[i];
  272.                 }
  273.                 else
  274.                 {
  275.                     string += numbers[i];
  276.                 }
  277.  
  278.                 break;
  279.             }
  280.  
  281.             if (0 != i) string += ":";
  282.             if (0 != i && 1 == numbers[i].length) string += "0";
  283.             string += numbers[i];
  284.         }
  285.  
  286.         return string;
  287.     }
  288.  
  289.     /**
  290.      * @param {HTMLElement} videoRenderer
  291.      * @return {void}
  292.      */
  293.     static transformShortsRenderer(videoRenderer)
  294.     {
  295.  
  296.         /** @type {string} */
  297.         var originalOuterHTML = videoRenderer.outerHTML;
  298.  
  299.         /** @type {string} */
  300.         var lengthText = videoRenderer.data?.lengthText?.simpleText ?? this.extractLengthFromA11y(videoRenderer.data);
  301.  
  302.         /** @type {string} */
  303.         var lengthA11y = videoRenderer.data?.lengthText?.accessibility?.accessibilityData?.label ?? "";
  304.  
  305.         /** @type {string} */
  306.         var originalHref = videoRenderer.data.navigationEndpoint.commandMetadata.webCommandMetadata.url;
  307.         var href = "/watch?v=" + originalHref.replace(/\/|shorts|\?.*/g, "");
  308.  
  309.         var reelWatchEndpoint = videoRenderer.data.navigationEndpoint.reelWatchEndpoint;
  310.  
  311.         var i;
  312.         videoRenderer.data.thumbnailOverlays.forEach((a, index) =>{
  313.             if ("thumbnailOverlayTimeStatusRenderer" in a)
  314.             {
  315.                 i = index;
  316.             }
  317.         });
  318.  
  319.         // Set the thumbnail overlay style
  320.         videoRenderer.data.thumbnailOverlays[i].thumbnailOverlayTimeStatusRenderer.style = "DEFAULT";
  321.  
  322.         delete videoRenderer.data.thumbnailOverlays[i].thumbnailOverlayTimeStatusRenderer.icon;
  323.  
  324.         // Set the thumbnail overlay text
  325.         videoRenderer.data.thumbnailOverlays[i].thumbnailOverlayTimeStatusRenderer.text.simpleText = lengthText;
  326.  
  327.         // Set the thumbnail overlay accessibility label
  328.         videoRenderer.data.thumbnailOverlays[i].thumbnailOverlayTimeStatusRenderer.text.accessibility.accessibilityData.label = lengthA11y;
  329.  
  330.         // Set the navigation endpoint metadata (used for middle click)
  331.         videoRenderer.data.navigationEndpoint.commandMetadata.webCommandMetadata.webPageType = "WEB_PAGE_TYPE_WATCH";
  332.         videoRenderer.data.navigationEndpoint.commandMetadata.webCommandMetadata.url = href;
  333.  
  334.         videoRenderer.data.navigationEndpoint.watchEndpoint = {
  335.             "videoId": reelWatchEndpoint.videoId,
  336.             "playerParams": reelWatchEndpoint.playerParams,
  337.             "params": reelWatchEndpoint.params
  338.         };
  339.         delete videoRenderer.data.navigationEndpoint.reelWatchEndpoint;
  340.  
  341.         //var _ = videoRenderer.data; videoRenderer.data = {}; videoRenderer.data = _;
  342.  
  343.         // Sometimes the old school data cycle trick fails,
  344.         // however this always works.
  345.         var _ = videoRenderer.cloneNode();
  346.         _.data = videoRenderer.data;
  347.         for (var i in videoRenderer.properties)
  348.         {
  349.             _[i] = videoRenderer[i];
  350.         }
  351.         videoRenderer.insertAdjacentElement("afterend", _);
  352.         videoRenderer.remove();
  353.     }
  354. }
  355.  
  356. /**
  357.  * Sometimes elements are reused on page updates, so fix that
  358.  *
  359.  * @return {void}
  360.  */
  361. function onDataUpdate()
  362. {
  363.     var videos = document.querySelectorAll("ytd-video-renderer, ytd-grid-video-renderer");
  364.  
  365.     for (var i = 0, l = videos.length; i < l; i++) if (ShortsTools.isShortsRenderer(videos[i]))
  366.     {
  367.         ShortsTools.transformShortsRenderer(videos[i]);
  368.     }
  369. }
  370.  
  371. /**
  372.  * I hope she makes lotsa spaghetti :D
  373.  * @async @return {Promise<void>}
  374.  */
  375. async function main()
  376. {
  377.     // If not Polymer, nothing happens
  378.     if (await YtdTools.isPolymer())
  379.     {
  380.         ShortsTools.watchForShorts();
  381.  
  382.         document.addEventListener("yt-page-data-updated", onDataUpdate);
  383.     }
  384. }
  385.  
  386. main();
  387.  
  388. })();
  389.  
  390. // Other tweaks to be added (CSS codes, skip ads, etc...)
  391. (function() {
  392. let css = `
  393. /* Remove 'Shorts' tab */
  394. #endpoint.yt-simple-endpoint.ytd-guide-entry-renderer.style-scope[title="Shorts"],
  395. a.yt-simple-endpoint.style-scope.ytd-mini-guide-entry-renderer[title="Shorts"] {
  396. display: none !important;
  397. }
  398.  
  399. /* Remove filter categories on search results and playlists to make the UI less usable on low-entry machines */
  400. ytd-item-section-renderer.style-scope.ytd-section-list-renderer[page-subtype="playlist"] > #header.ytd-item-section-renderer > ytd-feed-filter-chip-bar-renderer {
  401. display: none !important;
  402. }
  403.  
  404. div#chip-bar.style-scope.ytd-search-header-renderer > yt-chip-cloud-renderer.style-scope.ytd-search-header-renderer > div#container.style-scope.yt-chip-cloud-renderer {
  405. display: none !important;
  406. }
  407.  
  408. /* Remove all annoyances (excludes 'YT TV and Premium' banners) */
  409. ytd-action-companion-ad-renderer, ytd-display-ad-renderer, ytd-video-masthead-ad-advertiser-info-renderer, ytd-video-masthead-ad-primary-video-renderer, ytd-in-feed-ad-layout-renderer, ytd-ad-slot-renderer, yt-about-this-ad-renderer, yt-mealbar-promo-renderer, ytd-ad-slot-renderer, ytd-in-feed-ad-layout-renderer, .ytd-video-masthead-ad-v3-renderer, div#root.style-scope.ytd-display-ad-renderer.yt-simple-endpoint, div#sparkles-container.style-scope.ytd-promoted-sparkles-web-renderer, div#main-container.style-scope.ytd-promoted-video-renderer, #player-ads, .ytwPanelAdHeaderImageLockupViewModelHost, ytd-ads-engagement-panel-content-renderer, #content.ytd-ads-engagement-panel-content-renderer, ytd-engagement-panel-section-list-renderer[target-id="engagement-panel-ads"], ad-slot-renderer, ytm-promoted-sparkles-web-renderer, masthead-ad, #masthead-ad, ytd-video-quality-promo-renderer, #yt-lang-alert-container, .YtmPaidContentOverlayHost, .ytd-primetime-promo-renderer, ytd-brand-video-singleton-renderer, #yt-feedback, #yt-hitchhiker-feedback, ytd-merch-shelf-renderer, ytd-enforcement-message-view-model, div[is-shared-heimdall], tp-yt-iron-overlay-backdrop.opened, ytd-promoted-sparkles-web-renderer, ytd-text-image-no-button-layout-renderer, #cinematics.ytd-watch-flexy {
  410. display: none !important
  411. }
  412.  
  413. #movie_player.ad-showing video {
  414. filter: blur(100px) opacity(0.25) grayscale(0.5);
  415. }
  416.  
  417. #movie_player.ad-showing .ytp-title,
  418. #movie_player.ad-showing .ytp-title-channel,
  419. .ytp-visit-advertiser-link,
  420. .ytp-ad-visit-advertiser-button,
  421. ytmusic-app:has(#movie_player.ad-showing)
  422.   ytmusic-player-bar
  423.   :is(.title, .subtitle) {
  424.   filter: blur(4px) opacity(0.5) grayscale(0.5);
  425.   transition: 0.05s filter linear;
  426. }
  427.  
  428. :is(#movie_player.ad-showing .ytp-title,#movie_player.ad-showing .ytp-title-channel,.ytp-visit-advertiser-link,.ytp-ad-visit-advertiser-button,ytmusic-app:has(#movie_player.ad-showing) ytmusic-player-bar :is(.title,.subtitle)):is(:hover,:focus-within) {
  429. filter: none;
  430. }
  431.  
  432. .ytp-suggested-action-badge {
  433. visibility: hidden !important;
  434. }
  435.  
  436. ytd-watch-metadata.ytd-watch-flexy {
  437. padding-bottom: 36px !important;
  438. }
  439.  
  440. /* Disable infinite scrolling (partially broken when YouTube changes their backend) */
  441. #related ytd-compact-video-renderer, #related ytd-compact-playlist-renderer, #related ytd-compact-radio-renderer, #related ytd-compact-movie-renderer, #related yt-lockup-view-model, #related ytd-channel-renderer, #related ytd-continuation-item-renderer, #related #continuations {
  442. display: none !important
  443. }
  444.  
  445. #related ytd-compact-video-renderer:nth-of-type(1), #related yt-lockup-view-model:nth-of-type(1), #related ytd-compact-video-renderer:nth-of-type(2), #related yt-lockup-view-model:nth-of-type(2), #related ytd-compact-video-renderer:nth-of-type(3), #related yt-lockup-view-model:nth-of-type(3), #related ytd-compact-video-renderer:nth-of-type(4), #related yt-lockup-view-model:nth-of-type(4), #related ytd-compact-video-renderer:nth-of-type(5), #related yt-lockup-view-model:nth-of-type(5), #related ytd-compact-video-renderer:nth-of-type(6), #related yt-lockup-view-model:nth-of-type(6), #secondary #related ytd-compact-video-renderer:nth-of-type(7), #secondary #related yt-lockup-view-model:nth-of-type(7), #secondary #related ytd-compact-video-renderer:nth-of-type(8), #secondary #related yt-lockup-view-model:nth-of-type(8), #secondary #related ytd-compact-video-renderer:nth-of-type(9), #secondary #related yt-lockup-view-model:nth-of-type(9), #secondary #related ytd-compact-video-renderer:nth-of-type(10), #secondary #related yt-lockup-view-model:nth-of-type(10) {
  446. display: flex !important
  447. }
  448.  
  449. /* More tweaks to the UI (this was meant for older browsers without uBlock Origin) */
  450. #secondary.ytd-watch-grid {
  451. width: 402px !important;
  452. min-width: 300px !important
  453. }
  454.  
  455. ytd-watch-flexy[default-layout][reduced-top-margin] #primary.ytd-watch-flexy, ytd-watch-flexy[default-layout][reduced-top-margin] #secondary.ytd-watch-flexy {
  456. padding-top: var(--ytd-margin-6x) !important
  457. }
  458.  
  459. ytd-watch-metadata[title-headline-xs] h1.ytd-watch-metadata, ytd-watch-metadata[title-headline-m] h1.ytd-watch-metadata {
  460. font-size: 2rem !important;
  461. line-height: 2.8rem !important
  462. }
  463.  
  464. ytd-search ytd-video-renderer, ytd-search ytd-channel-renderer, ytd-search ytd-playlist-renderer, ytd-search ytd-radio-renderer, ytd-search ytd-movie-renderer, ytd-video-renderer.style-scope.ytd-item-section-renderer, ytd-playlist-renderer.style-scope.ytd-item-section-renderer, ytd-search .lockup.ytd-item-section-renderer {
  465. margin-top: 16px !important
  466. }
  467.  
  468. ytd-compact-video-renderer.style-scope.ytd-item-section-renderer, #related .lockup.ytd-item-section-renderer {
  469. margin-top: 8px !important
  470. }`;
  471. if (typeof GM_addStyle !== "undefined") {
  472.   GM_addStyle(css);
  473. } else {
  474.   let styleNode = document.createElement("style");
  475.   styleNode.appendChild(document.createTextNode(css));
  476.   (document.querySelector("head") || document.documentElement).appendChild(styleNode);
  477. }
  478. })();
  479.  
  480.  
  481. var oldHref = document.location.href;
  482. if (window.location.href.indexOf('youtube.com/shorts') > -1) {
  483.     window.location.replace(window.location.toString().replace('/shorts/', '/watch?v='));
  484. }
  485. window.onload = function() {
  486.     var bodyList = document.querySelector("body")
  487.     var observer = new MutationObserver(function(mutations) {
  488.         mutations.forEach(function(mutation) {
  489.             if (oldHref != document.location.href) {
  490.                 oldHref = document.location.href;
  491.                 console.log('location changed!');
  492.                 if (window.location.href.indexOf('youtube.com/shorts') > -1) {
  493.                     window.location.replace(window.location.toString().replace('/shorts/', '/watch?v='));
  494.                 }
  495.             }
  496.         });
  497.     });
  498.     var config = {
  499.         childList: true,
  500.         subtree: true
  501.     };
  502.     observer.observe(bodyList, config);
  503. };
  504.  
  505. (() => {
  506.  
  507.   let popupState = 0;
  508.   let popupElement = null;
  509.  
  510.   const rate = 1;
  511.  
  512.   const Promise = (async () => { })().constructor;
  513.  
  514.   const PromiseExternal = ((resolve_, reject_) => {
  515.     const h = (resolve, reject) => { resolve_ = resolve; reject_ = reject };
  516.     return class PromiseExternal extends Promise {
  517.       constructor(cb = h) {
  518.         super(cb);
  519.         if (cb === h) {
  520.           /** @type {(value: any) => void} */
  521.           this.resolve = resolve_;
  522.           /** @type {(reason?: any) => void} */
  523.           this.reject = reject_;
  524.         }
  525.       }
  526.     };
  527.   })();
  528.  
  529.   const insp = o => o ? (o.polymerController || o.inst || o || 0) : (o || 0);
  530.  
  531.   let vload = null;
  532.  
  533.   const fastSeekFn = HTMLVideoElement.prototype.fastSeek || null;
  534.   const addEventListenerFn = HTMLElement.prototype.addEventListener;
  535.   if (!addEventListenerFn) return;
  536.   const removeEventListenerFn = HTMLElement.prototype.removeEventListener;
  537.   if (!removeEventListenerFn) return;
  538.  
  539.   const ytPremiumPopupSelector = 'yt-mealbar-promo-renderer.style-scope.ytd-popup-container:not([hidden])';
  540.  
  541.   const DEBUG = 0;
  542.  
  543.   const rand = (a, b) => a + Math.random() * (b - a);
  544.   const log = DEBUG ? console.log.bind(console) : () => 0;
  545.  
  546.   //$0.$['dismiss-button'].click()
  547.   const ytPremiumPopupClose = function () {
  548.     const popup = document.querySelector(ytPremiumPopupSelector);
  549.     if (popup instanceof HTMLElement) {
  550.       if (HTMLElement.prototype.closest.call(popup, '[hidden]')) return;
  551.       const cnt = insp(popup);
  552.       const btn = cnt.$ ? cnt.$['dismiss-button'] : 0;
  553.       if (btn instanceof HTMLElement && HTMLElement.prototype.closest.call(btn, '[hidden]')) return;
  554.       btn && btn.click();
  555.     }
  556.   }
  557.  
  558.   //div.video-ads.ytp-ad-module
  559.   const clickSkip = function () {
  560.     // ytp-ad-skip-button
  561.     const isAdsContainerContainsButton = document.querySelector('.video-ads.ytp-ad-module button');
  562.     if (isAdsContainerContainsButton) {
  563.  
  564.       const btnFilter = e => HTMLElement.prototype.matches.call(e, ".ytp-ad-overlay-close-button, .ytp-ad-skip-button-modern, .ytp-ad-skip-button") && !HTMLElement.prototype.closest.call(e, '[hidden]');
  565.       const btns = [...document.querySelectorAll('.video-ads.ytp-ad-module button[class*="ytp-ad-"]')].filter(btnFilter);
  566.       console.log('# of ads skip btns', btns.length);
  567.       if (btns.length !== 1) return;
  568.       const btn = btns[0];
  569.       if (btn instanceof HTMLElement) {
  570.         btn.click();
  571.       }
  572.  
  573.     }
  574.   };
  575.  
  576.   const adsEndHandlerHolder = function (evt) {
  577.  
  578.     adsEndHandler && adsEndHandler(evt);
  579.  
  580.   }
  581.  
  582.   let adsEndHandler = null;
  583.  
  584.  
  585.   const videoPlayingHandler = async function (evt) {
  586.     try {
  587.  
  588.       if (!evt || !evt.target || !evt.isTrusted || !(evt instanceof Event)) return;
  589.       const video = evt.target;
  590.  
  591.       const checkPopup = popupState === 1;
  592.       popupState = 0;
  593.  
  594.       const popupElementValue = popupElement;
  595.       popupElement = null;
  596.  
  597.       if (video.duration < 0.8) return;
  598.  
  599.       await vload.then();
  600.       if (!video.isConnected) return;
  601.  
  602.       const ytplayer = HTMLElement.prototype.closest.call(video, 'ytd-player, ytmusic-player');
  603.       if (!ytplayer || !ytplayer.is) return;
  604.  
  605.       const ytplayerCnt = insp(ytplayer);
  606.       const player_ = await (ytplayerCnt.player_ || ytplayer.player_ || ytplayerCnt.playerApi || ytplayer.playerApi || 0);
  607.       if (!player_) return;
  608.  
  609.       if (typeof ytplayerCnt.getPlayer === 'function' && !ytplayerCnt.getPlayer()) {
  610.         await new Promise(r => setTimeout(r, 40));
  611.       }
  612.       const playerController = await ytplayerCnt.getPlayer() || player_;
  613.       if (!video.isConnected) return;
  614.  
  615.       if ('getPresentingPlayerType' in playerController && 'getDuration' in playerController) {
  616.  
  617.         const ppType = await playerController.getPresentingPlayerType();
  618.  
  619.         log('m02a', ppType);
  620.         if (ppType === 1 || typeof ppType !== 'number') return; // ads shall be ppType === 2
  621.         // const progressState = player_.getProgressState();
  622.         // log('m02b', progressState);
  623.         // if(!progressState) return;
  624.         // const q = progressState.duration;
  625.  
  626.         // if (popupState === 1) console.debug('m05b:ytPremiumPopup', document.querySelector(ytPremiumPopupSelector))
  627.  
  628.         const q = video.duration;
  629.  
  630.         const ytDuration = await playerController.getDuration();
  631.         log('m02c', q, ytDuration, Math.abs(ytDuration - q));
  632.  
  633.         if (q > 0.8 && ytDuration > 2.5 && Math.abs(ytDuration - q) > 1.4) {
  634.           try {
  635.             log('m02s', 'fastSeek', q);
  636.             video.muted = true;
  637.             const w = Math.round(rand(582, 637) * rate);
  638.             const sq = q - w / 1000;
  639.  
  640.             adsEndHandler = null;
  641.  
  642.             const expired = Date.now() + 968;
  643.  
  644.             removeEventListenerFn.call(video, 'ended', adsEndHandlerHolder, false);
  645.             removeEventListenerFn.call(video, 'suspend', adsEndHandlerHolder, false);
  646.             removeEventListenerFn.call(video, 'durationchange', adsEndHandlerHolder, false);
  647.             addEventListenerFn.call(video, 'ended', adsEndHandlerHolder, false);
  648.             addEventListenerFn.call(video, 'suspend', adsEndHandlerHolder, false);
  649.             addEventListenerFn.call(video, 'durationchange', adsEndHandlerHolder, false);
  650.  
  651.             adsEndHandler = async function (evt) {
  652.               adsEndHandler = null;
  653.  
  654.               removeEventListenerFn.call(video, 'ended', adsEndHandlerHolder, false);
  655.               removeEventListenerFn.call(video, 'suspend', adsEndHandlerHolder, false);
  656.               removeEventListenerFn.call(video, 'durationchange', adsEndHandlerHolder, false);
  657.  
  658.               if (Date.now() < expired) {
  659.  
  660.                 const delay = Math.round(rand(92, 117));
  661.                 await new Promise(r => setTimeout(r, delay));
  662.  
  663.                 Promise.resolve().then(() => {
  664.                   clickSkip();
  665.                 }).catch(console.warn);
  666.  
  667.                 checkPopup && Promise.resolve().then(() => {
  668.                   const currentPopup = document.querySelector(ytPremiumPopupSelector);
  669.                   if (popupElementValue ? currentPopup === popupElementValue : currentPopup) {
  670.                     ytPremiumPopupClose();
  671.                   }
  672.                 }).catch(console.warn);
  673.               }
  674.  
  675.             };
  676.  
  677.             if (fastSeekFn) fastSeekFn.call(video, sq);
  678.             else video.currentTime = sq;
  679.  
  680.           } catch (e) {
  681.             console.warn(e);
  682.           }
  683.         }
  684.  
  685.       }
  686.  
  687.     } catch (e) {
  688.       console.warn(e);
  689.     }
  690.  
  691.   };
  692.  
  693.   document.addEventListener('loadedmetadata', async function (evt) {
  694.     try {
  695.  
  696.       if (!evt || !evt.target || !evt.isTrusted || !(evt instanceof Event)) return;
  697.  
  698.       const video = evt.target;
  699.       if (video.nodeName !== "VIDEO") return;
  700.       if (video.duration < 0.8) return;
  701.       if (!video.matches('.video-stream.html5-main-video')) return;
  702.  
  703.       popupState = 0;
  704.  
  705.       vload = new PromiseExternal();
  706.  
  707.       popupElement = document.querySelector(ytPremiumPopupSelector);
  708.  
  709.       removeEventListenerFn.call(video, 'playing', videoPlayingHandler, { passive: true, capture: false });
  710.  
  711.       addEventListenerFn.call(video, 'playing', videoPlayingHandler, { passive: true, capture: false });
  712.  
  713.       popupState = 1;
  714.  
  715.       let trial = 6;
  716.  
  717.       await new Promise(resolve => {
  718.  
  719.         let io = new IntersectionObserver(entries => {
  720.           if (trial-- <= 0 || (entries && entries.length >= 1 && video.matches('ytd-player video, ytmusic-player video'))) {
  721.             resolve();
  722.             io.disconnect();
  723.             io = null;
  724.           }
  725.         });
  726.         io.observe(video);
  727.  
  728.       });
  729.  
  730.       vload.resolve();
  731.  
  732.     } catch (e) {
  733.       console.warn(e);
  734.     }
  735.  
  736.   }, true);
  737.  
  738. })();
  739.  
  740. Object.defineProperties(document, { /*'hidden': {value: false},*/ 'webkitHidden': {value: false}, 'visibilityState': {value: 'visible'}, 'webkitVisibilityState': {value: 'visible'} });
  741.  
  742. setInterval(function(){
  743.     document.dispatchEvent( new KeyboardEvent( 'keyup', { bubbles: true, cancelable: true, keyCode: 143, which: 143 } ) );
  744. }, 60000);
  745.  
  746. //
  747. // What is this userscript trying to address?
  748. // When playing a video, only a small part of the video loads, and the subsequent
  749. // parts do not load afterward.
  750.  
  751. (function () {
  752.   "use strict";
  753.  
  754.   const originalGetContext = HTMLCanvasElement.prototype.getContext;
  755.   HTMLCanvasElement.prototype.getContext = function (contextType) {
  756.     if (contextType === "webgl" || contextType === "webgl2") {
  757.       console.log("WebGL is disabled by Tampermonkey");
  758.       return null;
  759.     }
  760.     return originalGetContext.apply(this, arguments);
  761.   };
  762. })();