pdd 版文档树制卡

本贴最后更新于 689 天前,其中的信息可能已经时移俗易

前情提要:使用当前文档的标记块快速制作闪卡 - 链滴

依然基于 @BryceAndJuly 大佬的 【分享】使用当前文档的二级标题快速制作闪卡,但是现在不需要手动输入了,可以自动获取当前文档的路径,然后在全部的卡包里进行匹配,匹配一个卡包的名字包括在当前文档路径里的卡包。

举例:卡包名为 test1、test2,当前文档路径为\a\test1\b,那么会自动添加卡片到 test1。

不要尝试 \a\test1\test2 的文档,因为我也不知道会发生什么:)

注意,因为目前获取路径的方法是从页面中读取,在添加卡片之前,需要将鼠标放在当前文档的选项卡上,确定路径已经加载完毕:

图片.png

如果有更好的获取当前文档路径的方法,请一定告诉我。

使用说明:

前情提要:我已经提前建立了名为内容块的卡包。

快速制卡.gif

另外,一个我写的时候未能想到的好消息:当前页面的嵌入块中的标记也能被添加到卡包中。

欢迎留言使用体验,或者告诉我代码还能怎么改进。


2023.2.2 更新:现在支持添加到多个卡组了,也就是说,卡包名为 test1、test2,当前文档路径为\a\test1\test2 时,会自动添加卡片到 test1、test2 卡组。

// 一键制卡 v0.2
// 请求函数
function request(url, data = null, method = "POST") {
    return new Promise((resolve, reject) => {
        if (method.toUpperCase() == "POST") {
            fetch(url, {
                method: "POST",
                headers: { "Content-Type": "application/json" },
                body: JSON.stringify(data),
            })
                .then(
                    (data) => resolve(data.json()),
                    (error) => {
                        reject(error);
                    }
                )
                .catch((err) => {
                    console.error("请求失败:", err);
                });
        }
    });
}

// 弹出提示信息
async function showMessage(msg) {
    await request("/api/notification/pushMsg", { msg, timeout: 3000 });
}

// 添加多个卡片
async function addCards() {
    //获取全部deck
    let res = await request("/api/riff/getRiffDecks", {});

    //获取当前打开文档的路径
    let focusItem = document.querySelector("li[class='item item\\-\\-focus']");
    focusItemPath = focusItem.getAttribute("aria-label");
    if (focusItemPath === null) {
        showMessage(`未能当前文档读取路径`);
        return;
    }

    //获取deck.id, 其deck.name 包含在 focusItemPath 中
    let customDeckIdArr = [];
    Array.from(res.data).forEach((item) => {
        let name = item.name;
        if (focusItemPath.search(name) != -1) {
            customDeckIdArr.push(item.id);
        }
    })

    if (customDeckIdArr.length === 0) {
        showMessage(`未能获取到:${focusItemPath} 的卡包`);
        return;
    } else if (customDeckIdArr.length > 0) {

        // 获取需要被制成卡片的块的ID
        const currentPage = document.querySelector(
            ".fn__flex-1.protyle:not(.fn__none)"
        );

        const markList = currentPage.querySelectorAll("span[data-type='mark']")


        if (markList && markList.length > 0) {
            let arr = [];
            Array.from(markList).forEach((item) => {
                let id = item.parentElement.parentElement.getAttribute("data-node-id");
                if (id) {
                    arr.push(id);
                }
            })
            // 去重
            arr = [... new Set(arr)]

            for (deckIndex in customDeckIdArr) {

                // 把标记所在块全部制成卡片
                let body = {
                    deckID: customDeckIdArr[deckIndex],
                    blockIDs: arr,
                };
                let res = await request("/api/riff/addRiffCards", body);
                if (res.code === 0) {
                    showMessage(`${res.data.name}卡包的总卡片数:${res.data.size}`);
                }
            }
        }
    }
}

