思源笔记插件丨脚注插件 v1.1.6 支持脚注数字编号啦

插件地址:https://github.com/Achuan-2/siyuan-plugin-blockref-footnote

脚注插件已经支持数字编号样式:默认不启用,需要在插件设置中开启

PixPin20241130185635.png

功能

  • 支持排序脚注编号
  • 支持排序脚注内容块
  • 支持删除后进行编号
  • 命令面板添加【脚注数字编号】命令:由于之前的设计存在问题,所以插件 v1.1.5 及之前的脚注不支持转换为数字编号样式

预览

脚注插件支持编号.gif

存在的问题

  1. 当脚注数量越多,排序编号耗时越长,暂时没法解决
  2. 插件开发求助:想问问有什么方法能获取到最新又完整的文档 DOM 结构呢 · Issue #13313 · siyuan-note/siyuan:由于用 api 获取的可能不是最新的 DOM,不会写大佬说的 ws 监听,就在脚注编号前添加 500ms 延迟,欢迎有空的大佬能指导改进下,感激不尽 🙏
  • 思源笔记

    思源笔记是一款隐私优先的个人知识管理系统,支持完全离线使用,同时也支持端到端加密同步。

    融合块、大纲和双向链接,重构你的思维。

    22773 引用 • 91425 回帖 • 2 关注
1 操作
Achuan-2 在 2024-12-02 12:52:53 更新了该帖

相关帖子

优质回帖
  • CongSec 2 赞同
    1. 这个弹窗美观不是很好,而且我觉得弹窗不需要确认按键
    2. 不支持 markdown 实时预览以及自动生成列表序号,没有在思源编辑是的流畅感了
    3. 其次是在文字最右边生成脚注时弹窗大部分窗口被覆盖,需要鼠标来移动,希望默认在中间生成弹窗
    4. 能否恢复原版的弹窗或者是添加按钮

    image.png

    image.png

  • Achuan-2 1

    v1.1.8

    不勾选脚注自动编号时,添加脚注的弹窗可以使用思源富文本功能编辑脚注内容

    PixPin20241201171433.png

    但是勾选脚注自动编号,还是只能纯文本格式添加脚注内容,因为我暂时实现不了同时更新脚注编号又同时显示特定块的功能,需要富文本编辑,可以等脚注排完序,再悬浮脚注引用编辑

  • Achuan-2 1 赞同

    基本功能先完善好,我再美化,因为还不确定现在这个方案好不好用,未来会不会变更

欢迎来到这里!

我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。

