☰

YouTube Popup Window

Enhances YouTube with a popup window feature.

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

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