Trac で動画を再生する

Posted 2014年11月13日 by もりもと & filed under 開発.

UI のバグ報告などで、複雑な再現手順やちょっと気になるといった操作感を文章で伝えるのは難しいものです。そんなとき、スクリーンキャストを録画して、Trac 上で再生できれば便利ですね。

Trac Hacks を調べたところ、MovieMacro というプラグインがあったのでそれを紹介します。このプラグインは、Trac のチケットや wiki に動画共有サイトのプレイヤーを埋め込んだり、添付した動画ファイルを再生したりするためのマクロ (wiki 記法) を提供します。PyPI からもインストールできます。

https://pypi.python.org/pypi/TracMovieMacro

バージョン 0.3 の時点では、以下の動画共有サイトからプレイヤーを埋め込めます。

例えば、YouTube の動画を埋め込むときは以下のように記述します。

[[Movie(http://www.youtube.com/watch?v=9dfWzp7rYR4,style=width: 320px; height: 240px)]]

ただ Trac に外部の動画共有サイトにある動画を埋め込むのは、社内の利用だとあまり一般的ではないかもしれません。

さらに、添付ファイルを再生するのに Flowplayer というプレイヤーを使います。Flowplayer は商用サポートも提供しているメディアプレイヤーの老舗の1つです。商用ライセンスもありますが、GPL ベースのライセンスでも利用できます。

チケットや wiki に添付されたファイルなら単純にファイル名のみを記述するだけで使えます。

[[Movie(filename.webm)]]

いろいろパラメーターを渡せるようにもなっているので詳細は Trac Hacks の MovieMacro のドキュメントを参照してください。よく使いそうな機能としては、右上のアイコンでフルスクリーン化したり、shift + ←→で再生速度を変えたりもできます。

対応フォーマットは以下になります。

mp4 (h264 encoded)
webm
flv

スマートデバイスも html5 で再生できるんじゃないかと思っていましたが、いま手元にある iPhone5S で試したら再生できませんでした。スマートデバイス対応は不十分のようにみえます。

同僚によると、ブラウザ操作画面を録画するツールとして Screencastify (Screen Video Recorder) という Chrome 拡張が使いやすいようです。コンテナーフォーマットは WebM 形式で保存され、10秒ぐらいの操作を録画するとファイルサイズが1MiBぐらいになるそうです。Chrome や Firefox であればそのまま再生できますが、IE の場合は別途 WebM プラグイン (IE9+) をインストールする必要があります。