Couleur de badge selon présence

Bonjour
Sur un dashboard, j’ai réussi à modifier la couleur des badge de « person » suivant leur présence.
Cependant, il reste un soucis, lors de l’ouverture de HomeAssistant, les badge ne changent pas de couleur suivant la condition, il faut pour celà que je clique sur les 3 points en haut à gauche, « modifier le tableau de bord », retourner sur les 3 points, « éditeur de configuration », fermer l’éditeur et c’est seulement à ce moment que les badges prennent la couleur liée à la présence.
Le code dans l’éditeur pour faire varier la couleur est :

title: Maison
views:
  - path: default_view
    title: Home
    badges:
      - entity: person.stephane_bec
        card_mod:
          style: |
            :host {
              --label-badge-red:
                {% if is_state('person.stephane_bec', 'home') %}
                #007B48;
                {% elif is_state('person.stephane_bec', 'not_home') %}
                red;
                {% else %}
                gray;
                {% endif %}
            }

Merci pour votre aide
Stéphane

Bonjour,

pour ma part, cela fonctionne sans faire « d’update » …

Voici mon code !

title: Home
views:
  - path: default_view
    title: Home
    badges:
      - entity: person.xxx
        card_mod:
          style: |
            :host {
              --label-badge-red:
                {% if is_state('person.xxx', 'home') %}
                  rgb(41, 49, 128);
                {% elif is_state('person.xxx', 'not_home') %}                      
                  rgb(158, 35, 41); 
                {% endif %}   
            }

Bonne journée

Bonjour
J’ai pourtant bien le même code.

Tu crois pas que l’indentation sur le bon fonctionnement du code ?

L’indentation … :wink:

Et pour répondre à la question, dans ce cas précis ça n’a pas trop d’importance, :host et } sont bien placés. Entre les 2 c’est pas du yaml

J’ai pensé à l’indentation car la ligne décrivant la couleur n’était pas décalée car dans ton code.
J’ai modifié, mais ca n’a pas changé.
Donc comme le précise @Pulpy-Luke , entre :hotst{ et } l’indentation ne semble pas être importante

Tu peux tester le bloc if/elif/else directement dans modèle , coté Outils de développement
La différence que je vois entre vos 2 codes, c’est la présence du else dans un cas, pas dans l’autre… Si tes comparaisons d’états ne sont pas bonnes, ça donnerai toujours du gris.
Mais ça n’explique pas le fait que ça marcherai à la ‹ recréation › de la carte. Le fait que ce ne soit pas à jour, je vois qu’une histoire de cache comme explication. Donc à tester : touches CTRL et F5 en même temps sur la carte pas à jour, voir si ça suffit à forcer le refresh coté navigateur

Attention il y’a actuellement quelques problèmes avec card-mod en cas de rafraichissement tu browser :

https://github.com/thomasloven/lovelace-card-mod/issues/152

https://github.com/thomasloven/lovelace-card-mod/issues/153

Si ta « template » est bonne il se peut que tu sois face à ce problème et donc 2 solutions :

  • Downgrade de card-mod en 3.0.11

ou

  • Comme l’indique le dev du plugin, ajouter ceci à ton configuration.yaml :
frontend:
  extra_module_url:
    - /local/wherever/card-mod.js  ### chemin à adapter selon sa conf

Exemple sur mon instance de test :

  • avant « F5 »

  • après « F5 »

1 « J'aime »

Oui désolé pour la intendance mais j’ai écris trop vite sans réfléchir :joy:

Bizarre car je viens de vérifier et je suis bien en 3.0.13 et je n’ai pas ce problème, les couleurs des badges sont toujours bonne, je n’ai pas besoin de rafraîchir la page ! :man_shrugging:

Je te confirme la « bizarrerie » de la chose, j’ai plusieurs dashboard et tous n’étaient pas affectés par ce bug.

J’ai cherché un moment où j’aurai pu faire une erreur dans mon code, ou si il y’avait besoin de le modifier pour récupérer un comportement « normal ».

Pour au final tomber sur ces « issues » sur le github, j’ai testé les 2 solutions, et les 2 m’ont permis de corriger le problème.

Merci @Herbs pour ton retour
Comment puis connaitre le chemin de extra_module?
Si je fais un lsavec le terminal, je ne vois aucun local?
Merci

C’est dans configuration.yaml que tu dois mettre ça ! Ou alors j’ai pas compris ta question

T’as quoi comme type d’installation déjà ?

container, surpervised, hassos ?

Dans ton dossier config tu dois avoir un sous-dossier « www » ?

Donc le chemin doit ressembler à ça :

/config/www/community/lovelace-card-mod/card-mod.js

et pour que HA interprète correctement il faut renseigner comme ça :

/local/community/lovelace-card-mod/card-mod.js

Au pire fais un :

find / -name card-mod.js

Et donnes le résultat

mon installation est sous HASSOS.
Je trouve bien les différents répertoires que tu décrits.
Merci

Et après les premiers essais, cela fonctionne.
Merci

Bonjour,

J’ai trouvé le moyen de changer la couleur de la bordure du badge via la formule ci-dessous semblable à celle utilisée par Stefane26.

  - entity: switch.virtual_chauffage_chambre_gauche
    name: Chauffage
    style: |
      :host {
        {% if is_state('switch.virtual_chauffage_chambre_gauche','off') %}
         --label-badge-red: blue;
         {% endif %}
      }

Mais je souhaiterais également changer la couleur du fond du badge en fonction d’un autre condition.
Quelqu’un sait-il par quoi remplacer label-badge-red pour réaliser cela ? Je n’ai pas trouvé.

De manière générale, où peut-on trouver la doc concernant les paramètres qu’on pourrait changer dans un badge ?

Je vous remercie d’avance.
Pascal

En naviguant sur ce lien, tu vas pouvoir trouver pas mal d’info et d’exemple :

Les badges ont leur petite rubrique :

Merci pour le lien. Super. Je ne l’avais pas trouvé.