この記事は、IoTLT Advent Calendar 2018 の 12月14日の記事です。1日遅れてしまいました、すみません！

2018年の IoTLT Advent Calendar はなんと3つも立ち上がっていて、相変わらずの盛り上がりです！さすが、Connpass のグループ登録者数トップをひた走るコミュニティだけあってすごい勢いです。

• https://qiita.com/advent-calendar/2018/iotlt
• https://qiita.com/advent-calendar/2018/iotlt_neo
• https://qiita.com/advent-calendar/2018/iotlt_mitz

やること

Firebase のデータに連動して光る NeoPixel を Nefry BT を使って実現します。
ぼくが使っている Neffy BT は無印リビジョンなので、 R2、R3 の人は少し異なるところがあるかもしれません。

※リビジョンの確認方法について はこちらです。

初期設定

今回は、Arduino IDE を使って構築します。Nefry BT 公式を参照しながらセットアップを進めていきます。

ボードのセットアップ

1. 追加のボードマネージャーのURLに「http://nefry.studio/package_nefrybt_index.json」を追加します。
2. ツール > ボードマネージャ を起動して「Nefry」を検索すると表示されるボードをインストールします。
3. シリアルモニタの転送レートは「115200　bps」に設定します。

WiFi のセットアップ

https://dotstud.io/docs/nefrybt-setup-wifi/を参考に、Nefry BT の WiFi 初期設定を行います。

Firebase のセットアップ

1. Firebase のコンソールを起動して新しいプロジェクトを作ります。
2. 地域は us-central で良いと思います。
3. 新しく Realtime Database を作成します（上の方にある Cloud Firestore は今回使わない）。
4. Realtime Database のセキュリティルールは「ロックモードで開始」にします。
5. Webアプリを追加するボタンから接続情報を確認します。
6. アクセストークンを作成する方法は少し複雑なので、簡易版として rules を公開に変更します。

{
  "rules": {
    ".read": true,
    ".write": false
  }
}

正確に実装するためには公式ドキュメントを参考にしてください。

Arduino IDE のスケッチ作成

Firebase 部分

スケッチの例から「FireBaseSimple」を選んで作成します。setup() の部分を自分用の設定に書き換えます。

void setup() {
  firebase.begin("<projectId>.firebaseio.com");
}

loop() の中で Firebase からデータを読み取ります。

void loop() {
  String pixelData;

  pixelData = firebase.read("TESTCODE"));
  Nefry.print("### Get:");
  Nefry.print(pixelData);

  delay(1000);
}

コンパイルして動かしてみる

ここまでの作業で、Firebase にあるデータを Nefry BT に取得して、シリアルモニタ上にデータが表示されるところまでが実現できているはずです。

Realtime Database の内容

シリアルモニタ(Arduino IDE)の内容

NeoPixel を光らせる

さて、最後の仕上げで光らせる部分です。

方法論

これまでの手順で、Firebase から "1" と "0" の2種類を羅列した文字列が取得できる状態となっているので、あとは "1" の時光って、 "0" の時消えるというのを実装していきます。

文字列を数字に変換して、RGBの値に設定するという単純な方法論です。

void loop() {
  String rec_data;
  rec_data = firebase.read("TESTCODE");
  Nefry.print("### Get:");
  Nefry.println(rec_data);
  Nefry.println(rec_data.length());

  int data_len = rec_data.length();
  char pixel_data[data_len - 1];
  for(int i=0; i < sizeof(pixel_data); i++) {
    int flg = rec_data.charAt(i + 1) - '0'; // convert to int
    Nefry.println(flg);
    pixels.setPixelColor(i, pixels.Color(0,150 * flg,0));
    pixels.show();
  }

  delay(INTERVAL);
}

Firebaseから取得した文字列を、1文字ずつ取得して変換します。最初と最後に不要な情報がついてくるのでそれを削って利用しています。

取得した情報に応じてNeoPixcelが光るようになりました！

今回の例では、10101... なので [光][消][光][消][光]... という順番で光ってます。

あとは、Web から Firebase の値を操作することで、光る状態を動的に制御できるようになります。やや回りくどい方法ですが Firebase を使うと Web のフロントエンド側で自由度の高いゲーム的なものが比較的簡単なため、ゲームと光る状態を連動したくて今回の実装としました。