求助实现多个块的快速合并及折叠

求助一个 quicker 动作、思源按钮或快捷键,手动选中思源笔记的连续多个块时,点击思源按钮或 quicker 动作,实现以下功能:

  1. 将选中的多个块转换成引述或超级块。
  2. 将这个整体的引述或超级块折叠。
  • 思源笔记

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

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

    23012 引用 • 92561 回帖
  • Q&A

    提问之前请先看《提问的智慧》,好的问题比好的答案更有价值。

    8447 引用 • 38474 回帖 • 154 关注
被采纳的回答
  • EmberSky

    选中后 ctrl+q 触发, 触发后会将选中的内容转换成引用, 过程中会有点卡顿, 因为不知道为啥, 延时低了就会报错, 所以只能先让 sleep 时间长一点

    触发前, image.png, 触发后, image.png

    (()=>{
    // 延迟执行
    function sleep(ms) {
      return new Promise(resolve => setTimeout(resolve, ms));
    }
    function press_once(keyInit, selector = null) {
      keyInit["bubbles"] = true;
      if (selector == null) {
        selector = document.querySelector('[data-type="wnd"].layout__wnd--active .protyle:not(.fn__none) .protyle-wysiwyg.protyle-wysiwyg--attr')
      }
      else if (typeof selector === 'function') {
        selector = selector()
      }
      else if (typeof selector === 'string') {
        selector = document.querySelector(selector)
      }
      if (!selector) return
      selector.dispatchEvent(new KeyboardEvent('keydown', keyInit));
      selector.dispatchEvent(new KeyboardEvent('keyup', keyInit));
    }
    async function add_new_line_before() {
      press_once({
        key: 'Enter',
        ctrlKey: true,
        shiftKey: true,
        keyCode: 13, // 不推荐使用,但某些情况下需要
      });
    }
    function click_right(ele) {
      // 创建一个右键点击的 MouseEvent
      const rightClickEvent = new MouseEvent('contextmenu', {
        bubbles: true,
        cancelable: true,
        view: window,
        button: 2 
      });
      ele.dispatchEvent(rightClickEvent);
    }
    
    
    // 获取光标所在的元素
    function getElementAtCursor() {
      const selection = window.getSelection();
    
      if (selection.rangeCount > 0) {
        const range = selection.getRangeAt(0);
        const startContainer = range.startContainer;
        // 如果是文本节点,获取其父元素
        const element = startContainer.nodeType === 3 ? startContainer.parentNode : startContainer;
        return element;
      }
    
      return null; // 如果没有选中内容或光标位置无效
    }
    
    // 获取当前选中的文本
    async function get_selected_data() {
      // 触发 ctrl+c, 复制选中的块
      document.execCommand('copy');
      // 获取剪贴板文本
      return await navigator.clipboard.readText();
    }
    // 设置文本
    async function paste_data(data) {
      // 将处理后的文本复制到剪贴板
      await navigator.clipboard.writeText(data);
      // 触发 ctrl+v, 粘贴处理后的内容
      document.execCommand('paste');
      await sleep(20)
    }
    
    // 清空选中的内容: 先剪切, 再增加空行
    async function clear_selected_data() {
      // 触发 ctrl+x, 剪切选中的块, 目的是删除原有内容
      document.execCommand('cut');
      await add_new_line_before()
    }
    
    // 转换引用 - 使用系统自带的转换功能 
    function convert_quote_from_sys(event) {
      click_right(event.target)
      // 创建 mouseover 事件
      const mouseOverEvent = new MouseEvent('mouseover', {
        view: window,
        bubbles: true,
        cancelable: true,
      });
      let turn_ele = document.querySelector('.b3-menu__items>[data-id="turnInto"]')
      turn_ele?.dispatchEvent(mouseOverEvent);
      turn_ele = turn_ele?.querySelector('.b3-menu__submenu>.b3-menu__items>[data-id="quote"]')
      if (!turn_ele) return false
      turn_ele.click()
      return true
    }
    // 转换引用 - 使用自己实现的的转换功能
    async function convert_quote_from_my(clipboardText) {
      // 删除原有内容, 并增加空行
      await clear_selected_data()
      let clipboardTextRet = clipboardText
        .split('\n')
        .map(line => "> " + line)
        .join('\n')
      // 粘贴处理后的文本
      await paste_data(clipboardTextRet);
    }
    async function fold_block() {
      await sleep(300);
      let ele = getElementAtCursor();
      if (!ele) return
      while (!ele.parentNode.classList.contains("protyle-wysiwyg--attr") && ele.getAttribute('data-type') != 'NodeBlockquote') {
        ele = ele.parentNode
      }
      click_right(ele)
      await sleep(300)
      document.querySelector('.b3-menu__items>[data-id="fold"]')?.click()
    }
    
    // 合并选中的块
    async function handle_merge(event) {
      // 获取当前选中的文本
      let clipboardText = await get_selected_data();
      // 如果不需要处理, 则直接返回
      if (clipboardText == "") {
        console.log("不需要处理")
        return;
      }
      
      if (convert_quote_from_sys(event)) {
        console.log("系统转换成功")
      }
      else {
        await convert_quote_from_my(clipboardText)
        console.log("自定义转换成功")
      }
      await fold_block();
    }
    
    // 事件监听
    document.addEventListener('keydown', async (event) => {
      // 检查是否按下了 Ctrl + q
      if (event.ctrlKey && event.key === 'q') {
        // event.preventDefault(); // 防止快捷键默认行为
        await handle_merge(event);
      }
    });
    })()
    
    