注册 关于
请输入回帖内容 ...
  • stevehfut

    弹窗界面改了,感觉我的 docker 思源可以用这个插件了(之前硬是触发不了弹窗),膜拜大佬 🙏

  • textarea 可以考虑改成 protyle,这样可以支持思源原模原样的编辑效果。

    orz 好多人都没注意这一点

    1 回复
  • Achuan-2

    谢谢提醒 🙏

    我之前把就把弹窗里的选中文字的 div 加了 protyle-wysiwyg

    textarea,我就没去试

    刚才尝试了下,textarea 改为 div.protyle ,确实可以生成富文本样式,但貌似调用不了悬浮工具栏和斜杆命令

    1 回复
    1 操作
    Achuan-2 在 2024-11-30 23:00:31 更新了该回帖
  • 用 appendBlock api 先插入块,然后用 siyuan 包里的 Protyle 对象渲染前面 api 返回的块 id 就行。

    image.png

    2 回复
  • Achuan-2

    好的谢谢大佬指导,我下周试试

  • Achuan-2

    PixPin20241201103448.png

    确实可以,感谢建议

    不过我脚注编号会刷新整个 dom。protyle 加载的块会消失又重新加载,这时候 FootnoteDialog 会不再聚焦于当前的块,直接变为聚焦整个文档,不知道能否修改为 FootnoteDialog 弹出后,不主动获取块的最新内容,直到我点击关闭,再用新的值更新块内容

    1 回复
    3 操作
    Achuan-2 在 2024-12-01 11:11:59 更新了该回帖
    Achuan-2 在 2024-12-01 10:59:36 更新了该回帖
    Achuan-2 在 2024-12-01 10:35:03 更新了该回帖
  • CongSec 2 赞同
    1. 这个弹窗美观不是很好,而且我觉得弹窗不需要确认按键
    2. 不支持 markdown 实时预览以及自动生成列表序号,没有在思源编辑是的流畅感了
    3. 其次是在文字最右边生成脚注时弹窗大部分窗口被覆盖,需要鼠标来移动,希望默认在中间生成弹窗
    4. 能否恢复原版的弹窗或者是添加按钮

    image.png

    image.png

    2 回复
  • sweesalt

    我个人也是觉着原来的弹窗就挺好!建议加个选项,这样可以满足不同的需求。

    1 回复
  • Achuan-2 1

    v1.1.8

    不勾选脚注自动编号时,添加脚注的弹窗可以使用思源富文本功能编辑脚注内容

    PixPin20241201171433.png

    但是勾选脚注自动编号,还是只能纯文本格式添加脚注内容,因为我暂时实现不了同时更新脚注编号又同时显示特定块的功能,需要富文本编辑,可以等脚注排完序,再悬浮脚注引用编辑

  • Achuan-2

    因为脚注自动编号,用原来弹窗会有问题,文档一刷新,就无法聚焦原来的块了,才额外设计一个弹窗

    而且用块引悬浮窗,很容易意外添加不是脚注内容块的块,自定义弹窗可以尽量避免这个问题

    2 回复
    2 操作
    Achuan-2 在 2024-12-01 18:02:32 更新了该回帖
    Achuan-2 在 2024-12-01 18:02:16 更新了该回帖
  • sweesalt

    哦,好的,也可以接受新的悬浮窗,不影响使用,如果有空能做得更漂亮些更好 😄

    1 回复
  • sweesalt

    image.png

    2 回复
  • Achuan-2 1 赞同

    基本功能先完善好,我再美化,因为还不确定现在这个方案好不好用,未来会不会变更

    1 操作
    Achuan-2 在 2024-12-01 20:26:14 更新了该回帖
  • Achuan-2

    我可以尝试下给模板添加一个变量 index,脚注编号,自动更新这个变量,再结合块链接样式,应该可以做到

    1 回复
  • sweesalt

    👍

    1 回复
  • Achuan-2

    插件 v1.2.0 更新

    • ✨ 脚注内容模板新增脚注编号变量:${index} 脚注编号默认带原块链接,${index:text} 脚注编号纯文本

    • 🔥 取消脚注启用编号对脚注内容块添加命名的操作

    实现上面 GIF 的效果:
    开启脚注自动编号,脚注内容模板设置为

    {{{row
    ${index} ${content}
    }}}
    

    之前版本或者原来模板没有添加 ${index} 变量的块想要自动编号,可以在每个脚注内容块里粘贴下面内容,然后命令面板运行【脚注编号】命令

    <span data-type="custom-footnote-index" >[注]</span>
    
  • Achuan-2

    PixPin20241201224341.png

    改进了下模板,这个模板是我最喜欢的模板啦哈哈哈,觉得非常适合脚注

    {{{col
    ${index}
    {: style="width: 2.5em; flex: 0 0 auto;"}
    
    {{{row
    ${content}
    }}}
    
    }}}
    
  • huaji enhance 的评论功能还在持续上分

  • 重新 focus 一下弹窗中的块就行

    1 回复
  • Achuan-2

    不会哈哈哈

    protyle.wysiwyg.element 修改后也不知道怎么直接保存,就只好用耗时更长、会让块短暂消失的 updateBlock 了

    所以就只能用弹窗的方式先中转下

    求大佬指导哈哈

  • 我去,牛逼!!!!!

  • cxg318

    我去,牛逼!!!!!

  • 牛逼,无需多言

  • 感谢 Achuan-2!插件已经常驻了。

    最近更新后选中文本的样式通过自定义样式来实现了,很好的思路!请问还能按之前那样默认设置为标注等样式吗?如果不能的话希望能再提供这个设置呢!虽然可以通过设置样式将其展示为标注的样子,但似乎难以将其作为标注统一做些处理。(比如统一获取当前文档的标注)

    其次,当我将插件里「选中文本的样式」设置为「无」,原来选中的文本仍然能展现样式。这是 bug 还是 feature?

    然后希望能为选中文本后是否弹窗添加设置。先一次性选中文本,然后再一个个补录标注应该也是蛮很常见的场景。这种场景下不断关闭弹窗会有点打断心流。

    谢谢!

    1 回复
  • Achuan-2 1
    1. 不考虑用原生的高亮样式了,重叠文字添加脚注用原生的样式会有问题,目前选中的文本也是有属性的,span[data-type*="custom-footnote-selected-text"],应该用 sql 也能查询到
    2. 选中文本样式只修改之后要添加脚注的样式,不影响之前的,毕竟有些文档想要有选中文本样式,有些又可能不太适合,如果要全局取消,可以把设置里选中文本 css 的这部分删除即可,删除当前文档的选中文本样式,之后会在命令面板添加一个命令
    3. 弹窗不弹出之后会加一个设置项
    1 回复
  • 原来是这样~感谢回复!

  • cxg318

    image.png

  • cxg318
    > ${index}  ${selection}  | ${{now | date "20060102 15:04:05"}}
    > > ${content}
    
  • Achuan-2

    @participants

    发现脚注编号有重大 bug,长文档可能会造成块丢失,v1.2.4 暂时先改为耗时方法进行编号,保证原内容不丢失,但在插件编号过程中添加新内容依然会造成内容丢失,如无必要请勿开启脚注自动编号功能,有需要可以脚注添加完成之后,使用命令对脚注进行批量编号

    2 回复
  • 现在脚注外观好了很多,但是有两部分内容重复了,占据较大空间

    image.png

    1 回复
  • Achuan-2

    这是因为你设置的模板有放选中的文本,

    其他人可能模板里不会放这个

    1 回复
  • Charlena

    我刚刚就遇到了,还想反馈一下来着

  • 我没有设置模版呀,默认的,是不是上个版本遗留下的模版

    不过我尝试了一下,把圈圈部分删除即可

    image.png

  • ??你是咋写的,为什么还会丢块

    1 回复
  • Achuan-2

    V 姐和我说 protyle.wysiwyg.element 能获取完整的 dom,我就信了,昨天才发现还是只能获取动态加载的部分,用动态加载的部分更新文档,自然就丢块了

    脚注要自动编号,目前想到的方案是获取完整 DOM,替换脚注引用编号和重排脚注内容块后,再用这个更新文档

    1 回复
  • 记录修改过的块 id,批量更新前按照 md 语法作替换,然后用 updateBlock 更新。

    1 回复
  • Achuan-2

    是个思路,可以先优先修改当前块,其他需要修改的块后台修改

    1 回复
  • 这个方法不需要关系块有没有加载,全都是以后台最新数据进行调整。

    然后用这个你说好像光标会不定位。更新完以后,用 protyle 的 focus 方法,聚焦你窗口里的元素就行。

    1 回复
  • Achuan-2

    好的谢谢,我之后试试 🙏

请输入回帖内容 ...
Achuan-2
给时间以生命而不是给生命以时间,如果你喜欢我的分享,欢迎给我买杯咖啡 https://www.yuque.com/achuan-2 上海