Decluttering-card Templates in externer Datei?

Hallo Leute,
in meinen Dashboards verwende ich sehr intensiv die decluttering-card.
Wenn man einmal raus hat, wie die Templates erstellt werden, ist das toll.
Die Templates habe ich bisher im Root meiner desktop.yaml untergebracht.

decluttering_templates:
  title_template:
  card:
    type: custom:vertical-stack-in-card
    cards:
      - type: custom:mushroom-title-card


und so weiter. Das hat bisher prima funktioniert.
Jetzt habe ich ein Template mit sehr langen Templatezeilen für z.B. status: etc.
Dabei wird sowohl Jinja als auch Javascript eingesetzt.
Wenn ich das in der Dashboardkarte direkt einsetze funktioniert das, wenn alles in einer Zeile steht.
Sobald ich es aber im RAW-Editor des Dashboards eintrage, bricht der Editor das in mehrere Zeilen um, was dann bei der Anzeige nicht richtig aufgelöst werden kann.
Jetzt wollte ich die Templates in eine decluttering_templates.yaml auslagern und in der configuration.yaml “decluttering_templates: !include decluttering_templates.yaml” eintragen.
Das führt aber zu der Fehlermeldung, dass die Integration decluttering_templates nicht gefunden wird.
Gibt es dafür eine Lösung?

!include von Frontend-Elementen funktioniert derzeit nur im YAML-Mode.

1 „Gefällt mir“

Danke für die Klarstellung (wenn auch nicht begeistert :frowning: ).
Und das Umbrechen der Zeilen kann man wahrscheinlich auch nicht unterbinden. Schade! Wenigstens funktioniert es in den Karten richtig.

Das Frontend macht, was es will, YAML-Mode ist um so Vieles angenehmer.
Poste doch mal eine lange Zeile oder ein Teilstück, vielleicht kann man innerhalb des Codes was tun.

