Home Automation Dashboard (HAD)


(Florian Z) #1

All the lights in my house are controllable through SmartThings, but not all of them are wired up to wall switches. I do have a bunch of floor and table lamps, which are hooked up to GE receptacles and plug-in lamp modules. It’s a bit of a PITA to have to bend down to actuate the modules. Whipping out my phone to launch the SmartThings Mobile app to control the lights can be cumbersome and slow, and I’m not a big fan of the idea of having physical remotes floating around the house. I wanted a solution with the immediacy of a physical switch, but some of the flexibility of the mobile app. Here is what I came up with:


This is essentially a wall mounted Nexus 7 Android tablet, which I was able to acquire for cheap. I built a custom frame using a laser cut premium walnut veneer from ponoko.com. The frame basically consists of a face- and backplate which are held together by four chrome internal hex screws. There are also internal pieces that keep the tablet aligned and in place. Initially, I planned on gluing everything together in order to keep the faceplate clean, but I figured it might not be a good idea to permanently enclose the tablet. The chrome screws are a good compromise as they allow me to open up the frame, but also serve a decorative purpose. The tablet is firmly mounted using two key hole hangers attached to the back of the frame, which rest on screws inserted into dry wall anchors.


The interface consists of a Dashing installation running on a free Heroku instance. Dashing is a really cool dashboard framework. What I love most about it is how minimalist, yet customizable it is. It’s just a few hundred lines of code on top of some widely adopted web technologies, including Sinatra, Batman.js, Gridster and Sprockets. You can easily create new backend services using Ruby, and frontend widgets using CoffeeScript, SASS and HTML.

I created a bunch of “touchable” widgets, which let me control lights, display temperature sensor readouts, see the currently set mode, set new modes and execute “Hello Home” phrases, as well as display information about the current weather and forecast. I also created a backend, which communicates with a basic SmartApp endpoint. Dashing uses Server Side Events, so events handled from inside the SmartApp are automatically pushed out to the client. Basically, when you turn on/off a light using a switch or the SmartThings app, the dashboard will automatically and instantaneously update with the new state. It doesn’t need to bang on the SmartThings cloud or the backend to continuously poll for updates (apart from the weather, which is updated every 15 minutes).

The Dashing frontend can be displayed in any browser, so it’s relatively easy to deploy multiple clients (one in every room, if you want to go crazy) or get access from your computer.

Tablet Setup

The frame doesn’t expose the physical power button on the tablet. Instead, I am using the camera as a motion detector to wake up the Nexus 7, when someone steps in front of the screen. Tasker is used to handle the motion detector events and wake up the tablet using Secure Settings without requiring root access. It’s a bit hacky, but has been working reliably, so far.
The Dashing fronted is being displayed in Firefox, because Chrome suffers from a bug that severs the connection to the Server Sent Events source when the tablet goes to sleep, and fails to resume that connection when it wakes up. To hide the annoying Android on-screen navigation controls (and status bar), I have to force the tablet into “Immersive Mode”. I am using an app for that, because the feature is a relatively new addition to Android, and not all apps properly take advantage of it, yet.

Mounting Location

I mounted the assembly in the hallway, opposite to my front door. I chose the location because it is central, yet not obtrusive. I pass through the hallway when I go to bed, or leave the house so it’s very convenient to take a look at the weather or turn on/off some lights at that point. The front-facing camera has a great view of the front door and will eventually snap pictures of anyone entering the house unexpectedly. This is also the place where a security system panel had been mounted, before I switched to SmartThings.
Conveniently, there is a storage closet on the other side of the wall. I simply drilled a small hole through the wall to feed a Micro USB cable to a wall charger in the closet. The frame hides said hole in the wall. A cleaner setup would be to install a recessed gang box with a USB outlet behind the frame. I want to evaluate the current setup, before I commit to a bigger hole in my drywall, though. The current hole is easy to close :wink:

Future Plans

I am going to add more widgets in the future. The idea is not to replace the functionality of the SmartThings app, but to display useful information about what’s happening around the house, allow for making more informed decisions and enable some basic control over devices. For example, it would be great to be alerted about open windows, before leaving the house. Also, having a widget that shows current energy consumption and realtime pricing information would be cool (Is now a good time to do the laundry or run the electric space heater?) On top of that, I want to play around with speech synthesis in order to emit audible alerts.
Lastly, it would be cool to get some NFC tags to wave around to cause certain things to happen. I don’t really have any concrete ideas for that yet, though :wink:

EDIT: Fixed the link to the Dashing website.

