Resize YT To Window Size

Moves the video to the top of the website and resizes it to the screen size.

当前为 2015-04-29 提交的版本,查看 最新版本

  1. // ==UserScript==
  2. // @name Resize YT To Window Size
  3. // @description Moves the video to the top of the website and resizes it to the screen size.
  4. // @author Chris H (Zren / Shade)
  5. // @icon https://youtube.com/favicon.ico
  6. // @homepageURL https://github.com/Zren/ResizeYoutubePlayerToWindowSize/
  7. // @namespace http://xshade.ca
  8. // @version 58
  9. // @include http*://*.youtube.com/*
  10. // @include http*://youtube.com/*
  11. // @include http*://*.youtu.be/*
  12. // @include http*://youtu.be/*
  13. // ==/UserScript==
  14.  
  15. // Github: https://github.com/Zren/ResizeYoutubePlayerToWindowSize
  16. // GreasyFork: https://greasyfork.org/scripts/811-resize-yt-to-window-size
  17. // OpenUserJS.org: https://openuserjs.org/scripts/zren/Resize_YT_To_Window_Size
  18. // Userscripts.org: http://userscripts-mirror.org/scripts/show/153699
  19.  
  20. (function (window) {
  21. "use strict";
  22. //--- Imported Globals
  23. // yt
  24. // ytcenter
  25. // ytplayer
  26. var uw = window.top;
  27.  
  28. //--- Already Loaded?
  29. // GreaseMonkey loads this script twice for some reason.
  30. if (uw.ytwp) return;
  31.  
  32. //--- Utils
  33. function isStringType(obj) { return typeof obj === 'string'; }
  34. function isArrayType(obj) { return obj instanceof Array; }
  35. function isObjectType(obj) { return typeof obj === 'object'; }
  36. function isUndefined(obj) { return typeof obj === 'undefined'; }
  37. function buildVenderPropertyDict(propertyNames, value) {
  38. var d = {};
  39. for (var i in propertyNames)
  40. d[propertyNames[i]] = value;
  41. return d;
  42. }
  43.  
  44. //--- jQuery
  45. // Based on jQuery
  46. // https://github.com/jquery/jquery/blob/master/src/manipulation.js
  47. var core_rnotwhite = /\S+/g;
  48. var rclass = /[\t\r\n\f]/g;
  49. var rtrim = /^(\s|\u00A0)+|(\s|\u00A0)+$/g;
  50.  
  51. var jQuery = {
  52. trim: function( text ) {
  53. return (text || "").replace( rtrim, "" );
  54. },
  55. addClass: function( elem, value ) {
  56. var classes, cur, clazz, j,
  57. proceed = typeof value === "string" && value;
  58.  
  59. if ( proceed ) {
  60. // The disjunction here is for better compressibility (see removeClass)
  61. classes = ( value || "" ).match( core_rnotwhite ) || [];
  62.  
  63. cur = elem.nodeType === 1 && ( elem.className ?
  64. ( " " + elem.className + " " ).replace( rclass, " " ) :
  65. " "
  66. );
  67.  
  68. if ( cur ) {
  69. j = 0;
  70. while ( (clazz = classes[j++]) ) {
  71. if ( cur.indexOf( " " + clazz + " " ) < 0 ) {
  72. cur += clazz + " ";
  73. }
  74. }
  75. elem.className = jQuery.trim( cur );
  76. }
  77. }
  78. },
  79. removeClass: function( elem, value ) {
  80. var classes, cur, clazz, j,
  81. proceed = arguments.length === 0 || typeof value === "string" && value;
  82.  
  83. if ( proceed ) {
  84. classes = ( value || "" ).match( core_rnotwhite ) || [];
  85.  
  86. // This expression is here for better compressibility (see addClass)
  87. cur = elem.nodeType === 1 && ( elem.className ?
  88. ( " " + elem.className + " " ).replace( rclass, " " ) :
  89. ""
  90. );
  91.  
  92. if ( cur ) {
  93. j = 0;
  94. while ( (clazz = classes[j++]) ) {
  95. // Remove *all* instances
  96. while ( cur.indexOf( " " + clazz + " " ) >= 0 ) {
  97. cur = cur.replace( " " + clazz + " ", " " );
  98. }
  99. }
  100. elem.className = value ? jQuery.trim( cur ) : "";
  101. }
  102. }
  103. }
  104. };
  105.  
  106.  
  107. //--- Stylesheet
  108. var JSStyleSheet = function(id) {
  109. this.id = id;
  110. this.stylesheet = '';
  111. };
  112.  
  113. JSStyleSheet.prototype.buildRule = function(selector, styles) {
  114. var s = "";
  115. for (var key in styles) {
  116. s += "\t" + key + ": " + styles[key] + ";\n";
  117. }
  118. return selector + " {\n" + s + "}\n";
  119. };
  120.  
  121. JSStyleSheet.prototype.appendRule = function(selector, k, v) {
  122. if (isArrayType(selector))
  123. selector = selector.join(',\n');
  124. var newStyle;
  125. if (!isUndefined(k) && !isUndefined(v) && isStringType(k)) { // v can be any type (as we stringify it).
  126. var d = {};
  127. d[k] = v;
  128. newStyle = this.buildRule(selector, d);
  129. } else if (!isUndefined(k) && isUndefined(v) && isObjectType(k)) {
  130. newStyle = this.buildRule(selector, k);
  131. } else {
  132. // Invalid Arguments
  133. console.log('Illegal arguments', arguments);
  134. return;
  135. }
  136.  
  137. this.stylesheet += newStyle;
  138. };
  139.  
  140. JSStyleSheet.injectIntoHeader = function(injectedStyleId, stylesheet) {
  141. var styleElement = document.getElementById(injectedStyleId);
  142. if (!styleElement) {
  143. styleElement = document.createElement('style');
  144. styleElement.type = 'text/css';
  145. styleElement.id = injectedStyleId;
  146. document.getElementsByTagName('head')[0].appendChild(styleElement);
  147. }
  148. styleElement.appendChild(document.createTextNode(stylesheet));
  149. };
  150.  
  151. JSStyleSheet.prototype.injectIntoHeader = function(injectedStyleId, stylesheet) {
  152. JSStyleSheet.injectIntoHeader(this.id, this.stylesheet);
  153. };
  154.  
  155. //--- Constants
  156. var scriptShortName = 'ytwp'; // YT Window Player
  157. var scriptStyleId = scriptShortName + '-style'; // ytwp-style
  158. var scriptBodyClassId = scriptShortName + '-window-player'; // .ytwp-window-player
  159. var viewingVideoClassId = scriptShortName + '-viewing-video'; // .ytwp-viewing-video
  160. var topOfPageClassId = scriptShortName + '-scrolltop'; // .ytwp-scrolltop
  161. var scriptBodyClassSelector = 'body.' + scriptBodyClassId; // body.ytwp-window-player
  162.  
  163. var videoContainerId = 'player';
  164. var videoContainerPlacemarkerId = scriptShortName + '-placemarker'; // ytwp-placemarker
  165.  
  166. var transitionProperties = ["transition", "-ms-transition", "-moz-transition", "-webkit-transition", "-o-transition"];
  167.  
  168. //--- YTWP
  169. var ytwp = uw.ytwp = {
  170. scriptShortName: scriptShortName, // YT Window Player
  171. log_: function(logger, args) { logger.apply(console, ['[' + this.scriptShortName + '] '].concat(Array.prototype.slice.call(args))); return 1; },
  172. log: function() { return this.log_(console.log, arguments); },
  173. error: function() { return this.log_(console.error, arguments); },
  174.  
  175. initialized: false,
  176. pageReady: false,
  177. watchPage: false,
  178. };
  179.  
  180. ytwp.util = {
  181. isWatchUrl: function (url) {
  182. if (!url)
  183. url = uw.location.href;
  184. return url.match(/https?:\/\/(www\.)?youtube.com\/watch\?/);
  185. }
  186. };
  187.  
  188. var Html5PlayerFix = {
  189. YTRect: null,
  190. YTApplication: null,
  191. playerInstances: null,
  192. moviePlayer: null,
  193. moviePlayerElement: null,
  194. app: null,
  195. };
  196. Html5PlayerFix.getPlayerRect = function() {
  197. return new Html5PlayerFix.YTRect(Html5PlayerFix.moviePlayerElement.clientWidth, Html5PlayerFix.moviePlayerElement.clientHeight);
  198. };
  199. Html5PlayerFix.getApplicationClass = function() {
  200. if (Html5PlayerFix.YTApplication === null) {
  201. var testEl = document.createElement('div');
  202. var testAppInstance = uw.yt.player.Application.create(testEl, {});
  203. Html5PlayerFix.YTApplication = testAppInstance.constructor;
  204.  
  205. // Cleanup testAppInstance
  206. var playerInstances = Html5PlayerFix.getPlayerInstances();
  207.  
  208. var testAppInstanceKey = null;
  209. Object.keys(playerInstances).forEach(function(key) {
  210. if (playerInstances[key] === testAppInstance) {
  211. testAppInstanceKey = key;
  212. }
  213. });
  214. testAppInstance.dispose();
  215. delete playerInstances[testAppInstanceKey];
  216. }
  217.  
  218.  
  219. return Html5PlayerFix.YTApplication;
  220. };
  221. Html5PlayerFix.getPlayerInstances = function() {
  222. if (Html5PlayerFix.playerInstances === null) {
  223. var YTApplication = Html5PlayerFix.getApplicationClass();
  224. if (YTApplication === null)
  225. return null;
  226.  
  227. // Use yt.player.Application.create to find the playerInstancesKey.
  228. // function (a,b){try{var c=U7.A(a);if(U7.j[c]){try{U7.j[c].dispose()}catch(d){Sf(d)}U7.j[c]=null}var e=new U7(a,b);ti(e,function(){U7.j[c]=null});return U7.j[c]=e}catch(g){throw Sf(g),g;}}
  229. var appCreateRegex = /^function \(\w+,\w+\)\{try\{var \w+=\w+\.\w+\(\w+\);if\(\w+\.(\w+)\[\w+\]\)/;
  230. var fnString = yt.player.Application.create.toString();
  231. var m = appCreateRegex.exec(fnString);
  232. if (m) {
  233. var playerInstancesKey = m[1];
  234. Html5PlayerFix.playerInstances = YTApplication[playerInstancesKey];
  235. } else {
  236. ytwp.error('Error trying to find playerInstancesKey.', fnString);
  237. }
  238. Html5PlayerFix.playerInstances = YTApplication.j;
  239. }
  240.  
  241. return Html5PlayerFix.playerInstances;
  242. };
  243. Html5PlayerFix.getPlayerInstance = function() {
  244. if (!ytwp.ytapp) {
  245. var playerInstances = Html5PlayerFix.getPlayerInstances();
  246. ytwp.log('playerInstances', playerInstances);
  247. var appInstance = null;
  248. var appInstanceKey = null;
  249. Object.keys(playerInstances).forEach(function(key) {
  250. appInstanceKey = key;
  251. appInstance = playerInstances[key];
  252. });
  253. ytwp.ytapp = appInstance;
  254. }
  255. return ytwp.ytapp;
  256. };
  257. Html5PlayerFix.autohideControls = function() {
  258. var moviePlayerElement = document.getElementById('movie_player');
  259. if (!moviePlayerElement) return;
  260. // ytwp.log(moviePlayerElement.classList);
  261. jQuery.removeClass(moviePlayerElement, 'autohide-controlbar autominimize-controls-aspect autohide-controls-fullscreenonly autohide-controls hide-controls-when-cued autominimize-progress-bar autominimize-progress-bar-fullscreenonly autohide-controlbar-fullscreenonly autohide-controls-aspect autohide-controls-fullscreen autominimize-progress-bar-non-aspect');
  262. jQuery.addClass(moviePlayerElement, 'autominimize-progress-bar autohide-controls hide-controls-when-cued');
  263. // ytwp.log(moviePlayerElement.classList);
  264. };
  265. Html5PlayerFix.update = function() {
  266. if (!Html5PlayerFix.playerInstances)
  267. return;
  268. for (var key in Html5PlayerFix.playerInstances) {
  269. var playerInstance = Html5PlayerFix.playerInstances[key];
  270. Html5PlayerFix.updatePlayerInstance(playerInstance);
  271. }
  272. };
  273. Html5PlayerFix.updatePlayerInstance = function(app) {
  274. if (!app)
  275. return;
  276.  
  277. var moviePlayerElement = document.getElementById('movie_player');
  278. var moviePlayer = null;
  279. var moviePlayerKey = null;
  280.  
  281. // function (){var a=this.j.W();return"detailpage"!=a.ka||a.fb?P8.K.vb.call(this):this.ub(!0)}
  282. var clientRectFn1Regex = /^(function \(\)\{var a=this\.\w+\.\w+\(\);return"detailpage"!=a\.\w+).+(:this\.\w+\(!0\)\})$/;
  283. var clientRectFn1 = null;
  284. var clientRectFn1Key = null;
  285.  
  286. // function (a){var b=this.j.W(),c=P8.K.ub.call(this);a||"detailpage"!=b.ka||b.fb||b.experiments.H||(c.height+=30);return c}
  287. var clientRectFn2Regex = /^(function \(a\)\{var b=this\.\w+\.\w+\(\)).*("detailpage"!=).*(return \w})$/;
  288. var clientRectFn2 = null;
  289. var clientRectFn2Key = null;
  290.  
  291. var fnAlreadyReplacedCount = 0;
  292.  
  293. Object.keys(app).forEach(function(key1) {
  294. var val1 = app[key1];//console.log(key1, val1);
  295. if (typeof val1 === 'object' && val1 !== null && val1.element === moviePlayerElement) {
  296. moviePlayer = val1;
  297. moviePlayerKey = key1;
  298.  
  299. Object.keys(moviePlayer.constructor.prototype).forEach(function(key2) {
  300. var val2 = moviePlayer[key2];//console.log(key1, key2, val2);
  301. if (typeof val2 === 'function') {
  302. var fnString = val2.toString();
  303. // console.log(fnString);
  304. if (clientRectFn1 === null && clientRectFn1Regex.test(fnString)) {
  305. clientRectFn1 = val2;
  306. clientRectFn1Key = key2;
  307. } else if (clientRectFn2 === null && clientRectFn2Regex.test(fnString)) {
  308. clientRectFn2 = val2;
  309. clientRectFn2Key = key2;
  310. } else if (val2 === Html5PlayerFix.getPlayerRect) {
  311. fnAlreadyReplacedCount += 1;
  312. } else {
  313. // console.log(key1, key2, val2, '[Not Used]');
  314. }
  315. }
  316. });
  317. }
  318. });
  319.  
  320. if (fnAlreadyReplacedCount > 0) {
  321. return;
  322. }
  323.  
  324. if (moviePlayer === null || clientRectFn1 === null || clientRectFn2 === null) {
  325. console.log('[ytwp] ', '[Error]', 'HTML5 Player has changed or there\'s multiple playerInstances and this one has been destroyed.');
  326. console.log('moviePlayer', moviePlayerKey, moviePlayer);
  327. console.log('clientRectFn1', clientRectFn1Key, clientRectFn1);
  328. console.log('clientRectFn2', clientRectFn2Key, clientRectFn2);
  329. console.log('fnAlreadyReplacedCount', fnAlreadyReplacedCount);
  330. return;
  331. }
  332. Html5PlayerFix.moviePlayerElement = moviePlayerElement;
  333. Html5PlayerFix.YTRect = moviePlayer[clientRectFn1Key].call(moviePlayer).constructor;
  334.  
  335. moviePlayer[clientRectFn1Key] = Html5PlayerFix.getPlayerRect;
  336. moviePlayer[clientRectFn2Key] = Html5PlayerFix.getPlayerRect;
  337. //clientRectUpdateFn();
  338. };
  339. ytwp.Html5PlayerFix = Html5PlayerFix;
  340.  
  341. ytwp.event = {
  342. init: function() {
  343. ytwp.log('init');
  344. if (!ytwp.initialized) {
  345. ytwp.isWatchPage = ytwp.util.isWatchUrl();
  346. if (ytwp.isWatchPage) {
  347. ytwp.event.initStyle();
  348. ytwp.event.initScroller();
  349. ytwp.initialized = true;
  350. ytwp.pageReady = false;
  351. }
  352. }
  353. ytwp.event.onWatchInit();
  354. ytwp.event.html5PlayerFix();
  355. },
  356. initScroller: function() {
  357. // Register listener & Call it now.
  358. unsafeWindow.addEventListener('scroll', ytwp.event.onScroll, false);
  359. unsafeWindow.addEventListener('resize', ytwp.event.onScroll, false);
  360. ytwp.event.onScroll();
  361. },
  362. onScroll: function() {
  363. var viewportHeight = document.documentElement.clientHeight;
  364.  
  365. // topOfPageClassId
  366. if (unsafeWindow.scrollY == 0) {
  367. jQuery.addClass(document.body, topOfPageClassId);
  368. } else {
  369. jQuery.removeClass(document.body, topOfPageClassId);
  370. }
  371.  
  372. // viewingVideoClassId
  373. if (unsafeWindow.scrollY <= viewportHeight) {
  374. jQuery.addClass(document.body, viewingVideoClassId);
  375. } else {
  376. jQuery.removeClass(document.body, viewingVideoClassId);
  377. }
  378. },
  379. initStyle: function() {
  380. ytwp.log('initStyle');
  381. ytwp.style = new JSStyleSheet(scriptStyleId);
  382. ytwp.event.buildStylesheet();
  383. ytwp.style.injectIntoHeader();
  384. },
  385. buildStylesheet: function() {
  386. ytwp.log('buildStylesheet');
  387. //--- Video Player
  388.  
  389. //
  390. var d;
  391. d = buildVenderPropertyDict(transitionProperties, 'left 0s linear, padding-left 0s linear');
  392. d['padding'] = '0 !important';
  393. d['margin'] = '0 !important';
  394. ytwp.style.appendRule([
  395. scriptBodyClassSelector + ' #player',
  396. scriptBodyClassSelector + '.ytcenter-site-center.ytcenter-non-resize.ytcenter-guide-visible #player',
  397. scriptBodyClassSelector + '.ltr.ytcenter-site-center.ytcenter-non-resize.ytcenter-guide-visible.guide-collapsed #player',
  398. scriptBodyClassSelector + '.ltr.ytcenter-site-center.ytcenter-non-resize.ytcenter-guide-visible.guide-collapsed #player-legacy',
  399. scriptBodyClassSelector + '.ltr.ytcenter-site-center.ytcenter-non-resize.ytcenter-guide-visible.guide-collapsed #watch7-main-container',
  400. ], d);
  401. //
  402. d = buildVenderPropertyDict(transitionProperties, 'width 0s linear, left 0s linear');
  403.  
  404. // Bugfix for Firefox
  405. // Parts of the header (search box) are hidden under the player.
  406. // Firefox doesn't seem to be using the fixed header+guide yet.
  407. d['float'] = 'initial';
  408.  
  409. ytwp.style.appendRule(scriptBodyClassSelector + ' #player-api', d);
  410.  
  411. // !important is mainly for simplicity, but is needed to override the !important styling when the Guide is open due to:
  412. // .sidebar-collapsed #watch7-video, .sidebar-collapsed #watch7-main, .sidebar-collapsed .watch7-playlist { width: 945px!important; }
  413. // Also, Youtube Center resizes #player at element level.
  414. ytwp.style.appendRule(
  415. [
  416. scriptBodyClassSelector + ' #player',
  417. scriptBodyClassSelector + ' #movie_player',
  418. scriptBodyClassSelector + ' #player-mole-container',
  419. scriptBodyClassSelector + ' .html5-main-video',
  420. ],
  421. {
  422. 'width': '100% !important',
  423. 'min-width': '100% !important',
  424. 'max-width': '100% !important',
  425. 'height': '100% !important',
  426. 'min-height': '100% !important',
  427. 'max-height': '100% !important',
  428. }
  429. );
  430.  
  431. ytwp.style.appendRule(
  432. [
  433. scriptBodyClassSelector + ' #player',
  434. scriptBodyClassSelector + ' .html5-main-video',
  435. ],
  436. {
  437. 'top': '0 !important',
  438. 'right': '0 !important',
  439. 'bottom': '0 !important',
  440. 'left': '0 !important',
  441. }
  442. );
  443. // Resize #player-unavailable, #player-api
  444. // Using min/max width/height will keep
  445. ytwp.style.appendRule(scriptBodyClassSelector + ' #player .player-width', 'width', '100% !important');
  446. ytwp.style.appendRule(scriptBodyClassSelector + ' #player .player-height', 'height', '100% !important');
  447.  
  448. //--- Move Video Player
  449. ytwp.style.appendRule(scriptBodyClassSelector + ' #player', {
  450. 'position': 'absolute',
  451. // Already top:0; left: 0;
  452. });
  453. ytwp.style.appendRule(scriptBodyClassSelector, { // body
  454. 'margin-top': '100vh',
  455. });
  456.  
  457.  
  458. //--- Sidebar
  459. // Remove the transition delay as you can see it moving on page load.
  460. d = buildVenderPropertyDict(transitionProperties, 'margin-top 0s linear, padding-top 0s linear');
  461. d['margin-top'] = '0 !important';
  462. d['top'] = '0 !important';
  463. ytwp.style.appendRule(scriptBodyClassSelector + ' #watch7-sidebar', d);
  464.  
  465. ytwp.style.appendRule(scriptBodyClassSelector + '.cardified-page #watch7-sidebar-contents', 'padding-top', '0');
  466.  
  467. //--- Absolutely position the fixed header.
  468. // Masthead
  469. ytwp.style.appendRule(scriptBodyClassSelector + '.' + viewingVideoClassId + ' #masthead-positioner', {
  470. 'position': 'absolute',
  471. 'top': '100% !important'
  472. });
  473.  
  474. // Guide
  475. // When watching the video, we need to line it up with the masthead.
  476. ytwp.style.appendRule(scriptBodyClassSelector + '.' + viewingVideoClassId + ' #appbar-guide-menu', {
  477. 'display': 'initial',
  478. 'position': 'absolute',
  479. 'top': '100% !important' // Masthead height
  480. });
  481. ytwp.style.appendRule(scriptBodyClassSelector + '.' + viewingVideoClassId + ' #page.watch #guide', {
  482. 'display': 'initial',
  483. 'margin': '0',
  484. 'position': 'initial'
  485. });
  486.  
  487. //---
  488. // Hide Scrollbars
  489. ytwp.style.appendRule(scriptBodyClassSelector + '.' + topOfPageClassId, 'overflow-x', 'hidden');
  490.  
  491.  
  492. //--- Fix Other Possible Style Issues
  493. ytwp.style.appendRule(scriptBodyClassSelector + ' #placeholder-player', 'display', 'none');
  494. ytwp.style.appendRule(scriptBodyClassSelector + ' .skip-nav', 'display', 'none');
  495.  
  496. //--- Whitespace Leftover From Moving The Video
  497. ytwp.style.appendRule(scriptBodyClassSelector + ' #page.watch', 'padding-top', '0');
  498. ytwp.style.appendRule(scriptBodyClassSelector + ' .player-branded-banner', 'height', '0');
  499.  
  500. //--- Playlist Bar
  501. //ytwp.style.appendRule(scriptBodyClassSelector + ' #watch7-playlist-tray-container', "margin", "-15px -10px 20px -10px");
  502. ytwp.style.appendRule(scriptBodyClassSelector + ' .watch7-playlist-bar-left', 'width', '640px !important'); // Same width as .watch-content
  503. ytwp.style.appendRule([
  504. scriptBodyClassSelector + ' .playlist',
  505. scriptBodyClassSelector + ' .playlist .watch7-playlist-bar',
  506. ], 'max-width', '1040px'); // Same width as .watch-content (640px) + .watch-sidebar (300-400px).
  507. ytwp.style.appendRule(scriptBodyClassSelector + ' #watch7-playlist-tray-container', {
  508. "margin-top": "-15px",
  509. "height": "287px !important", // 65 (playlist tile) * 4 + 27 (trim on bottom)
  510. "margin-bottom": "15px"
  511. });
  512. ytwp.style.appendRule([
  513. scriptBodyClassSelector + '.cardified-page #watch7-playlist-tray-container + #watch7-sidebar-contents', // Pre Oct 26
  514. scriptBodyClassSelector + '.cardified-page #watch-appbar-playlist + #watch7-sidebar-contents', // Post Oct 26
  515. ], 'padding-top', '15px');
  516.  
  517. // YT Center
  518. ytwp.style.appendRule(scriptBodyClassSelector + ' #player', 'margin-bottom', '0 !important');
  519. ytwp.style.appendRule(scriptBodyClassSelector + ' #watch7-playlist-tray-container', {
  520. 'left': 'initial !important',
  521. 'width': 'initial !important'
  522. });
  523. ytwp.style.appendRule(scriptBodyClassSelector + ' .watch7-playlist-bar-right', 'width', '363px !important');
  524. },
  525. onWatchInit: function() {
  526. ytwp.log('onWatchInit');
  527. if (!ytwp.initialized) return;
  528. if (ytwp.pageReady) return;
  529.  
  530. ytwp.event.addBodyClass();
  531. ytwp.pageReady = true;
  532. },
  533. onDispose: function() {
  534. ytwp.log('onDispose');
  535. ytwp.initialized = false;
  536. ytwp.pageReady = false;
  537. ytwp.isWatchPage = false;
  538. ytwp.ytapp = null;
  539. },
  540. addBodyClass: function() {
  541. // Insert CSS Into the body so people can style around the effects of this script.
  542. jQuery.addClass(document.body, scriptBodyClassId);
  543. ytwp.log('Applied ' + scriptBodyClassSelector);
  544. },
  545. html5PlayerFix: function() {
  546. ytwp.log('html5PlayerFix');
  547.  
  548. // https://github.com/YePpHa/YouTubeCenter/issues/1083
  549. if (!uw.ytcenter
  550. && (!ytwp.ytapp)
  551. && (uw.ytplayer && uw.ytplayer.config)
  552. && (uw.yt && uw.yt.player && uw.yt.player.Application && uw.yt.player.Application.create)
  553. ) {
  554. ytwp.ytapp = Html5PlayerFix.getPlayerInstance();
  555. return;
  556. if (document.querySelectorAll('#movie_player').length > 0)
  557. return;
  558. ytwp.log('rerunning ytplayer.load()');
  559. // Since we have to reload the player anyways, might as well set some useful settings.
  560. uw.ytplayer.config.args.autohide = 1; // Autohide the playback control bar.
  561. // Next 2 lines are equivalent to: ytplayer.load();
  562. ytwp.log(document.querySelectorAll('#movie_player'));
  563. ytwp.ytapp = uw.yt.player.Application.create("player-api", uw.ytplayer.config);
  564. ytwp.log(document.querySelectorAll('#movie_player'));
  565. uw.ytplayer.config.loaded = true;
  566. }
  567.  
  568. Html5PlayerFix.update();
  569. Html5PlayerFix.autohideControls();
  570. },
  571.  
  572. };
  573.  
  574.  
  575. ytwp.pubsubListeners = {
  576. 'init': function() { // Not always called
  577. ytwp.event.init();
  578. },
  579. 'init-watch': function() { // Not always called
  580. ytwp.event.init();
  581. },
  582. 'player-added': function() { // Not always called
  583. // Usually called after init-watch, however this is called before init when going from channel -> watch page.
  584. // The init event is when the body element resets all it's classes.
  585. ytwp.event.init();
  586. },
  587. // 'player-resize': function() {},
  588. // 'player-playback-start': function() {},
  589. 'appbar-guide-delay-load': function() {
  590. // Listen to a later event that is always called in case the others are missed.
  591. ytwp.event.init();
  592.  
  593. // Channel -> /watch
  594. if (ytwp.util.isWatchUrl())
  595. ytwp.event.addBodyClass();
  596. },
  597. // 'dispose-watch': function() {},
  598. 'dispose': function() {
  599. ytwp.event.onDispose();
  600. }
  601. };
  602.  
  603. ytwp.registerYoutubeListeners = function() {
  604. ytwp.registerYoutubePubSubListeners();
  605. };
  606.  
  607. ytwp.registerYoutubePubSubListeners = function() {
  608. // Subscribe
  609. for (var eventName in ytwp.pubsubListeners) {
  610. var eventListener = ytwp.pubsubListeners[eventName];
  611. uw.yt.pubsub.instance_.subscribe(eventName, eventListener);
  612. }
  613. };
  614.  
  615. ytwp.main = function() {
  616. try {
  617. ytwp.registerYoutubeListeners();
  618. } catch(e) {
  619. ytwp.error("Could not hook yt.pubsub", e);
  620. setTimeout(ytwp.main, 1000);
  621. }
  622. ytwp.event.init();
  623. };
  624.  
  625. ytwp.main();
  626. })(typeof unsafeWindow !== 'undefined' ? unsafeWindow : window);