[Firefox OS][WebAPI]近接センサの使い方

 藪下@薄い本とか勉強会資料とか書き物ばっかりしてる気がする。です。

 前回は環境光センサについて書きました。今回は近接センサについて見ていきます。
 環境光センサの時に物体からの相対位置を計算できるかもしれないと書きましたが、その意味では今回のAPIが本来の大本命です。後述する通り残念な動きになりますが。。。

近接センサ

 近接センサはデバイスと他の物体がどれほど近づいたかを検知するセンサです。
携帯電話では通話時に顔とデバイスの近さを検出して消灯することで省電力化する用途に使われます。
 Firefox OSでは近接センサの値を取得することもできます。近接センサの値を取得するにはuserproximityあるいはdeviceproximityイベントのハンドラを登録します。

イベントの登録

 近接センサAPIはwindowオブジェクトに属します。なのでイベントハンドラをaddEventListenerで登録する場合はwindow.addEventListenerで、onハンドルプロパティに代入して登録する場合はwindow.on<イベント名>を使用します。

 近接センサAPIには二つのイベントが存在します。同じ近接センサからの値に対して動くイベントですが、それぞれ取得できる値が違います。

userproximity

  • イベント名:userproximity

 addEventListenerでのイベント登録は次の通りです。

  window.addEventListener('userproximity', userHandler);

 onイベントプロパティでのイベント登録は次の通りです。

  window.onuserproximity = userHandler;

イベントハンドラの書式

 userproximityで取得する近接センサの値はevent.nearで取得できます。
 event.nearはすぐ近くに物体があることを検知した場合true、そうでない場合にfalseの値を取ります。

function userHandler(event) {
  var near = event.near;
  (snip)
}

サンプル

var interval;

function startVibrate() {
  interval = setInterval(() => {
    navigator.vibrate([200, 200]);
  }, 400);
}

function userHandler(event) {
  if (event.near) {
    // 近かったらバイブする
    startVibrate();
  } else {
    // 近くなかったらバイブ止める
    navigator.vibrate(0);
    if (interval) {
      clearInterval(interval);
    }
  }
}

 userproximityのサンプルでは近接状態を検知するとバイブレータを振動させています。
 バイブレータAPIの仕様で振動し続けさせることができないのでsetIntervalで振動し続けさせています。バイブレータAPIについてはいずれ記事にします。
 近接状態でなくなったらバイブレータを停止させます。

deviceproximity

  • イベント名:deviceproximity

 deviceproximityのaddEventListenerでのイベント登録は次の通りです。

  window.addEventListener('deviceproximity', deviceHandler);

 deviceproximityのonイベントプロパティでのイベント登録は次の通りです。

  window.ondeviceproximity = deviceHandler;

イベントハンドラの書式

function deviceHandler(event) {
  var min = event.min;
  var max = event.max;
  var value = event.value;
  @<i>{(snip)}
}
  • event.value
    • event.valueの値はセンサで検出した物体とのセンチメートル単位の距離を表します
  • event.min
    • event.minの値は検知できる最小のセンチメートル単位の距離を表します
  • event.max
    • event.maxの値は検知できる最大のセンチメートル単位の距離を表します

サンプル

function deviceHandler(event) {
  var _ = document.getElementById.bind(document);

  var max = _('max_value');
  var min = _('min_value');
  var val = _('val_value');

  max.textContent = event.max;
  min.textContent = event.min;
  val.textContent = event.value;
}

 deviceproximityのサンプルではセンサの値が変化したら画面に表示しています。
 確認に使ったkeonでは10か0しか返りませんでしたが、もっと遠くまで検知できて段階的に値が変化する端末なら値に応じて目のつむりかたが変わるキス顔アプリとか作れそうですね。
 キス顔アプリ好きすぎやねん。。。

