Konfiguration der CometVisu

Die Konfiguration der CometVisu erfolgt durch Bearbeiten der XML-formatierten Konfigurationsdatei „visu_config.xml“ im jeweiligen Unterverzeichnis „./config“ der CometVisu-Installation. Dies kann entweder mit einem textbasierten Editor oder mit dem integrierten grafischen Editor erfolgen. Die Verwendung des grafischen Editors setzt jedoch voraus, dass die CometVisu von einem PHP-fähigen Webserver (z.B Apache oder Lighttpd) ausgeliefert wird und die Konfigurationsdatei durch diesen beschreibbar ist.

Am einfachsten greift man auf die verschiedenen Konfigurationsdateien über den Manager zu.

Je nach verwendetem Backend und der Vorgehensweisen bei der Installation befindet sich der CometVisu-Verzeichnisbaum an unterschiedlichen Stellen:

  • Soll die CometVisu mit Hilfe des knxd-daemons unmittelbar an den KNX-Bus-Telegrammverkehr angebunden werden (KNX ist dann das Backend), wird die CometVisu manuell in den Verzeichnisbaum „/var/www/visu…“ des Webservers (z.B. Apache oder Lighttpd) installiert. Der Webserver lauscht in der default-Einstellung in der Regel am Port 80.

  • Da ab Version 0.12 kein spezielles Binding mehr benötigt wird, um die CometVisu mit openHAB als Backend zu benutzen, gelten hier die selben Regeln wir bei anderen Backends. Es wird empfohlen den Docker-Container zu benutzen, wie man diesen installiert und openHAB als Backend konfiguriert wird hier beschrieben.

Soll die XML-formatierte Konfigurationsdatei „visu_config.xml“ durch den (fortgeschrittenen) Anwender direkt bearbeitet werden, ist es sehr ratsam, hierzu einen XML-fähigen Editor zu verwenden, welcher u.a. die Syntax der besseren Lesbarkeit einfärbt (z.B. Textwrangler auf MacOSX, WordPad++, Notepad++ oder MS XML Editor 2007 unter Windows und unter Linux z.B. vi mit „:syntax on“).

Allgemeine Informationen über das CometVisu XML Format findet man hier, Informationen zu den einzelnen Widgets in den jeweiligen Unterseiten.

Manche Widgets und Plugins benötigen noch zusätzliche Informationen, die nicht in der Config-Datei enthalten sein sollen, da diese frei lesbar an den Web-Browser übertragen wird (je nach installierter Umgebung kann der Transport verschlüsselt mit HTTPS erfolgen, jedoch ist der Inhalt durch den Benutzer am Browser mit entsprechenden Tricks lesbar). Durch die Verwendung der Versteckten Konfigurationen können diese Informationen auf dem besser geschützten Server verbleiben.

Nach dem Speichern ist keinerlei Neustart von Prozessen nötig, jedoch sollte man die Seite neu laden und den Browser-Cache löschen.

Wenn die XML Datei ungültig ist wird beim Laden der Visu im Webbrowser eine Fehlermeldung angezeigt. Diese gibt im Normalfall schon genaue Hinweise wo in der Datei der Fehler liegt. Man kann die Überprüfung (und Darstellung) auch mit dem Link „Check Config“ in der Fußzeile oder durch Anhängen von check_config.php an den URL erzwingen.

Genaue Beschreibungen zu den verfügbaren URL-Parameter sind unter URL-Parameter zu finden.

Seiten und Struktur der CometVisu

Grundsätzliches

Zur Visualisierung und zum Auslösen von Aktionen wie z.B. Schalten oder Jalousien verfahren bedient sich CometVisu sogenannter Widgets. Widgets können als grafische Bausteine verstanden werden, die auf einer darzustellenden Seite (= page) angeordnet werden. Ein Widget besteht aus dem eigentlichen sichtbaren Bereich, der Maus- oder Tastereignisse empfängt und weiterleitet und aus nicht sichtbaren Objekten, durch welche die Funktionsweise des Widget detaillierter festgelegt werden.