// 添加一个按钮
const barMode = document.getElementById("barMode");
barMode.insertAdjacentHTML(
    "beforebegin",
    '<div id="addCards" class="toolbar__item b3-tooltips b3-tooltips__se" aria-label="制作卡片" ></div>'
);
const addCardsBtn = document.getElementById("addCards");
addCardsBtn.style.width = "auto";
const addCardsBtnIcon = `<svg t="1674130669751" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4526" width="200" height="200"><path d="M928 160H96a32 32 0 0 0-32 32v672a32 32 0 0 0 32 32h832a32 32 0 0 0 32-32V192a32 32 0 0 0-32-32z m-32 672H128V224h768v608z" p-id="4527" fill="#9aa0a6"></path><path d="M230.592 448.096H544a32 32 0 1 0 0-64H230.592a32 32 0 0 0 0 64zM230.592 640.096H544a32 32 0 1 0 0-64H230.592a32 32 0 1 0 0 64zM768 704a32 32 0 0 0 32-32V350.016a32 32 0 1 0-64 0V672a32 32 0 0 0 32 32z" p-id="4528" fill="#9aa0a6"></path></svg>`;
addCardsBtn.innerHTML = addCardsBtnIcon;
addCardsBtn.addEventListener(
    "click",
    (e) => {
        addCards();
        e.stopPropagation();
        e.preventDefault();
    },
    true
);```

欢迎留言使用体验,或者告诉我代码还能怎么改进。

  • 思源笔记

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

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

    23014 引用 • 92576 回帖
1 操作
zxhd86 在 2023-02-02 10:08:28 更新了该帖

相关帖子

欢迎来到这里!

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

注册 关于
请输入回帖内容 ...
  • 在思源官方支持文档树制卡前,可以暂时用楼主这套方案代替。再次呼吁官方考虑按文档树无感分类方案。

    相关文章:

    【科普帖】RemNote 是如何进行卡片分类的


    从这篇文章以及最近的一些讨论中不难发现,同一篇文档的卡片属于同一卡包 这一用户需求具备广泛民意基础,因为这是一个很自然的软件逻辑。

    2 操作
    openAI 在 2023-02-01 21:23:44 更新了该回帖
    openAI 在 2023-02-01 20:41:40 更新了该回帖
  • 其他回帖
  • zxhd86

    额,抱歉,我发帖子的时候显然忘记把代码贴上去了……不过我又更新了一次了。

  • zyu318

    请问 JS 代码在哪里?

    1 回复

推荐标签 标签

  • Q&A

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

    8447 引用 • 38484 回帖 • 155 关注
  • LaTeX

    LaTeX(音译“拉泰赫”)是一种基于 ΤΕΧ 的排版系统,由美国计算机学家莱斯利·兰伯特(Leslie Lamport)在 20 世纪 80 年代初期开发,利用这种格式,即使使用者没有排版和程序设计的知识也可以充分发挥由 TeX 所提供的强大功能,能在几天,甚至几小时内生成很多具有书籍质量的印刷品。对于生成复杂表格和数学公式,这一点表现得尤为突出。因此它非常适用于生成高印刷质量的科技和数学类文档。

    12 引用 • 54 回帖 • 49 关注
  • TGIF

    Thank God It's Friday! 感谢老天,总算到星期五啦!

    288 引用 • 4485 回帖 • 663 关注
  • 又拍云

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

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

    Cloud Foundry 是 VMware 推出的业界第一个开源 PaaS 云平台,它支持多种框架、语言、运行时环境、云平台及应用服务,使开发人员能够在几秒钟内进行应用程序的部署和扩展,无需担心任何基础架构的问题。

    5 引用 • 18 回帖 • 172 关注
  • JRebel

    JRebel 是一款 Java 虚拟机插件,它使得 Java 程序员能在不进行重部署的情况下,即时看到代码的改变对一个应用程序带来的影响。

    26 引用 • 78 回帖 • 672 关注
  • CongSec

    本标签主要用于分享网络空间安全专业的学习笔记

    1 引用 • 1 回帖 • 15 关注
  • 学习

    “梦想从学习开始,事业从实践起步” —— 习近平

    171 引用 • 512 回帖
  • TensorFlow

    TensorFlow 是一个采用数据流图(data flow graphs),用于数值计算的开源软件库。节点(Nodes)在图中表示数学操作,图中的线(edges)则表示在节点间相互联系的多维数据数组,即张量(tensor)。

    20 引用 • 19 回帖 • 1 关注
  • Logseq

    Logseq 是一个隐私优先、开源的知识库工具。

    Logseq is a joyful, open-source outliner that works on top of local plain-text Markdown and Org-mode files. Use it to write, organize and share your thoughts, keep your to-do list, and build your own digital garden.

    6 引用 • 63 回帖 • 5 关注
  • 分享

    有什么新发现就分享给大家吧!

    248 引用 • 1795 回帖 • 1 关注
  • 运维

    互联网运维工作,以服务为中心,以稳定、安全、高效为三个基本点,确保公司的互联网业务能够 7×24 小时为用户提供高质量的服务。

    149 引用 • 257 回帖
  • WiFiDog

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

    1 引用 • 7 回帖 • 592 关注
  • WebSocket

    WebSocket 是 HTML5 中定义的一种新协议,它实现了浏览器与服务器之间的全双工通信(full-duplex)。

    48 引用 • 206 回帖 • 318 关注
  • 工具

    子曰:“工欲善其事,必先利其器。”

    288 引用 • 734 回帖 • 2 关注
  • 程序员

    程序员是从事程序开发、程序维护的专业人员。

    574 引用 • 3533 回帖
  • Linux

    Linux 是一套免费使用和自由传播的类 Unix 操作系统,是一个基于 POSIX 和 Unix 的多用户、多任务、支持多线程和多 CPU 的操作系统。它能运行主要的 Unix 工具软件、应用程序和网络协议,并支持 32 位和 64 位硬件。Linux 继承了 Unix 以网络为核心的设计思想,是一个性能稳定的多用户网络操作系统。

    946 引用 • 943 回帖
  • SpaceVim

    SpaceVim 是一个社区驱动的模块化 vim/neovim 配置集合,以模块的方式组织管理插件以
    及相关配置,为不同的语言开发量身定制了相关的开发模块,该模块提供代码自动补全,
    语法检查、格式化、调试、REPL 等特性。用户仅需载入相关语言的模块即可得到一个开箱
    即用的 Vim-IDE。

    3 引用 • 31 回帖 • 104 关注
  • 数据库

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

    343 引用 • 723 回帖
  • Postman

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

    4 引用 • 3 回帖 • 7 关注
  • 链滴

    链滴是一个记录生活的地方。

    记录生活,连接点滴

    156 引用 • 3792 回帖
  • Webswing

    Webswing 是一个能将任何 Swing 应用通过纯 HTML5 运行在浏览器中的 Web 服务器,详细介绍请看 将 Java Swing 应用变成 Web 应用

    1 引用 • 15 回帖 • 637 关注
  • HHKB

    HHKB 是富士通的 Happy Hacking 系列电容键盘。电容键盘即无接点静电电容式键盘(Capacitive Keyboard)。

    5 引用 • 74 回帖 • 478 关注
  • jQuery

    jQuery 是一套跨浏览器的 JavaScript 库,强化 HTML 与 JavaScript 之间的操作。由 John Resig 在 2006 年 1 月的 BarCamp NYC 上释出第一个版本。全球约有 28% 的网站使用 jQuery,是非常受欢迎的 JavaScript 库。

    63 引用 • 134 回帖 • 724 关注
  • 快应用

    快应用 是基于手机硬件平台的新型应用形态;标准是由主流手机厂商组成的快应用联盟联合制定;快应用标准的诞生将在研发接口、能力接入、开发者服务等层面建设标准平台;以平台化的生态模式对个人开发者和企业开发者全品类开放。

    15 引用 • 127 回帖
  • Solidity

    Solidity 是一种智能合约高级语言,运行在 [以太坊] 虚拟机(EVM)之上。它的语法接近于 JavaScript,是一种面向对象的语言。

    3 引用 • 18 回帖 • 401 关注
  • 域名

    域名(Domain Name),简称域名、网域,是由一串用点分隔的名字组成的 Internet 上某一台计算机或计算机组的名称,用于在数据传输时标识计算机的电子方位(有时也指地理位置)。

    43 引用 • 208 回帖