Montag, 2. März 2015

OpenHAB Metro like Visualization

Currently I'am trying to make my home smarter. I'am a big fan of home automation and wanted a flexible gateway for using different protocols and sensors. Therefore I've started with the OpenHAB project which is a good choice if you want to connect many smarthome protocols. In my setup I'am using Z-Wave dongle and some of the Fibaro Dimmers and Shutter Modules. Furthermore I also have Philips HUE Bridge and a Bluetooth Dongle connected to the server where OpenHAB is running. The Bluetooth Dongle is used for receiving weather data from an Arduino running Bluetooth Low Energy, a temperature sensor and a wind sensor. Since I like the Metro style from Windows 8 or moreover the simple arrangement of tiles I wanted a visualization which was as simple as the Metro UI. And this visualization should of course be a website which I can access from my tablet as well. Fortunately there is a library/styling for Metro sites on After some playings I've implemented a simple visualization which uses the Metro stylings and the CometVISU on the OpenHAB server for writing and receiving item states.

Furthermore I've added the noUiSlider library for my dimming buttons.

For all of you intereseted in this Visualization I've created a Github repository under:

To start using this demonstration you can just clone this repository into your OpenHAB webapps folder and accessing it under http://OPENAHAB-IP:8080/smarthome_metro. But don't forget putting the CometVISU backend jar into your OpenHAB addons folder.

1 Kommentar:

  1. Ok, looks good. But how could I use it with my openHAB installation? Is there a generic approach to switch completely to this visualization?