☰

YT Theatermode

Auto and full screeded Theater mode.

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

  1. // ==UserScript==
  2. // @name        YT Theatermode
  3. // @description Auto and full screeded Theater mode.
  4.  
  5. // @name:ko     유튜브 극장모드
  6. // @description:ko 유튜브 화면을 자동으로 꽉 찬 화면으로 바꿉니다.
  7.  
  8. // @namespace   https://ndaesik.tistory.com/
  9. // @version     2021.11.02.17:43
  10. // @author      ndaesik
  11. // @icon        https://lh3.googleusercontent.com/iLZyxGK7l1343U4E7eAfgKbRWW6qhzCJq-Z92M60JzCMntFyaFF2GUQVRxPhfGcy6qRISLjHv4fX1vtq0TZkZMAzBjM
  12. // @match       https://www.youtube.com/*
  13. // ==/UserScript==
  14.  
  15. window.addEventListener("yt-navigate-finish", function(event) {
  16.   var timer = setTimeout(function() {
  17.       if ((document.querySelector('ytd-player').offsetWidth + 100) < window.innerWidth) document.querySelector('.ytp-size-button').click();
  18.   }, 500)
  19. })
  20.  
  21. var styles = `
  22. [dark] .gstl_50.sbdd_a *{background-color:#232323!important;border-color:#282828!important}
  23. [dark] .gsfs,[dark] .sbpqs_a{color:#FFF!important}
  24.  
  25. ytd-app:not([guide-persistent-and-visible]) ytd-page-manager {
  26.   margin-top: 0!important;
  27. }
  28.  
  29. ytd-app:not([guide-persistent-and-visible]) #player-theater-container:empty~#columns #primary,
  30. ytd-app:not([guide-persistent-and-visible]) #player-theater-container:empty~#columns #secondary{
  31.     padding-top: 56px;
  32. }
  33.  
  34. ytd-app:not([guide-persistent-and-visible]) ytd-masthead,
  35. ytd-app:not([guide-persistent-and-visible]) #masthead-container.ytd-app::after {
  36.   transform: translateY(-56px);
  37.   transition: transform .1s .5s ease-out;
  38. }
  39. ytd-app:not([guide-persistent-and-visible]) #masthead-container:hover ytd-masthead,
  40. ytd-app:not([guide-persistent-and-visible]) #masthead-container:hover.ytd-app::after {
  41.   transform: translateY(0px);
  42. }
  43.  
  44. ytd-app:not([guide-persistent-and-visible]) [theater] #player.ytd-watch {
  45.   height: 100vh!important;
  46.   max-height: 100vh!important;
  47. }
  48.  
  49. ytd-watch-flexy[theater] #player-theater-container.ytd-watch-flexy,
  50. ytd-watch-flexy[fullscreen] #player-theater-container.ytd-watch-flexy,
  51. ytd-app:not([guide-persistent-and-visible]) [theater] #player video {
  52.   width: 100%!important;
  53.   height: 100vh!important;
  54.   max-height: 100vh!important;
  55.   max-width: 100%!important;
  56.   left: 0!important;
  57. }
  58.  
  59. ytd-app:not([guide-persistent-and-visible]) .ytp-chrome-top.ytp-share-button-visible,
  60. ytd-app:not([guide-persistent-and-visible]) #iv-drawer .iv-drawer-header,
  61. ytd-app:not([guide-persistent-and-visible]) #iv-drawer .iv-drawer-content {
  62.   margin-top: 30px;
  63. }
  64.  
  65. ytd-app:not([guide-persistent-and-visible]) [theater] .ytp-chrome-top.ytp-share-button-visible,
  66. ytd-app:not([guide-persistent-and-visible]) [theater] #iv-drawer .iv-drawer-header,
  67. ytd-app:not([guide-persistent-and-visible]) [theater] #iv-drawer .iv-drawer-content,
  68. ytd-app:not([guide-persistent-and-visible]) [theater] .ytp-multicam-menu-header,
  69. ytd-app:not([guide-persistent-and-visible]) [theater] .ytp-multicam-menu-items,
  70. ytd-app:not([guide-persistent-and-visible]) [theater] .ytp-playlist-menu-header,
  71. ytd-app:not([guide-persistent-and-visible]) [theater] .ytp-playlist-menu-items,
  72. ytd-app:not([guide-persistent-and-visible]) [theater] .ytp-share-panel-close {
  73.   margin-top: 56px;
  74. }
  75.  
  76. ytd-app:not([guide-persistent-and-visible]) .ytp-tooltip.ytp-tooltip-opaque.ytp-bottom {
  77.   right: 60px!important;
  78.   top: 35px!important;
  79. }
  80.  
  81. ytd-app:not([guide-persistent-and-visible]) [theater] .ytp-tooltip.ytp-tooltip-opaque.ytp-bottom {
  82.   right: 60px!important;
  83.   top: 60px!important;
  84. }
  85. `
  86.  
  87. var styleSheet = document.createElement("style")
  88. styleSheet.type = "text/css"
  89. styleSheet.innerText = styles
  90. document.head.appendChild(styleSheet)