デプロイ

Dockerでデプロイします。設定はmp4ファイルが置いてあるディレクトリパスを指定するだけです。
ログは必要なければ設定しなくてもOKです。その他、ポート番号などはお好きに変更してください。

起動したら、http://hostname:3000/ へアクセスします。

docker pull juntaki/flickake
docker run -d --name=flickake -p 3000:3000 \
           -e SECRET_KEY_BASE=YOUR_SECRET \
           -v /path/to/movie_library:/app/files juntaki/flickake \
           -v /path/to/log:/app/log

ライブラリのスキャン

ナビゲーションバーから"Scan"を押すか、下記のコマンドを定期実行すると良いです。

docker exec flickake rails movies:scan

作ったときにはまった場所

HTML5 videoのロード

videoタグのはなし - クラウドワークスエンジニアブログ
 570755 - 206 Partial content is ignored and mozilla does not seek for additional video content

ChromeやFirefoxはビデオのsourceに対して、長さを指定しない(range=0-)206 Partialリクエストを送ってきます。サーバ側で応答を短い長さで切ってしまうと（RFC的にはOK）、、Chromeでは問題ないのに、Firefoxは次のリクエストを出してくれなくなります。動画をシークすることを考えると、ある程度細切れにしたほうがクライアントのレスポンスは良さそうですが・・・。
と、色々実験していたら256MB程度の大きさで返すと、Firefoxも受け取ってくれるようです。謎です。

動画だけはnginxなどでホストしておくと負荷が少ないのかもしれませんが、レスポンスの中身を細かくコントロールしたかったのと、シンプルな構成を目指していたので今回はRailsで動画ファイルをメモリ上に読んでレスポンスを組み立てています。

Fullscreen API

javascript - How to detect when a page exits fullscreen? - Stack Overflow

これはブラウザごとにprefixが必要なAPIなので、シンプルに書けない部分です。一般的には状態変更をfullscreenchange相当のEventで取得し、その時のfullscreenElementの有無で現在の状態を取得する、という方法が良さそうです。（それ以外の方法ではfullscreenをESCキーで抜ける遷移にhookできない）
Flickakeではコントローラを表示するときに毎回fullscreenElementの有無を調べてます。

Vue.js + Rails

RailsのTurbolinksとVue.jsを共存させる方法 - Qiita

RailsのTurbolinksもDOMを書き換えるため、相性が良くないようです。戻るボタンを押すとレイアウトが崩れる現象が起きてハマりました。大したページもないのでTurbolinksをOFFにしてしまっています。

Globalなキーイベントをとる

How to add @keyup globally with VUE?
イベントハンドリング - Vue.js

ふつうにjavascriptでwindows.addEventListenerするのが良いようです。
クリックと同じようにキー入力が取れる感じでVueのガイドに書いてありますが、キーイベントはinput要素などフォーカスが当たる要素にしか発生しないようです。