単にDOMContentLoaded
でGoogle Code PrettifyのprettyPrint()
を呼んでただけだったのをゴニョゴニョするようにした。将来性とマークアップのしやすさのためにpre
要素にprettyprint
というクラスを指定しないように方針変更したので、それに合わせてcode[class*=language-]
な要素を探してその親がpre
だったらprettyprint
を追加し、その後でprettyPrint()
を走らせるという感じ。一応サポートしている言語もチェックしたりとかもするようにした。Rainbow移行への布石。
同じブラウザーかつ同じバージョンならdocument.querySelectorAll()
におけるセレクターとCSSにおけるセレクターは完全にサポート状況が同じとみなして良いのかわからない。頑張ってググりたい。
language-foo
をクラスに持つcode
要素を表現するセレクターはcode[class|=language]
とかでいけるかと思ったけど、そういう使い方するものではなかったしダメだった。空白区切りで複数の値を取れるプロパティーではそれぞれの値の先頭にマッチするようなセレクターが欲しい。いやいらないです。
サポートしている言語かそうでないかはごく簡単にチェック。
var languages = ["bsh", "c", "cc", "cpp", "cs", "csh", "cyc", "cv", "htm",
"html", "java", "js", "m", "mxml", "perl", "pl", "pm", "py", "rb", "sh",
"xhtml", "xml", "xsl", "css", "scss", "vim"],
reLanguage = new RegExp("\\blanguage-(" + languages.join("|") + ")\\b");
追加しづらそう……。Google Code PrettifyのlangHandlerRegistry
を参照するかlangHandlerForExtension()
パクった方が良さそう。むしろ頑張ってハイライトしようとするフォールバックの部分なくしちゃえばいいのかなー。
視認しつつマークアップの修正をしなければならなかったのでVimのキーボードマクロでだいたい誤魔化した。普段はq
に誤爆するとうっとうしいけど、使う時はコマンドラインにでるrecording
というメッセージがすごく可愛く見える。多分結構な数のエントリーでおかしくなってそう。気づいたら直す。
あとRainbowに僕の書いた<code class="language-php">
とかに対応するコードが取り込まれたのでdata-language
へ書きなおさなくても使えるようになった。作者のさじ加減で消えかねないのでマークアップにこだわりがないなら素直に併記した方が良さそう。