松浦 知也 Matsuura Tomoya
3d83629658
All checks were successful
Build / build (push) Successful in 7m10s
39 lines
2.8 KiB
Markdown
39 lines
2.8 KiB
Markdown
#quartz #software
|
||
|
||
[[テロメア]]をObsidian-gitのLine Authoring機能でそれっぽく実現したら割と有益だったので、Quartzにも入れてみたくなった。
|
||
|
||
プラグインとして実装することにした。8割ぐらいcopilotに助けてもらったが一応作れた。
|
||
|
||
https://github.com/tomoyanonymous/quartz-line-age
|
||
|
||
## 実装メモ
|
||
|
||
quartzのプラグインにはtransformer/filter/emitterの3種類ある。
|
||
|
||
transformerにもさらに3種類あって、
|
||
|
||
1. テキスト変換プラグイン
|
||
2. Markdownツリー変換プラグイン
|
||
3. HTMLツリー変換プラグイン
|
||
|
||
の3つ。基本はconfigに並んだ順で読み込まれるが、実行される順は↑の順が優先される（そりゃそうだ）。
|
||
|
||
HTMLに変換された後では行数が元のファイルとは異なってしまう。
|
||
|
||
そこで、line-authoringを実現するためには、
|
||
|
||
1. まずプレーンテキスト用プラグイン`LineAgePre`で`git blame`の情報を元に、行末にHTMLコメントとして`<!--line:10-->`のような行番号をつける（これはMarkdownプロセス時には単なる文字列として扱われる）
|
||
2. HTML変換後に、HTMLプラグイン`LineAgePost`プラグインで、コメントノードを拾ってきて、親ノードのchildrenの先頭（＝兄弟要素の一番先頭部分）に`<span class="line-age-bar" data-line-age="10.0" style="background-color:#xxxxxx;">`みたいなノードを埋め込む。data-line-ageはビルド時-最終更新日時を日数単位で表記。
|
||
3. スタイルシートではdata-line-ageの日数に応じて、background-colorを割り当てる。今はとりあえずテロメアと同じように1年経ったら完全グレーアウトにしてるが、太さの変更とかは特にやっていない。
|
||
|
||
基本的にはこれで良いのだが、実際には目次生成プラグインが、目次用のHTMLを2のMakrdownプラグインとして実装しており、`<!--line:10-->`みたいなのがHeadingについた状態で変換してしまい、それがHTMLまで残ってしまう。
|
||
|
||
なので、Markdownプラグインとして一度生成されたtocから正規表現でマーカー部分を削除するという処理をする`LineAgeMid`というプラグインもいる。
|
||
|
||
なので、たった1つの機能実現のためにプラグインを3つもインストールしなければならない。これはどうかと思うが致し方ない。
|
||
|
||
ダークモード用に色切り替えられるようにしないとな。
|
||
|
||
---
|
||
|
||
別の問題として、Quartzはnpmモジュールとしてインストールして使用ではなく、フォークして使用する前提なので、プラグインを作る時にインターフェースを引っ張ってくる方法がない。 |