EnablePIP-keqq

Enable Picture in Picture mode in ke.qq.com 在腾讯课堂中打开画中画模式,使chrome能够使用画中画。

  1. // ==UserScript==
  2. // @name EnablePIP-keqq
  3. // @namespace EnablePIP
  4. // @version 2.2.1
  5. // @description Enable Picture in Picture mode in ke.qq.com 在腾讯课堂中打开画中画模式,使chrome能够使用画中画。
  6. // @author LXG_Shadow & XenoAmess
  7. // @match https://ke.qq.com/*
  8. // @run-at document-end
  9. // @grant none
  10. // @supportURL https://github.com/XenoAmess/EnablePIP.git
  11. // ==/UserScript==
  12.  
  13.  
  14. /**
  15. * 特殊注意:
  16. * 1,腾讯课堂的签到我做了,但是正在调试。emm应该没啥大问题(大概)。
  17. * 2,那个控制条挺难弄的,请还是选择直接进入画中画吧。
  18. */
  19.  
  20. var REFRESH_TIME = 500;
  21. var STRING_OPEN_PICTURE_IN_PICTURE = "显示画中画面板";
  22. var STRING_CLOSE_PICTURE_IN_PICTURE = "隐藏画中画面板";
  23. var STRING_ENTER_PICTURE_IN_PICTURE_DIRECT = "直接进入画中画";
  24. var STRING_EXIT_PICTURE_IN_PICTURE_DIRECT = "直接退出画中画";
  25.  
  26. var STRING_POPUP_MENU_SELECTOR = "div#videoContainer > div#debug_box > ul";
  27. var STRING_CONTROL_BAR_SELECTOR = "div#videoContainer > div#videoControls";
  28. var STRING_VIDEO_SELECTOR = "div#videoContainer > video#main_video";
  29. var STRING_CHECKIN_SELECTOR = "div#react-body > div.sign-dialog > div.im-dialog-wrap > div.im-dialog > div.btn-group > span";
  30.  
  31. var STRING_PIC_IN_PIC_SWITCH = "pictureInPictureSwitch";
  32. var STRING_PIC_IN_PIC_DIRECT_SWITCH = "pictureInPictureDirectSwitch";
  33.  
  34. var b_pipMode = false;
  35. var b_pipMode_direct = false;
  36.  
  37. function autoSignIn() {
  38. if ($(STRING_CHECKIN_SELECTOR).length !== 0) {
  39. $(STRING_CHECKIN_SELECTOR).click();
  40. }
  41. }
  42.  
  43. function switchPictureInPictureMode() {
  44. if (b_pipMode) {
  45. $("video").removeAttr("controls");
  46. $(STRING_CONTROL_BAR_SELECTOR).css("z-index", "");
  47. $(STRING_VIDEO_SELECTOR).css("z-index", "");
  48. } else {
  49. $("video").attr("controls", "controls");
  50. $(STRING_CONTROL_BAR_SELECTOR).css("z-index", "-1");
  51. $(STRING_VIDEO_SELECTOR).css("z-index", "10");
  52. }
  53. b_pipMode = !b_pipMode;
  54. $("#" + STRING_PIC_IN_PIC_SWITCH).text(b_pipMode ? STRING_CLOSE_PICTURE_IN_PICTURE : STRING_OPEN_PICTURE_IN_PICTURE);
  55. }
  56.  
  57. function switchPictureInPictureModeDirect() {
  58. if (b_pipMode_direct) {
  59. document.exitPictureInPicture();
  60. } else {
  61. $(STRING_VIDEO_SELECTOR)[0].requestPictureInPicture();
  62. }
  63. b_pipMode_direct = !b_pipMode_direct;
  64. $("#" + STRING_PIC_IN_PIC_DIRECT_SWITCH).text(b_pipMode_direct ? STRING_EXIT_PICTURE_IN_PICTURE_DIRECT : STRING_ENTER_PICTURE_IN_PICTURE_DIRECT);
  65. }
  66.  
  67. function addToToolBar() {
  68. if ($(STRING_POPUP_MENU_SELECTOR) != null && document.getElementById(STRING_PIC_IN_PIC_SWITCH) === null) {
  69. var $il0 = $("<li></li>");
  70. $il0.text(b_pipMode ? STRING_CLOSE_PICTURE_IN_PICTURE : STRING_OPEN_PICTURE_IN_PICTURE);
  71. $il0.attr("id", STRING_PIC_IN_PIC_SWITCH);
  72. $il0.click(switchPictureInPictureMode);
  73. $(STRING_POPUP_MENU_SELECTOR).append($il0);
  74.  
  75. var $il1 = $("<li></li>");
  76. $il1.text(b_pipMode_direct ? STRING_EXIT_PICTURE_IN_PICTURE_DIRECT : STRING_ENTER_PICTURE_IN_PICTURE_DIRECT);
  77. $il1.attr("id", STRING_PIC_IN_PIC_DIRECT_SWITCH);
  78. $il1.click(switchPictureInPictureModeDirect);
  79. $(STRING_POPUP_MENU_SELECTOR).append($il1);
  80. }
  81. autoSignIn();
  82. }
  83.  
  84. (function () {
  85. 'use strict';
  86. if (!window.jQuery) {
  87. var oScript = document.createElement('script');
  88. oScript.type = "text/javascript";
  89. oScript.src = "//s1.hdslb.com/bfs/static/jinkela/long/js/jquery/jquery1.7.2.min.js";
  90. document.head.appendChild(oScript);
  91. }
  92. window.onload = window.setInterval(addToToolBar, REFRESH_TIME);
  93. })();