Ja, aber auch da mache ich viel in YAML. Der Vorteil ist, dass man gleichzeitig das Ergebnis optisch dargestellt bekommt und gegebenenfalls direkt reagieren kann. Soviel dazu.
Ich versuche in meinem Dashboard die battery-state-card zu immitieren. Grund dafür ist, dass ich HomeMatic nutze und dabei viele Batteriedevices keine Prozentzahl, sondern nur battery_low ausgeben.
Hier ist die soweit funktionierende Dashboardkarte.

  - type: custom:auto-entities
    card:
      type: entities
      style: |
        ha-card {
          border: none;
          padding: 0 !important;
          margin: 0 !important;
          box-shadow: none;
        }    
    filter:
      template: |-
        [
          {% for e in state_attr('sensor.battery_plus_devices', 'entities')[:5] %}
            {
              "type": "custom:template-entity-row",
              "entity": "{{ e }}",
              "name": "{% set n = state_attr(e, 'friendly_name') %}{{ n | replace(' Akku fast leer', '') | replace(' Batterie', '') | replace(' Battery', '') | replace(' level', '') | replace('+', '') | trim }}",
              "icon": "{% set s = states(e) %}{% if s in ['on', 'off'] %}mdi:battery{% else %}{% set l = s | int(0) %}{% if l >= 95 %}mdi:battery{% elif l >= 80 %}mdi:battery-90{% elif l >= 60 %}mdi:battery-70{% elif l >= 40 %}mdi:battery-50{% elif l >= 20 %}mdi:battery-30{% elif l >= 10 %}mdi:battery-20{% else %}mdi:battery-outline{% endif %}{% endif %}",
              "color": "{% set s = states(e) %}{% if s == 'on' %}red{% elif s == 'off' %}green{% else %}{% set l = s | int(0) %}{% if l < 15 %}red{% elif l < 40 %}orange{% elif l < 60 %}yellow{% else %}green{% endif %}{% endif %}",
              "state": "{% set s = states(e) %}{% if s == 'on' %}niedrig{% elif s == 'off' %}normal{% else %}{{ s | int }} %{% endif %}",
              "secondary": "{{ state_attr(e, 'battery_type_and_quantity') or '' }}",
              "tap_action": {
                "action": "fire-dom-event",
                "browser_mod": {
                  "service": "browser_mod.popup",
                  "data": {
                    "title": "{{ state_attr(e, 'friendly_name') }}",
                    "content": {
                      "type": "entities",
                      "entities": [
                        {
                          "type": "custom:template-entity-row",
                          "name": "{% set n = state_attr(e, 'friendly_name') %}{{ n | replace(' Akku fast leer', '') | replace(' Batterie', '') | replace(' Battery', '') | replace(' level', '') | replace('+', '') | trim }}",
                          "entity": "{{ e }}"
                        },
                        {
                          "type": "custom:template-entity-row",
                          "name": "Batterietyp",
                          "icon": "mdi:battery",
                          "state": "{{ state_attr(e, 'battery_type_and_quantity') or 'unbekannt' }}"
                        },
                        {
                          "type": "custom:template-entity-row",
                          "name": "Betriebsspannung",
                          "icon": "mdi:flash",
                          "state": "{% set name = e.split('.')[-1] %}{% set s1 = name.replace('_battery_plus_low', '_betriebsspannung') %}{% set s2 = s1.replace('_battery_plus', '_betriebsspannung') %}{% set spannung_entity = 'sensor.' ~ s2 %}{% if states(spannung_entity) not in ['unknown', 'unavailable', 'none'] %}{{ states(spannung_entity) }} {{ state_attr(spannung_entity, 'unit_of_measurement') or 'V' }}{% else %}unbekannt{% endif %}"
                        }
                      ]
                    }
                  }
                }
              }
            }{% if not loop.last %},{% endif %}
          {% endfor %}
        ]
    card_mod:
      style:
        .: |
          ha-card {
            border: none;
            padding: 0px !important;
           }
  - type: custom:auto-entities
    card:
      type: entities
    filter:
      template: |-
        [
          {
            "type": "custom:fold-entity-row",
            "head": {
              "type": "section",
              "label": ""
            },
            "padding": 1,
            "entities": [
              {% for e in state_attr('sensor.battery_plus_devices', 'entities')[5:] %}
                {
                  "type": "custom:template-entity-row",
                  "entity": "{{ e }}",
                  "name": "{% set n = state_attr(e, 'friendly_name') %}{{ n | replace(' Akku fast leer', '') | replace(' Batterie', '') | replace(' Battery', '') | replace(' level', '') | replace('+', '') | trim }}",
                  "icon": "{% set s = states(e) %}{% if s in ['on', 'off'] %}mdi:battery{% else %}{% set l = s | int(0) %}{% if l >= 95 %}mdi:battery{% elif l >= 80 %}mdi:battery-90{% elif l >= 60 %}mdi:battery-70{% elif l >= 40 %}mdi:battery-50{% elif l >= 20 %}mdi:battery-30{% elif l >= 10 %}mdi:battery-20{% else %}mdi:battery-outline{% endif %}{% endif %}",
                  "color": "{% set s = states(e) %}{% if s == 'on' %}red{% elif s == 'off' %}green{% else %}{% set l = s | int(0) %}{% if l < 15 %}red{% elif l < 40 %}orange{% elif l < 60 %}yellow{% else %}green{% endif %}{% endif %}",
                  "state": "{% set s = states(e) %}{% if s == 'on' %}niedrig{% elif s == 'off' %}normal{% else %}{{ s | int }} %{% endif %}",
                  "secondary": "{{ state_attr(e, 'battery_type_and_quantity') or '' }}",
                  "tap_action": {
                    "action": "fire-dom-event",
                    "browser_mod": {
                      "service": "browser_mod.popup",
                      "data": {
                        "title": "{{ state_attr(e, 'friendly_name') }}",
                        "content": {
                          "type": "entities",
                          "entities": [
                            {
                              "type": "custom:template-entity-row",
                              "name": "{% set n = state_attr(e, 'friendly_name') %}{{ n | replace(' Akku fast leer', '') | replace(' Batterie', '') | replace(' Battery', '') | replace(' level', '') | replace('+', '') | trim }}",
                              "entity": "{{ e }}"
                            },
                            {
                              "type": "custom:template-entity-row",
                              "name": "Batterietyp",
                              "icon": "mdi:battery",
                              "state": "{{ state_attr(e, 'battery_type_and_quantity') or 'unbekannt' }}"
                            },
                            {
                              "type": "custom:template-entity-row",
                              "name": "Betriebsspannung",
                              "icon": "mdi:flash",
                              "state": "{% set name = e.split('.')[-1] %}{% set s1 = name.replace('_battery_plus_low', '_betriebsspannung') %}{% set s2 = s1.replace('_battery_plus', '_betriebsspannung') %}{% set spannung_entity = 'sensor.' ~ s2 %}{% if states(spannung_entity) not in ['unknown', 'unavailable', 'none'] %}{{ states(spannung_entity) }} {{ state_attr(spannung_entity, 'unit_of_measurement') or 'V' }}{% else %}unbekannt{% endif %}"
                            }
                          ]
                        }
                      }
                    }
                  }
                }{% if not loop.last %},{% endif %}
              {% endfor %}
            ]
          }
        ]

