├── .gitignore
├── LICENSE
├── README.md
├── breadboard
    ├── led-sw.fzz
    └── led-sw.png
├── client.js
├── package.json
├── public
    └── controller.css
├── server.js
└── views
    └── controller.html


/.gitignore:
--------------------------------------------------------------------------------
 1 | # Logs
 2 | logs
 3 | *.log
 4 | 
 5 | # Runtime data
 6 | pids
 7 | *.pid
 8 | *.seed
 9 | 
10 | # Directory for instrumented libs generated by jscoverage/JSCover
11 | lib-cov
12 | 
13 | # Coverage directory used by tools like istanbul
14 | coverage
15 | 
16 | # Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
17 | .grunt
18 | 
19 | # node-waf configuration
20 | .lock-wscript
21 | 
22 | # Compiled binary addons (http://nodejs.org/api/addons.html)
23 | build/Release
24 | 
25 | # Dependency directory
26 | # https://www.npmjs.org/doc/misc/npm-faq.html#should-i-check-my-node_modules-folder-into-git
27 | node_modules
28 | 


--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
 1 | The MIT License (MIT)
 2 | 
 3 | Copyright (c) 2015 Mariko Kosaka
 4 | 
 5 | Permission is hereby granted, free of charge, to any person obtaining a copy
 6 | of this software and associated documentation files (the "Software"), to deal
 7 | in the Software without restriction, including without limitation the rights
 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 | 
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 | 
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 | 
23 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # IoT Boilerplate
 2 | This is a boilerplate to create Node.js IoT system with Arduino and Socket.io
 3 | I have been using this system for most of my network controlled hardware project.
 4 | 
 5 | ## System
 6 | The system is divided to of 3 parts.
 7 | 
 8 | 0. Web server (hosts controller website & socket.io connections) `server.js`
 9 | 0. Controller website `views/controller.html`
