BiTT開発
BiTT開発
2015.10.09

Web開発者でも簡単に扱えるマイコンボードTesselでMilkcocoaを使う(遠隔Lチカ編)

平間 清彦

チャットを使って遠隔Lチカしてみる

APIを使う準備ができたので、早速使ってみましょう。
チャットはリアルタイムなToDoアプリをMilkcocoaとJavaScriptで作る(基本編)のものを使います。
とはいっても、以下をコピペで大丈夫です({your-app-id}以外)。

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0">
<title>TesselをLチカさせるチャット</title>
<script src="https://cdn.mlkcca.com/v2.0.0/milkcocoa.js"></script>
<script src="app.js"></script>
</head>
<body>
<div>
  <div>
    <input id="new_content" type="text" />
    <button id="create_btn">追加</button>
  </div>
  <div id="chats">
  </div>
</div>
</body>
</html>
// app.js
(function(global){
// your-app-idの部分は、先ほどと同じものを使います。
var milkcocoa = new MilkCocoa("your-app-id.mlkcca.com");
var chatDataStore = milkcocoa.dataStore("chats");
global.onload = onload;
function onload() {
  var new_content = document.getElementById("new_content");
  var create_button = document.getElementById("create_btn");
  var chats = document.getElementById("chats");
  chatDataStore.stream().sort('desc').size(20).next(function(err, chats) {
    chats.forEach(function(chat) {
      render_chat(chat.value);
    });
  });
  chatDataStore.on('push', function(pushed) {
    render_chat(pushed.value);
  });
  create_button.addEventListener("click", function(e) {
    chatDataStore.push({
      content : new_content.value
    });
    new_content.value = "";
  });
  function render_chat(chat) {
    var element = document.createElement("div");
    element.textContent = chat.content
    chats.appendChild(element);
  }
}
}(window))

チャットができたら、Tesselでpushを監視して、pushされたらLEDのON/OFFを入れ替えるように実装します。

// mlktest.js
var tessel = require('tessel');
var MilkCocoa = require('milkcocoa-tessel');
var milkcocoa = new MilkCocoa("your-app-id.mlkcca.com", {useSSL:false});
var chatDataStore = milkcocoa.dataStore("chats");
var led1 = tessel.led[0].output(1);
var led2 = tessel.led[1].output(0);
console.log('start');
chatDataStore.on("push", function(e) {
led1.toggle();
led2.toggle();
console.log('pushed', e.value.content);
});

これで、チャットに投稿をしたら、2つのLEDが交互に光るのが確認できるかと思います。

d13c04f57bca08ac16109a13b7c413a5

注意すべきなのは、Tesselはソケットを4つしか持っていない上、USBを抜いて電源を落とさない限りソケットが解放されません。Milkcocoaはソケットを2つ使うので、プログラムを2回実行するごとにUSBを抜かないとエラーが出ます。
開発中に少し面倒くさいだけで、実際に使うときは一回しか実行しないので問題はないです。

パソコンから取り外して使ってみる

プログラムを実行させたままにしたい場合は、パソコンに繋いだままだと邪魔で仕方ないです。そのため、Tessel単体で動くようにしましょう。
といってもやり方はとても簡単で、以下のコマンドでプログラムをTesselのフラッシュメモリに書き込むだけです。

$ tessel push mlktest.js

プログラムを送ったらパソコンから取り外して、別のMicroUSB電源に付け替えたら、起動して勝手にプログラムが実行されます(実行までちょこっと時間がかかります)。
フラッシュメモリのプログラムを消したい場合は、以下のコマンドで消すことができます。

$ tessel erase

圧倒的に扱いやすいTesselとMilkcocoaで広がる可能性

Raspberry Piに比べて、Tesselは驚くほど簡単だと気づくかと思います。
この手軽さに加え、Milkcocoaで簡単にデータ保存とリアルタイム通信ができるようになることで、IoT開発の幅がかなり広がったんじゃないかなと思っています。
ぜひ、TesselとMilkcocoaを使って色々試してみてください!


のびすけ のびすけのひと言
JavaScriptで制御できるデバイスは思った以上に多くなってきています。私もTesselを最初に知ったときは手軽さに衝撃を受けましたw 
MilkcocoaとTesselを組み合わせることでWebとハードの境目を感じさせないモノがどんどん作れそうですね! 今後のMilkcocoaとTesselに期待です!

>元記事を読む