欢迎来到这里!

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

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

    选中后 ctrl+q 触发, 触发后会将选中的内容转换成引用, 过程中会有点卡顿, 因为不知道为啥, 延时低了就会报错, 所以只能先让 sleep 时间长一点

    触发前, image.png, 触发后, image.png

    (()=>{
    // 延迟执行
    function sleep(ms) {
      return new Promise(resolve => setTimeout(resolve, ms));
    }
    function press_once(keyInit, selector = null) {
      keyInit["bubbles"] = true;
      if (selector == null) {
        selector = document.querySelector('[data-type="wnd"].layout__wnd--active .protyle:not(.fn__none) .protyle-wysiwyg.protyle-wysiwyg--attr')
      }
      else if (typeof selector === 'function') {
        selector = selector()
      }
      else if (typeof selector === 'string') {
        selector = document.querySelector(selector)
      }
      if (!selector) return
      selector.dispatchEvent(new KeyboardEvent('keydown', keyInit));
      selector.dispatchEvent(new KeyboardEvent('keyup', keyInit));
    }
    async function add_new_line_before() {
      press_once({
        key: 'Enter',
        ctrlKey: true,
        shiftKey: true,
        keyCode: 13, // 不推荐使用,但某些情况下需要
      });
    }
    function click_right(ele) {
      // 创建一个右键点击的 MouseEvent
      const rightClickEvent = new MouseEvent('contextmenu', {
        bubbles: true,
        cancelable: true,
        view: window,
        button: 2 
      });
      ele.dispatchEvent(rightClickEvent);
    }
    
    
    // 获取光标所在的元素
    function getElementAtCursor() {
      const selection = window.getSelection();
    
      if (selection.rangeCount > 0) {
        const range = selection.getRangeAt(0);
        const startContainer = range.startContainer;
        // 如果是文本节点,获取其父元素
        const element = startContainer.nodeType === 3 ? startContainer.parentNode : startContainer;
        return element;
      }
    
      return null; // 如果没有选中内容或光标位置无效
    }
    
    // 获取当前选中的文本
    async function get_selected_data() {
      // 触发 ctrl+c, 复制选中的块
      document.execCommand('copy');
      // 获取剪贴板文本
      return await navigator.clipboard.readText();
    }
    // 设置文本
    async function paste_data(data) {
      // 将处理后的文本复制到剪贴板
      await navigator.clipboard.writeText(data);
      // 触发 ctrl+v, 粘贴处理后的内容
      document.execCommand('paste');
      await sleep(20)
    }
    
    // 清空选中的内容: 先剪切, 再增加空行
    async function clear_selected_data() {
      // 触发 ctrl+x, 剪切选中的块, 目的是删除原有内容
      document.execCommand('cut');
      await add_new_line_before()
    }
    
    // 转换引用 - 使用系统自带的转换功能 
    function convert_quote_from_sys(event) {
      click_right(event.target)
      // 创建 mouseover 事件
      const mouseOverEvent = new MouseEvent('mouseover', {
        view: window,
        bubbles: true,
        cancelable: true,
      });
      let turn_ele = document.querySelector('.b3-menu__items>[data-id="turnInto"]')
      turn_ele?.dispatchEvent(mouseOverEvent);
      turn_ele = turn_ele?.querySelector('.b3-menu__submenu>.b3-menu__items>[data-id="quote"]')
      if (!turn_ele) return false
      turn_ele.click()
      return true
    }
    // 转换引用 - 使用自己实现的的转换功能
    async function convert_quote_from_my(clipboardText) {
      // 删除原有内容, 并增加空行
      await clear_selected_data()
      let clipboardTextRet = clipboardText
        .split('\n')
        .map(line => "> " + line)
        .join('\n')
      // 粘贴处理后的文本
      await paste_data(clipboardTextRet);
    }
    async function fold_block() {
      await sleep(300);
      let ele = getElementAtCursor();
      if (!ele) return
      while (!ele.parentNode.classList.contains("protyle-wysiwyg--attr") && ele.getAttribute('data-type') != 'NodeBlockquote') {
        ele = ele.parentNode
      }
      click_right(ele)
      await sleep(300)
      document.querySelector('.b3-menu__items>[data-id="fold"]')?.click()
    }
    
    // 合并选中的块
    async function handle_merge(event) {
      // 获取当前选中的文本
      let clipboardText = await get_selected_data();
      // 如果不需要处理, 则直接返回
      if (clipboardText == "") {
        console.log("不需要处理")
        return;
      }
      
      if (convert_quote_from_sys(event)) {
        console.log("系统转换成功")
      }
      else {
        await convert_quote_from_my(clipboardText)
        console.log("自定义转换成功")
      }
      await fold_block();
    }
    
    // 事件监听
    document.addEventListener('keydown', async (event) => {
      // 检查是否按下了 Ctrl + q
      if (event.ctrlKey && event.key === 'q') {
        // event.preventDefault(); // 防止快捷键默认行为
        await handle_merge(event);
      }
    });
    })()
    
    
    1 回复
  • 其他回帖
  • wenbocn

    或选中多个块后,中键任意一个块的块标,能够实现组合这些块并折叠,那就更好了
    [js] 鼠标中键折叠块 - 链滴

  • 引述、超级块、折叠

    image.png

    image.png

    image.png

    1 回复
  • wenbocn

    折叠快捷键,只能折叠一个块。只能折叠引述里面光标所在的单个块

  • 查看全部回帖

