NEWS
Der "ultimative" ioBroker Lovelace Leitfaden/Dokumentation
-
Ich habe das Kapitel ergänzt, wie man lokale Bilder einbindet!
-
Nochmal vielen Dank für deine Arbeit. Cooler Guide. Ist für den Start sicherlich sehr hilfreich!
Hab jetzt mal etwas Zeit gefunden zum lesen und ein paar Anmerkungen:
Also "lock" entity wird schon unterstützt -> basierend auf Gerät "Schloss". Was nicht (so gut?) geht ist eine Schloss was neben aufschließen noch ein "öffnen" hat (IIRC kann das lovelace selber nicht)."climate" wird auch unterstützt, da werden die Thermostate aus ioBroker hin übersetzt. Da gibt es aber immer wieder Fehlermeldungen zu und ich hab mich bisher noch nicht intensiv damit beschäftigt, ggf. ist da noch etwas kaputt.
(bzw. was meinst du genau mit "werden nicht unterstützt?" -> im Kapitle Entitäten)
In deinem Beispiel, wo du die Rollen anpassen musstest (Thermostat) könntest du noch ergänzen, dass man so etwas, falls noch nicht geschehen, am besten in Github als issue für den betroffenen Adapter postet (wenn es eindeutig ist, dein Fall ist es, "value.*" ist immer nur zur Anzeige, nicht zum schreiben)
Zu Fenster "gekippt": States muss "richtig" gesetzt werden, so dass es zu den Werten passt, die da stehen können! Der Adapter nutzt das states-Feld um die Zahl in einen String zu verwandeln. Die Zahlen können im Grunde beliebig sein.
Zu umbenannten Entitäten: da gibt es noch eine Schwachstelle im Adapter. Entitäten werden nicht gelöscht -> bis zum Neustart des Adapters bleiben sie auch unter dem alten Namen erhalten (schlimmer ist, wenn tatsächlich was gelöscht wird, das kann auch zu Fehler führen, wobei ich die, meine ich, mittlerweile alle abfange).
Zu manuellen Datenpunkten: Wenn möglich würde ich bei "Sensor" bzw. "binary sensor" auch die automatische Erkennung bevorzugen (also type-detector & lovelace müssen den Typ kennen/unterstützen) -> dann wird auch die richtige "device_class" in der Entität gesetzt und aus z.B. on/off kann auch "Offen / Geschlossen" werden oder Lovelace weiß, dass ein Sensor eine Temperatur ist usw.
Zu deiner Tabelle: die Werte für alles was "binär" ist, sind in HomeAssistant immer "on/off", auch wenn die UI das übersetzt. Also auch, wenn für ein Fenster da geschlossen / offen steht, müsste man z.B. nach on oder off filtern (leider gilt das nicht für die gekippten Fenster -> aber die sind ja auch nicht binär).
"Hinweis: Die Bezeichner des Raums und der Funktion dürfen in diesem Fall nicht abweichendvergeben werden!" -> woher hast du das? Das stimmt m.E. nicht.. bei mir klappt es jedenfalls mit "Wetter / Überall" bzw. "Wetter / Unterwegs" ganz gut.
Zu accuweather wäre vielleicht (bis es ein Update der Karte gibt) noch der Hinweis ganz gut, dass die Karte mit der aktuellsten Version von Lovelace nicht mehr schön formatiert ist (und sich der Aufwand daher vermutlich nicht lohnt).
Zu den Bildern: Die können, wie die custom cards auch, per Drag & Drop auf der Konfigurationsseite der Instanz hochgeladen werden (also da, wo die Liste der custom cards ist).
Den Hinweis mit den Karten würde ich persönlich eher streichen. Mir ist bisher noch keine Karte untergekommen, die gar nicht funktioniert hätte. Eigentlich funktionieren die meisten sogar recht gut. Wichtiger wäre ein Hinweis, dass die Karten zur "Lovelace Version" passen müssen, die ggf. etwas anders sein kann als die aktuell in HomeAssitant genutzte. Das ist leider etwas intransparent... hm.. Jedenfalls gibt es einige Karten, die man nach einem Update auf 1.2.* aktualisieren muss.
Ansonsten hätte ich noch dies Karten als Ergänzung deiner Liste:- button entity row
- flex table
- auto entities
- card mod
- slider entity row
- slideshow
Zur Banner-Card:
sicher, dass true / false da stimmen? Ich würde eher vermuten, dass es on / off sein müsste? Habe es aber nicht selber ausprobiert. -
@Garfonso Besten Dank für die Rückmeldung. Ich habe die Punkte in einer neuen Version einfliessen lassen.
-
@Tirador
wie im test-thread rausgekommen ist, ist vielleicht ein Absatz zu call_service ganz hilfreich. Da bin ich, muss ich zugeben, auch noch nicht so richtig firm. (Man kann ja, wenn ich es richtig verstanden hab, auch call_service in eine Elements-Card tun... ggf. auch interessant). -
@Garfonso sagte in Der "ultimative" ioBroker Lovelace Leitfaden/Dokumentation:
wie im test-thread rausgekommen ist, ist vielleicht ein Absatz zu call_service ganz hilfreich
Ich übernehme das.
Die Services selbst sind hier grob erklärt:
https://www.home-assistant.io/docs/scripts/service-calls/Für detailierte Dokumentation wird auf die Entwicklertools verwiesen:
https://www.home-assistant.io/docs/tools/dev-tools/Die Entwicklertools sind allerdings nur auf einer lokalen HASS Installation einsehbar. Deshalb habe ich mir kurzerhand eine VM mit Hyper-V aufgesetzt: https://www.home-assistant.io/hassio/installation/
Anmerkung falls das jemand anderes nachmacht: Die VM wie in der Anleitung starten und anschließend auf dem Host (Windows) einfach diese Adresse im Browser eingeben:http://homeassistant.local:8123/
Nun haben wir eine lokale HASS Installation und können unter Entwickleroptionen die detaillierten Service Beschreibungen einsehen.
Wie sich bei der nachfolgenden Dokumentation gezeigt hat, sind viele Services sehr HomeAssistant spezifisch. Nachfolgend die wichtigsten Services, mit welchen wahrscheinlich 95% aller Anforderungen erfüllt werden können. Ich habe nicht alle Services im IOBroker getestet. Bitte um Info sollte irgendwas nicht funktionieren, dann werde ich es vermerken.
HOMEASSISTANT SERVICES
https://www.home-assistant.io/docs/scripts/service-calls/
Es gibt folgende allgemeingültige Services, welche auf beliebige Entitys angewendet werden können (sofern von diesen unterstützt). Beispiele sind Switch, Light, etc.
Service Beschreibung Service Data homeassistant.turn_on Entity einschalten entity_id homeassistant.turn_off Entity ausschalten entity_id homeassistant.toggle Entity umschalten entity_id homeassistant.update Entity(s) aktualisieren entity_id(s) Statt homeassistant kann auch das jeweilige Entity verwendet werden (wie z.B. switch.turn_off)
Beispiel: Zentraler Ausschaltknopf
type: button name: Alles aus tap_action: action: call-service service: homeassistant.turn_off service_data: entity_id: switch.Zentral_Reset_Wohnen entity: switch.Zentral_Reset_Wohnen
INPUT_SELECT SERVICES
https://www.home-assistant.io/integrations/input_select/
Folgende Services werden von INPUT_SELECT zur Verfügung gestellt:
Service Beschreibung Service Data input_select.select_next Nächste Option entity_id input_select.select_previous Vorherige Option entity_id input_select.set_options Optionen definieren entity_id; options input_select.select_option Option auswählen entity_id; option input_select.reload Entitys neu laden Beispiel: Fernsehsender auswählen
type: button name: ARD anschauen entity_id: input_select.TV_Sender tap_action: action: call-service service: input_select.select_option service_data: entity_id: input_select.TV_Sender option: ARD
INPUT_NUMBER SERVICES
https://www.home-assistant.io/integrations/input_number/
Folgende Services werden von INPUT_NUMBER zur Verfügung gestellt:
Service Beschreibung Service Data input_number.decrement Wert verringern entity_id input_number.increment Wert erhöhen entity_id input_number.set_value Wert setzen entity_id; value input_number.reload Entitys neu laden Beispiel: Rollladen beschatten
type: button name: Rollladen beschatten entity_id: input_number.Rollladen_Position tap_action: action: call-service service: input_number.set_value service_data: entity_id: input_number.Rollladen_Position value: 80
INPUT_TEXT SERVICES
https://www.home-assistant.io/integrations/input_text/
Folgende Services werden von INPUT_TEXT zur Verfügung gestellt:
Service Beschreibung Service Data input_text.set_value Wert setzen entity_id; value input_text.reload Entitys neu laden Beispiel: Passwort zurücksetzen
type: button name: Passwort zurücksetzen entity_id: input_text.Passwort tap_action: action: call-service service: input_text.set_value service_data: entity_id: input_text.Passwort value: 1234567890
-
@KNXbroker said in Der "ultimative" ioBroker Lovelace Leitfaden/Dokumentation:
@Garfonso sagte in Der "ultimative" ioBroker Lovelace Leitfaden/Dokumentation:
wie im test-thread rausgekommen ist, ist vielleicht ein Absatz zu call_service ganz hilfreich
Ich übernehme das. Werde diesen Post in den nächsten Tagen entsprechend erweitern.
Vorab vielleicht schon mal wie man an die Infos kommt.Die Services selbst sind hier grob erklärt:
https://www.home-assistant.io/docs/scripts/service-calls/Für detailierte Dokumentation wird auf die Entwicklertools verwiesen:
https://www.home-assistant.io/docs/tools/dev-tools/Die Entwicklertools sind allerdings nur auf einer lokalen HASS Installation einsehbar. Deshalb habe ich mir kurzerhand eine VM mit Hyper-V aufgesetzt: https://www.home-assistant.io/hassio/installation/
Anmerkung falls das jemand anderes nachmacht: Die VM wie in der Anleitung starten und anschließend auf dem Host (Windows) einfach diese Adresse im Browser eingeben:http://homeassistant.local:8123/
Nun haben wir eine lokale HASS Installation und können unter Entwickleroptionen die detaillierten Service Beschreibungen einsehen.
AUFLISTUNG FOLGT...
Ich sage schonmal vorab: Klasse für deine Unterstützung! Könnte man zu jedem CallService auch ein Praxisbeispiel machen.
-
@KNXbroker
Ok, da hast du die Beschreibungen gefunden? Gut.
Wenn davon was nicht funktioniert (also im Lovelace Adapter), dann muss ggf. der Adapter angepasst werden. Wenn ich es richtig sehe, sollte aber schon relativ viel gehen. -
Habe oben nun alle wichtigen Call-Services zusammengefasst, damit sollte man schon relativ viel umsetzen können. Mein größtes Problem war, mich mit Markdown anzufreunden Aber ich bin ja froh, wenn ich dadurch meinen Teil zu diesem Projekt beitragen kann.
-
@KNXbroker said in Der "ultimative" ioBroker Lovelace Leitfaden/Dokumentation:
Habe oben nun alle wichtigen Call-Services zusammengefasst, damit sollte man schon relativ viel umsetzen können. Mein größtes Problem war, mich mit Markdown anzufreunden Aber ich bin ja froh, wenn ich dadurch meinen Teil zu diesem Projekt beitragen kann.
Sehr schön. Ich würde deine Passagen dann in den Leitfaden übernehmen, wenn du nichts dagegen hast.
-
@Tirador
Klaro, dafür habe ich es ja gemacht. Habe auch schon überlegt, alles Mal ins englische zu übersetzen, aber ich weiß nicht wie man sowas am besten versionstechnisch steuert. Unterstützt das GitHub Wiki mehrere Sprachen?
Überlegst du noch das ins GitHub Wiki einzupflegen? @Garfonso hat ja schon ein erstellt, aber weiss nicht wie man das bearbeiteten kann. -
@KNXbroker
Das Problem am Github Wiki ist, dass es nur Kollaborateure bearbeiten können, also Github User, die Rechte an dem Adapter haben. Ich vermute, dass bluefox das nicht ganz recht ist, wenn das zu viele Leute nur für die Doku kriegen.Es gibt ja eine ioBroker zentrale Doku, da gibt es für jeden Adapter auch eine Seite: https://www.iobroker.net/#de/adapters/adapterref/iobroker.lovelace/README.md
Aktuell wird da einfach die README.md aus dem Repository hingepackt (und in den verschiedenen Übersetzungen mit automatischer Übersetzung angeboten...). Der Adapter kann das, soweit ich weiß, per io-package.json auf ein anderes Verzeichnis, z.B.docs
im Repository umbiegen und dann da auch mehrere Sprachen anbieten. Das wäre vielleicht das einfachste?
Dann könntet ihr, wenn ihr was an der Doku machen wollte, auf github einen PR machen und ich übernehme das dann.Hier dazu die Erklärung: https://www.iobroker.net/#de/documentation/dev/adapterdocstyleguide.md
Ich würde die entsprechende Struktur dann im Adapter erstellen, wenn ihr das so machen wollt.@Tirador das könnte man dann, wenn wir da was hingetan haben vielleicht auch promininter in der Doku unter Visualisierungen verlinken (wobei wir dafür vermutlich lovelace erstmal im stable updaten sollten.... der Unterschied ist doch aktuell zu krass - aber dafür will ich noch den blöden Editor Bug fixen, bei dem ich leider irgendwie hänge... seufz).
-
@Garfonso said in Der "ultimative" ioBroker Lovelace Leitfaden/Dokumentation:
@KNXbroker
Das Problem am Github Wiki ist, dass es nur Kollaborateure bearbeiten können, also Github User, die Rechte an dem Adapter haben. Ich vermute, dass bluefox das nicht ganz recht ist, wenn das zu viele Leute nur für die Doku kriegen.Es gibt ja eine ioBroker zentrale Doku, da gibt es für jeden Adapter auch eine Seite: https://www.iobroker.net/#de/adapters/adapterref/iobroker.lovelace/README.md
Aktuell wird da einfach die README.md aus dem Repository hingepackt (und in den verschiedenen Übersetzungen mit automatischer Übersetzung angeboten...). Der Adapter kann das, soweit ich weiß, per io-package.json auf ein anderes Verzeichnis, z.B.docs
im Repository umbiegen und dann da auch mehrere Sprachen anbieten. Das wäre vielleicht das einfachste?
Dann könntet ihr, wenn ihr was an der Doku machen wollte, auf github einen PR machen und ich übernehme das dann.Hier dazu die Erklärung: https://www.iobroker.net/#de/documentation/dev/adapterdocstyleguide.md
Ich würde die entsprechende Struktur dann im Adapter erstellen, wenn ihr das so machen wollt.@Tirador das könnte man dann, wenn wir da was hingetan haben vielleicht auch promininter in der Doku unter Visualisierungen verlinken (wobei wir dafür vermutlich lovelace erstmal im stable updaten sollten.... der Unterschied ist doch aktuell zu krass - aber dafür will ich noch den blöden Editor Bug fixen, bei dem ich leider irgendwie hänge... seufz).
Also ich kann einen Pull Request mit der Readme.md und den Bildern auf GitHub machen. Es ist dann nur klar, dass die bisherige Doku in Englisch durch die Deutsche ersetzt wird.
-
@Garfonso sagte in Der "ultimative" ioBroker Lovelace Leitfaden/Dokumentation:
Es gibt ja eine ioBroker zentrale Doku, da gibt es für jeden Adapter auch eine Seite: https://www.iobroker.net/#de/adapters/adapterref/iobroker.lovelace/README.md
Das kannte ich noch gar nicht. Dort ist auch ein sehr hilfreicher Editor zum Übersetzen vorhanden. Lustig: Lovelace wird mit Liebesspiel automatisch übersetzt
Denke eine finale Übersetzung macht erst Sinn, wenn sich am Leitfaden nicht mehr viel ändert. Vielleicht könnte man zwischenzeitlich auch auf eine automatische Übersetzung zurückgreifen?
@Tirador: Wenn man die fehlenden Punkte noch in deiner Doku aufnimmt, dann könnte doch die bereits vorhandene Doku komplett ersetzt werden, oder?
- Viele Punkte sind ja bereits doppelt vorhanden
- Einige Punkte wären auch in deiner Doku hilfreich: Notification, Voice, etc. (da habe ich mich auch noch nicht auseinander gesetzt, hat schon jemand Erfahrung?)
- Viele Punkte der vorhanden Doku sind ja nur für Entwickelter wichtig (Definition der Datenpunkte, etc.). Könnte man am Schluss in deine Doku unter Development mit reinpacken.
Viele Grüße
-
@KNXbroker said in Der "ultimative" ioBroker Lovelace Leitfaden/Dokumentation:
@Garfonso sagte in Der "ultimative" ioBroker Lovelace Leitfaden/Dokumentation:
Es gibt ja eine ioBroker zentrale Doku, da gibt es für jeden Adapter auch eine Seite: https://www.iobroker.net/#de/adapters/adapterref/iobroker.lovelace/README.md
Das kannte ich noch gar nicht. Dort ist auch ein sehr hilfreicher Editor zum Übersetzen vorhanden. Lustig: Lovelace wird mit Liebesspiel automatisch übersetzt
Denke eine finale Übersetzung macht erst Sinn, wenn sich am Leitfaden nicht mehr viel ändert. Vielleicht könnte man zwischenzeitlich auch auf eine automatische Übersetzung zurückgreifen?
@Tirador: Wenn man die fehlenden Punkte noch in deiner Doku aufnimmt, dann könnte doch die bereits vorhandene Doku komplett ersetzt werden, oder?
- Viele Punkte sind ja bereits doppelt vorhanden
- Einige Punkte wären auch in deiner Doku hilfreich: Notification, Voice, etc. (da habe ich mich auch noch nicht auseinander gesetzt, hat schon jemand Erfahrung?)
- Viele Punkte der vorhanden Doku sind ja nur für Entwickelter wichtig (Definition der Datenpunkte, etc.). Könnte man am Schluss in deine Doku unter Development mit reinpacken.
Viele Grüße
Ja, die fehlenden Punkte müssten noch ergänzt werden und dann auch getestet und mit Beispielen ausgearbeitet.
Die Notifications habe ich mal ausprobiert im Zuge des MessageHandlers-Projekts. Dazu kann ich etwas beisteuern.
Mit Voice habe ich keine Erfahrung. -
@Tirador
ich würde einen ordner \docs neu anlegen und da in den Unterordnern de\ bzw. en\ den Leitfaden (und Bilder sollen nach der Beschreibung dann da jeweils in \media) tun. Die Haupt-Readme würde ich dann potentiell deutlich verkürzen und da prominent einen Link auf die "User-Doku" setzen und darunter dann die Sachen, die für Entwickler wichtig sind sammeln. Ggf. bei der Gelegenheit das Chagenlog aussortieren.Kannst du mir das Markdown mal zukommen lassen? Dann würde ich das die Woche angehen und etwas experimentieren.
-
@All: Neue Version hochgeladen (siehe initiales Post).
Ergänzung von call service (danke @KNXbroker )Das Markdown mit den Bildern befindet sich im Anhang:
iob.zip -
@Tirador
Super Guide und super arbeit. Wirklich spitze. Das hat mich angeregt, auch die Oberfläche zu nutzen und die aktuelle Adapter Version 1.2.6 zu installieren.
Leider habe ich doch ein paar Problem, die ich hier dokumentiert hatte: https://forum.iobroker.net/topic/37430/lovelace-visualisierung-und-fragenMeine Frage: Wo tauscht man sich Grundsätzlich zu Lovelace aus? Ich habe den Eindruck, dass hier wenige damit arbeiten.
-
@nachon
Die meisten diskutieren in einem der zwei Test-Threads. -
Ich möchte dann auch meinen Teil beitragen
Die ultimative Grafana Integration >>> transparent <<<
Bevor ich hier allerdings groß schreibe, möchte ich mich bei der Community bedanken die mich zu dem Ergebnis gebracht haben.
So nun aber ... ich möchte euch hier zwei Möglichkeiten zeigen, wie Ihr Grafana bestmöglich in die Lovelace UI integrieren könnt.
- Grafana transparent komplett auf einer ganzen Seite als Iframe
- Einzelnes Panel transparent als Iframe
1)
Hierzu benötigt Ihr zuerst das plugin "Boom Theme"
Use grafana-cli
grafana-cli plugins install yesoreyeram-boomtheme-panel
Danach ein neues Panel erstellen und als Visualisierung Boom Theme wählen. Unter Custom Style / CSS Override folgenden Code einfügen:
body{ background: transparent; } .page-dashboard .main-view, .page-explore .main-view{ background: transparent !important; border: 0px solid transparent !important; } .panel-container{ border: 0px solid #1F2129 !important; } .graph-legend-table .graph-legend-series:nth-child(2n) { background: transparent; }
Das Panel am besten oben einsortieren damit es direkt geladen wird.
Speichern und ab zu Lovelace.
-> Bearbeiten und neue Ansicht Hinzufügen
-> Karte hinzufügen "Manuell"YAML-Code hinzufügen:
type: iframe url: 'http://192.xxx.x.xxx:3000/deinegrafanaurlausdembrowser' aspect_ratio: 50%
Speichern und ich hoffe dein Erfolgserlebnis ist da
2)
Hier erstellen wir zuerst eine mygrafana.css Datei mit folgendem Inhalt:
@charset "UTF-8"; body.dashboard-solo, .panel-container, .main-view{ background-color: transparent; } .graph-legend-table th{ color: white; } .view{ /*background-color: linear-gradient(0deg, #2c2a3f, #4f344c, #2c2a3f) !important; *//*Hintergrundfarbe vom Dahsboard auf dem der Container liegt*/ /*background-color: #332939 !important;*/ } .graph-legend-table .graph-legend-series:nth-child(2n) { background: transparent; }
Und laden diese über die Lovelace Adaptereinstellungen -> Kundenspezifische hoch.
Danach loggen wir uns per ssh auf dem Grafana Server ein und öffnen die index.html
sudo nano /usr/share/grafana/public/views/index.html
Hier muss nun innerhalb des Head-Bereichs folgender Code eingefügt werden:
(IP anpassen)<link rel="stylesheet" href="http://192.xxx.x.xxx:8091/cards/mygrafana.css" type="text/css"/>
Habe es vor </head> eingefügt. Hauptsache irgendwo da.
Panel als Iframe sollte klar sein:
-> Panel Share
-> embed link Copy
-> Lovelace Iframe link einfügenNach einem Reboot sollte es hoffentlich alles laufen.
Falls nicht habt ihr vielleicht noch folgendes Problem. Ich hatte eine ältere Grafana Version 6.0.x und musste erst upgraden auf 7.xxx. Dazu fehlte dann noch der Eintrag das Grafana eingebettet werden darf.
Dazu kontrolliert die Grafana.ini
sudo nano /etc/grafana/grafana.ini
Unter Security
allow_embedding = true
Und kontrolliert unter Anonymus Auth
[auth.anonymous] # enable anonymous access enabled = true # specify organization name that should be used for unauthenticated users org_name = iobroker <<<( hier muss euer Organisation name rein den Ihr bei Grafana hinterlegt habt) # specify role for unauthenticated users org_role = Viewer
Speichern, Schließen, Reboot und ich hoffe es funktioniert
Ich bin nun mal noch so frei und behaupte ohne es getestet zu haben das es auch in jeder anderen Visualisierung geht da es um Grafana und Iframe geht und nicht direkt um Lovelace.
Grüße,
Christoph -
@KNXbroker
Nochmal Danke für die Arbeit.
Ich hab mir jetzt mal angeguckt, was von deinen Beispielen geht.Alles, was Entities ändern soll (
.reload
oder.set_options
oder.update
) geht nicht - reload/upload könnte man ggf. implementieren, set_options eher nicht.
select_next
/select_previous
undincrement
/decrement
sind aktuell nicht implementiert, bestünde da Bedarf? grübelDer Rest sollte gehen.
Was ich auch implementiert habe, beim fummeln mit der mini-media-player Card, ist ein
iobroker_say
. Damit kann man in der mini-media-player card text-to-speach aktivieren, als Plattformiobroker
eintragen und alsentity_id
das entity, was gesetzt werden soll, beispiel:type: 'custom:mini-media-player' entity: media_player.Alexa_Arbeitszimmer tts: platform: iobroker entity_id: input_text.multimedia_Alexa_Arbeitszimmer_Commands_speak
Die entity_id sollte dabei bekannt sein. Domäne ist egal, die wird dann halt auf den Text gesetzt, den man da eintippt. Sinnvoll wäre da das
.speak
Kommando eines Lautsprechers zu nehmen, z.B.