ふるつき

v(*'='*)v かに

vimのcolorschemeからはてなブログのシンタックスハイライトを作る

vimのcolorschemeには theoremoon/cryptohack-color.vim というやつを使っている。これは cryptohack/sublime-theme を変換したやつで、変換の感じがちょっと微妙で完全に同じハイライトにはならないものの、色の感じは気に入っている。

github.com

github.com

気に入っているので、はてなブログ上でのソースコードの表示も、全く同じではないにせよ似たような感じになっていると嬉しい。

適当に動作を見ると、はてなブログでのシンタックスハイライトは、なんか .synIdentifier みたいなクラスがつく感じで、これにCSSでスタイルが当てられている。この Identifier とかの部分はvimのhighlight groupの名前と大体同じなので、vimのcolorschemeからCSSを生成して、それをはてなブログのデザインCSSに設定すればいい感じになるのではないか

というわけでやってみた。CSS生成くんはこんな感じ。適当なファイルに書き込んで開いて、:source % してから :call GenerateColorschemeCSS() をやってメッセージウィンドウに出てきたやつをコピーして貼り付ける

function! GenerateColorschemeCSS()
    let groups = ["Special", "Type", "Comment", "PreProc", "Identifier", "Constant", "Statement"]
    for g in groups
         let color = s:returnHighlightTerm(g, "guifg")
         echo ".syn" . g . " { color: " . color . " !important; }"
    endfor

    echo ".entry-content pre {"
    echo "background: " . s:returnHighlightTerm("Normal", "guibg") . " !important;"
    echo "color: " . s:returnHighlightTerm("Normal", "guifg") . " !important;"
    echo "}"
endfunction

" https://vi.stackexchange.com/questions/12293/read-values-from-a-highlight-group
function! s:returnHighlightTerm(group, term)
   " Store output of group to variable
   let output = execute('hi ' . a:group)

   if matchstr(output, "cleared") == "cleared"
       return s:returnHighlightTerm("Normal", a:term)
   endif

   let link = matchstr(output, "links to .*")
   if link != ""
       return s:returnHighlightTerm(link[9:], a:term)
   endif

   return matchstr(output, a:term.'=\zs\S*')
endfunction

vim上での表示と比較するとまあまあ微妙だけど雰囲気はあるので良いか。

vim / はてなブログ

文字列とかがハイライトされてないのが結構悲しいけど、はてなブログ上ではそこには.synConstant クラスが当たっていて、 cryptohack-color.vim ではConstant highlight groupへのハイライトは定義されていないのでNormalにフォールバックされているのでこうなる。

じゃあvim上だと文字列はどういうhighlight groupになっているかというと、vimString というやつだった。結局これはString というhighlight groupにリンクされている。

どうしてはてなブログ上ではsynString とかではなくてsynConstant クラスが当たっているのか、あるいはどうして私のvimではConstant highlight groupになっていないのか、というのは調べてない。

見返していると文字列が文字列っぽくハイライトされていないのは残念な感じがしてきたので今度気が向いたら調べて直そう。なんかミスってるんだろうな…