Greasy Fork

希望能显示完整分区链或给一个设置开关 比如是 "音乐 > VOCALOID·UTAU" 而不是只有 "VOCALOID·UTAU" 另外希望加上一个能显示是 "自制" 还是 "转载" 的栏位或自定义参数

好的，收到。

这两个功能都考虑添加到自定义组件中自行扩展的方式添加。由于目前不支持改变显示效果，所以近期会添加这个功能，并且给出自定义代码。

已经更新，你可以这样添加你说的两个组件：

• 添加自定义组件

在标题处分别填写：

是否转载:

js:this.infos.copyright===1?`原创`:`转载`

分区:

js:unsafeWindow.channel

注：这是两个不同的自定义组件，不要写在一起哦

• 点击下方添加按钮
• 到组件管理中，将添加的自定义组件拖动到开启区域
• 点击保存

怎么在这两个自定义组件中添加一些我自己的辅助文字呀

这里是完全的js脚本。

js:

这是一个声明，表示接下来的内容全部当作js代码解析

expressionA ? expressionB : expressionC

这是JS的三段式，当expressionA 为真时执行expressionB ，否则执行expressionC

this.infos.copyright

这是调用数据。this.infos中存储了B站官方API的数据，copyright是其中一个属性，值可能是1或者2，对应原创和转载

所以这里代码就是 如果this.infos.copyright值为1，那么输出原创，否则输出转载

注意字符串原创和字符串转载必须用\/"/'`这三种符号中的一个包裹。

想要添加自定义内容，你只需要把这个表达式用括号包起来，然后前后添加字符串，用加号拼接。

比如：

js:"这是"+(this.infos.copyright===1?`原创`:`转载`)+"视频"

这是转载视频

可以按照这样的规则修改。

额 我承认这个自定义组件的扩展可能不是很友好，需要一点点js基础，可能还得翻看一下API的文档，但是...大部分常用的组件其实都内置了，其他的需求可能也只能这样扩展了...

可以的，能用代码实现就行。不过我是这样想的，自定义组件时，最好加上一栏填组件名，然后才是内容栏复制栏啥的，然后还可以勾选“不添加复制功能”。在自定义组件管理页面如果可以的话最好能对已有自定义组件进行编辑，而不是先删除旧的才加上新的

可以的，能用代码实现就行。不过我是这样想的，自定义组件时，最好加上一栏填组件名，然后才是内容栏复制栏啥的，然后还可以勾选“不添加复制功能”。在自定义组件管理页面如果可以的话最好能对已有自定义组件进行编辑，而不是先删除旧的才加上新的

嗯... 因为一开始只考虑内容了，现在的标题其实就是组件名，只不过会直接显示出来，是个按钮。第二行内容就是点击后的效果，不添加复制就第二行留空或者void就行了...

已有组件编辑其实是因为懒没加...

貌似标题会直接显示，我把目标脚本放在下面时好像并没有被执行

貌似标题会直接显示，我把目标脚本放在下面时好像并没有被执行

是的，下面是点击时运行的。当在下方输入js:时，展开脚本提示可以查看一些内建的方法。

另外，使用infos那个变量的时候，请加上this，像这样=>this.infos，比如this.infos.copyright，这个提示里没有说。

有没有办法不通过点击让它直接返回结果，就跟自带组件一样呢。现在只能通过在自定义组件标题栏填入脚本命令才行，但这样在组件设置页面看上去就比较不美观

我试试吧。

// ==UserScript==
// @name         示范模块
// @namespace    showav-sideload-example
// @version      1.0
// @description  只是一个演示模块哦
// @author       CKylinMC
// @match        https://www.bilibili.com/video*
// @match        https://www.bilibili.com/medialist/play/*
// @grant        unsafeWindow
// @run-at       document-start
// ==/UserScript==

(function(){
    if(!unsafeWindow.ShowAVModules) unsafeWindow.ShowAVModules = {};

    /*
     * 自定义模块载入方法：
     * 首先要给模块一个唯一英文id，不能重名，比如 testMod
     * 然后，需要给出名字，用于显示。简介是可选的。
     * 需要给出onload(加载时)、onclick(点击时)、onhold(长按时)的动作。
     * 请注意，onload需要返回一个有效的HTMLElement。
     * onclick和onhold如果不需要，可以用 ()=>{} 代替。
     * 通过解构this，可以获得一些预置数据和工具，列表如下：
     * 
     * av_root : 容器HTML节点
     * config : 脚本的配置
     * av_infobar : 原本信息条HTML节点
     * infos : 视频API信息
     * CKTools : CKTools组件(domHelper, modal, bili等)
     * popNotify : 右上角浮动信息条组件
     * tools : 其他工具，比如 copy : 复制，copy('要复制的文本')
     */
    unsafeWindow.ShowAVModules['testMod'] = {
            name: "测试模块",
            description: "只是测试",
            onload: function(){
                const {infos}=this;
                return document.createTextNode("test:"+infos.copyright);
            },
            onclick: function (e){
                const {infos,popNotify}=this;
                popNotify.success('Clicked!'+infos.aid);
            },
            onhold: function (e){
                const {infos,CKTools}=this;
                CKTools.modal.alertModal('Holded!',infos.bvid,'OK');
            }
        }
})();

