Bubble Card: State-abhängige Icons der SubButtons

Hallo zusammen,

ich habe da mal eine sehr konkrete Frage zu den Bubble Cards, zu der ich leider bisher keine Antwort gefunden habe.

Man kann ja den Style der SubButtons in Abhängigkeit der Entität ändern, indem man im Style das Icon setzt:

      ${subButtonIcon[1].setAttribute("icon",
        hass.states['sensor.bewegungradarkuche_state'].state === 'move' ?
        'mdi:motion-sensor-off' : 'mdi:motion-sensor')}

Das funktioniert auch soweit. Was aber, wenn man mehr als nur 2 Status hat, die man erfassen möchte. Es funktioniert zwar, dass man das ganze schachtelt:


      ${subButtonIcon[1].setAttribute("icon",
        hass.states['sensor.bewegungradarkuche_state'].state === 'move' ?
        'mdi:motion-outline' : hass.states['sensor.bewegungradarkuche_state'].state === 'Presence' ?
        'mdi:motion-sensor-off' : 'mdi:motion-sensor')}

Allerdings finde ich das etwas unschön. Schöner wäre doch, wenn man mit einem If…ElseIf…Else arbeiten könnte, oder sogar per „select“.

Hat da jemand eine Idee?

1 „Gefällt mir“

Man kann das etwas übersichtlicher und besser lesbar gestalten, wenn man die Einträge wie bei If-Anweisungen einrückt.

${subButtonIcon[1].setAttribute("icon",
  hass.states['sensor.bewegungradarkuche_state'].state === 'move' ?
    'mdi:motion-outline' :
  hass.states['sensor.bewegungradarkuche_state'].state === 'Presence' ?
    'mdi:motion-sensor-off' :
    'mdi:motion-sensor')
 }

Die states musst du dann noch mit deinen anpassen.

${subButtonIcon[1].setAttribute(
  "icon",
  hass.states['sensor.bewegungradarkuche_state'].state === 'move'
    ? 'mdi:motion-sensor-off'
    : hass.states['sensor.bewegungradarkuche_state'].state === 'car'
    ? 'mdi:car'
    : hass.states['sensor.bewegungradarkuche_state'].state === 'bike'
    ? 'mdi:bike'
    : 'mdi:motion-sensor'
)}

Danke schonmal für die schnellen Antworten.

Ich dachte, es gibt da vielleicht eine elegantere Lösung ohne Schachtelung, die ich noch nicht kenne :slight_smile:

Ich habe es jetzt auch mit der Einrückung umgesetzt.