Wednesday, 19 February 2014

Raspberry Pi plus TellStick equals Geek Heaven

It has been a while since I last posted but that is not to say that I am not doing anything. For a while now I have had a Raspberry Pi and it was something that when it was released caused a bit of storm. A low cost circuit board that had the ability to be programmed (used very loosely here) anyway you wish.

So knowing what this little piece of kit was capable of it was then time to add some bits to it to so I could build........... a DIY Home Automation system. I am going to control one table lamp device wirelessly with a basic web interface.

Nothing too intensive

For this kit I bought:

1. Raspberry Pi - There are additional items like SD Card, USB cables, mouse and keyboard to get setup but I won't be covering that in too much detail.
2. Tellstick - A USB transmitter that broadcasts at 433Mhz
3. 3 Home Easy plug switches HE302
4. 2 Gang wall switch with dimmer HE108

First of all get your up to date Wheezy linux distrobution. I won't go into detail on this as it is well documented.

Once you are up and running you need to install four items.

Personally I followed this order.

1. Lightppd server - web interface hosting on your own server
2. PHP5 - server side scripting
3. Mysql - Database storage for events (note to self hurry up and do the temperature sensor article)

Install 1, 2 and 3 by following the instructions here http://www.penguintutor.com/linux/light-webserver this is by far the most easy instructions I have found to date and caused no problems at all.

Next install the software on the Pi for the tellstick by following the instructions here http://elinux.org/R-Pi_Tellstick_core Once you are done there all you need to do is drop the following code into a file called "index.php"

 <?php

include 'temp.php';
?>
<!DOCTYPE HTML>
<html lang="en">
<head>
<link rel="stylesheet" href="css/style.css">
<?php
if (isset($_POST['RedON']))
{
exec("python /var/www/pifaceon.py");
}

if (isset($_POST['RedOFF']))
{
exec("python /var/www/pifaceoff.py");
}

if (isset($_POST['plugon']))
{
exec("/usr/local/bin/tdtool -n 1");
}
if (isset($_POST['plugoff']))
{
exec("/usr/local/bin/tdtool -f 1");
}

if (isset($_POST['plugon1']))
{
exec("/usr/local/bin/tdtool -n 101");
}

if (isset($_POST['plugoff1']))
{
exec("/usr/local/bin/tdtool -f 101");
}

if (isset($_POST['allon']))
{
exec("python /var/www/pifaceon.py");
exec("/usr/local/bin/tdtool -n 1");
exec("/usr/local/bin/tdtool -n 101");
}
if (isset($_POST['alloff']))
{
exec("/usr/local/bin/tdtool -f 1");
exec("/usr/local/bin/tdtool -f 101");
exec("/usr/local/bin/tdtool -f 4");
exec("python /var/www/pifaceoff.py");
}

if (isset($_POST['microon']))
{
exec("/usr/local/bin/tdtool -n 7");
}

if (isset($_POST['microoff']))
{
exec("/usr/local/bin/tdtool -f 7");
}

if (isset($_POST['livingroom']))
{
exec("/usr/local/bin/tdtool -n 4");
}

if (isset($_POST['livingroom']))
{
exec("/usr/local/bin/tdtool -f 4");
}




?>

  <title>Tell Stick Plug Control</title>
</head>
<body>
<h1 style="text-align: center;">Mawston Mansion</h1>

<div class="container">
    <div class="de">
        <div class="den">
          <div class="dene">
            <div class="denem">
              <div class="deneme">
            <span><? echo $temp; ?></span><strong>&deg;c</strong>
              </div>
            </div>
          </div>
        </div>
    </div>
</div>


<p>Select the device you wish to turn on and off?</p>
<br>
<?
//$ipaddress = $_SERVER["SERVER_NAME"];
//echo $ipaddress;
?>
<form method="post">
  <table
 style="width: 75%; text-align: left; margin-left: auto; margin-right: auto;"
 border="0" cellpadding="2" cellspacing="2">
    <body>

</div>


<div height: 50%;>
      <tr>
        <td style="text-align: center;"><b>Device On</b></td>
        <td style="text-align: center;"><b>Device Off</b></td>
   
      </tr>
      <tr>
        <td style="text-align: center;"><button class="button" name="RedON">Lamp On</button></td>
        <td style="text-align: center;"><button class="button" name="RedOFF">Lamp Off</button></td>
