iPadでソースコードを読むためのサイトをつくった

追記:
ダブルクォート3つで囲ったStringのリテラルの部分が崩れるので、最近Scalaだけこれを使って処理変えました
https://github.com/xuwei-k/syntax-highlight/commit/51a775c4bbbefb2af9a018dd2d667ad4986444c1
https://github.com/xuwei-k/syntax-highlight/commit/9744d0cef4d155a39f22e435b5eeaae11a3f62c7
しかし、今度はちょっとコメントの部分の解釈がおかしい(´・ω・`)
このあたりがあやしいような


最初に作ったの、もう1年以上前なんですけどね(´・ω・`)ずっと一人で地味に便利に使っていましたが、なんとなく今更紹介をかいてみるという

http://syntax-highlight.appspot.com/
https://github.com/xuwei-k/syntax-highlight/
iPadってなぜか、自分が知ってる限り現状では、使いやすいgit(hub)クライアントなどがないのでちょっとでもソースコード読みやすくするために、自分で google app engine でつくりました。ところで、iPadって書きましたが、べつにhtmlが開けるものならAndroidタブレットでもなんでもいいです。

簡単に内部の仕組みを説明すると

  1. ユーザーが入力した、ソースコードのzipのURLを受け取る
  2. GAEのサーバー側でダウンロード
  3. それをサーバー内部で解凍
  4. shjs http://shjs.sourceforge.net/ というシンタックスハイライトのためのJavaScriptライブラリを使って、(可能な拡張子ならば)シンタックスハイライトされたhtmlに変換*1 *2
  5. それを再びzipに圧縮する
  6. httpのレスポンスとして返す

という流れです。もちろんScalaで作ってます。zipでソースコードが固まっていれば、githubだろうが、google code だろうが、どこかの知らないサイトのURLだろうがなんでもよいです。対応してる拡張子はこのあたりのソースコード読んでください。あと、もとのzipのサイズが大きすぎると、GAEの30秒(?)の制限に引っかかって、エラーになります

そして、ソースコードのzipのURLを入力の部分ですが、実は自分でzipのファイルをuploadするっていう機能もあります。

あと、httpのレスポンスとして返すというところは、zipファイルを添付したメールとして送信する機能もあります。で、これがなぜかzipの添付ができないという微妙な制限がかけられていたので、拡張子変えて送るという姑息な技を使っています、メールの添付ファイルrenameして解凍してください

自分は主にこれ使ってiPadのgoodreader使ってソースコード読んでます。

あと、結局主に利用するのがgithubなので、ちょっとだけ便利にしたbookmarkletをつくって、iPadsafariに登録していたりします。

https://github.com/xuwei-k/syntax-highlight/blob/master/bookmarklet1.js
https://github.com/xuwei-k/syntax-highlight/blob/master/bookmarklet1mini.js
https://github.com/xuwei-k/syntax-highlight/blob/master/bookmarklet2.js
https://github.com/xuwei-k/syntax-highlight/blob/master/bookmarklet2mini.js

自分のiPadこんな感じ↓


そして、あとそれに関連して、JavaScriptgithubAPI叩いて、watchしているrepositoryの一覧表示して、ついでにそのdownload用のリンクを追加したものをこないだ作りました

http://xuwei-k.github.com/watching_repositories

https://github.com/xuwei-k/xuwei-k.github.com/blob/79dc57ac5dff628538e0b698bc4cf3ff1dba42f7/watching_repositories.html

このあたり で、URL ? 以降をgithubのidとして、githubAPIをたたいているので、たとえば

http://xuwei-k.github.com/watching_repositories?odersky

って入力すれば、自分や他の人がwatchしている人のリポジトリ一覧とそのダウンロードのリンクが表示されるようになります。

フロントのhtmlが全くなんの工夫もなくて酷いとか、ソースコードもかなり昔に作ったので色々汚かったりします(・ω・`)なんか質問とかあれば、 @xuwei_k でも、このblogのコメント欄でも、githubのissueでもいいので聞いてください(質問されたからといって、その質問や要望に答えられるかは別ですが)

っていうか誰かforkしてもっと使いやすい素敵な感じにしてくれないかな・・・。今思えば、REST APIとして綺麗に設計すればよかったのだけれども、formからPOST request送るようなhtmlの画面を最初につくって、bookmarkletなどもそれを利用しているので、なんだかbookmarkletが異様に長くなったりしてェ・・・(´・ω・`)

*1: ついでに行番号を雑にくっつけている

*2: このとき、明らかに大きすぎるファイルとかバイナリっぽいファイルはフィルターして勝手に除いてしまっている