Mojikという、ウェブにおける和文の文字組みをコントロールするためのJavaScriptライブラリを公開しました。いまのところ、以下のパターンでの「アキ」を調整できます。
- 連続する約物のアキ
- 行頭の始め括弧のアキ
- 欧文間のアキ
Mojik.compose()メソッドの引数にCSSセレクターを渡すと、マッチする要素から上記に該当する箇所を検出し、それぞれマークアップが挿入されるので、CSSでアキ量を調整します。以下のページに実際に動いているデモがあるので、ぜひ見てみてください。
ウェブページの本文やタイトルなどで使われることを想定しているので、HTMLタグがあっても問題なく動作することは必須条件でした。基本的に、まずHTML文字列をテキストとタグに分けて、正規表現でテキストの検索を繰り返す、という方法を採っています。ここらへんはkotarok/jQuery.waokonなどを参考にさせてもらいました。
そのほかとくに面倒だったのは、行頭始め括弧の検出です。括弧の位置を親要素と比較して、左端にあれば行頭と見なし左マージンに負数を指定する、というところまではいいのですが、マージンを調整した結果、場合によっては始め括弧が前の行の行末に収まってしまうことがあります。そこで、括弧の前に空のspan要素を挿入し、括弧が行頭に来たときにはCSSの擬似要素で改行することで括弧を行頭に固定する、ということをしています。そしてもちろん、この処理はウィンドウのリサイズごとに再計算されます。
これを本格的に作り始めたのは、YakuLigaと約猫に触発されたことがきっかけでした。言うまでもなく、こういったことはブラウザーがうまいことやってくれればそれに越したことはないわけですが、それでもいまあるもので可能な限りなんとかしてみよう、という試みとして作ってみました。
バージョンはまだ0.1で、アクセシビリティやパフォーマンスのテストもできてないし、デフォルトのアキ量が適切かどうかなど自信のないところもあります。機能ももうちょっと充実させたくて、とくにオプションはうまいこと指定できるようにしたいです。というわけで、issueやpull requestは大歓迎です。お待ちしています。