Integrating the modules into a single interface

Now that our modules are up and running, we are going to learn how to integrate everything into a single interface, so you will be able to run it on your computer or on another Raspberry Pi. You will then be able to control and monitor your smart home from a single interface.

We will first configure the server that will allow us to connect all the modules that we configured earlier. Then, we'll build an interface on top of that.

The code for the server starts by importing the required modules:

// Modules
var express = require('express');
var request = require('request');

// Express app
var app = express();

After that, this is where we'll define the IP addresses of the different modules in our home automation system:

// Raspberry Pi boards IP addresses
var motionSensorPi = "192.168.0.101:3000";
var sensorPi = "192.168.0.102:3000"
var lampPi = "192.168.0.103:3000"

We also need to define the pins on which the lamp and the motion sensor are connected:

// Pins
var lampPin = 12;
var motionSensorPin = 17;

Of course, if you connect the components to different pins, you will need to change that here.

Then, we can declare the folder in which we will store the files for the interface, as well as the main route of the application that will serve the interface:

// Use public directory
app.use(express.static('public'));

// Routes
app.get('/', function (req, res) {

  res.sendfile(__dirname + '/public/interface.html');

});

We then create a route that will send us back the state of the motion sensor, by calling the required command on the motion sensor module:

app.get('/motion', function (req, res) {

  request("http://" + motionSensorPi + "/digital/" + motionSensorPin,
    function (error, response, body) {

      // Answer
      answer = {
        status: body.return_value
      };
      res.json(answer);

  });

});

We also define a route that will give us the temperature measured by the DHT11 sensor, by calling the corresponding Raspberry Pi:

app.get('/temperature', function (req, res) {

  request("http://" + sensorPi + "/temperature",
    function (error, response, body) {

      // Answer
      answer = {
        temperature: body.temperature
      };
      res.json(answer);

  });

});

We do the same for humidity:

app.get('/humidity', function (req, res) {

  request("http://" + sensorPi + "/humidity",
    function (error, response, body) {

      // Answer
      answer = {
        humidity: body.humidity
      };
      res.json(answer);

  });

});

Finally, we define a route to turn on the module that control appliances:

app.get('/on', function (req, res) {

  request("http://" + lampPi + "/digital/" + lampPin + '/1');

  // Answer
  answer = {
    status: 1
  };
  res.json(answer);

});

We also define a similar route to turn the appliance off again:

app.get('/off', function (req, res) {

  request("http://" + lampPi + "/digital/" + lampPin + '/0');

  // Answer
  answer = {
    status: 0
  };
  res.json(answer);

});

We start the server at the end of the file with:

// Start server
app.listen(3000, function () {
  console.log('Home automation system started');
});

We now have a server that we can use to control & monitor your home using all the modules that we deployed. However, we will now create an interface on top of this server that will allow us to easily monitor & control the whole system.

First, let's see build the graphical interface itself. It starts by creating a set of buttons to switch the appliance on or off:

<div class='row'>

    <div class='col-md-1'></div>
    <div class='col-md-2'>Lamp</div>
    <div class='col-md-3'>
      <button id='on' class='btn btn-block btn-primary'>On</button>
    </div>
    <div class='col-md-3'>
      <button id='off' class='btn btn-block btn-warning'>Off</button>
    </div>

  </div>

After that, we create two indicators for the sensor module:

  <div class='row'>

    <div class='col-md-1'></div>
    <div class='col-md-2'>Temperature</div>
    <div class='col-md-3' id='temperature-status'></div>
    <div class='col-md-2'>Humidity</div>
    <div class='col-md-3' id='humidity-status'></div>

  </div>

We also create an indicator for the motion sensor:

  <div class='row'>

    <div class='col-md-1'></div>
    <div class='col-md-2'>Motion Sensor</div>
    <div class='col-md-3' id='motion-status'></div>

  </div>

Finally, we create a field for the stream from the camera:

  <div class='row voffset50'>
    <div class='col-md-1'></div>
    <div class='col-md-2'>Camera</div>
    <div class='col-md-7'>
      <div id="webcam">
        <noscript>
          <img src="http://192.168.0.105:8080/?action=snapshot" />
        </noscript>
      </div>
    </div>
  </div>

Let's now see the script.js file that will basically make the link between the interface and the server. It starts by linking the buttons to the correct routes on the server:

$( "#on" ).click(function() {

    // Set lamp ON
    $.get('/on');

  });

  $( "#off" ).click(function() {

    // Set lamp OFF
    $.get('/off');

  });

Then, we create a loop that will regularly update data coming from the motion sensor:

  // Indicators
  setInterval(function () {

    // Current
    $.get('/motion', function(data) {

      if (data.status == true) {
        $( "#motion-status" ).text("No Motion");
      }
      else {
        $( "#motion-status" ).text("Motion Detected");
      }

    });

  }, 2000);

We also create another loop to update the temperature:

  setInterval(function () {

  // Temperature
    $.get('/temperature', function(data) {

      $( "#temperature-status" ).text(data.temperature);
   
    });

  }, 2000);

And finally, we do the same for humidity:

  setInterval(function () {

    // Temperature
    $.get('/humidity', function(data) {

      $( "#humidity-status" ).text(data.humidity);
   
    });

 }, 2000);

Note that I also added some additional piece of required code inside the interface and as I only highlighted the most important parts here, I recommend getting the whole code from the GitHub repository of the book.

It's finally time to test the interface! Put all the code inside a folder on your computer or on another Raspberry Pi and type the following command:

sudo npm install request express

Once all the modules are installed, start the server with this command:

sudo node interface.js

Now, simply navigate to the IP address of your computer (via localhost) or to Pi on which you started this server. For example:

http://localhost:3000/

This is what you should see:

Integrating the modules into a single interface

You can now try the interface; for example, using the buttons to control an appliance or by passing your hand in front of the motion sensor you should immediately see the result inside the interface. You now have a central interface for your home automation system that you can use to control your smart home!

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset