☰

YouTube Popup Window

Enhances YouTube with a popup window feature.

当前为 2023-05-25 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name         YouTube Popup Window
  3. // @namespace    http://tampermonkey.net/
  4. // @version      0.1.0
  5. // @description  Enhances YouTube with a popup window feature.
  6. // @author       CY Fung
  7. // @license      MIT
  8. // @match        https://www.youtube.com/*
  9. // @icon         https://www.google.com/s2/favicons?sz=64&domain=youtube.com
  10. // @grant        GM_registerMenuCommand
  11. // @allFrames
  12. // ==/UserScript==
  13.  
  14. (function $$() {
  15.     'use strict';
  16.     const winName = 'x4tGg';
  17.     const styleName = 'rCbM3';
  18.  
  19.     if (window.name === winName && window === top) {
  20.  
  21.         if (!document.head) return requestAnimationFrame($$);
  22.  
  23.         let style = document.createElement('style');
  24.         style.id = styleName;
  25.  
  26.         style.textContent = `
  27.         *[class][id].style-scope.ytd-watch-flexy {
  28.             min-width: unset !important;
  29.             min-height: unset !important;
  30.         }
  31.         `
  32.  
  33.         document.head.appendChild(style);
  34.  
  35.     } else if (window !== top && top.name === winName) {
  36.  
  37.  
  38.         if (!document.head) return requestAnimationFrame($$);
  39.  
  40.         let style = document.createElement('style');
  41.         style.id = styleName;
  42.  
  43.         style.textContent = `
  44.         * {
  45.             min-width: unset !important;
  46.             min-height: unset !important;
  47.         }
  48.         `
  49.  
  50.         document.head.appendChild(style);
  51.  
  52.  
  53.     } else if (window === top) {
  54.  
  55.         function openPopup() {
  56.             var currentUrl = window.location.href;
  57.             let rect = document.querySelector('ytd-app').getBoundingClientRect();
  58.             let w = rect.width;
  59.             let h = rect.height;
  60.             var popupOptions = `toolbar=no,location=no,status=no,menubar=no,scrollbars=yes,resizable=yes,width=${w},height=${h}`;
  61.  
  62.  
  63.             let video = document.querySelector('#player video');
  64.  
  65.             if (video) {
  66.                 video.pause();
  67.             }
  68.             let win = window.open(currentUrl, '', popupOptions);
  69.             win.name = winName;
  70.  
  71.  
  72.             document.querySelector('#x4tGg').remove();
  73.  
  74.         }
  75.  
  76.  
  77.  
  78.         GM_registerMenuCommand('Open Popup Window', function () {
  79.  
  80.             if (document.querySelector('#x4tGg')) return;
  81.  
  82.             let div = document.body.appendChild(document.createElement('div'));
  83.             div.id = 'x4tGg';
  84.             div.textContent = 'Click to Open Popup'
  85.  
  86.             Object.assign(div.style, {
  87.                 'position': 'fixed',
  88.                 'left': '50vw',
  89.                 'top': '50vh',
  90.                 'padding': '28px',
  91.                 'backgroundColor': 'rgb(56, 94, 131)',
  92.                 'color': '#fff',
  93.                 'borderRadius': '16px',
  94.                 'fontSize': '18pt',
  95.                 'zIndex': '9999',
  96.                 'transform': 'translate(-50%, -50%)'
  97.             })
  98.  
  99.             div.onclick = function () {
  100.  
  101.                 openPopup();
  102.             }
  103.  
  104.         });
  105.  
  106.     }
  107.     // Your code here...
  108. })();