<tr/>
<tr>
        <td style="text-align: center;"><button class="button" name="plugon">Downstairs TV On</button></td>
        <td style="text-align: center;"><button class="button" name="plugoff">Downstairs TV Off</button></td>
      </tr>

<tr>
        <td style="text-align: center;"><button class="button" name="plugon1">Upstairs TV On</button></td>
        <td style="text-align: center;"><button class="button" name="plugoff1">Upstairs TV Off</button></td>
      </tr>
<tr>
        <td style="text-align: center;"><button class="button" name="allon">Coming Home On</button></td>
        <td style="text-align: center;"><button class="button" name="alloff">Going Out Off</button></td>
      </tr>

<tr>
        <td style="text-align: center;"><button class="button" name="microon">Nuke the food</button></td>
        <td style="text-align: center;"><button class="button" name="microoff">No Nukes, No Nukes</button></td>
      </tr>

<tr>
    <td style="text-align: center;"><button class="button" name="livingroom">Livingroom On</button></td>
        <td style="text-align: center;"><button class="button" name="livingroom">Livingroom Off</button></td>
      </tr>
<tr>
        <td style="text-align: center;"><button class="button" name="livingroom1">Youtube On</button></td>
        <td style="text-align: center;"><button class="button" name="livingroom1">Youtube Off</button></td>
      </tr>
    </body>
  </table>
</form>

<p>

<?

?>
</p>
</div>

</body>
</html>

Create another folder within www called "css"

Within the folder of css create a file called "style.css" and insert the following code

h1
{
color: white;
}

