読者です 読者をやめる 読者になる 読者になる

はてダラ使ってシンタックスハイライト自動化

最近はEmacs+はてダラ+Yahoo!¥¸¥ª¥·¥Æ¥£¡¼¥ºでこの日記を書いてる。で、前にも書いたんだけどやっぱダイアリーでもシンタックスハイライト使いたいなぁと思っていたところ、「続・はてなダイアリーの書き方 はてダラ+秀丸+GeSHi」というエントリーでPHPスクリプトをはてダラのフィルタにして色分けするというのを偶然見付け、VimColor使えばグループとほぼ同じことできるんじゃねと思い書いてみた。

hwcolor.pl

#!/usr/bin/perl
use strict;
use warnings;

use Text::VimColor;

open my $FH, '<', $ARGV[0] or die $!;
my $diary_text = join q//, <$FH>;

$diary_text =~ s/^>\|(\w*)\|\n(.*?)^\|\|<\n/">|\n".colorize_code($1, $2)."|<\n"/segm;

print $diary_text;

sub colorize_code {
    my ( $filetype, $code ) = @_;
    my $syntax = Text::VimColor->new(
        filetype => $filetype,
        string   => $code,
    );
    $syntax->html;
}

はてダラのconfig.txt

id:KGA
password:foo
cookie:~/path/to/cookie.txt
filter:perl ~/path/to/hwcolor.pl %s

はてダラの日記ファイルで、グループと同じようにスーパーpre記法を>|perl|等と指定するとそのpre部分をVimColorに通してポストできる。言語指定していない場合はshebang行を見て良きに計らってくれる(VimColorが)。文字コードには触ってないので日本語が入ってると化けるかも。一応僕の環境(日記ファイルも上のスクリプトもUTF-8)では平気。

これだけだとシンタックスをマークアップするだけなのでCSSで色を指定すると見事シンタックスがハイライト!

pre a.keyword {
 border: none;
 color: inherit;
}
.synSpecial { color: #c000c0; }
.synType { color: #008000; }
.synComment { color: #0000c0; }
.synPreProc { color: #c000c0; }
.synIdentifier { color: #008080; }
.synConstant { color: #c00000; }
.synStatement { color: #804000; }

が、ここからが問題。ユーザ側でマークアップして色付するのでどうしてもスーパーpre記法じゃなくてpre記法を使わざるをえない。でもそうすると、例えば

Math.floor((now.getHours() * 60 + now.getMinutes()) / 30 - 7);

とかなってると記法が展開されちゃう。この場合は脚注記法になる。キーワードの見た目とかは上で書いたCSSでごまかせるけど記法を全部無効にするのは面倒そう。というか自動リンク記法は[]で囲めば無効にできるけど、脚注記法とかの入力支援記法は無効にできるのか謎。結局常用はしないことにした。

一応使ってみた例

っていうのを一昨日の日記で「あとで書く」って書いたはいいが、絶妙なタイミングで「はてなダイアリーでもソースコードのハイライト表示をする」というエントリーにて僕のやつなんかより便利で汎用的なやつが公開されてた。がびん。