Getting Started with Johnny Five for IoT (Part 2)

1var five = require('johnny-five');
2var board = new five.Board();
3
4var  pubnub = require('pubnub').init({
5  publish_key: 'pub-c-0b43969b-...', // Use  your pub key
6  subscribe_key: 'sub-c-cb24903e-...' // Use your sub key
7});
8
9var  channel = 'led';
10 
11board.on('ready', function() {
12  var led = new five.Led(13);  // pin 13
13
14  pubnub.subscribe({
15    channel: channel,
16    message: function(m)  {
17      if(m.blink === true) {
18        led.blink(500);
19      } else {
20        led.stop();
21        led.off();
22      }
23    },
24    error: function(err)  {console.log(err);}
25  });
26  
27});

1// Use the same keys that you are going to use for Arduino code with Johnny-Five
2
3var  pubnub = PUBNUB.init({
4  publish_key: 'pub-c-0b43969b-...', // Use your pub key
5  subscribe_key: 'sub-c-cb24903e-...' // Use your sub key
6});
7
8// Use the  same channel name
9var channel = 'led';
10
11var button = document.querySelector('button');
12
13var  blinkState = true;
14
15/***
16Subscribe data from all subscibers of the channel  to set the button state correctly
17***/
18pubnub.subscribe({
19  channel: channel,
20  message: function(m) {
21    blinkState = m.blink; // the raw data
22    blinkState  = !blinkState; // toggle it to lable the button
23    button.textContent = (blinkState)  ? 'Blink LED' : 'Stop LED'; 
24    console.log(blinkState);
25  }
26});
27
28/*
29Upon  a button click, publish the data.
30Arduino will subscribe it and blink LED
31*/
32button.addEventListener('click',  function(e) {
33  pubnub.publish({
34    channel: channel, 
35    message: {blink:  blinkState},
36    callback: function(m) {
37      console.log(m);
38    }
39  });
40  
41});

1var five = require('johnny-five');
2var board = new five.Board();
3
4var
5  pubnub = require('pubnub').init({
6  publish_key: 'pub-c-0b43969b-...', // Use
7  your pub key
8  subscribe_key: 'sub-c-cb24903e-...' // Use your sub key
9});
10
11var
12  channel = 'led';
13 
14board.on('ready', function() {
15  var led = new five.Led(13);
16  // pin 13
17
18  pubnub.subscribe({
19    channel: channel,
20    message: function(m)
21  {
22      if(m.blink === true) {
23        led.blink(500);
24      } else {
25
26        led.stop();
27        led.off();
28      }
29    },
30    error: function(err)
31  {console.log(err);}
32  });
33  
34});

1// Use the same keys that you are going to use for Arduino code with Johnny-Five
2
3var
4  pubnub = PUBNUB.init({
5  publish_key: 'pub-c-0b43969b-...', // Use your pub key
6
7  subscribe_key: 'sub-c-cb24903e-...' // Use your sub key
8});
9
10// Use the
11  same channel name
12var channel = 'led';
13
14var button = document.querySelector('button');
15
16var
17  blinkState = true;
18
19/***
20Subscribe data from all subscibers of the channel
21  to set the button state correctly
22***/
23pubnub.subscribe({
24  channel: channel,
25
26  message: function(m) {
27    blinkState = m.blink; // the raw data
28    blinkState
29  = !blinkState; // toggle it to lable the button
30    button.textContent = (blinkState)
31  ? 'Blink LED' : 'Stop LED'; 
32    console.log(blinkState);
33  }
34});
35
36/*
37Upon
38  a button click, publish the data.
39Arduino will subscribe it and blink LED
40*/
41button.addEventListener('click',
42  function(e) {
43  pubnub.publish({
44    channel: channel, 
45    message: {blink:
46  blinkState},
47    callback: function(m) {
48      console.log(m);
49    }
50
51  });
52  
53});

1<h1>Prototyping IoT Demo UI</h1>
2
3<p>The simplified version of this  code (the one used in my Johnny-Five tutorial video on Arduino.cc is available at:  <a href="http://codepen.io/girliemac/pen/ZWMqmZ">http://codepen.io/girliemac/pen/ZWMqmZ</a>)
4
5<button  class="button-blue">Blink LED</button>
6
7<script src="//cdn.pubnub.com/pubnub-3.14.5.min.js"></script>