We are now going to write an application based on Node.js to remotely track the measurements from the sensor and the camera. There are basically three main parts in the code: (1) the server code in Javascript, (2) the HTML page which will contain the interface, and (3) a client-side Javascript file which will link the two.
Let’s look at the server-side Javascript code first. It starts by including the required Node modules: (1) the node-dht-sensor module to handle the DHT sensor as before and (2) Express to handle HTTP communications like a web server. Below is the code:
var sensorLib = require('node-dht-sensor'); var express = require('express'); var app = express();
We also include the views and public directory. The views directory is where we will store the interface, while the public directory is where we will put both the Javascript code and the recorded pictures:
app.set('views', __dirname + '/views') app.set('view engine', 'jade') app.use(express.static(__dirname + '/public'))
We will create a route for the interface, which will allow us to access the our project:
app.get('/interface', function(req, res){ res.render('interface'); });
We will include the Raspberry Pi version of the aREST API (http://arest.io/) for us to control the Raspberry Pi via HTTP:
var piREST = require('pi-arest')(app);
We also give an ID and a name to your Pi:
piREST.set_id('1'); piREST.set_name('my_RPi');
Finally, we call the app.listen() function to start our application:
var server = app.listen(3000, function() { console.log('Listening on port %d', server.address().port); });
The interface itself is written in Jade (http://jade-lang.com/). This will give us an HTML file as a result. The file is stored in the view directory inside the application. We add some title, some containers for the sensor measurements, and a field for the picture which will be recorded by the camera:
doctype html head title Raspberry Pi Interface script(src="/js/jquery-2.0.3.min.js") script(src="/js/interface.js") link(rel='stylesheet', href='/css/style.css') body header div.mainContainer h1 Raspberry Pi Interface h2 Sensor Readings p Temperature: span#temperature 0 span C p Humidity: span#humidity 0 span % h2 Camera img#camera(src='')
As you can see on the code, we will include a Javascript file and a jQuery inside the Jade template. The script file will call the Raspberry Pi aREST API every 2000 ms to refresh the measurements of the DHT11 sensor:
setInterval(function() { // Update temperature $.get("/temperature", function(data) { $("#temperature").html(data.temperature); }); // Update humidity $.get("/humidity", function(data) { $("#humidity").html(data.humidity); }); }, 2000);
And every 10 seconds, the camera will take a picture:
setInterval(function() { // Take picture $.get("/camera/snapshot"); }, 10000);
This picture inside the interface will refresh every second:
setInterval(function() { // Reload picture d = new Date(); $("#camera").attr("src","pictures/image.jpg?" + d.getTime()); }, 1000);
It is now time to test the interface. Go to the pi_node folder and type:
sudo npm install node-dht-sensor express pi-arest
Wait a bit; it can take a while.
Then, type:
sudo node pi_node.js
Finally, go to your favorite web browser and type:
http://raspberrypi.local:3000/interface
On your Pi, you can just type:
http://localhost:3000/interface
You should see the interface of the project displaying the following:
Be patient in waiting for the measurements and the picture to appear on the display. Remember, there is a 2-second delay for the sensor measurements and a 10-second delay for the picture.
Also, note that the Node.js module for the camera module is not perfect. In my system, I had a delay between the moment the picture was taken and the moment it appeared on the display.
Congratulations, you can now remotely access measurements from your Raspberry Pi and the camera!
Page last edited February 10, 2015
Text editor powered by tinymce.