☰

YouTube Popup Window

Enhances YouTube with a popup window feature.

目前为 2024-02-22 提交的版本。查看 最新版本。

  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.2.0
  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. // @require             https://cdn.jsdelivr.net/npm/@violentmonkey/shortcut@1.4.1
  15. // @grant               GM_registerMenuCommand
  16. // @allFrames           true
  17. // ==/UserScript==
  18.  
  19. (function $$() {
  20.     'use strict';
  21.     const shortcutKey = 'ctrlcmd-a-keya';
  22.  
  23.     const winName = 'x4tGg';
  24.     const styleName = 'rCbM3';
  25.  
  26.     function getVideo() {
  27.         return document.querySelector('.video-stream.html5-main-video');
  28.     }
  29.  
  30.     function registerKeyboard(o) {
  31.  
  32.         const { openPopup } = o;
  33.  
  34.         const { KeyboardService } = VM.shortcut;
  35.  
  36.         const service = new KeyboardService();
  37.  
  38.         service.setContext('activeOnInput', false);
  39.  
  40.         async function updateActiveOnInput() {
  41.             const elm = document.activeElement;
  42.             service.setContext('activeOnInput', elm instanceof HTMLInputElement || elm instanceof HTMLTextAreaElement);
  43.         }
  44.  
  45.         document.addEventListener('focus', (e) => {
  46.             updateActiveOnInput();
  47.         }, true);
  48.  
  49.         document.addEventListener('blur', (e) => {
  50.             updateActiveOnInput();
  51.         }, true);
  52.  
  53.         service.register(shortcutKey, openPopup, {
  54.             condition: '!activeOnInput',
  55.         });
  56.         service.enable();
  57.  
  58.     }
  59.  
  60.     if (window.name === winName && window === top) {
  61.  
  62.         if (!document.head) return requestAnimationFrame($$);
  63.  
  64.         let style = document.createElement('style');
  65.         style.id = styleName;
  66.  
  67.         style.textContent = `
  68.         *[class][id].style-scope.ytd-watch-flexy {
  69.             min-width: unset !important;
  70.             min-height: unset !important;
  71.         }
  72.         `
  73.  
  74.         document.head.appendChild(style);
  75.  
  76.     } else if (window !== top && top.name === winName) {
  77.  
  78.  
  79.         if (!document.head) return requestAnimationFrame($$);
  80.  
  81.         let style = document.createElement('style');
  82.         style.id = styleName;
  83.  
  84.         style.textContent = `
  85.         * {
  86.             min-width: unset !important;
  87.             min-height: unset !important;
  88.         }
  89.         `
  90.  
  91.         document.head.appendChild(style);
  92.  
  93.  
  94.     } else if (window === top) {
  95.  
  96.         function openPopup() {
  97.  
  98.             var currentUrl = window.location.href;
  99.             let rect = document.querySelector('ytd-app').getBoundingClientRect();
  100.             let w = rect.width;
  101.             let h = rect.height;
  102.             var popupOptions = `toolbar=no,location=no,status=no,menubar=no,scrollbars=yes,resizable=yes,width=${w},height=${h}`;
  103.  
  104.             let video = getVideo();
  105.  
  106.             if (video) {
  107.                 video.pause();
  108.             }
  109.             let win = window.open(currentUrl, '', popupOptions);
  110.             win.name = winName;
  111.  
  112.             document.querySelector('#x4tGg').remove();
  113.  
  114.         }
  115.  
  116.         GM_registerMenuCommand('Open Popup Window', function () {
  117.  
  118.             if (document.querySelector('#x4tGg')) return;
  119.  
  120.             let div = document.body.appendChild(document.createElement('div'));
  121.             div.id = 'x4tGg';
  122.             div.textContent = 'Click to Open Popup'
  123.  
  124.             Object.assign(div.style, {
  125.                 'position': 'fixed',
  126.                 'left': '50vw',
  127.                 'top': '50vh',
  128.                 'padding': '28px',
  129.                 'backgroundColor': 'rgb(56, 94, 131)',
  130.                 'color': '#fff',
  131.                 'borderRadius': '16px',
  132.                 'fontSize': '18pt',
  133.                 'zIndex': '9999',
  134.                 'transform': 'translate(-50%, -50%)'
  135.             })
  136.  
  137.             div.onclick = function () {
  138.  
  139.                 openPopup();
  140.             }
  141.  
  142.         });
  143.  
  144.         registerKeyboard({ openPopup });
  145.  
  146.     }
  147.     // Your code here...
  148.  
  149. })();

欢迎访问Greasy Fork镜像

土豆服务器，请按需使用

镜像地址随时可能被墙，建议加群获取最新地址

加入Q群

QingJ © 2025

镜像随时可能失效，请加Q群300939539或关注我们的公众号极客氢云获取最新地址