まとめ

 今回紹介した近接センサAPIも環境光センサと同様にセンサイベントに対してイベントハンドラを設定して待ち受ける仕組みでした。
 近接センサの使いどころもやっぱり輝度調整とかなんですが、環境光センサの記事で書いた通りcertifiedなのでちょっと面白くないところですね。
 よくプッシュアップとかシットアップのアプリでスマホの画面にタッチさせるものがありますが、タッチまで行くのは結構物理的に大変なことが多い(スマホを置く場所が床とか膝の上とかになる)ので、近接センサで一定の近さになったら成立にするとかに使えるかもしれません。これも面白いことを思いついたらぜひ作って教えてくださいね。

[Firefox OS][WebAPI]環境光センサの使い方

 藪下@ワールドカップでだれてからblog停滞中です。

 個人的な活動でいくつかのAPIを使ってみる機会があったのでしばらくAPIを使ってみたシリーズやります。
 中身を読むのが本来の藪下の興味なので、一通り使い方の記事を書いたら気になるAPIは中身も読んでいきます。

 今回は環境光センサを使ってみます。

環境光センサ

 環境光センサはデバイス周辺の照度を検出するセンサです。
 携帯電話では環境の明るさに応じて液晶パネルの明るさを変えて見やすく省電力にする用途に使われます。
 環境光センサAPIはその名の通り環境光センサの値を取得します。
 環境光センサの値を取得するにはdevicelightイベントにハンドラを登録します。

イベントの登録

 環境光センサAPIはwindowオブジェクトに属します。なので

  • イベントハンドラをaddEventListenerで登録する場合
    • window.addEventListener
    • イベント名:devicelight
  • ondevicelightに代入して登録する場合
    • window.ondevicelightを使用します。

 addEventListenerでのイベント登録は次の通りです。

  window.addEventListener('devicelight', handler);

 ondevicelightのイベント登録は次の通りです。

  window.ondevicelight = handler;

イベントハンドラの書式

 環境光センサAPIはセンサで検出したルクス単位の明るさをunrestrected doubleで返します。
 環境光センサの値はevent.valueで取得できます。

  function handler(event) {
    var light = event.value; // ambient light sensor value
    @<i>{(snip)}
  }

