QVisu lets you display the status of your smart home. Contrary to other approaches like CometVisu and SmartVisu, it is not browser-based, but a program of its own. It is based on the QT5 framework, making it portable across a wide range of platforms.

The look of the visualization is inspired by the Windows 8 tiles.

Currently, only Windows binaries are provided. Other planned targets are Linux x86 (Ubuntu) and Linux armhf (Raspberry Pi). Anyone is more than welcome to generate Android, Mac, iOS, or other versions.

This is a preliminary version, which is known to have bugs. As it does not write anything to the local disk system (with the exception of the Google calendar element, which writes some values to the registry), it should not cause any major damage to the device it is running on. Still, you use it completely at your own risk. It can and will interact with your home automation, where it can potentially cause damage. You have been warned.

QVisu is licensed under GPL v2. The Websocket driver is licensed under LGPL v2.

QVisu is currently set up to be used with the websocket driver of smarthome.py. The driver should also work with the smartvisu driver of openHAB, but this is untested.

A KNX driver (which would not require an explicit backend like smarthome.py) is also planned, but not exactly a top priority.

All configuration of QVisu is done in an XML file. The XML file has the following structure:

qvisu
  +- connection
  |
  + dimensions
  | +- w
  | +- h
  |
  +- path
  +- path
  +- ...
  |
  +- container
  |   +- element
  |   +- element
  |   + ...
  +- container
  |   +- element
  |   +- element
  |   + ...
  +- ...
 

See the included qvisu.xml as an example. The elements are described below.

Required

Describes the backend. Currently the only supported type is smartvisu.

server:port

Required

The elements of QVisu are aligned in a grid. With the sub-elements w and h, you define the grid size (w for width, h for height). QVisu will try to fill the screen with the grid, preserving the aspect ratio. When changing devices, you might need to change the grid dimensions.

Most elements are 2x2, so on a 16:9 monitor, w=16 and h=9 might be a reasonable starting point.

	width
	heigh

Optional

Defines the search paths for external files (mainly image files). If you have placed your SVG images somewhere else than the directory you are starting QVisu from, this is helpful.

You can use any number of entries.

Search Path

Required

The container is the central grouping element in QVisu. All elements which are inside a container are displayed simultaneously. Only one container is displayed at a time.

There are no special restrictions on container names (except that they must be unique). However, there are two special container names:

• main - this is the container which is displayed at startup. A container named main must be contained in the XML file, otherwise QVisu will refuse to start.
• permanent - elements inside this container will always be displayed. Intended for navigation and status elements.

	...
	...
	...

The functionality of QVisu is contained in its elements. Currently, the following elements are available:

• Selector
• Switch
• Status
• Dimmer
• Heating
• Shutter
• Plot
• Weather (based on yr.no)
• Fritz!Box call list
• Google Calendar
• Video (based on VLC)

See the element-specific pages for more details. If you find out how to link directly to these pages in Doxygen 1.8.6, let me know.

	...

Some element types might define additional tags.

Data values in QVisu are called items (as they are in smarthome.py). There is no particular naming convention for items, but the item names should match those which you use in your backend (typically smarthome.py).

When you change an item in QVisu (e.g. by pressing a button), it is updated in the backend. When an item is sent from the backend, the value is distributed to all elements and displayed by those where it is specified in the configuration.

QVisu generates a number of internal items, which can be displayed as any other (but should not be modified by elements):

• #time - current time in hh:mm format
• #time-seconds - current time in hh:mm:ss format
• #date-de - current date in dd.mm.yyyy format
• #date-int - current date in yyyy-mm-dd format
• #date-de-weekday - current date with weekday in dd.mm.yyyy format, e.g. Mo 06.07.2015
• #date-int-weekday - current date with weekday in yyyy-mm-dd format, e.g. Mo 2015-07-06
• ** Insert status items here **

You have two ways to specify a color:

• Using the #xxxxxxxx color code known from HTML. #FFFFFF is white, #000000 is black.
• Using the predefined color list, which is also based on Windows 8

The font color is calculated based on the gray tone (i.e. brightness) of the background.
On light backgrounds, it is set to black. On light backgrounds, it is set to white.

QVisu supports SVG, PNG, JPG, and GIF graphics. JPG and GIF have not yet been tested.

Icons which represent a status (i.e. on/off) can be specified in a number of ways.

• The easiest way is simply

  <sw-icon>my_icon.svg</sw-icon>

  In off-state, QVisu will then display the icon as-is. In on state, it will try to recolor the image to orange, if it is an SVG file.

• You can specify two icons for on and off state, simply separated by a comma:

  <sw-icon>icon_off.svg,icon_on.svg</sw-icon>

  This can also be used with pixel graphics.

• Automatic recoloring (SVG files only):

  <sw-icon color="..." active-color="..." color-mode="...">my_icon.svg</sw-icon>

  tag	comment
  color	default icon color (when off). Default is white.
  active-color	icon color in on mode. Default is orange.
  color-mode	Advanced use only, see below

  color-mode states how the color inside the SVG is modified:

  • color-mode="stroke": All strokes inside the SVG are recolored.
  • color-mode="fill": All fill colors inside the SVG are recolored
  • color-mode="all": Both stroke and fill colors inside the SVG are recolored
  • color-mode="replace": This is the default. QVisu tries to guess the standard color in the SVG and then replaces it.