source-hightはプログラムのソースコードを色付けしてカラフルに、ハイライト表示したHTMLを作ることが出来る。
ソースコードの色付けは、専用のフォーマットでしかできないと思ってたら、これで一瞬できるのでなぜ今まで知らなかったと悔しい思いをしている。
こんなに簡単に整形できるのです。
インストール
brew install source-highlight
使い方
source-highlight some.html
出力・入力ファイルの指定
source-highlight -i some.html out.html.html
htmlをハイライトで出した例。
HTMLファイルをハイライトで表示してみた。出てくるハイライトHTMLは次のような感じ。
<!-- Generator: GNU source-highlight 3.1.5 by Lorenzo Bettini http://www.lorenzobettini.it http://www.gnu.org/software/src-highlite --> <pre><tt><b><font color="#0000FF"><html></font></b> <b><font color="#0000FF"><head></font></b> <b><font color="#0000FF"><title></font></b>webkit <b><font color="#0000FF"></title></font></b> <b><font color="#0000FF"><script</font></b> <font color="#009900">type</font><font color="#990000">=</font><font color="#FF0000">"text/javascript"</font> <font color="#009900">src</font><font color="#990000">=</font><font color="#FF0000">"jquery-1.7.2.min.js"</font><b><font color="#0000FF">></script></font></b> <b><font color="#0000FF"><script</font></b> <font color="#009900">type</font><font color="#990000">=</font><font color="#FF0000">"text/javascript"</font><b><font color="#0000FF">></font></b> $<font color="#990000">(</font>document<font color="#990000">).</font><b><font color="#000000">ready</font></b><font color="#990000">(</font><b><font color="#0000FF">function</font></b><font color="#990000">()</font><font color="#FF0000">{</font> <b><font color="#0000FF">var</font></b> f<font color="#990000">=</font><font color="#993399">0</font><font color="#990000">;</font>
これをブラウザで見ると以下のように見える。
<html>
<head>
<title>webkit </title>
<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
var f=0;
$("#main").dblclick(function(){
if( (f++%2) == 0 ){
$("#main").css("top",200);
$("#main").css("opacity",0.2);
}else{
$("#main").css("top",0);
$("#main").css("opacity",1);}
})
})
</script>
<style type="text/css">
body{
margin: 0 0 0 0;
position:relative;
}
#main{
width: 640px;
margin: auto;
outline: 1px solid;
height: 360px;
position:relative;
z-index:0;
background-image: url("./vlcsnap-2012-05-04-01h34m24s14.png");
background-size: 640px 360px;
opacity: 1;
-webkit-transition-property: all;
-webkit-transition-duration: 400ms;
/*-webkit-transition-timing-function: linear;*/
-webkit-transition-timing-function: ease-in-out;
}
#size{
outline: 1px solid rgb(100,100,200);
background-color: rgb(100,100,200);
color: white;
position: absolute;
left: 540px;
top: 0px;
width: 100px;
z-index: 1;
}</style>
</head>
<body><div id="main">
<div id="size">w640xh360</div>
これはテストです。<br/>
これはテストです。<br/>
これはテストです。<br/>
これはテストです。<br/>
これはテストです。<br/>
これはテストです。<br/>
これはテストです。<br/>
これはテストです。<br/>
これはテストです。<br/>
これはテストです。<br/>
これはテストです。<br/>
これはテストです。<br/>
これはテストです。<br/>
</div>
</body>
</html>
フォントタグとか使っててダサいと思うけど、このへんは細かく調整が可能らしい。でもいまはこれで十分なので細かい設定には突っ込まない。
使い方もシンプルだしこれでいい。
追記 HTMLのFONTタグをSPAN Styleに変える。
フォントタグとか気持ち悪いのでXHTMLを指定すればいい。
source-highlight --out-format xhtml -i sample.php -o out.html
対応出力
GNU Source-highlight 3.1.6が出力できるのは次のようなファイルに出せる。
HTML
XHTML
LATEX
MediaWiki (new)
ODF (new)
TEXINFO
ANSI color escape sequences (you can use this feature with less)
DocBook
対応ソースコード。
対応しているソースは色々とにかくいっぱい。たくさんあるので大抵は需要を満たせるんじゃないかと思います。
Ada
Asm
Applescript
Awk
Autoconf files
Bat
Bib
Bison
C/C++
C#
CakePhp templates
Clipper
Cobol
Configuration files (generic)
Caml
Changelog
Css
D
Diff
Emacs Lisp
Erlang
errors (compiler output)
Flex
Fortran
GLSL
Haskell
Haskell literate programming
Haxe
Html
ini files
Java
Javalog
Javascript
KDE desktop files
Latex
Ldap files
Lisp
Logtalk
Log files
lsm files (Linux Software Map)
Lua
Makefile
Manifest
M4
ML
Opa
Oz
Pascal
Perl
pkg-config files
PHP
Po
Postscript
Prolog
Properties files
Protobuf (Google's Protocol Buffers)
Python
RPM Spec files
Ruby
Scala
Scheme
Shell
S-Lang
Sql
T/Foswiki TML markup (new)
Tcl
Texinfo
UPC (unified parallel C)
Vala
VBscript
XML
XOrg conf files