feat(blog/nuldoc): add custom div block for edit

12 files changed, 63 insertions, 36 deletions

diff --git a/vhosts/blog/content/posts/2021-10-02/vim-swap-order-of-selected-lines.dj b/vhosts/blog/content/posts/2021-10-02/vim-swap-order-of-selected-lines.dj
index 5de1075d..1cd070eb 100644
--- a/vhosts/blog/content/posts/2021-10-02/vim-swap-order-of-selected-lines.dj
+++ b/vhosts/blog/content/posts/2021-10-02/vim-swap-order-of-selected-lines.dj
@@ -96,8 +96,9 @@ command! -bar -range=%
 {#solution}
 # 解決策
 
-::: note
-[2020/9/28追記] より簡潔な方法を見つけたので次節に追記した
+{editat="2020-09-28" operation="追記"}
+::: edit
+より簡潔な方法を見つけたので次節に追記した。
 :::
 
 前述した `:Reverse` コマンドの定義を少し変えて、次のようにする:
@@ -143,8 +144,9 @@ Vim のヘルプから該当箇所を引用する (強調は筆者による)。
 {#solution-revised}
 # 解決策 (改訂版)
 
-::: note
-[2020/9/28追記] より簡潔な方法を見つけたため追記する
+{editat="2020-09-28" operation="追記"}
+::: edit
+より簡潔な方法を見つけたため追記する。
 :::
 
 ```vim
diff --git a/vhosts/blog/content/posts/2022-04-24/term-banner-write-tool-showing-banner-in-terminal.dj b/vhosts/blog/content/posts/2022-04-24/term-banner-write-tool-showing-banner-in-terminal.dj
index 433ad383..59c78e3e 100644
--- a/vhosts/blog/content/posts/2022-04-24/term-banner-write-tool-showing-banner-in-terminal.dj
+++ b/vhosts/blog/content/posts/2022-04-24/term-banner-write-tool-showing-banner-in-terminal.dj
@@ -89,7 +89,10 @@ $ term-banner 'Hello, World!' 'こんにちは、' '世界！'
 ゴシック体と明朝体があったが、私の好みで明朝体の方にした。
 ただ、ゴシック体の方が見やすい気がするので、フォントを選べるように後ほど拡張するかもしれない。
 
-2022-04-27 追記: `-f` オプションで選べるようにした。
+{editat="2022-04-27" operation="追記"}
+::: edit
+`-f` オプションで選べるようにした。
+:::
 
 {#outro}
 # おわりに
diff --git a/vhosts/blog/content/posts/2023-10-02/compile-php-runtime-to-wasm.dj b/vhosts/blog/content/posts/2023-10-02/compile-php-runtime-to-wasm.dj
index f6cd2ec2..2664b7a2 100644
--- a/vhosts/blog/content/posts/2023-10-02/compile-php-runtime-to-wasm.dj
+++ b/vhosts/blog/content/posts/2023-10-02/compile-php-runtime-to-wasm.dj
@@ -107,9 +107,8 @@ int EMSCRIPTEN_KEEPALIVE php_wasm_run(const char* code) {
 これにより、PHP コードの出力の後ろに余分な改行が追加されてしまう。
 改行を出力せずともバッファを消費させる手段をご存知のかたはご教示願いたい。
 
-::: note
-**2025-04-23 追記**:
-
+{editat="2025-04-23" operation="追記"}
+::: edit
 `fflush()` の前に改行の出力が必要だった理由が判明したので追記する。
 これは、`index.mjs` で標準出力・標準エラー出力へ出力する方法を指定せず、デフォルトの実装に任せているため。
 Emscripten のデフォルト実装では、改行コードを出力するまで出力内容がバッファリングされ、`fflush()` が機能しない。
diff --git a/vhosts/blog/content/posts/2024-03-17/phperkaigi-2024-report.dj b/vhosts/blog/content/posts/2024-03-17/phperkaigi-2024-report.dj
index 29e16cc8..65c7f70d 100644
--- a/vhosts/blog/content/posts/2024-03-17/phperkaigi-2024-report.dj
+++ b/vhosts/blog/content/posts/2024-03-17/phperkaigi-2024-report.dj
@@ -66,7 +66,10 @@ WebAssembly の VM を PHP で実装し、実装に至るまでの道程や WebA
 
 P.S. Ask the Speaker で話した、Ruby VM (written in PHP) on PHP VM (compiled to Wasm) on Wasm VM (written in PHP) on PHP というアイデアは「マジ」なので、続報をお待ちください (自作 Wasm runtime に不足している機能を鋭意実装中です)。
 
-2024-07-07 追記: [コミット a312e95](https://github.com/nsfisis/php-waddiwasi/commit/a312e95a95d243943535f94653822d6796d4637f) で、ついに Ruby VM on PHP VM on Wasm VM on PHP を実現した。現時点での動かしかたは README に記載している。
+{editat="2024-07-07" operation="追記"}
+::: edit
+[コミット a312e95](https://github.com/nsfisis/php-waddiwasi/commit/a312e95a95d243943535f94653822d6796d4637f) で、ついに Ruby VM on PHP VM on Wasm VM on PHP を実現した。現時点での動かしかたは README に記載している。
+:::
 
 {#outro}
 # おわりに
diff --git a/vhosts/blog/content/posts/2025-06-14/baba-is-you.dj b/vhosts/blog/content/posts/2025-06-14/baba-is-you.dj
index 8c164a26..5370b94f 100644
--- a/vhosts/blog/content/posts/2025-06-14/baba-is-you.dj
+++ b/vhosts/blog/content/posts/2025-06-14/baba-is-you.dj
@@ -337,9 +337,8 @@ PRISON と DUNGEON で既出のテクニックが肝だが、ちと離れすぎ�
 個人的にこのゲームで一番苦しかったのがここの `TEXT` 変換解である。
 単純な難しさに加え、実績が取れていない原因がこの面だという確信も持てなかったので、解けるかどうかわからない状態で挑み続けることとなり疲弊した。
 
-::: note
-2025-06-15 追記
-
+{editat="2025-06-15" operation="追記"}
+::: edit
 ??? の DO IT YOURSELF 以降を開くにはこの面の `LEVEL` `IS` `TEXT` が必須だと思っていたのだが、どうもそうではないらしい。
 いずれにせよそれを思いつけなかったので同じことか。
 :::
diff --git a/vhosts/blog/nuldoc-src/djot/djot2ndoc.ts b/vhosts/blog/nuldoc-src/djot/djot2ndoc.ts
index fa0365b0..90b1289c 100644
--- a/vhosts/blog/nuldoc-src/djot/djot2ndoc.ts
+++ b/vhosts/blog/nuldoc-src/djot/djot2ndoc.ts
@@ -737,6 +737,16 @@ function processDiv(node: DjotDiv): Element {
     };
   }
 
+  if (node.attributes?.class === "edit") {
+    delete node.attributes.class;
+    return {
+      kind: "element",
+      name: "note",
+      attributes: convertAttributes(node.attributes),
+      children: node.children.map(processBlock),
+    };
+  }
+
   return {
     kind: "element",
     name: "div",
diff --git a/vhosts/blog/nuldoc-src/djot/to_html.ts b/vhosts/blog/nuldoc-src/djot/to_html.ts
index c765cb07..3a6c1e9f 100644
--- a/vhosts/blog/nuldoc-src/djot/to_html.ts
+++ b/vhosts/blog/nuldoc-src/djot/to_html.ts
@@ -199,14 +199,17 @@ function transformNoteElement(doc: Document) {
       return;
     }
 
-    // TODO: 今のセクションレベルに合わせた h* タグにしたい
+    const editatAttr = n.attributes?.get("editat");
+    const operationAttr = n.attributes?.get("operation");
+    const isEditBlock = editatAttr && operationAttr;
+
     const labelElement: Element = {
       kind: "element",
       name: "div",
       attributes: new Map([["class", "admonition-label"]]),
       children: [{
         kind: "text",
-        content: "NOTE",
+        content: isEditBlock ? `${editatAttr} ${operationAttr}` : "NOTE",
         raw: false,
       }],
     };
diff --git a/vhosts/blog/public/posts/2021-10-02/vim-swap-order-of-selected-lines/index.html b/vhosts/blog/public/posts/2021-10-02/vim-swap-order-of-selected-lines/index.html
index 9e44003e..5f9a5784 100644
--- a/vhosts/blog/public/posts/2021-10-02/vim-swap-order-of-selected-lines/index.html
+++ b/vhosts/blog/public/posts/2021-10-02/vim-swap-order-of-selected-lines/index.html
@@ -154,13 +154,13 @@
           </section>
           <section id="section--solution">
             <h2><a href="#section--solution">解決策</a></h2>
-            <div class="admonition">
+            <div class="admonition" editat="2020-09-28" operation="追記">
               <div class="admonition-label">
-                NOTE
+                2020-09-28 追記
               </div>
               <div class="admonition-content">
                 <p>
-                  [2020/9/28追記] より簡潔な方法を見つけたので次節に追記した
+                  より簡潔な方法を見つけたので次節に追記した。
                 </p>
               </div>
             </div>
@@ -210,13 +210,13 @@
           </section>
           <section id="section--solution-revised">
             <h2><a href="#section--solution-revised">解決策 (改訂版)</a></h2>
-            <div class="admonition">
+            <div class="admonition" editat="2020-09-28" operation="追記">
               <div class="admonition-label">
-                NOTE
+                2020-09-28 追記
               </div>
               <div class="admonition-content">
                 <p>
-                  [2020/9/28追記] より簡潔な方法を見つけたため追記する
+                  より簡潔な方法を見つけたため追記する。
                 </p>
               </div>
             </div>
diff --git a/vhosts/blog/public/posts/2022-04-24/term-banner-write-tool-showing-banner-in-terminal/index.html b/vhosts/blog/public/posts/2022-04-24/term-banner-write-tool-showing-banner-in-terminal/index.html
index 94e850eb..5f0cee0a 100644
--- a/vhosts/blog/public/posts/2022-04-24/term-banner-write-tool-showing-banner-in-terminal/index.html
+++ b/vhosts/blog/public/posts/2022-04-24/term-banner-write-tool-showing-banner-in-terminal/index.html
@@ -131,9 +131,16 @@
             <p>
               ゴシック体と明朝体があったが、私の好みで明朝体の方にした。 ただ、ゴシック体の方が見やすい気がするので、フォントを選べるように後ほど拡張するかもしれない。
             </p>
-            <p>
-              2022-04-27 追記: <code>-f</code> オプションで選べるようにした。
-            </p>
+            <div class="admonition" editat="2022-04-27" operation="追記">
+              <div class="admonition-label">
+                2022-04-27 追記
+              </div>
+              <div class="admonition-content">
+                <p>
+                  <code>-f</code> オプションで選べるようにした。
+                </p>
+              </div>
+            </div>
           </section>
           <section id="section--outro">
             <h2><a href="#section--outro">おわりに</a></h2>
diff --git a/vhosts/blog/public/posts/2023-10-02/compile-php-runtime-to-wasm/index.html b/vhosts/blog/public/posts/2023-10-02/compile-php-runtime-to-wasm/index.html
index 6a07e581..c17bc163 100644
--- a/vhosts/blog/public/posts/2023-10-02/compile-php-runtime-to-wasm/index.html
+++ b/vhosts/blog/public/posts/2023-10-02/compile-php-runtime-to-wasm/index.html
@@ -166,15 +166,12 @@
               <p>
                 次に、コードを評価したあとに呼んでいる標準出力と標準エラー出力に対する改行の出力について。 出力バッファから出力させるためだけなら改行を出力させなくとも <code>fflush()</code> だけで事足りると考えたのだが、ないと動かなかったので追加した。 これにより、PHP コードの出力の後ろに余分な改行が追加されてしまう。 改行を出力せずともバッファを消費させる手段をご存知のかたはご教示願いたい。
               </p>
-              <div class="admonition">
+              <div class="admonition" editat="2025-04-23" operation="追記">
                 <div class="admonition-label">
-                  NOTE
+                  2025-04-23 追記
                 </div>
                 <div class="admonition-content">
                   <p>
-                    <strong><strong>2025-04-23 追記</strong></strong>:
-                  </p>
-                  <p>
                     <code>fflush()</code> の前に改行の出力が必要だった理由が判明したので追記する。 これは、<code>index.mjs</code> で標準出力・標準エラー出力へ出力する方法を指定せず、デフォルトの実装に任せているため。 Emscripten のデフォルト実装では、改行コードを出力するまで出力内容がバッファリングされ、<code>fflush()</code> が機能しない。
                   </p>
                   <p>
diff --git a/vhosts/blog/public/posts/2024-03-17/phperkaigi-2024-report/index.html b/vhosts/blog/public/posts/2024-03-17/phperkaigi-2024-report/index.html
index fa5cb169..6870db28 100644
--- a/vhosts/blog/public/posts/2024-03-17/phperkaigi-2024-report/index.html
+++ b/vhosts/blog/public/posts/2024-03-17/phperkaigi-2024-report/index.html
@@ -133,9 +133,16 @@
               <p>
                 P.S. Ask the Speaker で話した、Ruby VM (written in PHP) on PHP VM (compiled to Wasm) on Wasm VM (written in PHP) on PHP というアイデアは「マジ」なので、続報をお待ちください (自作 Wasm runtime に不足している機能を鋭意実装中です)。
               </p>
-              <p>
-                2024-07-07 追記: <a href="https://github.com/nsfisis/php-waddiwasi/commit/a312e95a95d243943535f94653822d6796d4637f" rel="noreferrer" target="_blank">コミット a312e95</a> で、ついに Ruby VM on PHP VM on Wasm VM on PHP を実現した。現時点での動かしかたは README に記載している。
-              </p>
+              <div class="admonition" editat="2024-07-07" operation="追記">
+                <div class="admonition-label">
+                  2024-07-07 追記
+                </div>
+                <div class="admonition-content">
+                  <p>
+                    <a href="https://github.com/nsfisis/php-waddiwasi/commit/a312e95a95d243943535f94653822d6796d4637f" rel="noreferrer" target="_blank">コミット a312e95</a> で、ついに Ruby VM on PHP VM on Wasm VM on PHP を実現した。現時点での動かしかたは README に記載している。
+                  </p>
+                </div>
+              </div>
             </section>
           </section>
           <section id="section--outro">
diff --git a/vhosts/blog/public/posts/2025-06-14/baba-is-you/index.html b/vhosts/blog/public/posts/2025-06-14/baba-is-you/index.html
index 2abf535a..aaeb52f7 100644
--- a/vhosts/blog/public/posts/2025-06-14/baba-is-you/index.html
+++ b/vhosts/blog/public/posts/2025-06-14/baba-is-you/index.html
@@ -444,15 +444,12 @@
                   <p>
                     普通に解くだけなら大したことのない面だが、問題はこれの <code>LEVEL</code> <code>IS</code> <code>TEXT</code> 解である。 出現順に書いているのでここに置いたが、解いたのはもっと後、META の後半に差しかかった頃になる。 ??? コンプリートの実績が取れていないことに気付き、残っているとすればここの <code>LEVEL</code> <code>IS</code> <code>TEXT</code> しかないと考えたまではよかったが、そこからが大変だった。 個人的にこのゲームで一番苦しかったのがここの <code>TEXT</code> 変換解である。 単純な難しさに加え、実績が取れていない原因がこの面だという確信も持てなかったので、解けるかどうかわからない状態で挑み続けることとなり疲弊した。
                   </p>
-                  <div class="admonition">
+                  <div class="admonition" editat="2025-06-15" operation="追記">
                     <div class="admonition-label">
-                      NOTE
+                      2025-06-15 追記
                     </div>
                     <div class="admonition-content">
                       <p>
-                        2025-06-15 追記
-                      </p>
-                      <p>
                         ??? の DO IT YOURSELF 以降を開くにはこの面の <code>LEVEL</code> <code>IS</code> <code>TEXT</code> が必須だと思っていたのだが、どうもそうではないらしい。 いずれにせよそれを思いつけなかったので同じことか。
                       </p>
                     </div>