Merge pull request #31 from festoney8/dev

merge dev to main, v3.1.2

.eslintrc.json

@@ -12,7 +12,7 @@
     "plugins": ["@typescript-eslint", "prettier"],
     "rules": {
         "prettier/prettier": "error",
-        "no-unused-vars": "warn",
+        "no-unused-vars": "off",
         "no-console": "off",
         "func-names": "off",
         "object-shorthand": "off",

.github/workflows/dev-ci.yml

@@ -19,11 +19,13 @@ jobs:
         uses: actions/checkout@v4
         with:
           ref: ${{ github.head_ref }}
-
-      - name: install pnpm
-        uses: pnpm/action-setup@v2
+      # https://github.com/pnpm/action-setup/issues/99#issuecomment-1918361558
+      - run: corepack enable
+      - name: install node and pnpm
+        uses: actions/setup-node@v4
         with:
-          version: 8
+          node-version: 20
+          cache: "pnpm"
 
       - name: install
         run: pnpm install

.github/workflows/main-ci.yml

@@ -14,13 +14,14 @@ jobs:
         uses: actions/checkout@v4
         with:
           ref: ${{ github.head_ref }}
-
-      - name: install pnpm
-        uses: pnpm/action-setup@v2
+      - run: corepack enable
+      - name: install node and pnpm
+        uses: actions/setup-node@v4
         with:
-          version: 8
+          node-version: 20
+          cache: "pnpm"
 
-      - name: install
+      - name: Install dependencies
         run: pnpm install
       - name: lint
         run: pnpm run lint

.github/workflows/main-release.yml

@@ -16,10 +16,13 @@ jobs:
       uses: actions/checkout@v4
       with:
         ref: ${{ github.head_ref }}
-    - name: install pnpm
-      uses: pnpm/action-setup@v2
+    # https://github.com/pnpm/action-setup/issues/99#issuecomment-1918361558
+    - run: corepack enable
+    - name: install node and pnpm
+      uses: actions/setup-node@v4
       with:
-        version: 8
+        node-version: 20
+        cache: "pnpm"
 
     # prepare
     - run: pnpm install

CHANGELOG.md

@@ -1,5 +1,11 @@
 # CHANGELOG
 
+## 3.1.2
+
+-   新增：首页 隐藏下滑浏览提示
+-   新增：播放页规则部分适配拜年祭播放器
+-   新增：顶栏两端距离调节、搜索栏宽度调节
+
 ## 3.1.1
 
 -   新增：播放页 隐藏播放器视频播放效果调查

src/components/group.ts

@@ -57,7 +57,7 @@ export class Group {
     enableGroup(enableFunc = true) {
         try {
             this.items.forEach((e) => {
-                if (e instanceof CheckboxItem || e instanceof RadioItem) {
+                if (e instanceof CheckboxItem || e instanceof RadioItem || e instanceof NumberItem) {
                     e.enableItem(enableFunc)
                 }
             })
@@ -71,7 +71,7 @@ export class Group {
     reloadGroup() {
         try {
             this.items.forEach((e) => {
-                if (e instanceof CheckboxItem || e instanceof RadioItem) {
+                if (e instanceof CheckboxItem || e instanceof RadioItem || e instanceof NumberItem) {
                     e.reloadItem()
                 }
             })
@@ -85,7 +85,7 @@ export class Group {
     disableGroup() {
         try {
             this.items.forEach((e) => {
-                if (e instanceof CheckboxItem || e instanceof RadioItem) {
+                if (e instanceof CheckboxItem || e instanceof RadioItem || e instanceof NumberItem) {
                     e.removeItemCSS()
                 }
             })

src/components/item.ts

@@ -368,11 +368,13 @@ export class RadioItem implements IItem {
 /**
  * itemID item的唯一ID, 用于在GM database中记录数值
  * description 数值功能介绍
- * defaultValue 默认值
+ * defaultValue 默认值, 数值为-1表示默认关闭
  * minValue 最小值
  * maxValue 最大值
  * unit 数值单位
- * callback 回调函数, 在数值修改时回调, 可用于效果实时生效
+ * itemCSS 样式
+ * itemCSSPlaceholder 样式占位符，用于替换成当前数值
+ * callback 回调函数, 在数值修改时回调, 用于一些功能实时生效
  */
 interface INumberItemOption {
     itemID: string
@@ -381,13 +383,16 @@ interface INumberItemOption {
     minValue: number
     maxValue: number
     unit: string
+    itemCSS?: myCSS
+    // CSS中待替换为数值的占位符
+    itemCSSPlaceholder?: string
     callback?: (value: number) => void
 }
 
 /** 数值设定 */
 export class NumberItem implements IItem {
     nodeHTML = `<input class="bili-cleaner-item-number" type="number">`
-    private itemValue: number | undefined
+    private itemValue = 0
 
     constructor(private option: INumberItemOption) {}
 
@@ -431,6 +436,46 @@ export class NumberItem implements IItem {
             error(err)
         }
     }
+
+    /** 插入CSS，若有占位符则替换成当前设定数值 */
+    insertItemCSS() {
+        try {
+            if (!this.option.itemCSS) {
+                return
+            }
+            if (document.querySelector(`html>style[bili-cleaner-css=${this.option.itemID}]`)) {
+                debug(`insertItemCSS ${this.option.itemID} CSS exist, ignore`)
+                return
+            }
+            const style = document.createElement('style')
+            let currCSS = this.option.itemCSS
+            if (this.option.itemCSSPlaceholder) {
+                this.getValue()
+                currCSS = currCSS.replaceAll(this.option.itemCSSPlaceholder, this.itemValue.toString())
+            }
+            style.innerHTML = currCSS.replace(/\n\s*/g, '').trim()
+            style.setAttribute('bili-cleaner-css', this.option.itemID)
+            document.documentElement.appendChild(style)
+            debug(`insertItemCSS ${this.option.itemID} OK`)
+        } catch (err) {
+            error(`insertItemCSS ${this.option.itemID} failed`)
+            error(err)
+        }
+    }
+
+    /** 移除CSS */
+    removeItemCSS() {
+        if (this.option.itemCSS) {
+            const style = document.querySelector(
+                `html>style[bili-cleaner-css=${this.option.itemID}]`,
+            ) as HTMLStyleElement
+            if (style) {
+                style.parentNode?.removeChild(style)
+                debug(`removeItemCSS ${this.option.itemID} OK`)
+            }
+        }
+    }
+
     /** 监听数值变化并保持, 重置不合理的值 */
     watchItem() {
         try {
@@ -439,7 +484,8 @@ export class NumberItem implements IItem {
             itemEle.addEventListener('input', () => {
                 currValue = parseInt(itemEle.value)
                 if (isNaN(currValue)) {
-                    itemEle.value = this.option.minValue.toString()
+                    // itemEle.value = this.option.minValue.toString()
+                    return
                 } else {
                     if (currValue > this.option.maxValue) {
                         itemEle.value = this.option.maxValue.toString()
@@ -450,6 +496,8 @@ export class NumberItem implements IItem {
                 this.setValue(parseInt(itemEle.value))
                 itemEle.value = parseInt(itemEle.value).toString()
                 debug(`${this.option.itemID} currValue ${itemEle.value}`)
+                // reload
+                this.reloadItem()
                 // 调用回调函数
                 if (this.option.callback && typeof this.option.callback === 'function') {
                     this.option.callback(parseInt(itemEle.value))
@@ -461,6 +509,34 @@ export class NumberItem implements IItem {
             error(err)
         }
     }
+
+    /** 启用，设定带自定义数值的CSS, 数值为-1时禁用 */
+    enableItem(_enableFunc = false) {
+        this.getValue()
+        if (this.itemValue !== -1) {
+            try {
+                this.insertItemCSS()
+                debug(`enableItem ${this.option.itemID} OK`)
+            } catch (err) {
+                error(`enableItem ${this.option.itemID} Error`)
+                error(err)
+            }
+        }
+    }
+
+    /** 重载，在数值修改后重载CSS */
+    reloadItem() {
+        // this.getValue()
+        if (!this.option.itemCSS) {
+            return
+        }
+        if (this.itemValue !== -1) {
+            this.removeItemCSS()
+            this.insertItemCSS()
+        } else {
+            this.removeItemCSS()
+        }
+    }
 }
 
 /**

src/rules/common.ts

@@ -1,5 +1,5 @@
 import { Group } from '../components/group'
-import { CheckboxItem, RadioItem } from '../components/item'
+import { CheckboxItem, NumberItem, RadioItem } from '../components/item'
 import { debug } from '../utils/logger'
 import {
     isPageBangumi,
@@ -328,7 +328,10 @@ const basicItems = [
         description: '美化页面滚动条',
         defaultStatus: true,
         itemCSS: `
-            /* WebKit */
+            /* WebKit and Chrome
+            Chrome 121+支持sidebar新属性，但难看，继续用webkit
+            https://developer.chrome.com/docs/css-ui/scrollbar-styling
+            */
             ::-webkit-scrollbar {
                 width: 8px !important;
                 height: 8px !important;
@@ -352,9 +355,11 @@ const basicItems = [
             }
 
             /* Firefox */
-            * {
-                scrollbar-color: rgba(0, 0, 0, 0.6) transparent !important;
-                scrollbar-width: thin !important;
+            @-moz-document url-prefix() {
+                * {
+                    scrollbar-color: rgba(0, 0, 0, 0.6) transparent !important;
+                    scrollbar-width: thin !important;
+                }
             }`,
     }),
     // URL参数净化, 在urlchange时需重载, 默认开启, 关闭功能需刷新
@@ -755,6 +760,45 @@ if (!isPageLive()) {
         }),
     ]
     commonGroupList.push(new Group('common-header-right', '全站通用项 顶栏 右侧', headerRightItems))
+
+    // 顶栏数值设定
+    const headerWidthItems = [
+        new NumberItem({
+            itemID: 'common-header-bar-padding-left',
+            description: '顶栏左侧 与页面左边界距离',
+            defaultValue: -1,
+            minValue: -1,
+            maxValue: 2000,
+            unit: 'px',
+            itemCSS: `.bili-header .bili-header__bar {padding-left: ???px !important;}`,
+            itemCSSPlaceholder: '???',
+        }),
+        new NumberItem({
+            itemID: 'common-header-bar-search-width',
+            description: '顶栏中间 搜索框宽度',
+            defaultValue: -1,
+            minValue: -1,
+            maxValue: 2000,
+            unit: 'px',
+            itemCSS: `.bili-header .center-search-container .center-search__bar {
+                width: ???px !important;
+                max-width: ???px !important;
+                min-width: 0px !important;
+            }`,
+            itemCSSPlaceholder: '???',
+        }),
+        new NumberItem({
+            itemID: 'common-header-bar-padding-right',
+            description: '顶栏右侧 与页面右边界距离',
+            defaultValue: -1,
+            minValue: -1,
+            maxValue: 2000,
+            unit: 'px',
+            itemCSS: `.bili-header .bili-header__bar {padding-right: ???px !important;}`,
+            itemCSSPlaceholder: '???',
+        }),
+    ]
+    commonGroupList.push(new Group('common-header-bar-value', '全站通用项 顶栏 数值设定 (-1禁用)', headerWidthItems))
 }
 
 export { commonGroupList }

src/rules/homepage.ts

@@ -430,6 +430,13 @@ if (isPageHomepage()) {
             defaultStatus: true,
             itemCSS: `.desktop-download-tip {display: none !important;}`,
         }),
+        // 隐藏 下滑浏览推荐提示, 默认开启
+        new CheckboxItem({
+            itemID: 'homepage-hide-trial-feed-wrap',
+            description: '隐藏 下滑浏览推荐提示',
+            defaultStatus: true,
+            itemCSS: `.trial-feed-wrap {display: none !important;}`,
+        }),
         // 隐藏 刷新
         new CheckboxItem({
             itemID: 'homepage-hide-flexible-roll-btn',

src/rules/video.ts

@@ -2,7 +2,7 @@ import { Group } from '../components/group'
 import { CheckboxItem } from '../components/item'
 import { debug } from '../utils/logger'
 import { matchAvidBvid, matchBvid } from '../utils/tool'
-import { isPagePlaylist, isPageVideo } from '../utils/page-type'
+import { isPageBnj, isPagePlaylist, isPageVideo } from '../utils/page-type'
 
 /** BV号转AV号 */
 const bv2av = () => {
@@ -274,7 +274,10 @@ if (isPageVideo() || isPagePlaylist()) {
         }),
     ]
     videoGroupList.push(new Group('video-info', '视频信息', infoItems))
+}
 
+// 临时适配拜年祭视频页(播放器、弹幕栏规则多数生效)
+if (isPageVideo() || isPagePlaylist() || isPageBnj()) {
     // 播放器
     const playerItems = [
         // 隐藏 一键三连弹窗
@@ -570,7 +573,11 @@ if (isPageVideo() || isPagePlaylist()) {
             description: '非全屏下 关闭弹幕栏 (刷新去黑边)',
             itemFunc: overridePlayerHeight,
             // video page的player height由JS动态设定
-            itemCSS: `.bpx-player-sending-area {display: none !important;}`,
+            itemCSS: `.bpx-player-sending-area {display: none !important;}
+                /* 活动播放器直接去黑边 */
+                .page-main-content:has(.festival-video-player) .video-player-box {height: fit-content !important;}
+                .festival-video-player {height: fit-content !important;}
+                .festival-video-player #bilibili-player {height: calc(100% - 46px) !important;}`,
         }),
         // 全屏下 关闭弹幕输入框
         new CheckboxItem({
@@ -596,7 +603,9 @@ if (isPageVideo() || isPagePlaylist()) {
         }),
     ]
     videoGroupList.push(new Group('video-danmaku', '弹幕栏', danmakuItems))
+}
 
+if (isPageVideo() || isPagePlaylist()) {
     // 视频下方
     const toolbarItems = [
         // 隐藏 分享按钮弹出菜单, 默认开启

src/utils/page-type.ts

@@ -27,6 +27,10 @@ const currPage = (): string => {
     if (href.includes('bilibili.com/list/watchlater') || href.includes('bilibili.com/list/ml')) {
         return 'playlist'
     }
+    // 匹配拜年祭活动页、拜年祭单品视频
+    if (href.match(/bilibili\.com\/festival\/20\d\dbnj/)) {
+        return 'bnj'
+    }
     return ''
 }
 
@@ -40,3 +44,4 @@ export const isPageDynamic = () => ans === 'dynamic'
 export const isPageLive = () => ans === 'live'
 export const isPageBangumi = () => ans === 'bangumi'
 export const isPagePlaylist = () => ans === 'playlist'
+export const isPageBnj = () => ans === 'bnj'

vite.config.ts

@@ -8,7 +8,7 @@ export default defineConfig({
             userscript: {
                 name: 'bilibili 页面净化大师',
                 namespace: 'http://tampermonkey.net/',
-                version: '3.1.1',
+                version: '3.1.2',
                 description:
                     '净化 B站/哔哩哔哩 网页元素，去广告，URL净化，BV号转AV号，播放器净化，过滤推荐视频，提供300+项功能，定制自己的B站页面',
                 author: 'festoney8',