ttrpg-tools/todo.md

1.8 KiB
Raw Blame History

todo

md-pins

  • 类似 md-pin寻找最近一张图片。
  • 在图片上显示透明遮罩,覆盖整个图片。
  • 点击遮罩添加一个 pin位置在点击的位置。
  • 再次点击 pin 会删除 pin。
  • 点击遮罩 hud 的复制按钮,可以将所有 pin 复制为 md-pin 文本,以回车换行连接。
  • 所有 pin 按照 A B C ... Z AA AB ... 的顺序显示标签。
  • 重命名为 md-pins退休 md-pin。

md-deck

定义一个排版模板,填充来自 csv 的数据并生成预览。

语法

  • size: 长宽尺寸,以 mm 为单位。
  • grid: 排版网格。
  • bleed: 出血,如 54x86 外加 1mm 出血之后实际尺寸为 56x88。
  • padding: 网格外边距。54x86 外加 2mm padding 之后实际网格区域为 50x82。
  • layers: 排版层,由一个列表构成。每个元素以 prop:topleft-bottomright 格式定义。
  • fixed: 是否可编辑。fixed 未定义时开启编辑器 UI。
:md-deck[./card.csv]{size="54x86" grid="5x8" bleed="1" padding="2" layers="body:1,7-5,8 title:1,1-5,1"}

显示

首先对 csv 数据中的每个条目,显示一个 tab。放在一个 flex wrap 的标签框里。

然后显示卡牌本身。对每个排版层,将 csv 数据中对应字段作为 markdown 显示在对应位置并居中。

编辑器 UI

在卡牌左侧显示 csv 数据内容。

在卡牌右侧显示表单,并以响应式控件编辑卡牌属性:

  • size
  • grid
  • bleed
  • padding

对于每一个 csv 字段,显示一个图层控件:

  • 是否显示:若不显示,则在 layers 中不出现此字段。
  • 编辑位置按钮:激活后,在卡牌上显示遮罩,并允许框选网格区域,以用作字段的位置。

最后,显示一个复制按钮,用于复制整个卡牌的:md-deck代码。

  • 创建 md-deck 组件
  • 实现编辑器 UI