サンプル

  • [https://github.com/aoitan/C86_samples/tree/master/devicelight](https://github.com/aoitan/C86_samples/tree/master/devicelight 環境光センサのサンプル}
window.addEventListener('devicelight', function(event) {
  console.log('環境光センサの値は' + event.value + 'です');
  var brightness = '';
  var l10n = navigator.mozL10n;
  if (event.value > 35000) {
    brightness = l10n.get('SHINE');
  } else if (event.value > 10000) {
    brightness = l10n.get('CLOUDY');
  } else if (event.value > 1000) {
  } else if (event.value > 200) {
    brightness = l10n.get('ROOM');
  } else if (event.value > 100) {
    brightness = l10n.get('NIGHT');
  } else if (event.value > 10) {
    brightness = l10n.get('CANDLE');
  } else {
    brightness = l10n.get('MOONLIGHT');
  }
  var light_value = document.getElementById('light_value');
  light_value.innerHTML = event.value + '(' + brightness + ')';
});

 上記コードでは環境光センサの値に応じてどのぐらい明るいかの文字列を表示しています。
 明るさを表す文字列はl10n.getでロケールに合わせた文字列を取得しています。
 l10n.get('SHINE')の場合英語 (アメリカ) ロケールだと ‘shine’ が、日本語ロケールだと ‘晴天’ が表示される要領です。

まとめ

 環境光センサAPIはFxOSのセンサAPIに多く見られるイベントリスナを登録してデバイスイベントを待つスタイルのAPIでした。
 このAPIの使いどころはやっぱり輝度調整とかになるのかなと思うのですが、ディスプレイの制御がcertifiedなのでそこはいまいち面白味ないです。
 環境光センサAPIである程度物体の近さを計算する補助になるので、やりようによっては物体からの相対位置を計算することができるかもしれません。
 たとえば顔を近づけると目をつぶったりほほを赤らめてくれるようなキス顔アプリとかも頑張れば作れるかもしれませんね。面白いことを思いついたらぜひ作った教えてくださいね。

[Firefox OS][Geeksphone][GPS]GeeksphoneのFxOS端末でgeolocationを動かす方法見つけました

 藪下@2課のガジェオタです。

 GeeksphoneのFxOS端末使いの方からよくGPS動かないという話を聞きます。
 斯く言う藪下もその一人ですが、GeeksphoneのFxOS端末でGPSを動かした人がいました。

Making geolocation work on Geeksphone devices
http://sergimansilla.com/blog/making-geolocation-work-geeksphone/

 ざっくり言うとuser.jsとgps.conf抜いて設定追記しろということでした。

 ということは

  • B2G/gaia/shared/resource/all.jsにuser.jsに追記する内容を記載
  • B2G/device/common/gps配下のconfに上記gps.confに追記する内容を記載
  • ビルド

 すれば端末の設定ファイルpullしてpushの手間はいらなそうな気がします。
 ちょっと手が空いたらそのうちやってみます。
#all.jsとuser.jsだとuser_prefとかprefとかで差異がありますがその辺はよしなにしてくださいな。

 以上です。よろしくお願いします。

[Firefox OS][端末情報]Firefox OS cast(仮)が出てきそう!

 藪下@2課のガジェオタです。

 Charomecastが話題になったのもまだ記憶に新しいですが、Firefox OSもTV向けのドングルを開発中とのことです。

MozillaはFirefox OSを搭載したChromecastキラーを開発中、プロトタイプの写真とデモ動画が公開
[http://getnews.jp/archives/603898](http://getnews.jp/archives/603898 ”MozillaはFirefox OSを搭載したChromecastキラーを開発中、プロトタイプの写真とデモ動画が公開”)

 UXをどうまとめるのか気になりますね。お値段によってはchromecastと一緒に買って比較してみてもいいかも?
 技適がアレでアレかもしれないけど。。。

[Firefox OS][端末情報]Firefox OSの開発者向け端末Flame日本版が18500円で7月中発売決定

 藪下@2課のガジェオタです。

 このブログを見る人ならFlameの進捗メールに登録してる気がしますが、Mozilla JapanからFlameが18500円で7月中に発売されると発表されました。
 すでにニュースサイトでも報じられてますね。

Firefox OS開発用端末「Flame」、1万8500円で7月に発売
http://k-tai.impress.co.jp/docs/news/20140617_653832.html

 Firefox Developers Conference 2014 in Kyotoへお越しの方はすでに開発版Flameを触られているのでご存知かと思いますが、日本語入力とかも割とキビキビしているので楽しみですね。

[Tizen]Phoneだって出るよ! Samsung Zだよ! ですか?

 藪下@2課のガジェオタです。

 んーとまたTizenのニュースです。さすがにTizen Conference後はいろいろ報じられますね。
 ソースコード出てきたよとかTVやるよと書いたんですが、本命のPhoneも出すよということみたいです。

Tizen Samsung Z phone to hit Russia Q3 2014, and will be shown off at the Tizen Developer Conference today
http://www.tizenexperts.com/2014/06/tizen-samsung-z-phone-hit-russia-q3-2014-will-shown-tizen-developer-conference-today/

 スペックは以下の通りです。

[Samsung Z Product Specifications]

Network LTE Cat.4 (150/50Mbps)
Display 4.8” HD Super AMOLED (1280 x 720)
AP 2.3GHz Quad core application processor
OS Tizen 2.2.1
Camera 8MP(rear), 2.1MP (front)
Video Video Codec: H.263, H.264(AVC), MPEG4, VC-1, Sorenson Spark, MP43, WMV7, WMV8
Video Format: MP4, M4V, 3GP, 3G2, WMV, ASF, AVI, FLV, MKV
Audio Audio Codec: MP3, AMR-NB/WB, AAC/ AAC+/ eAAC+, WMA, Vorbis, FLAC
Audio Format: MP3, M4A, 3GA, AAC, OGG, OGA, WAV, WMA, AMR, AWB, FLAC, MID, MIDI, XMF, MXMF, IMY, RTTTL, RTX, OTA
Camera Features Mini mode, Quick Shot, Best Photo, Drama, Panorama, Dual Camera
Value-Added Features Ultra Power Saving Mode
Download Booster
S Health 3.0
Color theme customization
Fingerprint sensor
Connectivity WiFi: 802.11 a/b/g/n HT40, MIMO(2×2), GPS/GLONAS, Bluetooth: 4.0 BLE, USB: USB2.0, NFC, IR Remote
Sensor Accelerometer, gyro, proximity, compass, barometer, Hall, RGB ambient light,Fingerptint Scanner, Heart rate sensor
Memory RAM: 2GB, Internal Memory: 16GB, microSD slot up to 64GB
Dimension 138.2 x 69.8 x 8.5mm, 136g
Battery 2600mAh

 残念ながら2.2.1ですね。2.3は出たばっかりだから仕方ないのですかね。
 結局のところ3.0マダー。

[Tizen][Xamarin]TizenもXamarinで書けるのですか?

 藪下@2課のガジェオタです。

 なにやら気になるニュースです。XamarinでTizen向けアプリも書ける。ですか?

Introduction to MonoTizen
http://www.tizenexperts.com/2014/05/introduction-monotizen/

 monoをTizenに移植したよってことですかね。
 一応monoプロジェクトともTizenプロジェクトとも独立にやってるみたいです。

[Tizen] Tizen 2.3 alphaのソースコードリリースとTizen TVのお話

 藪下@2課のガジェオタです。

 先週microsoft de:codeに参加して端末ゲットしてホクホクしてたらTizenに動きがありました。

ひとつめ

Tizen 2.3 Alpha Source Code Released
http://www.tizenexperts.com/2014/06/tizen-2-3-alpha-source-code-release/

 新しいバージョン出てきましたね。
 Tizenはバージョンアップごとのソースコードリリースなので久しぶりのリリースです。
 今回の目玉はウェアラブルプロファイルの追加ですかね。

 ていうか3.0マダー?

ふたつめ

Samsung to unveil development tools for Tizen TV at Tizen Developer Conference
http://www.tizenexperts.com/2014/06/samsung-to-unveil-tizen-tv-sdk-at-tizen-developer-conference/

 やっとですね。TVです。
 SamsungがTV出さないわけないと思ってたので出すと言われてもあーやっぱりですが、まあでもこれでモバイル、リビングとTizenで3 screensの準備はふたつ目まで来ましたね。あとはPCなんですけどIVI入れれば一応可能?
 あれ、でも前述の2.3 alphaにTVプロファイルって。。。

[Firefox OS][イベント]中国Firefox OS勉強会 1stの資料と録画

 藪下@2課のガジェオタです。

 中国Firefox OS勉強会 1stで登壇しました。明けた今日まだ広島です。
 今回主催者と事前の見積もりで組み込み系のエンジニアがそれなりに来ると予想してました。どうも目論見通り需要を満たせたようなので一安心です。

 今回の資料はこちらです。

Firefox OSアーキテクチャクイックツアー
http://t.co/iPmeyz5nUC

 Ustreamで配信していたので録画もあります。

Ustream
http://t.co/0A4Iosu46E

 今回書いていることをそのまま読むより多くのことを話しているので録画で見てみてください。

[Firefox OS][端末]Flameが予約開始されました

 藪下@2課のガジェオタです。

 噂のFirefox OS開発機Flameが予約開始されました。

Pre-orders start today for Flame, the Firefox OS developer phone
https://hacks.mozilla.org/2014/05/flame-firefox-os-developer-phone/

 $170なのでリーズナブルですね。ただし例によって技適通ってないので日本で普通に使うことはできません。
 上記記事でも日本で認証済みFlame端末を使いたいならmore informationと書かれてますが、近日中に技適通したバージョンが出るはずなので、技適通過端末がいい人はMozilla Japanからのお知らせを待ちましょう。

Firefox OS Flame | Mozilla Japan
http://www.mozilla.jp/firefox/os/devices/flame/