[Lovelace UI] kafelek Airly

Korzystam z Button Card oraz flowu, który wyciąga z airly wszelkie informacje, łącznie z opisem słownym, ostrzeżeniami i kolorem oznaczającym stan powietrza. Podaje to w postaci topików MQTT. Jeden z nich to node-red/Airly/CAQI/color, który zdefiniowałem sobie też jako sensor.airly_color. Chciałbym stworzyć kafelek, który będzie miał ustawiony kolor podawany przez ten sensor, na którym wyświetlałaby się informacja z sensora sensor.airly_advice oraz sensor.airly_description. Nie mam pojęcia jak mogę te dane wyciągnąć z sensorów i wykorzystać w layoucie.
obraz

Dla zobrazowania co chciałbym uzyskać:
obraz

Jeśli nie masz, to zainstaluj sobie dodatek lovelace-card-mod. Można wtedy modyfikować style CSS do kart.

Button card też mi daje taką możliwość. Chodzi mi o to, że nie mam pojęcia jak ten parametr odczytać i potem podstawić jako zmienną będącą kolorem tła. Obok pisania skryptów nawet nie stałem, jestem noga w tej dziedzinie :slight_smile: Analizując jakiś kod znaleziony w sieci zrobiłem coś takiego (odczyt jasności i koloru lampy), ale to kres moich możliwości:
obraz

Dla button-card spróbuj dodać coś takiego

styles:
  card:
    - background-color: >
        [[[ return states['sensor.airly_color'].state ]]]

O to chodziło! Podobnie zrobiłem z pozostałymi sensorami. Dzięki serdeczne, boli mnie strasznie, że takie rzeczy, dla wielu z Was proste, dla mnie są czymś nowym i w kategorii rocket science.

No i o to chodziło. Pomaganie sobie wzajemnie. @Piotr_K dzięki temu nie musisz wszystkiego wiedzieć ważne, że jest gdzie i kogo zapytać. My też kiedyś zaczynaliśmy.
Jak mi się podoba ta wymiana informacji. :smiley:
Powyższe rozwiązanie dodam do sekcji bazy wiedzy.

Cześć, jak uzyskałeś encję sensor.airly_advice? Ja u siebie widz® air_quality.airly który w atrybutach ma advice ale po angielsku.

@Piotr_K czy mógłbyś wrzucić gdzieś definicje do tych sensorów, które zrobiłeś na podstawie danych z flow i mqtt?

Nie wiem czy o to właśnie pytałeś:

  - platform: mqtt
    name: "PM2.5"
    state_topic: "node-red/Airly/PM25/value"
    unit_of_measurement: 'µg/m³'
    payload_available: "online"
    payload_not_available: "offline"
    icon: mdi:thermometer-lines

https://gist.github.com/tnowak/8a80e0776de15ca118cd6d265f78e434
Flow z komentarza, nie ten główny.

Dzięki, o to chodziło a mógłbyś jeszcze konfiguracje karty podesłać ?

Jeżeli masz na myśli tę zieloną, to jest ona zrobiona w Photoshopie

Tak, myślałem że uzyskałeś coś podobno w za pomocą button-card

Jest taki plan, ale zabieram się za to jak pies do jeża :wink:

hehe, a powiedz w tym flow coś oprócz API, lokalizacji i danych klienta mott nie modyfikowałeś?
Bo mi to sypie błędami

Ok już działam ten 1 flow skopiowałem i poprawiłem

A jak wyświetlić dane z flow Node-Red na karcie lovelace?

@Piotr_K udało Ci się końcu zrobić tą katę, jestem ciekawy efektu?

@pawelwaz Nie, bo zrobiłem własną stację pomiaru pyłów zawieszonych i wyniki różnią się od najbliższej z airly, więc korzystam z moich pomiarów. Zadowala mnie taka prezentacja:

obraz

Poza tym przy dużym stężeniu pyłów zawieszonych lampa ostrzegawczo zamruga mi parę razy na czerwono, ale jeszcze w tym sezonie nie zdarzyło mi się to.

Musisz stworzyć dla nich sensory. U mnie wygląda to tak:

  - platform: mqtt
    name: "PM2.5"
    state_topic: "node-red/Airly/PM25/value"
    unit_of_measurement: 'µg/m³'
    payload_available: "online"
    payload_not_available: "offline"
    icon: mdi:thermometer-lines