Greasy Fork is available in English.

哔哩哔哩合集列表增加长度 bilibili

阿B,你视频右侧的合集列表长度敢不敢再短点?建议改成一屏只能看到一行 (添加功能:按g网页全屏)

  1. // ==UserScript==
  2. // @name 哔哩哔哩合集列表增加长度 bilibili
  3. // @namespace http://tampermonkey.net/
  4. // @version 0.9.1
  5. // @description 阿B,你视频右侧的合集列表长度敢不敢再短点?建议改成一屏只能看到一行 (添加功能:按g网页全屏)
  6. // @author JoshCai233
  7. // @license GPL-3.0-only
  8. // @match https://www.bilibili.com/video/*
  9. // @icon https://favicon.yandex.net/favicon/v2/http://www.bilibili.com/?size=32
  10. // @require http://code.jquery.com/jquery-3.5.1.min.js
  11. // @grant none
  12. // ==/UserScript==
  13.  
  14. // 获取播放列表
  15. function getBilibiliPlayList(){
  16. return $('.base-video-sections-v1 .video-sections-content-list, .right-container-inner .cur-list, .video-pod .video-pod__body');
  17. }
  18. // 记录播放列表顶端位置
  19. var bilibiliPlayListTop=0;
  20. // 只能改一次宽度
  21. var changeWidthLock=false;
  22. // 取第一p的标题,如果标题刷新了则需要重新修改宽度(?)
  23. var titleP1 = "";
  24.  
  25. // 增加播放列表宽度
  26. function changePlayListWidth(){
  27. var widthInterval=setInterval(()=>{
  28. if(changeHeJiWidth()||changeFenPWidth()){
  29. console.log("播放列表宽度增加");
  30. clearInterval(widthInterval);
  31. }
  32. },500);
  33. }
  34.  
  35. // 改变播放列表长度
  36. function enlargeBilibiliPlayList(){
  37. var bilibiliPlayList = getBilibiliPlayList();
  38. if(bilibiliPlayList.length>0 && bilibiliPlayList.css('height')!='fit-content'){
  39. bilibiliPlayListTop = bilibiliPlayList.offset().top;
  40. // 不删除广告时的高度
  41. // var bilibiliPlayListHeight = window.innerHeight - bilibiliPlayList.offset().top - 24;
  42. // 删除广告时的高度
  43. var bilibiliPlayListHeight = window.innerHeight - bilibiliPlayList.offset().top - 34;
  44.  
  45. bilibiliPlayListHeight = Math.max(500, bilibiliPlayListHeight) + 'px';
  46.  
  47. bilibiliPlayList.css('height','fit-content').css('max-height',bilibiliPlayListHeight);
  48.  
  49. console.log("改变播放列表高度完成");
  50.  
  51.  
  52. changePlayListWidth();
  53. // 分小节的合集点击小节时需要再次增加宽度
  54. $('.video-pod .slide-item').click(()=>{
  55. changePlayListWidth();
  56. });
  57. }
  58. }
  59. //合集
  60. function changeHeJiWidth(){
  61.  
  62. var contentList=$('.video-sections-content-list');
  63. if(contentList.height()<10){
  64. return false;
  65. }
  66. contentList.css('margin-right','10px');
  67. var cardInfos=contentList.find('.video-episode-card__info');
  68. if(cardInfos.length){
  69. // // 改变合集宽度只改一次
  70. // if(cardInfos[0].firstChild.className.indexOf('video-episode-card__info-title')===-1){
  71. // return true;
  72. // }
  73. if(changeWidthLock){
  74. // 如果标题的时长通过刷新等方式改回去了,则需要忽略锁,重新将时长加回去
  75. if ( titleP1 !== cardInfos[0].firstChild.lastChild.textContent){
  76. return true;
  77. }
  78. }else{
  79. // 上锁
  80. changeWidthLock = true;
  81. }
  82.  
  83. titleP1 = cardInfos[0].firstChild.lastChild.textContent;
  84.  
  85. // 文字排版
  86. cardInfos.each(function(index,item){
  87. // item.insertBefore(item.lastChild,item.firstChild);
  88. // item.firstChild.style.marginRight='0.8em';
  89. // item.style.justifyContent='left';
  90.  
  91. // 把时长和标题放一起,如果单独拿过去会出bug
  92. if (item.firstChild.lastChild.nodeType === 3){
  93. var videoLength = item.lastChild.innerText.trim();
  94. if(videoLength.length > 3 && videoLength.split(":")[0].length<2){
  95. videoLength = "0" + videoLength;
  96. }
  97. item.firstChild.lastChild.textContent = ' [' + videoLength +'] '+ item.firstChild.lastChild.textContent;
  98. }
  99. item.style.justifyContent='left';
  100. });
  101.  
  102. // 启用滚动
  103. contentList.css('overflow','scroll');
  104. $('.video-sections-item,.video-episode-card__info-title').css('width','100%').css('min-width', 'fit-content');
  105. //滚动条样式
  106. const styleTag = document.createElement('style');
  107. styleTag.innerHTML =".video-sections-content-list::-webkit-scrollbar{height:4px;} " +
  108. ".video-episode-card__info-title.video-episode-card__info-title_indent{padding-left:0.55em;}" +
  109. ".video-section-title {border-bottom: 1px solid #e3e5e7;}";
  110.  
  111. // 将样式标签添加到head
  112. document.head.appendChild(styleTag);
  113.  
  114. return true;
  115. }
  116. return false;
  117. }
  118. //分p
  119. function changeFenPWidth(){
  120. var contentList=$('.video-pod__body');
  121. if(!contentList.length){
  122. debugger
  123. return false;
  124. }
  125. var cardInfos=contentList.find('.video-pod__list .video-pod__item .simple-base-item');
  126. if(!cardInfos.length){
  127. cardInfos=contentList.find('.video-pod__list .video-pod__item');
  128. }
  129. // 分p先加载长度
  130. if(contentList.height()<10 ||cardInfos[0].children.length===0){
  131. return false;
  132. }
  133. contentList.css('margin-right','10px');
  134. if(cardInfos.length){
  135. // 改变分p宽度只改一次
  136. if($(cardInfos[0]).find('.link-content').index()===1){
  137. return true;
  138. }
  139.  
  140. // B站最近监听了 DOM 变化事件, 所以采用延时调整
  141. setTimeout(function(){
  142. // 文字排版
  143. cardInfos.each(function(index, item){
  144. item.insertBefore(item.lastElementChild,item.firstElementChild);
  145. item.firstElementChild.style.marginRight='0.8em';
  146. item.style.justifyContent='left';
  147. });
  148. // 启用滚动
  149. contentList.css('overflow','scroll');
  150. cardInfos.css('width','100%').css('min-width', 'fit-content');
  151.  
  152. // 文字不换行
  153. contentList.find('.title-txt').css('white-space', 'nowrap');
  154. //滚动条样式
  155. const styleTag = document.createElement('style');
  156. styleTag.innerHTML =".video-pod__body::-webkit-scrollbar{height:4px;}";
  157. // 将样式标签添加到头部
  158. document.head.appendChild(styleTag);
  159. },3000);
  160.  
  161. return true;
  162. }
  163. return false;
  164. }
  165.  
  166.  
  167. (function() {
  168. 'use strict';
  169. $(document).ready(function () {
  170. /////////// 按下g的时候能点击网页全屏
  171. document.addEventListener('keydown', function(event) {
  172. console.log(event.key);
  173. if (event.key === 'g'||event.key === 'G') {
  174. var buttonElem =$(".bpx-player-ctrl-btn-icon.bpx-player-ctrl-web-enter")[0]; // 将 'myButton' 替换为实际按钮的 ID
  175. buttonElem.click();
  176. }
  177. });
  178.  
  179. // 取消下滑右边栏的常态显示,方便摸鱼
  180. $(".video-container-v1 .right-container .right-container-inner").css("padding-bottom", window.innerHeight + "px");
  181.  
  182.  
  183.  
  184. // 扩大一次播放列表长度
  185. enlargeBilibiliPlayList();
  186. var list = getBilibiliPlayList();
  187.  
  188. // 检测高度变化, 如果变短则再次增加列表长度
  189. var callback = (mutations) => {
  190. for(var i=0;i<mutations.length;i++){
  191. console.log("视频列表高度发生变化");
  192. enlargeBilibiliPlayList();
  193. }
  194. }
  195. var config = {attributes:true,attributeFilter:['style'],attributeOldValue:true};
  196. new MutationObserver(callback).observe(list[0], config);
  197.  
  198.  
  199. // 检测是否删除了广告, 如果删除广告则变化列表长度
  200. config = { attributes: false, childList: true, subtree: true };
  201. callback = (mutationsList, observer) => {
  202. var bilibiliPlayList = getBilibiliPlayList();
  203. if(bilibiliPlayListTop>bilibiliPlayList.offset().top){
  204. bilibiliPlayListTop=bilibiliPlayList.offset().top;
  205. bilibiliPlayList.css('height','');
  206. }
  207. };
  208. new MutationObserver(callback).observe($('.right-container')[0], config);
  209. });
  210. })();