Raspberry Pi – Yellington AB

Automated web test using Protractor

21 april, 2016/i Aeon Labs, Aeon Labs Multisensor 6, Angular, Domoticz, Frontend, Javascript, Raspberry Pi, Security, Testing, Web development, Z-Wave/av Daniel

Protractor is a neat test framework for AngularJS apps and since the web app we made in previous post is made using Angular, we’re going to create a simple Protractor test. You find the previous post here.

What do you need to start using Protractor

An Angular based web app uploaded to a web server. We’ll be using the Angular app we made in previous post.
Protractor is a Node.js program so you will have to have Node.js installed. You can download it here if you haven’t installed it.

Uploading our Angular web app to the Domoticz server

Since Protractor is made for testing web apps located on remote web servers, we upload our Angular web app to the Domoticz server in the ”www” directory in a folder we call ”angular_frontend”. For this we use a SFTP client (FileZilla) on our laptop and upload our CSS, fonts, img, JS folders along with the index, sensorApp.css and sensorController.js files.

Installing Protractor

Make sure you have Node.js installed on the laptop by typing ”node –version” in a Terminal window. If you have Node.js installed it will print out the version number you have. To install Protractor type the following:

npm install -g protractor

This will install Protractor and the Webdriver Manager. You can test your Protractor installation by typing ”protractor –version”. Next type:

webdriver-manager update

Writing the Protractor test

We will write two files to create the Protractor test: one spec.js and one conf.js. Place these two files in the same directory on your laptop. Our conf.js file looks like this:

[code language=”javascript”]
exports.config = {
framework: ’jasmine’,
seleniumAddress: ’http://localhost:4444/wd/hub’,
specs: [’spec.js’],
}
[/code]

In the conf file you can add a lot more configuration parameters but in this case we stick with the basics. The ”seleniumAddress” parameter specifies the local web address we will use when running our test. The ”specs” parameter tells Protractor where to find the test file i.e. ”spec.js”. Our spec.js file looks like this:

