Eigenes Logging in ioBroker – Teil 3 – Integration in HABPanel

In diesem Artikel zeige ich Dir, wie ich meine Protokollierung in HABPanel integriert habe.

Ich hatte vor einigen Wochen einen Artikel zum Thema „Eigenes Logging in ioBroker“ veröffentlicht. Falls Du den Artikel noch nicht gelesen hast, hier findest Du den Artikel:

Im ersten Teil des Artikels haben wir die Protokoll-Tabelle bereits in unsere VIS-Visualisierung eingebaut. In der Zwischenzeit habe ich öfters die Frage zur Integration in andere Visualisierungen gestellt bekommen. Aus diesem Grund werde ich Dir heute zeigen, wie Du die Protokollierung auch in die HABPanel-Visualisierung einfügen kannst.

Die Protokoll-Tabelle wird in ioBroker in einem einfachen Text-Datenpunkt (Zeichenfolge) gespeichert. Die einzelnen Einträge werden mit einem Zeilenumbruch (Html Break) getrennt und können so auch einfach in VIS dargestellt werden. Im HABPanel funktioniert das auf diesem Wege leider nicht, da hier die Zeichenketten im Klartext dargestellt werden. Auch Steuerzeichen wie der klassische LineBreak „\n“ funktionieren hier leider nicht. Aus diesem Grund werde ich die Integration über einen kleinen Umweg vornehmen müssen.

Im ersten Schritt wechseln wir dazu nun in ioBroker VIS und legen uns ein neues Projekt an. Klicke dazu unter Setup – Neues Projekt…

Als Projektname habe ich hier „widgetdata“ verwendet, da in diesem Projekt nur Views für andere Widgets hinterlegt werden sollen.

Nach der Anlage des neues Projekts habe ich dann zunächst die Demo-View gelöscht und über die Plus-Schaltfläche eine neue View angelegt.

Als Name habe ich hier „habpanel_eventlist“ gewählt. Mit dem Prefix „habpanel_“ bekomme ich so später einen besseren Überblick wenn es weitere Views geben wird.

Im nächsten Schritt ziehen wir uns dann ein Widget vom Typ String (unescaped) auf unsere View.

In den Eigenschaften des Widgets wählen wir nun die Objekt ID der anzuzeigenden Daten.

Wir wählen hier unseren Datenpunkt der Protokoll-Tabelle javascript.0.SystemEventList.EventList

Da meine HABPanel-Visualisierung einen dunkeln Hintergrund besitzt, habe ich dann zusätzlich noch die Textfarbe des HTML-Widgets auf Weiß gesetzt. Die View selber besitzt keinen Hintergrund, und wird somit transparent dargestellt.

Im nächsten Schritt können wir jetzt wieder in HABPanel wechseln um dort die gerade erstelle View einzubinden.

Dazu wechseln wir in die Dashboard-Konfiguration und klicken oben rechts auf die Schaltfläche „Widget hinzufügen“. In der Liste der Widgets wählen wir hier den Rahmen (Frame-Widget).

Auf dem eingefügten Widget kannst Du dann oben über die Bearbeiten-Schaltfläche mit der Konfiguration des Widgets beginnen.

In der Konfiguration habe ich zunächst den Name des Widgets angepasst „Protokollierung“. Als URL-Quelle habe ich eine Statische Url gewählt, da sich die URL nicht ändert. In das Eingabefeld URL kopieren wir nun die URL zur erstellen ioBroker VIS View ein. In meinem Fall lautet die URL:

http://192.168.2.90:8082/vis/index.html?widgetdata#habpanel_eventlist

Wenn wir jetzt die Konfiguration über Speichern beenden und HABPanel erneut ausführen, sehen wir die folgende Darstellung der Protokollierung.

Falls bei euch ein horizontaler Scrollbalken dargestellt wird, einfach das HTML-Widget in VIS ein wenig schmäler ziehen oder hier die Konfiguration der Kacheln ändern (nur eine Spalte anzeigen).

Kommentare, Fragen oder Anregungen freue ich mich.

Matthias Korte

Hauptberuflich Software-Entwickler und seit einigen Jahren Smart-Home Fan. Angefangen hat alles mit einem RaspberryMatic und einer schaltbaren Steckdose. Mittlerweile habe ich einige Steckdosen, Sensoren, und Thermostate sowie ioBroker zur Visualisierung im Einsatz.

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.