Wie man sieht, wird hier schon alles mehrfach codiert. Dazu habe ich aber auch einige Karten, die eine einzelne Batterie darstellen. Also sozusagen das gleiche Element, was in den auto-entities verwendet wird.
Dass ich das nicht als decluttering-Template anlegen kann scheitert ausschließlich an dem automatischen Umbruch des Editors.

Und wenn du alles vorher in Variablen aufschlüsselst?

          {% for e in state_attr('sensor.battery_plus_devices', 'entities')[:5] %}
            {% set n = state_attr(e, 'friendly_name')
            | replace(' Akku fast leer', '')
            | replace(' Batterie', '')
            | replace(' Battery', '')
            | replace(' level', '')
            | replace('+', '') | trim %}
            {% set s = states(e) %}
            {% set l = s | int(0) %}
            {% set e = 'sensor.lux_battery' %}
            {% set s = states(e) %}
            {% set l = s | int(0) %}
            {% set icon = 'mdi:battery' + {
              l >= 10: '-20',
              l >= 20: '-30',
              l >= 40: '-50',
              l >= 60: '-70',
              l >= 80: '-90',
              s in ['on', 'off'] or l >= 95: '',
            }.get(true, '-outline') %}
            
            {
              "type": "custom:template-entity-row",
              "entity": "{{ e }}",
              "name": "{{ n }}",
              "icon": "{{ icon }}",
1 „Gefällt mir“

Hallo Kitty,
danke Dir erst mal für den Vorschlag. Ich habe ihn mal in die Karte (nicht das Template) eingesetzt und erhalte einen Fehler. In den Entwicklertools habe ich noch einen kleinen Fehler korrigiert und dann kam dort das gewünschte Ergebnis raus.
Allerdings: Wenn ich diesen Templatecode in die Karte einsetze, erhalte ich “Konfigurationsfehler”. Das hatte ich auch während der Entwicklung und dann stellte sich raus, dass der Code dort nur richtig aufgelöst wird, wenn er in einer einzigen Zeile steht. Mehrzeiligkeit mit Javascript und Jinja geht nicht. Dann wird das Ergebnis als reiner Textstring interpretiert. Das ist ja eigentlich mein Dilemma. Alles funktioniert prima, wenn ich es in eine Zeile schreibe.
Allerdings können im UI-Mode die decluttering templates nur am Anfang des Dashboard-YAMLs stehen und der UI-Editor bricht lange Zeilen dann beim Abspeichern um. Und das geht eben nicht.

Mir ging es um die Templates im Raw-Editor.
Dennoch: merkwürdiges Verhalten.

Ja, versuche einfach mal im RAW-Editor des Desktops eine meiner langen Templatezeilen einzugeben und abzuspeichern. Das wird dann umgebrochen. Schade!!!

Ich meinte, probier einmal, mein Code-Beispiel im Raw-Editor als Template abzuspeichern, um zu testen, ob die Karte dann noch funktioniert, oder ob wieder „Konfigurationsfehler“ dabei rauskommt.

Hab ich gemacht. Leider hat es nicht zum Erfolg geführt. Dein Template ist aber (fast) richtig.
Es funktioniert noch nicht mal, wenn ich den Templatecode direkt in eine einzelne Karte eingebe,

außer, ich schreibe wieder alles in eine einzige Zeile. :grimacing:

Wahnsinn… da fällt mir dann auch nix mehr ein außerhalb YAML.

1 „Gefällt mir“

Kurze Rückmeldung: Folgende Syntax funktioniert:

  name: >
    {% set raw_name = state_attr('[[entity]]', 'friendly_name') or '' %}  {%
    set clean_name = raw_name
         | replace(' Akku fast leer','')
         | replace(' Batterie','')
         | replace(' Battery','')
         | replace(' level','')
         | replace('+','')
         | trim %}
    {{ clean_name }}
Eigentlich hast Du auch nichts anderes gemacht.Danke nochmal!

Sauber, freut mich!

1 „Gefällt mir“