body
{
background-size:cover;
background: -webkit-radial-gradient(circle, #1a82f7, #2F2727);
color: white;
padding:50px;
margin:0px;
width:100%;
height:50%;
}
div
{
display:block;
}


.button {
   border-top: 1px solid #96d1f8;
   background: #65a9d7;
   background: -webkit-gradient(linear, left top, left bottom, from(#3e779d), to(#65a9d7));
   background: -webkit-linear-gradient(top, #3e779d, #65a9d7);
   background: -moz-linear-gradient(top, #3e779d, #65a9d7);
   background: -ms-linear-gradient(top, #3e779d, #65a9d7);
   background: -o-linear-gradient(top, #3e779d, #65a9d7);
   padding: 5px 10px;
   -webkit-border-radius: 8px;
   -moz-border-radius: 8px;
   border-radius: 8px;
   -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
   -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
   box-shadow: rgba(0,0,0,1) 0 1px 0;
   text-shadow: rgba(0,0,0,.4) 0 1px 0;
   color: white;
   font-size: 14px;
   font-family: Georgia, serif;
   text-decoration: none;
   vertical-align: middle;
   }
.button:hover {
   border-top-color: #28597a;
   background: #28597a;
   color: #ccc;
   }
.button:active {
   border-top-color: #1b435e;
   background: #1b435e;
   }
#content
{
height: auto:
width: auto:
}

h1
{
color: white;
}

body
{
background-size:cover;
background: -webkit-radial-gradient(circle, #1a82f7, #2F2727);
color: white;
padding:50px;
margin:0px;
width:100%;
height:50%;
}
div
{
display:block;
}


.button {
   border-top: 1px solid #96d1f8;
   background: #65a9d7;
   background: -webkit-gradient(linear, left top, left bottom, from(#3e779d), to(#65a9d7));
   background: -webkit-linear-gradient(top, #3e779d, #65a9d7);
   background: -moz-linear-gradient(top, #3e779d, #65a9d7);
   background: -ms-linear-gradient(top, #3e779d, #65a9d7);
   background: -o-linear-gradient(top, #3e779d, #65a9d7);
   padding: 5px 10px;
   -webkit-border-radius: 8px;
   -moz-border-radius: 8px;
   border-radius: 8px;
   -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
   -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
   box-shadow: rgba(0,0,0,1) 0 1px 0;
   text-shadow: rgba(0,0,0,.4) 0 1px 0;
   color: white;
   font-size: 14px;
   font-family: Georgia, serif;
   text-decoration: none;
   vertical-align: middle;
   }
.button:hover {
   border-top-color: #28597a;
   background: #28597a;
   color: #ccc;
   }
.button:active {
   border-top-color: #1b435e;
   background: #1b435e;
   }
#content
{
height: auto:
width: auto:
}

@import url(http://fonts.googleapis.com/css?family=Dosis:200,400,500,600);
html, body { height: 100%; }

.container { width: 300px; margin: 10px auto 0; }
.de .den, .de .dene, .de .denem, .de .deneme { position: absolute;  left: 50%; top: 50%; }
.de {
    position: relative;
    width: 240px;
    height: 240px;
    border-radius: 100%;
    box-shadow: 0 0 10px rgba(0, 0, 0, .1);
    background-color: transparent;
}
.den {
    position: relative;
    width: 210px;
    height: 210px;
    margin: -105px 0 0 -105px;
    border-radius: 100%;
    box-shadow: inset 0 2px 10px rgba(0, 0, 0, .5), 0 2px 20px rgba(255, 255, 255, 1);
    background: #df3341;
    background: -moz-linear-gradient(left, #df3341 0%, #d4f355 50%, #61c0ec 100%);
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,#df3341), color-stop(50%,#d4f355), color-stop(100%,#61c0ec));
    background: -webkit-linear-gradient(left, #df3341 0%,#d4f355 50%,#61c0ec 100%);
    background: linear-gradient(to right, #df3341 0%,#d4f355 50%,#61c0ec 100%);
    position:relative;
}
.dene {
    width: 180px;
    height: 180px;
    margin: -90px 0 0 -90px;
    border-radius: 100%;
    box-shadow: inset 0 2px 2px rgba(255, 255, 255, .4), 0 3px 13px rgba(0, 0, 0, .85);
    background: #f2f6f5;
    background: -moz-linear-gradient(top, #f2f6f5 0%, #cbd5d6 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f2f6f5), color-stop(100%, #cbd5d6));
    background: -webkit-linear-gradient(top, #f2f6f5 0%, #cbd5d6 100%);
    background: -o-linear-gradient(top, #f2f6f5 0%, #cbd5d6 100%);
}
.denem {
    width: 160px;
    height: 160px;
    margin: -80px 0 0 -80px;
    border-radius: 100%;
    background: #cbd5d6;
    background: -moz-linear-gradient(top, #cbd5d6 0%, #f2f6f5 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #cbd5d6), color-stop(100%, #f2f6f5));
    background: -webkit-linear-gradient(top, #cbd5d6 0%, #f2f6f5 100%);
}

.deneme {
    padding: 3px 10px 0 10px;
    width: 120px;
    height: 137px;
    display: inline-block;
    margin: -60px 0 0 -60px;
    color: #555;
    text-shadow: 1px 1px 1px white;
    font-family: 'Dosis';
    font-size: 50px;
    font-weight: 400;
    text-align: center;
}
.deneme span { position: absolute; left: 1px; top: 27px; font-size: 58px; font-weight: 200; }
.deneme strong { position: absolute; right: 10px; top: 15px; font-size: 28px; }

If you need guidance on the set up of the tell stick and pairing my video 'How to pair Home Easy Plug to Raspberry Pi with Tell stick' will give you the relevant code but for more comprehensive understanding please visit http://developer.telldus.com/wiki/TellStick_conf as this will give you all the information you need.

You will notice that there is an element of the webpage that is geared up for getting temperature readings. All you need to do create a file called temp.php in your 'www' folder and add the following code.

<?php
//File to read
$file = '/sys/bus/w1/devices/28-000003dcfad1/w1_slave';

//Read the file line by line
$lines = file($file);

//Get the temp from second line
$temp = explode('=', $lines[1]);

//Setup some nice formatting (i.e. 21,3)
$temp = number_format($temp[1] / 1000, 1, '.', '');


?>

Once you have done this you need to wire up your DS182b 1 wire temperature sensor. I have done the following two videos to help.



How to get Temperature readings from DS18b20 for the Raspberry Pi

If you follow the instructions in both videos you need do nothing else!

As a note if you put your Raspberry Pi outside of your firewall you will then be able to remotely control the plugs anywhere where you can get access to your IP address.