Raspberry Pi Zero W 見守りカメラの画像をタブレットで見る

前回の「Raspberry Pi Zero W を見守りカメラ用に設定する」で玄関に動くものを検知したら写真を撮ってファイルサーバーに保存するようにできました。

妻はあまりパソコンを使わない(妻用のマシンもない)ため、妻がよく使う iPad(3rd) で撮影した画像を見られるようにすべく Node.js で簡単なスライドショーを作りました。

前回の設定の通り、撮影された画像は年月日名のディレクトリを作成してその中に時分秒他.jpgというファイル名で保存されます。
トップページにアクセスすると年月日ディレクトリをリスト表示し、その日付をタップ(クリック)すると時分秒他.jpgがリスト表示され、JPEG をタップすると画像を全体表示させればなんとかなります。

結果、超絶シンプルで味気ないものが出来上がりました。
Node.js で express, viewerjs, request を使っています。

もうデザインセンスのかけらもありませんが実現しようと思った内容はそれなりに実現できました。

Node.js を書いていて最初に気づいた失敗が年月日ディレクトリ内の JPEG ファイルが300ファイル前後になってしまい、それぞれの日の画像全部をリスト表示するとブラウザが落ちるということです。
仕方ないので1ページに表示する画像数を制限して複数ページを表示するようにしました。縮小版を作って表示しているわけではないのでこうなっても仕方なしです。
最初 express-pagination を使おうとしたのですが、割と最初の方で躓いてしまい。自分で適当なモジュールを書いてあります。

さらにスライドショーとして使おうとした viewerjs が iPad(3rd) ではピンチ操作しても拡大・縮小できません。これは「まぁ、いっか…」で済ませました。
そもそもほとんどの場合縮小版で内容が確認できるので画像を全体表示させることはあまりありません。その上で拡大しなければならないことはまずないっぽいです。必要な場合パソコンで見ますが、viewerjs が動いてくれる世代の iPad に買い換えるか、iPad(3rd) で動くパッケージに切り替えるかした方がよさそうです。

最後に(?)ある日を全部見たら「この日は見た」ボタンをタップしてもらうと Slack に「～を見ました」と投稿する機能を付けました。
Slack でこの投稿を見たらファイルサーバーにアクセスして当該年月日を手動で削除します。fs モジュールを呼んでいるのでわざわざ Slack に投稿しなくても unlink を使う方がいいかもしれませんが、確認ダイアログを出すのが面倒だったので…。

カッコ良くて機能的なコードをすぐ書ける人がうらやましいのう…。