10 | 0. Arduino Client `client.js`
11 | 
12 | ![system](https://cloud.githubusercontent.com/assets/4581495/10714262/21408514-7abc-11e5-8edd-b750a590b76b.jpg)
13 | 
14 | 
15 | ## Demo Setup
16 | For sample, I've included small code to turn LED on and off from website, & receive message on webserver when button is pressed.
17 | 
18 | 0. Set up your hard ware as below  
19 | ![demo setup](https://github.com/kimio-kosaka/IoT-Boilerplate/blob/master/breadboard/led-sw.png)
20 | 0. From your computer (or on your server) start a server `node server.js`
21 | 0. From your computer connected to Arduino via USB, start Arduino client  `node client.js`
22 | 0. Open `localhost:5030` in your browser to see controller site
23 | 
24 | **note:** if you are running `server.js` and `client.js` from different computer (i.e `server.js` on hosting service & `client.js` on your Raspberry Pi) You'll need to change socket.io address in `client.js` and `views/controller.html`
25 | 
26 | ## Setup for your own system
27 | - For hardware setup, I recommend browsing [Johnny-five doc](http://johnny-five.io/) and edit `client.js`
28 | - You can add as many socket message as you like and customize your controller website by editing  `server.js` and `views/controller.html`.
29 | 


--------------------------------------------------------------------------------
/breadboard/led-sw.fzz:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/kosamari/IoT-Boilerplate/16818f2aaadd17862bf05efbd760818eeaa005f0/breadboard/led-sw.fzz


--------------------------------------------------------------------------------
/breadboard/led-sw.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/kosamari/IoT-Boilerplate/16818f2aaadd17862bf05efbd760818eeaa005f0/breadboard/led-sw.png


--------------------------------------------------------------------------------
/client.js:
--------------------------------------------------------------------------------
 1 | /*
 2 | * Setup
 3 | */
 4 | 
 5 | //1.  specify domain and port of your socket.io server
 6 | var socket = require('socket.io-client')('http://localhost:5040');
 7 | 
 8 | //2.  create instance johnny-five Arduino board.
 9 | var five = require("johnny-five");
10 | var board = new five.Board();
11 | 
12 | board.on("ready", function() {
13 | 
14 |   /*
15 |   * Define your application below
16 |   */
17 | 
18 |   // 1. initialize your hardware
19 |   var led = new five.Led(13);
20 |   var button = new five.Button(8);
21 | 
22 |   // 2. Create socket message receiver
23 |   socket.on('led', function(data){
24 |     if(data.command === 'on'){
25 |       led.on();
26 |     }else if(data.command === 'off'){
27 |       led.off();
28 |     }
29 |   });
30 | 
31 |   // 3. Create socket message emitter
32 |   button.on('press', function() {
33 |     socket.emit('press', {pin:8});
34 |   });
35 | 
36 | 
37 |   /*
38 |   * Socket connection logger
39 |   * Nice to console log when socket connection is lost/alive
40 |   */
41 |   socket.on('connect', function(){
42 |     console.log('Socket Connected');
43 |   });
44 |   socket.on('disconnect', function(){
45 |     console.log('Socket Disconnected !');
46 |   });
47 | 
48 |   /*
49 |   * REPL
50 |   * You can specify command to use from node REPL. Nice for debugging.
51 |   */
52 |   this.repl.inject({
53 |     blink: function(){led.blink();}
54 |   });
55 | 
56 | });


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "IoT_Boilerplate",
 3 |   "dependencies": {
 4 |     "express": "~4.10.0",
 5 |     "hbs": "~2.7.0",
 6 |     "socket.io": "~1.1.0",
 7 |     "socket.io-client": "^1.3.5"
 8 |   }
 9 | }
10 | 


--------------------------------------------------------------------------------
/public/controller.css:
--------------------------------------------------------------------------------
1 | *{
2 |   font-family: Arial;
3 |   color:#222;
4 | }
5 | 
6 | button{
7 |   font-size: 20px;
8 | }


--------------------------------------------------------------------------------
/server.js:
--------------------------------------------------------------------------------
 1 | var express = require('express');
 2 | var app = express();
 3 | var port = 5030;
 4 | var ioport = 5040;
 5 | var io = require('socket.io').listen(ioport);
 6 | 
 7 | /*
 8 | * express server setup
 9 | */
10 | app.set('view engine', 'html');
11 | app.engine('html', require('hbs').__express);
12 | 
13 | app.get('/', function (req, res) {
14 |   res.render('controller', {port:ioport});
15 | });
16 | 
17 | app.use(express.static(__dirname + '/public'));
18 | app.listen(port);
19 | 
20 | /*
21 | * socket.io setup
22 | */
23 | io.on('connection', function (socket) {
24 | 
25 |   // Define socket messages used in your application
26 |   socket.on('led', function(data) {
27 |     socket.broadcast.emit('led', data);
28 |   });
29 | 
30 |   socket.on('press', function(data) {
31 |     socket.broadcast.emit('press', data);
32 |   });
33 | 
34 | 
35 |   // broadcast message when socket is disconnected
36 |   socket.on('disconnect', function() {
37 |     socket.broadcast.emit('disconnected');
38 |   });
39 | 
40 | });
41 | 


--------------------------------------------------------------------------------
/views/controller.html:
--------------------------------------------------------------------------------
 1 | <!DOCTYPE HTML>
 2 | <html>
 3 |   <head>
 4 |     <meta charset="UTF-8">
 5 |     <title>IoT Controller</title>
 6 |     <link rel="stylesheet" type="text/css" href="./controller.css">
 7 |   </head>
 8 |   <body>
 9 |     <h1>IoT Controller</h1>
10 |     <h2>LED controll</h2>
11 |       <button class="btn" onclick="led('on')" disabled/>Turn On</button>
12 |       <button class="btn" onclick="led('off')" disabled/>Turn Off</button>
13 |     <br>
14 |     <br>
15 |     <h2>Button Reciver</h2>
16 |     <span id='message'>Press the button on your hardware</span>
17 | 
18 | 
19 |     <script src="http://localhost:{{port}}/socket.io/socket.io.js"></script>
20 |     <script type="text/javascript">
21 |       /*
22 |       * Setup
23 |       */
24 | 
25 |       //1. specify domain and port of your socket.io server
26 |       var socket = io.connect('http://localhost:{{port}}');
27 | 
28 |       //2. Setup socket handler for receiving message
29 |       //   once message recived, change state of this website
30 |       socket.on('press', function (data) {
31 |         var message = document.getElementById("message");
32 |         message.innerHTML = 'button connected to pin '+ data.pin +' is pressed!';
33 |       });
34 | 
35 |       //3. Setup function to emit messages
36 |       //   this message is broadcasted to your client.js via server.js
37 |       //   this function is called by onclick on <button>
38 |       function led(command) {
39 |         socket.emit('led', {command:command});
40 |       }
41 | 
42 | 
43 |       /*
44 |       * Socket connection controller
45 |       * buttons are disabled when socket is disconnected
46 |       */
47 |       socket.on('connect', function () {
48 |         var btn = document.getElementsByClassName("btn");
49 |         for (var i = 0; i < btn.length; i++) {
50 |           btn[i].disabled = false;
51 |         }
52 |       });
53 | 
54 |       socket.on('disconnect', function (client) {
55 |         var btn = document.getElementsByClassName("btn");
56 |         for (var i = 0; i < btn.length; i++) {
57 |           btn[i].disabled = true;
58 |         }
59 |       });
60 |     </script>
61 |   </body>
62 | </html>


--------------------------------------------------------------------------------