Upgrade to Pro — share decks privately, control downloads, hide ads and more …

[Tokyo NodeFest 2015] Hardware Hacking for Java...

Tomomi Imura
November 13, 2015

[Tokyo NodeFest 2015] Hardware Hacking for Javascript Developers (Japanese | 日本語)

電球をスマホから作動できたり、体重や心拍数をブラウザからモニタリングできたり、いろいろなモノがモバイルやインターネット上に接続されるようになり、今やモノのインターネット (Internet of Things) の時代と言われています。Web Developer は既にソフトウェアでアプリケーションのプロトタイプをするスキルを持ち合わせているのだから、この際ハードウェアも含めて Internet of Everything のプロトタイプをしてみませんか?

このスライドは、2015年11月7日に東京、渋谷で行われた NodeFest からのもので、Node.js / Johnny-Five を使って Arduino や Raspberry Pi と、Front-end JavaScript そして PubNub を使ってモノのインターネットのプロトタイプをしてみよう、という内容です。

- Arduino
- Raspberry Pi
- Johnny-Five JS robotics framework
- PubNub
- Prototyping Phillips Hue Clone
- KittyCam (Raspberry Pi camera w/ cat facial recognition)

Tomomi Imura

November 13, 2015
Tweet

More Decks by Tomomi Imura

Other Decks in Technology

Transcript

  1. @girlie_mac Hardware Hacking for JavaScript Devs Tomomi Imura (@girlie_mac) Hardware

    Hacking for JavaScript Devs https://flic.kr/p/8tuc1u by randomliteraturecouncil CC-BY 2.0 2015 東京 Node 学園祭
  2. @girlie_mac I am a: • Front-End Engineer • N00b Hardware

    Hacker • Sr. Developer Evangelist at PubNub • San Francisco Dweller
  3. @girlie_mac Withings: Smart Body Analyzer GE Link Cinder Sensing Cooker

    Nest: Learning Thermostat Whistle: Connected pet collar Amazon Dash Button
  4. @girlie_mac Programming Tessel in Node.js var tessel = require('tessel'); var

    camera = require('camera-vc0706').use(tessel.port['A']); camera.on('ready', function() { camera.takePicture(function(err, image) { if (err) { console.log(err); } else { var name = 'pic-' + Date.now() + '.jpg'; process.sendfile(name, image); camera.disable(); } }); }); カメラモジュールの 差し込まれたポート ready イベント コールバック
  5. @girlie_mac Raspberry Pi USB TO POWER SOURCE TO MONITOR TO

    MOUSE TO KEYBOARD WI-FI ADAPTER SD CARD GPIO DIGITAL PINS 4 EXTRA USB PORTS ETHERNET
  6. @girlie_mac オームの法則 R = V - V s f I

    電源電圧 (V) LED にかかる電圧 (V) LED に流れる電流 (A) 抵抗 (Ω)
  7. @girlie_mac オームの法則と抵抗 R = 3.3 - 1.9 0.02 電源電圧 (V)

    LED にかかる電圧 (V) LED に流れる電流 (A) 抵抗 (Ω) = 70Ω
  8. @girlie_mac Programming Pi with Node.js node-arm を使って Node.js をインストール $

    wget http://node-arm.herokuapp.com/node_latest_armhf.deb $ sudo dpkg -i node_latest_armhf.deb もしくは特定バージョンの Node
  9. @girlie_mac Blinking LED var five = require('johnny-five'); var raspi =

    require('raspi-io'); var board = new five.Board({io: new raspi()}); board.on('ready', function() { var led = new five.Led(7); // インスタンスの作成 led.blink(500); // 500ms 間隔の on-off フェイズで "blink" (チカチカ) させる }); Pin 7 (GPIO-4) ラズパイ用プラグイン。 Arduino を使う場合は必要 なし
  10. @girlie_mac ブラウザからデータを送信 var pubnub = PUBNUB.init({ subscribe_key: 'sub-c-...', publish_key: 'pub-c-...'

    }); function lightOn() { pubnub.publish({ channel: 'remote-led', message: {light: true}, callback: function(m) {console.log(m);}, error: function(err) {console.log(err);} }); } document.querySelector('button') .addEventListener('click', lightOn); クリックイベントの 発生 <script src="http://cdn.pubnub. com/pubnub-3.7.15.min.js"></script>
  11. @girlie_mac MCU でデータを受信 var pubnub = require('pubnub').init({ subscribe_key: 'sub-c-...', publish_key:

    'pub-c-...' }); pubnub.subscribe({ channel: 'remote-led', callback: function(m) { if(m.light) { // Johnny-Five でLチカ! } } }); led.pulse();
  12. @girlie_mac ブラウザからデータを送信 redInput.addEventListener('change', function(e){ publishUpdate({color: 'red', brightness: +this.value}); }, false);

    function publishUpdate(data) { pubnub.publish({ channel: 'hue', message: data }); } その値を PubNub に送信し て、MCU 側に伝える UI で赤色の値が変 更
  13. @girlie_mac MCU でデータを受信 var led = new five.Led.RGB([7, 5, 3]);

    pubnub.subscribe({ channel: 'hue', callback: function(m) { if(led) { r = (m.color === 'red') ? m.brightness : r; g = (m.color === 'green') ? m.brightness : g; b = (m.color === 'blue') ? m.brightness : b; led.color({red: r, blue: b, green: g}); } } }); GPIO ピンに接続 された LED ア ノードに各色の 値を伝達 http://johnny-five.io/examples/led-rgb/ pin#s for R, G, B
  14. @girlie_mac KittyCam in Node.js 1. 動きを察知 (Johnny-Five IR.Motion obj) 2.

    写真を撮影 (Raspistill, command line tool) 3. ネコ顔認識 (KittyDar) 4. クラウド (Cloudinary) に写真を保存 5. データを PubNub でパプリッシュ 6. web でストリーム (PubNub でデータをサブスク ライブ)
  15. @girlie_mac PIR Sensor > Run Camera board.on('ready', function() { //

    `motion` ハードウェア・インスタンスを生成 var motion = new five.Motion(7); //pin 7 (GPIO 4) にワイヤーが接続 // セッションが始まると 'calibrated' が発火 motion.on('calibrated', function() {console.log('calibrated');}); motion.on('motionstart', function() { // 動きが感知されたぞ! // raspistill コマンドでカメラを動かす var filename = 'photo/image_'+i+'.jpg'; var args = ['-w', '320', '-h', '240', '-o', filename, '-t', '1']; var spawn = child_process.spawn('raspistill', args); ... motion detected! Take a photo!
  16. @girlie_mac Processing Photo ... spawn.on('exit', function(code) { if((/jpg$/).test(filename)) { var

    imgPath = __dirname + '/' + filename; // Child process: 画像ファイルを読み取り、別プロセスで KittyDar を使ってネコの顔を認識 var args = [imgPath]; var fork = child_process.fork(__dirname+'/detectCatsFromPhoto.js'); fork.send(args); // the child process is completed fork.on('message', function(base64) { if(base64) { // クラウドストレージへ送る } }); ... var kittydar = require ('kittydar'); a cat detected!