一键复制笔记卡片

做了个生成笔记分享卡片的小工具 https://ob.zji.me/ShareCard (此网址随时可能变动,工具可能变化,仅在微信群中通知),但是每次都手动填写也挺麻烦的,所以这个工具支持使用 get 参数调用。

技术细节

如果你只是想抄作业,这节可以跳过。

  • title 卡片标题(显示在卡片底部)
  • desc 卡片描述(显示在卡片底部)
  • content 卡片内容,支持 markdown 语法,但是不支持图片
  • copy 是否自动生成并复制,默认为否

以上均为可选参数,会自动填入工具的表单对应位置。其中前三个字符型的参数需要进行两次 decodeURIComponent 编码。

Templater 调用

第一步:在 Templater 的脚本文件夹(在 Templater 的设置中自行选择设置)中新建一个 ToCopyShareCard.js 文件,并将如下内容粘贴进去:

/**
 *
 *
 * @param {object} opt 配置参数
 * @param {string|undefined} opt.title   卡片标题,一般在 10 字以内
 * @param {string|undefined} opt.desc    卡片描述,一般在 20 字以内
 * @param {string|undefined} opt.content 卡片内容,长度任意,支持基本的 markdown 语法,但不支持图片
 * @param {boolean|undefined} opt.copy    是否自动生成并复制到剪切板
 */
const ToCopyShareCard = (opt)=>{
  let url = 'https://ob.zji.me/ShareCard'
  let queryIndex = 0
  const keys = ['title', 'desc', 'content']
  keys.forEach(k=>{
    if(!opt[k]) return
    url += `${queryIndex ? '&' : '?'}${k}=${encodeURIComponent(encodeURIComponent( opt[k] ))}`
    queryIndex++
  })
  if(opt.copy) url += `${queryIndex ? '&' : '?'}copy=1`
  window.open(url)
  return opt.content || ''
}
module.exports = ToCopyShareCard;

这样就有了一个 Templater 的用户脚本,接下来我们写 Templater 的模板来调用这个脚本。在 Templater 的模板文件夹(在 Templater 的设置中自行选择设置)中创建一个 shareCard.md 文件,并粘贴如下内容:

<%*
let content = tp.file.selection()
if(!content) content = await tp.system.prompt("请输入笔记内容", '', false, true)
if(content){
  tp.user.ToCopyShareCard({
    title: '稻米鼠的笔记碎片(鼠片)',
    desc: '也许记忆,也许遗忘,皆是生活,具为过往',
    content,
    copy: 1
  })
}
if(tp.file.selection()) tR += tp.file.selection()
%>

保存好之后,到任意笔记中,选中一段文字,调用此模板,即可自动打开上述小工具,生成并复制图片。如果你没选中任何文字,则会弹出输入框供你输入内容。

进阶调用

反正就是调用那个脚本,传入需要的各种数据,那完全可以弄得复杂一点,比如我每天日记打卡(炫耀)的卡片:

<%*
    /* 获取时间信息 */
  const now = new Date()
  const year = now.getFullYear()
  const yearStart = new Date(year, 0)
  const yearEnd = new Date(year+1, 0)
  /* 计算年进度 */
  const yearProgress = (now-yearStart)/(yearEnd-yearStart)
  const yearPass = (yearProgress).toFixed(2)
  /* 生成代码 */
  const content = `# ${tp.date.now("YYYY-MM-DD")} <small>${['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'][new Date().getDay()]}</small>

吼吼\\~可爱的大老鼠今天也有写日记哦~

**Year Progress:**

${''.padEnd(Math.round(yearProgress / 0.05), '▓')}${''.padEnd(Math.round((1 - yearProgress) / 0.05), '░')} ${(yearProgress*100).toFixed(2)}%`
  tp.user.ToCopyShareCard({
    title: '但愿能够坚持的日记打卡',
    desc: '幻想着自己能写上五年、十年,然后坐在阳光下,慢慢翻看……',
    content,
    copy: 1
  })
%>

细节说明

用的现成的工具转换成图片,细节上经常存在一些误差,不过大体够用,我满足了,毕竟自己写一个需要花费的精力十分巨大,不值得啊。样式上后期我可能会处理一些细节,和 Obsidian 或者我的网站更加兼容和接近。

©2022~2024 稻米鼠. Last build at 2024/3/5 00:00:38