☰

Bilibili-macOS-PIP

Enable PIP(Picture-In-Picture) on macOS for bilibili. Only for macOS 10.12+

当前为 2017-07-22 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name        Bilibili-macOS-PIP
  3. // @namespace   https://github.com/BlueCocoa
  4. // @description Enable PIP(Picture-In-Picture) on macOS for bilibili. Only for macOS 10.12+
  5. // @author      Authorized by: BlueCocoa
  6. // @homepage    https://github.com/BlueCocoa/Bilibili-macOS-PIP
  7. // @match       http*://www.bilibili.com/*
  8. // @version     1.0
  9. // @grant       none
  10. // ==/UserScript==
  11.  
  12. var re = /^http:\/\/www.bilibili.com\/video\/av/;
  13. var bangumi = /^http:\/\/bangumi.bilibili.com\/anime\/v/;
  14.  
  15. // if we're in video page
  16. // please note that this hacking only works when you're using HTML5 player
  17. if (re.exec(window.location.href) !== null || bangumi.exec(window.location.href)) {
  18.     // enumerate all div tags
  19.     var elements = document.getElementsByTagName('div');
  20.     for (var i = 0; i < elements.length; i++) {
  21.         // target is bgray-btn-wrap
  22.         if (elements[i].className == "bgray-btn-wrap") {
  23.             // create script tag to enable/disable controls for video tag
  24.             var onclick_script = document.createElement('script');
  25.             onclick_script.innerHTML = '\
  26.             var enabled = false; \
  27.             function native_player(btn) {\
  28.                 function enable_native(e) {\
  29.                     var player = document.getElementsByTagName("video")[0];\
  30.                     console.log("Did Set!");\
  31.                     if (e) {\
  32.                         player.setAttribute("controls", "controls");\
  33.                         player.setAttribute("x-webkit-airplay", "");\
  34.                     } else {\
  35.                         player.removeAttribute("controls");\
  36.                     }\
  37.                 }\
  38.                 enable_native(!enabled);\
  39.                 if (!enabled) { \
  40.                     btn.setAttribute("style", "color: #00a1d6; border-color: #00a1d6;");\
  41.                     enabled = true; \
  42.                 } else {\
  43.                     btn.setAttribute("style", "border: 1px solid #99a2aa; color: #99a2aa;");\
  44.                     enabled = false; \
  45.                 }\
  46.             }';
  47.             // append this script to body
  48.             document.body.appendChild(onclick_script);
  49.             // create a button for user to enable/disable controls for video tag
  50.             var div = document.createElement('div');
  51.             div.setAttribute("class", "bgray-btn");
  52.             div.setAttribute("onclick", "native_player(this)");
  53.             div.innerHTML = 'macOS<br>播放器';
  54.             elements[i].insertBefore(div, elements[i].childNodes[2]);
  55.             elements[i].setAttribute('style', 'display: block');
  56.             break;
  57.         }
  58.     }
  59. }
  60.  
  61.