Es wird zwischen Widgets zur

  • Bedienung (hier z.B. das switch-Widget zum Schalten),

  • Darstellung (diese haben ausschließlich informative Funktion),

  • Anordnung oder Gruppierung anderer Widgets oder zur Navigation innerhalb der verschiedenen Seiten der Visualisierung (Sonstige Widgets)

unterschieden.

Eine kleine Ausnahme stellen die Plugin-Widgets dar. Diese müssen vor Verwendung in der “meta-Sektion” der Konfigurationsdatei eingebunden sein.

Arbeiten mit der Konfigurationsdatei

Der strukturierte Aufbau der xml-formatierte Konfigurationsdatei ist in mehrere Sektionen unterteilt, innerhalb derer alle weiteren Einträge verschachtelt und durch Tags umschlossen aufgenommen werden:

Die verfügbaren Designs

  • Metal - das wohl beliebteste Design

  • Pure - Standard-Design

  • Diskreet

  • Diskreet Sand

  • Diskreet Slim

  • Alaska

  • Alaska Slim

Änderung der Metal-Designs

In der Version 0.12 wurde das Metal-Design überarbeitet. Die Änderungen bestanden im Wesentlichen darin Farbverläufe, Text-Schatten und die Schriftart zu verändern um eine moderate Modernisierung zu erreichen.

Die Änderungen können jedoch wieder zurückgesetzt werden indem eine zusätzliche CSS-Datei geladen wird. Dies wird erreicht durch Hinzufügen des folgenden Texts in den Meta-Bereich der Konfigurationsdatei.

<meta>
    <files>
        <file type="css">resource/designs/metal/version1.css</file>
    </files>
    ...
</meta>

Grundlegende Elemente zum Gestalten des Layouts

In der CometVisu kann die Größe und Anordnung der Widgets mit dem Kind-Element Layout gesteuert werden. Damit kann ein „Responsive Design“ realisiert werden, dass sich an die Displaygröße des Endgerätes anpasst, vom dem aus die CometVisu betrachtet wird. Dies erfolgt nicht nur zum Zeitpunkt des URL-Aufrufes, sondern dynamisch zB. auch beim Drehen des Endgerätes vom Quer- ins Hochformat bzw. beim Ändern der Fenstergröße am PC.

Innerhalb der Widgets stehen noch verschiedene Attribute wie width, height, etc. zur Verfügung. Damit kann die Größe des Widgetinhalts (zB. Bild- und Diagrammgröße, etc.) gesteuert werden.

Detaillierte Beschreibungen zur Formatierung der Widgetgrößen- und -inhalte:

  • Layout legt die Größe und Anordnung der Widgets fest

  • Width und Height beeinflusst die Größe des Widgetinhalts

Elemente für Konvertierung und Formatierung in der CometVisu

In der CometVisu können Werte auf verschiedenste Art und Weisen dargestellt werden. Hierfür können genutzt werden:

  • Format von Werten z.B. auf Anzahl der Nachkommastellen, Einheiten etc.

  • Mapping erlaubt das Ersetzen von Zahlenwerten durch Texte (z.B. An/Aus statt 1/0) und Icons. (z.B. für Fensterkontakte)

  • Styling erlaubt das wertabhängige Färben von Werten (z.B. An in rot und Aus in Grün)

  • Flavour ermöglicht in einigen Designs für einige Widgets noch zusätzliche Optionen.

Widgets in der CometVisu

Widgets sind die einzelnen Elemente aus denen eine CometVisu-Site zusammengebaut wird. Diese können entweder fest in der CometVisu eingebaut sein oder per Plugin-Schnittstelle integriert.

Die Beschreibung der Widgets kann man hier nachlesen:

Für die Konfiguration der Kommunikation des Widgets mit dem Backend werden address Elemente genutzt die im Kapitel Adressen genauer beschrieben werden.

CometVisu - Beispiele

Hier befindet sich mehrere Beispiele von Visualisierungen die sich im produktiven Einsatz befinden.

sonstiges