Help us understand the problem. What is going on with this article?

Javascriptで照明を操作 [Cylon.js x Philips Hue]

More than 3 years have passed since last update.

Hueを最近触ってるのでCylon.js経由で操作してみます。
あと、Milkcocoaも使ってWebとつなげてみたいと思います。

Philips Hue

Webの人向けに簡単に言うとプログラミングで制御できる照明です。
http://www2.meethue.com/ja-JP

過去のIoTLTでカヤックのネロさんがデモを見せてくれてましたが、Web開発者でも扱いやすいAPIインターフェイスがあるのが特長です。

HTTPリクエストでAPIを叩けるのでどんな言語でも問題無く制御できると思います。

Cylon.js

http://cylonjs.com/

前にJSオジサンで紹介したNode.jsのIoT向けフレームワーク(ライブラリ)です。

Cylon.jsでIoT (第5回 #JSオジサン : 5分)

Hue向けのアダプタも存在します。

http://cylonjs.com/documentation/platforms/hue/

HueのAPIを使うにあたって

色々遊べるハイテク照明 「Philips hue」のAPIを叩いてみた。

こちらのブログを参考にしました。
ユーザー名とhueブリッジのIPアドレスを確認しましょう。

Cylon.jsでHueを操作してみる。

  • 準備 npm経由でいつもどおり
$ npm install cylon cylon-hue
hue-cylon.js
var Cylon = require('cylon');

Cylon.robot({
  connections: {
    hue: { adaptor: 'hue', host: '192.168.1.85', username: 'XXX' }
  },

  devices: {
    bulb: { driver: 'hue-light', lightId: 2 }
  },

  work: function(my) {
    every((1).second(), function() {
      my.bulb.toggle();
    });
  }
}).start();

サンプルどおりに書いて実行します。

$ node hue-cylon

会社の電球につけてやってみました↑

簡単です。

MilkcocoaとつなげてWebから操作

https://mlkcca.com/

Milkcocoaはリアルタイム通信/IoT向けのバックエンドを提供してくれるサービスです。

いつも思うけど、Milkcocoaのトップページのドット絵と連携すると、Web側を作らなくていいから凄く楽ですw

$ npm i milkcocoa
hue-milkcocoa.js
var Cylon = require('cylon');
var Milkcocoa = require('milkcocoa');
var milkcocoa = new Milkcocoa('dogi9jz8c16.mlkcca.com');
var ds = milkcocoa.dataStore('dots');
var hue;

Cylon.robot({
  connections: {
    hue: { adaptor: 'hue', host: '192.168.2.2', username: 'newdeveloper' }
  },

  devices: {
    bulb: { driver: 'hue-light', lightId: 1 }
  },

  work: function(my) {
    my.bulb.turnOn(); //点灯
    hue = my; //hue変数に操作メソッド諸々を渡しておく
  }
}).start();

ds.on('push',function(data){
  switch (data.value.color){
    case '#ce071b':
      console.log('');
      hue.bulb.rgb(255,0,0); //赤
      break;
    case '#fdbc00':
      console.log('');
      hue.bulb.rgb(255, 165, 0); //黄
      break;
    case '#097b28':
      console.log('');
      hue.bulb.rgb(107, 142, 35); //緑
      break;
    case '#0f5aa6':
      console.log('');
      hue.bulb.rgb(30, 144, 255); //青
      break;
    default:
      hue.bulb.rgb(255, 255, 255);
      break;
  }
});

実行するとこんな感じです。

Milkcocoaのトップページのドット絵は操作するとpushイベントが発火してdata.value.colorに色の情報が渡ってくるのでハンドリングしています。

APIドキュメントとかをそこまで読んでないのでこんな感じで振り分けてるけど、16進の値をそのまま色情報に渡せるメソッドもあるかも

http://www.developers.meethue.com/documentation/core-concepts

まとめ

HueのAPIがHTTPリクエストで叩けるのがいいですね。
BLEだけじゃなくてこういったインターフェイスも増えてくるとJavascriptだけじゃなくてPHPとかでもIoTできそう。

n0bisuke
プロトタイピング専門スクール「プロトアウトスタジオ」で教えたりしてます。 プロフ -> https://dotstud.io/members/n0bisuke
https://protoout.studio
dotstudio
全ての人がモノづくりを楽しむ世界を目指して活動しています。
https://dotstud.io
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした