ioBroker Visualisierung mit lovelace – Teil 5 – Benachrichtigungen

In dieser Artikelreihe zeige ich Dir, wie Du eine Visualisierung mit lovelace UI erstellen kannst.

Mit Lovelace kannst Du Visualisierungsoberflächen für ioBroker einfach und schnell konfigurieren. Die Visualisierung kommt ursprünglich von der Home-Assistant Plattform und wurde nachträglich auch für ioBroker verfügbar gemacht. In der aktuellen Version funktionierten noch nicht alle Widgets vollständig, eine einfache Visualisierung kann aber ohne Probleme erstellt werden. In der Artikelreihe werde ich die Grundlagen sowie die Möglichkeiten der Visualisierung darstellen. Im fünften Teil schauen wir uns das Thema Benachrichtigungen genauer an.

Lovelace verfügt über ein eigenes Benachrichtigungssystem, mit dem Du dir in der Visualisierung Text-Informationen anzeigen kannst. Du findest Benachrichtigungssystem in der Visualisierung oben rechts neben dem bereits bekannten Sandwich-Button. Mit einem Klick auf das Glocken-Symbol wird der Benachrichtigungsbereich angezeigt.

Wir haben nun die Visualisierung der Benachrichtigungen gesehen. Im nächsten Schritt möchte ich Dir nun zeigen, wie Du eigene Benachrichtigungen erstellen kannst. Im ersten Schritt zeige ich Dir dazu die Objektstruktur der dazugehörigen Datenpunkte. Unter dem Channel „lovelace.0“ siehst du den Ordner „notifications“. In diesem Channel werden drei States aufgelistet. Mit dem ersten State „add“ kannst Du eine neue Benachrichtigung hinzufügen. Über das State „clear“ werden alle Benachrichtigungen entfernt und über das State „list“ werden alle Benachrichtigungen aufgelistet.

Für einen direkten Test kannst Du einfach direkt in den Objekten den Datenpunkt „add“ verändern und hier eine eigene Zeichenfolge eingeben. Ich habe in den Datenpunkt nun „Test-Meldung“ eingeben. In der Visualisierung siehst Du direkt am Glocken-Symbol, dass eine neue Benachrichtigung vorhanden ist.

Mit einem Klick auf die Glocke wird die neue Meldung in der Visualisierung eingeblendet.

Ich denke mit diesem Beispiel hast Du die Funktionsweise der Benachrichtigungen verstanden. Im nächsten kleinen Beispiel sende ich nun über JavaScript eine Benachrichtigung an lovelace.

on({id: "hm-rpc.0.OEQ0167091.1.STATE", change: "ne"}, function (obj) {
var value = obj.state.val;

if ( value === true ) {
setState('lovelace.0.notifications.add', '{"message": "Haustür wurde geöffnet", "title": "Haustür"}');
} else {
setState('lovelace.0.notifications.add', '{"message": "Haustür wurde geschlossen", "title": "Haustür"}');
}  });

Im Script-Beispiel wird mittels dem On()-Event auf eine Veränderung des Türstatus (Haustüre) reagiert. Die Benachrichtigung wird mittels dem setState() Aufruf an den Datenpunkt „add“ der lovelace Objektstruktur erstellt. Im folgenden Screenshot wird das Öffnen und Schließen der Haustür als Benachrichtigung angezeigt.

Über Kommentare unterhalb des Artikels oder per E-Mail freue ich mich wie immer.