测试版本 1.17.1， 虽然已经合并了，应该很快也会自动推送。

如果模块要删除，只需要任何时候把要删除的模块拖到未启用区域即可，哪怕模块本身删掉了，显示成undefined也没关系，拖下去下次就没了。

// ==UserScript==
// @name 示范模块
// @namespace showav-sideload-example
// @version 1.0
// @description 只是一个演示模块哦
// @author CKylinMC
// @match https://www.bilibili.com/video*
// @match https://www.bilibili.com/medialist/play/*
// @grant unsafeWindow
// @run-at document-start
// ==/UserScript==

(function(){
if(!unsafeWindow.ShowAVModules) unsafeWindow.ShowAVModules = {};

/*  
 * 自定义模块载入方法：  
 * 首先要给模块一个唯一英文id，不能重名，比如 testMod  
 * 然后，需要给出名字，用于显示。简介是可选的。  
 * 需要给出onload(加载时)、onclick(点击时)、onhold(长按时)的动作。  
 * 请注意，onload需要返回一个有效的HTMLElement。  
 * onclick和onhold如果不需要，可以用 ()=>{} 代替。  
 * 通过解构this，可以获得一些预置数据和工具，列表如下：  
 *   
 * av_root : 容器HTML节点  
 * config : 脚本的配置  
 * av_infobar : 原本信息条HTML节点  
 * infos : 视频API信息  
 * CKTools : CKTools组件(domHelper, modal, bili等)  
 * popNotify : 右上角浮动信息条组件  
 * tools : 其他工具，比如 copy : 复制，copy('要复制的文本')  
 */  
unsafeWindow.ShowAVModules['testMod'] = {  
        name: "测试模块",  
        description: "只是测试",  
        onload: function(){  
            const {infos}=this;  
            return document.createTextNode("test:"+infos.copyright);  
        },  
        onclick: function (e){  
            const {infos,popNotify}=this;  
            popNotify.success('Clicked!'+infos.aid);  
        },  
        onhold: function (e){  
            const {infos,CKTools}=this;  
            CKTools.modal.alertModal('Holded!',infos.bvid,'OK');  
        }  
    }  

})();

测试版本 1.17.1， 虽然已经合并了，应该很快也会自动推送。

没看懂这是要实现啥，能否解答一番~

这个模块只是一个测试的模块，没有实际效果，只是显示test:1，然后点击和长按分别有一个提示和弹窗，这是一个示范。

如果你搞不明白的话，你可以说一个想法，比如包含显示什么，点击作用，长按作用，我给你做一个你就明白了。

当然点击和长按作用是可选的。

哦哦，了解了~

相当于这个可以直接填到自定义组件下面那一栏？

相当于这个可以直接填到自定义组件下面那一栏？

是这样，这个是一个完整的油猴脚本，和另一个脚本的扩展方式相同。

你需要新建一个新的油猴脚本，然后用示例脚本内容完全替换新的油猴脚本的内容，然后修改、保存就可以了。

请注意run-at标记，如果模块没有正确加载，请务必确保扩展模块在核心脚本运行前运行。(例如：document-start早于document-end，则扩展脚本运行于document-start，核心脚本运行于document-end)

自定义组件那里只是做简单扩展，不支持做复杂扩展，所以也就不再加到那里。

做成单独的脚本是因为原有脚本的扩展方法过于局限，最初设计时并没有考虑到这么多内容。为了防止越来越多的功能代码让脚本体积进一步膨胀，才最终选择了外置模块的方式。

外置模块可以拥有完整的数据操作功能，并且可以完成所有内置模块能做到的事情，应该是目前最直观的功能扩展方式。

我把前面你提到的两个模块用新的扩展方式实现了，并且附带了...应该还算明白的文档，因为很多东西都是js的语法...

https://gist.github.com/CKylinMC/fccf93a134f6e8182fe1b149dc347814

如果仍然不能讲明白的话，你可以把要实现的效果告诉我，我做好之后发给你~

做成单独的脚本是因为原有脚本的扩展方法过于局限，最初设计时并没有考虑到这么多内容。为了防止越来越多的功能代码让脚本体积进一步膨胀，才最终选择了外置模块的方式。

外置模块可以拥有完整的数据操作功能，并且可以完成所有内置模块能做到的事情，应该是目前最直观的功能扩展方式。

我把前面你提到的两个模块用新的扩展方式实现了，并且附带了...应该还算明白的文档，因为很多东西都是js的语法...

https://gist.github.com/CKylinMC/fccf93a134f6e8182fe1b149dc347814

如果仍然不能讲明白的话，你可以把要实现的效果告诉我，我做好之后发给你~

有个小问题，在切换分P时，用你说的扩展方式写的单独的模块会被反复加载，最后观感会非常奇怪，有什么解决方案吗，下面是截图

说错了，是新版合集中切换分集

OK 收到，已修复