Implementing a Web Solution for Tellstick Duo

A  web application for the Tellstick Duo targeting our household needs the following functions:

  • control individual switches (turn on/off lamps, and printer)
  • change schema mode (at which clock hour lamps will automatically turn/off)
  • also be usable on both android and windows phone on different screen sizes

It is all about either turning on/off switches or schema modes from a phone – best realized by using distinct and fairly large buttons. A status row is also needed to acknowledge an operation. Also the GUI should look “app-like”. Here is the end result:

In the blog post before this one, a walk through was made of the libraries needed to make a pyton web solution: cherrypy and jinja2. A little bit knowledge of html/javascript and the javascript library jquery mobile is also needed. Interaction with Tellstick Duo and setting up crontab is done using the already developed commands/libraries which are described in the former blog posts: – Using Python to Control the Telldus and – Configure Switches Using Crontab.

Below is an overview of the system design of the web application:

 html requests    +-------------------+     +--------------+
 REST API calls   |                   +---> |       |
+---------------> |    Cherrypy       |     +--------------+
                  |    Application    |
<-----------------+    python         |     +--------------+
   html           +----------+--------+---> |      |
                             ^              +--------------+
                             |   jinja2
                         | +----+ |
                         |        |
                         | +----+ |
                         |        |
                         | +----+ |

                       template page
                     html/jquery mobile/js
The cherrypy application instantiates the webserver which listens for connections on port 80. If a request is made for the main page, the template is read from flash and parsed by jinja2, in this case the schema modes and all the names of the switches are inserted into the page by jinja2. The webserver responds using the result from jinja2. Since jquery mobile is used in the main page each button is connected to a client side javascript callback. Inside the callback a REST API method call is made asynchronously to the webserver. The REST call arrives to the webserver which delegates it to a python function which in this case either calls (turn on/off switch) or (changes schema mode).

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s