Hatena::Groupsubtech

冬通りに消え行く制服ガールは✖夢物語にリアルを求めない。

Apr 13, 2012 (Fri)

FlashAir で最新の画像表示するやつ、1ファイルコピーしたらいけるようにした 23:30 はてなブックマーク - FlashAir で最新の画像表示するやつ、1ファイルコピーしたらいけるようにした - 冬通りに消え行く制服ガールは✖夢物語にリアルを求めない。

だけコピーしたらうごくようになった。

Rakefile ファイル書いて結合するようにした。

Apr 05, 2012 (Thu)

FlashAir の最新ファイルを表示するやつ 23:50 はてなブックマーク - FlashAir の最新ファイルを表示するやつ - 冬通りに消え行く制服ガールは✖夢物語にリアルを求めない。

バグをとったり高速化したりしてある程度安定していい感じになった。

サムネを表示するためにいちいち FlashAir の thumbnail.cgi というのを叩いているのが不安なので、localStorage にキャッシュするようにした。この際、サムネ画像は 30kb 前後あって大きすぎるので、canvas で一旦縮小し (この際、少し画像周辺をカットすることで中央付近を拡大してる)、toDataURL('image/jpeg') で 5kb 前後までサイズを落としてる。

しかし Android 2.x 系だと toDataURL() が全く使えないので、JavaScript JPEG Encoder を使って toDataURL を実装しなおしている。速度でるのか? と思ったけど、デカい画像というわけでもないので、気にするほどでもなかった。

キャッシュは LRU で勝手に消えていって欲しいので、lscache というのを使ってみた。memcached と同じ感じなので簡単です。

あとロード自体も前よりもうちょっと工夫して、画面サイズを考慮し、端数が出ないように調整しながらロードするようにしてある (このほうが心理的に高速に感じるっぽい)。つまり iPhone の場合、横に 3 つしか画像が入らないので、1つ画像をロード、2つ画像をロード (ここで横が揃う)、3つ画像をロード (揃ったまま)、6つ画像をロード (揃ったまま)、6つ画像をロード…… とロードしていく。画面が埋まるまでロードしたら一旦ロードを止め、スクロールするまで待つようにしてある (autopgerize 的な)。

iPad とかでも一覧性を保ってほしいので頑張ってリキッドレイアウトにしてある。うまくおさまるようにレイアウトをJSで調整している。また、window.devicePixelRate によってサムネのサイズを調整しているので、Retina とかでも汚い感じにならないつもり (検証してないけど)。

Mar 30, 2012 (Fri)

FlashAirHTTPD をエミュレーションするスクリプト 01:33 はてなブックマーク - FlashAir の HTTPD をエミュレーションするスクリプト - 冬通りに消え行く制服ガールは✖夢物語にリアルを求めない。

FlashAir に搭載されている HTTPD をエミュレーションする Plack::App::Emulate::FlashAir というのを書いた。SD カードマウントして書きかえて実機に直接アクセスするでもいいんだけど、それだと、書きこみで待たされたり、接続している間ネットができなかったりする。

機能は以下の通り

  • ./sdcard/ を sdcard のルートディレクトリとする
  • List.htm (コピーするのはアレっぽいので、付属のは自分で書いたやつ) によるディレクトリインデックス
  • thumnail.cgi によるサムネイル画像取得 (実機と同じく exif の ThumbnailImage を展開しているだけ)
  • command.cgi のダミーレスポンス
  • config.cgi のダミーレスポンス

List.htm をリライト (デザインかえたいとか) するとか、別途機能をちょっとつけたいときのデバッグに便利だと思う。


あと、SDカード内のファイルを最新順に表示するページをつくった。

FlashAir のカード内のどっかにおいて、アクセスしたら動くとおもう。iPhoneAndroid でまぁまぁいい感じになるように調整した。

スポンサード リンク

書いてる人

cho45 (佐藤広央) (www.lowreal.net)

Perl, JavaScript, Ruby, HTML, CSS, Web etc


スポンサード リンク