[code language=”javascript”]
describe(’Test of Home Security Frontend’, function() {
it(’should verify the title and count the sensors’, function() {
browser.get(’http://192.168.1.99:8080/angular_frontend/index.html’);

expect(browser.getTitle()).toEqual(’Home Security Frontend’);

var sensorlist = element.all(by.repeater(’sensor in sensorData’));
expect(sensorlist.count()).toEqual(4);

});
});
[/code]

It will retrieve the ”index.html” file from the Domoticz web server and run two tests:

Verify that the page title is ”Home Security Frontend”
Count the sensor boxes and verify that all four sensor are loaded (including the dummy sensor)

The ”spec.js” file can be expanded with simulated user actions such as clicking on buttons and typing in text boxes. For more references how to use Protractor go to angular.github.io/protractor/.

Running the test

Before we run our test, we need to change the $timeout function to $interval in the sensorController.js file. This is because Protractor will timeout if using the $timeout repeatedly. In the Angular controller services listing, replace $timeout with $interval:

[code language=”js”]app.controller(’sensorCtrl’, function($scope, $http, $interval) {[/code]

Next, replace the call to $timeout with $interval and set the repeat count to 1:

[code language=”js”]//$timeout(updateSensorData(), 1000); //Poll the sensor data every second
$interval(updateSensorData, 1000, 1); //Poll the sensor data every second[/code]

Save and upload the sensorController.js file to the Domoticz web server. Now we’re ready to run the test. Open a Terminal window and type:

webdriver-manager start

This will start the Selenium server that will be used for the Protractor test. Let the server run in this Terminal window and open another Terminal window. Run the Protractor test by typing:

protractor {path to your conf.js file}/conf.js

The output of a successful test looks like:

You can try running the test with intentionally wrong test criteria such as misspelt page title or incorrect number of sensors, just to see how a test result looks like with failed tests. You find all the source code at gitlab.com/yellington.

Creating an MVC structured UI using Angular

13 april, 2016/i Aeon Labs, Aeon Labs Multisensor 6, Angular, Domoticz, Frontend, Javascript, Raspberry Pi, Security, Web development, Z-Wave/av Daniel

Angular is a nice JavaScript framework for creating more structured web solutions and presenting data. As shown in previous post, jQuery works just as good, but some advantages of Angular are that your code is easier to read, you can piggy-back on the functionality of Angular meaning less development time, and it is meant for separating the view (i.e. your HTML) from the data handling – i.e. Model-View-Controller based (MVC).

Things you need to have a fair understanding of to follow this post

A fair knowledge of HTML, CSS, and JavaScript
The basics of Angular suchs ”ng directives” and ”controller”
It’s good to check this previous post since we will go from a jQuery based solution to Angular

Breaking our web app into html, css, and JavaScript

In the end we will have an identical user interface with the same frontend functionality as we did with jQuery.

However one of the main end benefits of using Angular will be a cleaner structure when it comes to separating the presentation layer (i.e the html view) and the data handling (i.e. the Angular part). We will start by breaking our web app into three files:

index.html – this is the clean html frontend
sensorApp.js – this is where we implement the controller logic to update the data in the html view
sensorApp.css – this is simply the css styles we used previously, unchanged but broken out in a separate file

Updating our index.html with adequate ng directives

We start by ”Angular-ify” our html view by adding necessary ng directives and bindings. This will allow us to use these spaces from our Angular controller to populate the html view with sensor data. We add the ”ng-app” and ”ng-controller” directives in the <html> tag, and link our css file, the Angular framework and our sensorController.js file in the <head>.

[code language=”html”]
<!DOCTYPE html>
<html ng-app="mySensorApp" ng-controller="sensorCtrl">
<head>
<title>Home Security Frontend</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="http://code.jquery.com/jquery.js"></script>

<!– Bootstrap –>
<script src="js/bootstrap.min.js"></script>
<link href="css/bootstrap.min.css" rel="stylesheet" media="screen">

<!– Angular –>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<script src="sensorController.js"></script>

<div class="container">
…
[/code]

Next we structure the ”container” part of our html file in three sections corresponding to the Bootstrap rows: the top row, the home security status row, and the sensor boxes row.

[code language=”html”]
<div class="container">
<!– The top row for the logo and the time –>
<div class="row">
<div class="col-sm-12" id="top-bar">
<img id="yellington_logo" src="https://www.yellington.com/yellington_logo.png">
<div id="clock">{{clock | date: ’HH:mm:ss’}}</div>
</div>
</div>

<!– The home security status row –>
<div class="row">
<div class="col-sm-6 v-align" style="text-align: right;">
<span class="glyphicon glyphicon-home" id="house-image"></span>
</div>
<div class="col-sm-6 v-align" id="house-status-text"><!– keep the opening and closing div tags together to avoid white space causing line breaks in the user interface–>
<h5>Home Security Status</h5>
<h2>{{homeSecurityStatus}}</h2>
</div>
</div>

<!– The row for the sensor boxes –>
<div class="row" id="sensor-container">
<div ng-repeat="sensor in sensorData" class="col-sm-6 col-md-4 col-lg-3 sensor-outer-box">
<div class="sensor-box">
<img class="sensor-icon" ng-src={{getSensorImage(sensor.Type)}}>
<div class="sensor-data">
<h4>{{ sensor.Name }}</h4>
<h5>Status: {{ sensor.Data }}</h5>
Updated: {{ sensor.LastUpdate }}
</div>
</div>
</div>
</div>

</div><!– Container –>
</body>
</html>
[/code]

In the top row, we have added an Angular expression for binding clock data to our html, likewise in the home security status row, and in the sensor data row for sensor data. The ng-repeat directive is a neat thing that will assist us going through the retrieved sensor data from the server. The html view has no clue where this data comes from or how or when it should be updated. This logic is handled by the controller.

Adding an Angular controller for updating the data

Angular uses a ”controller” to take care of the logic for updating the data in the presentation view i.e. the html. We create a controller that looks like this and is linked together with our html file.

[code language=”javascript”]
var app = angular.module(’mySensorApp’, []);
app.controller(’sensorCtrl’, function($scope, $http, $timeout) {
var domoticzURL = "http://192.168.1.99:8080/"; //use this format if you want to place this file on another computer on your home network.
//var domoticzURL = "../"; //use this format if you place this file in a folder in the www folder on your Domoticz server.

updateSensorData(); //Start the polling of sensor data

function updateSensorData() {
//Publish the time in our user interface
$scope.clock = new Date();

//We request a list of all sensor data and loop through it to publish on our web page
$http.get(domoticzURL + "json.htm?type=devices&filter=all&used=true&order=Name")
.then(function(response) {

$scope.sensorData = response.data.result;

//We retrieve the status of the security system, basically Disarmed, Armed Away, or Armed Home
$http.get(domoticzURL + "json.htm?type=command&param=getsecstatus")
.then(function(response) {

if (response.data.secstatus==0) $scope.homeSecurityStatus = "Disarmed";
else if (response.data.secstatus==1) $scope.homeSecurityStatus = "Armed Home";
else if (response.data.secstatus==2) $scope.homeSecurityStatus = "Armed Away";
else $scope.homeSecurityStatus = "Unknown";

$timeout(updateSensorData(), 1000); //Poll the sensor data every second
});
});
}

$scope.getSensorImage = function(sensorType){
//This function returns the image of the sensor that is stored in the image folder on your Domoticz server
//The list of sensor types can be expanded dependant on what type of sensors you have
switch(sensorType) {
case "Light/Switch":
return domoticzURL + "images/Light48_On.png";
break;
case "Temp + Humidity":
return domoticzURL + "images/temp-20-25.png";
break;
default:
return domoticzURL + "images/Light48on.png";
}
};
});
[/code]

What’s inside the curly brackets of the app.controller is the constructor of the controller class and will execute at the time of launching the web app. You will probably recognize most of the code from the jQuery version. We have an updateSensorData() function that retrieves the sensor data through http requests along with a timer to poll the server every second. The getSensorImage() is used by the html view to retrieve the corresponding url for the src attribute.

Final conclusion

Using Angular might require some time to get a feeling for how it works and how to utilize the built-in functionality. Once over that learning curve, it’s a nice framework to use. Counting the lines of code from the jQuery version and the Angular version gives us that jQuery required 142 lines of code whereas Angular required 117 – an 18% improvement. However, the biggest improvement is an increase in readability and structure and thus maintainability.

Creating a beautiful front-end for Domoticz

10 mars, 2016/i Aeon Labs, Aeon Labs Multisensor 6, Domoticz, Events, Frontend, Javascript, Raspberry Pi, Security, Web development, Z-Wave/av Daniel

In a previous post (here), we created a simple front-end for Domoticz running on a Raspberry. In this post, we’ll take it a step further and style it a bit to look beautiful. It’s good if you go through the previous post first since we are going to build on that code base.

Areas you need to be familiar with to follow this post

Code base used in previous post (here)
Bootstrap (you can download it here)
CSS

Starting with the design

At the end of this post we want to have a design of our user interface looking like this:

Adding the Bootstrap structure to the HTML file

We have downloaded Bootstrap and extracted the folders in the folder where we have our HTML file from previous post. We add the following two lines of code to include the Bootstrap CSS and JS libraries.

[code language=”html”]
<!DOCTYPE html>
<html>
<head>
<title>Home Security Frontend</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="http://code.jquery.com/jquery.js"></script>
<!– Bootstrap –>
<script src="js/bootstrap.min.js"></script>
<link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
</head>
<body>
[/code]

Adding rows for the Bootstrap structure

In the body of our HTML file, we add three Bootstrap rows. The first one is for adding a nice logo and a ticking clock, the second one is for adding the house icon and the status of the security panel, and the final one is for listing all the sensor information. All three rows must be wrapped in a <div> with a class labeled ”container”.

[code language=”html”]

</div>

</div>
<div class="col-sm-6 v-align" id="house-status-text"><!– keep the opening a closing div tags together to avoid white space causing line breaks in the user interface–>
</div>

</div>

</div>

[/code]

The glyphicon image is part of the Bootstrap package and we will use it as our house image in the first row. The ”v-align” class will be used in the CSS/style part of our HTML file to align the house image vertically in the middle with the status text of the security panel. Keeping <div></div> on line 14 together is intentional to avoid adding any whitespace when rendering the two columns on the same row in the browser.

Expanding the JavaScript functionality

We will expand the JavaScript part of our HTML file with the following:

Wrap the functionality of updating the sensor data in a separate function: updateSensors()
Add a function: getSensorImage() to borrow some nice looking sensor images from Domoticz
Add the time in the top row. This will be a ticking clock since we update the data automatically with one-second intervals
Fetch the status of the security panel
Finally set a timer with a one-second interval to update all data automatically.

The script code looks like this:

[code language=”javascript”]
<script>
$(document).ready(function(){

var domoticzURL = "http://192.168.1.99:8080/"; //use this format if you want to place this file on another computer on your home network.
//var domoticzURL = "../"; //use this format if you place this file in a folder in the www folder on your Domoticz server.

$(function() {
updateSensors();
});

function getSensorImage(sensorType){
//This function returns the image of the sensor that is stored in the image folder on your Domoticz server

var sensorURL = "";

//The list of sensor types can be expanded dependant on what type of sensors you have
switch(sensorType) {
case "Light/Switch":
return domoticzURL + "images/Light48_On.png";
break;
case "Temp + Humidity":
return domoticzURL + "images/temp-20-25.png";
break;
default:
return domoticzURL + "images/Light48on.png";
}

}

function updateSensors() {

var sensorInfo = "";

//First we publish the time in our user interface
var d = new Date();
var hours = d.getHours();
if (hours < 10) { hours = ’0’ + hours;}
var minutes = d.getMinutes();
if (minutes < 10) { minutes = ’0’ + minutes;}
var seconds = d.getSeconds();
if (seconds < 10) { seconds = ’0’ + seconds;}
document.getElementById("clock").innerHTML = hours + ":" + minutes + ":" + seconds;

//We request a list of all sensor data and loop through it to publish on our web page
$.getJSON(domoticzURL + "json.htm?type=devices&filter=all&used=true&order=Name", function(result){

for (i = 0; i < result.result.length; i++) {
sensorInfo += ’
<div class="col-sm-6 col-md-4 col-lg-3 sensor-outer-box">’+
’
<div class="sensor-box">’+
’<img class="sensor-icon" src="’ + getSensorImage(result.result[i].Type) +’">’+
’
<div class="sensor-data">’+
’
<h4>’ + result.result[i].Name + ’</h4>

’+
’
<h5>Status: ’ + result.result[i].Data + ’</h5>

’+
’

Updated: ’ + result.result[i].LastUpdate +’

’+
’</div>

’;
}

document.getElementById("sensor-container").innerHTML = sensorInfo;

//We retrieve the status of the security system, baically Disarmed, Armed Away, or Armed Home
$.getJSON(domoticzURL + "json.htm?type=command&param=getsecstatus", function(result){

var homeSecurityStatus="";

if (result.secstatus==0) homeSecurityStatus="Disarmed";
else if (result.secstatus==1) homeSecurityStatus="Armed Home";
else if (result.secstatus==2) homeSecurityStatus="Armed Away";
else homeSecurityStatus="Unknown";

document.getElementById("house-status-text").innerHTML = ’
<h5>Home Security Status</h5>

’+
’
<h2>’ + homeSecurityStatus + ’</h2>

’;

//Finally we set a timer to repeatedly poll the status of the sensors
setTimeout(updateSensors(),1000);

});
});

}

});

</script>
[/code]

Note that the final getJSON call is nested within the callback function from the first getJSON call to get the sensor data. The domoticzURL variable could either be set to the IP number of your Raspberry + port 8080 or, if you upload the HTML file in the www root of your Domoticz server, you can set it to ”../” or ”./” dependant on if you put it in a subfolder or not. If you open the HTML file in a browser it looks something like this, still not very beautiful.

Styling the user interface with CSS

For the simplicity of this post, we will put all the styling in the HTML file. You can just as well put it in a separate CSS file and include it in the <head>. We add the following styling:

[code language=”html”]
</script>

.v-align {float: none; display: inline-block;vertical-align: middle;} /*class for vertically aligning elements in a row*/

#house-image{font-size: 9em; vertical-align: middle; display: inline-block; margin-top: 10px; margin-bottom: 10px;}
#house-status-text{text-align: left;}

.sensor-outer-box {padding: 0px;}
.sensor-box{padding: 0px;margin: 5px; background-color: white; box-shadow: 5px 5px 10px #888888; border-style: solid; border-color: grey; border-width: 1px; border-radius: 5px;}
.sensor-icon{vertical-align: 80%; margin: 0px;}
.sensor-data {display: inline-block; margin: 0px;}

</style>

<div class="container">
[/code]

The result is a user interface with responsive design

Thanks to Bootstrap, we automatically get a user interface with a responsive design that works just as well on a laptop and tablet as it does on a smartphone.

On a laptop:

On a smartphone:

You can play around with the style part of the file and the Bootstrap columns definitions to completely change the look and feel of the user interface to your liking.

Creating a simple web frontend for Domoticz

8 mars, 2016/i Aeon Labs, Aeon Labs Multisensor 6, Domoticz, Frontend, Javascript, Raspberry Pi, Security, Web development, Z-Wave/av Daniel

In this post we will create a simple web user interface for Domoticz running on a Raspberry Pi. This will allow us to check the status of our sensors and the status of the security panel of Domoticz.

In order to follow the steps we go through here, you should have a fair understanding of:

HTML, Javascript, and jQuery (and ideally CSS)
JSON data format
How to upload your HTML file to your Raspberry using FTP or SFTP (useful guide)

Retrieving sensor data using JSON http request

Domoticz provides a JSON http interface for reading the sensor values remotely. Use can test it by typing a JSON http request in the address field of your web browser. If you type the below request, it should fetch all the sensor data to your browser:

192.168.1.99:8080/json.htm?type=devices&filter=all&used=true&order=Name

The response contains a lot of information.

{
   "ActTime" : 1457448022,
   "ServerTime" : "2016-03-08 15:40:22",
   "Sunrise" : "06:41",
   "Sunset" : "17:56",
   "result" : [
      {
         "AddjMulti" : 1.0,
         "AddjMulti2" : 1.0,
         "AddjValue" : 0.0,
         "AddjValue2" : 0.0,
         "BatteryLevel" : 255,
         "CustomImage" : 0,
         "Data" : "On",
         "Description" : "",
         "Favorite" : 1,
         "HardwareID" : 3,
         ---

We will create an HTML file with JavaScript that extracts the information that is relevant for us. This will primarily be the sensor name, value and time when it was last updated.

Creating a basic HTML file with a JSON http request using Javascript

We start with a basic HTML file prepared with the jQuery library included. We create one <div> element with the id ”sensor-container”. It’s within this <div> we will publish the sensor data.

<!DOCTYPE html>
<html>
 <head>
  <title>Home Security Frontend</title>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <script src="https://code.jquery.com/jquery.js"></script>
 </head>
 <body>
  <div id="sensor-container">
  </div>
 </body>
</html>

Next we add a simple script to publish the name, status and update time of the first of our sensors. This script uses a JSON http request to retrieve the data from your Domoticz server. The response data will be accessible through the callback function with the parameter ”result”.

<body>
 <script>
  $(document).ready(function(){

   //We request a list of all sensor data
   $.getJSON("http://192.168.1.99:8080/json.htm?type=devices&filter=all&used=true&order=Name", function(result){
 
 document.getElementById("sensor-container").innerHTML += '<div>'+
     '<h4>' + result.result[0].Name + '</h4>'+
     '<h5>Status: ' + result.result[0].Data + '</h5>'+
     '<p>Updated: ' + result.result[0].LastUpdate +'</p>'+
    '</div>';
   });
});
 </script>
<div id="sensor-container">
</div>

To extract the desired data we access the ”result” array by indexing it with the number of the sensor. The number [0] corresponds to the first sensor in the array. The HMTL file with the JSON scripts gives the following output in our browser when we run it from our laptop.

Our power plug
Status: On
Updated: 2016-03-08 19:21:00

It’s not super beautiful but it works. The name of our first sensor is ”Our power plug”, the status in ”On” and it the information was last updated 19:21. Since we want to make our frontend work with all the sensors with have set up with Domoticz, we simply have to loop through the ”result” array given to us in the JSON http request. We update our scripts with a for loop like this.

<script>
 $(document).ready(function(){

  var sensorInfo = "";

  //We request a list of all sensor data and loop through it to publish on our web page
  $.getJSON("http://192.168.1.99:8080/json.htm?type=devices&filter=all&used=true&order=Name", function(result){
 
   for (i = 0; i < result.result.length; i++) { 
    sensorInfo += '<div>'+
                   '<h4>' + result.result[i].Name + '</h4>'+
                   '<h5>Status: ' + result.result[i].Data + '</h5>'+
                   '<p>Updated: ' + result.result[i].LastUpdate +'</p>'+
                  '</div>';
   }
 
   document.getElementById("sensor-container").innerHTML = sensorInfo;
 
  });
 });
</script>

This gives an output in a browser that shows the status of all our sensors.

Our power plug
Status: On
Updated: 2016-03-08 19:21:00
Our motion sensor
Status: Off
Updated: 2016-03-08 11:06:46
Temperature & Humidity
Status: 22.2 C, 34 %
Updated: 2016-03-08 20:16:54
Sound Siren Dummy
Status: Off
Updated: 2016-03-08 15:14:59

Regardless of how many sensors we have, this script will loop through them all and present their status. In an upcoming post, we’ll go through how to make this look more beautiful och also have a responsive design dependant on whether you’re using a laptop, smartphone or a tablet.

Advanced Events handling in Domoticz

18 februari, 2016/i Aeon Labs, Aeon Labs Multisensor 6, Domoticz, Events, Raspberry Pi, Security, Z-Wave/av Daniel

In previous post (can be found here) we created a simple event handler in Domoticz to control a power plug based on the events from a motion sensor. In this post we will step it up a notch and build a basic alarm system. If you are not familiar with the Events interface in Domoticz, we recommend you go through our previous post first.

Building a basic alarm system using the Events interface in Domoticz

We want our alarm system to be able to do the following once we have set up the handling of the events:

Arm/disarm the alarm system
Trigger the alarm (if armed) with a delay of 45 seconds. The reason for this is that we want to be able to enter the door and have time to disarm the alarm without triggering
Stop the siren if entering the correct pin code
Let the siren time-out after 3 minutes. The alarm system will still be in ”armed” mode. If the burglar has not been scarred after 3 minutes, the siren will most likely only annoy your neighbours.

For this project, we will use the following hardware:

Raspberry with Razberry Z-Wave add-on card running Domoticz (see this post for installation instructions)
Aeon Labs Multisensor 6 (check this post for instructions how to add it in Domoticz)
Z-Wave power plug (check this post for adding it in Domoticz) (This will act as our siren)

We will be using the Z-Wave Power Plug to switch on a lamp instead of a siren, since it’s more friendly for our ears while developing. Once you’re done, it’s simple to exchange the power plug for a Z-Wave siren.

Starting with a map of states for the alarm system

Since this is a slightly more advance event handling then simply have a motion sensor control a lamp, we need to map out which states our alarm system can have during operation:

State 1: Disarmed
State 2: Armed
State 3: Motion Triggered
State 4: Sound siren!

The alarm system will switch state dependant on the events appearing. Here is how the system will jump between different states:

Person arming the system on the security panel: the system will jump to ”Armed”.
Person disarming the system on the security panel: the system will jump to ”Disarmed” regardless of previous state, the siren will be turned off.
If the system is armed and the motion sensor is triggered: the system will jump to ”Motion Triggered”
If the system is in ”Motion Triggered” after 45 seconds: the system will jump to ”Sound siren!”
The siren has sounded for 3 minutes: the system will jump to ”Armed” and the siren will be turned off. The system is ready to detect new motion.

Sketching this on a piece of paper looks something like this:

I know it looks a bit cluttered but it will be a big help when building the event handling.

Controlling events using states in Domoticz

First we need to create two things that we need for building our alarm system:

A user variable that we call: ”Alarm State”
A dummy switch that we call: ”Sound Siren”

Creating a user variable in Domoticz

Go to the Domoticz ”Setup” drop-down menu and select ”More Options” -> ”User variables”.

Then enter the name ”Alarm State” and the variable value ”1”, and click ”Add”.

Creating a dummy switch in Domoticz

Go to the ”Setup” menu and select ”Hardware”. This view should be familiar to you by now.

Enter the name ”Sound Siren” and select ”Dummy” in the ”Type” drop-down list. Click ”Add”.

The dummy hardware appears in the list where your Raspberry is. Next, click on ”Create Virtual Sensors”.

Enter the name ”Sound Siren Dummy” and select ”Switch” in the ”Sensor Type” drop-down list. Click ”OK”. We will use this dummy switch to decide if we should start the siren. The condition is that we are in alarm state ”Motion Triggered” and that the delay time of 45 seconds has passed. Now, on to building the events handling.

Building the events handling using the Events (Blockly) interface

Select ”More Options” -> ”Events” from the ”Setup” menu. You can check the previous post if you’re not familiar with how the Events interface works (here). To arm our alarm system, we build the following event handler.

This will move the alarm system from state 1 (Disarmed) to state 2 (Armed). You find the ”Alarm State” variable in the category ”User variables” in the left side menu. The ”Security status” switch is found in the ”Security” category and is directly controlled by the Domoticz security panel that we will use later on. We save the event with the name ”Arm alarm”. Don’t forget to tick the check box ”Event active”. Next we create an event handler for disarming the alarm system.

This event handler puts the alarm system in state 1 (Disarmed) regardless of previous state. We also sets our Z-Wave power plug to ”Off” since this represents our siren and we want the siren to be turned off once a valid pin code is entered on the security panel. Most often the siren is not on when someone enters the pin code since the most common use case is that you enter the pin code as soon as you open the door. In this case you have 45 seconds to disarm the alarm system before the siren goes off. We also make sure the dummy switch ”Sound Siren Dummy” is set to ”Off”. We save this event handler with the name ”Disarm alarm”. Next we will create the event handler for state 2 (Armed).

This event handler captures the event of the motion sensor, puts the alarm system in state 3 (Motion Triggered), and starts a timer to sound the siren after 45 seconds. This time allows the owner of the house to disarm the alarm system without the siren going off. Save it as ”Motion triggered”. We’re almost done, we now make the event handler for jumping from state 3 to state 4 (Sound siren!).

If we get the event of ”Sound Siren Dummy” after the 45 seconds time delay in state 3, we should sound the siren. We also sets a 3 minute (180 seconds) time-out on the siren. Save this as ”Sound siren”. Finally we need to create an event handler for state 4 (Sound siren!).

This will turn off the siren after 3 minutes and put the alarm system in state 2 (Armed) and the system will be ready to detect new movement. We save this event handler as ”Siren time-out” which will give us the following complete list of event handlers:

Next we go on to using the security panel of Domoticz.

Using and configuring the security panel in Domoticz

If you go to the ”Setup” menu and select ”More Options” -> ”Security Panel”, you see this view.

With this panel, you can arm and disarm the alarm system with just built. You can select the pin code in the ”Setup” menu under ”Settings”. Here you can also set a delay time in order for you to have time to exit your house before the alarm system is armed. Once you have tested the alarm system to make sure it works ok, you can replace the Z-Wave power plug with a Z-Wave siren.

Using Events in Domoticz

5 februari, 2016/i Aeon Labs, Aeon Labs Multisensor 6, Domoticz, Events, Raspberry Pi, Z-Wave/av Daniel

In previous post we learned how to group two devices (post can be found here). In this post we will use the Events interface in Domoticz to tell a switch to act on a certain event that appears. We make sure that we have ”ungrouped” our Multisensor and Z-Wave power plug from previous post, since we are going to use events instead in this post. You ungroup in the same ”Groups & Network” view showed in previous post. In this post we will use Events in Domoticz to control a Z-Wave power switch when an Aeon Labs Multisensor is triggered.

Equipment used in this post to control using Events in Domoticz

We will be using the same equipment as previous post:

Raspberry with Razberry Z-Wave add-on card running Domoticz (see this post for installation instructions)
Aeon Labs Multisensor 6 (check this post for instructions how to add it in Domoticz)
Z-Wave power plug (check this post for adding it in Domoticz)

Opening the Events interface in Domoticz

You find the Events editor by selecting ”More Options” in the ”Setup” menu and the select ”Events”.

In the Events editor. You find a list of categories on the left. You can see this as the toolbox of blocks you will be using to control and manage your events. Click on the first entry in the list ”Control”.

You see two blocks that looks like pieces in a puzzle, which they in fact are. We will be combining puzzle pieces in order to control our Z-Wave power plug when our Aeon Labs Multisensor is triggered. We start by dragging the first ”If/Do” block piece to the white work space.

This ”If/Do” block will allow us to ”do” something ”if” something else happens. If you’re a programmer, this is simple for you. If not, you will understand when you go through the next steps. Since we want to DO turn on our Z-Wave power plug IF our motion sensor is triggered, we go to ”Devices” and select ”Switches”. Here we find our motion sensor.

We click on ”Our motion sensor” in order for it to appear next to the ”If/Do” block that we place on the work space.

We do the same thing with our Z-Wave power plug.

Now, to control the logic so that the power plugs turns on when the motion sensor is triggered we need some additional logic blocks. Go to ”Logic”.

Select the first green block with the ”=” sign so it appears on the work space.

Go back to the ”Logic” category and select the green box that says ”On”. We now see the following blocks.

Since we want to DO something IF our motion sensor turns on, we attach the blocks to one another like this:

We almost done, but the power plug block is still not connected. We need a ”Set” block and an ”On” block to trigger the power plug. Select these from the ”Logic” category as you did with the previous blocks.

We connect these blocks to the ”Do” part.

The logic won’t just work yet. We need to save it.

On the right side in Domoticz, enter a name of your choice, tic the ”Event active” box, and click ”Save”. If you now trigger the motion sensor, the Z-Wave power plug turns on. Yes! If you want the power plug to turn off when the motion sensor turns off, you can build the following logic. Don’t forget to save it for it to work.

The Aeon Labs motion sensor has a default time out set to 4 minutes.

In upcoming posts we will go through how to make more advanced logic using the Events editor in Domoticz.

Grouping an Aeon Labs Multisensor with a Z-Wave power plug in Domoticz

2 februari, 2016/i Aeon Labs, Aeon Labs Multisensor 6, Raspberry Pi/av Daniel

The Z-Wave technology allows for building a home automation network of sensors and switches. These sensors and switches, also called nodes, can communicate with each other through a central Z-Wave controller (i.e. a hub) or directly with each other. In this post we will show how to group an Aeon Labs motion sensor (actually a multisensor) with a Z-Wave power plug. By grouping these two nodes they can communicate independently of the central Z-Wave controller. That means I can turn off or remove the central Z-Wave controller and the communications between the Multisensor and the Z-Wave power plug still works. The setup we will go through here will be able to turn on a lamp when someone triggers the motion sensor.

What equipment do we use to group the Aeon Labs Multisensor with a Z-Wave power plug?

Raspberry with Razberry Z-Wave add-on card running Domoticz (see this post for installation instructions)
Aeon Labs Multisensor 6 (check this post for instructions how to add it in Domoticz)
Z-Wave power plug (check this post for adding it in Domoticz)

Grouping the Multisensor and the Z-Wave power plug

In Domoticz, go to the ”Nodes” list for your Raspberry controller. You do this by selecting ”Hardware” in the ”Setup” menu in the upper right corner of Domoticz.

Then click on the blue ”Setup” button. Now you should see the ”Nodes” list. Go on by selecting ”Groups & Network” from the ”Node management” drop down menu.

In the table of nodes and groups, you can see which nodes are associated to which groups. Each node can add other nodes to its groups to make the added nodes listen to certain events without the need for going through the central Z-Wave controller (in our case our Raspberry unit). What we want to do is to turn on the lamp connected to our Z-Wave power plug when someone triggers the Aeon Labs motion sensor.

In our case, node number 6 is the Aeon Labs Multisensor 6 and node number 5 is the Z-Wave power plug. Node number 1 is the controller (i.e. our Raspberry). To make our Z-Wave power plug turn on and thus turn on our lamp, we need to add it to Group 1 of the Aeon Multisensor. So, we go to the row for node number 6 and click on the blue ”+” button next to the number ”1”.

In the pop-up box, we enter ”5” since this is the number of our Z-Wave power plug who should get the information that the motion sensor is triggered. Click ”Save”.

You might have to close the ”Groups & Network” view and open it again for the group information to be updated. Now, node number 5 should be visible in group 1 of the Multisensor (i.e. node 6). At the dashboard off Domoticz, we ensure our Z-Wave power plug is turned off and that the motion sensor is not triggered already.

We test if our group association between the Aeon Labs Multisensor and the Z-Wave power plug works by triggering the motion sensor (i.e. waving our hand in front of the sensor). And…

…yes it works! Success! If you wait until the motion sensor times out (default it’s 4 minutes), the lamp should go off since the Z-Wave power plug listens to the ”off” signal from the motion sensor. This only works if no motion is detected during these 4 minutes. You can also verify that the association between the motion sensor and the Z-Wave power plug works without the central controller, by simply turning off the Raspberry.

In future posts we will go through how to do more advanced controlling of sensors and switches by programming states, events and timers.

Adding a Z-Wave power plug in Domoticz

29 januari, 2016/i Raspberry Pi/av Daniel

It’s time to add our first device to our Z-Wave network consisting of:

Raspberry Pi 2 Model B
Razberry add-on card
Domoticz home automation software running on our Raspberry

If you’re new to Z-Wave it’s recommended to start with a simple sensor such as a power plug. If you start with a 110 dB siren, you might have to go through a bit of configuring in front of your laptop using ear plugs until you get all the settings right. So, start simple and then build from there since that’s the beauty of Z-Wave; once you have a small network up and running, you can add devices stepwise.

Adding our power plug in Domoticz

Make sure your Raspberry is up and running with Domoticz (check this post if you need guidance). Open up the Domoticz user interface in the browser of your laptop.

In the ”Setup” menu select ”Hardware”.

Click on the ”Setup” button on the row of your Razberry unit.

In the ”Node management” dropdown list, click on ”Include Node”.

For our Z-Wave power plug, it’s now enough if we simply plug it into the wall outlet. It will automatically enter inclusion mode. Other devices might require that you push a physical button on them. This is usually explained in the user manual of your Z-Wave device you’re going to add to your Z-Wave network.

Now, our Z-Wave power plug is added to our Z-Wave network. It’s currently a very small network with one controller (i.e. the Razberry) and one device (i.e. the power plug). In the ”Setup” menu, select ”Devices”.

Here you can click on the light bulb icon to turn on and off the power plug. Make sure you have a lamp plugged in to the plug to really feel the magic as you wirelessly control the power plug through Z-Wave.

To make the switch appear under the ”Switches” tab, we click on the green arrow located on the right side in the row of the power plug.

We name it ”Our power plug” and click ”Add Device”.

When we click on the ”Switches” tab, we see our power plug. If you want the device to appear on the ”Dashboard” you simply click on the little star in the power plug box (under the bulb icon).

In future posts, we will go through how to connect a sensor with this power plug so you can trigger the lights to go on when someone enters the room. The same steps can be used to trigger a siren or make a curtain go up when the sun light level decrease below a defined level.

Installing Domoticz on your Raspberry with Razberry

27 januari, 2016/i Raspberry Pi/av Daniel

So, like us, you’re into the fantastic world of Z-Wave, which is a great wireless technology for the whole Internet of Things and home automation fields. We will guide you step by step how to install the home automation software ”Domoticz” on to your Raspberry equipped with the Z-Wave add-on card called Razberry (easy to mix up Raspberry and Razberry). We like Domoticz because it has a relatively intuitive and nice looking user interface.

What do you need to get Domoticz up and running with your Raspberry and Razberry?

A Raspberry Pi (we use version 2). To install Domoticz, we’ll connect remotely to our Raspberry using the command line interface on our Mac. If you need guidance how to remotely connect to your Raspberry, follow these steps.
The Razberry add-on card

Plugging in the Razberry add-on card on top of our Raspberry

A good rule of thumb is to always unplug the power from your Raspberry before you plug in or unplug keyboards, mouse, ethernet cables etc. So we unplug the power and then carefully plug in the Razberry card on top of our Raspberry’s GPIO pins 1-10.

The GPIO pins are the pins facing upwards located along the upper side of the Raspberry in the above image. Now, that’s it hardware wise. Make sure the ethernet cable is connected to your home network and then power up the Raspberry again.

Installing the Domoticz software

It’s recommended to make sure the operating system files on your Raspberry is up to date. Here is a guide how you make sure your Raspberry is up to date. Once your Raspberry is powered on, we’re going to install the Domoticz software. We log in to our Raspberry from our laptop. To install the Domoticz software we type the commands below. This creates a folder a installs the software. Note! the character ”l” in ”armv7l” is not a one, it’s the letter ”l”.

   mkdir ~/domoticz
   cd ~/domoticz
   wget http://domoticz.sourceforge.net/domoticz_linux_armv7l.tgz
   tar xvfz domoticz_linux_armv7l.tgz
   rm domoticz_linux_armv7l.tgz

Make Domoticz start up when Raspberry starts up

Type these commands to make the Domoticz service start up when your Raspberry starts up:

   sudo cp domoticz.sh /etc/init.d
   sudo chmod +x /etc/init.d/domoticz.sh
   sudo update-rc.d domoticz.sh defaults

Reboot your Raspberry by typing:

   sudo reboot

Now connect with a browser on your laptop to see if Domoticz is up and running. In the address field of your browser on your laptop, enter the IP address of your Raspberry followed by ”:8080” . In our case it’s ”192.168.1.99:8080”. It should look like this:

Making Domoticz aware of our Razberry add-on card

Domoticz is made for Z-Wave hardware connected on the USB ports of the Raspberry. Since our Razberry add-on card is connected to the GPIO pins and not a USB port, we need to make a small configuration within Domoticz so Domoticz can speak to the Razberry add-on card. Type the following command in the command line interface:

   sudo nano /etc/udev/rules.d/09-tty.rules

This will open up a basic text editor where you should enter the following text. Press ctrl + O to save the file, and press ctrl + X to exit the text editor.

You have now created a link to a port that Domoticz can use to speak to your Razberry add-on card. Then restart your Raspberry:

   sudo reboot

Configuring Domoticz from the web interface

Once the Raspberry has restarted, we access the Domoticz web interface again by entering the IP address of our Raspberry + portnumber 8080 in the address field of our web browser on our laptop. In our case it’s 192.168.1.99:8080.

Go to the Setup menu and select Hardware.

Make sure ”Enabled” is ticked, and select a name of your choice in the ”Name” field. We choose ”Razberry”. From the drop-down list ”Type”, select ”OpenZWave USB”, and from the drop-down list ”Serial Port” select ”/dev/ttyUSB20”. You probably recognize this as the link we created using the text editor. Finally click ”Add”.

Your Razberry can now speak to Domoticz. Well done! In future posts we will go through how to add your first Z-Wave devices using Domoticz.

References: www.domoticz.com/wiki/Installing_and_running_Domoticz_on_a_Raspberry_PI
www.vesternet.com/resources/application-notes/apnt-85#.Vqicy1MrJE4

Updating the software of your Raspberry

27 januari, 2016/i Raspberry Pi/av Daniel

It’s always good to ensure the operating system of your Raspberry is up to date. You can type the commands listed below directly at the command line interface on your Raspberry, or as we do, through a remote log in command line interface from our laptop. Here is a guide on how to remotely log in to your Raspberry in case you haven’t done it before.

Ensure your Raspberry is up to date

Make sure your Raspberry has started. Then open a terminal window on your laptop and remotely log in using the ssh command, with ”pi” as the user and, most likely, ”raspberry” as the password (if you haven’t changed the default login credentials).

It’s recommended to make sure the operating system files of your Raspberry are up to date by typing these commands. Each line needs to be followed by pressing the enter key.

   sudo apt-get update
   sudo apt-get upgrade
   sudo reboot

The commands make a lot of text output appear in the terminal window and it might take a while.

As well, it’s recommended to have the firmware up to date. When your Raspberry is rebooted, log in again from your laptop to your Raspberry and type these commands to make sure the firmware of your Raspberry is up to date:

   sudo rpi-update
   sudo reboot

Now your Raspberry should be up to date. Feels great, doesn’t it.

What do you need to start using Protractor

Uploading our Angular web app to the Domoticz server

Installing Protractor

Writing the Protractor test

Running the test

Things you need to have a fair understanding of to follow this post

Breaking our web app into html, css, and JavaScript

Updating our index.html with adequate ng directives

Adding an Angular controller for updating the data

Final conclusion

Areas you need to be familiar with to follow this post

Starting with the design

Adding the Bootstrap structure to the HTML file

Adding rows for the Bootstrap structure

Expanding the JavaScript functionality

Styling the user interface with CSS

The result is a user interface with responsive design

Retrieving sensor data using JSON http request

Creating a basic HTML file with a JSON http request using Javascript

Building a basic alarm system using the Events interface in Domoticz

Starting with a map of states for the alarm system

Controlling events using states in Domoticz

Creating a user variable in Domoticz

Creating a dummy switch in Domoticz

Building the events handling using the Events (Blockly) interface

Using and configuring the security panel in Domoticz

Equipment used in this post to control using Events in Domoticz

Opening the Events interface in Domoticz

What equipment do we use to group the Aeon Labs Multisensor with a Z-Wave power plug?

Grouping the Multisensor and the Z-Wave power plug

Adding our power plug in Domoticz

What do you need to get Domoticz up and running with your Raspberry and Razberry?

Plugging in the Razberry add-on card on top of our Raspberry

Installing the Domoticz software

Make Domoticz start up when Raspberry starts up

Making Domoticz aware of our Razberry add-on card

Configuring Domoticz from the web interface

Ensure your Raspberry is up to date

Yellington AB

Kontakta oss

Våra tjänster