Wall Touchscreen Controller
Custom Graphics for UI
Anyone using instacube?
Why some SmartApps may not be publishable
Local-Only Dashboard
Low-cost rapidly implemented second hub functionality
Dashboard Theming (Custom CSS) and Mounting Hardware Ideas
Trying to like Smartthings, Wink keeps winning. Help!
Dashboard to Display Aeon Sensor Data
UK - Alarm Keypad? + General Questions
Is a tablet interface planned?
SmartThings Web Interface
ThingLayer: An open source real-time web interface for IoT
Smart Alarm is here
Using 625alex web dashboard on cheap tablet mounted on wall
Today ST made me look the fool :(
Rule Builder Status? And What does SmartThings think its demographic is and what does it want it to be?
Server Sent Event. Is it possible?
Open source community created dashboard solution Open-Dash.com - Alpha Version in Testing
(Chrisb) #2

Wow, that’s really cool!

(Geko) #3

Sholy Hucking Fit! This is awesome!

(Andy) #4

Fantastic write up! I’ve had similar ideas knocking around but this surpasses my ideas. I think this will be the motivation I needed to get started on mine, Thanks again!

(Alexis Gingras) #5

Cool. I was thinking about doing something like this. I even searched yesterday for a motion detector plugin for tasker but haven’t found any. Where did you find yours? What exactly is dashing? The link you gave doesn’t work for me.

(Matt) #6

This has got to be the coolest thing I’ve seen ST related, outside of ST itself. I was just searching the web for examples of people using PHP to interact with ST so that I could write my own dashboard to use with a nexus 7 tablet. Having a couple interfaces like this would be awesome!

(Florian Z) #7

Sorry for the broken link to Dashing. I just fixed it: http://dashing.io

As for the motion detector, I am using this app. It’s not a Tasker plugin, but a separate app that broadcasts intent, which you can use as a trigger in Tasker.

Let me know if you need any help.

(Florian Z) #8

The biggest chunk of work was building the frame. I wanted something that’s not too ugly looking. Chances are that if you have any wood working skills (which I don’t, hence the laser cut route), you’ll be able to build one much quicker :slight_smile:

I am happy to share all my code, if it helps you hit the ground running.

(Alexis Gingras) #9

Well I am really bad at woodworking. But my father do this as a hobby since he retired and he is really good at it so maybe I can convince him to do this for me… One thing for sure I wont do it myself because there is a chance I will end up loosing a few limbs! Yours look very nice. As for the code, I will read about the tech you posted here, but sure it would be nice not to start from scratch.

(Matt) #10

Sharing your code with certainly jump start the process for me and I’m sure many others.

(John) #11

Great job, thanks for the write up!!

(Geko) #12

How do you handle commands from the dashboard? Do you call REST API from the dashboard directly or through Heroku backend?

(Florian Z) #13

Through the Dashing backend.

I added a backend service for authentication and communication with the SmartApp. The JavaScript frontend speaks to the Dashing backend only. The backend relays requests to the SmartApp. This is so that the SmartApp authorization state persists regardless of what state the browser is in.

(Geko) #14

I suppose you’re able to fit everything in one dyno. Is it free or do you have to pay for CPU time? I considered building something like that using Google AppEngine, but didn’t find a good easily-customizable app framework.

(Edward Pope) #15

Excellent work here, I have been working on something similar. I like the way you handled the interface. Looks like I can learn a few things from your work (SMILE). Thank you so much for sharing, I am sure that you have many of us thinking now…

(Florian Z) #16

I am using one free Heroku dyno. So far that has been working out nicely. I’ll let you know when I hit the limited, but I’d be surprised if that happens anytime soon.

(Alexis Gingras) #17

Not sure I understand what Heroku is? When I look at their Web site it looks like a vps(containers) hosting company. If so how does it speak to you smartthings hub? Did you connect with a VPN or to smartthings cloud? Or its just that I don’t understand what Heroku is?

(Florian Z) #18

No, you are absolutely right. Heroku is basically just like a VPS. Only that the compute units are flexible, and scalable, so you can add more compute power when you need it. It’s the same concept as Amazon’s Elastic Compute Cloud, or Google’s AppEngine. In this case, since the tablet is the only client, I can get away with using Heroku’s single, free hobby/developer compute unit.

The web app running on Heroku does not speak to the SmartThings hub. Remember that all the SmartApps execute in the cloud. In fact, the SmartThings hub is simply a gateway between the cloud and your local Z-Wave/Zigbee devices. The web app running on Heroku speaks to that SmartThings cloud.

@Ben just posted a tutorial on how to create a SmartApp, which other services and apps can “talk to”. It’s a really powerful feature of SmartThings.

(Alexis Gingras) #19

Ok it’s the smartapp part I was missing. So you created one that send the data to dashing using server side event. And dashing back end send something back to your smartapp when you press a button?

(Florian Z) #20

Yes, exactly. The dashing backend speaks to the SmartApp (SmartThings cloud) and vice versa. The server sent events originate from the dashing backend and talk to the fronted (the browser running the JavaScript client app). That way, the browser does’t have to continuously “ask” the backend whether some state has changed.