モードを切り替えても文書は1つ

Markdownエディターは通常、画面を2つに分けます。左側で書き、右側で結果を確認します。同じ文書を2回描画するため、スクロールと選択位置を常に合わせなければなりません。

moteは違う作り方をしました。文書は1つだけにして、見方だけを切り替えます。

1つの文書、3つの画面

moteには3つのモードがあります。

• ライブ（Live）：記号を隠し、書式をその場で表示します。
• ソース（Source）：ファイルに保存されている内容をそのまま表示します。
• リーディング（Reading）：Markdown記号を完全に取り除いた結果を表示します。

コアは文書を読み込み、デコレーションの一覧を作ります。種類は3つだけです。どの範囲にスタイルを適用するか、どの範囲を隠すか、どの範囲をウィジェットに置き換えて描画するかです。

3つのモードは、この一覧に異なるフィルターを適用した結果です。モードを切り替えても、文書を開き直したり解析し直したりはしません。ブロックツリーもインラインの結果もそのままに、フィルターだけが切り替わります。

予算にもそのように記されています。モードの切り替えは、1フレームと切り替えアニメーションの間に完了しなければなりません。再パースが入れば違反です。切り替えコストは文書のサイズに比例しないため、大きな文書も同じ速度で切り替わります。

キャレットと選択範囲もそのままです。ソースで入力していた文字はライブでも同じ位置にあり、ライブで選択した文はソースでもそのまま選択されています。

文書の別のコピーへ移動するのではなく、同じ文書を異なる視点で見るわけです。

書いて、確認して、読みます

文章を書くときはライブモードが便利です。画面には内容だけが残り、Markdown記号はキャレットが触れたときに現れます。表や数式、画像はその場でウィジェットとして描画されます。グリッドを見ながらセルの中を修正できます。

記号まで正確に確認する必要があるときは、ソースモードを使います。表のパイプがずれていないか、コードブロックが閉じられているか、行末に空白があるかを確認するのに適しています。

リーディングモードは、最終結果を見る画面です。記号を隠すだけでなく、画面から完全に取り除きます。印刷とPDFもこの画面を基準に作成します。編集はできませんが、選択とコピーは可能で、リンクも開けます。

リーディングモードを作る過程は簡単ではありませんでした。記号を取り除くと、画面上の位置とファイル内の位置が異なるようになったからです。検索結果が横にずれ、クリックした場所とキャレットの位置も食い違いました。

現在は、コアが取り除かれた文字の位置と長さを一緒に記録します。画面上でクリックした位置を、ファイル内の正確な位置へ戻せます。

読んでいた場所ですぐに切り替えます

ヘッダーで目的のモードを押すか、Ctrl+Shift+1、2、3を使えば切り替えられます。

切り替えても、画面の先頭行とキャレットの位置は維持されます。クロスフェードは160msの有限アニメーションなので、終了後に予約は残りません。新しいウィンドウをどのモードで開くかは、設定の編集タブで選べます。

ショートカットでは、小さな試行錯誤がありました。しばらくの間、案内にはCtrl+1/2/3がモード切り替えだと記載されていましたが、実際には見出しを作るショートカットでした。ウィンドウがキー入力を先に受け取るため、モード切り替えのコードは実行されませんでした。

現在は役割を明確に分けています。Ctrl+Shift+1/2/3はモード切り替え、Ctrl+1からCtrl+6までは見出しです。コマンドパレットとショートカット一覧、サイトの文書もすべて同じ内容に修正しました。

フォーカスモードは画面の上にそっと重ねます

F8を押すと、キャレットがあるブロックだけがくっきりと表示されます。ほかの行は、インクのアルファだけが32%に下がります。

色が変わるだけで、文字の位置は動きません。ぼかし効果やアニメーションもないため、段落間を移動するときに画面全体を再計算する必要がありません。

フォーカスモードは4つ目のモードではありません。ライブ画面の上に重ねるオプションなので、有効にしたまま別のモードへ移動できます。

画面を2つに分けない理由

moteには分割プレビューがありません。

同じ文書を2回描画すると、スクロールを合わせ、選択を移し、2つの画面の状態を管理しなければなりません。moteは最初から、その問題を作らないことにしました。

元に戻す履歴も、選択も、スクロールも1つです。

モードが3つあるのは、文書が3つあるからではありません。同じ文書を見る必要がある場面が3つあるからです。