推荐标签 标签

  • Ruby

    Ruby 是一种开源的面向对象程序设计的服务器端脚本语言,在 20 世纪 90 年代中期由日本的松本行弘(まつもとゆきひろ/Yukihiro Matsumoto)设计并开发。在 Ruby 社区,松本也被称为马茨(Matz)。

    7 引用 • 31 回帖 • 216 关注
  • 以太坊

    以太坊(Ethereum)并不是一个机构,而是一款能够在区块链上实现智能合约、开源的底层系统。以太坊是一个平台和一种编程语言 Solidity,使开发人员能够建立和发布下一代去中心化应用。 以太坊可以用来编程、分散、担保和交易任何事物:投票、域名、金融交易所、众筹、公司管理、合同和知识产权等等。

    34 引用 • 367 回帖 • 1 关注
  • 爬虫

    网络爬虫(Spider、Crawler),是一种按照一定的规则,自动地抓取万维网信息的程序。

    106 引用 • 275 回帖 • 1 关注
  • SOHO

    为成为自由职业者在家办公而努力吧!

    7 引用 • 55 回帖 • 5 关注
  • CodeMirror
    1 引用 • 2 回帖 • 129 关注
  • Swagger

    Swagger 是一款非常流行的 API 开发工具,它遵循 OpenAPI Specification(这是一种通用的、和编程语言无关的 API 描述规范)。Swagger 贯穿整个 API 生命周期,如 API 的设计、编写文档、测试和部署。

    26 引用 • 35 回帖 • 5 关注
  • WiFiDog

    WiFiDog 是一套开源的无线热点认证管理工具,主要功能包括:位置相关的内容递送;用户认证和授权;集中式网络监控。

    1 引用 • 7 回帖 • 591 关注
  • 旅游

    希望你我能在旅途中找到人生的下一站。

    93 引用 • 899 回帖 • 3 关注
  • FlowUs

    FlowUs.息流 个人及团队的新一代生产力工具。

    让复杂的信息管理更轻松、自由、充满创意。

    1 引用
  • Mac

    Mac 是苹果公司自 1984 年起以“Macintosh”开始开发的个人消费型计算机,如:iMac、Mac mini、Macbook Air、Macbook Pro、Macbook、Mac Pro 等计算机。

    166 引用 • 595 回帖
  • 博客

    记录并分享人生的经历。

    273 引用 • 2388 回帖 • 1 关注
  • Angular

    AngularAngularJS 的新版本。

    26 引用 • 66 回帖 • 536 关注
  • QQ

    1999 年 2 月腾讯正式推出“腾讯 QQ”,在线用户由 1999 年的 2 人(马化腾和张志东)到现在已经发展到上亿用户了,在线人数超过一亿,是目前使用最广泛的聊天软件之一。

    45 引用 • 557 回帖 • 44 关注
  • Markdown

    Markdown 是一种轻量级标记语言,用户可使用纯文本编辑器来排版文档,最终通过 Markdown 引擎将文档转换为所需格式(比如 HTML、PDF 等)。

    167 引用 • 1520 回帖 • 1 关注
  • 黑曜石

    黑曜石是一款强大的知识库工具,支持本地 Markdown 文件编辑,支持双向链接和关系图。

    A second brain, for you, forever.

    16 引用 • 130 回帖
  • Bug

    Bug 本意是指臭虫、缺陷、损坏、犯贫、窃听器、小虫等。现在人们把在程序中一些缺陷或问题统称为 bug(漏洞)。

    76 引用 • 1737 回帖
  • 数据库

    据说 99% 的性能瓶颈都在数据库。

    343 引用 • 723 回帖
  • 又拍云

    又拍云是国内领先的 CDN 服务提供商,国家工信部认证通过的“可信云”,乌云众测平台认证的“安全云”,为移动时代的创业者提供新一代的 CDN 加速服务。

    21 引用 • 37 回帖 • 548 关注
  • LeetCode

    LeetCode(力扣)是一个全球极客挚爱的高质量技术成长平台,想要学习和提升专业能力从这里开始,充足技术干货等你来啃,轻松拿下 Dream Offer!

    209 引用 • 72 回帖
  • JWT

    JWT(JSON Web Token)是一种用于双方之间传递信息的简洁的、安全的表述性声明规范。JWT 作为一个开放的标准(RFC 7519),定义了一种简洁的,自包含的方法用于通信双方之间以 JSON 的形式安全的传递信息。

    20 引用 • 15 回帖 • 6 关注
  • 阿里巴巴

    阿里巴巴网络技术有限公司(简称:阿里巴巴集团)是以曾担任英语教师的马云为首的 18 人,于 1999 年在中国杭州创立,他们相信互联网能够创造公平的竞争环境,让小企业通过创新与科技扩展业务,并在参与国内或全球市场竞争时处于更有利的位置。

    43 引用 • 221 回帖 • 106 关注
  • Spring

    Spring 是一个开源框架,是于 2003 年兴起的一个轻量级的 Java 开发框架,由 Rod Johnson 在其著作《Expert One-On-One J2EE Development and Design》中阐述的部分理念和原型衍生而来。它是为了解决企业应用开发的复杂性而创建的。框架的主要优势之一就是其分层架构,分层架构允许使用者选择使用哪一个组件,同时为 JavaEE 应用程序开发提供集成的框架。

    943 引用 • 1460 回帖 • 3 关注
  • 微信

    腾讯公司 2011 年 1 月 21 日推出的一款手机通讯软件。用户可以通过摇一摇、搜索号码、扫描二维码等添加好友和关注公众平台,同时可以将自己看到的精彩内容分享到微信朋友圈。

    132 引用 • 795 回帖
  • 星云链

    星云链是一个开源公链,业内简单的将其称为区块链上的谷歌。其实它不仅仅是区块链搜索引擎,一个公链的所有功能,它基本都有,比如你可以用它来开发部署你的去中心化的 APP,你可以在上面编写智能合约,发送交易等等。3 分钟快速接入星云链 (NAS) 测试网

    3 引用 • 16 回帖 • 5 关注
  • App

    App(应用程序,Application 的缩写)一般指手机软件。

    91 引用 • 384 回帖 • 2 关注
  • Node.js

    Node.js 是一个基于 Chrome JavaScript 运行时建立的平台, 用于方便地搭建响应速度快、易于扩展的网络应用。Node.js 使用事件驱动, 非阻塞 I/O 模型而得以轻量和高效。

    139 引用 • 269 回帖 • 28 关注
  • Postman

    Postman 是一款简单好用的 HTTP API 调试工具。

    4 引用 • 3 回帖 • 7 关注